:root{--ink:#1e2a35;--muted:#71808c;--line:#e3e9e8;--paper:#fff;--canvas:#f4f7f5;--green:#176b56;--green-soft:#eaf5f0;--gold:#e8b85e;--red:#aa4941;--shadow:0 12px 35px #23352b0c}
*{box-sizing:border-box}body{margin:0;background:var(--canvas);color:var(--ink);font:15px/1.55 'DM Sans',Arial,sans-serif}.topbar{height:74px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 max(28px,calc((100vw - 1320px)/2));}.brand{display:flex;align-items:center;gap:12px}.brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:var(--green);color:white;font:800 19px Arial,sans-serif}.brand strong,.brand small{display:block}.brand strong{font:700 15px Arial,sans-serif}.brand small{font-size:12px;color:var(--muted)}.local-note{font-size:12px;color:#607167}.local-note i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#52a884;margin-right:7px}main{max-width:1320px;margin:auto;padding:39px 28px 30px}.intro{display:flex;justify-content:space-between;align-items:center;margin:0 0 28px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:.14em;color:var(--green);margin:0 0 7px}.intro h1{font:800 31px/1.2 Arial,sans-serif;margin:0;letter-spacing:-.04em}.subhead{margin:7px 0 0;color:var(--muted)}.progress-card{background:#fff;border:1px solid var(--line);border-radius:13px;padding:11px 17px;min-width:126px;box-shadow:var(--shadow)}.progress-card span,.progress-card small{display:block;font-size:11px;color:var(--muted)}.progress-card strong{font:800 23px Arial,sans-serif;margin-right:4px}.filters{display:grid;grid-template-columns:1fr 1.2fr .9fr 1.5fr;gap:12px;padding:16px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);margin-bottom:18px}.filters label{font-size:11px;font-weight:700;color:#66747d}.filters select,.filters input{display:block;width:100%;height:40px;margin-top:5px;padding:0 11px;border:1px solid var(--line);border-radius:8px;background:white;color:var(--ink);font:500 13px Arial,sans-serif;outline-color:#8cb8a8}.practice-layout{display:grid;grid-template-columns:240px minmax(0,1fr);gap:18px;align-items:start}.question-nav,.question-card{background:white;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}.question-nav{padding:15px;position:sticky;top:15px;max-height:calc(100vh - 30px);overflow:auto}.nav-heading{display:flex;justify-content:space-between;font:700 13px Arial,sans-serif;margin-bottom:12px}.nav-heading span{color:var(--muted);font:500 11px Arial,sans-serif}.question-list{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}.q-nav-button{height:34px;border:1px solid var(--line);border-radius:8px;background:white;color:#596873;font:600 12px Arial,sans-serif;cursor:pointer}.q-nav-button:hover,.q-nav-button.active{border-color:var(--green);color:var(--green);background:var(--green-soft)}.q-nav-button.done{background:#f0f5f2}.question-card{min-height:470px;padding:28px 32px}.crumb{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;line-height:1.3;color:var(--muted);margin:0 0 12px}.question-head{display:flex;align-items:center;gap:10px;margin-bottom:16px}.question-head h2{font:700 18px Arial,sans-serif;margin:0}.topic-pill{padding:4px 9px;background:#f1f5f3;color:#536e62;border-radius:20px;font-size:10px;font-weight:700}.prompt{font-size:16px;line-height:1.72;white-space:pre-line;margin:0 0 17px}.stimulus{display:block;width:min(100%,680px);max-width:min(100%,680px);max-height:460px;object-fit:contain;object-position:left center;margin:10px 0 21px;border:1px solid var(--line);border-radius:10px;background:#fff;padding:8px}.choices{display:grid;gap:9px;max-width:780px}.choice{display:flex;align-items:flex-start;gap:12px;width:100%;text-align:left;padding:11px 14px;border:1px solid var(--line);border-radius:10px;background:white;color:var(--ink);font:14px/1.55 Arial,sans-serif;cursor:pointer;transition:.15s}.choice:hover:not(:disabled){border-color:#83ae9e;background:#fbfdfc}.choice .letter{flex:0 0 25px;height:25px;display:grid;place-items:center;border-radius:50%;background:#f2f5f4;color:#53666e;font-size:11px;font-weight:700}.choice.correct{border-color:#69a88d;background:#f0f8f4}.choice.correct .letter{background:#d7eee2;color:#176b56}.choice.incorrect{border-color:#cf8179;background:#fff7f5}.choice.incorrect .letter{background:#f8e2df;color:var(--red)}.choice:disabled{cursor:default}.feedback{margin-top:18px;padding:16px 18px;background:#f7faf8;border:1px solid var(--line);border-radius:11px}.feedback-top{font:700 14px Arial,sans-serif;margin-bottom:8px}.feedback-top.right{color:var(--green)}.feedback-top.wrong{color:var(--red)}.solution{font-size:14px;line-height:1.72;white-space:pre-line}.solution-visual{width:min(100%,660px);max-width:min(100%,660px);max-height:420px;object-fit:contain;object-position:left center;margin-top:12px;border:1px solid var(--line);border-radius:9px}.source-note{font-size:10px;color:#87929a;margin-top:20px}.empty{padding:34px;text-align:center;color:var(--muted)}footer{text-align:center;color:#87929a;font-size:11px;padding:22px 0 0}@media(max-width:800px){main{padding:25px 16px}.topbar{padding:0 17px}.intro h1{font-size:26px}.filters{grid-template-columns:1fr 1fr}.search-label{grid-column:span 2}.practice-layout{grid-template-columns:1fr}.question-nav{position:static;max-height:190px;order:2}.question-card{padding:23px 18px}.question-list{grid-template-columns:repeat(10,1fr)}}@media(max-width:460px){.intro{align-items:flex-start;gap:8px}.progress-card{min-width:auto;padding:8px 10px}.intro h1{font-size:22px}.subhead{font-size:13px}.question-list{grid-template-columns:repeat(7,1fr)}.filters{gap:8px;padding:11px}}

.auth-card{max-width:440px;margin:9vh auto 0;padding:30px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow)}.auth-card h1{font:800 27px/1.2 Arial,sans-serif;margin:0}.auth-card form{display:grid;gap:14px;margin-top:24px}.auth-card label{font-size:12px;font-weight:700;color:#66747d}.auth-card input{display:block;width:100%;height:44px;margin-top:6px;padding:0 12px;border:1px solid var(--line);border-radius:8px;font:14px Arial,sans-serif}.sign-in-button{height:44px;border:0;border-radius:8px;background:var(--green);color:#fff;font-weight:700;cursor:pointer}.sign-in-button:disabled{opacity:.6}#auth-message{min-height:20px;color:var(--red);font-size:12px}.local-note.offline{color:var(--red)}footer button{margin-left:10px;border:0;background:none;color:var(--green);font-weight:700;cursor:pointer}

.text-button{margin-top:12px;padding:0;border:0;background:none;color:var(--green);font:600 12px Arial,sans-serif;cursor:pointer;text-align:left}.text-button:hover{text-decoration:underline}

/* Compact responsive controls shared by phone, tablet, and desktop. */
.header-actions{display:flex;align-items:center;gap:18px}.profile-wrap{position:relative}.profile-toggle{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:22px;background:#fff;padding:5px 11px 5px 5px;color:var(--ink);font:600 12px Arial,sans-serif;cursor:pointer}.profile-avatar{display:grid;place-items:center;width:29px;height:29px;border-radius:50%;background:var(--green-soft);color:var(--green);font-weight:800}.profile-chevron{font-size:11px;color:var(--muted)}.profile-menu{position:absolute;z-index:20;right:0;top:calc(100% + 10px);width:min(310px,calc(100vw - 28px));padding:17px;background:#fff;border:1px solid var(--line);border-radius:13px;box-shadow:0 14px 40px #1d352c22}.profile-menu[hidden],.profile-wrap[hidden]{display:none}.profile-eyebrow{margin:0 0 4px;font-size:10px;font-weight:800;letter-spacing:.12em;color:var(--green)}.profile-email{margin:0 0 15px;color:var(--muted);font-size:12px;overflow-wrap:anywhere}.profile-name-label{display:block;margin-bottom:5px;font-size:11px;font-weight:700;color:#66747d}.profile-menu input{width:100%;height:39px;padding:0 10px;border:1px solid var(--line);border-radius:8px;font:14px Arial,sans-serif}.profile-message{min-height:18px;margin:5px 0;color:var(--muted);font-size:11px}.profile-actions{display:flex;justify-content:space-between;gap:8px}.profile-actions button,.reset-progress,.question-controls button,.mode-switch button{border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);font:600 12px Arial,sans-serif;padding:9px 12px;cursor:pointer}.profile-actions #save-profile,.mode-switch button[aria-pressed=true]{border-color:var(--green);background:var(--green);color:#fff}.profile-actions .profile-sign-out{color:#9c3f39}.progress-card .reset-progress{margin-top:8px;padding:6px 8px;font-size:10px}.mode-switch{display:flex;gap:8px;margin:-12px 0 18px}.mode-switch button{display:flex;align-items:center;gap:8px}.mode-switch button span{font-size:10px;opacity:.78}.question-head{flex-wrap:wrap}.question-timer{margin-left:auto;padding:6px 10px;border-radius:20px;background:#f3f6f4;color:#53666e;font:600 11px Arial,sans-serif;white-space:nowrap}.speed-countdown{color:var(--green);font-weight:700}.solution-content{display:grid;gap:10px;margin-top:8px}.solution-text{margin:0;white-space:pre-line}.solution-table-wrap{max-width:100%;overflow-x:auto;border:1px solid var(--line);border-radius:8px}.solution-table{width:100%;border-collapse:collapse;font-size:13px;line-height:1.45}.solution-table th,.solution-table td{padding:8px 10px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line);border-right:1px solid var(--line)}.solution-table th{background:#f2f6f3;font-weight:700}.solution-table tr:last-child td{border-bottom:0}.solution-table th:last-child,.solution-table td:last-child{border-right:0}.question-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:18px;padding-top:13px;border-top:1px solid var(--line)}.question-controls button:disabled{opacity:.45;cursor:default}.question-position{color:var(--muted);font-size:11px}.question-control-group{display:flex;gap:8px}.question-controls .next-question{border-color:var(--green);background:var(--green);color:white}
@media(max-width:600px){.topbar{height:auto;min-height:64px;padding:10px 13px}.brand{gap:8px}.brand-mark{width:33px;height:33px}.brand strong{font-size:13px}.brand small{font-size:10px}.header-actions{gap:9px}.local-note{font-size:0}.local-note i{margin-right:0}.profile-toggle{gap:6px;padding:4px 8px 4px 4px}.profile-avatar{width:27px;height:27px}.profile-toggle #profile-label{max-width:88px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mode-switch{margin-top:-8px}.mode-switch button{flex:1;justify-content:center;flex-wrap:wrap;padding:8px 6px}.mode-switch button span{width:100%;text-align:center}.question-head h2{font-size:16px}.question-timer{margin-left:0}.question-controls{position:sticky;bottom:0;background:#fff;padding:10px 0 calc(10px + env(safe-area-inset-bottom));z-index:3}.question-controls button{padding:10px}.solution-table{min-width:520px}.intro{margin-bottom:20px}.progress-card{max-width:112px}.question-card{min-height:0}}
@media(max-width:600px){.question-nav,.question-list{min-width:0;width:100%}.question-list{grid-template-columns:repeat(7,minmax(0,1fr))}.q-nav-button{min-width:0}}
@media(max-width:600px){.practice-layout{width:100%;min-width:0;grid-template-columns:minmax(0,1fr)}.question-nav{max-width:100%}.question-list{max-width:100%;grid-template-columns:repeat(7,minmax(0,1fr))}}
.solution-text{overflow-wrap:anywhere}
.profile-photo-row{display:flex;align-items:center;gap:12px;margin:10px 0 14px}.profile-photo-row small{display:block;margin-top:4px;color:var(--muted);font-size:10px}.profile-menu input[type=file]{height:auto;padding:8px;font-size:11px}.profile-avatar-large{width:58px;height:58px;flex:0 0 58px;font-size:20px}.profile-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover}.profile-privacy{display:flex;align-items:center;gap:7px;margin:12px 0;color:var(--ink);font-size:12px}.profile-privacy input{width:16px;height:16px;accent-color:var(--green)}
@media(max-width:600px){.intro{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;align-items:stretch}.progress-card{display:flex;align-items:center;gap:7px;width:100%;max-width:none;min-width:0;padding:12px 14px}.progress-card span,.progress-card small{display:inline;font-size:12px}.progress-card .reset-progress{margin:0 0 0 auto;padding:9px 12px;font-size:12px}}
.intro{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;align-items:stretch}.progress-card{display:flex;align-items:center;gap:12px;width:100%;max-width:none;min-width:0;min-height:84px;padding:18px 24px}.progress-summary{display:flex;align-items:baseline;gap:10px;margin:0}.progress-summary span{font:700 17px Arial,sans-serif;color:var(--ink)}.progress-summary strong{font:800 28px Arial,sans-serif;margin:0}.progress-card .reset-progress{margin:0 0 0 auto;padding:12px 18px;font:700 14px Arial,sans-serif}
@media(max-width:600px){.intro{gap:14px}.progress-card{min-height:76px;padding:14px 16px}.progress-summary{gap:8px}.progress-summary span{font-size:15px}.progress-summary strong{font-size:24px}.progress-card .reset-progress{padding:11px 14px;font-size:13px}}
.intro{display:flex;justify-content:space-between;align-items:flex-start;gap:24px}.progress-card{width:min(38%,400px);max-width:400px;min-width:340px;min-height:88px}
@media(max-width:900px){.intro{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;align-items:stretch}.progress-card{width:100%;max-width:none;min-width:0}}
.progress-summary{align-items:center}
.progress-summary span,.progress-summary strong{font-size:22px;line-height:1.2}
@media(max-width:600px){.progress-summary span,.progress-summary strong{font-size:18px}}