@font-face{font-family:Barlow;src:url('assets/barlow.ttf')}*{box-sizing:border-box} :root{font-family:Arial,sans-serif;color:#f3f2ed;background:#18252b;color-scheme:dark}body{margin:0;overflow:hidden}button,select{font:inherit}button{cursor:pointer;color:inherit;border:1px solid #ffffff35;background:#172329e8;padding:12px 16px;border-radius:6px}button:hover{background:#39464b;border-color:#dabb83}button:disabled{opacity:.5;cursor:wait}button:focus-visible,select:focus-visible,a:focus-visible{outline:2px solid #e7c68e;outline-offset:3px}[hidden]{display:none!important}svg{width:23px;height:23px;display:block;flex:none}canvas,#shade{position:fixed;inset:0;width:100%;height:100%}canvas{touch-action:none}#shade{pointer-events:none;background:linear-gradient(90deg,#121a21f2,#121a21c9 25%,#121a2100 66%)}header{position:fixed;inset:24px 28px auto;display:flex;justify-content:space-between;align-items:center;z-index:3}#brand{display:flex;align-items:center;gap:12px;color:#f4e6cb;text-decoration:none;font:22px Barlow;letter-spacing:1px}#brand svg{color:#d6b47c}#settingsBtn{padding:10px}main{position:absolute;top:16vh;left:6vw;width:340px;max-height:80vh;overflow:auto;padding-bottom:20px}h1{font:72px/.95 Barlow;margin:0 0 30px}p{line-height:1.65;color:#c3c9cc}.tabs{display:flex;gap:8px;margin-bottom:14px}.tabs button{flex:1}.selected{background:#b999612a!important;border-color:#d1b078!important;color:#f2d7a6}.agency{display:flex;align-items:center;gap:12px;width:100%;text-align:left;margin:7px 0;font-size:13px;padding:12px}.agency svg{width:20px}.setup{display:flex;gap:12px;margin:22px 0}label{font-size:12px;color:#c4c8ca;flex:1}select{width:100%;margin-top:8px;padding:10px 5px;background:#1c292f;border:1px solid #ffffff35;border-radius:4px;color:#eee;font-size:12px}.primary{display:flex;align-items:center;justify-content:space-between;width:100%;background:#dfc18c;color:#1d2428;border:0;font-weight:bold;font-size:16px;padding:16px}.primary:hover{background:#eed8b1}#record{font-size:10px;color:#b3b9bd;margin:16px 0}#loading{font-size:12px;margin-top:12px}.credits{color:#aab3ba;font-size:11px}#hud{position:fixed;inset:85px 28px 20px;pointer-events:none;z-index:2}#hud button{pointer-events:auto}.topline{display:flex;gap:20px;align-items:center;font-size:11px;color:#e7e9e9;text-shadow:0 1px 5px #000}.topline #timeOfDay{margin-left:auto}.topline #shiftclock{font:24px Barlow}#dispatch{display:flex;gap:12px;align-items:center;margin-top:20px;width:270px;padding:12px;background:#172329c9;border-radius:5px;font-size:12px;line-height:1.5}#callText{flex:1}#callBtn{padding:8px}#notice{position:absolute;left:20%;right:20%;bottom:205px;text-align:center;font-size:13px;text-shadow:0 2px 5px #000;background:#18232a99;border-radius:4px}#notice:empty{display:none}#dashboard{position:absolute;bottom:65px;left:50%;transform:translateX(-50%);display:flex;gap:32px;background:#172329dc;border-top:2px solid #c6ab6b;border-radius:6px;padding:14px 24px;min-width:350px}#dashboard>div{display:flex;flex-direction:column;justify-content:center}small{font-size:9px;letter-spacing:1px;color:#acb7bc}#dashboard strong{font:56px/1 Barlow}#dashboard b{font:25px Barlow;margin:7px 0}#dashboard span{font-size:9px;color:#acb7bc;white-space:nowrap}.actions{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:center;gap:6px}.actions button{display:flex;align-items:center;gap:7px;padding:10px}kbd{font:10px Arial;color:#aeb9bf}dialog{background:#172329;color:#eee;border:1px solid #6b7276;border-radius:10px;width:470px;max-width:92vw;padding:28px}dialog::backdrop{background:#0009;backdrop-filter:blur(4px)}dialog h2{font:32px Barlow;margin:0 0 20px}dialog button{margin:5px}dialog input{width:100%;margin:16px 0}dialog summary{cursor:pointer;margin:15px 0;color:#d5b881}dialog p{font-size:13px}.control-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;font-size:12px;color:#bfc8ce;margin:18px 0}.control-grid b{color:#eee}#fullscreen{position:fixed;right:28px;bottom:24px;padding:10px;z-index:4}#touch{display:none}body.playing #shade{display:none}body.playing #brand{font-size:17px}body.playing header{top:18px}body.playing #settingsBtn{display:none}@media(max-width:700px){header{inset:18px 18px auto}main{left:5vw;top:100px;width:310px;max-width:90vw;max-height:calc(100vh - 110px)}h1{font-size:52px;margin-bottom:20px}#shade{background:linear-gradient(90deg,#15212bed,#15212b70)}#hud{inset:75px 12px 14px}#unit{max-width:130px;font-size:9px}#dashboard{min-width:300px;gap:20px;bottom:110px}.actions{bottom:58px;gap:4px}.actions button{padding:8px}.actions kbd{display:none}#dispatch{width:220px;font-size:11px}#notice{left:5%;right:5%;bottom:230px}#fullscreen{display:none}}@media(pointer:coarse){#touch{display:flex;position:absolute;bottom:0;gap:8px;left:50%;transform:translateX(-50%)}#touch button{touch-action:none;width:58px}.actions{bottom:60px}#dashboard{bottom:115px}}
#dispatch:has(#callText:empty){width:44px;padding:0;background:transparent}#callText:empty{display:none}

main#menu{left:50%;top:50%;transform:translate(-50%,-50%);width:380px;max-width:calc(100vw - 36px);max-height:calc(100dvh - 130px);padding:25px 28px 20px;background:#121b22e8;border:1px solid #ffffff1c;border-radius:12px;box-shadow:0 20px 70px #0006;backdrop-filter:blur(12px)}#menu h1{text-align:center;font-size:52px;line-height:.96;margin-bottom:24px}#menu #record,#menu .credits{display:block;text-align:center}#shade{background:radial-gradient(ellipse at center,#10192018,#10192080)}@media(max-height:650px){main#menu{max-height:calc(100dvh - 90px);top:calc(50% + 15px);padding:18px 24px}#menu h1{font-size:34px;margin-bottom:14px}#menu .agency{padding:9px}#menu .setup{margin:14px 0}}