@import"https://fonts.googleapis.com/css2?family=Press+Start+2P&family=VT323&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{background:#2d5a27;min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:20px;font-family:VT323,monospace;color:#eee}#app{width:100%;display:flex;flex-direction:column;align-items:center}.game-container{position:relative;background:#4a7c43;border:none;border-radius:8px;box-shadow:0 0 0 4px #2d5a27,0 8px 32px #0006;overflow:hidden;isolation:isolate}#gameCanvas{display:block;position:relative;z-index:1;pointer-events:none;max-width:100%;height:auto}.hud{position:absolute;top:10px;left:10px;background:#000000d9;padding:10px 15px;border-radius:4px;border:2px solid #333;font-size:16px;z-index:10;pointer-events:auto}.hud .status{display:flex;align-items:center;gap:8px;margin-bottom:5px}.hud .status-dot{width:10px;height:10px;border-radius:50%;animation:pulse 2s infinite}.hud .status-dot.primary{background:#e94560}.hud .status-dot.connected{background:#4ecca3}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.player-list{position:absolute;top:10px;right:10px;background:#000000d9;padding:10px 15px;border-radius:4px;border:2px solid #333;font-size:14px;max-width:200px;z-index:10;pointer-events:auto}.player-list h3{font-family:"Press Start 2P",cursive;font-size:10px;margin-bottom:8px;color:#4ecca3}.player-item{display:flex;align-items:center;gap:8px;margin:4px 0}.player-color{width:12px;height:12px;border-radius:2px;border:1px solid rgba(255,255,255,.3)}.player-score{margin-left:auto;color:#ffc857}.title{font-family:"Press Start 2P",cursive;font-size:24px;color:#fff;text-shadow:3px 3px 0 #1a3d15;margin-bottom:20px;text-align:center}.controls-hint{margin-top:15px;font-size:18px;color:#ccc;text-align:center}.controls-hint kbd{background:#333;padding:4px 8px;border-radius:4px;border:1px solid #555;color:#fff}.message-log{position:absolute;bottom:10px;left:10px;background:#000000d9;padding:10px;border-radius:4px;border:2px solid #333;font-size:14px;max-width:300px;max-height:80px;overflow-y:auto;z-index:10;pointer-events:auto}.message-log .msg{margin:2px 0;opacity:.8}.message-log .msg.system{color:#ffc857}.message-log .msg.join{color:#4ecca3}.message-log .msg.leave{color:#e94560}.message-log .msg.food{color:#ff6b6b}.food-timer{position:absolute;bottom:10px;right:10px;background:#000000d9;padding:10px 15px;border-radius:4px;border:2px solid #333;font-size:14px;z-index:10;pointer-events:auto}.food-timer .label{font-family:"Press Start 2P",cursive;font-size:8px;color:#ff6b6b;margin-bottom:5px}.touch-controls{position:absolute;bottom:20px;right:20px;z-index:20;display:none;pointer-events:auto}.touch-controls.visible{display:block}.arrow-keys{display:flex;flex-direction:column;align-items:center;gap:10px}.arrow-row{display:flex;gap:10px}.arrow-key{width:80px;height:80px;background:#000c;border:4px solid #4ecca3;border-radius:16px;color:#4ecca3;display:flex;align-items:center;justify-content:center;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:all .1s ease;box-shadow:0 4px 12px #0006;font-size:0}.arrow-key:active,.arrow-key.active{background:#4ecca366;border-color:#ffc857;color:#ffc857;transform:scale(.92);box-shadow:0 2px 6px #0006}.arrow-key svg{width:36px;height:36px;pointer-events:none}@media (max-width: 1366px) and (min-width: 768px){body{padding:10px}.game-container{max-width:100%;width:100%}#gameCanvas{width:100%;height:auto}.touch-controls{display:block}.controls-hint{display:none}.title{font-size:20px;margin-bottom:10px}.hud,.player-list,.message-log,.food-timer{font-size:12px;padding:8px 12px}}@media (max-width: 1024px){.arrow-key{width:70px;height:70px}.arrow-key svg{width:32px;height:32px}.touch-controls{bottom:15px;right:15px}}@media (max-width: 480px){body{padding:0}#app{padding:6px}.title{font-size:16px;margin-bottom:8px}.controls-hint{display:none}.hud,.player-list,.message-log,.food-timer{font-size:11px;padding:6px 8px}.hud{top:6px;left:6px}.player-list{top:6px;right:6px;max-width:160px}.player-list h3{font-size:8px}.message-log{position:static;margin:8px 6px 0;max-width:none;max-height:60px}.food-timer{top:52px;bottom:auto;right:6px}.touch-controls{bottom:10px;left:10px;right:auto}.arrow-keys,.arrow-row{gap:6px}.arrow-key{width:56px;height:56px;border-width:3px;border-radius:12px}.arrow-key svg{width:24px;height:24px}}body.iphone-portrait .game-container{width:100vw;max-width:100vw;display:flex;flex-direction:column;align-items:center}body.iphone-portrait #gameCanvas{max-width:none}body.iphone-portrait .touch-controls{position:static;margin:8px 0 0}@media (max-height: 480px) and (orientation: landscape){.title{font-size:14px;margin-bottom:6px}.hud,.player-list,.message-log,.food-timer{font-size:10px;padding:5px 7px}.message-log{max-height:50px}.touch-controls{bottom:6px;right:6px}.arrow-key{width:52px;height:52px}.arrow-key svg{width:22px;height:22px}}@media (min-width: 1367px){.touch-controls{display:none!important}}