:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;color:#e8eef5;background:#0a1018;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 85% 0%,#153b3c70,transparent 50%);min-height:100vh}main{max-width:1120px;margin:auto;padding:32px 28px}header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #263344;padding-bottom:24px}.brand{font-size:24px;font-weight:800;letter-spacing:2px;color:inherit;text-decoration:none}.brand span{font-size:11px;color:#7de2cd;border:1px solid #376559;padding:5px;border-radius:5px;vertical-align:middle;letter-spacing:1px}.tag,.hint,footer{color:#a2b2c5;font-size:13px}.intro{padding:34px 0 26px}.eyebrow{color:#7de2cd;font-size:11px;letter-spacing:2px;font-weight:700}h1{font-size:clamp(30px,5vw,46px);letter-spacing:-1.5px;margin:10px 0}p{line-height:1.6}.intro>p:last-child{max-width:680px;color:#aebdcd;margin-bottom:0}.layout{display:grid;grid-template-columns:1fr 1fr;gap:22px}.panel{background:#111c29;border:1px solid #29394b;border-radius:18px;padding:26px;min-width:0}h2{font-size:15px;margin:0 0 25px;color:#d9e5f2}label{display:block;font-size:13px;margin:14px 0 8px;color:#bfd0e1}input,select,button{font:inherit;width:100%;border-radius:9px}input,select{padding:12px;background:#0a1420;border:1px solid #3c4e62;color:#edf6ff;min-width:0}input::placeholder{color:#8193a8;font-size:12px}button{padding:13px 15px;cursor:pointer;border:1px solid transparent;font-size:13px;font-weight:650;margin-top:14px}.primary{background:#8ee7cc;color:#102820}.secondary{background:#1c2d40;color:#e4effb;border-color:#3a4e65}.danger{background:#3a2330;border-color:#7d4255;color:#ffd5df}button:hover{filter:brightness(1.12)}button:disabled{opacity:.5;cursor:wait}input:focus-visible,select:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid #8ee7cc;outline-offset:3px}.options{display:grid;grid-template-columns:1fr 1fr;gap:14px}.divider{text-align:center;color:#8f9fb2;font-size:11px;border-top:1px solid #29394b;margin-top:24px;padding-top:20px}.hint{font-size:12px;overflow-wrap:anywhere}.status{padding:13px 16px;border-radius:9px;background:#18372f;color:#9cebd3;font-size:14px}.notice{padding:12px;color:#ffd9a1;background:#443420;border-radius:9px;font-size:13px}.metrics{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:#29394b;border:1px solid #29394b;border-radius:12px;overflow:hidden;margin:24px 0}.metrics>div{background:#111c29;padding:20px 16px}.metrics span{display:block;color:#9cafc3;font-size:11px;margin-bottom:10px}.metrics strong{font-size:23px;overflow-wrap:anywhere}details{border-top:1px solid #29394b;padding-top:18px}summary{cursor:pointer;font-size:12px;color:#b9cce0}pre{font-size:11px;line-height:1.8;white-space:pre-wrap;overflow-wrap:anywhere;max-height:200px;overflow:auto;color:#9bb6d1}.room-code{font-family:ui-monospace,monospace;font-size:clamp(22px,4vw,31px);letter-spacing:2px;background:#0a1420;border:1px dashed #567566;padding:20px 10px;text-align:center;border-radius:10px;color:#9cebd3}.actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}audio{width:100%;margin:10px 0}footer{font-size:12px;padding:24px 0 12px;max-width:850px}[hidden]{display:none!important}@media(max-width:720px){main{padding:22px 16px}.layout{grid-template-columns:1fr}.panel{padding:22px}.intro{padding-top:25px}.tag{font-size:11px}.metrics>div{padding:16px}.metrics strong{font-size:21px}}