*{box-sizing:border-box}html{color-scheme:dark}body{margin:0;background:#071e25 url("radio-room.webp") center/cover fixed;color:#eceddc;font:14px/1.5 system-ui,sans-serif}body:before{content:"";position:fixed;inset:0;background:linear-gradient(90deg,#061c25e8,#061c25af 70%,#061c2570);z-index:-1}main{max-width:1120px;padding:30px 35px 20px;margin:auto}header,.topline,.readout,.gridhead,.actions,footer{display:flex;justify-content:space-between;align-items:center;gap:20px}.eyebrow,label,.gridhead,.legend,small{font-size:10px;letter-spacing:.12em} .eyebrow{color:#d8b780;font-weight:700;margin:0}h1{font:400 58px/.95 Georgia,serif;margin:12px 0 0;letter-spacing:-.035em}h1 span{font:400 15px system-ui;letter-spacing:.2em;display:block;text-transform:uppercase;margin:13px 0;color:#a9c7c1}button,select{font:600 12px system-ui;color:#e7ecdc;background:#15363e;border:1px solid #749b9866;border-radius:6px;padding:11px 15px;cursor:pointer;touch-action:manipulation}button:hover,select:hover{border-color:#dabb80;background:#244a4d}button:focus-visible,select:focus-visible{outline:3px solid #f5d590;outline-offset:3px}button:disabled{opacity:.45;cursor:default}header button span{border:1px solid #96a99a77;border-radius:50%;padding:0 5px;margin-left:8px}.topline{padding:18px 0;margin:12px 0 3px;border-top:1px solid #95b2a233}.topline label{display:block;color:#9cb4aa;margin-bottom:6px}select{padding:8px 35px 8px 12px;max-width:280px}.readout{gap:36px;text-align:right}.readout strong{display:block;font:400 25px Georgia;color:#e2c387}.readout small{display:block;color:#9eb9ad;font-size:8px;margin-top:4px}.desk{border:1px solid #98afa35c;border-radius:13px;padding:22px;background:linear-gradient(130deg,#0d2b32ef,#0d2b32cf),url("radio-room.webp") center/cover;box-shadow:0 25px 65px #0006}.brief{padding:0 0 20px;border-bottom:1px solid #93a69b33}.brief h2{font:400 28px Georgia;margin:7px 0}.brief p{margin:0;color:#acc1b4;font-size:13px}.playarea{display:grid;grid-template-columns:185px 1fr;gap:28px;padding:22px 0}.subtle{font-size:11px;color:#a3bbae;line-height:1.6;margin:8px 0 15px}#clues{display:grid;gap:9px}.clue{display:flex;justify-content:space-between;text-align:left;padding:12px 13px;background:#112e35;border-color:#5b858059;border-radius:5px;align-items:center}.clue b{font-size:14px;font-weight:500}.clue span{font-size:11px;color:#8fb5aa}.clue.active{background:#c7ad78;color:#142c32;border-color:#edd39b;box-shadow:0 3px 12px #d1ac5b17}.clue.active span{color:#244d47}.clue.done{opacity:.7}.radio{border-top:1px solid #799b8844;margin-top:23px;padding-top:13px;font-size:9px;letter-spacing:.1em;color:#9ccabb}.live{color:#edb875;margin-right:6px}.wave{color:#99c7b2;letter-spacing:.2em;font-size:15px;margin-top:8px;opacity:.7}.gridhead{font-size:8px;letter-spacing:.09em;color:#a5bcb2;margin:0 0 11px;gap:8px}#activeclue{color:#e5c893}#board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.card{height:82px;padding:0 5px;border:1px solid #b5b2a177;border-radius:7px;background:linear-gradient(135deg,#e9e4ce,#cbcbb7);color:#213d3d;position:relative;font-size:13px;letter-spacing:.04em;box-shadow:0 4px 0 #061b21a8;overflow:hidden}.card:before{content:"";position:absolute;inset:5px;border:1px solid #52706b33;border-radius:3px;pointer-events:none}.card:hover:not(:disabled){transform:translateY(-2px);background:#f2e8ca;color:#132e32}.card .number{position:absolute;left:12px;top:9px;font-size:7px;opacity:.48;letter-spacing:.1em;font-weight:400}.card .mark{display:block;font-size:10px;margin-top:5px;font-weight:400;letter-spacing:.1em}.card.agent{background:linear-gradient(135deg,#41897e,#1e5e59);color:#f0efd9;border-color:#94b7a4;opacity:1}.card.patrol{background:linear-gradient(135deg,#995a42,#633c34);color:#ffdec2;opacity:1}.card.neutral{background:#4b5c5d;color:#d4d7cb;opacity:1}.card.blackout{background:#102129;color:#f8a586;opacity:1;border-color:#da8e6f}.card.hinted{outline:3px solid #f2cd71;outline-offset:2px;box-shadow:0 0 22px #e4bc6550}.card.answer{opacity:.65;border-style:dashed}.legend{display:flex;justify-content:space-between;gap:7px;letter-spacing:0;color:#94b4a7;font-size:8px;margin:15px 0 0}.dispatchlog{border-top:1px solid #8ba79540;padding-top:13px;display:flex;gap:20px;align-items:center;min-height:50px}.dispatchlog .eyebrow{font-size:8px;white-space:nowrap}.dispatchlog p{font-size:12px;margin:0;color:#d3dec9}.actions{justify-content:flex-start;flex-wrap:wrap;margin-top:18px;gap:10px}.actions small{font-size:9px;letter-spacing:0;margin-left:6px;color:#cdb988}.actions .primary{background:#d5b87d;color:#193334;border-color:#e5ce98}#collection{font-size:10px;color:#a6c2b2;margin-left:auto}footer{color:#91ada1;font-size:10px;margin-top:25px}footer button{background:none;border:0;padding:5px}#result{margin-top:18px;border:1px solid #aaa67c77;background:#123b3d;border-radius:9px;padding:20px}#result h2{font:400 26px Georgia;margin:0 0 6px}#result p{color:#bbcfbd;font-size:12px}#result ul{color:#b9cfc0;font-size:12px;columns:2;padding-left:18px}dialog{max-width:620px;width:calc(100% - 30px);border:1px solid #9cad9180;border-radius:14px;background:#102e35;color:#e9ecda;padding:30px;box-shadow:0 20px 90px #0008}dialog::backdrop{background:#04141ed4;backdrop-filter:blur(6px)}dialog h2{font:400 30px Georgia;margin-top:0}dialog p,dialog li{color:#bdd0c0;font-size:14px}dialog a{color:#dfc28b}#close{float:right;font-size:20px;padding:2px 10px}[hidden]{display:none!important}@media(max-width:760px){main{padding:20px 12px}h1{font-size:44px}header button{padding:10px;font-size:10px}header{gap:8px}.topline{gap:12px}.readout{gap:13px}.readout strong{font-size:20px}.readout small{font-size:6px}select{max-width:190px;font-size:11px}.desk{padding:14px}.playarea{grid-template-columns:1fr;gap:17px;padding-top:17px}aside .subtle{margin:5px 0 10px}aside .subtle br{display:none}#clues{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.clue{padding:10px 7px;flex-direction:column;gap:3px}.clue b{font-size:11px}.clue span{font-size:9px}.radio{display:none}#board{gap:7px}.card{height:75px;font-size:11px;letter-spacing:0}.card .number{font-size:6px;left:10px;top:7px}.card .mark{font-size:8px}.gridhead{font-size:7px}.legend{font-size:7px;flex-wrap:wrap}.dispatchlog{gap:12px}.dispatchlog p{font-size:11px}.dispatchlog .eyebrow{font-size:7px}.brief h2{font-size:25px}.actions{gap:7px}.actions button{font-size:10px;padding:11px}#collection{width:100%;margin-top:5px}footer{font-size:8px;align-items:flex-start}#result ul{columns:1}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

@media(max-width:420px){.card{font-size:10px}}
