:root{color-scheme:dark;--ink:#eae9df;--dim:#a2a99d;--line:#343e36;--acid:#c5df90}*{box-sizing:border-box}body{margin:0;background:#0b100e;color:var(--ink);font:16px/1.55 system-ui,Arial,sans-serif}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{border:0;border-radius:7px;background:var(--acid);color:#172017;font-weight:650;cursor:pointer;padding:15px 20px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #fff;outline-offset:4px}button:disabled{opacity:.35;cursor:not-allowed}.secondary{background:#202c24;color:var(--ink);border:1px solid #435445}#shell{position:relative;z-index:3;max-width:1060px;margin:auto;padding:32px}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:58px}.brand{color:var(--ink);text-decoration:none;font-size:20px;font-weight:800;letter-spacing:3px}.brand span{font-weight:300}.brand small{display:block;font-size:9px;letter-spacing:4px;color:var(--acid)}.pill{border:1px solid var(--line);border-radius:40px;padding:6px 13px;font:11px monospace;color:var(--acid);letter-spacing:1px}.eyebrow{font:11px monospace;letter-spacing:2px;color:var(--acid)}h1{font-family:Georgia,serif;font-weight:400;line-height:1.08;font-size:clamp(38px,6vw,68px);margin:22px 0}h2{font:38px Georgia,serif}.muted,.fine{color:var(--dim)}.fine{font-size:12px;margin-top:25px}.panel{max-width:620px;background:rgba(14,22,17,.94);padding:34px;border:1px solid var(--line);border-radius:12px}form{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:32px}label{font-size:12px;color:var(--dim);display:block}input,select{width:100%;padding:12px;margin-top:7px;border:1px solid #465247;border-radius:5px;background:#101a13;color:var(--ink)}form button{grid-column:1/-1;text-align:left}form button span{float:right}.tvList{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:30px 0}.receiver{border:1px solid var(--line);padding:19px;border-radius:8px;background:#142019}.receiver strong{font-size:17px}.receiver p{margin:7px 0 0;color:var(--dim);font-size:13px}.slots{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}.slot{border:1px solid var(--line);padding:24px;background:#101a14;border-radius:9px}.slot.active{border-color:var(--acid)}.slot .number{font:12px monospace;color:var(--acid)}.slot h2{font:26px Georgia,serif;margin:20px 0 10px}.slot p{color:var(--dim);font-size:13px;min-height:42px}.slot button{width:100%}.actions{display:flex;gap:12px;margin-top:25px;flex-wrap:wrap}details{margin-top:35px;border-top:1px solid var(--line);padding:20px 0;color:var(--dim);font-size:13px}pre{white-space:pre-wrap;font-size:11px;max-height:180px;overflow:auto}#notice{color:#f1c894;max-width:650px}#tv button{display:block;margin:14px 0;width:100%}.exit{position:fixed;bottom:18px;right:18px;padding:8px 13px;background:#17251c;color:#b0b8a9;font-size:12px;opacity:.65;z-index:10}.idle{position:fixed;inset:0;overflow:hidden;background:radial-gradient(ellipse at 65% 25%,#25382e 0, #101b17 35%,#050a08 78%);z-index:0}.moon{position:absolute;right:19%;top:12%;width:14vw;height:14vw;border-radius:50%;background:#b0baa3;box-shadow:0 0 80px #7e9e7633;opacity:.22}.door{position:absolute;right:27%;bottom:9%;height:48vh;width:19vh;border:10px solid #050907;background:#020504;transform:perspective(500px) rotateY(-18deg);box-shadow:4px 0 24px #bfcb7044}.door i{position:absolute;right:10%;top:52%;height:6px;width:6px;border-radius:100%;background:#d2d7a7;box-shadow:0 0 15px #c5df90}.fog{position:absolute;inset:55% -30% -20%;background:radial-gradient(ellipse,#69816a33,transparent 65%);animation:drift 30s ease-in-out infinite alternate}.whisper{position:absolute;bottom:17%;left:8%;max-width:55%;animation:breathe 18s ease-in-out infinite alternate}.whisper span{font:10px monospace;letter-spacing:5px;color:#8ba18d}.whisper h1{font-size:clamp(30px,5vw,72px);color:#c5cbb9}.whisper p{font:italic 20px Georgia,serif;color:#798b7c}body:not(.receiverMode) .idle{opacity:.4}body:not(.receiverMode) .whisper{display:none}#screen{position:fixed;inset:0;width:100%;height:100%;object-fit:contain;background:black;z-index:2;visibility:hidden}body.playing #screen{visibility:visible}body.receiverMode.idling header,body.receiverMode.idling #tv,body.receiverMode.idling #notice{display:none}body.receiverMode #shell{max-width:none}body.receiverMode #tv{margin:auto}body.receiverMode #notice{margin:10px auto}@keyframes drift{to{transform:translateX(12%)}}@keyframes breathe{to{opacity:.65;transform:translate(12px,-8px)}}@media(prefers-reduced-motion:reduce){*{animation:none!important}}@media(max-width:600px){#shell{padding:22px}header{margin-bottom:35px}.panel{padding:24px}form{grid-template-columns:1fr}.tvList{grid-template-columns:1fr}.whisper{max-width:80%}.door{right:15%}}
[hidden]{display:none!important}
#backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:none}.idle.has-image #backdrop{display:block}.idle.has-image .moon,.idle.has-image .door,.idle.has-image .whisper{display:none}.idle.has-image .fog{opacity:.3}.ambiencePanel{padding:26px;border:1px solid var(--line);border-radius:10px;margin:25px 0 36px;background:#101a14}.ambiencePanel h2,.videoHeading{font:30px Georgia,serif;margin:15px 0}.backgrounds{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:24px 0}.backgroundChoice{position:relative;background:#18231b;color:var(--ink);padding:0;border:2px solid transparent;overflow:hidden;text-align:left;font-size:12px}.backgroundChoice img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}.backgroundChoice span{display:block;padding:9px;line-height:1.3}.backgroundChoice[aria-pressed=true]{border-color:var(--acid)}.originalSwatch{height:70px;background:radial-gradient(ellipse,#4b6650,#06100a)}.musicControls{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px;align-items:end}.musicControls input{padding:0;accent-color:var(--acid);height:40px}#applyAmbience{margin-top:12px}.receiver p{white-space:pre-line}@media(max-width:700px){.backgrounds{grid-template-columns:repeat(2,minmax(0,1fr))}.musicControls{grid-template-columns:1fr}.ambiencePanel{padding:18px}}
.deviceEditors{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:24px 0}.deviceEditors button{background:#19271e;color:var(--ink);border:2px solid #35483a;text-align:left;min-width:0}.deviceEditors button[aria-pressed=true]{border-color:var(--acid)}.deviceEditors strong{display:block;font-size:19px}.deviceEditors span{display:block;font-size:12px;font-weight:400;margin-top:8px;line-height:1.5;color:var(--dim)}#editingLabel{color:var(--acid);font-size:14px;font-weight:500}.musicControls{grid-template-columns:1fr 1fr}@media(max-width:600px){.deviceEditors,.musicControls{grid-template-columns:1fr}}
.recoveryPanel{border:2px solid var(--acid);border-radius:10px;padding:18px;margin-bottom:26px;background:#142019}.recoveryPanel p{margin-top:0}.recoveryPanel .fine{margin:12px 0 0}#broadcastState{padding:14px;border:1px solid var(--line);border-radius:8px}.slot h2{overflow-wrap:anywhere}
body.receiverMode.idling #recoveryPanel,body.receiverMode.playing #recoveryPanel{display:none}
#pairingCode{display:block;font-size:clamp(3rem,10vw,7rem);font-weight:700;letter-spacing:.14em;margin:1.5rem 0;color:#fff}.receiver input[type=checkbox]{width:1.5rem;height:1.5rem;margin:1rem}.receiver button{margin:.25rem}.receiver{min-width:0}.tvList{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}

