/* English with Mariami — PREMIUM LEARNING design system.
 * Pure CSS, system fonts, zero network calls, no heavy loops or animation libraries.
 * Keeps the original Study Pro and lesson controls functional. */
:root{--pr-bg:#071223;--pr-surface:#10233c;--pr-panel:#112942;--pr-line:#2b5167;--pr-text:#f1fafb;--pr-muted:#b9d4dc;--pr-mint:#6ce7c5;--pr-turquoise:#6eddea;--pr-gold:#f3d59d;--pr-violet:#aeabf9;color-scheme:dark}
body{background:radial-gradient(ellipse 950px 400px at 85% -120px,#184a60 0%,transparent 68%),linear-gradient(170deg,#0c2636,#071726 52%,#081928);color:var(--pr-text);font-size:15px}
.header{background:#071724ed;border-bottom:1px solid #32586b;position:relative}
.header-inner,.shell{max-width:1280px}.header-inner{padding:18px 22px}.brand{font-size:19px;letter-spacing:-.45px}.brand-icon{display:inline-grid;place-items:center;width:37px;height:37px;border:1px solid #508c8d;border-radius:12px;color:#b3ffe8;background:#153b47;font-size:25px}.brand small{color:#a1eadb}.back{border:1px solid #456978;background:#123147;padding:9px 13px;border-radius:11px}
.shell{padding:22px 21px 48px}.welcome{padding:35px 6px 12px;position:relative}.welcome>.eyebrow{display:inline-block;color:#b1ffe9;background:#153b47;border:1px solid #396f73;padding:8px 11px;border-radius:999px;font-size:11px;letter-spacing:1.2px}
.welcome h1{font-weight:830;font-size:clamp(34px,5.5vw,67px);line-height:1.08;letter-spacing:-1.7px;margin:18px 0 13px}.welcome h1 span{color:var(--pr-mint)}.welcome>p{max-width:820px;font-size:15px;color:#cbdfe6;line-height:1.8}
.stats{max-width:100%;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin:27px 0 13px}.stats>div{border:1px solid #315568;background:linear-gradient(135deg,#142e41,#102438);padding:16px 19px;border-radius:17px}.stats b{color:#99f1db;font-size:clamp(25px,3vw,37px);letter-spacing:-.6px}.stats small{color:#bed3dd;font-size:12px}.caution{margin:17px 0 0;border-left:3px solid #aeb58b;background:#122c3d;color:#bcced5;font-size:11px}
.premium-navigation{display:flex;gap:7px;flex-wrap:wrap;margin:12px 0 16px}.premium-navigation a{display:inline-block;padding:10px 14px;border-radius:999px;border:1px solid #3e6675;background:#102b3d;text-decoration:none;font-size:12px;color:#deecf0;font-weight:700}.premium-navigation a:hover{border-color:var(--pr-mint);background:#19465a}
.toolbar{padding:16px 17px;border:1px solid #355a6a;border-radius:17px;background:#112a3d;align-items:center;margin:14px 0 19px}.toolbar label{color:#c7e1e6}.toolbar select,.toolbar input,.answer-row input,textarea{background:#081f32;border-color:#426c7e;color:#f8ffff}.toolbar .results{color:#aadad9}
.pro-hub{margin:12px 0 22px;border-radius:24px;padding:24px;background:linear-gradient(145deg,#112d42,#0a2335 65%,#0e2838);border:1px solid #426676;box-shadow:0 14px 45px #01091631}.pro-heading h2{font-size:clamp(24px,3vw,35px);letter-spacing:-.8px;color:#f7fcfc}.pro-heading p{font-size:13px;color:#c2d7dc;max-width:790px}
#ewm-progress{margin:15px 0 20px;--pg-muted:#c4d8db;--pg-text:#f3fbfa}
#ewm-progress .pg-hero{border:1px solid #3f777e;border-radius:22px;background:radial-gradient(circle at 93% 10%,#285d66 0%,transparent 42%),linear-gradient(114deg,#164a58,#112c47 68%,#1b3855);padding:24px 26px;min-height:176px}
#ewm-progress .pg-kicker{color:#b2f5d5;font-size:10px;letter-spacing:1.5px}
#ewm-progress .pg-hero h3{font-size:clamp(24px,3.2vw,37px);letter-spacing:-1px;margin-top:12px}
#ewm-progress .pg-hero p{font-size:13px;max-width:510px}
#ewm-progress .pg-ring{width:130px;height:130px;padding:10px;background:conic-gradient(#85eccb calc(var(--pct)*1%),#345469 0);box-shadow:0 0 0 5px #ffffff08}
#ewm-progress .pg-ring-core{background:#173849}#ewm-progress .pg-ring-core strong{font-size:31px;color:#ecfff6}#ewm-progress .pg-ring-core small{font-size:11px;color:#c3e2e1}
#ewm-progress .pg-mini-stats{gap:12px}#ewm-progress .pg-mini-stats span{font-size:13px}#ewm-progress .pg-mini-stats b{color:#baf8dc}
#ewm-progress .pg-grid{gap:12px;margin:14px 0}#ewm-progress .pg-metric{border-radius:17px;padding:19px 20px;background:linear-gradient(145deg,#13324a,#0d293c);border:1px solid #315d70;min-height:145px}
#ewm-progress .pg-metric-head strong{font-size:14px}#ewm-progress .pg-metric-head b{font-size:21px;color:#a6f9df}#ewm-progress .pg-metric p{font-size:12px}
#ewm-progress progress,.pg-session-box progress,.pg-topic-meter progress,.pg-lesson-meter progress{height:9px;background:#385669}#ewm-progress progress::-webkit-progress-value,.pg-session-box progress::-webkit-progress-value,.pg-topic-meter progress::-webkit-progress-value,.pg-lesson-meter progress::-webkit-progress-value{background:linear-gradient(90deg,#5bdab8,#a3f1b6)}
#ewm-progress .pg-bottom{margin-top:14px;gap:13px}#ewm-progress .pg-panel{border:1px solid #365e70;background:#112c3e;border-radius:17px;padding:18px 20px}#ewm-progress .pg-award{border-radius:9px;background:#1b4b48;border:1px solid #458b7a}#ewm-progress .pg-award[aria-disabled=true]{background:#233747;border-color:#526c79}
#ewm-progress .pg-foot{color:#a6c0c9;line-height:1.7}
.premium-goal-row{display:flex!important;align-items:center;justify-content:space-between;gap:8px;font-size:11px!important;margin-top:10px!important;color:#c9e6e5!important;font-weight:650!important}.premium-goal-row select{width:auto;max-width:none;min-height:34px;padding:5px 8px;font-size:11px;background:#153749;border:1px solid #4b7e88;border-radius:9px;color:white}
.premium-eyebrow-row{display:flex;justify-content:space-between;gap:10px;margin:26px 1px 10px;color:#a4cad5;font-size:10px;letter-spacing:1.5px;font-weight:850}.premium-eyebrow-row #premium-grade-label{color:#b3ecd8;letter-spacing:.2px}
.premium-focus{display:grid;grid-template-columns:50px minmax(0,1fr) auto;gap:20px;align-items:center;border-radius:20px;border:1px solid #4b8079;background:linear-gradient(110deg,#123f43,#173d4b 54%,#213c50);padding:23px 24px}
.premium-focus-icon{display:grid;place-items:center;width:47px;height:47px;border-radius:14px;background:#ffffff15;border:1px solid #a4ddcd76;color:#c6fae2;font-size:25px}.premium-small-label{display:block;color:#93d8c5;font-size:10px;letter-spacing:1.5px;font-weight:850}.premium-focus h4{margin:7px 0 6px;font-size:clamp(18px,2vw,24px);line-height:1.3}.premium-focus p{margin:0 0 11px;color:#c4dcdc;font-size:12px;line-height:1.7;max-width:570px}.premium-focus-actions{display:flex;gap:9px;flex-wrap:wrap}.premium-focus-actions button{padding:9px 13px;min-height:38px;font-size:12px;border-radius:11px}.premium-focus .premium-cta{background:#b2f6d7;border-color:#b2f6d7;color:#0b3040;font-weight:850}.premium-focus .premium-cta:hover{background:#d3ffe9}.premium-focus .premium-ghost{background:#224e57;border-color:#4b8385;color:#eaf9f6}
.premium-focus-count{min-width:104px;display:grid;justify-items:center;border:1px solid #8cd5c850;padding:17px 15px;border-radius:17px;background:#103d4485}.premium-focus-count strong{font-size:clamp(28px,3vw,42px);font-variant-numeric:tabular-nums;line-height:1.1;color:#c5ffe4}.premium-focus-count span{font-size:11px;color:#bbe4dd;margin-top:7px;text-align:center}
.premium-signal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;margin:14px 0}
.premium-signal{background:linear-gradient(145deg,#122e43,#10283b);border:1px solid #31586e;border-radius:18px;padding:21px;min-width:0}
.premium-card-header{display:flex;justify-content:space-between;align-items:center;gap:10px}.premium-card-header h4,.premium-roadmap-head h4{font-size:19px;letter-spacing:-.4px;margin:6px 0 0}.premium-subtle-pill{font-size:11px;border-radius:999px;padding:7px 10px;background:#1c4451;border:1px solid #436e7a;color:#d2eae9;white-space:nowrap}
.premium-week-chart{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px;min-height:158px;align-items:end;margin-top:19px}
.premium-week-day{display:flex;flex-direction:column;align-items:center;gap:5px;min-width:0}.premium-week-count{font-variant-numeric:tabular-nums;font-size:10px;font-weight:800;color:#c5f7e2;line-height:1.2}.premium-week-track{height:94px;width:100%;max-width:36px;border-radius:8px;background:#2c4a5d;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden}.premium-week-fill{width:100%;min-height:0;border-radius:8px 8px 0 0;background:linear-gradient(180deg,#a3efd1,#58bebe)}.premium-week-day.is-today .premium-week-track{outline:1px solid #f1d4a4;outline-offset:2px}.premium-week-day.is-today .premium-week-label{color:#f8dfac}.premium-week-label{font-size:11px;color:#adc7d0;font-weight:750;white-space:nowrap}.premium-card-note{font-size:11px;line-height:1.55;color:#adc6cd;margin:15px 0 0}
.premium-memory-meter{display:flex;overflow:hidden;border-radius:999px;height:20px;width:100%;margin:30px 0 19px;background:#28455a;gap:0}.premium-memory-part{height:100%;display:block;width:0;min-width:0}.premium-strong{background:#69e0b0}.premium-learning{background:#78bdeb}.premium-hard{background:#ebbd81}.premium-unseen{background:#345669}
.premium-memory-legend{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px 10px}.premium-memory-legend span{display:flex;gap:7px;align-items:center;color:#d0e4e8;font-size:11px}.premium-memory-legend b{margin-left:auto;font-size:12px;color:#fff;font-variant-numeric:tabular-nums}.premium-dot{display:inline-block;width:9px;height:9px;flex:0 0 9px;border-radius:50%}.premium-dot-strong{background:#69e0b0}.premium-dot-learning{background:#78bdeb}.premium-dot-hard{background:#ebbd81}.premium-dot-unseen{background:#52748b}
.premium-roadmap{border:1px solid #365e70;background:#112b3e;border-radius:18px;padding:20px;margin:13px 0}.premium-roadmap-head{display:flex;justify-content:space-between;gap:12px;align-items:center}.premium-roadmap-tip{font-size:11px;color:#a9cbd0}.premium-roadmap-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:17px}.premium-step{display:flex;align-items:center;gap:11px;min-width:0;padding:13px 12px;background:#0b2537;border:1px solid #385d6b;border-radius:13px}.premium-step-icon{flex-shrink:0;font-weight:900;color:#b4eee1;font-size:13px}.premium-step>div{min-width:0;flex:1}.premium-step strong{display:block;font-size:12px}.premium-step small{display:block;margin-top:4px;color:#abc5d0;font-size:10px;line-height:1.35}.premium-step button{flex-shrink:0;padding:7px 8px;min-height:32px;font-size:10px;border-radius:8px;background:#1d4557;border:1px solid #4f7480}
.pro-stats>div{background:#0d2d40;border:1px solid #31566c;border-radius:14px}.pro-stats strong{color:#93efd6}.pro-hub select{background:#0b3042;border:1px solid #47798a}.pro-tools button{border-radius:11px}.pro-practice{background:#0e2b3e;border-radius:18px;border:1px solid #4b8786}.pro-flash{background:linear-gradient(120deg,#154051,#102b42);border-radius:17px;min-height:160px}
.sidebar,.lesson{border-radius:19px;border:1px solid #365c70;background:#0c283b}.topic-item{background:#112f41;border-color:#335f74;border-radius:10px}.topic-item[aria-current=true]{background:#174c59;border-color:#6cd9ce}.lesson{padding:25px}.word-card{border-radius:13px;background:#123144;border-color:#335b70}.word-card b{color:#a1e9f6}.practice{background:#0f3043;border-radius:15px}.section{border-top-color:#36576a}.examples{background:#103a49}
button{transition:background-color .14s ease,border-color .14s ease}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #f9dca2;outline-offset:3px}
@media(max-width:970px){.premium-roadmap-steps{grid-template-columns:1fr}.premium-step{gap:13px}.premium-step strong{font-size:13px}.premium-step small{font-size:11px}}
@media(max-width:800px){.shell{padding:15px 13px 30px}.welcome{padding-top:22px}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.pro-hub{padding:15px;border-radius:18px}#ewm-progress .pg-hero{padding:17px}#ewm-progress .pg-ring{width:112px;height:112px}.premium-signal-grid{grid-template-columns:1fr}.premium-focus{grid-template-columns:40px minmax(0,1fr);gap:13px;padding:18px}.premium-focus-count{grid-column:1/-1;justify-items:start;display:flex;align-items:baseline;gap:9px;min-width:0;padding:10px 15px}.premium-focus-count strong{font-size:25px}.premium-focus-count span{margin:0}}
@media(max-width:490px){.stats{gap:7px}.stats>div{padding:11px 12px}.stats b{font-size:25px}.welcome h1{font-size:36px}#ewm-progress .pg-grid{grid-template-columns:1fr}.premium-eyebrow-row{font-size:9px}.premium-signal{padding:16px}.premium-roadmap{padding:16px}.premium-roadmap-head{display:block}.premium-roadmap-tip{display:block;margin-top:8px}.premium-memory-legend{gap:12px}.premium-week-chart{gap:5px}.premium-focus-icon{width:40px;height:40px}.premium-focus-content h4{font-size:19px}.premium-navigation a{font-size:11px}.lesson{padding:14px}}
@media(prefers-reduced-motion:reduce){button{transition:none!important}}