:root{color-scheme:dark;--bg:#090f1c;--panel:#121e31;--panel2:#18263c;--stroke:#2a3b51;--text:#e9f2fb;--muted:#a5b6c8;--mint:#33c3b2;--mint2:#153e42;--gold:#f2c785;--bad:#fc888d;--shadow:0 18px 50px #0003}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 90% 0%,#182d40 0,transparent 33%),var(--bg);color:var(--text);font:16px/1.6 system-ui,-apple-system,Segoe UI,Arial,sans-serif;min-height:100vh}button,input,select{font:inherit}button{cursor:pointer}a{color:#81e3d9}a:hover{text-decoration:none}.skip{position:absolute;left:-999px;z-index:99;background:#fff;color:#000;padding:10px}.skip:focus{left:15px;top:15px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:28px;max-width:1280px;margin:auto;padding:22px 26px;border-bottom:1px solid var(--stroke)}.brand{display:flex;align-items:center;gap:13px;text-decoration:none;color:var(--text);line-height:1.25}.brand strong{font-size:16px;display:block;letter-spacing:.15px}.brand small{font-size:9px;color:#9db8ba;letter-spacing:1.7px}.brand-logo{width:47px;height:47px;border-radius:14px;background:linear-gradient(145deg,#2dceb7,#2c7f91);display:grid;place-items:center;font-weight:900;color:#092029;font-size:26px;position:relative}.smallmark{font-size:14px;position:absolute;bottom:1px;right:3px}.topbar nav{display:flex;gap:20px;flex-wrap:wrap}.topbar nav a{font-size:13px;text-decoration:none;color:var(--muted);padding:9px 0}.topbar nav a.active,.topbar nav a:hover{color:var(--mint)}.mobile-menu{display:none;background:none;border:1px solid var(--stroke);color:var(--text);border-radius:9px;padding:4px 12px}main{max-width:1200px;margin:auto;padding:38px 26px 65px;min-height:76vh}footer{border-top:1px solid var(--stroke);max-width:1280px;margin:auto;padding:24px 26px;color:var(--muted);font-size:12px;display:flex;gap:12px;justify-content:space-between;flex-wrap:wrap}.eyebrow{font-size:11px;letter-spacing:2px;text-transform:uppercase;font-weight:800;color:var(--mint)}h1{font-size:clamp(30px,4.3vw,57px);line-height:1.13;letter-spacing:-1.5px;margin:9px 0 17px;max-width:810px}h2{font-size:clamp(24px,2.5vw,33px);line-height:1.22;margin:8px 0 12px}h3{margin:0 0 10px;font-size:18px}.sub{max-width:730px;font-size:17px;color:var(--muted)}.hero{padding:38px 0 28px}.hero .highlight{color:var(--mint)}.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:25px}.btn{border:1px solid var(--stroke);background:#1b2b40;color:var(--text);border-radius:12px;padding:11px 18px;font-weight:700;min-height:44px}.btn.primary{background:var(--mint);color:#092321;border-color:var(--mint)}.btn:hover{filter:brightness(1.1)}.btn:focus-visible,.option:focus-visible,.tile:focus-visible{outline:3px solid #fff;outline-offset:2px}.btn:disabled{opacity:.45;cursor:not-allowed}.section-title{margin:36px 0 16px;display:flex;align-items:baseline;justify-content:space-between;gap:12px}.section-title small,.muted{color:var(--muted)}.topic-grid,.three-grid,.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.tile,.panel,.stat{background:linear-gradient(150deg,var(--panel),#0f1a2b);border:1px solid var(--stroke);border-radius:17px;padding:21px;box-shadow:var(--shadow)}.tile{display:flex;flex-direction:column;text-align:left;min-height:187px;color:var(--text)}.tile:hover{border-color:var(--mint)}.tile .symbol{font-size:29px;font-weight:800;color:var(--topic,var(--mint));height:47px}.tile h3{font-size:17px;margin:0 0 4px}.tile p{margin:0;color:var(--muted);font-size:13px}.tag{margin-top:auto;font-size:11px;font-weight:750;color:var(--mint);padding-top:17px}.three-grid{grid-template-columns:repeat(3,1fr)}.three-grid .panel p{color:var(--muted);font-size:14px;margin-bottom:2px}.num{color:var(--mint);letter-spacing:1px;font-weight:800;font-size:12px}.stats{grid-template-columns:repeat(3,1fr);margin:25px 0}.stat b{font-size:29px;display:block}.stat span{color:var(--muted);font-size:12px}.shell{max-width:920px;margin:auto}.bar{display:flex;justify-content:space-between;gap:15px;align-items:center;flex-wrap:wrap;margin:0 0 22px}.pill{border:1px solid var(--stroke);border-radius:30px;padding:6px 12px;color:var(--muted);font-size:12px}.filters{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0}.chip{background:var(--panel);border:1px solid var(--stroke);color:var(--muted);padding:8px 14px;border-radius:25px;font-size:13px}.chip.active{background:var(--mint2);color:#8aeadd;border-color:#2c847b}.question{font-size:clamp(21px,2.8vw,27px);line-height:1.4;margin:24px 0}.option{border:1px solid var(--stroke);background:var(--panel2);border-radius:11px;display:flex;align-items:flex-start;gap:13px;text-align:left;width:100%;color:var(--text);padding:14px 16px;margin:9px 0}.option .letter{background:#263e53;color:#b8d3e5;border-radius:6px;width:26px;height:26px;flex:none;display:grid;place-items:center;font-size:12px;font-weight:750}.option.selected{border-color:#79a8c3}.option.correct{border-color:var(--mint);background:#103730}.option.incorrect{border-color:var(--bad);background:#3b252e}.feedback{border-left:4px solid var(--mint);padding:15px 17px;background:#15312f;border-radius:5px;margin:18px 0}.feedback.warn{border-left-color:var(--gold);background:#332b20}.feedback p{margin:7px 0}.footnote{font-size:12px;color:var(--muted)}.flip{min-height:260px;width:100%;background:linear-gradient(135deg,#14423f,#172943);border:1px solid #3a807d;border-radius:20px;padding:35px;text-align:center;color:var(--text);display:grid;place-content:center;gap:15px}.flip h2{font-size:clamp(23px,3vw,35px)}.flip .small{color:#aee8e2;font-size:12px;letter-spacing:1px;text-transform:uppercase}.match-cols{display:grid;grid-template-columns:1fr 1fr;gap:16px}.match-col{display:grid;gap:9px;align-content:start}.match-choice{width:100%;background:var(--panel2);border:1px solid var(--stroke);border-radius:10px;color:var(--text);padding:12px;text-align:left;min-height:63px}.match-choice.selected{border-color:var(--mint);background:var(--mint2)}.match-choice.done{opacity:.45;text-decoration:line-through}.controls{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin:20px 0}.control{border:1px solid var(--stroke);padding:15px;border-radius:12px;background:#111d2f}.control label{font-weight:700;font-size:13px;display:block}.control p{font-size:12px;color:var(--muted);margin:5px 0}.control input{width:100%;accent-color:var(--mint)}.control select{width:100%;background:#1b2b40;color:var(--text);padding:9px;border:1px solid var(--stroke);border-radius:7px}.chart-shell{padding:18px 10px;background:#0c1728;border:1px solid var(--stroke);border-radius:14px;overflow:hidden}.chart-shell svg{width:100%;display:block;max-height:260px}.note{border:1px solid #5b6d7b;border-radius:12px;background:#13263a;padding:15px 17px;font-size:14px;margin:16px 0}.note strong{color:var(--gold)}.ref{padding:15px 0;border-bottom:1px solid var(--stroke)}.ref a{overflow-wrap:anywhere}.progress-track{height:7px;background:#263648;border-radius:20px;overflow:hidden}.progress-track>div{height:100%;background:var(--mint);transition:width .2s}.empty{border:1px dashed var(--stroke);border-radius:14px;padding:40px;text-align:center;color:var(--muted)}.mini-tabs{display:flex;gap:7px;flex-wrap:wrap;margin:10px 0 19px}.mini-tab{padding:8px 11px;background:#1c2c3e;border:1px solid var(--stroke);color:var(--text);border-radius:9px}.mini-tab.active{background:var(--mint2);border-color:var(--mint)}@media(max-width:950px){.topbar{align-items:flex-start}.topbar nav{gap:10px}.topic-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:700px){.topbar{align-items:center;position:relative;padding:15px}.mobile-menu{display:block}.topbar nav{display:none;position:absolute;z-index:5;top:75px;left:12px;right:12px;border:1px solid var(--stroke);background:#121e31;border-radius:14px;padding:12px;flex-direction:column;box-shadow:var(--shadow)}.topbar nav.open{display:flex}.topbar nav a{padding:9px 12px}.brand strong{font-size:14px}.brand small{font-size:8px}.brand-logo{width:42px;height:42px}main{padding:20px 15px 45px}.hero{padding:28px 0 10px}.sub{font-size:15px}.topic-grid,.three-grid,.stats,.controls{grid-template-columns:1fr}.tile{min-height:137px}.tile .symbol{height:35px}.match-cols{gap:8px}.match-choice{padding:9px;min-height:80px;font-size:12px}.flip{min-height:250px;padding:20px}.tile,.panel,.stat{padding:17px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
