:root{--bg:#06030d;--panel:#0f0a1eb8;--panel2:#0a0812c7;--text:#f5f1ff;--muted:#bdb2d9;--pink:#ff4fd8;--purple:#7a5cff;--blue:#23d5ff;--cyan:#19ffd0;--amber:#ffb21c;--lime:#b5ff3d;--ok:#4bff92;--bad:#ff4b6e;--shadow:0 18px 60px #00000073;--glowPink:0 0 16px #ff4fd88c,0 0 44px #ff4fd840;--glowBlue:0 0 16px #23d5ff8c,0 0 44px #23d5ff40;--radius:22px}*{box-sizing:border-box}html,body{height:100%}body{color:var(--text);background:radial-gradient(1200px 900px at 50% 10%,#7a5cff59,transparent 55%),radial-gradient(900px 700px at 20% 40%,#ff4fd847,transparent 55%),radial-gradient(1000px 700px at 80% 50%,#23d5ff38,transparent 60%),var(--bg);margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,Apple Color Emoji,Segoe UI Emoji;overflow-x:hidden}.grid{transform-origin:bottom;opacity:.7;pointer-events:none;background:linear-gradient(#06030d,#06030deb 35%,#06030d00),repeating-linear-gradient(90deg,#23d5ff38 0 1px,#0000 1px 60px),repeating-linear-gradient(0deg,#ff4fd82e 0 1px,#0000 1px 52px);height:45vh;position:fixed;inset:auto 0 0;transform:perspective(700px)rotateX(62deg)}.wrap{justify-content:center;align-items:center;min-height:100%;padding:28px 14px 80px;display:flex;position:relative}.card{border-radius:calc(var(--radius) + 8px);width:min(760px,96vw);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(#19ffd01a,#ff4fd814 35%,#7a5cff1a),#0a0712bf;border:1px solid #ffffff1a;position:relative;overflow:hidden}.card:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(500px 220px at 20% 10%,#ff4fd840,#0000 60%),radial-gradient(500px 260px at 80% 20%,#23d5ff38,#0000 62%),radial-gradient(700px 400px at 50% 100%,#7a5cff33,#0000 65%);position:absolute;inset:-2px}.inner{z-index:1;padding:18px 18px 16px;position:relative}.topbar{justify-content:space-between;align-items:center;gap:14px;margin-bottom:14px;display:flex}.brand{background:#00000040;border:1px solid #ffffff14;border-radius:18px;flex-direction:column;gap:4px;padding:10px 14px;display:flex;box-shadow:inset 0 0 0 1px #ff4fd814}.brand .title{letter-spacing:.04em;text-transform:uppercase;text-shadow:var(--glowPink);font-size:22px;font-weight:900;line-height:1.1}.brand .subtitle{color:var(--muted);letter-spacing:.14em;text-transform:uppercase;font-size:12px}.timerBox{background:#00000040;border:1px solid #ffffff1a;border-radius:18px;align-items:center;gap:10px;padding:10px 14px;display:flex}.timerLabel{color:var(--muted);letter-spacing:.14em;text-transform:uppercase;font-size:12px}.digital{color:var(--lime);text-align:center;background:#0000006b;border:1px solid #b5ff3d40;border-radius:14px;min-width:88px;padding:6px 10px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:22px;font-weight:800;box-shadow:0 0 14px #b5ff3d38}.startPanel{border-radius:var(--radius);background:linear-gradient(#0000004d,#0000002e);border:1px solid #ffffff1f;padding:18px;box-shadow:inset 0 0 0 1px #ff4fd814}.startTitle{text-shadow:var(--glowBlue);margin:0 0 6px;font-size:26px;font-weight:950}.startCopy{color:var(--muted);margin-bottom:12px;line-height:1.35}.startRow{flex-wrap:wrap;gap:10px;margin-bottom:14px;display:flex}.startActions{flex-wrap:wrap;gap:10px;display:flex}.howBox{color:var(--muted);background:#00000040;border:1px solid #ffffff1f;border-radius:18px;margin-top:12px;padding:10px 12px}.howBox ul{margin:8px 0 0 18px}.howBox li{margin:6px 0}.lbPanel{border-radius:var(--radius);background:linear-gradient(#00000047,#00000029);border:1px solid #ffffff1f;margin-top:14px;padding:14px;box-shadow:inset 0 0 0 1px #23d5ff14}.lbHeader{justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px;display:flex}.lbTitle{letter-spacing:.08em;text-transform:uppercase;color:var(--text);font-size:13px;font-weight:950}.lbList{gap:8px;margin:0;padding:0 0 0 18px;display:grid}.lbItem{background:#00000038;border:1px solid #ffffff1a;border-radius:16px;justify-content:space-between;align-items:baseline;gap:10px;padding:10px 12px;display:flex}.lbLeft{flex-direction:column;gap:2px;display:flex}.lbName{font-weight:900}.lbMeta{color:var(--muted);font-size:12px}.lbScore{color:var(--lime);font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-weight:900}.lbEmpty{color:var(--muted);background:#0000002e;border:1px dashed #ffffff1f;border-radius:16px;padding:10px 12px;list-style:none}.lbNote{color:var(--muted);margin-top:10px;font-size:12px}.progressRow{justify-content:space-between;align-items:center;gap:12px;margin:10px 4px 14px;display:flex}.progressText{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;font-size:13px}.bar{background:#ffffff1a;border:1px solid #ffffff14;border-radius:999px;flex:1;height:10px;overflow:hidden;box-shadow:inset 0 0 0 1px #00000038}.fill{background:linear-gradient(90deg,var(--pink),var(--purple),var(--blue));width:0%;height:100%;box-shadow:var(--glowBlue);transition:width .25s}.qpanel{border-radius:var(--radius);background:linear-gradient(#00000059,#0003);border:1px solid #ffffff1f;padding:16px 16px 12px;box-shadow:inset 0 0 0 1px #23d5ff14}.question{text-shadow:0 0 24px #ffffff12;margin:2px 0 10px;font-size:22px;font-weight:800;line-height:1.25}.hint{color:var(--muted);margin-bottom:14px;font-size:13px}.answers{gap:10px;margin-top:10px;display:grid}.ans{cursor:pointer;-webkit-user-select:none;user-select:none;background:#ffffff40;border:1px solid #ffffff14;border-radius:18px;outline:none;align-items:center;gap:12px;padding:12px;transition:transform 80ms,border-color .15s,background .15s,box-shadow .15s;display:flex}.ans:hover{box-shadow:var(--glowBlue);border-color:#23d5ff59;transform:translateY(-1px)}.ans:active{transform:translateY(0)scale(.99)}.badge{letter-spacing:.02em;background:#ffffff0f;border:1px solid #ffffff1a;border-radius:14px;place-items:center;width:38px;height:38px;font-weight:900;display:grid;box-shadow:inset 0 0 0 1px #00000040}.ansText{font-size:25px;font-weight:700}.ans.selected{box-shadow:var(--glowPink);background:#ff4fd814;border-color:#ff4fd899}.ans.correct{background:#4bff9214;border-color:#4bff92bf;box-shadow:0 0 18px #4bff9259}.ans.wrong{background:#ff4b6e14;border-color:#ff4b6ebf;box-shadow:0 0 18px #ff4b6e47}.actions{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-top:14px;display:flex}.btn{cursor:pointer;letter-spacing:.1em;text-transform:uppercase;color:var(--text);background:linear-gradient(90deg,var(--pink),var(--purple),var(--blue));box-shadow:var(--glowPink);border:none;border-radius:999px;min-width:170px;padding:14px 18px;font-weight:900;transition:transform 80ms,filter .15s,opacity .15s}.btn:hover{filter:brightness(1.07);transform:translateY(-1px)}.btn:active{transform:translateY(0)scale(.99)}.btn:disabled{opacity:.45;cursor:not-allowed;filter:none;box-shadow:none;background:#ffffff1a}.smallBtn{color:var(--muted);cursor:pointer;letter-spacing:.06em;text-transform:uppercase;background:#00000040;border:1px solid #ffffff1f;border-radius:999px;padding:12px 14px;font-weight:800}.smallBtn:hover{color:var(--text);border-color:#ffffff38}.status{color:var(--muted);flex:1;min-width:220px;font-size:13px}.status strong{color:var(--text)}dialog{width:min(560px,92vw);color:var(--text);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(#ff4fd81f,#23d5ff1a),#0a0712eb;border:1px solid #ffffff1f;border-radius:26px;padding:0;box-shadow:0 26px 80px #0000008c}dialog::backdrop{background:#0000008c}.modalInner{padding:18px}.modalTitle{letter-spacing:.08em;text-transform:uppercase;margin:2px 0 8px;font-size:20px;font-weight:900}.scoreLine{text-shadow:var(--glowBlue);margin:8px 0 2px;font-size:44px;font-weight:950}.metaLine{color:var(--muted);margin-bottom:12px}.modalActions{flex-wrap:wrap;gap:10px;margin-top:14px;display:flex}.pill{color:var(--muted);letter-spacing:.06em;text-transform:uppercase;background:#00000047;border:1px solid #ffffff1f;border-radius:999px;padding:10px 12px;font-weight:800}@media (max-width:520px){.question{font-size:20px}.ansText{font-size:16px}.btn{width:100%}.status{min-width:100%}.timerBox{gap:8px}.digital{min-width:80px;font-size:20px}.startTitle{font-size:22px}}
