:root{
  --navy:#132a44;--navy2:#1c3d62;--teal:#0b7a75;--gold:#c49536;--red:#b74444;
  --bg:#f4f7fb;--card:#fff;--text:#17212b;--muted:#697786;--line:#dbe3ec;
  --green:#1f8a5b;--orange:#d78422;--shadow:0 12px 32px rgba(20,42,68,.10)
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans Sinhala","Noto Sans JP",Arial,sans-serif;line-height:1.55}a{color:var(--teal);text-decoration:none}a:hover{text-decoration:underline}.topbar{min-height:68px;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:10px max(18px,calc((100vw - 1180px)/2));position:sticky;top:0;z-index:20;box-shadow:0 3px 12px rgba(0,0,0,.18)}.brand{color:#fff;display:flex;gap:10px;align-items:center;font-weight:800}.brand:hover{text-decoration:none}.brand-mark{background:var(--gold);color:var(--navy);border-radius:8px;padding:5px 8px;font-size:.85rem}.topbar nav{display:flex;gap:18px;align-items:center}.topbar nav a{color:#e9f0f7;font-weight:600;font-size:.94rem}.container{width:min(1180px,calc(100% - 28px));margin:32px auto 70px}.footer{text-align:center;color:var(--muted);padding:28px 16px;border-top:1px solid var(--line)}h1,h2,h3{line-height:1.2;margin-top:0}h1{font-size:clamp(2rem,4vw,3.3rem)}h2{font-size:1.4rem}.eyebrow{display:inline-block;color:var(--teal);font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;font-weight:800;margin-bottom:8px}.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:24px;box-shadow:var(--shadow)}.narrow{max-width:580px;margin:45px auto}.hero{background:linear-gradient(135deg,var(--navy),var(--navy2));color:#fff;border-radius:24px;padding:clamp(28px,6vw,70px);display:grid;grid-template-columns:1.6fr .7fr;gap:50px;align-items:center;box-shadow:var(--shadow)}.hero .eyebrow{color:#8ce0d7}.hero p{color:#d8e5f2;font-size:1.08rem;max-width:680px}.hero-stat{display:grid;grid-template-columns:80px 1fr;gap:12px;align-items:center;background:rgba(255,255,255,.08);padding:24px;border-radius:18px}.hero-stat strong{font-size:2rem;color:#ffd882;text-align:right}.hero-stat span{color:#fff}.actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.btn{appearance:none;border:0;border-radius:10px;padding:11px 18px;font-weight:800;cursor:pointer;display:inline-flex;justify-content:center;align-items:center;font-size:.94rem}.btn:hover{text-decoration:none;filter:brightness(.97)}.btn.primary{background:var(--teal);color:#fff}.btn.secondary{background:#e8eef5;color:var(--navy)}.btn.warning{background:var(--gold);color:var(--navy)}.btn.danger{background:var(--red);color:#fff}.btn.full{width:100%}.feature-grid,.paper-grid,.stat-grid{display:grid;gap:18px;margin-top:22px}.feature-grid{grid-template-columns:repeat(3,1fr)}.paper-grid{grid-template-columns:repeat(3,1fr)}.paper-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px;box-shadow:var(--shadow)}.paper-no{font-size:.8rem;font-weight:900;color:var(--teal);letter-spacing:.1em}.paper-card h2{margin:7px 0}.paper-card p{color:var(--muted)}.paper-meta{display:flex;justify-content:space-between;color:var(--muted);font-size:.86rem;margin:18px 0}.dashboard-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:24px}.dashboard-head h1{margin-bottom:5px}.dashboard-head p{margin:0;color:var(--muted)}.form-grid{display:grid;gap:16px}.form-grid label{font-weight:700;display:grid;gap:7px}.form-grid input,.form-grid select{width:100%;padding:12px 13px;border:1px solid #cbd6e2;border-radius:10px;font-size:1rem;background:#fff}.form-grid input:focus{outline:3px solid rgba(11,122,117,.14);border-color:var(--teal)}.muted{color:var(--muted)}.alert{padding:13px 16px;border-radius:11px;margin:0 0 18px;font-weight:650}.alert.success{background:#e6f6ef;color:#176c48}.alert.error{background:#fdeaea;color:#9d2929}.alert.warning{background:#fff4db;color:#815600}.steps{padding-left:24px}.steps li{margin-bottom:10px}code{background:#edf2f6;padding:2px 6px;border-radius:5px}.exam-shell{display:grid;grid-template-columns:260px 1fr;gap:24px;align-items:start}.exam-sidebar{position:sticky;top:90px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--shadow)}.timer-box{background:var(--navy);color:#fff;border-radius:12px;padding:15px;text-align:center}.timer-box small{display:block;color:#bcd0e4}.timer-box strong{display:block;font-size:2.15rem;letter-spacing:.04em}.timer-box strong.urgent{color:#ffb1a8}.progress-text{text-align:center;color:var(--muted);margin:13px 0}.navigator{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin:15px 0}.navigator button{border:1px solid #ccd7e3;background:#f4f7fa;border-radius:7px;height:34px;cursor:pointer;font-weight:700}.navigator button.answered{background:#d9f2e8;border-color:#72c5a6}.navigator button.review{box-shadow:inset 0 0 0 2px var(--gold)}.navigator button.current{background:var(--navy);color:#fff}.exam-main{min-width:0}.exam-title{display:flex;justify-content:space-between;align-items:start;margin-bottom:15px}.exam-title h1{font-size:2rem}.save-state{background:#e4f5ee;color:#176c48;padding:6px 10px;border-radius:99px;font-size:.8rem;font-weight:800}.save-state.saving{background:#fff4db;color:#815600}.save-state.error{background:#fdeaea;color:#9d2929}.question-card{display:none;background:#fff;border:1px solid var(--line);border-radius:18px;padding:clamp(20px,4vw,36px);box-shadow:var(--shadow)}.question-card.active{display:block}.question-top{display:flex;justify-content:space-between;color:var(--muted);font-size:.85rem;font-weight:750;margin-bottom:16px}.question-card h2{font-size:clamp(1.25rem,2.4vw,1.75rem);font-family:"Noto Sans JP",sans-serif;line-height:1.55}.options{display:grid;gap:12px;margin:24px 0}.option{display:grid;grid-template-columns:38px 1fr;gap:12px;align-items:center;border:2px solid #dce5ed;border-radius:12px;padding:14px;cursor:pointer;font-family:"Noto Sans JP",sans-serif}.option:hover{border-color:#98b2c8;background:#f7fafc}.option:has(input:checked){border-color:var(--teal);background:#eaf7f5}.option input{position:absolute;opacity:0}.option-letter{display:flex;width:32px;height:32px;border-radius:50%;align-items:center;justify-content:center;background:#e7edf3;font-weight:900}.option:has(input:checked) .option-letter{background:var(--teal);color:#fff}.review-check{display:flex;gap:9px;align-items:center;font-weight:700;color:#7b5716}.question-actions{display:flex;justify-content:space-between;margin-top:28px}.modal{position:fixed;inset:0;background:rgba(6,18,31,.66);z-index:50;display:flex;align-items:center;justify-content:center;padding:18px}.modal[hidden]{display:none}.modal-card{background:#fff;border-radius:18px;padding:28px;max-width:520px;width:100%;box-shadow:0 25px 80px rgba(0,0,0,.3)}.result-hero{border-radius:22px;padding:34px;color:#fff;display:grid;grid-template-columns:1fr 1.7fr;gap:30px;align-items:center}.result-hero.pass{background:linear-gradient(135deg,#176c48,#229369)}.result-hero.retry{background:linear-gradient(135deg,#8d3a31,#bd5a4d)}.result-hero h1{font-size:4rem;margin:4px 0}.result-hero .eyebrow{color:#fff}.result-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.result-stats div{background:rgba(255,255,255,.13);border-radius:13px;padding:18px;text-align:center}.result-stats strong{font-size:1.6rem;display:block}.result-stats span{font-size:.8rem;color:#e6f4ee}.result-actions{margin:18px 0 32px}.review-list>h2{margin-bottom:18px}.review-card{background:#fff;border-left:6px solid var(--line);border-radius:14px;padding:22px;margin-bottom:16px;box-shadow:0 8px 22px rgba(20,42,68,.06)}.review-card.correct{border-left-color:var(--green)}.review-card.incorrect{border-left-color:var(--red)}.review-card h3{font-family:"Noto Sans JP",sans-serif;line-height:1.55}.review-option{border:1px solid var(--line);padding:10px 12px;border-radius:9px;margin:7px 0;display:flex;gap:8px;align-items:center}.review-option.correct-option{background:#e4f5ec;border-color:#77c6a6}.review-option.wrong-option{background:#fdeaea;border-color:#df9999}.review-option span{margin-left:auto;color:#176c48;font-weight:900}.review-option em{margin-left:auto;color:var(--muted);font-size:.8rem}.explanation{background:#fff7df;border:1px solid #ead39c;border-radius:10px;padding:13px;margin-top:13px}.unanswered-note{color:var(--red);font-weight:700;margin-top:9px}.table-wrap{overflow:auto}.data-table{width:100%;border-collapse:collapse;min-width:720px}.data-table th,.data-table td{text-align:left;padding:12px;border-bottom:1px solid var(--line);font-size:.91rem}.data-table th{background:#f0f4f8;color:#4f6070}.status{padding:4px 8px;border-radius:99px;font-size:.76rem;font-weight:800}.status.submitted{background:#e4f5ec;color:#176c48}.status.in_progress{background:#fff4db;color:#815600}.stat-grid{grid-template-columns:repeat(4,1fr)}.stat-card{background:#fff;border:1px solid var(--line);padding:22px;border-radius:16px;box-shadow:var(--shadow)}.stat-card strong{display:block;font-size:2.1rem;color:var(--navy)}.stat-card span{color:var(--muted)}
@media(max-width:900px){.hero{grid-template-columns:1fr}.feature-grid,.paper-grid{grid-template-columns:repeat(2,1fr)}.exam-shell{grid-template-columns:1fr}.exam-sidebar{position:relative;top:0;order:2}.exam-main{order:1}.result-hero{grid-template-columns:1fr}.stat-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.topbar{align-items:flex-start;gap:8px}.brand span:last-child{display:none}.topbar nav{gap:10px;flex-wrap:wrap;justify-content:flex-end}.container{width:min(100% - 18px,1180px);margin-top:18px}.feature-grid,.paper-grid,.stat-grid{grid-template-columns:1fr}.dashboard-head{align-items:start;flex-direction:column}.navigator{grid-template-columns:repeat(9,1fr)}.result-stats{grid-template-columns:repeat(2,1fr)}.question-card{padding:18px}.question-actions .btn{padding:10px 13px}}

/* Multilanguage selector */
.topbar-right{display:flex;align-items:center;gap:18px}.language-control{display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.11);padding:5px 8px;border-radius:9px}.language-control select{appearance:auto;border:0;background:transparent;color:#fff;font-weight:750;font-size:.88rem;cursor:pointer;outline:none}.language-control select option{color:#17212b;background:#fff}.language-control span{font-size:.9rem}.topbar-right nav{display:flex;gap:18px;align-items:center}
@media(max-width:760px){.topbar{flex-wrap:wrap}.topbar-right{margin-left:auto;gap:8px;flex-wrap:wrap;justify-content:flex-end}.language-control select{max-width:92px}.topbar-right nav{gap:10px;flex-wrap:wrap;justify-content:flex-end}}
@media(max-width:480px){.topbar-right{width:100%;justify-content:space-between}.topbar-right nav{flex:1}.language-control{padding:4px 6px}}

/* Progress analytics v1.2.0 */
.analytics-intro{display:flex;justify-content:space-between;align-items:flex-end;gap:22px;margin-bottom:24px}.analytics-intro h1{margin-bottom:6px}.analytics-intro p{max-width:760px;color:var(--muted);margin:0}.analytics-stat-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin:20px 0}.metric-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--shadow);min-width:0}.metric-card span{display:block;color:var(--muted);font-size:.83rem;font-weight:750}.metric-card strong{display:block;color:var(--navy);font-size:1.75rem;margin:6px 0}.metric-card small{color:var(--muted);font-size:.76rem;line-height:1.35}.metric-card small.positive{color:var(--green)}.metric-card small.negative{color:var(--red)}
.analytics-layout{display:grid;grid-template-columns:1.45fr .85fr;gap:18px;margin:18px 0}.analytics-layout .wide{min-width:0}.card-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:15px;margin-bottom:15px}.card-heading h2{margin-bottom:0}.legend-pass{font-size:.78rem;color:var(--green);font-weight:800;background:#e4f5ec;border-radius:99px;padding:5px 9px}.svg-chart-wrap{overflow-x:auto}.trend-chart{width:100%;min-width:630px;height:auto}.grid-line{stroke:#dce4eb;stroke-width:1}.grid-line.pass-line{stroke:#54a47b;stroke-width:2;stroke-dasharray:7 6}.axis-label{fill:#697989;font-size:12px}.trend-line{fill:none;stroke:#0b7a75;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}.trend-point{stroke:#fff;stroke-width:3}.trend-point.good{fill:#1e8a5a}.trend-point.mid{fill:#d99822}.trend-point.low{fill:#bd5148}
.conclusion-card{border-top:5px solid var(--teal)}.conclusion-card h2{font-size:1.55rem}.conclusion-row{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}.conclusion-row span{color:var(--muted)}.insight{padding:12px;border-radius:10px;margin-top:12px;font-size:.9rem}.insight.good{background:#e7f6ee;color:#176c48}.insight.low{background:#fff0ed;color:#993b32}.scope-disclaimer{font-size:.77rem;color:var(--muted);margin:14px 0 0;line-height:1.45}
.bar-chart-list{display:grid;gap:17px}.bar-label{display:flex;justify-content:space-between;gap:10px;margin-bottom:6px}.bar-label span{font-weight:750}.bar-track{position:relative;height:15px;border-radius:99px;background:#edf1f5;overflow:visible}.bar-track.small{height:10px}.bar-fill{height:100%;display:block;border-radius:99px;min-width:0}.bar-fill.good{background:#23865b}.bar-fill.mid{background:#d59a2d}.bar-fill.low{background:#bd574e}.target-marker{position:absolute;top:-4px;width:2px;height:23px;background:#21364b;opacity:.55}.bar-row small{display:block;color:var(--muted);margin-top:5px}
.donut-pair{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}.donut-item{text-align:center}.donut{--pct:0;width:150px;height:150px;margin:0 auto 10px;border-radius:50%;background:conic-gradient(var(--teal) calc(var(--pct)*1%),#e6ebf0 0);display:grid;place-items:center}.donut:before{content:"";position:absolute}.donut>div{width:108px;height:108px;border-radius:50%;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center}.donut strong{font-size:1.45rem;color:var(--navy)}.donut span{font-size:.72rem;color:var(--muted);padding:0 6px}.donut-item small{color:var(--muted)}.time-assessment{margin-top:20px;background:#f1f6f8;border-radius:10px;padding:13px;font-size:.9rem}
.paper-progress-card{margin:18px 0}.paper-progress-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.paper-progress-item{border:1px solid var(--line);border-radius:12px;padding:13px;background:#fff}.paper-progress-item.not-started{opacity:.65;background:#f7f9fb}.paper-progress-head,.paper-progress-foot{display:flex;justify-content:space-between;gap:8px}.paper-progress-head{margin-bottom:10px}.paper-progress-head span,.paper-progress-foot span{color:var(--muted);font-size:.78rem}.paper-progress-foot{margin-top:8px}.paper-progress-foot b{font-size:.86rem}
.recommendations-card{border-left:5px solid var(--gold)}.recommendation-list{padding-left:23px}.recommendation-list li{margin:11px 0;line-height:1.5}.indicator-list{margin:0}.indicator-list div{display:flex;justify-content:space-between;gap:18px;border-bottom:1px solid var(--line);padding:10px 0}.indicator-list dt{color:var(--muted)}.indicator-list dd{font-weight:850;color:var(--navy);margin:0}.score-pill{display:inline-block;padding:4px 8px;border-radius:99px;font-weight:850}.score-pill.good{background:#dff3e9;color:#176c48}.score-pill.mid{background:#fff2d8;color:#835b0c}.score-pill.low{background:#fde8e6;color:#963830}.attempts-detail-card{margin-top:18px}.empty-analytics{text-align:center;padding:50px 24px}.btn.compact{padding:7px 11px;font-size:.82rem}.admin-student-table{margin:20px 0}
.dashboard-progress{margin-bottom:20px;background:linear-gradient(135deg,#f7fbfc,#edf6f5)}.dashboard-progress-top{display:flex;justify-content:space-between;align-items:flex-start;gap:15px}.dashboard-progress-top h2{margin:0}.dashboard-mini-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:16px}.dashboard-mini-stats div{background:#fff;border:1px solid var(--line);padding:13px;border-radius:11px}.dashboard-mini-stats span{display:block;color:var(--muted);font-size:.76rem}.dashboard-mini-stats strong{font-size:1.25rem;color:var(--navy)}.paper-card-progress{height:9px;background:#edf1f5;border-radius:99px;position:relative;margin:-5px 0 16px;overflow:visible}.paper-card-progress span{display:block;height:100%;border-radius:99px}.paper-card-progress span.good{background:#23865b}.paper-card-progress span.mid{background:#d59a2d}.paper-card-progress span.low{background:#bd574e}.paper-card-progress i{position:absolute;top:-3px;height:15px;width:2px;background:#253d55;opacity:.5}.paper-attempted{border-top:4px solid var(--teal)}
@media(max-width:1100px){.analytics-stat-grid{grid-template-columns:repeat(3,1fr)}.paper-progress-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:820px){.analytics-layout{grid-template-columns:1fr}.analytics-intro{align-items:flex-start;flex-direction:column}.paper-progress-grid{grid-template-columns:repeat(2,1fr)}.dashboard-mini-stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.analytics-stat-grid{grid-template-columns:repeat(2,1fr)}.paper-progress-grid{grid-template-columns:1fr}.donut-pair{grid-template-columns:1fr 1fr;gap:8px}.donut{width:125px;height:125px}.donut>div{width:90px;height:90px}.metric-card strong{font-size:1.45rem}}
@media print{.topbar,.footer,.actions,.btn{display:none!important}.container{width:100%;margin:0}.card,.metric-card{box-shadow:none;break-inside:avoid}.analytics-layout{break-inside:avoid}.trend-chart{min-width:0}.data-table{font-size:9pt}.analytics-stat-grid{grid-template-columns:repeat(3,1fr)}}


/* Creator copyright footer v1.3.0 */
.site-footer{margin-top:48px;background:linear-gradient(135deg,#17283b,#20364c);color:#fff;border-top:4px solid var(--gold)}
.footer-inner{width:min(1180px,calc(100% - 32px));margin:0 auto;padding:24px 0;display:flex;justify-content:space-between;align-items:center;gap:28px}
.footer-brand-block{display:flex;flex-direction:column;gap:5px;min-width:0}.footer-brand-block strong{font-size:1rem}.footer-brand-block span{color:#e7edf3;font-size:.9rem}.footer-brand-block span b{color:#f4c15d}.footer-brand-block small{color:#bfcbd6;font-size:.77rem}
.footer-contact-block{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:9px}.footer-social{display:inline-flex;align-items:center;min-height:36px;padding:8px 12px;border-radius:999px;color:#fff!important;text-decoration:none;font-size:.8rem;font-weight:800;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);transition:transform .15s ease,background .15s ease,border-color .15s ease}.footer-social:hover{transform:translateY(-2px);background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.45)}.footer-social.facebook:before{content:"f";font-family:Arial,sans-serif;margin-right:7px;font-size:1rem}.footer-social.instagram:before{content:"◎";margin-right:7px}.footer-social.tiktok:before{content:'';background:currentColor;mask:url('/assets/icons/music.svg') center/contain no-repeat;-webkit-mask:url('/assets/icons/music.svg') center/contain no-repeat;margin-right:7px}.footer-social.email:before{content:'';background:currentColor;mask:url('/assets/icons/mail.svg') center/contain no-repeat;-webkit-mask:url('/assets/icons/mail.svg') center/contain no-repeat;margin-right:7px}.footer-social.phone:before{content:'';background:currentColor;mask:url('/assets/icons/phone.svg') center/contain no-repeat;-webkit-mask:url('/assets/icons/phone.svg') center/contain no-repeat;margin-right:7px}
@media(max-width:760px){.footer-inner{flex-direction:column;align-items:flex-start}.footer-contact-block{justify-content:flex-start}.footer-social.email{max-width:100%;overflow-wrap:anywhere}}
@media print{.site-footer{display:none!important}}


/* v1.4.0: JFT-A2/N4-friendly question typography and 50-paper layout */
ruby{ruby-align:center}rt{font-size:.56em;line-height:1;color:#607083;font-weight:600}.jp-question{font-family:"Noto Sans JP","Yu Gothic","Meiryo",sans-serif;line-height:1.9;letter-spacing:.01em}.jp-option{font-family:"Noto Sans JP","Yu Gothic","Meiryo",sans-serif;line-height:1.8}.paper-grid{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}.paper-card{min-height:270px}.review-option ruby,.option ruby{white-space:nowrap}@media(max-width:640px){.jp-question{font-size:1.25rem;line-height:2}.option{align-items:flex-start}.paper-grid{grid-template-columns:1fr}}

.review-option .jp-option{margin-left:0!important;color:inherit!important;font-weight:400!important;flex:1}.review-option .jp-option+span{margin-left:auto}

/* v1.6.0 — Interactive Aurora UI: no Japanese pattern or seal graphics */
html[data-theme="light"]{
  color-scheme:light;
  --navy:#14263f;--navy2:#203b5d;--teal:#087f86;--gold:#d29d36;--red:#c44b61;
  --green:#20885c;--orange:#cc7b25;--bg:#eef4fb;--bg-start:#f8fbff;--bg-end:#edf3fa;
  --card:#ffffff;--text:#172332;--muted:#687789;--line:#d9e3ee;--surface-2:#f5f8fc;
  --surface-3:#e8eef6;--input:#ffffff;--topbar:rgba(12,27,46,.86);
  --shadow:0 18px 46px rgba(28,48,73,.11);--accent:#745ee8;--accent2:#15a2b2;
  --canvas-opacity:.72;--glass:rgba(255,255,255,.82)
}
html[data-theme="dark"]{
  color-scheme:dark;
  --navy:#0c1828;--navy2:#162a43;--teal:#54d0cf;--gold:#efbf59;--red:#f27f91;
  --green:#59d49a;--orange:#f0a34a;--bg:#070d15;--bg-start:#08101a;--bg-end:#0b1522;
  --card:#111b27;--text:#edf4fb;--muted:#9cacc0;--line:#29394c;--surface-2:#162330;
  --surface-3:#1e2d3c;--input:#0d1722;--topbar:rgba(5,12,20,.82);
  --shadow:0 20px 54px rgba(0,0,0,.38);--accent:#9d8cff;--accent2:#58d8d4;
  --canvas-opacity:.9;--glass:rgba(17,27,39,.78)
}
html{background:var(--bg);min-height:100%}
body{
  min-height:100vh;color:var(--text);background:
    radial-gradient(circle at 12% -10%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 34%),
    radial-gradient(circle at 95% 8%,color-mix(in srgb,var(--accent2) 10%,transparent),transparent 35%),
    linear-gradient(180deg,var(--bg-start),var(--bg-end));
  background-attachment:fixed;transition:background-color .3s ease,color .3s ease
}
.ambient-canvas{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:var(--canvas-opacity);transition:opacity .3s ease}
.ambient-vignette{position:fixed;inset:0;z-index:0;pointer-events:none;background:linear-gradient(180deg,transparent 0%,color-mix(in srgb,var(--bg-end) 17%,transparent) 65%,color-mix(in srgb,var(--bg-end) 54%,transparent) 100%)}
.topbar,.container,.site-footer{position:relative;z-index:1}
html.theme-changing *,html.theme-changing *::before,html.theme-changing *::after{transition-duration:.28s!important}
.topbar{
  background:var(--topbar);backdrop-filter:blur(20px) saturate(145%);-webkit-backdrop-filter:blur(20px) saturate(145%);
  border-bottom:1px solid rgba(255,255,255,.12);box-shadow:0 10px 34px rgba(0,0,0,.18)
}
.brand{gap:12px;font-family:"Noto Sans JP","Yu Gothic","Meiryo",sans-serif}
.brand-mark{position:relative;width:44px;height:44px;display:grid;place-items:center;flex:0 0 44px;border-radius:14px;background:linear-gradient(145deg,rgba(255,255,255,.18),rgba(255,255,255,.05));border:1px solid rgba(255,255,255,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 9px 22px rgba(0,0,0,.2);overflow:hidden}
.brand-core{position:relative;z-index:3;width:24px;height:24px;display:grid;place-items:center;border-radius:50%;color:#fff;font-size:.82rem;font-weight:950;background:linear-gradient(145deg,var(--accent2),var(--accent));box-shadow:0 0 18px color-mix(in srgb,var(--accent2) 54%,transparent)}
.brand-orbit{position:absolute;inset:6px;border-radius:50%;border:1px solid rgba(255,255,255,.42);animation:brandOrbit 6s linear infinite}
.brand-orbit::before{content:"";position:absolute;left:50%;top:-3px;width:6px;height:6px;border-radius:50%;background:#fff;box-shadow:0 0 10px #fff}
.brand-orbit.orbit-two{inset:10px;animation-duration:4.5s;animation-direction:reverse;transform:rotate(70deg);opacity:.64}
.brand-orbit.orbit-two::before{background:var(--gold);box-shadow:0 0 10px var(--gold)}
.brand-copy{display:flex;flex-direction:column;line-height:1.05}.brand-copy strong{font-size:.98rem;color:#fff}.brand-copy small{margin-top:5px;color:#c8d4e0;font-size:.67rem;letter-spacing:.1em;font-weight:600}
.topbar-right{display:flex;align-items:center;gap:10px}.language-control,.theme-toggle{height:38px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);color:#fff;border-radius:999px;display:inline-flex;align-items:center;gap:7px;padding:5px 10px;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.language-control{cursor:pointer}.language-control>span{display:grid;place-items:center;width:23px;height:23px;border-radius:50%;background:rgba(255,255,255,.12);font-family:"Noto Sans JP",sans-serif;font-weight:900}.language-control select{color:#fff}.language-control select option{color:#202832;background:#fff}html[data-theme="dark"] .language-control select option{color:#eaf0f6;background:#121b25}
.theme-toggle{appearance:none;cursor:pointer;font:inherit;font-weight:800;transition:transform .2s ease,background .2s ease,border-color .2s ease}.theme-toggle:hover{transform:translateY(-2px);background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.35)}
.theme-icon{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:linear-gradient(145deg,var(--gold),#f2d58e);color:#2b210e;font-family:"Noto Sans JP",sans-serif;font-weight:900;box-shadow:0 3px 9px rgba(0,0,0,.22)}html[data-theme="dark"] .theme-icon{background:linear-gradient(145deg,#a99aff,#6674b7);color:#0d1724}.theme-text{font-size:.78rem;white-space:nowrap}
.container{animation:pageEnter .45s cubic-bezier(.2,.75,.25,1) both}
.hero{position:relative;overflow:hidden;isolation:isolate;background:linear-gradient(125deg,#10243f,#173d5b,#27335d,#153d51);background-size:300% 300%;animation:heroGradient 14s ease infinite;color:#fff;border:1px solid rgba(255,255,255,.13);box-shadow:0 28px 70px rgba(12,30,54,.28)}
.hero::before{content:"";position:absolute;inset:-45%;z-index:-2;background:conic-gradient(from 90deg at 50% 50%,transparent 0 19%,rgba(86,216,212,.22) 27%,transparent 36% 61%,rgba(157,140,255,.2) 70%,transparent 78%);animation:heroSpin 22s linear infinite}
.hero::after{content:"";position:absolute;width:min(38vw,420px);aspect-ratio:1;border-radius:50%;right:-10%;bottom:-42%;z-index:-1;border:1px solid rgba(255,255,255,.22);box-shadow:0 0 0 28px rgba(255,255,255,.025),0 0 0 60px rgba(255,255,255,.018),inset 0 0 80px rgba(88,216,212,.12);animation:heroFloat 7s ease-in-out infinite}
.hero-stat{border:1px solid rgba(255,255,255,.17);backdrop-filter:blur(14px);background:rgba(255,255,255,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
.eyebrow{color:#82e7e3}.eyebrow::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:currentColor;margin-right:7px;box-shadow:0 0 0 5px rgba(130,231,227,.13),0 0 18px currentColor;animation:livePulse 2.2s ease-in-out infinite}
.card,.paper-card,.question-card,.exam-sidebar,.modal-card,.review-card,.metric-card,.stat-card,.paper-progress-item,.dashboard-mini-stats div,.donut>div{background:var(--glass);border-color:var(--line);color:var(--text);box-shadow:var(--shadow);backdrop-filter:blur(18px) saturate(125%);-webkit-backdrop-filter:blur(18px) saturate(125%)}
.card,.paper-card,.metric-card,.stat-card,.review-card{transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease,background .3s ease}.card:hover,.paper-card:hover,.metric-card:hover,.stat-card:hover{transform:translateY(-5px);box-shadow:0 25px 60px rgba(17,36,61,.17);border-color:color-mix(in srgb,var(--accent2) 52%,var(--line))}html[data-theme="dark"] .card:hover,html[data-theme="dark"] .paper-card:hover,html[data-theme="dark"] .metric-card:hover,html[data-theme="dark"] .stat-card:hover{box-shadow:0 25px 60px rgba(0,0,0,.48)}
.paper-card{position:relative;overflow:hidden}.paper-card::after{content:"";position:absolute;right:-55px;top:-70px;width:160px;height:160px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 18%,transparent),transparent 68%);animation:cardGlow 6s ease-in-out infinite;pointer-events:none}.paper-card>*{position:relative;z-index:1}.paper-no{color:var(--accent2)}
.btn{position:relative;overflow:hidden;transition:transform .18s ease,filter .18s ease,box-shadow .18s ease}.btn::after{content:"";position:absolute;inset:-120% -55%;background:linear-gradient(105deg,transparent 37%,rgba(255,255,255,.28) 50%,transparent 63%);transform:translateX(-45%);transition:transform .55s ease}.btn:hover::after{transform:translateX(45%)}.btn:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(12,27,44,.2)}.btn:active{transform:translateY(0) scale(.985)}
.btn.primary{background:linear-gradient(135deg,#07858b,#4d68d6);color:#fff}.btn.secondary{background:var(--surface-3);color:var(--text)}.btn.warning{background:linear-gradient(135deg,var(--gold),#f0c66d);color:#28200f}
.form-grid input,.form-grid select{background:var(--input);color:var(--text);border-color:var(--line)}.form-grid input::placeholder{color:var(--muted)}
.option{background:var(--surface-2);border-color:var(--line);color:var(--text);transition:transform .16s ease,background .2s ease,border-color .2s ease}.option:hover{transform:translateX(3px);background:color-mix(in srgb,var(--teal) 8%,var(--surface-2));border-color:color-mix(in srgb,var(--teal) 56%,var(--line))}.option:has(input:checked){background:color-mix(in srgb,var(--teal) 15%,var(--card));border-color:var(--teal)}.option-letter{background:var(--surface-3);color:var(--text)}
.timer-box{background:linear-gradient(145deg,var(--navy),var(--navy2));border:1px solid color-mix(in srgb,var(--accent2) 45%,transparent)}
.navigator button{background:var(--surface-2);border-color:var(--line);color:var(--text);transition:transform .15s ease,background .18s ease}.navigator button:hover{transform:translateY(-2px)}.navigator button.answered{background:color-mix(in srgb,var(--green) 24%,var(--surface-2));border-color:var(--green)}.navigator button.current{background:linear-gradient(135deg,var(--navy2),var(--accent));color:#fff}
.save-state{background:color-mix(in srgb,var(--green) 18%,var(--card));color:var(--green)}.review-option{border-color:var(--line);background:var(--surface-2)}.review-option.correct-option{background:color-mix(in srgb,var(--green) 15%,var(--card));border-color:var(--green)}.review-option.wrong-option{background:color-mix(in srgb,var(--red) 14%,var(--card));border-color:var(--red)}.explanation{background:color-mix(in srgb,var(--gold) 14%,var(--card));border-color:color-mix(in srgb,var(--gold) 60%,var(--line))}
.data-table th{background:var(--surface-2);color:var(--muted)}.data-table td,.data-table th{border-color:var(--line)}.dashboard-progress{background:linear-gradient(135deg,color-mix(in srgb,var(--card) 96%,var(--accent2)),color-mix(in srgb,var(--card) 90%,var(--accent)))}.bar-track,.paper-card-progress{background:var(--surface-3)}.grid-line{stroke:var(--line)}.axis-label{fill:var(--muted)}.trend-line{stroke:var(--teal)}.target-marker{background:var(--text)}
.donut{background:conic-gradient(var(--teal) calc(var(--pct)*1%),var(--surface-3) 0)}.donut strong,.metric-card strong,.stat-card strong,.dashboard-mini-stats strong,.indicator-list dd{color:var(--text)}.time-assessment{background:var(--surface-2)}.paper-progress-item.not-started{background:var(--surface-2)}
.alert.success{background:color-mix(in srgb,var(--green) 16%,var(--card));color:var(--green)}.alert.error{background:color-mix(in srgb,var(--red) 15%,var(--card));color:var(--red)}.alert.warning{background:color-mix(in srgb,var(--gold) 18%,var(--card));color:var(--orange)}
.site-footer{background:linear-gradient(135deg,rgba(7,16,27,.98),rgba(18,38,58,.97) 54%,rgba(32,33,69,.96));border-top-color:color-mix(in srgb,var(--accent2) 75%,transparent)}.footer-brand-block span b{color:var(--gold)}.footer-social{transition:transform .2s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease}.footer-social:hover{transform:translateY(-3px);box-shadow:0 10px 22px rgba(0,0,0,.22)}
rt{color:var(--muted)}.question-card.active{animation:questionEnter .28s cubic-bezier(.2,.75,.25,1) both}.reveal-on-scroll{opacity:0;transform:translateY(18px) scale(.988)}.reveal-on-scroll.is-visible{animation:revealUp .52s cubic-bezier(.2,.75,.25,1) var(--reveal-delay,0ms) both}
@keyframes brandOrbit{to{transform:rotate(360deg)}}
@keyframes heroGradient{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes heroSpin{to{transform:rotate(360deg)}}
@keyframes heroFloat{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(-18px,-20px,0) scale(1.05)}}
@keyframes livePulse{0%,100%{transform:scale(.86);opacity:.7}50%{transform:scale(1.14);opacity:1}}
@keyframes cardGlow{0%,100%{transform:translate3d(0,0,0) scale(.94);opacity:.65}50%{transform:translate3d(-18px,18px,0) scale(1.08);opacity:1}}
@keyframes pageEnter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes revealUp{from{opacity:0;transform:translateY(18px) scale(.988)}to{opacity:1;transform:none}}
@keyframes questionEnter{from{opacity:0;transform:translateX(13px)}to{opacity:1;transform:none}}
@media(max-width:900px){.theme-text{display:none}.theme-toggle{width:38px;justify-content:center;padding:5px}.brand-copy small{display:none}}
@media(max-width:620px){.topbar-right{gap:6px}.language-control{padding:4px 8px}.language-control>span{display:none}.brand-copy strong{font-size:.88rem}.brand-mark{width:40px;height:40px;flex-basis:40px}.card:hover,.paper-card:hover,.metric-card:hover,.stat-card:hover{transform:none}.ambient-canvas{opacity:calc(var(--canvas-opacity) * .78)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.container,.question-card.active,.reveal-on-scroll,.reveal-on-scroll.is-visible,.brand-orbit,.hero,.hero::before,.hero::after,.eyebrow::before,.paper-card::after{animation:none!important}.reveal-on-scroll,.reveal-on-scroll.is-visible{opacity:1!important;transform:none!important}.card,.paper-card,.metric-card,.stat-card,.review-card,.btn,.theme-toggle,.option{transition:none!important}}
@media print{body{background:#fff!important;color:#000!important}.theme-toggle,.ambient-canvas,.ambient-vignette{display:none!important}}

/* v1.6.1 — Sticky footer layout fix
   Keeps the footer at the bottom of the viewport on short pages,
   while allowing it to flow normally below long content. */
body{
  display:flex;
  flex-direction:column;
  min-height:100vh;
  min-height:100dvh;
}
.topbar{flex:0 0 auto}
main.container{
  flex:1 0 auto;
  width:min(1180px,calc(100% - 28px));
}
.site-footer{
  flex:0 0 auto;
  margin-top:auto;
  width:100%;
}
@media(max-width:620px){
  main.container{width:min(100% - 18px,1180px)}
}

/* v1.7.0 — iOS 26-inspired Liquid Glass surfaces
   Applied selectively to controls, exam paper cards and performance analytics.
   The content layer remains calm while interactive surfaces float above it. */
html[data-theme="light"]{
  --liquid-panel:rgba(255,255,255,.46);
  --liquid-panel-strong:rgba(255,255,255,.66);
  --liquid-edge:rgba(255,255,255,.82);
  --liquid-edge-soft:rgba(111,143,181,.24);
  --liquid-highlight:rgba(255,255,255,.62);
  --liquid-shadow:0 18px 46px rgba(38,61,91,.14),0 3px 10px rgba(38,61,91,.08);
  --liquid-inner:inset 0 1px 0 rgba(255,255,255,.86),inset 0 -1px 0 rgba(111,143,181,.12);
}
html[data-theme="dark"]{
  --liquid-panel:rgba(18,31,47,.40);
  --liquid-panel-strong:rgba(20,35,53,.62);
  --liquid-edge:rgba(215,235,255,.24);
  --liquid-edge-soft:rgba(108,156,211,.20);
  --liquid-highlight:rgba(218,239,255,.25);
  --liquid-shadow:0 22px 56px rgba(0,0,0,.42),0 3px 13px rgba(0,0,0,.28);
  --liquid-inner:inset 0 1px 0 rgba(255,255,255,.18),inset 0 -1px 0 rgba(0,0,0,.28);
}

.liquid-surface{
  --glass-x:50%;--glass-y:18%;--glass-rx:0deg;--glass-ry:0deg;--glass-scale:1;
  --liquid-accent:rgba(72,188,221,.20);
  position:relative;isolation:isolate;overflow:hidden;
  background:
    linear-gradient(145deg,rgba(255,255,255,.16),rgba(255,255,255,.025) 42%,transparent 72%),
    var(--liquid-panel)!important;
  border:1px solid var(--liquid-edge)!important;
  box-shadow:var(--liquid-inner),var(--liquid-shadow)!important;
  -webkit-backdrop-filter:blur(28px) saturate(175%) contrast(104%);
  backdrop-filter:blur(28px) saturate(175%) contrast(104%);
  transform:perspective(1100px) rotateX(var(--glass-ry)) rotateY(var(--glass-rx)) scale(var(--glass-scale));
  transform-style:preserve-3d;
  transition:transform .32s cubic-bezier(.2,.8,.2,1),box-shadow .32s ease,border-color .32s ease,background .32s ease;
}
.liquid-surface::before{
  content:"";position:absolute;inset:-1px;z-index:-1;pointer-events:none;border-radius:inherit;
  background:
    radial-gradient(360px circle at var(--glass-x) var(--glass-y),var(--liquid-highlight),transparent 43%),
    radial-gradient(260px circle at calc(var(--glass-x) + 12%) calc(var(--glass-y) + 16%),var(--liquid-accent),transparent 58%),
    linear-gradient(118deg,rgba(255,255,255,.18),transparent 30% 70%,rgba(255,255,255,.08));
  opacity:.82;mix-blend-mode:screen;transition:opacity .25s ease;
}
.liquid-surface::after{
  content:"";position:absolute;inset:0;z-index:3;pointer-events:none;border-radius:inherit;padding:1px;
  background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(255,255,255,.08) 34%,rgba(91,199,232,.28) 68%,rgba(255,255,255,.46));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;opacity:.72;
}
html[data-theme="dark"] .liquid-surface::after{opacity:.42}
.liquid-surface:hover{--glass-scale:1.012;border-color:color-mix(in srgb,var(--accent2) 48%,var(--liquid-edge))!important;box-shadow:var(--liquid-inner),0 25px 65px rgba(34,72,112,.19),0 5px 16px rgba(24,51,82,.12)!important}
html[data-theme="dark"] .liquid-surface:hover{box-shadow:var(--liquid-inner),0 28px 72px rgba(0,0,0,.55),0 0 30px color-mix(in srgb,var(--accent2) 9%,transparent)!important}
.liquid-surface.is-glass-active::before{opacity:1}

/* Buttons and compact controls — capsule-shaped stained/clear glass. */
.btn.liquid-control,.theme-toggle.liquid-control,.language-control.liquid-control{
  border-radius:999px!important;min-height:42px;
  color:var(--text);background:linear-gradient(145deg,rgba(255,255,255,.34),rgba(255,255,255,.08)),var(--liquid-panel-strong)!important;
  border:1px solid var(--liquid-edge)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72),inset 0 -1px 0 rgba(75,101,135,.12),0 9px 24px rgba(28,52,80,.13)!important;
  -webkit-backdrop-filter:blur(22px) saturate(185%);backdrop-filter:blur(22px) saturate(185%);
  transform:none;
}
.btn.liquid-control::before,.theme-toggle.liquid-control::before,.language-control.liquid-control::before{
  z-index:0;background:radial-gradient(130px circle at var(--glass-x) var(--glass-y),rgba(255,255,255,.78),transparent 58%);opacity:.56
}
.btn.liquid-control>*{position:relative;z-index:2}
.btn.liquid-control.primary{
  color:#fff!important;background:
    linear-gradient(140deg,rgba(20,200,211,.83),rgba(70,100,226,.84) 62%,rgba(126,80,235,.78))!important;
  border-color:rgba(255,255,255,.52)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.58),inset 0 -1px 0 rgba(20,45,118,.28),0 12px 30px rgba(49,91,196,.28)!important;
}
.btn.liquid-control.secondary{background:linear-gradient(145deg,rgba(255,255,255,.42),rgba(255,255,255,.09)),var(--liquid-panel)!important;color:var(--text)!important}
.btn.liquid-control.warning{background:linear-gradient(145deg,rgba(255,224,135,.94),rgba(220,151,38,.80))!important;color:#2b210e!important;border-color:rgba(255,245,197,.66)!important}
.btn.liquid-control.danger{background:linear-gradient(145deg,rgba(242,99,125,.88),rgba(183,57,83,.82))!important;color:#fff!important;border-color:rgba(255,215,224,.50)!important}
.btn.liquid-control:hover,.theme-toggle.liquid-control:hover,.language-control.liquid-control:hover{transform:translateY(-2px) scale(1.018);filter:none}
.btn.liquid-control:active,.theme-toggle.liquid-control:active{transform:translateY(0) scale(.975)}
.glass-ripple{position:absolute;z-index:1;width:12px;height:12px;border-radius:50%;pointer-events:none;background:rgba(255,255,255,.52);transform:translate(-50%,-50%) scale(0);animation:glassRipple .62s ease-out forwards}
@keyframes glassRipple{to{transform:translate(-50%,-50%) scale(18);opacity:0}}

/* Paper cards — floating translucent tiles with a soft refractive edge. */
.paper-card.liquid-surface{
  --liquid-accent:rgba(101,103,245,.20);border-radius:26px!important;
  background:
    linear-gradient(150deg,rgba(255,255,255,.29),rgba(255,255,255,.05) 48%,transparent 72%),
    var(--liquid-panel)!important;
  box-shadow:var(--liquid-inner),0 20px 54px rgba(28,55,88,.14),0 2px 8px rgba(28,55,88,.07)!important;
}
.paper-card.liquid-surface:nth-child(3n+2){--liquid-accent:rgba(30,204,190,.19)}
.paper-card.liquid-surface:nth-child(3n+3){--liquid-accent:rgba(214,138,48,.17)}
.paper-card.liquid-surface::before{background:
  radial-gradient(320px circle at var(--glass-x) var(--glass-y),rgba(255,255,255,.58),transparent 44%),
  radial-gradient(220px circle at calc(var(--glass-x) + 9%) calc(var(--glass-y) + 14%),var(--liquid-accent),transparent 62%),
  linear-gradient(120deg,rgba(255,255,255,.19),transparent 42% 72%,rgba(255,255,255,.08));animation:none}
.paper-card.liquid-surface .paper-no{display:inline-flex;padding:5px 10px;border-radius:999px;background:rgba(255,255,255,.22);border:1px solid rgba(255,255,255,.34);box-shadow:inset 0 1px 0 rgba(255,255,255,.42);color:var(--teal)}
html[data-theme="dark"] .paper-card.liquid-surface .paper-no{background:rgba(255,255,255,.07)}
.paper-card-progress{border:1px solid color-mix(in srgb,var(--liquid-edge) 55%,transparent);box-shadow:inset 0 1px 2px rgba(0,0,0,.12)}

/* Performance analysis — deeper glass, distinct from ordinary content cards. */
.dashboard-progress.liquid-surface,.metric-card.liquid-surface,.chart-card.liquid-surface,.conclusion-card.liquid-surface,.paper-progress-card.liquid-surface,.recommendations-card.liquid-surface,.attempts-detail-card.liquid-surface,.stat-card.liquid-surface{
  --liquid-accent:rgba(46,190,210,.18);border-radius:24px!important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.24),rgba(255,255,255,.045) 50%,transparent 75%),
    var(--liquid-panel)!important;
}
.dashboard-progress.liquid-surface{--liquid-accent:rgba(105,92,238,.23);padding:26px}
.dashboard-mini-stats>div.liquid-surface,.metric-card.liquid-surface{
  --liquid-accent:rgba(64,188,220,.17);border-radius:20px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.30),rgba(255,255,255,.06)),var(--liquid-panel)!important;
}
.dashboard-mini-stats>div.liquid-surface:nth-child(2),.metric-card.liquid-surface:nth-child(3n+2){--liquid-accent:rgba(116,91,239,.18)}
.dashboard-mini-stats>div.liquid-surface:nth-child(3),.metric-card.liquid-surface:nth-child(3n){--liquid-accent:rgba(34,190,139,.17)}
.dashboard-mini-stats>div.liquid-surface:nth-child(4){--liquid-accent:rgba(226,154,52,.17)}
.metric-card.liquid-surface strong,.dashboard-mini-stats>div.liquid-surface strong{background:linear-gradient(135deg,var(--text),color-mix(in srgb,var(--accent) 46%,var(--text)));-webkit-background-clip:text;background-clip:text;color:transparent}
.paper-progress-item.liquid-surface{border-radius:17px!important;padding:14px;background:linear-gradient(145deg,rgba(255,255,255,.25),rgba(255,255,255,.04)),var(--liquid-panel)!important}
.paper-progress-item.liquid-surface.not-started{opacity:.70}
.result-stats>div.liquid-surface{background:rgba(255,255,255,.10)!important;border-color:rgba(255,255,255,.24)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 12px 28px rgba(0,0,0,.10)!important}

/* Keep text and controls above optical layers. */
.liquid-surface>*{position:relative;z-index:2}
.liquid-surface form{position:relative;z-index:4}

@media(hover:hover) and (pointer:fine){
  .paper-card.liquid-interactive:hover,.metric-card.liquid-interactive:hover,.stat-card.liquid-interactive:hover,.paper-progress-item.liquid-interactive:hover,.dashboard-mini-stats>div.liquid-interactive:hover{
    transform:perspective(1100px) rotateX(var(--glass-ry)) rotateY(var(--glass-rx)) translateY(-7px) scale(1.018)
  }
}
@media(max-width:620px){
  .paper-card.liquid-surface,.dashboard-progress.liquid-surface,.metric-card.liquid-surface,.chart-card.liquid-surface,.conclusion-card.liquid-surface{border-radius:21px!important}
  .liquid-surface{transform:none!important}
  .btn.liquid-control{min-height:44px}
}
@media(prefers-reduced-motion:reduce){
  .liquid-surface,.btn.liquid-control,.theme-toggle.liquid-control,.language-control.liquid-control{transform:none!important;transition:none!important}
  .glass-ripple{display:none!important}
}
@media(prefers-contrast:more){
  .liquid-surface{background:var(--card)!important;border:2px solid var(--text)!important;backdrop-filter:none;-webkit-backdrop-filter:none}
  .liquid-surface::before,.liquid-surface::after{display:none}
}
@supports not ((backdrop-filter:blur(2px)) or (-webkit-backdrop-filter:blur(2px))){
  .liquid-surface{background:color-mix(in srgb,var(--card) 94%,var(--accent2))!important}
}
@media print{.liquid-surface{background:#fff!important;border:1px solid #bbb!important;box-shadow:none!important;transform:none!important;backdrop-filter:none!important}.liquid-surface::before,.liquid-surface::after{display:none!important}}


/* v1.8.0 — Minimal & Decent interface
   Removes the heavy liquid-glass styling and keeps a clean, restrained visual system. */
html[data-theme="light"]{
  --minimal-bg:#f5f7fa;
  --minimal-surface:rgba(255,255,255,.92);
  --minimal-surface-soft:rgba(255,255,255,.72);
  --minimal-border:#dce3eb;
  --minimal-shadow:0 8px 24px rgba(24,39,58,.07);
  --minimal-shadow-hover:0 12px 30px rgba(24,39,58,.10);
  --minimal-primary:#2563eb;
  --minimal-primary-hover:#1d4ed8;
  --minimal-success:#16a36a;
}
html[data-theme="dark"]{
  --minimal-bg:#0b1119;
  --minimal-surface:rgba(18,27,39,.94);
  --minimal-surface-soft:rgba(18,27,39,.78);
  --minimal-border:#293646;
  --minimal-shadow:0 8px 24px rgba(0,0,0,.22);
  --minimal-shadow-hover:0 14px 34px rgba(0,0,0,.32);
  --minimal-primary:#4f8df7;
  --minimal-primary-hover:#6ba0fa;
  --minimal-success:#35c789;
}
body{
  background:
    radial-gradient(circle at 10% 0%,color-mix(in srgb,var(--minimal-primary) 5%,transparent),transparent 35%),
    var(--minimal-bg)!important;
}
.ambient-canvas{opacity:.13!important}
.ambient-vignette{opacity:.18!important}
.topbar{
  background:color-mix(in srgb,var(--minimal-surface) 94%,transparent)!important;
  color:var(--text)!important;
  border-bottom:1px solid var(--minimal-border)!important;
  box-shadow:0 2px 12px rgba(15,23,42,.05)!important;
  -webkit-backdrop-filter:blur(14px)!important;
  backdrop-filter:blur(14px)!important;
}
.brand,.topbar nav a{color:var(--text)!important}
.brand-copy small{color:var(--muted)!important}
.brand-mark{
  background:var(--minimal-primary)!important;
  border:0!important;
  box-shadow:none!important;
}
.brand-orbit{display:none!important}
.brand-core{color:#fff!important}

/* Remove prior optical layers, tilt and glossy reflections. */
.liquid-surface,.minimal-surface{
  transform:none!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  background:var(--minimal-surface)!important;
  border:1px solid var(--minimal-border)!important;
  box-shadow:var(--minimal-shadow)!important;
  transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease!important;
}
.liquid-surface::before,.liquid-surface::after,.minimal-surface::before,.minimal-surface::after{
  display:none!important;
}
.liquid-surface:hover,.minimal-surface:hover{
  transform:translateY(-2px)!important;
  border-color:color-mix(in srgb,var(--minimal-primary) 25%,var(--minimal-border))!important;
  box-shadow:var(--minimal-shadow-hover)!important;
}

/* Simple, restrained controls. */
.btn,.btn.liquid-control,.btn.minimal-control,
.theme-toggle,.theme-toggle.liquid-control,.theme-toggle.minimal-control,
.language-control,.language-control.liquid-control,.language-control.minimal-control{
  border-radius:11px!important;
  min-height:40px!important;
  background:var(--minimal-surface)!important;
  color:var(--text)!important;
  border:1px solid var(--minimal-border)!important;
  box-shadow:none!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  transform:none!important;
  transition:background .18s ease,border-color .18s ease,transform .18s ease!important;
}
.btn::before,.btn::after,.theme-toggle::before,.language-control::before,.glass-ripple{display:none!important}
.btn:hover,.theme-toggle:hover,.language-control:hover{
  transform:translateY(-1px)!important;
  border-color:color-mix(in srgb,var(--minimal-primary) 35%,var(--minimal-border))!important;
  filter:none!important;
}
.btn.primary,.btn.liquid-control.primary{
  background:var(--minimal-primary)!important;
  color:#fff!important;
  border-color:var(--minimal-primary)!important;
}
.btn.primary:hover,.btn.liquid-control.primary:hover{
  background:var(--minimal-primary-hover)!important;
  border-color:var(--minimal-primary-hover)!important;
}
.btn.secondary,.btn.liquid-control.secondary{background:var(--minimal-surface)!important;color:var(--text)!important}
.btn.warning,.btn.liquid-control.warning{background:#d99826!important;color:#1f180b!important;border-color:#d99826!important}
.btn.danger,.btn.liquid-control.danger{background:#dc4c5f!important;color:#fff!important;border-color:#dc4c5f!important}
.theme-icon{box-shadow:none!important;background:var(--surface-3)!important;color:var(--text)!important}
.language-control select{color:var(--text)!important}

/* Dashboard header and performance summary. */
.dashboard-head{margin-bottom:22px}
.dashboard-head h1{font-size:clamp(2rem,4vw,3rem);letter-spacing:-.025em}
.dashboard-progress,.dashboard-progress.liquid-surface{
  padding:22px!important;
  border-radius:17px!important;
  background:var(--minimal-surface)!important;
}
.dashboard-progress-top{margin-bottom:16px}
.dashboard-progress-top h2{font-size:1.2rem;margin-bottom:0}
.dashboard-mini-stats{gap:10px!important}
.dashboard-mini-stats>div,.dashboard-mini-stats>div.liquid-surface{
  min-height:82px;
  padding:14px 15px!important;
  border-radius:12px!important;
  background:var(--surface-2)!important;
  border:1px solid var(--minimal-border)!important;
  box-shadow:none!important;
  transform:none!important;
}
.dashboard-mini-stats>div:hover{border-color:var(--minimal-border)!important;box-shadow:none!important;transform:none!important}
.dashboard-mini-stats span{font-size:.78rem}
.dashboard-mini-stats strong{
  color:var(--text)!important;
  background:none!important;
  -webkit-background-clip:initial!important;
  background-clip:initial!important;
  font-size:1.35rem!important;
}

/* Paper cards: compact, uniform and readable. */
.paper-grid{gap:14px!important;grid-template-columns:repeat(auto-fit,minmax(235px,1fr))!important}
.paper-card,.paper-card.liquid-surface{
  position:relative!important;
  min-height:250px!important;
  padding:20px!important;
  border-radius:16px!important;
  background:var(--minimal-surface)!important;
  overflow:visible!important;
  display:flex;
  flex-direction:column;
}
.paper-card::before,.paper-card::after{display:none!important}
.paper-card:hover,.paper-card.liquid-surface:hover{transform:translateY(-3px)!important}
.paper-card .paper-no,.paper-card.liquid-surface .paper-no{
  display:inline-flex!important;
  align-self:flex-start;
  padding:4px 8px!important;
  border-radius:7px!important;
  background:color-mix(in srgb,var(--minimal-primary) 10%,transparent)!important;
  border:0!important;
  box-shadow:none!important;
  color:var(--minimal-primary)!important;
  letter-spacing:.04em!important;
}
.paper-card h2{font-size:1.16rem!important;line-height:1.35;margin:12px 0 6px!important;letter-spacing:-.01em}
.paper-card p{font-size:.9rem;margin:0 0 14px}
.paper-meta{margin:auto 0 12px!important;padding-top:10px;border-top:1px solid var(--minimal-border)}
.paper-card-progress{height:6px!important;border:0!important;box-shadow:none!important;margin-bottom:14px}
.paper-card form{margin-top:0}
.paper-card .btn{min-height:42px!important}

/* Completed tick displayed beside the paper number. */
.paper-number-wrap{
  display:inline-flex;
  align-items:center;
  gap:.42rem;
  min-width:0;
}
.paper-complete-mark{
  position:static;
  flex:0 0 24px;
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--minimal-success);
  color:#fff;
  font-size:.82rem;
  font-weight:900;
  line-height:1;
  box-shadow:0 3px 10px color-mix(in srgb,var(--minimal-success) 26%,transparent);
}
.paper-attempted{border-color:color-mix(in srgb,var(--minimal-success) 30%,var(--minimal-border))!important}

/* Other analytics surfaces stay consistent with the minimal system. */
.metric-card,.metric-card.liquid-surface,.stat-card,.stat-card.liquid-surface,
.chart-card,.chart-card.liquid-surface,.conclusion-card,.conclusion-card.liquid-surface,
.paper-progress-card,.paper-progress-card.liquid-surface,.paper-progress-item,.paper-progress-item.liquid-surface,
.recommendations-card,.recommendations-card.liquid-surface,.attempts-detail-card,.attempts-detail-card.liquid-surface{
  border-radius:15px!important;
  background:var(--minimal-surface)!important;
}
.metric-card strong,.metric-card.liquid-surface strong{color:var(--text)!important;background:none!important;-webkit-background-clip:initial!important;background-clip:initial!important}
.card{border-radius:16px!important;background:var(--minimal-surface)!important;box-shadow:var(--minimal-shadow)!important}
.card:hover{transform:none!important;box-shadow:var(--minimal-shadow)!important}

@media(max-width:620px){
  .paper-grid{grid-template-columns:1fr!important}
  .paper-card,.paper-card.liquid-surface{min-height:auto!important}
  .dashboard-mini-stats{grid-template-columns:repeat(2,1fr)!important}
}
@media(prefers-reduced-motion:reduce){
  .paper-card,.minimal-surface,.btn,.theme-toggle,.language-control{transition:none!important}
}


/* v1.8.1 — Distinct minimal header + visible footer version */
html[data-theme="light"]{
  --header-bg:#16324f;
  --header-bg-soft:#1d4268;
  --header-border:#2b5278;
  --header-text:#f7fbff;
  --header-muted:#b8c9da;
  --header-accent:#67d6cf;
}
html[data-theme="dark"]{
  --header-bg:#071523;
  --header-bg-soft:#0d2135;
  --header-border:#20384f;
  --header-text:#f3f7fb;
  --header-muted:#9fb2c6;
  --header-accent:#72ddd5;
}
.topbar{
  background:linear-gradient(135deg,var(--header-bg),var(--header-bg-soft))!important;
  color:var(--header-text)!important;
  border-bottom:1px solid var(--header-border)!important;
  box-shadow:0 5px 20px rgba(6,20,34,.18)!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
.brand,.topbar nav a{color:var(--header-text)!important}
.brand-copy strong{color:var(--header-text)!important}
.brand-copy small{color:var(--header-muted)!important}
.brand-mark{
  background:linear-gradient(145deg,#3979e8,#2b66cc)!important;
  border:1px solid rgba(255,255,255,.20)!important;
  box-shadow:0 5px 14px rgba(3,15,29,.24)!important;
}
.topbar nav a{
  position:relative;
  opacity:.91;
  transition:opacity .18s ease,color .18s ease;
}
.topbar nav a:hover{
  color:#fff!important;
  opacity:1;
  text-decoration:none;
}
.topbar nav a::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:-7px;
  height:2px;
  border-radius:99px;
  background:var(--header-accent);
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .18s ease;
}
.topbar nav a:hover::after{transform:scaleX(1)}
.theme-toggle,.theme-toggle.liquid-control,.theme-toggle.minimal-control,
.language-control,.language-control.liquid-control,.language-control.minimal-control{
  background:rgba(255,255,255,.09)!important;
  color:var(--header-text)!important;
  border-color:rgba(255,255,255,.18)!important;
}
.theme-toggle:hover,.language-control:hover{
  background:rgba(255,255,255,.14)!important;
  border-color:rgba(255,255,255,.28)!important;
}
.theme-icon{background:rgba(255,255,255,.12)!important;color:var(--header-text)!important}
.language-control select{color:var(--header-text)!important}
.language-control select option{color:#17212b!important;background:#fff!important}

.footer-version{
  display:inline-flex!important;
  width:max-content;
  align-items:center;
  gap:7px;
  margin-top:5px;
  padding:4px 9px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  background:rgba(255,255,255,.07);
  color:#d7e3ee!important;
  font-size:.72rem!important;
  font-weight:700;
  letter-spacing:.025em;
}
.footer-version em{
  color:#7ee1da;
  font-style:normal;
  font-weight:800;
}
@media(max-width:760px){
  .topbar nav a::after{display:none}
  .footer-version{margin-top:7px}
}


/* =========================================================
   v1.9.0 — Dynamic public home page
   ========================================================= */
.landing-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(340px, .92fr);
  gap: clamp(32px, 6vw, 78px);
  align-items: center;
  min-height: calc(100vh - 126px);
  padding: clamp(58px, 9vw, 112px) 0 76px;
}
.landing-hero-copy { max-width: 720px; }
.landing-badge {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 8px 12px; border: 1px solid var(--line, #d7e0eb);
  border-radius: 999px; color: var(--muted, #66758a);
  background: color-mix(in srgb, var(--surface, #fff) 84%, transparent);
  font-size: 12px; font-weight: 800; letter-spacing: .08em;
}
.landing-badge i, .exam-preview-label i {
  width: 8px; height: 8px; border-radius: 50%; background: #2d6cdf;
  box-shadow: 0 0 0 5px color-mix(in srgb, #2d6cdf 14%, transparent);
}
.landing-hero h1 {
  max-width: 800px; margin: 24px 0 18px;
  font-size: clamp(42px, 6.2vw, 78px); line-height: 1.02;
  letter-spacing: -.055em; color: var(--text, #152033);
}
.landing-hero-copy > p {
  max-width: 670px; margin: 0; color: var(--muted, #66758a);
  font-size: clamp(17px, 2vw, 20px); line-height: 1.7;
}
.landing-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 30px; }
.landing-text-link { color: var(--text, #152033); font-weight: 800; padding: 10px 4px; }
.landing-text-link span { display: inline-block; margin-left: 6px; color: #2d6cdf; transition: transform .2s ease; }
.landing-text-link:hover span { transform: translateY(3px); }
.landing-trust-row { display: flex; gap: 24px; flex-wrap: wrap; margin-top: 34px; color: var(--muted, #66758a); font-size: 13px; }
.landing-trust-row span { display: inline-flex; align-items: baseline; gap: 6px; }
.landing-trust-row b { color: var(--text, #152033); font-size: 19px; }

.exam-preview {
  position: relative; overflow: hidden; padding: 25px;
  border: 1px solid var(--line, #d7e0eb); border-radius: 22px;
  background: color-mix(in srgb, var(--surface, #fff) 94%, transparent);
  box-shadow: 0 30px 70px rgba(20, 38, 66, .12);
}
.exam-preview::before {
  content: ''; position: absolute; inset: 0 0 auto; height: 4px;
  background: linear-gradient(90deg, #2d6cdf, #29a6a0);
}
.exam-preview-top, .exam-preview-meta, .exam-preview-save { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.exam-preview-label { display: inline-flex; align-items: center; gap: 9px; font-size: 11px; font-weight: 900; letter-spacing: .1em; color: var(--muted, #66758a); }
.exam-preview-timer { padding: 8px 11px; border-radius: 10px; background: var(--soft, #eef3f9); color: var(--text, #152033); font-size: 14px; font-weight: 900; font-variant-numeric: tabular-nums; }
.exam-preview-progress { height: 5px; margin: 22px 0 10px; overflow: hidden; background: var(--soft, #eef3f9); border-radius: 999px; }
.exam-preview-progress span { display: block; height: 100%; border-radius: inherit; background: #2d6cdf; }
.exam-preview-meta { color: var(--muted, #66758a); font-size: 12px; font-weight: 700; }
.exam-preview h2 { margin: 26px 0 18px; font-size: clamp(21px, 2.1vw, 27px); line-height: 1.5; letter-spacing: -.02em; }
.exam-preview-options { display: grid; gap: 10px; }
.exam-preview-options div { display: grid; grid-template-columns: 30px 1fr; gap: 12px; align-items: center; padding: 13px 14px; border: 1px solid var(--line, #d7e0eb); border-radius: 13px; background: color-mix(in srgb, var(--surface, #fff) 94%, var(--soft, #eef3f9)); color: var(--muted, #66758a); }
.exam-preview-options b { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: var(--soft, #eef3f9); color: var(--text, #152033); }
.exam-preview-options span { font-size: 14px; line-height: 1.5; }
.exam-preview-save { justify-content: flex-start; margin-top: 18px; color: #16835c; font-size: 12px; font-weight: 800; }
.exam-preview-save span { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: #e5f7ef; }

.landing-stats { padding: 0 0 90px; }
.landing-section-intro.compact { margin-bottom: 16px; }
.landing-stats-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--line, #d7e0eb); border-radius: 20px; overflow: hidden; background: var(--surface, #fff); }
.landing-stats-grid article { padding: 24px 26px; border-right: 1px solid var(--line, #d7e0eb); }
.landing-stats-grid article:last-child { border-right: 0; }
.landing-stats-grid strong { display: block; color: var(--text, #152033); font-size: clamp(26px, 3vw, 38px); letter-spacing: -.035em; font-variant-numeric: tabular-nums; }
.landing-stats-grid span { display: block; margin-top: 6px; color: var(--muted, #66758a); font-size: 13px; font-weight: 700; }

.landing-personal { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 28px; padding: 26px 28px; margin: 0 0 90px; border: 1px solid var(--line, #d7e0eb); border-radius: 20px; background: var(--surface, #fff); }
.landing-personal h2 { margin: 7px 0 5px; font-size: 24px; }
.landing-personal p { margin: 0; color: var(--muted, #66758a); }
.landing-personal-stats { display: flex; gap: 8px; }
.landing-personal-stats span { min-width: 100px; padding: 12px 14px; border-radius: 12px; background: var(--soft, #eef3f9); color: var(--muted, #66758a); font-size: 11px; font-weight: 700; }
.landing-personal-stats b { display: block; margin-bottom: 2px; color: var(--text, #152033); font-size: 18px; }

.landing-section { padding: 86px 0; border-top: 1px solid color-mix(in srgb, var(--line, #d7e0eb) 78%, transparent); }
.landing-section-intro { max-width: 660px; margin-bottom: 34px; }
.landing-section-intro h2 { margin: 8px 0 10px; color: var(--text, #152033); font-size: clamp(30px, 4vw, 46px); line-height: 1.12; letter-spacing: -.04em; }
.landing-section-intro p { margin: 0; color: var(--muted, #66758a); font-size: 17px; line-height: 1.65; }
.landing-feature-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.landing-feature-grid article { min-height: 235px; padding: 24px; border: 1px solid var(--line, #d7e0eb); border-radius: 18px; background: var(--surface, #fff); transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease; }
.landing-feature-grid article:hover { transform: translateY(-4px); border-color: color-mix(in srgb, #2d6cdf 38%, var(--line, #d7e0eb)); box-shadow: 0 18px 38px rgba(20, 38, 66, .08); }
.feature-icon { display: grid; place-items: center; width: 42px; height: 42px; margin-bottom: 40px; border-radius: 12px; background: #edf3ff; color: #2d6cdf; font-size: 13px; font-weight: 900; }
.landing-feature-grid h3 { margin: 0 0 9px; font-size: 18px; }
.landing-feature-grid p { margin: 0; color: var(--muted, #66758a); line-height: 1.65; }

.landing-flow { display: grid; grid-template-columns: .8fr 1.2fr; gap: 70px; align-items: start; }
.landing-steps { display: grid; }
.landing-steps article { display: grid; grid-template-columns: 54px 1fr; gap: 18px; padding: 22px 0; border-bottom: 1px solid var(--line, #d7e0eb); }
.landing-steps article:first-child { padding-top: 0; }
.landing-steps article > b { color: #2d6cdf; font-size: 13px; letter-spacing: .08em; }
.landing-steps h3 { margin: 0 0 7px; font-size: 19px; }
.landing-steps p { margin: 0; color: var(--muted, #66758a); line-height: 1.6; }

.landing-subjects { padding-bottom: 100px; }
.subject-pills { display: flex; flex-wrap: wrap; gap: 10px; }
.subject-pills span { display: inline-flex; align-items: center; gap: 10px; padding: 12px 16px; border: 1px solid var(--line, #d7e0eb); border-radius: 999px; background: var(--surface, #fff); color: var(--text, #152033); font-weight: 800; }
.subject-pills i { color: #2d6cdf; font-style: normal; font-size: 11px; }

.landing-cta { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 30px; padding: 38px 40px; margin: 0 0 90px; border-radius: 22px; color: #fff; background: linear-gradient(135deg, #172a46 0%, #214b72 100%); box-shadow: 0 24px 54px rgba(20, 38, 66, .16); }
.landing-cta h2 { margin: 7px 0 7px; color: #fff; font-size: clamp(26px, 3.4vw, 40px); letter-spacing: -.035em; }
.landing-cta p { margin: 0; color: rgba(255,255,255,.72); font-size: 16px; }
.landing-cta .eyebrow { color: #7ee5dc; }
.landing-cta .btn.secondary { color: #fff; border-color: rgba(255,255,255,.28); background: rgba(255,255,255,.08); }

.landing-reveal { opacity: 0; transform: translateY(16px); transition: opacity .55s ease, transform .55s ease; }
.landing-reveal.is-visible { opacity: 1; transform: translateY(0); }

[data-theme="dark"] .landing-badge,
[data-theme="dark"] .exam-preview,
[data-theme="dark"] .landing-stats-grid,
[data-theme="dark"] .landing-personal,
[data-theme="dark"] .landing-feature-grid article,
[data-theme="dark"] .subject-pills span { background: color-mix(in srgb, var(--surface, #111c2d) 90%, transparent); }
[data-theme="dark"] .feature-icon { background: rgba(74, 132, 255, .13); color: #89adff; }
[data-theme="dark"] .exam-preview-save span { background: rgba(35, 167, 112, .16); }
[data-theme="dark"] .landing-cta { background: linear-gradient(135deg, #15243b 0%, #193c5d 100%); }

@media (max-width: 980px) {
  .landing-hero { grid-template-columns: 1fr; min-height: auto; padding-top: 58px; }
  .exam-preview { max-width: 680px; }
  .landing-stats-grid { grid-template-columns: repeat(2, 1fr); }
  .landing-stats-grid article:nth-child(2) { border-right: 0; }
  .landing-stats-grid article:nth-child(-n+2) { border-bottom: 1px solid var(--line, #d7e0eb); }
  .landing-feature-grid { grid-template-columns: repeat(2, 1fr); }
  .landing-flow { grid-template-columns: 1fr; gap: 20px; }
  .landing-personal { grid-template-columns: 1fr; }
  .landing-personal-stats { flex-wrap: wrap; }
}
@media (max-width: 680px) {
  .landing-hero { padding-top: 36px; }
  .landing-hero h1 { font-size: clamp(38px, 12vw, 56px); }
  .landing-trust-row { gap: 14px 20px; }
  .exam-preview { padding: 19px; border-radius: 18px; }
  .exam-preview h2 { font-size: 19px; }
  .landing-stats-grid, .landing-feature-grid { grid-template-columns: 1fr; }
  .landing-stats-grid article { border-right: 0; border-bottom: 1px solid var(--line, #d7e0eb); }
  .landing-stats-grid article:last-child { border-bottom: 0; }
  .landing-section { padding: 66px 0; }
  .landing-feature-grid article { min-height: 0; }
  .feature-icon { margin-bottom: 24px; }
  .landing-personal { padding: 22px; }
  .landing-personal-stats { display: grid; grid-template-columns: repeat(3, 1fr); }
  .landing-personal-stats span { min-width: 0; padding: 10px; }
  .landing-cta { grid-template-columns: 1fr; padding: 28px 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .landing-reveal { opacity: 1; transform: none; transition: none; }
  .landing-feature-grid article { transition: none; }
}

/* =========================================================
   v1.9.1 — Dark mode visibility and contrast correction
   Keeps the dynamic home page visually consistent in both themes.
   ========================================================= */
html[data-theme="light"]{
  --surface:var(--minimal-surface);
  --soft:var(--surface-2);
  --home-panel:#ffffff;
  --home-panel-soft:#f3f6fa;
  --home-panel-border:#dce4ee;
  --home-copy:#172332;
  --home-copy-muted:#65758a;
}
html[data-theme="dark"]{
  --surface:#111c2a;
  --soft:#1a2838;
  --home-panel:#111c2a;
  --home-panel-soft:#172536;
  --home-panel-border:#304258;
  --home-copy:#f1f6fc;
  --home-copy-muted:#b1bfd0;
}

/* Strong readable text on the public home page. */
.landing-hero h1,
.landing-section-intro h2,
.landing-feature-grid h3,
.landing-steps h3,
.landing-personal h2,
.exam-preview h2,
.landing-text-link,
.landing-trust-row b,
.landing-stats-grid strong,
.landing-personal-stats b,
.subject-pills span{
  color:var(--home-copy)!important;
}
.landing-hero-copy>p,
.landing-badge,
.landing-trust-row,
.exam-preview-label,
.exam-preview-meta,
.exam-preview-options div,
.landing-stats-grid span,
.landing-personal p,
.landing-personal-stats span,
.landing-section-intro p,
.landing-feature-grid p,
.landing-steps p{
  color:var(--home-copy-muted)!important;
}

/* Home page surfaces. */
.exam-preview,
.landing-stats-grid,
.landing-personal,
.landing-feature-grid article,
.subject-pills span,
.landing-badge{
  background:var(--home-panel)!important;
  border-color:var(--home-panel-border)!important;
}
.exam-preview{
  box-shadow:0 22px 54px rgba(5,14,26,.22)!important;
}

/* Exam simulator preview — fixed invisible timer and answer text. */
.exam-preview-timer{
  min-width:70px;
  text-align:center;
  background:var(--home-panel-soft)!important;
  color:var(--home-copy)!important;
  border:1px solid var(--home-panel-border);
}
.exam-preview-progress{
  background:var(--home-panel-soft)!important;
}
.exam-preview-options div{
  background:var(--home-panel-soft)!important;
  border-color:var(--home-panel-border)!important;
}
.exam-preview-options b{
  background:color-mix(in srgb,#2d6cdf 16%,var(--home-panel-soft))!important;
  color:color-mix(in srgb,#79a6ff 76%,var(--home-copy))!important;
  border:1px solid color-mix(in srgb,#5d8df0 32%,var(--home-panel-border));
}
.exam-preview-save{
  color:var(--minimal-success)!important;
}
.exam-preview-save span{
  background:color-mix(in srgb,var(--minimal-success) 18%,var(--home-panel-soft))!important;
  color:var(--minimal-success)!important;
}

/* Remaining dark-mode home controls and information blocks. */
html[data-theme="dark"] .landing-badge{
  color:#c7d3e1!important;
}
html[data-theme="dark"] .landing-badge i,
html[data-theme="dark"] .exam-preview-label i{
  background:#6f9fff;
  box-shadow:0 0 0 5px rgba(111,159,255,.15);
}
html[data-theme="dark"] .landing-stats-grid article,
html[data-theme="dark"] .landing-steps article{
  border-color:var(--home-panel-border)!important;
}
html[data-theme="dark"] .landing-personal-stats span{
  background:var(--home-panel-soft)!important;
  border:1px solid var(--home-panel-border);
}
html[data-theme="dark"] .feature-icon{
  background:#1b3152!important;
  color:#9bbaff!important;
  border:1px solid #2d4b75;
}
html[data-theme="dark"] .subject-pills i,
html[data-theme="dark"] .landing-steps article>b,
html[data-theme="dark"] .landing-text-link span{
  color:#8db0ff!important;
}
html[data-theme="dark"] .landing-feature-grid article:hover{
  border-color:#47658a!important;
  box-shadow:0 14px 34px rgba(0,0,0,.28)!important;
}
html[data-theme="dark"] .landing-cta p{
  color:#c1cedc!important;
}
html[data-theme="dark"] .landing-cta .btn.secondary{
  color:#f4f8fc!important;
  background:#223b58!important;
  border-color:#47617d!important;
}

@media(max-width:680px){
  .exam-preview-timer{min-width:64px;padding:7px 9px}
}

/* =========================================================
   v1.9.2 — Dark mode final visibility hotfix
   Explicit colours are used here to avoid browser/CDN variable
   caching and to guarantee readable simulator/personal cards.
   ========================================================= */
html[data-theme="dark"] .exam-preview-timer {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 72px !important;
  min-height: 36px !important;
  background: #1a2a3d !important;
  background-color: #1a2a3d !important;
  border: 1px solid #3a5069 !important;
  color: #f8fbff !important;
  -webkit-text-fill-color: #f8fbff !important;
  opacity: 1 !important;
  visibility: visible !important;
  text-shadow: none !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;
}

html[data-theme="dark"] .exam-preview-options > div {
  background: #18283a !important;
  background-color: #18283a !important;
  border-color: #344a63 !important;
  color: #e8eff8 !important;
  -webkit-text-fill-color: #e8eff8 !important;
  opacity: 1 !important;
}
html[data-theme="dark"] .exam-preview-options > div > span {
  color: #dce7f4 !important;
  -webkit-text-fill-color: #dce7f4 !important;
  opacity: 1 !important;
  visibility: visible !important;
}
html[data-theme="dark"] .exam-preview-options > div > b {
  background: #243a55 !important;
  background-color: #243a55 !important;
  border-color: #476582 !important;
  color: #a9c6ff !important;
  -webkit-text-fill-color: #a9c6ff !important;
  opacity: 1 !important;
}

html[data-theme="dark"] .landing-personal-stats > span {
  background: #18283a !important;
  background-color: #18283a !important;
  border: 1px solid #344a63 !important;
  color: #aebed0 !important;
  -webkit-text-fill-color: #aebed0 !important;
  opacity: 1 !important;
  box-shadow: none !important;
}
html[data-theme="dark"] .landing-personal-stats > span > b {
  color: #f5f8fc !important;
  -webkit-text-fill-color: #f5f8fc !important;
  opacity: 1 !important;
}

/* Light mode remains crisp and neutral. */
html[data-theme="light"] .exam-preview-timer {
  background: #eef3f8 !important;
  border: 1px solid #d6e0eb !important;
  color: #172332 !important;
  -webkit-text-fill-color: #172332 !important;
}
html[data-theme="light"] .exam-preview-options > div {
  background: #f7f9fc !important;
  border-color: #dce4ee !important;
}
html[data-theme="light"] .exam-preview-options > div > span {
  color: #5e6f84 !important;
  -webkit-text-fill-color: #5e6f84 !important;
}
html[data-theme="light"] .landing-personal-stats > span {
  background: #f3f6fa !important;
  border: 1px solid #dce4ee !important;
  color: #65758a !important;
}


/* =========================================================
   v2.0.0 — Profile menu and My Account
   ========================================================= */
.profile-menu{position:relative;flex:0 0 auto}
.profile-menu>summary{list-style:none;display:flex;align-items:center;gap:9px;min-height:42px;padding:4px 9px 4px 5px;border:1px solid rgba(255,255,255,.18);border-radius:12px;background:rgba(255,255,255,.09);color:var(--header-text);cursor:pointer;user-select:none;transition:background .18s ease,border-color .18s ease}
.profile-menu>summary::-webkit-details-marker{display:none}.profile-menu>summary:hover{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.28)}
.profile-avatar{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(145deg,#4f8df7,#2d6cdf);color:#fff;font-size:.78rem;font-weight:900;box-shadow:0 4px 12px rgba(4,18,38,.24);letter-spacing:.02em}
.profile-avatar.large{width:46px;height:46px;border-radius:14px;font-size:1rem}.profile-summary-copy{display:grid;line-height:1.12;max-width:130px}.profile-summary-copy strong{font-size:.82rem;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-summary-copy small{font-size:.67rem;color:var(--header-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-chevron{font-size:.9rem;color:var(--header-muted);transition:transform .18s ease}.profile-menu[open] .profile-chevron{transform:rotate(180deg)}
.profile-dropdown{position:absolute;right:0;top:calc(100% + 10px);width:300px;padding:10px;border:1px solid var(--minimal-border);border-radius:16px;background:var(--minimal-surface);box-shadow:0 22px 54px rgba(5,18,35,.24);color:var(--text);z-index:80;animation:profileDrop .18s ease both}
@keyframes profileDrop{from{opacity:0;transform:translateY(-6px) scale(.985)}to{opacity:1;transform:none}}
.profile-dropdown-head{display:flex;gap:12px;align-items:center;padding:10px 10px 14px;border-bottom:1px solid var(--minimal-border)}.profile-dropdown-head>div{min-width:0;display:grid}.profile-dropdown-head strong{color:var(--text);font-size:.96rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-dropdown-head small{color:var(--muted);font-size:.76rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-dropdown-head em{font-style:normal;color:var(--minimal-primary);font-size:.73rem;font-weight:800}
.profile-dropdown-links{display:grid;padding:7px 0}.profile-dropdown-links>a{display:grid;grid-template-columns:30px 1fr;gap:8px;align-items:center;padding:9px 10px;border-radius:10px;color:var(--text)!important}.profile-dropdown-links>a:hover{background:var(--surface-2);text-decoration:none}.profile-dropdown-links>a>span{width:28px;height:28px;border-radius:8px;background:color-mix(in srgb,var(--minimal-primary) 11%,transparent);color:var(--minimal-primary);display:grid;place-items:center;font-size:.78rem;font-weight:900}.profile-dropdown-links a div{display:grid}.profile-dropdown-links strong{font-size:.85rem}.profile-dropdown-links small{font-size:.7rem;color:var(--muted)}
.profile-logout{display:flex;align-items:center;gap:9px;padding:10px;border-top:1px solid var(--minimal-border);color:#d34f5f!important;font-weight:800;font-size:.84rem}.profile-logout:hover{text-decoration:none;background:color-mix(in srgb,#d34f5f 8%,transparent);border-radius:10px}.profile-logout span{font-size:1rem}

.account-hero{margin-bottom:18px}.account-profile-card{display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;padding:24px;border:1px solid var(--minimal-border);border-radius:18px;background:var(--minimal-surface);box-shadow:var(--minimal-shadow)}.account-avatar{width:72px;height:72px;border-radius:20px;font-size:1.4rem}.account-identity h1{font-size:clamp(1.8rem,4vw,2.65rem);margin:0 0 4px;letter-spacing:-.03em}.account-identity p{margin:0;color:var(--muted)}.account-role-badge{display:inline-flex;margin-top:9px;padding:4px 9px;border-radius:999px;background:color-mix(in srgb,var(--minimal-primary) 10%,transparent);color:var(--minimal-primary);font-size:.72rem;font-weight:900}.account-completion{min-width:170px;display:grid;text-align:right}.account-completion strong{font-size:1.7rem}.account-completion span{font-size:.75rem;color:var(--muted)}.account-completion i{height:6px;margin-top:8px;background:var(--surface-3);border-radius:99px;overflow:hidden}.account-completion b{display:block;height:100%;background:var(--minimal-success);border-radius:99px}.account-subtitle{color:var(--muted);margin:12px 2px 0}
.account-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:0 0 18px}.account-stats article{padding:16px 18px;border:1px solid var(--minimal-border);border-radius:14px;background:var(--minimal-surface)}.account-stats span{display:block;color:var(--muted);font-size:.76rem}.account-stats strong{font-size:1.35rem}
.account-layout{display:grid;grid-template-columns:270px 1fr;gap:18px;align-items:start}.account-sidebar{position:sticky;top:92px;padding:20px!important}.account-sidebar dl{margin:5px 0 18px}.account-sidebar dl>div{display:flex;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px solid var(--minimal-border)}.account-sidebar dt{color:var(--muted);font-size:.75rem}.account-sidebar dd{margin:0;text-align:right;font-size:.78rem;font-weight:800}.account-quick-links{display:grid;gap:5px}.account-quick-links a{padding:9px 10px;border-radius:9px;color:var(--text);font-size:.82rem;font-weight:800}.account-quick-links a:hover{background:var(--surface-2);text-decoration:none}.account-panels{display:grid;gap:18px}.account-panel{scroll-margin-top:90px}.account-panel-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.account-panel-heading h2{margin:0;font-size:1.25rem}.account-form-two{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-grid small{display:block;color:var(--muted);font-weight:500;font-size:.74rem;line-height:1.4}.input-prefix{display:grid;grid-template-columns:auto 1fr;align-items:center;border:1px solid #cbd6e2;border-radius:10px;background:var(--input);overflow:hidden}.input-prefix>span{padding:0 0 0 12px;color:var(--muted);font-weight:900}.input-prefix input{border:0!important;border-radius:0!important;box-shadow:none!important}.input-prefix:focus-within{outline:3px solid rgba(45,108,223,.13);border-color:var(--minimal-primary)}.account-form-actions{display:flex;justify-content:flex-end}.account-panel button[disabled]{opacity:.5;cursor:not-allowed}
html[data-theme="dark"] .input-prefix{border-color:#394a5d}html[data-theme="dark"] .profile-dropdown{background:#111c2a}.site-footer .footer-version em{white-space:nowrap}
@media(max-width:1040px){.profile-summary-copy{display:none}.profile-menu>summary{padding-right:6px}.topbar-right{gap:7px}.topbar nav{gap:12px}}
@media(max-width:820px){.topbar{flex-wrap:wrap}.topbar-right{width:100%;justify-content:flex-end}.topbar nav{order:3;width:100%;justify-content:flex-end}.profile-menu{order:2}.account-layout{grid-template-columns:1fr}.account-sidebar{position:static}.account-quick-links{grid-template-columns:repeat(3,1fr)}}
@media(max-width:620px){.profile-dropdown{position:fixed;left:10px;right:10px;top:76px;width:auto}.account-profile-card{grid-template-columns:auto 1fr}.account-completion{grid-column:1/-1;min-width:0;text-align:left}.account-stats{grid-template-columns:1fr}.account-form-two{grid-template-columns:1fr}.account-quick-links{grid-template-columns:1fr}.topbar nav{overflow-x:auto;flex-wrap:nowrap;justify-content:flex-start;padding-bottom:2px}.topbar nav a{white-space:nowrap}}
@media(prefers-reduced-motion:reduce){.profile-dropdown{animation:none}.profile-chevron{transition:none}}

/* =========================================================
   v2.0.1 — Profile dropdown stacking and visibility fix
   Keeps the complete menu above the home hero/exam preview
   and prevents clipping on short screens.
   ========================================================= */
.topbar{
  z-index:1000!important;
  overflow:visible!important;
  isolation:isolate;
}
.topbar-right,
.profile-menu,
.profile-menu[open]{
  position:relative;
  z-index:1001;
  overflow:visible!important;
}
.profile-dropdown{
  z-index:1100!important;
  max-height:calc(100vh - 92px);
  max-height:calc(100dvh - 92px);
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:color-mix(in srgb,var(--minimal-primary) 42%,transparent) transparent;
}
.profile-dropdown::-webkit-scrollbar{width:7px}
.profile-dropdown::-webkit-scrollbar-track{background:transparent}
.profile-dropdown::-webkit-scrollbar-thumb{
  background:color-mix(in srgb,var(--minimal-primary) 38%,transparent);
  border-radius:999px;
}
.profile-menu-open .container,
.profile-menu-open .landing-shell,
.profile-menu-open .exam-preview{
  z-index:0!important;
}
@media(max-width:620px){
  .profile-dropdown{
    top:74px!important;
    max-height:calc(100vh - 88px);
    max-height:calc(100dvh - 88px);
  }
}

/* v2.0.2 — Mobile header layout fix */
@media (max-width: 820px) {
  .topbar {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-rows: auto auto auto;
    align-items: center !important;
    gap: 9px 10px !important;
    padding: 10px 14px 9px !important;
    min-height: auto !important;
  }

  .brand {
    grid-column: 1 / 3;
    grid-row: 1;
    min-width: 0;
    justify-self: start;
  }

  .brand-copy {
    min-width: 0;
  }

  .brand-copy strong {
    display: block;
    max-width: min(54vw, 250px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .topbar-right {
    display: contents !important;
  }

  .profile-menu {
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
    align-self: center;
    order: initial !important;
  }

  .profile-menu > summary {
    min-width: 44px;
    min-height: 44px;
    padding: 5px !important;
    justify-content: center;
    border-radius: 13px;
  }

  .profile-summary-copy,
  .profile-chevron {
    display: none !important;
  }

  .profile-avatar {
    width: 34px;
    height: 34px;
    border-radius: 10px;
  }

  .theme-toggle {
    grid-column: 1;
    grid-row: 2;
    justify-self: start;
    width: 44px !important;
    min-width: 44px;
    height: 42px;
    padding: 5px !important;
  }

  .language-control {
    grid-column: 2 / 4;
    grid-row: 2;
    width: 100%;
    min-width: 0;
    height: 42px;
    justify-content: flex-start;
    padding: 5px 10px !important;
  }

  .language-control > span {
    display: grid !important;
    flex: 0 0 25px;
  }

  .language-control select {
    width: 100%;
    max-width: none !important;
    min-width: 0;
  }

  .topbar nav {
    grid-column: 1 / 4;
    grid-row: 3;
    width: 100% !important;
    order: initial !important;
    display: flex;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    gap: 16px !important;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 4px 1px 2px;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
  }

  .topbar nav::-webkit-scrollbar {
    display: none;
  }

  .topbar nav a {
    flex: 0 0 auto;
    white-space: nowrap;
    font-size: .86rem;
    line-height: 1.2;
    padding: 3px 0 6px;
  }

  .profile-dropdown {
    position: fixed !important;
    top: 66px !important;
    right: 10px !important;
    left: 10px !important;
    width: auto !important;
    max-width: none !important;
    max-height: calc(100dvh - 82px) !important;
  }
}

@media (max-width: 480px) {
  .topbar {
    grid-template-columns: auto minmax(0, 1fr) auto;
    padding-inline: 12px !important;
  }

  .brand-mark {
    width: 40px !important;
    height: 40px !important;
    flex-basis: 40px !important;
    border-radius: 12px !important;
  }

  .brand-copy strong {
    max-width: 48vw;
    font-size: .82rem !important;
  }

  .brand-copy small {
    display: none !important;
  }

  .theme-text {
    display: none !important;
  }

  .container {
    width: min(100% - 24px, 1180px) !important;
  }
}

@media (max-width: 370px) {
  .brand-copy {
    display: none !important;
  }

  .brand {
    grid-column: 1;
  }

  .theme-toggle {
    grid-column: 1;
  }

  .language-control {
    grid-column: 2 / 4;
  }
}


/* =========================================================
   v2.1.0 — One-way Japanese learning translator
   Japanese input only; English/Sinhala output; typing only.
   ========================================================= */
@media (min-width: 1181px) {
  .exam-shell {
    grid-template-columns: 230px minmax(0, 1fr) 330px !important;
    gap: 20px !important;
  }
}

.translator-tool {
  position: sticky;
  top: 90px;
  min-width: 0;
  padding: 18px;
  border: 1px solid var(--minimal-border, var(--line));
  border-radius: 16px;
  background: var(--minimal-surface, var(--card));
  box-shadow: 0 10px 28px rgba(17, 35, 58, .07);
}
.translator-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 15px;
}
.translator-heading h2 {margin: 2px 0 0;font-size: 1.12rem;letter-spacing: -.02em}
.translator-kicker {
  display: block;
  color: var(--teal);
  font-size: .67rem;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.translator-question-chip {
  flex: 0 0 auto;
  padding: 5px 8px;
  border-radius: 999px;
  background: var(--surface-2, #f1f5f9);
  color: var(--muted);
  font-size: .68rem;
  font-weight: 800;
}
.translation-direction {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1.25fr);
  align-items: stretch;
  gap: 7px;
  margin-bottom: 15px;
}
.language-lock {
  display: grid;
  align-content: center;
  gap: 1px;
  min-width: 0;
  padding: 8px 9px;
  border: 1px solid var(--minimal-border, var(--line));
  border-radius: 10px;
  background: var(--surface-2, #f5f7fa);
}
.language-lock b {font-family:"Noto Sans JP",sans-serif;font-size:.84rem}
.language-lock small {color:var(--muted);font-size:.58rem;white-space:nowrap}
.direction-arrow {align-self:center;color:var(--muted);font-weight:900}
.target-switch {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3px;
  padding: 3px;
  border: 1px solid var(--minimal-border, var(--line));
  border-radius: 10px;
  background: var(--surface-2, #f5f7fa);
}
.target-switch label {min-width:0;cursor:pointer}
.target-switch input {position:absolute;opacity:0;pointer-events:none}
.target-switch span {
  display:flex;
  height:100%;
  min-height:34px;
  align-items:center;
  justify-content:center;
  padding:5px 6px;
  border-radius:7px;
  color:var(--muted);
  font-size:.68rem;
  font-weight:850;
  white-space:nowrap;
}
.target-switch input:checked + span {
  background: var(--minimal-primary, #2d6cdf);
  color:#fff;
  box-shadow:0 2px 8px rgba(45,108,223,.2);
}
.translator-input-label {display:block;margin-bottom:7px;font-size:.76rem;font-weight:850}
.translator-input-wrap {position:relative}
.translator-input-wrap textarea {
  width:100%;
  resize:vertical;
  min-height:118px;
  max-height:230px;
  padding:12px 12px 30px;
  border:1px solid var(--minimal-border, var(--line));
  border-radius:12px;
  background:var(--input, #fff);
  color:var(--text);
  font-family:"Noto Sans JP","Yu Gothic",sans-serif;
  font-size:1rem;
  line-height:1.65;
  transition:border-color .18s ease, box-shadow .18s ease;
}
.translator-input-wrap textarea:focus {
  outline:0;
  border-color:var(--minimal-primary, #2d6cdf);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--minimal-primary, #2d6cdf) 14%,transparent);
}
.translator-counter {position:absolute;right:10px;bottom:8px;color:var(--muted);font-size:.64rem;font-weight:800}
.translator-restrictions {display:flex;flex-wrap:wrap;gap:5px;margin:8px 0 12px}
.translator-restrictions span {
  padding:4px 7px;
  border-radius:999px;
  background:var(--surface-2, #f3f6f9);
  color:var(--muted);
  font-size:.6rem;
  font-weight:750;
}
.translator-submit {min-height:42px}
.translator-submit[disabled] {opacity:.6;cursor:wait}
.translator-status {min-height:20px;margin:8px 2px 0;font-size:.7rem;color:var(--muted)}
.translator-status.error {color:#c34343}
.translator-status.warning {color:#9b6a11}
.translator-status.loading {color:var(--minimal-primary, #2d6cdf)}
.translator-status.success{color:#16834a;font-weight:800}
.translator-result {
  margin-top:10px;
  padding:12px;
  border:1px solid color-mix(in srgb,var(--teal) 34%,var(--minimal-border, var(--line)));
  border-radius:12px;
  background:color-mix(in srgb,var(--teal) 7%,var(--minimal-surface, #fff));
  user-select:none;
  -webkit-user-select:none;
}
.translator-result small {display:block;margin-bottom:5px;color:var(--teal);font-size:.64rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
.translator-result p {margin:0;font-size:.9rem;line-height:1.65;overflow-wrap:anywhere}
.translator-note {margin:11px 1px 0;color:var(--muted);font-size:.64rem;line-height:1.45}

html[data-theme="dark"] .translator-tool {box-shadow:0 12px 32px rgba(0,0,0,.2)}
html[data-theme="dark"] .translator-result {background:rgba(38,190,181,.07)}

@media (max-width: 1180px) and (min-width: 901px) {
  .exam-shell {grid-template-columns:230px minmax(0,1fr)!important}
  .translator-tool {grid-column:2;position:relative;top:0;margin-top:0}
}
@media (max-width: 900px) {
  .translator-tool {position:relative;top:0;order:3;margin-top:0}
}
@media (max-width: 520px) {
  .translator-tool {padding:15px;border-radius:14px}
  .translation-direction {grid-template-columns:1fr auto 1.4fr}
  .translator-heading {align-items:center}
  .translator-heading h2 {font-size:1rem}
  .target-switch span {font-size:.63rem;padding-inline:4px}
}

/* =========================================================
   v2.1.1 — Translator layout + cache refresh fix
   Keeps the translator as a separate right-side study panel on
   wide screens and below the question on medium/mobile screens.
   ========================================================= */
.container.exam-container{
  width:min(1480px,calc(100% - 32px));
  max-width:none;
}
.exam-container .exam-shell{
  display:grid;
  grid-template-areas:"sidebar main translator";
  grid-template-columns:230px minmax(0,1fr) 320px;
  gap:20px;
  align-items:start;
}
.exam-container .exam-sidebar{grid-area:sidebar}
.exam-container .exam-main{grid-area:main}
.exam-container .translator-tool{
  grid-area:translator;
  width:100%;
  max-width:320px;
  align-self:start;
  overflow:hidden;
}
.exam-container .translator-heading,
.exam-container .translation-direction,
.exam-container .translator-restrictions{
  min-width:0;
}
.exam-container .translator-tool *{max-width:100%}

@media (max-width:1280px) and (min-width:901px){
  .container.exam-container{width:min(1120px,calc(100% - 28px))}
  .exam-container .exam-shell{
    grid-template-areas:
      "sidebar main"
      "sidebar translator";
    grid-template-columns:220px minmax(0,1fr);
    gap:18px;
  }
  .exam-container .translator-tool{
    position:relative;
    top:auto;
    max-width:none;
    margin-top:0;
  }
}

@media (max-width:900px){
  .container.exam-container{width:min(100% - 18px,760px)}
  .exam-container .exam-shell{
    grid-template-areas:
      "main"
      "translator"
      "sidebar";
    grid-template-columns:minmax(0,1fr);
    gap:16px;
  }
  .exam-container .exam-sidebar,
  .exam-container .translator-tool{
    position:relative;
    top:auto;
    max-width:none;
    width:100%;
  }
  .exam-container .translator-tool{order:initial}
}

@media (max-width:520px){
  .exam-container .translator-tool{padding:16px}
  .exam-container .translation-direction{
    grid-template-columns:1fr;
    gap:8px;
  }
  .exam-container .direction-arrow{
    transform:rotate(90deg);
    justify-self:center;
    height:22px;
  }
  .exam-container .target-switch{min-width:0}
}


/* =========================================================
   v2.2.0 — Official logo and favicon integration
   Full wordmark in website header; icon-only browser favicon.
   ========================================================= */
.brand-logo-link{
  display:flex!important;
  align-items:center;
  min-width:0;
  padding:0;
  line-height:1;
}
.brand-logo-wordmark{
  display:block;
  width:clamp(205px,20vw,300px);
  height:46px;
  object-fit:contain;
  object-position:left center;
  filter:drop-shadow(0 2px 5px rgba(0,0,0,.16));
}
.brand-logo-link:hover{opacity:.96;text-decoration:none}

@media(max-width:820px){
  .brand-logo-link{
    grid-column:1 / 3!important;
    grid-row:1!important;
    max-width:calc(100vw - 92px);
  }
  .brand-logo-wordmark{
    width:clamp(158px,46vw,225px);
    height:42px;
  }
}
@media(max-width:480px){
  .brand-logo-wordmark{
    width:min(48vw,185px);
    min-width:145px;
    height:40px;
  }
}
@media(max-width:370px){
  .brand-logo-link{
    grid-column:1 / 3!important;
    display:flex!important;
  }
  .brand-logo-wordmark{
    width:140px;
    min-width:140px;
    height:38px;
  }
}


/* v2.2.0 refinement — preserve the exact supplied wordmark on the dark header. */
.brand-logo-link{
  background:rgba(255,255,255,.98)!important;
  border:1px solid rgba(255,255,255,.72)!important;
  border-radius:12px!important;
  padding:4px 8px!important;
  box-shadow:0 5px 16px rgba(0,0,0,.18)!important;
}
.brand-logo-wordmark{
  filter:none!important;
  height:38px!important;
}
@media(max-width:820px){
  .brand-logo-link{padding:3px 6px!important;border-radius:10px!important}
  .brand-logo-wordmark{height:35px!important}
}
@media(max-width:480px){
  .brand-logo-wordmark{height:33px!important}
}


/* =========================================================
   v2.2.1 — Clean brand lockup and readable result metrics
   ========================================================= */
.brand-logo-link{
  display:inline-flex!important;
  align-items:center!important;
  gap:10px!important;
  width:auto!important;
  max-width:none!important;
  min-width:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
  filter:none!important;
}
.brand-logo-icon{
  width:42px!important;
  height:42px!important;
  flex:0 0 42px!important;
  display:block!important;
  border-radius:13px!important;
  box-shadow:0 5px 14px rgba(0,0,0,.22)!important;
}
.brand-wordmark-copy{
  display:grid!important;
  gap:0!important;
  min-width:0!important;
  line-height:1.02!important;
  white-space:nowrap!important;
}
.brand-wordmark-copy strong{
  color:var(--header-text)!important;
  font-size:.94rem!important;
  font-weight:650!important;
  letter-spacing:-.015em!important;
}
.brand-wordmark-copy strong b{
  font-size:1.16rem!important;
  font-weight:900!important;
  letter-spacing:-.045em!important;
  margin-right:4px!important;
}
.brand-wordmark-copy small{
  color:var(--header-accent)!important;
  font-size:.68rem!important;
  font-weight:800!important;
  letter-spacing:.055em!important;
  text-transform:uppercase!important;
}

/* Result summary cards: maintain high contrast on both pass/retry backgrounds. */
.result-hero .result-stats>div,
.result-hero .result-stats>div.liquid-surface{
  background:rgba(5,18,30,.24)!important;
  border:1px solid rgba(255,255,255,.24)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 8px 20px rgba(0,0,0,.10)!important;
  color:#fff!important;
  backdrop-filter:blur(5px)!important;
  -webkit-backdrop-filter:blur(5px)!important;
}
.result-hero .result-stats strong{
  color:#fff!important;
  opacity:1!important;
  text-shadow:0 1px 3px rgba(0,0,0,.22)!important;
}
.result-hero .result-stats span{
  color:rgba(255,255,255,.86)!important;
  opacity:1!important;
}
.result-hero.retry .result-stats>div{background:rgba(78,17,12,.28)!important}
.result-hero.pass .result-stats>div{background:rgba(6,58,39,.28)!important}

@media(max-width:820px){
  .brand-logo-link{grid-column:1/3!important;grid-row:1!important;max-width:calc(100vw - 82px)!important}
  .brand-logo-icon{width:40px!important;height:40px!important;flex-basis:40px!important}
  .brand-wordmark-copy strong{font-size:.88rem!important}
  .brand-wordmark-copy strong b{font-size:1.08rem!important}
  .brand-wordmark-copy small{font-size:.62rem!important}
}
@media(max-width:480px){
  .brand-logo-link{gap:8px!important;max-width:calc(100vw - 78px)!important}
  .brand-logo-icon{width:38px!important;height:38px!important;flex-basis:38px!important;border-radius:12px!important}
  .brand-wordmark-copy strong{font-size:.80rem!important}
  .brand-wordmark-copy strong b{font-size:1rem!important}
  .brand-wordmark-copy small{font-size:.56rem!important}
  .result-hero{padding:24px!important}
  .result-stats{gap:9px!important}
  .result-hero .result-stats>div{padding:14px 8px!important}
}
@media(max-width:360px){
  .brand-wordmark-copy strong{font-size:.72rem!important}
  .brand-wordmark-copy strong b{font-size:.90rem!important}
  .brand-wordmark-copy small{font-size:.52rem!important}
}

/* v2.2.2 — Dark mode answer review card clarity */
html[data-theme="dark"] .review-list > h2{
  color:#f4f7fb;
}
html[data-theme="dark"] .review-card{
  background:linear-gradient(180deg,#121f2e 0%,#0d1824 100%)!important;
  border:1px solid #31455c!important;
  border-left-width:6px!important;
  color:#eef4fb!important;
  box-shadow:0 16px 38px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.025)!important;
}
html[data-theme="dark"] .review-card.correct{
  border-left-color:#42cf92!important;
}
html[data-theme="dark"] .review-card.incorrect{
  border-left-color:#ff7186!important;
}
html[data-theme="dark"] .review-card .question-top{
  color:#9fb1c6!important;
  border-bottom:1px solid rgba(153,177,204,.16);
  padding-bottom:10px;
  margin-bottom:15px;
}
html[data-theme="dark"] .review-card h3,
html[data-theme="dark"] .review-card .jp-question{
  color:#f7f9fc!important;
}
html[data-theme="dark"] .review-card rt{
  color:#a9bad0!important;
}
html[data-theme="dark"] .review-option{
  background:#172535!important;
  border-color:#34495f!important;
  color:#edf3f9!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.018);
}
html[data-theme="dark"] .review-option strong,
html[data-theme="dark"] .review-option .jp-option{
  color:#eef4fb!important;
}
html[data-theme="dark"] .review-option.correct-option{
  background:linear-gradient(90deg,rgba(35,139,96,.27),rgba(27,74,61,.30))!important;
  border-color:#42c98f!important;
  box-shadow:inset 0 0 0 1px rgba(66,201,143,.10);
}
html[data-theme="dark"] .review-option.correct-option > span:not(.jp-option){
  color:#72e4ae!important;
}
html[data-theme="dark"] .review-option.wrong-option{
  background:linear-gradient(90deg,rgba(159,58,72,.28),rgba(82,35,45,.28))!important;
  border-color:#e16f7f!important;
}
html[data-theme="dark"] .review-option.wrong-option > em{
  color:#ffadb8!important;
}
html[data-theme="dark"] .review-option em{
  color:#c5d0dd!important;
}
html[data-theme="dark"] .unanswered-note{
  color:#ff8093!important;
}
html[data-theme="dark"] .explanation{
  background:linear-gradient(180deg,#29271d,#232119)!important;
  border-color:#806b35!important;
  color:#f2ead8!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}
html[data-theme="dark"] .explanation strong{
  color:#f3c85f!important;
}
html[data-theme="dark"] .review-card + .review-card{
  margin-top:18px;
}

@media(max-width:620px){
  html[data-theme="dark"] .review-card{padding:18px!important;border-radius:14px!important}
  html[data-theme="dark"] .review-option{padding:11px!important}
}


/* =========================================================
   v2.3.0 — Paper ratings, reviews and comments
   ========================================================= */
.feedback-stars{display:inline-flex;gap:1px;color:#cbd5e1;line-height:1;letter-spacing:0}
.feedback-stars span{font-size:1rem}.feedback-stars span.filled{color:#f4a61d}
.feedback-stars.large span{font-size:1.35rem}.feedback-stars.compact span{font-size:.82rem}
.paper-feedback-link{display:flex;align-items:center;gap:6px;margin:11px 0 13px;padding:9px 10px;border:1px solid var(--border);border-radius:10px;background:var(--soft);color:var(--muted);text-decoration:none;min-width:0}
.paper-feedback-link:hover{border-color:var(--primary);transform:translateY(-1px);text-decoration:none}.paper-feedback-link strong{color:var(--text);font-size:.9rem}.paper-feedback-link small{margin-left:auto;white-space:nowrap;font-size:.72rem;color:var(--muted)}
.feedback-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:28px;margin-bottom:14px}.feedback-hero h1{margin:.25rem 0 .5rem}.feedback-hero p{margin:0;max-width:680px}
.feedback-summary-box{min-width:205px;padding:18px;border:1px solid var(--border);border-radius:14px;background:var(--soft);text-align:center}.feedback-score{font-size:2.3rem;font-weight:850;color:var(--text);line-height:1}.feedback-summary-box>span:last-child{display:block;margin-top:8px;color:var(--muted);font-size:.84rem}
.feedback-top-actions{margin-bottom:18px}.feedback-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:20px;align-items:start}.feedback-main,.feedback-sidebar{display:grid;gap:20px}.feedback-sidebar{position:sticky;top:92px}
.feedback-section{padding:22px}.feedback-section .card-heading,.feedback-admin-table+.card-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:15px}.feedback-section .card-heading h2{margin:.18rem 0 0}.feedback-section .card-heading>strong{font-size:1.25rem;color:var(--muted)}
.feedback-empty,.feedback-notice{padding:18px;border:1px dashed var(--border);border-radius:12px;color:var(--muted);background:var(--soft)}
.review-feed,.comment-feed{display:grid;gap:14px}.community-review{position:relative;padding:18px;border:1px solid var(--border);border-radius:14px;background:var(--card)}.community-review header{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:11px;align-items:center}.community-review header>div:nth-child(2){display:grid}.community-review header small{color:var(--muted);font-size:.75rem}.community-review time{color:var(--muted);font-size:.75rem}.community-rating{display:flex;gap:8px;align-items:center;margin:13px 0 7px}.community-rating b{font-size:.8rem;color:var(--muted)}.community-review h3{font-size:1rem;margin:6px 0}.community-review p{margin:6px 0 0;line-height:1.65;white-space:normal}.own-feedback-badge{display:inline-block;margin-top:12px;padding:4px 8px;border-radius:999px;background:rgba(31,111,235,.1);color:var(--primary);font-size:.72rem;font-weight:700}
.feedback-avatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#2f6fea,#29b8c8);color:#fff;font-weight:850;box-shadow:0 5px 13px rgba(33,96,181,.22)}.feedback-avatar.small{width:34px;height:34px;font-size:.75rem}
.rating-breakdown,.write-review{padding:20px}.rating-breakdown h2,.write-review h2{font-size:1.05rem;margin:0 0 15px}.rating-row{display:grid;grid-template-columns:34px 1fr 25px;gap:8px;align-items:center;margin:9px 0;font-size:.8rem;color:var(--muted)}.rating-row>div{height:7px;border-radius:99px;background:var(--soft);overflow:hidden}.rating-row i{display:block;height:100%;background:#f4a61d;border-radius:inherit}.rating-row b{text-align:right}
.write-review form{display:grid;gap:13px}.write-review fieldset{border:0;padding:0;margin:0}.write-review legend{font-weight:700;margin-bottom:7px}.star-picker{display:inline-flex;flex-direction:row-reverse;justify-content:flex-end;gap:3px}.star-picker input{position:absolute;opacity:0;pointer-events:none}.star-picker label{cursor:pointer;color:#cbd5e1;font-size:2rem;line-height:1;transition:color .15s ease,transform .15s ease}.star-picker label:hover,.star-picker label:hover~label,.star-picker input:checked~label{color:#f4a61d}.star-picker label:hover{transform:scale(1.08)}.write-review textarea{min-height:145px;resize:vertical}.delete-review-form{margin-top:10px}
.comment-form{padding:14px;margin-bottom:16px;border:1px solid var(--border);border-radius:13px;background:var(--soft)}.comment-form textarea{min-height:90px;resize:vertical}.comment-form .form-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:9px}.comment-form small{color:var(--muted)}
.community-comment{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:11px;align-items:start;padding:14px;border:1px solid var(--border);border-radius:13px;background:var(--card)}.comment-body header{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.comment-body header span{padding:2px 6px;border-radius:999px;background:rgba(31,111,235,.1);color:var(--primary);font-size:.66rem;font-weight:700}.comment-body time{margin-left:auto;color:var(--muted);font-size:.72rem}.comment-body p{margin:7px 0 0;line-height:1.55}.text-danger{border:0;background:none;color:#dc3545;cursor:pointer;font-weight:700;padding:4px}.text-danger:hover{text-decoration:underline}
.status.hidden{background:#f1f5f9;color:#475569}.status.published{background:#dcfce7;color:#166534}.moderation-actions{display:flex;gap:6px;flex-wrap:wrap}.moderation-actions form{margin:0}.feedback-admin-table td:nth-child(4){min-width:280px;max-width:520px;white-space:normal}.btn.danger{background:#c43d4f;color:#fff;border-color:#c43d4f}.btn.danger:hover{background:#ab2f40}
html[data-theme="dark"] .feedback-stars{color:#45566c}html[data-theme="dark"] .paper-feedback-link,html[data-theme="dark"] .feedback-summary-box,html[data-theme="dark"] .feedback-notice,html[data-theme="dark"] .feedback-empty,html[data-theme="dark"] .comment-form{background:#142131}html[data-theme="dark"] .community-review,html[data-theme="dark"] .community-comment{background:#101c29;border-color:#304157}html[data-theme="dark"] .status.hidden{background:#263548;color:#c7d2df}html[data-theme="dark"] .status.published{background:#173b2d;color:#8fe5b8}
@media(max-width:900px){.feedback-layout{grid-template-columns:1fr}.feedback-sidebar{position:static;grid-template-columns:1fr 1fr}.feedback-hero{align-items:flex-start}.paper-feedback-link small{white-space:normal;text-align:right}}
@media(max-width:620px){.feedback-hero{display:grid;padding:20px}.feedback-summary-box{min-width:0;width:100%}.feedback-sidebar{grid-template-columns:1fr}.community-review header{grid-template-columns:auto minmax(0,1fr)}.community-review time{grid-column:2}.community-comment{grid-template-columns:auto minmax(0,1fr)}.community-comment>form{grid-column:2}.comment-body time{width:100%;margin-left:0}.paper-feedback-link{flex-wrap:wrap}.paper-feedback-link small{width:100%;margin-left:0;text-align:left}.feedback-admin-table{min-width:950px}}


/* =========================================================
   v2.3.1 — Feedback form layout and visual polish
   ========================================================= */
.feedback-layout{
  grid-template-columns:minmax(0,1fr) minmax(340px,370px);
  gap:22px;
}
.feedback-sidebar{min-width:0}
.write-review,.comment-form{overflow:hidden}
.write-review form{display:grid;gap:15px;min-width:0}
.feedback-field{
  display:grid;
  gap:8px;
  min-width:0;
  width:100%;
  color:var(--text);
  font-size:.82rem;
  font-weight:800;
}
.feedback-field>span{
  display:block;
  line-height:1.35;
  color:var(--text);
}
.feedback-field input,
.feedback-field textarea{
  display:block;
  width:100%;
  min-width:0;
  max-width:100%;
  border:1px solid var(--line);
  border-radius:11px;
  padding:12px 13px;
  background:var(--input);
  color:var(--text);
  font:inherit;
  font-size:.92rem;
  font-weight:500;
  line-height:1.5;
  box-shadow:inset 0 1px 2px rgba(15,23,42,.03);
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.feedback-field input::placeholder,
.feedback-field textarea::placeholder{color:var(--muted);opacity:.78}
.feedback-field input:focus,
.feedback-field textarea:focus{
  outline:none;
  border-color:var(--minimal-primary,#2f6fea);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--minimal-primary,#2f6fea) 15%,transparent);
}
.feedback-field textarea{resize:vertical}
.comment-field textarea{min-height:112px}
.write-review .feedback-field textarea{min-height:170px}
.field-counter{
  justify-self:end;
  margin-top:-3px;
  color:var(--muted);
  font-size:.72rem;
  font-weight:700;
}
.comment-form{
  display:grid;
  gap:12px;
  padding:16px;
}
.comment-form .form-footer{
  margin-top:0;
  padding-top:2px;
}
.comment-form .btn{min-width:138px}
.feedback-submit{margin-top:1px}
.write-review fieldset{
  padding:12px 13px 10px;
  border:1px solid var(--line);
  border-radius:11px;
  background:var(--soft);
}
.write-review legend{
  padding:0 5px;
  color:var(--text);
  font-size:.82rem;
  font-weight:800;
}
.star-picker{padding-top:2px}
.star-picker label{font-size:2.15rem;filter:drop-shadow(0 1px 0 rgba(255,255,255,.35))}
html[data-theme="dark"] .feedback-field input,
html[data-theme="dark"] .feedback-field textarea{
  background:#0f1b28;
  border-color:#35475b;
  color:#edf3fa;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}
html[data-theme="dark"] .feedback-field input:focus,
html[data-theme="dark"] .feedback-field textarea:focus{
  border-color:#5f91ff;
  box-shadow:0 0 0 3px rgba(95,145,255,.14);
}
html[data-theme="dark"] .write-review fieldset{background:#142131;border-color:#35475b}
@media(max-width:1040px){
  .feedback-layout{grid-template-columns:1fr}
  .feedback-sidebar{position:static;grid-template-columns:minmax(0,1fr) minmax(300px,.8fr)}
  .write-review{grid-column:auto}
}
@media(max-width:720px){
  .feedback-sidebar{grid-template-columns:1fr}
  .feedback-section,.rating-breakdown,.write-review{padding:18px}
  .comment-form{padding:14px}
  .comment-form .form-footer{align-items:flex-end}
}
@media(max-width:460px){
  .comment-form .form-footer{display:grid;grid-template-columns:1fr}
  .comment-form .form-footer small{order:2}
  .comment-form .btn{width:100%}
  .star-picker label{font-size:1.95rem}
}


/* v2.4.0 — Google & Apple account login */
.social-login-divider{display:flex;align-items:center;gap:12px;margin:22px 0 16px;color:var(--muted,#64748b);font-size:.85rem}.social-login-divider:before,.social-login-divider:after{content:"";height:1px;flex:1;background:var(--border,#dbe3ee)}
.social-login-stack{display:grid;gap:10px}.google-signin-slot{min-height:44px;display:flex;justify-content:center;align-items:center;width:100%;overflow:hidden}.google-signin-slot>div{max-width:100%!important}.google-signin-slot.compact{min-height:40px;justify-content:flex-end}.social-login-button{min-height:44px;border-radius:10px;border:1px solid var(--border,#dbe3ee);display:flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;font-weight:700;padding:0 16px;transition:transform .16s ease,box-shadow .16s ease,background .16s ease}.social-login-button:hover{transform:translateY(-1px)}.social-login-button.apple{background:#050505;color:#fff;border-color:#050505}.social-login-button.apple:hover{background:#171717;color:#fff}.social-login-button.compact{min-height:40px;padding:0 14px}.apple-mark{font-size:1.35rem;line-height:1}.social-auth-status{min-height:20px;margin:10px 0 0;text-align:center;color:var(--muted,#64748b);font-size:.88rem}.social-auth-status.error{color:#dc2626}.social-login-note{margin-top:16px}
.connected-account-list{display:grid;gap:12px}.connected-account-row{display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:14px;padding:14px;border:1px solid var(--border,#dbe3ee);border-radius:14px;background:var(--surface-soft,#f8fafc)}.connected-account-row>div:nth-child(2){display:flex;min-width:0;flex-direction:column;gap:3px}.connected-account-row span{color:var(--muted,#64748b);font-size:.88rem;overflow:hidden;text-overflow:ellipsis}.provider-icon{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-size:1.2rem;font-weight:800;background:#fff;border:1px solid var(--border,#dbe3ee);color:#111827}.provider-icon.google{color:#4285f4}.provider-icon.apple{background:#050505;color:#fff;border-color:#050505}.provider-action{display:flex;justify-content:flex-end;min-width:150px}.btn.small{padding:8px 12px;min-height:38px}.oauth-check-list{display:grid;gap:10px}.oauth-check-list>div{display:flex;justify-content:space-between;gap:16px;padding:12px;border:1px solid var(--border,#dbe3ee);border-radius:10px}.oauth-check-list .ok{color:#059669;font-weight:800}.oauth-check-list .bad{color:#dc2626;font-weight:800}
[data-theme="dark"] .social-login-divider:before,[data-theme="dark"] .social-login-divider:after{background:#334155}[data-theme="dark"] .connected-account-row{background:#101b2b;border-color:#2b3a50}[data-theme="dark"] .provider-icon.google{background:#fff}
@media(max-width:720px){.connected-account-row{grid-template-columns:44px minmax(0,1fr)}.provider-action{grid-column:1/-1;min-width:0;justify-content:stretch}.provider-action>*{width:100%}.google-signin-slot.compact{justify-content:center}.social-login-button.compact{width:100%}}

/* v2.4.3 Google button diagnostics */
.google-setup-warning{margin:14px 0 4px;padding:13px 14px;border:1px solid color-mix(in srgb,#f59e0b 45%,var(--border));background:color-mix(in srgb,#f59e0b 10%,var(--surface));border-radius:12px;display:grid;gap:4px;color:var(--text)}
.google-setup-warning strong{font-size:.93rem}.google-setup-warning span{font-size:.82rem;color:var(--muted);line-height:1.45}.google-setup-warning code{font-size:.78rem}


/* v2.4.4 — polished Google sign-in */
.auth-card{max-width:520px;padding:30px 30px 28px;border-radius:18px}
.auth-card>h1{margin:0 0 24px;letter-spacing:-.035em}
.auth-card .form-grid{gap:16px}
.auth-card .form-grid>.btn.primary{min-height:46px;border-radius:11px;margin-top:2px}
.auth-card .muted{margin:16px 0 0;text-align:center}
.social-login-divider{display:flex;align-items:center;gap:13px;margin:20px 0 16px;color:var(--muted,#64748b);font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.social-login-divider:before,.social-login-divider:after{content:"";height:1px;flex:1;background:var(--border,#dbe3ee)}
.social-login-divider span{white-space:nowrap}
.social-login-stack{width:100%;display:grid;place-items:center}
.google-signin-shell{width:100%;min-height:48px;display:flex;align-items:center;justify-content:center}
.google-signin-slot{width:100%;min-height:44px;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:999px}
.google-signin-slot>div{max-width:100%!important}
.google-signin-slot iframe{display:block!important;max-width:100%!important;border-radius:999px!important}
.social-auth-status{min-height:18px;margin:9px 0 0;text-align:center;color:var(--muted,#64748b);font-size:.82rem}
.social-auth-status.error{color:#dc2626}
[data-theme="dark"] .social-login-divider:before,[data-theme="dark"] .social-login-divider:after{background:#2d3b50}
@media(max-width:600px){.auth-card{padding:24px 20px 22px;border-radius:16px}.auth-card>h1{font-size:2.15rem}.social-login-divider{margin-top:18px}.google-signin-shell{min-height:46px}}


/* v2.4.5 — refined authentication and Google sign-in layout */
.auth-card{
  width:min(100%,480px);
  max-width:480px;
  padding:32px 32px 28px;
  border-radius:20px;
}
.auth-card>h1{
  margin:0 0 26px;
  font-size:clamp(2.25rem,4vw,2.75rem);
  line-height:1;
  letter-spacing:-.045em;
}
.auth-card .form-grid{gap:17px}
.auth-card .form-grid label{display:grid;gap:8px}
.auth-card .form-grid input{
  min-height:46px;
  border-radius:11px;
}
.auth-card .form-grid>.btn.primary{
  min-height:48px;
  border-radius:11px;
  margin-top:2px;
  font-size:.95rem;
}
.social-auth-block{
  display:grid;
  gap:0;
  margin-top:23px;
}
.social-login-divider{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:13px;
  width:100%;
  margin:0 0 17px;
  color:var(--muted);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.075em;
  line-height:1;
  text-transform:uppercase;
}
.social-login-divider::before,
.social-login-divider::after{
  content:"";
  display:block;
  width:100%;
  height:1px;
  background:var(--line);
}
.social-login-divider span{
  display:block;
  white-space:nowrap;
  padding:0 2px;
}
.social-login-stack{
  display:flex;
  justify-content:center;
  width:100%;
}
.google-signin-shell{
  width:min(100%,400px);
  min-height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border-radius:10px;
}
.google-signin-slot{
  width:100%;
  min-height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border-radius:10px;
}
.google-signin-slot>div,
.google-signin-slot iframe{
  max-width:100%!important;
  border-radius:10px!important;
}
.social-auth-status{
  min-height:18px;
  margin:10px 0 0;
  text-align:center;
  color:var(--muted);
  font-size:.82rem;
}
.auth-switch-link{
  margin:18px 0 0!important;
  text-align:center;
}
html[data-theme="dark"] .social-login-divider::before,
html[data-theme="dark"] .social-login-divider::after{
  background:#2b3a4e;
}
@media(max-width:600px){
  .auth-card{padding:25px 20px 23px;border-radius:17px}
  .auth-card>h1{font-size:2.2rem;margin-bottom:22px}
  .social-auth-block{margin-top:21px}
  .social-login-divider{font-size:.68rem;gap:10px;margin-bottom:15px}
  .google-signin-shell{width:100%}
}


/* =========================================================
   v2.5.0 — Compact profile photo and avatar upload
   ========================================================= */
.compact-profile-menu{margin-left:4px}
.compact-profile-menu>summary{
  width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;
  padding:2px!important;border-radius:999px!important;justify-content:center!important;
  background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.22)!important;
  box-shadow:0 5px 14px rgba(2,12,27,.18);overflow:hidden;
}
.compact-profile-menu>summary:hover{background:rgba(255,255,255,.15)!important;border-color:rgba(255,255,255,.38)!important}
.profile-avatar{overflow:hidden;border-radius:50%!important;position:relative}
.profile-avatar img{width:100%;height:100%;display:block;object-fit:cover;object-position:center}
.profile-avatar b{display:grid;width:100%;height:100%;place-items:center;color:inherit;font:inherit}
.profile-avatar-button{width:38px!important;height:38px!important;box-shadow:none!important;border:2px solid rgba(255,255,255,.20)}
.profile-avatar.large{width:52px!important;height:52px!important;border-radius:50%!important}
.profile-dropdown-head .profile-avatar.large{flex:0 0 52px}

.account-avatar{width:84px!important;height:84px!important;border-radius:50%!important;font-size:1.45rem!important;box-shadow:0 10px 26px rgba(16,48,92,.18)}
.avatar-settings-grid{display:grid;grid-template-columns:120px minmax(0,1fr);gap:24px;align-items:center}
.avatar-preview-shell{width:104px;height:104px;position:relative;display:grid;place-items:center}
.avatar-preview-shell .account-avatar{width:104px!important;height:104px!important}
.avatar-camera-badge{position:absolute;right:1px;bottom:1px;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--minimal-primary);color:#fff;border:4px solid var(--minimal-surface);font-size:1.05rem;font-weight:900;box-shadow:0 5px 14px rgba(19,64,140,.24)}
.avatar-settings-copy h3{margin:0 0 5px;font-size:1.05rem}.avatar-settings-copy>p{margin:0 0 12px;color:var(--muted);font-size:.86rem;line-height:1.55}
.avatar-source-note{padding:9px 11px;border-radius:10px;background:color-mix(in srgb,var(--minimal-primary) 8%,transparent);color:var(--minimal-primary)!important;font-weight:700}
.avatar-upload-form{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.avatar-remove-form{margin-top:10px}
.avatar-file-picker{position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:9px 14px;border:1px solid var(--minimal-border);border-radius:10px;background:var(--surface-2);color:var(--text);font-size:.83rem;font-weight:800;cursor:pointer;transition:border-color .18s ease,background .18s ease}
.avatar-file-picker:hover{border-color:var(--minimal-primary);background:color-mix(in srgb,var(--minimal-primary) 6%,var(--surface-2))}.avatar-file-picker input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.avatar-file-picker.has-file{border-color:var(--minimal-success);color:var(--minimal-success)}
html[data-theme="dark"] .compact-profile-menu>summary{background:rgba(255,255,255,.07)!important}

@media(max-width:820px){
  .compact-profile-menu{grid-column:3!important;grid-row:1!important;justify-self:end!important;margin-left:0}
  .compact-profile-menu>summary{width:42px!important;height:42px!important;min-width:42px!important;min-height:42px!important}
  .profile-avatar-button{width:36px!important;height:36px!important}
}
@media(max-width:620px){
  .avatar-settings-grid{grid-template-columns:1fr;text-align:center;justify-items:center}.avatar-settings-copy{width:100%}.avatar-upload-form{justify-content:center}.avatar-remove-form{text-align:center}
  .account-profile-card{grid-template-columns:76px minmax(0,1fr)!important;gap:14px!important}.account-avatar{width:72px!important;height:72px!important}
}


/* =========================================================
   v2.6.0 — Profile photo cropper
   ========================================================= */
.crop-modal-open{overflow:hidden}
.avatar-edit-crop[hidden]{display:none!important}
.avatar-crop-modal{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;padding:20px;opacity:0;transition:opacity .18s ease}
.avatar-crop-modal.is-open{opacity:1}
.avatar-crop-backdrop{position:absolute;inset:0;background:rgba(2,10,23,.76);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.avatar-crop-dialog{position:relative;width:min(620px,100%);max-height:min(92vh,820px);overflow:auto;padding:24px;border:1px solid var(--minimal-border);border-radius:20px;background:var(--minimal-surface);box-shadow:0 28px 80px rgba(0,0,0,.35);transform:translateY(12px) scale(.985);transition:transform .18s ease}
.avatar-crop-modal.is-open .avatar-crop-dialog{transform:translateY(0) scale(1)}
.avatar-crop-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:6px}.avatar-crop-heading h2{margin:3px 0 0;font-size:1.35rem}
.avatar-crop-close{width:38px;height:38px;border:1px solid var(--minimal-border);border-radius:50%;background:var(--surface-2);color:var(--text);font-size:1.45rem;line-height:1;cursor:pointer}
.avatar-crop-help{margin:0 0 16px;color:var(--muted);font-size:.88rem;line-height:1.55}
.avatar-crop-stage{position:relative;width:min(100%,440px);aspect-ratio:1;margin:0 auto;overflow:hidden;border-radius:18px;background:#09111f;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.avatar-crop-stage canvas{width:100%;height:100%;display:block;touch-action:none;cursor:grab;user-select:none}.avatar-crop-stage canvas.is-dragging{cursor:grabbing}
.avatar-crop-ring{position:absolute;inset:8%;border:3px solid rgba(255,255,255,.96);border-radius:50%;box-shadow:0 0 0 999px rgba(0,0,0,.36),0 0 0 1px rgba(0,0,0,.15);pointer-events:none}
.avatar-crop-ring:before,.avatar-crop-ring:after{content:"";position:absolute;background:rgba(255,255,255,.35);pointer-events:none}.avatar-crop-ring:before{left:50%;top:0;bottom:0;width:1px}.avatar-crop-ring:after{top:50%;left:0;right:0;height:1px}
.avatar-crop-controls{display:grid;gap:13px;margin-top:18px}.avatar-crop-controls label{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:14px;color:var(--text);font-size:.83rem;font-weight:800}.avatar-crop-controls input[type=range]{width:100%;accent-color:var(--minimal-primary)}
.avatar-crop-tools{display:flex;gap:8px;flex-wrap:wrap}.avatar-crop-tools .btn{flex:1;min-width:118px}
.avatar-crop-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.avatar-crop-status{min-height:20px;margin:10px 0 0;color:var(--minimal-success);font-size:.8rem;font-weight:700;text-align:right}.avatar-crop-status.error{color:var(--danger,#d34c4c)}
html[data-theme="dark"] .avatar-crop-dialog{background:#111d2d;border-color:#304258}.avatar-crop-dialog .btn:focus-visible,.avatar-crop-close:focus-visible{outline:3px solid color-mix(in srgb,var(--minimal-primary) 38%,transparent);outline-offset:2px}
@media(max-width:620px){
  .avatar-crop-modal{padding:10px}.avatar-crop-dialog{padding:18px;border-radius:17px;max-height:96vh}.avatar-crop-heading h2{font-size:1.18rem}.avatar-crop-stage{width:min(100%,360px)}.avatar-crop-tools{display:grid;grid-template-columns:1fr 1fr}.avatar-crop-tools .btn:last-child{grid-column:1/-1}.avatar-crop-actions .btn{flex:1}.avatar-crop-controls label{grid-template-columns:1fr;gap:6px}
}
@media(prefers-reduced-motion:reduce){.avatar-crop-modal,.avatar-crop-dialog{transition:none!important}}


/* v2.7.0 — extra time and translator analytics */
.timer-tools{display:grid;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,255,255,.18)}
.timer-tools>span{font-size:.76rem;color:#d8e5f2;font-weight:700}
.timer-add-button{border:1px solid rgba(255,255,255,.26);background:rgba(255,255,255,.1);color:#fff;border-radius:9px;padding:7px 10px;font-weight:800;cursor:pointer;transition:background .18s ease,border-color .18s ease}
.timer-add-button:hover{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.42)}.timer-add-button:disabled{opacity:.48;cursor:not-allowed}
.tool-upgrade-note{color:#ffdca4!important;line-height:1.35}
.extra-time-dialog{max-width:480px}.extra-time-dialog>p{color:var(--muted);margin-top:0}.extra-time-meter{display:flex;justify-content:space-between;align-items:center;padding:13px 15px;margin:16px 0;border:1px solid var(--line);background:var(--surface-2);border-radius:12px}.extra-time-meter span{color:var(--muted);font-size:.86rem}.extra-time-meter strong{font-size:1.05rem}.extra-time-select-label{display:grid;gap:8px;font-weight:800}.extra-time-select-label select{width:100%;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);font:inherit}.extra-time-status{min-height:22px;color:var(--green);font-weight:750;font-size:.84rem}.extra-time-status.error{color:var(--red)}
.analytics-stat-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.result-stats{grid-template-columns:repeat(3,1fr)}
@media(min-width:1100px){.analytics-stat-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:720px){.analytics-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.result-stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:430px){.analytics-stat-grid{grid-template-columns:1fr 1fr}.metric-card{padding:14px}.metric-card strong{font-size:1.28rem}.extra-time-dialog{padding:20px}.extra-time-dialog .actions{display:grid;grid-template-columns:1fr 1fr}.extra-time-dialog .actions .btn{width:100%}}


/* =========================================================
   v2.8.0 — Clean multi-column footer and simplified header
   Progress Report remains available in the profile dropdown.
   ========================================================= */
.site-footer{
  margin-top:56px;
  background:linear-gradient(145deg,#071525 0%,#0d2035 58%,#142744 100%);
  border-top:1px solid rgba(112,199,214,.5);
  color:#f4f8fc;
}
.footer-inner.footer-grid{
  width:min(1180px,calc(100% - 36px));
  margin:0 auto;
  padding:42px 0 34px;
  display:grid;
  grid-template-columns:minmax(260px,1.65fr) minmax(145px,.75fr) minmax(155px,.8fr) minmax(220px,1.1fr);
  align-items:start;
  gap:42px;
}
.footer-brand-block{display:flex;flex-direction:column;align-items:flex-start;gap:9px;min-width:0}
.footer-brand-link{display:inline-flex;align-items:center;gap:11px;color:#fff!important;text-decoration:none}
.footer-brand-icon{width:42px;height:42px;display:block;flex:0 0 42px}
.footer-brand-link>span{display:flex;flex-direction:column;line-height:1.05}
.footer-brand-link strong{font-size:1rem;color:#fff!important}
.footer-brand-link small{font-size:.70rem;letter-spacing:.08em;text-transform:uppercase;color:#65d4dd!important;font-weight:800}
.footer-brand-block p{max-width:430px;margin:5px 0 2px;color:#b9c8d8;font-size:.88rem;line-height:1.65}
.footer-brand-block>span{color:#d5dfeb;font-size:.84rem}
.footer-brand-block>span b{color:#f1c35d}
.footer-brand-block>small{color:#8fa2b7;font-size:.73rem;line-height:1.5}
.footer-version{margin-top:5px;display:inline-flex!important;align-items:center;gap:6px;width:max-content;padding:5px 9px;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:rgba(255,255,255,.05);font-size:.68rem!important;color:#c8d5e3!important}
.footer-version em{font-style:normal;color:#67d6df;font-weight:800}
.footer-link-column h3,.footer-community-column h3{margin:4px 0 15px;color:#fff;font-size:.84rem;text-transform:uppercase;letter-spacing:.10em}
.footer-link-column nav{display:flex;flex-direction:column;gap:10px}
.footer-link-column a{position:relative;width:max-content;max-width:100%;color:#bac8d7!important;text-decoration:none;font-size:.86rem;font-weight:650;transition:color .18s ease,transform .18s ease}
.footer-link-column a::after{content:"";position:absolute;left:0;right:100%;bottom:-3px;height:1px;background:#64d0db;transition:right .18s ease}
.footer-link-column a:hover{color:#fff!important;transform:translateX(3px)}
.footer-link-column a:hover::after{right:0}
.footer-community-column p{margin:0 0 15px;color:#9fb0c3;font-size:.82rem;line-height:1.55}
.footer-contact-block{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:8px}
.footer-social{min-height:34px;padding:7px 11px;background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.15);font-size:.75rem}
.footer-social:hover{background:rgba(255,255,255,.12);border-color:rgba(101,211,221,.55);box-shadow:none;transform:translateY(-2px)}

html[data-theme="light"] .site-footer{background:linear-gradient(145deg,#0b1d32 0%,#112b45 62%,#173253 100%)}

@media(max-width:980px){
  .footer-inner.footer-grid{grid-template-columns:1.5fr 1fr 1fr;gap:32px}
  .footer-community-column{grid-column:1/-1}
}
@media(max-width:720px){
  .footer-inner.footer-grid{width:min(100% - 30px,620px);padding:34px 0 28px;grid-template-columns:1fr 1fr;gap:28px 24px}
  .footer-brand-block{grid-column:1/-1}
  .footer-community-column{grid-column:1/-1}
}
@media(max-width:460px){
  .footer-inner.footer-grid{grid-template-columns:1fr;gap:26px}
  .footer-brand-block,.footer-community-column{grid-column:auto}
  .footer-brand-block p{font-size:.84rem}
  .footer-link-column h3,.footer-community-column h3{margin-bottom:11px}
  .footer-contact-block{gap:7px}
}


/* ===== Notes Library v2.9.0 ===== */

.notes-page-main{max-width:1280px}
.notes-hero{position:relative;display:grid;grid-template-columns:1.15fr .85fr;gap:2rem;align-items:center;padding:2rem 0 1rem}
.notes-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.42rem .8rem;border-radius:999px;background:rgba(37,99,235,.12);border:1px solid rgba(37,99,235,.18);font-size:.76rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#2563eb}
[data-theme="dark"] .notes-badge{background:rgba(96,165,250,.16);border-color:rgba(96,165,250,.28);color:#93c5fd}
.notes-hero-copy h1{margin:.95rem 0 .75rem;font-size:clamp(2rem,3.6vw,3.4rem);line-height:1.06;letter-spacing:-.03em}
.notes-hero-copy p{max-width:62ch;color:var(--muted,#5b6472);font-size:1rem;line-height:1.75}
.notes-hero-meta{display:inline-flex;flex-direction:column;gap:.15rem;margin-top:1rem;padding:1rem 1.15rem;border-radius:20px;background:rgba(255,255,255,.7);border:1px solid rgba(15,23,42,.07);box-shadow:0 18px 40px rgba(15,23,42,.08);backdrop-filter:blur(12px)}
[data-theme="dark"] .notes-hero-meta{background:rgba(16,24,39,.62);border-color:rgba(148,163,184,.14);box-shadow:0 18px 40px rgba(0,0,0,.24)}
.notes-hero-meta span{font-weight:800}
.notes-hero-meta small,.notes-hero-hint{color:var(--muted,#5b6472)}
.notes-hero-art{position:relative;min-height:280px;display:grid;place-items:center;overflow:hidden;border-radius:32px;background:linear-gradient(135deg,rgba(37,99,235,.12),rgba(20,184,166,.10) 52%,rgba(124,58,237,.12));border:1px solid rgba(148,163,184,.16);box-shadow:0 24px 70px rgba(15,23,42,.10)}
[data-theme="dark"] .notes-hero-art{background:linear-gradient(135deg,rgba(37,99,235,.16),rgba(20,184,166,.10) 52%,rgba(124,58,237,.18));border-color:rgba(148,163,184,.12);box-shadow:0 24px 70px rgba(0,0,0,.30)}
.notes-art-layer{position:absolute;border-radius:999px;filter:blur(12px);opacity:.65}
.notes-layer-one{width:180px;height:180px;left:-25px;top:20px;background:rgba(59,130,246,.34)}
.notes-layer-two{width:220px;height:220px;right:-40px;bottom:-10px;background:rgba(20,184,166,.22)}
.notes-paper-stack{position:relative;width:220px;height:220px}
.notes-paper-card{position:absolute;inset:auto;left:50%;top:50%;width:160px;height:200px;border-radius:20px;background:rgba(255,255,255,.88);border:1px solid rgba(15,23,42,.08);box-shadow:0 16px 38px rgba(15,23,42,.12);transform-origin:center}
[data-theme="dark"] .notes-paper-card{background:rgba(17,24,39,.88);border-color:rgba(148,163,184,.12);box-shadow:0 18px 40px rgba(0,0,0,.32)}
.notes-paper-card::before,.notes-paper-card::after{content:"";position:absolute;left:18px;right:18px;border-radius:999px}
.notes-paper-card::before{top:22px;height:14px;background:linear-gradient(90deg,#2563eb,#8b5cf6)}
.notes-paper-card::after{top:52px;height:110px;background:repeating-linear-gradient(to bottom,rgba(148,163,184,.22) 0 10px,transparent 10px 22px)}
.card-a{transform:translate(-50%,-50%) rotate(-12deg) translate(-48px,6px)}
.card-b{transform:translate(-50%,-50%) rotate(5deg)}
.card-c{transform:translate(-50%,-50%) rotate(15deg) translate(50px,-8px)}
.notes-library-shell{display:grid;grid-template-columns:330px 1fr;gap:1.35rem;align-items:start;margin:1rem 0 2.5rem}
.notes-library-sidebar,.notes-viewer-panel{border-radius:28px;border:1px solid rgba(148,163,184,.14);background:rgba(255,255,255,.78);backdrop-filter:blur(12px);box-shadow:0 18px 45px rgba(15,23,42,.08)}
[data-theme="dark"] .notes-library-sidebar,[data-theme="dark"] .notes-viewer-panel{background:rgba(15,23,42,.75);border-color:rgba(148,163,184,.12);box-shadow:0 18px 45px rgba(0,0,0,.28)}
.notes-library-sidebar{padding:1.2rem}
.notes-sidebar-head h2,.notes-viewer-head h2{margin:0;font-size:1.2rem}
.notes-sidebar-head p,.notes-viewer-head p{margin:.45rem 0 0;color:var(--muted,#5b6472);line-height:1.7}
.notes-card-list{display:grid;gap:.9rem;margin-top:1rem}
.notes-switch-card{position:relative;text-align:left;padding:1rem 1rem 1rem 1.05rem;border-radius:22px;border:1px solid rgba(148,163,184,.18);background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(248,250,252,.92));box-shadow:0 12px 30px rgba(15,23,42,.05);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.notes-switch-card:hover{transform:translateY(-2px);box-shadow:0 18px 36px rgba(15,23,42,.09)}
.notes-switch-card.is-active{border-color:rgba(37,99,235,.38);box-shadow:0 18px 36px rgba(37,99,235,.14)}
[data-theme="dark"] .notes-switch-card{background:linear-gradient(180deg,rgba(17,24,39,.94),rgba(15,23,42,.9));border-color:rgba(148,163,184,.12);box-shadow:0 16px 34px rgba(0,0,0,.24)}
[data-theme="dark"] .notes-switch-card.is-active{border-color:rgba(96,165,250,.48);box-shadow:0 18px 38px rgba(37,99,235,.18)}
.notes-file-tag{display:inline-flex;margin-bottom:.55rem;padding:.28rem .58rem;border-radius:999px;font-size:.72rem;font-weight:800;letter-spacing:.04em;background:rgba(15,23,42,.06);color:#334155}
[data-theme="dark"] .notes-file-tag{background:rgba(148,163,184,.14);color:#cbd5e1}
.accent-blue .notes-file-tag{background:rgba(37,99,235,.12);color:#1d4ed8}
.accent-violet .notes-file-tag{background:rgba(124,58,237,.12);color:#7c3aed}
.accent-teal .notes-file-tag{background:rgba(20,184,166,.14);color:#0f766e}
[data-theme="dark"] .accent-blue .notes-file-tag{background:rgba(59,130,246,.16);color:#93c5fd}
[data-theme="dark"] .accent-violet .notes-file-tag{background:rgba(139,92,246,.16);color:#c4b5fd}
[data-theme="dark"] .accent-teal .notes-file-tag{background:rgba(20,184,166,.16);color:#99f6e4}
.notes-switch-card strong{display:block;font-size:1.02rem}
.notes-switch-card small{display:block;margin-top:.4rem;color:var(--muted,#5b6472);line-height:1.6}
.notes-page-count{display:inline-flex;margin-top:.75rem;font-size:.8rem;font-weight:700;color:#475569}
[data-theme="dark"] .notes-page-count{color:#cbd5e1}
.notes-viewer-panel{padding:1.2rem}
.notes-viewer-head{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;margin-bottom:1rem}
.notes-viewer-kicker{display:inline-flex;margin-bottom:.45rem;font-size:.76rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#2563eb}
.notes-viewer-actions{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:flex-end}
.notes-action{display:inline-flex;align-items:center;justify-content:center;padding:.88rem 1.08rem;border-radius:16px;font-weight:700;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.notes-action:hover{transform:translateY(-1px)}
.notes-action.primary{background:linear-gradient(135deg,#2563eb,#0ea5e9);color:#fff;box-shadow:0 12px 24px rgba(37,99,235,.22)}
.notes-action.secondary{background:rgba(255,255,255,.82);border:1px solid rgba(148,163,184,.18);color:#0f172a}
[data-theme="dark"] .notes-action.secondary{background:rgba(15,23,42,.82);border-color:rgba(148,163,184,.14);color:#e5e7eb}
.notes-viewer-stage{border-radius:24px;overflow:hidden;border:1px solid rgba(148,163,184,.16);background:rgba(255,255,255,.82);height:min(78vh,980px);min-height:560px}
[data-theme="dark"] .notes-viewer-stage{background:rgba(2,6,23,.82);border-color:rgba(148,163,184,.14)}
.notes-viewer-stage iframe{width:100%;height:100%;border:0;background:#fff}
@media (max-width: 1080px){
  .notes-hero,.notes-library-shell{grid-template-columns:1fr}
  .notes-hero-art{min-height:220px}
}
@media (max-width: 720px){
  .notes-viewer-head{flex-direction:column}
  .notes-viewer-actions{width:100%;justify-content:stretch}
  .notes-action{flex:1 1 220px}
  .notes-viewer-stage{min-height:70vh;height:70vh}
  .notes-library-sidebar,.notes-viewer-panel{border-radius:22px}
  .notes-switch-card{padding:.95rem}
}


/* ===== v2.9.1 — Centered mobile header navigation ===== */
@media (max-width: 820px) {
  .topbar nav {
    justify-content: flex-start !important;
    text-align: center;
    gap: clamp(15px, 4.4vw, 24px) !important;
    padding-inline: 0 !important;
  }

  /* Centers the full link group when it fits, while preserving horizontal
     scrolling on narrower phones where the group is wider than the screen. */
  .topbar nav a:first-child {
    margin-left: auto;
  }

  .topbar nav a:last-child {
    margin-right: auto;
  }
}


/* ===== Knowledge Base & Question References v3.0.0 ===== */
.knowledge-library-main,.knowledge-article-main{max-width:1280px}
.kb-hero,.article-hero{display:flex;justify-content:space-between;gap:2rem;align-items:center;padding:2rem 0 1.25rem}
.kb-hero h1,.article-hero h1{font-size:clamp(2rem,4vw,3.6rem);line-height:1.05;letter-spacing:-.035em;margin:.65rem 0}
.kb-hero p,.article-hero p{max-width:70ch;color:var(--muted);line-height:1.75}
.kb-hero-stat,.kb-reference-count{min-width:160px;text-align:center;padding:1.2rem;border-radius:24px;background:linear-gradient(145deg,rgba(37,99,235,.12),rgba(20,184,166,.10));border:1px solid rgba(148,163,184,.18)}
.kb-hero-stat strong,.kb-reference-count strong{display:block;font-size:2.15rem}.kb-hero-stat span,.kb-reference-count span{color:var(--muted);font-weight:700}
.kb-card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem;margin:1rem 0 1.5rem}
.kb-doc-card{position:relative;overflow:hidden;padding:1.35rem;border-radius:26px;background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow)}
.kb-doc-card:before{content:"";position:absolute;inset:0 0 auto;height:5px;background:linear-gradient(90deg,#2563eb,#06b6d4)}
.kb-doc-card.tone-violet:before{background:linear-gradient(90deg,#7c3aed,#ec4899)}.kb-doc-card.tone-teal:before{background:linear-gradient(90deg,#0f766e,#22c55e)}
.kb-doc-type{font-size:.74rem;font-weight:800;letter-spacing:.08em;color:var(--muted)}.kb-doc-card h2{margin:.75rem 0 .5rem}.kb-doc-card p{color:var(--muted);line-height:1.7;min-height:5.2em}
.kb-reference-feature{display:flex;justify-content:space-between;align-items:center;gap:1.5rem;margin:1.5rem 0 2.5rem;padding:1.5rem;border-radius:28px;background:linear-gradient(135deg,rgba(37,99,235,.10),rgba(124,58,237,.09),rgba(20,184,166,.08));border:1px solid var(--border)}
.article-back{display:inline-flex;margin-bottom:.6rem;color:var(--accent);font-weight:700;text-decoration:none}.article-actions{display:flex;gap:.75rem;flex-wrap:wrap;justify-content:flex-end}.article-meta{display:flex;gap:.65rem;flex-wrap:wrap}.article-meta span{padding:.38rem .68rem;border-radius:999px;background:rgba(148,163,184,.12);font-size:.8rem;font-weight:700}
.article-doc-tabs{display:flex;gap:.65rem;overflow-x:auto;padding:.4rem 0 1rem}.article-doc-tabs a{white-space:nowrap;padding:.8rem 1rem;border-radius:16px;border:1px solid var(--border);background:var(--card);text-decoration:none;color:inherit;font-weight:700}.article-doc-tabs a.active{background:linear-gradient(135deg,#2563eb,#0ea5e9);color:#fff;border-color:transparent}
.topic-reference-section,.transcribed-article-shell{margin:1rem 0 2rem;padding:1.25rem;border-radius:28px;background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow)}
.topic-reference-head,.transcribed-article-head{margin-bottom:1rem}.topic-reference-head h2,.transcribed-article-head h2{margin:.4rem 0}.topic-reference-head p,.transcribed-article-head p{color:var(--muted);line-height:1.7}
.topic-groups{display:grid;gap:.85rem}.topic-group{border:1px solid var(--border);border-radius:20px;overflow:hidden;background:rgba(148,163,184,.04)}.topic-group summary{cursor:pointer;padding:1rem 1.1rem;font-weight:800}.topic-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.85rem;padding:0 1rem 1rem}
.topic-card{scroll-margin-top:170px;padding:1rem;border-radius:18px;background:var(--card);border:1px solid var(--border);transition:.25s ease}.topic-card.is-highlighted{border-color:#22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.12),0 18px 35px rgba(15,23,42,.12)}.topic-card h3{margin:0 0 .45rem;font-size:1rem}.topic-card p{margin:0;color:var(--muted);line-height:1.6}.topic-source-links{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.8rem}.topic-source-links a{font-size:.78rem;font-weight:700;padding:.38rem .58rem;border-radius:999px;background:rgba(37,99,235,.10);color:var(--accent);text-decoration:none}
.article-search{display:flex;align-items:center;gap:.8rem;margin:1rem 0}.article-search input{flex:1;min-width:0;padding:.9rem 1rem;border:1px solid var(--border);border-radius:16px;background:var(--input-bg,var(--card));color:inherit}.article-search span{white-space:nowrap;color:var(--muted);font-size:.85rem}
.transcribed-article{display:grid;gap:1rem}.transcribed-page{scroll-margin-top:160px;border:1px solid var(--border);border-radius:22px;overflow:hidden;background:rgba(148,163,184,.035)}.transcribed-page-head{display:flex;justify-content:space-between;gap:1rem;padding:.8rem 1rem;border-bottom:1px solid var(--border);background:rgba(37,99,235,.06);font-size:.82rem}.transcribed-page-head span{font-weight:700}.transcribed-page-text{margin:0;padding:1.1rem;white-space:pre-wrap;overflow-wrap:anywhere;font-family:inherit;font-size:.96rem;line-height:1.75;color:inherit;background:transparent}
.study-reference{display:flex;justify-content:space-between;gap:1rem;align-items:center;margin-top:.9rem;padding:.9rem 1rem;border-radius:16px;background:linear-gradient(135deg,rgba(37,99,235,.09),rgba(20,184,166,.08));border:1px solid rgba(37,99,235,.18)}.study-reference div{display:grid;gap:.18rem}.study-reference span{font-size:.72rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--accent)}.study-reference strong{font-size:.95rem}.study-reference small{color:var(--muted);line-height:1.5}.study-reference a{flex:0 0 auto;text-decoration:none;font-weight:800;color:#fff;background:linear-gradient(135deg,#2563eb,#0ea5e9);padding:.68rem .85rem;border-radius:13px}
@media(max-width:900px){.kb-card-grid{grid-template-columns:1fr}.topic-grid{grid-template-columns:1fr}.kb-hero,.article-hero,.kb-reference-feature{align-items:flex-start;flex-direction:column}.article-actions{justify-content:flex-start}.kb-hero-stat,.kb-reference-count{min-width:0;width:100%}}
@media(max-width:620px){.topic-reference-section,.transcribed-article-shell{padding:.85rem;border-radius:22px}.transcribed-page-text{padding:.9rem;font-size:.9rem}.study-reference{align-items:stretch;flex-direction:column}.study-reference a{text-align:center}.article-actions{width:100%}.article-actions .btn{flex:1}.kb-hero h1,.article-hero h1{font-size:2.2rem}}


/* ===== Article Redesign v3.0.1 ===== */

.article-reading-main{max-width:1340px}
.article-hero-redesign{display:grid;grid-template-columns:minmax(0,1.15fr) 360px;gap:1.15rem;align-items:stretch;padding:1.35rem 0 .85rem}
.article-hero-redesign .article-hero-copy,.article-hero-redesign .article-hero-panel{position:relative;border-radius:30px;background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(248,250,252,.90));border:1px solid var(--border);box-shadow:var(--shadow);padding:1.35rem}
[data-theme="dark"] .article-hero-redesign .article-hero-copy,[data-theme="dark"] .article-hero-redesign .article-hero-panel{background:linear-gradient(180deg,rgba(15,23,42,.92),rgba(15,23,42,.82));}
.article-hero-redesign .article-hero-copy::after{content:"";position:absolute;inset:auto 20px 18px auto;width:140px;height:140px;border-radius:999px;opacity:.15;background:radial-gradient(circle at center,#60a5fa,transparent 62%);pointer-events:none}
.article-theme-blue .article-hero-copy::after{background:radial-gradient(circle at center,#60a5fa,transparent 62%)}
.article-theme-violet .article-hero-copy::after{background:radial-gradient(circle at center,#a78bfa,transparent 62%)}
.article-theme-teal .article-hero-copy::after{background:radial-gradient(circle at center,#2dd4bf,transparent 62%)}
.article-hero-redesign h1{font-size:clamp(2rem,3.5vw,3rem);margin:.65rem 0 .55rem;line-height:1.06}
.article-hero-redesign p{margin:0;line-height:1.78;max-width:62ch}
.article-hero-meta-chips{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:1rem}
.article-hero-meta-chips span{display:inline-flex;align-items:center;gap:.35rem;padding:.62rem .88rem;border-radius:999px;background:rgba(148,163,184,.10);border:1px solid rgba(148,163,184,.12);font-size:.85rem;font-weight:700;color:var(--text)}
.article-theme-blue .article-hero-meta-chips span:first-child{background:rgba(37,99,235,.10);border-color:rgba(37,99,235,.18)}
.article-theme-violet .article-hero-meta-chips span:first-child{background:rgba(124,58,237,.10);border-color:rgba(124,58,237,.18)}
.article-theme-teal .article-hero-meta-chips span:first-child{background:rgba(13,148,136,.10);border-color:rgba(13,148,136,.18)}
.article-hero-panel{overflow:hidden;display:flex;flex-direction:column;justify-content:space-between}
.article-hero-panel-art{position:relative;min-height:130px;border-radius:24px;background:linear-gradient(135deg,rgba(37,99,235,.12),rgba(124,58,237,.10));overflow:hidden;border:1px solid rgba(148,163,184,.14)}
.article-theme-teal .article-hero-panel-art{background:linear-gradient(135deg,rgba(20,184,166,.14),rgba(14,165,233,.10))}
.article-theme-violet .article-hero-panel-art{background:linear-gradient(135deg,rgba(124,58,237,.15),rgba(59,130,246,.10))}
.article-hero-panel-art .orb{position:absolute;border-radius:999px;filter:blur(6px);opacity:.75}
.article-hero-panel-art .orb-a{width:100px;height:100px;top:-10px;left:-8px;background:rgba(255,255,255,.45)}
.article-hero-panel-art .orb-b{width:130px;height:130px;right:-18px;bottom:-28px;background:rgba(255,255,255,.28)}
.article-hero-panel-art .paper{position:absolute;top:50%;left:50%;width:92px;height:118px;border-radius:16px;border:1px solid rgba(255,255,255,.40);background:rgba(255,255,255,.85);box-shadow:0 10px 28px rgba(15,23,42,.12)}
.article-hero-panel-art .paper::before,.article-hero-panel-art .paper::after{content:"";position:absolute;left:14px;right:14px;border-radius:999px}
.article-hero-panel-art .paper::before{top:16px;height:8px;background:linear-gradient(90deg,#2563eb,#8b5cf6)}
.article-hero-panel-art .paper::after{top:34px;height:56px;background:repeating-linear-gradient(to bottom,rgba(148,163,184,.28) 0 8px,transparent 8px 16px)}
.article-hero-panel-art .paper-one{transform:translate(-50%,-50%) rotate(-12deg) translate(-46px,6px)}
.article-hero-panel-art .paper-two{transform:translate(-50%,-50%) rotate(2deg)}
.article-hero-panel-art .paper-three{transform:translate(-50%,-50%) rotate(14deg) translate(48px,-2px)}
.article-hero-panel-content{display:grid;gap:1rem;margin-top:1rem}
.article-hero-stat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.8rem}
.article-hero-stat{padding:1rem 1rem;border-radius:22px;background:rgba(148,163,184,.08);border:1px solid rgba(148,163,184,.12)}
.article-hero-stat small{display:block;color:var(--muted);font-size:.8rem;margin-bottom:.3rem}
.article-hero-stat strong{font-size:1.4rem;line-height:1}
.article-actions-redesign{display:flex;gap:.75rem;flex-wrap:wrap}.article-actions-redesign .btn{flex:1}
.article-reading-layout{display:grid;grid-template-columns:320px minmax(0,1fr);gap:1rem;align-items:start;margin-top:.35rem}
.article-reading-sidebar{display:grid;gap:1rem;position:sticky;top:96px}
.article-sidebar-card{padding:1rem 1rem 1.05rem;border-radius:26px;background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(248,250,252,.92));border:1px solid var(--border);box-shadow:var(--shadow)}
[data-theme="dark"] .article-sidebar-card{background:linear-gradient(180deg,rgba(15,23,42,.90),rgba(15,23,42,.82))}
.article-doc-switcher-card h2{margin:.4rem 0 .45rem;font-size:1.15rem}.article-doc-switcher-card p,.article-page-map-card p,.article-search-help{margin:.1rem 0 0;color:var(--muted);line-height:1.65;font-size:.92rem}
.article-doc-tabs-redesign{display:grid;gap:.7rem;margin-top:.95rem}
.article-doc-tabs-redesign a{display:block;padding:1rem;border-radius:20px;border:1px solid rgba(148,163,184,.16);background:rgba(148,163,184,.05);text-decoration:none;color:inherit;transition:all .18s ease}
.article-doc-tabs-redesign a:hover{transform:translateY(-1px);box-shadow:0 10px 28px rgba(15,23,42,.06)}
.article-doc-tabs-redesign a strong{display:block;font-size:1rem;margin-bottom:.18rem}.article-doc-tabs-redesign a small{display:block;color:var(--muted)}
.article-doc-tabs-redesign a.active{background:linear-gradient(135deg,rgba(37,99,235,.10),rgba(14,165,233,.08));border-color:rgba(37,99,235,.25)}
.article-theme-violet .article-doc-tabs-redesign a.active{background:linear-gradient(135deg,rgba(124,58,237,.12),rgba(59,130,246,.08));border-color:rgba(124,58,237,.25)}
.article-theme-teal .article-doc-tabs-redesign a.active{background:linear-gradient(135deg,rgba(20,184,166,.12),rgba(14,165,233,.08));border-color:rgba(20,184,166,.25)}
.article-search-redesign{display:grid;gap:.55rem;margin-top:.6rem}.article-search-redesign input{width:100%;padding:1rem 1rem;border-radius:18px;border:1px solid rgba(148,163,184,.18);background:rgba(255,255,255,.84);color:inherit;font:inherit}.article-search-redesign input:focus{outline:none;border-color:rgba(37,99,235,.35);box-shadow:0 0 0 4px rgba(37,99,235,.10)}
[data-theme="dark"] .article-search-redesign input{background:rgba(2,6,23,.52)}
.article-search-redesign span{font-size:.82rem;font-weight:800;color:var(--muted)}
.article-search-label{display:block;font-size:.9rem;font-weight:800;margin-bottom:.1rem}
.article-sidebar-title-row{display:flex;justify-content:space-between;gap:.75rem;align-items:center;margin-bottom:.35rem}.article-sidebar-title-row h3{margin:0;font-size:1.05rem}
.page-map-badge{display:inline-flex;min-width:36px;height:36px;align-items:center;justify-content:center;padding:0 .75rem;border-radius:999px;background:rgba(37,99,235,.10);border:1px solid rgba(37,99,235,.18);font-size:.85rem;font-weight:800;color:#1d4ed8}
[data-theme="dark"] .page-map-badge{color:#93c5fd;background:rgba(59,130,246,.14);border-color:rgba(96,165,250,.28)}
.article-page-map{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;margin-top:.85rem}
.article-page-link{display:inline-flex;align-items:center;justify-content:center;padding:.72rem .55rem;border-radius:14px;background:rgba(148,163,184,.08);border:1px solid rgba(148,163,184,.14);text-decoration:none;color:inherit;font-size:.84rem;font-weight:700;transition:all .16s ease}
.article-page-link:hover{background:rgba(37,99,235,.10);border-color:rgba(37,99,235,.24);transform:translateY(-1px)}
.transcribed-article-shell-redesign,.topic-reference-section-redesign{padding:1.15rem 1.15rem 1.2rem;border-radius:30px;background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(248,250,252,.93));border:1px solid var(--border);box-shadow:var(--shadow)}
[data-theme="dark"] .transcribed-article-shell-redesign,[data-theme="dark"] .topic-reference-section-redesign{background:linear-gradient(180deg,rgba(15,23,42,.92),rgba(15,23,42,.82))}
.transcribed-article-head-redesign,.topic-reference-head-redesign{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;margin-bottom:1rem}
.transcribed-article-head-redesign h2,.topic-reference-head-redesign h2{margin:.35rem 0}.transcribed-article-head-redesign p,.topic-reference-head-redesign p{margin:0;color:var(--muted);line-height:1.7}
.notes-inline-link{display:inline-flex;align-items:center;gap:.35rem;padding:.8rem 1rem;border-radius:999px;text-decoration:none;font-weight:800;background:rgba(37,99,235,.10);border:1px solid rgba(37,99,235,.18)}
.transcribed-article-redesign{display:grid;gap:1rem}
.transcribed-page{border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,.88),rgba(250,250,251,.92));border:1px solid rgba(148,163,184,.15);box-shadow:0 12px 28px rgba(15,23,42,.05)}
[data-theme="dark"] .transcribed-page{background:linear-gradient(180deg,rgba(2,6,23,.62),rgba(15,23,42,.72));box-shadow:0 12px 28px rgba(0,0,0,.18)}
.transcribed-page-head{padding:.9rem 1rem;border-bottom:1px solid rgba(148,163,184,.12);background:linear-gradient(135deg,rgba(37,99,235,.09),rgba(14,165,233,.06));font-size:.84rem}
.article-theme-violet .transcribed-page-head{background:linear-gradient(135deg,rgba(124,58,237,.11),rgba(59,130,246,.06))}
.article-theme-teal .transcribed-page-head{background:linear-gradient(135deg,rgba(20,184,166,.11),rgba(14,165,233,.06))}
.transcribed-page-head strong{font-size:.8rem;padding:.35rem .65rem;border-radius:999px;background:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.35)}
.transcribed-page-text{padding:1.25rem 1.25rem 1.35rem;font-size:1rem;line-height:1.82;white-space:pre-wrap}
.topic-groups-redesign{display:grid;gap:1rem}.topic-group-redesign{border-radius:24px;border:1px solid rgba(148,163,184,.14);background:rgba(148,163,184,.04);overflow:hidden}.topic-group-redesign summary{cursor:pointer;list-style:none;padding:1rem 1.05rem;font-weight:800;background:rgba(37,99,235,.06)}.topic-group-redesign summary::-webkit-details-marker{display:none}
.topic-grid-redesign{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem;padding:.95rem}.topic-card-redesign{padding:1rem 1rem 1.05rem;border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(248,250,252,.90));border:1px solid rgba(148,163,184,.14);box-shadow:0 12px 24px rgba(15,23,42,.05)}
[data-theme="dark"] .topic-card-redesign{background:linear-gradient(180deg,rgba(17,24,39,.86),rgba(15,23,42,.84));box-shadow:0 12px 24px rgba(0,0,0,.16)}
.topic-card-redesign h3{margin:0 0 .5rem;font-size:1.02rem;line-height:1.45}.topic-card-redesign p{margin:0;color:var(--muted);line-height:1.72;font-size:.95rem}.topic-card-redesign.is-highlighted{border-color:rgba(37,99,235,.34);box-shadow:0 16px 28px rgba(37,99,235,.12)}
.topic-source-links-redesign{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem;margin-top:.85rem}.topic-source-links-redesign a{display:flex;flex-direction:column;gap:.18rem;padding:.75rem .8rem;border-radius:16px;background:rgba(148,163,184,.08);border:1px solid rgba(148,163,184,.12);text-decoration:none;font-size:.82rem;color:inherit;font-weight:700}.topic-source-links-redesign a span{font-size:.78rem;color:var(--muted);font-weight:600}
@media (max-width: 1180px){.article-reading-layout{grid-template-columns:1fr}.article-reading-sidebar{position:static;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start}.article-hero-redesign{grid-template-columns:1fr}.article-hero-panel-content{grid-template-columns:1fr}.article-actions-redesign .btn{flex:1 1 220px}}
@media (max-width: 900px){.article-reading-sidebar{grid-template-columns:1fr}.article-page-map{grid-template-columns:repeat(4,minmax(0,1fr))}.topic-grid-redesign{grid-template-columns:1fr}.topic-source-links-redesign{grid-template-columns:1fr 1fr 1fr}}
@media (max-width: 640px){.article-hero-redesign .article-hero-copy,.article-hero-redesign .article-hero-panel,.article-sidebar-card,.transcribed-article-shell-redesign,.topic-reference-section-redesign{padding:1rem;border-radius:24px}.article-hero-stat-grid{grid-template-columns:1fr 1fr}.article-page-map{grid-template-columns:repeat(3,minmax(0,1fr))}.transcribed-page-text{padding:1rem;font-size:.94rem;line-height:1.72}.transcribed-article-head-redesign,.topic-reference-head-redesign{flex-direction:column}.notes-inline-link{width:100%;justify-content:center}.topic-source-links-redesign{grid-template-columns:1fr}.article-doc-tabs-redesign a{padding:.9rem}.article-hero-redesign h1{font-size:2rem}}

/* ===== Progress Report Print Template v3.1.0 ===== */
.print-report-only{display:none}

@media print{
  @page{size:A4 portrait;margin:18mm 11mm 17mm}
  html,body{background:#fff!important;color:#172033!important;-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}
  body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans Sinhala","Noto Sans JP",Arial,sans-serif!important;font-size:9.2pt!important;line-height:1.38!important}

  .topbar,.site-footer,.footer,.ambient-canvas,.ambient-vignette,.theme-toggle,.actions,.btn,.print-hide{display:none!important}
  .print-report-only{display:block!important}
  .container{width:100%!important;max-width:none!important;margin:0!important;padding:0!important}
  main.container{overflow:visible!important}

  .print-report-cover{
    position:relative;
    z-index:5;
    min-height:257mm;
    padding:13mm 13mm 10mm;
    margin:-8mm 0 0;
    background:#fff!important;
    border:1px solid #d7e1eb;
    border-radius:5mm;
    overflow:hidden;
    break-after:page;
    page-break-after:always;
  }
  .print-report-cover::before{
    content:"";
    position:absolute;
    inset:0 0 auto;
    height:66mm;
    background:linear-gradient(135deg,#0b2747 0%,#123f6d 48%,#116d75 100%)!important;
    z-index:-1;
  }
  .print-report-cover::after{
    content:"";
    position:absolute;
    width:72mm;
    height:72mm;
    right:-19mm;
    top:20mm;
    border-radius:50%;
    border:12mm solid rgba(255,255,255,.08);
  }
  .print-cover-brand{display:flex;align-items:center;justify-content:space-between;gap:12mm;color:#fff;margin-bottom:22mm}
  .print-cover-brand img{width:62mm;max-height:18mm;object-fit:contain;object-position:left center;filter:brightness(0) invert(1)}
  .print-cover-brand span{font-size:8.2pt;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#d9eef7}
  .print-cover-accent{position:absolute;left:13mm;top:52mm;width:32mm;height:1.5mm;border-radius:2mm;background:#50d5c7!important}
  .print-cover-content{position:relative}
  .print-cover-kicker{display:inline-block;font-size:8pt;font-weight:800;letter-spacing:.18em;color:#0f7a7c;margin-bottom:4mm}
  .print-cover-content h1{font-size:29pt;line-height:1.02;margin:0 0 3mm;color:#10233a!important;letter-spacing:-.03em}
  .print-cover-subtitle{margin:0 0 13mm;max-width:125mm;font-size:11pt;line-height:1.55;color:#617187!important}
  .print-student-card{display:grid;grid-template-columns:1.25fr 1fr 1fr 1fr;gap:3mm;padding:5mm;border:1px solid #d8e3ed;border-radius:4mm;background:#f7fafc!important;margin-bottom:8mm}
  .print-student-card div{padding:1mm 2mm;border-right:1px solid #dde6ef}
  .print-student-card div:last-child{border-right:0}
  .print-student-card small,.print-cover-summary-grid span,.print-cover-status span{display:block;font-size:7.3pt;color:#748398!important;text-transform:uppercase;letter-spacing:.08em;font-weight:800;margin-bottom:1.5mm}
  .print-student-card strong{display:block;font-size:10pt;color:#13263e!important;overflow-wrap:anywhere}
  .print-cover-summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:3mm;margin-bottom:8mm}
  .print-cover-summary-grid div{padding:5mm 4mm;border-radius:4mm;background:linear-gradient(180deg,#f7fbff,#edf5fb)!important;border:1px solid #d7e4ef}
  .print-cover-summary-grid div:nth-child(2){background:linear-gradient(180deg,#f4fbfa,#e8f6f3)!important}
  .print-cover-summary-grid div:nth-child(3){background:linear-gradient(180deg,#f8f6ff,#eeeafe)!important}
  .print-cover-summary-grid div:nth-child(4){background:linear-gradient(180deg,#fffaf0,#fff2d8)!important}
  .print-cover-summary-grid strong{display:block;font-size:18pt;line-height:1;color:#102a45!important}
  .print-cover-status{padding:6mm;border-left:2mm solid #168a88;background:#eef8f7!important;border-radius:0 4mm 4mm 0}
  .print-cover-status strong{display:block;font-size:14pt;color:#0f3d4e!important;margin-bottom:1.5mm}
  .print-cover-status small{color:#617187!important}
  .print-cover-footer-line{position:absolute;left:13mm;right:13mm;bottom:10mm;display:flex;justify-content:space-between;gap:8mm;padding-top:3mm;border-top:1px solid #dbe5ee;font-size:7.4pt;color:#66788a!important}

  .print-running-header{
    position:fixed;
    top:-13mm;
    left:0;
    right:0;
    height:10mm;
    display:flex!important;
    align-items:center;
    gap:3mm;
    padding-bottom:2mm;
    border-bottom:1px solid #cfd9e3;
    color:#30445b!important;
    z-index:1;
  }
  .print-running-header img{width:7mm;height:7mm;object-fit:contain}
  .print-running-header div{display:grid;line-height:1.12}
  .print-running-header div strong{font-size:8pt}
  .print-running-header div span{font-size:6.8pt;color:#788899!important}
  .print-running-header>span{margin-left:auto;font-size:6.8pt;color:#788899!important}
  .print-running-footer{
    position:fixed;
    bottom:-11.5mm;
    left:0;
    right:0;
    display:flex!important;
    justify-content:space-between;
    gap:8mm;
    padding-top:2mm;
    border-top:1px solid #cfd9e3;
    font-size:6.7pt;
    color:#748398!important;
  }

  .analytics-intro{display:none!important}
  .print-section-title{display:flex!important;align-items:center;gap:3mm;margin:5mm 0 3mm;padding-bottom:2mm;border-bottom:1.2px solid #b9c9d8;break-after:avoid;page-break-after:avoid}
  .print-section-title span{display:inline-flex;width:8mm;height:8mm;align-items:center;justify-content:center;border-radius:50%;background:#0f6f78!important;color:#fff!important;font-size:7pt;font-weight:900}
  .print-section-title strong{font-size:11pt;color:#17324d!important;letter-spacing:.01em}

  .analytics-stat-grid{grid-template-columns:repeat(3,1fr)!important;gap:3mm!important;margin:0 0 4mm!important}
  .metric-card{padding:4mm!important;border:1px solid #d4dfe9!important;border-radius:3.5mm!important;background:#fff!important;box-shadow:none!important;min-height:27mm!important;break-inside:avoid!important;page-break-inside:avoid!important}
  .metric-card:nth-child(3n+1){border-top:1.4mm solid #1b7180!important}
  .metric-card:nth-child(3n+2){border-top:1.4mm solid #4d72c9!important}
  .metric-card:nth-child(3n){border-top:1.4mm solid #8b69ba!important}
  .metric-card span{font-size:7.4pt!important;color:#6a7889!important}
  .metric-card strong{font-size:15pt!important;color:#122b45!important;margin:1.5mm 0!important}
  .metric-card small{font-size:7pt!important;line-height:1.35!important;color:#748398!important}

  .analytics-layout{display:grid!important;grid-template-columns:1.36fr .84fr!important;gap:4mm!important;margin:0 0 4mm!important;align-items:start!important;break-inside:auto!important;page-break-inside:auto!important}
  .card,.chart-card,.conclusion-card,.paper-progress-card,.recommendations-card,.attempts-detail-card{background:#fff!important;border:1px solid #d4dfe9!important;border-radius:3.5mm!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;transform:none!important}
  .card{padding:4.5mm!important}
  .card:hover,.metric-card:hover{transform:none!important;box-shadow:none!important}
  .card-heading{margin-bottom:3mm!important}
  .card-heading h2,.conclusion-card h2,.recommendations-card h2{font-size:11pt!important;margin:0!important;color:#16314b!important}
  .eyebrow{font-size:6.8pt!important;letter-spacing:.11em!important;color:#0f727a!important;margin-bottom:1mm!important}
  .legend-pass{font-size:6.6pt!important;padding:1.2mm 2mm!important;background:#e9f5ee!important;color:#176c48!important}
  .svg-chart-wrap{overflow:visible!important}
  .trend-chart{width:100%!important;min-width:0!important;max-height:60mm!important}
  .trend-line{stroke:#0d7278!important;stroke-width:3!important}
  .grid-line{stroke:#dbe3ea!important}.grid-line.pass-line{stroke:#4d9b72!important}
  .axis-label{fill:#6f7d8c!important;font-size:10px!important}
  .conclusion-row{padding:2.2mm 0!important;border-bottom:1px solid #e3e8ee!important;font-size:8pt!important}
  .insight{padding:2.5mm!important;border-radius:2.5mm!important;font-size:7.5pt!important;margin-top:2mm!important}
  .insight.good{background:#edf8f2!important;color:#185e42!important}.insight.low{background:#fff3ef!important;color:#8c3f37!important}
  .scope-disclaimer{font-size:6.8pt!important;line-height:1.35!important;color:#758292!important;margin:2mm 0 0!important}

  .bar-chart-list{display:grid!important;gap:2.5mm!important}.bar-row{break-inside:avoid!important}
  .bar-label{font-size:7.5pt!important}.bar-row small{font-size:6.7pt!important;color:#748398!important}
  .bar-track{height:3.4mm!important;background:#e8eef3!important}.bar-fill.good{background:#21865a!important}.bar-fill.mid{background:#d69323!important}.bar-fill.low{background:#b64f48!important}
  .donut-pair{gap:3mm!important}.donut{width:32mm!important;height:32mm!important}.donut>div{width:23mm!important;height:23mm!important;background:#fff!important}.donut strong{font-size:11pt!important}.donut span,.donut-item small{font-size:6.8pt!important}.time-assessment{padding:2.5mm!important;font-size:7.3pt!important;background:#f2f6f9!important}

  .paper-progress-card{margin:0 0 4mm!important;break-before:page;page-break-before:always}
  .paper-progress-grid{grid-template-columns:repeat(5,1fr)!important;gap:2mm!important}
  .paper-progress-item{padding:2.5mm!important;border-radius:2.5mm!important;border:1px solid #dbe4ec!important;background:#fff!important;box-shadow:none!important;break-inside:avoid!important}
  .paper-progress-item.not-started{background:#f6f8fa!important;opacity:1!important}
  .paper-progress-head strong{font-size:7.5pt!important}.paper-progress-head span,.paper-progress-foot span,.paper-progress-foot b{font-size:6.4pt!important}
  .paper-progress-item .bar-track.small{height:2.2mm!important;margin:1.5mm 0!important}

  .recommendation-list{font-size:7.5pt!important;padding-left:5mm!important;margin:2mm 0 0!important}.recommendation-list li{margin-bottom:2mm!important}
  .indicator-list{font-size:7.3pt!important}.indicator-list>div{padding:2.2mm 0!important}.indicator-list dt{color:#6f7d8c!important}.indicator-list dd{color:#17324d!important;font-weight:800!important}

  .attempts-detail-card{break-before:page;page-break-before:always;overflow:visible!important}
  .attempts-detail-card .table-wrap,.table-wrap{overflow:visible!important}
  .data-table{width:100%!important;min-width:0!important;table-layout:fixed!important;border-collapse:collapse!important;font-size:6.4pt!important}
  .data-table th,.data-table td{padding:1.8mm 1mm!important;border:1px solid #dce4eb!important;vertical-align:top!important;overflow-wrap:anywhere!important;line-height:1.25!important}
  .data-table th{background:#eaf1f7!important;color:#334a62!important;font-size:6.1pt!important;text-transform:uppercase!important;letter-spacing:.02em!important}
  .data-table th:nth-child(1),.data-table td:nth-child(1){width:4%}
  .data-table th:nth-child(2),.data-table td:nth-child(2){width:13%}
  .data-table th:nth-child(3),.data-table td:nth-child(3){width:8%}
  .data-table th:nth-child(4),.data-table td:nth-child(4){width:8%}
  .data-table th:nth-child(5),.data-table td:nth-child(5),
  .data-table th:nth-child(6),.data-table td:nth-child(6),
  .data-table th:nth-child(7),.data-table td:nth-child(7){width:7%}
  .data-table th:nth-child(8),.data-table td:nth-child(8){width:10%}
  .data-table th:nth-child(9),.data-table td:nth-child(9){width:10%}
  .data-table th:nth-child(10),.data-table td:nth-child(10){width:8%}
  .data-table th:nth-child(11),.data-table td:nth-child(11){display:none!important}
  .score-pill{padding:1mm 1.5mm!important;border-radius:99px!important;font-size:6.3pt!important;white-space:nowrap!important}

  .positive{color:#176c48!important}.negative{color:#a04444!important}
  a{color:inherit!important;text-decoration:none!important}
  .liquid-surface,.liquid-interactive{background:#fff!important;border-color:#d4dfe9!important;box-shadow:none!important;transform:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  .liquid-surface::before,.liquid-surface::after{display:none!important}
}


/* ===== Progress Report Print Reliability Fix v3.1.1 ===== */
@media print{
  @page{size:A4 portrait;margin:11mm 9mm 12mm}

  html,body{width:auto!important;min-width:0!important;height:auto!important;overflow:visible!important;background:#fff!important;color:#172033!important}
  body{font-size:8.7pt!important;line-height:1.34!important}
  main,.container,main.container{display:block!important;width:100%!important;max-width:none!important;margin:0!important;padding:0!important;overflow:visible!important}

  /* Cards that have not entered the viewport must still print. */
  .reveal-on-scroll,.reveal-on-scroll.is-visible,
  .card,.metric-card,.stat-card,.chart-card,.conclusion-card,
  .paper-progress-card,.paper-progress-item,.recommendations-card,
  .attempts-detail-card,.result-hero{
    opacity:1!important;
    visibility:visible!important;
    transform:none!important;
    animation:none!important;
    transition:none!important;
  }

  /* Avoid fixed print elements creating phantom or blank pages. */
  .print-running-header,.print-running-footer{display:none!important}

  /* Compact title block instead of a full-page cover. */
  .print-report-cover{
    display:block!important;
    position:relative!important;
    min-height:0!important;
    height:auto!important;
    margin:0 0 5mm!important;
    padding:7mm!important;
    border:1px solid #cfdbe6!important;
    border-radius:4mm!important;
    overflow:hidden!important;
    break-after:auto!important;
    page-break-after:auto!important;
    background:#fff!important;
  }
  .print-report-cover::before{
    display:block!important;
    content:""!important;
    position:absolute!important;
    inset:0 0 auto!important;
    height:34mm!important;
    background:linear-gradient(135deg,#0b2747 0%,#123f6d 52%,#116d75 100%)!important;
    z-index:0!important;
  }
  .print-report-cover::after{
    content:""!important;
    position:absolute!important;
    width:42mm!important;
    height:42mm!important;
    right:-12mm!important;
    top:-4mm!important;
    border-radius:50%!important;
    border:7mm solid rgba(255,255,255,.08)!important;
    z-index:0!important;
  }
  .print-cover-brand,.print-cover-content,.print-cover-footer-line{position:relative!important;z-index:1!important}
  .print-cover-brand{margin:0 0 10mm!important;align-items:center!important}
  .print-cover-brand img{width:50mm!important;max-height:13mm!important}
  .print-cover-brand span{font-size:7.2pt!important}
  .print-cover-accent{display:none!important}
  .print-cover-kicker{font-size:7pt!important;margin-bottom:1.5mm!important;color:#0f7a7c!important}
  .print-cover-content h1{font-size:22pt!important;margin:0 0 1.5mm!important}
  .print-cover-subtitle{font-size:9pt!important;margin:0 0 5mm!important;line-height:1.4!important}
  .print-student-card{grid-template-columns:1.15fr 1fr 1fr 1fr!important;gap:1.5mm!important;padding:3mm!important;margin-bottom:3mm!important;border-radius:3mm!important}
  .print-student-card div{padding:0 1.5mm!important}
  .print-student-card small,.print-cover-summary-grid span,.print-cover-status span{font-size:6.5pt!important;margin-bottom:.8mm!important}
  .print-student-card strong{font-size:8.2pt!important}
  .print-cover-summary-grid{gap:1.7mm!important;margin-bottom:3mm!important}
  .print-cover-summary-grid div{padding:3mm!important;border-radius:3mm!important}
  .print-cover-summary-grid strong{font-size:13pt!important}
  .print-cover-status{padding:3.5mm!important;border-left-width:1.2mm!important;border-radius:0 3mm 3mm 0!important}
  .print-cover-status strong{font-size:10.5pt!important;margin-bottom:.7mm!important}
  .print-cover-status small{font-size:6.8pt!important}
  .print-cover-footer-line{position:static!important;margin-top:3mm!important;padding-top:2mm!important;font-size:6.3pt!important}

  .analytics-intro{display:none!important}
  .print-section-title{margin:4mm 0 2mm!important;padding-bottom:1.5mm!important;break-after:avoid!important;page-break-after:avoid!important}
  .print-section-title span{width:7mm!important;height:7mm!important;font-size:6.4pt!important}
  .print-section-title strong{font-size:10pt!important}

  /* Natural document flow: no forced page breaks and no reserved blank pages. */
  .paper-progress-card,.attempts-detail-card{
    break-before:auto!important;
    page-break-before:auto!important;
  }
  .analytics-layout,.analytics-stat-grid,.paper-progress-grid,
  .recommendation-list,.indicator-list,.bar-chart-list,.donut-pair,
  .data-table,.table-wrap{
    break-before:auto!important;
    page-break-before:auto!important;
    break-after:auto!important;
    page-break-after:auto!important;
    visibility:visible!important;
    opacity:1!important;
  }
  .analytics-layout{break-inside:auto!important;page-break-inside:auto!important}
  .analytics-layout>.card,.paper-progress-item,.metric-card,.bar-row,.indicator-list>div,.data-table tr{
    break-inside:avoid!important;
    page-break-inside:avoid!important;
  }

  .analytics-stat-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:2mm!important;margin:0 0 3mm!important}
  .metric-card{min-height:23mm!important;padding:3mm!important;border-radius:3mm!important}
  .metric-card strong{font-size:13pt!important;margin:1mm 0!important}
  .metric-card span{font-size:6.7pt!important}.metric-card small{font-size:6.3pt!important}

  .analytics-layout{grid-template-columns:1.28fr .72fr!important;gap:3mm!important;margin:0 0 3mm!important}
  .card{padding:3.5mm!important;border-radius:3mm!important}
  .card-heading{margin-bottom:2mm!important}
  .card-heading h2,.conclusion-card h2,.recommendations-card h2{font-size:9.5pt!important}
  .eyebrow{font-size:6.2pt!important;margin-bottom:.5mm!important}
  .legend-pass{font-size:6pt!important;padding:1mm 1.6mm!important}
  .trend-chart{max-height:48mm!important}
  .conclusion-row{padding:1.5mm 0!important;font-size:7pt!important}
  .insight{padding:2mm!important;margin-top:1.5mm!important;font-size:6.7pt!important}
  .scope-disclaimer{font-size:6.1pt!important;margin-top:1.5mm!important}

  .bar-chart-list{gap:1.7mm!important}.bar-label{font-size:6.9pt!important;margin-bottom:.7mm!important}.bar-row small{font-size:6.1pt!important;margin-top:.6mm!important}
  .bar-track{height:2.7mm!important}.target-marker{top:-1.5mm!important;height:5.5mm!important}
  .donut-pair{gap:2mm!important}.donut{width:27mm!important;height:27mm!important}.donut>div{width:19mm!important;height:19mm!important}.donut strong{font-size:9.5pt!important}.donut span,.donut-item small{font-size:5.9pt!important}.time-assessment{margin-top:2mm!important;padding:2mm!important;font-size:6.5pt!important}

  .paper-progress-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:1.5mm!important}
  .paper-progress-item{padding:2mm!important;border-radius:2mm!important}
  .paper-progress-head{margin-bottom:1mm!important}.paper-progress-foot{margin-top:1mm!important}
  .paper-progress-head strong{font-size:6.9pt!important}.paper-progress-head span,.paper-progress-foot span,.paper-progress-foot b{font-size:5.8pt!important}
  .paper-progress-item .bar-track.small{height:1.8mm!important;margin:1mm 0!important}

  .recommendation-list{font-size:6.8pt!important;margin:1mm 0 0!important;padding-left:4mm!important}.recommendation-list li{margin-bottom:1.3mm!important}
  .indicator-list{font-size:6.6pt!important}.indicator-list>div{padding:1.5mm 0!important}

  .attempts-detail-card{overflow:visible!important}
  .table-wrap{overflow:visible!important}
  .data-table{font-size:5.8pt!important;table-layout:fixed!important;min-width:0!important}
  .data-table th,.data-table td{padding:1.3mm .7mm!important;line-height:1.18!important}
  .data-table th{font-size:5.4pt!important}
  .score-pill{font-size:5.5pt!important;padding:.7mm 1mm!important}

  /* Keep the last rows and footer from producing a trailing empty sheet. */
  .site-footer,.footer{display:none!important}
  body::after{display:none!important;content:none!important}
}
.print-setting-note{display:block;width:100%;margin-top:6px;color:var(--muted);font-size:.76rem}
@media print{.print-setting-note{display:none!important}}
@media print{
  .attempts-detail-card,.attempts-detail-card.card,.attempts-detail-card.liquid-surface{
    break-inside:auto!important;
    page-break-inside:auto!important;
  }
}


/* v3.1.2 — iPhone modal backdrop cleanup */
body.exam-modal-open{overflow:hidden!important;overscroll-behavior:none;touch-action:none}
.modal[hidden],.modal:not(.is-open){display:none!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important}
.modal.is-open{display:flex!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important}
#extraTimeModal,#submitModal{isolation:isolate;-webkit-transform:translateZ(0);transform:translateZ(0)}
#extraTimeModal .modal-card,#submitModal .modal-card{-webkit-transform:translateZ(0);transform:translateZ(0)}
@media(max-width:640px){
  #extraTimeModal,#submitModal{align-items:center;padding:max(16px,env(safe-area-inset-top)) 16px max(16px,env(safe-area-inset-bottom))}
  #extraTimeModal .modal-card,#submitModal .modal-card{max-height:calc(100dvh - 32px);overflow:auto}
}


/* v3.1.3 — center both exam popup menus in the visible iPhone viewport */
:root{
  --exam-modal-vv-top:0px;
  --exam-modal-vv-height:100dvh;
}
#extraTimeModal,#submitModal{
  position:fixed!important;
  left:0!important;
  right:0!important;
  top:var(--exam-modal-vv-top)!important;
  bottom:auto!important;
  width:100%!important;
  height:var(--exam-modal-vv-height)!important;
  min-height:0!important;
  padding:max(14px,env(safe-area-inset-top)) 16px max(14px,env(safe-area-inset-bottom))!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
}
#extraTimeModal.is-open,#submitModal.is-open{
  display:grid!important;
  place-items:center!important;
}
#extraTimeModal .modal-card,#submitModal .modal-card{
  position:relative!important;
  inset:auto!important;
  margin:0 auto!important;
  width:min(520px,calc(100vw - 32px))!important;
  max-height:calc(var(--exam-modal-vv-height) - max(28px,env(safe-area-inset-top)) - max(28px,env(safe-area-inset-bottom)))!important;
  overflow:auto!important;
  overscroll-behavior:contain;
  transform:none!important;
  -webkit-transform:none!important;
}
@media(max-width:640px){
  #extraTimeModal .modal-card,#submitModal .modal-card{
    width:min(100%,520px)!important;
    border-radius:22px!important;
  }
}

/* v3.1.4 — true viewport-centered exam menus at every document scroll position */
:root{
  --exam-modal-visible-height:100dvh;
  --exam-modal-visible-width:100vw;
}
body.exam-modal-open{
  overflow:hidden!important;
}
#extraTimeModal,#submitModal{
  position:fixed!important;
  inset:auto!important;
  top:0!important;
  left:0!important;
  right:auto!important;
  bottom:auto!important;
  width:var(--modal-visible-width,var(--exam-modal-visible-width))!important;
  height:var(--modal-visible-height,var(--exam-modal-visible-height))!important;
  min-width:0!important;
  min-height:0!important;
  margin:0!important;
  padding:max(16px,env(safe-area-inset-top)) 16px max(16px,env(safe-area-inset-bottom))!important;
  display:none!important;
  align-items:initial!important;
  justify-content:initial!important;
  place-items:initial!important;
  overflow:hidden!important;
  transform:none!important;
  -webkit-transform:none!important;
  contain:layout paint;
  z-index:2147483000!important;
}
#extraTimeModal.is-open,#submitModal.is-open{
  display:block!important;
}
#extraTimeModal .modal-card,#submitModal .modal-card{
  position:absolute!important;
  top:50%!important;
  left:50%!important;
  right:auto!important;
  bottom:auto!important;
  width:min(520px,calc(100% - 32px))!important;
  max-width:520px!important;
  max-height:calc(100% - max(32px,env(safe-area-inset-top)) - max(32px,env(safe-area-inset-bottom)))!important;
  margin:0!important;
  overflow:auto!important;
  overscroll-behavior:contain!important;
  transform:translate(-50%,-50%)!important;
  -webkit-transform:translate(-50%,-50%)!important;
  transform-origin:center center!important;
}
@supports(height:100dvh){
  #extraTimeModal,#submitModal{
    height:var(--modal-visible-height,100dvh)!important;
  }
}
@media(max-width:640px){
  #extraTimeModal,#submitModal{
    padding:max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom))!important;
  }
  #extraTimeModal .modal-card,#submitModal .modal-card{
    width:calc(100% - 24px)!important;
    max-height:calc(100% - max(24px,env(safe-area-inset-top)) - max(24px,env(safe-area-inset-bottom)))!important;
    border-radius:22px!important;
  }
}


/* ===== My Account interaction fix v3.1.5 ===== */
/* The crop modal must not sit invisibly above the account page. */
.avatar-crop-modal[hidden],
.avatar-crop-modal[inert]:not(.is-open),
.avatar-crop-modal:not(.is-open) {
  pointer-events: none !important;
}
.avatar-crop-modal[hidden] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
}
.avatar-crop-modal.is-open {
  display: grid !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}
.account-panels,
.account-panel,
.account-panel form,
.account-panel input,
.account-panel select,
.account-panel textarea,
.account-panel button,
.account-panel label {
  pointer-events: auto;
}

/* =========================================================
   v3.1.6 — Active attempt card on Home
   ========================================================= */
.home-active-attempt{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  gap:22px;
  align-items:center;
  margin:28px 0 4px;
  padding:24px 26px;
  overflow:hidden;
  border:1px solid color-mix(in srgb,#2d6cdf 26%,var(--line,#d7e0eb));
  border-radius:24px;
  background:
    linear-gradient(135deg,color-mix(in srgb,#2d6cdf 7%,var(--surface,#fff)),color-mix(in srgb,#29a6a0 7%,var(--surface,#fff)));
  box-shadow:0 24px 54px rgba(26,55,96,.12);
}
.home-active-accent{
  position:absolute;
  inset:0;
  overflow:hidden;
  pointer-events:none;
}
.home-active-accent span{
  position:absolute;
  border-radius:999px;
  filter:blur(2px);
  opacity:.24;
}
.home-active-accent span:first-child{
  width:180px;
  height:180px;
  right:-70px;
  top:-85px;
  background:#2d6cdf;
}
.home-active-accent span:last-child{
  width:150px;
  height:150px;
  left:38%;
  bottom:-110px;
  background:#29a6a0;
}
.home-active-copy,
.home-active-time-panel,
.home-active-continue,
.home-active-expired{
  position:relative;
  z-index:1;
}
.home-active-badge{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:7px 10px;
  border-radius:999px;
  background:color-mix(in srgb,#2d6cdf 10%,var(--surface,#fff));
  border:1px solid color-mix(in srgb,#2d6cdf 22%,transparent);
  color:#245ebf;
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
}
.home-active-badge i{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#22a06b;
  box-shadow:0 0 0 5px rgba(34,160,107,.12);
  animation:homeActivePulse 1.6s ease-in-out infinite;
}
.home-active-copy h2{
  margin:12px 0 6px;
  font-size:clamp(23px,3vw,34px);
  line-height:1.12;
  letter-spacing:-.035em;
}
.home-active-copy p{
  margin:0;
  max-width:720px;
  color:var(--muted,#66758a);
  line-height:1.65;
}
.home-active-progress-line{
  display:flex;
  align-items:center;
  gap:14px;
  margin-top:16px;
}
.home-active-progress-line strong{
  flex:0 0 auto;
  color:var(--muted,#66758a);
  font-size:12px;
}
.home-active-progress-track{
  flex:1;
  max-width:460px;
  height:7px;
  overflow:hidden;
  border-radius:999px;
  background:color-mix(in srgb,var(--soft,#eef3f9) 92%,transparent);
}
.home-active-progress-track span{
  display:block;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#2d6cdf,#29a6a0);
}
.home-active-time-panel{
  min-width:160px;
  padding:17px 18px;
  border-radius:18px;
  border:1px solid color-mix(in srgb,#2d6cdf 18%,var(--line,#d7e0eb));
  background:color-mix(in srgb,var(--surface,#fff) 88%,transparent);
  text-align:center;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45);
}
.home-active-time-panel small,
.home-active-time-panel span{
  display:block;
  color:var(--muted,#66758a);
  font-size:11px;
  font-weight:800;
}
.home-active-timer{
  display:block;
  margin:4px 0;
  color:var(--text,#152033);
  font-size:clamp(28px,4vw,40px);
  line-height:1;
  font-variant-numeric:tabular-nums;
  letter-spacing:-.04em;
}
.home-active-continue{
  white-space:nowrap;
  min-width:180px;
  justify-content:center;
}
.home-active-expired{
  grid-column:1/-1;
  margin:0;
  padding:11px 14px;
  border-radius:13px;
  background:rgba(180,56,70,.09);
  color:#a93645;
  font-weight:800;
}
.home-active-attempt.is-expired{
  border-color:color-mix(in srgb,#b43846 28%,var(--line,#d7e0eb));
}
.home-active-continue.is-disabled{
  opacity:.55;
  pointer-events:none;
}
[data-theme="dark"] .home-active-attempt{
  background:linear-gradient(135deg,rgba(28,53,89,.96),rgba(16,48,59,.94));
  border-color:rgba(109,158,255,.28);
  box-shadow:0 24px 54px rgba(0,0,0,.28);
}
[data-theme="dark"] .home-active-badge{
  background:rgba(74,132,255,.14);
  border-color:rgba(113,158,255,.24);
  color:#9db9ff;
}
[data-theme="dark"] .home-active-time-panel{
  background:rgba(8,20,35,.45);
  border-color:rgba(119,160,230,.20);
}
@keyframes homeActivePulse{
  0%,100%{transform:scale(1);opacity:1}
  50%{transform:scale(.82);opacity:.65}
}
@media(max-width:980px){
  .home-active-attempt{
    grid-template-columns:minmax(0,1fr) auto;
  }
  .home-active-continue{
    grid-column:1/-1;
    width:100%;
  }
}
@media(max-width:680px){
  .home-active-attempt{
    grid-template-columns:1fr;
    gap:16px;
    margin-top:18px;
    padding:20px;
    border-radius:20px;
  }
  .home-active-time-panel{
    min-width:0;
    width:100%;
  }
  .home-active-progress-line{
    align-items:flex-start;
    flex-direction:column;
    gap:8px;
  }
  .home-active-progress-track{
    width:100%;
    max-width:none;
  }
}
@media(prefers-reduced-motion:reduce){
  .home-active-badge i{animation:none}
}


/* =========================================================
   v3.1.7 — World time bar + warm red live attempt card
   ========================================================= */
.home-world-time-bar{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) 1px minmax(0,1fr) auto;
  align-items:center;
  gap:16px;
  margin:18px 0 0;
  padding:10px 14px;
  border:1px solid color-mix(in srgb,#2d6cdf 12%,var(--line,#d7e0eb));
  border-radius:18px;
  background:color-mix(in srgb,var(--surface,#fff) 92%,transparent);
  box-shadow:0 12px 28px rgba(15,35,65,.07);
  backdrop-filter:blur(14px);
}
.home-world-time-label{display:flex;align-items:center;gap:8px;white-space:nowrap;color:var(--muted,#66758a);font-size:10px;font-weight:900;letter-spacing:.08em}
.home-world-time-label i{width:7px;height:7px;border-radius:50%;background:#20a86b;box-shadow:0 0 0 4px rgba(32,168,107,.12);animation:homeActivePulse 1.6s ease-in-out infinite}
.home-world-clock{display:flex;align-items:center;gap:10px;min-width:0}
.home-world-code{display:inline-flex;width:34px;height:34px;align-items:center;justify-content:center;border-radius:11px;background:color-mix(in srgb,#2d6cdf 9%,var(--surface,#fff));border:1px solid color-mix(in srgb,#2d6cdf 15%,transparent);font-size:10px;font-weight:900;letter-spacing:.05em;color:#245ebf}
.home-world-clock-jp .home-world-code{background:color-mix(in srgb,#d9485f 9%,var(--surface,#fff));border-color:color-mix(in srgb,#d9485f 16%,transparent);color:#b63a50}
.home-world-clock div{display:grid;grid-template-columns:auto auto;column-gap:9px;align-items:baseline;min-width:0}
.home-world-clock small{grid-column:1/-1;color:var(--muted,#66758a);font-size:10px;font-weight:800}
.home-world-clock strong{font-size:17px;line-height:1.1;font-variant-numeric:tabular-nums;letter-spacing:-.025em}
.home-world-clock em{font-style:normal;color:var(--muted,#66758a);font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home-world-divider{align-self:stretch;background:var(--line,#d7e0eb);opacity:.8}
.home-world-difference{padding:7px 10px;border-radius:999px;background:color-mix(in srgb,#d9485f 7%,var(--surface,#fff));border:1px solid color-mix(in srgb,#d9485f 13%,transparent);color:#a93a4d;font-size:10px;font-weight:800;white-space:nowrap}
[data-theme="dark"] .home-world-time-bar{background:rgba(11,25,43,.78);border-color:rgba(128,160,207,.18);box-shadow:0 14px 30px rgba(0,0,0,.24)}
[data-theme="dark"] .home-world-code{color:#9db9ff;background:rgba(74,132,255,.12);border-color:rgba(113,158,255,.18)}
[data-theme="dark"] .home-world-clock-jp .home-world-code{color:#ff9aaa;background:rgba(217,72,95,.13);border-color:rgba(255,120,143,.18)}
[data-theme="dark"] .home-world-difference{color:#ff9aaa;background:rgba(217,72,95,.10);border-color:rgba(255,120,143,.15)}

.home-active-attempt{
  border-color:color-mix(in srgb,#d9485f 30%,var(--line,#d7e0eb));
  background:linear-gradient(135deg,color-mix(in srgb,#d9485f 9%,var(--surface,#fff)),color-mix(in srgb,#f08a5d 7%,var(--surface,#fff)));
  box-shadow:0 24px 54px rgba(172,53,75,.13);
}
.home-active-accent span:first-child{background:#d9485f}
.home-active-accent span:last-child{background:#f08a5d}
.home-active-badge{background:color-mix(in srgb,#d9485f 10%,var(--surface,#fff));border-color:color-mix(in srgb,#d9485f 22%,transparent);color:#b23a4e}
.home-active-progress-track span{background:linear-gradient(90deg,#d9485f,#f08a5d)}
.home-active-time-panel{border-color:color-mix(in srgb,#d9485f 20%,var(--line,#d7e0eb));background:color-mix(in srgb,var(--surface,#fff) 90%,#fff2f3)}
.home-active-continue{background:linear-gradient(135deg,#d9485f,#c63f55)!important;border-color:#c63f55!important;box-shadow:0 12px 24px rgba(201,61,83,.22)!important}
[data-theme="dark"] .home-active-attempt{background:linear-gradient(135deg,rgba(72,31,43,.96),rgba(65,35,31,.94));border-color:rgba(255,120,143,.27);box-shadow:0 24px 54px rgba(0,0,0,.30)}
[data-theme="dark"] .home-active-badge{background:rgba(217,72,95,.14);border-color:rgba(255,120,143,.23);color:#ff9aaa}
[data-theme="dark"] .home-active-time-panel{background:rgba(33,12,18,.42);border-color:rgba(255,120,143,.18)}
@media(max-width:820px){
  .home-world-time-bar{grid-template-columns:1fr 1px 1fr;gap:10px;padding:10px 12px}
  .home-world-time-label,.home-world-difference{grid-column:1/-1;justify-self:center}
  .home-world-time-label{order:-2}.home-world-difference{order:2}
}
@media(max-width:520px){
  .home-world-time-bar{gap:8px;border-radius:15px}
  .home-world-clock{gap:7px}
  .home-world-code{width:30px;height:30px;border-radius:9px}
  .home-world-clock strong{font-size:15px}
  .home-world-clock em{font-size:9px}
  .home-world-difference{white-space:normal;text-align:center}
}
@media(prefers-reduced-motion:reduce){.home-world-time-label i{animation:none}}

/* ===== Paper Categories & Levels v3.1.9 ===== */
.papers-hub-main,.student-dashboard-main{max-width:1240px}
.papers-hub-hero,.category-page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1.25rem;margin:0 0 1.15rem;padding:1.3rem 1.35rem;border:1px solid var(--line);border-radius:26px;background:linear-gradient(135deg,color-mix(in srgb,var(--card) 94%,#2563eb 6%),color-mix(in srgb,var(--card) 97%,#14b8a6 3%));box-shadow:var(--shadow)}
.papers-hub-hero h1,.category-page-head h1{margin:.2rem 0 .45rem;font-size:clamp(2rem,4vw,3rem);letter-spacing:-.03em}
.papers-hub-hero p,.category-page-head p{margin:0;color:var(--muted);max-width:720px;line-height:1.7}
.papers-hub-count,.category-page-summary{min-width:150px;padding:1rem 1.1rem;border:1px solid var(--line);border-radius:20px;background:color-mix(in srgb,var(--card) 86%,transparent);text-align:center}
.papers-hub-count strong,.category-page-summary strong{display:block;font-size:2rem;line-height:1;color:var(--text)}
.papers-hub-count span,.category-page-summary span{display:block;margin-top:.4rem;color:var(--muted);font-size:.82rem;font-weight:750}
.exam-category-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.exam-category-card,.exam-category-placeholder{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:28px;padding:1.35rem;background:var(--card);box-shadow:var(--shadow)}
.exam-category-card::after{content:"";position:absolute;width:240px;height:240px;border-radius:50%;right:-90px;top:-100px;background:radial-gradient(circle,rgba(37,99,235,.16),transparent 68%);pointer-events:none}
.exam-category-card>*{position:relative;z-index:1}
.exam-category-card-top{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.exam-category-mark,.dashboard-category-mark{display:inline-flex;align-items:center;justify-content:center;width:58px;height:58px;border-radius:18px;background:linear-gradient(135deg,#1d4ed8,#0f766e);color:#fff;font-size:1.55rem;font-weight:900;box-shadow:0 12px 28px rgba(37,99,235,.22)}
.exam-category-status{display:inline-flex;padding:.45rem .7rem;border-radius:999px;background:rgba(16,185,129,.12);border:1px solid rgba(16,185,129,.22);color:#047857;font-size:.78rem;font-weight:800}
[data-theme="dark"] .exam-category-status{color:#6ee7b7}
.exam-category-copy{margin:1rem 0}.exam-category-copy h2{font-size:clamp(1.65rem,3vw,2.25rem);margin:.2rem 0 .45rem}.exam-category-copy p{margin:0;color:var(--muted);line-height:1.72;max-width:760px}
.exam-category-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem;margin:1rem 0}
.exam-category-stats div{padding:.85rem;border:1px solid var(--line);border-radius:17px;background:var(--surface-2)}
.exam-category-stats strong{display:block;font-size:1.3rem}.exam-category-stats span{display:block;margin-top:.2rem;color:var(--muted);font-size:.78rem}
.exam-category-levels{display:flex;flex-wrap:wrap;gap:.55rem;margin:0 0 1rem}
.difficulty-chip,.paper-level-badge{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;font-weight:850;letter-spacing:.01em;border:1px solid transparent}
.difficulty-chip{padding:.48rem .72rem;font-size:.77rem}
.difficulty-chip.beginner,.paper-level-badge.beginner{background:#fff4bf;color:#7a5300;border-color:#f0cf5a}
.difficulty-chip.moderate,.paper-level-badge.moderate{background:#dcfce7;color:#166534;border-color:#86d4a1}
.difficulty-chip.intermediate,.paper-level-badge.intermediate{background:#fee2e2;color:#991b1b;border-color:#f3a2a2}
[data-theme="dark"] .difficulty-chip.beginner,[data-theme="dark"] .paper-level-badge.beginner{background:rgba(234,179,8,.17);color:#fde68a;border-color:rgba(250,204,21,.35)}
[data-theme="dark"] .difficulty-chip.moderate,[data-theme="dark"] .paper-level-badge.moderate{background:rgba(34,197,94,.16);color:#86efac;border-color:rgba(74,222,128,.32)}
[data-theme="dark"] .difficulty-chip.intermediate,[data-theme="dark"] .paper-level-badge.intermediate{background:rgba(239,68,68,.16);color:#fca5a5;border-color:rgba(248,113,113,.32)}
.exam-category-placeholder{display:flex;min-height:100%;flex-direction:column;align-items:center;justify-content:center;text-align:center;border-style:dashed;background:color-mix(in srgb,var(--card) 92%,transparent)}
.exam-category-placeholder-icon{display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:20px;background:var(--surface-2);border:1px solid var(--line);font-size:1.8rem;color:var(--muted)}
.exam-category-placeholder h2{margin:1rem 0 .4rem;font-size:1.2rem}.exam-category-placeholder p{margin:0;color:var(--muted);max-width:300px}
.papers-breadcrumb{display:flex;align-items:center;gap:.5rem;margin-bottom:.8rem;font-size:.86rem}.papers-breadcrumb span{color:var(--muted)}.papers-breadcrumb strong{color:var(--text)}
.paper-level-filters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.7rem;margin-bottom:1.15rem}
.paper-level-filter{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.9rem 1rem;border:1px solid var(--line);border-radius:17px;background:var(--card);color:var(--text);font-weight:800;box-shadow:0 8px 20px rgba(15,23,42,.04);transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}
.paper-level-filter:hover{text-decoration:none;transform:translateY(-2px)}
.paper-level-filter strong{display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:32px;padding:0 .55rem;border-radius:999px;background:var(--surface-2);font-size:.78rem}
.paper-level-filter.active{box-shadow:0 12px 28px rgba(15,23,42,.10)}
.paper-level-filter.active.all{border-color:#60a5fa;background:color-mix(in srgb,var(--card) 89%,#dbeafe 11%)}
.paper-level-filter.active.beginner{border-color:#eab308;background:color-mix(in srgb,var(--card) 88%,#fef3c7 12%)}
.paper-level-filter.active.moderate{border-color:#22c55e;background:color-mix(in srgb,var(--card) 88%,#dcfce7 12%)}
.paper-level-filter.active.intermediate{border-color:#ef4444;background:color-mix(in srgb,var(--card) 88%,#fee2e2 12%)}
.paper-list-summary{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin:0 0 .25rem}.paper-list-summary h2{margin:.15rem 0 0;font-size:1.25rem}
.categorized-paper-grid{margin-top:1rem!important}
.categorized-paper-card{border-top-width:4px!important}
.categorized-paper-card.level-beginner{border-top-color:#eab308!important}.categorized-paper-card.level-moderate{border-top-color:#22c55e!important}.categorized-paper-card.level-intermediate{border-top-color:#ef4444!important}
.paper-card-topline{display:flex;align-items:center;justify-content:space-between;gap:.75rem}
.paper-level-badge{padding:.34rem .58rem;font-size:.7rem;white-space:nowrap}
.student-dashboard-head{margin-bottom:1rem}
.dashboard-section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin:1.35rem 0 .75rem}.dashboard-section-heading h2{margin:.1rem 0 0}.dashboard-section-heading>a{font-weight:800}
.dashboard-active-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:.8rem}
.dashboard-active-card{display:grid;grid-template-columns:1fr auto;gap:.7rem;align-items:center;padding:1rem;border:1px solid rgba(239,68,68,.24);border-radius:20px;background:linear-gradient(135deg,rgba(239,68,68,.10),rgba(251,146,60,.06));box-shadow:var(--shadow)}
.dashboard-active-card>span{font-weight:800}.dashboard-active-card>strong{font-size:1.45rem;color:#b91c1c}.dashboard-active-card>.btn{grid-column:1/-1}
[data-theme="dark"] .dashboard-active-card>strong{color:#fca5a5}
.dashboard-category-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:1rem;align-items:center;padding:1rem 1.1rem;border:1px solid var(--line);border-radius:22px;background:var(--card);box-shadow:var(--shadow)}
.dashboard-category-card h3{margin:.1rem 0 .3rem;font-size:1.3rem}.dashboard-category-card p{margin:0;color:var(--muted)}
.dashboard-category-meta{text-align:center;padding:.7rem .9rem;border-radius:16px;background:var(--surface-2);border:1px solid var(--line)}.dashboard-category-meta strong{display:block;font-size:1.45rem}.dashboard-category-meta span{font-size:.72rem;color:var(--muted)}
.dashboard-quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem}
.dashboard-quick-grid a{display:grid;gap:.25rem;padding:1rem;border:1px solid var(--line);border-radius:20px;background:var(--card);color:var(--text);box-shadow:var(--shadow)}
.dashboard-quick-grid a:hover{text-decoration:none;transform:translateY(-2px)}.dashboard-quick-grid a>span{font-size:1.25rem;color:var(--accent2)}.dashboard-quick-grid strong{font-size:1rem}.dashboard-quick-grid small{color:var(--muted)}
@media(max-width:900px){.exam-category-grid{grid-template-columns:1fr}.paper-level-filters{grid-template-columns:repeat(2,1fr)}.dashboard-category-card{grid-template-columns:auto 1fr}.dashboard-category-meta,.dashboard-category-card>.btn{grid-column:auto}.dashboard-quick-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.papers-hub-hero,.category-page-head{align-items:flex-start;flex-direction:column;padding:1rem;border-radius:22px}.papers-hub-count,.category-page-summary{width:100%}.exam-category-card,.exam-category-placeholder{padding:1rem;border-radius:22px}.exam-category-stats{grid-template-columns:1fr}.paper-level-filters{grid-template-columns:1fr 1fr}.paper-level-filter{padding:.78rem}.paper-list-summary{align-items:flex-start;flex-direction:column}.dashboard-category-card{grid-template-columns:auto 1fr}.dashboard-category-meta{grid-column:1/2}.dashboard-category-card>.btn{grid-column:2/3;width:100%}.dashboard-quick-grid{grid-template-columns:1fr 1fr}}
@media(max-width:430px){.paper-level-filters{grid-template-columns:1fr}.dashboard-category-card{grid-template-columns:1fr}.dashboard-category-mark{width:52px;height:52px}.dashboard-category-meta,.dashboard-category-card>.btn{grid-column:1}.dashboard-quick-grid{grid-template-columns:1fr}}


/* ===== v3.2.0 — Max 3 paper cards + compact home spacing ===== */
.categorized-paper-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  max-width:100%;
}
.compact-home-main{
  margin-top:12px!important;
}
.compact-home-main .home-world-time-bar{
  margin:0 0 10px!important;
}
.compact-home-main .home-active-attempt{
  margin:0 0 12px!important;
}
.compact-home-main .landing-hero{
  min-height:auto!important;
  padding:24px 0 48px!important;
  gap:clamp(28px,4vw,56px)!important;
}
.compact-home-main .landing-hero h1{
  margin-top:18px;
}
.compact-home-main .landing-actions{
  margin-top:24px;
}
.compact-home-main .landing-trust-row{
  margin-top:26px;
}
@media(max-width:900px){
  .categorized-paper-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .compact-home-main{margin-top:10px!important}
  .compact-home-main .landing-hero{padding:20px 0 40px!important}
}
@media(max-width:620px){
  .categorized-paper-grid{grid-template-columns:1fr!important}
  .compact-home-main{margin-top:8px!important}
  .compact-home-main .home-world-time-bar{margin-bottom:8px!important}
  .compact-home-main .landing-hero{padding:16px 0 34px!important}
  .compact-home-main .landing-hero h1{margin-top:16px}
}

/* =========================================================
   v3.2.1 — Coastal Blues colour system
   Palette: #012A4A #013A63 #01497C #014F86 #2A6F97
            #2C7DA0 #468FAF #61A5C2 #89C2D9 #A9D6E5
   ========================================================= */
html[data-theme="light"]{
  --navy:#012A4A;
  --navy2:#013A63;
  --teal:#2C7DA0;
  --gold:#61A5C2;
  --bg:#F4FAFD;
  --bg-start:#F9FCFE;
  --bg-end:#EAF5FA;
  --card:#FFFFFF;
  --text:#012A4A;
  --muted:#2A6F97;
  --line:#C7E2EE;
  --border:#C7E2EE;
  --surface:#FFFFFF;
  --surface-2:#EDF7FB;
  --surface-3:#DCEEF6;
  --soft:#EDF7FB;
  --input:#FFFFFF;
  --topbar:#012A4A;
  --accent:#014F86;
  --accent2:#2C7DA0;
  --green:#2C7DA0;
  --orange:#468FAF;
  --minimal-bg:#F4FAFD;
  --minimal-surface:rgba(255,255,255,.96);
  --minimal-surface-soft:rgba(244,250,253,.90);
  --minimal-border:#C7E2EE;
  --minimal-shadow:0 10px 28px rgba(1,42,74,.08);
  --minimal-shadow-hover:0 16px 36px rgba(1,42,74,.13);
  --minimal-primary:#014F86;
  --minimal-primary-hover:#013A63;
  --minimal-success:#2C7DA0;
  --home-panel:#FFFFFF;
  --home-panel-soft:#EDF7FB;
  --home-panel-border:#C7E2EE;
  --home-copy:#012A4A;
  --home-copy-muted:#2A6F97;
  --header-bg:#012A4A;
  --header-text:#F7FCFF;
  --header-muted:#A9D6E5;
  --header-accent:#61A5C2;
  --shadow:0 16px 38px rgba(1,42,74,.09);
}
html[data-theme="dark"]{
  --navy:#001E35;
  --navy2:#012A4A;
  --teal:#61A5C2;
  --gold:#89C2D9;
  --bg:#001521;
  --bg-start:#001521;
  --bg-end:#001E35;
  --card:#012A4A;
  --text:#F1FAFD;
  --muted:#A9D6E5;
  --line:#2A6F97;
  --border:#2A6F97;
  --surface:#012A4A;
  --surface-2:#013A63;
  --surface-3:#01497C;
  --soft:#013A63;
  --input:#001E35;
  --topbar:#001E35;
  --accent:#89C2D9;
  --accent2:#61A5C2;
  --green:#61A5C2;
  --orange:#468FAF;
  --minimal-bg:#001521;
  --minimal-surface:rgba(1,42,74,.95);
  --minimal-surface-soft:rgba(1,58,99,.78);
  --minimal-border:#2A6F97;
  --minimal-shadow:0 12px 30px rgba(0,0,0,.30);
  --minimal-shadow-hover:0 18px 40px rgba(0,0,0,.40);
  --minimal-primary:#61A5C2;
  --minimal-primary-hover:#89C2D9;
  --minimal-success:#61A5C2;
  --home-panel:#012A4A;
  --home-panel-soft:#013A63;
  --home-panel-border:#2A6F97;
  --home-copy:#F1FAFD;
  --home-copy-muted:#A9D6E5;
  --header-bg:#001E35;
  --header-text:#F7FCFF;
  --header-muted:#A9D6E5;
  --header-accent:#89C2D9;
  --shadow:0 18px 44px rgba(0,0,0,.34);
}

body{
  background:
    radial-gradient(circle at 10% 0%,rgba(97,165,194,.15),transparent 34%),
    radial-gradient(circle at 92% 8%,rgba(137,194,217,.13),transparent 31%),
    linear-gradient(180deg,var(--bg-start),var(--bg-end))!important;
}
html[data-theme="dark"] body{
  background:
    radial-gradient(circle at 12% -4%,rgba(44,125,160,.22),transparent 34%),
    radial-gradient(circle at 94% 8%,rgba(70,143,175,.17),transparent 31%),
    linear-gradient(180deg,var(--bg-start),var(--bg-end))!important;
}

/* Header and compact controls */
.topbar{
  background:linear-gradient(90deg,#012A4A 0%,#013A63 58%,#01497C 100%)!important;
  border-bottom-color:rgba(169,214,229,.22)!important;
  box-shadow:0 8px 24px rgba(1,42,74,.22)!important;
}
.brand,.brand-wordmark-copy strong,.topbar nav a{color:#F7FCFF!important}
.brand-wordmark-copy small{color:#A9D6E5!important}
.topbar nav a::after{background:#89C2D9!important}
.theme-toggle,.language-control,.compact-profile-menu>summary{
  background:rgba(169,214,229,.10)!important;
  border-color:rgba(169,214,229,.24)!important;
  color:#F7FCFF!important;
}
.theme-toggle:hover,.language-control:hover,.compact-profile-menu>summary:hover{
  background:rgba(169,214,229,.17)!important;
  border-color:rgba(169,214,229,.40)!important;
}
.theme-icon{background:rgba(169,214,229,.14)!important;color:#F7FCFF!important}
.language-control select{color:#F7FCFF!important}
.profile-dropdown{border-color:#89C2D9!important}
.profile-dropdown-links a:hover{background:color-mix(in srgb,#A9D6E5 20%,var(--surface-2))!important}

/* Global interactive colours */
a{color:#014F86}
html[data-theme="dark"] a{color:#89C2D9}
.eyebrow,.paper-no,.notes-viewer-kicker,.study-reference span{color:#2C7DA0!important}
html[data-theme="dark"] .eyebrow,
html[data-theme="dark"] .paper-no,
html[data-theme="dark"] .notes-viewer-kicker,
html[data-theme="dark"] .study-reference span{color:#89C2D9!important}
.btn.primary,.notes-action.primary,.home-active-continue{
  color:#fff!important;
  background:linear-gradient(135deg,#01497C,#2C7DA0)!important;
  border-color:#01497C!important;
  box-shadow:0 12px 26px rgba(1,73,124,.22)!important;
}
.btn.primary:hover,.notes-action.primary:hover,.home-active-continue:hover{
  background:linear-gradient(135deg,#013A63,#014F86)!important;
}
.btn.secondary{
  background:#EAF5FA!important;
  color:#013A63!important;
  border-color:#A9D6E5!important;
}
html[data-theme="dark"] .btn.secondary{
  background:#013A63!important;
  color:#F1FAFD!important;
  border-color:#2A6F97!important;
}
.form-grid input:focus,.form-grid select:focus,
.feedback-field input:focus,.feedback-field textarea:focus{
  border-color:#2C7DA0!important;
  outline-color:rgba(97,165,194,.24)!important;
  box-shadow:0 0 0 4px rgba(97,165,194,.16)!important;
}

/* Main surfaces */
.card,.paper-card,.metric-card,.stat-card,.question-card,.exam-sidebar,
.review-card,.profile-dropdown,.account-panel,.notes-card,.kb-doc-card,
.transcribed-page,.article-sidebar-card,.topic-card-redesign,
.exam-category-card,.exam-category-placeholder,.paper-level-filter,
.dashboard-category-card,.dashboard-quick-grid a{
  border-color:var(--line)!important;
  box-shadow:var(--shadow)!important;
}
.paper-card:hover,.card:hover,.metric-card:hover,.stat-card:hover{
  border-color:#61A5C2!important;
  box-shadow:0 18px 40px rgba(1,73,124,.14)!important;
}

/* Public home */
.landing-badge,.home-world-time-bar{
  border-color:#A9D6E5!important;
  background:rgba(255,255,255,.86)!important;
}
html[data-theme="dark"] .landing-badge,
html[data-theme="dark"] .home-world-time-bar{background:rgba(1,42,74,.86)!important;border-color:#2A6F97!important}
.landing-badge i,.exam-preview-label i{background:#2C7DA0!important;box-shadow:0 0 0 5px rgba(97,165,194,.18)!important}
.landing-text-link span,.landing-steps article>b,.subject-pills i{color:#2C7DA0!important}
.exam-preview::before{background:linear-gradient(90deg,#01497C,#61A5C2,#A9D6E5)!important}
.exam-preview-progress span{background:linear-gradient(90deg,#01497C,#2C7DA0)!important}
.feature-icon{
  background:#DCEEF6!important;
  color:#014F86!important;
}
html[data-theme="dark"] .feature-icon{background:#013A63!important;color:#A9D6E5!important}
.landing-feature-grid article:hover{border-color:#61A5C2!important;box-shadow:0 18px 38px rgba(1,73,124,.13)!important}
.landing-cta{
  background:linear-gradient(135deg,#012A4A 0%,#013A63 48%,#014F86 100%)!important;
  box-shadow:0 24px 54px rgba(1,42,74,.24)!important;
}
.landing-cta .eyebrow{color:#A9D6E5!important}

/* Live Sri Lanka/Japan bar */
.home-world-code{
  background:#EAF5FA!important;
  border-color:#A9D6E5!important;
  color:#01497C!important;
}
.home-world-clock-jp .home-world-code{
  background:#DCEEF6!important;
  border-color:#89C2D9!important;
  color:#013A63!important;
}
.home-world-difference{
  background:#EAF5FA!important;
  border-color:#A9D6E5!important;
  color:#014F86!important;
}
html[data-theme="dark"] .home-world-code,
html[data-theme="dark"] .home-world-clock-jp .home-world-code,
html[data-theme="dark"] .home-world-difference{
  background:#013A63!important;
  border-color:#2A6F97!important;
  color:#A9D6E5!important;
}

/* Active attempt now follows the Coastal Blues system */
.home-active-attempt,.dashboard-active-card{
  border-color:#61A5C2!important;
  background:linear-gradient(135deg,#EDF7FB 0%,#DCEEF6 58%,#EAF5FA 100%)!important;
  box-shadow:0 22px 48px rgba(1,73,124,.14)!important;
}
.home-active-accent span:first-child{background:#2C7DA0!important}
.home-active-accent span:last-child{background:#89C2D9!important}
.home-active-badge{
  background:#DCEEF6!important;
  border-color:#89C2D9!important;
  color:#01497C!important;
}
.home-active-progress-track span{background:linear-gradient(90deg,#01497C,#61A5C2)!important}
.home-active-time-panel{
  border-color:#A9D6E5!important;
  background:rgba(255,255,255,.72)!important;
}
html[data-theme="dark"] .home-active-attempt,
html[data-theme="dark"] .dashboard-active-card{
  background:linear-gradient(135deg,#012A4A,#013A63)!important;
  border-color:#2C7DA0!important;
  box-shadow:0 24px 54px rgba(0,0,0,.30)!important;
}
html[data-theme="dark"] .home-active-badge,
html[data-theme="dark"] .home-active-time-panel{
  background:#013A63!important;
  border-color:#2A6F97!important;
  color:#A9D6E5!important;
}
.dashboard-active-card>strong{color:#014F86!important}
html[data-theme="dark"] .dashboard-active-card>strong{color:#A9D6E5!important}

/* Papers and categories */
.papers-hub-hero,.category-page-head{
  background:linear-gradient(135deg,#F4FAFD,#DCEEF6)!important;
  border-color:#A9D6E5!important;
}
html[data-theme="dark"] .papers-hub-hero,
html[data-theme="dark"] .category-page-head{
  background:linear-gradient(135deg,#012A4A,#013A63)!important;
  border-color:#2A6F97!important;
}
.exam-category-card::after{background:radial-gradient(circle,rgba(97,165,194,.26),transparent 68%)!important}
.exam-category-mark,.dashboard-category-mark{
  background:linear-gradient(135deg,#012A4A,#2C7DA0)!important;
  box-shadow:0 12px 28px rgba(1,73,124,.24)!important;
}
.paper-level-filter.active.all{
  border-color:#2C7DA0!important;
  background:#EAF5FA!important;
}
html[data-theme="dark"] .paper-level-filter.active.all{background:#013A63!important}

/* Exam UI */
.timer-box{background:linear-gradient(145deg,#012A4A,#01497C)!important;border-color:#2C7DA0!important}
.navigator button.current{background:linear-gradient(135deg,#013A63,#2C7DA0)!important}
.option:has(input:checked){border-color:#2C7DA0!important;background:#EAF5FA!important}
html[data-theme="dark"] .option:has(input:checked){background:#013A63!important}
.option:has(input:checked) .option-letter{background:#2C7DA0!important}
.save-state{background:#DCEEF6!important;color:#014F86!important}
html[data-theme="dark"] .save-state{background:#013A63!important;color:#A9D6E5!important}

/* Notes and article library */
.notes-badge,.article-doc-tabs a.active,.notes-action.primary,
.study-reference a,.notes-inline-link{
  border-color:#61A5C2!important;
}
.notes-badge{background:#DCEEF6!important;color:#014F86!important}
.notes-paper-card::before,.kb-doc-card::before,
.article-hero-panel-art .paper::before{
  background:linear-gradient(90deg,#012A4A,#2C7DA0,#89C2D9)!important;
}
.article-doc-tabs a.active,.study-reference a{
  background:linear-gradient(135deg,#01497C,#2C7DA0)!important;
}
.study-reference{
  background:linear-gradient(135deg,rgba(97,165,194,.14),rgba(169,214,229,.18))!important;
  border-color:#A9D6E5!important;
}
.transcribed-page-head,.topic-group-redesign summary{
  background:linear-gradient(135deg,rgba(97,165,194,.16),rgba(169,214,229,.18))!important;
}

/* Analytics and charts */
.trend-line{stroke:#2C7DA0!important}
.donut{background:conic-gradient(#2C7DA0 calc(var(--pct)*1%),var(--surface-3) 0)!important}
.conclusion-card{border-top-color:#2C7DA0!important}
.bar-fill,.paper-card-progress span{background:linear-gradient(90deg,#01497C,#61A5C2)!important}

/* Footer */
.site-footer{
  background:linear-gradient(135deg,#001E35 0%,#012A4A 52%,#013A63 100%)!important;
  border-top-color:#2A6F97!important;
}
.footer-brand-block span b,.footer-version em{color:#89C2D9!important}
.footer-version{border-color:rgba(169,214,229,.24)!important;background:rgba(169,214,229,.08)!important}

/* Keep requested semantic difficulty colours and clear error/success states. */
.difficulty-chip.beginner,.paper-level-badge.beginner,
.difficulty-chip.moderate,.paper-level-badge.moderate,
.difficulty-chip.intermediate,.paper-level-badge.intermediate{
  /* Intentionally unchanged for fast level recognition. */
}

/* ===== Notes Main Categories v3.2.2 ===== */
.notes-category-main{max-width:1240px}
.notes-hub-hero,.notes-category-page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1.25rem;margin:0 0 1.15rem;padding:1.3rem 1.35rem;border:1px solid #A9D6E5;border-radius:26px;background:linear-gradient(135deg,#F4FAFD,#DCEEF6);box-shadow:var(--shadow)}
html[data-theme="dark"] .notes-hub-hero,html[data-theme="dark"] .notes-category-page-head{background:linear-gradient(135deg,#012A4A,#013A63);border-color:#2A6F97}
.notes-hub-hero h1,.notes-category-page-head h1{margin:.2rem 0 .45rem;font-size:clamp(2rem,4vw,3rem);letter-spacing:-.03em}
.notes-hub-hero p,.notes-category-page-head p{margin:0;color:var(--muted);max-width:720px;line-height:1.7}
.notes-hub-count,.notes-category-page-summary{min-width:150px;padding:1rem 1.1rem;border:1px solid #A9D6E5;border-radius:20px;background:rgba(255,255,255,.72);text-align:center}
html[data-theme="dark"] .notes-hub-count,html[data-theme="dark"] .notes-category-page-summary{background:rgba(1,42,74,.62);border-color:#2A6F97}
.notes-hub-count strong,.notes-category-page-summary strong{display:block;font-size:2rem;line-height:1;color:var(--text)}
.notes-hub-count span,.notes-category-page-summary span{display:block;margin-top:.4rem;color:var(--muted);font-size:.82rem;font-weight:750}
.notes-category-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-bottom:2rem}
.notes-category-card,.notes-category-placeholder{position:relative;overflow:hidden;padding:1.3rem;border-radius:28px;border:1px solid #A9D6E5;background:linear-gradient(145deg,#fff,#EDF7FB);box-shadow:var(--shadow)}
html[data-theme="dark"] .notes-category-card,html[data-theme="dark"] .notes-category-placeholder{background:linear-gradient(145deg,#012A4A,#013A63);border-color:#2A6F97}
.notes-category-card::after{content:"";position:absolute;right:-74px;top:-74px;width:220px;height:220px;border-radius:999px;background:radial-gradient(circle,rgba(97,165,194,.28),transparent 68%);pointer-events:none}
.notes-category-card-top{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.1rem}
.notes-category-mark{display:inline-flex;width:62px;height:62px;align-items:center;justify-content:center;border-radius:20px;background:linear-gradient(135deg,#012A4A,#2C7DA0);color:#fff;font-size:1.75rem;font-weight:900;box-shadow:0 12px 28px rgba(1,73,124,.24)}
.notes-category-status{position:relative;z-index:1;padding:.48rem .72rem;border:1px solid #89C2D9;border-radius:999px;background:#EAF5FA;color:#01497C;font-size:.76rem;font-weight:800}
html[data-theme="dark"] .notes-category-status{background:#013A63;color:#A9D6E5;border-color:#2A6F97}
.notes-category-copy{position:relative;z-index:1}.notes-category-copy h2{margin:.35rem 0 .55rem;font-size:clamp(1.65rem,3vw,2.35rem)}.notes-category-copy p{margin:0;color:var(--muted);line-height:1.72;max-width:64ch}
.notes-category-stats{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin:1.1rem 0}
.notes-category-stats div{padding:.9rem;border:1px solid #A9D6E5;border-radius:18px;background:rgba(255,255,255,.66)}
html[data-theme="dark"] .notes-category-stats div{background:rgba(1,42,74,.52);border-color:#2A6F97}
.notes-category-stats strong{display:block;font-size:1.25rem}.notes-category-stats span{display:block;margin-top:.25rem;color:var(--muted);font-size:.78rem;font-weight:700}
.notes-category-preview{display:flex;gap:.55rem;flex-wrap:wrap;margin:0 0 1.05rem}.notes-category-preview span{padding:.5rem .68rem;border-radius:999px;background:#DCEEF6;color:#01497C;border:1px solid #A9D6E5;font-size:.75rem;font-weight:800}
html[data-theme="dark"] .notes-category-preview span{background:#013A63;color:#A9D6E5;border-color:#2A6F97}
.notes-category-placeholder{display:flex;min-height:100%;align-items:center;justify-content:center;flex-direction:column;text-align:center;border-style:dashed;background:linear-gradient(145deg,rgba(237,247,251,.8),rgba(220,238,246,.72))}
html[data-theme="dark"] .notes-category-placeholder{background:linear-gradient(145deg,rgba(1,42,74,.75),rgba(1,58,99,.72))}
.notes-category-placeholder-icon{display:inline-flex;width:58px;height:58px;align-items:center;justify-content:center;border-radius:18px;background:#DCEEF6;color:#01497C;font-size:1.8rem;font-weight:600}.notes-category-placeholder h2{margin:1rem 0 .45rem}.notes-category-placeholder p{margin:0;color:var(--muted);line-height:1.65}
html[data-theme="dark"] .notes-category-placeholder-icon{background:#01497C;color:#A9D6E5}
.notes-breadcrumb{display:flex;align-items:center;gap:.5rem;margin-bottom:.8rem;font-size:.86rem}.notes-breadcrumb span{color:var(--muted)}.notes-breadcrumb strong{color:var(--text)}
.notes-category-intro{display:flex;justify-content:space-between;align-items:center;gap:1.25rem;margin:0 0 1rem;padding:1.15rem 1.25rem;border:1px solid var(--border);border-radius:24px;background:var(--card);box-shadow:var(--shadow)}
.notes-category-intro h2{margin:.35rem 0 .35rem}.notes-category-intro p{margin:0;color:var(--muted);line-height:1.7;max-width:760px}.notes-category-intro-stat{min-width:135px;text-align:center;padding:.85rem;border-radius:18px;background:#EAF5FA;border:1px solid #A9D6E5}.notes-category-intro-stat strong{display:block;font-size:1.65rem}.notes-category-intro-stat span{display:block;margin-top:.2rem;color:var(--muted);font-size:.78rem;font-weight:700}
html[data-theme="dark"] .notes-category-intro-stat{background:#013A63;border-color:#2A6F97}
.notes-category-article-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.notes-category-article-card{display:flex;flex-direction:column}.notes-category-article-card p{flex:1}.notes-article-card-top{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.notes-article-category-tag{padding:.35rem .55rem;border-radius:999px;background:#DCEEF6;color:#01497C;border:1px solid #A9D6E5;font-size:.7rem;font-weight:900}.notes-category-article-card .btn{align-self:flex-start}
html[data-theme="dark"] .notes-article-category-tag{background:#013A63;color:#A9D6E5;border-color:#2A6F97}
.notes-category-reference-feature{margin-bottom:2.25rem}
@media(max-width:900px){.notes-category-grid{grid-template-columns:1fr}.notes-category-article-grid{grid-template-columns:1fr}.notes-category-placeholder{min-height:240px}.notes-hub-hero,.notes-category-page-head,.notes-category-intro{align-items:flex-start;flex-direction:column}.notes-hub-count,.notes-category-page-summary,.notes-category-intro-stat{width:100%}}
@media(max-width:640px){.notes-hub-hero,.notes-category-page-head,.notes-category-card,.notes-category-placeholder,.notes-category-intro{padding:1rem;border-radius:22px}.notes-category-stats{grid-template-columns:1fr}.notes-category-preview{display:grid}.notes-category-preview span{text-align:center}.notes-category-page-head h1,.notes-hub-hero h1{font-size:2rem}}

/* ===== Saved Papers & Warm Live Attempt v3.2.3 ===== */
/* Home active attempt: keep it clearly visible with a warm red accent. */
.home-active-attempt{
  border-color:#f0a3ad!important;
  background:linear-gradient(135deg,#fff6f7 0%,#ffe9ec 52%,#fff3f4 100%)!important;
  box-shadow:0 22px 48px rgba(173,45,68,.16)!important;
}
.home-active-accent span:first-child{background:#d94c65!important}
.home-active-accent span:last-child{background:#f3a5b2!important}
.home-active-badge{
  background:#ffe1e6!important;
  border-color:#f4a6b3!important;
  color:#9f2440!important;
}
.home-active-badge i{background:#d92f50!important;box-shadow:0 0 0 5px rgba(217,47,80,.14)!important}
.home-active-progress-track{background:#f8d6dc!important}
.home-active-progress-track span{background:linear-gradient(90deg,#be123c,#e85b74)!important}
.home-active-time-panel{
  border-color:#f1b4bd!important;
  background:rgba(255,255,255,.78)!important;
}
.home-active-continue{
  background:linear-gradient(135deg,#c51f45,#e24764)!important;
  border-color:#b91c3f!important;
  box-shadow:0 12px 26px rgba(190,18,60,.24)!important;
}
.home-active-continue:hover{background:linear-gradient(135deg,#a91638,#c9274d)!important}
html[data-theme="dark"] .home-active-attempt{
  background:linear-gradient(135deg,#471827,#35131e)!important;
  border-color:#8f3550!important;
  box-shadow:0 24px 54px rgba(0,0,0,.32)!important;
}
html[data-theme="dark"] .home-active-badge{
  background:rgba(224,63,96,.16)!important;
  border-color:rgba(244,114,143,.34)!important;
  color:#ffb4c2!important;
}
html[data-theme="dark"] .home-active-time-panel{
  background:rgba(38,8,18,.58)!important;
  border-color:rgba(244,114,143,.28)!important;
}
html[data-theme="dark"] .home-active-progress-track{background:rgba(244,114,143,.16)!important}

/* Paper save control */
.paper-card-top-actions{display:flex;align-items:center;gap:.55rem;flex-wrap:wrap;justify-content:flex-end}
.paper-save-form{margin:0}
.paper-save-button{
  display:inline-flex;
  align-items:center;
  gap:.38rem;
  min-height:32px;
  padding:.34rem .58rem;
  border-radius:999px;
  border:1px solid #A9D6E5;
  background:#F4FAFD;
  color:#014F86;
  font:inherit;
  cursor:pointer;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background .16s ease;
}
.paper-save-button span{font-size:.92rem;line-height:1}
.paper-save-button small{font-size:.68rem;font-weight:850;white-space:nowrap}
.paper-save-button:hover{transform:translateY(-1px);border-color:#61A5C2;box-shadow:0 8px 18px rgba(1,73,124,.12)}
.paper-save-button.is-saved{background:#fff3c4;border-color:#e9c85b;color:#745000}
html[data-theme="dark"] .paper-save-button{background:#013A63;border-color:#2A6F97;color:#A9D6E5}
html[data-theme="dark"] .paper-save-button.is-saved{background:rgba(234,179,8,.18);border-color:rgba(250,204,21,.38);color:#fde68a}

/* Saved papers dashboard */
.dashboard-saved-section{margin-top:1.4rem}
.dashboard-saved-section .dashboard-section-heading p{margin:.3rem 0 0;color:var(--muted);max-width:720px;line-height:1.6}
.saved-paper-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.saved-paper-card{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:.9rem;
  padding:1rem;
  border:1px solid var(--line);
  border-top:4px solid #2C7DA0;
  border-radius:22px;
  background:linear-gradient(145deg,#fff,#F4FAFD);
  box-shadow:var(--shadow);
}
.saved-paper-card.level-beginner{border-top-color:#eab308}
.saved-paper-card.level-moderate{border-top-color:#22c55e}
.saved-paper-card.level-intermediate{border-top-color:#ef4444}
html[data-theme="dark"] .saved-paper-card{background:linear-gradient(145deg,#012A4A,#013A63);border-color:#2A6F97}
.saved-paper-card-head{display:flex;align-items:center;justify-content:space-between;gap:.75rem}
.saved-paper-icon{
  display:inline-flex;
  width:38px;
  height:38px;
  align-items:center;
  justify-content:center;
  border-radius:13px;
  background:#fff3c4;
  border:1px solid #e9c85b;
  color:#815900;
  font-size:1rem;
}
.saved-paper-copy h3{margin:.25rem 0 .25rem;font-size:1.22rem}
.saved-paper-copy p{margin:0;color:var(--muted);font-size:.82rem}
.saved-paper-meta{display:grid;grid-template-columns:1fr 1fr;gap:.65rem}
.saved-paper-meta div{padding:.75rem;border:1px solid var(--line);border-radius:15px;background:color-mix(in srgb,var(--surface,#fff) 84%,#A9D6E5 16%)}
.saved-paper-meta span{display:block;color:var(--muted);font-size:.72rem;font-weight:750}
.saved-paper-meta strong{display:block;margin-top:.2rem;font-size:1rem}
.saved-paper-actions{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin-top:auto}
.saved-paper-actions form{margin:0}
.saved-paper-actions .btn{width:100%;min-height:42px;justify-content:center;padding:.65rem .75rem;font-size:.78rem}
.saved-paper-empty{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:1rem;align-items:center;padding:1rem 1.1rem}
.saved-paper-empty>span{display:inline-flex;width:48px;height:48px;align-items:center;justify-content:center;border-radius:16px;background:#fff3c4;border:1px solid #e9c85b;color:#815900;font-size:1.2rem}
.saved-paper-empty h3{margin:0 0 .25rem}.saved-paper-empty p{margin:0;color:var(--muted)}
@media(max-width:980px){.saved-paper-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){
  .saved-paper-grid{grid-template-columns:1fr}
  .saved-paper-empty{grid-template-columns:auto 1fr}
  .saved-paper-empty>.btn{grid-column:1/-1;width:100%}
  .paper-card-topline{align-items:flex-start}
  .paper-card-top-actions{justify-content:flex-end}
}
@media(max-width:430px){
  .paper-card-top-actions{align-items:flex-end;flex-direction:column}
  .saved-paper-actions{grid-template-columns:1fr}
}


/* ===== Paper completion marker alignment v3.2.4 ===== */
.paper-card .paper-number-wrap{display:inline-flex!important;align-items:center!important;gap:.42rem!important;min-width:0}
.paper-card .paper-complete-mark{position:static!important;inset:auto!important;margin:0!important;transform:none!important;flex:0 0 24px!important}
@media(max-width:620px){.paper-card .paper-number-wrap{gap:.35rem!important}.paper-card .paper-complete-mark{width:22px!important;height:22px!important;flex-basis:22px!important;font-size:.76rem!important}}


/* ===== v3.2.5 Custom language and extra-time menus ===== */
.language-menu{position:relative;flex:0 0 auto;z-index:90}
.language-menu>summary{list-style:none;height:38px;min-width:108px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);color:#fff;border-radius:999px;display:inline-flex;align-items:center;gap:7px;padding:5px 10px;box-shadow:inset 0 1px 0 rgba(255,255,255,.08);cursor:pointer;user-select:none;transition:background .18s ease,border-color .18s ease,transform .18s ease}
.language-menu>summary::-webkit-details-marker{display:none}
.language-menu>summary:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.34)}
.language-menu-icon{display:grid;place-items:center;width:23px;height:23px;border-radius:50%;background:rgba(255,255,255,.12);font-family:"Noto Sans JP",sans-serif;font-size:.88rem;font-weight:900}
.language-menu-current{font-size:.88rem;font-weight:800;white-space:nowrap}
.language-menu-chevron{margin-left:auto;font-size:.8rem;line-height:1;transition:transform .18s ease}
.language-menu[open] .language-menu-chevron{transform:rotate(180deg)}
.language-menu-panel{position:absolute;top:calc(100% + 10px);right:0;width:220px;padding:10px;border:1px solid var(--line);border-radius:18px;background:var(--glass);box-shadow:0 22px 60px rgba(1,42,74,.24);backdrop-filter:blur(22px) saturate(145%);-webkit-backdrop-filter:blur(22px) saturate(145%);z-index:150}
.language-menu-title{display:block;padding:5px 8px 9px;color:var(--muted);font-size:.72rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.language-menu-panel a{display:grid;grid-template-columns:34px 1fr 22px;gap:9px;align-items:center;padding:10px;border-radius:13px;color:var(--text)!important;text-decoration:none!important;transition:background .16s ease,transform .16s ease}
.language-menu-panel a:hover{background:var(--surface-2);transform:translateX(2px)}
.language-menu-panel a.active{background:linear-gradient(135deg,rgba(44,125,160,.16),rgba(137,194,217,.18));box-shadow:inset 0 0 0 1px rgba(70,143,175,.28)}
.language-code{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:linear-gradient(135deg,#01497C,#2C7DA0);color:#fff;font-size:.7rem;font-weight:900;letter-spacing:.04em}
.language-menu-panel a strong{font-size:.92rem}
.language-check{color:#2C7DA0;font-weight:900;text-align:center}
html[data-theme="dark"] .language-menu-panel{background:rgba(0,30,53,.96);border-color:rgba(137,194,217,.18)}
html[data-theme="dark"] .language-menu-panel a.active{background:linear-gradient(135deg,rgba(44,125,160,.28),rgba(1,73,124,.32))}

.extra-time-picker{border:0;padding:0;margin:0;min-width:0}
.extra-time-picker legend{padding:0;margin:0 0 10px;font-weight:850;color:var(--text)}
.extra-time-choice-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin-bottom:10px}
.extra-minute-choice{appearance:none;border:1px solid var(--line);background:var(--surface);color:var(--text);border-radius:13px;min-height:58px;padding:8px 6px;display:grid;place-items:center;gap:1px;cursor:pointer;font:inherit;box-shadow:0 5px 14px rgba(1,42,74,.05);transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease}
.extra-minute-choice strong{font-size:1rem;line-height:1}
.extra-minute-choice span{font-size:.72rem;color:var(--muted);font-weight:750}
.extra-minute-choice:hover{transform:translateY(-1px);border-color:#61A5C2;background:rgba(137,194,217,.12)}
.extra-minute-choice.selected{border-color:#014F86;background:linear-gradient(135deg,#01497C,#2C7DA0);color:#fff;box-shadow:0 10px 22px rgba(1,73,124,.24)}
.extra-minute-choice.selected span{color:#EAF7FC}
.extra-time-choice-grid.is-empty::before{content:"No extra time available";grid-column:1/-1;padding:13px;border-radius:12px;background:var(--surface-2);color:var(--muted);font-size:.85rem;font-weight:750;text-align:center}
.extra-time-dialog{overflow:visible!important}

@media(max-width:820px){
  .language-menu-panel{position:fixed;top:76px;right:10px;width:min(260px,calc(100vw - 20px))}
}
@media(max-width:620px){
  .language-menu>summary{min-width:42px;width:42px;padding:4px;justify-content:center}
  .language-menu-current,.language-menu-chevron{display:none}
  .language-menu-icon{background:transparent;width:30px;height:30px}
  .language-menu-panel{top:68px}
  .extra-time-choice-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .extra-minute-choice{min-height:54px}
}

/* ===== v3.2.6 Centered question navigator ===== */
.exam-container .exam-sidebar .navigator{
  width:100%;
  max-width:178px;
  margin:15px auto;
  grid-template-columns:repeat(6,minmax(0,1fr));
  justify-content:center;
  align-items:center;
}
.exam-container .exam-sidebar .navigator button{
  width:100%;
  min-width:0;
  padding:0;
  justify-self:center;
}
@media(max-width:900px){
  .exam-container .exam-sidebar .navigator{
    max-width:420px;
    grid-template-columns:repeat(9,minmax(0,1fr));
  }
}
@media(max-width:420px){
  .exam-container .exam-sidebar .navigator{
    max-width:100%;
    gap:5px;
  }
  .exam-container .exam-sidebar .navigator button{
    height:32px;
    font-size:.78rem;
  }
}


/* ===== Selected answer visibility v3.2.7 ===== */
.option{
  grid-template-columns:38px minmax(0,1fr) 34px;
  position:relative;
  overflow:hidden;
}
.option::after{
  content:'';width:1em;height:1em;background:currentColor;mask:url('/assets/icons/check.svg') center/contain no-repeat;-webkit-mask:url('/assets/icons/check.svg') center/contain no-repeat;
  width:30px;
  height:30px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  justify-self:end;
  font-size:1rem;
  font-weight:1000;
  color:#fff;
  background:#014F86;
  box-shadow:0 7px 18px rgba(1,73,124,.28);
  opacity:0;
  transform:scale(.72);
  transition:opacity .16s ease,transform .16s ease;
}
.option.is-selected,
.option:has(input:checked){
  border-width:3px!important;
  border-color:#014F86!important;
  background:linear-gradient(135deg,#DDF3FC 0%,#A9D6E5 100%)!important;
  color:#012A4A!important;
  box-shadow:0 0 0 4px rgba(97,165,194,.20),0 14px 30px rgba(1,73,124,.15)!important;
  transform:translateX(4px);
}
.option.is-selected::before,
.option:has(input:checked)::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:7px;
  background:linear-gradient(180deg,#014F86,#2C7DA0);
}
.option.is-selected::after,
.option:has(input:checked)::after{
  opacity:1;
  transform:scale(1);
}
.option.is-selected .option-letter,
.option:has(input:checked) .option-letter{
  background:#014F86!important;
  color:#fff!important;
  box-shadow:0 6px 15px rgba(1,73,124,.28);
}
.option.is-selected .jp-option,
.option:has(input:checked) .jp-option{
  color:#012A4A!important;
  font-weight:800;
}
html[data-theme="dark"] .option.is-selected,
html[data-theme="dark"] .option:has(input:checked){
  border-color:#89C2D9!important;
  background:linear-gradient(135deg,#01497C 0%,#013A63 100%)!important;
  color:#fff!important;
  box-shadow:0 0 0 4px rgba(137,194,217,.18),0 16px 32px rgba(0,0,0,.28)!important;
}
html[data-theme="dark"] .option.is-selected::before,
html[data-theme="dark"] .option:has(input:checked)::before{
  background:linear-gradient(180deg,#A9D6E5,#61A5C2);
}
html[data-theme="dark"] .option.is-selected::after,
html[data-theme="dark"] .option:has(input:checked)::after{
  background:#A9D6E5;
  color:#012A4A;
}
html[data-theme="dark"] .option.is-selected .option-letter,
html[data-theme="dark"] .option:has(input:checked) .option-letter{
  background:#A9D6E5!important;
  color:#012A4A!important;
}
html[data-theme="dark"] .option.is-selected .jp-option,
html[data-theme="dark"] .option:has(input:checked) .jp-option{
  color:#fff!important;
}
@media(max-width:620px){
  .option{grid-template-columns:34px minmax(0,1fr) 30px;padding:12px 11px}
  .option::after{width:27px;height:27px}
  .option.is-selected,.option:has(input:checked){transform:none}
}

/* ===== v3.2.8 Profile preferences, footer controls and back-to-top ===== */

/* Header now keeps only navigation and the profile icon. */
.topbar-right{gap:16px}

/* Preferences inside the profile dropdown. */
.profile-preferences{
  display:grid;
  gap:8px;
  padding:10px 0 11px;
  border-top:1px solid var(--minimal-border);
}
.profile-preferences-title{
  display:block;
  padding:0 10px 2px;
  color:var(--muted);
  font-size:.68rem;
  font-weight:900;
  letter-spacing:.10em;
  text-transform:uppercase;
}
.profile-theme-action,
.footer-theme-action{
  appearance:none;
  width:100%;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--surface-2);
  color:var(--text);
  display:flex;
  align-items:center;
  gap:10px;
  min-height:42px;
  padding:8px 10px;
  font:inherit;
  font-weight:800;
  cursor:pointer;
  transition:transform .16s ease,border-color .16s ease,background .16s ease;
}
.profile-theme-action:hover,
.footer-theme-action:hover{
  transform:translateY(-1px);
  border-color:#61A5C2;
  background:color-mix(in srgb,#89C2D9 18%,var(--surface-2));
}
.profile-theme-action .theme-icon,
.footer-theme-action .theme-icon{
  width:28px;
  height:28px;
  flex:0 0 28px;
  display:grid;
  place-items:center;
  border-radius:9px;
  background:linear-gradient(135deg,#01497C,#2C7DA0);
  color:#fff;
  font-weight:900;
}
.profile-theme-action .theme-text,
.footer-theme-action .theme-text{font-size:.82rem}
.profile-language-actions{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:6px;
  padding:0 0;
}
.profile-language-actions a{
  min-width:0;
  padding:8px 6px;
  border:1px solid var(--line);
  border-radius:11px;
  background:var(--surface);
  color:var(--text)!important;
  text-decoration:none!important;
  text-align:center;
  display:grid;
  gap:2px;
  transition:border-color .16s ease,background .16s ease,transform .16s ease;
}
.profile-language-actions a:hover{
  transform:translateY(-1px);
  border-color:#61A5C2;
}
.profile-language-actions a.active{
  border-color:#2C7DA0;
  background:linear-gradient(135deg,rgba(44,125,160,.16),rgba(169,214,229,.18));
  box-shadow:inset 0 0 0 1px rgba(44,125,160,.14);
}
.profile-language-actions a span{
  color:var(--muted);
  font-size:.62rem;
  font-weight:900;
  letter-spacing:.06em;
}
.profile-language-actions a strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:.72rem;
}

/* Footer appearance and language controls. */
.footer-inner.footer-grid{
  grid-template-columns:minmax(245px,1.4fr) minmax(120px,.65fr) minmax(145px,.75fr) minmax(205px,1fr) minmax(185px,.9fr);
  gap:28px;
}
.footer-preferences-column h3{
  margin:4px 0 15px;
  color:#fff;
  font-size:.84rem;
  text-transform:uppercase;
  letter-spacing:.10em;
}
.footer-theme-action{
  max-width:230px;
  margin-bottom:9px;
  border-color:rgba(169,214,229,.20);
  background:rgba(255,255,255,.07);
  color:#fff;
}
.footer-theme-action:hover{
  border-color:rgba(169,214,229,.55);
  background:rgba(255,255,255,.12);
}
.footer-language-actions{
  display:grid;
  gap:6px;
  max-width:230px;
}
.footer-language-actions a{
  display:grid;
  grid-template-columns:31px minmax(0,1fr);
  gap:8px;
  align-items:center;
  min-height:36px;
  padding:6px 9px;
  border:1px solid rgba(169,214,229,.15);
  border-radius:11px;
  background:rgba(255,255,255,.05);
  color:#d8e6f1!important;
  text-decoration:none!important;
  transition:background .16s ease,border-color .16s ease,transform .16s ease;
}
.footer-language-actions a:hover{
  transform:translateX(2px);
  border-color:rgba(169,214,229,.45);
  background:rgba(255,255,255,.10);
}
.footer-language-actions a.active{
  border-color:#61A5C2;
  background:rgba(44,125,160,.28);
  color:#fff!important;
}
.footer-language-actions a span{
  display:grid;
  place-items:center;
  width:29px;
  height:25px;
  border-radius:8px;
  background:rgba(169,214,229,.12);
  color:#A9D6E5;
  font-size:.62rem;
  font-weight:900;
}
.footer-language-actions a strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:.76rem;
}

/* Floating back-to-top control. */
.back-to-top{
  appearance:none;
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:900;
  width:48px;
  height:48px;
  padding:0;
  border:1px solid rgba(169,214,229,.48);
  border-radius:50%;
  background:linear-gradient(145deg,#01497C,#2C7DA0);
  color:#fff;
  display:grid;
  place-items:center;
  box-shadow:0 14px 34px rgba(1,42,74,.34);
  cursor:pointer;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(14px) scale(.90);
  transition:opacity .20s ease,transform .20s ease,visibility .20s ease,filter .16s ease;
}
.back-to-top span{font-size:1.35rem;font-weight:900;line-height:1}
.back-to-top:hover{filter:brightness(1.10);transform:translateY(-2px) scale(1)}
.back-to-top.is-visible{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:none;
}
.back-to-top:focus-visible{outline:3px solid rgba(137,194,217,.42);outline-offset:3px}

html[data-theme="dark"] .profile-theme-action,
html[data-theme="dark"] .profile-language-actions a{
  border-color:rgba(137,194,217,.18);
  background:rgba(1,42,74,.42);
}
html[data-theme="dark"] .profile-language-actions a.active{
  border-color:#61A5C2;
  background:linear-gradient(135deg,rgba(44,125,160,.34),rgba(1,73,124,.50));
}

@media(max-width:1180px){
  .footer-inner.footer-grid{grid-template-columns:1.35fr 1fr 1fr;gap:30px}
  .footer-preferences-column,.footer-community-column{grid-column:auto}
  .footer-community-column{grid-column:2 / -1}
}

@media(max-width:820px){
  .topbar{
    grid-template-rows:auto auto!important;
    gap:9px 10px!important;
  }
  .topbar nav{
    grid-column:1 / 4!important;
    grid-row:2!important;
  }
  .footer-inner.footer-grid{grid-template-columns:1fr 1fr;gap:28px 24px}
  .footer-brand-block{grid-column:1 / -1}
  .footer-community-column{grid-column:1 / -1}
}

@media(max-width:620px){
  .profile-dropdown{top:66px!important}
  .profile-language-actions{grid-template-columns:repeat(3,minmax(0,1fr))}
  .back-to-top{
    right:14px;
    bottom:84px;
    width:46px;
    height:46px;
  }
}

@media(max-width:460px){
  .footer-inner.footer-grid{grid-template-columns:1fr}
  .footer-brand-block,.footer-community-column{grid-column:auto}
  .footer-theme-action,.footer-language-actions{max-width:none}
}

@media(prefers-reduced-motion:reduce){
  .back-to-top{transition:none}
}
@media(max-width:480px){
  .profile-theme-action .theme-text,
  .footer-theme-action .theme-text{display:inline!important}
}

/* ===== Japanese Learn Path v3.2.9 ===== */
.learn-main{max-width:1320px}
.learn-hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);gap:1.1rem;align-items:stretch;padding:1.2rem 0 1rem}
.learn-hero-copy,.learn-hero-art,.learn-filter-shell,.learn-module-card,.learn-roadmap-section,.learn-weekly-plan{border:1px solid var(--border);box-shadow:var(--shadow)}
.learn-hero-copy{padding:clamp(1.25rem,3vw,2.2rem);border-radius:30px;background:linear-gradient(135deg,rgba(169,214,229,.72),rgba(255,255,255,.92) 52%,rgba(97,165,194,.20));position:relative;overflow:hidden}
.learn-hero-copy::after{content:"あ";position:absolute;right:1.5rem;bottom:-2.5rem;font-size:12rem;font-weight:900;line-height:1;color:rgba(1,73,124,.055);pointer-events:none}
html[data-theme="dark"] .learn-hero-copy{background:linear-gradient(135deg,rgba(1,42,74,.88),rgba(1,58,99,.74),rgba(1,73,124,.52))}
.learn-hero h1{max-width:760px;font-size:clamp(2.2rem,5vw,4.3rem);line-height:1.04;letter-spacing:-.045em;margin:.6rem 0 .8rem}
.learn-hero p{max-width:68ch;margin:0;color:var(--muted);line-height:1.8;font-size:1.02rem}
.learn-hero-actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.2rem}.learn-hero-actions .btn{min-width:180px}
.learn-progress-summary{display:grid;gap:.6rem;margin-top:1.3rem;padding:1rem;border-radius:20px;background:rgba(255,255,255,.56);border:1px solid rgba(44,125,160,.18)}
html[data-theme="dark"] .learn-progress-summary{background:rgba(1,42,74,.48)}
.learn-progress-summary>div:first-child{display:flex;justify-content:space-between;gap:1rem;align-items:center}.learn-progress-summary span{font-size:.84rem;color:var(--muted)}.learn-progress-summary strong{font-size:.92rem}
.learn-progress-track{height:10px;border-radius:999px;background:rgba(1,42,74,.12);overflow:hidden}.learn-progress-track span{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#2C7DA0,#61A5C2);transition:width .25s ease}
.learn-hero-art{border-radius:30px;display:grid;place-items:center;padding:1.25rem;background:linear-gradient(145deg,#012A4A,#014F86 60%,#2A6F97);min-height:360px;overflow:hidden;position:relative}
.learn-hero-art::before,.learn-hero-art::after{content:"";position:absolute;border-radius:999px;border:42px solid rgba(169,214,229,.10)}.learn-hero-art::before{width:250px;height:250px;right:-100px;top:-100px}.learn-hero-art::after{width:190px;height:190px;left:-80px;bottom:-100px}
.learn-character-card{position:relative;z-index:1;width:min(100%,360px);padding:1.15rem;border-radius:28px;background:rgba(255,255,255,.94);box-shadow:0 24px 60px rgba(0,0,0,.24);color:#012A4A;text-align:center;transform:rotate(-1.5deg)}
.learn-character-face{display:grid;place-items:center;min-height:108px;border-radius:22px;background:linear-gradient(135deg,#A9D6E5,#fff);font-size:2rem;font-weight:900;letter-spacing:.04em}
.learn-character-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.55rem;margin:.8rem 0}.learn-character-grid span{display:grid;place-items:center;min-height:62px;border-radius:16px;background:#eef8fc;border:1px solid #c9e5f1;font-size:1.35rem;font-weight:900}.learn-character-card small{font-weight:800;color:#2C7DA0}
.learn-filter-shell{display:flex;justify-content:space-between;gap:1rem;align-items:end;padding:1rem 1.1rem;border-radius:24px;background:var(--card);margin:.2rem 0 1rem}.learn-filter-shell h2{margin:.35rem 0 0}.learn-filters{display:flex;flex-wrap:wrap;gap:.55rem;justify-content:flex-end}.learn-filters button{padding:.72rem 1rem;border-radius:999px;border:1px solid var(--border);background:rgba(137,194,217,.12);color:inherit;font:inherit;font-weight:800;cursor:pointer}.learn-filters button.active{background:linear-gradient(135deg,#01497C,#2C7DA0);color:#fff;border-color:transparent;box-shadow:0 8px 22px rgba(1,73,124,.22)}
.learn-module-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.learn-module-card{position:relative;padding:1rem;border-radius:26px;background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(242,249,252,.94));overflow:hidden;scroll-margin-top:110px}
html[data-theme="dark"] .learn-module-card{background:linear-gradient(180deg,rgba(1,42,74,.78),rgba(1,34,58,.90))}
.learn-module-card::after{content:"";position:absolute;inset:0 0 auto;height:5px;background:linear-gradient(90deg,#2C7DA0,#61A5C2)}
.learn-module-card[data-learn-stage="Skills"]::after{background:linear-gradient(90deg,#01497C,#89C2D9)}.learn-module-card[data-learn-stage="Exam"]::after{background:linear-gradient(90deg,#013A63,#468FAF)}
.learn-module-card.is-complete{border-color:rgba(22,163,74,.35);box-shadow:0 16px 34px rgba(22,163,74,.10)}.learn-module-card.is-complete::before{content:'';width:1em;height:1em;background:currentColor;mask:url('/assets/icons/check.svg') center/contain no-repeat;-webkit-mask:url('/assets/icons/check.svg') center/contain no-repeat;position:absolute;right:1rem;top:3.4rem;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#16a34a;color:#fff;font-weight:900}
.learn-module-topline{display:flex;justify-content:space-between;gap:.6rem;align-items:center;margin-bottom:.7rem}.learn-step-number{font-size:.78rem;font-weight:900;letter-spacing:.12em;color:#2C7DA0}.learn-level-badge{padding:.42rem .7rem;border-radius:999px;background:#e6f4fa;color:#01497C;font-size:.72rem;font-weight:900;border:1px solid #c5e3ef}
html[data-theme="dark"] .learn-level-badge{background:rgba(97,165,194,.14);color:#A9D6E5;border-color:rgba(137,194,217,.18)}
.learn-module-icon{width:66px;height:66px;display:grid;place-items:center;border-radius:20px;background:linear-gradient(145deg,#013A63,#2C7DA0);color:#fff;font-size:1.45rem;font-weight:900;box-shadow:0 12px 24px rgba(1,58,99,.20);margin-bottom:.75rem}.learn-module-card h3{font-size:1.2rem;line-height:1.4;margin:0 0 .48rem}.learn-module-card>p{color:var(--muted);line-height:1.72;margin:0 0 .85rem;font-size:.94rem}
.learn-lesson-details{border:1px solid rgba(70,143,175,.20);border-radius:18px;background:rgba(169,214,229,.12);overflow:hidden}.learn-lesson-details summary{cursor:pointer;padding:.82rem .9rem;font-weight:850;list-style:none}.learn-lesson-details summary::-webkit-details-marker{display:none}.learn-lesson-details summary::after{content:"＋";float:right}.learn-lesson-details[open] summary::after{content:"−"}.learn-example-list{display:grid;gap:.55rem;padding:0 .75rem .75rem}.learn-example-row{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.15fr) auto;gap:.55rem;align-items:center;padding:.7rem;border-radius:14px;background:var(--card);border:1px solid rgba(137,194,217,.16)}.learn-example-row strong{display:block;font-size:1rem}.learn-example-row small{display:block;color:var(--muted);margin-top:.1rem}.learn-example-row>span{font-size:.82rem;color:var(--muted);line-height:1.4}.learn-speak-btn{width:34px;height:34px;border:0;border-radius:50%;background:#e3f3f9;cursor:pointer;font-size:.95rem}
.learn-task-box{margin-top:.85rem;padding:.85rem;border-radius:18px;background:rgba(137,194,217,.08);border:1px solid rgba(70,143,175,.15)}.learn-task-box h4{margin:0 0 .6rem}.learn-task-item{display:flex;gap:.6rem;align-items:flex-start;padding:.45rem 0;cursor:pointer}.learn-task-item input{margin-top:.2rem;accent-color:#2C7DA0}.learn-task-item span{font-size:.88rem;line-height:1.5;color:var(--muted)}.learn-task-item input:checked+span{text-decoration:line-through;opacity:.66}
.learn-tip{margin-top:.75rem;padding:.72rem .8rem;border-left:4px solid #61A5C2;border-radius:12px;background:rgba(97,165,194,.10);font-size:.84rem;line-height:1.55;color:var(--muted)}.learn-tip strong{color:var(--text)}
.learn-roadmap-section{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.8fr);gap:1rem;margin-top:1rem;padding:1.1rem;border-radius:28px;background:var(--card)}.learn-roadmap-copy h2{margin:.4rem 0 1rem}.learn-roadmap-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}.learn-roadmap-steps div{padding:.85rem;border-radius:16px;background:rgba(169,214,229,.13);border:1px solid rgba(70,143,175,.16)}.learn-roadmap-steps strong,.learn-roadmap-steps span{display:block}.learn-roadmap-steps strong{color:#2C7DA0;margin-bottom:.25rem}.learn-roadmap-steps span{font-size:.86rem;line-height:1.5;color:var(--muted)}
.learn-roadmap-reference{margin:0;border-radius:22px;overflow:hidden;background:#fff;border:1px solid rgba(137,194,217,.24)}.learn-roadmap-reference img{display:block;width:100%;height:100%;max-height:520px;object-fit:cover;object-position:top}.learn-roadmap-reference figcaption{padding:.7rem .8rem;color:#2C7DA0;font-size:.76rem;line-height:1.45;background:#f3fbfe}
.learn-weekly-plan{display:grid;grid-template-columns:.7fr 1.3fr;gap:1rem;align-items:start;margin:1rem 0 1.4rem;padding:1.1rem;border-radius:28px;background:linear-gradient(135deg,rgba(1,42,74,.98),rgba(1,73,124,.96));color:#fff}.learn-weekly-plan h2{margin:.4rem 0}.learn-week-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.6rem}.learn-week-grid div{padding:.8rem;border-radius:16px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.12)}.learn-week-grid strong,.learn-week-grid span{display:block}.learn-week-grid strong{margin-bottom:.25rem}.learn-week-grid span{font-size:.78rem;line-height:1.4;color:#d8eef7}
@media(max-width:1080px){.learn-module-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.learn-hero,.learn-roadmap-section{grid-template-columns:1fr}.learn-hero-art{min-height:300px}.learn-weekly-plan{grid-template-columns:1fr}.learn-week-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:720px){.learn-hero{grid-template-columns:1fr;padding-top:.8rem}.learn-hero h1{font-size:2.45rem}.learn-filter-shell{align-items:flex-start;flex-direction:column}.learn-filters{justify-content:flex-start}.learn-module-grid{grid-template-columns:1fr}.learn-roadmap-steps{grid-template-columns:1fr}.learn-week-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.learn-example-row{grid-template-columns:1fr auto}.learn-example-row>span{grid-column:1 / 2}.learn-hero-actions .btn{width:100%}}
@media(max-width:460px){.learn-hero-copy,.learn-hero-art,.learn-filter-shell,.learn-module-card,.learn-roadmap-section,.learn-weekly-plan{border-radius:22px}.learn-week-grid{grid-template-columns:1fr}.learn-character-card{transform:none}.learn-hero h1{font-size:2.1rem}}

/* ===== Live Japanese Learning Platform v3.3.0 ===== */
.learn-platform-main,.lesson-main{max-width:1360px}
.learn-platform-hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);gap:1rem;padding:1rem 0 .8rem}
.learn-platform-hero-copy,.learn-platform-hero-visual,.learn-daily-strip,.learn-catalog-card,.learn-module-lessons-shell,.learn-plan-card,.learn-admin-assets-card,.lesson-header-card,.lesson-media-card,.lesson-section-card,.lesson-complete-card,.lesson-sidebar-card{border:1px solid var(--border);box-shadow:var(--shadow)}
.learn-platform-hero-copy{padding:clamp(1.3rem,3vw,2.4rem);border-radius:30px;background:linear-gradient(135deg,rgba(169,214,229,.82),rgba(255,255,255,.96) 50%,rgba(97,165,194,.22));position:relative;overflow:hidden}
.learn-platform-hero-copy::after{content:"日本語";position:absolute;right:1.2rem;bottom:-1.2rem;font-size:5.5rem;font-weight:950;line-height:1;color:rgba(1,73,124,.055);pointer-events:none}
html[data-theme="dark"] .learn-platform-hero-copy{background:linear-gradient(135deg,rgba(1,42,74,.94),rgba(1,58,99,.80),rgba(1,73,124,.60))}
.learn-platform-hero h1{max-width:820px;font-size:clamp(2.25rem,5vw,4.5rem);line-height:1.02;letter-spacing:-.048em;margin:.55rem 0 .85rem}.learn-platform-hero p{max-width:70ch;color:var(--muted);line-height:1.8;margin:0}.learn-platform-actions{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:1.2rem}.learn-platform-actions .btn{min-width:190px}
.learn-platform-progress-card{margin-top:1.25rem;padding:1rem;border-radius:22px;background:rgba(255,255,255,.58);border:1px solid rgba(44,125,160,.18)}
html[data-theme="dark"] .learn-platform-progress-card{background:rgba(1,42,74,.48)}
.learn-platform-progress-head{display:flex;justify-content:space-between;align-items:end;gap:1rem;margin-bottom:.65rem}.learn-platform-progress-head small,.learn-platform-progress-head strong{display:block}.learn-platform-progress-head small{color:var(--muted);font-size:.8rem}.learn-platform-progress-head strong{font-size:1.7rem}.learn-platform-progress-head>span{font-size:.86rem;color:var(--muted);font-weight:800}
.learn-platform-mini-stats{display:flex;flex-wrap:wrap;gap:.65rem 1.2rem;margin-top:.65rem}.learn-platform-mini-stats span{font-size:.8rem;color:var(--muted)}.learn-platform-mini-stats strong{color:var(--text);font-size:.95rem}
.learn-platform-hero-visual{min-height:390px;border-radius:30px;background:linear-gradient(145deg,#012A4A,#014F86 58%,#2C7DA0);display:grid;place-items:center;position:relative;overflow:hidden}
.learn-visual-core{width:min(74%,310px);aspect-ratio:1;border-radius:50%;display:grid;place-content:center;text-align:center;padding:2rem;background:radial-gradient(circle at 35% 25%,#fff,#dff3fb 68%,#a9d6e5);color:#012A4A;box-shadow:0 28px 70px rgba(0,0,0,.28);position:relative;z-index:2}.learn-visual-core strong,.learn-visual-core span,.learn-visual-core small{display:block}.learn-visual-core strong{font-size:2rem}.learn-visual-core span{font-weight:900;margin:.4rem 0}.learn-visual-core small{color:#2C7DA0}
.learn-stage-orbit{position:absolute;width:82px;height:82px;border-radius:24px;display:grid;place-items:center;background:rgba(255,255,255,.94);color:#01497C;font-weight:950;font-size:1.75rem;box-shadow:0 14px 34px rgba(0,0,0,.18);z-index:3}.orbit-one{left:8%;top:12%;transform:rotate(-9deg)}.orbit-two{right:8%;top:16%;transform:rotate(9deg)}.orbit-three{right:15%;bottom:9%;transform:rotate(-5deg)}
.learn-daily-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.7rem;padding:.8rem;border-radius:24px;background:var(--card);margin:.15rem 0 1rem}.learn-daily-strip>div{display:grid;grid-template-columns:auto 1fr;column-gap:.7rem;align-items:center;padding:.72rem .8rem;border-radius:17px;background:rgba(137,194,217,.09);border:1px solid rgba(70,143,175,.13)}.learn-daily-strip span{grid-row:1/3;width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:#01497C;color:#fff;font-size:.72rem;font-weight:900}.learn-daily-strip strong,.learn-daily-strip small{display:block}.learn-daily-strip strong{font-size:.88rem}.learn-daily-strip small{color:var(--muted);font-size:.72rem}
.learn-section-heading{display:flex;justify-content:space-between;align-items:end;gap:1rem;margin:1.15rem 0 .8rem}.learn-section-heading h2{margin:.35rem 0 .2rem}.learn-section-heading p{margin:0;color:var(--muted)}.learn-stage-filters{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:flex-end}.learn-stage-filters button{border:1px solid var(--border);background:var(--card);color:inherit;border-radius:999px;padding:.68rem .95rem;font:inherit;font-size:.84rem;font-weight:900;cursor:pointer}.learn-stage-filters button.active{background:#01497C;color:#fff;border-color:#01497C}
.learn-module-catalog{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.85rem}.learn-catalog-card{display:flex;gap:.9rem;padding:1rem;border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(242,249,252,.93));color:inherit;text-decoration:none;position:relative;overflow:hidden;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.learn-catalog-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--module-color)}.learn-catalog-card:hover{transform:translateY(-2px)}.learn-catalog-card.active{border-color:var(--module-color);box-shadow:0 16px 36px color-mix(in srgb,var(--module-color) 18%,transparent)}
html[data-theme="dark"] .learn-catalog-card{background:linear-gradient(180deg,rgba(1,42,74,.82),rgba(1,34,58,.92))}
.learn-catalog-icon{width:58px;height:58px;flex:0 0 58px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(145deg,var(--module-color),#2C7DA0);color:#fff;font-weight:950;font-size:1.25rem}.learn-catalog-copy{min-width:0}.learn-catalog-meta{display:flex;justify-content:space-between;gap:.5rem;color:var(--muted);font-size:.7rem;font-weight:900;letter-spacing:.08em}.learn-catalog-card h3{font-size:1rem;margin:.35rem 0 .35rem;line-height:1.4}.learn-catalog-card p{font-size:.82rem;line-height:1.55;color:var(--muted);margin:0 0 .55rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.learn-catalog-progress{height:6px;border-radius:999px;background:rgba(1,42,74,.10);overflow:hidden}.learn-catalog-progress span{display:block;height:100%;background:var(--module-color);border-radius:inherit}.learn-catalog-card small{display:block;margin-top:.42rem;color:var(--muted);font-size:.7rem}
.learn-module-lessons-shell{margin-top:1rem;padding:1.05rem;border-radius:30px;background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(242,249,252,.94));scroll-margin-top:110px}html[data-theme="dark"] .learn-module-lessons-shell{background:linear-gradient(180deg,rgba(1,42,74,.88),rgba(1,34,58,.94))}
.learn-module-lessons-head{display:flex;justify-content:space-between;gap:1rem;align-items:center}.learn-module-title-lockup{display:flex;gap:1rem;align-items:center}.learn-module-big-icon{width:76px;height:76px;border-radius:23px;display:grid;place-items:center;background:linear-gradient(145deg,var(--module-color),#2C7DA0);color:#fff;font-size:1.65rem;font-weight:950;box-shadow:0 12px 28px rgba(1,73,124,.2)}.learn-module-lessons-head h2{margin:.35rem 0}.learn-module-lessons-head p{margin:0;color:var(--muted);max-width:76ch}.learn-module-progress-summary{padding:.85rem 1rem;border-radius:18px;text-align:right;background:rgba(137,194,217,.10);border:1px solid rgba(70,143,175,.16)}.learn-module-progress-summary strong,.learn-module-progress-summary span{display:block}.learn-module-progress-summary strong{font-size:1.45rem;color:var(--module-color)}.learn-module-progress-summary span{font-size:.76rem;color:var(--muted)}.learn-module-progress-wide{height:8px;background:rgba(1,42,74,.09);border-radius:999px;overflow:hidden;margin:1rem 0}.learn-module-progress-wide span{display:block;height:100%;background:linear-gradient(90deg,var(--module-color),#61A5C2);border-radius:inherit}
.learn-lesson-list{display:grid;gap:.62rem}.learn-lesson-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:.85rem;align-items:center;padding:.88rem .95rem;border-radius:19px;background:var(--card);border:1px solid rgba(70,143,175,.14);color:inherit;text-decoration:none;transition:transform .16s ease,border-color .16s ease}.learn-lesson-row:hover{transform:translateX(3px);border-color:var(--module-color)}.learn-lesson-number{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:rgba(137,194,217,.14);font-size:.8rem;font-weight:950;color:var(--module-color)}.learn-lesson-row.status-completed .learn-lesson-number{background:#16a34a;color:#fff}.learn-lesson-row.status-in_progress .learn-lesson-number{background:#f59e0b;color:#fff}.learn-lesson-row-title{display:flex;gap:.65rem;align-items:baseline;flex-wrap:wrap}.learn-lesson-row-title strong{font-size:.94rem}.learn-lesson-row-title span{font-size:.8rem;color:var(--module-color);font-weight:800}.learn-lesson-row p{margin:.25rem 0;color:var(--muted);font-size:.78rem;line-height:1.5}.learn-lesson-row-meta{display:flex;gap:.65rem;flex-wrap:wrap}.learn-lesson-row-meta span{font-size:.68rem;color:var(--muted);padding:.28rem .48rem;border-radius:999px;background:rgba(137,194,217,.09)}.learn-lesson-open{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:rgba(137,194,217,.12);font-weight:900;color:var(--module-color)}
.learn-live-plan-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:1rem;margin:1rem 0}.learn-plan-card{padding:1.1rem;border-radius:28px;background:var(--card)}.learn-plan-card h2{margin:.35rem 0 .85rem}.learn-month-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem}.learn-month-grid div{padding:.78rem;border-radius:16px;background:rgba(137,194,217,.10);border:1px solid rgba(70,143,175,.14)}.learn-month-grid strong,.learn-month-grid span{display:block}.learn-month-grid strong{font-size:.8rem;color:#2C7DA0}.learn-month-grid span{font-size:.75rem;color:var(--muted);line-height:1.45;margin-top:.2rem}.learn-week-card{background:linear-gradient(145deg,#012A4A,#014F86);color:#fff}.learn-week-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}.learn-week-list span{padding:.7rem .75rem;border-radius:14px;background:rgba(255,255,255,.1);font-size:.78rem}.learn-week-list b{display:inline-block;min-width:38px;color:#A9D6E5}.learn-admin-assets-card{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:1rem;border-radius:24px;background:rgba(245,158,11,.08);margin-bottom:1rem}.learn-admin-assets-card h2{margin:.3rem 0}.learn-admin-assets-card p{margin:0;color:var(--muted)}.learn-admin-assets-actions{display:flex;gap:.6rem;flex-wrap:wrap}

.lesson-shell{--module-color:#2C7DA0}.lesson-breadcrumbs{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;padding:1rem 0 .7rem;font-size:.82rem}.lesson-breadcrumbs a{color:#2C7DA0;text-decoration:none}.lesson-breadcrumbs span{color:var(--muted)}
.lesson-header-card{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:1.1rem;border-radius:28px;background:linear-gradient(135deg,rgba(169,214,229,.62),rgba(255,255,255,.95));margin-bottom:1rem}.lesson-title-lockup{display:flex;align-items:center;gap:1rem}.lesson-module-icon{width:82px;height:82px;border-radius:24px;display:grid;place-items:center;background:linear-gradient(145deg,var(--module-color),#2C7DA0);color:#fff;font-size:1.7rem;font-weight:950}.lesson-header-card h1{margin:.35rem 0 .15rem;font-size:clamp(1.8rem,3vw,2.65rem)}.lesson-header-card p{margin:.2rem 0;color:var(--muted);line-height:1.6}.lesson-japanese-title{font-weight:900;color:var(--module-color)!important}.lesson-status-panel{display:grid;gap:.45rem;text-align:right;min-width:160px}.lesson-status-panel>strong{font-size:1rem}.lesson-status-panel>span:last-child{font-size:.78rem;color:var(--muted)}.lesson-status-badge{justify-self:end;padding:.45rem .75rem;border-radius:999px;font-size:.72rem;font-weight:900;background:rgba(148,163,184,.12)}.lesson-status-badge.status-in_progress{background:rgba(245,158,11,.14);color:#b45309}.lesson-status-badge.status-completed{background:rgba(22,163,74,.14);color:#15803d}
html[data-theme="dark"] .lesson-header-card{background:linear-gradient(135deg,rgba(1,42,74,.92),rgba(1,58,99,.76))}
.lesson-page-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:1rem;align-items:start}.lesson-content-column{display:grid;gap:1rem}.lesson-sidebar{display:grid;gap:1rem;position:sticky;top:94px}.lesson-media-card{display:grid;grid-template-columns:.86fr 1.14fr;gap:0;overflow:hidden;border-radius:28px;background:var(--card)}.lesson-cover-area{min-height:330px;display:grid;place-items:center;background:linear-gradient(145deg,#012A4A,#014F86);overflow:hidden}.lesson-cover-area img{width:100%;height:100%;object-fit:cover}.lesson-cover-placeholder{display:grid;place-items:center;text-align:center;padding:1.4rem;color:#fff}.lesson-cover-placeholder>span{font-size:6rem;font-weight:950;line-height:1}.lesson-cover-placeholder strong{font-size:1.4rem;margin-top:.8rem}.lesson-cover-placeholder small{margin-top:.4rem;color:#A9D6E5;line-height:1.5}.lesson-study-area{min-height:330px;display:grid;place-items:center;background:linear-gradient(145deg,#001d33,#01497c);overflow:hidden}.lesson-study-area img{width:100%;height:100%;object-fit:cover;display:block}.lesson-study-area.has-study-image{background:#e8f5fb}.lesson-media-placeholder{text-align:center;padding:1.4rem;color:#d8eef7}.lesson-media-placeholder h2{margin:.7rem 0}.lesson-media-placeholder p{max-width:44ch;color:#bcdce9;line-height:1.6}.lesson-media-placeholder code{display:block;margin-top:.7rem;word-break:break-all;font-size:.68rem}.lesson-media-photo{display:grid;place-items:center;margin:auto;width:72px;height:72px;border-radius:22px;background:#fff;color:#01497C;font-size:2rem;box-shadow:0 12px 30px rgba(0,0,0,.25)}
.lesson-section-card{padding:1.05rem;border-radius:28px;background:var(--card)}.lesson-section-title{display:flex;gap:.85rem;align-items:center;margin-bottom:.9rem}.lesson-section-title>span{width:44px;height:44px;border-radius:15px;display:grid;place-items:center;background:var(--module-color);color:#fff;font-size:.8rem;font-weight:950}.lesson-section-title small,.lesson-section-title h2{display:block}.lesson-section-title small{font-size:.7rem;letter-spacing:.12em;color:var(--module-color);font-weight:900}.lesson-section-title h2{margin:.12rem 0 0;font-size:1.25rem}.lesson-objective-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem}.lesson-objective-grid>div,.lesson-key-points>div{display:flex;gap:.65rem;align-items:flex-start;padding:.82rem;border-radius:17px;background:rgba(137,194,217,.09);border:1px solid rgba(70,143,175,.13)}.lesson-objective-grid span,.lesson-key-points span{width:28px;height:28px;flex:0 0 28px;border-radius:50%;display:grid;place-items:center;background:#dff3fb;color:#01497C;font-weight:900}.lesson-objective-grid p,.lesson-key-points p{margin:0;color:var(--muted);font-size:.84rem;line-height:1.55}.lesson-key-points{display:grid;gap:.65rem}
.lesson-example-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}.lesson-example-card{padding:1rem;border-radius:20px;background:linear-gradient(180deg,rgba(169,214,229,.18),rgba(255,255,255,.72));border:1px solid rgba(70,143,175,.16)}html[data-theme="dark"] .lesson-example-card{background:rgba(1,73,124,.24)}.lesson-example-card strong{display:block;font-size:1.25rem}.lesson-example-card>span{display:block;color:var(--module-color);font-size:.8rem;font-weight:800;margin:.2rem 0}.lesson-example-card p{margin:.3rem 0 .75rem;color:var(--muted);font-size:.84rem}.lesson-speak-button{border:0;border-radius:999px;padding:.52rem .72rem;background:#01497C;color:#fff;font:inherit;font-size:.75rem;font-weight:800;cursor:pointer}
.lesson-audio-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.lesson-audio-card{padding:.95rem;border-radius:20px;background:rgba(137,194,217,.08);border:1px solid rgba(70,143,175,.14)}.lesson-audio-card>div{display:flex;gap:.65rem;align-items:center}.lesson-audio-card>div span{width:38px;height:38px;border-radius:13px;display:grid;place-items:center;background:var(--module-color);color:#fff;font-size:.75rem;font-weight:900}.lesson-audio-card h3{margin:0;font-size:1rem}.lesson-audio-card p{color:var(--muted);font-size:.82rem;line-height:1.55}.lesson-audio-card audio{width:100%;margin-top:.75rem}.lesson-audio-card code{display:block;margin-top:.65rem;font-size:.66rem;word-break:break-all;color:var(--muted)}
.lesson-task-list{display:grid;gap:.6rem}.lesson-task-check{display:grid;grid-template-columns:auto auto minmax(0,1fr);gap:.7rem;align-items:center;padding:.85rem .9rem;border-radius:18px;background:rgba(137,194,217,.07);border:1px solid rgba(70,143,175,.14);cursor:pointer}.lesson-task-check input{position:absolute;opacity:0;pointer-events:none}.lesson-task-boxmark{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;border:2px solid #89C2D9;color:transparent;font-weight:900}.lesson-task-check>span:last-child strong{display:block;font-size:.72rem;color:var(--module-color);margin-bottom:.15rem}.lesson-task-check>span:last-child{font-size:.86rem;color:var(--muted);line-height:1.55}.lesson-task-check.is-done{background:rgba(22,163,74,.08);border-color:rgba(22,163,74,.24)}.lesson-task-check.is-done .lesson-task-boxmark{background:#16a34a;border-color:#16a34a;color:#fff}.lesson-task-check.is-done>span:last-child{text-decoration:line-through;opacity:.7}.lesson-worksheet-link{margin-top:.8rem}.lesson-admin-asset-note{margin-top:.8rem;padding:.65rem;border-radius:14px;background:rgba(245,158,11,.08);font-size:.75rem}.lesson-admin-asset-note code{word-break:break-all}
.lesson-quiz-form{display:grid;gap:.8rem}.lesson-quiz-question{border:1px solid rgba(70,143,175,.16);border-radius:20px;padding:.9rem;background:rgba(137,194,217,.06)}.lesson-quiz-question legend{padding:0 .35rem;font-weight:900}.lesson-quiz-question legend span{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:10px;background:var(--module-color);color:#fff;font-size:.75rem;margin-right:.5rem}.lesson-quiz-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem;margin-top:.7rem}.lesson-quiz-options label{cursor:pointer}.lesson-quiz-options input{position:absolute;opacity:0}.lesson-quiz-options span{display:block;padding:.75rem;border-radius:15px;background:var(--card);border:1px solid rgba(70,143,175,.16);font-size:.82rem}.lesson-quiz-options input:checked+span{border-color:var(--module-color);box-shadow:0 0 0 3px color-mix(in srgb,var(--module-color) 14%,transparent);font-weight:900}.lesson-quiz-question.is-correct{border-color:rgba(22,163,74,.38);background:rgba(22,163,74,.07)}.lesson-quiz-question.is-wrong{border-color:rgba(220,38,38,.34);background:rgba(220,38,38,.06)}.lesson-quiz-actions{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}.lesson-quiz-actions strong{color:var(--module-color)}
.lesson-complete-card{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.05rem;border-radius:26px;background:linear-gradient(135deg,rgba(1,73,124,.10),rgba(97,165,194,.12))}.lesson-complete-card h2{margin:.3rem 0}.lesson-complete-card p{margin:0;color:var(--muted);line-height:1.6}.lesson-complete-card .btn.is-ready{background:#16a34a;border-color:#16a34a}.lesson-next-prev{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.lesson-next-prev>a{display:block;padding:.9rem;border-radius:18px;background:var(--card);border:1px solid var(--border);text-decoration:none;color:inherit}.lesson-next-prev a.next{text-align:right}.lesson-next-prev span,.lesson-next-prev strong{display:block}.lesson-next-prev span{font-size:.72rem;color:var(--module-color);font-weight:900}.lesson-next-prev strong{margin-top:.2rem;font-size:.84rem}
.lesson-sidebar-card{padding:1rem;border-radius:24px;background:var(--card)}.lesson-sidebar-card h3{margin:0 0 .7rem}.lesson-progress-widget{text-align:center}.lesson-ring{--progress:0;width:142px;height:142px;border-radius:50%;margin:.75rem auto;display:grid;place-items:center;background:conic-gradient(var(--module-color) calc(var(--progress)*1%),rgba(137,194,217,.16) 0);position:relative}.lesson-ring::after{content:"";position:absolute;inset:12px;border-radius:50%;background:var(--card)}.lesson-ring strong{position:relative;z-index:1;font-size:1.45rem}.lesson-progress-widget p{font-size:.8rem;line-height:1.55;color:var(--muted)}.lesson-toc{display:grid;gap:.45rem}.lesson-toc h3{margin-bottom:.3rem}.lesson-toc a{padding:.65rem .7rem;border-radius:13px;background:rgba(137,194,217,.08);color:inherit;text-decoration:none;font-size:.8rem}.lesson-login-note p{color:var(--muted);font-size:.82rem;line-height:1.55}.lesson-admin-paths>div{margin-top:.65rem}.lesson-admin-paths strong,.lesson-admin-paths code{display:block}.lesson-admin-paths strong{font-size:.72rem;color:var(--module-color)}.lesson-admin-paths code{font-size:.62rem;word-break:break-all;margin-top:.15rem}
.dashboard-learning-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:1rem;align-items:center;padding:1rem;border-radius:24px;background:linear-gradient(135deg,rgba(1,73,124,.12),rgba(169,214,229,.20));border:1px solid var(--border);box-shadow:var(--shadow);margin:1rem 0}.dashboard-learning-icon{width:64px;height:64px;border-radius:20px;display:grid;place-items:center;background:#01497C;color:#fff;font-size:1.5rem;font-weight:900}.dashboard-learning-card h2{margin:.25rem 0}.dashboard-learning-card p{margin:0;color:var(--muted)}.dashboard-learning-progress{height:8px;border-radius:999px;background:rgba(1,42,74,.10);overflow:hidden;margin:.65rem 0}.dashboard-learning-progress span{display:block;height:100%;background:linear-gradient(90deg,#01497C,#61A5C2)}
@media(max-width:1120px){.learn-platform-hero{grid-template-columns:1fr}.learn-platform-hero-visual{min-height:320px}.learn-module-catalog{grid-template-columns:repeat(2,minmax(0,1fr))}.learn-daily-strip{grid-template-columns:repeat(3,minmax(0,1fr))}.learn-live-plan-grid{grid-template-columns:1fr}.lesson-page-layout{grid-template-columns:1fr}.lesson-sidebar{position:static;grid-template-columns:repeat(3,minmax(0,1fr))}.lesson-media-card{grid-template-columns:1fr 1fr}}
@media(max-width:820px){.learn-section-heading,.learn-module-lessons-head,.learn-admin-assets-card,.lesson-header-card,.lesson-complete-card{align-items:flex-start;flex-direction:column}.learn-stage-filters{justify-content:flex-start}.learn-module-catalog{grid-template-columns:1fr}.learn-daily-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.learn-month-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.learn-module-progress-summary{text-align:left;width:100%}.learn-module-progress-summary .lesson-status-badge{justify-self:start}.lesson-media-card{grid-template-columns:1fr}.lesson-cover-area,.lesson-study-area{min-height:280px}.lesson-objective-grid,.lesson-example-grid{grid-template-columns:1fr}.lesson-audio-grid{grid-template-columns:1fr}.lesson-sidebar{grid-template-columns:1fr 1fr}.lesson-title-lockup{align-items:flex-start}.lesson-status-panel{text-align:left}.lesson-status-badge{justify-self:start}.dashboard-learning-card{grid-template-columns:auto 1fr}.dashboard-learning-card>.btn{grid-column:1/-1;width:100%}}
@media(max-width:560px){.learn-platform-hero-copy,.learn-platform-hero-visual,.learn-module-lessons-shell,.learn-plan-card,.lesson-header-card,.lesson-media-card,.lesson-section-card,.lesson-sidebar-card{border-radius:22px}.learn-platform-hero h1{font-size:2.35rem}.learn-platform-hero-visual{min-height:280px}.learn-stage-orbit{width:62px;height:62px;border-radius:19px;font-size:1.3rem}.learn-visual-core{width:68%;padding:1rem}.learn-visual-core strong{font-size:1.45rem}.learn-daily-strip{grid-template-columns:1fr}.learn-module-title-lockup,.lesson-title-lockup{flex-direction:column}.learn-module-big-icon,.lesson-module-icon{width:62px;height:62px;border-radius:19px}.learn-month-grid,.learn-week-list{grid-template-columns:1fr}.learn-lesson-row{grid-template-columns:auto 1fr}.learn-lesson-open{display:none}.lesson-sidebar{grid-template-columns:1fr}.lesson-quiz-options{grid-template-columns:1fr}.lesson-next-prev{grid-template-columns:1fr}.lesson-next-prev a.next{text-align:left}.lesson-cover-placeholder>span{font-size:4.5rem}}

/* Photo-based learning v3.3.1 */
.lesson-study-area .lesson-media-placeholder{max-width:440px}.lesson-study-area img{aspect-ratio:16/9}.lesson-media-card{align-items:stretch}


/* ===== Browser Voice Learning v3.3.2 ===== */
.lesson-tts-section{overflow:visible}
.lesson-tts-intro{margin:-.2rem 0 1rem;color:var(--muted);line-height:1.7}
.lesson-tts-grid .lesson-tts-card{display:flex;flex-direction:column;gap:.78rem;min-height:190px;background:linear-gradient(145deg,rgba(169,214,229,.17),rgba(255,255,255,.80));border:1px solid rgba(70,143,175,.20)}
html[data-theme="dark"] .lesson-tts-grid .lesson-tts-card{background:linear-gradient(145deg,rgba(1,73,124,.32),rgba(1,42,74,.38));border-color:rgba(97,165,194,.28)}
.lesson-tts-card>div{margin-bottom:.1rem}.lesson-tts-card p{margin:0;flex:1}
.lesson-tts-button{width:100%;justify-content:center;min-height:46px;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}
.lesson-tts-button:hover{transform:translateY(-1px)}
.lesson-tts-button.is-speaking{background:linear-gradient(135deg,#b42318,#dc2626)!important;border-color:#ef4444!important;color:#fff!important;box-shadow:0 12px 26px rgba(220,38,38,.24)}
.lesson-speak-button.lesson-tts-button{width:auto;min-height:auto;display:inline-flex;align-items:center;justify-content:center}
.lesson-tts-control-row{display:flex;align-items:center;gap:.85rem;flex-wrap:wrap;margin-top:1rem;padding:.85rem 1rem;border-radius:18px;background:rgba(137,194,217,.09);border:1px solid rgba(70,143,175,.14)}
.lesson-tts-control-row .btn{flex:0 0 auto}.lesson-tts-control-row span{color:var(--muted);font-size:.86rem;line-height:1.5}
@media(max-width:620px){.lesson-tts-control-row{align-items:stretch;flex-direction:column}.lesson-tts-control-row .btn{width:100%}.lesson-tts-control-row span{text-align:center}.lesson-tts-grid .lesson-tts-card{min-height:0}}

/* ===== v3.3.3 Reliable Online Voice + Module YouTube Players ===== */
.learn-module-video-card{
  display:grid;
  grid-template-columns:minmax(250px,.78fr) minmax(0,1.22fr);
  gap:1rem;
  align-items:stretch;
  margin:1rem 0 1.15rem;
  padding:1rem;
  border-radius:26px;
  border:1px solid rgba(70,143,175,.20);
  background:linear-gradient(145deg,rgba(169,214,229,.16),rgba(255,255,255,.90));
  overflow:hidden;
}
html[data-theme="dark"] .learn-module-video-card{
  background:linear-gradient(145deg,rgba(1,73,124,.28),rgba(1,42,74,.48));
  border-color:rgba(97,165,194,.28);
}
.learn-module-video-copy{padding:.35rem .35rem .35rem .2rem;display:flex;flex-direction:column;justify-content:center}
.learn-module-video-copy h3{margin:.4rem 0 .55rem;font-size:clamp(1.2rem,2vw,1.65rem);line-height:1.25}
.learn-module-video-copy p{margin:0;color:var(--muted);line-height:1.72}
.learn-module-video-meta{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:.8rem}
.learn-module-video-meta span{display:inline-flex;align-items:center;padding:.44rem .68rem;border-radius:999px;background:rgba(1,73,124,.08);border:1px solid rgba(70,143,175,.14);font-size:.76rem;font-weight:800}
.learn-module-video-actions{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:1rem}
.learn-module-video-actions .btn{min-height:42px}
.learn-video-credit{display:block;margin-top:.75rem;color:var(--muted);line-height:1.5;font-size:.72rem}
.learn-youtube-frame{position:relative;aspect-ratio:16/9;min-height:250px;border-radius:20px;overflow:hidden;background:#001421;box-shadow:0 16px 32px rgba(1,42,74,.18)}
.learn-youtube-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.lesson-tts-button.is-loading{position:relative;overflow:hidden}
.lesson-tts-button.is-loading::after{content:"";position:absolute;inset:auto 0 0;height:3px;background:rgba(255,255,255,.82);animation:lessonVoiceLoading .85s ease-in-out infinite}
@keyframes lessonVoiceLoading{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.lesson-tts-control-row span{min-height:1.5em}
@media(max-width:900px){.learn-module-video-card{grid-template-columns:1fr}.learn-youtube-frame{min-height:0}}
@media(max-width:560px){.learn-module-video-card{padding:.75rem;border-radius:22px}.learn-module-video-copy{padding:.3rem}.learn-module-video-actions{display:grid}.learn-module-video-actions .btn{width:100%}.learn-youtube-frame{border-radius:17px}}

/* ===== Online lesson media v3.3.4 ===== */
.learn-lesson-row{grid-template-columns:58px auto minmax(0,1fr) auto}
.learn-lesson-thumb{position:relative;width:58px;height:58px;border-radius:16px;overflow:hidden;display:grid;place-items:center;background:linear-gradient(145deg,rgba(1,73,124,.16),rgba(137,194,217,.18));border:1px solid rgba(70,143,175,.18);isolation:isolate}
.learn-lesson-thumb-placeholder{font-size:1.25rem;font-weight:950;color:var(--module-color);transition:opacity .2s ease}
.learn-lesson-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.learn-lesson-thumb.is-loaded .learn-lesson-thumb-placeholder{opacity:0}
.learn-lesson-thumb.is-loaded::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(255,255,255,.24);pointer-events:none}
.learn-lesson-thumb.is-error{background:linear-gradient(145deg,rgba(1,42,74,.16),rgba(97,165,194,.15))}

.lesson-internet-media-shell{display:grid;gap:1rem;padding:1rem;border-radius:28px;background:linear-gradient(145deg,rgba(255,255,255,.95),rgba(233,246,251,.92));border:1px solid var(--border);box-shadow:var(--shadow);overflow:hidden}
html[data-theme="dark"] .lesson-internet-media-shell{background:linear-gradient(145deg,rgba(1,42,74,.84),rgba(1,58,99,.72));border-color:rgba(97,165,194,.24)}
.lesson-internet-media-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:.2rem .2rem 0}
.lesson-internet-media-head h2{margin:.35rem 0 .45rem;font-size:clamp(1.25rem,2.2vw,1.75rem)}
.lesson-internet-media-head p{margin:0;max-width:76ch;color:var(--muted);line-height:1.7}
.lesson-online-badge{display:inline-flex;align-items:center;justify-content:center;min-width:78px;padding:.55rem .75rem;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;font-size:.72rem;font-weight:950;letter-spacing:.08em}
html[data-theme="dark"] .lesson-online-badge{background:rgba(22,163,74,.18);color:#86efac;border-color:rgba(134,239,172,.35)}
.lesson-internet-media-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:1rem;align-items:start}
.lesson-online-image-card,.lesson-online-video-card{margin:0;border-radius:23px;background:var(--card);border:1px solid rgba(70,143,175,.17);overflow:hidden;box-shadow:0 14px 32px rgba(1,42,74,.08)}
.lesson-online-image-stage{position:relative;width:100%;aspect-ratio:16/9;min-height:0;background:linear-gradient(145deg,#012A4A,#014F86);overflow:hidden;display:grid;place-items:center}
.lesson-online-image-stage>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block;background:#eef8fc}
.lesson-online-image-loading{display:grid;place-items:center;text-align:center;gap:.45rem;padding:1.5rem;color:#fff}
.lesson-online-image-loading>span{width:82px;height:82px;border-radius:25px;display:grid;place-items:center;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.22);font-size:2.25rem;font-weight:950;box-shadow:0 14px 30px rgba(0,0,0,.18)}
.lesson-online-image-loading strong{font-size:1rem}.lesson-online-image-loading small{color:#A9D6E5}
.lesson-online-image-card.is-loaded .lesson-online-image-loading{opacity:0;pointer-events:none}
.lesson-online-image-card.is-error .lesson-online-image-loading strong{color:#fecaca}
.lesson-online-image-credit{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.72rem .85rem;background:rgba(137,194,217,.08);font-size:.68rem;color:var(--muted);line-height:1.35}
.lesson-online-image-credit span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lesson-online-image-credit a{flex:0 0 auto;color:var(--primary);font-weight:850;text-decoration:none}
.lesson-online-video-card{display:flex;flex-direction:column;padding:.85rem}
.lesson-online-video-copy{padding:.25rem .2rem .75rem}.lesson-online-video-copy h3{margin:.35rem 0 .42rem;font-size:1.12rem;line-height:1.35}.lesson-online-video-copy p{margin:0;color:var(--muted);font-size:.84rem;line-height:1.6}
.lesson-youtube-frame{position:relative;aspect-ratio:16/9;min-height:260px;border-radius:18px;overflow:hidden;background:#001421;box-shadow:0 14px 30px rgba(1,42,74,.2)}
.lesson-youtube-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.lesson-online-video-actions{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.8rem}.lesson-online-video-actions .btn{flex:1 1 170px;min-height:42px}
.lesson-video-unavailable{min-height:260px;border-radius:18px;display:grid;place-items:center;text-align:center;background:linear-gradient(145deg,#012A4A,#014F86);color:#fff}.lesson-video-unavailable span{font-size:3rem}.lesson-video-unavailable p{margin:0;color:#d8eef7}
.lesson-online-video-card .learn-video-credit{display:block;margin-top:.7rem;color:var(--muted);font-size:.67rem;line-height:1.45}

@media(max-width:980px){.lesson-internet-media-grid{grid-template-columns:1fr}.lesson-online-image-stage{min-height:0}.lesson-youtube-frame{min-height:0}}
@media(max-width:560px){.learn-lesson-row{grid-template-columns:50px auto minmax(0,1fr);gap:.6rem;padding:.72rem}.learn-lesson-thumb{width:50px;height:50px;border-radius:14px}.lesson-internet-media-shell{padding:.75rem;border-radius:22px}.lesson-internet-media-head{flex-direction:column}.lesson-online-badge{align-self:flex-start}.lesson-online-image-stage{min-height:0}.lesson-online-image-credit{align-items:flex-start;flex-direction:column}.lesson-online-image-credit span{white-space:normal}.lesson-online-video-card{padding:.65rem}.lesson-online-video-actions{display:grid}.lesson-online-video-actions .btn{width:100%}}

/* ===== v3.4.1 lesson generated-image sizing fix =====
   Keep the local generated lesson image at its natural 16:9 size.
   Do not stretch the figure to the taller YouTube card and do not crop the image. */
.lesson-internet-media-grid{
  align-items:start !important;
  grid-auto-rows:max-content;
}
.lesson-local-generated-image-card{
  display:flex !important;
  flex-direction:column;
  align-self:start !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
}
.lesson-local-generated-image-card .lesson-online-image-stage{
  display:block !important;
  position:relative;
  width:100%;
  height:auto !important;
  min-height:0 !important;
  aspect-ratio:auto !important;
  overflow:hidden;
  line-height:0;
  background:#eef8fc;
}
.lesson-local-generated-image-card .lesson-online-image-stage > img{
  position:static !important;
  inset:auto !important;
  display:block !important;
  width:100% !important;
  height:auto !important;
  max-width:100%;
  max-height:none !important;
  aspect-ratio:16 / 9;
  object-fit:contain !important;
  object-position:center center;
  background:#eef8fc;
}
.lesson-local-generated-image-card .lesson-online-image-credit{
  flex:0 0 auto;
}

/* v3.4.2: keep curriculum stage filters reliable on mobile. */
.learn-catalog-card[hidden],.learn-catalog-card.is-filtered-out{display:none!important}


/* ===== v3.4.3 local lesson thumbnail fix =====
   Use the generated thumbnail bundled in the ZIP. Keep its 16:9 shape,
   prevent narrow/cropped previews, and fall back to the module icon only
   when the local image is genuinely unavailable. */
.learn-lesson-row{
  grid-template-columns:112px 42px minmax(0,1fr) 36px !important;
  align-items:center;
}
.learn-lesson-thumb{
  width:112px !important;
  height:63px !important;
  aspect-ratio:16 / 9;
  border-radius:14px !important;
  flex:none;
  background:linear-gradient(145deg,rgba(1,73,124,.12),rgba(137,194,217,.16));
}
.learn-lesson-thumb img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
  background:#eef8fc;
}
.learn-lesson-thumb.has-local-thumb:not(.is-error) .learn-lesson-thumb-placeholder,
.learn-lesson-thumb.is-loaded .learn-lesson-thumb-placeholder{
  opacity:0;
}
.learn-lesson-thumb.is-error .learn-lesson-thumb-placeholder{
  opacity:1;
}
.learn-lesson-thumb.is-error img{
  display:none !important;
}
@media(max-width:700px){
  .learn-lesson-row{
    grid-template-columns:82px 36px minmax(0,1fr) !important;
    gap:.58rem !important;
  }
  .learn-lesson-thumb{
    width:82px !important;
    height:46px !important;
    border-radius:11px !important;
  }
  .learn-lesson-number{
    width:36px;
    height:36px;
    border-radius:12px;
  }
  .learn-lesson-open{display:none !important}
}
@media(max-width:390px){
  .learn-lesson-row{
    grid-template-columns:72px 34px minmax(0,1fr) !important;
    padding:.68rem !important;
  }
  .learn-lesson-thumb{
    width:72px !important;
    height:41px !important;
  }
}


/* ===== v3.4.4 module + lesson card redesign =====
   Goal:
   - remove unwanted underlines from module/lesson links
   - redesign curriculum modules and lesson list like polished paper cards
   - improve mobile readability */
.learn-module-catalog{
  gap:1rem;
}
.learn-catalog-card{
  min-height:100%;
  padding:1.08rem 1.08rem 1rem;
  border-radius:28px;
  border:1px solid rgba(70,143,175,.18);
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(244,250,252,.96));
  box-shadow:0 12px 28px rgba(1,42,74,.07);
  text-decoration:none !important;
  isolation:isolate;
}
.learn-catalog-card::after{
  content:"";
  position:absolute;
  inset:auto 14px 0 14px;
  height:14px;
  border-radius:14px 14px 0 0;
  background:linear-gradient(90deg,color-mix(in srgb,var(--module-color) 18%,transparent),transparent);
  opacity:.85;
  pointer-events:none;
}
.learn-catalog-card,
.learn-catalog-card:hover,
.learn-catalog-card:focus,
.learn-catalog-card:active,
.learn-catalog-card *,
.learn-catalog-card:hover *,
.learn-catalog-card:focus *{
  text-decoration:none !important;
}
.learn-catalog-card:hover{
  transform:translateY(-3px);
  border-color:color-mix(in srgb,var(--module-color) 42%, #cfe3ed);
  box-shadow:0 18px 40px color-mix(in srgb,var(--module-color) 16%, rgba(1,42,74,.08));
}
.learn-catalog-card.active{
  border-color:var(--module-color);
  box-shadow:0 20px 42px color-mix(in srgb,var(--module-color) 18%, rgba(1,42,74,.08));
}
.learn-catalog-icon{
  width:64px;
  height:64px;
  flex:0 0 64px;
  border-radius:20px;
  box-shadow:0 12px 24px color-mix(in srgb,var(--module-color) 24%, transparent);
}
.learn-catalog-copy{
  display:grid;
  gap:.38rem;
}
.learn-catalog-card h3{
  font-size:1.08rem;
  line-height:1.38;
  margin:.28rem 0 .1rem;
  color:var(--text);
}
.learn-catalog-card p{
  font-size:.84rem;
  line-height:1.62;
  margin:0 0 .3rem;
  -webkit-line-clamp:3;
}
.learn-catalog-progress{
  height:8px;
  border-radius:999px;
  background:rgba(1,42,74,.08);
}
.learn-catalog-card small{
  margin-top:.18rem;
  font-size:.76rem;
  font-weight:700;
}

.learn-lesson-list{
  gap:1rem;
}
.learn-lesson-row{
  position:relative;
  grid-template-columns:112px 48px minmax(0,1fr) 42px !important;
  gap:1rem !important;
  align-items:center;
  padding:1rem 1.05rem !important;
  border-radius:28px;
  background:linear-gradient(180deg,rgba(255,255,255,.99),rgba(245,250,252,.97));
  border:1px solid rgba(70,143,175,.18);
  box-shadow:0 14px 30px rgba(1,42,74,.06);
  color:inherit;
  text-decoration:none !important;
  overflow:hidden;
}
.learn-lesson-row::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:6px;
  background:linear-gradient(180deg,var(--module-color),#61A5C2);
  opacity:.9;
}
.learn-lesson-row,
.learn-lesson-row:hover,
.learn-lesson-row:focus,
.learn-lesson-row:active,
.learn-lesson-row *,
.learn-lesson-row:hover *,
.learn-lesson-row:focus *{
  text-decoration:none !important;
  -webkit-text-decoration-skip:objects;
}
.learn-lesson-row:hover{
  transform:translateY(-2px);
  border-color:color-mix(in srgb,var(--module-color) 40%, #cfe3ed);
  box-shadow:0 18px 38px color-mix(in srgb,var(--module-color) 14%, rgba(1,42,74,.08));
}
.learn-lesson-row.status-completed{
  border-color:rgba(22,163,74,.22);
  box-shadow:0 14px 30px rgba(22,163,74,.08);
}
.learn-lesson-row.status-completed::before{
  background:linear-gradient(180deg,#16a34a,#6fd18f);
}
.learn-lesson-row.status-in_progress{
  border-color:rgba(245,158,11,.24);
  box-shadow:0 14px 30px rgba(245,158,11,.08);
}
.learn-lesson-row.status-in_progress::before{
  background:linear-gradient(180deg,#f59e0b,#f8c259);
}
.learn-lesson-thumb{
  box-shadow:0 10px 22px rgba(1,42,74,.08);
}
.learn-lesson-number{
  width:48px;
  height:48px;
  border-radius:16px;
  background:linear-gradient(180deg,#f4bc4d,#e19a1f);
  color:#fff;
  box-shadow:0 10px 20px rgba(225,154,31,.26);
  font-size:1rem;
  font-weight:950;
}
.learn-lesson-row.status-completed .learn-lesson-number{
  background:linear-gradient(180deg,#22c55e,#16a34a);
  color:#fff;
  box-shadow:0 10px 20px rgba(22,163,74,.22);
}
.learn-lesson-row.status-in_progress .learn-lesson-number{
  background:linear-gradient(180deg,#f7b955,#f59e0b);
  color:#fff;
  box-shadow:0 10px 20px rgba(245,158,11,.25);
}
.learn-lesson-row-copy{
  min-width:0;
  display:grid;
  gap:.25rem;
}
.learn-lesson-row-title{
  display:grid;
  gap:.18rem;
  align-items:start;
}
.learn-lesson-row-title strong{
  display:block;
  font-size:1.15rem;
  line-height:1.34;
  color:var(--text);
  font-weight:900;
}
.learn-lesson-row-title span{
  display:block;
  font-size:.92rem;
  line-height:1.45;
  color:var(--module-color);
  font-weight:850;
}
.learn-lesson-row p{
  margin:.08rem 0 .22rem;
  color:var(--muted);
  font-size:.86rem;
  line-height:1.65;
}
.learn-lesson-row-meta{
  gap:.5rem;
}
.learn-lesson-row-meta span{
  font-size:.76rem;
  font-weight:800;
  color:#45657a;
  padding:.4rem .7rem;
  border-radius:999px;
  background:rgba(137,194,217,.10);
  border:1px solid rgba(70,143,175,.14);
}
.learn-lesson-open{
  width:42px;
  height:42px;
  border-radius:50%;
  background:linear-gradient(145deg,var(--module-color),#61A5C2);
  color:#fff;
  box-shadow:0 10px 22px color-mix(in srgb,var(--module-color) 26%, transparent);
}
html[data-theme="dark"] .learn-catalog-card{
  background:linear-gradient(180deg,rgba(1,42,74,.84),rgba(1,34,58,.95));
}
html[data-theme="dark"] .learn-lesson-row{
  background:linear-gradient(180deg,rgba(1,42,74,.88),rgba(1,34,58,.95));
  border-color:rgba(137,194,217,.18);
}
html[data-theme="dark"] .learn-lesson-row-meta span{
  color:#d2e7ef;
  background:rgba(137,194,217,.12);
  border-color:rgba(137,194,217,.12);
}
@media(max-width:820px){
  .learn-catalog-card{
    border-radius:24px;
    padding:1rem;
  }
  .learn-lesson-row{
    grid-template-columns:96px 44px minmax(0,1fr) !important;
    gap:.82rem !important;
    padding:.92rem !important;
    border-radius:24px;
  }
  .learn-lesson-thumb{
    width:96px !important;
    height:54px !important;
  }
  .learn-lesson-row-title strong{
    font-size:1.02rem;
  }
  .learn-lesson-row-title span{
    font-size:.86rem;
  }
  .learn-lesson-row p{
    font-size:.82rem;
  }
  .learn-lesson-number{
    width:44px;
    height:44px;
    border-radius:15px;
  }
  .learn-lesson-open{display:none !important;}
}
@media(max-width:560px){
  .learn-module-catalog{
    gap:.85rem;
  }
  .learn-catalog-card{
    padding:.95rem;
    border-radius:22px;
  }
  .learn-catalog-icon{
    width:58px;
    height:58px;
    flex-basis:58px;
  }
  .learn-catalog-card h3{
    font-size:1rem;
  }
  .learn-catalog-card p{
    font-size:.82rem;
  }
  .learn-lesson-list{
    gap:.85rem;
  }
  .learn-lesson-row{
    grid-template-columns:84px 42px minmax(0,1fr) !important;
    gap:.7rem !important;
    align-items:start;
    padding:.88rem !important;
    border-radius:22px;
  }
  .learn-lesson-thumb{
    width:84px !important;
    height:48px !important;
    border-radius:12px !important;
    margin-top:.08rem;
  }
  .learn-lesson-number{
    width:42px;
    height:42px;
    border-radius:14px;
    margin-top:.15rem;
  }
  .learn-lesson-row-title strong{
    font-size:.98rem;
    line-height:1.36;
  }
  .learn-lesson-row-title span{
    font-size:.82rem;
  }
  .learn-lesson-row p{
    font-size:.8rem;
    line-height:1.58;
  }
  .learn-lesson-row-meta span{
    font-size:.72rem;
    padding:.34rem .58rem;
  }
}
@media(max-width:390px){
  .learn-lesson-row{
    grid-template-columns:74px 38px minmax(0,1fr) !important;
    gap:.58rem !important;
    padding:.8rem !important;
  }
  .learn-lesson-thumb{
    width:74px !important;
    height:42px !important;
  }
  .learn-lesson-number{
    width:38px;
    height:38px;
    border-radius:13px;
    font-size:.9rem;
  }
  .learn-lesson-row-title strong{
    font-size:.93rem;
  }
  .learn-lesson-row-title span{
    font-size:.78rem;
  }
  .learn-lesson-row p{
    font-size:.76rem;
  }
}

/* ===== v3.4.5 Learn progress + category-aware reporting ===== */
.category-pill{
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  padding:.36rem .66rem;
  border-radius:999px;
  background:rgba(1,73,124,.09);
  border:1px solid rgba(70,143,175,.18);
  color:#01497C;
  font-size:.74rem;
  font-weight:900;
  white-space:nowrap;
}
.learning-report-card{margin-bottom:1rem}
.learning-report-metrics{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:.75rem;
  margin-top:.9rem;
}
.learning-report-metrics>div{
  padding:1rem;
  border-radius:20px;
  background:linear-gradient(180deg,rgba(169,214,229,.17),rgba(255,255,255,.74));
  border:1px solid rgba(70,143,175,.15);
}
.learning-report-metrics span,.learning-report-metrics strong,.learning-report-metrics small{display:block}
.learning-report-metrics span{font-size:.75rem;color:var(--muted);font-weight:800}
.learning-report-metrics strong{font-size:1.45rem;margin:.18rem 0;color:var(--text)}
.learning-report-metrics small{font-size:.74rem;color:#2C7DA0;font-weight:800}
.learning-report-progress{height:12px;border-radius:999px;overflow:hidden;background:rgba(1,42,74,.08);margin:1rem 0}
.learning-report-progress span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#01497C,#61A5C2)}
.learning-report-subhead{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin:.85rem 0 .65rem}
.learning-report-subhead h3{margin:0;font-size:1.05rem}
.learning-report-subhead>span{color:var(--muted);font-size:.78rem;font-weight:800}
.learning-report-module-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.72rem}
.learning-report-module-grid article{
  padding:.82rem;
  border-radius:18px;
  background:rgba(137,194,217,.07);
  border:1px solid rgba(70,143,175,.14);
}
.learning-report-module-head{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:.6rem;align-items:center}
.learning-report-module-head>span{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:var(--module-color);color:#fff;font-weight:950}
.learning-report-module-head strong,.learning-report-module-head small{display:block}
.learning-report-module-head strong{font-size:.82rem;line-height:1.35}
.learning-report-module-head small{font-size:.68rem;color:var(--muted);margin-top:.1rem}
.learning-report-module-head>b{font-size:.85rem;color:var(--module-color)}
.learning-report-module-bar{height:7px;border-radius:999px;background:rgba(1,42,74,.08);overflow:hidden;margin:.65rem 0 .4rem}
.learning-report-module-bar span{display:block;height:100%;border-radius:inherit;background:var(--module-color)}
.learning-report-module-grid p{margin:0;color:var(--muted);font-size:.7rem;line-height:1.45}
.learning-report-bottom-grid{display:grid;grid-template-columns:1.5fr .7fr;gap:.8rem;margin-top:.85rem}
.learning-recent-list{display:grid;gap:.5rem}
.learning-recent-list a{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:.65rem;align-items:center;padding:.66rem .72rem;border-radius:15px;background:rgba(137,194,217,.07);border:1px solid rgba(70,143,175,.12);color:inherit;text-decoration:none}
.learning-recent-list a:hover{text-decoration:none;border-color:#61A5C2}
.learning-recent-list>a>span{font-size:.68rem;font-weight:900;color:#2C7DA0}
.learning-recent-list strong,.learning-recent-list small{display:block}
.learning-recent-list strong{font-size:.8rem}
.learning-recent-list small{font-size:.68rem;color:var(--muted);margin-top:.12rem}
.learning-recent-list time{font-size:.66rem;color:var(--muted);white-space:nowrap}
.learning-next-card{padding:1rem;border-radius:20px;background:linear-gradient(145deg,#012A4A,#014F86);color:#fff;display:flex;flex-direction:column;align-items:flex-start;gap:.5rem}
.learning-next-card .eyebrow{color:#A9D6E5}
.learning-next-card strong{font-size:1.05rem;line-height:1.45}
.learning-next-card small{color:#d4e8f1;line-height:1.5}
.learning-next-card .btn{margin-top:auto}
.category-performance-card{margin-bottom:1rem}
.category-performance-card .card-heading p{margin:.25rem 0 0;color:var(--muted)}
.category-performance-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}
.category-performance-grid>article{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.8rem;padding:1rem;border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.97),rgba(242,249,252,.94));border:1px solid rgba(70,143,175,.17)}
.category-performance-grid>article.no-attempts{opacity:.72}
.category-performance-mark{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(145deg,#01497C,#2C7DA0);color:#fff;font-size:1.35rem;font-weight:950}
.category-performance-grid strong,.category-performance-grid small{display:block}
.category-performance-grid>article>div>strong{font-size:1rem}
.category-performance-grid>article>div>small{font-size:.72rem;color:var(--muted);margin-top:.18rem}
.category-performance-grid dl{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.55rem;margin:.1rem 0 0}
.category-performance-grid dl>div{padding:.62rem;border-radius:14px;background:rgba(137,194,217,.08);border:1px solid rgba(70,143,175,.12)}
.category-performance-grid dt{font-size:.64rem;color:var(--muted);font-weight:800}
.category-performance-grid dd{margin:.12rem 0 0;font-size:.92rem;font-weight:950}
.category-paper-group+.category-paper-group{margin-top:1rem;padding-top:1rem;border-top:1px solid rgba(70,143,175,.14)}
.category-paper-group-head{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:.7rem}
.category-paper-group-head small{font-size:.75rem;color:var(--muted);font-weight:800}
html[data-theme="dark"] .category-pill{color:#d7edf6;background:rgba(137,194,217,.13)}
html[data-theme="dark"] .learning-report-metrics>div,
html[data-theme="dark"] .category-performance-grid>article{background:rgba(1,42,74,.45)}
@media(max-width:980px){
  .learning-report-module-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .learning-report-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:720px){
  .learning-report-bottom-grid,.category-performance-grid{grid-template-columns:1fr}
  .category-performance-grid dl{grid-template-columns:repeat(2,minmax(0,1fr))}
  .learning-recent-list a{grid-template-columns:auto minmax(0,1fr)}
  .learning-recent-list time{grid-column:2}
}
@media(max-width:520px){
  .learning-report-module-grid,.learning-report-metrics{grid-template-columns:1fr}
  .category-performance-grid dl{grid-template-columns:1fr 1fr}
  .category-paper-group-head{align-items:flex-start;flex-direction:column}
}
@media print{
  .learning-report-card,.category-performance-card{break-inside:avoid-page}
  .learning-report-module-grid{grid-template-columns:repeat(3,1fr)}
  .learning-report-bottom-grid{grid-template-columns:1.4fr .6fr}
  .category-performance-grid{grid-template-columns:repeat(2,1fr)}
  .learning-report-card .btn{display:none!important}
  .learning-report-module-grid article,.learning-report-metrics>div,.category-performance-grid>article{box-shadow:none!important;background:#fff!important}
  .category-pill{border:1px solid #777;background:#fff;color:#111}
}
.dashboard-category-list{display:grid;gap:.8rem}


/* ===== v3.4.8 polished Google sign-in button =====
   Keep the official Google Identity Services button, but present it
   inside a clear, rounded, touch-friendly button frame. */
.auth-card .social-login-stack{
  width:100%;
  display:block;
}
.auth-card .google-signin-shell{
  position:relative;
  width:100%;
  min-height:62px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:7px;
  border:1px solid rgba(66,133,244,.28);
  border-radius:18px;
  background:linear-gradient(180deg,#ffffff 0%,#f4f9ff 100%);
  box-shadow:0 12px 28px rgba(1,42,74,.10),inset 0 1px 0 rgba(255,255,255,.95);
  overflow:hidden;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.auth-card .google-signin-shell::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  background:linear-gradient(115deg,rgba(66,133,244,.08),transparent 42%,rgba(52,168,83,.06));
}
.auth-card .google-signin-shell:hover{
  transform:translateY(-2px);
  border-color:rgba(66,133,244,.48);
  box-shadow:0 16px 34px rgba(1,42,74,.15),0 0 0 4px rgba(66,133,244,.08);
}
.auth-card .google-signin-shell:focus-within{
  border-color:#4285f4;
  box-shadow:0 0 0 4px rgba(66,133,244,.16),0 14px 30px rgba(1,42,74,.12);
}
.auth-card .google-signin-slot{
  position:relative;
  z-index:1;
  width:100%;
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border-radius:999px;
  background:#1a73e8;
}
.auth-card .google-signin-slot>div,
.auth-card .google-signin-slot iframe{
  width:100%!important;
  max-width:100%!important;
  min-width:100%!important;
  border-radius:999px!important;
  overflow:hidden!important;
}
html[data-theme="dark"] .auth-card .google-signin-shell{
  border-color:rgba(137,194,217,.28);
  background:linear-gradient(180deg,rgba(7,31,52,.98),rgba(4,23,40,.98));
  box-shadow:0 14px 32px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.06);
}
html[data-theme="dark"] .auth-card .google-signin-shell:hover{
  border-color:rgba(137,194,217,.48);
  box-shadow:0 16px 36px rgba(0,0,0,.34),0 0 0 4px rgba(97,165,194,.10);
}
@media(max-width:600px){
  .auth-card .google-signin-shell{
    min-height:60px;
    padding:6px;
    border-radius:17px;
  }
  .auth-card .google-signin-slot{
    min-height:48px;
  }
}


/* ===== v3.4.9 official white Google pill button =====
   Matches the requested Sign in with Google pill style while keeping
   Google Identity Services rendering and authentication intact. */
.auth-card .social-login-stack{
  width:100%;
  display:flex;
  justify-content:center;
}
.auth-card .google-signin-shell{
  position:relative;
  width:100%;
  max-width:430px;
  min-height:64px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  border:0;
  border-radius:999px;
  background:transparent;
  box-shadow:none;
  overflow:visible;
  transition:transform .16s ease,filter .16s ease;
}
.auth-card .google-signin-shell::before{
  display:none;
}
.auth-card .google-signin-shell:hover{
  transform:translateY(-1px);
  border:0;
  box-shadow:none;
  filter:drop-shadow(0 10px 18px rgba(1,42,74,.12));
}
.auth-card .google-signin-shell:focus-within{
  border:0;
  box-shadow:0 0 0 4px rgba(66,133,244,.14);
  outline:none;
}
.auth-card .google-signin-slot{
  position:relative;
  z-index:1;
  width:100%;
  min-height:64px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:visible;
  border-radius:999px;
  background:#fff;
}
.auth-card .google-signin-slot>div,
.auth-card .google-signin-slot iframe{
  width:100%!important;
  max-width:100%!important;
  min-width:100%!important;
  min-height:64px!important;
  border-radius:999px!important;
  overflow:hidden!important;
  box-shadow:0 8px 20px rgba(1,42,74,.10)!important;
}
html[data-theme="dark"] .auth-card .google-signin-shell,
html[data-theme="dark"] .auth-card .google-signin-shell:hover{
  border:0;
  background:transparent;
  box-shadow:none;
}
html[data-theme="dark"] .auth-card .google-signin-slot{
  background:#fff;
}
@media(max-width:600px){
  .auth-card .google-signin-shell,
  .auth-card .google-signin-slot{
    min-height:60px;
  }
  .auth-card .google-signin-slot>div,
  .auth-card .google-signin-slot iframe{
    min-height:60px!important;
  }
}


/* ===== v3.4.10 Google pill double-background fix =====
   The official Google iframe is the visible button. Its surrounding slot
   must stay transparent so a second white capsule never appears behind it. */
.auth-card .social-login-stack{
  width:100%;
  display:flex;
  justify-content:center;
  align-items:center;
}
.auth-card .google-signin-shell{
  width:min(100%,400px);
  max-width:400px;
  min-height:60px;
  padding:0;
  margin:0 auto;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  overflow:visible;
}
.auth-card .google-signin-shell::before,
.auth-card .google-signin-shell::after{
  display:none !important;
}
.auth-card .google-signin-slot{
  width:100%;
  min-height:60px;
  padding:0;
  margin:0;
  display:flex;
  align-items:center;
  justify-content:center;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  overflow:visible;
}
.auth-card .google-signin-slot>div{
  margin:0 auto !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.auth-card .google-signin-slot iframe{
  display:block !important;
  margin:0 auto !important;
  border-radius:999px !important;
  box-shadow:0 9px 22px rgba(1,42,74,.13) !important;
  overflow:hidden !important;
}
.auth-card .google-signin-shell:hover{
  transform:translateY(-1px);
  filter:none;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.auth-card .google-signin-shell:focus-within{
  outline:none;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.auth-card .google-signin-shell:focus-within iframe{
  box-shadow:0 0 0 4px rgba(66,133,244,.16),0 9px 22px rgba(1,42,74,.13) !important;
}
html[data-theme="dark"] .auth-card .google-signin-slot,
html[data-theme="dark"] .auth-card .google-signin-shell{
  background:transparent !important;
}
@media(max-width:600px){
  .auth-card .google-signin-shell,
  .auth-card .google-signin-slot{
    min-height:56px;
  }
  .auth-card .google-signin-slot iframe{
    min-height:56px !important;
  }
}


/* ===== v3.4.11 — JFT / JLPT N5 / JLPT N4 category foundations ===== */
.exam-category-card.is-planned,.notes-category-card.is-planned{border-style:solid}
.exam-category-status.is-planned,.notes-category-status.is-planned{background:rgba(245,158,11,.12);border-color:rgba(245,158,11,.28);color:#a15c00}
[data-theme="dark"] .exam-category-status.is-planned,[data-theme="dark"] .notes-category-status.is-planned{color:#fcd34d;background:rgba(245,158,11,.12);border-color:rgba(245,158,11,.28)}
.exam-category-mark.text-mark,.notes-category-mark.text-mark{font-size:.95rem;letter-spacing:.02em}
.exam-category-jft .exam-category-mark,.notes-category-jft .notes-category-mark{background:linear-gradient(135deg,#7c3aed,#2563eb)}
.exam-category-jlpt-n5 .exam-category-mark,.notes-category-jlpt-n5 .notes-category-mark{background:linear-gradient(135deg,#16a34a,#0f766e)}
.exam-category-jlpt-n4 .exam-category-mark,.notes-category-jlpt-n4 .notes-category-mark{background:linear-gradient(135deg,#dc2626,#ea580c)}
.exam-category-jft::after,.notes-category-jft::after{background:radial-gradient(circle,rgba(124,58,237,.18),transparent 68%)}
.exam-category-jlpt-n5::after,.notes-category-jlpt-n5::after{background:radial-gradient(circle,rgba(22,163,74,.18),transparent 68%)}
.exam-category-jlpt-n4::after,.notes-category-jlpt-n4::after{background:radial-gradient(circle,rgba(220,38,38,.16),transparent 68%)}
.exam-category-card.is-planned .btn,.notes-category-card.is-planned .btn{background:linear-gradient(135deg,#01497C,#2C7DA0)}
.exam-category-empty-state{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:1rem;align-items:center;padding:1.25rem;border:1px dashed #89C2D9;border-radius:26px;background:linear-gradient(135deg,rgba(220,238,246,.65),rgba(255,255,255,.85));box-shadow:var(--shadow)}
[data-theme="dark"] .exam-category-empty-state{background:linear-gradient(135deg,rgba(1,42,74,.86),rgba(1,58,99,.72));border-color:#2A6F97}
.exam-category-empty-mark{display:grid;place-items:center;width:68px;height:68px;border-radius:20px;background:linear-gradient(135deg,#01497C,#2C7DA0);color:#fff;font-size:1.1rem;font-weight:950;box-shadow:0 12px 28px rgba(1,73,124,.22)}
.exam-category-empty-state h2{margin:.25rem 0 .35rem}.exam-category-empty-state p{margin:0;color:var(--muted);line-height:1.65}.exam-category-empty-state>strong{font-size:1.4rem;color:#01497C;padding:.7rem .9rem;border-radius:16px;background:rgba(255,255,255,.7);border:1px solid #A9D6E5;white-space:nowrap}
[data-theme="dark"] .exam-category-empty-state>strong{color:#A9D6E5;background:rgba(1,42,74,.7);border-color:#2A6F97}
.notes-category-article-card.is-planned{border-style:dashed;opacity:.96}.notes-category-article-card.is-planned .notes-planned-button{cursor:default;pointer-events:none;opacity:.78}.notes-category-planned-intro{border-style:dashed}
@media(max-width:900px){.exam-category-grid,.notes-category-grid{grid-template-columns:1fr}}
@media(max-width:640px){.exam-category-empty-state{grid-template-columns:auto 1fr}.exam-category-empty-state>strong{grid-column:1/-1;text-align:center}.exam-category-mark.text-mark,.notes-category-mark.text-mark{font-size:.86rem}}


/* v3.5.1 — notes article layout refinement */
.generated-note-page .generated-note-content{padding:1.25rem 1.3rem 1.4rem;display:grid;gap:.95rem}
.generated-note-page .generated-note-content>*{margin:0}
.generated-note-page .generated-note-content .page-kicker{display:inline-flex;align-items:center;justify-content:center;width:max-content;max-width:100%;padding:.38rem .72rem;border-radius:999px;background:rgba(44,125,160,.12);border:1px solid rgba(44,125,160,.22);font-size:.72rem;letter-spacing:.12em;font-weight:900;color:#2C7DA0;text-transform:uppercase}
.generated-note-page .generated-note-content h1{font-size:1.55rem;line-height:1.28;color:#f8fbff}
.generated-note-page .generated-note-content h2,.generated-note-page .generated-note-content h3{line-height:1.35;color:#f8fbff}
.generated-note-page .generated-note-content .lead{font-size:1rem;line-height:1.8;color:rgba(255,255,255,.86)}
.generated-note-page .generated-note-content p,.generated-note-page .generated-note-content li{line-height:1.8;color:rgba(255,255,255,.9)}
.generated-note-page .generated-note-content ul,.generated-note-page .generated-note-content ol{margin:0;padding-left:1.35rem;display:grid;gap:.45rem}
.generated-note-page .generated-note-content table{display:block;width:100%;overflow-x:auto;border-collapse:separate;border-spacing:0;margin:0;border:1px solid rgba(70,143,175,.18);border-radius:18px;background:rgba(255,255,255,.03)}
.generated-note-page .generated-note-content table thead,.generated-note-page .generated-note-content table tbody,.generated-note-page .generated-note-content table tr{width:100%}
.generated-note-page .generated-note-content th,.generated-note-page .generated-note-content td{padding:.72rem .78rem;min-width:140px;line-height:1.7}
.generated-note-page .generated-note-content th:first-child{border-top-left-radius:17px}
.generated-note-page .generated-note-content th:last-child{border-top-right-radius:17px}
.generated-note-page .generated-note-content .notice,.generated-note-page .generated-note-content .source-box{padding:.95rem 1rem;border-radius:16px;background:rgba(137,194,217,.10);border:1px solid rgba(137,194,217,.18);border-left:4px solid #2C7DA0;margin:0}
.generated-note-page .generated-note-content .source-box h3{margin:0 0 .5rem}
.generated-note-page .generated-note-content .source-box ul{padding-left:1.1rem}
.generated-note-page .generated-note-content ruby rt{color:#8bd3f7;font-weight:800}
.note-prose{padding:1.25rem 1.3rem 1.4rem;display:grid;gap:1rem;line-height:1.78}
.note-prose>*{margin:0}
.note-prose .note-title{font-size:1.5rem;line-height:1.28;color:#f8fbff;font-weight:950}
.note-prose .note-kicker{display:inline-flex;align-items:center;justify-content:center;width:max-content;max-width:100%;padding:.38rem .72rem;border-radius:999px;background:rgba(44,125,160,.12);border:1px solid rgba(44,125,160,.22);font-size:.72rem;letter-spacing:.12em;font-weight:900;color:#2C7DA0;text-transform:uppercase}
.note-prose .note-subtitle{font-size:1.02rem;color:rgba(255,255,255,.86)}
.note-prose .note-paragraph{line-height:1.85;color:rgba(255,255,255,.92)}
.note-prose .note-mini-title{font-size:1.08rem;line-height:1.45;color:#f8fbff;font-weight:900;margin-top:.15rem}
.note-prose .note-bullets{margin:0;padding-left:1.25rem;display:grid;gap:.45rem}
.note-prose .note-bullets li{line-height:1.8;color:rgba(255,255,255,.92)}
.note-prose .note-data-table{overflow-x:auto;border:1px solid rgba(70,143,175,.18);border-radius:18px;background:rgba(255,255,255,.03)}
.note-prose .note-data-table table{width:100%;border-collapse:separate;border-spacing:0;margin:0}
.note-prose .note-data-table th,.note-prose .note-data-table td{padding:.72rem .78rem;vertical-align:top;border-right:1px solid rgba(70,143,175,.14);border-bottom:1px solid rgba(70,143,175,.14);line-height:1.72;min-width:120px}
.note-prose .note-data-table th:last-child,.note-prose .note-data-table td:last-child{border-right:0}
.note-prose .note-data-table tr:last-child td{border-bottom:0}
.note-prose .note-data-table thead th{background:#012A4A;color:#fff;font-weight:900}
.note-prose .note-callout{padding:.95rem 1rem;border-radius:16px;background:rgba(137,194,217,.10);border:1px solid rgba(137,194,217,.18);border-left:4px solid #2C7DA0;line-height:1.8}
.note-prose ruby rt{color:#8bd3f7;font-weight:800}
@media(max-width:640px){
  .generated-note-page .generated-note-content,.note-prose{padding:1rem .95rem 1.1rem}
  .generated-note-page .generated-note-content h1,.note-prose .note-title{font-size:1.28rem}
  .generated-note-page .generated-note-content table,.note-prose .note-data-table{border-radius:16px}
}

/* v3.5.0 Japanese exam content */
.jp-question{white-space:pre-line}
.question-audio-button{border:0;border-radius:999px;padding:.65rem 1rem;margin:0 0 .9rem;background:linear-gradient(135deg,#01497C,#2C7DA0);color:#fff;font:inherit;font-weight:900;cursor:pointer;box-shadow:0 10px 22px rgba(1,73,124,.18)}
.question-audio-button.is-playing{background:linear-gradient(135deg,#b45309,#f59e0b)}
.review-audio-transcript{margin:.7rem 0;padding:.75rem;border-radius:12px;background:#eef8fc;border:1px solid #cde4ef;font-family:"Noto Sans JP",sans-serif;line-height:1.65}
.generated-note-content .page-kicker{font-size:.72rem;letter-spacing:.12em;font-weight:900;color:#2C7DA0}.generated-note-content h1{font-size:1.45rem}.generated-note-content table{width:100%;border-collapse:collapse;margin:.8rem 0}.generated-note-content th,.generated-note-content td{border:1px solid rgba(70,143,175,.18);padding:.55rem;vertical-align:top}.generated-note-content th{background:#012A4A;color:#fff}.generated-note-content .notice,.generated-note-content .source-box{padding:.75rem;border-radius:14px;background:rgba(137,194,217,.10);border-left:4px solid #2C7DA0;margin:.75rem 0}.generated-note-content ruby rt{color:#2C7DA0}

/* ===== v3.5.6 — Dynamic home exam-category hero ===== */
.home-category-hero{
  --hero-accent:#01497C;
  --hero-accent-2:#61A5C2;
  --hero-soft:rgba(97,165,194,.16);
}
.home-category-hero[data-category="jft"]{
  --hero-accent:#6D28D9;
  --hero-accent-2:#8B5CF6;
  --hero-soft:rgba(124,58,237,.14);
}
.home-category-hero[data-category="jlpt-n5"]{
  --hero-accent:#0F766E;
  --hero-accent-2:#22C55E;
  --hero-soft:rgba(22,163,74,.14);
}
.home-category-hero[data-category="jlpt-n4"]{
  --hero-accent:#C2410C;
  --hero-accent-2:#EF4444;
  --hero-soft:rgba(234,88,12,.14);
}
.home-category-hero .landing-badge i,
.home-category-hero .exam-preview-label i{
  background:var(--hero-accent)!important;
  box-shadow:0 0 0 5px var(--hero-soft)!important;
}
.home-category-hero .exam-preview::before{
  background:linear-gradient(90deg,var(--hero-accent),var(--hero-accent-2),#A9D6E5)!important;
}
.home-category-hero .exam-preview-progress span{
  background:linear-gradient(90deg,var(--hero-accent),var(--hero-accent-2))!important;
}
.home-category-hero .exam-preview-options b{
  color:var(--hero-accent)!important;
  background:var(--hero-soft)!important;
}
.home-category-hero [data-hero-badge],
.home-category-hero [data-hero-title],
.home-category-hero [data-hero-desc],
.home-category-hero [data-hero-preview-label],
.home-category-hero [data-hero-preview-meta],
.home-category-hero [data-hero-preview-question],
.home-category-hero [data-hero-preview-a],
.home-category-hero [data-hero-preview-b],
.home-category-hero [data-hero-preview-c],
.home-category-hero [data-hero-open-label]{
  transition:opacity .18s ease,transform .18s ease;
}
.home-category-hero.is-switching [data-hero-badge],
.home-category-hero.is-switching [data-hero-title],
.home-category-hero.is-switching [data-hero-desc],
.home-category-hero.is-switching [data-hero-preview-label],
.home-category-hero.is-switching [data-hero-preview-meta],
.home-category-hero.is-switching [data-hero-preview-question],
.home-category-hero.is-switching [data-hero-preview-a],
.home-category-hero.is-switching [data-hero-preview-b],
.home-category-hero.is-switching [data-hero-preview-c],
.home-category-hero.is-switching [data-hero-open-label]{
  opacity:0;
  transform:translateY(7px);
}
.home-hero-category-tabs{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:.55rem;
  margin:1.2rem 0 .2rem;
}
.home-hero-category-tab{
  position:relative;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:.55rem;
  align-items:center;
  min-width:0;
  padding:.65rem .72rem .72rem;
  border:1px solid var(--line);
  border-radius:15px;
  background:color-mix(in srgb,var(--card) 94%,var(--hero-soft));
  color:var(--muted);
  font:inherit;
  text-align:left;
  cursor:pointer;
  overflow:hidden;
  transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease;
}
.home-hero-category-tab b{
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border-radius:11px;
  background:var(--surface-2);
  color:var(--text);
  font-size:.75rem;
  font-weight:950;
}
.home-hero-category-tab span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.025em;
}
.home-hero-category-tab::after{
  content:"";
  position:absolute;
  left:0;
  right:100%;
  bottom:0;
  height:3px;
  background:linear-gradient(90deg,var(--hero-accent),var(--hero-accent-2));
}
.home-hero-category-tab:hover{
  transform:translateY(-2px);
  border-color:color-mix(in srgb,var(--hero-accent) 40%,var(--line));
}
.home-hero-category-tab.active{
  border-color:var(--hero-accent);
  background:var(--hero-soft);
  color:var(--text);
  box-shadow:0 10px 24px color-mix(in srgb,var(--hero-accent) 14%,transparent);
}
.home-hero-category-tab.active b{
  color:#fff;
  background:linear-gradient(135deg,var(--hero-accent),var(--hero-accent-2));
}
.home-hero-category-tab.active::after{
  right:0;
  animation:homeHeroCategoryProgress 10s linear forwards;
}
@keyframes homeHeroCategoryProgress{
  from{transform:scaleX(0);transform-origin:left}
  to{transform:scaleX(1);transform-origin:left}
}
.exam-preview-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  margin-top:18px;
}
.exam-preview-footer .exam-preview-save{
  margin-top:0;
}
.home-hero-category-open{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:.55rem .75rem;
  border-radius:12px;
  border:1px solid color-mix(in srgb,var(--hero-accent) 30%,var(--line));
  background:var(--hero-soft);
  color:var(--hero-accent);
  font-size:.78rem;
  font-weight:900;
  text-decoration:none!important;
  white-space:nowrap;
}
.home-hero-category-open:hover{
  transform:translateY(-1px);
  background:color-mix(in srgb,var(--hero-soft) 72%,var(--card));
}
@media(max-width:900px){
  .home-hero-category-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:620px){
  .home-hero-category-tabs{
    display:flex;
    overflow-x:auto;
    padding-bottom:.25rem;
    scrollbar-width:none;
  }
  .home-hero-category-tabs::-webkit-scrollbar{display:none}
  .home-hero-category-tab{flex:0 0 145px}
  .exam-preview-footer{align-items:flex-start;flex-direction:column}
  .home-hero-category-open{width:100%}
}
@media(prefers-reduced-motion:reduce){
  .home-hero-category-tab.active::after{animation:none;transform:scaleX(1)}
}

/* ===== v3.5.7 — slower hero rotation, smooth transitions, single active attempt ===== */
.home-category-hero{
  transition:background .9s cubic-bezier(.22,.61,.36,1),border-color .9s cubic-bezier(.22,.61,.36,1),box-shadow .9s cubic-bezier(.22,.61,.36,1);
}
.home-category-hero .landing-badge i,
.home-category-hero .exam-preview-label i,
.home-category-hero .exam-preview::before,
.home-category-hero .exam-preview-progress span,
.home-category-hero .exam-preview-options b,
.home-category-hero .home-hero-category-open{
  transition:background .8s cubic-bezier(.22,.61,.36,1),color .8s cubic-bezier(.22,.61,.36,1),border-color .8s cubic-bezier(.22,.61,.36,1),box-shadow .8s cubic-bezier(.22,.61,.36,1),transform .25s ease;
}
.home-category-hero [data-hero-badge],
.home-category-hero [data-hero-title],
.home-category-hero [data-hero-desc],
.home-category-hero [data-hero-preview-label],
.home-category-hero [data-hero-preview-meta],
.home-category-hero [data-hero-preview-question],
.home-category-hero [data-hero-preview-a],
.home-category-hero [data-hero-preview-b],
.home-category-hero [data-hero-preview-c],
.home-category-hero [data-hero-open-label]{
  transition:opacity .62s cubic-bezier(.22,.61,.36,1),transform .62s cubic-bezier(.22,.61,.36,1),filter .62s cubic-bezier(.22,.61,.36,1);
  will-change:opacity,transform,filter;
}
.home-category-hero.is-switching [data-hero-badge],
.home-category-hero.is-switching [data-hero-title],
.home-category-hero.is-switching [data-hero-desc],
.home-category-hero.is-switching [data-hero-preview-label],
.home-category-hero.is-switching [data-hero-preview-meta],
.home-category-hero.is-switching [data-hero-preview-question],
.home-category-hero.is-switching [data-hero-preview-a],
.home-category-hero.is-switching [data-hero-preview-b],
.home-category-hero.is-switching [data-hero-preview-c],
.home-category-hero.is-switching [data-hero-open-label]{
  opacity:0;
  transform:translateY(14px) scale(.992);
  filter:blur(2px);
}
.home-hero-category-tab.active::after{
  animation-duration:10s;
}
.home-active-label-row{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:.65rem;
}
.home-active-category{
  display:inline-flex;
  align-items:center;
  gap:.42rem;
  padding:.4rem .7rem;
  border-radius:999px;
  border:1px solid color-mix(in srgb,#d94c65 24%,var(--line));
  background:color-mix(in srgb,#d94c65 8%,var(--surface));
}
.home-active-category small{
  color:var(--muted);
  font-size:.68rem;
  font-weight:800;
}
.home-active-category strong{
  color:var(--text);
  font-size:.76rem;
  font-weight:950;
}
.paper-single-attempt-notice{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:1rem;
  margin:0 0 1.2rem;
  padding:1rem 1.1rem;
  border:1px solid rgba(217,76,101,.24);
  border-radius:20px;
  background:linear-gradient(135deg,rgba(217,76,101,.08),rgba(243,165,178,.08));
  box-shadow:0 14px 32px rgba(110,31,53,.08);
}
.paper-single-attempt-notice>span{
  display:grid;
  place-items:center;
  width:46px;
  height:46px;
  border-radius:15px;
  background:linear-gradient(135deg,#be123c,#e85b74);
  color:#fff;
  font-weight:950;
}
.paper-single-attempt-notice h3{margin:0 0 .2rem;font-size:1rem}
.paper-single-attempt-notice p{margin:0;color:var(--muted);line-height:1.55;font-size:.88rem}
.active-attempt-blocked{
  white-space:normal!important;
  text-align:center;
  line-height:1.35;
}
@media(max-width:700px){
  .paper-single-attempt-notice{grid-template-columns:auto minmax(0,1fr)}
  .paper-single-attempt-notice .btn{grid-column:1/-1;width:100%}
  .home-active-label-row{align-items:flex-start;flex-direction:column}
}
@media(prefers-reduced-motion:reduce){
  .home-category-hero,
  .home-category-hero *{transition-duration:.01ms!important}
}

/* ===== v3.5.8 — Exam rules confirmation modal ===== */
body.exam-rules-open{overflow:hidden}
.exam-start-rules-modal{z-index:80;background:rgba(1,18,33,.78);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);padding:18px}
.exam-start-rules-card{width:min(760px,100%);max-width:760px;max-height:calc(100dvh - 36px);overflow:auto;border-radius:28px;padding:0;border:1px solid rgba(169,214,229,.34);background:linear-gradient(155deg,rgba(255,255,255,.98),rgba(238,248,252,.97));box-shadow:0 34px 100px rgba(1,42,74,.38);transform:translateY(18px) scale(.985);opacity:0;transition:transform .22s ease,opacity .22s ease}
.exam-start-rules-card.is-visible{transform:translateY(0) scale(1);opacity:1}
[data-theme="dark"] .exam-start-rules-card{background:linear-gradient(155deg,rgba(1,42,74,.99),rgba(1,58,99,.98));border-color:rgba(137,194,217,.28)}
.exam-rules-hero{display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px;align-items:center;padding:25px 26px 20px;background:linear-gradient(135deg,#012A4A,#014F86);color:#fff;border-radius:27px 27px 0 0}
.exam-rules-icon{display:grid;place-items:center;width:62px;height:62px;border-radius:19px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.2);font-size:1.6rem;font-weight:950}
.exam-rules-hero .eyebrow{margin:0 0 5px;color:#A9D6E5}.exam-rules-hero h2{margin:0;color:#fff;font-size:clamp(1.35rem,3vw,2rem)}.exam-rules-hero p{margin:.45rem 0 0;color:#d9edf7;line-height:1.65}
.exam-rules-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:18px 26px 0}
.exam-rules-summary div{padding:12px 13px;border:1px solid rgba(70,143,175,.2);border-radius:16px;background:rgba(169,214,229,.13)}
.exam-rules-summary span{display:block;color:var(--muted);font-size:.73rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em}.exam-rules-summary strong{display:block;margin-top:3px;color:var(--text);font-size:1rem;overflow-wrap:anywhere}
.exam-rules-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:18px 26px}
.exam-rule-card{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;padding:15px;border-radius:18px;background:rgba(255,255,255,.7);border:1px solid rgba(70,143,175,.18)}
[data-theme="dark"] .exam-rule-card{background:rgba(1,42,74,.7)}
.exam-rule-card>span{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,#01497C,#2C7DA0);color:#fff;font-weight:950}
.exam-rule-card h3{margin:0 0 5px;font-size:1rem;color:var(--text)}.exam-rule-card p{margin:0;color:var(--muted);line-height:1.65;font-size:.9rem}
.exam-rules-recording{margin:0 26px 18px;padding:15px 16px;border-radius:18px;background:rgba(245,158,11,.09);border:1px solid rgba(245,158,11,.24);border-left:5px solid #f59e0b}
.exam-rules-recording strong{display:block;margin-bottom:4px;color:var(--text)}.exam-rules-recording p{margin:0;color:var(--muted);line-height:1.65;font-size:.91rem}
.exam-rules-actions{display:flex;justify-content:flex-end;gap:11px;padding:18px 26px 25px;border-top:1px solid rgba(70,143,175,.16)}
.exam-rules-actions .btn{min-width:132px}.exam-rules-actions .btn.primary{background:linear-gradient(135deg,#01497C,#2C7DA0)}
@media(max-width:700px){.exam-rules-summary{grid-template-columns:repeat(2,minmax(0,1fr));padding-inline:16px}.exam-rules-grid{grid-template-columns:1fr;padding-inline:16px}.exam-rules-hero{padding:20px 17px 17px}.exam-rules-recording{margin-inline:16px}.exam-rules-actions{padding:15px 16px 19px;position:sticky;bottom:0;background:inherit}.exam-rules-actions .btn{flex:1;min-width:0}}
@media(prefers-reduced-motion:reduce){.exam-start-rules-card{transition:none}}

/* ===== v3.5.9 — Exam rules modal viewport and stacking fix ===== */
.exam-start-rules-modal{
  z-index:5000!important;
  align-items:center;
  justify-content:center;
  padding:14px;
  overflow:hidden;
  overscroll-behavior:contain;
}
.exam-start-rules-card{
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  width:min(760px,100%);
  max-width:760px;
  height:auto;
  max-height:min(860px,calc(100dvh - 28px));
  overflow:hidden;
  border-radius:26px;
}
.exam-rules-hero{
  position:relative;
  z-index:2;
  padding:18px 22px 16px;
  gap:13px;
  border-radius:25px 25px 0 0;
}
.exam-rules-icon{
  width:54px;
  height:54px;
  border-radius:17px;
  font-size:1.4rem;
}
.exam-rules-hero .eyebrow{margin-bottom:3px;font-size:.7rem}
.exam-rules-hero h2{font-size:clamp(1.25rem,2.4vw,1.65rem)}
.exam-rules-hero p{margin-top:.3rem;font-size:.88rem;line-height:1.5}
.exam-rules-scroll{
  min-height:0;
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  scrollbar-width:thin;
  scrollbar-color:#61A5C2 transparent;
}
.exam-rules-scroll::-webkit-scrollbar{width:9px}
.exam-rules-scroll::-webkit-scrollbar-track{background:transparent}
.exam-rules-scroll::-webkit-scrollbar-thumb{background:#61A5C2;border-radius:999px;border:2px solid transparent;background-clip:padding-box}
.exam-rules-summary{gap:9px;padding:14px 22px 0}
.exam-rules-summary div{padding:10px 12px;border-radius:14px}
.exam-rules-summary span{font-size:.68rem}
.exam-rules-summary strong{font-size:.92rem}
.exam-rules-grid{gap:10px;padding:14px 22px}
.exam-rule-card{gap:10px;padding:12px 13px;border-radius:16px}
.exam-rule-card>span{width:36px;height:36px;border-radius:11px;font-size:.9rem}
.exam-rule-card h3{margin-bottom:3px;font-size:.92rem}
.exam-rule-card p{font-size:.82rem;line-height:1.52}
.exam-rules-recording{margin:0 22px 14px;padding:12px 14px;border-radius:16px}
.exam-rules-recording strong{margin-bottom:3px;font-size:.9rem}
.exam-rules-recording p{font-size:.82rem;line-height:1.5}
.exam-rules-actions{
  position:relative;
  z-index:2;
  margin:0;
  padding:13px 22px 16px;
  background:linear-gradient(155deg,rgba(255,255,255,.99),rgba(238,248,252,.99));
  box-shadow:0 -12px 28px rgba(1,42,74,.07);
}
[data-theme="dark"] .exam-rules-actions{
  background:linear-gradient(155deg,rgba(1,42,74,.995),rgba(1,58,99,.995));
  box-shadow:0 -12px 28px rgba(0,0,0,.17);
}
.exam-rules-actions .btn{min-height:42px;min-width:120px}
@media(max-height:760px) and (min-width:701px){
  .exam-start-rules-modal{padding:9px}
  .exam-start-rules-card{max-height:calc(100dvh - 18px)}
  .exam-rules-hero{padding:13px 18px 11px}
  .exam-rules-icon{width:46px;height:46px;font-size:1.2rem}
  .exam-rules-hero p{font-size:.8rem;line-height:1.4}
  .exam-rules-summary{padding:10px 18px 0}
  .exam-rules-grid{padding:10px 18px;gap:8px}
  .exam-rule-card{padding:9px 11px}
  .exam-rule-card p{font-size:.76rem;line-height:1.42}
  .exam-rules-recording{margin:0 18px 10px;padding:10px 12px}
  .exam-rules-actions{padding:10px 18px 12px}
}
@media(max-width:700px){
  .exam-start-rules-modal{padding:8px}
  .exam-start-rules-card{max-height:calc(100dvh - 16px);border-radius:22px}
  .exam-rules-hero{padding:15px 14px 13px;gap:11px;border-radius:21px 21px 0 0}
  .exam-rules-icon{width:46px;height:46px;border-radius:14px;font-size:1.15rem}
  .exam-rules-hero h2{font-size:1.2rem}
  .exam-rules-hero p{font-size:.79rem;line-height:1.42}
  .exam-rules-summary{grid-template-columns:repeat(2,minmax(0,1fr));padding:11px 12px 0}
  .exam-rules-grid{grid-template-columns:1fr;padding:11px 12px}
  .exam-rules-recording{margin:0 12px 11px}
  .exam-rules-actions{position:relative;padding:11px 12px 13px}
}

/* ===== v3.6.0 — Translator History ===== */
.translation-history-main{display:grid;gap:1.15rem}
.translation-history-head p{max-width:760px;color:var(--muted);line-height:1.7;margin:.45rem 0 0}
.translation-history-metrics,.translation-report-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.9rem}
.translation-history-metrics article,.translation-report-metrics>div{padding:1rem 1.05rem;border:1px solid var(--border);border-radius:20px;background:linear-gradient(145deg,rgba(255,255,255,.86),rgba(220,238,246,.56));box-shadow:var(--shadow)}
[data-theme="dark"] .translation-history-metrics article,[data-theme="dark"] .translation-report-metrics>div{background:linear-gradient(145deg,rgba(1,42,74,.9),rgba(1,58,99,.68))}
.translation-history-metrics span,.translation-report-metrics span{display:block;font-size:.78rem;font-weight:850;color:var(--muted);letter-spacing:.03em}
.translation-history-metrics strong,.translation-report-metrics strong{display:block;margin:.35rem 0 .15rem;font-size:1.65rem;color:#01497C}
[data-theme="dark"] .translation-history-metrics strong,[data-theme="dark"] .translation-report-metrics strong{color:#A9D6E5}
.translation-history-metrics small{color:var(--muted)}
.translation-history-category-card,.translation-filter-card,.translation-history-records,.translation-report-card{overflow:hidden}
.translation-category-grid,.translation-report-category-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
.translation-category-stat,.translation-report-category-grid article{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.75rem;padding:.9rem;border:1px solid var(--border);border-radius:18px;background:rgba(137,194,217,.07);color:inherit;text-decoration:none;transition:transform .2s ease,border-color .2s ease,background .2s ease}
.translation-category-stat:hover,.translation-category-stat.active{transform:translateY(-2px);border-color:#61A5C2;background:rgba(137,194,217,.15)}
.translation-category-mark,.translation-report-category-grid article>span{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:linear-gradient(135deg,#01497C,#2C7DA0);color:#fff;font-weight:950}
.translation-category-stat div,.translation-report-category-grid article div{min-width:0}.translation-category-stat strong,.translation-report-category-grid article strong{display:block}.translation-category-stat small,.translation-report-category-grid article small{display:block;color:var(--muted);margin-top:.2rem}.translation-category-stat>b,.translation-report-category-grid article>b{font-size:1.1rem;color:#2C7DA0}
.translation-history-filters{display:grid;grid-template-columns:1.1fr 1fr .65fr .8fr 1.5fr auto;gap:.75rem;align-items:end}
.translation-history-filters label{display:grid;gap:.4rem;font-size:.78rem;font-weight:850;color:var(--muted)}
.translation-history-filters input,.translation-history-filters select{width:100%;min-height:45px;border:1px solid var(--border);border-radius:13px;background:var(--surface);color:var(--text);padding:.68rem .75rem;font:inherit}
.translation-history-filters .actions{display:flex;gap:.5rem;flex-wrap:nowrap}
.history-page-count{padding:.45rem .7rem;border:1px solid var(--border);border-radius:999px;color:var(--muted);font-size:.78rem;font-weight:800}
.translation-history-list{display:grid;gap:.8rem}
.translation-history-item{border:1px solid var(--border);border-radius:20px;overflow:hidden;background:rgba(137,194,217,.04)}
.translation-history-meta{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;padding:.7rem .85rem;border-bottom:1px solid var(--border);background:rgba(44,125,160,.07);font-size:.8rem}
.translation-history-meta time{margin-left:auto;color:var(--muted)}
.translation-target{padding:.3rem .58rem;border-radius:999px;font-weight:900;border:1px solid rgba(44,125,160,.22);background:rgba(44,125,160,.1)}
.translation-target.si{background:rgba(22,163,74,.1);border-color:rgba(22,163,74,.22)}
.translation-history-text-grid{display:grid;grid-template-columns:1fr 1fr;gap:0}
.translation-history-text-grid>div{padding:1rem}.translation-history-text-grid>div+div{border-left:1px solid var(--border)}
.translation-history-text-grid small{display:block;color:var(--muted);font-size:.73rem;font-weight:900;letter-spacing:.05em;text-transform:uppercase;margin-bottom:.45rem}
.translation-history-text-grid p{margin:0;line-height:1.75;overflow-wrap:anywhere}
.translation-history-text-grid p[lang="ja"]{font-size:1.08rem;font-weight:750}
.translation-history-empty{text-align:center;padding:2.4rem 1rem}.translation-history-empty>span{display:grid;place-items:center;width:72px;height:72px;margin:0 auto .8rem;border-radius:22px;background:linear-gradient(135deg,#01497C,#2C7DA0);color:#fff;font-size:1.7rem;font-weight:950}.translation-history-empty h3{margin:.2rem 0}.translation-history-empty p{color:var(--muted);margin:.4rem auto 0;max-width:560px;line-height:1.7}
.translation-history-pagination{display:flex;justify-content:center;align-items:center;gap:.75rem;margin-top:1rem;flex-wrap:wrap}.translation-history-pagination span{color:var(--muted);font-weight:850}
.translation-history-upgrade{display:grid;gap:.75rem;justify-items:start}
.translation-report-card{margin-top:1rem}.translation-report-category-grid{margin-top:1rem}.translation-report-top-terms{margin-top:1rem;padding:1rem;border:1px solid var(--border);border-radius:18px;background:rgba(137,194,217,.06)}.translation-report-top-terms h3{margin:0 0 .7rem}.translation-report-top-terms>div{display:flex;flex-wrap:wrap;gap:.5rem}.translation-report-top-terms span{display:inline-flex;align-items:center;gap:.45rem;padding:.45rem .65rem;border:1px solid var(--border);border-radius:999px;background:var(--surface);font-weight:750}.translation-report-top-terms b{font-size:.72rem;color:#2C7DA0}
.translation-report-table-wrap{overflow-x:auto;margin-top:1rem}.translation-report-table td:nth-child(6),.translation-report-table td:nth-child(8){min-width:150px;max-width:260px;white-space:normal;line-height:1.55}
@media(max-width:1050px){.translation-history-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.translation-history-filters .translation-search-field{grid-column:1/-1}.translation-history-filters .actions{grid-column:1/-1}}
@media(max-width:760px){.translation-history-metrics,.translation-report-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.translation-category-grid,.translation-report-category-grid{grid-template-columns:1fr}.translation-history-text-grid{grid-template-columns:1fr}.translation-history-text-grid>div+div{border-left:0;border-top:1px solid var(--border)}.translation-history-meta time{width:100%;margin-left:0}.translation-history-filters{grid-template-columns:1fr}.translation-history-filters .translation-search-field,.translation-history-filters .actions{grid-column:auto}.translation-history-filters .actions{flex-wrap:wrap}}
@media(max-width:430px){.translation-history-metrics,.translation-report-metrics{grid-template-columns:1fr}.translation-category-stat,.translation-report-category-grid article{grid-template-columns:auto minmax(0,1fr)}.translation-category-stat>b,.translation-report-category-grid article>b{grid-column:2}}
@media print{.translation-report-card .btn{display:none!important}.translation-report-table{font-size:8.5pt}.translation-report-table th,.translation-report-table td{padding:5px}.translation-report-metrics{grid-template-columns:repeat(4,1fr)}.translation-report-category-grid{grid-template-columns:repeat(2,1fr)}}

/* ===== v3.6.3 — paper-type layer and daily attempt limit ===== */
.paper-type-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin:1.2rem 0 .85rem}.paper-type-section-head h2{margin:.2rem 0 .35rem}.paper-type-section-head p{margin:0;color:var(--muted);max-width:760px;line-height:1.7}
.exam-paper-type-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-bottom:1.4rem}
.exam-paper-type-card{position:relative;display:flex;flex-direction:column;gap:1rem;min-height:330px;padding:1.25rem;border:1px solid var(--border);border-radius:28px;background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(232,246,252,.88));box-shadow:var(--shadow);overflow:hidden}
[data-theme="dark"] .exam-paper-type-card{background:linear-gradient(145deg,rgba(1,42,74,.95),rgba(1,58,99,.86));border-color:rgba(137,194,217,.22)}
.exam-paper-type-card::after{content:"";position:absolute;right:-70px;top:-70px;width:190px;height:190px;border-radius:50%;background:radial-gradient(circle,rgba(44,125,160,.22),transparent 68%);pointer-events:none}
.exam-paper-type-card.is-future{border-style:dashed;opacity:.86}.exam-paper-type-card.is-future::after{background:radial-gradient(circle,rgba(148,163,184,.2),transparent 68%)}
.exam-paper-type-top{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.exam-paper-type-mark{display:grid;place-items:center;min-width:72px;height:58px;padding:0 .85rem;border-radius:18px;background:linear-gradient(135deg,#01497C,#2C7DA0);color:#fff;font-size:1rem;font-weight:950;letter-spacing:.06em;box-shadow:0 12px 28px rgba(1,73,124,.22)}
.exam-paper-type-mark.future{min-width:58px;background:linear-gradient(135deg,#64748b,#94a3b8);font-size:1.6rem}
.exam-paper-type-copy{position:relative;z-index:1}.exam-paper-type-copy h2{margin:.25rem 0 .45rem;font-size:1.45rem}.exam-paper-type-copy p{margin:0;color:var(--muted);line-height:1.72}
.exam-paper-type-stats{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem}
.exam-paper-type-stats>div{padding:.8rem;border-radius:17px;background:rgba(255,255,255,.7);border:1px solid rgba(137,194,217,.42)}
[data-theme="dark"] .exam-paper-type-stats>div{background:rgba(1,42,74,.62);border-color:rgba(137,194,217,.2)}
.exam-paper-type-stats strong{display:block;font-size:1.15rem;color:#01497C}.exam-paper-type-stats span{display:block;margin-top:.18rem;font-size:.76rem;color:var(--muted);line-height:1.35}
[data-theme="dark"] .exam-paper-type-stats strong{color:#A9D6E5}
.exam-paper-type-card>.btn{position:relative;z-index:1;margin-top:auto}
.paper-daily-attempt-status{display:flex;align-items:center;justify-content:space-between;gap:.7rem;padding:.62rem .75rem;border-radius:14px;background:rgba(44,125,160,.08);border:1px solid rgba(44,125,160,.18);font-size:.82rem}
.paper-daily-attempt-status span{color:var(--muted);font-weight:800}.paper-daily-attempt-status strong{color:#01497C;font-size:.95rem}
[data-theme="dark"] .paper-daily-attempt-status strong{color:#A9D6E5}
.paper-daily-attempt-status.is-limit{background:rgba(220,38,38,.08);border-color:rgba(220,38,38,.2)}.paper-daily-attempt-status.is-limit strong{color:#b91c1c}
[data-theme="dark"] .paper-daily-attempt-status.is-limit strong{color:#fca5a5}
.paper-card.daily-limit-reached{border-color:rgba(220,38,38,.25)}
.paper-daily-reset-note{display:block;text-align:center;color:var(--muted);font-size:.73rem;line-height:1.45;margin-top:-.25rem}
.paper-card .btn[disabled]{cursor:not-allowed;opacity:.68;filter:saturate(.55)}
@media(max-width:850px){.exam-paper-type-grid{grid-template-columns:1fr}}
@media(max-width:560px){.exam-paper-type-card{min-height:auto;padding:1rem;border-radius:22px}.exam-paper-type-stats{grid-template-columns:1fr}.exam-paper-type-stats>div{display:flex;align-items:center;justify-content:space-between;gap:1rem}.exam-paper-type-stats span{margin:0;text-align:right}}

/* ===== v3.6.4 — cleaner paper-card attempt layout ===== */
.paper-card-metrics{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.5rem;
  margin:0 0 .75rem;
  padding-top:.7rem;
  border-top:1px solid var(--border);
}
.paper-card-metrics>div{
  min-width:0;
  padding:.6rem .55rem;
  border:1px solid rgba(44,125,160,.16);
  border-radius:13px;
  background:rgba(44,125,160,.06);
  text-align:center;
}
.paper-card-metrics span{
  display:block;
  color:var(--muted);
  font-size:.69rem;
  font-weight:800;
  line-height:1.25;
  white-space:normal;
}
.paper-card-metrics strong{
  display:block;
  margin-top:.2rem;
  color:#01497C;
  font-size:.92rem;
  line-height:1.2;
}
[data-theme="dark"] .paper-card-metrics strong{color:#A9D6E5}
.paper-card-metrics .paper-today-metric.is-limit{
  background:rgba(220,38,38,.08);
  border-color:rgba(220,38,38,.2);
}
.paper-card-metrics .paper-today-metric.is-limit strong{color:#b91c1c}
[data-theme="dark"] .paper-card-metrics .paper-today-metric.is-limit strong{color:#fca5a5}
.paper-limit-action{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.65rem;
  min-height:42px;
  padding:.64rem .78rem;
  border:1px solid rgba(220,38,38,.22);
  border-radius:12px;
  background:rgba(220,38,38,.07);
  color:var(--text);
}
.paper-limit-action strong{
  font-size:.82rem;
  line-height:1.25;
}
.paper-limit-action small{
  color:var(--muted);
  font-size:.68rem;
  line-height:1.25;
  text-align:right;
}
.paper-card.daily-limit-reached .paper-card-progress{margin-bottom:.7rem}
.paper-card.daily-limit-reached .paper-feedback-link{margin-bottom:.7rem}
@media(max-width:420px){
  .paper-card-metrics{gap:.38rem}
  .paper-card-metrics>div{padding:.55rem .35rem}
  .paper-limit-action{align-items:flex-start;flex-direction:column;gap:.15rem}
  .paper-limit-action small{text-align:left}
}

/* ===== v3.7.0 — Admin Content Studio ===== */
.admin-content-main{display:grid;gap:1.15rem}
.admin-content-head p,.admin-content-main .dashboard-head p{max-width:820px;margin:.45rem 0 0;color:var(--muted);line-height:1.72}
.admin-content-stats{grid-template-columns:repeat(7,minmax(0,1fr))}
.admin-content-stats .stat-card{min-width:0;padding:1rem .75rem;text-align:center}
.admin-content-stats .stat-card strong{font-size:1.55rem;color:#01497C}
[data-theme="dark"] .admin-content-stats .stat-card strong{color:#A9D6E5}
.admin-content-stats .stat-card span{display:block;margin-top:.25rem;color:var(--muted);font-size:.75rem;font-weight:800;line-height:1.3}
.admin-content-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.admin-content-card{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:1rem;min-height:185px;padding:1.25rem;border:1px solid var(--border);border-radius:26px;background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(220,238,246,.64));box-shadow:var(--shadow);color:inherit;text-decoration:none;overflow:hidden;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
[data-theme="dark"] .admin-content-card{background:linear-gradient(145deg,rgba(1,42,74,.94),rgba(1,58,99,.78))}
.admin-content-card::after{content:"";position:absolute;right:-60px;top:-75px;width:190px;height:190px;border-radius:50%;background:radial-gradient(circle,rgba(44,125,160,.2),transparent 68%);pointer-events:none}
.admin-content-card:hover{transform:translateY(-3px);border-color:#61A5C2;box-shadow:0 18px 40px rgba(1,42,74,.14)}
.admin-content-icon{position:relative;z-index:1;display:grid;place-items:center;width:62px;height:62px;border-radius:19px;background:linear-gradient(135deg,#01497C,#2C7DA0);color:#fff;font-size:1.45rem;font-weight:950;box-shadow:0 13px 28px rgba(1,73,124,.22)}
.admin-content-card>div{position:relative;z-index:1;min-width:0}.admin-content-card small{display:block;color:#2C7DA0;font-size:.68rem;font-weight:950;letter-spacing:.08em}.admin-content-card h2{margin:.25rem 0 .4rem}.admin-content-card p{margin:0;color:var(--muted);line-height:1.65}.admin-content-card>b{position:relative;z-index:1;color:#01497C;white-space:nowrap}
[data-theme="dark"] .admin-content-card small,[data-theme="dark"] .admin-content-card>b{color:#A9D6E5}
.admin-content-bottom-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.content-health-list,.content-backup-list{display:grid;gap:.65rem}
.content-health-item{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:.7rem;padding:.75rem .85rem;border:1px solid var(--border);border-radius:15px;background:rgba(137,194,217,.06)}
.content-health-item>span{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;font-weight:950}.content-health-item.is-ok>span{background:rgba(22,163,74,.12);color:#15803d}.content-health-item.is-error>span{background:rgba(220,38,38,.12);color:#b91c1c}.content-health-item strong,.content-backup-list strong{display:block;overflow-wrap:anywhere}.content-health-item small,.content-backup-list small{display:block;margin-top:.15rem;color:var(--muted)}
.content-backup-list>div{padding:.75rem .85rem;border:1px solid var(--border);border-radius:15px;background:rgba(137,194,217,.05)}
.admin-editor-layout{display:grid;grid-template-columns:minmax(250px,330px) minmax(0,1fr);gap:1rem;align-items:start}
.admin-editor-layout.papers-editor-layout{grid-template-columns:minmax(260px,350px) minmax(0,1fr)}
.admin-editor-layout.learn-editor-layout{grid-template-columns:minmax(260px,350px) minmax(0,1fr)}
.admin-list-card,.admin-form-card,.admin-section-card,.admin-context-picker{overflow:hidden}
.admin-list-card{position:sticky;top:92px;max-height:calc(100vh - 115px);overflow-y:auto;scrollbar-width:thin}
.admin-item-list,.admin-paper-list,.admin-question-list{display:grid;gap:.55rem}
.admin-item-row,.admin-paper-row,.admin-question-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.7rem;padding:.72rem;border:1px solid var(--border);border-radius:15px;background:rgba(137,194,217,.045);color:inherit;text-decoration:none;transition:.18s ease}
.admin-item-row:hover,.admin-item-row.active,.admin-paper-row:hover,.admin-paper-row.active,.admin-question-row:hover,.admin-question-row.active{border-color:#61A5C2;background:rgba(137,194,217,.13);transform:translateX(2px)}
.admin-item-mark,.admin-paper-row>span,.admin-question-row>span{display:grid;place-items:center;min-width:42px;height:42px;padding:0 .45rem;border-radius:12px;background:linear-gradient(135deg,#01497C,#2C7DA0);color:#fff;font-size:.78rem;font-weight:950}
.admin-item-row div,.admin-paper-row div,.admin-question-row div{min-width:0}.admin-item-row strong,.admin-paper-row strong,.admin-question-row strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.admin-item-row small,.admin-paper-row small,.admin-question-row small{display:block;margin-top:.18rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.admin-item-row>b{color:#2C7DA0;font-size:1.2rem}
.admin-content-form{display:grid;gap:.95rem}.admin-content-form>label,.admin-form-grid label,.admin-asset-grid label{display:grid;gap:.42rem;min-width:0}.admin-content-form label>span,.admin-form-grid label>span,.admin-asset-grid label>span{color:var(--muted);font-size:.76rem;font-weight:900;letter-spacing:.02em}.admin-content-form input,.admin-content-form select,.admin-content-form textarea,.compact-target-input{width:100%;border:1px solid var(--border);border-radius:13px;background:var(--surface);color:var(--text);padding:.72rem .78rem;font:inherit;line-height:1.5;transition:border-color .18s ease,box-shadow .18s ease}.admin-content-form input:focus,.admin-content-form select:focus,.admin-content-form textarea:focus,.compact-target-input:focus{outline:none;border-color:#2C7DA0;box-shadow:0 0 0 4px rgba(44,125,160,.12)}.admin-content-form input[readonly]{opacity:.78;background:rgba(148,163,184,.08)}.admin-content-form textarea{resize:vertical;min-height:86px}.admin-content-form small{color:var(--muted);line-height:1.5}.code-input{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace!important;font-size:.82rem!important;tab-size:2;white-space:pre;overflow:auto}
.admin-form-grid{display:grid;gap:.8rem}.admin-form-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-form-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.admin-check{display:flex!important;align-items:center;gap:.55rem;padding:.7rem .8rem;border:1px solid var(--border);border-radius:13px;background:rgba(137,194,217,.06)}.admin-check input{width:18px!important;height:18px;accent-color:#01497C}.admin-check span{color:var(--text)!important;font-size:.82rem!important}
.admin-advanced,.admin-language-tabs details{border:1px solid var(--border);border-radius:16px;background:rgba(137,194,217,.045);overflow:hidden}.admin-advanced>summary,.admin-language-tabs summary{cursor:pointer;padding:.78rem .9rem;font-weight:900;color:#01497C}.admin-advanced[open]>summary,.admin-language-tabs details[open]>summary{border-bottom:1px solid var(--border);background:rgba(44,125,160,.07)}[data-theme="dark"] .admin-advanced>summary,[data-theme="dark"] .admin-language-tabs summary{color:#A9D6E5}.admin-advanced>*:not(summary),.admin-language-tabs details>*:not(summary){margin:.85rem}
.admin-language-tabs{display:grid;gap:.7rem}
.admin-danger-form{display:flex;justify-content:flex-end;margin-top:.85rem;padding-top:.85rem;border-top:1px dashed rgba(220,38,38,.3)}
.admin-context-picker .admin-picker-grid{display:grid;grid-template-columns:minmax(240px,1.4fr) repeat(3,minmax(120px,.6fr));gap:.8rem;align-items:end}.admin-picker-grid label{display:grid;gap:.4rem}.admin-picker-grid label>span,.admin-picker-grid>div>span{display:block;color:var(--muted);font-size:.74rem;font-weight:900}.admin-picker-grid select{width:100%;border:1px solid var(--border);border-radius:13px;background:var(--surface);color:var(--text);padding:.72rem}.admin-picker-grid>div{padding:.72rem .85rem;border:1px solid var(--border);border-radius:14px;background:rgba(137,194,217,.06)}.admin-picker-grid>div strong{display:block;margin-top:.2rem;color:#01497C;font-size:1.2rem}[data-theme="dark"] .admin-picker-grid>div strong{color:#A9D6E5}
.admin-section-card{margin-top:.15rem}.admin-section-card>.card-heading p{margin:.35rem 0 0;color:var(--muted);line-height:1.6}
.admin-type-grid,.admin-topic-grid,.admin-lesson-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem}
.admin-type-card,.admin-topic-card,.admin-lesson-card{display:grid;gap:.4rem;padding:.85rem;border:1px solid var(--border);border-radius:16px;background:rgba(137,194,217,.05);color:inherit;text-decoration:none;transition:.18s ease}.admin-type-card:hover,.admin-type-card.active,.admin-topic-card:hover,.admin-topic-card.active,.admin-lesson-card:hover,.admin-lesson-card.active{transform:translateY(-2px);border-color:#61A5C2;background:rgba(137,194,217,.13)}.admin-type-card strong,.admin-topic-card strong,.admin-lesson-card strong{overflow-wrap:anywhere}.admin-type-card small,.admin-topic-card small,.admin-lesson-card small{color:var(--muted);line-height:1.5}
.admin-lesson-card{grid-template-columns:auto minmax(0,1fr);align-items:center}.admin-lesson-card>span{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,#01497C,#2C7DA0);color:#fff;font-weight:950}.admin-lesson-card div{min-width:0}.admin-lesson-card strong,.admin-lesson-card small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.admin-type-form,.admin-topic-form{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--border)}
.admin-asset-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.admin-asset-grid label{padding:.8rem;border:1px solid var(--border);border-radius:15px;background:rgba(137,194,217,.04)}.admin-asset-grid input[type="file"]{padding:.5rem;background:rgba(137,194,217,.06)}
.admin-json-tools{display:grid;grid-template-columns:1fr 1.5fr;gap:1rem;margin-top:1rem}.admin-json-tools form{align-content:start}
.admin-content-main .data-table code{white-space:normal;overflow-wrap:anywhere}.moderation-actions .compact-target-input{min-width:260px;padding:.55rem .65rem}.admin-content-main .table-wrap{overflow-x:auto}
.admin-content-main .btn.danger{background:linear-gradient(135deg,#b91c1c,#dc2626);color:#fff;border-color:transparent}.admin-content-main .btn.danger:hover{filter:brightness(1.04)}
.admin-content-main .actions{display:flex;flex-wrap:wrap;gap:.65rem;align-items:center}
@media(max-width:1220px){.admin-content-stats{grid-template-columns:repeat(4,minmax(0,1fr))}.admin-type-grid,.admin-topic-grid,.admin-lesson-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:980px){.admin-content-grid,.admin-content-bottom-grid{grid-template-columns:1fr}.admin-editor-layout,.admin-editor-layout.papers-editor-layout,.admin-editor-layout.learn-editor-layout{grid-template-columns:1fr}.admin-list-card{position:relative;top:auto;max-height:none}.admin-form-grid.three{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-context-picker .admin-picker-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-json-tools{grid-template-columns:1fr}}
@media(max-width:680px){.admin-content-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-content-card{grid-template-columns:auto minmax(0,1fr);min-height:auto;padding:1rem;border-radius:21px}.admin-content-card>b{grid-column:2}.admin-content-icon{width:52px;height:52px;border-radius:16px;font-size:1.2rem}.admin-form-grid.two,.admin-form-grid.three,.admin-asset-grid,.admin-type-grid,.admin-topic-grid,.admin-lesson-grid,.admin-context-picker .admin-picker-grid{grid-template-columns:1fr}.admin-item-row strong,.admin-paper-row strong,.admin-question-row strong{white-space:normal}.admin-content-main .dashboard-head{align-items:flex-start}.moderation-actions .compact-target-input{min-width:200px}.admin-danger-form{justify-content:stretch}.admin-danger-form .btn{width:100%}}

/* ===== v3.7.1 — Content Studio layout polish ===== */
.admin-content-main{
  gap:1.45rem;
  padding-bottom:1.5rem;
}
.admin-content-main>.dashboard-head{
  margin-bottom:0;
  padding:1.25rem 1.35rem;
  border:1px solid var(--border);
  border-radius:24px;
  background:linear-gradient(135deg,color-mix(in srgb,var(--minimal-surface) 96%,#61A5C2 4%),color-mix(in srgb,var(--minimal-surface) 98%,#A9D6E5 2%));
  box-shadow:var(--minimal-shadow);
}
.admin-content-main>.dashboard-head h1{
  margin:.12rem 0 .35rem;
  font-size:clamp(1.65rem,3vw,2.35rem);
}
.admin-content-main>.dashboard-head .actions{
  justify-content:flex-end;
}

.admin-studio-nav{
  position:sticky;
  top:76px;
  z-index:18;
  padding:.42rem;
  border:1px solid color-mix(in srgb,var(--border) 86%,transparent);
  border-radius:19px;
  background:color-mix(in srgb,var(--minimal-surface) 91%,transparent);
  box-shadow:0 12px 26px rgba(1,42,74,.08);
  backdrop-filter:blur(18px) saturate(130%);
  -webkit-backdrop-filter:blur(18px) saturate(130%);
}
.admin-studio-nav-scroll{
  display:grid;
  grid-template-columns:repeat(6,minmax(105px,1fr));
  gap:.38rem;
}
.admin-studio-nav a{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.52rem;
  min-height:46px;
  padding:.62rem .72rem;
  border:1px solid transparent;
  border-radius:14px;
  color:var(--muted);
  text-decoration:none;
  white-space:nowrap;
  transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease;
}
.admin-studio-nav a span{
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  border-radius:9px;
  background:rgba(137,194,217,.11);
  color:#01497C;
  font-weight:950;
}
.admin-studio-nav a strong{font-size:.8rem;letter-spacing:.01em}
.admin-studio-nav a:hover{
  color:#01497C;
  border-color:rgba(97,165,194,.38);
  background:rgba(137,194,217,.09);
  transform:translateY(-1px);
}
.admin-studio-nav a.active{
  color:#fff;
  border-color:transparent;
  background:linear-gradient(135deg,#01497C,#2C7DA0);
  box-shadow:0 8px 18px rgba(1,73,124,.2);
}
.admin-studio-nav a.active span{background:rgba(255,255,255,.16);color:#fff}
[data-theme="dark"] .admin-studio-nav a span{color:#A9D6E5}
[data-theme="dark"] .admin-studio-nav a:hover{color:#A9D6E5}

.admin-content-stats{
  grid-template-columns:repeat(auto-fit,minmax(135px,1fr));
  gap:.8rem;
  margin-top:0;
}
.admin-content-stats .stat-card{
  min-height:102px;
  display:grid;
  place-content:center;
  gap:.12rem;
  padding:1rem;
  border-radius:18px!important;
}
.admin-content-stats .stat-card strong{font-size:1.68rem}
.admin-content-stats .stat-card span{font-size:.78rem}

.admin-content-grid{gap:1.1rem}
.admin-content-card{
  min-height:158px;
  padding:1.15rem 1.2rem;
  border-radius:22px;
}
.admin-content-card p{
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  line-height:1.55;
}
.admin-content-card h2{font-size:1.25rem}
.admin-content-icon{width:56px;height:56px;border-radius:17px}
.admin-content-bottom-grid{align-items:start;gap:1.1rem}
.admin-content-bottom-grid>.card{min-width:0}
.content-health-list,.content-backup-list{
  max-height:430px;
  overflow:auto;
  padding-right:.22rem;
  scrollbar-width:thin;
}

.admin-context-picker,
.admin-list-card,
.admin-form-card,
.admin-section-card,
.admin-backup-table-card{
  border-radius:22px!important;
}
.admin-context-picker{padding:1rem 1.1rem}
.admin-context-picker .admin-picker-grid{gap:.75rem}
.admin-picker-grid>div,
.admin-picker-grid label{
  min-width:0;
}
.admin-picker-grid select{min-height:46px}

.admin-editor-layout,
.admin-editor-layout.papers-editor-layout,
.admin-editor-layout.learn-editor-layout{
  grid-template-columns:minmax(275px,325px) minmax(0,1fr);
  gap:1.25rem;
}
.admin-list-card{
  top:150px;
  max-height:calc(100vh - 175px);
  padding:1rem;
}
.admin-form-card,
.admin-section-card{padding:1.15rem}
.admin-form-card>.card-heading,
.admin-section-card>.card-heading,
.admin-list-card>.card-heading{
  padding-bottom:.8rem;
  margin-bottom:.9rem;
  border-bottom:1px solid color-mix(in srgb,var(--border) 78%,transparent);
}
.admin-list-card>.card-heading{align-items:center}
.admin-list-card>.card-heading h2,
.admin-form-card>.card-heading h2,
.admin-section-card>.card-heading h2{font-size:1.2rem}

.admin-list-search{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:.5rem;
  align-items:center;
  margin:0 0 .8rem;
  padding:.55rem;
  border:1px solid var(--border);
  border-radius:14px;
  background:rgba(137,194,217,.055);
}
.admin-list-search label{min-width:0}
.admin-list-search input{
  width:100%;
  min-height:39px;
  padding:.58rem .7rem;
  border:1px solid transparent;
  border-radius:10px;
  background:var(--surface);
  color:var(--text);
  font:inherit;
}
.admin-list-search input:focus{
  outline:none;
  border-color:#2C7DA0;
  box-shadow:0 0 0 3px rgba(44,125,160,.12);
}
.admin-list-search button{
  width:38px;
  height:38px;
  border:0;
  border-radius:10px;
  background:rgba(148,163,184,.14);
  color:var(--muted);
  cursor:pointer;
  font-size:1.15rem;
}
.admin-list-search button[hidden]{display:none}
.admin-list-search small{
  grid-column:1/-1;
  padding:0 .25rem;
  color:var(--muted);
  font-size:.7rem;
  font-weight:800;
}

.admin-item-list,.admin-paper-list,.admin-question-list{gap:.48rem}
.admin-item-row,.admin-paper-row,.admin-question-row{
  gap:.65rem;
  padding:.68rem;
  border-radius:13px;
  transform:none!important;
}
.admin-item-row:hover,.admin-item-row.active,
.admin-paper-row:hover,.admin-paper-row.active,
.admin-question-row:hover,.admin-question-row.active{
  transform:none!important;
  box-shadow:0 7px 16px rgba(1,42,74,.07);
}
.admin-item-row.active,.admin-paper-row.active,.admin-question-row.active{
  border-color:#2C7DA0;
  box-shadow:inset 3px 0 0 #2C7DA0,0 7px 16px rgba(1,42,74,.07);
}
.admin-item-mark,.admin-paper-row>span,.admin-question-row>span{
  min-width:39px;
  height:39px;
  border-radius:11px;
}

.admin-content-form{gap:1.15rem}
.admin-content-form>.admin-form-grid,
.admin-content-form>.admin-asset-grid,
.admin-type-form>.admin-form-grid,
.admin-topic-form>.admin-form-grid{
  padding:1rem;
  border:1px solid color-mix(in srgb,var(--border) 82%,transparent);
  border-radius:17px;
  background:rgba(137,194,217,.04);
}
.admin-form-grid{gap:.9rem}
.admin-form-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.admin-form-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.admin-content-form>label{
  padding:.95rem 1rem;
  border:1px solid color-mix(in srgb,var(--border) 82%,transparent);
  border-radius:16px;
  background:rgba(137,194,217,.035);
}
.admin-content-form details label{
  padding:0;
  border:0;
  background:none;
}
.admin-content-form label>span,.admin-form-grid label>span,.admin-asset-grid label>span{
  font-size:.75rem;
  line-height:1.35;
}
.admin-content-form input,
.admin-content-form select,
.admin-content-form textarea,
.compact-target-input{
  min-height:44px;
  border-radius:11px;
  padding:.68rem .75rem;
}
.admin-content-form textarea{min-height:100px}
.admin-content-form textarea.code-input{
  max-height:520px;
  min-height:180px;
  line-height:1.6;
}
.admin-check{
  min-height:44px;
  align-self:end;
  border-radius:11px;
}

.admin-advanced,
.admin-language-tabs details{
  border-radius:17px;
  background:rgba(137,194,217,.035);
}
.admin-advanced>summary,
.admin-language-tabs summary{
  position:relative;
  min-height:50px;
  display:flex;
  align-items:center;
  padding:.82rem 2.5rem .82rem 1rem;
  list-style:none;
}
.admin-advanced>summary::-webkit-details-marker,
.admin-language-tabs summary::-webkit-details-marker{display:none}
.admin-advanced>summary::after,
.admin-language-tabs summary::after{
  content:'+';
  position:absolute;
  right:1rem;
  top:50%;
  transform:translateY(-50%);
  width:25px;
  height:25px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:rgba(44,125,160,.1);
  font-size:1rem;
}
.admin-advanced[open]>summary::after,
.admin-language-tabs details[open]>summary::after{content:'−'}
.admin-advanced>*:not(summary),.admin-language-tabs details>*:not(summary){margin:1rem}
.admin-language-tabs{gap:.75rem}

.admin-form-actions{
  margin-top:.15rem;
  padding:.85rem;
  border:1px solid color-mix(in srgb,var(--border) 82%,transparent);
  border-radius:15px;
  background:color-mix(in srgb,var(--minimal-surface) 92%,#A9D6E5 8%);
}
.admin-form-actions .btn{min-height:42px}
.admin-danger-form{
  margin-top:1rem;
  padding:1rem 0 0;
}

.admin-section-card{
  scroll-margin-top:160px;
  margin-top:0;
}
.admin-section-card>.card-heading{
  align-items:center;
  flex-wrap:wrap;
}
.admin-section-card.is-collapsed>:not(.card-heading){display:none!important}
.admin-section-card.is-collapsed>.card-heading{margin-bottom:0;padding-bottom:0;border-bottom:0}
.admin-section-toggle,
.admin-list-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.38rem;
  min-height:36px;
  padding:.48rem .68rem;
  border:1px solid var(--border);
  border-radius:10px;
  background:rgba(137,194,217,.07);
  color:var(--muted);
  cursor:pointer;
  font:inherit;
  font-size:.74rem;
  font-weight:850;
}
.admin-section-toggle:hover,.admin-list-toggle:hover{
  border-color:#61A5C2;
  color:#01497C;
}
.admin-list-toggle{display:none}

.admin-type-grid,.admin-topic-grid,.admin-lesson-grid{
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:.75rem;
}
.admin-type-card,.admin-topic-card,.admin-lesson-card{
  min-height:82px;
  padding:.82rem;
  border-radius:14px;
}
.admin-lesson-card strong,.admin-lesson-card small{
  white-space:normal;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.admin-lesson-card strong{-webkit-line-clamp:2}
.admin-lesson-card small{-webkit-line-clamp:2}
.admin-type-form,.admin-topic-form{
  margin-top:1.15rem;
  padding-top:1.15rem;
}
.admin-asset-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.admin-asset-grid label{padding:.85rem;border-radius:14px}
.admin-json-tools{
  grid-template-columns:minmax(280px,.85fr) minmax(0,1.45fr);
  gap:1.15rem;
}
.admin-json-tools>*{
  min-width:0;
  padding:1rem;
  border:1px solid var(--border);
  border-radius:17px;
  background:rgba(137,194,217,.035);
}

.admin-backup-table-card{padding:1rem}
.admin-backup-table-card .data-table{min-width:920px}
.admin-backup-table-card .moderation-actions{
  display:grid;
  grid-template-columns:auto minmax(290px,1fr) auto;
  gap:.5rem;
  align-items:center;
}
.admin-backup-table-card .moderation-actions form{
  display:flex;
  gap:.45rem;
  align-items:center;
  min-width:0;
}
.admin-backup-table-card .compact-target-input{min-width:0;flex:1}

@media(max-width:1180px){
  .admin-editor-layout,
  .admin-editor-layout.papers-editor-layout,
  .admin-editor-layout.learn-editor-layout{grid-template-columns:1fr}
  .admin-list-card{
    position:relative;
    top:auto;
    max-height:none;
  }
  .admin-list-toggle{display:inline-flex}
  .admin-list-card.is-list-collapsed>:not(.card-heading){display:none!important}
  .admin-list-card.is-list-collapsed>.card-heading{margin-bottom:0;padding-bottom:0;border-bottom:0}
  .admin-form-grid.three{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:900px){
  .admin-studio-nav{top:70px;padding:.35rem;overflow:hidden}
  .admin-studio-nav-scroll{
    display:flex;
    gap:.38rem;
    overflow-x:auto;
    scrollbar-width:thin;
    padding-bottom:.08rem;
  }
  .admin-studio-nav a{flex:0 0 auto;min-width:112px}
  .admin-content-main>.dashboard-head{align-items:flex-start}
  .admin-content-main>.dashboard-head .actions{justify-content:flex-start}
  .admin-context-picker .admin-picker-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .admin-json-tools{grid-template-columns:1fr}
  .admin-backup-table-card .moderation-actions{grid-template-columns:1fr}
  .admin-backup-table-card .moderation-actions form{width:100%}
}

@media(max-width:680px){
  .admin-content-main{gap:1rem}
  .admin-content-main>.dashboard-head{padding:1rem;border-radius:19px}
  .admin-content-main>.dashboard-head .actions{width:100%}
  .admin-content-main>.dashboard-head .actions .btn{flex:1 1 145px}
  .admin-studio-nav{margin-inline:-2px;border-radius:15px}
  .admin-studio-nav a{min-width:98px;min-height:42px;padding:.5rem .6rem}
  .admin-studio-nav a span{width:25px;height:25px}
  .admin-studio-nav a strong{font-size:.74rem}
  .admin-content-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .admin-content-card{grid-template-columns:auto minmax(0,1fr);min-height:auto}
  .admin-content-card>b{grid-column:2}
  .admin-form-grid.two,.admin-form-grid.three,
  .admin-context-picker .admin-picker-grid{grid-template-columns:1fr}
  .admin-content-form>.admin-form-grid,
  .admin-content-form>.admin-asset-grid,
  .admin-content-form>label{padding:.8rem}
  .admin-form-actions{display:grid;grid-template-columns:1fr}
  .admin-form-actions .btn{width:100%}
  .admin-section-card>.card-heading,
  .admin-list-card>.card-heading{align-items:flex-start}
  .admin-section-toggle,.admin-list-toggle{margin-left:auto}
  .admin-type-grid,.admin-topic-grid,.admin-lesson-grid{grid-template-columns:1fr}
  .admin-backup-table-card{padding:.65rem}
}

@media(max-width:430px){
  .admin-content-stats{grid-template-columns:1fr 1fr}
  .admin-content-stats .stat-card{min-height:88px;padding:.75rem}
  .admin-content-stats .stat-card strong{font-size:1.4rem}
  .admin-content-card{padding:.9rem}
  .admin-content-icon{width:48px;height:48px}
  .admin-form-card,.admin-section-card,.admin-list-card{padding:.85rem}
}
.admin-content-main .sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* v3.8.0 — Admin Student Intelligence and complete activity reports */
.admin-students-main,.admin-student-report-main{max-width:1540px}
.student-intelligence-head{align-items:flex-end}
.student-overview-grid,.student-dossier-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:20px 0}
.student-overview-grid article,.student-dossier-stat-grid article{position:relative;overflow:hidden;padding:20px;border:1px solid var(--border,#d8e7f0);border-radius:20px;background:linear-gradient(145deg,var(--surface,#fff),color-mix(in srgb,var(--surface,#fff) 86%,#89C2D9));box-shadow:0 12px 30px rgba(1,42,74,.07)}
.student-overview-grid article:after,.student-dossier-stat-grid article:after{content:"";position:absolute;width:90px;height:90px;border-radius:50%;right:-34px;top:-40px;background:rgba(97,165,194,.14)}
.student-overview-grid span,.student-dossier-stat-grid span{display:block;font-size:.75rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted,#527086)}
.student-overview-grid strong,.student-dossier-stat-grid strong{display:block;font-size:2rem;line-height:1.1;margin:8px 0;color:var(--ink,#012A4A)}
.student-overview-grid small,.student-dossier-stat-grid small{color:var(--muted,#5f7484)}
.student-filter-card{margin-bottom:18px}
.student-report-filters{display:grid;grid-template-columns:minmax(260px,1.7fr) minmax(190px,.8fr) minmax(190px,.8fr) auto auto;gap:12px;align-items:end}
.student-report-filters label{display:grid;gap:6px}.student-report-filters label>span{font-size:.78rem;font-weight:800;color:var(--muted,#527086)}
.student-report-filters input,.student-report-filters select{width:100%;min-height:45px}
.student-master-table-card{padding:0;overflow:hidden}.student-master-table-card>.card-heading{padding:22px 24px 8px}
.student-master-table{min-width:1280px}.student-master-table th{white-space:nowrap}.student-master-table td{vertical-align:top;min-width:135px}
.student-master-table td small,.student-master-table td em{display:block;margin-top:4px;color:var(--muted,#607889);font-style:normal;line-height:1.35}
.student-cell-profile{display:flex;gap:11px;align-items:center;min-width:210px}
.student-mini-avatar,.student-report-avatar{display:grid;place-items:center;flex:0 0 auto;border-radius:50%;overflow:hidden;background:linear-gradient(145deg,#01497C,#61A5C2);color:#fff;font-weight:900;box-shadow:0 8px 22px rgba(1,73,124,.2)}
.student-mini-avatar{width:42px;height:42px}.student-mini-avatar img,.student-report-avatar img{width:100%;height:100%;object-fit:cover}
.report-pagination{display:flex;justify-content:center;align-items:center;gap:18px;padding:18px;border-top:1px solid var(--border,#d8e7f0)}
.report-pagination a{font-weight:800}.student-intelligence-lower{display:grid;grid-template-columns:minmax(250px,.72fr) minmax(0,2fr);gap:18px;margin-top:18px}
.activity-type-list{display:grid;gap:7px;max-height:650px;overflow:auto}.activity-type-list a{display:flex;justify-content:space-between;gap:12px;padding:11px 12px;border:1px solid var(--border,#d8e7f0);border-radius:12px}.activity-type-list a.active{background:rgba(44,125,160,.12);border-color:#2C7DA0}
.admin-activity-feed,.student-full-activity-feed{display:grid;gap:0}.admin-activity-feed{max-height:720px;overflow:auto;padding-right:5px}
.admin-activity-feed article,.student-full-activity-feed article{display:grid;grid-template-columns:14px minmax(0,1fr) auto;gap:12px;align-items:start;padding:14px 2px;border-bottom:1px solid var(--border,#e2edf3)}
.admin-activity-feed article:last-child,.student-full-activity-feed article:last-child{border-bottom:0}.admin-activity-feed p,.admin-activity-feed small,.student-full-activity-feed p{margin:3px 0 0}.admin-activity-feed time,.student-full-activity-feed time{white-space:nowrap;text-align:right;color:var(--muted,#607889);font-size:.78rem}
.activity-dot{width:10px;height:10px;margin-top:5px;border-radius:50%;background:#2C7DA0;box-shadow:0 0 0 5px rgba(44,125,160,.12)}.section-exams{background:#014F86}.section-learn{background:#2c8b68}.section-translator{background:#7d5cc6}.section-account{background:#cc7a24}.section-notes{background:#468FAF}.section-admin{background:#8f4f68}
.privacy-report-note{display:flex;gap:14px;align-items:flex-start;margin-top:18px}.privacy-report-note>span{font-weight:900;color:#01497C;white-space:nowrap}.privacy-report-note p{margin:0;color:var(--muted,#5f7484)}
.admin-upgrade-required{text-align:center;padding:42px}.admin-upgrade-required code{display:inline-block;padding:3px 7px;border-radius:7px;background:rgba(1,73,124,.08)}
.student-dossier-hero{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:25px}.student-dossier-identity{display:flex;align-items:center;gap:18px}.student-report-avatar{width:86px;height:86px;font-size:1.8rem}.student-dossier-identity h1{margin:3px 0}.student-dossier-identity p{margin:0;color:var(--muted,#607889)}
.student-contact-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:7px}.student-contact-row span{color:var(--muted,#607889)}
.student-dossier-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:18px 0}.student-detail-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px;margin:0}.student-detail-list>div{padding:11px 0;border-bottom:1px solid var(--border,#e2edf3)}.student-detail-list .wide{grid-column:1/-1}.student-detail-list dt{font-size:.76rem;font-weight:800;color:var(--muted,#607889);text-transform:uppercase;letter-spacing:.05em}.student-detail-list dd{margin:4px 0 0;overflow-wrap:anywhere}
.connected-account-report,.saved-paper-report-list,.feedback-report-list,.top-page-list{display:grid;gap:9px}.connected-account-report article,.saved-paper-report-list article,.feedback-report-list article,.top-page-list>div{padding:12px;border:1px solid var(--border,#dbe8ef);border-radius:13px;background:rgba(137,194,217,.06)}.connected-account-report span,.connected-account-report small,.saved-paper-report-list span,.saved-paper-report-list small{display:block;margin-top:3px;color:var(--muted,#607889)}.feedback-report-list{max-height:480px;overflow:auto}.feedback-report-list p{margin:6px 0;white-space:pre-wrap}.feedback-report-list small{color:var(--muted,#607889)}.top-page-list>div{display:flex;justify-content:space-between;gap:12px}.top-page-list span{overflow-wrap:anywhere}
.active-student-attempt-card{display:flex;justify-content:space-between;align-items:center;gap:18px;border-left:5px solid #cc7a24}.active-student-attempt-card h2{margin:4px 0}.active-student-attempt-card p{margin:0;color:var(--muted,#607889)}
.student-learning-detail-card,.student-translation-detail-card,.student-login-history-card{margin-top:18px}.student-learning-detail-card table{min-width:1120px}.student-translation-detail-card table{min-width:1180px}.student-login-history-card table{min-width:850px}
.status-pill{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:.75rem;font-weight:900;text-transform:capitalize;background:rgba(97,165,194,.14)}.status-completed{background:rgba(44,139,104,.15);color:#1f7253}.status-in_progress{background:rgba(204,122,36,.15);color:#9a5816}
.student-full-activity-feed{max-height:900px;overflow:auto;padding-right:6px}.student-full-activity-feed article{grid-template-columns:14px minmax(0,1fr) minmax(150px,auto)}.student-full-activity-feed article div>span{display:block;margin-top:3px;color:var(--muted,#607889);font-size:.8rem}.student-full-activity-feed time small{display:block;margin-top:4px}
.student-analytics-divider{display:flex;align-items:center;gap:14px;margin:36px 0 16px;color:#01497C;font-weight:900;letter-spacing:.08em}.student-analytics-divider:before,.student-analytics-divider:after{content:"";height:1px;flex:1;background:linear-gradient(90deg,transparent,#89C2D9)}.student-analytics-divider:after{background:linear-gradient(90deg,#89C2D9,transparent)}
.student-engagement-list{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:1180px){.student-overview-grid,.student-dossier-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.student-report-filters{grid-template-columns:1fr 1fr 1fr}.student-report-filters .btn{width:100%}.student-intelligence-lower{grid-template-columns:1fr}.activity-type-list{grid-template-columns:repeat(2,minmax(0,1fr));max-height:none}}
@media(max-width:820px){.student-dossier-hero,.active-student-attempt-card,.privacy-report-note{align-items:stretch;flex-direction:column}.student-dossier-hero .actions,.active-student-attempt-card .btn{width:100%}.student-dossier-grid{grid-template-columns:1fr}.student-report-filters{grid-template-columns:1fr}.student-detail-list{grid-template-columns:1fr}.student-detail-list .wide{grid-column:auto}.activity-type-list{grid-template-columns:1fr}.admin-activity-feed article,.student-full-activity-feed article{grid-template-columns:12px minmax(0,1fr)}.admin-activity-feed time,.student-full-activity-feed time{grid-column:2;text-align:left}.student-dossier-identity{align-items:flex-start}.student-report-avatar{width:64px;height:64px}}
@media(max-width:560px){.student-overview-grid,.student-dossier-stat-grid{grid-template-columns:1fr}.student-dossier-hero{padding:18px}.student-dossier-identity{flex-direction:column}.student-engagement-list{grid-template-columns:1fr}.student-contact-row{flex-direction:column;gap:3px}}
@media print{.admin-students-main .topbar,.admin-students-main .site-footer,.admin-student-report-main .topbar,.admin-student-report-main .site-footer{display:none!important}.admin-student-report-main{max-width:none}.student-dossier-hero .actions,.student-activity-timeline-card,.privacy-report-note{display:none!important}.student-dossier-stat-grid,.student-overview-grid{grid-template-columns:repeat(3,1fr)}.student-dossier-grid{break-inside:avoid}.student-learning-detail-card,.student-translation-detail-card,.student-login-history-card{break-before:page}.student-dossier-hero,.student-dossier-stat-grid article,.student-dossier-grid>.card{box-shadow:none!important}}
.activity-history-filters{grid-template-columns:minmax(240px,1.5fr) minmax(170px,.8fr) minmax(150px,.7fr) minmax(140px,.55fr) minmax(140px,.55fr) auto auto}
.complete-activity-table{min-width:1380px}.complete-activity-table td{vertical-align:top}.complete-activity-table td small{display:block;margin-top:4px;color:var(--muted,#607889)}.activity-agent-cell{max-width:310px;white-space:normal;overflow-wrap:anywhere}
@media(max-width:1180px){.activity-history-filters{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:820px){.activity-history-filters{grid-template-columns:1fr}}

/* v3.8.1 — Student Intelligence layout clarity and underline-free selection states */
.admin-students-main,
.admin-student-report-main{
  --student-soft:color-mix(in srgb,var(--surface,#fff) 92%,#A9D6E5);
  --student-line:color-mix(in srgb,var(--border,#d8e7f0) 86%,#61A5C2);
}
.admin-students-main a,
.admin-students-main a:hover,
.admin-students-main a:focus,
.admin-students-main a:active,
.admin-student-report-main a,
.admin-student-report-main a:hover,
.admin-student-report-main a:focus,
.admin-student-report-main a:active{
  text-decoration:none!important;
}
.admin-students-main .btn:focus-visible,
.admin-student-report-main .btn:focus-visible,
.student-report-nav a:focus-visible,
.activity-type-list a:focus-visible,
.report-pagination a:focus-visible{
  outline:none;
  box-shadow:0 0 0 4px rgba(44,125,160,.20)!important;
}
.student-report-nav{
  position:sticky;
  top:82px;
  z-index:12;
  display:flex;
  align-items:center;
  gap:8px;
  margin:0 0 20px;
  padding:9px;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  scrollbar-width:thin;
  border:1px solid var(--student-line);
  border-radius:18px;
  background:color-mix(in srgb,var(--surface,#fff) 92%,transparent);
  box-shadow:0 10px 28px rgba(1,42,74,.08);
  backdrop-filter:blur(14px);
}
.student-report-nav a{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:8px 13px;
  border:1px solid transparent;
  border-radius:12px;
  color:var(--text,#173149);
  font-size:.82rem;
  font-weight:850;
  white-space:nowrap;
  transition:background .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease;
}
.student-report-nav a:hover{
  transform:translateY(-1px);
  border-color:var(--student-line);
  background:rgba(97,165,194,.11);
}
.student-report-panel,
.student-overview-grid,
.student-dossier-stat-grid,
.student-analytics-divider{
  scroll-margin-top:150px;
}
.student-report-panel{
  margin-top:18px;
}
.student-filter-card{
  padding:18px;
  border-color:var(--student-line);
  background:linear-gradient(145deg,var(--surface,#fff),var(--student-soft));
}
.student-report-filters{
  align-items:stretch;
}
.student-report-filters>label{
  align-content:start;
  min-width:0;
  padding:11px 12px;
  border:1px solid color-mix(in srgb,var(--student-line) 80%,transparent);
  border-radius:14px;
  background:color-mix(in srgb,var(--surface,#fff) 94%,#A9D6E5);
}
.student-report-filters label>span{
  margin-bottom:1px;
  letter-spacing:.035em;
}
.student-report-filters input,
.student-report-filters select{
  min-height:44px;
  padding:10px 12px;
  border:1px solid var(--student-line);
  border-radius:11px;
  background:var(--surface,#fff);
  color:var(--text,#173149);
  font:inherit;
  box-shadow:none;
  text-decoration:none!important;
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.student-report-filters input:focus,
.student-report-filters select:focus{
  outline:none;
  border-color:#2C7DA0;
  box-shadow:0 0 0 4px rgba(44,125,160,.14);
  text-decoration:none!important;
}
.student-filter-actions{
  display:flex;
  align-items:stretch;
  gap:9px;
}
.student-filter-actions .btn{
  min-height:46px;
  white-space:nowrap;
}
.student-overview-grid article,
.student-dossier-stat-grid article{
  min-height:142px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:21px;
}
.student-overview-grid strong,
.student-dossier-stat-grid strong{
  overflow-wrap:anywhere;
}
.student-master-table-card{
  border-color:var(--student-line);
  box-shadow:0 16px 38px rgba(1,42,74,.075);
}
.student-master-table-card>.card-heading{
  padding:23px 24px 17px;
  border-bottom:1px solid var(--student-line);
  background:linear-gradient(180deg,rgba(137,194,217,.10),transparent);
}
.student-master-table thead th,
.complete-activity-table thead th,
.student-learning-detail-card thead th,
.student-translation-detail-card thead th,
.student-login-history-card thead th{
  position:sticky;
  top:0;
  z-index:2;
  background:color-mix(in srgb,var(--surface,#fff) 88%,#A9D6E5);
  box-shadow:inset 0 -1px 0 var(--student-line);
}
.student-master-table tbody tr,
.complete-activity-table tbody tr,
.student-learning-detail-card tbody tr,
.student-translation-detail-card tbody tr,
.student-login-history-card tbody tr{
  transition:background .16s ease;
}
.student-master-table tbody tr:hover,
.complete-activity-table tbody tr:hover,
.student-learning-detail-card tbody tr:hover,
.student-translation-detail-card tbody tr:hover,
.student-login-history-card tbody tr:hover{
  background:rgba(137,194,217,.075);
}
.student-master-table td{
  padding-top:16px;
  padding-bottom:16px;
}
.student-cell-profile strong{
  display:block;
  font-size:.94rem;
}
.report-pagination{
  gap:10px;
  flex-wrap:wrap;
  background:rgba(137,194,217,.055);
}
.report-pagination a,
.report-pagination span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:7px 12px;
  border:1px solid var(--student-line);
  border-radius:11px;
  background:var(--surface,#fff);
}
.report-pagination span{
  color:var(--muted,#607889);
  font-weight:750;
}
.student-intelligence-lower{
  align-items:start;
  grid-template-columns:minmax(280px,.78fr) minmax(0,1.72fr);
  gap:20px;
}
.activity-type-card,
.recent-student-activity{
  min-width:0;
}
.activity-type-list{
  gap:8px;
  padding-right:3px;
}
.activity-type-list a{
  align-items:center;
  min-height:48px;
  padding:11px 13px;
  color:var(--text,#173149);
  background:color-mix(in srgb,var(--surface,#fff) 96%,#A9D6E5);
  transition:background .17s ease,border-color .17s ease,transform .17s ease,box-shadow .17s ease;
  text-decoration:none!important;
}
.activity-type-list a:hover{
  transform:translateX(2px);
  border-color:#61A5C2;
  background:rgba(137,194,217,.12);
}
.activity-type-list a.active,
.activity-type-list a[aria-current="true"]{
  border-color:#2C7DA0;
  background:linear-gradient(135deg,rgba(44,125,160,.18),rgba(137,194,217,.12));
  color:#01497C;
  box-shadow:inset 4px 0 0 #2C7DA0;
  text-decoration:none!important;
}
[data-theme="dark"] .activity-type-list a.active,
[data-theme="dark"] .activity-type-list a[aria-current="true"]{
  color:#A9D6E5;
}
.admin-activity-feed,
.student-full-activity-feed{
  gap:9px;
  padding:2px 5px 2px 1px;
}
.admin-activity-feed article,
.student-full-activity-feed article{
  padding:13px 14px;
  border:1px solid color-mix(in srgb,var(--student-line) 82%,transparent);
  border-radius:14px;
  background:color-mix(in srgb,var(--surface,#fff) 97%,#A9D6E5);
}
.admin-activity-feed article:last-child,
.student-full-activity-feed article:last-child{
  border-bottom:1px solid color-mix(in srgb,var(--student-line) 82%,transparent);
}
.admin-activity-feed article:hover,
.student-full-activity-feed article:hover{
  border-color:#61A5C2;
  background:rgba(137,194,217,.085);
}
.student-dossier-hero{
  border-color:var(--student-line);
  background:linear-gradient(145deg,var(--surface,#fff),var(--student-soft));
}
.student-dossier-hero .actions{
  justify-content:flex-end;
}
.student-dossier-grid{
  align-items:start;
  gap:20px;
}
.student-dossier-grid>.card,
.active-student-attempt-card,
.student-learning-detail-card,
.student-translation-detail-card,
.student-login-history-card,
.student-activity-timeline-card{
  border-color:var(--student-line);
}
.student-dossier-grid>.card>.card-heading,
.student-learning-detail-card>.card-heading,
.student-translation-detail-card>.card-heading,
.student-login-history-card>.card-heading,
.student-activity-timeline-card>.card-heading,
#attempt-metadata>.card-heading,
#attempt-answers>.card-heading,
#attempt-translations>.card-heading{
  margin-bottom:16px;
  padding-bottom:14px;
  border-bottom:1px solid var(--student-line);
}
.student-detail-list{
  gap:0 24px;
}
.student-detail-list>div{
  min-width:0;
  padding:13px 0;
}
.student-detail-list dt{
  line-height:1.35;
}
.student-detail-list dd{
  line-height:1.55;
}
.connected-account-report article,
.saved-paper-report-list article,
.feedback-report-list article,
.top-page-list>div{
  padding:13px 14px;
  border-color:var(--student-line);
  background:color-mix(in srgb,var(--surface,#fff) 96%,#A9D6E5);
}
.student-engagement-list{
  gap:10px;
}
.student-engagement-list>div{
  min-width:0;
  padding:12px 13px;
  border:1px solid var(--student-line);
  border-radius:13px;
  background:color-mix(in srgb,var(--surface,#fff) 96%,#A9D6E5);
}
.student-engagement-list dt,
.student-engagement-list dd{
  margin:0;
}
.student-engagement-list dd{
  margin-top:5px;
  font-size:1.02rem;
  font-weight:850;
  color:#01497C;
}
[data-theme="dark"] .student-engagement-list dd{
  color:#A9D6E5;
}
.student-analytics-divider{
  padding-top:14px;
}
.privacy-report-note{
  border-color:color-mix(in srgb,#cc7a24 32%,var(--student-line));
  background:color-mix(in srgb,var(--surface,#fff) 91%,#fff3cf);
}
.complete-activity-table td,
.student-learning-detail-card td,
.student-translation-detail-card td,
.student-login-history-card td{
  line-height:1.5;
}
.activity-agent-cell{
  font-size:.8rem!important;
}

@media(max-width:1260px){
  .student-report-nav{top:74px}
  .student-report-filters{grid-template-columns:repeat(3,minmax(0,1fr))}
  .student-filter-actions{grid-column:1/-1;justify-content:flex-end}
  .student-intelligence-lower{grid-template-columns:1fr}
  .activity-type-list{grid-template-columns:repeat(3,minmax(0,1fr));max-height:none}
  .student-dossier-grid{grid-template-columns:1fr}
}

@media(max-width:1120px){
  .student-master-table-card{
    overflow:visible;
    padding:0 16px 16px;
  }
  .student-master-table-card>.card-heading{
    margin:0 -16px 14px;
    border-radius:18px 18px 0 0;
  }
  .student-master-table,
  .student-master-table tbody{
    display:block;
    min-width:0;
    width:100%;
  }
  .student-master-table thead{
    display:none;
  }
  .student-master-table tbody{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
  }
  .student-master-table tbody tr{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:0 14px;
    min-width:0;
    padding:15px;
    border:1px solid var(--student-line);
    border-radius:16px;
    background:var(--surface,#fff);
    box-shadow:0 8px 22px rgba(1,42,74,.055);
  }
  .student-master-table tbody tr:hover{
    background:color-mix(in srgb,var(--surface,#fff) 96%,#A9D6E5);
  }
  .student-master-table td{
    display:block;
    min-width:0;
    padding:10px 0;
    border-bottom:1px solid color-mix(in srgb,var(--student-line) 72%,transparent);
  }
  .student-master-table td::before{
    content:attr(data-label);
    display:block;
    margin-bottom:5px;
    color:var(--muted,#607889);
    font-size:.68rem;
    font-weight:900;
    letter-spacing:.075em;
    text-transform:uppercase;
  }
  .student-master-table td:first-child,
  .student-master-table td:last-child{
    grid-column:1/-1;
  }
  .student-master-table td:last-child{
    border-bottom:0;
    padding-bottom:0;
  }
  .student-master-table td:last-child .btn{
    width:100%;
  }
}

@media(max-width:820px){
  .student-report-nav{
    top:68px;
    margin-inline:-2px;
    border-radius:14px;
  }
  .student-report-filters{
    grid-template-columns:1fr;
  }
  .student-report-filters>label{
    padding:10px;
  }
  .student-filter-actions{
    grid-column:auto;
    display:grid;
    grid-template-columns:1fr 1fr;
  }
  .student-filter-actions .btn{
    width:100%;
  }
  .student-overview-grid,
  .student-dossier-stat-grid{
    gap:12px;
  }
  .student-overview-grid article,
  .student-dossier-stat-grid article{
    min-height:124px;
    padding:17px;
  }
  .activity-type-list{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .student-dossier-hero{
    gap:18px;
  }
  .student-dossier-hero .actions{
    display:grid;
    grid-template-columns:1fr;
  }
  .student-dossier-hero .actions .btn{
    width:100%;
  }
  .student-contact-row a,
  .student-contact-row span{
    overflow-wrap:anywhere;
  }
  .student-full-activity-feed article,
  .admin-activity-feed article{
    padding:12px;
  }
}

@media(max-width:680px){
  .student-master-table tbody{
    grid-template-columns:1fr;
  }
  .student-master-table tbody tr{
    grid-template-columns:1fr;
  }
  .student-master-table td:first-child,
  .student-master-table td:last-child{
    grid-column:auto;
  }
  .student-master-table td:last-child{
    border-bottom:0;
  }
  .activity-type-list{
    grid-template-columns:1fr;
  }
  .student-filter-actions{
    grid-template-columns:1fr;
  }
  .student-report-nav a{
    min-height:36px;
    padding:7px 11px;
    font-size:.78rem;
  }
}

/* v3.8.2 — Full-width student report cards replace the cramped master table */
.student-directory-card{
  padding:0;
  overflow:hidden;
  border-color:var(--student-line);
  box-shadow:0 16px 38px rgba(1,42,74,.075);
}
.student-directory-heading{
  padding:23px 24px 18px;
  border-bottom:1px solid var(--student-line);
  background:linear-gradient(180deg,rgba(137,194,217,.10),transparent);
}
.student-directory-heading p{
  max-width:760px;
}
.student-directory-list{
  display:grid;
  gap:16px;
  padding:18px;
}
.student-directory-item{
  min-width:0;
  overflow:hidden;
  border:1px solid var(--student-line);
  border-radius:18px;
  background:var(--surface,#fff);
  box-shadow:0 8px 24px rgba(1,42,74,.055);
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.student-directory-item:hover{
  transform:translateY(-1px);
  border-color:#61A5C2;
  box-shadow:0 14px 30px rgba(1,42,74,.09);
}
.student-directory-item-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:17px 18px;
  border-bottom:1px solid color-mix(in srgb,var(--student-line) 78%,transparent);
  background:linear-gradient(135deg,rgba(137,194,217,.12),rgba(255,255,255,0));
}
.student-directory-profile{
  min-width:0;
}
.student-directory-profile>div{
  min-width:0;
}
.student-directory-profile strong,
.student-directory-profile small,
.student-directory-profile em{
  overflow-wrap:anywhere;
}
.student-full-report-btn{
  flex:0 0 auto;
  min-width:112px;
  white-space:nowrap;
  text-decoration:none!important;
}
.student-directory-account-row{
  display:grid;
  grid-template-columns:minmax(260px,1.55fr) minmax(145px,.7fr) minmax(165px,.8fr);
  gap:12px;
  padding:14px 18px;
  border-bottom:1px solid color-mix(in srgb,var(--student-line) 70%,transparent);
}
.student-directory-account-row>div{
  min-width:0;
  padding:11px 12px;
  border:1px solid color-mix(in srgb,var(--student-line) 76%,transparent);
  border-radius:13px;
  background:color-mix(in srgb,var(--surface,#fff) 96%,#A9D6E5);
}
.student-directory-account-row span,
.student-directory-metrics section>span{
  display:block;
  margin-bottom:5px;
  color:var(--muted,#607889);
  font-size:.68rem;
  font-weight:900;
  letter-spacing:.075em;
  line-height:1.3;
  text-transform:uppercase;
}
.student-directory-account-row a,
.student-directory-account-row strong{
  display:block;
  color:var(--text,#173149);
  font-size:.88rem;
  font-weight:800;
  overflow-wrap:anywhere;
  text-decoration:none!important;
}
.student-directory-account-row a:hover,
.student-directory-account-row a:focus,
.student-directory-account-row a:active{
  color:#014F86;
  text-decoration:none!important;
}
.student-directory-metrics{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  padding:16px 18px 18px;
}
.student-directory-metrics section{
  min-width:0;
  padding:14px;
  border:1px solid color-mix(in srgb,var(--student-line) 76%,transparent);
  border-radius:14px;
  background:color-mix(in srgb,var(--surface,#fff) 97%,#A9D6E5);
}
.student-directory-metrics section>strong{
  display:block;
  margin-bottom:5px;
  color:var(--text,#173149);
  font-size:.98rem;
  line-height:1.35;
  overflow-wrap:anywhere;
}
.student-directory-metrics section>small{
  display:block;
  margin-top:4px;
  color:var(--muted,#607889);
  font-size:.79rem;
  line-height:1.42;
  overflow-wrap:anywhere;
}
.student-directory-empty{
  min-height:180px;
  border:1px dashed var(--student-line);
  border-radius:16px;
  background:color-mix(in srgb,var(--surface,#fff) 96%,#A9D6E5);
}
.student-directory-card>.report-pagination{
  margin:0;
  padding:14px 18px 18px;
  border-top:1px solid var(--student-line);
}

@media(max-width:980px){
  .student-directory-account-row{
    grid-template-columns:1fr 1fr;
  }
  .student-directory-account-row>div:first-child{
    grid-column:1/-1;
  }
  .student-directory-metrics{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:620px){
  .student-directory-heading{
    padding:19px 17px 15px;
  }
  .student-directory-list{
    gap:13px;
    padding:13px;
  }
  .student-directory-item-head{
    align-items:flex-start;
    flex-direction:column;
    padding:15px;
  }
  .student-directory-profile{
    width:100%;
  }
  .student-full-report-btn{
    width:100%;
  }
  .student-directory-account-row,
  .student-directory-metrics{
    grid-template-columns:1fr;
    padding-inline:15px;
  }
  .student-directory-account-row>div:first-child{
    grid-column:auto;
  }
  .student-directory-account-row{
    padding-top:13px;
    padding-bottom:13px;
  }
  .student-directory-metrics{
    padding-top:13px;
    padding-bottom:15px;
  }
}

/* v3.8.3 — Structured student table, correct report hierarchy and complete exam answer review */
.admin-students-main .student-directory-card{
  padding:0;
  overflow:hidden;
}
.admin-students-main .student-directory-heading{
  padding:22px 24px 18px;
  border-bottom:1px solid var(--student-line,#cfe3ee);
}
.student-directory-table-wrap{
  width:100%;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  scrollbar-gutter:stable;
}
.student-directory-table{
  width:100%;
  min-width:1040px;
  border-collapse:separate;
  border-spacing:0;
  table-layout:fixed;
  background:var(--surface,#fff);
}
.student-directory-table th,
.student-directory-table td{
  min-width:0;
  padding:15px 14px;
  border-bottom:1px solid var(--student-line,#cfe3ee);
  vertical-align:top;
  text-align:left;
}
.student-directory-table th{
  position:sticky;
  top:0;
  z-index:2;
  color:#014f86;
  background:color-mix(in srgb,var(--surface,#fff) 91%,#a9d6e5);
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.055em;
  text-transform:uppercase;
  white-space:nowrap;
}
.student-directory-table th:nth-child(1){width:18%}
.student-directory-table th:nth-child(2){width:19%}
.student-directory-table th:nth-child(3){width:17%}
.student-directory-table th:nth-child(4){width:18%}
.student-directory-table th:nth-child(5){width:19%}
.student-directory-table th:nth-child(6){width:9%}
.student-directory-table tbody tr{
  background:var(--surface,#fff);
  transition:background .16s ease,box-shadow .16s ease;
}
.student-directory-table tbody tr:nth-child(even){
  background:color-mix(in srgb,var(--surface,#fff) 96%,#a9d6e5);
}
.student-directory-table tbody tr:hover{
  background:color-mix(in srgb,var(--surface,#fff) 90%,#a9d6e5);
}
.student-directory-table tbody tr:last-child td{
  border-bottom:0;
}
.student-directory-table td>strong,
.student-directory-table td>small,
.student-directory-table td>a:not(.btn){
  display:block;
  overflow-wrap:anywhere;
}
.student-directory-table td>strong{
  color:var(--text,#173149);
  font-size:.9rem;
  line-height:1.35;
}
.student-directory-table td>small{
  margin-top:4px;
  color:var(--muted,#607889);
  font-size:.76rem;
  line-height:1.38;
}
.student-directory-table .student-cell-profile{
  display:flex;
  align-items:flex-start;
  gap:11px;
  min-width:0;
}
.student-directory-table .student-cell-profile>div{
  min-width:0;
}
.student-directory-table .student-cell-profile strong,
.student-directory-table .student-cell-profile small,
.student-directory-table .student-cell-profile em{
  display:block;
  overflow-wrap:anywhere;
}
.student-directory-table .student-cell-profile em{
  margin-top:3px;
  color:#2c7da0;
  font-size:.76rem;
  font-style:normal;
}
.student-directory-table .student-email-link{
  color:#014f86;
  font-size:.8rem;
  font-weight:800;
  text-decoration:none!important;
}
.student-directory-table .student-email-link:hover,
.student-directory-table .student-email-link:focus,
.student-directory-table .student-email-link:active{
  color:#2a6f97;
  text-decoration:none!important;
}
.student-action-column,
.student-action-cell{
  text-align:center!important;
}
.student-action-cell{
  vertical-align:middle!important;
}
.student-action-cell .student-full-report-btn{
  width:100%;
  min-width:92px;
  padding-inline:11px;
  white-space:nowrap;
  text-decoration:none!important;
}
.student-directory-empty-row td{
  padding:24px!important;
}
.student-directory-card>.report-pagination{
  margin:0;
  padding:14px 18px 18px;
  border-top:1px solid var(--student-line,#cfe3ee);
}

/* Full report exam-attempt register */
.student-attempt-history-card{
  scroll-margin-top:112px;
}
.student-attempt-history-card .card-heading{
  align-items:flex-start;
}
.student-attempt-history-table{
  min-width:1120px;
}
.student-attempt-history-table td>strong,
.student-attempt-history-table td>small{
  display:block;
}
.student-attempt-history-table td>small{
  margin-top:4px;
  color:var(--muted,#607889);
  font-size:.76rem;
  line-height:1.4;
}
.student-attempt-action{
  vertical-align:middle!important;
  white-space:nowrap;
}
.student-attempt-action .btn{
  text-decoration:none!important;
}

/* Admin answer review clarity */
.admin-answer-review-table{
  min-width:1120px;
}
.answer-result{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:82px;
  padding:5px 9px;
  border:1px solid transparent;
  border-radius:999px;
  font-size:.72rem;
  font-weight:900;
  line-height:1;
}
.answer-result-correct{
  color:#157347;
  background:#e9f8ef;
  border-color:#a8dcc0;
}
.answer-result-wrong{
  color:#b42318;
  background:#fff0ef;
  border-color:#efb5b0;
}
.answer-result-unanswered{
  color:#76520b;
  background:#fff8df;
  border-color:#efd787;
}

/* Keep Student Intelligence controls clean: no underline selection state. */
.admin-students-main a,
.admin-student-report-main a,
.admin-students-main a:hover,
.admin-student-report-main a:hover,
.admin-students-main a:focus,
.admin-student-report-main a:focus,
.admin-students-main a:active,
.admin-student-report-main a:active{
  text-decoration:none!important;
}

@media(max-width:900px){
  .student-directory-table{
    min-width:0;
    border-collapse:separate;
    border-spacing:0 14px;
    padding:0 14px 14px;
    background:transparent;
  }
  .student-directory-table thead{
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip:rect(0 0 0 0);
    clip-path:inset(50%);
    white-space:nowrap;
  }
  .student-directory-table tbody,
  .student-directory-table tr,
  .student-directory-table td{
    display:block;
    width:100%;
  }
  .student-directory-table tbody tr,
  .student-directory-table tbody tr:nth-child(even){
    overflow:hidden;
    border:1px solid var(--student-line,#cfe3ee);
    border-radius:16px;
    background:var(--surface,#fff);
    box-shadow:0 8px 22px rgba(1,42,74,.055);
  }
  .student-directory-table td{
    display:grid;
    grid-template-columns:minmax(120px,.42fr) minmax(0,1fr);
    gap:14px;
    padding:12px 14px;
    border-bottom:1px solid color-mix(in srgb,var(--student-line,#cfe3ee) 76%,transparent);
  }
  .student-directory-table td::before{
    content:attr(data-label);
    color:#2a6f97;
    font-size:.68rem;
    font-weight:900;
    letter-spacing:.055em;
    line-height:1.35;
    text-transform:uppercase;
  }
  .student-directory-table td:last-child{
    border-bottom:0;
  }
  .student-directory-table .student-cell-profile{
    align-items:center;
  }
  .student-action-cell{
    display:grid!important;
    align-items:center;
    text-align:left!important;
  }
  .student-action-cell .student-full-report-btn{
    width:auto;
    justify-self:start;
  }
}

@media(max-width:560px){
  .student-directory-heading{
    padding:18px 16px 15px!important;
  }
  .student-directory-table{
    padding-inline:10px;
  }
  .student-directory-table td{
    grid-template-columns:1fr;
    gap:6px;
    padding:12px 13px;
  }
  .student-directory-table td::before{
    margin-bottom:1px;
  }
  .student-action-cell .student-full-report-btn{
    width:100%;
  }
}

/* v3.8.4 — Lecturer access and account-role controls */
.account-role-badge,
.profile-role-label{
  display:inline-flex;
  align-items:center;
  width:max-content;
  max-width:100%;
  padding:4px 9px;
  border:1px solid color-mix(in srgb,#2c7da0 34%,transparent);
  border-radius:999px;
  background:color-mix(in srgb,#89c2d9 18%,var(--surface,#fff));
  color:#014f86;
  font-size:.68rem;
  font-weight:900;
  letter-spacing:.045em;
  line-height:1.15;
  text-transform:uppercase;
  text-decoration:none!important;
}
.account-role-badge.role-lecturer,
.profile-role-label.role-lecturer{
  border-color:color-mix(in srgb,#7c3aed 34%,transparent);
  background:color-mix(in srgb,#ede9fe 72%,var(--surface,#fff));
  color:#6d28d9;
}
.account-role-badge.role-admin,
.profile-role-label.role-admin{
  border-color:color-mix(in srgb,#d97706 38%,transparent);
  background:color-mix(in srgb,#fef3c7 72%,var(--surface,#fff));
  color:#9a5b05;
}
.profile-role-label{margin-top:7px}
.student-cell-profile .account-role-badge{margin:5px 0 2px}
.inline-role-form,
.student-role-action{margin:0}
.student-action-cell{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:8px;
}
.student-action-cell .inline-role-form,
.student-action-cell .inline-role-form .btn{
  width:100%;
}
.lecturer-promote-btn{
  border-color:#7c3aed!important;
  background:linear-gradient(135deg,#7c3aed,#5b21b6)!important;
  color:#fff!important;
  box-shadow:0 10px 24px rgba(109,40,217,.22)!important;
}
.lecturer-promote-btn:hover,
.lecturer-promote-btn:focus{
  transform:translateY(-1px);
  filter:brightness(1.04);
}
.student-dossier-hero .actions{
  flex-wrap:wrap;
}
.student-dossier-hero .student-role-action{
  display:flex;
}
.student-directory-table th:nth-child(1){width:18%}
.student-directory-table th:nth-child(2){width:18%}
.student-directory-table th:nth-child(3){width:16%}
.student-directory-table th:nth-child(4){width:17%}
.student-directory-table th:nth-child(5){width:18%}
.student-directory-table th:nth-child(6){width:13%}
.student-report-filters{
  grid-template-columns:minmax(220px,1.3fr) repeat(3,minmax(150px,.8fr)) auto;
}
@media(max-width:1160px){
  .student-report-filters{grid-template-columns:repeat(2,minmax(0,1fr))}
  .student-filter-actions{grid-column:1/-1}
}
@media(max-width:900px){
  .student-action-cell{display:grid!important}
  .student-action-cell .inline-role-form,
  .student-action-cell .inline-role-form .btn{width:auto}
  .student-dossier-hero .student-role-action,
  .student-dossier-hero .student-role-action .btn{width:100%}
}
@media(max-width:560px){
  .student-report-filters{grid-template-columns:1fr}
  .student-filter-actions{grid-column:auto}
  .student-action-cell .inline-role-form,
  .student-action-cell .inline-role-form .btn{width:100%}
}


/* v3.8.6 — Keep the Report column as a real table cell so row separators stay continuous. */
.student-directory-table .student-action-cell{
  display:table-cell;
  vertical-align:middle!important;
  text-align:center!important;
  border-bottom:1px solid var(--student-line,#cfe3ee);
}
.student-directory-table tbody tr:last-child .student-action-cell{
  border-bottom:0;
}
.student-action-stack{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:8px;
  width:100%;
  min-width:0;
}
.student-action-stack .student-full-report-btn,
.student-action-stack .inline-role-form,
.student-action-stack .inline-role-form .btn{
  width:100%;
  min-width:0;
  margin:0;
}
@media(max-width:900px){
  .student-directory-table .student-action-cell{
    display:grid!important;
    grid-template-columns:minmax(120px,.42fr) minmax(0,1fr);
    align-items:center;
    text-align:left!important;
    border-bottom:0;
  }
  .student-action-stack{
    justify-self:start;
    width:min(100%,220px);
  }
}
@media(max-width:560px){
  .student-directory-table .student-action-cell{
    grid-template-columns:1fr;
  }
  .student-action-stack{
    width:100%;
  }
}


/* v3.8.7 — category paper-type hub */
.paper-type-library-badge{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:.55rem .85rem;border:1px solid rgba(42,111,151,.28);border-radius:999px;background:rgba(169,214,229,.22);color:var(--ink);font-size:.78rem;font-weight:900;white-space:nowrap}
.exam-paper-type-grid{grid-template-columns:minmax(0,1.45fr) minmax(280px,.75fr)}
.exam-paper-type-card.is-featured{border-color:rgba(44,125,160,.55);background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(220,242,250,.93));box-shadow:0 22px 50px rgba(1,73,124,.14)}
[data-theme="dark"] .exam-paper-type-card.is-featured{background:linear-gradient(145deg,rgba(1,42,74,.98),rgba(1,79,134,.83));border-color:rgba(137,194,217,.38)}
.exam-paper-type-category{display:inline-flex;width:max-content;max-width:100%;margin-bottom:.45rem;padding:.32rem .58rem;border-radius:999px;background:rgba(1,73,124,.09);color:#01497C;font-size:.72rem;font-weight:950;letter-spacing:.035em;overflow-wrap:anywhere}
[data-theme="dark"] .exam-paper-type-category{background:rgba(169,214,229,.12);color:#A9D6E5}
.exam-paper-type-count-banner{position:relative;z-index:1;display:flex;align-items:baseline;gap:.55rem;padding:.9rem 1rem;border-radius:18px;background:linear-gradient(135deg,#013A63,#2C7DA0);color:#fff;box-shadow:0 12px 28px rgba(1,58,99,.18)}
.exam-paper-type-count-banner strong{font-size:2rem;line-height:1;font-weight:950}.exam-paper-type-count-banner span{font-size:.86rem;font-weight:850;opacity:.9}
.future-paper-type-examples{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:.5rem;margin-top:auto}.future-paper-type-examples span{padding:.42rem .62rem;border:1px dashed rgba(100,116,139,.45);border-radius:999px;color:var(--muted);font-size:.74rem;font-weight:800}
@media(max-width:980px){.exam-paper-type-grid{grid-template-columns:1fr}.exam-paper-type-card.is-future{min-height:auto}.paper-type-section-head{align-items:flex-start;flex-direction:column}}
@media(max-width:560px){.paper-type-library-badge{white-space:normal;text-align:center}.exam-paper-type-count-banner{justify-content:center}.exam-paper-type-count-banner strong{font-size:1.7rem}}


/* ===== v3.9.0 — live dashboard attempt countdown ===== */
.dashboard-active-timer{
  min-width:5.5ch;
  text-align:right;
  font-variant-numeric:tabular-nums;
  letter-spacing:.025em;
}
.dashboard-active-timer.is-urgent{
  color:#b91c1c!important;
}
html[data-theme="dark"] .dashboard-active-timer.is-urgent{
  color:#fca5a5!important;
}
.dashboard-active-card.is-expired{
  opacity:.76;
}
.dashboard-active-card.is-expired [data-dashboard-attempt-action]{
  pointer-events:none;
  filter:grayscale(.15);
}

/* =========================================================
   v3.9.1 — Header dropdown navigation
   Notes and Papers open category menus; Info groups reports.
   ========================================================= */
.primary-nav{
  overflow:visible!important;
}
.header-nav-dropdown{
  position:relative;
  z-index:1200;
}
.header-nav-dropdown>summary{
  list-style:none;
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:38px;
  padding:8px 0;
  color:#F7FCFF;
  font-size:.94rem;
  font-weight:700;
  cursor:pointer;
  opacity:.91;
  user-select:none;
  transition:opacity .18s ease,color .18s ease;
}
.header-nav-dropdown>summary::-webkit-details-marker{display:none}
.header-nav-dropdown>summary::marker{display:none;content:""}
.header-nav-dropdown>summary:hover,
.header-nav-dropdown[open]>summary{
  color:#fff;
  opacity:1;
}
.header-nav-dropdown>summary:focus-visible{
  outline:2px solid #A9D6E5;
  outline-offset:5px;
  border-radius:5px;
}
.header-nav-chevron{
  display:inline-grid;
  place-items:center;
  font-size:.8rem;
  line-height:1;
  transform:translateY(-1px);
  transition:transform .18s ease;
}
.header-nav-dropdown[open] .header-nav-chevron{
  transform:translateY(0) rotate(180deg);
}
.header-nav-dropdown-menu{
  position:absolute;
  top:calc(100% + 12px);
  left:50%;
  width:260px;
  padding:8px;
  border:1px solid var(--minimal-border);
  border-radius:15px;
  background:var(--minimal-surface);
  box-shadow:0 22px 54px rgba(1,42,74,.26);
  transform:translateX(-50%);
  animation:headerNavDrop .16s ease both;
  z-index:1250;
}
.header-nav-dropdown:last-of-type .header-nav-dropdown-menu{
  left:auto;
  right:0;
  transform:none;
}
.header-nav-dropdown-menu a{
  display:grid!important;
  gap:2px;
  padding:10px 11px!important;
  border-radius:10px;
  color:var(--text)!important;
  font-size:.86rem!important;
  font-weight:800!important;
  opacity:1!important;
  white-space:normal!important;
  text-decoration:none!important;
  transition:background .16s ease,transform .16s ease!important;
}
.header-nav-dropdown-menu a::after{display:none!important}
.header-nav-dropdown-menu a:hover,
.header-nav-dropdown-menu a:focus-visible{
  background:color-mix(in srgb,#A9D6E5 22%,var(--surface-2));
  transform:translateX(2px);
  text-decoration:none!important;
}
.header-nav-dropdown-menu a:focus-visible{
  outline:2px solid var(--minimal-primary);
  outline-offset:1px;
}
.header-nav-dropdown-menu a span{
  color:var(--text);
  line-height:1.2;
}
.header-nav-dropdown-menu a small{
  color:var(--muted);
  font-size:.7rem;
  font-weight:650;
  line-height:1.35;
}
html[data-theme="dark"] .header-nav-dropdown-menu{
  background:#111c2a;
  border-color:#2A6F97;
}
@keyframes headerNavDrop{
  from{opacity:0;transform:translate(-50%,-6px)}
  to{opacity:1;transform:translate(-50%,0)}
}
.header-nav-dropdown:last-of-type .header-nav-dropdown-menu{
  animation-name:headerNavDropRight;
}
@keyframes headerNavDropRight{
  from{opacity:0;transform:translateY(-6px)}
  to{opacity:1;transform:translateY(0)}
}

@media(max-width:820px){
  .primary-nav{
    overflow-x:auto!important;
    overflow-y:visible!important;
    scrollbar-width:none;
  }
  .primary-nav::-webkit-scrollbar{display:none}
  .header-nav-dropdown{position:static}
  .header-nav-dropdown-menu,
  .header-nav-dropdown:last-of-type .header-nav-dropdown-menu{
    position:fixed;
    top:122px;
    left:10px;
    right:10px;
    width:auto;
    max-height:calc(100dvh - 142px);
    overflow-y:auto;
    transform:none;
    animation:headerNavDropMobile .16s ease both;
  }
  @keyframes headerNavDropMobile{
    from{opacity:0;transform:translateY(-6px)}
    to{opacity:1;transform:translateY(0)}
  }
}
@media(max-width:620px){
  .topbar nav.primary-nav{
    overflow-x:auto!important;
    overflow-y:visible!important;
    flex-wrap:nowrap!important;
  }
  .header-nav-dropdown>summary{white-space:nowrap}
  .header-nav-dropdown-menu,
  .header-nav-dropdown:last-of-type .header-nav-dropdown-menu{
    top:126px;
  }
}
@media(prefers-reduced-motion:reduce){
  .header-nav-dropdown-menu{animation:none}
  .header-nav-chevron{transition:none}
}

/* =========================================================
   v3.9.4 — Hover dropdown menu
   No arrow icon. Menus open smoothly when the pointer enters.
   ========================================================= */
.header-nav-dropdown>summary{
  gap:0!important;
}
.header-nav-dropdown>summary .header-nav-chevron{
  display:none!important;
}
.header-nav-dropdown-menu{
  transform-origin:top center;
  will-change:opacity,transform;
}
.header-nav-dropdown[open]>.header-nav-dropdown-menu{
  animation:headerNavHoverIn .26s cubic-bezier(.2,.75,.25,1) both!important;
}
.header-nav-dropdown:last-of-type[open]>.header-nav-dropdown-menu{
  animation-name:headerNavHoverInRight!important;
}
.header-nav-dropdown.is-closing>.header-nav-dropdown-menu{
  pointer-events:none;
  animation:headerNavHoverOut .18s ease both!important;
}
.header-nav-dropdown:last-of-type.is-closing>.header-nav-dropdown-menu{
  animation-name:headerNavHoverOutRight!important;
}
.header-nav-dropdown-menu::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-14px;
  height:14px;
}
@keyframes headerNavHoverIn{
  from{opacity:0;transform:translate(-50%,-9px) scale(.975)}
  to{opacity:1;transform:translate(-50%,0) scale(1)}
}
@keyframes headerNavHoverOut{
  from{opacity:1;transform:translate(-50%,0) scale(1)}
  to{opacity:0;transform:translate(-50%,-7px) scale(.98)}
}
@keyframes headerNavHoverInRight{
  from{opacity:0;transform:translateY(-9px) scale(.975)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
@keyframes headerNavHoverOutRight{
  from{opacity:1;transform:translateY(0) scale(1)}
  to{opacity:0;transform:translateY(-7px) scale(.98)}
}
@media(max-width:820px){
  .header-nav-dropdown[open]>.header-nav-dropdown-menu,
  .header-nav-dropdown:last-of-type[open]>.header-nav-dropdown-menu{
    animation-name:headerNavHoverInMobile!important;
  }
  .header-nav-dropdown.is-closing>.header-nav-dropdown-menu,
  .header-nav-dropdown:last-of-type.is-closing>.header-nav-dropdown-menu{
    animation-name:headerNavHoverOutMobile!important;
  }
  @keyframes headerNavHoverInMobile{
    from{opacity:0;transform:translateY(-7px) scale(.985)}
    to{opacity:1;transform:translateY(0) scale(1)}
  }
  @keyframes headerNavHoverOutMobile{
    from{opacity:1;transform:translateY(0) scale(1)}
    to{opacity:0;transform:translateY(-6px) scale(.985)}
  }
}
@media(prefers-reduced-motion:reduce){
  .header-nav-dropdown[open]>.header-nav-dropdown-menu,
  .header-nav-dropdown.is-closing>.header-nav-dropdown-menu{
    animation:none!important;
  }
}

/* =========================================================
   v3.9.5 — Dropdown underline match
   Notes, Papers and Info use the same hover underline as links.
   ========================================================= */
.header-nav-dropdown > summary{
  position:relative;
}
.header-nav-dropdown > summary::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-7px;
  height:2px;
  border-radius:99px;
  background:var(--header-accent, #89C2D9);
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .18s ease;
  pointer-events:none;
}
.header-nav-dropdown > summary:hover::after,
.header-nav-dropdown > summary:focus-visible::after,
.header-nav-dropdown[open] > summary::after{
  transform:scaleX(1);
}
@media(max-width:760px){
  .header-nav-dropdown > summary::after{display:none}
}
@media(prefers-reduced-motion:reduce){
  .header-nav-dropdown > summary::after{transition:none}
}


/* =========================================================
   v3.9.6 — Mobile dropdown reliability
   Tap/click works on touch devices; menu position follows header height.
   ========================================================= */
.header-nav-dropdown > summary{
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}

@media(max-width:820px){
  .header-nav-dropdown-menu,
  .header-nav-dropdown:last-of-type .header-nav-dropdown-menu{
    top:var(--header-nav-menu-top, 78px)!important;
    z-index:5000!important;
    max-height:calc(100dvh - var(--header-nav-menu-top, 78px) - 14px)!important;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }

  .header-nav-dropdown[open] > summary{
    color:#fff!important;
    opacity:1!important;
  }

  .header-nav-dropdown-menu a{
    min-height:48px;
    align-content:center;
  }
}

/* =========================================================
   v3.9.7 — Mobile side navigation drawer
   ========================================================= */
.mobile-nav-toggle,
.mobile-nav-backdrop,
.mobile-nav-drawer{
  display:none;
}

@media(max-width:820px){
  .topbar{
    grid-template-columns:minmax(0,1fr) auto auto!important;
    grid-template-rows:auto!important;
    align-items:center!important;
    gap:10px!important;
    min-height:66px!important;
    padding:9px 12px!important;
  }

  .topbar .brand{
    grid-column:1!important;
    grid-row:1!important;
    min-width:0!important;
    max-width:100%!important;
  }

  .topbar .brand-wordmark-copy{
    min-width:0;
  }

  .topbar .brand-wordmark-copy strong,
  .topbar .brand-wordmark-copy small{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .topbar-right{
    display:contents!important;
  }

  .topbar nav.primary-nav{
    display:none!important;
  }

  .mobile-nav-toggle{
    grid-column:2!important;
    grid-row:1!important;
    justify-self:end;
    display:inline-flex;
    width:44px;
    height:44px;
    border:1px solid rgba(255,255,255,.22);
    border-radius:13px;
    background:rgba(255,255,255,.09);
    color:#fff;
    padding:0;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    cursor:pointer;
    -webkit-tap-highlight-color:transparent;
    touch-action:manipulation;
    transition:background .2s ease,border-color .2s ease,transform .2s ease;
  }

  .mobile-nav-toggle:hover,
  .mobile-nav-toggle:focus-visible{
    background:rgba(255,255,255,.16);
    border-color:rgba(255,255,255,.38);
  }

  .mobile-nav-toggle:focus-visible{
    outline:2px solid #A9D6E5;
    outline-offset:3px;
  }

  .mobile-nav-toggle>span{
    display:block;
    width:20px;
    height:2px;
    border-radius:999px;
    background:currentColor;
    transform-origin:center;
    transition:transform .28s ease,opacity .2s ease,width .2s ease;
  }

  .mobile-nav-open .mobile-nav-toggle>span:nth-child(1){
    transform:translateY(7px) rotate(45deg);
  }

  .mobile-nav-open .mobile-nav-toggle>span:nth-child(2){
    opacity:0;
    width:0;
  }

  .mobile-nav-open .mobile-nav-toggle>span:nth-child(3){
    transform:translateY(-7px) rotate(-45deg);
  }

  .compact-profile-menu{
    grid-column:3!important;
    grid-row:1!important;
    justify-self:end!important;
  }

  .mobile-nav-backdrop{
    display:block;
    position:fixed;
    inset:0;
    z-index:6998;
    background:rgba(1,23,40,.38);
    -webkit-backdrop-filter:blur(12px) saturate(78%);
    backdrop-filter:blur(12px) saturate(78%);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .3s ease,visibility 0s linear .3s;
  }

  .mobile-nav-drawer{
    display:flex;
    position:fixed;
    inset:0 auto 0 0;
    z-index:6999;
    width:min(88vw,370px);
    height:100vh;
    height:100dvh;
    padding:max(14px,env(safe-area-inset-top)) 14px max(16px,env(safe-area-inset-bottom));
    flex-direction:column;
    gap:13px;
    overflow:hidden;
    color:var(--text);
    background:
      linear-gradient(155deg,color-mix(in srgb,var(--minimal-surface) 95%,#A9D6E5 5%),var(--minimal-surface));
    border-right:1px solid color-mix(in srgb,var(--minimal-border) 78%,transparent);
    box-shadow:28px 0 70px rgba(1,42,74,.28);
    transform:translate3d(-105%,0,0);
    visibility:hidden;
    pointer-events:none;
    will-change:transform;
    transition:transform .34s cubic-bezier(.2,.78,.25,1),visibility 0s linear .34s;
  }

  .mobile-nav-open{
    overflow:hidden!important;
    overscroll-behavior:none;
  }

  .mobile-nav-open .mobile-nav-backdrop{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transition:opacity .3s ease,visibility 0s linear 0s;
  }

  .mobile-nav-open .mobile-nav-drawer{
    transform:translate3d(0,0,0);
    visibility:visible;
    pointer-events:auto;
    transition:transform .34s cubic-bezier(.2,.78,.25,1),visibility 0s linear 0s;
  }

  .mobile-nav-drawer-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex:0 0 auto;
    padding:3px 1px 12px;
    border-bottom:1px solid var(--minimal-border);
  }

  .mobile-nav-brand{
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
    color:var(--text)!important;
    text-decoration:none!important;
  }

  .mobile-nav-brand img{
    width:40px;
    height:40px;
    border-radius:12px;
    flex:0 0 auto;
  }

  .mobile-nav-brand>span{
    display:grid;
    min-width:0;
    line-height:1.18;
  }

  .mobile-nav-brand strong{
    font-size:.93rem;
  }

  .mobile-nav-brand small{
    color:var(--muted);
    font-size:.64rem;
    font-weight:750;
    letter-spacing:.04em;
    text-transform:uppercase;
  }

  .mobile-nav-close{
    position:relative;
    display:grid;
    place-items:center;
    width:42px;
    height:42px;
    flex:0 0 42px;
    border:1px solid var(--minimal-border);
    border-radius:12px;
    background:var(--surface-2);
    color:var(--text);
    cursor:pointer;
  }

  .mobile-nav-close span{
    position:absolute;
    width:18px;
    height:2px;
    border-radius:999px;
    background:currentColor;
  }

  .mobile-nav-close span:first-child{transform:rotate(45deg)}
  .mobile-nav-close span:last-child{transform:rotate(-45deg)}

  .mobile-nav-close:focus-visible{
    outline:2px solid var(--minimal-primary);
    outline-offset:2px;
  }

  .mobile-nav-user{
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    gap:11px;
    align-items:center;
    padding:11px 12px;
    border:1px solid var(--minimal-border);
    border-radius:15px;
    background:color-mix(in srgb,#A9D6E5 10%,var(--minimal-surface));
    color:var(--text)!important;
    text-decoration:none!important;
  }

  .mobile-nav-user>span:last-child{
    display:grid;
    min-width:0;
  }

  .mobile-nav-user strong{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .mobile-nav-user small{
    color:var(--muted);
    font-size:.72rem;
    font-weight:700;
  }

  .mobile-nav-list{
    display:grid;
    align-content:start;
    gap:7px;
    min-height:0;
    flex:1 1 auto;
    overflow-x:hidden;
    overflow-y:auto;
    padding:1px 2px 8px;
    scrollbar-width:thin;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }

  .mobile-nav-main-link,
  .mobile-nav-group>summary{
    display:grid;
    grid-template-columns:38px minmax(0,1fr) auto;
    gap:10px;
    align-items:center;
    min-height:58px;
    padding:9px 11px;
    border:1px solid transparent;
    border-radius:14px;
    color:var(--text)!important;
    background:transparent;
    text-decoration:none!important;
    cursor:pointer;
    list-style:none;
    -webkit-tap-highlight-color:transparent;
    transition:background .18s ease,border-color .18s ease,transform .18s ease;
  }

  .mobile-nav-main-link:hover,
  .mobile-nav-main-link:focus-visible,
  .mobile-nav-group>summary:hover,
  .mobile-nav-group>summary:focus-visible,
  .mobile-nav-group[open]>summary{
    background:color-mix(in srgb,#A9D6E5 17%,var(--surface-2));
    border-color:color-mix(in srgb,#61A5C2 36%,var(--minimal-border));
    text-decoration:none!important;
  }

  .mobile-nav-main-link:active,
  .mobile-nav-group>summary:active{
    transform:scale(.985);
  }

  .mobile-nav-main-link:focus-visible,
  .mobile-nav-group>summary:focus-visible{
    outline:2px solid var(--minimal-primary);
    outline-offset:2px;
  }

  .mobile-nav-group>summary::-webkit-details-marker{display:none}
  .mobile-nav-group>summary::marker{display:none;content:""}

  .mobile-nav-icon{
    display:grid;
    place-items:center;
    width:38px;
    height:38px;
    border-radius:11px;
    background:color-mix(in srgb,var(--minimal-primary) 11%,transparent);
    color:var(--minimal-primary);
    font-size:.92rem;
    font-weight:900;
  }

  .mobile-nav-main-link>span:nth-child(2),
  .mobile-nav-group>summary>span:nth-child(2){
    display:grid;
    min-width:0;
    line-height:1.18;
  }

  .mobile-nav-main-link strong,
  .mobile-nav-group>summary strong{
    font-size:.9rem;
  }

  .mobile-nav-main-link small,
  .mobile-nav-group>summary small{
    margin-top:3px;
    color:var(--muted);
    font-size:.68rem;
    font-weight:650;
  }

  .mobile-nav-group>summary i{
    position:relative;
    display:block;
    width:18px;
    height:18px;
  }

  .mobile-nav-group>summary i::before,
  .mobile-nav-group>summary i::after{
    content:"";
    position:absolute;
    left:50%;
    top:50%;
    width:12px;
    height:2px;
    border-radius:999px;
    background:var(--muted);
    transform:translate(-50%,-50%);
    transition:transform .22s ease,opacity .22s ease;
  }

  .mobile-nav-group>summary i::after{
    transform:translate(-50%,-50%) rotate(90deg);
  }

  .mobile-nav-group[open]>summary i::after{
    opacity:0;
    transform:translate(-50%,-50%) rotate(0);
  }

  .mobile-nav-submenu{
    display:grid;
    gap:5px;
    margin:5px 0 7px 48px;
    padding:7px;
    border-left:2px solid color-mix(in srgb,var(--minimal-primary) 34%,transparent);
    animation:mobileNavSubmenuIn .22s ease both;
  }

  .mobile-nav-submenu a{
    display:grid;
    gap:2px;
    min-height:48px;
    padding:9px 11px;
    border-radius:11px;
    color:var(--text)!important;
    background:var(--surface-2);
    text-decoration:none!important;
    transition:background .16s ease,transform .16s ease;
  }

  .mobile-nav-submenu a:hover,
  .mobile-nav-submenu a:focus-visible{
    background:color-mix(in srgb,#A9D6E5 24%,var(--surface-2));
    transform:translateX(3px);
    text-decoration:none!important;
  }

  .mobile-nav-submenu a:focus-visible{
    outline:2px solid var(--minimal-primary);
    outline-offset:1px;
  }

  .mobile-nav-submenu strong{
    font-size:.84rem;
  }

  .mobile-nav-submenu small{
    color:var(--muted);
    font-size:.66rem;
    font-weight:650;
  }

  .mobile-nav-drawer-foot{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:7px;
    flex:0 0 auto;
    padding-top:11px;
    border-top:1px solid var(--minimal-border);
  }

  .mobile-nav-drawer-foot a{
    display:flex;
    min-height:42px;
    align-items:center;
    justify-content:center;
    padding:8px;
    border:1px solid var(--minimal-border);
    border-radius:11px;
    color:var(--text)!important;
    background:var(--surface-2);
    font-size:.76rem;
    font-weight:850;
    text-decoration:none!important;
  }

  .mobile-nav-drawer-foot .mobile-nav-signout{
    grid-column:1/-1;
    color:#d34f5f!important;
  }

  @keyframes mobileNavSubmenuIn{
    from{opacity:0;transform:translateY(-5px)}
    to{opacity:1;transform:translateY(0)}
  }
}

@media(max-width:480px){
  .mobile-nav-drawer{
    width:min(91vw,355px);
  }

  .topbar .brand-wordmark-copy small{
    display:none;
  }
}

@media(prefers-reduced-motion:reduce){
  .mobile-nav-toggle>span,
  .mobile-nav-backdrop,
  .mobile-nav-drawer,
  .mobile-nav-main-link,
  .mobile-nav-group>summary,
  .mobile-nav-group>summary i::before,
  .mobile-nav-group>summary i::after,
  .mobile-nav-submenu{
    transition:none!important;
    animation:none!important;
  }
}

/* =========================================================
   v3.9.9 — Mobile category grid fix
   ========================================================= */
@media(max-width:620px){
  .home-hero-category-tabs{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:.55rem!important;
    width:100%!important;
    overflow:visible!important;
    padding:0!important;
    margin:1.05rem 0 .3rem!important;
    scrollbar-width:auto!important;
  }
  .home-hero-category-tabs::-webkit-scrollbar{display:none!important}
  .home-hero-category-tab{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    min-height:64px!important;
    padding:.58rem .6rem .65rem!important;
    grid-template-columns:32px minmax(0,1fr)!important;
    gap:.48rem!important;
    touch-action:manipulation;
  }
  .home-hero-category-tab b{
    width:32px!important;
    height:32px!important;
    border-radius:10px!important;
    font-size:.7rem!important;
  }
  .home-hero-category-tab span{
    display:-webkit-box!important;
    min-width:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:normal!important;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    line-clamp:2;
    line-height:1.2!important;
    font-size:.68rem!important;
    overflow-wrap:anywhere;
  }
}
@media(max-width:370px){
  .home-hero-category-tabs{gap:.45rem!important}
  .home-hero-category-tab{
    min-height:60px!important;
    padding:.52rem!important;
    grid-template-columns:29px minmax(0,1fr)!important;
    gap:.4rem!important;
  }
  .home-hero-category-tab b{
    width:29px!important;
    height:29px!important;
    font-size:.66rem!important;
  }
  .home-hero-category-tab span{font-size:.63rem!important}
}

/* =========================================================
   v3.10.0 — Mobile drawer bottom fix
   Fit the drawer to the iOS visual viewport and remove fixed
   page controls from the open menu surface.
   ========================================================= */
@media(max-width:820px){
  .mobile-nav-backdrop{
    inset:var(--mobile-nav-viewport-top,0px) 0 auto 0!important;
    height:var(--mobile-nav-viewport-height,100dvh)!important;
    min-height:0!important;
  }

  .mobile-nav-drawer{
    inset:var(--mobile-nav-viewport-top,0px) auto auto 0!important;
    height:var(--mobile-nav-viewport-height,100dvh)!important;
    max-height:var(--mobile-nav-viewport-height,100dvh)!important;
    min-height:0!important;
    padding-bottom:max(8px,env(safe-area-inset-bottom))!important;
    overscroll-behavior:contain;
  }

  .mobile-nav-drawer-foot{
    margin-bottom:0!important;
    padding-bottom:0!important;
    background:transparent!important;
  }

  .mobile-nav-open .back-to-top,
  body.mobile-nav-open #backToTop{
    display:none!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }
}

/* =========================================================
   v3.10.1 — Full-width desktop header and profile blur
   ========================================================= */
.profile-menu-backdrop{
  --profile-backdrop-top:68px;
  position:fixed;
  top:var(--profile-backdrop-top);
  right:0;
  bottom:0;
  left:0;
  z-index:900;
  display:block;
  background:rgba(1,42,74,.20);
  -webkit-backdrop-filter:blur(11px) saturate(82%);
  backdrop-filter:blur(11px) saturate(82%);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .26s ease,visibility 0s linear .26s;
}

.profile-menu-open .profile-menu-backdrop{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition:opacity .26s ease,visibility 0s linear 0s;
}

.profile-menu-open main.container{
  filter:blur(2px);
  opacity:.84;
  pointer-events:none;
  user-select:none;
  transition:filter .26s ease,opacity .26s ease;
}

body:not(.profile-menu-open) main.container{
  transition:filter .26s ease,opacity .26s ease;
}

.profile-menu-open #backToTop{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

@media(min-width:1001px){
  .topbar{
    display:grid!important;
    grid-template-columns:minmax(230px,1fr) auto minmax(230px,1fr)!important;
    align-items:center!important;
    width:100%!important;
    max-width:none!important;
    min-height:68px!important;
    padding:9px clamp(18px,2.1vw,38px)!important;
    gap:18px!important;
  }

  .topbar>.brand{
    grid-column:1!important;
    grid-row:1!important;
    justify-self:start!important;
    margin:0!important;
    min-width:0;
  }

  .topbar>.topbar-right{
    display:contents!important;
  }

  .topbar nav.primary-nav{
    grid-column:2!important;
    grid-row:1!important;
    justify-self:center!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:clamp(27px,2.55vw,52px)!important;
    margin:0!important;
    padding:0!important;
    width:max-content!important;
    max-width:min(62vw,900px);
  }

  .topbar nav.primary-nav>a,
  .topbar nav.primary-nav>.header-nav-dropdown>summary{
    white-space:nowrap;
  }

  .topbar .compact-profile-menu{
    grid-column:3!important;
    grid-row:1!important;
    justify-self:end!important;
    margin:0!important;
  }

  .topbar .mobile-nav-toggle{
    display:none!important;
  }
}

@media(min-width:1001px) and (max-width:1220px){
  .topbar{
    grid-template-columns:minmax(205px,1fr) auto minmax(205px,1fr)!important;
    padding-inline:18px!important;
  }

  .topbar nav.primary-nav{
    gap:clamp(20px,1.7vw,30px)!important;
  }

  .brand-wordmark-copy small{
    font-size:.58rem!important;
    letter-spacing:.035em!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .profile-menu-backdrop,
  .profile-menu-open main.container,
  body:not(.profile-menu-open) main.container{
    transition:none!important;
  }
}

/* =========================================================
   v3.10.2 — Sticky profile menu fix
   Keeps the header and complete profile menu visible while scrolled.
   ========================================================= */
.topbar{
  position:sticky!important;
  top:0!important;
  z-index:1200!important;
  overflow:visible!important;
}

.profile-menu,
.profile-menu[open]{
  z-index:1250!important;
}

.profile-dropdown{
  position:fixed!important;
  top:var(--profile-dropdown-top,78px)!important;
  right:var(--profile-dropdown-right,18px)!important;
  left:var(--profile-dropdown-left,auto)!important;
  width:var(--profile-dropdown-width,300px)!important;
  max-width:calc(100vw - 20px)!important;
  max-height:var(--profile-dropdown-max-height,calc(100dvh - 92px))!important;
  margin:0!important;
  z-index:1300!important;
  transform-origin:top right;
}

.profile-menu-backdrop{
  top:var(--profile-backdrop-top,68px)!important;
  bottom:var(--profile-backdrop-bottom,0px)!important;
  z-index:1100!important;
}

.profile-menu-open .topbar{
  z-index:1200!important;
}

.profile-menu-open .site-footer,
.profile-menu-open .footer{
  filter:none!important;
  opacity:1!important;
}

@media(max-width:620px){
  .profile-dropdown{
    right:auto!important;
    transform-origin:top center;
  }
}

@media(prefers-reduced-motion:reduce){
  .profile-dropdown{
    animation:none!important;
  }
}

/* =========================================================
   v3.10.3 — Dropdown position and header gap
   Every desktop menu is centered below its own trigger.
   ========================================================= */
@media(min-width:821px){
  .header-nav-dropdown-menu,
  .header-nav-dropdown:last-of-type .header-nav-dropdown-menu{
    position:fixed!important;
    top:var(--header-dropdown-top,77px)!important;
    left:var(--header-dropdown-left,12px)!important;
    right:auto!important;
    width:var(--header-dropdown-width,260px)!important;
    max-height:var(--header-dropdown-max-height,calc(100dvh - 98px))!important;
    margin:0!important;
    overflow-x:hidden;
    overflow-y:auto;
    transform:none!important;
    transform-origin:top center!important;
    z-index:1300!important;
  }

  .header-nav-dropdown[open]>.header-nav-dropdown-menu,
  .header-nav-dropdown:last-of-type[open]>.header-nav-dropdown-menu{
    animation:headerNavFloatingIn .24s cubic-bezier(.2,.75,.25,1) both!important;
  }

  .header-nav-dropdown.is-closing>.header-nav-dropdown-menu,
  .header-nav-dropdown:last-of-type.is-closing>.header-nav-dropdown-menu{
    animation:headerNavFloatingOut .18s ease both!important;
  }

  .header-nav-dropdown-menu::before{
    top:-9px!important;
    height:9px!important;
  }

  @keyframes headerNavFloatingIn{
    from{opacity:0;transform:translateY(-7px) scale(.98)}
    to{opacity:1;transform:translateY(0) scale(1)}
  }

  @keyframes headerNavFloatingOut{
    from{opacity:1;transform:translateY(0) scale(1)}
    to{opacity:0;transform:translateY(-6px) scale(.985)}
  }
}

.profile-dropdown{
  top:var(--profile-dropdown-top,77px)!important;
}

/* =========================================================
   v3.10.4 — Mobile dropdown auto view
   ========================================================= */
@media(max-width:820px){
  .mobile-nav-list{
    scroll-padding-top:9px;
    scroll-padding-bottom:13px;
  }

  .mobile-nav-group{
    scroll-margin-top:9px;
    scroll-margin-bottom:13px;
  }

  .mobile-nav-group[open]{
    position:relative;
    z-index:1;
  }
}

/* =========================================================
   v3.10.5 — Mobile brand restore
   Restore logo, name and tagline in the mobile top header.
   ========================================================= */
@media(max-width:480px){
  .topbar .brand-logo-link{
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    min-width:0!important;
    max-width:100%!important;
    overflow:visible!important;
  }

  .topbar .brand-logo-icon{
    width:38px!important;
    height:38px!important;
    flex:0 0 38px!important;
    border-radius:12px!important;
  }

  .topbar .brand-wordmark-copy{
    display:grid!important;
    gap:1px!important;
    min-width:0!important;
    line-height:1.02!important;
    overflow:visible!important;
  }

  .topbar .brand-wordmark-copy strong{
    display:block!important;
    overflow:visible!important;
    text-overflow:clip!important;
    white-space:nowrap!important;
    font-size:.80rem!important;
    line-height:1.05!important;
  }

  .topbar .brand-wordmark-copy small{
    display:block!important;
    overflow:visible!important;
    text-overflow:clip!important;
    white-space:nowrap!important;
    font-size:.50rem!important;
    line-height:1.1!important;
    letter-spacing:.035em!important;
  }
}

@media(max-width:360px){
  .topbar .brand-logo-link{gap:7px!important}
  .topbar .brand-logo-icon{width:36px!important;height:36px!important;flex-basis:36px!important}
  .topbar .brand-wordmark-copy strong{font-size:.74rem!important}
  .topbar .brand-wordmark-copy small{font-size:.45rem!important;letter-spacing:.025em!important}
}


/* =========================================================
   v3.17.4 — Submission success feedback
   Manual submit only; automatic timeout submit stays instant.
   ========================================================= */
.manual-submit-feedback-open{
  overflow:hidden!important;
  overscroll-behavior:none;
}

.submit-success-overlay{
  position:fixed;
  inset:0;
  z-index:10050;
  display:grid;
  place-items:center;
  min-height:100dvh;
  padding:24px;
  overflow:hidden;
  color:#fff;
  background:rgba(3,24,18,.38);
  -webkit-backdrop-filter:blur(14px) saturate(78%);
  backdrop-filter:blur(14px) saturate(78%);
  opacity:0;
  visibility:hidden;
  pointer-events:all;
  touch-action:none;
  transition:opacity .22s ease,visibility 0s linear .22s;
}

.submit-success-overlay.is-visible{
  opacity:1;
  visibility:visible;
  transition:opacity .22s ease,visibility 0s linear 0s;
}

.submit-success-overlay.is-finishing{
  opacity:0;
  transition:opacity .18s ease;
}

.submit-success-content{
  display:grid;
  justify-items:center;
  gap:14px;
  width:min(100%,460px);
  transform:translateY(-2vh);
}

.submit-success-card{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  width:100%;
  min-height:88px;
  padding:17px 22px;
  border:1px solid rgba(255,255,255,.32);
  border-radius:20px;
  color:#fff;
  background:linear-gradient(135deg,#16a34a 0%,#15803d 58%,#166534 100%);
  box-shadow:
    0 24px 60px rgba(4,72,35,.34),
    inset 0 1px 0 rgba(255,255,255,.22);
  opacity:0;
  visibility:hidden;
  transform:translateY(12px) scale(.9);
}

.submit-success-overlay.is-success .submit-success-card{
  visibility:visible;
  animation:submitSuccessCardIn .56s cubic-bezier(.2,.9,.3,1.25) both;
}

.submit-success-card strong{
  color:#fff;
  font-size:clamp(1.05rem,3.3vw,1.35rem);
  font-weight:900;
  line-height:1.25;
  letter-spacing:.012em;
  text-align:left;
}

.submit-success-icon{
  display:grid;
  place-items:center;
  width:52px;
  height:52px;
  flex:0 0 52px;
  border-radius:50%;
  background:rgba(255,255,255,.15);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.17);
}

.submit-success-icon svg{
  display:block;
  width:42px;
  height:42px;
  overflow:visible;
}

.submit-success-icon circle,
.submit-success-icon path{
  fill:none;
  stroke:#fff;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.submit-success-icon circle{
  stroke-width:2.4;
  stroke-dasharray:139;
  stroke-dashoffset:139;
  opacity:.55;
}

.submit-success-icon path{
  stroke-width:4;
  stroke-dasharray:34;
  stroke-dashoffset:34;
}

.submit-success-overlay.is-success .submit-success-icon circle{
  animation:submitSuccessCircleDraw .52s ease-out .12s forwards;
}

.submit-success-overlay.is-success .submit-success-icon path{
  animation:submitSuccessCheckDraw .42s cubic-bezier(.35,.75,.35,1) .38s forwards;
}

.submit-preparing-status{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:34px;
  padding:7px 13px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  background:rgba(5,42,31,.62);
  box-shadow:0 12px 30px rgba(0,20,14,.16);
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
}

.submit-preparing-status small{
  color:rgba(255,255,255,.9);
  font-size:.72rem;
  font-weight:800;
  line-height:1;
  letter-spacing:.025em;
}

.submit-preparing-spinner{
  display:block;
  width:15px;
  height:15px;
  flex:0 0 15px;
  border:2px solid rgba(255,255,255,.28);
  border-top-color:#fff;
  border-radius:50%;
  animation:submitPreparingSpin .78s linear infinite;
}

@keyframes submitSuccessCardIn{
  0%{opacity:0;transform:translateY(12px) scale(.9)}
  65%{opacity:1;transform:translateY(-2px) scale(1.025)}
  100%{opacity:1;transform:translateY(0) scale(1)}
}

@keyframes submitSuccessCircleDraw{
  to{stroke-dashoffset:0}
}

@keyframes submitSuccessCheckDraw{
  0%{stroke-dashoffset:34}
  70%{stroke-dashoffset:0;transform:scale(1.07);transform-origin:center}
  100%{stroke-dashoffset:0;transform:scale(1);transform-origin:center}
}

@keyframes submitPreparingSpin{
  to{transform:rotate(360deg)}
}

@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  .submit-success-overlay{
    background:rgba(4,31,23,.94);
  }
}

@media(max-width:540px){
  .submit-success-overlay{
    padding:18px;
    -webkit-backdrop-filter:blur(11px) saturate(78%);
    backdrop-filter:blur(11px) saturate(78%);
  }

  .submit-success-content{
    width:min(100%,380px);
    gap:12px;
  }

  .submit-success-card{
    min-height:78px;
    gap:11px;
    padding:14px 16px;
    border-radius:17px;
  }

  .submit-success-card strong{
    font-size:clamp(.94rem,4.4vw,1.12rem);
  }

  .submit-success-icon{
    width:46px;
    height:46px;
    flex-basis:46px;
  }

  .submit-success-icon svg{
    width:37px;
    height:37px;
  }
}

@media(max-width:340px){
  .submit-success-card{
    gap:9px;
    padding-inline:12px;
  }

  .submit-success-card strong{
    font-size:.9rem;
  }

  .submit-success-icon{
    width:42px;
    height:42px;
    flex-basis:42px;
  }
}

@media(prefers-reduced-motion:reduce){
  .submit-success-overlay,
  .submit-success-overlay.is-visible,
  .submit-success-overlay.is-finishing{
    transition-duration:.1s;
  }

  .submit-success-overlay.is-success .submit-success-card{
    animation:none;
    opacity:1;
    transform:none;
  }

  .submit-success-overlay.is-success .submit-success-icon circle,
  .submit-success-overlay.is-success .submit-success-icon path{
    animation:none;
    stroke-dashoffset:0;
  }

  .submit-preparing-spinner{
    animation-duration:1.5s;
  }
}

@media(forced-colors:active){
  .submit-success-card,
  .submit-preparing-status{
    border:2px solid CanvasText;
    color:CanvasText;
    background:Canvas;
  }

  .submit-success-card strong,
  .submit-preparing-status small{
    color:CanvasText;
  }

  .submit-success-icon circle,
  .submit-success-icon path{
    stroke:CanvasText;
  }

  .submit-preparing-spinner{
    border-color:CanvasText;
    border-top-color:transparent;
  }
}

.screenshot-attempt-history-card,
.screenshot-attempt-report-card{
  position:relative;
  margin-top:22px;
  border-top:3px solid #ad1638;
}

.screenshot-attempt-history-card>.card-heading p,
.screenshot-attempt-report-card>.card-heading p{
  max-width:680px;
  margin:.35rem 0 0;
  color:var(--muted);
}

.screenshot-attempt-history-card>.card-heading>strong,
.screenshot-attempt-report-card>.card-heading>strong{
  flex:0 0 auto;
  padding:7px 11px;
  color:#8f1530;
  font-size:.78rem;
  border:1px solid color-mix(in srgb,#ad1638 26%,var(--line));
  border-radius:999px;
  background:color-mix(in srgb,#ad1638 8%,var(--card));
}

.screenshot-attempt-history-card .data-table td:nth-child(4),
.screenshot-attempt-history-card .data-table td:nth-child(5),
.screenshot-attempt-report-table td:nth-child(4),
.screenshot-attempt-report-table td:nth-child(5){
  color:var(--navy);
  font-weight:850;
}

@media(max-width:680px){
  .screenshot-attempt-history-card>.card-heading,
  .screenshot-attempt-report-card>.card-heading{
    align-items:flex-start;
    flex-direction:column;
  }
}

@media print{
  .screenshot-attempt-report-card{
    margin-top:0!important;
    border-top:1.2mm solid #ad1638!important;
  }
  .screenshot-attempt-report-table th,
  .screenshot-attempt-report-table td{
    display:table-cell!important;
  }
  .screenshot-attempt-report-table th:nth-child(1),
  .screenshot-attempt-report-table td:nth-child(1){width:17%!important}
  .screenshot-attempt-report-table th:nth-child(2),
  .screenshot-attempt-report-table td:nth-child(2){width:17%!important}
  .screenshot-attempt-report-table th:nth-child(3),
  .screenshot-attempt-report-table td:nth-child(3){width:17%!important}
  .screenshot-attempt-report-table th:nth-child(4),
  .screenshot-attempt-report-table td:nth-child(4){width:9%!important}
  .screenshot-attempt-report-table th:nth-child(5),
  .screenshot-attempt-report-table td:nth-child(5){width:9%!important}
  .screenshot-attempt-report-table th:nth-child(6),
  .screenshot-attempt-report-table td:nth-child(6){width:20%!important}
  .screenshot-attempt-report-table th:nth-child(7),
  .screenshot-attempt-report-table td:nth-child(7){width:11%!important}
}

/* v3.10.12 — Screenshot shortcut warning and privacy shield */
.exam-capture-live{
  position:fixed!important;
  width:1px!important;
  height:1px!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0 0 0 0)!important;
  clip-path:inset(50%)!important;
  white-space:nowrap!important;
}

.exam-capture-warning[hidden]{
  display:none!important;
}

.exam-capture-warning{
  position:fixed;
  inset:0;
  z-index:2147483600;
  display:grid;
  place-items:center;
  box-sizing:border-box;
  width:100%;
  height:100%;
  min-height:100dvh;
  padding:clamp(18px,4vw,48px);
  overflow:hidden;
  color:#f7fbff;
  background:
    radial-gradient(circle at 50% 45%,rgba(160,22,50,.18),transparent 48%),
    rgba(1,14,25,.48);
  -webkit-backdrop-filter:blur(18px) saturate(66%);
  backdrop-filter:blur(18px) saturate(66%);
  opacity:0;
  pointer-events:none;
  isolation:isolate;
  transition:opacity .18s ease;
}

.exam-capture-warning::before,
.exam-capture-warning::after{
  content:"";
  position:absolute;
  z-index:-1;
  border-radius:50%;
  pointer-events:none;
  filter:blur(2px);
}

.exam-capture-warning::before{
  width:min(72vw,760px);
  aspect-ratio:1;
  background:radial-gradient(circle,rgba(209,37,67,.13),rgba(10,47,70,.05) 45%,transparent 72%);
  animation:captureWarningAura 2.6s ease-in-out both;
}

.exam-capture-warning::after{
  width:min(42vw,420px);
  aspect-ratio:1;
  border:1px solid rgba(244,204,117,.12);
  box-shadow:0 0 0 38px rgba(255,255,255,.018),0 0 0 76px rgba(255,255,255,.01);
}

.exam-capture-warning.is-visible{
  opacity:1;
  pointer-events:auto;
}

.exam-capture-warning.is-leaving{
  opacity:0;
  pointer-events:none;
}

.exam-capture-warning-card{
  position:relative;
  width:min(100%,560px);
  box-sizing:border-box;
  padding:clamp(27px,5vw,48px) clamp(22px,5vw,52px) clamp(25px,4.5vw,42px);
  overflow:hidden;
  text-align:center;
  border:1px solid rgba(240,214,153,.28);
  border-radius:clamp(22px,4vw,34px);
  background:
    linear-gradient(145deg,rgba(14,48,67,.96),rgba(5,26,43,.97) 58%,rgba(28,15,27,.98)),
    rgba(5,27,44,.98);
  box-shadow:
    0 32px 90px rgba(0,0,0,.52),
    inset 0 1px 0 rgba(255,255,255,.12),
    0 0 0 1px rgba(0,0,0,.26);
  transform:translateY(18px) scale(.965);
  transition:transform .32s cubic-bezier(.2,.85,.22,1);
}

.exam-capture-warning-card::before{
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:3px;
  background:linear-gradient(90deg,transparent,#b30f35 25%,#f3d48a 50%,#b30f35 75%,transparent);
  opacity:.9;
}

.exam-capture-warning.is-visible .exam-capture-warning-card{
  transform:translateY(0) scale(1);
}

.exam-capture-warning-icon{
  display:grid;
  place-items:center;
  width:68px;
  height:68px;
  margin:0 auto 16px;
  color:#f5d48a;
  border:1px solid rgba(245,212,138,.38);
  border-radius:22px;
  background:linear-gradient(145deg,rgba(177,19,52,.25),rgba(242,205,126,.08));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 13px 32px rgba(0,0,0,.2);
}

.exam-capture-warning-icon svg{
  width:38px;
  height:38px;
  overflow:visible;
}

.exam-capture-warning-icon path:first-child{
  fill:rgba(179,15,53,.28);
  stroke:currentColor;
  stroke-width:3;
  stroke-linejoin:round;
}

.exam-capture-warning-icon path:nth-child(2){
  fill:none;
  stroke:currentColor;
  stroke-width:4;
  stroke-linecap:round;
}

.exam-capture-warning-icon circle{
  fill:currentColor;
}

.exam-capture-warning-kicker{
  display:block;
  margin-bottom:9px;
  color:#f0ce81;
  font-size:.7rem;
  font-weight:900;
  letter-spacing:.22em;
}

.exam-capture-warning h2{
  margin:0;
  color:#fff;
  font-size:clamp(1.38rem,4.3vw,2rem);
  line-height:1.28;
  letter-spacing:-.02em;
  text-wrap:balance;
}

.exam-capture-warning p{
  margin:9px 0 0;
  color:rgba(241,248,252,.9);
  font-size:clamp(.94rem,2.8vw,1.08rem);
  font-weight:750;
  line-height:1.42;
}

.exam-capture-warning p[lang="ja"]{
  margin-top:5px;
  color:rgba(221,238,245,.78);
  font-size:clamp(.86rem,2.5vw,1rem);
}

.exam-capture-warning-context{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  width:max-content;
  max-width:100%;
  margin:19px auto 12px;
  padding:8px 14px;
  color:#dcecf3;
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.035em;
  border:1px solid rgba(182,213,225,.16);
  border-radius:999px;
  background:rgba(2,17,29,.42);
}

.exam-capture-warning-context b{
  color:#fff1c9;
}

.exam-capture-warning-context i{
  width:4px;
  height:4px;
  border-radius:50%;
  background:#b61639;
  box-shadow:0 0 9px rgba(212,38,73,.72);
}

.exam-capture-warning small{
  display:block;
  max-width:430px;
  margin:0 auto;
  color:rgba(204,223,232,.66);
  font-size:clamp(.66rem,2vw,.75rem);
  font-weight:650;
  line-height:1.55;
}

.exam-capture-warning-timer{
  position:absolute;
  right:0;
  bottom:0;
  left:0;
  height:3px;
  background:linear-gradient(90deg,#99102f,#e13b59 48%,#efd38d);
  transform:scaleX(1);
  transform-origin:left;
}

.exam-capture-warning.is-visible .exam-capture-warning-timer{
  animation:captureWarningCountdown 2.5s linear forwards;
}

body.exam-capture-warning-open{
  overflow:hidden!important;
  overscroll-behavior:none;
}

body.exam-capture-warning-open > :not(.exam-capture-warning):not(.exam-capture-live){
  filter:blur(10px) saturate(.58) brightness(.64)!important;
  pointer-events:none!important;
  user-select:none!important;
}

html.exam-privacy-shield body.exam-active-page > :not(.exam-capture-warning):not(.exam-capture-live){
  filter:blur(20px) saturate(.45) brightness(.34)!important;
  pointer-events:none!important;
  user-select:none!important;
}

html.exam-privacy-shield body.exam-active-page::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:2147483500;
  background:rgba(2,17,29,.72);
  -webkit-backdrop-filter:blur(16px);
  backdrop-filter:blur(16px);
  pointer-events:auto;
}

@keyframes captureWarningCountdown{
  to{transform:scaleX(0)}
}

@keyframes captureWarningAura{
  0%,100%{transform:scale(.92);opacity:.62}
  50%{transform:scale(1.05);opacity:1}
}

@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  .exam-capture-warning{
    background:rgba(2,18,31,.96);
  }
  html.exam-privacy-shield body.exam-active-page::before{
    background:#061c2c;
  }
}

@media(max-width:620px){
  .exam-capture-warning{
    align-items:center;
    padding:16px;
  }
  .exam-capture-warning-card{
    width:min(100%,430px);
    border-radius:24px;
  }
  .exam-capture-warning-icon{
    width:60px;
    height:60px;
    margin-bottom:13px;
    border-radius:19px;
  }
  .exam-capture-warning-icon svg{
    width:34px;
    height:34px;
  }
}

@media(max-height:540px) and (orientation:landscape){
  .exam-capture-warning{
    padding:10px 20px;
  }
  .exam-capture-warning-card{
    width:min(100%,690px);
    padding:16px 28px 18px;
    border-radius:20px;
  }
  .exam-capture-warning-icon{
    width:44px;
    height:44px;
    margin-bottom:7px;
    border-radius:14px;
  }
  .exam-capture-warning-icon svg{
    width:27px;
    height:27px;
  }
  .exam-capture-warning-kicker{margin-bottom:4px;font-size:.58rem}
  .exam-capture-warning h2{font-size:1.1rem}
  .exam-capture-warning p{display:inline;margin:5px 4px 0;font-size:.78rem}
  .exam-capture-warning-context{display:inline-flex;margin:8px 8px 0;padding:5px 10px;font-size:.66rem}
  .exam-capture-warning small{display:none}
}

@media(prefers-reduced-motion:reduce){
  .exam-capture-warning,
  .exam-capture-warning-card{
    transition-duration:.08s!important;
  }
  .exam-capture-warning::before{
    animation:none!important;
  }
  .exam-capture-warning.is-visible .exam-capture-warning-timer{
    animation:none!important;
  }
}

@media(forced-colors:active){
  .exam-capture-warning{
    background:Canvas!important;
    color:CanvasText!important;
  }
  .exam-capture-warning-card{
    border:3px solid CanvasText!important;
    background:Canvas!important;
    box-shadow:none!important;
  }
  .exam-capture-warning h2,
  .exam-capture-warning p,
  .exam-capture-warning small,
  .exam-capture-warning-kicker{
    color:CanvasText!important;
  }
}

/* v3.10.13 — Screenshot guard audit reliability */
.exam-capture-warning-card{
  contain:layout paint;
}
@media(prefers-reduced-motion:reduce){
  .exam-capture-warning.is-visible .exam-capture-warning-timer{
    animation-duration:2.5s!important;
  }
}

/* =========================================================
   v3.10.14 — Rendering performance hints
   ========================================================= */
@supports (content-visibility:auto){
  .paper-grid>.paper-card,
  .notes-category-grid>.notes-category-card,
  .notes-category-article-grid>.notes-category-article-card,
  .learn-live-plan-grid>.learn-plan-card,
  .admin-lesson-grid>.admin-lesson-card,
  .saved-paper-grid>*{
    content-visibility:auto;
    contain-intrinsic-size:auto 280px;
  }

  .site-footer{
    content-visibility:auto;
    contain-intrinsic-size:auto 520px;
  }
}

/* =========================================================
   v3.10.15 — Header tab underline alignment
   All five desktop tabs share one identical trigger box and line level.
   ========================================================= */
@media(min-width:761px){
  .topbar nav.primary-nav > a,
  .topbar nav.primary-nav > .header-nav-dropdown > summary{
    position:relative!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    box-sizing:border-box!important;
    min-height:38px!important;
    padding:8px 0!important;
    line-height:1.2!important;
    vertical-align:middle!important;
  }

  .topbar nav.primary-nav > a::after,
  .topbar nav.primary-nav > .header-nav-dropdown > summary::after{
    left:0!important;
    right:0!important;
    bottom:-7px!important;
    height:2px!important;
    border-radius:99px!important;
    background:var(--header-accent,#89C2D9)!important;
    transform-origin:center!important;
  }
}


/* =========================================================
   v3.11.0 — AdSense public content, blog and trust pages
   ========================================================= */
.public-content-body{background:var(--bg)}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.blog-public-page,.article-public-page,.legal-public-page{max-width:1180px}
.blog-hero{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.45fr) minmax(260px,.55fr);gap:26px;padding:clamp(26px,4vw,52px);background:linear-gradient(110deg,rgba(1,42,74,.97),rgba(1,79,119,.88)),url('blog/blog-hero.webp') center/cover;color:#fff}
.blog-hero h1,.public-page-hero h1{max-width:800px;margin:.35rem 0 .8rem;font-size:clamp(2rem,4.8vw,4.2rem);line-height:1.02}
.blog-hero p{max-width:720px;color:#d6edf7;font-size:1.02rem}
.blog-search{display:grid;grid-template-columns:minmax(0,1fr) auto;max-width:620px;margin-top:20px}.blog-search input{border-radius:13px 0 0 13px;border:1px solid rgba(255,255,255,.28);min-height:48px;padding:0 15px}.blog-search button{border:0;border-radius:0 13px 13px 0;padding:0 22px;background:#2f80ed;color:#fff;font-weight:900}
.blog-hero-stats{display:grid;align-content:center;gap:10px}.blog-hero-stats div{display:grid;padding:15px 17px;border:1px solid rgba(255,255,255,.2);border-radius:16px;background:rgba(255,255,255,.08);backdrop-filter:blur(8px)}.blog-hero-stats strong{font-size:1.65rem}.blog-hero-stats span{color:#d6edf7;font-weight:700;font-size:.76rem}
.blog-category-nav{display:flex;gap:8px;overflow-x:auto;padding:12px;margin-top:16px}.blog-category-nav a{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;padding:9px 13px;border:1px solid var(--minimal-border);border-radius:999px;text-decoration:none!important;color:var(--text);font-weight:850}.blog-category-nav a span{display:grid;place-items:center;min-width:23px;height:23px;padding:0 6px;border-radius:999px;background:var(--surface-2);font-size:.7rem}.blog-category-nav a.active{background:var(--minimal-primary);color:#fff;border-color:var(--minimal-primary)}
.blog-list-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin:28px 0 14px}.blog-list-head h2{margin:.2rem 0 0;font-size:clamp(1.55rem,2.4vw,2.2rem)}.blog-list-head p{color:var(--muted);font-weight:800}
.blog-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.blog-card{display:flex;min-width:0;flex-direction:column;overflow:hidden;border:1px solid var(--minimal-border);border-radius:18px;background:var(--minimal-surface);box-shadow:0 14px 34px rgba(1,42,74,.08);content-visibility:auto;contain-intrinsic-size:430px}.blog-card::before{content:'';display:block;height:4px;background:var(--article-color)}.blog-card-image{display:block;aspect-ratio:16/9;overflow:hidden}.blog-card-image img{width:100%;height:100%;object-fit:cover;transition:transform .32s ease}.blog-card:hover .blog-card-image img{transform:scale(1.035)}.blog-card-body{display:flex;flex:1;flex-direction:column;padding:16px}.blog-card-category{align-self:flex-start;padding:5px 9px;border-radius:999px;background:color-mix(in srgb,var(--article-color) 14%,transparent);color:var(--article-color);font-size:.67rem;font-weight:900;text-transform:uppercase;letter-spacing:.035em}.blog-card h3{margin:10px 0 8px;line-height:1.28}.blog-card h3 a{color:var(--text);text-decoration:none!important}.blog-card p{color:var(--muted);font-size:.86rem;line-height:1.65}.blog-card-meta{display:flex;justify-content:space-between;gap:10px;margin-top:auto;padding-top:14px;color:var(--muted);font-size:.7rem;font-weight:750}.blog-pagination{display:flex;justify-content:center;gap:8px;margin:28px 0}.blog-pagination a{display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--minimal-border);border-radius:11px;color:var(--text);text-decoration:none!important;font-weight:900}.blog-pagination a.active{background:var(--minimal-primary);color:#fff}.blog-empty{text-align:center;padding:50px}
.article-hero{padding:clamp(22px,4vw,48px)}.article-breadcrumb{display:flex;flex-wrap:wrap;gap:8px;color:var(--muted);font-size:.75rem}.article-breadcrumb a{color:var(--minimal-primary)}.article-category{display:inline-flex;margin-top:24px;padding:6px 11px;border-radius:999px;background:color-mix(in srgb,var(--article-color) 15%,transparent);color:var(--article-color);font-size:.72rem;font-weight:900;text-transform:uppercase}.article-hero h1{max-width:1000px;margin:.6rem 0;font-size:clamp(2rem,5vw,4.5rem);line-height:1.04}.article-deck{max-width:840px;color:var(--muted);font-size:clamp(1rem,1.6vw,1.18rem);line-height:1.7}.article-meta{display:flex;flex-wrap:wrap;gap:10px 20px;margin:18px 0;color:var(--muted);font-size:.76rem;font-weight:750}.article-hero-image{display:block;width:100%;max-height:620px;object-fit:cover;border-radius:18px;margin-top:20px}.article-main-grid{display:grid;grid-template-columns:250px minmax(0,1fr);gap:20px;align-items:start;margin-top:20px}.article-toc{position:sticky;top:92px;padding:18px}.article-toc ol{display:grid;gap:8px;padding-left:1.25rem}.article-toc a{color:var(--text);font-size:.78rem}.article-toc-back{display:inline-block;margin-top:12px;color:var(--minimal-primary)!important;font-weight:800}.article-content{padding:clamp(22px,4vw,48px)}.article-content section+section{margin-top:42px;padding-top:30px;border-top:1px solid var(--minimal-border)}.article-content h2{font-size:clamp(1.45rem,2.4vw,2rem);line-height:1.25}.article-content p{font-size:1rem;line-height:1.9;color:color-mix(in srgb,var(--text) 88%,var(--muted))}.article-content ul{display:grid;gap:9px;padding-left:1.4rem;line-height:1.7}.article-inline-figure{margin:24px 0 0}.article-inline-figure img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:16px}.article-inline-figure figcaption{margin-top:7px;color:var(--muted);font-size:.7rem}.article-sources,.article-disclaimer{margin-top:38px;padding:20px;border-radius:15px;background:var(--surface-2);border:1px solid var(--minimal-border)}.article-disclaimer{border-left:4px solid #d48516}.related-articles{margin-top:32px}.related-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.public-page-hero{padding:clamp(24px,4vw,52px);background:linear-gradient(135deg,color-mix(in srgb,var(--minimal-primary) 11%,var(--minimal-surface)),var(--minimal-surface))}.public-page-hero h1{color:var(--text)}.public-page-hero p{max-width:850px;color:var(--muted);font-size:1.03rem}.public-prose{margin-top:20px;padding:clamp(22px,4vw,48px)}.public-prose h2{margin-top:32px;font-size:1.45rem}.public-prose h2:first-child{margin-top:0}.public-prose p{line-height:1.9;color:color-mix(in srgb,var(--text) 88%,var(--muted))}.contact-public-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);gap:20px;margin-top:20px}.contact-form-card,.contact-info-card{padding:clamp(20px,3vw,34px)}.public-contact-form{display:grid;gap:15px}.public-contact-form label{display:grid;gap:7px}.public-contact-form label>span{font-weight:850}.public-contact-form input,.public-contact-form select,.public-contact-form textarea{width:100%;border:1px solid var(--minimal-border);border-radius:12px;background:var(--surface-2);color:var(--text);padding:12px 14px}.public-contact-form textarea{resize:vertical}.public-contact-form small{color:var(--muted)}.contact-honeypot{position:absolute!important;left:-10000px!important}.contact-success{padding:20px;border:1px solid #86d4a1;border-radius:14px;background:#eefaf3;color:#165c2c}.contact-info-card ul{display:grid;gap:10px;padding-left:1.2rem}.contact-direct-links{display:grid;gap:10px;margin:12px 0 24px}.contact-direct-links p{margin:0;padding:12px 14px;border:1px solid var(--minimal-border);border-radius:12px;background:var(--surface-2)}.contact-direct-links strong{display:block;margin-bottom:4px}.contact-direct-links a{overflow-wrap:anywhere;font-weight:800}.public-message-card{max-width:720px;margin:60px auto;padding:40px;text-align:center}
@media(max-width:1050px){.topbar nav.primary-nav{gap:18px!important}.topbar nav.primary-nav>a,.topbar nav.primary-nav summary{font-size:.76rem!important}.blog-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:820px){.blog-hero{grid-template-columns:1fr}.blog-hero-stats{grid-template-columns:repeat(3,1fr)}.article-main-grid{grid-template-columns:1fr}.article-toc{position:relative;top:auto}.contact-public-grid{grid-template-columns:1fr}.related-grid{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.blog-hero-stats{grid-template-columns:1fr}.blog-card-grid,.related-grid{grid-template-columns:1fr}.blog-list-head{align-items:start}.article-content{padding:20px}.article-meta{display:grid}.blog-search{grid-template-columns:1fr}.blog-search input,.blog-search button{border-radius:12px}.blog-search button{min-height:44px;margin-top:8px}.site-footer .footer-grid{grid-template-columns:1fr!important}}

/* =========================================================
   v3.11.1 — Public article responsive layout repair
   ========================================================= */
body.public-content-body{
  overflow-x:clip!important;
}

.article-public-page{
  width:min(1180px,calc(100% - 32px))!important;
  max-width:1180px!important;
  margin-inline:auto!important;
  overflow:visible!important;
}

.article-public-page .article-layout,
.article-public-page .article-layout *{
  box-sizing:border-box;
}

.article-public-page .article-layout{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  overflow:visible!important;
}

.article-public-page .article-hero{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  padding:clamp(22px,3.2vw,40px)!important;
  overflow:hidden!important;
}

.article-public-page .article-breadcrumb{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  gap:7px!important;
  width:100%!important;
  min-width:0!important;
  margin:0 0 22px!important;
}

.article-public-page .article-breadcrumb a,
.article-public-page .article-breadcrumb span{
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}

.article-public-page .article-hero-grid{
  display:grid!important;
  grid-template-columns:minmax(0,1.02fr) minmax(340px,.98fr)!important;
  align-items:center!important;
  gap:clamp(24px,3vw,42px)!important;
  width:100%!important;
  min-width:0!important;
}

.article-public-page .article-hero-copy,
.article-public-page .article-hero-media{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
}

.article-public-page .article-hero-copy{
  display:block!important;
}

.article-public-page .article-category{
  margin-top:0!important;
}

.article-public-page .article-hero h1{
  display:block!important;
  width:100%!important;
  max-width:18ch!important;
  margin:.72rem 0 .75rem!important;
  font-size:clamp(2.1rem,4vw,4rem)!important;
  line-height:1.04!important;
  letter-spacing:-.035em!important;
  overflow-wrap:break-word!important;
  word-break:normal!important;
  hyphens:auto!important;
}

.article-public-page .article-deck{
  display:block!important;
  width:100%!important;
  max-width:62ch!important;
  margin:0!important;
  color:var(--muted)!important;
  font-size:clamp(.98rem,1.25vw,1.1rem)!important;
  line-height:1.75!important;
  overflow-wrap:anywhere!important;
}

.article-public-page .article-meta{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  gap:9px!important;
  width:100%!important;
  margin:20px 0 0!important;
}

.article-public-page .article-meta span{
  display:inline-flex!important;
  align-items:center!important;
  min-height:34px!important;
  padding:7px 11px!important;
  border:1px solid color-mix(in srgb,var(--minimal-border) 90%,transparent)!important;
  border-radius:999px!important;
  background:color-mix(in srgb,var(--surface-2) 84%,transparent)!important;
  color:var(--muted)!important;
  font-size:.72rem!important;
  font-weight:800!important;
  line-height:1.2!important;
  white-space:normal!important;
}

.article-public-page .article-hero-media{
  display:block!important;
  margin:0!important;
  overflow:hidden!important;
  border:1px solid color-mix(in srgb,var(--minimal-border) 82%,transparent)!important;
  border-radius:20px!important;
  background:var(--surface-2)!important;
  box-shadow:0 18px 42px rgba(1,42,74,.14)!important;
}

.article-public-page .article-hero-image{
  display:block!important;
  width:100%!important;
  height:auto!important;
  max-width:100%!important;
  max-height:none!important;
  aspect-ratio:16/9!important;
  object-fit:cover!important;
  object-position:center!important;
  margin:0!important;
  border-radius:0!important;
}

.article-public-page .article-main-grid{
  display:grid!important;
  grid-template-columns:minmax(210px,250px) minmax(0,1fr)!important;
  align-items:start!important;
  gap:22px!important;
  width:100%!important;
  min-width:0!important;
  margin-top:22px!important;
}

.article-public-page .article-toc,
.article-public-page .article-content{
  min-width:0!important;
  max-width:100%!important;
}

.article-public-page .article-content{
  overflow:hidden!important;
}

.article-public-page .article-content p,
.article-public-page .article-content li,
.article-public-page .article-content a,
.article-public-page .article-content h2,
.article-public-page .article-content h3{
  overflow-wrap:anywhere!important;
}

.article-public-page .article-inline-figure{
  width:100%!important;
  max-width:100%!important;
  overflow:hidden!important;
}

.article-public-page .article-inline-figure img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  max-width:100%!important;
  aspect-ratio:16/9!important;
  object-fit:cover!important;
}

.related-articles{
  width:min(1180px,calc(100% - 32px))!important;
  max-width:1180px!important;
  margin-inline:auto!important;
}

@media(max-width:940px){
  .article-public-page .article-hero-grid{
    grid-template-columns:1fr!important;
  }

  .article-public-page .article-hero h1{
    max-width:22ch!important;
  }

  .article-public-page .article-hero-media{
    max-width:760px!important;
  }
}

@media(max-width:820px){
  .article-public-page .article-main-grid{
    grid-template-columns:1fr!important;
  }

  .article-public-page .article-toc{
    position:relative!important;
    top:auto!important;
  }
}

@media(max-width:620px){
  .article-public-page,
  .related-articles{
    width:min(100% - 20px,1180px)!important;
  }

  .article-public-page .article-hero{
    padding:18px!important;
    border-radius:20px!important;
  }

  .article-public-page .article-breadcrumb{
    margin-bottom:16px!important;
    font-size:.69rem!important;
  }

  .article-public-page .article-hero-grid{
    gap:20px!important;
  }

  .article-public-page .article-hero h1{
    max-width:none!important;
    font-size:clamp(2rem,10vw,3rem)!important;
    line-height:1.06!important;
  }

  .article-public-page .article-meta{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
  }

  .article-public-page .article-meta span{
    width:100%!important;
    justify-content:center!important;
    text-align:center!important;
    border-radius:12px!important;
  }

  .article-public-page .article-content{
    padding:20px!important;
  }
}

@media(max-width:380px){
  .article-public-page .article-meta{
    grid-template-columns:1fr!important;
  }
}


/* =========================================================
   v3.11.2 — Public language synchronization
   ========================================================= */
html[lang="si"] .public-content-body .blog-hero h1,
html[lang="si"] .public-content-body .public-page-hero h1,
html[lang="si"] .public-content-body .article-hero h1{
  line-height:1.25!important;
  letter-spacing:-.018em!important;
}
html[lang="ja"] .public-content-body .blog-hero h1,
html[lang="ja"] .public-content-body .public-page-hero h1,
html[lang="ja"] .public-content-body .article-hero h1{
  font-family:"Noto Sans JP",system-ui,sans-serif!important;
  line-height:1.22!important;
  letter-spacing:-.02em!important;
  word-break:normal!important;
}
html[lang="si"] .public-content-body p,
html[lang="si"] .public-content-body li,
html[lang="ja"] .public-content-body p,
html[lang="ja"] .public-content-body li{
  line-height:1.9;
}
.public-contact-form select option{color:#17212b}

/* =========================================================
   v3.11.4 — Blog category dropdown filter
   Replaces the horizontally scrolling category pills.
   ========================================================= */
.blog-category-filter{
  display:grid!important;
  grid-template-columns:minmax(220px,.72fr) minmax(340px,1.28fr)!important;
  align-items:end!important;
  gap:18px!important;
  width:100%!important;
  margin-top:16px!important;
  padding:16px!important;
  overflow:visible!important;
}

.blog-category-filter-copy{
  display:grid;
  gap:5px;
  min-width:0;
}

.blog-category-filter-copy label{
  color:var(--text);
  font-size:.9rem;
  font-weight:900;
  line-height:1.25;
}

.blog-category-filter-copy small{
  color:var(--muted);
  font-size:.74rem;
  font-weight:700;
  line-height:1.45;
}

.blog-category-filter-controls{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  min-width:0;
}

.blog-category-select-shell{
  position:relative;
  min-width:0;
}

.blog-category-select-shell::after{
  content:"";
  position:absolute;
  right:17px;
  top:50%;
  width:9px;
  height:9px;
  border-right:2px solid var(--text);
  border-bottom:2px solid var(--text);
  transform:translateY(-68%) rotate(45deg);
  pointer-events:none;
  opacity:.72;
}

.blog-category-select-shell select{
  appearance:none;
  -webkit-appearance:none;
  width:100%;
  min-height:50px;
  margin:0;
  padding:0 48px 0 16px;
  border:1px solid var(--minimal-border);
  border-radius:14px;
  outline:0;
  background:var(--surface-2);
  color:var(--text);
  font:inherit;
  font-size:.88rem;
  font-weight:850;
  line-height:1.2;
  cursor:pointer;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}

.blog-category-select-shell select:hover{
  border-color:color-mix(in srgb,var(--minimal-primary) 62%,var(--minimal-border));
}

.blog-category-select-shell select:focus{
  border-color:var(--minimal-primary);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--minimal-primary) 18%,transparent);
}

.blog-category-select-shell select option{
  background:#10263a;
  color:#fff;
}

html[data-theme="light"] .blog-category-select-shell select option{
  background:#fff;
  color:#17212b;
}

.blog-category-filter-controls button{
  min-height:50px;
  padding:0 20px;
  border:1px solid var(--minimal-primary);
  border-radius:14px;
  background:var(--minimal-primary);
  color:#fff;
  font-weight:900;
  cursor:pointer;
  box-shadow:0 10px 22px color-mix(in srgb,var(--minimal-primary) 22%,transparent);
  transition:transform .18s ease,filter .18s ease,box-shadow .18s ease;
}

.blog-category-filter-controls button:hover{
  transform:translateY(-1px);
  filter:brightness(1.06);
}

.blog-category-filter-controls button:active{
  transform:translateY(0);
}

@media(max-width:820px){
  .blog-category-filter{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }
}

@media(max-width:620px){
  .blog-category-filter{
    padding:14px!important;
  }

  .blog-category-filter-controls{
    grid-template-columns:1fr!important;
  }

  .blog-category-filter-controls button{
    width:100%;
  }
}

/* =========================================================
   v3.11.5 — Full-width footer and two-column quick links
   ========================================================= */
.site-footer .footer-inner.footer-grid{
  width:calc(100% - clamp(28px,3vw,64px))!important;
  max-width:none!important;
  margin-inline:auto!important;
  padding:42px 0 34px!important;
  grid-template-columns:
    minmax(250px,1.28fr)
    minmax(230px,1.08fr)
    minmax(155px,.72fr)
    minmax(220px,.92fr)
    minmax(190px,.82fr)!important;
  column-gap:clamp(22px,2.5vw,48px)!important;
  row-gap:32px!important;
}

.site-footer .footer-quick-links-column nav{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  column-gap:18px!important;
  row-gap:10px!important;
  align-items:start!important;
}

.site-footer .footer-quick-links-column nav a{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  overflow-wrap:anywhere!important;
}

@media(max-width:1180px){
  .site-footer .footer-inner.footer-grid{
    width:calc(100% - 36px)!important;
    grid-template-columns:minmax(235px,1.2fr) minmax(220px,1fr) minmax(150px,.72fr)!important;
    gap:30px!important;
  }

  .site-footer .footer-preferences-column,
  .site-footer .footer-community-column{
    grid-column:auto!important;
  }

  .site-footer .footer-community-column{
    grid-column:2 / -1!important;
  }
}

@media(max-width:820px){
  .site-footer .footer-inner.footer-grid{
    width:calc(100% - 30px)!important;
    grid-template-columns:1fr 1fr!important;
    gap:28px 24px!important;
  }

  .site-footer .footer-brand-block{
    grid-column:1 / -1!important;
  }

  .site-footer .footer-community-column{
    grid-column:1 / -1!important;
  }
}

@media(max-width:620px){
  .site-footer .footer-quick-links-column nav{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    column-gap:14px!important;
  }
}

@media(max-width:460px){
  .site-footer .footer-inner.footer-grid{
    width:calc(100% - 24px)!important;
    grid-template-columns:1fr!important;
    gap:26px!important;
  }

  .site-footer .footer-brand-block,
  .site-footer .footer-community-column{
    grid-column:auto!important;
  }

  .site-footer .footer-quick-links-column nav{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media(max-width:350px){
  .site-footer .footer-quick-links-column nav{
    grid-template-columns:1fr!important;
  }
}

/* =========================================================
   v3.11.6 — About Us version history timeline
   ========================================================= */
.about-version-history{
  width:100%;
  margin-top:22px;
  padding:clamp(22px,3vw,34px)!important;
  overflow:hidden;
}

.about-version-history-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end;
  gap:24px;
  padding-bottom:20px;
  border-bottom:1px solid var(--minimal-border);
}

.about-version-history-head h2{
  margin:.55rem 0 .45rem;
  font-size:clamp(1.65rem,2.7vw,2.35rem);
  line-height:1.15;
}

.about-version-history-head p{
  max-width:62ch;
  margin:0;
  color:var(--muted);
}

.about-version-history-count{
  display:grid;
  place-items:center;
  min-width:104px;
  padding:14px 18px;
  border:1px solid var(--minimal-border);
  border-radius:18px;
  background:var(--surface-2);
  text-align:center;
}

.about-version-history-count strong{
  color:var(--text);
  font-size:1.55rem;
  line-height:1;
}

.about-version-history-count span{
  margin-top:5px;
  color:var(--muted);
  font-size:.7rem;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.about-version-history-note{
  margin:14px 0 0;
  color:var(--muted);
  font-size:.72rem;
  font-weight:700;
}

.version-history-list{
  display:grid;
  gap:10px;
  margin-top:20px;
}

.version-history-item{
  border:1px solid var(--minimal-border);
  border-radius:16px;
  background:color-mix(in srgb,var(--surface-2) 84%,transparent);
  overflow:hidden;
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}

.version-history-item:hover{
  border-color:color-mix(in srgb,var(--minimal-primary) 58%,var(--minimal-border));
}

.version-history-item[open]{
  border-color:color-mix(in srgb,var(--minimal-primary) 68%,var(--minimal-border));
  box-shadow:0 12px 28px rgba(1,42,74,.09);
}

.version-history-item summary{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto 24px;
  align-items:center;
  gap:12px;
  min-height:62px;
  padding:12px 15px;
  cursor:pointer;
  list-style:none;
  user-select:none;
}

.version-history-item summary::-webkit-details-marker{
  display:none;
}

.version-history-version{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:74px;
  min-height:34px;
  padding:6px 10px;
  border-radius:999px;
  background:color-mix(in srgb,var(--minimal-primary) 18%,var(--surface));
  color:var(--text);
  font-size:.76rem;
  font-weight:950;
  letter-spacing:.025em;
}

.version-history-title{
  min-width:0;
  color:var(--text);
  font-size:.9rem;
  font-weight:900;
  line-height:1.35;
  overflow-wrap:anywhere;
}

.version-history-current{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:5px 9px;
  border:1px solid rgba(46,196,112,.36);
  border-radius:999px;
  background:rgba(46,196,112,.12);
  color:#29a55f;
  font-size:.65rem;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.06em;
}

.version-history-toggle{
  position:relative;
  width:22px;
  height:22px;
  border-radius:50%;
  background:color-mix(in srgb,var(--minimal-primary) 13%,var(--surface));
}

.version-history-toggle::before,
.version-history-toggle::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:9px;
  height:2px;
  border-radius:99px;
  background:var(--text);
  transform:translate(-50%,-50%);
  transition:transform .2s ease;
}

.version-history-toggle::after{
  transform:translate(-50%,-50%) rotate(90deg);
}

.version-history-item[open] .version-history-toggle::after{
  transform:translate(-50%,-50%) rotate(0deg);
}

.version-history-body{
  padding:0 18px 18px 101px;
  color:var(--muted);
  animation:versionHistoryReveal .2s ease both;
}

.version-history-body p{
  margin:0 0 12px;
  line-height:1.75;
}

.version-history-body strong{
  display:block;
  margin-bottom:7px;
  color:var(--text);
  font-size:.78rem;
}

.version-history-body ul{
  display:grid;
  gap:7px;
  margin:0;
  padding-left:1.15rem;
}

.version-history-body li{
  line-height:1.65;
}

@keyframes versionHistoryReveal{
  from{opacity:0;transform:translateY(-4px)}
  to{opacity:1;transform:translateY(0)}
}

@media(max-width:720px){
  .about-version-history-head{
    grid-template-columns:1fr;
    align-items:start;
  }

  .about-version-history-count{
    grid-auto-flow:column;
    justify-content:start;
    gap:8px;
    min-width:0;
    width:max-content;
    padding:10px 14px;
  }

  .about-version-history-count span{
    margin-top:0;
  }

  .version-history-item summary{
    grid-template-columns:auto minmax(0,1fr) 24px;
  }

  .version-history-current{
    grid-column:2;
    justify-self:start;
  }

  .version-history-toggle{
    grid-column:3;
    grid-row:1 / span 2;
  }

  .version-history-body{
    padding:0 15px 16px;
  }
}

@media(max-width:430px){
  .version-history-item summary{
    gap:9px;
    padding:11px 12px;
  }

  .version-history-version{
    min-width:66px;
    padding-inline:8px;
  }

  .version-history-title{
    font-size:.82rem;
  }
}

/* =========================================================
   v3.11.8 — Header dropdown background blur
   Notes, Papers and Progress keep the header/footer sharp.
   ========================================================= */
.header-nav-backdrop{
  --header-nav-backdrop-top:68px;
  --header-nav-backdrop-bottom:0px;
  position:fixed;
  top:var(--header-nav-backdrop-top);
  right:0;
  bottom:var(--header-nav-backdrop-bottom);
  left:0;
  z-index:1100;
  display:block;
  background:rgba(1,42,74,.16);
  -webkit-backdrop-filter:blur(11px) saturate(78%);
  backdrop-filter:blur(11px) saturate(78%);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:
    opacity .24s ease,
    visibility 0s linear .24s;
}

.header-nav-menu-open .header-nav-backdrop{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition:
    opacity .24s ease,
    visibility 0s linear 0s;
}

.header-nav-menu-open .topbar{
  z-index:1200!important;
}

.header-nav-menu-open .header-nav-dropdown[open]{
  position:relative;
  z-index:1250!important;
}

.header-nav-menu-open .header-nav-dropdown[open] > .header-nav-dropdown-menu{
  z-index:1300!important;
}

.header-nav-menu-open main.container{
  filter:blur(2px);
  opacity:.84;
  pointer-events:none;
  user-select:none;
  transition:filter .24s ease,opacity .24s ease;
}

body:not(.header-nav-menu-open) main.container{
  transition:filter .24s ease,opacity .24s ease;
}

.header-nav-menu-open .site-footer,
.header-nav-menu-open .footer{
  filter:none!important;
  opacity:1!important;
  pointer-events:auto!important;
}

.header-nav-menu-open #backToTop{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

@media(max-width:820px){
  .header-nav-backdrop{
    display:none!important;
  }

  .header-nav-menu-open main.container{
    filter:none!important;
    opacity:1!important;
    pointer-events:auto!important;
    user-select:auto!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .header-nav-backdrop,
  .header-nav-menu-open main.container,
  body:not(.header-nav-menu-open) main.container{
    transition:none!important;
  }
}

@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  .header-nav-backdrop{
    background:rgba(1,42,74,.72);
  }
}

/* =========================================================
   v3.12.0 — Blog hero contrast repair
   The global .card background used !important and replaced
   the Blog hero image/gradient in light mode.
   ========================================================= */
.blog-public-page .blog-hero.card{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  background:
    linear-gradient(112deg,rgba(1,42,74,.97) 0%,rgba(1,79,119,.91) 58%,rgba(1,42,74,.90) 100%),
    url('blog/blog-hero.webp') center/cover no-repeat!important;
  border:1px solid rgba(137,194,217,.42)!important;
  color:#fff!important;
  box-shadow:0 22px 55px rgba(1,42,74,.22)!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}

.blog-public-page .blog-hero.card::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(circle at 82% 18%,rgba(137,194,217,.22),transparent 30%),
    linear-gradient(180deg,rgba(255,255,255,.025),rgba(1,42,74,.08));
}

.blog-public-page .blog-hero.card:hover{
  transform:none!important;
  border-color:rgba(137,194,217,.52)!important;
  box-shadow:0 22px 55px rgba(1,42,74,.22)!important;
}

.blog-public-page .blog-hero .blog-hero-copy,
.blog-public-page .blog-hero .blog-hero-stats{
  position:relative;
  z-index:1;
}

.blog-public-page .blog-hero .eyebrow{
  color:#a9e7f7!important;
  text-shadow:0 1px 16px rgba(1,42,74,.45);
}

.blog-public-page .blog-hero h1{
  color:#fff!important;
  text-shadow:0 3px 22px rgba(1,42,74,.46);
}

.blog-public-page .blog-hero p{
  color:#d8eef7!important;
  text-shadow:0 1px 12px rgba(1,42,74,.32);
}

.blog-public-page .blog-hero-stats div{
  border-color:rgba(255,255,255,.25)!important;
  background:rgba(255,255,255,.10)!important;
  color:#fff!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  -webkit-backdrop-filter:blur(9px)!important;
  backdrop-filter:blur(9px)!important;
}

.blog-public-page .blog-hero-stats strong{
  color:#fff!important;
}

.blog-public-page .blog-hero-stats span{
  color:#d8eef7!important;
}

.blog-public-page .blog-search input{
  background:rgba(255,255,255,.96)!important;
  color:#10283d!important;
  border-color:rgba(255,255,255,.48)!important;
  box-shadow:none!important;
}

.blog-public-page .blog-search input::placeholder{
  color:#697786!important;
  opacity:1!important;
}

.blog-public-page .blog-search input:focus{
  outline:none!important;
  border-color:#9dddf2!important;
  box-shadow:0 0 0 4px rgba(157,221,242,.20)!important;
}

.blog-public-page .blog-search button{
  background:linear-gradient(135deg,#2f80ed,#2165d8)!important;
  color:#fff!important;
  box-shadow:0 10px 24px rgba(24,90,190,.28)!important;
}

html[data-theme="dark"] .blog-public-page .blog-hero.card{
  background:
    linear-gradient(112deg,rgba(0,25,46,.96) 0%,rgba(1,58,99,.91) 58%,rgba(0,25,46,.92) 100%),
    url('blog/blog-hero.webp') center/cover no-repeat!important;
}

@media(max-width:620px){
  .blog-public-page .blog-hero.card{
    background-position:center!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .blog-public-page .blog-hero.card,
  .blog-public-page .blog-hero.card:hover{
    transition:none!important;
  }
}

/* =========================================================
   v3.12.1 — Public Account ID and self-service account deletion
   ========================================================= */
.public-account-id{
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace!important;
  font-weight:900!important;
  letter-spacing:.025em!important;
  overflow-wrap:anywhere!important;
}

.account-delete-quick-link{
  color:#c43d4f!important;
}

.account-delete-quick-link:hover{
  background:rgba(196,61,79,.10)!important;
}

.account-danger-panel{
  border-color:rgba(196,61,79,.42)!important;
  background:
    linear-gradient(145deg,rgba(196,61,79,.055),transparent 46%),
    var(--surface)!important;
}

.account-danger-eyebrow{
  color:#c43d4f!important;
}

.account-delete-warning{
  padding:16px 18px;
  border:1px solid rgba(196,61,79,.28);
  border-radius:15px;
  background:rgba(196,61,79,.075);
}

.account-delete-warning strong{
  display:block;
  color:#b42f43;
  font-size:.95rem;
}

.account-delete-warning p{
  margin:.45rem 0 .7rem;
  color:var(--text);
  line-height:1.65;
}

.account-delete-warning ul{
  display:grid;
  gap:6px;
  margin:0;
  padding-left:1.15rem;
  color:var(--muted);
  font-size:.78rem;
}

.account-delete-id-row{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  margin:16px 0;
  padding:12px 14px;
  border:1px solid var(--minimal-border);
  border-radius:14px;
  background:var(--surface-2);
}

.account-delete-id-row>span{
  color:var(--muted);
  font-size:.75rem;
  font-weight:850;
}

.account-delete-id-row code{
  min-width:0;
  padding:0;
  background:transparent;
  color:var(--text);
  font-size:.87rem;
  font-weight:950;
  overflow-wrap:anywhere;
}

.account-delete-form{
  padding-top:4px;
}

.account-delete-form input[type="text"]{
  text-transform:uppercase;
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;
  letter-spacing:.025em;
}

.account-delete-confirm-check{
  display:flex!important;
  flex-direction:row!important;
  align-items:flex-start!important;
  gap:10px!important;
  padding:13px 14px;
  border:1px solid rgba(196,61,79,.24);
  border-radius:13px;
  background:rgba(196,61,79,.045);
  cursor:pointer;
}

.account-delete-confirm-check input{
  width:18px!important;
  height:18px!important;
  min-width:18px!important;
  margin:2px 0 0!important;
  accent-color:#c43d4f;
}

.account-delete-confirm-check span{
  color:var(--text);
  font-size:.8rem;
  font-weight:750;
  line-height:1.55;
}

.account-danger-panel .btn.danger{
  min-height:46px;
  padding-inline:20px;
  border-color:#b72f45!important;
  background:linear-gradient(135deg,#b72f45,#dc4c5f)!important;
  color:#fff!important;
  box-shadow:0 12px 26px rgba(183,47,69,.22);
}

.account-danger-panel .btn.danger:hover{
  filter:brightness(1.05);
}

@media(max-width:620px){
  .account-delete-id-row{
    grid-template-columns:1fr;
    align-items:start;
  }

  .account-delete-id-row .btn{
    width:100%;
  }

  .account-danger-panel .account-form-actions{
    justify-content:stretch;
  }

  .account-danger-panel .btn.danger{
    width:100%;
  }
}

/* =========================================================
   v3.12.2 — JLPT N5 structured 90-minute papers
   ========================================================= */
.exam-section-plan{display:grid;gap:7px;margin:12px 0}.exam-section-plan button{display:grid;gap:2px;text-align:left;padding:9px 10px;border:1px solid var(--line);border-radius:10px;background:var(--surface-2);color:var(--text);cursor:pointer}.exam-section-plan button span{font-weight:900;font-family:"Noto Sans JP",sans-serif}.exam-section-plan button small{color:var(--muted);font-size:.68rem}.exam-section-plan button.current{background:linear-gradient(135deg,#01497c,#2c7da0);border-color:#2c7da0;color:#fff}.exam-section-plan button.current small{color:#d7edf7}.exam-container .exam-sidebar .navigator{max-height:250px;overflow:auto;padding-right:4px;align-content:start}.n5-reading-passage{margin:0 0 18px;padding:18px;border:1px solid color-mix(in srgb,var(--teal) 28%,var(--line));border-radius:14px;background:color-mix(in srgb,var(--teal) 6%,var(--surface-2));font-family:"Noto Sans JP",sans-serif;font-size:1rem;line-height:2;white-space:pre-wrap}.exam-option-image{display:block;width:min(190px,100%);aspect-ratio:16/10;object-fit:contain;margin:0 0 8px;border:1px solid var(--line);border-radius:10px;background:#fff}.option:has(.exam-option-image){align-items:start}.option:has(.exam-option-image) .jp-option{display:grid;justify-items:start;font-weight:800}.review-option .jp-option:has(.review-image){display:grid;gap:6px;align-items:start}.review-image{width:150px}.result-hero h1 small{font-size:.36em;font-weight:800;opacity:.85}.n5-score-breakdown{margin:18px 0 24px}.n5-score-breakdown .card-heading{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}.n5-final-status{padding:8px 13px;border-radius:999px;font-size:.78rem;letter-spacing:.08em}.n5-final-status.pass{background:#e0f5e9;color:#176c48}.n5-final-status.retry{background:#fde5e5;color:#a22f39}.n5-section-score-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:16px}.n5-section-score-grid article{padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--surface-2)}.n5-section-score-grid span,.n5-section-score-grid strong,.n5-section-score-grid small{display:block}.n5-section-score-grid span{font-family:"Noto Sans JP",sans-serif;color:var(--muted);font-weight:850}.n5-section-score-grid strong{margin:5px 0;font-size:1.4rem}.n5-section-score-grid small{color:var(--muted)}.n5-cutoff-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}.n5-cutoff-grid>div{padding:14px;border-radius:13px;border:1px solid var(--line);background:var(--surface-2)}.n5-cutoff-grid>div.met{border-color:rgba(34,147,105,.4);background:rgba(34,147,105,.08)}.n5-cutoff-grid>div.not-met{border-color:rgba(189,90,77,.45);background:rgba(189,90,77,.08)}.n5-cutoff-grid span,.n5-cutoff-grid strong,.n5-cutoff-grid small{display:block}.n5-cutoff-grid strong{font-size:1.2rem;margin:3px 0}.n5-cutoff-grid small{color:var(--muted)}
@media(max-width:700px){.n5-section-score-grid,.n5-cutoff-grid{grid-template-columns:1fr}.exam-option-image{width:min(160px,100%)}.n5-reading-passage{padding:14px;font-size:.92rem}.exam-container .exam-sidebar .navigator{max-height:none}}

/* =========================================================
   v3.12.3 — JLPT N5 difficulty-aligned paper profiles
   ========================================================= */
.paper-difficulty-profile{
  display:block;
  min-height:2.7em;
  margin:.55rem 0 .2rem;
  padding:.58rem .7rem;
  border:1px solid var(--minimal-border);
  border-radius:11px;
  background:var(--surface-2);
  color:var(--muted);
  font-size:.69rem;
  font-weight:750;
  line-height:1.45;
}
.paper-difficulty-profile.beginner{border-left:4px solid #eab308}
.paper-difficulty-profile.moderate{border-left:4px solid #22c55e}
.paper-difficulty-profile.intermediate{border-left:4px solid #ef4444}

/* =========================================================
   v3.12.4 — Reliable JLPT N5 listening audio
   ========================================================= */
.question-audio-control{
  display:flex;
  align-items:center;
  gap:.75rem;
  flex-wrap:wrap;
  margin:0 0 1rem;
  padding:.65rem .75rem;
  border:1px solid rgba(70,143,175,.20);
  border-radius:16px;
  background:linear-gradient(135deg,rgba(137,194,217,.12),rgba(255,255,255,.34));
}

html[data-theme="dark"] .question-audio-control{
  background:linear-gradient(135deg,rgba(1,73,124,.30),rgba(1,42,74,.24));
  border-color:rgba(97,165,194,.28);
}

.question-audio-control .question-audio-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.48rem;
  min-width:174px;
  min-height:46px;
  margin:0;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  padding:.65rem 1rem;
  background:linear-gradient(135deg,#01497C,#2C7DA0);
  color:#fff;
  font:inherit;
  font-weight:900;
  cursor:pointer;
  box-shadow:0 10px 22px rgba(1,73,124,.18);
  transition:transform .18s ease,filter .18s ease,box-shadow .18s ease;
}

.question-audio-control .question-audio-button:hover{
  transform:translateY(-1px);
  filter:brightness(1.06);
}

.question-audio-control .question-audio-button.is-loading{
  background:linear-gradient(135deg,#315c75,#4f8198);
  cursor:progress;
}

.question-audio-control .question-audio-button.is-loading span{
  display:inline-block;
  animation:examAudioSpinner .8s linear infinite;
}

.question-audio-control .question-audio-button.is-playing{
  background:linear-gradient(135deg,#b45309,#f59e0b);
  box-shadow:0 10px 25px rgba(245,158,11,.25);
}

.question-audio-control .question-audio-button.has-error{
  background:linear-gradient(135deg,#9f1239,#e11d48);
}

.question-audio-status{
  color:var(--muted);
  font-size:.73rem;
  font-weight:800;
  line-height:1.45;
}

@keyframes examAudioSpinner{
  to{transform:rotate(360deg)}
}

@media(max-width:620px){
  .question-audio-control{
    align-items:stretch;
    flex-direction:column;
  }

  .question-audio-control .question-audio-button{
    width:100%;
  }

  .question-audio-status{
    text-align:center;
  }
}

@media(prefers-reduced-motion:reduce){
  .question-audio-control .question-audio-button,
  .question-audio-control .question-audio-button.is-loading span{
    transition:none!important;
    animation:none!important;
  }
}

/* =========================================================
   v3.12.5 — JLPT N5 listening picture repair
   ========================================================= */
.exam-option-visual-shell{
  position:relative;
  display:grid;
  place-items:center;
  width:min(190px,100%);
  aspect-ratio:16/10;
  margin:0 0 8px;
  border:1px solid var(--line);
  border-radius:12px;
  overflow:hidden;
  background:#fff;
}

.exam-option-visual-shell .exam-option-image{
  width:100%!important;
  height:100%!important;
  aspect-ratio:auto!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:#fff!important;
  object-fit:contain!important;
}

.exam-option-image-fallback{
  display:none;
  place-items:center;
  width:100%;
  height:100%;
  padding:12px;
  background:
    radial-gradient(circle at 50% 30%,rgba(137,194,217,.22),transparent 45%),
    linear-gradient(145deg,#f7fcff,#e7f5fb);
  color:#07324f;
  font-family:"Noto Sans JP","Yu Gothic",Meiryo,sans-serif;
  font-size:clamp(1.35rem,3vw,2.25rem);
  font-weight:950;
  text-align:center;
}

.exam-option-visual-shell.has-error .exam-option-image-fallback{
  display:grid;
}

.exam-option-visual-shell.has-error::after{
  content:"Image fallback";
  position:absolute;
  right:7px;
  bottom:5px;
  color:#57778a;
  font-size:.52rem;
  font-weight:800;
  letter-spacing:.03em;
  opacity:.7;
}

.review-image{
  width:100%!important;
}

@media(max-width:700px){
  .exam-option-visual-shell{
    width:min(160px,100%);
  }
}

/* =========================================================
   v3.12.7 — Desktop exam width and picture-answer grid
   Mobile layout intentionally remains unchanged.
   ========================================================= */

/* Use almost the complete desktop viewport instead of leaving side gutters. */
@media(min-width:1281px){
  .container.exam-container{
    width:calc(100% - 10px)!important;
    max-width:none!important;
    margin-left:5px!important;
    margin-right:5px!important;
  }

  .exam-container .exam-shell{
    grid-template-columns:
      minmax(205px,220px)
      minmax(0,1fr)
      minmax(285px,305px)!important;
    gap:12px!important;
  }

  .exam-container .translator-tool{
    max-width:305px!important;
  }
}

/* Medium desktop/laptop widths also use the available horizontal area. */
@media(min-width:901px) and (max-width:1280px){
  .container.exam-container{
    width:calc(100% - 10px)!important;
    max-width:none!important;
    margin-left:5px!important;
    margin-right:5px!important;
  }

  .exam-container .exam-shell{
    grid-template-columns:minmax(200px,215px) minmax(0,1fr)!important;
    gap:12px!important;
  }
}

/* Picture-choice questions: four answers become a 2 x 2 desktop grid. */
@media(min-width:901px){
  .question-card.has-picture-options{
    padding:clamp(20px,2.1vw,30px)!important;
  }

  .question-card.has-picture-options .options.picture-options{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:13px!important;
    align-items:stretch;
  }

  .question-card.has-picture-options .option{
    min-width:0;
    min-height:205px;
    height:100%;
    align-items:start!important;
    padding:12px!important;
    gap:10px!important;
  }

  .question-card.has-picture-options .option .jp-option{
    min-width:0;
    width:100%;
    display:grid!important;
    grid-template-columns:minmax(118px,172px) minmax(0,1fr);
    align-items:center;
    gap:12px;
    justify-items:start!important;
  }

  .question-card.has-picture-options .exam-option-visual-shell{
    width:100%!important;
    max-width:172px!important;
    margin:0!important;
  }

  .question-card.has-picture-options .option .jp-option > ruby,
  .question-card.has-picture-options .option .jp-option > span:not(.exam-option-visual-shell){
    min-width:0;
    overflow-wrap:anywhere;
  }

  .question-card.has-picture-options .option::after{
    align-self:center;
  }
}

/* On narrower desktop cards, keep the 2 x 2 grid but stack image and label. */
@media(min-width:901px) and (max-width:1080px){
  .question-card.has-picture-options .option .jp-option{
    grid-template-columns:1fr;
    gap:7px;
  }

  .question-card.has-picture-options .exam-option-visual-shell{
    max-width:155px!important;
  }
}

/* Preserve the existing single-column mobile experience. */
@media(max-width:900px){
  .question-card.has-picture-options .options.picture-options{
    grid-template-columns:1fr!important;
  }

  .question-card.has-picture-options .option{
    min-height:0!important;
  }
}

/* =========================================================
   v3.12.8 — Wider desktop exam sidebar and clear review marks
   Mobile layout remains unchanged.
   ========================================================= */

/* A comfortable sidebar width with nine navigator buttons per row. */
@media(min-width:1281px){
  .exam-container .exam-shell{
    grid-template-columns:
      minmax(286px,304px)
      minmax(0,1fr)
      minmax(285px,305px)!important;
    gap:14px!important;
  }

  .exam-container .exam-sidebar{
    width:100%!important;
    min-width:286px!important;
    padding:16px!important;
  }
}

@media(min-width:901px) and (max-width:1280px){
  .exam-container .exam-shell{
    grid-template-columns:minmax(276px,292px) minmax(0,1fr)!important;
    gap:14px!important;
  }

  .exam-container .exam-sidebar{
    width:100%!important;
    min-width:276px!important;
    padding:15px!important;
  }
}

/* Override the former six-column / 178px navigator restriction. */
@media(min-width:901px){
  .exam-container .exam-sidebar .navigator{
    width:100%!important;
    max-width:none!important;
    grid-template-columns:repeat(9,minmax(0,1fr))!important;
    gap:6px!important;
    margin:14px 0!important;
    padding:4px 3px 4px 0!important;
    max-height:250px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    align-content:start!important;
    scrollbar-gutter:stable;
  }

  .exam-container .exam-sidebar .navigator button{
    position:relative;
    isolation:isolate;
    width:100%!important;
    min-width:0!important;
    height:31px!important;
    padding:0!important;
    border-width:1px!important;
    border-radius:8px!important;
    font-size:.75rem!important;
    font-weight:900!important;
    line-height:1!important;
    overflow:visible!important;
    box-shadow:none;
    transition:
      transform .15s ease,
      background-color .18s ease,
      border-color .18s ease,
      color .18s ease,
      box-shadow .18s ease;
  }

  .exam-container .exam-sidebar .navigator button:hover{
    z-index:5;
    transform:translateY(-1px) scale(1.04);
  }
}

/* Unanswered button — readable in both themes. */
.exam-container .navigator button{
  background:var(--surface-2)!important;
  border-color:color-mix(in srgb,var(--text) 22%,var(--line))!important;
  color:var(--text)!important;
}

/* Answered question. */
.exam-container .navigator button.answered{
  background:color-mix(in srgb,#16a34a 18%,var(--surface))!important;
  border-color:#22a765!important;
  color:color-mix(in srgb,#0b6b3a 84%,var(--text))!important;
}

/* Marked for review — full amber card, thick outline and flag dot. */
.exam-container .navigator button.review{
  background:linear-gradient(145deg,#fff3b8,#ffd166)!important;
  border:2px solid #c77b00!important;
  color:#4b2b00!important;
  box-shadow:
    0 0 0 2px color-mix(in srgb,#f59e0b 28%,transparent),
    0 4px 9px rgba(180,104,0,.18)!important;
}

.exam-container .navigator button.review::after{
  content:"";
  position:absolute;
  z-index:3;
  top:-5px;
  right:-5px;
  width:10px;
  height:10px;
  border:2px solid var(--surface);
  border-radius:999px;
  background:#ef4444;
  box-shadow:0 1px 5px rgba(90,20,20,.32);
}

/* Answered + review keeps both meanings visible. */
.exam-container .navigator button.answered.review{
  background:
    linear-gradient(135deg,rgba(34,197,94,.24),rgba(255,209,102,.94))!important;
  border-color:#b86b00!important;
  color:#3e2900!important;
}

/* Current question is strongly blue; a reviewed current item keeps amber ring. */
.exam-container .navigator button.current{
  z-index:4;
  background:linear-gradient(135deg,#013a63,#2c7da0)!important;
  border:2px solid #7dd3fc!important;
  color:#fff!important;
  box-shadow:
    0 0 0 3px color-mix(in srgb,#38bdf8 26%,transparent),
    0 5px 12px rgba(1,58,99,.24)!important;
}

.exam-container .navigator button.current.review{
  border-color:#ffd166!important;
  box-shadow:
    0 0 0 3px color-mix(in srgb,#f59e0b 48%,transparent),
    0 5px 12px rgba(1,58,99,.28)!important;
}

.exam-container .navigator button:focus-visible{
  outline:3px solid #fb7185!important;
  outline-offset:2px!important;
  z-index:8;
}

/* Make the Mark for review control itself unmistakable. */
.review-check{
  width:max-content;
  max-width:100%;
  min-height:42px;
  padding:9px 12px!important;
  border:1px solid color-mix(in srgb,#f59e0b 46%,var(--line));
  border-radius:12px;
  background:color-mix(in srgb,#f59e0b 8%,var(--surface));
  color:color-mix(in srgb,#9a5a00 82%,var(--text))!important;
  cursor:pointer;
  transition:background .18s ease,border-color .18s ease,box-shadow .18s ease;
}

.review-check input{
  width:19px!important;
  height:19px!important;
  margin:0!important;
  accent-color:#d97706;
}

.review-check:has(input:checked){
  border:2px solid #d97706;
  background:linear-gradient(135deg,#fff1ad,#ffd166);
  color:#422700!important;
  box-shadow:0 0 0 3px color-mix(in srgb,#f59e0b 22%,transparent);
}

/* Dark mode uses richer amber/green contrast instead of pale outlines. */
html[data-theme="dark"] .exam-container .navigator button{
  background:#13283a!important;
  border-color:#49657a!important;
  color:#e9f5fb!important;
}

html[data-theme="dark"] .exam-container .navigator button.answered{
  background:#123d32!important;
  border-color:#3ddc97!important;
  color:#d5ffea!important;
}

html[data-theme="dark"] .exam-container .navigator button.review{
  background:linear-gradient(145deg,#6b4200,#a86500)!important;
  border-color:#ffd166!important;
  color:#fff4c7!important;
  box-shadow:
    0 0 0 2px rgba(255,209,102,.30),
    0 5px 12px rgba(0,0,0,.24)!important;
}

html[data-theme="dark"] .exam-container .navigator button.answered.review{
  background:linear-gradient(135deg,#16513e,#875300)!important;
  color:#fff7d6!important;
}

html[data-theme="dark"] .exam-container .navigator button.current{
  background:linear-gradient(135deg,#075985,#0ea5e9)!important;
  border-color:#bae6fd!important;
  color:#fff!important;
}

html[data-theme="dark"] .exam-container .navigator button.current.review{
  border-color:#ffd166!important;
  box-shadow:
    0 0 0 3px rgba(255,209,102,.45),
    0 5px 13px rgba(0,0,0,.30)!important;
}

html[data-theme="dark"] .review-check{
  background:#2e290f;
  border-color:#8b650c;
  color:#ffe5a3!important;
}

html[data-theme="dark"] .review-check:has(input:checked){
  background:linear-gradient(135deg,#5f3b00,#8a5700);
  border-color:#ffd166;
  color:#fff5d0!important;
  box-shadow:0 0 0 3px rgba(255,209,102,.22);
}

/* Existing mobile behaviour is intentionally retained. */
@media(max-width:900px){
  .exam-container .exam-sidebar{
    min-width:0!important;
  }

  .exam-container .exam-sidebar .navigator{
    grid-template-columns:repeat(9,minmax(0,1fr))!important;
  }
}

/* =========================================================
   v3.12.9 — All desktop question numbers visible
   80 questions = 12 columns x 7 rows, without inner scrolling.
   ========================================================= */

/* Give twelve readable buttons enough horizontal room. */
@media(min-width:1281px){
  .exam-container .exam-shell{
    grid-template-columns:
      minmax(356px,374px)
      minmax(0,1fr)
      minmax(285px,305px)!important;
    gap:14px!important;
  }

  .exam-container .exam-sidebar{
    min-width:356px!important;
    padding:15px!important;
  }
}

@media(min-width:901px) and (max-width:1280px){
  .exam-container .exam-shell{
    grid-template-columns:minmax(338px,354px) minmax(0,1fr)!important;
    gap:13px!important;
  }

  .exam-container .exam-sidebar{
    min-width:338px!important;
    padding:14px!important;
  }
}

/* Desktop: exactly twelve question buttons per row and no inner scrollbar. */
@media(min-width:901px){
  .exam-container .exam-sidebar .navigator{
    display:grid!important;
    width:100%!important;
    max-width:none!important;
    grid-template-columns:repeat(12,minmax(0,1fr))!important;
    grid-auto-rows:30px!important;
    gap:5px!important;
    margin:13px 0!important;
    padding:3px 0!important;
    max-height:none!important;
    height:auto!important;
    min-height:0!important;
    overflow:visible!important;
    scrollbar-width:none!important;
    align-content:start!important;
  }

  .exam-container .exam-sidebar .navigator::-webkit-scrollbar{
    display:none!important;
    width:0!important;
    height:0!important;
  }

  .exam-container .exam-sidebar .navigator button{
    width:100%!important;
    min-width:0!important;
    height:30px!important;
    padding:0!important;
    border-radius:7px!important;
    font-size:.72rem!important;
    letter-spacing:-.015em;
  }
}

/* Mobile keeps its existing compact layout rather than forcing 12 columns. */
@media(max-width:900px){
  .exam-container .exam-sidebar .navigator{
    grid-template-columns:repeat(9,minmax(0,1fr))!important;
    max-height:none!important;
    overflow:visible!important;
  }
}

/* =========================================================
   v3.13.0 — Clear answer and all-answered inline submit
   ========================================================= */
.question-actions{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:14px!important;
  margin-top:28px;
}

.question-action-group{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.question-action-left{
  justify-content:flex-start;
}

.question-action-right{
  justify-content:flex-end;
  margin-left:auto;
}

.question-actions .clear-answer{
  min-width:88px;
  border:1px solid rgba(190,58,70,.34)!important;
  background:color-mix(in srgb,#ef4444 8%,var(--surface))!important;
  color:color-mix(in srgb,#b42332 82%,var(--text))!important;
  box-shadow:none!important;
}

.question-actions .clear-answer:hover:not(:disabled){
  border-color:#d63b4c!important;
  background:color-mix(in srgb,#ef4444 15%,var(--surface))!important;
}

.question-actions .clear-answer:disabled{
  opacity:.42!important;
  cursor:not-allowed!important;
  filter:grayscale(.25);
  transform:none!important;
}

.question-actions .inline-submit{
  min-width:100px;
  white-space:nowrap;
  background:linear-gradient(135deg,#d92f4c,#ef5269)!important;
  color:#fff!important;
  box-shadow:0 10px 22px rgba(217,47,76,.22)!important;
  animation:inlineSubmitReveal .26s cubic-bezier(.2,.8,.2,1) both;
}

.question-actions .inline-submit[hidden]{
  display:none!important;
}

.exam-shell.all-questions-answered .question-action-right .next{
  transform:translateX(-2px);
}

@keyframes inlineSubmitReveal{
  from{
    opacity:0;
    transform:translateX(12px) scale(.94);
  }
  to{
    opacity:1;
    transform:translateX(0) scale(1);
  }
}

html[data-theme="dark"] .question-actions .clear-answer{
  border-color:#a94855!important;
  background:#321b22!important;
  color:#ffc7ce!important;
}

html[data-theme="dark"] .question-actions .clear-answer:hover:not(:disabled){
  border-color:#ef6f7e!important;
  background:#47232c!important;
}

html[data-theme="dark"] .question-actions .inline-submit{
  background:linear-gradient(135deg,#be2944,#f05269)!important;
  box-shadow:0 10px 24px rgba(0,0,0,.30)!important;
}

@media(max-width:620px){
  .question-actions{
    display:grid!important;
    grid-template-columns:1fr;
    gap:10px!important;
  }

  .question-action-group{
    width:100%;
    justify-content:space-between;
  }

  .question-action-group .btn{
    flex:1 1 0;
    min-width:0;
  }

  .question-action-right{
    margin-left:0;
  }
}

@media(prefers-reduced-motion:reduce){
  .question-actions .inline-submit{
    animation:none!important;
  }

  .exam-shell.all-questions-answered .question-action-right .next{
    transform:none!important;
  }
}

/* =========================================================
   v3.13.3 — Nested Notes and Papers exam-family menus
   ========================================================= */
.header-nav-hierarchical-menu{
  width:330px!important;
  padding:8px!important;
}

.header-nav-nested{
  position:relative;
  display:block;
}

.header-nav-nested>summary{
  display:grid;
  grid-template-columns:minmax(0,1fr) 18px;
  align-items:center;
  gap:10px;
  min-height:52px;
  padding:10px 11px;
  border:1px solid transparent;
  border-radius:11px;
  color:var(--text);
  cursor:pointer;
  list-style:none;
  user-select:none;
  transition:background .17s ease,border-color .17s ease,transform .17s ease;
}

.header-nav-nested>summary::-webkit-details-marker{display:none}
.header-nav-nested>summary::marker{display:none;content:""}

.header-nav-nested>summary>span{
  display:grid;
  min-width:0;
  gap:3px;
}

.header-nav-nested>summary strong{
  color:var(--text);
  font-size:.88rem;
  line-height:1.18;
}

.header-nav-nested>summary small{
  color:var(--muted);
  font-size:.67rem;
  font-weight:650;
  line-height:1.3;
}

.header-nav-nested>summary i{
  position:relative;
  display:block;
  width:18px;
  height:18px;
}

.header-nav-nested>summary i::before,
.header-nav-nested>summary i::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:8px;
  height:2px;
  border-radius:999px;
  background:var(--muted);
  transform-origin:right center;
  transition:transform .2s ease,background .2s ease;
}

.header-nav-nested>summary i::before{
  transform:translate(-58%,-50%) rotate(45deg);
}

.header-nav-nested>summary i::after{
  transform:translate(-58%,-50%) rotate(-45deg);
}

.header-nav-nested[open]>summary i::before{
  transform:translate(-68%,-30%) rotate(45deg);
}

.header-nav-nested[open]>summary i::after{
  transform:translate(-18%,-30%) rotate(-45deg);
}

.header-nav-nested>summary:hover,
.header-nav-nested>summary:focus-visible,
.header-nav-nested[open]>summary{
  border-color:color-mix(in srgb,#61A5C2 34%,var(--minimal-border));
  background:color-mix(in srgb,#A9D6E5 19%,var(--surface-2));
  transform:translateX(2px);
}

.header-nav-nested>summary:focus-visible{
  outline:2px solid var(--minimal-primary);
  outline-offset:1px;
}

.header-nav-nested-menu{
  display:none;
  gap:5px;
  margin:3px 4px 7px 16px;
  padding:7px 0 2px 9px;
  border-left:2px solid color-mix(in srgb,var(--minimal-primary) 32%,transparent);
}

.header-nav-nested[open]>.header-nav-nested-menu{
  display:grid;
  animation:headerNestedIn .19s ease both;
}

.header-nav-nested-menu a,
.header-nav-nested-link{
  display:grid!important;
  gap:2px;
  min-height:45px;
  padding:8px 10px!important;
  border-radius:10px;
  color:var(--text)!important;
  background:color-mix(in srgb,var(--surface-2) 76%,transparent);
  font-size:.82rem!important;
  font-weight:800!important;
  line-height:1.2;
  text-decoration:none!important;
  transition:background .16s ease,transform .16s ease!important;
}

.header-nav-nested-menu a:hover,
.header-nav-nested-menu a:focus-visible{
  background:color-mix(in srgb,#A9D6E5 28%,var(--surface-2));
  transform:translateX(3px);
}

.header-nav-nested-menu a:focus-visible{
  outline:2px solid var(--minimal-primary);
  outline-offset:1px;
}

.header-nav-nested-menu a span,
.header-nav-nested-link span{
  color:var(--text);
  font-size:.82rem;
  font-weight:850;
}

.header-nav-nested-menu a small,
.header-nav-nested-link small{
  color:var(--muted);
  font-size:.65rem;
  font-weight:650;
}

.header-nav-nested-link.is-disabled{
  cursor:not-allowed;
  opacity:.56;
  filter:saturate(.55);
  border:1px dashed color-mix(in srgb,var(--muted) 28%,transparent);
}

html[data-theme="dark"] .header-nav-nested>summary:hover,
html[data-theme="dark"] .header-nav-nested>summary:focus-visible,
html[data-theme="dark"] .header-nav-nested[open]>summary{
  background:rgba(42,111,151,.24);
  border-color:rgba(97,165,194,.42);
}

html[data-theme="dark"] .header-nav-nested-menu a,
html[data-theme="dark"] .header-nav-nested-link{
  background:rgba(21,42,59,.76);
}

@keyframes headerNestedIn{
  from{opacity:0;transform:translateY(-5px)}
  to{opacity:1;transform:translateY(0)}
}

/* Mobile nested family groups. */
.mobile-nav-family-list{
  gap:6px!important;
}

.mobile-nav-subgroup{
  display:block;
  border-radius:12px;
}

.mobile-nav-subgroup>summary{
  display:grid;
  grid-template-columns:minmax(0,1fr) 18px;
  align-items:center;
  gap:9px;
  min-height:50px;
  padding:9px 10px;
  border:1px solid var(--minimal-border);
  border-radius:11px;
  background:var(--surface-2);
  color:var(--text);
  cursor:pointer;
  list-style:none;
  transition:background .17s ease,border-color .17s ease,transform .17s ease;
}

.mobile-nav-subgroup>summary::-webkit-details-marker{display:none}
.mobile-nav-subgroup>summary::marker{display:none;content:""}

.mobile-nav-subgroup>summary>span{
  display:grid;
  gap:3px;
  min-width:0;
}

.mobile-nav-subgroup>summary strong{
  font-size:.84rem;
}

.mobile-nav-subgroup>summary small{
  color:var(--muted);
  font-size:.65rem;
  font-weight:650;
}

.mobile-nav-subgroup>summary i{
  position:relative;
  display:block;
  width:18px;
  height:18px;
}

.mobile-nav-subgroup>summary i::before,
.mobile-nav-subgroup>summary i::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:11px;
  height:2px;
  border-radius:999px;
  background:var(--muted);
  transform:translate(-50%,-50%);
  transition:transform .2s ease,opacity .2s ease;
}

.mobile-nav-subgroup>summary i::after{
  transform:translate(-50%,-50%) rotate(90deg);
}

.mobile-nav-subgroup[open]>summary i::after{
  opacity:0;
  transform:translate(-50%,-50%) rotate(0);
}

.mobile-nav-subgroup>summary:hover,
.mobile-nav-subgroup>summary:focus-visible,
.mobile-nav-subgroup[open]>summary{
  background:color-mix(in srgb,#A9D6E5 23%,var(--surface-2));
  border-color:color-mix(in srgb,#61A5C2 42%,var(--minimal-border));
}

.mobile-nav-subgroup>summary:focus-visible{
  outline:2px solid var(--minimal-primary);
  outline-offset:1px;
}

.mobile-nav-nested-submenu{
  display:none;
  gap:5px;
  margin:5px 0 7px 12px;
  padding:6px 0 1px 8px;
  border-left:2px solid color-mix(in srgb,var(--minimal-primary) 30%,transparent);
}

.mobile-nav-subgroup[open]>.mobile-nav-nested-submenu{
  display:grid;
  animation:mobileNestedIn .2s ease both;
}

.mobile-nav-nested-submenu a,
.mobile-nav-disabled-link{
  display:grid;
  gap:2px;
  min-height:44px;
  padding:8px 10px;
  border-radius:10px;
  background:color-mix(in srgb,var(--surface) 82%,var(--surface-2));
  color:var(--text)!important;
  text-decoration:none!important;
}

.mobile-nav-nested-submenu a:hover,
.mobile-nav-nested-submenu a:focus-visible{
  background:color-mix(in srgb,#A9D6E5 27%,var(--surface-2));
  transform:translateX(2px);
}

.mobile-nav-nested-submenu a:focus-visible{
  outline:2px solid var(--minimal-primary);
  outline-offset:1px;
}

.mobile-nav-nested-submenu strong,
.mobile-nav-disabled-link strong{
  font-size:.8rem;
}

.mobile-nav-nested-submenu small,
.mobile-nav-disabled-link small{
  color:var(--muted);
  font-size:.63rem;
  font-weight:650;
}

.mobile-nav-disabled-link{
  opacity:.56;
  cursor:not-allowed;
  border:1px dashed color-mix(in srgb,var(--muted) 28%,transparent);
}

@keyframes mobileNestedIn{
  from{opacity:0;transform:translateY(-5px)}
  to{opacity:1;transform:translateY(0)}
}

@media(min-width:821px){
  .mobile-nav-subgroup,
  .mobile-nav-nested-submenu{
    animation:none;
  }
}

@media(prefers-reduced-motion:reduce){
  .header-nav-nested[open]>.header-nav-nested-menu,
  .mobile-nav-subgroup[open]>.mobile-nav-nested-submenu{
    animation:none!important;
  }
}

/* =========================================================
   v3.13.4 — Desktop right-side flyout submenus
   Hovering SSW, JLPT, NAT or JLCT opens its submenu to the right.
   ========================================================= */
@media(min-width:821px){
  /* The top-level list must not clip the absolutely positioned flyout. */
  .header-nav-hierarchical-menu{
    overflow:visible!important;
    max-height:none!important;
    width:318px!important;
  }

  .header-nav-hierarchical-menu .header-nav-nested{
    position:relative!important;
  }

  .header-nav-hierarchical-menu .header-nav-nested>summary{
    min-height:56px;
    padding:10px 12px;
    transform:none!important;
  }

  /* Keep the arrow pointing toward the right-side submenu. */
  .header-nav-hierarchical-menu .header-nav-nested>summary i::before{
    transform:translate(-58%,-50%) rotate(45deg)!important;
  }

  .header-nav-hierarchical-menu .header-nav-nested>summary i::after{
    transform:translate(-58%,-50%) rotate(-45deg)!important;
  }

  .header-nav-hierarchical-menu .header-nav-nested[open]>summary{
    border-color:color-mix(in srgb,#61A5C2 48%,var(--minimal-border));
    background:color-mix(in srgb,#A9D6E5 25%,var(--surface-2));
    box-shadow:inset 3px 0 0 var(--minimal-primary);
  }

  /* Flyout menu: always opens beside the hovered item, on the right. */
  .header-nav-hierarchical-menu .header-nav-nested-menu{
    position:absolute!important;
    z-index:1325!important;
    top:-7px!important;
    left:calc(100% + 11px)!important;
    right:auto!important;
    display:none;
    width:252px!important;
    min-width:252px!important;
    max-height:min(420px,calc(100dvh - 105px))!important;
    margin:0!important;
    padding:8px!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    border:1px solid var(--minimal-border)!important;
    border-left:1px solid var(--minimal-border)!important;
    border-radius:15px!important;
    background:var(--minimal-surface)!important;
    box-shadow:0 22px 54px rgba(1,42,74,.27)!important;
    transform-origin:left top;
  }

  .header-nav-hierarchical-menu .header-nav-nested[open]>.header-nav-nested-menu{
    display:grid!important;
    animation:headerFlyoutRightIn .2s cubic-bezier(.2,.75,.25,1) both!important;
  }

  /*
   * Invisible hover bridge across the physical gap between both panels.
   * This prevents accidental closing while moving the pointer right.
   */
  .header-nav-hierarchical-menu .header-nav-nested-menu::before{
    content:"";
    position:absolute;
    top:0;
    bottom:0;
    left:-13px;
    width:13px;
  }

  /* Small visual pointer aimed at the hovered main item. */
  .header-nav-hierarchical-menu .header-nav-nested-menu::after{
    content:"";
    position:absolute;
    top:23px;
    left:-7px;
    width:12px;
    height:12px;
    border-left:1px solid var(--minimal-border);
    border-bottom:1px solid var(--minimal-border);
    background:var(--minimal-surface);
    transform:rotate(45deg);
  }

  .header-nav-hierarchical-menu .header-nav-nested-menu a,
  .header-nav-hierarchical-menu .header-nav-nested-link{
    position:relative;
    z-index:1;
    min-height:48px;
    background:color-mix(in srgb,var(--surface-2) 82%,transparent);
  }

  .header-nav-hierarchical-menu .header-nav-nested-menu a:hover,
  .header-nav-hierarchical-menu .header-nav-nested-menu a:focus-visible{
    transform:translateX(3px)!important;
  }

  html[data-theme="dark"] .header-nav-hierarchical-menu .header-nav-nested-menu{
    background:#111c2a!important;
    border-color:#2A6F97!important;
    box-shadow:0 24px 58px rgba(0,0,0,.42)!important;
  }

  html[data-theme="dark"] .header-nav-hierarchical-menu .header-nav-nested-menu::after{
    background:#111c2a;
    border-color:#2A6F97;
  }

  @keyframes headerFlyoutRightIn{
    from{
      opacity:0;
      transform:translateX(-8px) scale(.975);
    }
    to{
      opacity:1;
      transform:translateX(0) scale(1);
    }
  }
}

@media(prefers-reduced-motion:reduce){
  .header-nav-hierarchical-menu .header-nav-nested[open]>.header-nav-nested-menu{
    animation:none!important;
  }
}


/* v3.13.9 — JFT model-style question illustration */
.exam-question-visual{display:flex;justify-content:center;margin:4px 0 18px}
.exam-question-visual-shell{display:block;width:min(520px,100%);max-width:100%}
.exam-question-image{display:block;width:100%;max-width:520px;aspect-ratio:13/8;object-fit:contain;margin:0;border-radius:16px;background:#fff}
.review-question-visual{justify-content:flex-start;margin-top:10px}
.review-question-image{width:min(420px,100%)}
@media(max-width:700px){.exam-question-visual{margin-bottom:14px}.exam-question-image{max-width:100%;border-radius:12px}.review-question-image{width:100%}}


/* =========================================================
   v3.14.5 — Clickable dropdown hubs and family landing pages
   ========================================================= */
.header-nav-dropdown > summary{
  gap:7px!important;
}

.header-nav-summary-link{
  display:inline-flex!important;
  align-items:center;
  min-height:30px;
  padding:0!important;
  border:0!important;
  border-radius:5px;
  background:transparent!important;
  color:inherit!important;
  font:inherit!important;
  font-weight:inherit!important;
  line-height:inherit!important;
  text-decoration:none!important;
  opacity:1!important;
  white-space:nowrap;
}

.header-nav-summary-link::after{
  display:none!important;
}

.header-nav-summary-link:focus-visible{
  outline:2px solid #A9D6E5;
  outline-offset:3px;
}

.header-nav-main-toggle{
  position:relative;
  display:block;
  width:15px;
  height:15px;
  flex:0 0 15px;
  cursor:pointer;
}

.header-nav-main-toggle::before,
.header-nav-main-toggle::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:7px;
  height:2px;
  border-radius:99px;
  background:currentColor;
  opacity:.86;
  transition:transform .18s ease;
}

.header-nav-main-toggle::before{
  transform:translate(-76%,-42%) rotate(45deg);
}

.header-nav-main-toggle::after{
  transform:translate(-22%,-42%) rotate(-45deg);
}

.header-nav-dropdown[open] > summary .header-nav-main-toggle::before{
  transform:translate(-76%,-58%) rotate(-45deg);
}

.header-nav-dropdown[open] > summary .header-nav-main-toggle::after{
  transform:translate(-22%,-58%) rotate(45deg);
}

.header-nav-nested > summary{
  grid-template-columns:minmax(0,1fr) 18px!important;
}

.header-nav-dropdown-menu .header-nav-family-link{
  display:block!important;
  min-width:0!important;
  min-height:0!important;
  padding:0!important;
  border:0!important;
  border-radius:7px!important;
  background:transparent!important;
  box-shadow:none!important;
  color:inherit!important;
  text-decoration:none!important;
  transform:none!important;
}

.header-nav-dropdown-menu .header-nav-family-link:hover,
.header-nav-dropdown-menu .header-nav-family-link:focus-visible{
  background:transparent!important;
  transform:none!important;
}

.header-nav-family-link > span{
  display:grid;
  min-width:0;
  gap:3px;
}

.header-nav-family-link:focus-visible{
  outline:2px solid var(--minimal-primary);
  outline-offset:3px;
}

.mobile-nav-group > summary{
  grid-template-columns:minmax(0,1fr) 18px!important;
}

.mobile-nav-group-main-link{
  display:grid!important;
  grid-template-columns:38px minmax(0,1fr);
  align-items:center;
  gap:10px;
  min-width:0;
  color:inherit!important;
  text-decoration:none!important;
}

.mobile-nav-group-main-link > span:nth-child(2){
  display:grid;
  gap:2px;
  min-width:0;
}

.mobile-nav-group-main-link:focus-visible{
  outline:2px solid var(--minimal-primary);
  outline-offset:3px;
  border-radius:9px;
}

.mobile-nav-subgroup > summary{
  grid-template-columns:minmax(0,1fr) 18px!important;
}

.mobile-nav-family-link{
  display:block;
  min-width:0;
  color:inherit!important;
  text-decoration:none!important;
}

.mobile-nav-family-link > span{
  display:grid;
  gap:3px;
  min-width:0;
}

.mobile-nav-family-link:focus-visible{
  outline:2px solid var(--minimal-primary);
  outline-offset:3px;
  border-radius:8px;
}

.dropdown-hub-main{
  width:100%;
}

.dropdown-hub-hero,
.dropdown-family-page-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  margin:0 0 24px;
  padding:clamp(24px,4vw,42px);
  border:1px solid var(--minimal-border);
  border-radius:24px;
  background:
    radial-gradient(circle at 90% 10%,color-mix(in srgb,#89C2D9 22%,transparent),transparent 42%),
    linear-gradient(145deg,var(--surface),var(--surface-2));
  box-shadow:var(--minimal-shadow);
  overflow:hidden;
}

.dropdown-hub-hero h1,
.dropdown-family-page-head h1{
  margin:.25rem 0 .55rem;
  font-size:clamp(2rem,4vw,3.35rem);
  line-height:1.04;
}

.dropdown-hub-hero p,
.dropdown-family-page-head p{
  max-width:760px;
  margin:0;
  color:var(--muted);
  font-weight:650;
  line-height:1.75;
}

.dropdown-hub-count{
  display:grid;
  place-items:center;
  min-width:150px;
  min-height:126px;
  padding:18px;
  border:1px solid color-mix(in srgb,var(--minimal-primary) 25%,var(--minimal-border));
  border-radius:20px;
  background:color-mix(in srgb,var(--surface) 84%,transparent);
  text-align:center;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}

.dropdown-hub-count strong{
  color:var(--minimal-primary);
  font-size:2.35rem;
  line-height:1;
}

.dropdown-hub-count span{
  margin-top:7px;
  color:var(--muted);
  font-size:.72rem;
  font-weight:850;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.dropdown-family-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  margin-bottom:30px;
}

.dropdown-family-card{
  display:flex;
  flex-direction:column;
  min-width:0;
  min-height:430px;
  padding:22px;
  border:1px solid var(--minimal-border);
  border-radius:22px;
  background:linear-gradient(155deg,var(--surface),var(--surface-2));
  box-shadow:var(--minimal-shadow);
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}

.dropdown-family-card:hover{
  transform:translateY(-3px);
  border-color:color-mix(in srgb,var(--minimal-primary) 42%,var(--minimal-border));
  box-shadow:0 22px 48px color-mix(in srgb,var(--minimal-primary) 13%,transparent);
}

.dropdown-family-card-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.dropdown-family-mark{
  display:grid;
  place-items:center;
  width:62px;
  height:62px;
  border-radius:18px;
  background:color-mix(in srgb,var(--minimal-primary) 16%,var(--surface-2));
  color:var(--minimal-primary);
  font-size:1.45rem;
  font-weight:950;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--minimal-primary) 22%,transparent);
}

.dropdown-family-status{
  padding:7px 10px;
  border-radius:999px;
  font-size:.65rem;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.dropdown-family-status.is-live{
  background:color-mix(in srgb,#2f9e67 16%,var(--surface-2));
  color:#278458;
}

.dropdown-family-status.is-planned{
  background:color-mix(in srgb,#d99b2b 16%,var(--surface-2));
  color:#a66d07;
}

.dropdown-family-copy{
  display:grid;
  gap:5px;
  margin:20px 0 14px;
}

.dropdown-family-copy h2{
  margin:0;
  font-size:1.75rem;
}

.dropdown-family-copy > strong,
.dropdown-card-subtitle{
  color:var(--minimal-primary);
  font-size:.78rem;
  font-weight:850;
}

.dropdown-family-copy p{
  min-height:52px;
  margin:3px 0 0;
  color:var(--muted);
  line-height:1.65;
}

.dropdown-family-items{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin:0 0 18px;
}

.dropdown-family-items span{
  padding:6px 9px;
  border:1px solid var(--minimal-border);
  border-radius:999px;
  background:var(--surface);
  color:var(--text);
  font-size:.68rem;
  font-weight:850;
}

.dropdown-family-stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin:auto 0 18px;
}

.dropdown-family-stats div{
  display:grid;
  gap:4px;
  padding:12px 8px;
  border:1px solid var(--minimal-border);
  border-radius:13px;
  background:color-mix(in srgb,var(--surface-2) 82%,transparent);
  text-align:center;
}

.dropdown-family-stats strong{
  color:var(--text);
  font-size:1.15rem;
}

.dropdown-family-stats span{
  color:var(--muted);
  font-size:.6rem;
  font-weight:800;
  text-transform:uppercase;
}

.dropdown-hub-breadcrumb{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  margin-bottom:10px;
  color:var(--muted);
  font-size:.78rem;
  font-weight:800;
}

.dropdown-hub-breadcrumb a{
  color:var(--minimal-primary);
  text-decoration:none;
}

.dropdown-child-grid{
  margin-bottom:30px;
}

.progress-hub-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  margin-bottom:30px;
}

.progress-hub-card{
  display:flex;
  flex-direction:column;
  min-height:330px;
  padding:24px;
  border:1px solid var(--minimal-border);
  border-radius:22px;
  background:linear-gradient(155deg,var(--surface),var(--surface-2));
  box-shadow:var(--minimal-shadow);
}

.progress-hub-icon{
  display:grid;
  place-items:center;
  width:64px;
  height:64px;
  margin-bottom:20px;
  border-radius:19px;
  background:color-mix(in srgb,var(--minimal-primary) 16%,var(--surface-2));
  color:var(--minimal-primary);
  font-size:1.5rem;
  font-weight:950;
}

.progress-hub-card h2{
  margin:.3rem 0 .55rem;
  font-size:1.45rem;
}

.progress-hub-card p{
  margin:0 0 22px;
  color:var(--muted);
  line-height:1.7;
}

.progress-hub-card .btn{
  margin-top:auto;
}

@media(max-width:900px){
  .dropdown-family-grid,
  .progress-hub-grid{
    grid-template-columns:1fr;
  }

  .dropdown-hub-hero,
  .dropdown-family-page-head{
    align-items:flex-start;
    flex-direction:column;
  }

  .dropdown-hub-count{
    width:100%;
    min-height:96px;
  }
}

@media(max-width:620px){
  .dropdown-hub-hero,
  .dropdown-family-page-head{
    padding:22px 18px;
    border-radius:19px;
  }

  .dropdown-family-card,
  .progress-hub-card{
    min-height:0;
    padding:19px;
    border-radius:18px;
  }

  .dropdown-family-stats{
    grid-template-columns:1fr;
  }
}

@media(prefers-reduced-motion:reduce){
  .dropdown-family-card{
    transition:none;
  }
}


/* =========================================================
   v3.14.6 — Floating centered pill header
   Visual reference: compact white floating navigation capsule.
   Existing tabs, links, dropdowns and mobile drawer are preserved.
   ========================================================= */
@media (min-width: 1181px) {
  .topbar {
    position: sticky !important;
    top: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(230px, 1fr) auto minmax(72px, 1fr) !important;
    align-items: center !important;
    min-height: 82px !important;
    padding: 13px clamp(18px, 3vw, 54px) !important;
    gap: 22px !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    isolation: isolate;
  }

  .topbar::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    pointer-events: none;
    background:
      linear-gradient(
        180deg,
        color-mix(in srgb, var(--bg) 84%, transparent) 0%,
        color-mix(in srgb, var(--bg) 55%, transparent) 72%,
        transparent 100%
      );
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    mask-image: linear-gradient(#000 0 72%, transparent 100%);
  }

  .brand-logo-link {
    grid-column: 1 !important;
    justify-self: start !important;
    min-height: 48px !important;
    padding: 5px 14px 5px 7px !important;
    border: 1px solid rgba(255, 255, 255, .72) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, .90) !important;
    color: #152434 !important;
    box-shadow:
      0 10px 30px rgba(13, 43, 72, .12),
      inset 0 1px 0 rgba(255, 255, 255, .95) !important;
    -webkit-backdrop-filter: blur(18px) saturate(145%);
    backdrop-filter: blur(18px) saturate(145%);
  }

  .brand-logo-link:hover {
    transform: translateY(-1px);
    opacity: 1 !important;
    box-shadow:
      0 14px 34px rgba(13, 43, 72, .16),
      inset 0 1px 0 rgba(255, 255, 255, .96) !important;
  }

  .brand-logo-icon {
    width: 38px !important;
    height: 38px !important;
    flex-basis: 38px !important;
    border-radius: 50% !important;
    box-shadow: 0 5px 14px rgba(13, 43, 72, .16) !important;
  }

  .brand-wordmark-copy strong {
    color: #162738 !important;
    font-size: .84rem !important;
  }

  .brand-wordmark-copy small {
    color: #327ba2 !important;
    font-size: .58rem !important;
  }

  .topbar-right {
    display: contents !important;
  }

  .mobile-nav-toggle {
    display: none !important;
  }

  .primary-nav {
    grid-column: 2 !important;
    justify-self: center !important;
    display: flex !important;
    align-items: center !important;
    gap: 1px !important;
    width: max-content !important;
    max-width: min(74vw, 920px) !important;
    min-height: 52px !important;
    padding: 6px !important;
    border: 1px solid rgba(255, 255, 255, .78) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, .92) !important;
    box-shadow:
      0 14px 38px rgba(10, 40, 67, .14),
      inset 0 1px 0 rgba(255, 255, 255, 1) !important;
    -webkit-backdrop-filter: blur(22px) saturate(145%);
    backdrop-filter: blur(22px) saturate(145%);
    overflow: visible !important;
  }

  .primary-nav > a,
  .primary-nav > .header-nav-dropdown > summary {
    min-height: 39px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: #1b2b3a !important;
    box-shadow: none !important;
    transition:
      background .18s ease,
      color .18s ease,
      transform .18s ease,
      box-shadow .18s ease !important;
  }

  .primary-nav > a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 12px !important;
    color: #1b2b3a !important;
    font-size: .73rem !important;
    font-weight: 760 !important;
    letter-spacing: -.01em !important;
    white-space: nowrap !important;
    text-decoration: none !important;
  }

  .primary-nav > .header-nav-dropdown > summary {
    padding: 0 9px 0 12px !important;
    gap: 4px !important;
  }

  .primary-nav .header-nav-summary-link {
    color: #1b2b3a !important;
    font-size: .73rem !important;
    font-weight: 760 !important;
  }

  .primary-nav .header-nav-main-toggle {
    width: 12px !important;
    height: 12px !important;
    flex-basis: 12px !important;
    color: #607182 !important;
  }

  .primary-nav > a::after,
  .primary-nav .header-nav-summary-link::after {
    display: none !important;
  }

  .primary-nav > a:hover,
  .primary-nav > .header-nav-dropdown > summary:hover {
    background: #edf3f7 !important;
    color: #122334 !important;
    transform: translateY(-1px);
  }

  .primary-nav > a.is-active,
  .primary-nav > a[aria-current="page"],
  .primary-nav > .header-nav-dropdown.is-active > summary,
  .primary-nav > .header-nav-dropdown[open] > summary {
    background: #172536 !important;
    color: #fff !important;
    box-shadow: 0 7px 18px rgba(17, 34, 51, .22) !important;
  }

  .primary-nav > .header-nav-dropdown.is-active > summary .header-nav-summary-link,
  .primary-nav > .header-nav-dropdown[open] > summary .header-nav-summary-link,
  .primary-nav > .header-nav-dropdown.is-active > summary .header-nav-main-toggle,
  .primary-nav > .header-nav-dropdown[open] > summary .header-nav-main-toggle {
    color: #fff !important;
  }

  .primary-nav > a.is-active:hover,
  .primary-nav > a[aria-current="page"]:hover,
  .primary-nav > .header-nav-dropdown.is-active > summary:hover,
  .primary-nav > .header-nav-dropdown[open] > summary:hover {
    background: #101d2b !important;
    color: #fff !important;
  }

  .compact-profile-menu {
    grid-column: 3 !important;
    justify-self: end !important;
    position: relative !important;
    z-index: 1002 !important;
  }

  .compact-profile-menu > summary {
    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 5px !important;
    border: 1px solid rgba(255, 255, 255, .74) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, .91) !important;
    box-shadow:
      0 10px 30px rgba(13, 43, 72, .14),
      inset 0 1px 0 rgba(255, 255, 255, .96) !important;
    -webkit-backdrop-filter: blur(18px) saturate(145%);
    backdrop-filter: blur(18px) saturate(145%);
  }

  .compact-profile-menu > summary:hover,
  .compact-profile-menu[open] > summary {
    background: #fff !important;
    border-color: rgba(93, 143, 174, .42) !important;
    transform: translateY(-1px);
  }

  .compact-profile-menu .profile-avatar-button {
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    box-shadow: 0 4px 12px rgba(17, 42, 67, .17) !important;
  }

  .header-nav-dropdown-menu {
    margin-top: 10px !important;
  }
}

@media (min-width: 821px) and (max-width: 1180px) {
  .topbar {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    min-height: 72px !important;
    padding: 10px 18px !important;
    gap: 12px !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .topbar::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: color-mix(in srgb, var(--bg) 82%, transparent);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
  }

  .brand-logo-link {
    justify-self: start !important;
    padding: 4px 11px 4px 6px !important;
    border: 1px solid rgba(255,255,255,.72) !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.90) !important;
    box-shadow: 0 9px 26px rgba(13,43,72,.12) !important;
  }

  .brand-wordmark-copy strong { color: #162738 !important; }
  .brand-wordmark-copy small { color: #327ba2 !important; }

  .topbar-right {
    display: flex !important;
    justify-self: end !important;
    width: auto !important;
    gap: 9px !important;
  }

  .primary-nav {
    display: none !important;
  }

  .mobile-nav-toggle {
    display: inline-flex !important;
    width: 48px !important;
    height: 48px !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.92) !important;
    border: 1px solid rgba(255,255,255,.78) !important;
    box-shadow: 0 10px 30px rgba(13,43,72,.14) !important;
  }

  .compact-profile-menu > summary {
    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;
    padding: 5px !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.92) !important;
    border: 1px solid rgba(255,255,255,.78) !important;
    box-shadow: 0 10px 30px rgba(13,43,72,.14) !important;
  }

  .compact-profile-menu .profile-avatar-button {
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
  }
}

@media (max-width: 820px) {
  .topbar {
    background: color-mix(in srgb, var(--bg) 84%, transparent) !important;
    border-bottom: 0 !important;
    box-shadow: 0 8px 26px rgba(13, 43, 72, .08) !important;
    -webkit-backdrop-filter: blur(18px) saturate(135%);
    backdrop-filter: blur(18px) saturate(135%);
  }

  .brand-logo-link {
    padding: 4px 10px 4px 5px !important;
    border: 1px solid rgba(255,255,255,.68) !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.89) !important;
    box-shadow: 0 8px 24px rgba(13,43,72,.11) !important;
  }

  .brand-wordmark-copy strong { color: #162738 !important; }
  .brand-wordmark-copy small { color: #327ba2 !important; }

  .mobile-nav-toggle,
  .compact-profile-menu > summary {
    border-radius: 999px !important;
    background: rgba(255,255,255,.92) !important;
    border-color: rgba(255,255,255,.76) !important;
    box-shadow: 0 8px 24px rgba(13,43,72,.12) !important;
  }

  .compact-profile-menu .profile-avatar-button {
    border-radius: 50% !important;
  }
}

html[data-theme="dark"] .brand-logo-link,
html[data-theme="dark"] .primary-nav,
html[data-theme="dark"] .compact-profile-menu > summary,
html[data-theme="dark"] .mobile-nav-toggle {
  border-color: rgba(255,255,255,.12) !important;
  background: rgba(16, 27, 40, .88) !important;
  box-shadow:
    0 14px 38px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.055) !important;
}

html[data-theme="dark"] .brand-wordmark-copy strong,
html[data-theme="dark"] .primary-nav > a,
html[data-theme="dark"] .primary-nav .header-nav-summary-link {
  color: #eef5fb !important;
}

html[data-theme="dark"] .brand-wordmark-copy small {
  color: #86c6e6 !important;
}

html[data-theme="dark"] .primary-nav > a:hover,
html[data-theme="dark"] .primary-nav > .header-nav-dropdown > summary:hover {
  background: rgba(255,255,255,.08) !important;
  color: #fff !important;
}

html[data-theme="dark"] .primary-nav > a.is-active,
html[data-theme="dark"] .primary-nav > a[aria-current="page"],
html[data-theme="dark"] .primary-nav > .header-nav-dropdown.is-active > summary,
html[data-theme="dark"] .primary-nav > .header-nav-dropdown[open] > summary {
  background: #f5f8fb !important;
  color: #122334 !important;
}

html[data-theme="dark"] .primary-nav > .header-nav-dropdown.is-active > summary .header-nav-summary-link,
html[data-theme="dark"] .primary-nav > .header-nav-dropdown[open] > summary .header-nav-summary-link,
html[data-theme="dark"] .primary-nav > .header-nav-dropdown.is-active > summary .header-nav-main-toggle,
html[data-theme="dark"] .primary-nav > .header-nav-dropdown[open] > summary .header-nav-main-toggle {
  color: #122334 !important;
}


/* =========================================================
   v3.14.7 — Website palette theme
   Palette:
   #C9A227  gold accent
   #0F172A  primary navy
   #475569  secondary slate
   #0F172A  deep ink
   Existing layout, tabs, links and dropdown behavior are preserved.
   ========================================================= */
:root {
  --jp-palette-gold: #C9A227;
  --jp-palette-navy: #0F172A;
  --jp-palette-slate: #475569;
  --jp-palette-ink: #0F172A;
  --jp-palette-page: #f3f4f8;
  --jp-palette-surface: #ffffff;
  --jp-palette-border: #d8dde6;
  --jp-palette-muted: #68778a;
  --jp-palette-gold-soft: rgba(201,162,39, .18);
  --jp-palette-shadow: rgba(0,0,0, .12);
}

html,
body {
  background: var(--jp-palette-page) !important;
  color: var(--jp-palette-navy) !important;
}

body,
input,
textarea,
select,
button {
  color: var(--jp-palette-navy);
}

::selection {
  background: var(--jp-palette-gold);
  color: var(--jp-palette-ink);
}

a {
  color: var(--jp-palette-slate);
}

a:hover {
  color: var(--jp-palette-ink);
}

h1, h2, h3, h4, h5, h6,
.section-title,
.page-title,
.card-title,
.modal-title,
.widget-title {
  color: var(--jp-palette-navy) !important;
}

small,
.text-muted,
.muted,
.helper-text,
.form-help,
.caption {
  color: var(--jp-palette-muted) !important;
}

hr {
  border-color: rgba(15,23,42, .10) !important;
}

.card,
.panel,
.surface,
.widget,
.box,
.modal-content,
.dropdown-menu,
.menu-panel,
.header-nav-dropdown-menu,
.table-wrap,
.lesson-card,
.paper-card,
.note-card,
.progress-card,
.stat-card,
.feature-card,
.blog-card,
.content-card {
  background: var(--jp-palette-surface) !important;
  border-color: rgba(15,23,42, .10) !important;
  box-shadow: 0 12px 30px var(--jp-palette-shadow) !important;
}

table,
.table,
.data-table {
  border-color: rgba(15,23,42, .12) !important;
}

table th,
.table th,
.data-table th {
  background: var(--jp-palette-navy) !important;
  color: #fff !important;
  border-color: rgba(255, 255, 255, .14) !important;
}

table td,
.table td,
.data-table td {
  border-color: rgba(15,23,42, .10) !important;
}

table tr:nth-child(even) td,
.table tbody tr:nth-child(even) td,
.data-table tbody tr:nth-child(even) td {
  background: rgba(71,85,105, .035) !important;
}

button,
.btn,
.button,
input[type="submit"],
input[type="button"],
input[type="reset"],
a.button,
a.btn,
[class*="btn-"] {
  border-color: var(--jp-palette-navy) !important;
  box-shadow: 0 8px 20px rgba(15,23,42, .12);
}

button,
.btn-primary,
.button-primary,
.primary-button,
.cta-button,
input[type="submit"] {
  background: var(--jp-palette-navy) !important;
  color: #fff !important;
}

button:hover,
.btn:hover,
.button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
a.button:hover,
a.btn:hover,
.btn-primary:hover,
.button-primary:hover,
.primary-button:hover,
.cta-button:hover {
  background: var(--jp-palette-ink) !important;
  color: #fff !important;
  border-color: var(--jp-palette-ink) !important;
}

.btn-secondary,
.button-secondary,
.secondary-button,
.btn-outline,
.outline-button {
  background: var(--jp-palette-slate) !important;
  border-color: var(--jp-palette-slate) !important;
  color: #fff !important;
}

.btn-secondary:hover,
.button-secondary:hover,
.secondary-button:hover,
.btn-outline:hover,
.outline-button:hover {
  background: var(--jp-palette-ink) !important;
  border-color: var(--jp-palette-ink) !important;
  color: #fff !important;
}

.badge,
.tag,
.chip,
.pill,
.label,
.status-badge,
.notice-badge {
  background: var(--jp-palette-gold-soft) !important;
  color: var(--jp-palette-ink) !important;
  border-color: rgba(201,162,39, .48) !important;
}

input,
textarea,
select {
  background: #fff !important;
  border-color: rgba(15,23,42, .18) !important;
}

input:focus,
textarea:focus,
select:focus {
  border-color: var(--jp-palette-gold) !important;
  box-shadow: 0 0 0 3px rgba(201,162,39, .28) !important;
  outline: none !important;
}

.topbar::before {
  background:
    linear-gradient(
      180deg,
      rgba(243, 244, 248, .95) 0%,
      rgba(243, 244, 248, .72) 72%,
      transparent 100%
    ) !important;
}

.brand-logo-link,
.primary-nav,
.compact-profile-menu > summary,
.mobile-nav-toggle {
  border-color: rgba(15,23,42, .10) !important;
  box-shadow:
    0 14px 34px rgba(0,0,0, .12),
    inset 0 1px 0 rgba(255, 255, 255, .96) !important;
}

.brand-logo-link {
  background: rgba(255, 255, 255, .96) !important;
}

.brand-logo-link:hover {
  box-shadow:
    0 16px 38px rgba(0,0,0, .16),
    inset 0 1px 0 rgba(255, 255, 255, .98) !important;
}

.brand-wordmark-copy strong {
  color: var(--jp-palette-navy) !important;
}

.brand-wordmark-copy small {
  color: var(--jp-palette-slate) !important;
}

.primary-nav {
  background: rgba(255, 255, 255, .95) !important;
}

.primary-nav > a,
.primary-nav .header-nav-summary-link {
  color: var(--jp-palette-navy) !important;
}

.primary-nav .header-nav-main-toggle {
  color: var(--jp-palette-slate) !important;
}

.primary-nav > a:hover,
.primary-nav > .header-nav-dropdown > summary:hover {
  background: rgba(201,162,39, .24) !important;
  color: var(--jp-palette-ink) !important;
}

.primary-nav > a.is-active,
.primary-nav > a[aria-current="page"],
.primary-nav > .header-nav-dropdown.is-active > summary,
.primary-nav > .header-nav-dropdown[open] > summary {
  background: var(--jp-palette-navy) !important;
  color: #fff !important;
  box-shadow: 0 8px 20px rgba(15,23,42, .24) !important;
}

.primary-nav > .header-nav-dropdown.is-active > summary .header-nav-summary-link,
.primary-nav > .header-nav-dropdown[open] > summary .header-nav-summary-link,
.primary-nav > .header-nav-dropdown.is-active > summary .header-nav-main-toggle,
.primary-nav > .header-nav-dropdown[open] > summary .header-nav-main-toggle {
  color: #fff !important;
}

.header-nav-dropdown-menu {
  background: rgba(255, 255, 255, .98) !important;
  border-color: rgba(15,23,42, .10) !important;
}

.header-nav-dropdown-menu a:hover,
.header-nav-dropdown-menu button:hover {
  background: rgba(201,162,39, .18) !important;
  color: var(--jp-palette-ink) !important;
}

.compact-profile-menu > summary:hover,
.compact-profile-menu[open] > summary,
.mobile-nav-toggle:hover {
  border-color: rgba(201,162,39, .52) !important;
  background: rgba(255, 255, 255, .98) !important;
}

.pagination a,
.pagination button,
.page-link {
  color: var(--jp-palette-navy) !important;
  border-color: rgba(15,23,42, .14) !important;
  background: #fff !important;
}

.pagination a:hover,
.pagination button:hover,
.page-link:hover {
  background: rgba(201,162,39, .20) !important;
  color: var(--jp-palette-ink) !important;
}

.pagination .active,
.pagination .active a,
.page-item.active .page-link {
  background: var(--jp-palette-navy) !important;
  border-color: var(--jp-palette-navy) !important;
  color: #fff !important;
}

.alert-success,
.notice-success {
  background: rgba(201,162,39, .18) !important;
  border-color: rgba(201,162,39, .48) !important;
  color: var(--jp-palette-ink) !important;
}

.alert-info,
.notice-info {
  background: rgba(71,85,105, .10) !important;
  border-color: rgba(71,85,105, .26) !important;
  color: var(--jp-palette-navy) !important;
}

.footer {
  background: var(--jp-palette-ink) !important;
  color: rgba(255, 255, 255, .86) !important;
}

.footer a {
  color: var(--jp-palette-gold) !important;
}

html[data-theme="dark"] body {
  background: #0f141d !important;
  color: #eef3f8 !important;
}

html[data-theme="dark"] .card,
html[data-theme="dark"] .panel,
html[data-theme="dark"] .surface,
html[data-theme="dark"] .widget,
html[data-theme="dark"] .box,
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .dropdown-menu,
html[data-theme="dark"] .menu-panel,
html[data-theme="dark"] .header-nav-dropdown-menu,
html[data-theme="dark"] .table-wrap,
html[data-theme="dark"] .lesson-card,
html[data-theme="dark"] .paper-card,
html[data-theme="dark"] .note-card,
html[data-theme="dark"] .progress-card,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .feature-card,
html[data-theme="dark"] .blog-card,
html[data-theme="dark"] .content-card {
  background: #1a2330 !important;
  border-color: rgba(255, 255, 255, .08) !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, .30) !important;
}

html[data-theme="dark"] a {
  color: var(--jp-palette-gold) !important;
}

html[data-theme="dark"] a:hover {
  color: #ffe2b3 !important;
}

html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] h5,
html[data-theme="dark"] h6,
html[data-theme="dark"] .section-title,
html[data-theme="dark"] .page-title,
html[data-theme="dark"] .card-title,
html[data-theme="dark"] .modal-title,
html[data-theme="dark"] .widget-title {
  color: #f8fbff !important;
}

html[data-theme="dark"] small,
html[data-theme="dark"] .text-muted,
html[data-theme="dark"] .muted,
html[data-theme="dark"] .helper-text,
html[data-theme="dark"] .form-help,
html[data-theme="dark"] .caption {
  color: #b5c3d3 !important;
}

html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select {
  background: #0F172A !important;
  border-color: rgba(255, 255, 255, .12) !important;
  color: #eef3f8 !important;
}

html[data-theme="dark"] .primary-nav > a,
html[data-theme="dark"] .primary-nav .header-nav-summary-link,
html[data-theme="dark"] .brand-wordmark-copy strong {
  color: #f2f7fc !important;
}

html[data-theme="dark"] .brand-wordmark-copy small,
html[data-theme="dark"] .primary-nav .header-nav-main-toggle {
  color: #d3dde8 !important;
}

html[data-theme="dark"] .primary-nav > a:hover,
html[data-theme="dark"] .primary-nav > .header-nav-dropdown > summary:hover {
  background: rgba(201,162,39, .18) !important;
  color: #fff !important;
}

html[data-theme="dark"] .primary-nav > a.is-active,
html[data-theme="dark"] .primary-nav > a[aria-current="page"],
html[data-theme="dark"] .primary-nav > .header-nav-dropdown.is-active > summary,
html[data-theme="dark"] .primary-nav > .header-nav-dropdown[open] > summary {
  background: var(--jp-palette-gold) !important;
  color: var(--jp-palette-ink) !important;
}

html[data-theme="dark"] .primary-nav > .header-nav-dropdown.is-active > summary .header-nav-summary-link,
html[data-theme="dark"] .primary-nav > .header-nav-dropdown[open] > summary .header-nav-summary-link,
html[data-theme="dark"] .primary-nav > .header-nav-dropdown.is-active > summary .header-nav-main-toggle,
html[data-theme="dark"] .primary-nav > .header-nav-dropdown[open] > summary .header-nav-main-toggle {
  color: var(--jp-palette-ink) !important;
}

html[data-theme="dark"] .brand-logo-link,
html[data-theme="dark"] .primary-nav,
html[data-theme="dark"] .compact-profile-menu > summary,
html[data-theme="dark"] .mobile-nav-toggle {
  background: rgba(26, 35, 48, .90) !important;
  border-color: rgba(255, 255, 255, .10) !important;
  box-shadow:
    0 16px 38px rgba(0, 0, 0, .32),
    inset 0 1px 0 rgba(255, 255, 255, .04) !important;
}

html[data-theme="dark"] .footer {
  background: #0b1016 !important;
}


/* =========================================================
   v3.14.8 — Permanent palette theme
   Dark/light switching is removed. The website always uses:
   #C9A227 · #0F172A · #475569 · #0F172A
   ========================================================= */
html[data-theme="palette"],
html:not([data-theme]) {
  color-scheme: light !important;
  --bg: #f3f4f8 !important;
  --surface: #ffffff !important;
  --surface-2: #f8f9fb !important;
  --text: #0F172A !important;
  --muted: #68778a !important;
  --minimal-primary: #0F172A !important;
  --minimal-border: rgba(15,23,42, .12) !important;
  --minimal-shadow: 0 14px 34px rgba(0,0,0, .10) !important;
}

html[data-theme="palette"] body,
html:not([data-theme]) body {
  background: #f3f4f8 !important;
  color: #0F172A !important;
}

html[data-theme="palette"] .topbar::before,
html:not([data-theme]) .topbar::before {
  background:
    linear-gradient(
      180deg,
      rgba(243, 244, 248, .96) 0%,
      rgba(243, 244, 248, .76) 72%,
      transparent 100%
    ) !important;
}

html[data-theme="palette"] .brand-logo-link,
html[data-theme="palette"] .primary-nav,
html[data-theme="palette"] .compact-profile-menu > summary,
html[data-theme="palette"] .mobile-nav-toggle,
html:not([data-theme]) .brand-logo-link,
html:not([data-theme]) .primary-nav,
html:not([data-theme]) .compact-profile-menu > summary,
html:not([data-theme]) .mobile-nav-toggle {
  background: rgba(255,255,255,.96) !important;
  border-color: rgba(15,23,42,.10) !important;
  color: #0F172A !important;
}

html[data-theme="palette"] .primary-nav > a,
html[data-theme="palette"] .primary-nav .header-nav-summary-link,
html[data-theme="palette"] .brand-wordmark-copy strong,
html:not([data-theme]) .primary-nav > a,
html:not([data-theme]) .primary-nav .header-nav-summary-link,
html:not([data-theme]) .brand-wordmark-copy strong {
  color: #0F172A !important;
}

html[data-theme="palette"] .brand-wordmark-copy small,
html[data-theme="palette"] .primary-nav .header-nav-main-toggle,
html:not([data-theme]) .brand-wordmark-copy small,
html:not([data-theme]) .primary-nav .header-nav-main-toggle {
  color: #475569 !important;
}

html[data-theme="palette"] .primary-nav > a:hover,
html[data-theme="palette"] .primary-nav > .header-nav-dropdown > summary:hover,
html:not([data-theme]) .primary-nav > a:hover,
html:not([data-theme]) .primary-nav > .header-nav-dropdown > summary:hover {
  background: rgba(201,162,39,.25) !important;
  color: #0F172A !important;
}

html[data-theme="palette"] .primary-nav > a.is-active,
html[data-theme="palette"] .primary-nav > a[aria-current="page"],
html[data-theme="palette"] .primary-nav > .header-nav-dropdown.is-active > summary,
html[data-theme="palette"] .primary-nav > .header-nav-dropdown[open] > summary,
html:not([data-theme]) .primary-nav > a.is-active,
html:not([data-theme]) .primary-nav > a[aria-current="page"],
html:not([data-theme]) .primary-nav > .header-nav-dropdown.is-active > summary,
html:not([data-theme]) .primary-nav > .header-nav-dropdown[open] > summary {
  background: #0F172A !important;
  color: #ffffff !important;
}

html[data-theme="palette"] .primary-nav > .header-nav-dropdown.is-active > summary .header-nav-summary-link,
html[data-theme="palette"] .primary-nav > .header-nav-dropdown[open] > summary .header-nav-summary-link,
html[data-theme="palette"] .primary-nav > .header-nav-dropdown.is-active > summary .header-nav-main-toggle,
html[data-theme="palette"] .primary-nav > .header-nav-dropdown[open] > summary .header-nav-main-toggle,
html:not([data-theme]) .primary-nav > .header-nav-dropdown.is-active > summary .header-nav-summary-link,
html:not([data-theme]) .primary-nav > .header-nav-dropdown[open] > summary .header-nav-summary-link,
html:not([data-theme]) .primary-nav > .header-nav-dropdown.is-active > summary .header-nav-main-toggle,
html:not([data-theme]) .primary-nav > .header-nav-dropdown[open] > summary .header-nav-main-toggle {
  color: #ffffff !important;
}

html[data-theme="palette"] .profile-preferences,
html[data-theme="palette"] .footer-preferences-column,
html:not([data-theme]) .profile-preferences,
html:not([data-theme]) .footer-preferences-column {
  color: #0F172A !important;
}

.profile-theme-action,
.footer-theme-action,
[data-theme-toggle] {
  display: none !important;
}

.account-language-only {
  grid-template-columns: minmax(260px, 520px) !important;
}


/* =========================================================
   v3.14.9 — Palette and header repair
   This block intentionally has the final cascade priority.
   ========================================================= */
html[data-theme="palette"]{
  color-scheme:light!important;
  --navy:#0F172A!important;
  --navy2:#475569!important;
  --teal:#475569!important;
  --gold:#C9A227!important;
  --bg:#EEF0F4!important;
  --bg-start:#F7F4EE!important;
  --bg-end:#E7EBF0!important;
  --card:#FFFFFF!important;
  --text:#0F172A!important;
  --muted:#637184!important;
  --line:#D0D6DE!important;
  --border:#D0D6DE!important;
  --surface:#FFFFFF!important;
  --surface-2:#F4F5F7!important;
  --surface-3:#E5E8EC!important;
  --soft:#FFF3E1!important;
  --input:#FFFFFF!important;
  --topbar:#0F172A!important;
  --accent:#C9A227!important;
  --accent2:#475569!important;
  --green:#475569!important;
  --orange:#C9A227!important;
  --minimal-bg:#EEF0F4!important;
  --minimal-surface:#FFFFFF!important;
  --minimal-surface-soft:#F6F7F9!important;
  --minimal-border:#D0D6DE!important;
  --minimal-shadow:0 12px 30px rgba(0,0,0,.11)!important;
  --minimal-shadow-hover:0 18px 42px rgba(0,0,0,.16)!important;
  --minimal-primary:#0F172A!important;
  --minimal-primary-hover:#0F172A!important;
  --minimal-success:#475569!important;
  --home-panel:#FFFFFF!important;
  --home-panel-soft:#F4F5F7!important;
  --home-panel-border:#D0D6DE!important;
  --home-copy:#0F172A!important;
  --home-copy-muted:#637184!important;
  --header-bg:#0F172A!important;
  --header-text:#FFFFFF!important;
  --header-muted:#D5DBE2!important;
  --header-accent:#C9A227!important;
  --shadow:0 16px 38px rgba(0,0,0,.12)!important;
  --liquid-panel:rgba(255,255,255,.90)!important;
  --liquid-panel-strong:rgba(255,255,255,.96)!important;
  --liquid-edge:rgba(15,23,42,.14)!important;
  --liquid-edge-soft:rgba(71,85,105,.16)!important;
  --liquid-highlight:rgba(201,162,39,.22)!important;
  --liquid-shadow:0 18px 42px rgba(0,0,0,.12)!important;
  --liquid-inner:inset 0 1px 0 rgba(255,255,255,.96),inset 0 -1px 0 rgba(71,85,105,.08)!important;
}

html[data-theme="palette"] body{
  background:
    radial-gradient(circle at 8% 3%,rgba(201,162,39,.18),transparent 24rem),
    linear-gradient(180deg,#F5F2EC 0,#EEF0F4 22rem,#EEF0F4 100%)!important;
  color:#0F172A!important;
}

html[data-theme="palette"] .ambient-canvas{opacity:.34!important}
html[data-theme="palette"] .ambient-vignette{background:radial-gradient(circle at center,transparent 40%,rgba(0,0,0,.05))!important}

/* Header: dark palette bar + centered white pill, matching the supplied reference. */
@media (min-width:1181px){
  html[data-theme="palette"] .topbar{
    position:sticky!important;
    top:0!important;
    z-index:1200!important;
    display:grid!important;
    grid-template-columns:minmax(250px,1fr) auto minmax(90px,1fr)!important;
    align-items:center!important;
    min-height:92px!important;
    padding:15px clamp(28px,3.2vw,64px)!important;
    gap:24px!important;
    background:#0F172A!important;
    border:0!important;
    box-shadow:0 12px 30px rgba(0,0,0,.24)!important;
    isolation:isolate!important;
  }

  html[data-theme="palette"] .topbar::before{
    content:none!important;
    display:none!important;
  }

  html[data-theme="palette"] .brand-logo-link{
    grid-column:1!important;
    justify-self:start!important;
    min-height:52px!important;
    padding:6px 17px 6px 7px!important;
    border:2px solid rgba(255,255,255,.24)!important;
    border-radius:999px!important;
    background:#C9A227!important;
    color:#0F172A!important;
    box-shadow:0 10px 24px rgba(0,0,0,.28)!important;
    backdrop-filter:none!important;
  }

  html[data-theme="palette"] .brand-logo-link:hover{
    transform:translateY(-1px)!important;
    background:#FFD08F!important;
  }

  html[data-theme="palette"] .brand-logo-icon{
    width:40px!important;
    height:40px!important;
    flex-basis:40px!important;
    border:2px solid rgba(0,0,0,.18)!important;
    box-shadow:none!important;
  }

  html[data-theme="palette"] .brand-wordmark-copy strong{
    color:#0F172A!important;
    font-size:.88rem!important;
  }

  html[data-theme="palette"] .brand-wordmark-copy small{
    color:#475569!important;
    font-size:.60rem!important;
  }

  html[data-theme="palette"] .topbar-right{display:contents!important}

  html[data-theme="palette"] .primary-nav{
    grid-column:2!important;
    justify-self:center!important;
    display:flex!important;
    align-items:center!important;
    gap:3px!important;
    width:max-content!important;
    max-width:min(76vw,1040px)!important;
    min-height:58px!important;
    padding:7px!important;
    overflow:visible!important;
    border:2px solid rgba(201,162,39,.68)!important;
    border-radius:999px!important;
    background:#FFFFFF!important;
    box-shadow:0 14px 34px rgba(0,0,0,.26)!important;
    backdrop-filter:none!important;
  }

  html[data-theme="palette"] .primary-nav > a,
  html[data-theme="palette"] .primary-nav > .header-nav-dropdown > summary{
    min-width:72px!important;
    min-height:44px!important;
    padding:0 17px!important;
    border:0!important;
    border-radius:999px!important;
    background:transparent!important;
    color:#0F172A!important;
    box-shadow:none!important;
    transform:none!important;
  }

  html[data-theme="palette"] .primary-nav > .header-nav-dropdown > summary{
    gap:6px!important;
  }

  html[data-theme="palette"] .primary-nav > a,
  html[data-theme="palette"] .primary-nav .header-nav-summary-link{
    color:#0F172A!important;
    font-size:.79rem!important;
    font-weight:800!important;
    letter-spacing:-.01em!important;
    white-space:nowrap!important;
  }

  html[data-theme="palette"] .primary-nav .header-nav-main-toggle{
    width:13px!important;
    height:13px!important;
    flex-basis:13px!important;
    color:#475569!important;
  }

  html[data-theme="palette"] .primary-nav > a:hover,
  html[data-theme="palette"] .primary-nav > .header-nav-dropdown > summary:hover{
    background:rgba(201,162,39,.30)!important;
    color:#0F172A!important;
  }

  /* Current page only: dark active pill. */
  html[data-theme="palette"] .primary-nav > a.is-active,
  html[data-theme="palette"] .primary-nav > a[aria-current="page"],
  html[data-theme="palette"] .primary-nav > .header-nav-dropdown.is-active > summary{
    background:#0F172A!important;
    color:#FFFFFF!important;
    box-shadow:0 8px 18px rgba(0,0,0,.25)!important;
  }

  html[data-theme="palette"] .primary-nav > .header-nav-dropdown.is-active > summary .header-nav-summary-link,
  html[data-theme="palette"] .primary-nav > .header-nav-dropdown.is-active > summary .header-nav-main-toggle{
    color:#FFFFFF!important;
  }

  /* Open dropdown on a different page: gold, not another dark active tab. */
  html[data-theme="palette"] .primary-nav > .header-nav-dropdown[open]:not(.is-active) > summary{
    background:#C9A227!important;
    color:#0F172A!important;
    box-shadow:0 8px 18px rgba(201,162,39,.30)!important;
  }

  html[data-theme="palette"] .primary-nav > .header-nav-dropdown[open]:not(.is-active) > summary .header-nav-summary-link,
  html[data-theme="palette"] .primary-nav > .header-nav-dropdown[open]:not(.is-active) > summary .header-nav-main-toggle{
    color:#0F172A!important;
  }

  html[data-theme="palette"] .compact-profile-menu{
    grid-column:3!important;
    justify-self:end!important;
    z-index:1250!important;
  }

  html[data-theme="palette"] .compact-profile-menu > summary{
    width:52px!important;
    min-width:52px!important;
    height:52px!important;
    min-height:52px!important;
    padding:5px!important;
    border:3px solid #C9A227!important;
    border-radius:50%!important;
    background:#FFFFFF!important;
    box-shadow:0 10px 24px rgba(0,0,0,.28)!important;
    backdrop-filter:none!important;
  }

  html[data-theme="palette"] .compact-profile-menu .profile-avatar-button{
    width:38px!important;
    height:38px!important;
    border-radius:50%!important;
    box-shadow:none!important;
  }
}

/* Dropdowns: aligned below tab, palette border, no blurred page. */
html[data-theme="palette"] .header-nav-dropdown-menu{
  margin-top:12px!important;
  padding:11px!important;
  border:1px solid rgba(15,23,42,.15)!important;
  border-top:4px solid #C9A227!important;
  border-radius:18px!important;
  background:#FFFFFF!important;
  color:#0F172A!important;
  box-shadow:0 22px 55px rgba(0,0,0,.24)!important;
  backdrop-filter:none!important;
}

html[data-theme="palette"] .header-nav-nested > summary,
html[data-theme="palette"] .header-nav-dropdown-menu > a{
  border-radius:12px!important;
}

html[data-theme="palette"] .header-nav-nested > summary:hover,
html[data-theme="palette"] .header-nav-dropdown-menu > a:hover,
html[data-theme="palette"] .header-nav-nested[open] > summary{
  background:rgba(201,162,39,.23)!important;
  color:#0F172A!important;
}

html[data-theme="palette"] .header-nav-nested-menu{
  border:1px solid rgba(15,23,42,.14)!important;
  border-top:4px solid #C9A227!important;
  border-radius:16px!important;
  background:#FFFFFF!important;
  box-shadow:0 20px 48px rgba(0,0,0,.22)!important;
}

html[data-theme="palette"] .header-nav-backdrop{
  background:rgba(0,0,0,.08)!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}

html[data-theme="palette"] .header-nav-menu-open main.container{
  filter:none!important;
  opacity:1!important;
  pointer-events:none!important;
  user-select:none!important;
}

/* Website-wide visible palette application. */
html[data-theme="palette"] .hero,
html[data-theme="palette"] .landing-cta,
html[data-theme="palette"] .home-category-hero,
html[data-theme="palette"] .papers-hub-hero,
html[data-theme="palette"] .notes-hub-hero,
html[data-theme="palette"] .progress-hub-hero,
html[data-theme="palette"] .dropdown-hub-hero,
html[data-theme="palette"] .dropdown-family-page-head{
  background:linear-gradient(135deg,#0F172A 0%,#0F172A 68%,#475569 100%)!important;
  color:#FFFFFF!important;
  border-color:rgba(201,162,39,.55)!important;
  box-shadow:0 22px 52px rgba(0,0,0,.24)!important;
}

html[data-theme="palette"] .hero h1,
html[data-theme="palette"] .landing-cta h2,
html[data-theme="palette"] .home-category-hero h1,
html[data-theme="palette"] .dropdown-hub-hero h1,
html[data-theme="palette"] .dropdown-family-page-head h1{
  color:#FFFFFF!important;
}

html[data-theme="palette"] .hero p,
html[data-theme="palette"] .landing-cta p,
html[data-theme="palette"] .home-category-hero p,
html[data-theme="palette"] .dropdown-hub-hero p,
html[data-theme="palette"] .dropdown-family-page-head p{
  color:#DDE3EA!important;
}

html[data-theme="palette"] .hero .eyebrow,
html[data-theme="palette"] .landing-cta .eyebrow,
html[data-theme="palette"] .home-category-hero .eyebrow,
html[data-theme="palette"] .dropdown-hub-hero .eyebrow,
html[data-theme="palette"] .dropdown-family-page-head .eyebrow{
  color:#C9A227!important;
}

html[data-theme="palette"] .landing-badge,
html[data-theme="palette"] .home-world-time-bar,
html[data-theme="palette"] .badge,
html[data-theme="palette"] .tag,
html[data-theme="palette"] .chip,
html[data-theme="palette"] .pill,
html[data-theme="palette"] .status-badge{
  background:#FFF0DA!important;
  border-color:rgba(201,162,39,.70)!important;
  color:#0F172A!important;
}

html[data-theme="palette"] .btn.primary,
html[data-theme="palette"] .btn-primary,
html[data-theme="palette"] .button-primary,
html[data-theme="palette"] input[type="submit"]{
  background:#C9A227!important;
  border-color:#C9A227!important;
  color:#0F172A!important;
  box-shadow:0 10px 24px rgba(201,162,39,.28)!important;
}

html[data-theme="palette"] .btn.primary:hover,
html[data-theme="palette"] .btn-primary:hover,
html[data-theme="palette"] .button-primary:hover,
html[data-theme="palette"] input[type="submit"]:hover{
  background:#EFAE56!important;
  border-color:#EFAE56!important;
  color:#0F172A!important;
}

html[data-theme="palette"] .btn.secondary,
html[data-theme="palette"] .btn-secondary{
  background:#475569!important;
  border-color:#475569!important;
  color:#FFFFFF!important;
}

html[data-theme="palette"] .landing-feature-grid article,
html[data-theme="palette"] .paper-card,
html[data-theme="palette"] .card,
html[data-theme="palette"] .dropdown-family-card,
html[data-theme="palette"] .progress-hub-card,
html[data-theme="palette"] .exam-category-card,
html[data-theme="palette"] .notes-category-card{
  background:#FFFFFF!important;
  border-color:rgba(71,85,105,.16)!important;
  box-shadow:0 14px 34px rgba(0,0,0,.10)!important;
}

html[data-theme="palette"] .landing-feature-grid article:hover,
html[data-theme="palette"] .paper-card:hover,
html[data-theme="palette"] .dropdown-family-card:hover,
html[data-theme="palette"] .exam-category-card:hover,
html[data-theme="palette"] .notes-category-card:hover{
  border-color:#C9A227!important;
  box-shadow:0 20px 46px rgba(0,0,0,.16)!important;
}

html[data-theme="palette"] .landing-feature-grid article::before,
html[data-theme="palette"] .paper-card::before,
html[data-theme="palette"] .dropdown-family-mark,
html[data-theme="palette"] .progress-hub-icon,
html[data-theme="palette"] .exam-category-mark,
html[data-theme="palette"] .notes-category-mark{
  background:#C9A227!important;
  color:#0F172A!important;
}

html[data-theme="palette"] .landing-steps article > b,
html[data-theme="palette"] .paper-no,
html[data-theme="palette"] .eyebrow,
html[data-theme="palette"] .article-back{
  color:#475569!important;
}

html[data-theme="palette"] .site-footer,
html[data-theme="palette"] .footer{
  background:linear-gradient(135deg,#0F172A 0%,#0F172A 60%,#475569 100%)!important;
  border-top:4px solid #C9A227!important;
  color:#E9EDF2!important;
}

html[data-theme="palette"] .site-footer a,
html[data-theme="palette"] .footer a{
  color:#C9A227!important;
}

/* Tablet/mobile keeps the same palette and a compact dark header. */
@media (max-width:1180px){
  html[data-theme="palette"] .topbar{
    background:#0F172A!important;
    border-bottom:3px solid #C9A227!important;
    box-shadow:0 10px 26px rgba(0,0,0,.24)!important;
  }
  html[data-theme="palette"] .topbar::before{display:none!important}
  html[data-theme="palette"] .brand-logo-link{
    background:#C9A227!important;
    border-color:rgba(255,255,255,.22)!important;
  }
  html[data-theme="palette"] .brand-wordmark-copy strong{color:#0F172A!important}
  html[data-theme="palette"] .brand-wordmark-copy small{color:#475569!important}
  html[data-theme="palette"] .mobile-nav-toggle,
  html[data-theme="palette"] .compact-profile-menu > summary{
    background:#FFFFFF!important;
    border-color:#C9A227!important;
  }
}

/* =========================================================
   v3.15.0 — Premium UI System
   #C9A227 · #0F172A · #475569 · #0F172A
   ========================================================= */
html[data-theme="palette"]{
  --p-gold:#C9A227!important;--p-gold2:#C9A227!important;
  --p-navy:#0F172A!important;--p-slate:#475569!important;--p-ink:#0F172A!important;
  --p-paper:#fff!important;--p-canvas:#F3F4F7!important;--p-soft:#F8F8F6!important;
  --p-line:rgba(15,23,42,.12)!important;
  --p-shadow-sm:0 8px 24px rgba(0,0,0,.08)!important;
  --p-shadow-md:0 18px 46px rgba(0,0,0,.12)!important;
  --p-shadow-lg:0 30px 74px rgba(0,0,0,.18)!important;
}
html[data-theme="palette"] body{
  background:
    radial-gradient(circle at 7% 1%,rgba(201,162,39,.15),transparent 28rem),
    radial-gradient(circle at 96% 14%,rgba(71,85,105,.08),transparent 30rem),
    linear-gradient(180deg,#F8F6F1 0,#F3F4F7 18rem,#EEF0F4 100%)!important;
  color:var(--p-navy)!important;
  font-family:"Segoe UI Variable","Segoe UI","Noto Sans Sinhala","Noto Sans JP",Arial,sans-serif!important;
  letter-spacing:-.006em;
}
html[data-theme="palette"] .ambient-canvas{opacity:.12!important;filter:saturate(.55)!important}
html[data-theme="palette"] .ambient-vignette{background:radial-gradient(circle at center,transparent 48%,rgba(0,0,0,.035))!important}
html[data-theme="palette"] main.container{width:min(1480px,calc(100% - 34px))!important;max-width:none!important;margin-inline:auto!important}
html[data-theme="palette"] main.container.compact-home-main{width:min(1450px,calc(100% - 38px))!important;padding-top:22px!important}
html[data-theme="palette"] h1,html[data-theme="palette"] h2,html[data-theme="palette"] h3{letter-spacing:-.035em!important;text-wrap:balance}
html[data-theme="palette"] p{text-wrap:pretty}

/* header */
@media(min-width:1181px){
  html[data-theme="palette"] .topbar{
    min-height:82px!important;padding:12px clamp(28px,3.2vw,64px)!important;
    background:linear-gradient(180deg,#263345 0%,#0F172A 58%,#1D2836 100%)!important;
    border-bottom:1px solid rgba(201,162,39,.60)!important;
    box-shadow:0 14px 34px rgba(0,0,0,.20)!important;
  }
  html[data-theme="palette"] .brand-logo-link{
    min-height:50px!important;padding:5px 15px 5px 6px!important;
    background:rgba(255,255,255,.97)!important;border:1px solid rgba(201,162,39,.85)!important;
    box-shadow:0 10px 25px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.98)!important;
  }
  html[data-theme="palette"] .brand-logo-link::after{
    content:"";width:7px;height:7px;margin-left:2px;border-radius:50%;background:#C9A227;
    box-shadow:0 0 0 4px rgba(201,162,39,.20)
  }
  html[data-theme="palette"] .brand-logo-icon{width:39px!important;height:39px!important;flex-basis:39px!important;border:1px solid rgba(15,23,42,.13)!important}
  html[data-theme="palette"] .brand-wordmark-copy strong{color:#0F172A!important;font-size:.86rem!important}
  html[data-theme="palette"] .brand-wordmark-copy small{color:#59697C!important;font-size:.57rem!important;letter-spacing:.055em!important}
  html[data-theme="palette"] .primary-nav{
    min-height:54px!important;padding:5px!important;gap:2px!important;
    border:1px solid rgba(201,162,39,.62)!important;background:rgba(255,255,255,.97)!important;
    box-shadow:0 16px 42px rgba(0,0,0,.22),inset 0 1px 0 #fff!important;
  }
  html[data-theme="palette"] .primary-nav>a,
  html[data-theme="palette"] .primary-nav>.header-nav-dropdown>summary{min-width:68px!important;min-height:42px!important;padding-inline:15px!important}
  html[data-theme="palette"] .primary-nav>a,
  html[data-theme="palette"] .primary-nav .header-nav-summary-link{font-size:.76rem!important;font-weight:780!important}
  html[data-theme="palette"] .primary-nav>a.is-active,
  html[data-theme="palette"] .primary-nav>a[aria-current="page"],
  html[data-theme="palette"] .primary-nav>.header-nav-dropdown.is-active>summary{
    background:linear-gradient(180deg,#2B394B 0%,#0F172A 100%)!important;
    box-shadow:0 9px 22px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.10)!important;
    outline:1px solid rgba(201,162,39,.40);outline-offset:-2px
  }
  html[data-theme="palette"] .primary-nav>.header-nav-dropdown[open]:not(.is-active)>summary{
    background:linear-gradient(180deg,#FFD080,#C9A227)!important;
    box-shadow:0 9px 21px rgba(201,162,39,.28),inset 0 1px 0 rgba(255,255,255,.62)!important
  }
  html[data-theme="palette"] .compact-profile-menu>summary{
    width:50px!important;min-width:50px!important;height:50px!important;min-height:50px!important;
    border:2px solid #C9A227!important;
    box-shadow:0 12px 26px rgba(0,0,0,.23),0 0 0 4px rgba(255,255,255,.08)!important
  }
}
html[data-theme="palette"] .header-nav-dropdown-menu,
html[data-theme="palette"] .header-nav-nested-menu{
  border:1px solid rgba(15,23,42,.11)!important;border-top:3px solid #C9A227!important;
  background:rgba(255,255,255,.985)!important;
  box-shadow:0 26px 70px rgba(0,0,0,.21),inset 0 1px 0 #fff!important
}
html[data-theme="palette"] .header-nav-dropdown-menu{padding:12px!important;border-radius:20px!important}
html[data-theme="palette"] .header-nav-nested>summary,
html[data-theme="palette"] .header-nav-dropdown-menu>a,
html[data-theme="palette"] .header-nav-nested-menu>a,
html[data-theme="palette"] .header-nav-nested-link{
  min-height:54px!important;border:1px solid transparent!important;border-radius:13px!important;
  transition:background .18s ease,border-color .18s ease,transform .18s ease!important
}
html[data-theme="palette"] .header-nav-nested>summary:hover,
html[data-theme="palette"] .header-nav-dropdown-menu>a:hover,
html[data-theme="palette"] .header-nav-nested-menu>a:hover,
html[data-theme="palette"] .header-nav-nested[open]>summary{
  background:#FFF5E5!important;border-color:rgba(201,162,39,.48)!important;transform:translateX(2px)!important
}

/* time bar */
html[data-theme="palette"] .home-world-time-bar{
  min-height:64px!important;margin-bottom:14px!important;padding:9px 14px!important;
  border:1px solid rgba(201,162,39,.68)!important;border-radius:20px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.97),rgba(255,249,240,.94))!important;
  box-shadow:0 12px 30px rgba(0,0,0,.09),inset 0 1px 0 #fff!important
}
html[data-theme="palette"] .home-world-time-label{color:#475569!important;font-weight:900!important;letter-spacing:.10em!important}
html[data-theme="palette"] .home-world-time-label i{background:#C9A227!important;box-shadow:0 0 0 5px rgba(201,162,39,.20)!important}
html[data-theme="palette"] .home-world-code{background:#0F172A!important;color:#C9A227!important;border-color:#0F172A!important}
html[data-theme="palette"] .home-world-clock strong{color:#0F172A!important}
html[data-theme="palette"] .home-world-difference{background:#FBF5E5!important;border-color:rgba(201,162,39,.60)!important;color:#0F172A!important}

/* hero */
html[data-theme="palette"] .home-category-hero{
  position:relative!important;isolation:isolate!important;min-height:610px!important;
  margin-top:0!important;padding:clamp(38px,5vw,72px)!important;gap:clamp(32px,5vw,72px)!important;
  overflow:hidden!important;border:1px solid rgba(201,162,39,.56)!important;border-radius:34px!important;
  background:
    radial-gradient(circle at 83% 18%,rgba(201,162,39,.18),transparent 26rem),
    radial-gradient(circle at 18% 88%,rgba(71,85,105,.36),transparent 34rem),
    linear-gradient(138deg,#263448 0%,#172231 46%,#0F172A 100%)!important;
  box-shadow:0 32px 80px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.06)!important
}
html[data-theme="palette"] .home-category-hero::before{
  content:""!important;position:absolute!important;inset:0!important;z-index:-2!important;pointer-events:none!important;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px)!important;
  background-size:44px 44px!important;mask-image:linear-gradient(90deg,#000 0%,rgba(0,0,0,.65) 48%,transparent 83%)!important
}
html[data-theme="palette"] .home-category-hero::after{
  content:""!important;position:absolute!important;z-index:-1!important;width:460px!important;height:460px!important;
  right:-165px!important;bottom:-210px!important;border:1px solid rgba(201,162,39,.26)!important;border-radius:50%!important;
  box-shadow:0 0 0 52px rgba(201,162,39,.055),0 0 0 112px rgba(201,162,39,.035)!important;
  background:radial-gradient(circle,rgba(201,162,39,.08),transparent 68%)!important
}
html[data-theme="palette"] .landing-hero-copy{position:relative!important;z-index:2!important;align-self:center!important}
html[data-theme="palette"] .landing-badge{
  min-height:34px!important;padding:7px 13px!important;border:1px solid rgba(201,162,39,.66)!important;
  border-radius:999px!important;background:rgba(255,247,234,.96)!important;color:#0F172A!important;
  box-shadow:0 7px 20px rgba(0,0,0,.14)!important
}
html[data-theme="palette"] .landing-badge i,
html[data-theme="palette"] .exam-preview-label i,
html[data-theme="palette"] .home-active-badge i{background:#C9A227!important;box-shadow:0 0 0 4px rgba(201,162,39,.18)!important}
html[data-theme="palette"] .home-category-hero h1{
  max-width:760px!important;margin:.38em 0 .24em!important;color:#fff!important;
  font-size:clamp(3.2rem,5.7vw,6.35rem)!important;font-weight:840!important;line-height:.98!important;
  letter-spacing:-.064em!important;text-shadow:0 10px 32px rgba(0,0,0,.16)!important
}
html[data-theme="palette"] .home-category-hero .landing-hero-copy>p{
  max-width:690px!important;margin:0!important;color:#D8E0E9!important;
  font-size:clamp(1rem,1.35vw,1.18rem)!important;line-height:1.72!important
}
html[data-theme="palette"] .home-hero-category-tabs{gap:9px!important;margin:24px 0 20px!important}
html[data-theme="palette"] .home-hero-category-tab{
  min-height:54px!important;padding:8px 12px!important;border:1px solid rgba(255,255,255,.10)!important;
  border-radius:15px!important;background:rgba(255,255,255,.065)!important;color:#fff!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045)!important
}
html[data-theme="palette"] .home-hero-category-tab b{background:rgba(255,255,255,.92)!important;color:#0F172A!important;border-color:rgba(255,255,255,.50)!important}
html[data-theme="palette"] .home-hero-category-tab span{color:#E6EBF1!important}
html[data-theme="palette"] .home-hero-category-tab:hover{border-color:rgba(201,162,39,.56)!important;background:rgba(201,162,39,.11)!important;transform:translateY(-2px)!important}
html[data-theme="palette"] .home-hero-category-tab.active{
  border-color:#C9A227!important;background:linear-gradient(180deg,#FFD080,#C9A227)!important;
  box-shadow:0 12px 28px rgba(201,162,39,.22)!important
}
html[data-theme="palette"] .home-hero-category-tab.active b{background:#0F172A!important;color:#C9A227!important;border-color:#0F172A!important}
html[data-theme="palette"] .home-hero-category-tab.active span{color:#0F172A!important}

/* buttons */
html[data-theme="palette"] .btn{
  min-height:47px!important;padding:0 18px!important;border-radius:13px!important;
  font-weight:850!important;letter-spacing:-.01em!important;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease!important
}
html[data-theme="palette"] .btn.primary{
  background:linear-gradient(180deg,#FFD080,#C9A227)!important;border:1px solid #C9A227!important;color:#0F172A!important;
  box-shadow:0 12px 26px rgba(201,162,39,.22),inset 0 1px 0 rgba(255,255,255,.58)!important
}
html[data-theme="palette"] .btn.primary:hover{
  transform:translateY(-2px)!important;background:linear-gradient(180deg,#FFD080,#F4B156)!important;
  box-shadow:0 17px 34px rgba(201,162,39,.27)!important
}
html[data-theme="palette"] .btn.secondary{
  background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.18)!important;
  color:#fff!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)!important
}
html[data-theme="palette"] .btn.secondary:hover{
  transform:translateY(-2px)!important;background:rgba(255,255,255,.14)!important;border-color:rgba(201,162,39,.55)!important
}
html[data-theme="palette"] .landing-text-link{color:#DDE4EC!important;font-weight:800!important}
html[data-theme="palette"] .landing-text-link span{color:#C9A227!important}

/* exam preview */
html[data-theme="palette"] .exam-preview{
  position:relative!important;z-index:2!important;align-self:center!important;width:min(100%,530px)!important;
  padding:24px!important;border:1px solid rgba(15,23,42,.10)!important;border-top:4px solid #C9A227!important;
  border-radius:26px!important;background:linear-gradient(180deg,rgba(255,255,255,.995),rgba(248,249,251,.985))!important;
  box-shadow:0 34px 78px rgba(0,0,0,.30),inset 0 1px 0 #fff!important;transform:translateY(2px)!important
}
html[data-theme="palette"] .exam-preview::before{background:#C9A227!important}
html[data-theme="palette"] .exam-preview-label{color:#475569!important;letter-spacing:.09em!important}
html[data-theme="palette"] .exam-preview-timer{
  min-width:72px!important;padding:9px 12px!important;border:1px solid rgba(15,23,42,.14)!important;
  border-radius:12px!important;background:#F3F4F7!important;color:#0F172A!important
}
html[data-theme="palette"] .exam-preview-progress{height:5px!important;border-radius:999px!important;background:#E7EAF0!important}
html[data-theme="palette"] .exam-preview-progress span{background:linear-gradient(90deg,#C9A227,#C9A227)!important}
html[data-theme="palette"] .exam-preview-meta{color:#68778A!important}
html[data-theme="palette"] .exam-preview h2{color:#0F172A!important;font-size:clamp(1.45rem,2.4vw,2.05rem)!important;line-height:1.48!important}
html[data-theme="palette"] .exam-preview-options{gap:10px!important}
html[data-theme="palette"] .exam-preview-options>div{
  min-height:55px!important;padding:10px 12px!important;border:1px solid rgba(15,23,42,.13)!important;
  border-radius:14px!important;background:#F7F8FA!important;color:#475569!important;
  transition:transform .18s ease,border-color .18s ease,background .18s ease!important
}
html[data-theme="palette"] .exam-preview-options>div:hover{transform:translateX(3px)!important;border-color:rgba(201,162,39,.68)!important;background:#FFF9F0!important}
html[data-theme="palette"] .exam-preview-options b{background:#C9A227!important;border-color:#C9A227!important;color:#0F172A!important}
html[data-theme="palette"] .exam-preview-save span{background:#0F172A!important;color:#C9A227!important}
html[data-theme="palette"] .home-hero-category-open{
  min-height:42px!important;padding:0 14px!important;border:1px solid #C9A227!important;border-radius:12px!important;
  background:#FBF5E5!important;color:#0F172A!important;font-weight:850!important
}
html[data-theme="palette"] .home-hero-category-open:hover{background:#C9A227!important;color:#0F172A!important}

/* stats and cards */
html[data-theme="palette"] .landing-trust-row{gap:18px!important;color:#AEB9C6!important}
html[data-theme="palette"] .landing-trust-row span{position:relative!important;padding-left:14px!important}
html[data-theme="palette"] .landing-trust-row span::before{
  content:""!important;position:absolute!important;left:0!important;top:.48em!important;width:6px!important;height:6px!important;border-radius:50%!important;background:#C9A227!important
}
html[data-theme="palette"] .landing-trust-row b{color:#fff!important}
html[data-theme="palette"] .landing-stats{margin-top:18px!important}
html[data-theme="palette"] .landing-stats-grid{
  overflow:hidden!important;border:1px solid rgba(15,23,42,.10)!important;border-radius:24px!important;
  background:#fff!important;box-shadow:var(--p-shadow-md)!important
}
html[data-theme="palette"] .landing-stats-grid article{
  position:relative!important;min-height:128px!important;padding:27px!important;background:#fff!important;border-color:rgba(15,23,42,.10)!important
}
html[data-theme="palette"] .landing-stats-grid article::before{
  content:""!important;position:absolute!important;left:27px!important;top:0!important;width:48px!important;height:4px!important;
  border-radius:0 0 4px 4px!important;background:#C9A227!important
}
html[data-theme="palette"] .landing-stats-grid strong{color:#0F172A!important;font-size:2.1rem!important}
html[data-theme="palette"] .landing-stats-grid span{color:#68778A!important;font-weight:760!important}
html[data-theme="palette"] .landing-section,
html[data-theme="palette"] .landing-personal,
html[data-theme="palette"] .dropdown-hub-hero,
html[data-theme="palette"] .dropdown-family-page-head{margin-top:26px!important}
html[data-theme="palette"] .landing-section-intro{max-width:820px!important;margin-bottom:22px!important}
html[data-theme="palette"] .landing-section-intro h2{color:#0F172A!important;font-size:clamp(2rem,3.8vw,3.35rem)!important;line-height:1.08!important}
html[data-theme="palette"] .landing-section-intro p{color:#68778A!important;font-size:1.01rem!important;line-height:1.75!important}
html[data-theme="palette"] .eyebrow{color:#475569!important;letter-spacing:.11em!important;font-weight:900!important}
html[data-theme="palette"] .landing-feature-grid{gap:16px!important}
html[data-theme="palette"] .landing-feature-grid article,
html[data-theme="palette"] .dropdown-family-card,
html[data-theme="palette"] .progress-hub-card,
html[data-theme="palette"] .exam-category-card,
html[data-theme="palette"] .notes-category-card,
html[data-theme="palette"] .paper-card,
html[data-theme="palette"] .lesson-card,
html[data-theme="palette"] .dashboard-card,
html[data-theme="palette"] .stat-card,
html[data-theme="palette"] .content-card,
html[data-theme="palette"] .card{
  position:relative!important;overflow:hidden!important;border:1px solid rgba(15,23,42,.10)!important;border-radius:22px!important;
  background:linear-gradient(180deg,#fff 0%,#FBFBFA 100%)!important;
  box-shadow:0 12px 30px rgba(0,0,0,.085),inset 0 1px 0 #fff!important;
  transition:transform .20s ease,border-color .20s ease,box-shadow .20s ease!important
}
html[data-theme="palette"] .landing-feature-grid article::after,
html[data-theme="palette"] .dropdown-family-card::after,
html[data-theme="palette"] .progress-hub-card::after,
html[data-theme="palette"] .exam-category-card::after,
html[data-theme="palette"] .notes-category-card::after,
html[data-theme="palette"] .paper-card::after,
html[data-theme="palette"] .lesson-card::after{
  content:""!important;position:absolute!important;left:0!important;right:0!important;top:0!important;height:3px!important;
  background:linear-gradient(90deg,#C9A227,rgba(201,162,39,.18),transparent)!important;opacity:.85!important
}
html[data-theme="palette"] .landing-feature-grid article:hover,
html[data-theme="palette"] .dropdown-family-card:hover,
html[data-theme="palette"] .progress-hub-card:hover,
html[data-theme="palette"] .exam-category-card:hover,
html[data-theme="palette"] .notes-category-card:hover,
html[data-theme="palette"] .paper-card:hover,
html[data-theme="palette"] .lesson-card:hover,
html[data-theme="palette"] .content-card:hover{
  transform:translateY(-4px)!important;border-color:rgba(201,162,39,.78)!important;
  box-shadow:0 23px 52px rgba(0,0,0,.14),inset 0 1px 0 #fff!important
}
html[data-theme="palette"] .feature-icon,
html[data-theme="palette"] .dropdown-family-mark,
html[data-theme="palette"] .progress-hub-icon,
html[data-theme="palette"] .exam-category-mark,
html[data-theme="palette"] .notes-category-mark{
  border:1px solid rgba(201,162,39,.75)!important;background:linear-gradient(180deg,#FFD080,#C9A227)!important;
  color:#0F172A!important;box-shadow:0 10px 22px rgba(201,162,39,.20),inset 0 1px 0 rgba(255,255,255,.56)!important
}
html[data-theme="palette"] .landing-feature-grid article h3,
html[data-theme="palette"] .dropdown-family-card h2,
html[data-theme="palette"] .progress-hub-card h2,
html[data-theme="palette"] .exam-category-card h2,
html[data-theme="palette"] .notes-category-card h2{color:#0F172A!important}
html[data-theme="palette"] .landing-feature-grid article p,
html[data-theme="palette"] .dropdown-family-card p,
html[data-theme="palette"] .progress-hub-card p,
html[data-theme="palette"] .exam-category-card p,
html[data-theme="palette"] .notes-category-card p{color:#68778A!important;line-height:1.72!important}

/* hubs/forms/exam/footer */
html[data-theme="palette"] .dropdown-hub-hero,
html[data-theme="palette"] .dropdown-family-page-head{
  padding:clamp(30px,4.5vw,58px)!important;border:1px solid rgba(201,162,39,.54)!important;border-radius:30px!important;
  background:radial-gradient(circle at 90% 15%,rgba(201,162,39,.18),transparent 22rem),linear-gradient(135deg,#263448 0%,#0F172A 78%)!important;
  box-shadow:var(--p-shadow-lg)!important
}
html[data-theme="palette"] .dropdown-hub-count{border-color:rgba(201,162,39,.58)!important;background:rgba(255,255,255,.075)!important}
html[data-theme="palette"] .dropdown-hub-count strong{color:#C9A227!important}
html[data-theme="palette"] .dropdown-hub-count span{color:#D9E0E8!important}
html[data-theme="palette"] input,
html[data-theme="palette"] textarea,
html[data-theme="palette"] select{
  min-height:46px!important;border:1px solid rgba(15,23,42,.16)!important;border-radius:13px!important;
  background:#fff!important;color:#0F172A!important
}
html[data-theme="palette"] input:focus,
html[data-theme="palette"] textarea:focus,
html[data-theme="palette"] select:focus{
  border-color:#C9A227!important;box-shadow:0 0 0 4px rgba(201,162,39,.20)!important
}
html[data-theme="palette"] .exam-container{width:min(1500px,calc(100% - 24px))!important}
html[data-theme="palette"] .exam-sidebar,
html[data-theme="palette"] .exam-main,
html[data-theme="palette"] .exam-question,
html[data-theme="palette"] .question-card,
html[data-theme="palette"] .result-card,
html[data-theme="palette"] .review-card{
  border-color:rgba(15,23,42,.11)!important;border-radius:20px!important;background:#fff!important;
  box-shadow:0 14px 36px rgba(0,0,0,.09)!important
}
html[data-theme="palette"] .option,
html[data-theme="palette"] .review-option{
  border:1px solid rgba(15,23,42,.13)!important;border-radius:14px!important;background:#F8F9FA!important;
  transition:border-color .17s ease,background .17s ease,transform .17s ease!important
}
html[data-theme="palette"] .option:hover{transform:translateX(2px)!important;border-color:rgba(201,162,39,.78)!important;background:#FFF9F0!important}
html[data-theme="palette"] .option:has(input:checked){border-color:#C9A227!important;background:#FBF5E5!important;box-shadow:0 0 0 3px rgba(201,162,39,.16)!important}
html[data-theme="palette"] .option-letter,
html[data-theme="palette"] .question-no,
html[data-theme="palette"] .navigator button.current{background:#0F172A!important;color:#C9A227!important;border-color:#0F172A!important}
html[data-theme="palette"] .exam-progress span,
html[data-theme="palette"] .home-active-progress-track span,
html[data-theme="palette"] .progress-fill{background:linear-gradient(90deg,#C9A227,#C9A227)!important}
html[data-theme="palette"] .exam-section-plan button.current{background:linear-gradient(180deg,#475569,#0F172A)!important;border-color:#0F172A!important;color:#fff!important}
html[data-theme="palette"] .site-footer,
html[data-theme="palette"] .footer{
  margin-top:48px!important;border-top:1px solid rgba(201,162,39,.76)!important;
  background:radial-gradient(circle at 12% 0%,rgba(201,162,39,.10),transparent 22rem),linear-gradient(145deg,#0F172A 0%,#0F172A 68%,#2D3C50 100%)!important;
  box-shadow:0 -18px 46px rgba(0,0,0,.14)!important
}
html[data-theme="palette"] .site-footer a,html[data-theme="palette"] .footer a{color:#C9A227!important}

@media(max-width:1180px){
  html[data-theme="palette"] main.container{width:min(100% - 24px,1180px)!important}
  html[data-theme="palette"] .topbar{min-height:72px!important;background:linear-gradient(180deg,#263345,#0F172A)!important;border-bottom:1px solid rgba(201,162,39,.62)!important}
  html[data-theme="palette"] .brand-logo-link{background:#fff!important;border:1px solid rgba(201,162,39,.78)!important}
  html[data-theme="palette"] .home-category-hero{min-height:0!important;padding:34px!important;border-radius:28px!important}
  html[data-theme="palette"] .home-category-hero h1{font-size:clamp(2.75rem,7.5vw,5.2rem)!important}
}
@media(max-width:820px){
  html[data-theme="palette"] main.container,
  html[data-theme="palette"] main.container.compact-home-main{width:calc(100% - 18px)!important}
  html[data-theme="palette"] .home-world-time-bar{border-radius:16px!important}
  html[data-theme="palette"] .home-category-hero{padding:26px 20px!important;gap:26px!important;border-radius:24px!important}
  html[data-theme="palette"] .home-category-hero h1{font-size:clamp(2.45rem,12vw,4rem)!important;line-height:1.02!important}
  html[data-theme="palette"] .exam-preview{padding:18px!important;border-radius:20px!important}
  html[data-theme="palette"] .landing-stats-grid{border-radius:18px!important}
}
@media(max-width:560px){
  html[data-theme="palette"] main.container,
  html[data-theme="palette"] main.container.compact-home-main{width:calc(100% - 12px)!important}
  html[data-theme="palette"] .home-category-hero{padding:22px 16px!important}
  html[data-theme="palette"] .home-category-hero h1{font-size:2.42rem!important}
  html[data-theme="palette"] .home-hero-category-tab{flex-basis:138px!important}
}
@media(prefers-reduced-motion:reduce){
  html[data-theme="palette"] .landing-feature-grid article,
  html[data-theme="palette"] .dropdown-family-card,
  html[data-theme="palette"] .progress-hub-card,
  html[data-theme="palette"] .exam-category-card,
  html[data-theme="palette"] .notes-category-card,
  html[data-theme="palette"] .paper-card,
  html[data-theme="palette"] .lesson-card,
  html[data-theme="palette"] .option,
  html[data-theme="palette"] .btn{transition:none!important}
}


/* =========================================================
   v3.15.1 — Premium dropdown background blur
   Notes, Papers, Progress and Profile menus stay sharp while
   the page area between the header and footer is blurred.
   ========================================================= */
html[data-theme="palette"] .header-nav-backdrop,
html[data-theme="palette"] .profile-menu-backdrop{
  display:block!important;
  background:rgba(0,0,0,.24)!important;
  -webkit-backdrop-filter:blur(15px) saturate(72%) brightness(78%)!important;
  backdrop-filter:blur(15px) saturate(72%) brightness(78%)!important;
  will-change:opacity,backdrop-filter!important;
}

html[data-theme="palette"] body.header-nav-menu-open .header-nav-backdrop,
html[data-theme="palette"] body.profile-menu-open .profile-menu-backdrop{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
}

html[data-theme="palette"] body.header-nav-menu-open main.container,
html[data-theme="palette"] body.profile-menu-open main.container{
  filter:blur(2.5px) saturate(.76) brightness(.82)!important;
  opacity:.78!important;
  pointer-events:none!important;
  user-select:none!important;
  transform:translateZ(0)!important;
  transition:filter .22s ease,opacity .22s ease!important;
}

html[data-theme="palette"] body:not(.header-nav-menu-open):not(.profile-menu-open) main.container{
  filter:none!important;
  opacity:1!important;
  transition:filter .22s ease,opacity .22s ease!important;
}

html[data-theme="palette"] body.header-nav-menu-open .topbar,
html[data-theme="palette"] body.profile-menu-open .topbar{
  filter:none!important;
  opacity:1!important;
  z-index:1200!important;
}

html[data-theme="palette"] body.header-nav-menu-open .header-nav-dropdown[open],
html[data-theme="palette"] body.profile-menu-open .profile-menu[open]{
  filter:none!important;
  opacity:1!important;
  z-index:1250!important;
}

html[data-theme="palette"] body.header-nav-menu-open .header-nav-dropdown[open] > .header-nav-dropdown-menu,
html[data-theme="palette"] body.profile-menu-open .profile-dropdown{
  filter:none!important;
  opacity:1!important;
  z-index:1300!important;
}

html[data-theme="palette"] body.header-nav-menu-open .site-footer,
html[data-theme="palette"] body.header-nav-menu-open .footer,
html[data-theme="palette"] body.profile-menu-open .site-footer,
html[data-theme="palette"] body.profile-menu-open .footer{
  filter:none!important;
  opacity:1!important;
}

@media(max-width:820px){
  html[data-theme="palette"] .header-nav-backdrop{
    display:none!important;
  }

  html[data-theme="palette"] body.header-nav-menu-open main.container{
    filter:none!important;
    opacity:1!important;
    pointer-events:auto!important;
    user-select:auto!important;
  }
}

@media(prefers-reduced-motion:reduce){
  html[data-theme="palette"] .header-nav-backdrop,
  html[data-theme="palette"] .profile-menu-backdrop,
  html[data-theme="palette"] body.header-nav-menu-open main.container,
  html[data-theme="palette"] body.profile-menu-open main.container,
  html[data-theme="palette"] body:not(.header-nav-menu-open):not(.profile-menu-open) main.container{
    transition:none!important;
  }
}

@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  html[data-theme="palette"] .header-nav-backdrop,
  html[data-theme="palette"] .profile-menu-backdrop{
    background:rgba(0,0,0,.68)!important;
  }

  html[data-theme="palette"] body.header-nav-menu-open main.container,
  html[data-theme="palette"] body.profile-menu-open main.container{
    filter:blur(4px) saturate(.65) brightness(.72)!important;
  }
}


/* =========================================================
   v3.15.2 — Separated nested flyouts
   Keep the child submenu visually separate from the main panel.
   ========================================================= */
@media (min-width: 821px) {
  html[data-theme="palette"] .header-nav-hierarchical-menu .header-nav-nested-menu {
    /*
     * The parent dropdown has its own inner padding.
     * A 30px offset leaves a visible 17–18px air gap outside that panel.
     */
    top: 0 !important;
    left: calc(100% + 30px) !important;
    width: 246px !important;
    min-width: 246px !important;
    border: 1px solid rgba(15,23,42, .13) !important;
    border-top: 3px solid #C9A227 !important;
    border-radius: 17px !important;
    background: rgba(255, 255, 255, .99) !important;
    box-shadow:
      0 25px 62px rgba(0,0,0, .24),
      inset 0 1px 0 rgba(255, 255, 255, .98) !important;
  }

  /*
   * Transparent mouse bridge across the new physical gap.
   * It prevents the submenu closing while the pointer moves right.
   */
  html[data-theme="palette"] .header-nav-hierarchical-menu .header-nav-nested-menu::before {
    top: -4px !important;
    bottom: -4px !important;
    left: -32px !important;
    width: 32px !important;
    background: transparent !important;
  }

  /*
   * Clean gold connector line instead of a panel-overlapping arrow.
   */
  html[data-theme="palette"] .header-nav-hierarchical-menu .header-nav-nested-menu::after {
    top: 26px !important;
    left: -18px !important;
    width: 18px !important;
    height: 2px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: #C9A227 !important;
    box-shadow: 0 0 0 3px rgba(201,162,39, .12) !important;
    transform: none !important;
  }

  html[data-theme="palette"] .header-nav-hierarchical-menu .header-nav-nested[open] > summary {
    border-color: rgba(201,162,39, .72) !important;
    background: #FFF4E2 !important;
    box-shadow:
      inset 3px 0 0 #C9A227,
      0 5px 14px rgba(0,0,0, .06) !important;
    transform: none !important;
  }

  html[data-theme="palette"] .header-nav-hierarchical-menu .header-nav-nested-menu > a {
    min-height: 52px !important;
    margin: 0 0 7px !important;
    padding: 10px 12px !important;
    border: 1px solid rgba(15,23,42, .07) !important;
    border-radius: 12px !important;
    background: #F7F8FA !important;
  }

  html[data-theme="palette"] .header-nav-hierarchical-menu .header-nav-nested-menu > a:last-child {
    margin-bottom: 0 !important;
  }

  html[data-theme="palette"] .header-nav-hierarchical-menu .header-nav-nested-menu > a:hover,
  html[data-theme="palette"] .header-nav-hierarchical-menu .header-nav-nested-menu > a:focus-visible {
    border-color: rgba(201,162,39, .70) !important;
    background: #FFF7EA !important;
    transform: translateX(2px) !important;
  }
}

@media (max-width: 820px) {
  /* Mobile remains an in-drawer accordion; no detached flyout gap. */
  html[data-theme="palette"] .header-nav-hierarchical-menu .header-nav-nested-menu {
    left: auto !important;
    top: auto !important;
  }
}


/* =========================================================
   v3.15.3 — Permanent Home active tab
   The black active pill belongs to Home on every page.
   Open dropdowns use gold and do not replace the Home marker.
   ========================================================= */
@media (min-width: 821px) {
  html[data-theme="palette"] .primary-nav > a.header-top-link.is-active,
  html[data-theme="palette"] .primary-nav > a.header-top-link[aria-current="page"] {
    background:
      linear-gradient(180deg, #2B394B 0%, #0F172A 100%) !important;
    color: #FFFFFF !important;
    border-color: #0F172A !important;
    box-shadow:
      0 9px 22px rgba(0,0,0, .28),
      inset 0 1px 0 rgba(255, 255, 255, .10) !important;
    outline: 1px solid rgba(201,162,39, .42) !important;
    outline-offset: -2px !important;
  }

  html[data-theme="palette"] .primary-nav > .header-nav-dropdown.is-active > summary {
    background: transparent !important;
    color: #0F172A !important;
    box-shadow: none !important;
    outline: 0 !important;
  }

  html[data-theme="palette"] .primary-nav > .header-nav-dropdown.is-active > summary .header-nav-summary-link,
  html[data-theme="palette"] .primary-nav > .header-nav-dropdown.is-active > summary .header-nav-main-toggle {
    color: #0F172A !important;
  }

  html[data-theme="palette"] .primary-nav > .header-nav-dropdown[open] > summary,
  html[data-theme="palette"] .primary-nav > .header-nav-dropdown.is-active[open] > summary {
    background: linear-gradient(180deg, #FFD080 0%, #C9A227 100%) !important;
    color: #0F172A !important;
    border-color: #C9A227 !important;
    box-shadow:
      0 9px 21px rgba(201,162,39, .28),
      inset 0 1px 0 rgba(255, 255, 255, .62) !important;
    outline: 0 !important;
  }

  html[data-theme="palette"] .primary-nav > .header-nav-dropdown[open] > summary .header-nav-summary-link,
  html[data-theme="palette"] .primary-nav > .header-nav-dropdown[open] > summary .header-nav-main-toggle {
    color: #0F172A !important;
  }
}


/* =========================================================
   v3.15.4 — Compact Premium Cards
   Reduce oversized cards while preserving the premium system.
   ========================================================= */
html[data-theme="palette"]{
  --compact-card-padding:16px!important;
  --compact-card-padding-wide:18px!important;
  --compact-card-radius:18px!important;
  --compact-card-gap:12px!important;
  --compact-card-shadow:0 10px 26px rgba(0,0,0,.075)!important;
}

/* ---------- General card sizing ---------- */
html[data-theme="palette"] .card,
html[data-theme="palette"] .panel,
html[data-theme="palette"] .surface,
html[data-theme="palette"] .widget,
html[data-theme="palette"] .content-card,
html[data-theme="palette"] .dashboard-card,
html[data-theme="palette"] .metric-card,
html[data-theme="palette"] .stat-card,
html[data-theme="palette"] .chart-card,
html[data-theme="palette"] .conclusion-card,
html[data-theme="palette"] .account-panel{
  padding:var(--compact-card-padding)!important;
  border-radius:var(--compact-card-radius)!important;
  box-shadow:var(--compact-card-shadow)!important;
}

/* ---------- Home feature and statistic cards ---------- */
html[data-theme="palette"] .landing-feature-grid{
  gap:12px!important;
}

html[data-theme="palette"] .landing-feature-grid article{
  min-height:0!important;
  padding:17px!important;
  border-radius:18px!important;
}

html[data-theme="palette"] .landing-feature-grid article h3{
  margin:.55rem 0 .32rem!important;
  font-size:1.06rem!important;
}

html[data-theme="palette"] .landing-feature-grid article p{
  margin:0!important;
  font-size:.88rem!important;
  line-height:1.58!important;
}

html[data-theme="palette"] .feature-icon{
  width:47px!important;
  height:47px!important;
  border-radius:14px!important;
  font-size:1.06rem!important;
}

html[data-theme="palette"] .landing-stats-grid{
  border-radius:19px!important;
}

html[data-theme="palette"] .landing-stats-grid article{
  min-height:92px!important;
  padding:18px!important;
}

html[data-theme="palette"] .landing-stats-grid article::before{
  left:18px!important;
  width:38px!important;
}

html[data-theme="palette"] .landing-stats-grid strong{
  font-size:1.58rem!important;
}

html[data-theme="palette"] .landing-stats-grid span{
  font-size:.72rem!important;
}

/* ---------- Hub header panels ---------- */
html[data-theme="palette"] .dropdown-hub-hero,
html[data-theme="palette"] .dropdown-family-page-head,
html[data-theme="palette"] .papers-hub-hero,
html[data-theme="palette"] .category-page-head,
html[data-theme="palette"] .notes-hub-hero,
html[data-theme="palette"] .notes-category-page-head,
html[data-theme="palette"] .notes-category-intro{
  padding:22px 24px!important;
  border-radius:21px!important;
  gap:18px!important;
  min-height:0!important;
}

html[data-theme="palette"] .dropdown-hub-hero h1,
html[data-theme="palette"] .dropdown-family-page-head h1,
html[data-theme="palette"] .papers-hub-hero h1,
html[data-theme="palette"] .notes-hub-hero h1,
html[data-theme="palette"] .notes-category-page-head h1{
  margin:.2rem 0 .35rem!important;
  font-size:clamp(1.75rem,3vw,2.55rem)!important;
}

html[data-theme="palette"] .dropdown-hub-hero p,
html[data-theme="palette"] .dropdown-family-page-head p,
html[data-theme="palette"] .notes-category-page-head p,
html[data-theme="palette"] .notes-category-intro p{
  font-size:.9rem!important;
  line-height:1.55!important;
}

html[data-theme="palette"] .dropdown-hub-count,
html[data-theme="palette"] .papers-hub-count,
html[data-theme="palette"] .category-page-summary,
html[data-theme="palette"] .notes-category-page-summary,
html[data-theme="palette"] .notes-category-intro-stat{
  min-width:112px!important;
  min-height:82px!important;
  padding:12px!important;
  border-radius:15px!important;
}

html[data-theme="palette"] .dropdown-hub-count strong,
html[data-theme="palette"] .papers-hub-count strong,
html[data-theme="palette"] .category-page-summary strong,
html[data-theme="palette"] .notes-category-page-summary strong,
html[data-theme="palette"] .notes-category-intro-stat strong{
  font-size:1.65rem!important;
}

/* ---------- Family, category and progress cards ---------- */
html[data-theme="palette"] .dropdown-family-grid,
html[data-theme="palette"] .exam-category-grid,
html[data-theme="palette"] .notes-category-grid,
html[data-theme="palette"] .progress-hub-grid{
  gap:12px!important;
}

html[data-theme="palette"] .dropdown-family-card{
  min-height:0!important;
  padding:17px!important;
  border-radius:18px!important;
}

html[data-theme="palette"] .dropdown-family-mark{
  width:50px!important;
  height:50px!important;
  border-radius:14px!important;
  font-size:1.12rem!important;
}

html[data-theme="palette"] .dropdown-family-copy{
  gap:3px!important;
  margin:13px 0 10px!important;
}

html[data-theme="palette"] .dropdown-family-copy h2{
  font-size:1.38rem!important;
}

html[data-theme="palette"] .dropdown-family-copy p{
  min-height:0!important;
  margin:1px 0 0!important;
  font-size:.86rem!important;
  line-height:1.55!important;
}

html[data-theme="palette"] .dropdown-family-items{
  gap:5px!important;
  margin-bottom:12px!important;
}

html[data-theme="palette"] .dropdown-family-items span{
  padding:4px 7px!important;
  font-size:.62rem!important;
}

html[data-theme="palette"] .dropdown-family-stats{
  gap:6px!important;
  margin:0 0 12px!important;
}

html[data-theme="palette"] .dropdown-family-stats div{
  padding:8px 5px!important;
  border-radius:10px!important;
}

html[data-theme="palette"] .dropdown-family-stats strong{
  font-size:.98rem!important;
}

html[data-theme="palette"] .dropdown-family-stats span{
  font-size:.52rem!important;
}

html[data-theme="palette"] .progress-hub-card{
  min-height:0!important;
  padding:17px!important;
  border-radius:18px!important;
}

html[data-theme="palette"] .progress-hub-icon{
  width:49px!important;
  height:49px!important;
  margin-bottom:12px!important;
  border-radius:14px!important;
  font-size:1.12rem!important;
}

html[data-theme="palette"] .progress-hub-card h2{
  margin:.2rem 0 .35rem!important;
  font-size:1.18rem!important;
}

html[data-theme="palette"] .progress-hub-card p{
  margin:0 0 13px!important;
  font-size:.86rem!important;
  line-height:1.55!important;
}

/* ---------- Papers and notes category cards ---------- */
html[data-theme="palette"] .exam-category-card,
html[data-theme="palette"] .exam-category-placeholder,
html[data-theme="palette"] .notes-category-card,
html[data-theme="palette"] .notes-category-placeholder{
  min-height:0!important;
  padding:16px!important;
  border-radius:18px!important;
}

html[data-theme="palette"] .exam-category-card-top,
html[data-theme="palette"] .notes-category-card-top{
  margin-bottom:9px!important;
}

html[data-theme="palette"] .exam-category-mark,
html[data-theme="palette"] .notes-category-mark{
  width:48px!important;
  height:48px!important;
  border-radius:14px!important;
  font-size:.98rem!important;
}

html[data-theme="palette"] .exam-category-copy h2,
html[data-theme="palette"] .notes-category-copy h2{
  margin:.3rem 0!important;
  font-size:1.2rem!important;
}

html[data-theme="palette"] .exam-category-copy p,
html[data-theme="palette"] .notes-category-copy p{
  margin:.25rem 0 .7rem!important;
  font-size:.84rem!important;
  line-height:1.5!important;
}

html[data-theme="palette"] .exam-category-stats,
html[data-theme="palette"] .notes-category-stats{
  gap:6px!important;
  margin:10px 0!important;
}

html[data-theme="palette"] .exam-category-stats div,
html[data-theme="palette"] .notes-category-stats div{
  padding:8px 5px!important;
  border-radius:10px!important;
}

html[data-theme="palette"] .exam-category-stats strong,
html[data-theme="palette"] .notes-category-stats strong{
  font-size:1rem!important;
}

html[data-theme="palette"] .exam-category-stats span,
html[data-theme="palette"] .notes-category-stats span{
  font-size:.56rem!important;
}

html[data-theme="palette"] .exam-category-levels{
  margin:9px 0!important;
  gap:5px!important;
}

html[data-theme="palette"] .difficulty-chip{
  padding:4px 7px!important;
  font-size:.59rem!important;
}

/* ---------- Notes article cards shown in screenshot ---------- */
html[data-theme="palette"] .notes-category-article-grid{
  gap:12px!important;
}

html[data-theme="palette"] .kb-doc-card,
html[data-theme="palette"] .notes-category-article-card{
  min-height:0!important;
  padding:17px!important;
  border-radius:18px!important;
}

html[data-theme="palette"] .kb-doc-card::before{
  height:3px!important;
}

html[data-theme="palette"] .notes-category-article-card p{
  flex:0 1 auto!important;
  min-height:0!important;
  margin:.45rem 0 12px!important;
  font-size:.86rem!important;
  line-height:1.55!important;
}

html[data-theme="palette"] .kb-doc-card h2{
  margin:.55rem 0 .35rem!important;
  font-size:1.16rem!important;
}

html[data-theme="palette"] .kb-doc-type{
  font-size:.64rem!important;
}

html[data-theme="palette"] .notes-article-category-tag{
  padding:.28rem .46rem!important;
  font-size:.61rem!important;
}

html[data-theme="palette"] .notes-category-article-card .btn{
  margin-top:auto!important;
}

/* ---------- Paper list cards ---------- */
html[data-theme="palette"] .paper-grid{
  gap:11px!important;
}

html[data-theme="palette"] .paper-card,
html[data-theme="palette"] .saved-paper-card{
  min-height:0!important;
  padding:15px!important;
  border-radius:17px!important;
}

html[data-theme="palette"] .paper-card h2,
html[data-theme="palette"] .paper-card h3,
html[data-theme="palette"] .saved-paper-card h2,
html[data-theme="palette"] .saved-paper-card h3{
  margin:.25rem 0!important;
  font-size:1.08rem!important;
}

html[data-theme="palette"] .paper-card p,
html[data-theme="palette"] .saved-paper-card p{
  font-size:.82rem!important;
  line-height:1.48!important;
}

html[data-theme="palette"] .paper-card-metrics{
  gap:5px!important;
  margin:8px 0!important;
}

html[data-theme="palette"] .paper-card-metrics > div{
  padding:.46rem .3rem!important;
  border-radius:9px!important;
}

html[data-theme="palette"] .paper-card-metrics strong{
  font-size:.94rem!important;
}

html[data-theme="palette"] .paper-card-metrics span{
  font-size:.54rem!important;
}

/* ---------- Dashboard and lesson cards ---------- */
html[data-theme="palette"] .dashboard-category-card{
  gap:.7rem!important;
  padding:.78rem .9rem!important;
  border-radius:16px!important;
}

html[data-theme="palette"] .dashboard-category-card h3{
  font-size:1.08rem!important;
}

html[data-theme="palette"] .dashboard-category-card p{
  font-size:.82rem!important;
}

html[data-theme="palette"] .lesson-card{
  min-height:0!important;
  padding:15px!important;
  border-radius:17px!important;
}

html[data-theme="palette"] .lesson-card h2,
html[data-theme="palette"] .lesson-card h3{
  font-size:1.08rem!important;
}

/* ---------- Admin content cards ---------- */
html[data-theme="palette"] .admin-content-card{
  min-height:118px!important;
  gap:.7rem!important;
  padding:.9rem!important;
  border-radius:18px!important;
}

html[data-theme="palette"] .admin-content-card h2{
  margin:.18rem 0 .26rem!important;
  font-size:1.08rem!important;
}

html[data-theme="palette"] .admin-content-card p{
  font-size:.82rem!important;
  line-height:1.48!important;
}

html[data-theme="palette"] .admin-content-stats .stat-card{
  min-height:70px!important;
  padding:.62rem!important;
}

html[data-theme="palette"] .admin-content-stats .stat-card strong{
  font-size:1.25rem!important;
}

/* ---------- Buttons inside cards ---------- */
html[data-theme="palette"] .card .btn,
html[data-theme="palette"] .paper-card .btn,
html[data-theme="palette"] .kb-doc-card .btn,
html[data-theme="palette"] .dropdown-family-card .btn,
html[data-theme="palette"] .progress-hub-card .btn,
html[data-theme="palette"] .exam-category-card .btn,
html[data-theme="palette"] .notes-category-card .btn{
  min-height:40px!important;
  padding:0 13px!important;
  border-radius:11px!important;
  font-size:.78rem!important;
}

/* ---------- Slightly compact preview card ---------- */
html[data-theme="palette"] .exam-preview{
  padding:19px!important;
  border-radius:21px!important;
}

html[data-theme="palette"] .exam-preview h2{
  margin:17px 0!important;
  font-size:clamp(1.25rem,2vw,1.75rem)!important;
}

html[data-theme="palette"] .exam-preview-options > div{
  min-height:48px!important;
  padding:8px 10px!important;
  border-radius:11px!important;
}

/* ---------- Responsive compacting ---------- */
@media (min-width:1100px){
  html[data-theme="palette"] .progress-hub-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}

@media (max-width:820px){
  html[data-theme="palette"] .dropdown-hub-hero,
  html[data-theme="palette"] .dropdown-family-page-head,
  html[data-theme="palette"] .papers-hub-hero,
  html[data-theme="palette"] .category-page-head,
  html[data-theme="palette"] .notes-hub-hero,
  html[data-theme="palette"] .notes-category-page-head,
  html[data-theme="palette"] .notes-category-intro{
    padding:17px!important;
    border-radius:17px!important;
  }

  html[data-theme="palette"] .dropdown-family-card,
  html[data-theme="palette"] .progress-hub-card,
  html[data-theme="palette"] .exam-category-card,
  html[data-theme="palette"] .notes-category-card,
  html[data-theme="palette"] .kb-doc-card,
  html[data-theme="palette"] .paper-card{
    padding:14px!important;
    border-radius:16px!important;
  }
}


/* =========================================================
   v3.15.5 — Hero dots and spacing repair
   Replace category selector boxes with dots and correct the
   three marked spacing/overlap issues on the premium homepage.
   ========================================================= */
html[data-theme="palette"] main.container.compact-home-main{
  margin-top:0!important;
  padding-top:9px!important;
}

html[data-theme="palette"] .compact-home-main .home-world-time-bar{
  margin:0 0 8px!important;
}

html[data-theme="palette"] .home-category-hero{
  grid-template-columns:minmax(0,1.04fr) minmax(420px,.96fr)!important;
  min-height:560px!important;
  padding:34px clamp(38px,4vw,58px) 42px!important;
  gap:clamp(32px,4vw,54px)!important;
}

html[data-theme="palette"] .landing-hero-copy{
  min-width:0!important;
  max-width:680px!important;
  align-self:center!important;
}

html[data-theme="palette"] .home-category-hero h1{
  max-width:670px!important;
  margin:.38em 0 .23em!important;
  font-size:clamp(3rem,4.75vw,5.2rem)!important;
  line-height:1!important;
  letter-spacing:-.058em!important;
  overflow-wrap:break-word!important;
  word-break:normal!important;
}

html[data-theme="palette"] .exam-preview{
  width:min(100%,510px)!important;
  justify-self:end!important;
  margin-left:auto!important;
  transform:none!important;
}

html[data-theme="palette"] .home-hero-category-dots{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  width:max-content!important;
  margin:20px 0 18px!important;
  padding:8px 10px!important;
  border:1px solid rgba(255,255,255,.11)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.055)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05)!important;
}

html[data-theme="palette"] .home-hero-category-dot{
  appearance:none!important;
  display:block!important;
  width:10px!important;
  min-width:10px!important;
  height:10px!important;
  min-height:10px!important;
  padding:0!important;
  border:1px solid rgba(255,255,255,.42)!important;
  border-radius:50%!important;
  background:rgba(255,255,255,.28)!important;
  box-shadow:none!important;
  cursor:pointer!important;
  transition:transform .18s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease!important;
}

html[data-theme="palette"] .home-hero-category-dot:hover{
  transform:scale(1.22)!important;
  border-color:#C9A227!important;
  background:rgba(201,162,39,.58)!important;
}

html[data-theme="palette"] .home-hero-category-dot.active{
  width:12px!important;
  min-width:12px!important;
  height:12px!important;
  min-height:12px!important;
  border-color:#C9A227!important;
  background:#C9A227!important;
  box-shadow:0 0 0 4px rgba(201,162,39,.18)!important;
}

html[data-theme="palette"] .home-hero-category-dot:focus-visible{
  outline:2px solid #C9A227!important;
  outline-offset:4px!important;
}

/* Neutralize historical box-tab decoration rules for the new dot control. */
html[data-theme="palette"] .home-hero-category-dot::before,
html[data-theme="palette"] .home-hero-category-dot::after{
  content:none!important;
  display:none!important;
}

@media(max-width:1180px){
  html[data-theme="palette"] .home-category-hero{
    grid-template-columns:minmax(0,1fr)!important;
    padding:28px!important;
    gap:28px!important;
  }

  html[data-theme="palette"] .landing-hero-copy{
    max-width:none!important;
  }

  html[data-theme="palette"] .home-category-hero h1{
    max-width:860px!important;
    font-size:clamp(2.8rem,7vw,5rem)!important;
  }

  html[data-theme="palette"] .exam-preview{
    width:min(100%,680px)!important;
    justify-self:start!important;
    margin-left:0!important;
  }
}

@media(max-width:820px){
  html[data-theme="palette"] main.container.compact-home-main{
    padding-top:6px!important;
  }

  html[data-theme="palette"] .compact-home-main .home-world-time-bar{
    margin-bottom:6px!important;
  }

  html[data-theme="palette"] .home-category-hero{
    padding:22px 18px 25px!important;
    gap:22px!important;
  }

  html[data-theme="palette"] .home-category-hero h1{
    font-size:clamp(2.35rem,11.2vw,4rem)!important;
  }

  html[data-theme="palette"] .home-hero-category-dots{
    margin:17px 0 16px!important;
  }
}


/* =========================================================
   v3.15.6 — Transparent Header Canvas
   Remove the full-width dark strip and keep only the three
   floating header controls: brand, navigation and profile.
   ========================================================= */
@media (min-width: 821px) {
  html[data-theme="palette"] .topbar {
    background: transparent !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
  }

  html[data-theme="palette"] .topbar::before,
  html[data-theme="palette"] .topbar::after {
    content: none !important;
    display: none !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html[data-theme="palette"] .brand-logo-link,
  html[data-theme="palette"] .primary-nav,
  html[data-theme="palette"] .compact-profile-menu > summary {
    position: relative !important;
    z-index: 2 !important;
  }

  html[data-theme="palette"] .brand-logo-link {
    background: rgba(255, 255, 255, .97) !important;
    border-color: rgba(201,162,39, .82) !important;
    box-shadow:
      0 12px 30px rgba(0,0,0, .16),
      inset 0 1px 0 rgba(255, 255, 255, .98) !important;
  }

  html[data-theme="palette"] .primary-nav {
    background: rgba(255, 255, 255, .97) !important;
    border-color: rgba(201,162,39, .64) !important;
    box-shadow:
      0 15px 38px rgba(0,0,0, .17),
      inset 0 1px 0 rgba(255, 255, 255, 1) !important;
  }

  html[data-theme="palette"] .compact-profile-menu > summary {
    background: rgba(255, 255, 255, .97) !important;
    box-shadow:
      0 12px 30px rgba(0,0,0, .17),
      0 0 0 4px rgba(255, 255, 255, .22),
      inset 0 1px 0 rgba(255, 255, 255, .98) !important;
  }
}

@media (max-width: 820px) {
  html[data-theme="palette"] .topbar {
    background: rgba(243, 244, 247, .76) !important;
    border-bottom: 0 !important;
    box-shadow: 0 8px 22px rgba(0,0,0, .07) !important;
    -webkit-backdrop-filter: blur(16px) saturate(130%);
    backdrop-filter: blur(16px) saturate(130%);
  }

  html[data-theme="palette"] .topbar::before,
  html[data-theme="palette"] .topbar::after {
    content: none !important;
    display: none !important;
  }
}


/* =========================================================
   v3.15.7 — Frosted Blur Header
   Replace the transparent header canvas with a full-width
   frosted-glass blur surface while preserving floating pills.
   ========================================================= */
html[data-theme="palette"] .topbar {
  position: sticky !important;
  top: 0 !important;
  isolation: isolate !important;
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, .78) 0%,
      rgba(243, 244, 247, .68) 100%
    ) !important;
  border-bottom: 1px solid rgba(201,162,39, .44) !important;
  box-shadow:
    0 10px 28px rgba(0,0,0, .10),
    inset 0 1px 0 rgba(255, 255, 255, .78) !important;
  -webkit-backdrop-filter: blur(24px) saturate(145%) !important;
  backdrop-filter: blur(24px) saturate(145%) !important;
}

html[data-theme="palette"] .topbar::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1 !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(201,162,39, .15), transparent 30%),
    linear-gradient(90deg, rgba(255,255,255,.22), rgba(71,85,105,.03), rgba(255,255,255,.18)) !important;
  opacity: .95 !important;
}

html[data-theme="palette"] .topbar::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: -1px !important;
  height: 1px !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(201,162,39, .72) 18%,
    rgba(201,162,39, .72) 82%,
    transparent
  ) !important;
}

html[data-theme="palette"] .brand-logo-link,
html[data-theme="palette"] .primary-nav,
html[data-theme="palette"] .compact-profile-menu > summary,
html[data-theme="palette"] .mobile-nav-toggle {
  position: relative !important;
  z-index: 2 !important;
  background: rgba(255, 255, 255, .88) !important;
  -webkit-backdrop-filter: blur(18px) saturate(150%) !important;
  backdrop-filter: blur(18px) saturate(150%) !important;
}

html[data-theme="palette"] .brand-logo-link {
  border-color: rgba(201,162,39, .72) !important;
  box-shadow:
    0 10px 26px rgba(0,0,0, .13),
    inset 0 1px 0 rgba(255, 255, 255, .90) !important;
}

html[data-theme="palette"] .primary-nav {
  border-color: rgba(201,162,39, .54) !important;
  box-shadow:
    0 13px 34px rgba(0,0,0, .14),
    inset 0 1px 0 rgba(255, 255, 255, .92) !important;
}

html[data-theme="palette"] .compact-profile-menu > summary {
  border-color: rgba(201,162,39, .86) !important;
  box-shadow:
    0 10px 27px rgba(0,0,0, .14),
    0 0 0 3px rgba(255, 255, 255, .28),
    inset 0 1px 0 rgba(255, 255, 255, .92) !important;
}

@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  html[data-theme="palette"] .topbar {
    background: rgba(243, 244, 247, .96) !important;
  }
}

@media (max-width: 820px) {
  html[data-theme="palette"] .topbar {
    background:
      linear-gradient(
        180deg,
        rgba(255,255,255,.84),
        rgba(243,244,247,.76)
      ) !important;
    -webkit-backdrop-filter: blur(20px) saturate(140%) !important;
    backdrop-filter: blur(20px) saturate(140%) !important;
    box-shadow: 0 8px 24px rgba(0,0,0,.09) !important;
  }
}


/* =========================================================
   v3.15.8 — Mobile UI Precision Repair
   Fixes based on the annotated iPhone screenshots.
   ========================================================= */
@media (max-width: 700px) {
  html[data-theme="palette"] .home-active-attempt{
    gap:10px!important;padding:16px!important;border-radius:20px!important;
  }
  html[data-theme="palette"] .home-active-label-row{
    display:flex!important;flex-direction:row!important;align-items:center!important;
    justify-content:space-between!important;gap:8px!important;width:100%!important;
  }
  html[data-theme="palette"] .home-active-badge{
    flex:0 0 auto!important;padding:7px 10px!important;font-size:.68rem!important;
  }
  html[data-theme="palette"] .home-active-category{
    flex:0 0 auto!important;margin-left:auto!important;padding:6px 11px!important;
    border-color:rgba(201,162,39,.62)!important;background:rgba(255,247,234,.93)!important;
  }
  html[data-theme="palette"] .home-active-category small{display:none!important}
  html[data-theme="palette"] .home-active-category strong{font-size:.72rem!important;color:#0F172A!important}
  html[data-theme="palette"] .home-active-copy h2{
    margin:8px 0 4px!important;font-size:clamp(1.55rem,8.5vw,2rem)!important;line-height:1.08!important;
  }
  html[data-theme="palette"] .home-active-copy>p{display:none!important}
  html[data-theme="palette"] .home-active-progress-line{gap:6px!important;margin-top:10px!important}
  html[data-theme="palette"] .home-active-progress-line strong{font-size:.73rem!important}
  html[data-theme="palette"] .home-active-time-panel{
    width:100%!important;min-width:0!important;padding:12px 14px!important;border-radius:15px!important;
  }
  html[data-theme="palette"] .home-active-time-panel small{font-size:.70rem!important}
  html[data-theme="palette"] .home-active-timer{margin:3px 0!important;font-size:2.15rem!important}
  html[data-theme="palette"] .home-active-continue{min-width:0!important;min-height:48px!important}

  html[data-theme="palette"] .exam-title{
    display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;gap:8px!important;margin:0 0 8px!important;
  }
  html[data-theme="palette"] .exam-title>div{min-width:0!important}
  html[data-theme="palette"] .exam-title .eyebrow{
    display:block!important;max-width:100%!important;margin:0 0 3px!important;
    overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;
    font-size:.67rem!important;letter-spacing:.085em!important;
  }
  html[data-theme="palette"] .exam-title h1{margin:0!important;font-size:2.05rem!important;line-height:1.02!important}
  html[data-theme="palette"] .save-state{
    align-self:start!important;padding:6px 10px!important;border:1px solid rgba(201,162,39,.52)!important;
    border-radius:999px!important;background:#FBF5E5!important;color:#0F172A!important;
    font-size:.72rem!important;line-height:1!important;
  }

  html[data-theme="palette"] .question-card{padding:15px 14px!important;border-radius:18px!important}
  html[data-theme="palette"] .question-top{margin-bottom:10px!important;font-size:.74rem!important}
  html[data-theme="palette"] .exam-question-visual{margin:0 0 12px!important}
  html[data-theme="palette"] .jp-question{
    margin:12px 0 14px!important;font-size:clamp(1.27rem,6.2vw,1.55rem)!important;line-height:1.68!important;
  }
  html[data-theme="palette"] .options{gap:8px!important;margin:14px 0 12px!important}
  html[data-theme="palette"] .option{
    min-height:64px!important;padding:10px 11px!important;border-width:1px!important;
    border-radius:13px!important;gap:10px!important;
  }
  html[data-theme="palette"] .option-letter{width:34px!important;height:34px!important;font-size:1rem!important}
  html[data-theme="palette"] .jp-option{line-height:1.52!important}

  html[data-theme="palette"] .review-check{
    width:max-content!important;min-height:39px!important;padding:7px 10px!important;
    margin:4px 0 0!important;border-radius:11px!important;font-size:.88rem!important;
  }
  html[data-theme="palette"] .review-check input{width:17px!important;height:17px!important}
  html[data-theme="palette"] .question-actions{margin-top:10px!important;gap:8px!important}
  html[data-theme="palette"] .question-action-left{
    display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;
  }
  html[data-theme="palette"] .question-action-right{
    display:grid!important;grid-template-columns:repeat(auto-fit,minmax(120px,1fr))!important;gap:8px!important;
  }
  html[data-theme="palette"] .question-actions .btn{
    min-height:44px!important;padding:0 10px!important;border-radius:11px!important;font-size:.88rem!important;
  }
  html[data-theme="palette"] .question-actions .prev{
    border:1px solid rgba(15,23,42,.18)!important;background:#F0F2F5!important;
    color:#0F172A!important;-webkit-text-fill-color:#0F172A!important;box-shadow:none!important;
  }
  html[data-theme="palette"] .question-actions .prev:disabled{
    opacity:.58!important;color:#59697C!important;-webkit-text-fill-color:#59697C!important;
  }
  html[data-theme="palette"] .question-actions .clear-answer{
    min-width:0!important;color:#9B3A45!important;-webkit-text-fill-color:#9B3A45!important;
  }
  html[data-theme="palette"] .question-actions .clear-answer:disabled{
    opacity:.42!important;color:#9B6570!important;-webkit-text-fill-color:#9B6570!important;
  }

  html[data-theme="palette"] .exam-sidebar{padding:13px!important;border-radius:18px!important}
  html[data-theme="palette"] .timer-box{
    padding:15px 14px!important;border:1px solid rgba(201,162,39,.72)!important;border-radius:16px!important;
    background:radial-gradient(circle at 85% 5%,rgba(201,162,39,.15),transparent 45%),
               linear-gradient(145deg,#0F172A 0%,#0F172A 100%)!important;
    box-shadow:0 14px 30px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.07)!important;
  }
  html[data-theme="palette"] .timer-box small,
  html[data-theme="palette"] .timer-tools>span{color:#D9E0E8!important}
  html[data-theme="palette"] .timer-box strong{color:#C9A227!important;font-size:2.6rem!important}
  html[data-theme="palette"] .timer-add-button{
    border-color:rgba(201,162,39,.42)!important;background:rgba(201,162,39,.12)!important;color:#FFF4E2!important;
  }
  html[data-theme="palette"] .progress-text{margin:10px 0 8px!important}
  html[data-theme="palette"] .exam-section-plan{
    display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;margin:9px 0 11px!important;
  }
  html[data-theme="palette"] .exam-section-plan button{
    min-height:66px!important;padding:9px 10px!important;border:1px solid rgba(15,23,42,.13)!important;
    border-radius:12px!important;background:#F6F7F9!important;color:#0F172A!important;
  }
  html[data-theme="palette"] .exam-section-plan button span{font-size:.82rem!important;line-height:1.28!important}
  html[data-theme="palette"] .exam-section-plan button small{margin-top:3px!important;color:#68778A!important;font-size:.62rem!important}
  html[data-theme="palette"] .exam-section-plan button.current{
    border-color:#C9A227!important;background:linear-gradient(180deg,#FFD080,#C9A227)!important;
    color:#0F172A!important;box-shadow:0 8px 18px rgba(201,162,39,.20)!important;
  }
  html[data-theme="palette"] .exam-section-plan button.current small{color:#475569!important}

  html[data-theme="palette"] .site-footer .footer-inner.footer-grid{
    width:calc(100% - 28px)!important;padding:28px 0 24px!important;gap:20px!important;
  }
  html[data-theme="palette"] .site-footer .footer-link-column,
  html[data-theme="palette"] .site-footer .footer-preferences-column,
  html[data-theme="palette"] .site-footer .footer-community-column{
    border:0!important;padding:0!important;
  }
  html[data-theme="palette"] .site-footer .footer-link-column h3,
  html[data-theme="palette"] .site-footer .footer-preferences-column h3,
  html[data-theme="palette"] .site-footer .footer-community-column h3{
    margin:0 0 10px!important;color:#C9A227!important;opacity:1!important;
    font-size:.76rem!important;letter-spacing:.10em!important;
  }
  html[data-theme="palette"] .site-footer .footer-link-column a::after{display:none!important;content:none!important}
  html[data-theme="palette"] .site-footer .footer-link-column nav{gap:8px!important}
  html[data-theme="palette"] .site-footer .footer-link-column a{color:#FFD08B!important;font-size:.88rem!important}

  html[data-theme="palette"] .footer-language-actions{
    display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:7px!important;max-width:none!important;
  }
  html[data-theme="palette"] .footer-language-actions a{
    display:grid!important;grid-template-columns:1fr!important;justify-items:center!important;
    gap:4px!important;min-width:0!important;min-height:58px!important;padding:7px 5px!important;text-align:center!important;
  }
  html[data-theme="palette"] .footer-language-actions a span{width:32px!important;height:27px!important}
  html[data-theme="palette"] .footer-language-actions a strong{width:100%!important;font-size:.66rem!important}
  html[data-theme="palette"] .footer-language-actions a.active{
    border-color:#C9A227!important;background:rgba(201,162,39,.14)!important;
  }
  html[data-theme="palette"] .footer-community-column{margin-top:2px!important}
  html[data-theme="palette"] .footer-community-column p{margin:0 0 11px!important;font-size:.78rem!important}
  html[data-theme="palette"] .footer-contact-block{gap:7px!important}
  html[data-theme="palette"] .footer-social{min-height:36px!important;padding:7px 10px!important;font-size:.72rem!important}
}


/* =========================================================
   v3.15.9 — Global Responsive Overflow Repair
   Applies to desktop, tablet and mobile.
   ========================================================= */

/* ---------- Root viewport containment ---------- */
html[data-theme="palette"] {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: clip !important;
}

html[data-theme="palette"] body {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow-x: clip !important;
}

html[data-theme="palette"] body *,
html[data-theme="palette"] body *::before,
html[data-theme="palette"] body *::after {
  box-sizing: border-box !important;
}

/* Every grid/flex child may shrink instead of forcing overflow. */
html[data-theme="palette"] main,
html[data-theme="palette"] section,
html[data-theme="palette"] article,
html[data-theme="palette"] aside,
html[data-theme="palette"] header,
html[data-theme="palette"] footer,
html[data-theme="palette"] nav,
html[data-theme="palette"] form,
html[data-theme="palette"] fieldset,
html[data-theme="palette"] div,
html[data-theme="palette"] label,
html[data-theme="palette"] span {
  min-width: 0;
}

/* ---------- Main page containers ---------- */
html[data-theme="palette"] .container,
html[data-theme="palette"] .container.exam-container,
html[data-theme="palette"] main.container,
html[data-theme="palette"] main.container.compact-home-main {
  max-width: calc(100vw - 20px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

html[data-theme="palette"] .exam-container,
html[data-theme="palette"] .exam-shell,
html[data-theme="palette"] .exam-main,
html[data-theme="palette"] .exam-sidebar,
html[data-theme="palette"] .translator-tool,
html[data-theme="palette"] .question-card,
html[data-theme="palette"] .options,
html[data-theme="palette"] .option,
html[data-theme="palette"] .question-actions {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

/* ---------- Exam title containment ---------- */
html[data-theme="palette"] .exam-title {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

html[data-theme="palette"] .exam-title > div {
  min-width: 0 !important;
  overflow: hidden !important;
}

html[data-theme="palette"] .exam-title .eyebrow,
html[data-theme="palette"] .exam-title h1 {
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}

html[data-theme="palette"] .save-state {
  max-width: 42vw !important;
  flex: 0 0 auto !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

/* ---------- Question media containment ---------- */
html[data-theme="palette"] .exam-question-visual {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

html[data-theme="palette"] .exam-question-visual-shell {
  display: grid !important;
  place-items: center !important;
  width: min(100%, 620px) !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  aspect-ratio: 16 / 10 !important;
  margin-inline: auto !important;
  overflow: hidden !important;
}

html[data-theme="palette"] .exam-question-image,
html[data-theme="palette"] .exam-question-visual-shell .exam-option-image,
html[data-theme="palette"] .exam-option-image,
html[data-theme="palette"] .review-image,
html[data-theme="palette"] .review-question-image {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
}

/* Answer-option picture shells must also shrink safely. */
html[data-theme="palette"] .exam-option-visual-shell {
  width: min(100%, 190px) !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

html[data-theme="palette"] .question-card.has-picture-options .option,
html[data-theme="palette"] .question-card.has-picture-options .option .jp-option,
html[data-theme="palette"] .question-card.has-picture-options .exam-option-visual-shell {
  min-width: 0 !important;
  max-width: 100% !important;
}

/* ---------- Japanese text and labels ---------- */
html[data-theme="palette"] .jp-question,
html[data-theme="palette"] .jp-option,
html[data-theme="palette"] .question-top,
html[data-theme="palette"] .question-top span,
html[data-theme="palette"] .question-top strong,
html[data-theme="palette"] .option,
html[data-theme="palette"] .option label,
html[data-theme="palette"] .option span,
html[data-theme="palette"] ruby,
html[data-theme="palette"] rt {
  max-width: 100% !important;
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}

html[data-theme="palette"] .option {
  grid-template-columns: auto minmax(0, 1fr) auto !important;
}

html[data-theme="palette"] .option .jp-option {
  width: 100% !important;
  min-width: 0 !important;
}

/* ---------- Action controls ---------- */
html[data-theme="palette"] .question-actions,
html[data-theme="palette"] .question-action-left,
html[data-theme="palette"] .question-action-right {
  max-width: 100% !important;
  min-width: 0 !important;
}

html[data-theme="palette"] .question-actions .btn {
  min-width: 0 !important;
  max-width: 100% !important;
  white-space: normal !important;
  text-align: center !important;
}

/* ---------- Translator and sidebar ---------- */
html[data-theme="palette"] .translator-tool *,
html[data-theme="palette"] .exam-sidebar *,
html[data-theme="palette"] .timer-box *,
html[data-theme="palette"] .exam-section-plan * {
  max-width: 100% !important;
  min-width: 0 !important;
}

html[data-theme="palette"] .translation-direction {
  max-width: 100% !important;
  overflow: hidden !important;
}

html[data-theme="palette"] textarea,
html[data-theme="palette"] input,
html[data-theme="palette"] select,
html[data-theme="palette"] button {
  max-width: 100% !important;
}

/* ---------- Generic cards and footer ---------- */
html[data-theme="palette"] .card,
html[data-theme="palette"] .paper-card,
html[data-theme="palette"] .notes-category-card,
html[data-theme="palette"] .dropdown-family-card,
html[data-theme="palette"] .progress-hub-card,
html[data-theme="palette"] .footer-inner,
html[data-theme="palette"] .footer-grid,
html[data-theme="palette"] .footer-language-actions,
html[data-theme="palette"] .footer-contact-block {
  max-width: 100% !important;
  min-width: 0 !important;
}

html[data-theme="palette"] .footer-language-actions a,
html[data-theme="palette"] .footer-link-column a,
html[data-theme="palette"] .footer-social {
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
}

/* ---------- Desktop/laptop safeguards ---------- */
@media (min-width: 901px) {
  html[data-theme="palette"] .container.exam-container {
    width: min(1500px, calc(100vw - 24px)) !important;
    max-width: calc(100vw - 24px) !important;
  }

  html[data-theme="palette"] .exam-container .exam-shell {
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
  }

  html[data-theme="palette"] .exam-question-visual-shell {
    width: min(100%, 660px) !important;
  }

  html[data-theme="palette"] .question-card {
    overflow: hidden !important;
  }
}

/* ---------- Tablet ---------- */
@media (min-width: 701px) and (max-width: 900px) {
  html[data-theme="palette"] .container.exam-container {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
  }

  html[data-theme="palette"] .exam-question-visual-shell {
    width: min(100%, 580px) !important;
  }

  html[data-theme="palette"] .question-card {
    padding: 18px !important;
  }
}

/* ---------- Mobile precision ---------- */
@media (max-width: 700px) {
  html[data-theme="palette"] .container.exam-container,
  html[data-theme="palette"] main.container {
    width: calc(100vw - 12px) !important;
    max-width: calc(100vw - 12px) !important;
    margin-left: 6px !important;
    margin-right: 6px !important;
  }

  html[data-theme="palette"] .exam-main {
    overflow: hidden !important;
  }

  html[data-theme="palette"] .exam-title {
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 6px !important;
    padding-inline: 2px !important;
  }

  html[data-theme="palette"] .exam-title h1 {
    font-size: clamp(1.72rem, 9vw, 2.05rem) !important;
  }

  html[data-theme="palette"] .save-state {
    max-width: 32vw !important;
    padding: 6px 9px !important;
    font-size: .68rem !important;
  }

  html[data-theme="palette"] .question-card {
    width: 100% !important;
    max-width: 100% !important;
    padding: 13px 10px !important;
    overflow: hidden !important;
  }

  html[data-theme="palette"] .question-top {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 8px !important;
    align-items: start !important;
  }

  html[data-theme="palette"] .question-top > * {
    min-width: 0 !important;
  }

  html[data-theme="palette"] .exam-question-visual {
    margin-inline: 0 !important;
    padding-inline: 0 !important;
  }

  html[data-theme="palette"] .exam-question-visual-shell {
    width: 100% !important;
    max-width: 100% !important;
    aspect-ratio: 16 / 10 !important;
    border-radius: 12px !important;
  }

  html[data-theme="palette"] .jp-question {
    font-size: clamp(1.12rem, 5.8vw, 1.42rem) !important;
    line-height: 1.62 !important;
  }

  html[data-theme="palette"] .options {
    width: 100% !important;
    max-width: 100% !important;
  }

  html[data-theme="palette"] .option {
    width: 100% !important;
    max-width: 100% !important;
    grid-template-columns: 38px minmax(0, 1fr) !important;
    padding: 10px !important;
    overflow: hidden !important;
  }

  html[data-theme="palette"] .option::after {
    display: none !important;
  }

  html[data-theme="palette"] .question-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  html[data-theme="palette"] .question-action-left,
  html[data-theme="palette"] .question-action-right {
    width: 100% !important;
  }

  html[data-theme="palette"] .question-action-left {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html[data-theme="palette"] .question-action-right {
    grid-template-columns: 1fr !important;
  }

  html[data-theme="palette"] .review-check {
    max-width: 100% !important;
    white-space: normal !important;
  }

  html[data-theme="palette"] .translator-tool,
  html[data-theme="palette"] .exam-sidebar {
    overflow: hidden !important;
  }

  html[data-theme="palette"] .exam-section-plan {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html[data-theme="palette"] .footer-language-actions {
    width: 100% !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

/* Very narrow phones */
@media (max-width: 380px) {
  html[data-theme="palette"] .container.exam-container,
  html[data-theme="palette"] main.container {
    width: calc(100vw - 8px) !important;
    max-width: calc(100vw - 8px) !important;
    margin-left: 4px !important;
    margin-right: 4px !important;
  }

  html[data-theme="palette"] .question-card {
    padding: 11px 8px !important;
  }

  html[data-theme="palette"] .exam-title .eyebrow {
    font-size: .61rem !important;
  }

  html[data-theme="palette"] .save-state {
    max-width: 29vw !important;
  }

  html[data-theme="palette"] .footer-language-actions a strong {
    font-size: .58rem !important;
  }
}


/* =========================================================
   v3.16.0 — Education Palette System
   LearnUp Blue     #0F172A
   Innovate Green   #0F766E
   Empower Orange   #C9A227
   Accessible Grey  #475569
   ========================================================= */
html[data-theme="palette"] {
  color-scheme: light !important;

  --edu-blue: #0F172A !important;
  --edu-green: #0F766E !important;
  --edu-orange: #C9A227 !important;
  --edu-grey: #475569 !important;

  --edu-blue-soft: #F1F5F9 !important;
  --edu-green-soft: #ECFDF5 !important;
  --edu-orange-soft: #FBF5E5 !important;
  --edu-grey-soft: #F3F3F3 !important;

  --bg: #F6F4EF !important;
  --surface: #FFFFFF !important;
  --surface-2: #F8FAFC !important;
  --text: #475569 !important;
  --muted: #475569 !important;
  --minimal-primary: #0F172A !important;
  --minimal-border: rgba(15,23,42, .18) !important;
  --minimal-shadow: 0 14px 34px rgba(15,23,42, .12) !important;

  --jp-palette-gold: #C9A227 !important;
  --jp-palette-navy: #0F172A !important;
  --jp-palette-slate: #475569 !important;
  --jp-palette-ink: #0F172A !important;
  --jp-palette-page: #F6F4EF !important;
  --jp-palette-surface: #FFFFFF !important;
  --jp-palette-border: rgba(15,23,42, .18) !important;
  --jp-palette-muted: #475569 !important;
  --jp-palette-gold-soft: rgba(201,162,39, .15) !important;
  --jp-palette-shadow: rgba(15,23,42, .12) !important;

  --premium-gold: #C9A227 !important;
  --premium-gold-strong: #C9A227 !important;
  --premium-navy: #0F172A !important;
  --premium-slate: #475569 !important;
  --premium-ink: #0F172A !important;
  --premium-paper: #FFFFFF !important;
  --premium-canvas: #F6F4EF !important;
  --premium-soft: #F8FAFC !important;
  --premium-warm: #FBF5E5 !important;
  --premium-line: rgba(15,23,42, .17) !important;
  --premium-line-strong: rgba(15,23,42, .28) !important;
  --premium-shadow-sm: 0 8px 24px rgba(15,23,42, .09) !important;
  --premium-shadow-md: 0 18px 46px rgba(15,23,42, .13) !important;
  --premium-shadow-lg: 0 30px 74px rgba(15,23,42, .17) !important;
}

html[data-theme="palette"],
html[data-theme="palette"] body {
  background:
    radial-gradient(circle at 8% 2%, rgba(15,23,42, .12), transparent 30rem),
    radial-gradient(circle at 94% 14%, rgba(15,118,110, .10), transparent 28rem),
    linear-gradient(180deg, #FAF9F6 0%, #F6F4EF 44%, #EFF7FA 100%) !important;
  color: #475569 !important;
}

html[data-theme="palette"] ::selection {
  background: #C9A227 !important;
  color: #FFFFFF !important;
}

html[data-theme="palette"] body,
html[data-theme="palette"] input,
html[data-theme="palette"] textarea,
html[data-theme="palette"] select,
html[data-theme="palette"] button {
  color: #475569 !important;
}

html[data-theme="palette"] h1,
html[data-theme="palette"] h2,
html[data-theme="palette"] h3,
html[data-theme="palette"] h4,
html[data-theme="palette"] h5,
html[data-theme="palette"] h6,
html[data-theme="palette"] .page-title,
html[data-theme="palette"] .section-title,
html[data-theme="palette"] .card-title,
html[data-theme="palette"] .widget-title {
  color: #0F172A !important;
}

html[data-theme="palette"] p,
html[data-theme="palette"] small,
html[data-theme="palette"] .muted,
html[data-theme="palette"] .text-muted,
html[data-theme="palette"] .helper-text,
html[data-theme="palette"] .caption,
html[data-theme="palette"] .form-help {
  color: #475569 !important;
}

html[data-theme="palette"] a {
  color: #0F172A !important;
}

html[data-theme="palette"] a:hover,
html[data-theme="palette"] a:focus-visible {
  color: #0F766E !important;
}

/* ---------- Frosted education header ---------- */
html[data-theme="palette"] .topbar {
  background:
    linear-gradient(
      180deg,
      rgba(15,23,42, .92) 0%,
      rgba(15,23,42, .82) 100%
    ) !important;
  border-bottom: 1px solid rgba(201,162,39, .72) !important;
  box-shadow:
    0 12px 30px rgba(15,23,42, .24),
    inset 0 1px 0 rgba(255, 255, 255, .20) !important;
  -webkit-backdrop-filter: blur(24px) saturate(145%) !important;
  backdrop-filter: blur(24px) saturate(145%) !important;
}

html[data-theme="palette"] .topbar::before {
  background:
    radial-gradient(circle at 12% 0%, rgba(255, 255, 255, .24), transparent 32%),
    linear-gradient(90deg, rgba(255,255,255,.10), rgba(15,118,110,.07), rgba(255,255,255,.10)) !important;
}

html[data-theme="palette"] .topbar::after {
  background: linear-gradient(
    90deg,
    transparent,
    rgba(201,162,39, .90) 18%,
    rgba(201,162,39, .90) 82%,
    transparent
  ) !important;
}

html[data-theme="palette"] .brand-logo-link,
html[data-theme="palette"] .primary-nav,
html[data-theme="palette"] .compact-profile-menu > summary,
html[data-theme="palette"] .mobile-nav-toggle {
  background: rgba(255, 255, 255, .96) !important;
  border-color: rgba(201,162,39, .72) !important;
  box-shadow:
    0 12px 30px rgba(15,23,42, .22),
    inset 0 1px 0 #FFFFFF !important;
}

html[data-theme="palette"] .brand-wordmark-copy strong {
  color: #0F172A !important;
}

html[data-theme="palette"] .brand-wordmark-copy small {
  color: #475569 !important;
}

/* ---------- Navigation states ---------- */
html[data-theme="palette"] .primary-nav > a,
html[data-theme="palette"] .primary-nav .header-nav-summary-link,
html[data-theme="palette"] .primary-nav .header-nav-main-toggle {
  color: #475569 !important;
}

html[data-theme="palette"] .primary-nav > a:hover,
html[data-theme="palette"] .primary-nav > .header-nav-dropdown > summary:hover {
  background: #ECFDF5 !important;
  color: #0F766E !important;
}

html[data-theme="palette"] .primary-nav > a.header-top-link.is-active,
html[data-theme="palette"] .primary-nav > a.header-top-link[aria-current="page"] {
  background: linear-gradient(180deg, #1E293B 0%, #0F172A 100%) !important;
  border-color: #0F172A !important;
  color: #FFFFFF !important;
  outline: 1px solid rgba(201,162,39, .68) !important;
  box-shadow:
    0 9px 22px rgba(15,23,42, .30),
    inset 0 1px 0 rgba(255,255,255,.18) !important;
}

html[data-theme="palette"] .primary-nav > .header-nav-dropdown[open] > summary,
html[data-theme="palette"] .primary-nav > .header-nav-dropdown.is-active[open] > summary {
  background: linear-gradient(180deg, #17988B 0%, #0F766E 100%) !important;
  border-color: #0F766E !important;
  color: #FFFFFF !important;
  box-shadow:
    0 9px 21px rgba(15,118,110, .28),
    inset 0 1px 0 rgba(255,255,255,.25) !important;
}

html[data-theme="palette"] .primary-nav > .header-nav-dropdown[open] > summary .header-nav-summary-link,
html[data-theme="palette"] .primary-nav > .header-nav-dropdown[open] > summary .header-nav-main-toggle {
  color: #FFFFFF !important;
}

/* ---------- Dropdowns ---------- */
html[data-theme="palette"] .header-nav-dropdown-menu,
html[data-theme="palette"] .header-nav-nested-menu {
  background: rgba(255,255,255,.985) !important;
  border-color: rgba(15,23,42,.22) !important;
  border-top-color: #C9A227 !important;
  box-shadow:
    0 25px 62px rgba(15,23,42,.20),
    inset 0 1px 0 #FFFFFF !important;
}

html[data-theme="palette"] .header-nav-nested > summary:hover,
html[data-theme="palette"] .header-nav-dropdown-menu > a:hover,
html[data-theme="palette"] .header-nav-nested-menu > a:hover,
html[data-theme="palette"] .header-nav-nested[open] > summary {
  background: #ECFDF5 !important;
  border-color: rgba(15,118,110,.52) !important;
  color: #0F766E !important;
}

html[data-theme="palette"] .header-nav-hierarchical-menu .header-nav-nested-menu::after {
  background: #C9A227 !important;
  box-shadow: 0 0 0 3px rgba(201,162,39,.14) !important;
}

/* ---------- Cards and panels ---------- */
html[data-theme="palette"] .card,
html[data-theme="palette"] .panel,
html[data-theme="palette"] .surface,
html[data-theme="palette"] .widget,
html[data-theme="palette"] .box,
html[data-theme="palette"] .modal-content,
html[data-theme="palette"] .table-wrap,
html[data-theme="palette"] .lesson-card,
html[data-theme="palette"] .paper-card,
html[data-theme="palette"] .note-card,
html[data-theme="palette"] .progress-card,
html[data-theme="palette"] .stat-card,
html[data-theme="palette"] .feature-card,
html[data-theme="palette"] .blog-card,
html[data-theme="palette"] .content-card,
html[data-theme="palette"] .dropdown-family-card,
html[data-theme="palette"] .progress-hub-card,
html[data-theme="palette"] .exam-category-card,
html[data-theme="palette"] .notes-category-card,
html[data-theme="palette"] .kb-doc-card,
html[data-theme="palette"] .question-card,
html[data-theme="palette"] .exam-sidebar,
html[data-theme="palette"] .exam-main {
  background: linear-gradient(180deg, #FFFFFF 0%, #FAFDFE 100%) !important;
  border-color: rgba(15,23,42,.18) !important;
  box-shadow:
    0 12px 30px rgba(15,23,42,.10),
    inset 0 1px 0 #FFFFFF !important;
}

html[data-theme="palette"] .landing-feature-grid article::after,
html[data-theme="palette"] .dropdown-family-card::after,
html[data-theme="palette"] .progress-hub-card::after,
html[data-theme="palette"] .exam-category-card::after,
html[data-theme="palette"] .notes-category-card::after,
html[data-theme="palette"] .paper-card::after,
html[data-theme="palette"] .lesson-card::after {
  background: linear-gradient(90deg, #0F172A, #0F766E, #C9A227) !important;
}

html[data-theme="palette"] .card:hover,
html[data-theme="palette"] .content-card:hover,
html[data-theme="palette"] .dropdown-family-card:hover,
html[data-theme="palette"] .progress-hub-card:hover,
html[data-theme="palette"] .exam-category-card:hover,
html[data-theme="palette"] .notes-category-card:hover,
html[data-theme="palette"] .paper-card:hover,
html[data-theme="palette"] .lesson-card:hover {
  border-color: rgba(15,118,110,.66) !important;
  box-shadow:
    0 22px 50px rgba(15,23,42,.16),
    inset 0 1px 0 #FFFFFF !important;
}

/* ---------- Icons, marks and badges ---------- */
html[data-theme="palette"] .feature-icon,
html[data-theme="palette"] .dropdown-family-mark,
html[data-theme="palette"] .progress-hub-icon,
html[data-theme="palette"] .exam-category-mark,
html[data-theme="palette"] .notes-category-mark {
  background: linear-gradient(180deg, #138A7E 0%, #0F766E 100%) !important;
  border-color: #0F766E !important;
  color: #FFFFFF !important;
  box-shadow:
    0 10px 22px rgba(15,118,110,.22),
    inset 0 1px 0 rgba(255,255,255,.25) !important;
}

html[data-theme="palette"] .badge,
html[data-theme="palette"] .tag,
html[data-theme="palette"] .chip,
html[data-theme="palette"] .pill,
html[data-theme="palette"] .label,
html[data-theme="palette"] .status-badge,
html[data-theme="palette"] .notice-badge {
  background: #ECFDF5 !important;
  border-color: rgba(15,118,110,.42) !important;
  color: #0F766E !important;
}

/* ---------- Buttons ---------- */
html[data-theme="palette"] .btn.primary,
html[data-theme="palette"] .cta-button,
html[data-theme="palette"] .primary-button,
html[data-theme="palette"] input[type="submit"],
html[data-theme="palette"] button[type="submit"] {
  background: linear-gradient(180deg, #D8B84A 0%, #C9A227 100%) !important;
  border-color: #C9A227 !important;
  color: #FFFFFF !important;
  box-shadow:
    0 12px 26px rgba(201,162,39,.24),
    inset 0 1px 0 rgba(255,255,255,.34) !important;
}

html[data-theme="palette"] .btn.primary:hover,
html[data-theme="palette"] .cta-button:hover,
html[data-theme="palette"] .primary-button:hover,
html[data-theme="palette"] input[type="submit"]:hover,
html[data-theme="palette"] button[type="submit"]:hover {
  background: linear-gradient(180deg, #D1A934 0%, #B88915 100%) !important;
  border-color: #B88915 !important;
  color: #FFFFFF !important;
}

html[data-theme="palette"] .btn.secondary,
html[data-theme="palette"] .secondary-button,
html[data-theme="palette"] .btn-outline,
html[data-theme="palette"] .outline-button {
  background: linear-gradient(180deg, #138A7E 0%, #0F766E 100%) !important;
  border-color: #0F766E !important;
  color: #FFFFFF !important;
}

html[data-theme="palette"] .btn.secondary:hover,
html[data-theme="palette"] .secondary-button:hover,
html[data-theme="palette"] .btn-outline:hover,
html[data-theme="palette"] .outline-button:hover {
  background: #0D675F !important;
  border-color: #0D675F !important;
  color: #FFFFFF !important;
}

/* ---------- Homepage world time ---------- */
html[data-theme="palette"] .home-world-time-bar {
  background: linear-gradient(180deg, #FFFFFF, #F8FAFC) !important;
  border-color: rgba(15,23,42,.30) !important;
  box-shadow:
    0 12px 30px rgba(15,23,42,.11),
    inset 0 1px 0 #FFFFFF !important;
}

html[data-theme="palette"] .home-world-time-label {
  color: #0F172A !important;
}

html[data-theme="palette"] .home-world-time-label i {
  background: #0F766E !important;
  box-shadow: 0 0 0 5px rgba(15,118,110,.16) !important;
}

html[data-theme="palette"] .home-world-code {
  background: #0F172A !important;
  border-color: #0F172A !important;
  color: #FFFFFF !important;
}

html[data-theme="palette"] .home-world-clock strong {
  color: #0F172A !important;
}

html[data-theme="palette"] .home-world-difference {
  background: #FBF5E5 !important;
  border-color: rgba(201,162,39,.52) !important;
  color: #475569 !important;
}

/* ---------- Hero ---------- */
html[data-theme="palette"] .home-category-hero {
  background:
    radial-gradient(circle at 84% 18%, rgba(15,118,110,.22), transparent 27rem),
    radial-gradient(circle at 16% 88%, rgba(201,162,39,.14), transparent 30rem),
    linear-gradient(138deg, #0F172A 0%, #0F172A 62%, #111827 100%) !important;
  border-color: rgba(201,162,39,.62) !important;
  box-shadow:
    0 32px 80px rgba(15,23,42,.26),
    inset 0 1px 0 rgba(255,255,255,.12) !important;
}

html[data-theme="palette"] .home-category-hero h1 {
  color: #FFFFFF !important;
}

html[data-theme="palette"] .home-category-hero .landing-hero-copy > p,
html[data-theme="palette"] .landing-trust-row {
  color: rgba(255,255,255,.88) !important;
}

html[data-theme="palette"] .landing-badge {
  background: #FBF5E5 !important;
  border-color: #C9A227 !important;
  color: #475569 !important;
}

html[data-theme="palette"] .landing-badge i,
html[data-theme="palette"] .exam-preview-label i,
html[data-theme="palette"] .home-active-badge i,
html[data-theme="palette"] .landing-trust-row span::before {
  background: #0F766E !important;
}

html[data-theme="palette"] .home-hero-category-tab {
  background: rgba(255,255,255,.12) !important;
  border-color: rgba(255,255,255,.24) !important;
  color: #FFFFFF !important;
}

html[data-theme="palette"] .home-hero-category-tab:hover {
  background: rgba(15,118,110,.26) !important;
  border-color: #0F766E !important;
}

html[data-theme="palette"] .home-hero-category-tab.active {
  background: linear-gradient(180deg, #D8B84A, #C9A227) !important;
  border-color: #C9A227 !important;
  color: #FFFFFF !important;
}

html[data-theme="palette"] .home-hero-category-tab.active b {
  background: #0F172A !important;
  border-color: #0F172A !important;
  color: #FFFFFF !important;
}

html[data-theme="palette"] .home-hero-category-tab.active span {
  color: #FFFFFF !important;
}

/* ---------- Exam preview ---------- */
html[data-theme="palette"] .exam-preview {
  border-color: rgba(15,23,42,.20) !important;
  border-top-color: #C9A227 !important;
  background: linear-gradient(180deg, #FFFFFF, #FAF9F6) !important;
  box-shadow:
    0 30px 70px rgba(15,23,42,.28),
    inset 0 1px 0 #FFFFFF !important;
}

html[data-theme="palette"] .exam-preview-progress span,
html[data-theme="palette"] .exam-progress span,
html[data-theme="palette"] .home-active-progress-track span,
html[data-theme="palette"] .progress-fill {
  background: linear-gradient(90deg, #0F766E, #17988B) !important;
}

html[data-theme="palette"] .exam-preview-options b,
html[data-theme="palette"] .option-letter {
  background: #C9A227 !important;
  border-color: #C9A227 !important;
  color: #FFFFFF !important;
}

html[data-theme="palette"] .exam-preview-save span {
  background: #0F766E !important;
  color: #FFFFFF !important;
}

html[data-theme="palette"] .home-hero-category-open {
  background: #ECFDF5 !important;
  border-color: #0F766E !important;
  color: #0F766E !important;
}

html[data-theme="palette"] .home-hero-category-open:hover {
  background: #0F766E !important;
  color: #FFFFFF !important;
}

/* ---------- Forms ---------- */
html[data-theme="palette"] input,
html[data-theme="palette"] textarea,
html[data-theme="palette"] select {
  background: #FFFFFF !important;
  border-color: rgba(15,23,42,.22) !important;
  color: #475569 !important;
}

html[data-theme="palette"] input:focus,
html[data-theme="palette"] textarea:focus,
html[data-theme="palette"] select:focus {
  border-color: #0F766E !important;
  box-shadow: 0 0 0 4px rgba(15,118,110,.18) !important;
}

/* ---------- Exam interface ---------- */
html[data-theme="palette"] .option {
  background: #F8FAFC !important;
  border-color: rgba(15,23,42,.18) !important;
  color: #475569 !important;
}

html[data-theme="palette"] .option:hover {
  background: #ECFDF5 !important;
  border-color: rgba(15,118,110,.68) !important;
}

html[data-theme="palette"] .option:has(input:checked) {
  background: #ECFDF5 !important;
  border-color: #0F766E !important;
  box-shadow: 0 0 0 3px rgba(15,118,110,.16) !important;
}

html[data-theme="palette"] .question-no,
html[data-theme="palette"] .navigator button.current {
  background: #0F172A !important;
  border-color: #0F172A !important;
  color: #FFFFFF !important;
}

html[data-theme="palette"] .timer-box {
  background:
    radial-gradient(circle at 85% 5%, rgba(15,118,110,.20), transparent 45%),
    linear-gradient(145deg, #0F172A 0%, #111827 100%) !important;
  border-color: rgba(201,162,39,.72) !important;
}

html[data-theme="palette"] .timer-box strong {
  color: #FFFFFF !important;
}

html[data-theme="palette"] .timer-add-button {
  background: rgba(201,162,39,.18) !important;
  border-color: rgba(201,162,39,.55) !important;
  color: #FFFFFF !important;
}

html[data-theme="palette"] .exam-section-plan button.current {
  background: linear-gradient(180deg, #138A7E, #0F766E) !important;
  border-color: #0F766E !important;
  color: #FFFFFF !important;
}

html[data-theme="palette"] .exam-section-plan button.current small {
  color: rgba(255,255,255,.82) !important;
}

/* ---------- Tables ---------- */
html[data-theme="palette"] table th,
html[data-theme="palette"] .table th,
html[data-theme="palette"] .data-table th {
  background: #0F172A !important;
  border-color: rgba(255,255,255,.18) !important;
  color: #FFFFFF !important;
}

html[data-theme="palette"] table td,
html[data-theme="palette"] .table td,
html[data-theme="palette"] .data-table td {
  border-color: rgba(15,23,42,.14) !important;
  color: #475569 !important;
}

html[data-theme="palette"] table tr:nth-child(even) td,
html[data-theme="palette"] .table tbody tr:nth-child(even) td,
html[data-theme="palette"] .data-table tbody tr:nth-child(even) td {
  background: #F6F4EF !important;
}

/* ---------- Pagination ---------- */
html[data-theme="palette"] .pagination a,
html[data-theme="palette"] .pagination button,
html[data-theme="palette"] .page-link {
  background: #FFFFFF !important;
  border-color: rgba(15,23,42,.22) !important;
  color: #0F172A !important;
}

html[data-theme="palette"] .pagination a:hover,
html[data-theme="palette"] .pagination button:hover,
html[data-theme="palette"] .page-link:hover {
  background: #ECFDF5 !important;
  border-color: #0F766E !important;
  color: #0F766E !important;
}

html[data-theme="palette"] .pagination .active,
html[data-theme="palette"] .pagination .active a,
html[data-theme="palette"] .page-item.active .page-link {
  background: #0F172A !important;
  border-color: #0F172A !important;
  color: #FFFFFF !important;
}

/* ---------- Semantic notices ---------- */
html[data-theme="palette"] .alert-success,
html[data-theme="palette"] .notice-success,
html[data-theme="palette"] .dropdown-family-status.is-live {
  background: #ECFDF5 !important;
  border-color: rgba(15,118,110,.48) !important;
  color: #0F766E !important;
}

html[data-theme="palette"] .alert-info,
html[data-theme="palette"] .notice-info {
  background: #F1F5F9 !important;
  border-color: rgba(15,23,42,.32) !important;
  color: #0F172A !important;
}

html[data-theme="palette"] .dropdown-family-status.is-planned {
  background: #FBF5E5 !important;
  border-color: rgba(201,162,39,.48) !important;
  color: #C77F00 !important;
}

/* ---------- Footer ---------- */
html[data-theme="palette"] .site-footer,
html[data-theme="palette"] .footer {
  background:
    radial-gradient(circle at 12% 0%, rgba(15,118,110,.16), transparent 24rem),
    linear-gradient(145deg, #0F172A 0%, #0F172A 72%, #111827 100%) !important;
  border-top-color: #C9A227 !important;
  color: #FFFFFF !important;
  box-shadow: 0 -18px 46px rgba(15,23,42,.18) !important;
}

html[data-theme="palette"] .site-footer p,
html[data-theme="palette"] .site-footer small,
html[data-theme="palette"] .site-footer .muted,
html[data-theme="palette"] .footer p,
html[data-theme="palette"] .footer small {
  color: rgba(255,255,255,.82) !important;
}

html[data-theme="palette"] .site-footer h2,
html[data-theme="palette"] .site-footer h3,
html[data-theme="palette"] .footer h2,
html[data-theme="palette"] .footer h3 {
  color: #FFFFFF !important;
}

html[data-theme="palette"] .site-footer a,
html[data-theme="palette"] .footer a {
  color: #FFFFFF !important;
}

html[data-theme="palette"] .site-footer a:hover,
html[data-theme="palette"] .footer a:hover {
  color: #C9A227 !important;
}

html[data-theme="palette"] .footer-language-actions a.active {
  background: rgba(15,118,110,.26) !important;
  border-color: #0F766E !important;
  color: #FFFFFF !important;
}

html[data-theme="palette"] .footer-social {
  border-color: rgba(255,255,255,.30) !important;
  color: #FFFFFF !important;
}

html[data-theme="palette"] .footer-social:hover {
  background: rgba(201,162,39,.18) !important;
  border-color: #C9A227 !important;
  color: #FFFFFF !important;
}

/* ---------- Mobile ---------- */
@media (max-width: 820px) {
  html[data-theme="palette"] .topbar {
    background:
      linear-gradient(
        180deg,
        rgba(15,23,42,.92),
        rgba(15,23,42,.82)
      ) !important;
  }

  html[data-theme="palette"] .mobile-nav-drawer,
  html[data-theme="palette"] .mobile-nav-panel {
    background: #FFFFFF !important;
    border-color: rgba(15,23,42,.20) !important;
  }

  html[data-theme="palette"] .mobile-nav-group > summary:hover,
  html[data-theme="palette"] .mobile-nav-subgroup > summary:hover,
  html[data-theme="palette"] .mobile-nav-main-link:hover,
  html[data-theme="palette"] .mobile-nav-family-link:hover {
    background: #ECFDF5 !important;
    color: #0F766E !important;
  }
}


/* =========================================================
   v3.16.1 — Luxury Contrast UI
   Deep Navy      #0F172A
   Navy Slate     #1E293B
   Champagne Gold #C9A227
   Warm Ivory     #F6F4EF
   Charcoal Text  #334155
   Muted Slate    #64748B
   Emerald        #0F766E
   ========================================================= */
html[data-theme="palette"]{
  color-scheme: light!important;
  --luxury-navy:#0F172A!important;
  --luxury-slate:#1E293B!important;
  --luxury-gold:#C9A227!important;
  --luxury-gold-soft:#E8D9A0!important;
  --luxury-ivory:#F6F4EF!important;
  --luxury-paper:#FFFFFF!important;
  --luxury-text:#334155!important;
  --luxury-muted:#64748B!important;
  --luxury-emerald:#0F766E!important;
  --luxury-line:rgba(15,23,42,.12)!important;
  --luxury-shadow:0 18px 48px rgba(15,23,42,.12)!important;

  --bg:#F6F4EF!important;
  --surface:#FFFFFF!important;
  --surface-2:#F8FAFC!important;
  --text:#334155!important;
  --muted:#64748B!important;
  --minimal-primary:#0F172A!important;
  --minimal-border:rgba(15,23,42,.12)!important;
  --jp-palette-gold:#C9A227!important;
  --jp-palette-navy:#0F172A!important;
  --jp-palette-slate:#475569!important;
  --jp-palette-ink:#0F172A!important;
  --jp-palette-page:#F6F4EF!important;
  --jp-palette-muted:#64748B!important;
  --premium-gold:#C9A227!important;
  --premium-gold-strong:#B78D16!important;
  --premium-navy:#0F172A!important;
  --premium-slate:#475569!important;
  --premium-ink:#0F172A!important;
  --premium-canvas:#F6F4EF!important;
  --premium-warm:#FBF5E5!important;
}

html[data-theme="palette"],
html[data-theme="palette"] body{
  background:
    radial-gradient(circle at 10% 0%,rgba(201,162,39,.10),transparent 28rem),
    radial-gradient(circle at 92% 12%,rgba(15,118,110,.07),transparent 28rem),
    linear-gradient(180deg,#FBFAF7 0%,#F6F4EF 45%,#F2F0EA 100%)!important;
  color:#334155!important;
}

html[data-theme="palette"] body,
html[data-theme="palette"] input,
html[data-theme="palette"] textarea,
html[data-theme="palette"] select,
html[data-theme="palette"] button{
  color:#334155!important;
}

html[data-theme="palette"] h1,
html[data-theme="palette"] h2,
html[data-theme="palette"] h3,
html[data-theme="palette"] h4,
html[data-theme="palette"] h5,
html[data-theme="palette"] h6,
html[data-theme="palette"] .page-title,
html[data-theme="palette"] .section-title,
html[data-theme="palette"] .card-title,
html[data-theme="palette"] .widget-title{
  color:#0F172A!important;
}

html[data-theme="palette"] p,
html[data-theme="palette"] small,
html[data-theme="palette"] .muted,
html[data-theme="palette"] .text-muted,
html[data-theme="palette"] .helper-text,
html[data-theme="palette"] .caption,
html[data-theme="palette"] .form-help{
  color:#64748B!important;
}

html[data-theme="palette"] a{color:#0F172A!important}
html[data-theme="palette"] a:hover,
html[data-theme="palette"] a:focus-visible{color:#0F766E!important}

/* Header */
html[data-theme="palette"] .topbar{
  background:
    linear-gradient(180deg,rgba(15,23,42,.94),rgba(15,23,42,.88))!important;
  border-bottom:1px solid rgba(201,162,39,.72)!important;
  box-shadow:0 14px 34px rgba(15,23,42,.25),inset 0 1px 0 rgba(255,255,255,.08)!important;
  -webkit-backdrop-filter:blur(24px) saturate(135%)!important;
  backdrop-filter:blur(24px) saturate(135%)!important;
}
html[data-theme="palette"] .topbar::before{
  background:
    radial-gradient(circle at 12% 0%,rgba(201,162,39,.12),transparent 30%),
    linear-gradient(90deg,rgba(255,255,255,.04),transparent,rgba(255,255,255,.04))!important;
}
html[data-theme="palette"] .topbar::after{
  background:linear-gradient(90deg,transparent,rgba(201,162,39,.88) 20%,rgba(201,162,39,.88) 80%,transparent)!important;
}
html[data-theme="palette"] .brand-logo-link,
html[data-theme="palette"] .primary-nav,
html[data-theme="palette"] .compact-profile-menu>summary,
html[data-theme="palette"] .mobile-nav-toggle{
  background:rgba(255,255,255,.97)!important;
  border-color:rgba(201,162,39,.62)!important;
  box-shadow:0 12px 30px rgba(15,23,42,.20),inset 0 1px 0 #fff!important;
}
html[data-theme="palette"] .brand-wordmark-copy strong{color:#0F172A!important}
html[data-theme="palette"] .brand-wordmark-copy small{color:#64748B!important}

/* Navigation contrast */
html[data-theme="palette"] .primary-nav>a,
html[data-theme="palette"] .primary-nav .header-nav-summary-link,
html[data-theme="palette"] .primary-nav .header-nav-main-toggle{color:#334155!important}
html[data-theme="palette"] .primary-nav>a:hover,
html[data-theme="palette"] .primary-nav>.header-nav-dropdown>summary:hover{
  background:#F8FAFC!important;color:#0F766E!important;
}
html[data-theme="palette"] .primary-nav>a.header-top-link.is-active,
html[data-theme="palette"] .primary-nav>a.header-top-link[aria-current="page"]{
  background:linear-gradient(180deg,#1E293B,#0F172A)!important;
  border-color:#0F172A!important;color:#fff!important;
  outline:1px solid rgba(201,162,39,.72)!important;
  box-shadow:0 9px 22px rgba(15,23,42,.28),inset 0 1px 0 rgba(255,255,255,.10)!important;
}
html[data-theme="palette"] .primary-nav>.header-nav-dropdown[open]>summary,
html[data-theme="palette"] .primary-nav>.header-nav-dropdown.is-active[open]>summary{
  background:linear-gradient(180deg,#D7BB59,#C9A227)!important;
  border-color:#C9A227!important;color:#0F172A!important;
  box-shadow:0 9px 21px rgba(201,162,39,.28),inset 0 1px 0 rgba(255,255,255,.36)!important;
}
html[data-theme="palette"] .primary-nav>.header-nav-dropdown[open]>summary .header-nav-summary-link,
html[data-theme="palette"] .primary-nav>.header-nav-dropdown[open]>summary .header-nav-main-toggle{
  color:#0F172A!important;
}

/* Dropdowns */
html[data-theme="palette"] .header-nav-dropdown-menu,
html[data-theme="palette"] .header-nav-nested-menu{
  background:rgba(255,255,255,.99)!important;
  border-color:rgba(15,23,42,.12)!important;
  border-top-color:#C9A227!important;
  box-shadow:0 26px 66px rgba(15,23,42,.22),inset 0 1px 0 #fff!important;
}
html[data-theme="palette"] .header-nav-nested>summary:hover,
html[data-theme="palette"] .header-nav-dropdown-menu>a:hover,
html[data-theme="palette"] .header-nav-nested-menu>a:hover,
html[data-theme="palette"] .header-nav-nested[open]>summary{
  background:#F8FAFC!important;
  border-color:rgba(15,118,110,.38)!important;
  color:#0F766E!important;
}

/* Cards */
html[data-theme="palette"] .card,
html[data-theme="palette"] .panel,
html[data-theme="palette"] .surface,
html[data-theme="palette"] .widget,
html[data-theme="palette"] .box,
html[data-theme="palette"] .modal-content,
html[data-theme="palette"] .table-wrap,
html[data-theme="palette"] .lesson-card,
html[data-theme="palette"] .paper-card,
html[data-theme="palette"] .note-card,
html[data-theme="palette"] .progress-card,
html[data-theme="palette"] .stat-card,
html[data-theme="palette"] .feature-card,
html[data-theme="palette"] .blog-card,
html[data-theme="palette"] .content-card,
html[data-theme="palette"] .dropdown-family-card,
html[data-theme="palette"] .progress-hub-card,
html[data-theme="palette"] .exam-category-card,
html[data-theme="palette"] .notes-category-card,
html[data-theme="palette"] .kb-doc-card,
html[data-theme="palette"] .question-card,
html[data-theme="palette"] .exam-sidebar,
html[data-theme="palette"] .exam-main{
  background:linear-gradient(180deg,#fff 0%,#FCFCFA 100%)!important;
  border-color:rgba(15,23,42,.10)!important;
  box-shadow:0 14px 34px rgba(15,23,42,.09),inset 0 1px 0 #fff!important;
}
html[data-theme="palette"] .landing-feature-grid article::after,
html[data-theme="palette"] .dropdown-family-card::after,
html[data-theme="palette"] .progress-hub-card::after,
html[data-theme="palette"] .exam-category-card::after,
html[data-theme="palette"] .notes-category-card::after,
html[data-theme="palette"] .paper-card::after,
html[data-theme="palette"] .lesson-card::after{
  background:linear-gradient(90deg,#C9A227,#E8D9A0,transparent)!important;
}
html[data-theme="palette"] .card:hover,
html[data-theme="palette"] .content-card:hover,
html[data-theme="palette"] .dropdown-family-card:hover,
html[data-theme="palette"] .progress-hub-card:hover,
html[data-theme="palette"] .exam-category-card:hover,
html[data-theme="palette"] .notes-category-card:hover,
html[data-theme="palette"] .paper-card:hover,
html[data-theme="palette"] .lesson-card:hover{
  border-color:rgba(201,162,39,.55)!important;
  box-shadow:0 24px 54px rgba(15,23,42,.14),inset 0 1px 0 #fff!important;
}

/* Icons and badges */
html[data-theme="palette"] .feature-icon,
html[data-theme="palette"] .dropdown-family-mark,
html[data-theme="palette"] .progress-hub-icon,
html[data-theme="palette"] .exam-category-mark,
html[data-theme="palette"] .notes-category-mark{
  background:linear-gradient(180deg,#1E293B,#0F172A)!important;
  border-color:#0F172A!important;color:#E8D9A0!important;
  box-shadow:0 10px 22px rgba(15,23,42,.20),inset 0 1px 0 rgba(255,255,255,.08)!important;
}
html[data-theme="palette"] .badge,
html[data-theme="palette"] .tag,
html[data-theme="palette"] .chip,
html[data-theme="palette"] .pill,
html[data-theme="palette"] .label,
html[data-theme="palette"] .status-badge,
html[data-theme="palette"] .notice-badge{
  background:#FBF5E5!important;border-color:rgba(201,162,39,.44)!important;color:#7A5E0E!important;
}

/* Buttons */
html[data-theme="palette"] .btn.primary,
html[data-theme="palette"] .cta-button,
html[data-theme="palette"] .primary-button,
html[data-theme="palette"] input[type=submit],
html[data-theme="palette"] button[type=submit]{
  background:linear-gradient(180deg,#D8B84A,#C9A227)!important;
  border-color:#C9A227!important;color:#0F172A!important;
  box-shadow:0 12px 26px rgba(201,162,39,.25),inset 0 1px 0 rgba(255,255,255,.34)!important;
}
html[data-theme="palette"] .btn.primary:hover,
html[data-theme="palette"] .cta-button:hover,
html[data-theme="palette"] .primary-button:hover,
html[data-theme="palette"] input[type=submit]:hover,
html[data-theme="palette"] button[type=submit]:hover{
  background:linear-gradient(180deg,#C9A227,#B78D16)!important;
  border-color:#B78D16!important;color:#0F172A!important;
}
html[data-theme="palette"] .btn.secondary,
html[data-theme="palette"] .secondary-button,
html[data-theme="palette"] .btn-outline,
html[data-theme="palette"] .outline-button{
  background:linear-gradient(180deg,#138A7E,#0F766E)!important;
  border-color:#0F766E!important;color:#fff!important;
}

/* Hero */
html[data-theme="palette"] .home-category-hero{
  background:
    radial-gradient(circle at 84% 18%,rgba(201,162,39,.14),transparent 28rem),
    radial-gradient(circle at 16% 88%,rgba(15,118,110,.14),transparent 30rem),
    linear-gradient(138deg,#1E293B 0%,#0F172A 68%,#111827 100%)!important;
  border-color:rgba(201,162,39,.58)!important;
  box-shadow:0 32px 80px rgba(15,23,42,.28),inset 0 1px 0 rgba(255,255,255,.08)!important;
}
html[data-theme="palette"] .home-category-hero h1{color:#fff!important}
html[data-theme="palette"] .home-category-hero .landing-hero-copy>p,
html[data-theme="palette"] .landing-trust-row{color:#CBD5E1!important}
html[data-theme="palette"] .landing-badge{
  background:#FBF5E5!important;border-color:#C9A227!important;color:#0F172A!important;
}
html[data-theme="palette"] .landing-badge i,
html[data-theme="palette"] .exam-preview-label i,
html[data-theme="palette"] .home-active-badge i,
html[data-theme="palette"] .landing-trust-row span::before{background:#0F766E!important}
html[data-theme="palette"] .home-hero-category-tab{
  background:rgba(255,255,255,.07)!important;border-color:rgba(255,255,255,.14)!important;color:#fff!important;
}
html[data-theme="palette"] .home-hero-category-tab:hover{
  background:rgba(15,118,110,.22)!important;border-color:#0F766E!important;
}
html[data-theme="palette"] .home-hero-category-tab.active{
  background:linear-gradient(180deg,#D8B84A,#C9A227)!important;border-color:#C9A227!important;color:#0F172A!important;
}
html[data-theme="palette"] .home-hero-category-tab.active b{
  background:#0F172A!important;border-color:#0F172A!important;color:#E8D9A0!important;
}
html[data-theme="palette"] .home-hero-category-tab.active span{color:#0F172A!important}

/* Contrast-safe preview/exam */
html[data-theme="palette"] .exam-preview{
  background:linear-gradient(180deg,#fff,#F8FAFC)!important;border-color:rgba(15,23,42,.12)!important;border-top-color:#C9A227!important;
}
html[data-theme="palette"] .exam-preview h2,
html[data-theme="palette"] .question-card h2,
html[data-theme="palette"] .jp-question{color:#0F172A!important}
html[data-theme="palette"] .exam-preview-progress span,
html[data-theme="palette"] .exam-progress span,
html[data-theme="palette"] .home-active-progress-track span,
html[data-theme="palette"] .progress-fill{background:linear-gradient(90deg,#0F766E,#138A7E)!important}
html[data-theme="palette"] .exam-preview-options b,
html[data-theme="palette"] .option-letter{
  background:#0F172A!important;border-color:#0F172A!important;color:#E8D9A0!important;
}
html[data-theme="palette"] .option{
  background:#F8FAFC!important;border-color:rgba(15,23,42,.12)!important;color:#334155!important;
}
html[data-theme="palette"] .option:hover{
  background:#ECFDF5!important;border-color:rgba(15,118,110,.55)!important;
}
html[data-theme="palette"] .option:has(input:checked){
  background:#ECFDF5!important;border-color:#0F766E!important;box-shadow:0 0 0 3px rgba(15,118,110,.14)!important;
}
html[data-theme="palette"] .save-state{
  background:#FBF5E5!important;border-color:rgba(201,162,39,.48)!important;color:#0F172A!important;
}

/* Forms */
html[data-theme="palette"] input,
html[data-theme="palette"] textarea,
html[data-theme="palette"] select{
  background:#fff!important;border-color:rgba(15,23,42,.16)!important;color:#334155!important;
}
html[data-theme="palette"] input:focus,
html[data-theme="palette"] textarea:focus,
html[data-theme="palette"] select:focus{
  border-color:#0F766E!important;box-shadow:0 0 0 4px rgba(15,118,110,.14)!important;
}

/* Tables */
html[data-theme="palette"] table th,
html[data-theme="palette"] .table th,
html[data-theme="palette"] .data-table th{
  background:#0F172A!important;color:#fff!important;border-color:rgba(255,255,255,.12)!important;
}
html[data-theme="palette"] table td,
html[data-theme="palette"] .table td,
html[data-theme="palette"] .data-table td{
  color:#334155!important;border-color:rgba(15,23,42,.10)!important;
}

/* Footer */
html[data-theme="palette"] .site-footer,
html[data-theme="palette"] .footer{
  background:
    radial-gradient(circle at 12% 0%,rgba(201,162,39,.10),transparent 24rem),
    linear-gradient(145deg,#0F172A 0%,#111827 72%,#1E293B 100%)!important;
  border-top-color:#C9A227!important;color:#fff!important;
  box-shadow:0 -18px 46px rgba(15,23,42,.18)!important;
}
html[data-theme="palette"] .site-footer h2,
html[data-theme="palette"] .site-footer h3,
html[data-theme="palette"] .footer h2,
html[data-theme="palette"] .footer h3{color:#E8D9A0!important}
html[data-theme="palette"] .site-footer p,
html[data-theme="palette"] .site-footer small,
html[data-theme="palette"] .footer p,
html[data-theme="palette"] .footer small{color:#CBD5E1!important}
html[data-theme="palette"] .site-footer a,
html[data-theme="palette"] .footer a{color:#E8D9A0!important}
html[data-theme="palette"] .site-footer a:hover,
html[data-theme="palette"] .footer a:hover{color:#fff!important}

/* Mobile drawer */
@media(max-width:820px){
  html[data-theme="palette"] .mobile-nav-drawer,
  html[data-theme="palette"] .mobile-nav-panel{
    background:#fff!important;border-color:rgba(15,23,42,.12)!important;
  }
  html[data-theme="palette"] .mobile-nav-group>summary:hover,
  html[data-theme="palette"] .mobile-nav-subgroup>summary:hover,
  html[data-theme="palette"] .mobile-nav-main-link:hover,
  html[data-theme="palette"] .mobile-nav-family-link:hover{
    background:#F8FAFC!important;color:#0F766E!important;
  }
}

/* Explicit contrast repairs for previously hidden text */
html[data-theme="palette"] .btn.primary *,
html[data-theme="palette"] .home-hero-category-tab.active *,
html[data-theme="palette"] .save-state *,
html[data-theme="palette"] .badge *,
html[data-theme="palette"] .tag *{
  color:inherit!important;
}
html[data-theme="palette"] [style*="color:#FFFFFF"],
html[data-theme="palette"] [style*="color: #FFFFFF"]{
  text-shadow:none;
}

/* =========================================================
   v3.16.2 — Luxury UI Cleanup
   ========================================================= */
html[data-theme="palette"] a,
html[data-theme="palette"] a:hover,
html[data-theme="palette"] a:focus,
html[data-theme="palette"] a:focus-visible,
html[data-theme="palette"] a:active,
html[data-theme="palette"] .header-top-link,
html[data-theme="palette"] .header-nav-summary-link,
html[data-theme="palette"] .header-nav-main-toggle,
html[data-theme="palette"] .header-nav-dropdown-menu a,
html[data-theme="palette"] .header-nav-nested-menu a,
html[data-theme="palette"] .mobile-nav-main-link,
html[data-theme="palette"] .mobile-nav-family-link,
html[data-theme="palette"] .site-footer a,
html[data-theme="palette"] .footer a,
html[data-theme="palette"] .footer-social,
html[data-theme="palette"] .brand-logo-link,
html[data-theme="palette"] .footer-brand,
html[data-theme="palette"] .btn,
html[data-theme="palette"] button{ text-decoration:none!important; text-decoration-line:none!important; text-underline-offset:0!important; }
html[data-theme="palette"] .primary-nav>a::after,
html[data-theme="palette"] .primary-nav>.header-nav-dropdown>summary::after,
html[data-theme="palette"] .footer-link-column a::after,
html[data-theme="palette"] .footer-brand::after,
html[data-theme="palette"] .footer-social::after{content:none!important;display:none!important;width:0!important;height:0!important;background:transparent!important;box-shadow:none!important}
html[data-theme="palette"] a:focus-visible,html[data-theme="palette"] button:focus-visible,html[data-theme="palette"] summary:focus-visible{outline:2px solid rgba(201,162,39,.72)!important;outline-offset:3px!important}
html[data-theme="palette"] .primary-nav>a,html[data-theme="palette"] .primary-nav>.header-nav-dropdown>summary{border-bottom:0!important}
@media(min-width:821px){
 html[data-theme="palette"] .home-category-hero{grid-template-columns:minmax(0,1fr)!important;min-height:540px!important;padding:clamp(46px,5.8vw,82px)!important}
 html[data-theme="palette"] .home-category-hero .landing-hero-copy{width:min(100%,980px)!important;max-width:980px!important;margin-inline:auto!important}
 html[data-theme="palette"] .home-category-hero h1{max-width:920px!important;font-size:clamp(3.5rem,5.2vw,5.65rem)!important;line-height:1.01!important;letter-spacing:-.058em!important}
 html[data-theme="palette"] .home-category-hero .landing-hero-copy>p{max-width:760px!important}
 html[data-theme="palette"] .home-category-hero .exam-preview{display:none!important}
 html[data-theme="palette"] .home-hero-category-tabs,html[data-theme="palette"] .landing-actions,html[data-theme="palette"] .landing-trust-row{max-width:760px!important}
}
html[data-theme="palette"] .exam-title{margin-bottom:10px!important}
html[data-theme="palette"] .exam-title .eyebrow{margin-bottom:4px!important;color:#475569!important;font-size:.72rem!important;letter-spacing:.10em!important}
html[data-theme="palette"] .exam-title h1{margin:0!important;line-height:1.03!important}
html[data-theme="palette"] .save-state{padding:7px 11px!important;border-radius:999px!important;color:#0F172A!important;font-size:.72rem!important;font-weight:850!important}
html[data-theme="palette"] .exam-main>.question-card{margin-top:0!important}
html[data-theme="palette"] .timer-box small,html[data-theme="palette"] .timer-box .timer-label,html[data-theme="palette"] .timer-tools>span{color:#CBD5E1!important;opacity:1!important}
html[data-theme="palette"] .timer-box strong,html[data-theme="palette"] .timer-box .timer-value{color:#fff!important}
html[data-theme="palette"] .exam-section-plan button{background:#111827!important;border:1px solid rgba(201,162,39,.18)!important;color:#fff!important}
html[data-theme="palette"] .exam-section-plan button span,html[data-theme="palette"] .exam-section-plan button strong{color:#fff!important;opacity:1!important}
html[data-theme="palette"] .exam-section-plan button small{color:#94A3B8!important;opacity:1!important}
html[data-theme="palette"] .exam-section-plan button.current{background:linear-gradient(180deg,#D8B84A,#C9A227)!important;border-color:#C9A227!important;color:#0F172A!important}
html[data-theme="palette"] .exam-section-plan button.current span,html[data-theme="palette"] .exam-section-plan button.current strong,html[data-theme="palette"] .exam-section-plan button.current small{color:#0F172A!important}
html[data-theme="palette"] .options{gap:9px!important}
html[data-theme="palette"] .option{min-height:54px!important;padding:10px 12px!important;border-radius:12px!important}
html[data-theme="palette"] .option-letter{width:32px!important;height:32px!important;flex:0 0 32px!important}
html[data-theme="palette"] .jp-option{line-height:1.45!important}
html[data-theme="palette"] .review-check{min-height:42px!important;padding:8px 11px!important;margin-top:10px!important;border-radius:11px!important}
html[data-theme="palette"] .question-actions{margin-top:12px!important}
html[data-theme="palette"] .question-actions .btn{min-height:42px!important;padding:0 15px!important;border-radius:11px!important}
html[data-theme="palette"] .question-actions .prev{background:linear-gradient(180deg,#138A7E,#0F766E)!important;border-color:#0F766E!important;color:#fff!important}
html[data-theme="palette"] .question-actions .next{background:linear-gradient(180deg,#D8B84A,#C9A227)!important;border-color:#C9A227!important;color:#0F172A!important}
html[data-theme="palette"] .site-footer .footer-link-column h3,html[data-theme="palette"] .site-footer .footer-preferences-column h3,html[data-theme="palette"] .site-footer .footer-community-column h3,html[data-theme="palette"] .footer h3{color:#E8D9A0!important;text-decoration:none!important;border:0!important}
html[data-theme="palette"] .site-footer .footer-link-column h3::after,html[data-theme="palette"] .site-footer .footer-preferences-column h3::after,html[data-theme="palette"] .site-footer .footer-community-column h3::after,html[data-theme="palette"] .footer h3::after{content:none!important;display:none!important}
html[data-theme="palette"] .footer-link-column a,html[data-theme="palette"] .footer-brand,html[data-theme="palette"] .footer-social{border-bottom:0!important;text-decoration:none!important}
html[data-theme="palette"] .footer-link-column a:hover,html[data-theme="palette"] .footer-brand:hover,html[data-theme="palette"] .footer-social:hover{text-decoration:none!important;transform:none!important}
html[data-theme="palette"] .footer-brand{color:#fff!important}
html[data-theme="palette"] .footer-brand strong,html[data-theme="palette"] .footer-brand span,html[data-theme="palette"] .footer-brand small{color:inherit!important}
html[data-theme="palette"] .footer-social{color:#E8D9A0!important;border:1px solid rgba(232,217,160,.34)!important}
html[data-theme="palette"] .footer-social:hover{background:rgba(201,162,39,.12)!important;border-color:#C9A227!important;color:#fff!important}
@media(max-width:820px){html[data-theme="palette"] .home-category-hero .exam-preview{display:none!important}html[data-theme="palette"] .home-category-hero{grid-template-columns:minmax(0,1fr)!important}html[data-theme="palette"] .home-category-hero h1{font-size:clamp(2.35rem,11vw,3.7rem)!important}html[data-theme="palette"] .exam-title .eyebrow{font-size:.64rem!important}html[data-theme="palette"] .option{min-height:58px!important}}


/* =========================================================
   v3.16.3 — Home Visibility Fail-safe
   Homepage content stays visible even if reveal JavaScript,
   IntersectionObserver or cached assets fail to initialize.
   ========================================================= */
html[data-theme="palette"] .landing-reveal {
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
}

html[data-theme="palette"] .landing-reveal.is-visible {
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
}

@keyframes landingRevealSafeIn {
  from { opacity: .82; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

html[data-theme="palette"] .landing-reveal.is-visible {
  animation: landingRevealSafeIn .34s ease-out both;
}

@media (prefers-reduced-motion: reduce) {
  html[data-theme="palette"] .landing-reveal,
  html[data-theme="palette"] .landing-reveal.is-visible {
    animation: none !important;
  }
}


/* =========================================================
   v3.16.4 — Dropdown Anchor Repair
   Root cause:
   backdrop-filter on the navigation pill changed the containing
   block used by fixed dropdown menus, shifting them away from
   their Notes / Papers / Progress triggers.
   ========================================================= */
@media (min-width: 821px) {
  html[data-theme="palette"] .primary-nav {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    transform: none !important;
    filter: none !important;
    perspective: none !important;
    contain: none !important;
    will-change: auto !important;
  }

  html[data-theme="palette"] .primary-nav > .header-nav-dropdown,
  html[data-theme="palette"] .primary-nav > .header-nav-dropdown > summary {
    transform: none !important;
    filter: none !important;
    perspective: none !important;
    contain: none !important;
    will-change: auto !important;
  }

  html[data-theme="palette"] .header-nav-dropdown-menu,
  html[data-theme="palette"] .header-nav-dropdown:last-of-type .header-nav-dropdown-menu {
    position: fixed !important;
    top: var(--header-dropdown-top, 82px) !important;
    left: var(--header-dropdown-left, 12px) !important;
    right: auto !important;
    margin: 0 !important;
    transform-origin: top center !important;
  }

  /* Keep each panel visually centered below its own trigger. */
  html[data-theme="palette"] .header-nav-dropdown-menu {
    translate: none !important;
  }

  /* Nested flyout remains anchored to the selected family row. */
  html[data-theme="palette"] .header-nav-hierarchical-menu .header-nav-nested {
    position: relative !important;
  }

  html[data-theme="palette"] .header-nav-hierarchical-menu .header-nav-nested-menu {
    top: 0 !important;
    left: calc(100% + 30px) !important;
    right: auto !important;
    transform: none !important;
    translate: none !important;
  }
}

/* Mobile uses the drawer/accordion and must not inherit desktop coordinates. */
@media (max-width: 820px) {
  html[data-theme="palette"] .primary-nav {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
}


/* =========================================================
   v3.16.5 — Centered Hero & Clock Below
   - Hero becomes the primary first visual section.
   - Live World Time is placed immediately below the hero.
   - Hero copy uses the complete banner area without an inner box.
   ========================================================= */

/* ---------- Full hero content area ---------- */
html[data-theme="palette"] .home-category-hero {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: clamp(560px, 62vh, 720px) !important;
  padding: clamp(48px, 6vw, 96px) clamp(24px, 7vw, 112px) !important;
  text-align: center !important;
  overflow: hidden !important;
}

html[data-theme="palette"] .home-category-hero .landing-hero-copy {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  text-align: center !important;
}

html[data-theme="palette"] .home-category-hero .landing-hero-copy::before,
html[data-theme="palette"] .home-category-hero .landing-hero-copy::after {
  content: none !important;
  display: none !important;
}

html[data-theme="palette"] .home-category-hero .landing-badge {
  align-self: center !important;
  margin: 0 auto clamp(18px, 2.2vw, 28px) !important;
}

html[data-theme="palette"] .home-category-hero h1 {
  width: 100% !important;
  max-width: 1180px !important;
  margin: 0 auto clamp(20px, 2.5vw, 30px) !important;
  text-align: center !important;
  text-wrap: balance !important;
  font-size: clamp(3.65rem, 6vw, 6.4rem) !important;
  line-height: .98 !important;
  letter-spacing: -.062em !important;
}

html[data-theme="palette"] .home-category-hero .landing-hero-copy > p {
  width: min(100%, 900px) !important;
  max-width: 900px !important;
  margin: 0 auto clamp(22px, 2.7vw, 34px) !important;
  text-align: center !important;
  text-wrap: balance !important;
  font-size: clamp(1rem, 1.35vw, 1.2rem) !important;
  line-height: 1.72 !important;
}

html[data-theme="palette"] .home-hero-category-dots {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  margin: 0 auto 22px !important;
}

html[data-theme="palette"] .home-category-hero .landing-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto !important;
  gap: 12px !important;
}

html[data-theme="palette"] .home-category-hero .landing-text-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

html[data-theme="palette"] .home-category-hero .landing-trust-row {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  width: 100% !important;
  max-width: none !important;
  margin: clamp(22px, 2.7vw, 34px) auto 0 !important;
  gap: 14px 24px !important;
  text-align: center !important;
}

html[data-theme="palette"] .home-category-hero .landing-trust-row span {
  display: inline-flex !important;
  align-items: baseline !important;
  justify-content: center !important;
}

/* Preview remains intentionally removed from the premium centered hero. */
html[data-theme="palette"] .home-category-hero .exam-preview {
  display: none !important;
}

/* ---------- World time now follows the hero ---------- */
html[data-theme="palette"] .compact-home-main .home-world-time-bar {
  width: 100% !important;
  margin: 14px 0 12px !important;
  order: initial !important;
}

/* ---------- Tablet ---------- */
@media (min-width: 701px) and (max-width: 1000px) {
  html[data-theme="palette"] .home-category-hero {
    min-height: 570px !important;
    padding: 52px 34px !important;
  }

  html[data-theme="palette"] .home-category-hero h1 {
    max-width: 880px !important;
    font-size: clamp(3.2rem, 8vw, 5rem) !important;
  }

  html[data-theme="palette"] .home-category-hero .landing-hero-copy > p {
    max-width: 760px !important;
  }
}

/* ---------- Mobile ---------- */
@media (max-width: 700px) {
  html[data-theme="palette"] .home-category-hero {
    min-height: 520px !important;
    padding: 38px 18px !important;
    border-radius: 22px !important;
  }

  html[data-theme="palette"] .home-category-hero h1 {
    max-width: 100% !important;
    margin-bottom: 18px !important;
    font-size: clamp(2.5rem, 12vw, 4rem) !important;
    line-height: 1.01 !important;
    letter-spacing: -.052em !important;
  }

  html[data-theme="palette"] .home-category-hero .landing-hero-copy > p {
    max-width: 100% !important;
    margin-bottom: 20px !important;
    font-size: .94rem !important;
    line-height: 1.62 !important;
  }

  html[data-theme="palette"] .home-category-hero .landing-actions {
    flex-direction: column !important;
    width: min(100%, 360px) !important;
  }

  html[data-theme="palette"] .home-category-hero .landing-actions .btn,
  html[data-theme="palette"] .home-category-hero .landing-text-link {
    width: 100% !important;
    justify-content: center !important;
  }

  html[data-theme="palette"] .home-category-hero .landing-trust-row {
    gap: 10px 14px !important;
    margin-top: 24px !important;
  }

  html[data-theme="palette"] .compact-home-main .home-world-time-bar {
    margin-top: 10px !important;
  }
}


/* =========================================================
   v3.16.6 — Edge-to-Edge Hero
   Remove the card-like hero shell and side whitespace.
   ========================================================= */
html[data-theme="palette"] .compact-home-main {
  overflow: visible !important;
}

html[data-theme="palette"] .home-category-hero {
  position: relative !important;
  left: 50% !important;
  right: 50% !important;
  width: 100vw !important;
  max-width: none !important;
  min-width: 100vw !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;

  border-left: 0 !important;
  border-right: 0 !important;
  border-radius: 0 !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    inset 0 -1px 0 rgba(201,162,39,.45),
    0 22px 54px rgba(15,23,42,.20) !important;
}

html[data-theme="palette"] .home-category-hero::before,
html[data-theme="palette"] .home-category-hero::after {
  border-radius: 0 !important;
}

html[data-theme="palette"] .home-category-hero .landing-hero-copy {
  width: min(100%, 1320px) !important;
  max-width: 1320px !important;
  margin-inline: auto !important;
  padding-inline: clamp(18px, 4vw, 60px) !important;
}

html[data-theme="palette"] .home-category-hero h1 {
  max-width: 1180px !important;
}

html[data-theme="palette"] .compact-home-main .home-world-time-bar {
  margin-top: 16px !important;
}

/* Ensure the full-width hero starts cleanly below the sticky header. */
html[data-theme="palette"] .topbar + .site-main,
html[data-theme="palette"] .topbar + main {
  padding-top: 0 !important;
}

@media (max-width: 820px) {
  html[data-theme="palette"] .home-category-hero {
    width: 100vw !important;
    min-width: 100vw !important;
    border-radius: 0 !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
  }

  html[data-theme="palette"] .home-category-hero .landing-hero-copy {
    width: 100% !important;
    max-width: none !important;
    padding-inline: 18px !important;
  }
}


/* =========================================================
   v3.16.7 — Fixed Hero & Header Attempt
   ========================================================= */

/* ---------- Remove the separator between header and hero ---------- */
html[data-theme="palette"] .topbar {
  border-bottom: 0 !important;
}

html[data-theme="palette"] .topbar::after {
  content: none !important;
  display: none !important;
  height: 0 !important;
  background: transparent !important;
}

html[data-theme="palette"] main.container.compact-home-main {
  padding-top: 0 !important;
}

html[data-theme="palette"] .home-category-hero {
  margin-top: 0 !important;
  border-top: 0 !important;
  box-shadow:
    inset 0 -1px 0 rgba(201,162,39,.40),
    0 22px 54px rgba(15,23,42,.20) !important;
}

/* ---------- Stable hero height for every rotating slide ---------- */
@media (min-width: 1181px) {
  html[data-theme="palette"] .home-category-hero {
    height: 650px !important;
    min-height: 650px !important;
    max-height: 650px !important;
  }
}

@media (min-width: 821px) and (max-width: 1180px) {
  html[data-theme="palette"] .home-category-hero {
    height: 600px !important;
    min-height: 600px !important;
    max-height: 600px !important;
  }
}

@media (max-width: 820px) {
  html[data-theme="palette"] .home-category-hero {
    height: 560px !important;
    min-height: 560px !important;
    max-height: 560px !important;
  }
}

@media (max-width: 420px) {
  html[data-theme="palette"] .home-category-hero {
    height: 540px !important;
    min-height: 540px !important;
    max-height: 540px !important;
  }
}

/* ---------- Header active-attempt countdown ---------- */
html[data-theme="palette"] .header-attempt-countdown {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  min-width: 112px !important;
  height: 48px !important;
  padding: 6px 13px !important;
  border: 1px solid rgba(201,162,39,.64) !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg,#FBF5E5,#F3E7BD) !important;
  color: #0F172A !important;
  box-shadow:
    0 10px 24px rgba(15,23,42,.22),
    inset 0 1px 0 rgba(255,255,255,.72) !important;
  text-decoration: none !important;
  z-index: 1260 !important;
}

html[data-theme="palette"] .header-attempt-countdown:hover {
  transform: translateY(-1px) !important;
  border-color: #C9A227 !important;
  background: linear-gradient(180deg,#FFF8E7,#E8D9A0) !important;
  color: #0F172A !important;
}

html[data-theme="palette"] .header-attempt-pulse {
  width: 9px !important;
  height: 9px !important;
  flex: 0 0 9px !important;
  border-radius: 50% !important;
  background: #0F766E !important;
  box-shadow: 0 0 0 5px rgba(15,118,110,.14) !important;
  animation: headerAttemptPulse 1.8s ease-in-out infinite !important;
}

html[data-theme="palette"] .header-attempt-copy {
  display: grid !important;
  gap: 0 !important;
  line-height: 1 !important;
  text-align: left !important;
}

html[data-theme="palette"] .header-attempt-copy small {
  color: #7A5E0E !important;
  font-size: .52rem !important;
  font-weight: 900 !important;
  letter-spacing: .12em !important;
}

html[data-theme="palette"] .header-attempt-copy strong {
  color: #0F172A !important;
  font-size: .86rem !important;
  font-variant-numeric: tabular-nums !important;
  letter-spacing: .01em !important;
}

html[data-theme="palette"] .header-attempt-countdown.is-expired {
  background: #F8FAFC !important;
  border-color: rgba(225,29,72,.34) !important;
}

html[data-theme="palette"] .header-attempt-countdown.is-expired .header-attempt-pulse {
  background: #E11D48 !important;
  box-shadow: 0 0 0 5px rgba(225,29,72,.12) !important;
  animation: none !important;
}

@keyframes headerAttemptPulse {
  0%,100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(.74); opacity: .58; }
}

/* Large desktop: place the timer directly to the left of profile. */
@media (min-width: 1181px) {
  html[data-theme="palette"] .header-attempt-countdown {
    position: absolute !important;
    top: 50% !important;
    right: calc(clamp(28px,3.2vw,64px) + 68px) !important;
    transform: translateY(-50%) !important;
  }

  html[data-theme="palette"] .header-attempt-countdown:hover {
    transform: translateY(calc(-50% - 1px)) !important;
  }
}

/* Tablet: it participates in the right-side control row. */
@media (min-width: 821px) and (max-width: 1180px) {
  html[data-theme="palette"] .header-attempt-countdown {
    order: 2 !important;
    min-width: 104px !important;
    height: 46px !important;
  }

  html[data-theme="palette"] .compact-profile-menu {
    order: 3 !important;
  }

  html[data-theme="palette"] .mobile-nav-toggle {
    order: 1 !important;
  }
}

/* Mobile: compact countdown immediately before profile. */
@media (max-width: 820px) {
  html[data-theme="palette"] .header-attempt-countdown {
    order: 2 !important;
    min-width: 72px !important;
    width: 72px !important;
    height: 44px !important;
    padding: 5px 8px !important;
    gap: 5px !important;
  }

  html[data-theme="palette"] .header-attempt-copy small {
    display: none !important;
  }

  html[data-theme="palette"] .header-attempt-copy strong {
    font-size: .74rem !important;
  }

  html[data-theme="palette"] .header-attempt-pulse {
    width: 7px !important;
    height: 7px !important;
    flex-basis: 7px !important;
    box-shadow: 0 0 0 4px rgba(15,118,110,.14) !important;
  }

  html[data-theme="palette"] .mobile-nav-toggle {
    order: 1 !important;
  }

  html[data-theme="palette"] .compact-profile-menu {
    order: 3 !important;
  }
}

@media (max-width: 520px) {
  html[data-theme="palette"] .header-attempt-countdown {
    min-width: 62px !important;
    width: 62px !important;
    padding-inline: 6px !important;
  }

  html[data-theme="palette"] .header-attempt-copy strong {
    font-size: .68rem !important;
  }
}

/* ---------- Live Attempt card now sits below hero ---------- */
html[data-theme="palette"] .home-active-attempt-below-hero {
  margin: 14px 0 12px !important;
  grid-template-columns: minmax(0,1fr) auto !important;
  align-items: center !important;
}

html[data-theme="palette"] .home-active-attempt-below-hero .home-active-time-panel {
  display: none !important;
}

html[data-theme="palette"] .home-active-attempt-below-hero .home-active-copy {
  min-width: 0 !important;
}

html[data-theme="palette"] .home-active-attempt-below-hero .home-active-continue {
  min-width: 180px !important;
}

@media (max-width: 700px) {
  html[data-theme="palette"] .home-active-attempt-below-hero {
    grid-template-columns: 1fr !important;
    margin-top: 10px !important;
  }

  html[data-theme="palette"] .home-active-attempt-below-hero .home-active-continue {
    width: 100% !important;
    min-width: 0 !important;
  }
}


/* =========================================================
   v3.16.8 — Expanded Fixed Hero
   Increase the fixed hero height while preserving centered
   content and the existing edge-to-edge layout.
   ========================================================= */
@media (min-width: 1440px) {
  html[data-theme="palette"] .home-category-hero {
    height: 760px !important;
    min-height: 760px !important;
    max-height: 760px !important;
  }
}

@media (min-width: 1181px) and (max-width: 1439px) {
  html[data-theme="palette"] .home-category-hero {
    height: 720px !important;
    min-height: 720px !important;
    max-height: 720px !important;
  }
}

@media (min-width: 821px) and (max-width: 1180px) {
  html[data-theme="palette"] .home-category-hero {
    height: 660px !important;
    min-height: 660px !important;
    max-height: 660px !important;
  }
}

@media (min-width: 421px) and (max-width: 820px) {
  html[data-theme="palette"] .home-category-hero {
    height: 610px !important;
    min-height: 610px !important;
    max-height: 610px !important;
  }
}

@media (max-width: 420px) {
  html[data-theme="palette"] .home-category-hero {
    height: 580px !important;
    min-height: 580px !important;
    max-height: 580px !important;
  }
}

/* Keep the centered composition balanced in the larger hero. */
html[data-theme="palette"] .home-category-hero .landing-hero-copy {
  justify-content: center !important;
}

html[data-theme="palette"] .home-category-hero h1 {
  margin-bottom: clamp(22px, 2.4vw, 34px) !important;
}

html[data-theme="palette"] .home-category-hero .landing-hero-copy > p {
  margin-bottom: clamp(24px, 2.6vw, 36px) !important;
}


/* =========================================================
   v3.16.9 — Mobile Header Timer Alignment
   ========================================================= */
@media (max-width:820px){
html[data-theme="palette"] .topbar,html[data-theme="palette"] .topbar-inner,html[data-theme="palette"] .header-inner{position:relative!important}
html[data-theme="palette"] .header-attempt-countdown{position:absolute!important;top:50%!important;right:116px!important;left:auto!important;bottom:auto!important;width:60px!important;min-width:60px!important;height:40px!important;margin:0!important;padding:4px 7px!important;gap:4px!important;transform:translateY(-50%)!important;z-index:1300!important}
html[data-theme="palette"] .header-attempt-countdown:hover{transform:translateY(calc(-50% - 1px))!important}
html[data-theme="palette"] .header-attempt-copy strong{font-size:.66rem!important;line-height:1!important}
html[data-theme="palette"] .header-attempt-pulse{width:6px!important;height:6px!important;flex:0 0 6px!important;box-shadow:0 0 0 3px rgba(15,118,110,.14)!important}
html[data-theme="palette"] .header-attempt-countdown + .compact-profile-menu{margin-top:0!important}
}
@media (max-width:430px){html[data-theme="palette"] .header-attempt-countdown{right:108px!important;width:56px!important;min-width:56px!important;height:38px!important;padding-inline:6px!important}html[data-theme="palette"] .header-attempt-copy strong{font-size:.62rem!important}}
@media (max-width:375px){html[data-theme="palette"] .header-attempt-countdown{right:102px!important;width:52px!important;min-width:52px!important}html[data-theme="palette"] .header-attempt-pulse{display:none!important}}


/* =========================================================
   v3.17.0 — Mobile Hero Proportion Repair
   Increase mobile hero height, prevent words splitting in the
   title and keep every hero control/statistic inside the section.
   ========================================================= */
@media (min-width: 821px) {
  html[data-theme="palette"] .home-category-hero {
    height: 760px !important;
    min-height: 760px !important;
    max-height: 760px !important;
  }
}

@media (min-width: 421px) and (max-width: 820px) {
  html[data-theme="palette"] .home-category-hero {
    height: 780px !important;
    min-height: 780px !important;
    max-height: 780px !important;
    padding-top: 44px !important;
    padding-bottom: 42px !important;
  }
}

@media (max-width: 420px) {
  html[data-theme="palette"] .home-category-hero {
    height: 760px !important;
    min-height: 760px !important;
    max-height: 760px !important;
    padding: 38px 16px 40px !important;
  }

  html[data-theme="palette"] .home-category-hero .landing-hero-copy {
    justify-content: center !important;
    gap: 0 !important;
  }

  html[data-theme="palette"] .home-category-hero .landing-badge {
    margin-bottom: 22px !important;
  }

  html[data-theme="palette"] .home-category-hero h1 {
    width: 100% !important;
    max-width: 360px !important;
    margin: 0 auto 24px !important;
    font-size: clamp(2.45rem, 11.2vw, 3.12rem) !important;
    line-height: 1.05 !important;
    letter-spacing: -.045em !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
    text-wrap: balance !important;
  }

  html[data-theme="palette"] .home-category-hero .landing-hero-copy > p {
    width: 100% !important;
    max-width: 350px !important;
    margin: 0 auto 24px !important;
    font-size: .98rem !important;
    line-height: 1.62 !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
  }

  html[data-theme="palette"] .home-hero-category-dots {
    margin-bottom: 22px !important;
  }

  html[data-theme="palette"] .home-category-hero .landing-actions {
    width: min(100%, 350px) !important;
    gap: 12px !important;
  }

  html[data-theme="palette"] .home-category-hero .landing-actions .btn,
  html[data-theme="palette"] .home-category-hero .landing-text-link {
    min-height: 54px !important;
  }

  html[data-theme="palette"] .home-category-hero .landing-trust-row {
    width: min(100%, 360px) !important;
    margin-top: 28px !important;
    padding-bottom: 2px !important;
    gap: 12px 18px !important;
  }

  html[data-theme="palette"] .home-category-hero .landing-trust-row span {
    white-space: nowrap !important;
  }
}

@media (max-width: 360px) {
  html[data-theme="palette"] .home-category-hero {
    height: 790px !important;
    min-height: 790px !important;
    max-height: 790px !important;
  }

  html[data-theme="palette"] .home-category-hero h1 {
    max-width: 326px !important;
    font-size: 2.42rem !important;
  }
}


/* =========================================================
   Legacy Header / Hero Gold Divider
   v3.17.12 moves this separator to the shared header itself.
   Keep the hero edge clear so the line is never duplicated.
   ========================================================= */
html[data-theme="palette"] .home-category-hero {
  border-top: 0 !important;
}


/* =========================================================
   v3.17.6 — Header Gold Hover
   Match every standard desktop header tab to the gold pill
   shown when a dropdown navigation tab is hovered/opened.
   ========================================================= */
@media (min-width: 821px) and (hover: hover) and (pointer: fine) {
  html[data-theme="palette"] .primary-nav > a.header-top-link:hover {
    background: linear-gradient(180deg, #FFD080 0%, #C9A227 100%) !important;
    color: #0F172A !important;
    box-shadow:
      0 9px 21px rgba(201, 162, 39, .28),
      inset 0 1px 0 rgba(255, 255, 255, .62) !important;
    transform: translateY(-1px) !important;
  }
}

@media (min-width: 821px) {
  html[data-theme="palette"] .primary-nav > a.header-top-link:focus-visible {
    background: linear-gradient(180deg, #FFD080 0%, #C9A227 100%) !important;
    color: #0F172A !important;
    box-shadow:
      0 9px 21px rgba(201, 162, 39, .28),
      inset 0 1px 0 rgba(255, 255, 255, .62) !important;
  }
}


/* =========================================================
   v3.17.7 — Compact Portrait Hub Cards
   Reference structure: visual cover, concise copy, small
   information cells and a compact rounded action button.
   Applied only to Notes, Papers and Progress hub surfaces.
   ========================================================= */
html[data-theme="palette"] .dropdown-family-grid,
html[data-theme="palette"] .dropdown-child-grid,
html[data-theme="palette"] .progress-hub-grid {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: stretch !important;
  gap: 16px !important;
}

html[data-theme="palette"] .dropdown-family-grid > .dropdown-family-card,
html[data-theme="palette"] .dropdown-child-grid > .exam-category-card,
html[data-theme="palette"] .dropdown-child-grid > .exam-category-placeholder,
html[data-theme="palette"] .dropdown-child-grid > .notes-category-card,
html[data-theme="palette"] .dropdown-child-grid > .notes-category-placeholder,
html[data-theme="palette"] .progress-hub-grid > .progress-hub-card {
  flex: 0 1 310px !important;
  width: min(100%, 310px) !important;
  max-width: 310px !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

html[data-theme="palette"] .dropdown-family-card,
html[data-theme="palette"] .dropdown-child-grid > .exam-category-card,
html[data-theme="palette"] .dropdown-child-grid > .notes-category-card,
html[data-theme="palette"] .progress-hub-card {
  position: relative !important;
  display: flex !important;
  overflow: hidden !important;
  flex-direction: column !important;
  min-height: 0 !important;
  padding: 0 14px 14px !important;
  border: 1px solid rgba(15, 23, 42, .12) !important;
  border-radius: 22px !important;
  background: #FFFFFF !important;
  box-shadow:
    0 12px 30px rgba(15, 23, 42, .10),
    inset 0 1px 0 #FFFFFF !important;
  transition:
    transform .22s ease,
    border-color .22s ease,
    box-shadow .22s ease !important;
}

html[data-theme="palette"] .dropdown-family-card:hover,
html[data-theme="palette"] .dropdown-child-grid > .exam-category-card:hover,
html[data-theme="palette"] .dropdown-child-grid > .notes-category-card:hover,
html[data-theme="palette"] .progress-hub-card:hover,
html[data-theme="palette"] .dropdown-family-card:focus-within,
html[data-theme="palette"] .dropdown-child-grid > .exam-category-card:focus-within,
html[data-theme="palette"] .dropdown-child-grid > .notes-category-card:focus-within,
html[data-theme="palette"] .progress-hub-card:focus-within {
  transform: translateY(-4px) !important;
  border-color: rgba(201, 162, 39, .62) !important;
  box-shadow:
    0 20px 42px rgba(15, 23, 42, .15),
    inset 0 1px 0 #FFFFFF !important;
}

html[data-theme="palette"] .dropdown-family-card::after,
html[data-theme="palette"] .dropdown-child-grid > .exam-category-card::after,
html[data-theme="palette"] .dropdown-child-grid > .notes-category-card::after,
html[data-theme="palette"] .progress-hub-card::after {
  display: none !important;
}

/* Full-bleed visual cover on Notes/Papers family and category cards. */
html[data-theme="palette"] .dropdown-family-card-top,
html[data-theme="palette"] .dropdown-child-grid .exam-category-card-top,
html[data-theme="palette"] .dropdown-child-grid .notes-category-card-top {
  position: relative !important;
  z-index: 1 !important;
  flex: 0 0 auto !important;
  align-items: flex-start !important;
  width: calc(100% + 28px) !important;
  min-height: 166px !important;
  margin: 0 -14px 12px !important;
  padding: 12px 13px !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  border-radius: 21px 21px 16px 16px !important;
  background-color: #1E293B !important;
  background-image:
    linear-gradient(180deg, rgba(15, 23, 42, .08) 18%, rgba(15, 23, 42, .70) 100%),
    url("blog/japan-hero.webp") !important;
  background-position: center !important;
  background-size: cover !important;
  box-shadow: inset 0 -42px 56px rgba(15, 23, 42, .20) !important;
}

html[data-theme="palette"] .family-ssw > .dropdown-family-card-top,
html[data-theme="palette"] .family-ssw > .exam-category-card-top,
html[data-theme="palette"] .family-ssw > .notes-category-card-top {
  background-image:
    linear-gradient(180deg, rgba(15, 23, 42, .06) 18%, rgba(15, 23, 42, .72) 100%),
    url("blog/ssw-hotel.webp") !important;
}

html[data-theme="palette"] .family-jlpt > .dropdown-family-card-top,
html[data-theme="palette"] .family-jlpt > .exam-category-card-top,
html[data-theme="palette"] .family-jlpt > .notes-category-card-top {
  background-image:
    linear-gradient(180deg, rgba(15, 23, 42, .04) 18%, rgba(15, 23, 42, .68) 100%),
    url("blog/jlpt-book.webp") !important;
}

html[data-theme="palette"] .family-nat > .dropdown-family-card-top,
html[data-theme="palette"] .family-nat > .exam-category-card-top,
html[data-theme="palette"] .family-nat > .notes-category-card-top {
  background-image:
    linear-gradient(180deg, rgba(15, 23, 42, .08) 18%, rgba(15, 23, 42, .72) 100%),
    url("blog/n5-study.webp") !important;
}

html[data-theme="palette"] .family-jlct > .dropdown-family-card-top,
html[data-theme="palette"] .family-jlct > .exam-category-card-top,
html[data-theme="palette"] .family-jlct > .notes-category-card-top {
  background-image:
    linear-gradient(180deg, rgba(15, 23, 42, .05) 18%, rgba(15, 23, 42, .70) 100%),
    url("blog/japan-castle.webp") !important;
}

/* Progress cards use the same cover-first structure without changing links. */
html[data-theme="palette"] .progress-hub-card::before {
  content: "" !important;
  display: block !important;
  flex: 0 0 auto !important;
  width: calc(100% + 28px) !important;
  min-height: 166px !important;
  margin: 0 -14px 12px !important;
  border-radius: 21px 21px 16px 16px !important;
  background-color: #1E293B !important;
  background-image:
    linear-gradient(180deg, rgba(15, 23, 42, .05) 18%, rgba(15, 23, 42, .70) 100%),
    url("blog/n5-study.webp") !important;
  background-position: center !important;
  background-size: cover !important;
  box-shadow: inset 0 -42px 56px rgba(15, 23, 42, .20) !important;
}

html[data-theme="palette"] .progress-hub-card:nth-child(2)::before {
  background-image:
    linear-gradient(180deg, rgba(15, 23, 42, .04) 18%, rgba(15, 23, 42, .68) 100%),
    url("blog/vocabulary-notes.webp") !important;
}

html[data-theme="palette"] .progress-hub-card:nth-child(3)::before {
  background-image:
    linear-gradient(180deg, rgba(15, 23, 42, .04) 18%, rgba(15, 23, 42, .68) 100%),
    url("blog/hiragana-sheet.webp") !important;
}

html[data-theme="palette"] .dropdown-family-mark,
html[data-theme="palette"] .dropdown-child-grid .exam-category-mark,
html[data-theme="palette"] .dropdown-child-grid .notes-category-mark,
html[data-theme="palette"] .progress-hub-icon {
  position: relative !important;
  z-index: 2 !important;
  display: grid !important;
  place-items: center !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  margin: 0 !important;
  border: 1px solid rgba(255, 255, 255, .34) !important;
  border-radius: 12px !important;
  background: rgba(15, 23, 42, .86) !important;
  color: #F5E6AD !important;
  font-size: .94rem !important;
  font-weight: 950 !important;
  box-shadow:
    0 8px 20px rgba(15, 23, 42, .28),
    inset 0 1px 0 rgba(255, 255, 255, .16) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  backdrop-filter: blur(8px) !important;
}

html[data-theme="palette"] .progress-hub-icon {
  position: absolute !important;
  top: 12px !important;
  left: 13px !important;
}

html[data-theme="palette"] .dropdown-family-status,
html[data-theme="palette"] .dropdown-child-grid .exam-category-status,
html[data-theme="palette"] .dropdown-child-grid .notes-category-status {
  position: relative !important;
  z-index: 2 !important;
  max-width: 68% !important;
  padding: 6px 9px !important;
  border: 1px solid rgba(255, 255, 255, .56) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, .92) !important;
  color: #0F172A !important;
  font-size: .57rem !important;
  font-weight: 900 !important;
  line-height: 1.15 !important;
  text-align: center !important;
  box-shadow: 0 7px 18px rgba(15, 23, 42, .18) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  backdrop-filter: blur(8px) !important;
}

html[data-theme="palette"] .dropdown-family-status.is-live,
html[data-theme="palette"] .dropdown-child-grid .exam-category-status.is-live,
html[data-theme="palette"] .dropdown-child-grid .notes-category-status.is-live {
  background: rgba(236, 253, 245, .94) !important;
  color: #166534 !important;
}

html[data-theme="palette"] .dropdown-family-status.is-planned,
html[data-theme="palette"] .dropdown-child-grid .exam-category-status.is-planned,
html[data-theme="palette"] .dropdown-child-grid .notes-category-status.is-planned {
  background: rgba(255, 247, 221, .94) !important;
  color: #7A5E0E !important;
}

html[data-theme="palette"] .dropdown-family-copy,
html[data-theme="palette"] .dropdown-child-grid .exam-category-copy,
html[data-theme="palette"] .dropdown-child-grid .notes-category-copy {
  display: grid !important;
  gap: 2px !important;
  margin: 0 0 9px !important;
}

html[data-theme="palette"] .dropdown-family-copy .eyebrow,
html[data-theme="palette"] .dropdown-child-grid .exam-category-copy .eyebrow,
html[data-theme="palette"] .dropdown-child-grid .notes-category-copy .eyebrow,
html[data-theme="palette"] .progress-hub-card .eyebrow {
  color: #8A6A12 !important;
  font-size: .57rem !important;
  letter-spacing: .08em !important;
}

html[data-theme="palette"] .dropdown-family-copy h2,
html[data-theme="palette"] .dropdown-child-grid .exam-category-copy h2,
html[data-theme="palette"] .dropdown-child-grid .notes-category-copy h2,
html[data-theme="palette"] .progress-hub-card h2 {
  margin: 1px 0 2px !important;
  color: #0F172A !important;
  font-size: 1.12rem !important;
  line-height: 1.16 !important;
}

html[data-theme="palette"] .dropdown-family-copy > strong,
html[data-theme="palette"] .dropdown-child-grid .dropdown-card-subtitle {
  color: #475569 !important;
  font-size: .68rem !important;
  line-height: 1.3 !important;
}

html[data-theme="palette"] .dropdown-family-copy p,
html[data-theme="palette"] .dropdown-child-grid .exam-category-copy p,
html[data-theme="palette"] .dropdown-child-grid .notes-category-copy p,
html[data-theme="palette"] .progress-hub-card p {
  display: -webkit-box !important;
  min-height: 0 !important;
  margin: 4px 0 0 !important;
  overflow: hidden !important;
  color: #64748B !important;
  font-size: .75rem !important;
  line-height: 1.42 !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
}

html[data-theme="palette"] .progress-hub-card > div {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
}

html[data-theme="palette"] .dropdown-family-items {
  gap: 5px !important;
  max-height: 50px !important;
  margin: 0 0 10px !important;
  overflow: hidden !important;
}

html[data-theme="palette"] .dropdown-family-items span {
  padding: 4px 7px !important;
  border-color: rgba(15, 23, 42, .10) !important;
  background: #F8FAFC !important;
  color: #334155 !important;
  font-size: .57rem !important;
  line-height: 1.15 !important;
}

html[data-theme="palette"] .dropdown-family-stats,
html[data-theme="palette"] .dropdown-child-grid .exam-category-stats,
html[data-theme="palette"] .dropdown-child-grid .notes-category-stats {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 5px !important;
  margin: auto 0 10px !important;
}

html[data-theme="palette"] .dropdown-family-stats div,
html[data-theme="palette"] .dropdown-child-grid .exam-category-stats div,
html[data-theme="palette"] .dropdown-child-grid .notes-category-stats div {
  min-width: 0 !important;
  padding: 7px 4px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: #F8FAFC !important;
  box-shadow: inset 0 0 0 1px rgba(15, 23, 42, .07) !important;
}

html[data-theme="palette"] .dropdown-family-stats strong,
html[data-theme="palette"] .dropdown-child-grid .exam-category-stats strong,
html[data-theme="palette"] .dropdown-child-grid .notes-category-stats strong {
  color: #0F172A !important;
  font-size: .9rem !important;
  line-height: 1 !important;
}

html[data-theme="palette"] .dropdown-family-stats span,
html[data-theme="palette"] .dropdown-child-grid .exam-category-stats span,
html[data-theme="palette"] .dropdown-child-grid .notes-category-stats span {
  color: #64748B !important;
  font-size: .47rem !important;
  line-height: 1.2 !important;
}

html[data-theme="palette"] .dropdown-child-grid .exam-category-levels {
  gap: 4px !important;
  margin: 0 0 9px !important;
}

html[data-theme="palette"] .dropdown-child-grid .difficulty-chip {
  padding: 4px 6px !important;
  font-size: .53rem !important;
}

html[data-theme="palette"] .dropdown-family-card > .btn.full,
html[data-theme="palette"] .dropdown-child-grid > .exam-category-card > .btn.full,
html[data-theme="palette"] .dropdown-child-grid > .notes-category-card > .btn.full,
html[data-theme="palette"] .progress-hub-card > .btn.full {
  align-self: flex-end !important;
  width: auto !important;
  min-width: 132px !important;
  min-height: 38px !important;
  margin: 0 0 0 auto !important;
  padding: 9px 14px !important;
  border-radius: 999px !important;
  font-size: .68rem !important;
  line-height: 1.1 !important;
  white-space: normal !important;
  text-align: center !important;
}

@media (max-width: 680px) {
  html[data-theme="palette"] .dropdown-family-grid > .dropdown-family-card,
  html[data-theme="palette"] .dropdown-child-grid > .exam-category-card,
  html[data-theme="palette"] .dropdown-child-grid > .exam-category-placeholder,
  html[data-theme="palette"] .dropdown-child-grid > .notes-category-card,
  html[data-theme="palette"] .dropdown-child-grid > .notes-category-placeholder,
  html[data-theme="palette"] .progress-hub-grid > .progress-hub-card {
    flex-basis: 100% !important;
    width: 100% !important;
    max-width: 380px !important;
  }
}

@media (max-width: 390px) {
  html[data-theme="palette"] .dropdown-family-card-top,
  html[data-theme="palette"] .dropdown-child-grid .exam-category-card-top,
  html[data-theme="palette"] .dropdown-child-grid .notes-category-card-top,
  html[data-theme="palette"] .progress-hub-card::before {
    min-height: 150px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html[data-theme="palette"] .dropdown-family-card,
  html[data-theme="palette"] .dropdown-child-grid > .exam-category-card,
  html[data-theme="palette"] .dropdown-child-grid > .notes-category-card,
  html[data-theme="palette"] .progress-hub-card {
    transition: none !important;
  }
}


/* =========================================================
   v3.17.8 — Left-Aligned Hub Cards
   Keep the compact portrait card system from v3.17.7 while
   anchoring every hub grid to the left edge of its container.
   ========================================================= */
html[data-theme="palette"] .dropdown-family-grid,
html[data-theme="palette"] .dropdown-child-grid,
html[data-theme="palette"] .progress-hub-grid {
  justify-content: flex-start !important;
}


/* =========================================================
   v3.17.9 — Balanced Hub Card Spacing
   Keep the first and last cards aligned with the container
   edges and distribute every remaining pixel between cards.
   ========================================================= */
html[data-theme="palette"] .dropdown-family-grid,
html[data-theme="palette"] .dropdown-child-grid,
html[data-theme="palette"] .progress-hub-grid {
  justify-content: space-between !important;
}


/* =========================================================
   v3.17.10 — Adaptive Hub Card Sizing
   Let compact cards grow only enough to fill wide rows while
   keeping a small, consistent gap instead of large distributed
   spaces between cards.
   ========================================================= */
html[data-theme="palette"] .dropdown-family-grid,
html[data-theme="palette"] .dropdown-child-grid,
html[data-theme="palette"] .progress-hub-grid {
  justify-content: flex-start !important;
  gap: 18px !important;
}

html[data-theme="palette"] .dropdown-family-grid > .dropdown-family-card,
html[data-theme="palette"] .dropdown-child-grid > .exam-category-card,
html[data-theme="palette"] .dropdown-child-grid > .exam-category-placeholder,
html[data-theme="palette"] .dropdown-child-grid > .notes-category-card,
html[data-theme="palette"] .dropdown-child-grid > .notes-category-placeholder,
html[data-theme="palette"] .progress-hub-grid > .progress-hub-card {
  flex: 1 1 300px !important;
  width: min(100%, 360px) !important;
  max-width: 360px !important;
}

@media (max-width: 680px) {
  html[data-theme="palette"] .dropdown-family-grid > .dropdown-family-card,
  html[data-theme="palette"] .dropdown-child-grid > .exam-category-card,
  html[data-theme="palette"] .dropdown-child-grid > .exam-category-placeholder,
  html[data-theme="palette"] .dropdown-child-grid > .notes-category-card,
  html[data-theme="palette"] .dropdown-child-grid > .notes-category-placeholder,
  html[data-theme="palette"] .progress-hub-grid > .progress-hub-card {
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: 380px !important;
  }
}


/* =========================================================
   v3.17.11 — Simplified Hub Cards
   Remove statistics cells and difficulty chips from every
   compact Notes/Papers hub card, then keep actions aligned.
   ========================================================= */
html[data-theme="palette"] .dropdown-family-card > .btn.full,
html[data-theme="palette"] .dropdown-child-grid > .exam-category-card > .btn.full,
html[data-theme="palette"] .dropdown-child-grid > .notes-category-card > .btn.full,
html[data-theme="palette"] .progress-hub-card > .btn.full {
  margin: auto 0 0 auto !important;
}


/* =========================================================
   v3.17.12 — Header Bottom Gold Line
   Draw the full-width divider on the shared header bottom,
   independent of the page or the section that follows it.
   ========================================================= */
html[data-theme="palette"] .topbar {
  border-bottom: 2px solid #C9A227 !important;
}


/* =========================================================
   v3.17.13 — Structured Blog Cards
   Match the requested scan hierarchy: image, title,
   supporting copy and a clear Read Article action.
   ========================================================= */
.blog-card-grid {
  align-items: stretch;
  gap: 18px;
}

.blog-card {
  padding: 14px !important;
  border-radius: 22px !important;
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.blog-card::before {
  content: none !important;
  display: none !important;
}

.blog-card-image {
  flex: 0 0 auto;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 15px;
  background: #E2E8F0;
}

.blog-card-image img {
  display: block;
}

.blog-card-body {
  padding: 16px 3px 3px !important;
}

.blog-card h3 {
  display: -webkit-box;
  min-height: 2.65em;
  margin: 0 0 10px;
  overflow: hidden;
  font-size: clamp(1.02rem, 1.4vw, 1.2rem);
  font-weight: 900;
  line-height: 1.32;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.blog-card h3 a {
  color: var(--text) !important;
}

.blog-card p {
  display: -webkit-box;
  min-height: 4.95em;
  margin: 0;
  overflow: hidden;
  color: var(--muted);
  font-size: .86rem;
  line-height: 1.65;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.blog-card-cta {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  gap: 8px;
  margin-top: auto;
  padding-top: 20px;
  color: #0F766E !important;
  font-size: .9rem;
  font-weight: 900;
  line-height: 1.2;
  text-decoration: none !important;
}

.blog-card-cta span:last-child {
  color: #C9A227;
  font-size: 1.2em;
  transition: transform .2s ease;
}

.blog-card:hover {
  transform: translateY(-3px);
  border-color: rgba(201,162,39,.48) !important;
  box-shadow: 0 20px 42px rgba(15,23,42,.14) !important;
}

.blog-card:hover .blog-card-cta span:last-child,
.blog-card-cta:focus-visible span:last-child {
  transform: translate(2px,-2px);
}

html[data-theme="dark"] .blog-card-image {
  background: #253244;
}

html[data-theme="dark"] .blog-card-cta {
  color: #E8D9A0 !important;
}

@media (max-width: 620px) {
  .blog-card {
    width: 100%;
    padding: 12px !important;
    border-radius: 19px !important;
  }

  .blog-card-body {
    padding: 14px 3px 3px !important;
  }

  .blog-card h3,
  .blog-card p {
    min-height: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .blog-card,
  .blog-card-image img,
  .blog-card-cta span:last-child {
    transition: none !important;
  }

  .blog-card:hover {
    transform: none;
  }
}


/* =========================================================
   v3.17.14 — Exam Level Card Covers
   Use the supplied JLPT, NAT and JLCT artwork on the matching
   Notes and Papers level cards without changing card content.
   ========================================================= */
html[data-theme="palette"] .category-jlpt-n1 { --exam-level-cover: url("hub-covers/jlpt-n1.webp"); }
html[data-theme="palette"] .category-jlpt-n2 { --exam-level-cover: url("hub-covers/jlpt-n2.webp"); }
html[data-theme="palette"] .category-jlpt-n3 { --exam-level-cover: url("hub-covers/jlpt-n3.webp"); }
html[data-theme="palette"] .category-jlpt-n4 { --exam-level-cover: url("hub-covers/jlpt-n4.webp"); }
html[data-theme="palette"] .category-jlpt-n5 { --exam-level-cover: url("hub-covers/jlpt-n5.webp"); }

html[data-theme="palette"] .category-nat-q1 { --exam-level-cover: url("hub-covers/nat-q1.webp"); }
html[data-theme="palette"] .category-nat-q2 { --exam-level-cover: url("hub-covers/nat-q2.webp"); }
html[data-theme="palette"] .category-nat-q3 { --exam-level-cover: url("hub-covers/nat-q3.webp"); }
html[data-theme="palette"] .category-nat-q4 { --exam-level-cover: url("hub-covers/nat-q4.webp"); }
html[data-theme="palette"] .category-nat-q5 { --exam-level-cover: url("hub-covers/nat-q5.webp"); }

html[data-theme="palette"] .category-jlct-jct1 { --exam-level-cover: url("hub-covers/jlct-jct1.webp"); }
html[data-theme="palette"] .category-jlct-jct2 { --exam-level-cover: url("hub-covers/jlct-jct2.webp"); }
html[data-theme="palette"] .category-jlct-jct3 { --exam-level-cover: url("hub-covers/jlct-jct3.webp"); }
html[data-theme="palette"] .category-jlct-jct4 { --exam-level-cover: url("hub-covers/jlct-jct4.webp"); }
html[data-theme="palette"] .category-jlct-jct5 { --exam-level-cover: url("hub-covers/jlct-jct5.webp"); }

html[data-theme="palette"] .dropdown-child-grid >
  :is(
    .category-jlpt-n1,
    .category-jlpt-n2,
    .category-jlpt-n3,
    .category-jlpt-n4,
    .category-jlpt-n5,
    .category-nat-q1,
    .category-nat-q2,
    .category-nat-q3,
    .category-nat-q4,
    .category-nat-q5,
    .category-jlct-jct1,
    .category-jlct-jct2,
    .category-jlct-jct3,
    .category-jlct-jct4,
    .category-jlct-jct5
  ) > :is(.exam-category-card-top, .notes-category-card-top) {
  background-image:
    linear-gradient(180deg, rgba(15, 23, 42, .02) 12%, rgba(15, 23, 42, .46) 100%),
    var(--exam-level-cover) !important;
}


/* =========================================================
   v3.17.15 — Accommodation & JFT Covers
   Use the supplied Accommodation and JFT artwork on the
   matching Notes and Papers category cards.
   ========================================================= */
html[data-theme="palette"] .category-ssw-accommodation {
  --ssw-category-cover: url("hub-covers/ssw-accommodation.webp");
}

html[data-theme="palette"] .category-jft {
  --ssw-category-cover: url("hub-covers/jft.webp");
}

html[data-theme="palette"] .dropdown-child-grid >
  :is(
    .category-ssw-accommodation,
    .category-jft
  ) > :is(.exam-category-card-top, .notes-category-card-top) {
  background-image:
    linear-gradient(180deg, rgba(15, 23, 42, .02) 12%, rgba(15, 23, 42, .46) 100%),
    var(--ssw-category-cover) !important;
}


/* =========================================================
   v3.18.0 — Elite Membership System
   Live MCQ Free/Elite access, pricing, lock state and timer.
   ========================================================= */
.btn.elite-lock-action,
.elite-lock-action {
  background: linear-gradient(135deg, #7a4b12, #d7a843 48%, #f1d487 100%);
  border: 1px solid rgba(255, 235, 177, .72);
  color: #241707;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .52), 0 10px 26px rgba(151, 102, 29, .23);
  font-weight: 900;
}

.btn.elite-lock-action:hover,
.elite-lock-action:hover {
  color: #140d04;
  filter: brightness(1.035);
}

.elite-paper-locked {
  border-color: color-mix(in srgb, #d6a94a 62%, var(--line)) !important;
  box-shadow: 0 18px 44px rgba(125, 83, 21, .13);
}

.elite-paper-locked::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(145deg, rgba(214, 169, 74, .08), transparent 48%);
}

.elite-lock-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 9px;
  border: 1px solid rgba(215, 168, 67, .44);
  border-radius: 999px;
  background: color-mix(in srgb, #d7a843 16%, var(--card));
  color: #9a6818;
  font-size: .68rem;
  font-weight: 950;
  letter-spacing: .06em;
  text-transform: uppercase;
}

html[data-theme="dark"] .elite-lock-badge {
  color: #f0ce7d;
  background: rgba(215, 168, 67, .13);
}

.dashboard-membership-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) minmax(270px, auto);
  gap: 20px;
  align-items: center;
  margin: 0 0 22px;
  padding: 22px 24px;
  border: 1px solid var(--line);
  border-radius: 26px;
  background:
    radial-gradient(circle at 8% 12%, rgba(58, 199, 206, .16), transparent 25%),
    var(--card);
  box-shadow: var(--shadow);
}

.dashboard-membership-card.is-elite {
  border-color: rgba(217, 171, 70, .52);
  background:
    radial-gradient(circle at 8% 12%, rgba(242, 207, 124, .22), transparent 27%),
    linear-gradient(135deg, color-mix(in srgb, var(--card) 94%, #f4d88d), var(--card));
}

.dashboard-membership-emblem {
  width: 62px;
  height: 62px;
  display: grid;
  place-items: center;
  border-radius: 20px;
  background: linear-gradient(145deg, #8b5715, #e5b955 58%, #f4dc9d);
  color: #fff8df;
  font-size: 1.55rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .46), 0 14px 32px rgba(124, 80, 18, .26);
}

.dashboard-membership-copy h2 {
  margin: 5px 0 7px;
  font-size: clamp(1.25rem, 2vw, 1.75rem);
}

.dashboard-membership-copy p,
.dashboard-membership-status small {
  margin: 0;
  color: var(--muted);
}

.dashboard-membership-status {
  display: grid;
  justify-items: end;
  gap: 5px;
  text-align: right;
}

.dashboard-membership-status > span {
  color: var(--muted);
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.dashboard-membership-status > strong {
  font-size: 1.08rem;
  color: var(--text);
}

.dashboard-membership-status .btn {
  margin-top: 5px;
}

.dashboard-subscription-overview {
  display: block;
  padding: 0;
  overflow: hidden;
}

.dashboard-subscription-overview.is-expired {
  border-color: rgba(220, 76, 76, .38);
  background:
    radial-gradient(circle at 8% 12%, rgba(220, 76, 76, .10), transparent 26%),
    var(--card);
}

.dashboard-subscription-overview.is-active,
.dashboard-subscription-overview.is-admin {
  border-color: rgba(217, 171, 70, .52);
  background:
    radial-gradient(circle at 8% 12%, rgba(242, 207, 124, .20), transparent 27%),
    linear-gradient(135deg, color-mix(in srgb, var(--card) 95%, #f4d88d), var(--card));
}

.dashboard-subscription-topline {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  padding: 22px 24px 18px;
}

.dashboard-subscription-title-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.dashboard-subscription-title-row h2 {
  margin: 5px 0 7px;
}

.dashboard-subscription-status-badge {
  display: inline-flex;
  align-items: center;
  min-height: 27px;
  padding: 5px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-2);
  color: var(--muted);
  font-size: .68rem;
  font-weight: 950;
  letter-spacing: .055em;
  text-transform: uppercase;
}

.dashboard-subscription-status-badge.is-active,
.dashboard-subscription-status-badge.is-admin {
  border-color: rgba(54, 162, 117, .34);
  background: rgba(54, 162, 117, .11);
  color: #25845e;
}

.dashboard-subscription-status-badge.is-expired {
  border-color: rgba(220, 76, 76, .34);
  background: rgba(220, 76, 76, .10);
  color: #b33939;
}

html[data-theme="dark"] .dashboard-subscription-status-badge.is-active,
html[data-theme="dark"] .dashboard-subscription-status-badge.is-admin { color: #78d9b0; }
html[data-theme="dark"] .dashboard-subscription-status-badge.is-expired { color: #ff9b9b; }

.dashboard-subscription-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.dashboard-subscription-alert {
  display: flex;
  gap: 8px 14px;
  align-items: center;
  flex-wrap: wrap;
  margin: 0 24px 16px;
  padding: 11px 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  font-size: .82rem;
}

.dashboard-subscription-alert strong { white-space: nowrap; }
.dashboard-subscription-alert span { color: var(--muted); }

.dashboard-subscription-alert.is-warning {
  border-color: rgba(222, 160, 45, .40);
  background: rgba(222, 160, 45, .09);
}

.dashboard-subscription-alert.is-warning strong { color: #a56d0c; }

.dashboard-subscription-alert.is-expired {
  border-color: rgba(220, 76, 76, .35);
  background: rgba(220, 76, 76, .08);
}

.dashboard-subscription-alert.is-expired strong { color: #b33939; }

.dashboard-subscription-meta-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.dashboard-subscription-meta-grid article {
  min-width: 0;
  padding: 16px 18px;
}

.dashboard-subscription-meta-grid article + article {
  border-left: 1px solid var(--line);
}

.dashboard-subscription-meta-grid span,
.dashboard-subscription-countdown-row > div:first-child > span {
  display: block;
  margin-bottom: 5px;
  color: var(--muted);
  font-size: .67rem;
  font-weight: 900;
  letter-spacing: .075em;
  text-transform: uppercase;
}

.dashboard-subscription-meta-grid strong {
  display: block;
  color: var(--text);
  font-size: .98rem;
  overflow-wrap: anywhere;
}

.dashboard-subscription-meta-grid small,
.dashboard-subscription-countdown-row small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: .71rem;
}

.dashboard-subscription-countdown-row {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
  padding: 14px 24px;
  border-bottom: 1px solid var(--line);
}

.dashboard-subscription-countdown-row .elite-countdown {
  margin-top: 0;
}

.dashboard-subscription-benefit-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  padding: 16px 18px 18px;
}

.dashboard-subscription-benefit-grid article {
  display: flex;
  gap: 10px;
  align-items: center;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: color-mix(in srgb, var(--surface-2) 72%, transparent);
}

.dashboard-benefit-icon {
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: color-mix(in srgb, #d7a843 14%, var(--card));
  color: #a8721c;
  font-size: .67rem;
  font-weight: 950;
}

.dashboard-subscription-benefit-grid article > div {
  min-width: 0;
}

.dashboard-subscription-benefit-grid small {
  display: block;
  margin-bottom: 3px;
  color: var(--muted);
  font-size: .64rem;
  font-weight: 850;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.dashboard-subscription-benefit-grid strong {
  display: block;
  color: var(--text);
  font-size: .84rem;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.elite-countdown {
  display: grid;
  grid-template-columns: repeat(4, auto auto);
  align-items: baseline;
  gap: 4px 7px;
  margin-top: 8px;
  padding: 9px 12px;
  border: 1px solid rgba(215, 168, 67, .36);
  border-radius: 14px;
  background: color-mix(in srgb, #d7a843 10%, var(--surface-2));
}

.elite-countdown b {
  min-width: 1.6em;
  color: #a8721c;
  font-variant-numeric: tabular-nums;
  font-size: 1rem;
}

.elite-countdown i {
  color: var(--muted);
  font-size: .64rem;
  font-style: normal;
  font-weight: 800;
  text-transform: uppercase;
}

.elite-countdown.is-expired {
  opacity: .72;
}

.elite-subscription-main {
  width: min(1220px, calc(100% - 28px));
}

.elite-locked-notice {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  align-items: center;
  margin-bottom: 16px;
}

.elite-subscription-hero {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(290px, .7fr);
  gap: 32px;
  align-items: center;
  padding: clamp(30px, 5vw, 58px);
  border: 1px solid rgba(230, 190, 102, .46);
  border-radius: 32px;
  background:
    radial-gradient(circle at 82% 20%, rgba(239, 206, 124, .28), transparent 30%),
    linear-gradient(135deg, #101b2f 0%, #182b43 54%, #3a2b1a 100%);
  color: #fff;
  box-shadow: 0 30px 80px rgba(18, 30, 47, .28);
}

.elite-subscription-hero::after {
  content: "◆";
  position: absolute;
  right: 4%;
  top: -35%;
  color: rgba(241, 211, 140, .06);
  font-size: 28rem;
  line-height: 1;
  transform: rotate(14deg);
  pointer-events: none;
}

.elite-hero-copy,
.elite-current-status {
  position: relative;
  z-index: 1;
}

.elite-hero-copy h1 {
  max-width: 760px;
  margin: 8px 0 14px;
  color: #fff;
  font-size: clamp(2.25rem, 5vw, 4.6rem);
  line-height: .98;
  letter-spacing: -.045em;
}

.elite-hero-copy > p {
  max-width: 760px;
  color: #d7e0eb;
  font-size: 1.02rem;
  line-height: 1.75;
}

.elite-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}

.elite-current-status {
  display: grid;
  gap: 9px;
  padding: 24px;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 24px;
  background: rgba(255, 255, 255, .08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}

.elite-current-status.is-elite {
  border-color: rgba(241, 211, 140, .58);
  background: rgba(218, 166, 59, .13);
}

.elite-current-status > span {
  color: #d8c590;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.elite-current-status > strong {
  color: #fff3cf;
  font-size: 1.55rem;
}

.elite-current-status p {
  margin: 0;
  color: #d9e1ea;
}

.elite-plan-section,
.elite-payment-section {
  margin-top: 34px;
}

.elite-section-heading {
  max-width: 780px;
  margin-bottom: 18px;
}

.elite-section-heading h2 {
  margin: 6px 0 8px;
  font-size: clamp(1.7rem, 3vw, 2.55rem);
}

.elite-section-heading p {
  margin: 0;
  color: var(--muted);
}

.elite-plan-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  align-items: stretch;
}

.elite-plan-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 100%;
  padding: 25px;
  border: 1px solid var(--line);
  border-radius: 26px;
  background: var(--card);
  box-shadow: var(--shadow);
}

.elite-plan-card.is-elite,
.elite-plan-card.is-lifetime {
  border-color: rgba(216, 170, 68, .48);
  background:
    linear-gradient(150deg, color-mix(in srgb, var(--card) 92%, #f4d78c), var(--card) 55%);
}

.elite-plan-card.is-elite {
  transform: translateY(-8px);
  box-shadow: 0 26px 68px rgba(128, 84, 21, .18);
}

.elite-plan-recommended {
  position: absolute;
  right: 20px;
  top: -13px;
  padding: 6px 11px;
  border-radius: 999px;
  background: linear-gradient(135deg, #92601a, #e6bd62);
  color: #fff9e6;
  font-size: .66rem;
  font-weight: 950;
  letter-spacing: .08em;
}

.elite-plan-label {
  color: #a46f1c;
  font-size: .72rem;
  font-weight: 950;
  letter-spacing: .1em;
}

.elite-plan-price {
  display: flex;
  align-items: baseline;
  gap: 9px;
  margin: 13px 0 18px;
}

.elite-plan-price strong {
  color: var(--text);
  font-size: clamp(2rem, 4vw, 3.1rem);
  line-height: 1;
}

.elite-plan-price small {
  color: var(--muted);
  font-weight: 800;
}

.elite-plan-card ul {
  display: grid;
  gap: 12px;
  margin: 0 0 24px;
  padding: 0;
  list-style: none;
}

.elite-plan-card li {
  position: relative;
  padding-left: 24px;
  color: var(--muted);
  line-height: 1.5;
}

.elite-plan-card li::before {
  content:'';width:1em;height:1em;background:currentColor;mask:url('/assets/icons/check.svg') center/contain no-repeat;-webkit-mask:url('/assets/icons/check.svg') center/contain no-repeat;
  position: absolute;
  left: 0;
  color: #b27c23;
  font-weight: 950;
}

.elite-plan-card > .btn {
  margin-top: auto;
}

.elite-payment-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.elite-payment-card {
  min-height: 210px;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: var(--card);
  box-shadow: var(--shadow);
}

.elite-payment-card > span {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 12px;
  background: color-mix(in srgb, #d7a843 15%, var(--surface-2));
  color: #a36e18;
  font-size: .76rem;
  font-weight: 950;
}

.elite-payment-card h3 {
  margin: 18px 0 8px;
}

.elite-payment-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.6;
}

.elite-payment-card .btn {
  margin-top: 16px;
}

.elite-coming-soon {
  display: inline-flex;
  margin-top: 16px;
  padding: 6px 9px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--orange) 14%, var(--surface-2));
  color: var(--orange);
  font-size: .7rem;
}

.elite-payment-note {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  margin-top: 16px;
  padding: 17px 20px;
  border: 1px solid rgba(215, 168, 67, .36);
  border-radius: 18px;
  background: color-mix(in srgb, #d7a843 9%, var(--card));
}

.elite-payment-note strong {
  color: #9d6917;
  white-space: nowrap;
}

.elite-payment-note p {
  margin: 0;
  color: var(--muted);
}

@media (max-width: 980px) {
  .dashboard-membership-card {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .dashboard-subscription-overview {
    display: block;
  }
  .dashboard-subscription-topline {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .dashboard-subscription-actions {
    grid-column: 1 / -1;
    justify-content: flex-start;
    padding-top: 2px;
  }
  .dashboard-subscription-meta-grid,
  .dashboard-subscription-benefit-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .dashboard-subscription-meta-grid article:nth-child(3) {
    border-left: 0;
    border-top: 1px solid var(--line);
  }
  .dashboard-subscription-meta-grid article:nth-child(4) {
    border-top: 1px solid var(--line);
  }
  .dashboard-membership-status {
    grid-column: 1 / -1;
    justify-items: start;
    text-align: left;
    padding-top: 14px;
    border-top: 1px solid var(--line);
  }
  .elite-subscription-hero {
    grid-template-columns: 1fr;
  }
  .elite-plan-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .elite-plan-card.is-elite {
    transform: none;
  }
  .elite-payment-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .dashboard-membership-card {
    grid-template-columns: 1fr;
    padding: 19px;
  }
  .dashboard-subscription-overview {
    padding: 0;
  }
  .dashboard-subscription-topline {
    grid-template-columns: 1fr;
    padding: 18px;
  }
  .dashboard-subscription-actions {
    grid-column: auto;
  }
  .dashboard-subscription-actions .btn {
    flex: 1 1 135px;
  }
  .dashboard-subscription-alert {
    margin: 0 18px 14px;
  }
  .dashboard-subscription-meta-grid,
  .dashboard-subscription-benefit-grid {
    grid-template-columns: 1fr;
  }
  .dashboard-subscription-meta-grid article + article,
  .dashboard-subscription-meta-grid article:nth-child(3),
  .dashboard-subscription-meta-grid article:nth-child(4) {
    border-left: 0;
    border-top: 1px solid var(--line);
  }
  .dashboard-subscription-countdown-row {
    align-items: flex-start;
    flex-direction: column;
    padding: 14px 18px;
  }
  .dashboard-subscription-benefit-grid {
    padding: 14px 18px 18px;
  }
  .dashboard-membership-emblem {
    width: 52px;
    height: 52px;
    border-radius: 17px;
  }
  .dashboard-membership-status {
    grid-column: auto;
  }
  .elite-countdown {
    grid-template-columns: repeat(4, auto);
    gap: 4px 8px;
  }
  .elite-countdown i {
    display: none;
  }
  .elite-subscription-main {
    width: min(100% - 18px, 1220px);
  }
  .elite-subscription-hero {
    padding: 24px 20px;
    border-radius: 25px;
  }
  .elite-plan-grid,
  .elite-payment-grid {
    grid-template-columns: 1fr;
  }
  .elite-plan-card,
  .elite-payment-card {
    min-height: 0;
  }
  .elite-payment-note {
    flex-direction: column;
    gap: 6px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .elite-plan-card.is-elite {
    transform: none;
  }
}

/* =========================================================
   v3.18.1 — Correct Sign in with Google dimensions
   The official Google Identity Services button supports a
   maximum width of 400px and renders at 44px in large mode.
   ========================================================= */
.auth-card,
html[data-theme="palette"] .auth-card {
  width: min(100%, 464px) !important;
  max-width: 464px !important;
  padding: 32px 32px 28px !important;
}

.auth-card .social-login-stack {
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.auth-card .google-signin-shell,
.auth-card .google-signin-slot {
  width: 100% !important;
  max-width: 400px !important;
  height: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}

.auth-card .google-signin-shell {
  overflow: visible !important;
}

.auth-card .google-signin-slot {
  overflow: hidden !important;
}

.auth-card .google-signin-shell::before,
.auth-card .google-signin-shell::after {
  display: none !important;
  content: none !important;
}

.auth-card .google-signin-slot > div,
.auth-card .google-signin-slot iframe {
  width: 100% !important;
  max-width: 400px !important;
  min-width: 0 !important;
  height: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

.auth-card .google-signin-shell:focus-within {
  outline: 3px solid rgba(66, 133, 244, .26) !important;
  outline-offset: 3px !important;
  box-shadow: none !important;
}

.auth-card .google-signin-shell:focus-within iframe {
  box-shadow: none !important;
}

.auth-card .social-auth-status:empty {
  display: none;
}

.auth-card .social-auth-status:not(:empty) {
  min-height: 18px;
  margin-top: 10px;
}

@media (max-width: 600px) {
  .auth-card,
  html[data-theme="palette"] .auth-card {
    width: 100% !important;
    max-width: 464px !important;
    padding: 25px 20px 23px !important;
  }
}

/* =========================================================
   v3.18.2 — Google button redesign
   A stronger official filled-blue Google pill with one clean
   visual surface, responsive sizing and accessible feedback.
   ========================================================= */
.auth-card .social-auth-block {
  margin-top: 24px;
}

.auth-card .social-login-divider {
  margin-bottom: 18px;
  color: color-mix(in srgb, var(--muted) 88%, #1a73e8);
  letter-spacing: .09em;
}

.auth-card .social-login-divider::before,
.auth-card .social-login-divider::after {
  background: linear-gradient(90deg, transparent, color-mix(in srgb, #1a73e8 34%, var(--line)));
}

.auth-card .social-login-divider::after {
  background: linear-gradient(90deg, color-mix(in srgb, #1a73e8 34%, var(--line)), transparent);
}

.auth-card .google-signin-shell {
  height: 48px !important;
  min-height: 48px !important;
  max-height: 48px !important;
  overflow: visible !important;
  transition: transform .18s ease, filter .18s ease !important;
  transform-origin: center !important;
}

.auth-card .google-signin-slot {
  height: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  overflow: visible !important;
}

.auth-card .google-signin-slot > div,
.auth-card .google-signin-slot iframe {
  height: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  border-radius: 999px !important;
}

.auth-card .google-signin-slot iframe {
  box-shadow: 0 8px 18px rgba(26, 115, 232, .24) !important;
  transition: box-shadow .18s ease !important;
}

.auth-card .google-signin-shell:hover {
  transform: translateY(-2px) !important;
  filter: none !important;
}

.auth-card .google-signin-shell:hover iframe {
  box-shadow: 0 12px 24px rgba(26, 115, 232, .32) !important;
}

.auth-card .google-signin-shell:active {
  transform: translateY(0) scale(.995) !important;
}

.auth-card .google-signin-shell:focus-within {
  outline: 3px solid rgba(26, 115, 232, .28) !important;
  outline-offset: 3px !important;
}

html[data-theme="dark"] .auth-card .social-login-divider {
  color: #a9becd;
}

html[data-theme="dark"] .auth-card .google-signin-slot iframe {
  box-shadow: 0 9px 22px rgba(0, 0, 0, .34), 0 0 0 1px rgba(255, 255, 255, .06) !important;
}

html[data-theme="dark"] .auth-card .google-signin-shell:hover iframe {
  box-shadow: 0 13px 28px rgba(0, 0, 0, .42), 0 0 0 1px rgba(255, 255, 255, .08) !important;
}

@media (max-width: 600px) {
  .auth-card .social-auth-block {
    margin-top: 22px;
  }

  .auth-card .social-login-divider {
    margin-bottom: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .auth-card .google-signin-shell,
  .auth-card .google-signin-slot iframe {
    transition: none !important;
  }

  .auth-card .google-signin-shell:hover,
  .auth-card .google-signin-shell:active {
    transform: none !important;
  }
}

/* ========================================================================== */
/* Version 3.19.0 · Resources library, protected PDF viewer and plan table     */
/* ========================================================================== */
.resources-main,.resource-view-main{display:grid;gap:1.35rem}
.resources-hero,.resource-view-head,.elite-trial-banner{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding:1.55rem;border:1px solid var(--border);border-radius:24px;background:var(--card);box-shadow:var(--shadow)}
.resources-hero h1,.resource-view-head h1{margin:.28rem 0 .45rem;font-size:clamp(1.8rem,3.2vw,3rem)}
.resources-hero p,.resource-view-head p{margin:0;color:var(--muted);max-width:760px;line-height:1.7}
.resources-hero-count,.resource-download-usage{flex:0 0 auto;min-width:150px;padding:1rem 1.15rem;border:1px solid var(--border);border-radius:18px;background:var(--surface);text-align:center;display:grid;gap:.18rem}
.resources-hero-count strong,.resource-download-usage strong{font-size:1.75rem}.resources-hero-count span,.resource-download-usage span,.resource-download-usage small{color:var(--muted);font-size:.78rem;font-weight:800}
.resources-breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:.42rem;margin-bottom:.8rem;color:var(--muted);font-size:.82rem;font-weight:800}.resources-breadcrumb a{color:inherit}.resources-breadcrumb strong{color:var(--text)}
.resource-hub-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1rem}
.resource-hub-card,.resource-group-card,.resource-level-card{display:grid;gap:.72rem;padding:1.25rem;border:1px solid var(--border);border-radius:22px;background:var(--card);box-shadow:var(--shadow);color:var(--text);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.resource-hub-card:hover,.resource-group-card:hover,.resource-level-card:hover{transform:translateY(-3px);border-color:#2C7DA0;box-shadow:0 18px 42px rgba(15,23,42,.12)}
.resource-hub-card>span{width:48px;height:48px;display:grid;place-items:center;border-radius:16px;background:rgba(44,125,160,.12);font-size:1.4rem;font-weight:900}.resource-hub-card>strong{font-size:1.02rem}.resource-hub-card>small,.resource-group-card>strong{color:var(--muted);line-height:1.55}.resource-hub-card>b,.resource-group-card>b{margin-top:auto;color:#01497C;font-size:.82rem}
.resource-group-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}.resource-group-card>span{font-size:1.25rem;font-weight:950}.resource-group-card>strong{font-size:.82rem}.resource-group-card>b{margin-top:.35rem}
.resource-level-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1rem}.resource-level-grid.is-single{grid-template-columns:minmax(260px,380px)}
.resource-level-card{position:relative;min-height:245px;overflow:hidden}.resource-level-card::after{content:"";position:absolute;inset:auto -44px -54px auto;width:130px;height:130px;border-radius:50%;background:rgba(44,125,160,.07);pointer-events:none}
.resource-level-card>span{justify-self:start;width:max-content;max-width:100%;min-width:62px;min-height:42px;height:auto;padding:.32rem .78rem;display:grid;place-items:center;border-radius:15px;background:linear-gradient(145deg,#01497C,#2C7DA0);box-shadow:0 10px 22px rgba(1,73,124,.2);color:#fff;font-size:1.02rem;font-weight:950;line-height:1.2;text-align:center;letter-spacing:.02em;white-space:normal}
/* v3.19.63 — compact resource level badge spacing: preserve complete labels while reducing excess top/bottom empty space. */
.resource-level-card>strong{font-size:1.08rem}.resource-level-card>small{min-height:2.6em;color:var(--muted);font-size:.78rem;font-weight:750;line-height:1.55}
.resource-level-card>em{justify-self:start;padding:.36rem .58rem;border:1px solid var(--border);border-radius:999px;background:var(--surface);color:var(--muted);font-size:.7rem;font-style:normal;font-weight:850;line-height:1.25}.resource-level-card.has-resources>em{border-color:rgba(15,118,110,.28);background:rgba(15,118,110,.09);color:#0F766E}
.resource-level-card>b{z-index:1;margin-top:auto;color:#01497C;font-size:.82rem}.resource-level-card.has-resources{border-color:rgba(44,125,160,.32)}
.resource-card-grid{display:flex;flex-wrap:wrap;justify-content:center;align-items:stretch;gap:1.2rem}
.resource-pdf-card{width:calc((100% - 4.8rem)/5);min-width:0;display:flex;flex-direction:column;gap:.88rem;padding:.85rem;border:1px solid var(--border);border-radius:20px;background:var(--card);box-shadow:var(--shadow)}
.resource-pdf-image{aspect-ratio:4/3;border-radius:14px;overflow:hidden;background:linear-gradient(145deg,rgba(44,125,160,.16),rgba(1,73,124,.06));display:grid;place-items:center}.resource-pdf-image img{width:100%;height:100%;object-fit:contain;display:block;background:#f4f1e8}.resource-pdf-image>span{font-size:1.5rem;font-weight:950;letter-spacing:.08em;color:#01497C}
.resource-pdf-card h2{margin:0;font-size:.98rem;line-height:1.45;text-align:center;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.8em}.resource-pdf-card .btn{margin-top:auto}
.resource-card-actions{display:grid;gap:.55rem;margin-top:auto}.resource-card-actions .btn{margin-top:0}
.resource-audio-card .resource-pdf-image{background:linear-gradient(145deg,rgba(217,164,65,.2),rgba(44,125,160,.12))}.resource-audio-card .btn{white-space:normal;line-height:1.25}
.resource-audio-main{gap:1.1rem}.resource-audio-head p{max-width:780px}.resource-audio-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;padding:1rem;border:1px solid var(--border);border-radius:22px;background:var(--card);box-shadow:var(--shadow)}.resource-audio-summary>div{display:grid;gap:.2rem;padding:.85rem 1rem;border:1px solid var(--border);border-radius:16px;background:var(--surface);text-align:center}.resource-audio-summary strong{font-size:1.35rem}.resource-audio-summary span{color:var(--muted);font-size:.78rem;font-weight:850}.resource-audio-summary p{grid-column:1/-1;margin:0;color:var(--muted);text-align:center;font-size:.86rem;line-height:1.6}
.resource-audio-toolbar{display:flex;align-items:end;justify-content:space-between;gap:1rem;padding:1rem 1.15rem}.resource-audio-toolbar label{display:grid;gap:.42rem;flex:1;max-width:540px}.resource-audio-toolbar label>span{font-size:.78rem;font-weight:900;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}.resource-audio-toolbar input{width:100%;min-height:44px;padding:.72rem .9rem;border:1px solid var(--border);border-radius:13px;background:var(--surface);color:var(--text);font:inherit}.resource-audio-toolbar input:focus{outline:3px solid rgba(44,125,160,.2);border-color:#2C7DA0}.resource-audio-toolbar>strong{color:var(--muted);font-size:.86rem;white-space:nowrap}
.resource-audio-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.resource-audio-track{display:grid;gap:.82rem;padding:1rem;border:1px solid var(--border);border-radius:18px;background:var(--card);box-shadow:var(--shadow)}.resource-audio-track[hidden]{display:none}.resource-audio-track-head{display:flex;align-items:center;gap:.82rem}.resource-audio-track-head>span{flex:0 0 46px;width:46px;height:46px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(145deg,#01497C,#2C7DA0);color:#fff;font-size:.9rem;font-weight:950;box-shadow:0 8px 18px rgba(1,73,124,.2)}.resource-audio-track-head>div{min-width:0;display:grid;gap:.2rem}.resource-audio-track-head strong{font-size:.95rem}.resource-audio-track-head small{color:var(--muted);font-size:.76rem;font-weight:750}.resource-audio-track audio{display:block;width:100%;height:42px}.resource-audio-empty{margin:0;padding:1.2rem;text-align:center;color:var(--muted);font-weight:800}.resource-audio-empty[hidden]{display:none}
.resource-empty-state{min-height:260px;display:grid;place-items:center;align-content:center;text-align:center;gap:.55rem}.resource-empty-state>span{width:64px;height:64px;display:grid;place-items:center;border-radius:20px;background:rgba(44,125,160,.12);font-weight:950;color:#01497C}.resource-empty-state h2,.resource-empty-state p{margin:0}.resource-empty-state p{color:var(--muted)}
.resource-view-actions{display:flex;align-items:center;flex-wrap:wrap;gap:.7rem}.resource-view-actions form{margin:0}.resource-view-actions button:disabled{opacity:.5;cursor:not-allowed}
.resource-view-limit{display:flex;align-items:center;justify-content:center;gap:.75rem;flex-wrap:wrap;padding:.8rem 1rem;border:1px solid rgba(44,125,160,.25);border-radius:16px;background:rgba(44,125,160,.08);font-size:.82rem}.resource-view-limit span{color:var(--muted)}.resource-view-limit a{font-weight:900}.resource-view-limit.is-exhausted{border-color:rgba(190,24,93,.25);background:rgba(190,24,93,.07)}
.resource-pdf-viewer-shell{min-height:72vh;border:1px solid var(--border);border-radius:22px;overflow:hidden;background:#20242a;box-shadow:var(--shadow)}.resource-pdf-viewer-shell iframe{display:block;width:100%;height:78vh;min-height:620px;border:0;background:#20242a}
.admin-resource-current-files{display:flex;align-items:center;gap:1rem;padding:1rem;border:1px solid var(--border);border-radius:16px;background:var(--surface)}.admin-resource-current-files img{width:110px;aspect-ratio:4/3;object-fit:cover;border-radius:12px}.admin-resource-current-files div{display:grid;gap:.3rem}.admin-resource-current-files small{color:var(--muted)}
.elite-trial-banner{background:linear-gradient(135deg,rgba(44,125,160,.12),rgba(105,48,195,.08))}.elite-trial-banner h2,.elite-trial-banner p{margin:.2rem 0}.elite-trial-banner p{color:var(--muted);line-height:1.65}.elite-trial-banner>strong{font-size:clamp(1.6rem,4vw,3rem);white-space:nowrap;color:#01497C}
.elite-comparison-section{display:grid;gap:1rem}.elite-comparison-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:22px;background:var(--card);box-shadow:var(--shadow)}.elite-comparison-table{width:100%;min-width:760px;border-collapse:collapse}.elite-comparison-table th,.elite-comparison-table td{padding:1rem 1.05rem;border-bottom:1px solid var(--border);text-align:center;vertical-align:middle}.elite-comparison-table thead th{background:rgba(44,125,160,.1);font-size:.82rem;letter-spacing:.02em}.elite-comparison-table thead th:first-child,.elite-comparison-table tbody th{text-align:left}.elite-comparison-table tbody th{width:28%;font-size:.84rem}.elite-comparison-table tbody td{color:var(--muted);font-size:.86rem}.elite-comparison-table tbody td strong{color:var(--text)}.elite-comparison-table tr:last-child th,.elite-comparison-table tr:last-child td{border-bottom:0}
.mobile-nav-resource-others{margin-top:.35rem}
html[data-theme="dark"] .resource-hub-card>b,html[data-theme="dark"] .resource-group-card>b,html[data-theme="dark"] .resource-level-card>b,html[data-theme="dark"] .resource-pdf-image>span,html[data-theme="dark"] .elite-trial-banner>strong{color:#89C2D9}
html[data-theme="dark"] .resource-level-card.has-resources>em{border-color:rgba(94,234,212,.28);background:rgba(15,118,110,.16);color:#99F6E4}
@media(max-width:1100px){.resource-hub-grid,.resource-level-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.resource-level-grid.is-single{grid-template-columns:minmax(260px,380px)}.resource-pdf-card{width:calc((100% - 3.6rem)/4)}}
@media(max-width:900px){.resource-group-grid,.resource-level-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.resource-level-grid.is-single{grid-template-columns:minmax(260px,380px)}.resource-pdf-card{width:calc((100% - 2.4rem)/3)}.resources-hero,.resource-view-head,.elite-trial-banner{align-items:flex-start;flex-direction:column}.resources-hero-count,.resource-download-usage{width:100%}.resource-view-actions{width:100%}.resource-pdf-viewer-shell iframe{height:72vh;min-height:520px}.resource-audio-list{grid-template-columns:1fr}}
@media(max-width:680px){.resource-hub-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.resource-pdf-card{width:calc((100% - 1.2rem)/2)}.resource-view-actions .btn,.resource-view-actions form{width:100%}.resource-view-actions form .btn{width:100%}.resource-pdf-viewer-shell iframe{min-height:460px}.admin-resource-current-files{align-items:flex-start;flex-direction:column}.admin-resource-current-files img{width:100%;max-width:220px}.resource-audio-summary{grid-template-columns:1fr}.resource-audio-summary p{grid-column:auto}.resource-audio-toolbar{align-items:stretch;flex-direction:column}.resource-audio-toolbar label{max-width:none}.resource-audio-toolbar>strong{white-space:normal}.resource-audio-track{padding:.85rem}}
@media(max-width:430px){.resource-hub-grid,.resource-group-grid,.resource-level-grid,.resource-level-grid.is-single{grid-template-columns:1fr}.resource-level-card{min-height:225px}.resource-pdf-card{width:100%}}

/* =========================================================
   v3.19.23 — Subscription hero contrast repair
   Scoped overrides protect the dark hero from global palette
   heading, paragraph, eyebrow and link colour declarations.
   ========================================================= */
html[data-theme="palette"] .elite-subscription-hero,
html[data-theme="palette"] .elite-subscription-hero .elite-hero-copy,
html[data-theme="palette"] .elite-subscription-hero .elite-current-status{
  color:#FFFFFF!important;
}
html[data-theme="palette"] .elite-subscription-hero .elite-hero-copy h1{
  color:#FFFFFF!important;
  text-shadow:0 2px 18px rgba(0,0,0,.22)!important;
}
html[data-theme="palette"] .elite-subscription-hero .elite-hero-copy>.eyebrow{
  color:#F4D56F!important;
  opacity:1!important;
  text-shadow:0 1px 10px rgba(0,0,0,.25)!important;
}
html[data-theme="palette"] .elite-subscription-hero .elite-hero-copy>p{
  color:#DCE5EF!important;
  opacity:1!important;
}
html[data-theme="palette"] .elite-subscription-hero .elite-current-status span{
  color:#F4D56F!important;
}
html[data-theme="palette"] .elite-subscription-hero .elite-current-status strong,
html[data-theme="palette"] .elite-subscription-hero .elite-current-status h2,
html[data-theme="palette"] .elite-subscription-hero .elite-current-status h3{
  color:#FFFFFF!important;
}
html[data-theme="palette"] .elite-subscription-hero .elite-current-status p,
html[data-theme="palette"] .elite-subscription-hero .elite-current-status small{
  color:#DCE5EF!important;
}
html[data-theme="palette"] .elite-subscription-hero .elite-hero-actions .btn.primary{
  color:#0F172A!important;
}
html[data-theme="palette"] .elite-subscription-hero .elite-hero-actions .btn.secondary{
  color:#FFFFFF!important;
}
@media(max-width:620px){
  html[data-theme="palette"] .elite-subscription-hero .elite-hero-copy h1{
    text-shadow:0 2px 12px rgba(0,0,0,.2)!important;
  }
}


/* v3.19.25 — High-contrast Back to Top control. */
.back-to-top{
  width:52px!important;
  height:52px!important;
  border:2px solid #FFF4BD!important;
  background:linear-gradient(145deg,#F4D56F,#D7AA1D)!important;
  color:#0F172A!important;
  box-shadow:0 10px 26px rgba(15,23,42,.28),0 0 0 5px rgba(244,213,111,.20)!important;
}
.back-to-top span{
  color:#0F172A!important;
  font-size:1.55rem!important;
  font-weight:950!important;
  line-height:1!important;
  text-shadow:0 1px 0 rgba(255,255,255,.55);
}
.back-to-top:hover{
  filter:brightness(1.04)!important;
  transform:translateY(-3px) scale(1.04)!important;
  box-shadow:0 14px 32px rgba(15,23,42,.34),0 0 0 6px rgba(244,213,111,.24)!important;
}
.back-to-top:focus-visible{
  outline:3px solid #0F766E!important;
  outline-offset:4px!important;
}
html[data-theme="dark"] .back-to-top{
  border-color:#FFF7D0!important;
  background:linear-gradient(145deg,#FFE58A,#D7AA1D)!important;
}
@media(max-width:620px){
  .back-to-top{width:50px!important;height:50px!important;right:14px!important;bottom:16px!important}
  .back-to-top span{font-size:1.45rem!important}
}

/* =========================================================
   v3.19.41 — Resource cover display repair

   Portrait book covers remain fully visible in the foreground. The same
   cover fills the fixed card frame as a soft backdrop, removing the large
   empty bands without cropping titles or artwork.
   ========================================================= */
.resource-pdf-image.has-cover{
  position:relative;
  isolation:isolate;
  background:#183346;
}
.resource-pdf-image.has-cover::before{
  content:"";
  position:absolute;
  z-index:0;
  inset:-12%;
  background-image:var(--resource-cover-image);
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  filter:blur(18px) saturate(.92) brightness(.76);
  transform:scale(1.12);
}
.resource-pdf-image.has-cover::after{
  content:"";
  position:absolute;
  z-index:1;
  inset:0;
  background:linear-gradient(90deg,rgba(9,25,38,.30),rgba(9,25,38,.06) 31%,rgba(9,25,38,.06) 69%,rgba(9,25,38,.30));
  pointer-events:none;
}
.resource-pdf-image.has-cover img{
  position:relative;
  z-index:2;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  background:transparent;
  filter:drop-shadow(0 9px 14px rgba(0,0,0,.34));
  transform:scale(1.045);
  transform-origin:center;
}
html[data-theme="dark"] .resource-pdf-image.has-cover::before{
  filter:blur(18px) saturate(.88) brightness(.58);
}
html[data-theme="dark"] .resource-pdf-image.has-cover::after{
  background:linear-gradient(90deg,rgba(2,10,18,.42),rgba(2,10,18,.10) 31%,rgba(2,10,18,.10) 69%,rgba(2,10,18,.42));
}

/* =========================================================
   v3.19.42 — iPhone resource-cover layout repair

   iOS Safari can resolve a percentage-sized image inside a grid item with
   aspect-ratio against the wrong box. Use a portrait book-cover frame and
   centre the natural-ratio image independently of Grid and object-fit.
   ========================================================= */
.resource-pdf-image.has-cover{
  position:relative!important;
  display:block!important;
  aspect-ratio:3/4!important;
  isolation:isolate;
  overflow:hidden!important;
  background-color:#183346!important;
  background-position:center!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
}
.resource-pdf-image.has-cover::before{
  display:block!important;
  z-index:0!important;
}
.resource-pdf-image.has-cover::after{
  display:block!important;
  z-index:1!important;
}
.resource-pdf-image.has-cover img{
  position:absolute!important;
  z-index:2!important;
  inset:auto!important;
  top:50%!important;
  left:50%!important;
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:initial!important;
  object-position:initial!important;
  margin:0!important;
  transform:translate(-50%,-50%)!important;
  transform-origin:center!important;
  background:transparent!important;
  filter:drop-shadow(0 9px 14px rgba(0,0,0,.34));
}

/* =========================================================
   v3.19.43 — 4:3 resource-cover side-gutter layout

   Keep the compact landscape card frame requested by the user. Portrait
   book covers are fully visible, vertically fitted and centred, so any
   unused space appears only as clean left/right gutters instead of above
   or below the cover. The absolute image layer remains iPhone-safe.
   ========================================================= */
.resource-pdf-image.has-cover{
  position:relative!important;
  display:block!important;
  aspect-ratio:4/3!important;
  overflow:hidden!important;
  background:#FFFFFF!important;
  background-image:none!important;
}
.resource-pdf-image.has-cover::before,
.resource-pdf-image.has-cover::after{
  content:none!important;
  display:none!important;
  background:none!important;
}
.resource-pdf-image.has-cover img{
  position:absolute!important;
  z-index:2!important;
  inset:0!important;
  top:0!important;
  left:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  object-fit:contain!important;
  object-position:center center!important;
  transform:none!important;
  background:transparent!important;
  filter:none!important;
}
html[data-theme="dark"] .resource-pdf-image.has-cover{
  background:#FFFFFF!important;
}

/* =========================================================
   v3.19.45 — Papers PDF library and combined exam labels
   ========================================================= */
.exam-paper-type-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
.exam-paper-type-card{
  min-height:360px;
  padding:1.05rem;
}
.exam-paper-type-card.is-future{
  opacity:1;
}
.exam-paper-type-copy h2{
  overflow-wrap:anywhere;
}
.paper-document-library-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:1.25rem;
  padding:1.2rem 1.3rem;
  border:1px solid var(--border);
  border-radius:22px;
  background:var(--card);
  box-shadow:var(--shadow);
}
.paper-document-library-head h2{
  margin:.25rem 0 .4rem;
  font-size:clamp(1.35rem,2.6vw,2rem);
}
.paper-document-library-head p{
  max-width:780px;
  margin:0;
  color:var(--muted);
  line-height:1.65;
}
.paper-document-usage{
  flex:0 0 auto;
  min-width:210px;
  display:grid;
  gap:.2rem;
  padding:.85rem 1rem;
  border:1px solid var(--border);
  border-radius:16px;
  background:var(--surface);
  text-align:center;
}
.paper-document-usage span,
.paper-document-usage small{
  color:var(--muted);
  font-size:.75rem;
  font-weight:800;
  line-height:1.4;
}
.paper-document-usage strong{
  font-size:1.35rem;
}
.paper-document-grid{
  align-items:stretch;
}
.paper-document-card{
  position:relative;
}
.paper-document-card .resource-pdf-image{
  position:relative;
}
.paper-document-page-badge{
  position:absolute;
  z-index:4;
  right:.5rem;
  bottom:.5rem;
  padding:.3rem .48rem;
  border-radius:999px;
  background:rgba(1,42,74,.9);
  color:#fff;
  font-size:.66rem;
  font-weight:900;
  box-shadow:0 5px 14px rgba(1,42,74,.22);
}
.paper-document-meta{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.35rem;
  flex-wrap:wrap;
  color:var(--muted);
  font-size:.68rem;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.035em;
}
.paper-document-meta span{
  padding:.25rem .42rem;
  border:1px solid var(--border);
  border-radius:999px;
  background:var(--surface);
}
.paper-document-card h2{
  -webkit-line-clamp:3;
  min-height:4.2em;
}
.paper-document-description{
  display:-webkit-box;
  min-height:4.55em;
  margin:0;
  overflow:hidden;
  color:var(--muted);
  font-size:.76rem;
  line-height:1.52;
  text-align:center;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
}
.paper-document-empty-state{
  margin-top:0;
}
.header-nav-family-link strong,
.header-nav-nested-menu a span,
.mobile-nav-family-link strong,
.mobile-nav-nested-submenu strong{
  overflow-wrap:anywhere;
}
@media(max-width:1200px){
  .exam-paper-type-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
  .paper-document-library-head{align-items:flex-start;flex-direction:column}
  .paper-document-usage{width:100%}
}
@media(max-width:680px){
  .exam-paper-type-grid{grid-template-columns:1fr}
  .exam-paper-type-card{min-height:auto}
  .paper-document-library-head{padding:1rem;border-radius:20px}
}

/* v3.19.71 — Footer WhatsApp contact */
.footer-social.whatsapp{color:#fff!important}
.footer-social.whatsapp svg{width:18px;height:18px;flex:0 0 18px;margin-right:7px;color:#25D366}
.footer-social.whatsapp span{line-height:1}


/* ===== v3.19.73 — Dashboard exam categories aligned with current Papers navigation ===== */
.dashboard-exam-family-stack{display:grid;gap:1rem}
.dashboard-exam-family{padding:1rem;border:1px solid var(--line);border-radius:24px;background:color-mix(in srgb,var(--card) 96%,var(--surface-2) 4%);box-shadow:var(--shadow)}
.dashboard-exam-family-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:.85rem;padding:0 .1rem}
.dashboard-exam-family-head h3{margin:.1rem 0 0;font-size:1.2rem}.dashboard-exam-family-head p{margin:.2rem 0 0;color:var(--muted)}
.dashboard-exam-family-head>a{font-weight:800;white-space:nowrap}
.dashboard-exam-family .dashboard-category-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}
.dashboard-exam-family .dashboard-category-card{height:100%}
@media(max-width:1100px){.dashboard-exam-family .dashboard-category-list{grid-template-columns:1fr}}
@media(max-width:640px){.dashboard-exam-family{padding:.8rem;border-radius:20px}.dashboard-exam-family-head{align-items:flex-start;flex-direction:column}.dashboard-exam-family-head>a{width:100%}}

/* ===== v3.19.74 — Auth Experience + Terms + Password Recovery ===== */
.auth-experience{
  --auth-pointer-x:0px;
  --auth-pointer-y:0px;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  width:100%;
  margin:clamp(.5rem,2vw,1.5rem) auto 2rem;
  padding:clamp(18px,3.6vw,42px);
  border:1px solid rgba(148,163,184,.2);
  border-radius:32px;
  background:linear-gradient(135deg,#07111f 0%,#0c1e31 48%,#10263d 100%);
  box-shadow:0 30px 80px rgba(2,6,23,.22);
}
.auth-live-bg{position:absolute;inset:0;z-index:-2;overflow:hidden;pointer-events:none;background:radial-gradient(circle at 18% 18%,rgba(214,169,30,.13),transparent 34%),radial-gradient(circle at 82% 74%,rgba(44,125,160,.22),transparent 38%)}
.auth-live-bg::before{content:"";position:absolute;inset:-40%;background-image:linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);background-size:42px 42px;transform:rotate(-8deg);animation:authGridDrift 28s linear infinite}
.auth-live-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 20%,rgba(255,255,255,.04) 44%,transparent 66%);transform:translateX(-120%);animation:authLightSweep 12s ease-in-out infinite}
.auth-aurora{position:absolute;width:46vmax;height:46vmax;border-radius:50%;filter:blur(72px);opacity:.2;mix-blend-mode:screen;will-change:transform}
.auth-aurora-one{left:-22vmax;top:-25vmax;background:#e7b82f;animation:authAuroraOne 14s ease-in-out infinite alternate}
.auth-aurora-two{right:-22vmax;bottom:-28vmax;background:#2c7da0;animation:authAuroraTwo 18s ease-in-out infinite alternate}
.auth-kana{position:absolute;color:rgba(255,255,255,.08);font-family:"Noto Sans JP","Yu Gothic",sans-serif;font-weight:800;line-height:1;user-select:none;will-change:transform,opacity}
.auth-kana-one{font-size:clamp(5rem,11vw,10rem);left:5%;top:12%;animation:authFloatKana 11s ease-in-out infinite}
.auth-kana-two{font-size:clamp(3.2rem,7vw,6.8rem);left:38%;top:5%;animation:authFloatKana 14s ease-in-out -3s infinite}
.auth-kana-three{font-size:clamp(4rem,8vw,8rem);right:9%;top:16%;animation:authFloatKana 12s ease-in-out -6s infinite}
.auth-kana-four{font-size:clamp(3.5rem,8vw,7rem);left:15%;bottom:7%;animation:authFloatKana 13s ease-in-out -4s infinite}
.auth-kana-five{font-size:clamp(4rem,9vw,8rem);right:15%;bottom:4%;animation:authFloatKana 15s ease-in-out -7s infinite}
.auth-spark{position:absolute;width:6px;height:6px;border-radius:999px;background:#f5d76e;box-shadow:0 0 20px rgba(245,215,110,.9);opacity:.7;animation:authSpark 7s ease-in-out infinite}
.auth-spark-one{left:24%;top:22%}.auth-spark-two{right:22%;top:35%;animation-delay:-2s}.auth-spark-three{left:42%;bottom:17%;animation-delay:-4s}.auth-spark-four{right:7%;bottom:20%;animation-delay:-5s}
.auth-experience-grid{position:relative;display:grid;grid-template-columns:minmax(260px,.88fr) minmax(0,1.12fr);gap:clamp(20px,4vw,54px);align-items:center;max-width:1080px;margin:0 auto;min-height:600px}
.auth-brand-panel{color:#e5edf7;padding:clamp(10px,2vw,24px);transform:translate(var(--auth-pointer-x),var(--auth-pointer-y));transition:transform .28s ease-out}
.auth-brand-kicker{display:inline-flex;padding:.38rem .65rem;border:1px solid rgba(231,184,47,.36);border-radius:999px;background:rgba(231,184,47,.09);color:#f2d26b;font-size:.72rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase}
.auth-brand-panel h1{max-width:560px;margin:1rem 0 .85rem;color:#fff;font-size:clamp(2.35rem,5vw,4.8rem);line-height:.98;letter-spacing:-.045em}
.auth-brand-panel>p{max-width:520px;margin:0;color:#b8c6d8;font-size:clamp(.96rem,1.4vw,1.08rem);line-height:1.75}
.auth-brand-points{display:grid;gap:.65rem;margin:1.5rem 0 0}
.auth-brand-points span{display:flex;align-items:center;gap:.7rem;color:#d8e3ee;font-size:.88rem}
.auth-brand-points b{display:grid;place-items:center;min-width:38px;height:38px;padding:0 .45rem;border:1px solid rgba(231,184,47,.3);border-radius:12px;background:rgba(231,184,47,.09);color:#f5d76e;font-size:.78rem}
.auth-brand-security{display:flex;gap:.75rem;align-items:flex-start;margin-top:1.5rem;padding:1rem;border:1px solid rgba(148,163,184,.18);border-radius:18px;background:rgba(15,23,42,.38);backdrop-filter:blur(12px)}
.auth-brand-security>span{color:#f2c84b;font-size:1.2rem}.auth-brand-security strong,.auth-brand-security small{display:block}.auth-brand-security strong{color:#fff;font-size:.88rem}.auth-brand-security small{margin-top:.22rem;color:#94a7bc;font-size:.75rem;line-height:1.5}
.auth-experience .auth-card,.auth-experience .auth-card.narrow{width:100%;max-width:none;margin:0;padding:clamp(24px,3.2vw,38px);border:1px solid rgba(255,255,255,.72);border-radius:26px;background:rgba(255,255,255,.94);box-shadow:0 24px 70px rgba(2,6,23,.25);backdrop-filter:blur(20px);transform:translate(calc(var(--auth-pointer-x) * -.22),calc(var(--auth-pointer-y) * -.22));transition:transform .28s ease-out,box-shadow .2s ease}
html[data-theme="dark"] .auth-experience .auth-card{background:rgba(10,20,34,.94);border-color:rgba(148,163,184,.22)}
.auth-card-heading{display:flex;align-items:flex-start;gap:1rem;margin-bottom:1.35rem}.auth-card-heading h2{margin:.1rem 0 .3rem;font-size:clamp(1.7rem,3vw,2.35rem);line-height:1.08}.auth-card-heading p{margin:0;color:var(--muted);font-size:.88rem}.auth-card-icon{display:grid;place-items:center;flex:0 0 52px;width:52px;height:52px;border-radius:17px;background:linear-gradient(145deg,#f6dc7d,#d6a91e);color:#172033;font-size:1.45rem;font-weight:900;box-shadow:0 10px 26px rgba(214,169,30,.25)}
.auth-form-modern{gap:1rem!important}.auth-form-modern label:not(.auth-terms-check){gap:.42rem!important}.auth-field-label{font-size:.78rem;font-weight:850;color:var(--text);letter-spacing:.01em}.auth-label-row{display:flex;align-items:center;justify-content:space-between;gap:1rem}.auth-label-row>a{font-size:.74rem;font-weight:800;color:#2c7da0}.auth-form-modern input:not([type="checkbox"]){min-height:50px;border-radius:14px!important;padding:.78rem .9rem!important;background:var(--surface)!important;border:1px solid var(--border)!important;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}.auth-form-modern input:not([type="checkbox"]):focus{border-color:#2c7da0!important;box-shadow:0 0 0 4px rgba(44,125,160,.12)!important;transform:translateY(-1px)}
.auth-two-column-fields{display:grid;grid-template-columns:1fr 1fr;gap:.85rem}.auth-two-column-fields>label{min-width:0}.auth-register-card .auth-two-column-fields small{font-size:.66rem;line-height:1.35;color:var(--muted)}
.auth-primary-action{min-height:50px;border-radius:14px!important;font-weight:900!important;letter-spacing:.01em;box-shadow:0 12px 26px rgba(44,125,160,.17)}
.auth-terms-check{display:grid!important;grid-template-columns:20px 1fr;gap:.65rem!important;align-items:flex-start;margin:.05rem 0;padding:.78rem .82rem;border:1px solid var(--border);border-radius:14px;background:var(--surface-2)}
.auth-terms-check input{width:18px;height:18px;margin:.08rem 0 0;accent-color:#2c7da0}.auth-terms-check span{font-size:.76rem;line-height:1.55;color:var(--muted)}.auth-terms-check a{font-weight:850;color:#2c7da0}.auth-terms-check:has(input:checked){border-color:rgba(44,125,160,.42);background:rgba(44,125,160,.07)}
.auth-password-strength{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-top:-.35rem}.auth-password-strength>span{height:4px;border-radius:999px;background:var(--border);transition:background .2s ease,transform .2s ease}.auth-password-strength>small{grid-column:1/-1;color:var(--muted);font-size:.69rem;margin-top:.12rem}.auth-password-strength[data-score="1"]>span.active{background:#ef4444}.auth-password-strength[data-score="2"]>span.active{background:#f59e0b}.auth-password-strength[data-score="3"]>span.active{background:#2c7da0}.auth-password-strength[data-score="4"]>span.active{background:#16a34a}.auth-password-strength>span.active{transform:scaleY(1.3)}
.google-signin-shell.terms-locked{position:relative;filter:saturate(.45);opacity:.7}.google-signin-shell.terms-locked .google-signin-slot{pointer-events:none!important}.google-terms-lock-note{position:absolute;inset:auto 8px 5px;z-index:4;padding:.25rem .45rem;border-radius:8px;background:rgba(15,23,42,.88);color:#fff;font-size:.62rem;text-align:center;pointer-events:none}.google-signin-shell:not(.terms-locked) .google-terms-lock-note{display:none}
.auth-security-note{display:flex;gap:.5rem;align-items:flex-start;margin:1rem 0 0;padding:.7rem .8rem;border-radius:12px;background:rgba(44,125,160,.07);color:var(--muted);font-size:.72rem;line-height:1.5}.auth-security-note>span{color:#2c7da0;font-weight:900}.auth-reset-generic{line-height:1.65}.auth-recovery-actions{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;margin-top:1rem}.auth-expired-reset{text-align:center;padding:1rem 0 .25rem}.auth-expired-icon{display:grid;place-items:center;width:56px;height:56px;margin:0 auto .8rem;border-radius:50%;background:rgba(239,68,68,.1);color:#dc2626;font-weight:900;font-size:1.4rem}.auth-expired-reset h3{margin:.2rem 0 .35rem}.auth-expired-reset p{margin:0 0 1rem;color:var(--muted);font-size:.85rem}.auth-recovery-grid{min-height:520px}
@keyframes authGridDrift{to{transform:rotate(-8deg) translate3d(42px,42px,0)}}
@keyframes authLightSweep{0%,55%{transform:translateX(-120%)}75%,100%{transform:translateX(120%)}}
@keyframes authAuroraOne{from{transform:translate3d(-2%,0,0) scale(.92)}to{transform:translate3d(18%,12%,0) scale(1.12)}}
@keyframes authAuroraTwo{from{transform:translate3d(0,0,0) scale(.95)}to{transform:translate3d(-16%,-12%,0) scale(1.15)}}
@keyframes authFloatKana{0%,100%{transform:translate3d(0,0,0) rotate(-3deg);opacity:.055}50%{transform:translate3d(0,-18px,0) rotate(3deg);opacity:.11}}
@keyframes authSpark{0%,100%{transform:translateY(0) scale(.7);opacity:.25}50%{transform:translateY(-24px) scale(1.15);opacity:.9}}
@media(max-width:900px){.auth-experience{padding:22px;border-radius:26px}.auth-experience-grid{grid-template-columns:1fr;min-height:0}.auth-brand-panel{padding:10px 6px}.auth-brand-panel h1{font-size:clamp(2.1rem,8vw,3.4rem)}.auth-brand-points{grid-template-columns:repeat(3,1fr)}.auth-brand-points span{display:grid;justify-items:start}.auth-brand-security{display:none}.auth-experience .auth-card{transform:none}.auth-kana-one,.auth-kana-three{opacity:.5}}
@media(max-width:640px){.auth-experience{margin:.35rem auto 1.2rem;padding:14px;border-radius:22px}.auth-brand-panel{padding:14px 8px 6px}.auth-brand-panel>p{font-size:.88rem}.auth-brand-points{grid-template-columns:1fr;gap:.45rem;margin-top:1rem}.auth-brand-points span{display:flex}.auth-brand-points b{min-width:34px;height:34px}.auth-experience .auth-card{padding:22px 18px;border-radius:20px}.auth-card-heading{gap:.7rem}.auth-card-icon{width:44px;height:44px;flex-basis:44px;border-radius:14px}.auth-two-column-fields{grid-template-columns:1fr}.auth-recovery-actions{grid-template-columns:1fr}.auth-kana{opacity:.5}}
@media(prefers-reduced-motion:reduce){.auth-live-bg::before,.auth-live-bg::after,.auth-aurora,.auth-kana,.auth-spark{animation:none!important}.auth-brand-panel,.auth-experience .auth-card{transform:none!important;transition:none!important}}


/* ========================================================================== */
/* Version 3.19.75 · Compact Auth UI polish from production screenshots        */
/* ========================================================================== */
.auth-page-main{
  width:min(1280px,calc(100% - 28px))!important;
  margin:10px auto 48px!important;
}
.auth-page-main .auth-experience{
  margin:0 auto 1.2rem!important;
  padding:clamp(16px,2.5vw,28px)!important;
  border-radius:28px!important;
}
.auth-page-main .auth-experience-grid{
  grid-template-columns:minmax(270px,.82fr) minmax(400px,1.18fr)!important;
  gap:clamp(24px,3vw,42px)!important;
  max-width:1080px!important;
  min-height:0!important;
}
.auth-page-main .auth-brand-panel{
  padding:clamp(8px,1.5vw,18px)!important;
}
.auth-page-main .auth-brand-panel h1{
  max-width:450px!important;
  margin:.78rem 0 .62rem!important;
  font-size:clamp(2rem,3.35vw,3.35rem)!important;
  line-height:1.02!important;
  letter-spacing:-.035em!important;
}
.auth-page-main .auth-brand-panel>p{
  max-width:460px!important;
  font-size:.92rem!important;
  line-height:1.62!important;
}
.auth-page-main .auth-brand-kicker{
  padding:.3rem .58rem!important;
  font-size:.66rem!important;
  letter-spacing:.11em!important;
}
.auth-page-main .auth-brand-points{
  gap:.48rem!important;
  margin:1.05rem 0 0!important;
}
.auth-page-main .auth-brand-points span{
  gap:.62rem!important;
  font-size:.82rem!important;
}
.auth-page-main .auth-brand-points b{
  min-width:34px!important;
  height:34px!important;
  border-radius:10px!important;
  font-size:.72rem!important;
}
.auth-page-main .auth-brand-security{display:none!important}

.auth-page-main .auth-experience .auth-card,
.auth-page-main .auth-experience .auth-card.narrow,
html[data-theme="palette"] .auth-page-main .auth-card{
  width:min(100%,450px)!important;
  max-width:450px!important;
  padding:23px 25px 21px!important;
  border-radius:22px!important;
}
.auth-page-main .auth-register-card{
  padding-top:22px!important;
  padding-bottom:20px!important;
}
.auth-page-main .auth-card-heading{
  align-items:center!important;
  gap:.72rem!important;
  margin-bottom:.88rem!important;
}
.auth-page-main .auth-card-icon{
  flex-basis:42px!important;
  width:42px!important;
  height:42px!important;
  border-radius:13px!important;
  font-size:1.12rem!important;
  box-shadow:0 7px 18px rgba(214,169,30,.2)!important;
}
.auth-page-main .auth-card-heading .eyebrow{
  margin-bottom:1px!important;
  font-size:.66rem!important;
  letter-spacing:.12em!important;
}
.auth-page-main .auth-card-heading h2{
  margin:.04rem 0 .16rem!important;
  font-size:clamp(1.48rem,2.2vw,1.75rem)!important;
  line-height:1.05!important;
}
.auth-page-main .auth-card-heading p{
  font-size:.77rem!important;
  line-height:1.42!important;
}
.auth-page-main .auth-form-modern{
  gap:.78rem!important;
}
.auth-page-main .auth-form-modern label:not(.auth-terms-check){
  gap:.32rem!important;
}
.auth-page-main .auth-field-label{
  font-size:.72rem!important;
}
.auth-page-main .auth-label-row>a{
  font-size:.7rem!important;
}
.auth-page-main .auth-form-modern input:not([type="checkbox"]){
  min-height:45px!important;
  padding:.66rem .8rem!important;
  border-radius:12px!important;
  font-size:.9rem!important;
}
.auth-page-main .auth-two-column-fields{
  gap:.7rem!important;
}
.auth-page-main .auth-register-card .auth-two-column-fields small{
  font-size:.62rem!important;
  line-height:1.28!important;
}
.auth-page-main .auth-password-strength{
  margin-top:-.28rem!important;
}
.auth-page-main .auth-password-strength>small{
  font-size:.64rem!important;
}
.auth-page-main .auth-primary-action{
  min-height:45px!important;
  border-radius:12px!important;
  font-size:.82rem!important;
}

.auth-page-main .auth-terms-check{
  grid-template-columns:17px 1fr!important;
  gap:.52rem!important;
  align-items:center!important;
  margin:0!important;
  padding:.52rem .62rem!important;
  border-radius:11px!important;
  background:color-mix(in srgb,var(--surface-2) 76%,transparent)!important;
}
.auth-page-main .auth-terms-check input{
  width:16px!important;
  height:16px!important;
  margin:0!important;
}
.auth-page-main .auth-terms-check span{
  font-size:.69rem!important;
  line-height:1.35!important;
}

.auth-page-main .auth-card .social-auth-block{
  margin-top:13px!important;
}
.auth-page-main .auth-card .social-login-divider{
  margin:0 0 9px!important;
  font-size:.66rem!important;
}
.auth-page-main .auth-card .google-signin-shell{
  width:100%!important;
  height:auto!important;
  min-height:44px!important;
  max-height:none!important;
  display:grid!important;
  gap:5px!important;
  overflow:visible!important;
  opacity:1!important;
  filter:none!important;
  transform:none!important;
}
.auth-page-main .auth-card .google-signin-slot{
  width:100%!important;
  max-width:400px!important;
  height:44px!important;
  min-height:44px!important;
  max-height:44px!important;
  margin:0 auto!important;
  overflow:hidden!important;
  border-radius:999px!important;
  opacity:1;
  transition:opacity .18s ease,filter .18s ease!important;
}
.auth-page-main .google-signin-shell.terms-locked .google-signin-slot{
  opacity:.56!important;
  filter:saturate(.72)!important;
}
.auth-page-main .google-terms-lock-note{
  position:static!important;
  inset:auto!important;
  display:block;
  margin:0!important;
  padding:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:var(--muted)!important;
  font-size:.64rem!important;
  line-height:1.35!important;
  text-align:center!important;
}
.auth-page-main .google-signin-shell:not(.terms-locked) .google-terms-lock-note{
  display:none!important;
}
.auth-page-main .auth-switch-link{
  margin:.72rem 0 0!important;
  font-size:.78rem!important;
}
.auth-page-main .social-auth-status:not(:empty){
  margin-top:7px!important;
  font-size:.75rem!important;
}

@media(max-width:900px){
  .auth-page-main{width:min(760px,calc(100% - 20px))!important;margin-top:8px!important}
  .auth-page-main .auth-experience{padding:18px!important}
  .auth-page-main .auth-experience-grid{grid-template-columns:1fr!important;gap:14px!important}
  .auth-page-main .auth-brand-panel{padding:8px 6px 2px!important}
  .auth-page-main .auth-brand-panel h1{font-size:clamp(1.85rem,6.5vw,2.7rem)!important;max-width:560px!important}
  .auth-page-main .auth-brand-panel>p{max-width:640px!important}
  .auth-page-main .auth-brand-points{grid-template-columns:repeat(3,1fr)!important;margin-top:.8rem!important}
  .auth-page-main .auth-experience .auth-card{transform:none!important;margin:0 auto!important}
}
@media(max-width:640px){
  .auth-page-main{width:calc(100% - 12px)!important;margin:6px auto 30px!important}
  .auth-page-main .auth-experience{padding:11px!important;border-radius:20px!important}
  .auth-page-main .auth-brand-panel{padding:10px 8px 4px!important}
  .auth-page-main .auth-brand-panel h1{margin:.55rem 0 .45rem!important;font-size:clamp(1.7rem,8.8vw,2.35rem)!important}
  .auth-page-main .auth-brand-panel>p{font-size:.82rem!important;line-height:1.52!important}
  .auth-page-main .auth-brand-points{grid-template-columns:1fr!important;gap:.35rem!important;margin-top:.65rem!important}
  .auth-page-main .auth-brand-points span{display:flex!important;font-size:.78rem!important}
  .auth-page-main .auth-brand-points b{min-width:30px!important;height:30px!important}
  .auth-page-main .auth-experience .auth-card,
  html[data-theme="palette"] .auth-page-main .auth-card{padding:19px 16px 17px!important;border-radius:18px!important}
  .auth-page-main .auth-card-heading{gap:.6rem!important;margin-bottom:.72rem!important}
  .auth-page-main .auth-card-icon{width:38px!important;height:38px!important;flex-basis:38px!important;border-radius:12px!important}
  .auth-page-main .auth-card-heading h2{font-size:1.42rem!important}
  .auth-page-main .auth-form-modern{gap:.68rem!important}
  .auth-page-main .auth-two-column-fields{grid-template-columns:1fr!important}
}


/* ===== v3.19.76 — Auth fine tune from production screenshot ===== */
.auth-page-main .auth-brand-panel h1{
  max-width:390px!important;
  margin:.64rem 0 .46rem!important;
  font-size:clamp(1.78rem,2.7vw,2.72rem)!important;
  line-height:1.06!important;
  letter-spacing:-.03em!important;
}
.auth-page-main .auth-brand-panel>p{
  max-width:425px!important;
  font-size:.84rem!important;
  line-height:1.52!important;
}
.auth-page-main .auth-brand-points{
  margin-top:.78rem!important;
  gap:.4rem!important;
}
.auth-page-main .auth-brand-points span{
  font-size:.78rem!important;
}

.auth-page-main .auth-terms-check{
  grid-template-columns:14px minmax(0,1fr)!important;
  gap:.4rem!important;
  min-height:0!important;
  padding:.34rem .52rem!important;
  border-radius:10px!important;
  align-items:center!important;
}
.auth-page-main .auth-terms-check input{
  width:14px!important;
  height:14px!important;
  min-width:14px!important;
  min-height:14px!important;
  margin:0!important;
}
.auth-page-main .auth-terms-check span{
  margin:0!important;
  padding:0!important;
  font-size:.66rem!important;
  line-height:1.2!important;
}
.auth-page-main .auth-terms-check a{
  line-height:inherit!important;
}

@media(max-width:900px){
  .auth-page-main .auth-brand-panel h1{
    max-width:520px!important;
    font-size:clamp(1.7rem,5.6vw,2.35rem)!important;
  }
}
@media(max-width:640px){
  .auth-page-main .auth-brand-panel h1{
    font-size:clamp(1.55rem,7.7vw,2.05rem)!important;
  }
  .auth-page-main .auth-brand-panel>p{
    font-size:.79rem!important;
  }
  .auth-page-main .auth-terms-check{
    grid-template-columns:15px minmax(0,1fr)!important;
    padding:.42rem .52rem!important;
  }
  .auth-page-main .auth-terms-check input{
    width:15px!important;
    height:15px!important;
    min-width:15px!important;
    min-height:15px!important;
  }
  .auth-page-main .auth-terms-check span{
    font-size:.67rem!important;
    line-height:1.28!important;
  }
}


/* ===== v3.19.77 — Auth headline visibility correction ===== */
/* Restore a strong headline size and fix the actual issue: contrast/readability. */
.auth-page-main .auth-brand-panel h1{
  max-width:560px!important;
  margin:.68rem 0 .55rem!important;
  font-size:clamp(2.55rem,4.4vw,4.45rem)!important;
  line-height:1.02!important;
  letter-spacing:-.045em!important;
  color:#f8fbff!important;
  -webkit-text-fill-color:#f8fbff!important;
  text-shadow:
    0 2px 2px rgba(0,0,0,.28),
    0 10px 30px rgba(0,0,0,.34),
    0 0 22px rgba(255,255,255,.08)!important;
  opacity:1!important;
}

.auth-page-main .auth-brand-panel>p{
  max-width:500px!important;
  color:rgba(239,246,255,.84)!important;
  font-size:.94rem!important;
  line-height:1.6!important;
  text-shadow:0 2px 12px rgba(0,0,0,.28)!important;
}

.auth-page-main .auth-brand-panel .eyebrow,
.auth-page-main .auth-brand-panel .auth-brand-eyebrow{
  color:#ffe082!important;
}

.auth-page-main .auth-brand-points span{
  color:rgba(245,249,255,.92)!important;
}

.auth-page-main .auth-brand-panel{
  position:relative!important;
  isolation:isolate!important;
}

.auth-page-main .auth-brand-panel::after{
  content:""!important;
  position:absolute!important;
  inset:10% 36% 12% -4%!important;
  z-index:-1!important;
  border-radius:34px!important;
  background:radial-gradient(circle at 34% 44%,rgba(0,0,0,.28),rgba(0,0,0,.12) 52%,transparent 78%)!important;
  pointer-events:none!important;
}

/* Keep the compact consent row from v3.19.76. */
.auth-page-main .auth-terms-check{
  grid-template-columns:14px minmax(0,1fr)!important;
  gap:.4rem!important;
  min-height:0!important;
  padding:.34rem .52rem!important;
  border-radius:10px!important;
  align-items:center!important;
}
.auth-page-main .auth-terms-check input{
  width:14px!important;
  height:14px!important;
  min-width:14px!important;
  min-height:14px!important;
  margin:0!important;
}
.auth-page-main .auth-terms-check span{
  margin:0!important;
  padding:0!important;
  font-size:.66rem!important;
  line-height:1.2!important;
}

@media(max-width:900px){
  .auth-page-main .auth-brand-panel h1{
    max-width:620px!important;
    font-size:clamp(2.35rem,7vw,3.65rem)!important;
  }
  .auth-page-main .auth-brand-panel::after{
    inset:6% 12% 10% -3%!important;
  }
}
@media(max-width:640px){
  .auth-page-main .auth-brand-panel h1{
    font-size:clamp(2.05rem,10vw,3rem)!important;
    line-height:1.03!important;
  }
  .auth-page-main .auth-brand-panel>p{
    font-size:.86rem!important;
  }
}


/* ===== v3.19.78 — Recovery auth pages inherit full auth layout ===== */
/* Forgot/Reset now use auth-page-main, so keep them visually consistent with Login/Register. */
.auth-page-main .auth-recovery-experience{
  margin-top:0!important;
  margin-bottom:1.2rem!important;
}
.auth-page-main .auth-recovery-grid{
  min-height:500px!important;
  grid-template-columns:minmax(0,1.08fr) minmax(360px,.72fr)!important;
  gap:clamp(24px,4vw,58px)!important;
  align-items:center!important;
}
.auth-page-main .auth-recovery-grid .auth-brand-panel{
  padding:clamp(18px,3vw,38px)!important;
}
.auth-page-main .auth-recovery-grid .auth-brand-panel h1{
  max-width:590px!important;
  color:#f8fbff!important;
  -webkit-text-fill-color:#f8fbff!important;
  font-size:clamp(2.75rem,4.6vw,4.65rem)!important;
  line-height:1.01!important;
  text-shadow:
    0 2px 2px rgba(0,0,0,.32),
    0 12px 34px rgba(0,0,0,.38),
    0 0 24px rgba(255,255,255,.08)!important;
}
.auth-page-main .auth-recovery-grid .auth-brand-panel>p{
  max-width:500px!important;
  color:rgba(239,246,255,.88)!important;
  font-size:.94rem!important;
  line-height:1.62!important;
}
.auth-page-main .auth-recovery-grid .auth-brand-points span{
  color:rgba(248,250,252,.94)!important;
}

.auth-page-main .auth-recovery-grid .auth-card{
  max-width:430px!important;
  justify-self:center!important;
  padding:22px 26px 24px!important;
}
.auth-page-main .auth-recovery-grid .auth-card-heading{
  gap:.68rem!important;
  margin-bottom:.82rem!important;
  align-items:center!important;
}
.auth-page-main .auth-recovery-grid .auth-card-icon{
  width:42px!important;
  height:42px!important;
  flex-basis:42px!important;
  border-radius:13px!important;
  font-size:1.12rem!important;
}
.auth-page-main .auth-recovery-grid .auth-card-heading .eyebrow{
  font-size:.64rem!important;
  letter-spacing:.12em!important;
  margin-bottom:1px!important;
}
.auth-page-main .auth-recovery-grid .auth-card-heading h2{
  margin:.02rem 0 .14rem!important;
  font-size:clamp(1.5rem,2.25vw,1.82rem)!important;
  line-height:1.04!important;
}
.auth-page-main .auth-recovery-grid .auth-card-heading p{
  margin:0!important;
  font-size:.76rem!important;
  line-height:1.4!important;
}
.auth-page-main .auth-recovery-grid .auth-form-modern{
  gap:.72rem!important;
}
.auth-page-main .auth-recovery-grid .auth-form-modern input:not([type="checkbox"]){
  min-height:46px!important;
}
.auth-page-main .auth-recovery-grid .auth-primary-action{
  min-height:44px!important;
}
.auth-page-main .auth-recovery-grid .auth-security-note{
  margin:.72rem 0 0!important;
  padding:.58rem .68rem!important;
  font-size:.68rem!important;
  line-height:1.42!important;
}
.auth-page-main .auth-recovery-grid .auth-switch-link{
  margin:.78rem 0 0!important;
  font-size:.8rem!important;
}

@media(max-width:900px){
  .auth-page-main .auth-recovery-grid{
    grid-template-columns:1fr!important;
    gap:14px!important;
    min-height:0!important;
  }
  .auth-page-main .auth-recovery-grid .auth-brand-panel{
    padding:8px 6px 2px!important;
  }
  .auth-page-main .auth-recovery-grid .auth-brand-panel h1{
    max-width:620px!important;
    font-size:clamp(2.35rem,7vw,3.65rem)!important;
  }
  .auth-page-main .auth-recovery-grid .auth-card{
    width:min(100%,500px)!important;
    max-width:500px!important;
  }
}
@media(max-width:640px){
  .auth-page-main .auth-recovery-grid .auth-brand-panel{
    padding:10px 8px 4px!important;
  }
  .auth-page-main .auth-recovery-grid .auth-brand-panel h1{
    font-size:clamp(2.05rem,10vw,3rem)!important;
    line-height:1.03!important;
  }
  .auth-page-main .auth-recovery-grid .auth-brand-panel>p{
    font-size:.86rem!important;
  }
  .auth-page-main .auth-recovery-grid .auth-card{
    width:100%!important;
    padding:19px 16px 18px!important;
    border-radius:18px!important;
  }
  .auth-page-main .auth-recovery-grid .auth-card-heading{
    gap:.58rem!important;
    margin-bottom:.7rem!important;
  }
  .auth-page-main .auth-recovery-grid .auth-card-heading h2{
    font-size:1.42rem!important;
  }
}

/* v3.19.84 combined split-publication label */
.resource-combined-pdf-label{display:block;margin:.18rem 0 .62rem;color:#6f7f91;font-size:.72rem;font-weight:800;letter-spacing:.01em}


/* ===== v3.19.91 — website-aligned exam library coverage ===== */
.admin-website-coverage-summary{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:.55rem!important}
.admin-website-coverage-summary span{min-width:0!important}
.admin-website-coverage-table{min-width:1320px}
.admin-coverage-resource-grid{display:grid;grid-template-columns:repeat(2,minmax(88px,1fr));gap:.32rem}
.admin-coverage-resource-grid span{display:flex;gap:.28rem;align-items:center;padding:.3rem .42rem;border:1px solid rgba(148,163,184,.18);border-radius:8px;font-size:.68rem;white-space:nowrap}
.admin-coverage-resource-grid b{font-size:.78rem}
.admin-coverage-manage-links{display:flex;gap:.35rem;flex-wrap:wrap}
.admin-panel-footnote{margin:.8rem 0 0;color:var(--muted);font-size:.72rem;line-height:1.5}
@media(max-width:900px){
  .admin-website-coverage-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  .admin-website-coverage-table{min-width:0}
  .admin-coverage-resource-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}


/* =========================================================
   v3.19.92 — School Exams: third-level Papers navigation
   ========================================================= */
.header-school-level{position:relative;display:block}
.header-school-level>summary,.mobile-school-level>summary{list-style:none;cursor:pointer}
.header-school-level>summary::-webkit-details-marker,.mobile-school-level>summary::-webkit-details-marker{display:none}
.header-school-level>summary::marker,.mobile-school-level>summary::marker{display:none;content:""}
.header-school-level>summary{display:grid;grid-template-columns:minmax(0,1fr) 18px;align-items:center;gap:8px;min-height:52px;margin:0 0 7px;padding:10px 12px;border:1px solid rgba(15,23,42,.07);border-radius:12px;background:#F7F8FA;transition:background .16s ease,border-color .16s ease,transform .16s ease,box-shadow .16s ease}
.header-school-level>summary>a{padding:0!important;background:transparent!important;min-height:0!important;display:block!important}
.header-school-level>summary>a span{display:grid;gap:2px}
.header-school-level>summary>a strong{font-size:.82rem;color:var(--text)}
.header-school-level>summary>a small{font-size:.64rem;color:var(--muted)}
.header-school-level>summary i,.mobile-school-level>summary i{position:relative;width:16px;height:16px;display:block}
.header-school-level>summary i::before,.header-school-level>summary i::after,.mobile-school-level>summary i::before,.mobile-school-level>summary i::after{content:"";position:absolute;left:50%;top:50%;width:7px;height:2px;border-radius:999px;background:var(--muted);transform-origin:right center}
.header-school-level>summary i::before{transform:translate(-58%,-50%) rotate(45deg)}
.header-school-level>summary i::after{transform:translate(-58%,-50%) rotate(-45deg)}
.header-school-level-menu{display:none;gap:5px;padding:8px;border:1px solid var(--minimal-border);border-radius:14px;background:var(--minimal-surface);box-shadow:0 20px 46px rgba(1,42,74,.23)}
.header-school-level[open]>.header-school-level-menu{display:grid}
.header-school-level-menu a{min-height:46px!important}
@media(min-width:821px){
  .header-school-level-menu{position:absolute;z-index:1340;left:calc(100% + 11px);top:-6px;width:250px}
  .header-school-level:hover>.header-school-level-menu{display:grid}
  html[data-theme="palette"] .header-school-level>summary:hover,
  html[data-theme="palette"] .header-school-level>summary:focus-visible,
  html[data-theme="palette"] .header-school-level[open]>summary{
    border-color:rgba(201,162,39,.70)!important;
    background:#FFF7EA!important;
    color:inherit!important;
    transform:translateX(2px)!important;
    box-shadow:none!important;
  }
}
.mobile-school-level{display:block;border-radius:10px}
.mobile-school-level>summary{display:grid;grid-template-columns:minmax(0,1fr) 18px;align-items:center;gap:8px;padding:8px 9px;border-radius:10px;border:1px solid var(--minimal-border);background:var(--surface)}
.mobile-school-level>summary>a{color:var(--text)!important;text-decoration:none!important}
.mobile-school-level>summary>a span{display:grid;gap:2px}.mobile-school-level>summary strong{font-size:.8rem}.mobile-school-level>summary small{font-size:.62rem;color:var(--muted)}
.mobile-school-level>summary i::before{transform:translate(-50%,-50%)}.mobile-school-level>summary i::after{transform:translate(-50%,-50%) rotate(90deg)}.mobile-school-level[open]>summary i::after{opacity:0}
.mobile-school-type-menu{display:none;gap:5px;margin:5px 0 5px 10px;padding:5px 0 0 8px;border-left:2px solid color-mix(in srgb,var(--minimal-primary) 30%,transparent)}
.mobile-school-level[open]>.mobile-school-type-menu{display:grid}.mobile-school-type-menu a{display:grid;gap:2px;padding:8px 9px;border-radius:9px;background:var(--surface);color:var(--text)!important;text-decoration:none!important}.mobile-school-type-menu small{font-size:.61rem;color:var(--muted)}
.school-exams-main{padding-bottom:3rem}.school-exam-level-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.school-paper-empty-state{max-width:760px;margin:1.25rem auto;padding:clamp(28px,5vw,52px);text-align:center}.school-paper-empty-mark{width:72px;height:72px;margin:0 auto 16px;display:grid;place-items:center;border-radius:20px;background:color-mix(in srgb,var(--minimal-primary) 13%,var(--surface-2));border:1px solid color-mix(in srgb,var(--minimal-primary) 28%,var(--minimal-border));font-weight:900;color:var(--minimal-primary)}.school-paper-empty-state h2{margin:.5rem 0}.school-paper-empty-state p{max-width:610px;margin:0 auto 1.1rem;color:var(--muted);line-height:1.65}.school-paper-document-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.school-paper-document-card{padding:1.2rem}.school-paper-meta{display:flex;gap:.5rem;flex-wrap:wrap;margin:.7rem 0}.school-paper-meta span{padding:.3rem .55rem;border-radius:999px;background:var(--surface-2);font-size:.72rem}
@media(max-width:820px){.school-exam-level-grid,.school-paper-document-grid{grid-template-columns:1fr}}


/* v3.19.93 — School Exam level hover matches JLPT N-level rows exactly */
html[data-theme="palette"] .header-school-level>summary>a:hover,
html[data-theme="palette"] .header-school-level>summary>a:focus-visible{
  background:transparent!important;
  border-color:transparent!important;
  color:inherit!important;
  transform:none!important;
  box-shadow:none!important;
  outline:none!important;
}
html[data-theme="dark"] .header-school-level>summary{
  background:color-mix(in srgb,var(--surface-2) 90%,transparent);
  border-color:var(--minimal-border);
}


/* =========================================================
   v3.19.94 — Unified main dropdown item hover
   All first-level dropdown rows now match Interview Preparation.
   ========================================================= */
/* Give direct rows the same border box as nested-summary rows so hover never jumps. */
.header-nav-dropdown-menu.header-info-menu > a{
  border:1px solid transparent!important;
  border-radius:12px!important;
  box-sizing:border-box!important;
  transition:background .16s ease,border-color .16s ease,transform .16s ease,box-shadow .16s ease!important;
}

/* Main first-level rows: direct links + nested group summaries use one interaction language. */
html[data-theme="palette"] .header-nav-dropdown-menu > a:hover,
html[data-theme="palette"] .header-nav-dropdown-menu > a:focus-visible,
html[data-theme="palette"] .header-nav-dropdown-menu > .header-nav-nested > summary:hover,
html[data-theme="palette"] .header-nav-dropdown-menu > .header-nav-nested > summary:focus-visible,
html[data-theme="palette"] .header-nav-dropdown-menu > .header-nav-nested[open] > summary{
  background:#FFF7EA!important;
  border-color:rgba(201,162,39,.70)!important;
  color:inherit!important;
  transform:translateX(2px)!important;
  box-shadow:none!important;
}

/* Prevent old blue hover/focus layers from showing inside the unified row. */
html[data-theme="palette"] .header-nav-dropdown-menu.header-info-menu > a:hover,
html[data-theme="palette"] .header-nav-dropdown-menu.header-info-menu > a:focus-visible{
  outline:none!important;
}

/* Dark/default themes keep the same geometry and one consistent accent treatment. */
html:not([data-theme="palette"]) .header-nav-dropdown-menu.header-info-menu > a:hover,
html:not([data-theme="palette"]) .header-nav-dropdown-menu.header-info-menu > a:focus-visible,
html:not([data-theme="palette"]) .header-nav-dropdown-menu.header-info-menu > .header-nav-nested > summary:hover,
html:not([data-theme="palette"]) .header-nav-dropdown-menu.header-info-menu > .header-nav-nested > summary:focus-visible,
html:not([data-theme="palette"]) .header-nav-dropdown-menu.header-info-menu > .header-nav-nested[open] > summary{
  background:color-mix(in srgb,var(--minimal-primary) 13%,var(--surface-2))!important;
  border-color:color-mix(in srgb,var(--minimal-primary) 45%,var(--minimal-border))!important;
  transform:translateX(2px)!important;
  box-shadow:none!important;
}

/* Mobile dropdown rows use the same single hover/open treatment as their nested groups. */
.mobile-nav-submenu > a{
  border:1px solid transparent!important;
  box-sizing:border-box!important;
}
html[data-theme="palette"] .mobile-nav-submenu > a:hover,
html[data-theme="palette"] .mobile-nav-submenu > a:focus-visible,
html[data-theme="palette"] .mobile-nav-submenu > .mobile-nav-subgroup > summary:hover,
html[data-theme="palette"] .mobile-nav-submenu > .mobile-nav-subgroup > summary:focus-visible,
html[data-theme="palette"] .mobile-nav-submenu > .mobile-nav-subgroup[open] > summary{
  background:#FFF7EA!important;
  border-color:rgba(201,162,39,.70)!important;
  color:inherit!important;
}


/* ===== v3.19.96 — Learn dropdown, Phrasebook & Irodori ===== */
.irodori-level-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
.irodori-stage-shell{max-width:920px;margin:1.25rem auto;padding:clamp(24px,4vw,42px)}
.irodori-stage-shell h2{margin:.45rem 0;font-size:clamp(1.7rem,4vw,2.5rem)}
.irodori-stage-shell>p{color:var(--muted);line-height:1.7;max-width:720px}
.irodori-coming-soon{margin:1.4rem 0;padding:1.25rem;border:1px dashed rgba(214,169,30,.45);border-radius:18px;background:rgba(246,220,125,.08);display:grid;gap:.35rem}
.irodori-coming-soon strong{font-size:1rem}.irodori-coming-soon span,.irodori-coming-soon small{color:var(--muted)}
.irodori-stage-actions{display:flex;gap:.7rem;flex-wrap:wrap}
.phrasebook-hero{align-items:center}.phrasebook-mark{width:min(300px,36vw);aspect-ratio:1;display:grid;place-items:center;border-radius:32px;border:1px solid rgba(214,169,30,.35);background:radial-gradient(circle at 30% 25%,rgba(246,220,125,.22),rgba(7,20,37,.2));font-size:clamp(2.8rem,8vw,6.5rem);font-weight:900;color:#d6a91e}
.phrasebook-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin:1.25rem 0}
.phrasebook-card{padding:1.25rem;min-height:210px;display:flex;flex-direction:column}.phrasebook-card>span{font-size:1.7rem;color:#d6a91e;font-weight:900}.phrasebook-card h2{font-size:1.05rem;margin:.65rem 0 .35rem}.phrasebook-card p{color:var(--muted);line-height:1.55;flex:1}.phrasebook-card small{font-weight:800;color:#b68b13}
@media(max-width:900px){.irodori-level-grid,.phrasebook-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.phrasebook-mark{width:180px}}
@media(max-width:560px){.irodori-level-grid,.phrasebook-grid{grid-template-columns:1fr}.phrasebook-mark{width:140px;margin-inline:auto}}

/* ===== v3.19.101 — Irodori Starter main resources and lessons ===== */
.resource-level-card.is-ready{border-color:rgba(214,169,30,.52);background:linear-gradient(145deg,rgba(255,249,228,.98),rgba(255,255,255,.96));box-shadow:0 16px 36px rgba(15,23,42,.08)}
.resource-level-card.is-ready em{color:#8b6500;font-weight:850}
.irodori-stage-shell.has-starter-content{max-width:1180px}
.irodori-content-section{margin-top:clamp(1.5rem,4vw,2.4rem)}
.irodori-section-heading{display:flex;align-items:end;justify-content:space-between;gap:1rem;margin-bottom:1rem;padding-bottom:.8rem;border-bottom:1px solid rgba(15,23,42,.1)}
.irodori-section-heading h3{margin:.25rem 0 0;font-size:clamp(1.35rem,3vw,1.85rem)}
.irodori-section-count{padding:.45rem .7rem;border:1px solid rgba(214,169,30,.4);border-radius:999px;background:#fff9e8;color:#795900;font-size:.72rem;font-weight:900;white-space:nowrap}
.irodori-main-resource-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:1rem;padding:1.15rem;border:1px solid rgba(214,169,30,.34);border-radius:18px;background:linear-gradient(120deg,#fffdf7,#f8fbfd);box-shadow:0 12px 28px rgba(15,23,42,.06)}
.irodori-resource-mark{width:58px;height:58px;display:grid;place-items:center;border-radius:16px;background:linear-gradient(145deg,#f6d760,#d0a11a);color:#14213a;font-size:1.55rem;font-weight:950;box-shadow:0 10px 24px rgba(208,161,26,.2)}
.irodori-card-kicker{font-size:.67rem;font-weight:950;letter-spacing:.12em;color:#957000}
.irodori-main-resource-card h4,.irodori-lesson-card h4{margin:.2rem 0;font-size:1.05rem}
.irodori-main-resource-card p,.irodori-lesson-card p{margin:.2rem 0;color:var(--muted);font-size:.8rem;line-height:1.5}
.irodori-card-meta{display:flex;align-items:center;gap:.38rem;flex-wrap:wrap;margin-top:.55rem}
.irodori-card-meta span{padding:.28rem .48rem;border-radius:7px;background:rgba(15,89,119,.07);color:#315b70;font-size:.65rem;font-weight:850}
.irodori-lesson-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}
.irodori-lesson-card{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.8rem;padding:1rem;border:1px solid #dbe3e9;border-radius:16px;background:#fff;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}
.irodori-lesson-card:hover{transform:translateY(-1px);border-color:rgba(214,169,30,.65);box-shadow:0 12px 28px rgba(15,23,42,.07)}
.irodori-lesson-number{width:50px;height:54px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:13px;background:#0f5977;color:#fff}
.irodori-lesson-number small{font-size:.5rem;letter-spacing:.09em;opacity:.76}.irodori-lesson-number strong{font-size:1.22rem;line-height:1.05}
.irodori-lesson-copy{min-width:0}.irodori-lesson-copy h4{color:#18384c;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.irodori-lesson-actions{grid-column:1/-1;display:flex;gap:.5rem;padding-top:.65rem;border-top:1px solid #edf1f4}
.irodori-lesson-actions .btn{flex:1;justify-content:center}
@media(max-width:760px){.irodori-lesson-grid{grid-template-columns:1fr}.irodori-main-resource-card{grid-template-columns:auto 1fr}.irodori-main-resource-card>a{grid-column:1/-1;justify-content:center}}
@media(max-width:480px){.irodori-section-heading{align-items:flex-start;flex-direction:column}.irodori-main-resource-card{grid-template-columns:1fr}.irodori-resource-mark{width:50px;height:50px}.irodori-lesson-card{padding:.85rem}.irodori-lesson-actions{flex-direction:column}}

/* ===== v3.19.105 — free Irodori layout + standard PDF cards ===== */
.irodori-main .irodori-free-hero{
  padding:0 0 clamp(.65rem,2vw,1.15rem)!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.irodori-main .irodori-free-hero .resources-hero-count{
  width:auto!important;
  min-width:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.irodori-main .irodori-stage-shell,
.irodori-main .irodori-stage-shell.has-starter-content{
  width:100%;
  max-width:none;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.irodori-main .irodori-stage-shell>p{max-width:780px}
.irodori-main .irodori-content-section{margin-top:clamp(1.7rem,4vw,2.7rem)}
.irodori-main .irodori-pdf-grid{
  display:flex;
  flex-wrap:wrap;
  grid-template-columns:none;
  justify-content:flex-start;
  gap:1.2rem;
}
.irodori-main .irodori-main-pdf-grid{justify-content:flex-start}
.irodori-main .irodori-pdf-card{gap:.7rem}
.irodori-main .irodori-pdf-thumbnail{position:relative}
.irodori-main .irodori-complete-pdf-card .irodori-pdf-thumbnail{
  background:linear-gradient(145deg,rgba(246,215,96,.34),rgba(44,125,160,.12));
}
.irodori-main .irodori-pdf-card h2{margin:0!important;color:var(--text)!important}
.irodori-main .irodori-card-subtitle{
  min-height:2.4em;
  margin:0;
  color:var(--muted);
  font-size:.76rem;
  line-height:1.45;
  text-align:center;
}
.irodori-main .irodori-card-meta{
  justify-content:center;
  min-height:2.2rem;
  margin:0;
}
.irodori-main .irodori-card-actions{
  display:grid;
  gap:.45rem;
  margin-top:auto;
}
.irodori-main .irodori-card-actions .btn{margin-top:0;white-space:normal;line-height:1.2}
.irodori-main .irodori-stage-actions{margin-top:clamp(1.7rem,4vw,2.7rem)}

@media(max-width:900px){
  .irodori-main .irodori-free-hero .resources-hero-count{text-align:left}
}
@media(max-width:480px){
  .irodori-main .irodori-section-heading{gap:.55rem}
  .irodori-main .irodori-card-subtitle{min-height:0}
}

/* ===== v3.19.110 — Resources portal hierarchy and free-flowing pages ===== */
.resources-portal-main{gap:clamp(1.35rem,3vw,2.15rem)}
.resources-free-head{
  display:grid;
  justify-items:start;
  gap:.42rem;
  padding:0 0 clamp(.65rem,2vw,1.15rem);
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.resources-free-head .resources-breadcrumb{margin-bottom:.25rem}
.resources-free-head h1{margin:.08rem 0;font-size:clamp(1.8rem,3.2vw,3rem)}
.resources-free-head p{max-width:780px;margin:0;color:var(--muted);line-height:1.7}
.resources-portal-grid,.resources-category-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
.resource-ssw-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.resources-more-grid{grid-template-columns:repeat(2,minmax(260px,380px));justify-content:start}
.resources-more-grid .resource-group-card>small{color:var(--muted);font-size:.74rem;font-weight:800}
.resource-list-grid{justify-content:flex-start}
.resource-free-meta{display:flex;align-items:center;flex-wrap:wrap;gap:.55rem;margin-top:.48rem}
.resource-free-meta span{padding:.38rem .62rem;border:1px solid var(--border);border-radius:999px;color:var(--muted);font-size:.72rem;font-weight:850}
.resource-portal-empty{display:grid;justify-items:start;gap:.45rem;min-height:180px;padding:clamp(.65rem,2vw,1rem) 0;border:0;background:transparent;box-shadow:none}
.resource-portal-empty>span{color:#9a7200;font-size:.72rem;font-weight:950;letter-spacing:.1em}
.resource-portal-empty h2,.resource-portal-empty p{margin:0}
.resource-portal-empty p{max-width:680px;color:var(--muted);line-height:1.65}
html[data-theme="dark"] .resource-portal-empty>span{color:#f2cd63}

@media(max-width:1100px){
  .resources-portal-grid,.resources-category-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:760px){
  .resources-portal-grid,.resources-category-grid,.resource-ssw-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .resources-more-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:480px){
  .resources-portal-grid,.resources-category-grid,.resource-ssw-grid,.resources-more-grid{grid-template-columns:1fr}
}

/* ===== v3.19.106 — Starter-page cleanup, normal titles and real PDF covers ===== */
.irodori-main .irodori-stage-breadcrumb{margin-bottom:.15rem}
.irodori-main .irodori-pdf-thumbnail{
  aspect-ratio:210/297;
  background:#f4f1e8;
}
.irodori-main .irodori-pdf-thumbnail img{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  object-position:center top;
  background:#fff;
}
.irodori-main .irodori-pdf-card h2{
  min-height:2.8em!important;
  margin:0!important;
  color:var(--text)!important;
  font-size:.98rem!important;
  line-height:1.45!important;
  text-align:center!important;
  display:-webkit-box!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:2!important;
  overflow:hidden!important;
}

/* ===== v3.19.112 — exact Irodori/Resources free-flowing Papers layout ===== */
.papers-portal-main{gap:clamp(1.35rem,3vw,2.15rem)}
.papers-portal-main .resources-free-head{
  width:100%;
  max-width:none;
  margin:0;
  padding:0 0 clamp(.65rem,2vw,1.15rem);
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.papers-portal-main .resources-free-head .papers-breadcrumb,
.papers-portal-main .resources-free-head .dropdown-hub-breadcrumb{margin-bottom:.25rem}
.papers-portal-main .papers-free-count,
.papers-portal-main .papers-free-usage{
  display:block;
  width:auto;
  min-width:0;
  min-height:0;
  margin:.35rem 0 0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  color:var(--muted);
  font-size:.76rem;
  font-weight:750;
  line-height:1.5;
  text-align:left;
}
.papers-portal-main .papers-free-count strong,
.papers-portal-main .papers-free-usage strong{color:var(--text);font-size:.9rem}
.papers-portal-main .papers-library-free-head h2{margin:.08rem 0;font-size:clamp(1.35rem,2.6vw,2rem)}
.papers-portal-main .papers-portal-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.papers-portal-main .papers-ssw-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.papers-portal-main .papers-jlpt-grid{grid-template-columns:repeat(5,minmax(0,1fr))}

@media(max-width:1100px){
  .papers-portal-main .papers-portal-grid,
  .papers-portal-main .papers-jlpt-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:760px){
  .papers-portal-main .papers-portal-grid,
  .papers-portal-main .papers-ssw-grid,
  .papers-portal-main .papers-jlpt-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:480px){
  .papers-portal-main .papers-portal-grid,
  .papers-portal-main .papers-ssw-grid,
  .papers-portal-main .papers-jlpt-grid{grid-template-columns:1fr}
}

/* ===== v3.19.113 — Papers dropdown title/subtitle separation ===== */
.header-nav-hierarchical-menu > a > span,
.header-school-exam-levels > a > span{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:3px;
  min-width:0;
}
.header-nav-hierarchical-menu > a > span > strong,
.header-school-exam-levels > a > span > strong{
  display:block;
  color:var(--text);
  font-size:.86rem;
  font-weight:850;
  line-height:1.2;
}
.header-nav-hierarchical-menu > a > span > small,
.header-school-exam-levels > a > span > small{
  display:block;
  margin:0;
  color:var(--muted);
  font-size:.67rem;
  font-weight:650;
  line-height:1.35;
}
.mobile-nav-family-list > a{
  display:grid!important;
  grid-template-columns:minmax(0,1fr);
  gap:3px!important;
}
.mobile-nav-family-list > a > strong,
.mobile-nav-family-list > a > small{display:block}
/* v3.19.114 — PayHere sandbox secure payments */
.payhere-sandbox-badge{display:inline-flex;align-items:center;gap:.45rem;width:max-content;max-width:100%;margin:.65rem 0 1.15rem;padding:.55rem .8rem;border:1px solid rgba(216,166,25,.55);border-radius:999px;background:rgba(248,202,72,.16);color:#8a6200;font-size:.76rem;font-weight:850;letter-spacing:.035em;text-transform:uppercase}
[data-theme="dark"] .payhere-sandbox-badge{color:#ffe18a;background:rgba(248,202,72,.12)}
.elite-plan-payment-actions{display:grid;gap:.65rem;margin-top:auto}.elite-plan-payment-actions form{margin:0}.elite-plan-payment-actions .btn{margin:0}.payhere-history-link{margin:1.1rem 0 0;text-align:center}
.payhere-free-head{margin-bottom:1.25rem}.payhere-confirm-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:1.2rem;align-items:start;max-width:1050px}.payhere-order-summary,.payhere-contact-form,.payhere-status-card{border:1px solid rgba(202,158,36,.38);border-radius:18px;background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(255,250,232,.72));box-shadow:0 18px 45px rgba(15,23,42,.08)}.payhere-order-summary{padding:1.4rem;position:sticky;top:105px}.payhere-order-summary>span,.payhere-contact-form label>span,.payhere-status-card span{display:block;color:var(--muted);font-size:.76rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}.payhere-order-summary h2{margin:.35rem 0}.payhere-order-summary>strong{display:block;color:#9a6c00;font-size:2rem}.payhere-order-summary small{display:block;margin-top:1rem;color:var(--muted)}.payhere-contact-form{padding:1.35rem;display:grid;gap:.9rem}.payhere-contact-form label{display:grid;gap:.38rem}.payhere-contact-form input{width:100%;padding:.78rem .85rem;border:1px solid rgba(100,116,139,.3);border-radius:10px;background:rgba(255,255,255,.86);color:var(--text);font:inherit;box-sizing:border-box}.payhere-contact-form input:focus{outline:2px solid rgba(221,171,29,.35);border-color:#c89818}.payhere-contact-form input[readonly]{background:rgba(148,163,184,.11);color:var(--muted)}.payhere-form-row{display:grid;grid-template-columns:1fr 1fr;gap:.85rem}
.payhere-status-card{padding:1.35rem;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1.2rem;margin-bottom:1.5rem;border-left:5px solid #d4a51e}.payhere-status-card.status-paid{border-left-color:#0f9f6e}.payhere-status-card.status-failed,.payhere-status-card.status-payment_failed,.payhere-status-card.status-chargeback{border-left-color:#cc3d3d}.payhere-status-card code{display:inline-block;margin-top:.45rem;padding:.3rem .5rem;border-radius:7px;background:rgba(15,23,42,.07);overflow-wrap:anywhere}.payhere-status-state{text-align:right}.payhere-status-state>span{font-size:.8rem}.payhere-status-state>strong{display:block;margin:.35rem 0;font-size:1.45rem}.payhere-status-state>small{color:var(--muted)}.payhere-status-card dl{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.7rem;margin:.25rem 0 0}.payhere-status-card dl>div{padding:.75rem;border-radius:10px;background:rgba(148,163,184,.09)}.payhere-status-card dt{color:var(--muted);font-size:.72rem;font-weight:800;text-transform:uppercase}.payhere-status-card dd{margin:.3rem 0 0;font-weight:700;overflow-wrap:anywhere}.payhere-history-section{margin-top:1.3rem}.payhere-history-table-wrap{overflow:auto;border:1px solid rgba(148,163,184,.25);border-radius:15px}.payhere-history-table{width:100%;border-collapse:collapse;min-width:850px;background:rgba(255,255,255,.64)}.payhere-history-table th,.payhere-history-table td{padding:.8rem .9rem;border-bottom:1px solid rgba(148,163,184,.18);text-align:left}.payhere-history-table th{font-size:.73rem;text-transform:uppercase;color:var(--muted)}.payhere-history-table td{font-size:.88rem}.payhere-history-table a{font-weight:750;overflow-wrap:anywhere}
[data-theme="dark"] .payhere-order-summary,[data-theme="dark"] .payhere-contact-form,[data-theme="dark"] .payhere-status-card{background:linear-gradient(145deg,rgba(20,33,53,.96),rgba(36,36,30,.9))}[data-theme="dark"] .payhere-contact-form input{background:rgba(8,20,38,.75)}[data-theme="dark"] .payhere-history-table{background:rgba(10,22,38,.72)}
@media(max-width:760px){.payhere-confirm-grid{grid-template-columns:1fr}.payhere-order-summary{position:static}.payhere-form-row{grid-template-columns:1fr}.payhere-status-card{grid-template-columns:1fr}.payhere-status-state{text-align:left}.payhere-status-card dl{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.payhere-status-card dl{grid-template-columns:1fr}.payhere-order-summary,.payhere-contact-form,.payhere-status-card{padding:1rem}}
/* =========================================================
   v3.19.115 — Admin PayHere checkout control
   ========================================================= */
.admin-payhere-config{display:grid;grid-template-columns:minmax(0,1fr) minmax(290px,430px);align-items:center;gap:1.25rem}
.admin-payhere-config-copy h2{margin:.3rem 0 .45rem}.admin-payhere-config-copy p{margin:0 0 .8rem;color:var(--muted);line-height:1.6}
.admin-payhere-checkout-control{display:grid;gap:.65rem;padding:1rem;border:1px solid var(--minimal-border);border-radius:18px;background:var(--surface-2)}
.admin-payhere-checkout-control p,.admin-payhere-checkout-control small{margin:0;color:var(--muted);line-height:1.5}.admin-payhere-checkout-control small{font-size:.72rem}
.admin-payhere-checkout-control .btn{justify-content:center}
.admin-payhere-state{display:inline-flex;align-items:center;gap:.55rem;width:max-content;max-width:100%;font-size:.74rem;font-weight:950;letter-spacing:.06em}
.admin-payhere-state i{width:10px;height:10px;border-radius:50%;background:#a52a2a;box-shadow:0 0 0 5px rgba(165,42,42,.1)}
.admin-payhere-state.is-enabled{color:#087f5b}.admin-payhere-state.is-enabled i{background:#15966b;box-shadow:0 0 0 5px rgba(21,150,107,.12)}
.admin-payhere-state.is-disabled{color:#a52a2a}
.payhere-disabled-notice{max-width:760px;margin:0 0 1rem}
@media(max-width:820px){.admin-payhere-config{grid-template-columns:1fr}.admin-payhere-checkout-control{width:100%}}

/* =========================================================
   v3.19.116 — Subscription plan card row alignment
   Keep all membership cards on the same top line. The
   recommended/access badge may float above a card without
   physically lifting the Elite Starter card itself.
   ========================================================= */
.elite-plan-card.is-elite {
  transform: none;
}

/* ===== v3.19.117 — Learn portal hierarchy + Kana Practice relocation ===== */
.learn-portal-main,.others-portal-main{gap:clamp(1.35rem,3vw,2.15rem)}
.learn-portal-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-width:980px}
.others-portal-grid{grid-template-columns:repeat(2,minmax(260px,380px));justify-content:start}
@media(max-width:760px){
  .learn-portal-grid,.others-portal-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-width:none}
}
@media(max-width:480px){
  .learn-portal-grid,.others-portal-grid{grid-template-columns:1fr}
}


/* ===== v3.19.118 — Learn exact Irodori-style free-flow layout ===== */
.learn-portal-main .learn-free-hero{
  width:100%;
  max-width:none;
  margin:0;
  padding:0 0 clamp(.65rem,2vw,1.15rem)!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.learn-portal-main .learn-free-hero .resources-hero-count{
  width:auto!important;
  min-width:0!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.learn-portal-main .learn-free-hero h1{margin:.08rem 0;font-size:clamp(1.8rem,3.2vw,3rem)}
.learn-portal-main .learn-free-hero p{max-width:780px;margin:0;color:var(--muted);line-height:1.7}
@media(max-width:900px){
  .learn-portal-main .learn-free-hero .resources-hero-count{width:auto!important;text-align:left!important}
}

/* ===== v3.19.119 — Learn dropdown pages exact Irodori free-flow headers ===== */
.learn-dropdown-free-head{
  width:100%;
  max-width:none;
  margin:0;
  padding:0 0 clamp(.8rem,2.2vw,1.35rem)!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:var(--text)!important;
}
.learn-dropdown-free-head .resources-breadcrumb{margin-bottom:.35rem}
.learn-dropdown-free-head h1{
  max-width:900px;
  margin:.08rem 0 .35rem!important;
  color:var(--text)!important;
  font-size:clamp(1.8rem,3.2vw,3rem)!important;
  line-height:1.08!important;
  letter-spacing:-.035em!important;
  text-shadow:none!important;
}
.learn-dropdown-free-head>p,
.learn-dropdown-free-head .practice-hero-copy>p,
.learn-dropdown-free-head>div>p{
  max-width:780px;
  margin:0!important;
  color:var(--muted)!important;
  line-height:1.7!important;
  font-size:inherit!important;
}

/* Zero to Exam: preserve useful progress/actions without a hero card or visual panel. */
.zero-exam-free-head{display:block!important}
.zero-exam-free-head::before,.zero-exam-free-head::after{content:none!important;display:none!important}
.zero-exam-free-head .learn-platform-actions{margin-top:1rem}
.learn-free-progress{
  max-width:780px;
  margin-top:1.15rem;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.learn-free-progress .learn-platform-progress-head{margin-bottom:.5rem}
.learn-free-progress .learn-platform-progress-head strong{font-size:1.45rem}
.learn-free-progress .learn-platform-mini-stats{margin-top:.55rem}

/* Phrasebook: remove the old dark hero surface and decorative mark. */
.phrasebook-main .pb-free-head{
  display:block!important;
  grid-template-columns:none!important;
  gap:0!important;
  overflow:visible!important;
}
.phrasebook-main .pb-free-head::before,.phrasebook-main .pb-free-head::after{content:none!important;display:none!important}
.phrasebook-main .pb-free-head .eyebrow{color:inherit}
.phrasebook-main .pb-free-head .pb-hero-actions{margin-top:.85rem}
.phrasebook-main .pb-free-head .pb-stat{
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:var(--muted)!important;
}
.phrasebook-main .pb-free-head .pb-stat strong{color:var(--text)!important}
html[data-theme="palette"] .phrasebook-main .pb-free-head,
html[data-theme="palette"] .phrasebook-main .pb-free-head .eyebrow,
html[data-theme="palette"] .phrasebook-main .pb-free-head h1,
html[data-theme="palette"] .phrasebook-main .pb-free-head p{color:var(--text)!important;text-shadow:none!important}
html[data-theme="palette"] .phrasebook-main .pb-free-head p{color:var(--muted)!important}
html[data-theme="palette"] .phrasebook-main .pb-free-head .pb-stat{color:var(--muted)!important;background:transparent!important;border:0!important}

/* Kana Practice: the Writing Lab heading is now free-flowing like Irodori. */
.kana-practice-main .practice-free-head{
  display:block!important;
  grid-template-columns:none!important;
  gap:0!important;
  overflow:visible!important;
}
.kana-practice-main .practice-free-head::before,.kana-practice-main .practice-free-head::after{content:none!important;display:none!important}
.kana-practice-main .practice-free-head .practice-hero-copy{position:static!important}
.kana-practice-main .practice-free-head .eyebrow{color:inherit!important;text-shadow:none!important}
.kana-practice-main .practice-free-head .practice-hero-badges{margin-top:.85rem;gap:.65rem 1rem}
.kana-practice-main .practice-free-head .practice-hero-badges span{
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  color:var(--muted)!important;
}
.kana-practice-main .practice-free-head .practice-hero-badges b{color:var(--text)!important}
html[data-theme="palette"] .kana-practice-main .practice-free-head,
html[data-theme="palette"] .kana-practice-main .practice-free-head .eyebrow,
html[data-theme="palette"] .kana-practice-main .practice-free-head h1{color:var(--text)!important;text-shadow:none!important}
html[data-theme="palette"] .kana-practice-main .practice-free-head p{color:var(--muted)!important}
html[data-theme="palette"] .kana-practice-main .practice-free-head .practice-hero-badges span{color:var(--muted)!important;background:transparent!important;border:0!important}
html[data-theme="palette"] .kana-practice-main .practice-free-head .practice-hero-badges b{color:var(--text)!important}

@media(max-width:620px){
  .learn-dropdown-free-head{padding-bottom:.8rem!important}
  .learn-dropdown-free-head h1{font-size:clamp(1.75rem,9vw,2.45rem)!important}
  .learn-free-progress{max-width:none}
  .learn-free-progress .learn-platform-progress-head{align-items:flex-start;flex-direction:column;gap:.3rem}
}

/* ===== v3.19.120 — Learn contrast + Phrasebook cache/search polish ===== */
/* Keep the dark weekly study card readable under the permanent palette theme. */
.learn-week-card h2,
html[data-theme="palette"] .learn-week-card h2{color:#FFFFFF!important;text-shadow:none!important}
.learn-week-card .eyebrow,
html[data-theme="palette"] .learn-week-card .eyebrow{color:#A9D6E5!important;text-shadow:none!important}
.learn-week-card .learn-week-list span{color:#F8FBFF!important}



/* ===== v3.19.122 - SSW Caregiver resource library ===== */
.resource-ssw-grid .resource-group-card>small{
  color:var(--muted);
  font-size:.74rem;
  font-weight:850;
  line-height:1.45;
}
.resource-ssw-grid .resource-group-card.has-resources{
  border-color:rgba(44,125,160,.34);
}
.resource-ssw-grid .resource-group-card.has-resources>small{
  color:#0F766E;
}
.resource-ssw-library-section{
  display:grid;
  gap:1rem;
}
.resource-ssw-library-head{
  display:grid;
  justify-items:start;
  gap:.35rem;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
}
.resource-ssw-library-head h2{
  margin:.05rem 0;
  font-size:clamp(1.35rem,2.2vw,2rem);
}
.resource-ssw-library-head p{
  max-width:760px;
  margin:0;
  color:var(--muted);
  line-height:1.65;
}
.resource-ssw-library-head>small{
  margin-top:.2rem;
  padding:.34rem .58rem;
  border:1px solid var(--border);
  border-radius:999px;
  background:var(--surface);
  color:var(--muted);
  font-size:.7rem;
  font-weight:900;
}
html[data-theme="dark"] .resource-ssw-grid .resource-group-card.has-resources>small{
  color:#99F6E4;
}

/* v3.19.176 · Wrong Answer AI */
.ai-wrong-answer-box{margin-top:.7rem}.ai-wrong-answer-result{margin-top:.55rem;padding:.75rem;border-left:3px solid #0f766e;background:var(--surface);white-space:pre-wrap;line-height:1.55;border-radius:0 10px 10px 0}

/* =========================================================
   v3.19.206 — Mobile Student Dashboard Content Gutter
   Gives phone layouts a conventional 16px page gutter instead of
   placing dashboard text/cards almost against the viewport edge.
   ========================================================= */
@media (max-width: 700px) {
  html[data-theme="palette"] main.container.student-dashboard-main {
    width: calc(100vw - 32px) !important;
    max-width: calc(100vw - 32px) !important;
    margin-left: 16px !important;
    margin-right: 16px !important;
  }
}

@media (max-width: 380px) {
  html[data-theme="palette"] main.container.student-dashboard-main {
    width: calc(100vw - 28px) !important;
    max-width: calc(100vw - 28px) !important;
    margin-left: 14px !important;
    margin-right: 14px !important;
  }
}

/* =========================================================
   v3.19.208 — Full-Site Mobile Density & Gutter Pass
   - Consistent phone gutters across every shared page
   - Compact mobile cards/sections without shrinking tap targets
   - Dashboard category cards remain information-dense on phones
   - Quick Access stays two-column on normal phones
   - Shared Papers/Resources/Progress hub cards use shorter covers
   - Floating controls leave more usable content space
   ========================================================= */
@media (max-width: 700px) {
  :root {
    --jpfz-mobile-gutter: 20px;
    --jpfz-mobile-card-pad: 14px;
    --jpfz-mobile-section-gap: 14px;
  }

  /* Conventional full-site page gutter. This supersedes the old
     9px generic phone gutter and the dashboard-only v3.19.206 rule. */
  html[data-theme="palette"] main.container,
  main.container {
    width: auto !important;
    max-width: none !important;
    margin: 14px var(--jpfz-mobile-gutter) 54px !important;
  }

  /* Prevent long localized text/URLs from forcing horizontal overflow. */
  main.container,
  main.container section,
  main.container article,
  main.container header,
  main.container div {
    min-width: 0;
  }
  main.container h1,
  main.container h2,
  main.container h3,
  main.container p,
  main.container a,
  main.container span,
  main.container strong,
  main.container small {
    overflow-wrap: anywhere;
  }

  /* Mobile typography: retain hierarchy, avoid oversized desktop copy. */
  main.container:not(.landing-main) h1 {
    font-size: clamp(1.75rem, 8vw, 2.35rem);
    line-height: 1.08;
  }
  main.container:not(.landing-main) h2 {
    line-height: 1.18;
  }
  main.container .eyebrow {
    margin-bottom: 5px;
    font-size: .69rem;
    letter-spacing: .105em;
  }

  /* Shared section/card density. Avoid touching media thumbnails/aspect ratios. */
  main.container .card,
  main.container .stat-card,
  main.container .metric-card,
  main.container .content-card,
  main.container .review-card,
  main.container .paper-progress-item,
  main.container .kb-doc-card,
  main.container .admin-content-card,
  main.container .elite-plan-card,
  main.container .elite-payment-card,
  main.container .payhere-order-summary,
  main.container .payhere-contact-form,
  main.container .payhere-status-card {
    padding: var(--jpfz-mobile-card-pad) !important;
    border-radius: 18px !important;
  }

  main.container .feature-grid,
  main.container .paper-grid,
  main.container .stat-grid,
  main.container .dashboard-active-grid,
  main.container .dashboard-exam-family-stack,
  main.container .saved-paper-grid,
  main.container .elite-plan-grid,
  main.container .elite-payment-grid {
    gap: 10px !important;
  }

  /* Buttons stay thumb-friendly while losing excessive vertical height. */
  main.container .btn {
    min-height: 42px;
    padding: 9px 14px;
    line-height: 1.2;
  }

  /* Student dashboard header/actions. */
  .student-dashboard-main .student-dashboard-head {
    gap: 12px !important;
    margin-bottom: 14px !important;
  }
  .student-dashboard-main .student-dashboard-head h1 {
    margin-bottom: 4px !important;
  }
  .student-dashboard-main .student-dashboard-head p {
    font-size: .94rem;
    line-height: 1.48;
  }
  .student-dashboard-main .student-dashboard-head .actions {
    width: 100%;
    gap: 8px;
  }
  .student-dashboard-main .student-dashboard-head .actions .btn {
    flex: 1 1 auto;
    min-width: 0;
  }

  /* Subscription overview: compact but still readable. */
  .student-dashboard-main .dashboard-subscription-topline {
    gap: 12px !important;
    padding: 14px !important;
  }
  .student-dashboard-main .dashboard-membership-emblem {
    width: 48px !important;
    height: 48px !important;
    border-radius: 15px !important;
    font-size: 1.15rem !important;
  }
  .student-dashboard-main .dashboard-subscription-title-row {
    gap: 7px !important;
  }
  .student-dashboard-main .dashboard-subscription-title-row h2 {
    margin: 3px 0 4px !important;
    font-size: 1.22rem !important;
  }
  .student-dashboard-main .dashboard-membership-copy p {
    font-size: .88rem;
    line-height: 1.48;
  }
  .student-dashboard-main .dashboard-subscription-actions {
    gap: 7px !important;
  }
  .student-dashboard-main .dashboard-subscription-meta-grid article {
    padding: 11px 13px !important;
  }
  .student-dashboard-main .dashboard-subscription-countdown-row {
    gap: 8px !important;
    padding: 11px 14px !important;
  }
  .student-dashboard-main .dashboard-subscription-benefit-grid {
    gap: 8px !important;
    padding: 11px 14px 14px !important;
  }
  .student-dashboard-main .dashboard-subscription-benefit-grid article {
    padding: 9px !important;
    border-radius: 13px !important;
  }

  /* Dashboard section rhythm. */
  .student-dashboard-main .dashboard-section-heading {
    align-items: flex-start !important;
    gap: 8px !important;
    margin: 18px 0 9px !important;
  }
  .student-dashboard-main .dashboard-section-heading h2 {
    font-size: 1.28rem !important;
  }
  .student-dashboard-main .dashboard-exam-family {
    padding: 11px !important;
    border-radius: 18px !important;
  }
  .student-dashboard-main .dashboard-exam-family-head {
    gap: 6px !important;
    margin-bottom: 9px !important;
  }
  .student-dashboard-main .dashboard-exam-family-head h3 {
    font-size: 1.08rem !important;
  }
  .student-dashboard-main .dashboard-exam-family-head p {
    font-size: .82rem !important;
    line-height: 1.4;
  }

  /* Critical phone repair: don't stack every category-card field vertically.
     Row 1 = mark + copy, row 2 = compact paper count + action. */
  html[data-theme="palette"] .student-dashboard-main .dashboard-category-card,
  .student-dashboard-main .dashboard-category-card {
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr) !important;
    gap: 9px 11px !important;
    align-items: start !important;
    padding: 11px !important;
    border-radius: 16px !important;
  }
  .student-dashboard-main .dashboard-category-mark {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 48px !important;
    height: 48px !important;
    border-radius: 14px !important;
    font-size: 1rem !important;
  }
  .student-dashboard-main .dashboard-category-card > div:not(.dashboard-category-meta) {
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: center !important;
  }
  .student-dashboard-main .dashboard-category-card h3 {
    margin: 1px 0 3px !important;
    font-size: 1.02rem !important;
    line-height: 1.18 !important;
  }
  .student-dashboard-main .dashboard-category-card p {
    display: -webkit-box;
    margin: 0 !important;
    overflow: hidden;
    color: var(--muted);
    font-size: .79rem !important;
    line-height: 1.38 !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .student-dashboard-main .dashboard-category-card .eyebrow {
    margin: 0 0 2px !important;
    font-size: .58rem !important;
  }
  .student-dashboard-main .dashboard-category-meta {
    grid-column: 1 !important;
    grid-row: 2 !important;
    align-self: stretch !important;
    padding: 6px 5px !important;
    border-radius: 11px !important;
  }
  .student-dashboard-main .dashboard-category-meta strong {
    font-size: 1rem !important;
    line-height: 1 !important;
  }
  .student-dashboard-main .dashboard-category-meta span {
    margin-top: 3px;
    font-size: .53rem !important;
    line-height: 1.1;
  }
  .student-dashboard-main .dashboard-category-card > .btn {
    grid-column: 2 !important;
    grid-row: 2 !important;
    width: 100% !important;
    min-height: 38px !important;
    padding: 8px 11px !important;
    border-radius: 11px !important;
    font-size: .78rem !important;
  }

  /* Quick Access: normal phones keep two useful compact columns. */
  .student-dashboard-main .dashboard-quick-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
  html[data-theme="palette"] .student-dashboard-main .dashboard-quick-grid a,
  .student-dashboard-main .dashboard-quick-grid a {
    min-height: 108px !important;
    gap: 3px !important;
    padding: 12px !important;
    border-radius: 16px !important;
  }
  .student-dashboard-main .dashboard-quick-grid a > span {
    font-size: 1.05rem !important;
    line-height: 1.1;
  }
  .student-dashboard-main .dashboard-quick-grid strong {
    font-size: .96rem !important;
    line-height: 1.2;
  }
  .student-dashboard-main .dashboard-quick-grid small {
    font-size: .75rem !important;
    line-height: 1.32;
  }

  /* Other dashboard surfaces. */
  .student-dashboard-main .dashboard-learning-card {
    gap: 10px !important;
    margin: 12px 0 !important;
    padding: 12px !important;
    border-radius: 18px !important;
  }
  .student-dashboard-main .dashboard-learning-icon {
    width: 48px !important;
    height: 48px !important;
    border-radius: 14px !important;
    font-size: 1.05rem !important;
  }
  .student-dashboard-main .dashboard-learning-card h2 {
    margin: 2px 0 !important;
    font-size: 1.08rem !important;
  }
  .student-dashboard-main .dashboard-progress {
    margin-bottom: 12px !important;
  }
  .student-dashboard-main .dashboard-mini-stats {
    gap: 8px !important;
    margin-top: 10px !important;
  }
  .student-dashboard-main .dashboard-mini-stats > div {
    padding: 10px !important;
  }

  /* Papers / Resources / Progress / Notes hub cards.
     Existing desktop cover-first design is retained, but shorter on phones. */
  html[data-theme="palette"] .dropdown-family-grid,
  html[data-theme="palette"] .dropdown-child-grid,
  html[data-theme="palette"] .progress-hub-grid {
    gap: 11px !important;
  }
  html[data-theme="palette"] .dropdown-family-grid > .dropdown-family-card,
  html[data-theme="palette"] .dropdown-child-grid > .exam-category-card,
  html[data-theme="palette"] .dropdown-child-grid > .exam-category-placeholder,
  html[data-theme="palette"] .dropdown-child-grid > .notes-category-card,
  html[data-theme="palette"] .dropdown-child-grid > .notes-category-placeholder,
  html[data-theme="palette"] .progress-hub-grid > .progress-hub-card {
    width: 100% !important;
    max-width: none !important;
    flex-basis: 100% !important;
  }
  html[data-theme="palette"] .dropdown-family-card,
  html[data-theme="palette"] .dropdown-child-grid > .exam-category-card,
  html[data-theme="palette"] .dropdown-child-grid > .notes-category-card,
  html[data-theme="palette"] .progress-hub-card {
    padding: 0 12px 12px !important;
    border-radius: 18px !important;
  }
  html[data-theme="palette"] .dropdown-family-card-top,
  html[data-theme="palette"] .dropdown-child-grid .exam-category-card-top,
  html[data-theme="palette"] .dropdown-child-grid .notes-category-card-top,
  html[data-theme="palette"] .progress-hub-card::before {
    width: calc(100% + 24px) !important;
    min-height: 132px !important;
    margin: 0 -12px 10px !important;
    border-radius: 17px 17px 13px 13px !important;
  }
  html[data-theme="palette"] .dropdown-family-copy,
  html[data-theme="palette"] .dropdown-child-grid .exam-category-copy,
  html[data-theme="palette"] .dropdown-child-grid .notes-category-copy {
    margin-bottom: 7px !important;
  }
  html[data-theme="palette"] .dropdown-family-card > .btn.full,
  html[data-theme="palette"] .dropdown-child-grid > .exam-category-card > .btn.full,
  html[data-theme="palette"] .dropdown-child-grid > .notes-category-card > .btn.full,
  html[data-theme="palette"] .progress-hub-card > .btn.full {
    min-width: 122px !important;
    min-height: 38px !important;
    padding: 8px 13px !important;
  }

  /* Free-flow page heads: less empty vertical space before content. */
  .resources-free-head,
  .papers-portal-main .resources-free-head,
  .learn-dropdown-free-head,
  .learn-portal-main .learn-free-hero {
    padding-bottom: 10px !important;
  }
  .resources-free-head p,
  .papers-portal-main .resources-free-head p,
  .learn-dropdown-free-head p {
    font-size: .9rem;
    line-height: 1.5 !important;
  }

  /* Subscription page density. */
  .elite-subscription-main {
    width: auto !important;
    max-width: none !important;
  }
  .elite-subscription-hero {
    gap: 16px !important;
    padding: 19px 16px !important;
    border-radius: 21px !important;
  }
  .elite-hero-copy h1 {
    margin: 5px 0 9px !important;
    font-size: clamp(2rem, 10vw, 2.75rem) !important;
  }
  .elite-hero-copy > p {
    font-size: .9rem !important;
    line-height: 1.5 !important;
  }
  .elite-current-status {
    gap: 6px !important;
    padding: 14px !important;
    border-radius: 17px !important;
  }
  .elite-plan-section,
  .elite-payment-section {
    margin-top: 22px !important;
  }
  .elite-section-heading {
    margin-bottom: 11px !important;
  }
  .elite-plan-card ul {
    gap: 8px !important;
    margin-bottom: 15px !important;
  }
  .elite-plan-card li {
    padding-left: 20px !important;
    font-size: .86rem;
    line-height: 1.42;
  }
  .elite-plan-price {
    margin: 9px 0 13px !important;
  }
  .elite-payment-card h3 {
    margin: 11px 0 5px !important;
  }

  /* Exam/review pages remain comfortable to tap, but avoid desktop padding. */
  .question-card {
    padding: 15px !important;
    border-radius: 17px !important;
  }
  .options {
    gap: 9px !important;
    margin: 17px 0 !important;
  }
  .option {
    grid-template-columns: 34px 1fr !important;
    gap: 9px !important;
    padding: 11px !important;
  }
  .question-actions {
    gap: 8px;
    margin-top: 18px !important;
  }
  .review-card {
    margin-bottom: 10px !important;
  }

  /* Footer/card groups should not recreate an oversized outer gutter. */
  .footer {
    padding-left: var(--jpfz-mobile-gutter) !important;
    padding-right: var(--jpfz-mobile-gutter) !important;
  }

  /* Keep floating controls clear of text and each other on phones. */
  .back-to-top {
    right: 12px !important;
    bottom: 14px !important;
    width: 46px !important;
    height: 46px !important;
  }
}

@media (max-width: 380px) {
  :root { --jpfz-mobile-gutter: 16px; }

  html[data-theme="palette"] main.container,
  main.container {
    margin-left: var(--jpfz-mobile-gutter) !important;
    margin-right: var(--jpfz-mobile-gutter) !important;
  }

  .student-dashboard-main .dashboard-quick-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }
  .student-dashboard-main .dashboard-quick-grid a {
    min-height: 102px !important;
    padding: 10px !important;
  }
}

@media (max-width: 340px) {
  /* Very narrow devices get one column only when two columns stop being useful. */
  .student-dashboard-main .dashboard-quick-grid {
    grid-template-columns: 1fr !important;
  }
  .student-dashboard-main .dashboard-quick-grid a {
    min-height: 0 !important;
  }
}

/* v3.19.214 — keep companion PDF/audio resources visibly connected. */
.resource-related-card{position:relative}
.resource-related-media-badge{display:inline-flex;align-items:center;justify-content:center;align-self:center;width:max-content;max-width:100%;margin:-.2rem auto 0;padding:.28rem .55rem;border:1px solid rgba(20,126,116,.22);border-radius:999px;background:rgba(20,126,116,.07);color:#176f67;font-size:.68rem;font-weight:850;line-height:1.15;letter-spacing:.02em;text-align:center}
.resource-related-audio-button,.resource-related-pdf-button{white-space:nowrap}
@media(max-width:680px){.resource-related-audio-button,.resource-related-pdf-button{white-space:normal;text-align:center}}

/* v3.19.215 — 10-second seek controls for JP From Zero embedded lesson videos */
.learn-youtube-player-shell,.lesson-youtube-player-shell{display:grid;gap:.55rem;min-width:0}.youtube-seek-controls{display:flex;align-items:center;justify-content:center;gap:.55rem}.youtube-seek-controls button{display:inline-flex;align-items:center;justify-content:center;gap:.25rem;min-width:104px;min-height:40px;padding:.55rem .9rem;border:1px solid rgba(217,164,65,.72);border-radius:999px;background:linear-gradient(180deg,#fffdf7,#fff7dc);color:#172235;font:inherit;font-size:.82rem;font-weight:850;cursor:pointer;box-shadow:0 5px 15px rgba(15,23,42,.07);transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}.youtube-seek-controls button:hover,.youtube-seek-controls button:focus-visible{transform:translateY(-1px);border-color:#d9a441;box-shadow:0 7px 18px rgba(217,164,65,.17);outline:none}.youtube-seek-controls button:disabled{cursor:wait;opacity:.55;transform:none;box-shadow:none}.youtube-seek-controls button:active:not(:disabled){transform:translateY(0)}@media(max-width:560px){.youtube-seek-controls{gap:.45rem}.youtube-seek-controls button{flex:1;min-width:0;min-height:44px;padding:.58rem .7rem}}

/* =========================================================
   v3.19.216 — Exam title / save-state edge spacing
   Keep the paper heading row aligned with the question-card
   content instead of touching the main panel edges.
   ========================================================= */
html[data-theme="palette"] .exam-container .exam-title{
  padding-inline:clamp(20px,1.8vw,24px)!important;
}
@media(max-width:900px){
  html[data-theme="palette"] .exam-container .exam-title{
    padding-inline:14px!important;
  }
}

/* =========================================================
   v3.19.217 — Site-wide control visibility / contrast polish
   Keep active actions clearly distinguishable from disabled or
   secondary text across the palette UI without changing layout.
   ========================================================= */
html[data-theme="palette"] :is(button,.btn,[role="button"],summary):focus-visible{
  outline:3px solid rgba(201,162,39,.58)!important;
  outline-offset:3px!important;
  box-shadow:0 0 0 1px rgba(15,23,42,.10),0 8px 20px rgba(15,23,42,.12)!important;
}
html[data-theme="palette"] .btn{
  font-weight:850!important;
  opacity:1!important;
}
html[data-theme="palette"] .btn.primary,
html[data-theme="palette"] .btn.warning{
  border:1px solid #a97f18!important;
  color:#0F172A!important;
  text-shadow:none!important;
}
html[data-theme="palette"] .btn.secondary,
html[data-theme="palette"] .btn-outline{
  border:1px solid #324154!important;
  color:#fff!important;
  text-shadow:none!important;
}
html[data-theme="palette"] :is(button,.btn)[disabled],
html[data-theme="palette"] :is(button,.btn)[aria-disabled="true"]{
  opacity:.72!important;
  cursor:not-allowed!important;
  filter:saturate(.55)!important;
}
html[data-theme="palette"] .navigator button{
  border-color:#AEBCC9!important;
  background:#F8FAFC!important;
  color:#24364C!important;
  font-weight:850!important;
}
html[data-theme="palette"] .navigator button.current{
  border-color:#0F172A!important;
  background:#0F172A!important;
  color:#fff!important;
}
html[data-theme="palette"] .navigator button.answered{
  border-color:#4EA785!important;
  background:#E2F5ED!important;
  color:#124D38!important;
}
html[data-theme="palette"] .save-state,
html[data-theme="palette"] .status,
html[data-theme="palette"] .status-badge,
html[data-theme="palette"] .badge,
html[data-theme="palette"] .tag,
html[data-theme="palette"] .pill,
html[data-theme="palette"] .chip{
  opacity:1!important;
  text-shadow:none!important;
}
html[data-theme="palette"] .timer-add-button{
  border-color:rgba(255,255,255,.48)!important;
  background:rgba(255,255,255,.14)!important;
  color:#fff!important;
}
html[data-theme="palette"] .translator-submit,
html[data-theme="palette"] .practice-control:not(:disabled),
html[data-theme="palette"] .resource-view-actions :is(button,.btn),
html[data-theme="palette"] .question-actions .btn:not(:disabled){
  opacity:1!important;
  text-shadow:none!important;
}
html[data-theme="palette"] .youtube-seek-controls button{
  min-height:44px!important;
  border:2px solid #B7861F!important;
  background:linear-gradient(180deg,#FFFDF8 0%,#F8E8B7 100%)!important;
  color:#172235!important;
  font-weight:900!important;
  box-shadow:0 6px 16px rgba(15,23,42,.11)!important;
  opacity:1!important;
}
html[data-theme="palette"] .youtube-seek-controls button strong,
html[data-theme="palette"] .youtube-seek-controls button span{
  color:inherit!important;
  opacity:1!important;
}
html[data-theme="palette"] .youtube-seek-controls button:hover,
html[data-theme="palette"] .youtube-seek-controls button:focus-visible{
  border-color:#8F650D!important;
  background:#FFF4C7!important;
}
@media(max-width:600px){
  html[data-theme="palette"] .youtube-seek-word{display:none!important}
  html[data-theme="palette"] .youtube-seek-controls button{min-width:0!important;padding-inline:.65rem!important}
}

/* v3.19.218 Learning ecosystem: compact notification bell */
.header-notification-menu{position:relative;margin-left:6px}.header-notification-menu>summary{list-style:none}.header-notification-menu>summary::-webkit-details-marker{display:none}.header-notification-trigger{position:relative;width:38px;height:38px;display:grid;place-items:center;border-radius:12px;cursor:pointer;font-size:18px;border:1px solid rgba(148,163,184,.24);background:rgba(255,255,255,.06)}.header-notification-trigger b{position:absolute;right:-5px;top:-6px;min-width:17px;height:17px;padding:0 4px;border-radius:10px;display:grid;place-items:center;background:#b4232f;color:#fff;font-size:10px}.header-notification-dropdown{position:fixed;right:var(--header-notification-right,18px);top:var(--header-notification-top,77px);width:min(360px,calc(100vw - 28px));max-height:430px;overflow:auto;z-index:1400;padding:10px;border:1px solid rgba(148,163,184,.25);border-radius:14px;background:var(--surface,#fff);box-shadow:0 18px 45px rgba(15,23,42,.18)}.header-notification-head{display:flex;justify-content:space-between;align-items:center;padding:8px 8px 10px}.header-notification-head a{font-size:.82rem}.header-notification-item{display:block;padding:10px 9px;border-top:1px solid rgba(148,163,184,.15);text-decoration:none;color:inherit}.header-notification-item strong,.header-notification-item small{display:block}.header-notification-item small{margin-top:3px;color:var(--muted,#687385);font-weight:400}.header-notification-item.is-unread{background:rgba(234,179,8,.08)}.header-notification-empty{display:block;padding:18px 9px;color:var(--muted,#687385);text-align:center}@media(max-width:850px){.header-notification-menu{margin-left:auto}.header-notification-dropdown{position:fixed;right:var(--header-notification-right,14px);top:var(--header-notification-top,68px)}}

/* v3.19.249 — notification drawer controls and email preference */
.header-notification-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px}.header-notification-mark-all{padding:0;border:0;background:transparent;color:var(--link,#0f766e);font:inherit;font-size:.82rem;line-height:1.3;cursor:pointer;text-decoration:underline;text-underline-offset:2px}.header-notification-mark-all:hover,.header-notification-mark-all:focus-visible{color:#0b5c55}.header-notification-mark-all:disabled{opacity:.65;cursor:wait}.account-notification-preference{display:flex!important;align-items:flex-start;gap:10px;padding:12px 14px;border:1px solid rgba(148,163,184,.25);border-radius:11px;background:rgba(255,255,255,.42);cursor:pointer}.account-notification-preference input{width:auto!important;margin:4px 0 0}.account-notification-preference strong,.account-notification-preference small{display:block}.account-notification-preference small{margin-top:3px;color:var(--muted,#687385);font-weight:400}@media(max-width:430px){.header-notification-head{align-items:flex-start;gap:8px}.header-notification-actions{gap:8px;flex-wrap:wrap;justify-content:flex-end}}
/* v3.19.218 compact learning summary on student dashboard */
.dashboard-learning-ecosystem{margin:18px 0 24px}.dashboard-stat-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.dashboard-stat-grid>a{padding:13px;border:1px solid rgba(148,163,184,.22);border-radius:12px;text-decoration:none;color:inherit}.dashboard-stat-grid span,.dashboard-stat-grid strong{display:block}.dashboard-stat-grid span{font-size:.78rem;color:var(--muted,#6b7280)}.dashboard-stat-grid strong{margin-top:4px}.dashboard-learning-next{margin:11px 0 0;color:var(--muted,#6b7280)}@media(max-width:950px){.dashboard-stat-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:560px){.dashboard-stat-grid{grid-template-columns:repeat(2,1fr)}}
/* v3.19.218 Learning Tools admin forms */
.admin-inline-setting{display:grid;grid-template-columns:minmax(220px,1fr) auto auto;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid rgba(148,163,184,.18)}.admin-inline-setting label:first-of-type strong,.admin-inline-setting label:first-of-type small{display:block}.admin-inline-setting label:first-of-type small{color:var(--muted,#6b7280);margin-top:3px}.admin-form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:end;margin:14px 0}.admin-form-grid label{display:grid;gap:6px}.admin-form-grid label.wide{grid-column:1/-1}.admin-form-grid input,.admin-form-grid select,.admin-form-grid textarea{width:100%;border:1px solid rgba(148,163,184,.28);border-radius:10px;padding:10px;background:var(--surface,#fff);color:inherit;font:inherit}@media(max-width:760px){.admin-inline-setting,.admin-form-grid{grid-template-columns:1fr}.admin-form-grid label.wide{grid-column:auto}}

/* =========================================================
   v3.19.219 — Header notification alignment repair
   Keep Notifications immediately to the left of the profile
   control across desktop, tablet and mobile layouts.
   ========================================================= */
.header-user-controls{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  min-width:max-content;
  position:relative;
  z-index:1250;
}
.header-user-controls .header-notification-menu,
.header-user-controls .compact-profile-menu{
  margin:0!important;
  flex:0 0 auto;
}
.header-user-controls .header-notification-menu{
  position:relative!important;
}

@media (min-width:1181px){
  html[data-theme="palette"] .header-user-controls{
    grid-column:3!important;
    grid-row:1!important;
    justify-self:end!important;
    align-self:center!important;
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
  }
  html[data-theme="palette"] .header-user-controls .compact-profile-menu{
    grid-column:auto!important;
    grid-row:auto!important;
    justify-self:auto!important;
  }
  /* Active-attempt timer stays immediately left of Bell + Profile. */
  html[data-theme="palette"] .header-attempt-countdown{
    right:calc(clamp(28px,3.2vw,64px) + 118px)!important;
  }
}

@media (min-width:821px) and (max-width:1180px){
  .topbar-right .header-user-controls,
  html[data-theme="palette"] .topbar-right .header-user-controls{
    order:3!important;
    display:flex!important;
    align-items:center!important;
    gap:9px!important;
  }
  .header-user-controls .compact-profile-menu,
  html[data-theme="palette"] .header-user-controls .compact-profile-menu{
    order:initial!important;
  }
}

@media (max-width:820px){
  .header-user-controls,
  html[data-theme="palette"] .header-user-controls{
    grid-column:3!important;
    grid-row:1!important;
    justify-self:end!important;
    align-self:center!important;
    display:flex!important;
    align-items:center!important;
    gap:6px!important;
    margin:0!important;
  }
  .header-user-controls .header-notification-menu{
    margin:0!important;
  }
  .header-user-controls .compact-profile-menu,
  html[data-theme="palette"] .header-user-controls .compact-profile-menu{
    grid-column:auto!important;
    grid-row:auto!important;
    justify-self:auto!important;
    order:initial!important;
    margin:0!important;
  }
  /* Reserve the right-side width of menu + Bell + Profile for live timer. */
  html[data-theme="palette"] .header-attempt-countdown{
    right:162px!important;
  }
  .header-notification-dropdown{
    right:0!important;
  }
}

/* =========================================================
   v3.19.227 — Site-wide control visibility / contrast guard
   Keeps enabled content controls from looking disabled and
   gives keyboard, hover and disabled states clear separation.
   Header/navigation controls retain their component styling.
   ========================================================= */
main :where(button,.btn,.button,a.btn,a.button,input[type="submit"],input[type="button"],input[type="reset"]):not(:disabled):not([aria-disabled="true"]){
  opacity:1!important;
  filter:none;
}
main :where(button,.btn,.button,a.btn,a.button,input[type="submit"],input[type="button"],input[type="reset"]){
  font-weight:800;
  text-underline-offset:2px;
}
main :where(button,.btn,.button,a.btn,a.button,input[type="submit"],input[type="button"],input[type="reset"]):focus-visible{
  outline:3px solid #e4b92f!important;
  outline-offset:2px!important;
  box-shadow:0 0 0 1px #0f172a,0 0 0 5px rgba(228,185,47,.25)!important;
}
main :where(button,.btn,.button,a.btn,a.button,input[type="submit"],input[type="button"],input[type="reset"]):disabled,
main :where(button,.btn,.button,a.btn,a.button)[aria-disabled="true"]{
  opacity:.68!important;
  cursor:not-allowed!important;
  filter:saturate(.65)!important;
}
main .btn.compact,
main button.compact{
  min-height:38px;
  padding:.5rem .75rem;
  font-size:.76rem;
  font-weight:850;
}
html[data-theme="palette"] main :where(.practice-next-button,.interview-speak-button){
  min-height:38px!important;
  padding:.5rem .78rem!important;
  border:1px solid #0f766e!important;
  border-radius:10px!important;
  background:#fff!important;
  color:#0b5f59!important;
  font-weight:850!important;
  box-shadow:0 3px 10px rgba(15,23,42,.09)!important;
}
html[data-theme="palette"] main :where(.practice-next-button,.interview-speak-button):hover,
html[data-theme="palette"] main :where(.practice-next-button,.interview-speak-button):focus-visible{
  background:#ecfdf5!important;
  border-color:#075e58!important;
  color:#064e49!important;
}
html[data-theme="palette"] main :where(.learning-practice-toolbar,.learning-form-actions,.learning-entry-actions,.assignment-actions,.shadow-controls) :where(button,.btn){
  min-height:40px;
}
@media(max-width:560px){
  main .btn.compact,main button.compact{min-height:42px;padding:.58rem .8rem}
}


/* v3.19.234 SEO topic cluster navigation */
.seo-home-topics{max-width:1280px;margin:22px auto;padding:28px 32px}.seo-home-topics-head h2{margin:6px 0 8px}.seo-home-topics-head p{margin:0;line-height:1.65;color:#64748b}.seo-home-topic-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:20px}.seo-home-topic-grid a{display:flex;flex-direction:column;gap:5px;padding:17px 18px;border:1px solid rgba(15,23,42,.10);border-radius:16px;text-decoration:none;background:rgba(255,255,255,.72);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.seo-home-topic-grid a:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(15,23,42,.08);border-color:rgba(15,23,42,.20)}.seo-home-topic-grid strong{color:#172033}.seo-home-topic-grid span{font-size:.9rem;color:#64748b;line-height:1.45}@media(max-width:850px){.seo-home-topics{padding:24px 20px}.seo-home-topic-grid{grid-template-columns:1fr 1fr}}@media(max-width:520px){.seo-home-topic-grid{grid-template-columns:1fr}}

/* =========================================================
   v3.19.236 — Mobile login consent + Google button repair
   Use a deterministic checkbox instead of iOS native form
   chrome, and keep the official GIS button legible at the
   final responsive card width.
   ========================================================= */
.auth-page-main .auth-terms-check{
  grid-template-columns:20px minmax(0,1fr)!important;
  gap:.62rem!important;
  align-items:start!important;
  min-width:0!important;
  padding:.66rem .72rem!important;
  border-radius:12px!important;
  cursor:pointer!important;
}
.auth-page-main .auth-terms-check input[type="checkbox"]{
  -webkit-appearance:none!important;
  appearance:none!important;
  display:grid!important;
  place-content:center!important;
  flex:0 0 20px!important;
  width:20px!important;
  min-width:20px!important;
  max-width:20px!important;
  height:20px!important;
  min-height:20px!important;
  max-height:20px!important;
  margin:.04rem 0 0!important;
  padding:0!important;
  border:2px solid #718096!important;
  border-radius:6px!important;
  background:#fff!important;
  box-shadow:0 1px 2px rgba(15,23,42,.08)!important;
  cursor:pointer!important;
}
.auth-page-main .auth-terms-check input[type="checkbox"]::before{
  content:"";
  width:9px;
  height:5px;
  border:solid #fff;
  border-width:0 0 2px 2px;
  transform:rotate(-45deg) scale(0);
  transform-origin:center;
  transition:transform .12s ease-in-out;
}
.auth-page-main .auth-terms-check input[type="checkbox"]:checked{
  border-color:#176f67!important;
  background:#176f67!important;
}
.auth-page-main .auth-terms-check input[type="checkbox"]:checked::before{
  transform:rotate(-45deg) scale(1);
}
.auth-page-main .auth-terms-check input[type="checkbox"]:focus-visible{
  outline:3px solid rgba(23,111,103,.24)!important;
  outline-offset:2px!important;
}
.auth-page-main .auth-terms-check>span{
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  color:var(--text)!important;
  font-size:.75rem!important;
  font-weight:600!important;
  line-height:1.42!important;
  overflow-wrap:anywhere!important;
}
.auth-page-main .auth-terms-check a{
  font-weight:850!important;
}
.auth-page-main .auth-card .google-signin-shell,
.auth-page-main .auth-card .google-signin-slot,
.auth-page-main .auth-card .google-signin-slot>div,
.auth-page-main .auth-card .google-signin-slot iframe{
  width:100%!important;
  min-width:0!important;
  max-width:400px!important;
}
.auth-page-main .google-signin-shell.terms-locked .google-signin-slot{
  opacity:.82!important;
  filter:saturate(.78)!important;
}
.auth-page-main .google-terms-lock-note{
  width:100%!important;
  max-width:400px!important;
  margin:2px auto 0!important;
  font-size:.68rem!important;
  line-height:1.4!important;
}
@media(max-width:640px){
  .auth-page-main .auth-terms-check{
    grid-template-columns:22px minmax(0,1fr)!important;
    gap:.65rem!important;
    padding:.68rem .72rem!important;
  }
  .auth-page-main .auth-terms-check input[type="checkbox"]{
    flex-basis:22px!important;
    width:22px!important;
    min-width:22px!important;
    max-width:22px!important;
    height:22px!important;
    min-height:22px!important;
    max-height:22px!important;
  }
  .auth-page-main .auth-terms-check>span{
    font-size:.76rem!important;
    line-height:1.45!important;
  }
}

/* =========================================================
   v3.19.245 — Home platform capability showcase
   Dedicated, scoped styles: do not alter shared landing cards.
   ========================================================= */
.home-capabilities{margin-top:clamp(30px,5vw,64px)}
.home-capability-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:24px}
.home-capability-card{position:relative;display:grid;grid-template-columns:48px minmax(0,1fr) 22px;gap:14px;align-items:center;min-height:142px;padding:20px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(145deg,var(--card),color-mix(in srgb,var(--card) 84%,var(--surface-2)));color:var(--text);text-decoration:none;box-shadow:0 10px 26px rgba(15,23,42,.045);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease}
.home-capability-card::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(135deg,rgba(215,168,67,.09),transparent 42%);opacity:.72}
.home-capability-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,#d7a843 48%,var(--line));background:linear-gradient(145deg,var(--card),color-mix(in srgb,#d7a843 7%,var(--surface-2)));box-shadow:0 18px 34px rgba(15,23,42,.10);text-decoration:none}
.home-capability-card:focus-visible,.home-special-tools-grid a:focus-visible{outline:3px solid rgba(215,168,67,.38);outline-offset:3px}
.home-capability-icon{position:relative;z-index:1;display:grid;place-items:center;width:48px;height:48px;border-radius:16px;background:linear-gradient(135deg,#0f766e,#176f67);color:#fff;font-size:1.15rem;font-weight:950;box-shadow:0 10px 20px rgba(15,118,110,.2)}
.home-capability-copy{position:relative;z-index:1;display:grid;gap:5px;min-width:0}
.home-capability-copy strong{font-size:1rem;line-height:1.28;overflow-wrap:anywhere}
.home-capability-copy small{color:var(--muted);font-size:.8rem;line-height:1.5;overflow-wrap:anywhere}
.home-capability-arrow{position:relative;z-index:1;color:#176f67;font-size:1.3rem;font-weight:900;transition:transform .18s ease}
.home-capability-card:hover .home-capability-arrow{transform:translateX(3px)}
.home-special-tools{margin-top:22px;padding:20px;border:1px solid color-mix(in srgb,#d7a843 35%,var(--line));border-radius:22px;background:linear-gradient(135deg,color-mix(in srgb,#d7a843 9%,var(--card)),var(--card))}
.home-special-tools>.eyebrow{margin-bottom:13px}
.home-special-tools-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.home-special-tools-grid a{display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;align-items:center;min-width:0;padding:12px;border:1px solid color-mix(in srgb,#d7a843 24%,var(--line));border-radius:15px;background:color-mix(in srgb,var(--card) 88%,#fff);color:var(--text);text-decoration:none;transition:transform .18s ease,border-color .18s ease,background .18s ease}
.home-special-tools-grid a:hover{transform:translateY(-2px);border-color:#d7a843;background:var(--card);text-decoration:none}
.home-special-tools-grid a>span:first-child{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;background:color-mix(in srgb,#d7a843 17%,var(--surface-2));color:#87670e;font-size:.78rem;font-weight:950}
.home-special-tools-grid a>span:last-child{display:grid;gap:2px;min-width:0}
.home-special-tools-grid strong{font-size:.78rem;line-height:1.25;overflow-wrap:anywhere}
.home-special-tools-grid small{color:var(--muted);font-size:.68rem;line-height:1.35;overflow-wrap:anywhere}
.home-capability-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
html[data-theme="dark"] .home-capability-card{box-shadow:0 12px 28px rgba(0,0,0,.22)}
html[data-theme="dark"] .home-capability-card::before{background:linear-gradient(135deg,rgba(215,168,67,.13),transparent 42%)}
html[data-theme="dark"] .home-special-tools{background:linear-gradient(135deg,color-mix(in srgb,#d7a843 12%,var(--card)),var(--card))}
html[data-theme="dark"] .home-special-tools-grid a{background:color-mix(in srgb,var(--card) 92%,#000)}
@media(max-width:1060px){.home-capability-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.home-special-tools-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.home-capability-grid,.home-special-tools-grid{grid-template-columns:1fr}.home-capability-card{min-height:126px;padding:17px;grid-template-columns:44px minmax(0,1fr) 20px;gap:12px}.home-capability-icon{width:44px;height:44px;border-radius:14px}.home-special-tools{padding:16px}.home-capability-actions .btn{width:100%;justify-content:center}}

/* =========================================================
   v3.19.246 — PDF Contributions, Reward Credits and claims
   ========================================================= */
.pdf-reward-main,.admin-pdf-rewards-main{display:grid;gap:22px;padding-bottom:48px}
.reward-hero{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(250px,.65fr);gap:22px;align-items:stretch;padding:clamp(24px,4vw,48px);border:1px solid color-mix(in srgb,#d7a843 54%,var(--line));border-radius:28px;background:radial-gradient(circle at 85% 10%,rgba(215,168,67,.2),transparent 34%),linear-gradient(145deg,var(--card),color-mix(in srgb,#0f766e 5%,var(--surface-2)));box-shadow:0 20px 45px rgba(15,23,42,.09)}
.reward-hero-copy{display:grid;align-content:center;gap:14px;min-width:0}.reward-hero h1{max-width:850px;margin:0;font-size:clamp(2rem,4.2vw,4.3rem);line-height:1.02;letter-spacing:-.045em}.reward-hero p{max-width:780px;margin:0;color:var(--muted);font-size:1rem;line-height:1.7}.reward-rule-pills{display:flex;flex-wrap:wrap;gap:9px}.reward-rule-pills span,.reward-security-mark,.reward-balance-inline{display:inline-flex;align-items:center;min-height:34px;padding:7px 12px;border:1px solid color-mix(in srgb,#d7a843 42%,var(--line));border-radius:999px;background:color-mix(in srgb,#d7a843 9%,var(--card));color:var(--text);font-size:.75rem;font-weight:850}
.reward-balance-card{display:grid;place-items:center;align-content:center;min-height:230px;padding:26px;border-radius:24px;background:linear-gradient(145deg,#0f172a,#132b3d);color:#fff;text-align:center;box-shadow:0 18px 38px rgba(15,23,42,.22)}.reward-balance-card>span{color:#cbd5e1;font-size:.75rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.reward-balance-card>strong{margin-top:10px;color:#f2ca55;font-size:clamp(3.4rem,7vw,5.8rem);line-height:.9}.reward-balance-card>b{margin-top:8px;font-size:1rem}.reward-balance-card>small{margin-top:12px;color:#cbd5e1}
.reward-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.reward-summary-grid article{display:grid;gap:4px;padding:20px;border:1px solid var(--line);border-radius:19px;background:var(--card);box-shadow:0 10px 24px rgba(15,23,42,.05)}.reward-summary-grid span{color:var(--muted);font-size:.72rem;font-weight:850;letter-spacing:.08em;text-transform:uppercase}.reward-summary-grid strong{font-size:2rem;line-height:1.1}.reward-summary-grid small{color:var(--muted)}
.reward-two-column{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:18px}.reward-form-card,.reward-how-card,.reward-section,.admin-reward-panel,.reward-integrity-note,.reward-upgrade-card{padding:clamp(20px,3vw,30px);border-radius:24px}.reward-section-heading{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:18px}.reward-section-heading>div{display:grid;gap:6px;min-width:0}.reward-section-heading h2,.reward-how-card h2,.reward-upgrade-card h2,.reward-integrity-note h2{margin:0}.reward-section-heading p,.reward-form-card>p,.reward-integrity-note p,.reward-upgrade-card p{margin:0;color:var(--muted);line-height:1.6}
.reward-upload-form{display:grid;gap:15px;margin-top:20px}.reward-upload-form label,.reward-admin-action-form>label,.reward-filter label{display:grid;gap:7px}.reward-upload-form label>span,.reward-admin-action-form label>span,.reward-filter label>span{font-size:.78rem;font-weight:850}.reward-upload-form input[type="text"],.reward-upload-form input[type="url"],.reward-upload-form input[type="file"],.reward-upload-form textarea,.reward-admin-action-form textarea,.reward-claim-review textarea,.reward-filter select{width:100%;min-width:0;padding:12px 13px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2);color:var(--text);font:inherit}.reward-upload-form input:focus,.reward-upload-form textarea:focus,.reward-admin-action-form textarea:focus,.reward-claim-review textarea:focus,.reward-filter select:focus{border-color:#0f766e;outline:3px solid rgba(15,118,110,.14)}.reward-file-field{padding:15px;border:1px dashed color-mix(in srgb,#0f766e 55%,var(--line));border-radius:15px;background:color-mix(in srgb,#0f766e 5%,var(--card))}.reward-rights-check{grid-template-columns:22px minmax(0,1fr)!important;gap:10px!important;align-items:start;padding:13px;border:1px solid var(--line);border-radius:13px}.reward-rights-check input{width:20px;height:20px;margin-top:2px}.reward-rights-check>span{font-weight:600!important;line-height:1.5}.reward-upload-form>small{color:var(--muted)}
.reward-how-card ol{display:grid;gap:13px;margin:20px 0;padding:0;list-style:none}.reward-how-card li{display:grid;grid-template-columns:38px minmax(0,1fr);gap:12px;align-items:start}.reward-how-card li>b{display:grid;place-items:center;width:38px;height:38px;border-radius:13px;background:#0f766e;color:#fff}.reward-how-card li>span{display:grid;gap:3px}.reward-how-card li small{color:var(--muted);line-height:1.45}
.reward-plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.reward-plan-card{display:grid;gap:8px;padding:20px;border:1px solid var(--line);border-radius:18px;background:var(--surface-2)}.reward-plan-card.can-claim{border-color:color-mix(in srgb,#0f766e 60%,var(--line));background:color-mix(in srgb,#0f766e 6%,var(--card));box-shadow:0 10px 24px rgba(15,118,110,.08)}.reward-plan-card>span{color:#0f766e;font-size:.7rem;font-weight:900;letter-spacing:.1em}.reward-plan-card h3{margin:0}.reward-plan-card>strong{font-size:1.5rem}.reward-plan-card>small{color:var(--muted)}.reward-plan-card form{display:grid;margin-top:8px}.reward-plan-card .btn[disabled]{cursor:not-allowed;opacity:.62}
.reward-table-wrap{max-width:100%;margin-top:20px;overflow:auto;border:1px solid var(--line);border-radius:16px}.reward-table{width:100%;min-width:850px;border-collapse:collapse}.reward-table th{padding:13px 14px;background:#0f172a;color:#fff;text-align:left;font-size:.72rem;letter-spacing:.04em}.reward-table td{padding:14px;border-bottom:1px solid var(--line);vertical-align:top}.reward-table tbody tr:last-child td{border-bottom:0}.reward-table td>strong,.reward-table td>small{display:block}.reward-table td>small{margin-top:3px;color:var(--muted)}
.reward-status{display:inline-flex;align-items:center;min-height:28px;padding:4px 9px;border:1px solid var(--line);border-radius:999px;background:var(--surface-2);font-size:.7rem;font-weight:900;white-space:nowrap}.reward-status.is-approved,.reward-status.is-sent{border-color:#86d2aa;background:#e8f8ef;color:#12643b}.reward-status.is-pending{border-color:#ecd37c;background:#fff8d9;color:#80610b}.reward-status.is-rejected,.reward-status.is-failed{border-color:#efaaaa;background:#fdeaea;color:#a62d2d}.reward-status.is-cancelled,.reward-status.is-withdrawn{color:var(--muted)}
.admin-reward-kpis{grid-template-columns:repeat(5,minmax(0,1fr))}.admin-reward-panel{display:grid;gap:2px}.reward-filter{min-width:170px}.reward-filter select{padding:9px 11px}.reward-admin-list{display:grid;gap:15px}.reward-admin-item{display:grid;gap:16px;padding:20px;border:1px solid var(--line);border-radius:18px;background:var(--surface-2)}.reward-admin-item-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.reward-admin-item-head>div{display:grid;gap:6px;min-width:0}.reward-admin-item-head h3,.reward-admin-item-head p{margin:0;overflow-wrap:anywhere}.reward-admin-item-head p{color:var(--muted);font-size:.8rem}.reward-admin-meta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0}.reward-admin-meta>div{display:grid;gap:4px;min-width:0;padding:11px;border:1px solid var(--line);border-radius:12px;background:var(--card)}.reward-admin-meta .is-wide{grid-column:1/-1}.reward-admin-meta dt{color:var(--muted);font-size:.67rem;font-weight:850;letter-spacing:.06em;text-transform:uppercase}.reward-admin-meta dd{margin:0;font-size:.8rem;overflow-wrap:anywhere}.reward-admin-meta code{font-size:.68rem;word-break:break-all}.reward-admin-action-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:13px;align-items:end}.reward-admin-action-form>div,.reward-claim-review>div{display:flex;flex-wrap:wrap;gap:8px}.reward-claim-review{display:grid;gap:8px;margin-top:9px}.reward-warning{display:block;margin-top:6px;color:#a62d2d;font-size:.68rem;font-weight:850}.reward-integrity-note{border-color:color-mix(in srgb,#0f766e 38%,var(--line));background:color-mix(in srgb,#0f766e 5%,var(--card))}
html[data-theme="dark"] .reward-status.is-approved,html[data-theme="dark"] .reward-status.is-sent{background:rgba(18,100,59,.22);color:#9ee9bd}html[data-theme="dark"] .reward-status.is-pending{background:rgba(128,97,11,.28);color:#f7db76}html[data-theme="dark"] .reward-status.is-rejected,html[data-theme="dark"] .reward-status.is-failed{background:rgba(166,45,45,.25);color:#ffaaaa}
@media(max-width:1120px){.admin-reward-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.reward-admin-meta{grid-template-columns:repeat(2,minmax(0,1fr))}.reward-plan-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:860px){.reward-hero,.reward-two-column{grid-template-columns:1fr}.reward-balance-card{min-height:190px}.reward-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.reward-admin-action-form{grid-template-columns:1fr}.admin-reward-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.reward-hero{padding:22px;border-radius:22px}.reward-hero h1{font-size:2.25rem}.reward-rule-pills{display:grid}.reward-summary-grid,.reward-plan-grid,.admin-reward-kpis,.reward-admin-meta{grid-template-columns:1fr}.reward-section-heading,.reward-admin-item-head{display:grid}.reward-balance-inline,.reward-security-mark{justify-self:start}.reward-admin-action-form>div .btn,.reward-claim-review>div .btn,.reward-upload-form>.btn{width:100%;justify-content:center}}

/* v3.19.246 follow-up — admin-only stored PDF purge control. */
.admin-pdf-rewards-main .reward-admin-purge-form{display:flex;flex-wrap:wrap;align-items:center;gap:9px;padding-top:2px}
.admin-pdf-rewards-main .reward-admin-purge-form small{color:var(--muted);font-size:.7rem}
.auth-verification-code{
  text-align:center;
  font-size:clamp(1.55rem,4vw,2rem)!important;
  font-weight:900;
  letter-spacing:.28em;
  font-variant-numeric:tabular-nums;
}
.auth-verification-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:18px;
  flex-wrap:wrap;
}
.auth-verification-actions form{margin:0}
.auth-verification-note{margin-top:18px;line-height:1.65}
@media (max-width:560px){
  .auth-verification-actions,.auth-verification-actions form,.auth-verification-actions .btn{width:100%}
  .auth-verification-code{letter-spacing:.18em}
}

/* Long-form blog editions: keep all table-of-contents links reachable. */
@media(min-width:821px){
  .article-public-page .article-toc{max-height:calc(100vh - 116px);overflow-y:auto;overscroll-behavior:contain}
}
.article-public-page .article-content section{scroll-margin-top:110px}
.article-public-page .article-language-note{padding:12px 16px;border-left:3px solid var(--minimal-primary);background:var(--surface-2);line-height:1.7}
.article-public-page .article-sources ol{display:grid;gap:12px;padding-left:1.4rem;line-height:1.7;overflow-wrap:anywhere}

/* =========================================================
   v3.19.261 — Free-flow Blog heading and unified discovery
   ========================================================= */
.blog-public-page .blog-free-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:clamp(24px,5vw,64px);
  align-items:end;
  padding:clamp(4px,1vw,12px) 0 clamp(22px,3vw,34px);
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.blog-public-page .blog-free-head-copy{
  display:grid;
  justify-items:start;
  gap:.45rem;
  min-width:0;
}
.blog-public-page .blog-free-head .eyebrow{margin:0;color:var(--teal)}
.blog-public-page .blog-free-head h1{
  max-width:820px;
  margin:.08rem 0;
  color:var(--text);
  font-size:clamp(2.15rem,4.3vw,4rem);
  line-height:1.04;
  letter-spacing:-.045em;
}
.blog-public-page .blog-free-head p{
  max-width:820px;
  margin:0;
  color:var(--muted);
  font-size:clamp(.95rem,1.4vw,1.04rem);
  line-height:1.72;
}
.blog-public-page .blog-free-head-stats{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:18px;
  padding-bottom:3px;
}
.blog-public-page .blog-free-head-stats>span{
  display:grid;
  gap:2px;
  min-width:108px;
  padding-left:18px;
  border-left:1px solid var(--minimal-border);
}
.blog-public-page .blog-free-head-stats strong{
  color:var(--text);
  font-size:clamp(1.4rem,2.2vw,1.9rem);
  line-height:1.05;
  font-variant-numeric:tabular-nums;
}
.blog-public-page .blog-free-head-stats small{
  max-width:128px;
  color:var(--muted);
  font-size:.7rem;
  font-weight:800;
  line-height:1.35;
}
.blog-public-page .blog-discovery-form{
  display:grid;
  grid-template-columns:minmax(260px,1fr) minmax(230px,.64fr) auto auto;
  gap:10px;
  align-items:center;
  width:100%;
  margin:0 0 clamp(26px,4vw,40px);
  padding:12px;
  border:1px solid var(--minimal-border);
  border-radius:18px;
  background:var(--minimal-surface);
  box-shadow:var(--minimal-shadow);
}
.blog-public-page .blog-discovery-search{min-width:0}
.blog-public-page .blog-discovery-search input{
  width:100%;
  min-height:50px;
  margin:0;
  padding:0 16px;
  border:1px solid var(--minimal-border);
  border-radius:14px;
  outline:0;
  background:var(--surface-2);
  color:var(--text);
  font:inherit;
  font-size:.9rem;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.blog-public-page .blog-discovery-search input::placeholder{color:var(--muted);opacity:.9}
.blog-public-page .blog-discovery-search input:hover{
  border-color:color-mix(in srgb,var(--accent) 55%,var(--minimal-border));
}
.blog-public-page .blog-discovery-search input:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 18%,transparent);
}
.blog-public-page .blog-discovery-form .blog-category-select-shell select:hover{
  border-color:color-mix(in srgb,var(--accent) 55%,var(--minimal-border));
}
.blog-public-page .blog-discovery-form .blog-category-select-shell select:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 18%,transparent);
}
.blog-public-page .blog-discovery-form button,
.blog-public-page .blog-discovery-clear{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:50px;
  padding:0 22px;
  border:1px solid var(--accent);
  border-radius:14px;
  font:inherit;
  font-size:.86rem;
  font-weight:900;
  line-height:1;
  white-space:nowrap;
  cursor:pointer;
  transition:transform .18s ease,filter .18s ease,border-color .18s ease,background .18s ease;
}
.blog-public-page .blog-discovery-form button{
  border-color:#c9a227;
  background:linear-gradient(135deg,#e2bd40,#c9a227);
  color:#0f172a;
  box-shadow:0 10px 22px rgba(201,162,39,.22);
}
.blog-public-page .blog-discovery-clear{
  border-color:var(--minimal-border);
  background:var(--surface-2);
  color:var(--text);
  text-decoration:none;
}
.blog-public-page .blog-discovery-form button:hover,
.blog-public-page .blog-discovery-clear:hover{transform:translateY(-1px);filter:brightness(1.04);text-decoration:none}
.blog-public-page .blog-list-head{margin-top:0}
html[data-theme="dark"] .blog-public-page .blog-discovery-form{box-shadow:0 16px 36px rgba(0,0,0,.22)}

@media(max-width:920px){
  .blog-public-page .blog-free-head{grid-template-columns:1fr;gap:20px;align-items:start}
  .blog-public-page .blog-free-head-stats{justify-content:flex-start}
  .blog-public-page .blog-discovery-form{grid-template-columns:minmax(0,1fr) minmax(220px,.72fr)}
  .blog-public-page .blog-discovery-form button,
  .blog-public-page .blog-discovery-clear{width:100%}
}
@media(max-width:620px){
  .blog-public-page .blog-free-head{padding-bottom:20px}
  .blog-public-page .blog-free-head h1{font-size:clamp(2rem,11vw,3rem)}
  .blog-public-page .blog-free-head-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;width:100%}
  .blog-public-page .blog-free-head-stats>span{min-width:0;padding:0 0 0 10px}
  .blog-public-page .blog-free-head-stats strong{font-size:1.3rem}
  .blog-public-page .blog-free-head-stats small{font-size:.64rem}
  .blog-public-page .blog-discovery-form{grid-template-columns:1fr;padding:10px;border-radius:16px}
}

/* =========================================================
   v3.19.262 — Unified site width and page gutters
   All shared user-facing page shells, the header and footer
   now align to one centered 1320px desktop grid.
   ========================================================= */
:root{
  --jpfz-site-content-max:1320px;
  --jpfz-site-desktop-gutter:32px;
  --jpfz-site-mobile-gutter:20px;
}

@media screen and (min-width:701px){
  html body main.container:not(.narrow),
  html[data-theme="palette"] body main.container:not(.narrow),
  html[data-theme="palette"] body main.container.compact-home-main,
  html[data-theme="palette"] body main.container.exam-container{
    width:min(var(--jpfz-site-content-max),calc(100% - 64px))!important;
    max-width:var(--jpfz-site-content-max)!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }

  html[data-theme="palette"] body .topbar,
  html body .topbar{
    padding-left:max(var(--jpfz-site-desktop-gutter),calc((100vw - var(--jpfz-site-content-max))/2))!important;
    padding-right:max(var(--jpfz-site-desktop-gutter),calc((100vw - var(--jpfz-site-content-max))/2))!important;
  }

  html[data-theme="palette"] body .site-footer .footer-inner.footer-grid,
  html body .site-footer .footer-inner.footer-grid{
    width:min(var(--jpfz-site-content-max),calc(100% - 64px))!important;
    max-width:var(--jpfz-site-content-max)!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
}

@media screen and (max-width:700px){
  html body main.container,
  html[data-theme="palette"] body main.container,
  html[data-theme="palette"] body main.container.compact-home-main,
  html[data-theme="palette"] body main.container.exam-container{
    width:auto!important;
    max-width:none!important;
    margin-left:var(--jpfz-site-mobile-gutter)!important;
    margin-right:var(--jpfz-site-mobile-gutter)!important;
  }

  html[data-theme="palette"] body .topbar,
  html body .topbar{
    padding-left:var(--jpfz-site-mobile-gutter)!important;
    padding-right:var(--jpfz-site-mobile-gutter)!important;
  }

  html[data-theme="palette"] body .site-footer .footer-inner.footer-grid,
  html body .site-footer .footer-inner.footer-grid{
    width:auto!important;
    max-width:none!important;
    margin-left:var(--jpfz-site-mobile-gutter)!important;
    margin-right:var(--jpfz-site-mobile-gutter)!important;
  }
}

@media screen and (max-width:380px){
  :root{--jpfz-site-mobile-gutter:16px}
}

/* =========================================================
   v3.19.263 — Others portal full-width card grid
   The two-column tool grid now fills the same shared content
   width as its heading instead of stopping at 776px.
   ========================================================= */
.others-portal-main .others-portal-grid{
  width:100%;
  max-width:none;
  grid-template-columns:repeat(2,minmax(0,1fr));
  justify-content:stretch;
}

@media screen and (max-width:480px){
  .others-portal-main .others-portal-grid{grid-template-columns:1fr}
}

/* =========================================================
   v3.19.264 — Live MCQ examination quality controls
   ========================================================= */
.exam-quality-main{display:grid;gap:22px}
.exam-quality-head{margin-bottom:0}
.exam-quality-head .actions form{margin:0}
.exam-quality-notice,.exam-bank-quality-strip{
  display:flex;align-items:center;gap:22px;padding:18px 20px;border:1px solid #f1c96b;
  border-radius:18px;background:linear-gradient(135deg,#fff9e8,#fff);box-shadow:0 14px 35px rgba(15,23,42,.08)
}
.exam-quality-notice>div,.exam-bank-quality-strip>div{display:grid;gap:4px;min-width:170px}
.exam-quality-notice>div strong,.exam-bank-quality-strip>div strong{font-size:1.05rem;color:#9a6700}
.exam-quality-notice p,.exam-bank-quality-strip p{margin:0;flex:1;color:var(--muted,#64748b)}
.exam-quality-notice.is-pass,.exam-bank-quality-strip.is-pass{border-color:#7bd7c4;background:linear-gradient(135deg,#ecfdf8,#fff)}
.exam-quality-notice.is-pass>div strong,.exam-bank-quality-strip.is-pass>div strong{color:#087f72}
.exam-quality-metrics{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.exam-quality-metrics article{display:grid;gap:5px;padding:18px;border:1px solid rgba(148,163,184,.3);border-radius:16px;background:#fff;box-shadow:0 10px 26px rgba(15,23,42,.07)}
.exam-quality-metrics strong{font-size:1.65rem;color:var(--ink,#0f172a)}
.exam-quality-metrics span{font-size:.78rem;font-weight:800;color:var(--muted,#64748b)}
.exam-quality-table-card{min-width:0}
.exam-quality-table td>small{display:block;margin-top:4px;color:var(--muted,#64748b)}
.exam-quality-status{display:inline-flex;padding:5px 9px;border-radius:999px;background:#fff2d4;color:#9a6700;font-size:.72rem;font-weight:900;letter-spacing:.06em}
.exam-quality-status.is-pass{background:#dff8f1;color:#087f72}
.exam-quality-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:22px}
.exam-quality-workflow{display:grid;gap:12px;margin:0;padding:0;list-style:none;counter-reset:quality-step}
.exam-quality-workflow li{display:grid;grid-template-columns:34px 135px 1fr;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid rgba(148,163,184,.22);counter-increment:quality-step}
.exam-quality-workflow li:before{content:counter(quality-step);display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:#e9f4f7;color:#075985;font-weight:900}
.exam-quality-workflow span,.exam-source-list span,.exam-source-list small{color:var(--muted,#64748b);font-size:.82rem}
.exam-source-list{display:grid;gap:9px}
.exam-source-list a{display:grid;gap:3px;padding:12px 14px;border:1px solid rgba(148,163,184,.25);border-radius:13px;color:inherit;text-decoration:none;background:#fff}
.exam-source-list a:hover{border-color:#d4aa22;transform:translateY(-1px)}
.exam-ssw-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:16px}
.exam-ssw-grid>div{display:grid;gap:3px;padding:12px;border:1px solid rgba(148,163,184,.25);border-radius:13px;background:#fff}
.exam-ssw-grid span,.exam-ssw-grid small{color:var(--muted,#64748b);font-size:.78rem}
.exam-bank-quality-strip{margin:18px 0}
.exam-n5-plan-card{display:grid;gap:18px}
.exam-n5-plan-card>.card-heading{margin-bottom:0}
.exam-n5-plan-card>.muted{margin:0}
.exam-n5-plan-metrics{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.exam-n5-plan-metrics>div{display:grid;gap:5px;padding:15px;border:1px solid rgba(148,163,184,.25);border-radius:14px;background:linear-gradient(145deg,#f8fafc,#fff)}
.exam-n5-plan-metrics strong{font-size:1.15rem;color:var(--ink,#0f172a)}
.exam-n5-plan-metrics span{color:var(--muted,#64748b);font-size:.75rem;font-weight:800}
.exam-n5-plan-layout{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);gap:20px}
.exam-n5-plan-layout h3{margin:0 0 12px;font-size:1rem}
.exam-n5-item-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.exam-n5-item-grid>div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 11px;border:1px solid rgba(148,163,184,.22);border-radius:11px;background:#fff}
.exam-n5-item-grid span{font-size:.76rem;color:var(--muted,#64748b)}
.exam-n5-item-grid strong{font-size:.82rem;color:var(--ink,#0f172a)}
.exam-n5-gates{display:grid;gap:9px;margin:0;padding:0;list-style:none}
.exam-n5-gates li{display:grid;gap:3px;padding:10px 12px;border-left:3px solid #d4aa22;border-radius:0 10px 10px 0;background:#fffbeb}
.exam-n5-gates strong{font-size:.8rem;color:var(--ink,#0f172a)}
.exam-n5-gates span{font-size:.76rem;color:var(--muted,#64748b)}
.admin-quality-fieldset{margin:18px 0;padding:16px;border:1px solid rgba(148,163,184,.35);border-radius:14px}
.admin-quality-fieldset legend{padding:0 8px;font-weight:900;color:var(--ink,#0f172a)}
.admin-quality-checks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0}
.admin-quality-checks .admin-check{margin:0;padding:12px;border:1px solid rgba(148,163,184,.25);border-radius:12px;background:#f8fafc}

@media(max-width:1100px){
  .exam-quality-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}
  .exam-quality-grid{grid-template-columns:1fr}
  .exam-n5-plan-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}
  .exam-n5-plan-layout{grid-template-columns:1fr}
  .exam-ssw-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .admin-quality-checks{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
  .exam-quality-notice,.exam-bank-quality-strip{align-items:flex-start;flex-direction:column;gap:12px}
  .exam-quality-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .exam-quality-workflow li{grid-template-columns:34px 1fr}
  .exam-quality-workflow li span{grid-column:2}
  .exam-n5-plan-metrics,.exam-n5-item-grid{grid-template-columns:1fr}
  .exam-ssw-grid,.admin-quality-checks{grid-template-columns:1fr}
}

/* =========================================================
   v3.19.268 — JLPT N5 human concept review workspace
   ========================================================= */
.exam-concept-review-main{display:grid;gap:20px}
.exam-concept-review-head{margin-bottom:0}
.exam-concept-safety-note{
  display:flex;align-items:center;gap:14px;padding:15px 18px;border:1px solid #e8bf4d;
  border-radius:15px;background:linear-gradient(135deg,#fff8dc,#fff);box-shadow:0 10px 28px rgba(15,23,42,.07)
}
.exam-concept-safety-note strong{white-space:nowrap;color:#8a5b00}
.exam-concept-safety-note span{color:var(--muted,#64748b);font-size:.86rem;line-height:1.55}
.exam-concept-safety-note code{padding:2px 6px;border-radius:6px;background:#fff0b6;color:#654700}
.exam-concept-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.exam-concept-metrics article{display:grid;gap:5px;padding:17px 18px;border:1px solid rgba(148,163,184,.3);border-radius:16px;background:#fff;box-shadow:0 10px 26px rgba(15,23,42,.07)}
.exam-concept-metrics strong{font-size:1.55rem;color:var(--ink,#0f172a)}
.exam-concept-metrics span{font-size:.78rem;font-weight:800;color:var(--muted,#64748b)}
.exam-concept-progress-card{display:grid;grid-template-columns:auto minmax(200px,1fr);gap:20px;align-items:center;padding:17px 20px}
.exam-concept-progress-card>div:first-child{display:flex;align-items:baseline;gap:10px;white-space:nowrap}
.exam-concept-progress-card strong{font-size:1.2rem;color:#087f72}
.exam-concept-progress-card span{font-size:.82rem;font-weight:800;color:var(--muted,#64748b)}
.exam-concept-progress{height:12px;overflow:hidden;border-radius:999px;background:#e7eef2}
.exam-concept-progress>span{display:block;height:100%;min-width:0;border-radius:inherit;background:linear-gradient(90deg,#0f8f85,#38c5ae);transition:width .25s ease}
.exam-concept-filters{margin:0}
.exam-concept-filters .admin-picker-grid{grid-template-columns:1.2fr .75fr 1.1fr 1fr auto}
.exam-concept-review-layout{display:grid;grid-template-columns:minmax(320px,390px) minmax(0,1fr);gap:20px;align-items:start;min-width:0}
.exam-concept-list-card,.exam-concept-editor-card{min-width:0;padding:18px}
.exam-concept-list-card{position:sticky;top:92px}
.exam-concept-list-card>.card-heading,.exam-concept-editor-card>.card-heading{margin-bottom:14px}
.exam-concept-list{display:grid;gap:7px;max-height:740px;overflow:auto;padding-right:5px;scrollbar-width:thin}
.exam-concept-row{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px;border:1px solid rgba(148,163,184,.26);border-radius:12px;color:inherit;text-decoration:none;background:#fff}
.exam-concept-row:hover{border-color:#d4aa22;box-shadow:0 8px 20px rgba(15,23,42,.08);transform:translateY(-1px)}
.exam-concept-row.active{border-color:#0f8f85;background:#effcf9;box-shadow:0 0 0 2px rgba(15,143,133,.1)}
.exam-concept-number{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#e8f2f6;color:#0f4c64;font-size:.72rem;font-weight:900}
.exam-concept-row>span:nth-child(2){display:grid;gap:3px;min-width:0}
.exam-concept-row>span:nth-child(2) strong{font-size:.77rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.exam-concept-row>span:nth-child(2) small{display:-webkit-box;overflow:hidden;color:var(--muted,#64748b);font-size:.72rem;line-height:1.35;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.exam-review-badge{display:inline-flex;align-items:center;justify-content:center;padding:5px 8px;border-radius:999px;background:#fff0c7;color:#8a5b00;font-size:.66rem;font-style:normal;font-weight:900;letter-spacing:.03em;white-space:nowrap}
.exam-review-badge.is-approved{background:#dff8f1;color:#087f72}
.exam-review-badge.is-needs-changes{background:#ffe2e7;color:#aa183a}
.exam-concept-fixed-meta{display:grid;grid-template-columns:.75fr .75fr 1.5fr;gap:9px;margin-bottom:18px}
.exam-concept-fixed-meta>div{display:grid;gap:3px;min-width:0;padding:11px 12px;border:1px solid rgba(148,163,184,.24);border-radius:11px;background:#f8fafc}
.exam-concept-fixed-meta span{font-size:.67rem;font-weight:900;text-transform:uppercase;letter-spacing:.06em;color:var(--muted,#64748b)}
.exam-concept-fixed-meta strong,.exam-concept-fixed-meta code{overflow-wrap:anywhere;font-size:.78rem;color:var(--ink,#0f172a)}
.exam-concept-form{display:grid;gap:14px}
.exam-concept-form>label,.exam-concept-form .admin-form-grid label{display:grid;gap:6px}
.exam-concept-form>label>span,.exam-concept-form .admin-form-grid label>span{font-size:.76rem;font-weight:900;color:var(--ink,#0f172a)}
.exam-concept-form textarea{resize:vertical;min-height:76px}
.exam-concept-checklist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:2px 0}
.exam-concept-checklist legend{grid-column:1/-1}
.exam-concept-checklist .admin-check{display:flex;align-items:flex-start;gap:9px;margin:0;padding:11px;border:1px solid rgba(148,163,184,.25);border-radius:11px;background:#f8fafc;font-size:.78rem;line-height:1.4}
.exam-concept-checklist input{margin-top:2px;accent-color:#0f8f85}
.exam-concept-review-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.exam-concept-review-actions .btn{width:100%}
.exam-review-audit{margin:0;padding:10px 12px;border-radius:10px;background:#f5f7fa;color:var(--muted,#64748b);font-size:.73rem}
.exam-concept-source-details{margin-top:18px;border-top:1px solid rgba(148,163,184,.25);padding-top:16px}
.exam-concept-source-details summary{cursor:pointer;font-weight:900;color:var(--ink,#0f172a)}
.exam-concept-source-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:12px}
.exam-concept-source-list article{display:grid;gap:3px;padding:12px;border:1px solid rgba(148,163,184,.25);border-radius:11px;background:#f8fafc}
.exam-concept-source-list span,.exam-concept-source-list small{font-size:.73rem;color:var(--muted,#64748b)}
.exam-concept-source-list a{font-size:.74rem;font-weight:900;color:#087f72}
.exam-concept-empty{display:grid;place-items:center;min-height:320px;text-align:center;color:var(--muted,#64748b)}
.exam-concept-empty h2{margin-bottom:4px;color:var(--ink,#0f172a)}

@media(max-width:1180px){
  .exam-concept-filters .admin-picker-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .exam-concept-filters .admin-picker-grid .btn{align-self:end}
}
@media(max-width:980px){
  .exam-concept-review-layout{grid-template-columns:1fr}
  .exam-concept-list-card{position:static}
  .exam-concept-list{max-height:440px}
}
@media(max-width:700px){
  .exam-concept-safety-note{align-items:flex-start;flex-direction:column;gap:7px}
  .exam-concept-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .exam-concept-progress-card{grid-template-columns:1fr;gap:10px}
  .exam-concept-filters .admin-picker-grid{grid-template-columns:1fr}
  .exam-concept-fixed-meta,.exam-concept-checklist,.exam-concept-review-actions,.exam-concept-source-list{grid-template-columns:1fr}
}
@media(max-width:430px){
  .exam-concept-metrics{grid-template-columns:1fr}
  .exam-concept-row{grid-template-columns:38px minmax(0,1fr)}
  .exam-concept-number{width:38px;height:38px}
  .exam-concept-row .exam-review-badge{grid-column:2;justify-self:start}
}