:root { --live-scale: 1; }

/* Fixed OBS canvas: the page never scrolls and the complete interface scales as one unit. */
html, body.live-body { width: 100%; height: 100%; margin: 0; overflow: hidden; background: var(--bg); }
.live-body .live-stage {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1920px;
  height: 1080px;
  transform: translate(-50%, -50%) scale(var(--live-scale));
  transform-origin: center;
  display: grid;
  grid-template-rows: 76px minmax(0, 1fr);
  overflow: hidden;
}
.live-body .nav { position: static; border-bottom-width: 3px; }
.live-body .nav .shell { width: calc(100% - 64px); max-width: none; }
.live-body .nav-inner { min-height: 76px; }
.live-title { display: flex; align-items: baseline; gap: 14px; padding: 8px 12px; color: var(--yellow); border: 1px dashed var(--mint); font: 900 .72rem var(--mono); letter-spacing: .1em; text-transform: uppercase; transform: rotate(-.5deg); }
.live-title strong { color: var(--mint); font-size: .8rem; }
.live-main { width: 100%; min-height: 0; padding: 18px 32px 24px; display: grid; grid-template-rows: 76px 78px minmax(0, 1fr); gap: 12px; overflow: hidden; }
.live-head { display: flex; justify-content: space-between; align-items: center; min-height: 0; }
.live-head h1 { margin: 7px 0 0; color: var(--cream); font-size: 3.3rem; line-height: .88; letter-spacing: -.065em; text-shadow: 4px 4px 0 rgba(168,85,247,.52); }
.live-state { display: flex; align-items: center; gap: 14px; color: var(--muted); font: 750 .76rem var(--mono); letter-spacing: .09em; }
.live-body .scan-strip { grid-template-columns: repeat(5, 1fr); gap: 10px; margin: 0; min-height: 0; }
.live-body .metric { min-height: 0; padding: 13px 17px; border: 2px solid rgba(85,228,154,.22); border-radius: 6px; background: rgba(255,255,255,.026); }
.live-body .scan-strip > .metric:nth-child(3) { border-color: rgba(255,228,94,.52); }
.live-body .scan-strip > .metric:nth-child(4) { border-color: rgba(168,85,247,.48); }
.live-body .scan-strip > .metric:nth-child(5) { border-color: rgba(255,79,216,.42); }
.live-body .metric.hot { border-color: var(--mint); background: linear-gradient(110deg, rgba(85,228,154,.16), rgba(255,255,255,.025)); box-shadow: 4px 4px 0 rgba(85,228,154,.16); }
.live-body .metric strong { margin-top: 7px; font-size: 1.16rem; }
.live-body .dashboard { min-height: 0; padding: 0; grid-template-columns: minmax(0, 1fr) 560px; gap: 12px; overflow: hidden; }
.primary-stack, .side-stack { min-width: 0; min-height: 0; display: grid; gap: 12px; overflow: hidden; }
.primary-stack { grid-template-rows: minmax(0, 1.65fr) minmax(0, .85fr); }
.side-stack { grid-template-rows: minmax(0, 1.02fr) minmax(0, 1.2fr) minmax(0, .48fr); }
.live-body .panel { min-height: 0; padding: 17px 19px; overflow: hidden; border-width: 2px; border-radius: 7px; box-shadow: 4px 4px 0 rgba(85,228,154,.08); }
.live-body .panel-title { margin: -17px -19px 10px; padding: 11px 16px; border-bottom: 2px solid rgba(85,228,154,.22); background: rgba(85,228,154,.07); }
.live-body .panel-title h2 { font-size: .92rem; letter-spacing: .015em; text-transform: uppercase; }
.stream-panel { border-color: rgba(85,228,154,.56) !important; }
.pipeline-panel { border-color: rgba(255,228,94,.5) !important; box-shadow: 4px 4px 0 rgba(255,228,94,.1) !important; }
.pipeline-panel .panel-title { border-color: rgba(255,228,94,.38); background: rgba(255,228,94,.07); }
.leaderboard-panel { border-color: rgba(168,85,247,.55) !important; box-shadow: 4px 4px 0 rgba(168,85,247,.12) !important; }
.leaderboard-panel .panel-title { border-color: rgba(168,85,247,.44); background: rgba(168,85,247,.09); }
.treasury-panel { border-color: rgba(255,79,216,.45) !important; box-shadow: 4px 4px 0 rgba(255,79,216,.1) !important; }
.treasury-panel .panel-title { border-color: rgba(255,79,216,.38); background: rgba(255,79,216,.07); }
.live-body .terminal { height: calc(100% - 31px); min-height: 0; max-height: none; overflow: hidden; padding: 0 5px; background: repeating-linear-gradient(0deg, transparent 0 31px, rgba(85,228,154,.018) 32px); }
.live-body .terminal-row { grid-template-columns: 86px 1fr; gap: 12px; padding: 10px 8px; }
.live-body .terminal-row p { font-size: .82rem; line-height: 1.38; }
.live-body .terminal-row:nth-child(n+9) { display: none; }
.pipeline-panel .call-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; min-height: 0; overflow: hidden; }
.pipeline-panel .call-row { min-width: 0; padding: 13px; border-width: 2px; border-radius: 6px; box-shadow: 3px 3px 0 rgba(255,228,94,.08); }
.pipeline-panel .call-row:nth-child(n+4) { display: none; }
.pipeline-panel .call-row p { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pipeline-panel .call-row p + p { margin-top: 6px; -webkit-line-clamp: 1; }
.leaderboard-panel .leaderboard td, .leaderboard-panel .leaderboard th { padding: 8px 7px; font-size: .7rem; }
.leaderboard-panel .leaderboard tbody tr:first-child { color: var(--yellow); background: rgba(255,228,94,.055); }
.leaderboard-panel tbody tr:nth-child(n+7) { display: none; }
.treasury-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.treasury-lanes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; margin-top: 8px; }
.treasury-lanes article { min-width: 0; padding: 9px 10px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 2px 7px; border: 2px solid rgba(85,228,154,.22); border-radius: 5px; background: rgba(255,255,255,.025); }
.treasury-lanes article:nth-child(1) { border-color: rgba(85,228,154,.42); }
.treasury-lanes article:nth-child(2) { border-color: rgba(255,228,94,.42); }
.treasury-lanes article:nth-child(3) { border-color: rgba(255,109,120,.45); }
.treasury-lanes span { font: 850 .67rem var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.treasury-lanes small { grid-column: 1; color: var(--muted); font: 650 .57rem var(--mono); }
.treasury-lanes strong { grid-column: 2; grid-row: 1 / span 2; color: var(--mint-2); font: 900 1.4rem var(--mono); }
.treasury-lanes article.active { border-color: var(--mint); background: rgba(85,228,154,.1); box-shadow: inset 3px 0 var(--mint), 0 0 20px rgba(85,228,154,.08); }
.treasury-lanes article[data-live-action="burn"].active { border-color: var(--red); box-shadow: inset 3px 0 var(--red), 0 0 20px rgba(255,109,120,.08); }
.treasury-panel .action-list { margin-top: 8px; overflow: hidden; }
.treasury-panel .action-row { padding: 10px 12px; }
.treasury-panel .action-row:nth-child(n+2) { display: none; }
.treasury-panel .action-row p { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.action-idle { padding: 8px 4px; color: var(--muted); text-align: center; font: 700 .58rem var(--mono); letter-spacing: .08em; }
.live-body .live-mascot { margin: 0; padding: 9px 16px 7px; min-height: 0; justify-content: center; position: relative; border: 2px dashed var(--mint); background: radial-gradient(circle at 50% 70%, rgba(85,228,154,.2), transparent 64%), linear-gradient(145deg, rgba(13,28,24,.88), rgba(5,12,10,.92)); box-shadow: 4px 4px 0 var(--purple); }
.live-body .live-mascot img { min-height: 0; height: calc(100% - 19px); width: auto; max-width: 100%; max-height: none; }
.live-body .live-mascot span { margin-top: 1px; }
.live-body .live-mascot .mascot-sticker { position: absolute; top: 9px; right: 12px; z-index: 2; padding: 5px 7px; color: #07130e; background: var(--yellow); border: 1px solid #000; font-size: .55rem; transform: rotate(4deg); box-shadow: 2px 2px 0 var(--pink); }
@media (prefers-reduced-motion: reduce) { .live-body .live-stage { transition: none; } }