:root{font-family:system-ui,sans-serif;color:#fff;background:#102e27}*{box-sizing:border-box}body{margin:0;min-height:100vh}header{display:flex;align-items:center;gap:14px;padding:20px 28px;background:#0a211b;flex-wrap:wrap}header strong{font-size:24px;margin-right:auto}button{border:1px solid #718d83;background:#204c3d;color:white;border-radius:10px;padding:12px 18px;font:inherit;cursor:pointer}button:disabled{opacity:.5}main{max-width:1400px;margin:auto;padding:36px;text-align:center}#pairing{max-width:560px;margin:8vh auto}label{display:grid;gap:12px;text-align:left}input{padding:18px;border-radius:10px;border:0;font:24px monospace;text-transform:uppercase;width:100%;margin:10px 0 20px}h1{font-size:clamp(100px,22vw,300px);line-height:1;margin:20px 0;color:#d4ff86}#pairing h1{font-size:44px;color:white;line-height:1.2}.eyebrow{letter-spacing:.15em;font-size:24px}#display>p{font-size:26px}h2{font-size:22px;margin-top:45px}#ready{display:flex;flex-wrap:wrap;gap:18px;justify-content:center}#ready span{font-size:clamp(30px,5vw,64px);background:#24513f;border-radius:16px;padding:12px 30px}footer{text-align:center;color:#9cb7ab;padding:24px}#message{color:#ffe29a}#connection{font-size:14px}body.offline #display{opacity:.45}[hidden]{display:none!important}@media(max-width:650px){header{padding:16px}header button{font-size:12px;padding:9px}main{padding:20px}}
