:root{--yotsuba-bg:#ffe;--yotsuba-text:maroon;--yotsuba-panel:#f0e0d6;--yotsuba-border:#d9bfb7;--yotsuba-header:#ea8;--yotsuba-link:#00e;--yotsuba-hover:#d00;--yotsuba-quote:#789922;--yotsuba-name:#117743;--yotsuba-subject:#cc1105;--yotsuba-muted:#707070;--hud-bg:#eef2ff;--hud-text:#000;--hud-panel:#d6daf0;--hud-border:#b7c5d9;--hud-header:#98e;--hud-link:#34345c;--hud-hover:#d00;--hud-quote:#789922;--hud-name:#117743;--hud-subject:#0f0c5d;--hud-muted:#89a;--mobile-hud-scale:.5}html,body,#game{width:100%;height:100%;margin:0;overflow:hidden}html,body{background:var(--hud-bg);color:var(--hud-text);font-family:Arial,Helvetica,sans-serif;font-size:10pt}#game{background:var(--yotsuba-bg)}canvas{image-rendering:pixelated;display:block}#orientation-lock{z-index:1000;box-sizing:border-box;background:var(--hud-bg);color:var(--hud-text);text-align:center;place-items:center;padding:24px;font:700 16px Arial,Helvetica,sans-serif;display:none;position:fixed;inset:0}#mobile-start{z-index:80;box-sizing:border-box;color:var(--hud-text);letter-spacing:0;text-align:center;touch-action:manipulation;background:#eef2ffeb;border:0;place-items:center;padding:24px;font:800 18px Arial,Helvetica,sans-serif;display:none;position:fixed;inset:0}.mobile-ready #mobile-start{display:none!important}#hud{pointer-events:none;gap:6px;font-size:10pt;display:grid;position:fixed;top:12px;left:12px}#server-stats,#player-list{background:var(--hud-panel);border:1px solid var(--hud-border);width:max-content;max-width:calc(100vw - 24px);color:var(--hud-text);border-top:none;border-left:none;padding:2px 5px}#server-stats{white-space:nowrap;align-items:center;gap:8px;display:flex}#server-stats>span:not(:last-child):after{content:"|";color:var(--hud-muted);margin-left:8px;font-weight:400}#fps{color:var(--hud-quote)}#commit{color:var(--hud-muted)}#status{place-items:center;width:10px;min-width:0;height:10px;padding:0;display:inline-grid}#status:before{content:"";background:var(--hud-muted);width:9px;height:9px;box-shadow:0 0 0 1px var(--hud-text);border-radius:50%}#status:after{content:none!important}#status[data-state=connected]:before{background:#117743}#status[data-state=connecting]:before{background:#98e}#status[data-state=disconnected]:before{background:#d00}#player-list{gap:4px;min-width:178px;display:grid}#player-list[hidden]{display:none}.player-list-heading,.player-list-row{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;display:grid}.player-list-heading{color:var(--hud-muted);font-size:9pt}.player-list-row{color:var(--hud-text)}.player-list-row--self{color:var(--hud-name)}.player-list-name{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.player-list-score{color:var(--hud-name)}#dead{z-index:30;box-sizing:border-box;border:1px solid var(--hud-border);background:var(--hud-panel);width:min(440px,100vw - 36px);color:var(--hud-text);pointer-events:auto;text-align:center;border-top:none;border-left:none;gap:10px;padding:12px 14px 14px;display:grid;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}#dead[hidden]{display:none}#dead-message{color:var(--hud-subject);font-size:18px;font-weight:800;line-height:1.15}#name-form{justify-content:center;gap:8px;display:flex}#name-input,#name-submit,#respawn-submit{box-sizing:border-box;background:var(--hud-bg);height:28px;color:var(--hud-text);border:1px solid #aaa;font:10pt Arial,Helvetica,sans-serif}#name-input{width:min(220px,58vw);padding:6px 8px}#name-submit,#respawn-submit{background:var(--hud-header);border-color:var(--hud-text);color:var(--hud-text);cursor:pointer;padding:6px 12px;font-weight:800}#respawn-submit{justify-self:center;min-width:132px}#name-submit:hover,#name-submit:focus-visible,#respawn-submit:hover,#respawn-submit:focus-visible,#name-input:focus-visible{border-color:var(--hud-header);outline:none}#discord-cta{box-sizing:border-box;color:#fff;text-align:center;cursor:pointer;background:#5865f2;border:1px solid #5865f2;justify-self:center;min-width:132px;height:28px;padding:6px 12px;font:800 10pt/16px Arial,Helvetica,sans-serif;text-decoration:none}#discord-cta:hover,#discord-cta:focus-visible{background:#4752c4;border-color:#fff;outline:none}#rage{background:var(--hud-panel);border:1px solid var(--hud-border);min-width:240px;color:var(--hud-text);pointer-events:none;box-sizing:border-box;width:280px;text-align:left;border-top:none;border-left:none;gap:5px;padding:6px 8px;font-size:10pt;line-height:1.2;display:grid;position:fixed;top:20px;right:20px}#score-label{color:var(--hud-name);font-weight:800}#rage-label{color:var(--hud-subject);font-weight:800}#rage-bar{background:var(--hud-bg);border:1px solid var(--hud-border);width:100%;height:10px;overflow:hidden}#rage-fill{transform-origin:0;background:var(--hud-header);width:100%;height:100%;transform:scaleX(0)}#kill-feed{pointer-events:none;justify-items:end;gap:6px;width:min(660px,100vw - 36px);font-family:Arial,Helvetica,sans-serif;display:grid;position:fixed;top:184px;right:18px}#mobile-controls{inset:auto 0 max(12px, env(safe-area-inset-bottom)) 0;z-index:24;padding:0 max(14px, env(safe-area-inset-right)) 0 max(14px, env(safe-area-inset-left));box-sizing:border-box;pointer-events:none;touch-action:none;-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:end;gap:18px;display:none;position:fixed}.analog{pointer-events:auto;-webkit-user-select:none;user-select:none;width:180px;height:180px;position:relative}.mobile-actions{pointer-events:auto;grid-template-rows:62px 82px;grid-template-columns:62px 74px;align-items:center;gap:10px;display:grid}.analog>:not(.dpad-overlay){opacity:0!important;pointer-events:none!important}.dpad-overlay{pointer-events:none;width:180px;height:180px;position:absolute;top:0;left:0}.dpad-arrow{font-family:sans-serif}.dpad-perspective{perspective:420px;perspective-origin:50%}.dpad-body{width:180px;height:180px;transition:transform 60ms ease-out;position:relative}.dpad-body.pressed-east{transform:rotateY(20deg)}.dpad-body.pressed-west{transform:rotateY(-20deg)}.dpad-cross{background-color:var(--hud-header);clip-path:polygon(0 33.33%,100% 33.33%,100% 66.67%,0 66.67%);filter:drop-shadow(1px 1px 0 var(--hud-border)) drop-shadow(2px 2px 0 var(--hud-text));pointer-events:none;background-image:linear-gradient(135deg,#eef2ff61 0%,#eef2ff24 30%,#0f0c5d00 55%,#0f0c5d2e 100%);background-size:cover;position:absolute;inset:0}.dpad-arrow{color:var(--hud-text);pointer-events:none;z-index:1;-webkit-user-select:none;user-select:none;font-size:18px;line-height:1;position:absolute}.dpad-w{top:50%;left:17px;transform:translateY(-50%)}.dpad-e{top:50%;right:17px;transform:translateY(-50%)}.dpad-pip{pointer-events:none;z-index:1;background:#0f0c5d24;border-radius:50%;width:18px;height:18px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:inset 0 1px 2px #0f0c5d52}.mobile-control{border:1px solid var(--hud-text);background:linear-gradient(180deg, #eef2ff57, #d6daf02e), var(--hud-header);box-shadow:inset 0 0 0 1px #0f0c5d38, 2px 2px 0 var(--hud-border);color:var(--hud-text);touch-action:none;cursor:pointer;-webkit-tap-highlight-color:transparent;margin:0;padding:0;position:relative}.mobile-control:before,.mobile-control:after{content:"";margin:auto;position:absolute;inset:0}.mobile-control:active,.mobile-control[data-pressed=true]{background:linear-gradient(180deg, #eef2ff2e, #0f0c5d1a), var(--hud-panel);border-color:var(--hud-hover);box-shadow:inset 0 0 0 1px #0f0c5d47, 1px 1px 0 var(--hud-border);transform:translate(2px,2px)}.mobile-action{border-radius:50%;width:62px;height:62px}.mobile-action--fire{grid-area:1/2}.mobile-action--fire:before{border:3px solid var(--hud-text);box-sizing:border-box;border-radius:50%;width:27px;height:27px}.mobile-action--fire:after{background:var(--hud-text);width:7px;height:7px;box-shadow:0 -18px 0 -2px var(--hud-text), 0 18px 0 -2px var(--hud-text), -18px 0 0 -2px var(--hud-text), 18px 0 0 -2px var(--hud-text);border-radius:50%}.mobile-action--accelerate{border-radius:8px;grid-area:2/2;width:74px;height:82px}.mobile-action--accelerate:before,.mobile-action--accelerate:after{border-top:5px solid var(--hud-name);border-right:5px solid var(--hud-name);width:22px;height:22px;transform:rotate(-45deg)}.mobile-action--accelerate:before{top:-20px}.mobile-action--accelerate:after{top:20px}.mobile-action--kamikaze{border-color:var(--hud-hover);grid-area:1/1}.mobile-action--kamikaze:before{background:var(--hud-hover);clip-path:polygon(35% 0,100% 0,65% 54%,92% 54%,26% 100%,45% 62%,10% 62%);width:10px;height:30px}.mobile-action--reverse{border-radius:8px;grid-area:2/1;width:62px;height:82px}.mobile-action--reverse:before,.mobile-action--reverse:after{border-right:5px solid var(--hud-subject);border-bottom:5px solid var(--hud-subject);width:20px;height:20px;transform:rotate(45deg)}.mobile-action--reverse:before{top:-18px}.mobile-action--reverse:after{top:18px}.kill-feed-row{box-sizing:border-box;background:var(--hud-panel);border:1px solid var(--hud-border);max-width:100%;min-height:42px;color:var(--hud-text);letter-spacing:0;border-top:none;border-left:none;border-radius:0;grid-template-columns:minmax(0,auto) 69px minmax(0,auto);align-items:center;gap:11px;padding:5px 12px 5px 15px;font-size:16px;font-weight:700;line-height:1.05;animation:6.2s ease-out forwards kill-feed-fade;display:inline-grid;overflow:hidden}.kill-feed-row--local{border-color:var(--hud-header);box-shadow:inset 3px 0 0 var(--hud-header)}.kill-feed-row--death{border-color:var(--hud-hover);box-shadow:inset 3px 0 0 var(--hud-hover)}.kill-feed-row--king-kill{border-color:var(--hud-header);background:#e0e5f6}.kill-feed-name{text-overflow:ellipsis;white-space:nowrap;min-width:0;max-width:225px;overflow:hidden}.kill-feed-row .kill-feed-name:first-child{color:var(--hud-name);text-align:right}.kill-feed-row .kill-feed-name:last-child{color:var(--hud-subject);text-align:left}.kill-feed-name--local{color:var(--hud-name)!important}.kill-feed-icon{box-sizing:border-box;background:var(--hud-bg);border-left:1px solid var(--hud-border);border-right:1px solid var(--hud-border);min-width:69px;color:var(--hud-text);text-align:center;padding:3px 9px;font-size:18px;line-height:1}.kill-feed-icon--gas{color:var(--hud-quote)}.kill-feed-icon--projectile{color:var(--hud-text)}.kill-feed-icon--lazor{color:var(--hud-link)}.kill-feed-icon--explosion{color:var(--hud-hover)}.kill-feed-icon--tail{color:var(--hud-name)}.kill-feed-icon--player{color:var(--hud-text)}@keyframes kill-feed-fade{0%{opacity:0;transform:translate(14px)}8%,78%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(18px)}}#chat-terminal{z-index:25;box-sizing:border-box;color:#9cffac;pointer-events:auto;text-shadow:0 0 6px #3cff6bdb;background:linear-gradient(#00ff520f 50%,#00000005 50%) 0 0/100% 4px,#000802e6;border:1px solid #52ff80d1;grid-template-rows:minmax(0,1fr) 30px;width:min(360px,100vw - 228px);height:176px;font:12px/1.25 Courier New,monospace;display:grid;position:fixed;bottom:18px;right:192px;overflow:hidden;box-shadow:0 0 16px #00ff5252,inset 0 0 18px #00ff5224}#chat-log{scrollbar-width:thin;scrollbar-color:#52ff80b3 #001004e6;min-height:0;padding:9px 10px 4px;overflow:hidden auto}#chat-log::-webkit-scrollbar{width:7px}#chat-log::-webkit-scrollbar-track{background:#001004e6}#chat-log::-webkit-scrollbar-thumb{background:#52ff80b3}.chat-row{grid-template-columns:minmax(58px,auto) minmax(0,1fr);align-items:start;gap:7px;min-height:15px;display:grid}.chat-name{color:#0f6;text-overflow:ellipsis;white-space:nowrap;min-width:0;font-weight:700;overflow:hidden}.chat-name:before{content:"[";color:#9cffacc7}.chat-name:after{content:"]";color:#9cffacc7}.chat-row--self .chat-name{color:#d7ff72}.chat-text{overflow-wrap:anywhere;color:#baffc4;min-width:0}#chat-form{box-sizing:border-box;background:#001004b8;border-top:1px solid #52ff807a;grid-template-columns:18px minmax(0,1fr);align-items:center;gap:3px;margin:0;padding:4px 8px 7px;display:grid}#chat-prompt{color:#0f6;font-weight:700}#chat-input{box-sizing:border-box;color:#d6ffdc;letter-spacing:0;text-shadow:0 0 6px #3cff6be6;background:0 0;border:0;outline:none;width:100%;min-width:0;height:21px;padding:2px 4px;font:12px Courier New,monospace}#chat-input::placeholder{color:#9cffac85}#chat-terminal:focus-within{border-color:#d7ff72;box-shadow:0 0 24px #00ff527a,inset 0 0 22px #00ff522e}#copyright{box-sizing:border-box;max-width:calc(100vw - 24px);color:var(--hud-muted);opacity:.5;pointer-events:auto;background:0 0;border:1px solid #0000;padding:2px 4px;font-size:10px;line-height:1.25;position:fixed;bottom:6px;left:12px}#copyright:hover,#copyright:focus{background:var(--hud-panel);border-color:var(--hud-border);opacity:1;max-width:860px;padding:4px 6px;font-size:12px}#copyright:focus{outline:1px solid var(--hud-header);outline-offset:2px}.copyright-full,#copyright:hover .copyright-compact,#copyright:focus .copyright-compact{display:none}#copyright:hover .copyright-full,#copyright:focus .copyright-full{display:inline}.copyright-discord{color:#5865f2;pointer-events:auto;margin-left:6px;font-weight:700;text-decoration:none}.copyright-discord:before{content:"· ";color:var(--hud-muted);font-weight:400}.copyright-discord:hover,.copyright-discord:focus-visible{text-decoration:underline}@media (width<=720px){#chat-terminal{width:calc(100vw - 194px);height:138px;bottom:14px;right:176px}.chat-row{grid-template-columns:minmax(48px,auto) minmax(0,1fr)}#kill-feed{width:min(540px,100vw - 24px);top:172px;right:12px}.kill-feed-row{grid-template-columns:minmax(0,auto) 57px minmax(0,auto);gap:8px;min-height:42px;padding:5px 10px 5px 12px;font-size:18px}.kill-feed-name{max-width:168px}.kill-feed-icon{min-width:57px;padding:3px 8px;font-size:22.5px}}@media (hover:none),(pointer:coarse){#mobile-start{display:grid}#server-stats,#player-list{transform:scale(var(--mobile-hud-scale));transform-origin:0 0}#rage,#kill-feed{transform:scale(var(--mobile-hud-scale));transform-origin:100% 0}#kill-feed{top:92px}#chat-terminal{display:none}#mobile-controls{display:flex}#copyright{display:none}}@media (hover:none) and (orientation:portrait),(pointer:coarse) and (orientation:portrait),(hover:none) and (width<=680px),(pointer:coarse) and (width<=680px){body>:not(#orientation-lock){display:none!important}#orientation-lock{display:grid}}@media (width<=420px){#mobile-controls{gap:10px}.analog,.dpad-overlay,.dpad-body{width:162px;height:162px}.mobile-actions{grid-template-rows:56px 74px;grid-template-columns:56px 66px;gap:8px}.mobile-action{width:56px;height:56px}.mobile-action--accelerate{width:66px;height:74px}.mobile-action--reverse{width:56px;height:74px}}
