:root{--long-color: #2ee6a6;--long-dim: #0f3d31;--short-color: #ff4d6d;--short-dim: #401520;--bg: #05070d;--panel: #0b0f1a;--text: #e8ecf4;--muted: #8a93a8;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font-family:Segoe UI,Helvetica Neue,Arial,Hiragino Sans,Meiryo,sans-serif;overflow:hidden}#app{display:flex;flex-direction:column;height:100vh;width:100vw}.hud{display:flex;align-items:center;justify-content:space-between;padding:10px 20px;background:var(--panel);border-bottom:1px solid #1a2030;flex-shrink:0}.hud h1{font-size:18px;letter-spacing:2px;margin:0;font-weight:700}.hud h1 .vs{color:var(--muted);font-size:13px;margin:0 6px}.price-box{display:flex;align-items:baseline;gap:8px;margin-left:18px;margin-right:auto}.price-symbol{font-size:11px;color:var(--muted);letter-spacing:.5px}.price-value{font-size:20px;font-weight:800;font-variant-numeric:tabular-nums;color:var(--text);transition:color .25s ease}.price-value.up{color:var(--long-color)}.price-value.down{color:var(--short-color)}.price-change{font-size:12px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--muted)}.symbol-tabs{display:flex;gap:6px}.tab{background:transparent;border:1px solid #253049;color:var(--muted);padding:6px 14px;border-radius:6px;cursor:pointer;font-size:13px;font-weight:600;transition:all .15s ease}.tab:hover{border-color:#3a4970;color:var(--text)}.tab.active{background:#1a2035;border-color:#4a5a8a;color:var(--text)}.scoreboard{display:flex;justify-content:space-between;padding:8px 24px;flex-shrink:0}.side{display:flex;align-items:baseline;gap:10px}.side .label{font-size:13px;font-weight:700;letter-spacing:1px}.side.long .label{color:var(--long-color)}.side.short .label{color:var(--short-color)}.side .pct{font-size:32px;font-weight:800;font-variant-numeric:tabular-nums}.side.long .pct{color:var(--long-color)}.side.short .pct{color:var(--short-color)}.battlefield-wrap{position:relative;flex:1;width:100%;overflow:hidden}#battlefield{width:100%;height:100%;display:block}.ticker{position:absolute;left:0;right:0;bottom:12px;display:flex;justify-content:center;pointer-events:none}.ticker span{background:#0b0f1abf;border:1px solid #2a3450;border-radius:20px;padding:5px 18px;font-size:13px;font-weight:700;letter-spacing:.5px;opacity:0;transform:translateY(8px);animation:ticker-pop 3.2s ease-in-out forwards}.ticker span.long{color:var(--long-color);border-color:#1c6b52}.ticker span.short{color:var(--short-color);border-color:#7a2436}@keyframes ticker-pop{0%{opacity:0;transform:translateY(8px)}12%{opacity:1;transform:translateY(0)}80%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-6px)}}.whale-alert{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;pointer-events:none}.whale-alert span{font-size:clamp(22px,5vw,48px);font-weight:900;letter-spacing:2px;padding:10px 28px;border-radius:10px;text-shadow:0 0 18px currentColor;opacity:0;animation:whale-flash 1.4s ease-out forwards}.whale-alert span.long{color:var(--long-color);background:#2ee6a61f}.whale-alert span.short{color:var(--short-color);background:#ff4d6d1f}@keyframes whale-flash{0%{opacity:0;transform:scale(.7)}15%{opacity:1;transform:scale(1.08)}30%{transform:scale(1)}75%{opacity:1}to{opacity:0;transform:scale(1.15)}}@keyframes screen-flash{0%{background:#ffffff59}to{background:#fff0}}.flash-overlay{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;animation:screen-flash .4s ease-out forwards}.info-bar{display:flex;align-items:center;gap:24px;padding:10px 24px;background:var(--panel);border-top:1px solid #1a2030;flex-shrink:0;font-size:12px;color:var(--muted)}.stat{display:flex;align-items:center;gap:8px}.stat-label{white-space:nowrap}.momentum-bar{width:160px;height:8px;border-radius:4px;background:linear-gradient(90deg,var(--short-dim),var(--long-dim));overflow:hidden;position:relative;border:1px solid #253049}.momentum-fill{position:absolute;top:0;bottom:0;left:50%;width:0%;background:var(--long-color);transition:none}.momentum-fill.negative{background:var(--short-color)}.stat.source{margin-left:auto;font-size:11px;opacity:.7}@media (max-width: 640px){.hud{padding:6px 10px;flex-wrap:wrap;row-gap:4px}.hud h1{font-size:14px;letter-spacing:1px}.price-box{margin-left:8px;margin-right:0;gap:5px}.price-symbol{display:none}.price-value{font-size:14px}.price-change{font-size:10px}.symbol-tabs{gap:4px;width:100%;justify-content:space-between}.tab{padding:4px 0;flex:1;font-size:11px;text-align:center}.scoreboard{padding:4px 12px}.side{gap:6px}.side .label{font-size:10px}.side .pct{font-size:20px}.info-bar{padding:5px 10px;gap:10px;font-size:10px;flex-wrap:nowrap}.stat-label{display:none}.momentum-bar{width:60px}.stat.source{display:none}}