:root{--bg:#0e0e0e;--card:#161616;--border:#2a2a2a;--y:#f5c518;--o:#ff6b35;--t:#4ecdc4;--p:#a78bfa;--text:#e8e8e8;--muted:#666;--done:#22c55e;--wrong:#ef4444;}
*{margin:0;padding:0;box-sizing:border-box;}
body{background:var(--bg);color:var(--text);font-family:'Space Mono',monospace;min-height:100vh;overflow-x:hidden;}

.topbar{display:flex;align-items:center;background:#0a0a0a;border-bottom:1px solid var(--border);padding:0 14px;position:sticky;top:0;z-index:200;gap:0;flex-wrap:wrap;}
.topbar-brand{font-family:'Syne',sans-serif;font-size:13px;font-weight:800;color:var(--y);padding:13px 14px 13px 0;border-right:1px solid var(--border);margin-right:10px;white-space:nowrap;}
.nav-tabs{display:flex;}
.nav-tab{padding:13px 14px;font-family:'Space Mono',monospace;font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;border:none;background:transparent;cursor:pointer;color:var(--muted);border-bottom:2px solid transparent;transition:all .15s;white-space:nowrap;}
.nav-tab:hover{color:var(--text);}
.nav-tab.a-chem{color:var(--t);border-bottom-color:var(--t);}
.nav-tab.a-phys{color:var(--o);border-bottom-color:var(--o);}
.nav-tab.a-math{color:var(--y);border-bottom-color:var(--y);}
.nav-tab.a-flash{color:var(--p);border-bottom-color:var(--p);}
.topbar-right{margin-left:auto;display:flex;align-items:center;gap:8px;}
.flat-btn{padding:5px 11px;border-radius:4px;border:1px solid var(--border);background:var(--card);font-family:'Space Mono',monospace;font-size:10px;color:var(--muted);cursor:pointer;transition:all .15s;letter-spacing:.5px;white-space:nowrap;}
.flat-btn:hover{border-color:var(--y);color:var(--y);}
.flat-btn.on{border-color:var(--y);color:var(--y);background:#1a1400;}

.panel{display:none;}.panel.active{display:block;}

.page{max-width:980px;margin:0 auto;padding:24px 16px 80px;}
.sec-title{font-family:'Syne',sans-serif;font-size:1rem;font-weight:800;margin-bottom:14px;display:flex;align-items:center;gap:10px;}
.sec-title::after{content:'';flex:1;height:1px;background:var(--border);}
.g1{display:grid;grid-template-columns:1fr;gap:10px;margin-bottom:22px;}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:22px;}
.g3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-bottom:22px;}
.g4{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:22px;}
.fcard{background:var(--card);border:1px solid var(--border);border-radius:8px;padding:14px 16px;}
.fcard h3{font-family:'Syne',sans-serif;font-size:.75rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;margin-bottom:10px;}
.h-y{color:var(--y);}.h-o{color:var(--o);}.h-t{color:var(--t);}.h-p{color:var(--p);}
table{width:100%;border-collapse:collapse;font-size:.77rem;}
th{color:var(--muted);font-size:.63rem;letter-spacing:1px;text-transform:uppercase;padding:4px 7px;border-bottom:1px solid var(--border);text-align:left;}
td{padding:5px 7px;border-bottom:1px solid #1e1e1e;line-height:1.45;vertical-align:top;}
tr:last-child td{border-bottom:none;}
tr:hover td{background:#1c1c1c;}
.tc{text-align:center;}.th-c th,.tbl-c td{text-align:center;}
.fy{color:var(--y);font-weight:700;}.fo{color:var(--o);}.ft{color:var(--t);}.fp{color:var(--p);}
.fbox{background:#111;border:1px solid var(--border);border-left:3px solid var(--y);border-radius:4px;padding:9px 13px;font-size:.78rem;margin-bottom:7px;line-height:1.8;}
.fbox.o{border-left-color:var(--o);}.fbox.t{border-left-color:var(--t);}.fbox.p{border-left-color:var(--p);}
.fbox:last-child{margin-bottom:0;}
.seclbl{font-size:.67rem;letter-spacing:2px;text-transform:uppercase;color:var(--muted);margin:12px 0 7px;padding-bottom:3px;border-bottom:1px dashed var(--border);}
.seclbl:first-child{margin-top:0;}
.mc{background:#111;border:1px solid var(--border);padding:8px 10px;border-radius:4px;}
.mc .mk{font-size:.65rem;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);margin-bottom:3px;}
.mc .mv{font-size:.78rem;line-height:1.4;}
.mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:6px;margin-bottom:8px;}
.mgrid:last-child{margin-bottom:0;}
.tag-p{display:inline-block;background:#2a1f00;color:var(--y);font-size:.6rem;letter-spacing:1px;text-transform:uppercase;padding:2px 7px;border-radius:3px;margin-bottom:8px;}
.pill-row{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px;}
.pill{background:#1a1a1a;border:1px solid var(--border);border-radius:20px;padding:3px 11px;font-size:.7rem;}
.subj-hdr{margin-bottom:20px;padding-bottom:14px;border-bottom:1px solid var(--border);}
.subj-tag{font-size:9px;letter-spacing:3px;text-transform:uppercase;color:var(--muted);margin-bottom:5px;}
.subj-hdr h2{font-family:'Syne',sans-serif;font-size:22px;font-weight:800;}

.acc-block{margin-bottom:6px;background:var(--card);border:1px solid var(--border);border-radius:6px;overflow:hidden;}
.acc-head{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;cursor:pointer;user-select:none;transition:background .1s;}
.acc-head:hover{background:#1c1c1c;}
.acc-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;margin-right:10px;}
.acc-name{font-size:11px;font-weight:700;color:var(--text);}
.acc-arrow{font-size:9px;color:var(--muted);transition:transform .2s;}
.acc-block.open .acc-arrow{transform:rotate(90deg);}
.acc-body{display:none;padding:14px 16px;border-top:1px solid var(--border);}
.acc-block.open .acc-body{display:block;}

#flash{min-height:calc(100vh - 52px);}
.setup-wrap{max-width:580px;margin:0 auto;padding:36px 18px;}
.setup-title{font-family:'Syne',sans-serif;font-size:1.4rem;font-weight:800;margin-bottom:6px;}
.setup-sub{font-size:.72rem;color:var(--muted);letter-spacing:1px;text-transform:uppercase;margin-bottom:26px;}
.setup-lbl{font-size:.68rem;letter-spacing:2px;text-transform:uppercase;color:var(--muted);margin-bottom:10px;}
.chip-grid{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px;}
.chip{padding:8px 16px;border-radius:5px;border:1px solid var(--border);background:var(--card);color:var(--muted);font-family:'Space Mono',monospace;font-size:.72rem;cursor:pointer;transition:all .15s;letter-spacing:.5px;}
.chip:hover{border-color:var(--text);color:var(--text);}
.chip.sel-y{background:#2a1f00;border-color:var(--y);color:var(--y);}
.chip.sel-t{background:#0a2424;border-color:var(--t);color:var(--t);}
.chip.sel-o{background:#2a1000;border-color:var(--o);color:var(--o);}
.chip.sel-p{background:#1a1030;border-color:var(--p);color:var(--p);}
.pbadge{display:inline-block;background:#2a1f00;color:var(--y);font-size:.58rem;letter-spacing:1px;text-transform:uppercase;padding:2px 6px;border-radius:3px;margin-left:6px;vertical-align:middle;}
.sbtn{padding:10px 24px;border-radius:5px;border:none;font-family:'Space Mono',monospace;font-size:.76rem;font-weight:700;cursor:pointer;letter-spacing:1px;text-transform:uppercase;transition:all .15s;}
.sbtn-y{background:var(--y);color:#000;}.sbtn-y:hover{background:#e0b000;}
.sbtn-n{background:var(--card);color:var(--muted);border:1px solid var(--border);margin-right:8px;}.sbtn-n:hover{border-color:var(--text);color:var(--text);}
.divider{height:1px;background:var(--border);margin:18px 0;}

.shuffle-row{display:flex;align-items:center;gap:12px;margin-bottom:22px;}
.shuffle-lbl{font-size:.68rem;letter-spacing:2px;text-transform:uppercase;color:var(--muted);}
.sw-track{width:44px;height:24px;border-radius:12px;background:var(--border);position:relative;cursor:pointer;transition:background .2s;flex-shrink:0;}
.sw-track.on{background:var(--p);}
.sw-thumb{width:18px;height:18px;border-radius:50%;background:#fff;position:absolute;top:3px;left:3px;transition:left .2s;}
.sw-track.on .sw-thumb{left:23px;}

.trig-row{display:flex;align-items:center;gap:8px;margin-bottom:16px;padding:10px 14px;background:var(--card);border:1px solid var(--border);border-radius:5px;}
.trig-lbl{font-size:.68rem;color:var(--muted);letter-spacing:1px;text-transform:uppercase;flex:1;}
.tmode{padding:5px 13px;border-radius:4px;border:1px solid var(--border);background:transparent;font-family:'Space Mono',monospace;font-size:.67rem;cursor:pointer;color:var(--muted);transition:all .15s;}
.tmode.on{background:var(--t);color:#000;border-color:var(--t);font-weight:700;}

.session-wrap{display:flex;height:calc(100vh - 52px);overflow:hidden;}
.session-main{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;position:relative;overflow:hidden;}
.prog-wrap{position:absolute;top:0;left:0;right:0;height:3px;background:var(--border);}
.prog-bar{height:100%;background:var(--y);transition:width .3s;}
.exit-btn{position:absolute;top:12px;right:14px;padding:5px 13px;border-radius:4px;border:1px solid var(--border);background:transparent;color:var(--muted);font-family:'Space Mono',monospace;font-size:.67rem;cursor:pointer;transition:all .15s;}
.exit-btn:hover{border-color:var(--o);color:var(--o);}
.card-topic-tag{font-size:.63rem;letter-spacing:2px;text-transform:uppercase;color:var(--muted);margin-bottom:12px;}
.card-counter{font-size:.67rem;color:var(--muted);margin-bottom:14px;letter-spacing:1px;}
.fc-scene{width:100%;max-width:540px;height:240px;perspective:1000px;cursor:pointer;margin-bottom:18px;}
.fc-inner{width:100%;height:100%;position:relative;transform-style:preserve-3d;transition:transform .4s cubic-bezier(.4,0,.2,1);}
.fc-inner.flipped{transform:rotateY(180deg);}
.fc-face{position:absolute;inset:0;backface-visibility:hidden;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:22px 26px;text-align:center;}
.fc-front{background:var(--card);border:1px solid var(--border);}
.fc-back{background:#0f0c00;border:1px solid var(--y);transform:rotateY(180deg);}
.fc-hint{font-size:.6rem;color:var(--muted);letter-spacing:2px;text-transform:uppercase;margin-bottom:10px;}
.fc-q{font-family:'Syne',sans-serif;font-size:1.45rem;font-weight:800;line-height:1.3;}
.fc-qtopic{font-size:.63rem;color:var(--muted);margin-top:8px;letter-spacing:1px;}
.fc-albl{font-size:.6rem;color:var(--y);letter-spacing:2px;text-transform:uppercase;margin-bottom:8px;}
.fc-a{font-family:'Syne',sans-serif;font-size:1.2rem;font-weight:800;color:var(--y);line-height:1.3;}
.fc-sub{font-size:.73rem;color:var(--text);margin-top:7px;line-height:1.5;opacity:.8;}
.session-nav{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center;}
.nav-btn{padding:8px 18px;border-radius:5px;border:1px solid var(--border);background:var(--card);color:var(--muted);font-family:'Space Mono',monospace;font-size:.7rem;cursor:pointer;transition:all .15s;letter-spacing:.5px;}
.nav-btn:hover:not(:disabled){border-color:var(--text);color:var(--text);}
.nav-btn:disabled{opacity:.3;cursor:not-allowed;}
.btn-correct{background:#0a2a10;border-color:var(--done);color:var(--done);}
.btn-correct:hover{background:#0d3a16 !important;border-color:var(--done) !important;color:var(--done) !important;}
.btn-wrong{background:#2a0a0a;border-color:var(--wrong);color:var(--wrong);}
.btn-wrong:hover{background:#3a1010 !important;border-color:var(--wrong) !important;color:var(--wrong) !important;}

.session-sidebar{width:220px;flex-shrink:0;background:#0a0a0a;border-left:1px solid var(--border);display:flex;flex-direction:column;transition:width .2s;}
.session-sidebar.collapsed{width:0;overflow:hidden;}
.sb-inner{width:220px;height:100%;display:flex;flex-direction:column;overflow:hidden;}
.sb-hdr{font-family:'Syne',sans-serif;font-size:.72rem;font-weight:800;color:var(--muted);letter-spacing:2px;text-transform:uppercase;padding:14px 12px 10px;border-bottom:1px solid var(--border);}
.sb-stats{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:10px 10px 8px;}
.stat-box{background:var(--card);border:1px solid var(--border);border-radius:4px;padding:8px;text-align:center;}
.stat-num{font-family:'Syne',sans-serif;font-size:1.1rem;font-weight:800;}
.sn-g{color:var(--done);}.sn-r{color:var(--wrong);}.sn-y{color:var(--y);}.sn-t{color:var(--t);}
.stat-lbl{font-size:.58rem;color:var(--muted);letter-spacing:1px;text-transform:uppercase;margin-top:2px;}
.sb-toggle{position:absolute;right:0;top:50%;transform:translateY(-50%);background:#0a0a0a;border:1px solid var(--border);border-right:none;border-radius:4px 0 0 4px;padding:8px 5px;cursor:pointer;font-size:10px;color:var(--muted);z-index:10;transition:all .15s;}
.sb-toggle:hover{color:var(--y);}
.retry-section{padding:10px;border-top:1px solid var(--border);}
.retry-btn{width:100%;padding:7px;border-radius:4px;border:1px solid var(--wrong);background:#2a0a0a;color:var(--wrong);font-family:'Space Mono',monospace;font-size:.67rem;cursor:pointer;transition:all .15s;letter-spacing:.5px;}
.retry-btn:hover{background:#3a1010;}
.retry-btn:disabled{opacity:.3;cursor:not-allowed;}

.done-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;height:calc(100vh - 52px);text-align:center;padding:24px;}
.done-screen h2{font-family:'Syne',sans-serif;font-size:2rem;font-weight:800;color:var(--done);margin-bottom:10px;}
.done-screen p{color:var(--muted);font-size:.78rem;letter-spacing:1px;margin-bottom:6px;}
.done-stats{display:flex;gap:16px;margin:18px 0 26px;flex-wrap:wrap;justify-content:center;}
.done-stat{background:var(--card);border:1px solid var(--border);border-radius:8px;padding:14px 20px;text-align:center;}
.done-stat .dn{font-family:'Syne',sans-serif;font-size:1.6rem;font-weight:800;}
.done-stat .dl{font-size:.65rem;color:var(--muted);letter-spacing:1px;text-transform:uppercase;margin-top:3px;}

.modal-overlay {position:fixed; inset:0; background:rgba(0,0,0,0.85); z-index:1100; display:flex; align-items:center; justify-content:center; padding:20px; backdrop-filter: blur(4px);}
.modal-card {background:var(--card); border:1px solid var(--border); padding:25px; border-radius:12px; max-width:500px; width:100%; max-height:80vh; display:flex; flex-direction:column;}
.stats-scroll-area {overflow-y:auto; flex:1; padding-right:5px;}
.history-item {background:#111; border:1px solid var(--border); padding:12px; border-radius:6px; margin-bottom:8px; display:flex; justify-content:space-between; align-items:center;}
.h-date { font-size:10px; color:var(--muted); text-transform:uppercase; }
.h-res { font-family: 'Syne'; font-size:14px; color:var(--y); }
.login-input {width:100%; padding:12px; background:#000; border:1px solid var(--border); color:var(--text); margin:20px 0; font-family:'Space Mono'; border-radius:4px;}

@media(max-width:680px){.g2,.g3,.g4{grid-template-columns:1fr;}.session-sidebar{width:180px;}.sb-inner{width:180px;}.fc-q{font-size:1.1rem;}}