/* Vocabulary uses the same blue, surfaces and type scale as the public tools. */
.vocabulary{padding:28px 32px;color:#233445}
.vocabulary h1,.vocabulary h2,.vocabulary h3{color:#233445}
.vocabulary h2{font-size:21px;font-weight:700}
.vocabulary p{line-height:1.6}
.vocabulary a{color:#247da8}
.vocabulary a:focus-visible,.vocabulary button:focus-visible,.vocabulary input:focus-visible,.vocabulary textarea:focus-visible,.vocabulary select:focus-visible{outline:3px solid rgba(60,154,199,.35);outline-offset:2px}
.vocabulary .btn{border-radius:6px;background-image:none;box-shadow:none;text-shadow:none;font-weight:600;transition:background-color .16s,border-color .16s,color .16s}
.vocabulary .btn:hover,.vocabulary .btn:focus,.vocabulary .btn:active{box-shadow:none;transform:none}
.vocabulary .btn-info,.vocabulary .btn-primary{border-color:#2388b0;background:#2388b0;color:#fff}
.vocabulary .btn-info:hover,.vocabulary .btn-info:focus,.vocabulary .btn-info:active,.vocabulary .btn-primary:hover,.vocabulary .btn-primary:focus{border-color:#176c91;background:#176c91;color:#fff}
.vocabulary .btn-success{border-color:#2b9d68;background:#2b9d68;color:#fff}
.vocabulary .btn-success:hover,.vocabulary .btn-success:focus{border-color:#208454;background:#208454;color:#fff}
.vocabulary .btn-default{border-color:#d7e2e9;background:#fff;color:#345267}
.vocabulary .btn-default:hover,.vocabulary .btn-default:focus,.vocabulary .btn-default.active{border-color:#9cc7d9;background:#eef8fc;color:#176c91}
.vocabulary .btn-link{color:#247da8}
.vocabulary .btn:disabled{cursor:not-allowed;opacity:.55}
.vocabulary .form-control{height:auto;min-height:42px;border-color:#bdcbd4;border-radius:6px;box-shadow:none;color:#233445}
.vocabulary .form-control:focus{border-color:#3c9ac7;box-shadow:0 0 0 3px rgba(60,154,199,.15)}
.vocabulary textarea.form-control{min-height:110px;resize:vertical}
.vocabulary form{margin-bottom:16px}
.vocabulary form label{display:block;margin-bottom:12px;font-weight:600}
.vocabulary form label .form-control{margin-top:7px;font-weight:400}
.vocabulary .alert{border-radius:6px}

.vocab-nav{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 28px;padding:0 0 16px;border-bottom:1px solid #e1e8ef}
.vocab-nav a{display:inline-flex;align-items:center;gap:8px;padding:9px 12px;border-radius:6px;color:#526b7b;font-size:13px;font-weight:600;text-decoration:none}
.vocab-nav a:hover,.vocab-nav a:focus{background:#eef8fc;color:#176c91;text-decoration:none}
.vocab-nav a.is-active{background:#e6f4f9;color:#176c91}
.vocab-nav .fa{font-size:15px;color:#3c9ac7}

.vocab-hero{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(260px,.88fr);align-items:center;gap:30px;padding:34px 38px;border:1px solid #d5e8ef;border-radius:14px;background:linear-gradient(118deg,#e6f6fb 0%,#f7fbfd 56%,#eaf2fb 100%)}
.vocab-eyebrow,.vocab-kicker{color:#19779a;font-size:12px;font-weight:700;letter-spacing:.045em;text-transform:uppercase}
.vocab-eyebrow .fa{margin-right:6px}
.vocab-hero h1{max-width:560px;margin:12px 0 12px;color:#17334a;font-size:36px;font-weight:700;line-height:1.16}
.vocab-hero-copy>p:not(.vocab-hero-note){max-width:560px;margin:0;color:#496271;font-size:16px;line-height:1.65}
.vocab-hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin:24px 0 0}
.vocab-hero-actions .vocab-inline{margin:0}
.vocab-hero-actions .btn{padding:12px 18px}
.vocab-hero-actions .fa{margin-left:7px}
.vocab-text-link{font-weight:700;text-decoration:none}
.vocab-text-link:hover{text-decoration:underline}
.vocab-hero-note{margin:20px 0 0;color:#617b89;font-size:13px}
.vocab-hero-note a{font-weight:600}
.vocab-hero-preview{max-width:390px;width:100%;margin:auto;padding:20px 23px;border:1px solid #d4e6ed;border-radius:13px;background:#fff;box-shadow:0 14px 35px rgba(34,91,117,.12);transform:rotate(1deg)}
.vocab-preview-top{display:flex;align-items:center;gap:8px;padding-bottom:14px;border-bottom:1px solid #e8eff2;color:#213c50;font-size:13px;font-weight:700}
.vocab-preview-icon{display:flex;align-items:center;justify-content:center;width:29px;height:29px;border-radius:7px;background:#e7f6fb;color:#2388b0}
.vocab-preview-dots{display:flex;gap:4px;margin-left:auto}
.vocab-preview-dots i{width:5px;height:5px;border-radius:50%;background:#b4cdd8}
.vocab-preview-caption{margin-top:19px;color:#78909c;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.vocab-preview-word{margin-top:6px;color:#17334a;font-size:30px;font-weight:700}
.vocab-preview-hint{margin:2px 0 15px;color:#71808c;font-size:12px}
.vocab-preview-answer{padding:12px 14px;border:1px solid #a7dcc0;border-radius:7px;background:#effaf3;color:#267950;font-weight:700}
.vocab-preview-answer .fa{margin-right:7px}
.vocab-preview-foot{display:flex;justify-content:space-between;gap:4px;margin-top:19px;color:#8ba0ab;font-size:10px;font-weight:600}

.vocab-section{margin-top:36px}
.vocab-section-heading{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:16px}
.vocab-section-heading h2{margin:5px 0 0;font-size:23px}
.vocab-section-heading>a{font-size:13px;font-weight:700;text-decoration:none}
.vocab-section-heading>a:hover{text-decoration:underline}
.vocab-section-heading>a .fa{margin-left:4px}
.vocab-stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:20px 0 26px}
.vocab-stats>div{min-width:0;padding:18px;border:1px solid #dce5eb;border-radius:8px;background:#fff;box-shadow:0 2px 8px rgba(35,52,69,.04)}
.vocab-stats>div>.fa{display:block;margin-bottom:10px;color:#3c9ac7;font-size:19px}
.vocab-stats strong{display:block;color:#17334a;font-size:27px;line-height:1.1}
.vocab-stats span{display:block;margin-top:5px;color:#71808c;font-size:12px}
.vocab-stats .vocab-stat-due{border-color:#b9dce8;background:#eef8fc}
.vocab-feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.vocab-feature{display:flex;min-width:0;min-height:215px;flex-direction:column;padding:22px;border:1px solid #dce5eb;border-radius:8px;background:#fff;box-shadow:0 2px 8px rgba(35,52,69,.05);color:#233445!important;text-decoration:none!important;transition:border-color .15s,box-shadow .15s,transform .15s}
.vocab-feature:hover{border-color:#3c9ac7;box-shadow:0 7px 20px rgba(35,52,69,.12);transform:translateY(-2px)}
.vocab-feature-icon{display:flex;align-items:center;justify-content:center;width:39px;height:39px;margin-bottom:16px;border-radius:9px;background:#e7f6fb;color:#2388b0;font-size:19px}
.vocab-feature strong{font-size:17px}
.vocab-feature>span:not(.vocab-feature-icon){margin-top:8px;color:#5d6b78;line-height:1.5}
.vocab-feature em{margin-top:auto;padding-top:18px;color:#247da8;font-size:13px;font-style:normal;font-weight:700}
.vocab-feature em .fa{margin-left:4px}

.vocab-page-head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:22px}
.vocab-page-head h1{margin:4px 0 0}
.vocab-page-head p{margin:7px 0 0;color:#607584}
.vocab-page-head .btn{flex:0 0 auto}
.vocab-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:20px 0 24px}
.vocab-card{display:flex;min-width:0;flex-direction:column;padding:20px;border:1px solid #dce5eb;border-radius:8px;background:#fff;box-shadow:0 2px 8px rgba(35,52,69,.05)}
.vocab-card-icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;margin-bottom:15px;border-radius:9px;background:#e7f6fb;color:#2388b0;font-size:19px}
.vocab-card h2{margin:0 0 8px;font-size:19px;line-height:1.3}
.vocab-card p{margin:0 0 17px;color:#71808c;font-size:13px}
.vocab-card-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:auto}
.vocab-card-actions form,.vocab-card-actions .vocab-inline{margin:0}
.vocab-card-actions .btn{font-size:13px}
.vocab-inline{display:inline-block;margin:0 8px 0 0}
.vocab-actions{display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin:18px 0 25px}
.vocab-actions form{margin:0}
.vocab-search{max-width:570px;margin:0 0 23px!important}
.vocab-search label{margin-bottom:8px!important}
.vocab-search .input-group .form-control{margin:0}
.vocab-search .input-group .btn{min-height:42px}
.vocab-two{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.vocab-two .form-control{margin:0}
.vocab-panel{margin:25px 0;padding:23px;border:1px solid #dce5eb;border-radius:8px;background:#f8fbfc}
.vocab-panel h2{margin-top:0}
.vocab-panel form:last-child{margin-bottom:0}
.vocab-panel>form>.form-control{margin-bottom:12px}
.vocab-table{margin-top:20px}
.vocabulary .table{margin:0}
.vocabulary .table>thead>tr>th{padding:12px;border-bottom:1px solid #dce5eb;background:#f7fafc;color:#607584;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.vocabulary .table>tbody>tr>td{padding:12px;border-color:#edf2f5;vertical-align:middle}
.vocabulary .table>tbody>tr:hover{background:#f8fbfd}
.vocabulary .table small{display:block;color:#8a9aa5}
.vocabulary td form{margin:0}
.vocab-pill{display:inline-flex;align-items:center;padding:4px 9px;border-radius:20px;background:#eef8fc;color:#176c91;font-size:12px;font-weight:700}
.vocab-empty{padding:24px;border:1px dashed #bfd1dc;border-radius:8px;background:#f8fbfc;color:#607584;text-align:center}
.vocab-filter{display:flex;flex-wrap:wrap;gap:7px;margin:19px 0}
.vocab-filter .btn{border-radius:20px}
.vocab-pagination{display:flex;flex-wrap:wrap;gap:6px;margin-top:18px}
.vocab-pagination .btn.active{border-color:#2388b0;background:#2388b0;color:#fff}

.vocab-training-card{max-width:680px;margin:0 auto;padding:26px 30px;border:1px solid #dce5eb;border-radius:10px;background:#fff;box-shadow:0 3px 14px rgba(35,52,69,.06);text-align:center}
.vocab-training-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:15px;color:#71808c;font-size:13px}
.vocab-training-head strong{color:#233445}
.vocabulary .progress{height:8px;margin:0 0 24px;border-radius:20px;background:#e8f0f4;box-shadow:none}
.vocabulary .progress-bar{border-radius:20px;background:#3c9ac7;box-shadow:none}
.vocab-prompt{margin:22px 0 14px;color:#17334a;font-size:36px;font-weight:700;line-height:1.25;overflow-wrap:anywhere}
.vocab-question-label{margin:0 0 20px;color:#71808c;font-size:14px}
.vocab-choices{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:20px auto}
.vocab-choices .btn{min-height:58px;padding:12px;white-space:normal;text-align:left;font-size:16px}
.vocab-choices .btn:hover{border-color:#3c9ac7}
.vocab-choices .btn.is-correct{border-color:#72c79a;background:#effaf3;color:#267950}
.vocab-choices .btn.is-wrong{border-color:#e4aaa4;background:#fff3f1;color:#a64338}
.vocab-answer-form{display:flex;gap:9px;max-width:520px;margin:22px auto 0!important}
.vocab-answer-form .form-control{flex:1;min-width:0}
.vocab-answer-form .btn{flex:0 0 auto}
.vocab-built{min-height:54px;margin:18px 0;border-bottom:2px solid #9bb7c5;color:#17334a;font-size:28px;letter-spacing:.12em;overflow-wrap:anywhere}
.vocab-letters{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:18px 0}
.vocab-letters .btn{min-width:49px;min-height:49px;font-size:18px}
.vocab-build-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin:18px 0}
.vocab-sound{margin:3px auto 20px}
#vocab-message{min-height:27px;margin:20px 0 10px;font-size:16px;font-weight:700}
#vocab-message.is-correct{color:#267950}
#vocab-message.is-wrong{color:#a64338}
#vocab-message.is-error{color:#a64338}
#vocab-next{min-width:180px}
#vocab-next[hidden]{display:none}
.vocab-result-lead{color:#607584;font-size:16px}
.vocab-error-list{margin:15px 0 20px;padding:0;list-style:none}
.vocab-error-list li{display:flex;justify-content:space-between;gap:12px;padding:11px 14px;border-bottom:1px solid #e5edf1}

@media(max-width:991px){.vocab-hero{grid-template-columns:1fr}.vocab-hero-preview{max-width:450px;margin:0}.vocab-stats{grid-template-columns:repeat(3,minmax(0,1fr))}.vocab-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.vocabulary{padding:18px}.vocab-nav{flex-wrap:nowrap;overflow-x:auto;padding-bottom:12px;margin-bottom:20px;scrollbar-width:thin}.vocab-nav a{flex:0 0 auto}.vocab-hero{gap:22px;padding:24px 20px}.vocab-hero h1{font-size:29px}.vocab-hero-preview{display:none}.vocab-feature-grid,.vocab-grid{grid-template-columns:1fr}.vocab-feature{min-height:0}.vocab-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.vocab-page-head{display:block}.vocab-page-head .btn{margin-top:12px}.vocab-two,.vocab-choices{grid-template-columns:1fr}.vocab-training-card{padding:20px 16px}.vocab-prompt{font-size:29px}.vocab-answer-form{display:block}.vocab-answer-form .btn{width:100%;margin-top:9px}.vocab-stats>div{padding:14px}}
@media(max-width:420px){.vocab-hero-actions{align-items:stretch}.vocab-hero-actions .btn{width:100%}.vocab-stats strong{font-size:23px}.vocab-section-heading{align-items:start;flex-direction:column}}
