:root{--ink:#172038;--ink2:#253a5e;--paper:#ebede9;--sand:#e8c170;--sand2:#de9e41;--sea:#4f8fba;--sea2:#73bed3;--red:#cf573c;--shadow:#090a14}*{box-sizing:border-box}html,body{background:#10121c;height:100%;margin:0;overflow:hidden}#app{position:fixed;inset:0}#view{width:100%;height:100%;image-rendering:pixelated;display:block;position:absolute;inset:0}#ui{pointer-events:none;color:var(--paper);-webkit-font-smoothing:none;font-smooth:never;-webkit-user-select:none;user-select:none;font-family:Galmuri11,monospace;font-size:11px;position:absolute;inset:0}#ui.interactive{pointer-events:auto}#ui .hidden{display:none!important}#ui button,#ui input{font-family:inherit;font-size:11px}.panel{border:3px solid var(--paper);min-width:330px;max-width:calc(100vw - 32px);box-shadow:0 0 0 3px var(--ink), 6px 6px 0 3px #090a1499;pointer-events:auto;background:#172038eb;flex-direction:column;align-items:stretch;gap:11px;padding:22px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.menu{left:64px;transform:translateY(-50%)}@media (max-width:720px){.menu{left:50%;transform:translate(-50%,-50%)}}.logo{letter-spacing:2px;text-shadow:4px 4px 0 var(--shadow);font-family:Galmuri14,Galmuri11,monospace;font-size:56px;line-height:1}.logo .l1{color:var(--sand)}.logo .l2{color:var(--sea2)}.tagline{color:var(--sand2);text-shadow:2px 2px 0 var(--shadow);margin-top:-6px;margin-bottom:6px;font-size:22px}.row{align-items:center;gap:8px;display:flex}.lbl{min-width:44px;color:var(--sea2)}.txt{background:var(--paper);min-width:0;color:var(--ink);border:2px solid var(--ink);outline:none;flex:1;padding:7px 8px;box-shadow:inset 2px 2px #a8b5b2}.txt.code{letter-spacing:6px;text-transform:uppercase;padding:4px 8px;font-size:22px!important}.btn{color:var(--ink);background:var(--sand);border:2px solid var(--ink);box-shadow:inset -3px -3px 0 var(--sand2), inset 3px 3px 0 #f3dca0, 3px 3px 0 var(--shadow);cursor:pointer;text-align:center;white-space:nowrap;padding:9px 14px;font-size:22px!important}.btn:hover{box-shadow:inset -3px -3px 0 var(--sand2), inset 3px 3px 0 #fbe9bd, 4px 4px 0 var(--shadow);background:#f0d48a;transform:translate(-1px,-1px)}.btn:active{box-shadow:inset 3px 3px 0 var(--sand2);transform:translate(2px,2px)}.btn:disabled{opacity:.55;cursor:default;transform:none}.btn.big{background:var(--sea2);box-shadow:inset -3px -3px 0 var(--sea), inset 3px 3px 0 #a4dddb, 3px 3px 0 var(--shadow)}.btn.big:hover{background:#8fd0e0}.btn.ghost{color:var(--paper);border-color:var(--paper);box-shadow:3px 3px 0 var(--shadow);background:0 0;font-size:11px!important}.btn.ghost:hover{background:#ebede91f}.chip{color:var(--paper);border:2px solid var(--ink2);cursor:pointer;background:0 0;flex:1;padding:5px 0}.chip.on{background:var(--red);border-color:var(--paper)}.help{border-top:2px dashed var(--ink2);color:#c7cfcc;margin-top:4px;padding-top:10px;line-height:1.75}.help b{color:var(--sand);font-weight:400}.title{text-align:center;color:var(--sand);text-shadow:3px 3px 0 var(--shadow);font-size:33px}.status{text-align:center;color:#c7cfcc;font-size:11px;line-height:1.6}.bigcode{text-align:center;letter-spacing:10px;color:var(--sea2);text-shadow:4px 4px 0 var(--shadow);-webkit-user-select:text;user-select:text;font-family:Galmuri14,monospace;font-size:56px}.hud{position:absolute;inset:0}.board{border:3px solid var(--paper);box-shadow:0 0 0 3px var(--ink), 4px 4px 0 3px #090a1480;background:#172038d9;align-items:center;gap:10px;padding:6px 14px;display:flex;position:absolute;top:14px;left:50%;transform:translate(-50%)}.team{align-items:center;gap:10px;display:flex}.team .name{color:var(--team,#fff);text-shadow:1px 1px 0 var(--shadow);text-overflow:ellipsis;white-space:nowrap;max-width:140px;font-size:11px;overflow:hidden}.team .score{text-align:center;min-width:50px;color:var(--paper);text-shadow:3px 3px 0 var(--team,#000);font-family:Galmuri14,monospace;font-size:42px}.team .serve{color:var(--sand);font-size:11px}.vs{color:var(--sand);font-size:33px}.score.pop{animation:.45s steps(5,end) pop}@keyframes pop{0%{transform:scale(1.8)}to{transform:scale(1)}}.banner{text-align:center;text-shadow:4px 4px 0 var(--shadow);position:absolute;top:30%;left:0;right:0}.banner .main{color:var(--sand);font-family:Galmuri14,monospace;font-size:84px}.banner .sub{color:var(--paper);margin-top:8px;font-size:22px}.banner.in{animation:.35s steps(6,end) bannerIn}.banner.t0 .main{color:var(--sea2)}.banner.t1 .main{color:var(--red)}@keyframes bannerIn{0%{opacity:0;transform:scale(2.2)}to{opacity:1;transform:scale(1)}}.hint{text-align:center;color:var(--paper);text-shadow:2px 2px 0 var(--shadow);font-size:22px;animation:1.2s steps(2,end) infinite blink;position:absolute;bottom:18px;left:0;right:0}.hint:empty{display:none}@keyframes blink{50%{opacity:.45}}.cross{width:14px;height:14px;margin:-7px 0 0 -7px;position:absolute;top:50%;left:50%}.cross:before,.cross:after{content:"";background:var(--paper);box-shadow:1px 1px 0 var(--shadow);position:absolute}.cross:before{width:2px;height:14px;top:0;left:6px}.cross:after{width:14px;height:2px;top:6px;left:0}.netinfo{color:#c7cfcc;text-shadow:1px 1px 0 var(--shadow);position:absolute;top:12px;right:12px}.fps{color:#c7cfcc;text-shadow:1px 1px 0 var(--shadow);position:absolute;top:12px;left:12px}.toast{background:var(--ink);border:2px solid var(--paper);padding:8px 14px;position:absolute;bottom:64px;left:50%;transform:translate(-50%)}.lil-gui.lil-root{z-index:20;--font-family:"Galmuri11", monospace;--font-size:11px;max-height:100vh;position:fixed;top:0;right:0;overflow-y:auto}