:root{--ink: #24170f;--cream: #fff6e4;--yolk: #ffc83d;--gum: #ff4f93;--you: #ef4b4b;color:var(--ink);font-family:Fredoka,Trebuchet MS,sans-serif}*{box-sizing:border-box}html,body,#app{margin:0;height:100%;overflow:hidden;background:#87c4f0}#game{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;touch-action:none}.label-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:2}.tag{text-align:center;font-weight:700;font-size:12px;color:var(--ink);white-space:nowrap}.tag .bar{width:65px;height:8px;margin:3px auto 0;background:#3a2018;border:2px solid var(--ink);border-radius:99px;overflow:hidden}.tag .bar span{display:block;height:100%;width:100%;background:#7dce4a}.tag.me{color:#6d3d08}#hud,#lobby,#radio{position:absolute;top:0;right:0;bottom:0;left:0}#hud{z-index:3;pointer-events:none;zoom:.88}#hud button,#hud canvas{pointer-events:auto}#wordmark{position:absolute;top:14px;left:50%;transform:translate(-50%);font-family:Lilita One,Arial Black,sans-serif;font-size:28px;letter-spacing:.04em;color:var(--cream);-webkit-text-stroke:6px var(--ink);paint-order:stroke fill;text-shadow:4px 4px 0 var(--ink)}#wordmark span{color:var(--yolk)}#feed{position:absolute;top:52px;left:50%;transform:translate(-50%);list-style:none;margin:0;padding:0;width:min(560px,92vw);display:flex;flex-direction:column;gap:6px;align-items:center}#feed li{background:var(--cream);border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink);padding:4px 10px;font-weight:700;max-width:100%}#feed li.mine{background:#ffe28a}#feed li.fade{opacity:0;transition:opacity .5s ease}#vitals{position:absolute;top:16px;left:16px;width:min(280px,calc(100vw - 32px));background:var(--cream);border:4px solid var(--ink);box-shadow:6px 6px 0 var(--ink);padding:10px 12px 12px}#you-name{font-family:Lilita One,sans-serif;font-size:22px;line-height:1;margin-bottom:8px}#hp{height:18px;background:#3a2018;border:3px solid var(--ink);border-radius:99px;overflow:hidden}#hp-fill{height:100%;width:100%;background:#7dce4a}.vital-readout{display:flex;flex-wrap:wrap;justify-content:space-between;gap:0 8px;margin-top:4px;font-weight:700;font-size:13px}#power-num{color:#76510b}#board-column{position:absolute;top:16px;right:16px;width:240px;display:flex;flex-direction:column;gap:10px;max-height:calc(100vh - 32px);overflow:auto;pointer-events:auto}#board-wrap,#global-hud,.global-card{background:var(--cream);border:4px solid var(--ink);box-shadow:6px 6px 0 var(--ink);padding:8px 10px 10px}.global-card{width:min(260px,92vw);transform:rotate(1.5deg);align-self:center}.global-card h2,#global-hud h2,#board-wrap h2{margin:0 0 6px;font-family:Lilita One,sans-serif;font-size:18px;font-weight:400}[data-global]{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}[data-global] li{display:grid;grid-template-columns:1.4em 1fr auto;gap:6px;align-items:center;font-size:14px;font-weight:700}[data-global] li.mine{color:#8a3d12}[data-global-empty]{margin:4px 0 0}button.sign{margin-top:8px;width:100%;font-family:Lilita One,sans-serif;font-size:16px;background:var(--gum);color:#fff;border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink);cursor:pointer;padding:4px 8px}#plaque{position:absolute;top:0;right:0;bottom:0;left:0;z-index:8;display:flex;align-items:center;justify-content:center;background:#12180e73;padding:20px}#plaque form{width:min(420px,94vw);background:var(--cream);border:4px solid var(--ink);box-shadow:10px 12px 0 var(--ink);padding:18px 18px 14px;display:flex;flex-direction:column;gap:8px}#plaque h2{margin:0;font-family:Lilita One,sans-serif;font-size:42px;line-height:.9;font-weight:400}#plaque-copy,#plaque-error{margin:0;font-weight:700}#plaque-error{color:#a32616;min-height:1.2em}#plaque-name{font:700 20px Fredoka,sans-serif;padding:8px 10px;border:4px solid var(--ink);background:#fff;color:var(--ink)}#plaque-later{background:transparent;border:none;font-weight:700;cursor:pointer;text-decoration:underline;color:var(--ink)}#board{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}#board li{display:grid;grid-template-columns:12px 1fr auto auto;gap:6px;align-items:center;font-size:14px;font-weight:700}#board li.me span{color:#8a3d12}#board i{width:12px;height:12px;border:2px solid var(--ink);border-radius:99px;display:block}#board em{margin-left:4px;font-style:normal;font-size:10px;letter-spacing:.04em;text-transform:uppercase;color:#7a624c}#board b,#board small{font-variant-numeric:tabular-nums}#board small{color:#7a624c;font-weight:700}#egg-meter{position:absolute;left:50%;bottom:18px;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:4px}.shell{width:46px;height:60px;border-radius:50%/58% 58% 42% 42%;border:4px solid var(--ink);background:#fffaf2;overflow:hidden;position:relative;box-shadow:4px 4px 0 var(--ink)}#egg-fill{position:absolute;left:0;right:0;bottom:0;height:100%;background:var(--yolk);transform-origin:bottom;transform:scaleY(1)}#egg-label{font-family:Lilita One,sans-serif;color:var(--cream);-webkit-text-stroke:4px var(--ink);paint-order:stroke fill;letter-spacing:.06em}#egg-label.ready{color:var(--yolk);animation:pulse .7s ease-in-out infinite}#map{position:absolute;left:16px;bottom:16px;width:148px;height:148px;background:#6eae48;border:4px solid var(--ink);box-shadow:5px 5px 0 var(--ink);image-rendering:pixelated}#hint{position:absolute;right:16px;bottom:16px;margin:0;max-width:240px;background:var(--cream);border:3px solid var(--ink);padding:8px 10px;font-weight:700;font-size:14px;box-shadow:4px 4px 0 var(--ink);animation:hintout 9s ease forwards}#mute{position:absolute;right:16px;bottom:86px}.sound-button{font-family:Fredoka,sans-serif;font-weight:700;background:var(--cream);border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink);padding:4px 8px;cursor:pointer}.sound-button[aria-pressed=true]{background:#e6d4b5}.lobby-links{display:flex;align-items:center;justify-content:space-between;gap:8px}#scrambled{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;pointer-events:none;text-align:center;padding:24px}.stamp{font-family:Lilita One,sans-serif;font-size:clamp(56px,10vw,104px);line-height:.9;color:#ff5a3c;border:8px solid #ff5a3c;padding:6px 18px 10px;transform:rotate(-8deg);background:#fff6e4e6;text-shadow:4px 4px 0 var(--ink)}#scrambled-quip,#respawn-msg{margin:0;background:var(--cream);border:3px solid var(--ink);padding:6px 10px;font-weight:700;box-shadow:3px 3px 0 var(--ink)}#vignette{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(circle,transparent 42%,rgba(160,16,16,.55) 100%);opacity:0;transition:opacity .12s linear}#vignette.show{opacity:1}#lobby{z-index:5;display:flex;align-items:center;justify-content:center;gap:36px;padding:28px;background:linear-gradient(180deg,#121c101f,#12180e8c)}.poster-frame{margin:0;background:var(--cream);border:4px solid var(--ink);box-shadow:12px 14px 0 var(--ink);padding:12px 12px 10px;transform:rotate(-2.4deg);width:min(400px,42vw)}.poster-frame img{display:block;width:100%;height:auto;border:3px solid var(--ink);background:#f2b434}.poster-frame figcaption{margin-top:8px;text-align:center;font-family:Lilita One,sans-serif;letter-spacing:.03em}#enlist{width:min(420px,94vw);background:var(--cream);border:4px solid var(--ink);box-shadow:12px 14px 0 var(--ink);padding:22px 22px 16px;transform:rotate(1.2deg);display:flex;flex-direction:column;gap:8px}.eyebrow{margin:0;font-family:Lilita One,sans-serif;letter-spacing:.08em;color:var(--gum)}#enlist h1{margin:0;font-family:Lilita One,sans-serif;font-size:52px;line-height:.9;font-weight:400}.pitch,.fine,#field-status{margin:0;font-weight:500}#field-status{font-weight:700}#enlist label{font-weight:700;margin-top:6px}#name{font:700 20px Fredoka,sans-serif;padding:8px 10px;border:4px solid var(--ink);background:#fff;color:var(--ink);outline:none}#name:focus{box-shadow:4px 4px 0 var(--you)}button.enlist{margin-top:6px;font-family:Lilita One,sans-serif;font-size:32px;background:var(--yolk);color:var(--ink);border:4px solid var(--ink);box-shadow:5px 5px 0 var(--ink);padding:6px 12px 8px;cursor:pointer}button.enlist:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--ink)}button.enlist:active{transform:translate(2px,2px);box-shadow:none}.controls{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:6px;font-weight:700;font-size:15px}kbd{font-family:Fredoka,sans-serif;font-weight:700;background:#fff;border:2px solid var(--ink);padding:0 5px;box-shadow:2px 2px 0 var(--ink)}.fine{color:#5c4636;font-size:14px}#radio{z-index:6;display:flex;align-items:flex-start;justify-content:center;padding-top:18px;pointer-events:none;font-family:Lilita One,sans-serif;font-size:22px;color:var(--cream);-webkit-text-stroke:5px var(--ink);paint-order:stroke fill}.hidden{display:none!important}@keyframes pulse{50%{transform:scale(1.08)}}@keyframes hintout{0%,70%{opacity:1}to{opacity:0}}@media(max-width:900px){#lobby{flex-direction:column;overflow:auto;justify-content:flex-start;gap:16px}.poster-frame,#enlist{transform:none;width:min(440px,94vw)}.poster-frame{max-height:38vh;overflow:hidden}#enlist h1{font-size:40px}#board-column{display:none}.global-card{transform:none}#hint{display:none}#map{width:112px;height:112px}}#strike-meter{margin-top:4px;color:#5c4636;font-size:12px;font-weight:700}#strike-meter.ready{color:#8a3d12}#touch-controls,.touch-help{display:none}@media(any-pointer:coarse){#hud{zoom:1;--safe-top: max(12px, env(safe-area-inset-top));--safe-right: max(12px, env(safe-area-inset-right));--safe-bottom: max(12px, env(safe-area-inset-bottom));--safe-left: max(12px, env(safe-area-inset-left))}#wordmark,#board-column,#hint,#enlist .controls{display:none}#enlist .touch-help{display:block}#lobby{padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}#lobby>*{max-width:100%}#name{font-size:max(16px,1em)}#vitals{top:var(--safe-top);left:var(--safe-left);width:min(48vw,222px);padding:6px 8px;border-width:3px;box-shadow:3px 3px var(--ink)}#you-name{font-size:16px;margin-bottom:5px}#hp{height:12px;border-width:2px}.vital-readout,#strike-meter{font-size:11px}#map{top:var(--safe-top);right:var(--safe-right);bottom:auto;left:auto;width:78px;height:78px;border-width:3px;box-shadow:3px 3px var(--ink)}#mute{top:calc(var(--safe-top) + 86px);right:var(--safe-right);bottom:auto;min-height:38px;font-size:12px}#feed{top:calc(var(--safe-top) + 112px);width:min(76vw,340px);font-size:12px;gap:4px}#feed li{border-width:2px;padding:2px 5px}#feed li:nth-child(n+3){display:none}#egg-meter{bottom:var(--safe-bottom)}#egg-meter .shell{width:33px;height:42px;border-width:3px}#egg-label{font-size:12px}#touch-controls{position:absolute;right:var(--safe-right);bottom:var(--safe-bottom);left:var(--safe-left);z-index:2;display:flex;justify-content:space-between;align-items:end;pointer-events:none;user-select:none;-webkit-user-select:none}#touch-drive,.touch-actions button{pointer-events:auto;touch-action:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}#touch-drive{position:relative;width:clamp(110px,min(32vw,35dvh),146px);aspect-ratio:1;border:3px solid var(--ink);border-radius:50%;color:var(--ink);background:#fff6e4d1;box-shadow:4px 4px var(--ink)}#touch-drive span{position:absolute;pointer-events:none}.touch-up{top:5px;left:50%;transform:translate(-50%)}.touch-down{bottom:5px;left:50%;transform:translate(-50%)}.touch-left{left:7px;top:50%;transform:translateY(-50%)}.touch-right{right:7px;top:50%;transform:translateY(-50%)}.touch-stick{width:39%;aspect-ratio:1;top:50%;left:50%;transform:translate(-50%,-50%) translate(var(--stick-x, 0px),var(--stick-y, 0px));border:3px solid var(--ink);border-radius:50%;background:var(--yolk)}.touch-actions{display:grid;grid-template-columns:repeat(2,minmax(0,auto));align-items:end;justify-items:end;gap:8px}.touch-actions button{min-height:44px;padding:5px 8px;border:3px solid var(--ink);border-radius:8px;background:var(--cream);box-shadow:3px 3px var(--ink);color:var(--ink);font-family:Fredoka,sans-serif;font-weight:700}#touch-fire{grid-row:1 / span 2;grid-column:2;width:clamp(72px,20vw,96px);min-height:0;aspect-ratio:1;border-radius:50%;background:var(--yolk);font-family:Lilita One,sans-serif;font-size:24px}#touch-fire.held{transform:translate(2px,2px);box-shadow:1px 1px var(--ink)}#touch-strike{grid-column:1;background:#ff916d}#touch-strike:disabled{background:#e5d9bd;color:#614d40}}@media(any-pointer:coarse)and (orientation:landscape){#feed{top:var(--safe-top);width:min(40vw,320px)}}.install-game{display:flex;align-items:center;flex-wrap:wrap;gap:10px}@media(display-mode:standalone),(display-mode:fullscreen){.install-game{display:none}}#update-banner{position:fixed;z-index:12;top:max(16px,env(safe-area-inset-top));left:50%;transform:translate(-50%);width:min(470px,calc(100% - 24px));display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 12px;padding:10px 12px;color:var(--ink);background:var(--cream);border:3px solid var(--ink);box-shadow:4px 4px var(--ink)}#update-banner p{flex:1 1 180px;margin:0;font-size:14px}.update-actions{display:flex;gap:8px}#update-refresh{background:var(--yolk)}#update-banner[hidden],#install-game[hidden]{display:none}@media(any-pointer:coarse){#update-banner{top:calc(max(12px,env(safe-area-inset-top)) + 126px)}.update-actions button{min-height:40px}}@media(any-pointer:coarse)and (orientation:landscape){#update-banner{top:calc(max(12px,env(safe-area-inset-top)) + 84px)}}
