/* Andreas Gundelach / CODEX */
:root{color-scheme:dark;font-family:Segoe UI,Arial,sans-serif;color:#edf2ea;background:#090c09;--accent:#d7fb75}*{box-sizing:border-box}body{margin:0;overflow:hidden}button{font:inherit;cursor:pointer;border:1px solid #ffffff25;border-radius:9px;padding:12px 17px;background:#30372d;color:#f3f6ee}button:focus-visible{outline:3px solid var(--accent);outline-offset:4px}[hidden]{display:none!important}#stage{position:fixed;inset:0;background:#000}#stage>img,#stage>video,#stage>iframe{width:100%;height:100%;border:0;object-fit:contain}#stage>iframe{background:#fff}.waiting{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(ellipse at top,#263321,#101510);text-align:center;padding:30px}.brand{width:70px;height:70px;border-radius:20px;background:var(--accent);color:#223019;display:grid;place-items:center;font-size:44px;font-weight:800;margin-bottom:15px}.waiting h1{font-size:clamp(24px,4vw,58px);font-weight:500;letter-spacing:-1px;margin-bottom:4px}.waiting p{font-size:clamp(13px,1.5vw,24px);color:#aab5a2;max-width:700px;line-height:1.6}.clock{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(ellipse at top,#233422,#0b110d)}.clock-time{font-size:clamp(65px,18vw,360px);font-weight:300;letter-spacing:-.055em;line-height:1.05;font-variant-numeric:tabular-nums}.clock-date{font-size:clamp(18px,2.5vw,60px);color:#b0c3a3;margin-top:3vh;font-weight:300}.pairing{position:fixed;inset:0;background:radial-gradient(ellipse at 15% 20%,#2a3923,#111610 65%);display:flex;align-items:center;justify-content:center;gap:8vw;padding:6vw;overflow:auto}.pair-info{max-width:620px}.label{font-size:11px;letter-spacing:3px;color:#abb9a2}.pair-info h1{font-size:clamp(35px,5vw,96px);font-weight:500;line-height:1.02;letter-spacing:-3px;margin:28px 0}.pair-info p{color:#aebba6;line-height:1.9;font-size:clamp(14px,1.3vw,24px)}.steps{display:flex;gap:25px;margin-top:40px;font-size:11px;color:#cdddba;flex-wrap:wrap}.pair-card{background:#1f281d;border:1px solid #3c4935;border-radius:24px;padding:30px;display:flex;flex-direction:column;align-items:center;min-width:280px;max-width:400px;text-align:center;box-shadow:0 25px 100px #0004}.pair-card #qr{background:#fff;padding:15px;border:0;border-radius:12px;width:min(26vw,310px);height:min(26vw,310px);min-width:220px;min-height:220px;margin-bottom:28px;color:#222;display:grid;place-items:center}.pair-card #qr svg{width:100%;height:100%;display:block}.screen-id{font-family:Consolas,monospace;font-size:24px;letter-spacing:4px;font-weight:400;margin-top:12px}.pair-card p{font-size:11px;color:#b8c5ae;line-height:1.6}.secondary{background:transparent;font-size:11px;padding:10px 13px}.small{font-size:10px;color:#99a391;line-height:1.7;overflow-wrap:anywhere}.menu-toggle{position:fixed;bottom:12px;right:14px;background:#192216b3;border:1px solid #ffffff20;color:#a9b59e;padding:3px 12px;min-height:28px;opacity:.65;z-index:10}.menu-toggle:hover,.menu-toggle:focus{opacity:1}dialog{width:min(520px,calc(100vw - 30px));max-height:90vh;overflow:auto;background:#1a2218;color:#edf2ea;border:1px solid #43503b;border-radius:15px;padding:25px;box-shadow:0 25px 80px #0008}dialog::backdrop{background:#0008}.menu-head{display:flex;justify-content:space-between;align-items:center}.menu-head h2{font-size:22px;font-weight:500}.menu-head button{padding:4px 10px;font-size:25px;background:none}dl{display:grid;grid-template-columns:140px 1fr;gap:13px;font-size:12px;line-height:1.6}dt{color:#9fad95}dd{margin:0;overflow-wrap:anywhere}.menu-actions{display:flex;gap:8px;flex-wrap:wrap;margin:25px 0}.menu-actions button{font-size:11px;padding:10px 13px}#diag-error{font-size:12px;color:#ffd28a;line-height:1.6}#sync-now{background:var(--accent);color:#26321d}.tap-to-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:var(--accent);color:#26321d;z-index:2;font-size:18px;padding:18px 30px}
@media(max-width:760px),(orientation:portrait){.pairing{flex-direction:column;gap:25px;padding:25px}.pair-info{text-align:center}.pair-info h1{font-size:40px;letter-spacing:-1px;margin:16px 0}.pair-info h1 br{display:none}.pair-info p{font-size:12px;margin:0}.steps{display:none}.pair-card{padding:23px;max-width:350px}.pair-card #qr{width:220px;height:220px;margin-bottom:20px}.label{font-size:9px}.screen-id{font-size:22px}.clock-time{font-size:20vw}.clock-date{font-size:4vw}dl{grid-template-columns:110px 1fr}}