:root{color-scheme:dark;font-family:system-ui,-apple-system,'Segoe UI',Arial,sans-serif;background:#0d1833;color:#f5f7fc}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;min-height:100vh;background:radial-gradient(ellipse 75% 50% at 95% -10%,#3a4e83 0%,transparent 85%),radial-gradient(circle at 0% 65%,#28345d,transparent 70%),#0d1833}.shell{max-width:920px;padding:clamp(14px,4vw,34px);margin:auto}.topbar{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}.eyebrow,.sectionLabel{color:#b7c9eb;font-size:.76rem;letter-spacing:.12em;font-weight:750}.brand h1{font-size:clamp(2rem,5vw,3rem);line-height:1.1;margin:.3rem 0;color:#ffda86}.edition{font-size:.73rem;border:1px solid #ffcf6d;border-radius:9px;padding:3px 7px;vertical-align:middle}.subtitle{margin:0;color:#d7e2f6}.environment{color:#ffe4ac;border:1px solid #bd965d;border-radius:30px;padding:8px 12px;font-size:.72rem;font-weight:800}.questHeader{background:#18294a;border:1px solid #526b93;border-radius:20px;margin:22px 0 18px;padding:20px;display:grid;grid-template-columns:1fr auto;gap:10px}.questHeader h2{margin:6px 0 2px;font-size:1.35rem}.questHeader p{margin:4px 0 0;color:#c8d7ef;font-size:.95rem}.streak{display:flex;align-items:center;gap:4px;white-space:nowrap}.star{font-size:1.7rem;color:#a9b8d5}.star.earned{color:#ffd570}.streak strong{color:#ffdb85;font-size:.85rem;padding-left:10px}.track{grid-column:1/-1;height:9px;background:#0e1c36;border-radius:100px;overflow:hidden;border:1px solid #324b71}.track span{display:block;width:0;height:100%;background:linear-gradient(90deg,#f9ac43,#ffe49c);transition:width .25s ease}.panel{background:linear-gradient(140deg,#203657,#182a4a);border:1px solid #7894bd;border-top:3px solid #f4c566;border-radius:22px;padding:clamp(18px,3.5vw,30px);box-shadow:0 15px 45px #0004}.headingRow{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}.pill{background:#38547e;border:1px solid #7b9cc9;padding:7px 11px;font-size:.75rem;border-radius:20px;font-weight:700}.doneLabel{color:#f7d181;font-size:.85rem}.panel h2{font-size:1.4rem;margin:15px 0 5px}.instruction{color:#d3dff3;margin:0 0 16px}.sentence{border:1px solid #6285b7;border-radius:15px;background:#10243e;padding:18px;min-height:98px;font-size:clamp(1.25rem,3vw,1.7rem);font-weight:760;line-height:2}.word{display:inline-block;margin:2px 3px;padding:2px 5px;border-radius:6px;transition:background .15s}.word.active{background:#ffd577;color:#182746}.word.matched{background:#1d634b;border:1px solid #68d6a2}.word.missed,.word.different{background:#704835;border:1px solid #ffc080}.translation{min-height:1.5em;color:#daebfa;font-size:1rem}.step{display:flex;gap:13px;align-items:flex-start;margin-top:23px}.stepNumber{display:inline-grid;place-items:center;flex:0 0 30px;height:30px;border:1px solid #fcd37f;color:#ffe2a3;border-radius:50%;font-weight:700}.step h3{font-size:1rem;margin:2px 0 4px}.step p{font-size:.88rem;color:#c6d5ee;margin:0}.controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:14px 0 8px}.controls button{flex:0 0 auto}.finish button:first-child{margin-right:auto}.divider{height:1px;background:#5c769d;margin:25px 0 18px}button{font:inherit;cursor:pointer;min-height:44px;color:#fff;background:#36567d;border:1px solid #a6c6e4;border-radius:10px;padding:10px 15px}button:hover:not(:disabled){filter:brightness(1.12)}button.primary{background:linear-gradient(125deg,#ffdc84,#f4ba50);color:#18243d;border-color:#fff2c0;font-weight:800}button:disabled{opacity:.42;cursor:not-allowed}button:focus-visible,input:focus-visible{outline:3px solid #ffe6a0;outline-offset:3px}.linkButton{min-height:32px;background:transparent;border:0;text-decoration:underline;color:#b9dcff;padding:0;font-size:.88rem}.privacyNote{font-size:.84rem;color:#becfea;margin:10px 0}.consent{display:flex;align-items:flex-start;gap:10px;background:#152d4d;border-left:3px solid #f9d48b;padding:12px;border-radius:8px;font-size:.9rem;color:#ecf3ff}.consent input{width:19px;height:19px;flex-shrink:0}audio{display:block;width:100%;margin:14px 0}.feedback{background:#112941;border:1px solid #587fa8;padding:18px;border-radius:13px;margin:15px 0}.feedback h3{margin:0 0 8px}.feedback .matchSummary{font-weight:850;color:#ffe0a0;font-size:1.18rem}.feedback .wordReport{display:flex;flex-wrap:wrap;gap:7px;margin:12px 0}.feedback .wordReport span{padding:5px 8px;border-radius:7px}.feedback .wordReport .matched{background:#236449}.feedback .wordReport .missed,.feedback .wordReport .different{background:#715038}.feedback p{font-size:.88rem;color:#d1ddf1;margin:7px 0}.feedback .extra{color:#ffc992}.victory{margin-top:18px;border:1px solid #f6c66f;background:#3c3b35;padding:17px;border-radius:12px}.victory strong{color:#ffe0a0;font-size:1.3rem}.victory p{margin:6px 0}#status{background:#0f2440;border-left:4px solid #a5cff8;padding:12px;border-radius:8px;min-height:45px;margin:18px 0 0}footer{font-size:.82rem;line-height:1.65;color:#c8d5e9;padding:20px 2px}@media(max-width:620px){.shell{padding:12px}.questHeader{grid-template-columns:1fr}.streak{justify-content:flex-start}.controls button{flex:1 0 43%;padding:10px 8px}.finish button:first-child{flex:1 0 100%}}@media(prefers-reduced-motion:reduce){.track span,.word{transition:none}}