:root{--bg:#141a2e;--panel:#1f2742;--panel-2:#283256;--text:#eef1fb;--muted:#a5adc8;--accent:#ff7a59;--accent-2:#4cc9f0;--danger:#ff6b6b;--radius:12px}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:radial-gradient(circle at 20% 0%, #24305a, var(--bg) 60%);color:var(--text);font-family:system-ui,-apple-system,Hiragino Sans,Noto Sans JP,sans-serif}#app{min-height:100%}.hidden{display:none!important}a{color:var(--accent-2)}button{font:inherit;color:var(--text);background:var(--panel-2);cursor:pointer;border:1px solid #3a4673;border-radius:8px;padding:8px 14px}button:hover:not(:disabled){filter:brightness(1.15)}button:disabled{opacity:.5;cursor:default}button.primary{background:var(--accent);border-color:var(--accent);color:#1b1b1b;font-weight:700}button.link{color:var(--muted);background:0 0;border:none;text-decoration:underline}input,select{font:inherit;color:var(--text);background:#11172b;border:1px solid #3a4673;border-radius:8px;padding:8px 10px}label{color:var(--muted);flex-direction:column;gap:4px;font-size:14px;display:flex}.note{color:var(--muted);margin:6px 0;font-size:13px}.error{color:var(--danger);min-height:1.2em}.screen{max-width:1200px;margin:0 auto;padding:16px}#screen-title{flex-direction:column;align-items:center;gap:24px;padding-top:8vh;display:flex}.title-card{background:var(--panel);border-radius:20px;width:min(420px,100%);padding:28px;box-shadow:0 20px 60px #00000059}.logo{letter-spacing:2px;margin:0;font-size:48px}.logo span{color:var(--accent)}.tagline{color:var(--muted);margin-top:4px}.tabs,.stage-tabs{flex-wrap:wrap;gap:6px;margin:16px 0 12px;display:flex}.tab{background:0 0}.tab.active{background:var(--panel-2);border-color:var(--accent-2)}.tab-pane{flex-direction:column;gap:12px;display:flex}#logged-in{flex-direction:column;align-items:flex-start;gap:8px;display:flex}.footer{color:var(--muted);font-size:13px}.bar{align-items:center;gap:12px;margin-bottom:12px;display:flex}.bar h2{flex:1;margin:0}.me-label{color:var(--muted)}.panel{background:var(--panel);border-radius:var(--radius);min-width:0;padding:16px}.panel h3{margin:0 0 8px;font-size:16px}.hubs-layout{grid-template-columns:2fr 1fr;gap:16px;display:grid}@media (width<=900px){.hubs-layout{grid-template-columns:1fr}}.list{flex-direction:column;gap:6px;margin:0 0 12px;padding:0;list-style:none;display:flex}.list li{background:var(--panel-2);border-radius:8px;align-items:center;gap:10px;padding:8px 10px;display:flex}.list.compact li{padding:4px 8px;font-size:14px}.grow{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.count{color:var(--muted);white-space:nowrap;font-size:13px}.inline{gap:8px;display:flex}.inline input,.inline select{flex:1;min-width:0}.buttons{flex-wrap:wrap;gap:8px;margin-top:10px;display:flex}.cards{flex-direction:column;gap:10px;display:flex}.card{background:var(--panel-2);border-radius:10px;padding:12px}.card h4{margin:0}.card-foot{justify-content:space-between;align-items:center;display:flex}.ranking{flex-direction:column;gap:4px;margin:0;padding-left:24px;display:flex}.ranking li span{display:inline-block}.ranking li{display:list-item}.ranking li .grow{vertical-align:bottom;width:60%}.chat-log{background:#11172b;border-radius:8px;height:220px;margin-bottom:8px;padding:8px;font-size:14px;overflow-y:auto}.chat{word-break:break-word;margin-bottom:4px}.chat.sys{color:var(--muted);font-size:12px}.ad-slot{width:100%;max-width:728px;min-height:0;margin:16px auto 0}.ad-slot.placeholder{min-height:90px;color:var(--muted);border:2px dashed #3a4673;border-radius:8px;justify-content:center;align-items:center;font-size:13px;display:flex}#screen-game{max-width:none;padding:0;position:fixed;inset:0}#game-canvas{cursor:crosshair;width:100%;height:100%;display:block}.hud{pointer-events:none;text-shadow:0 2px 4px #0009;justify-content:center;gap:24px;font-weight:700;display:flex;position:absolute;top:10px;left:0;right:0}#hud-timer{font-variant-numeric:tabular-nums;font-size:28px}#hud-timer.running{color:#ffe066}#hud-stage,#hud-mode{color:var(--muted);padding-top:8px;font-size:16px}.help{text-align:center;color:#ffffffb3;pointer-events:none;font-size:12px;position:absolute;bottom:8px;left:0;right:0}.toast{background:#0009;border-radius:20px;padding:8px 16px;position:absolute;top:60px;left:50%;transform:translate(-50%)}.alert{background:var(--danger);color:#fff;z-index:10;border-radius:10px;padding:10px 18px;position:fixed;top:16px;left:50%;transform:translate(-50%)}.overlay{background:#0a0e1c99;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.result-card{background:var(--panel);text-align:center;border-radius:16px;width:min(520px,92vw);padding:24px}.result-card .buttons{justify-content:center}.big{margin:8px 0;font-size:40px;font-weight:800}#screen-hub{max-width:none;padding:0;position:fixed;inset:0}#lobby-canvas{cursor:crosshair;width:100%;height:100%;display:block}.lobby-bar{background:#141a2ebf;border-radius:10px;align-items:center;gap:12px;padding:6px 12px;display:flex;position:absolute;top:10px;left:12px}.lobby-bar h2{margin:0;font-size:18px}.lobby-side{pointer-events:none;flex-direction:column;gap:8px;width:min(300px,40vw);display:flex;position:absolute;top:10px;right:12px}.lobby-side>*{pointer-events:auto}.lobby-side details{background:#141a2ebf;border-radius:10px;padding:8px 10px}.lobby-side summary{cursor:pointer;font-weight:700}.lobby-side details .list{max-height:30vh;margin:8px 0 0;overflow-y:auto}.lobby-side .chat-log{background:#11172b99;height:min(180px,25vh);margin:0}.lobby-side .ad-slot{margin:0}.touch-pad,body.touch .help{display:none}body.touch .touch-pad{padding:8px 12px calc(12px + env(safe-area-inset-bottom));-webkit-user-select:none;user-select:none;touch-action:none;grid-template-rows:auto 1fr;grid-template-columns:1fr auto 1fr;place-items:center;gap:8px;display:grid;position:absolute;bottom:0;left:0;right:0}body.touch .touch-row{grid-column:1/-1;justify-content:center;justify-self:stretch;gap:8px;display:flex}.stick{aspect-ratio:1;touch-action:none;background:radial-gradient(circle,#ffffff1a,#ffffff0a);border:2px solid #ffffff40;border-radius:50%;width:min(36vw,150px);position:relative}.stick .knob{background:radial-gradient(circle at 35% 35%,#fff,#c9d3ea);border-radius:50%;width:42%;height:42%;margin:-21% 0 0 -21%;transition:transform 50ms;position:absolute;top:50%;left:50%;box-shadow:0 4px 12px #0006}.stick.held{border-color:#fff9}.stick.aim .knob{background:radial-gradient(circle at 35% 35%,#ffe2d8,#ff7a59)}.stick span{white-space:nowrap;color:#ffffffa6;font-size:11px;position:absolute;bottom:-18px;left:50%;transform:translate(-50%)}.tbtn{touch-action:none;white-space:nowrap;background:#283256d9;border:2px solid #ffffff4d;border-radius:50%;width:76px;height:76px;padding:0;font-size:13px;font-weight:700}.tbtn.held{filter:brightness(1.5);transform:scale(.96)}.tbtn.jump{grid-area:2/2;align-self:start;margin-top:4px}.tbtn.fire{background:#784628e6;grid-area:2/2;align-self:end}.tbtn.small{border-radius:17px;width:auto;height:34px;padding:0 16px;font-size:13px}.tbtn.accent{background:var(--accent);color:#1b1b1b;border-color:var(--accent)}.stick.move{grid-area:2/1}.stick.aim{grid-area:2/3}@media (orientation:portrait){body.touch .touch-pad{padding-bottom:calc(20px + env(safe-area-inset-bottom));background:0 0;grid-template-rows:auto auto}body.touch .touch-row{top:calc(44px + env(safe-area-inset-top));justify-content:flex-end;position:fixed;right:8px}body.touch .hud{top:calc(6px + env(safe-area-inset-top));gap:12px}body.touch #hud-timer{font-size:22px}}@media (orientation:landscape){body.touch .touch-pad{background:0 0;grid-template-rows:auto auto}body.touch .touch-row{justify-content:flex-end;position:fixed;top:8px;right:12px}body.touch .stick{width:min(26vh,140px)}}body.touch .touch-pad{pointer-events:none}body.touch .touch-pad>*,body.touch .touch-row>*{pointer-events:auto}body.touch .touch-row{pointer-events:none}body.touch .stick{background:radial-gradient(circle,#0a0e1e59,#0a0e1e26)}body.touch .stick .knob{opacity:.85}body.touch .tbtn{background-color:#1e264699}body.touch .tbtn.fire{background-color:#784628a6}body.touch .tbtn.small{background-color:#1e2646bf}body.touch .stick span{text-shadow:0 1px 2px #000}body.touch,body.touch *{touch-action:manipulation;-webkit-tap-highlight-color:transparent}body.touch{overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;position:fixed;inset:0;overflow:hidden}body.touch input,body.touch select,body.touch textarea{-webkit-user-select:text;user-select:text;font-size:16px}body.touch .lobby-side{display:none}body.touch #screen-hub.chat-open .lobby-side{width:auto;display:flex;top:52px;left:12px;right:12px}body.touch .lobby-bar{padding:4px 10px;top:6px;left:8px;right:8px}body.touch .lobby-bar h2{font-size:15px}body.touch .lobby-bar .me-label{display:none}body.touch canvas,body.touch .touch-pad,body.touch .touch-pad *{touch-action:none}