:root{--bg: #0b1426;--ink: #f3f6fb;--dim: #b6c8e6;--accent: #ffcd5a;--green: #22c55e;--red: #ef4444}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,SF Pro,system-ui,sans-serif;overflow:hidden;-webkit-user-select:none;user-select:none}#app{width:100vw;height:100vh;position:relative}#phaser{width:100%;height:100%}.hud{position:absolute;top:16px;left:16px;right:16px;display:flex;justify-content:space-between;align-items:center;gap:16px;z-index:50;pointer-events:none}.pill{background:#0000008c;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);padding:8px 16px;border-radius:999px;font-size:14px;line-height:1;display:inline-flex;align-items:center;gap:8px;pointer-events:auto}.pill .dot{width:8px;height:8px;border-radius:50%;background:#ef4444}.pill.online .dot{background:var(--green)}.pill button{background:transparent;border:1px solid rgba(255,255,255,.2);color:var(--ink);font:inherit;padding:4px 12px;border-radius:999px;cursor:pointer}.pill button:hover{background:#ffffff14}.dev-pad{position:absolute;bottom:16px;right:16px;z-index:60;display:flex;flex-direction:column;gap:6px;align-items:stretch;max-width:200px}.dev-pad summary{list-style:none;cursor:pointer;background:#0000008c;backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.18);padding:6px 12px;border-radius:12px;font-size:12px;opacity:.7;text-align:center}.dev-pad summary::-webkit-details-marker{display:none}.dev-pad[open] summary{opacity:1}.dev-pad-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;margin-top:6px}.dev-pad-grid button{background:#0000008c;backdrop-filter:blur(8px);color:var(--ink);border:1px solid rgba(255,255,255,.18);padding:8px 6px;border-radius:10px;font-size:13px;cursor:pointer;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dev-pad-grid button:active{transform:scale(.96)}#video-mode{position:absolute;inset:0;z-index:30;background:linear-gradient(180deg,#1c2540,#0b1426);display:flex;flex-direction:column;align-items:center;justify-content:center;transition:opacity .25s ease}body[data-mode=game] #video-mode{display:none}.video-default{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 60px;gap:36px;text-align:center}.video-default h1{margin:0;font-size:clamp(36px,4vw,64px);font-weight:800;letter-spacing:.5px;background:linear-gradient(90deg,#ffd87a,#ff9a76);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.video-default .sub{font-size:clamp(16px,1.3vw,22px);opacity:.7;margin-top:-22px}.tile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:clamp(10px,1vw,18px);width:min(1500px,100%)}.tile{aspect-ratio:1.05;background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:18px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;cursor:pointer;transition:transform .16s ease,background .16s ease,border-color .16s ease}.tile:hover{transform:translateY(-2px);background:#ffffff14;border-color:#ffcd5a73}.tile .emo{font-size:clamp(48px,4.5vw,80px);line-height:1}.tile .lbl{font-size:clamp(13px,1vw,17px);opacity:.85;font-weight:500}.video-player{position:absolute;inset:0;background:#000;display:none;align-items:center;justify-content:center}.video-player.on{display:flex}.video-player video{width:100%;height:100%;object-fit:contain;background:#000}.video-player .title-bar{position:absolute;top:80px;left:50%;transform:translate(-50%);background:#00000073;backdrop-filter:blur(10px);padding:10px 22px;border-radius:999px;font-size:clamp(16px,1.4vw,24px);font-weight:600;display:inline-flex;align-items:center;gap:10px;opacity:0;animation:fade-in-out 3s ease forwards;pointer-events:none}@keyframes fade-in-out{0%{opacity:0;transform:translate(-50%) translateY(-6px)}15%{opacity:1;transform:translate(-50%) translateY(0)}80%{opacity:1}to{opacity:0}}.toast{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#000000b3;color:#fff;padding:16px 28px;border-radius:16px;font-size:28px;font-weight:600;z-index:70;pointer-events:none;backdrop-filter:blur(8px)}