html,body{margin:0;height:100%;background:#0d0a26;overflow:hidden;font-family:Nunito,Avenir Next,system-ui,sans-serif;color:#fff}#c{position:fixed;inset:0;width:100%;height:100%;display:block}#ui{position:fixed;inset:0;pointer-events:none}.hidden{display:none!important}.top{position:absolute;top:18px;left:22px;right:22px;display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.chapter{background:#160e308c;backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:10px 16px 12px;max-width:46vw}.kicker{display:block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#ffcf8a;font-weight:800}.title{font-size:19px;font-weight:900}.dots{display:flex;gap:5px;margin-top:7px}.dots i{width:22px;height:5px;border-radius:3px;background:#fff3}.dots i.done{background:#ffcf8a}.dots i.now{background:#fff}.gauges{background:#160e309e;backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:12px 14px;width:min(290px,40vw)}.g{margin-bottom:8px}.g label{font-size:12px;font-weight:800;letter-spacing:.04em;color:#e9defc}.bar{height:10px;border-radius:6px;background:#ffffff24;overflow:hidden;margin-top:3px}.bar i{display:block;height:100%;border-radius:6px;transition:width .35s}.bar .o2{background:#ff8a7a}.bar .grad{background:#7fefff}.bar .atp{background:#ffc247}.trace{width:100%;height:auto;margin-top:6px;border-radius:10px;background:#00000040}.tracecap{font-size:11px;color:#cfc3ea;margin-top:4px;line-height:1.3}.labels{position:absolute;inset:0;overflow:hidden}.label{position:absolute;left:0;top:0;background:#fffffff2;color:#2a1f4d;border-radius:12px;padding:5px 11px 6px;font-size:14px;line-height:1.2;text-align:center;box-shadow:0 6px 18px #00000047;opacity:0;transition:opacity .4s;white-space:nowrap;margin-top:-12px}.label.in{opacity:1}.label b{font-weight:900;display:block}.label span{font-size:12px;font-weight:700;color:#6b5a99}.label:after{content:"";position:absolute;left:50%;bottom:-7px;width:12px;height:12px;background:inherit;transform:translate(-50%) rotate(45deg);border-radius:2px}.label.npc{background:#2a1f4d;color:#fff;font-style:italic}.label.npc span{color:#ffcf8a;font-style:normal}.label.big{font-size:18px;padding:8px 14px}.bottom{position:absolute;left:0;right:0;bottom:22px;display:flex;flex-direction:column;align-items:center;gap:10px;padding:0 16px}.caption{max-width:min(880px,92vw);background:#120b28b8;backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.14);border-radius:20px;padding:12px 18px;font-size:clamp(16px,1.55vw,21px);line-height:1.38;font-weight:700;text-wrap:pretty}.caption .who{display:inline-block;margin-right:10px;font-size:.7em;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:#2a1f4d;background:#ffcf8a;border-radius:8px;padding:2px 8px;vertical-align:.15em}.caption[data-who=Mia] .who{background:#ffa7c4}.caption[data-who=You] .who{background:#9fe8ff}.answer{pointer-events:auto;width:min(760px,94vw);background:#fffffff7;color:#2a1f4d;border-radius:22px;padding:14px 16px;box-shadow:0 14px 40px #0006}.answer .prompt{font-weight:900;font-size:17px;margin-bottom:8px;text-wrap:pretty}.answer .row{display:flex;gap:10px;align-items:stretch}.answer textarea{flex:1;border:2px solid #ddd3f3;border-radius:14px;padding:9px 12px;font:600 16px Nunito,system-ui,sans-serif;resize:none;color:#2a1f4d;outline:none}.answer textarea:focus{border-color:#7b5cd6}.answer button{border:0;border-radius:14px;font:900 15px Nunito,system-ui,sans-serif;cursor:pointer}.answer .mic{width:54px;background:#efe9fb;color:#5a3fc0}.answer .mic.live{background:#e5484d;color:#fff;animation:pulse 1.1s infinite}.answer .send{padding:0 20px;background:#5a3fc0;color:#fff}.answer .hint{font-size:12.5px;color:#6b5a99;margin-top:7px;font-weight:700}@keyframes pulse{50%{box-shadow:0 0 0 9px #e5484d38}}.tools{position:absolute;right:22px;bottom:22px;display:flex;gap:8px;pointer-events:auto}.tools button{background:#160e3099;color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:12px;padding:8px 13px;font:800 13px Nunito,system-ui,sans-serif;cursor:pointer;backdrop-filter:blur(8px)}.card{position:absolute;pointer-events:auto;background:#fffffffa;color:#2a1f4d;border-radius:24px;box-shadow:0 24px 70px #00000080;overflow:auto}.card.start{left:50%;top:50%;transform:translate(-50%,-50%);width:min(560px,90vw);padding:30px 34px;text-align:center}.card.start h1{font-size:34px;line-height:1.1;margin:0 0 8px;font-weight:900}.card.start p{font-size:16px;line-height:1.5;font-weight:600;color:#4b3d78;margin:8px 0}.card.start button,.card .go{margin-top:14px;background:#5a3fc0;color:#fff;border:0;border-radius:16px;padding:13px 30px;font:900 18px Nunito,system-ui,sans-serif;cursor:pointer}.card.start .plan{display:flex;gap:8px;justify-content:center;margin:16px 0 4px}.card.start .plan div{flex:1;background:#f3eefc;border-radius:14px;padding:10px 6px;font-size:13px;font-weight:800}.card.start .plan b{display:block;font-size:15px;color:#5a3fc0}.card.side{right:20px;top:20px;bottom:20px;width:min(520px,46vw);padding:22px 24px}.card.side h2{margin:0 0 4px;font-size:22px;font-weight:900}.card.side h3{font-size:15px;margin:16px 0 6px;font-weight:900;color:#5a3fc0;letter-spacing:.03em;text-transform:uppercase}.card.side p,.card.side li{font-size:15px;line-height:1.5;font-weight:600}.card.side ul{padding-left:20px;margin:6px 0}.card.side canvas{width:100%;border-radius:12px;background:#faf8ff;border:1px solid #e6defa}.card.side .figcap{font-size:12.5px;color:#6b5a99;font-weight:700;margin:4px 0 10px}.card .options{display:flex;flex-direction:column;gap:7px;margin-top:8px}.card .opt{display:flex;gap:10px;align-items:flex-start;text-align:left;background:#f3eefc;border:2px solid transparent;border-radius:14px;padding:9px 12px;font:700 14.5px/1.35 Nunito,system-ui,sans-serif;color:#2a1f4d;cursor:pointer}.card .opt i{font-style:normal;font-weight:900;color:#5a3fc0}.card .opt.picked{border-color:#5a3fc0}.card .opt.right{background:#dff7e6;border-color:#2fa55a}.card .opt.wrong{background:#fde5e5;border-color:#e5484d}.card .why{background:#fff7e3;border-radius:12px;padding:9px 12px;font-size:14px;font-weight:700;margin-top:8px;line-height:1.45}.card .quote{border-left:4px solid #9fe8ff;background:#f1fbff;border-radius:0 10px 10px 0;padding:7px 11px;font-style:italic;font-weight:700;font-size:14.5px;margin:6px 0}.card table{border-collapse:collapse;width:100%;font-size:13.5px;font-weight:700}.card td,.card th{border-bottom:1px solid #ebe4fa;padding:6px;text-align:left;vertical-align:top}.card th{color:#5a3fc0;font-size:12px;text-transform:uppercase;letter-spacing:.04em}.card .tick{color:#2fa55a;font-weight:900}.card .miss{color:#e5484d;font-weight:900}.card .x{position:sticky;float:right;top:0;background:#efe9fb;border:0;border-radius:10px;width:34px;height:34px;font:900 16px Nunito;cursor:pointer;color:#5a3fc0}@media(max-width:720px){.card.side{inset:auto 10px 10px;width:auto;max-height:62vh}.chapter{max-width:60vw}.gauges{width:38vw}.tools{bottom:auto;top:92px}}@media(min-width:721px){#ui.with-card .bottom{right:min(540px,48vw)}#ui.with-card .tools{display:none}}.legend{position:absolute;left:22px;bottom:22px;display:flex;flex-direction:column;gap:4px;background:#160e3080;backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:8px 11px;font-size:12px;font-weight:800;color:#e9defc}.legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:7px}@media(max-width:900px){.legend{display:none}}#ui.with-card .legend{display:none}.kicker:empty{display:none}.answer .hint:empty{display:none}.legend{flex-direction:row;gap:12px}.chips{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 4px}.chips button{background:#f3eefc;border:2px solid transparent;border-radius:999px;padding:8px 14px;font:800 14.5px Nunito,system-ui,sans-serif;color:#2a1f4d;cursor:pointer}.chips button:hover{border-color:#5a3fc0}.chips button.done{background:#dff7e6}.chips button.done:after{content:" ✓";color:#2fa55a}.card td.na{color:#a79cc4;font-size:12px;font-weight:700;white-space:nowrap}.card .quote.fix{border-left-color:#ffb3b3;background:#fff4f4}.card.side h2{font-size:26px}
