/* ===== Overton lower-third bar (layouts 1/4/5, body.ltbar). Replaces the old brand bar + separate breaking banner.
   Headline/subline = control "Breaking" fields; FLASH = breaking state (red BREAKING tag); Banner IN/OUT = show/hide. ===== */
body.ltbar .cams{height:648px}
body.ltbar .pnl{height:648px}
body.ltbar .side5,body.ltbar.l5.s5media .media:not(.full){height:648px}
body.ltbar .brk.lt3{position:absolute;top:760px;left:120px;right:var(--m,48px);height:112px;display:block;background:#000;border:1px solid #232b28;border-left:0;border-radius:0 10px 10px 0;box-shadow:none;overflow:visible;font-family:'Future Earth',sans-serif;font-weight:400;text-transform:uppercase;color:#eef1f0;clip-path:inset(-40px -40px -40px -80px)}
/* OUT: the wipe runs past the logo box too (it overhangs the bar's left edge by 72px); the old end state left that 80px strip — half the logo box — on screen */
body.ltbar .brk.lt3.off{clip-path:inset(-40px calc(100% + 80px) -40px -80px)}
body.ltbar .brk.lt3 .brkbug{display:none!important}
body.ltbar .lt3 .ltbox{position:absolute;left:-72px;top:-32px;width:144px;height:144px;box-sizing:border-box;background:#000;border:5px solid #97efca;border-radius:12px;display:flex;align-items:center;justify-content:center;z-index:2;
 box-shadow:0 0 14px rgba(151,239,202,.48),0 0 36px rgba(151,239,202,.25),inset 0 0 14px rgba(151,239,202,.22)}
body.ltbar .lt3 .ltbox img{width:96px;height:auto;display:block}
body.ltbar .lt3 .ltr{position:absolute;left:104px;right:24px;display:flex;align-items:center;white-space:nowrap;min-width:0}
body.ltbar .lt3 .r1{top:0;height:72px;border-bottom:none;margin-right:0;padding-right:24px}
body.ltbar .lt3 .r2{top:72px;height:40px}
body.ltbar .brk.lt3 .h{--max:52px;--min:30px;flex:1 1 auto;min-width:0;font-family:'Future Earth',sans-serif!important;font-weight:400;font-size:52px;letter-spacing:.03em;line-height:1.05;color:#f2f5f3;text-transform:uppercase;overflow:hidden;padding-top:4px;animation:none}
body.ltbar .brk.lt3 .s{--max:26px;--min:16px;flex:1 1 auto;min-width:0;margin:0;font-family:'Future Earth',sans-serif!important;font-weight:400;font-size:26px;letter-spacing:.05em;color:#c3ccc8;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2!important}
body.ltbar .brk.lt3 .lb{display:none;flex:none;width:auto;min-width:0;height:34px;align-items:center;gap:10px;padding:0 14px;margin-right:24px;background:none!important;border:1px solid rgba(255,77,77,.6);border-radius:4px;color:#ff5a5a!important;font:400 16px 'Future Earth',sans-serif;letter-spacing:.2em;animation:none!important}
body.ltbar .brk.lt3 .lb::before{content:'';width:8px;height:8px;border-radius:50%;background:#ff4d4d!important;animation:none;flex:none}
body.ltbar .brk.lt3.brkon{border-color:#232b28;box-shadow:none}
body.ltbar .brk.lt3.brkon .lb{display:inline-flex}
body.ltbar .brk.lt3.flash .h{color:#f2f5f3;animation:fh 1s steps(1) infinite}
body.ltbar .lt3 .ltlive{flex:none;margin-left:24px;display:flex;align-items:center;gap:10px;font:400 16px 'Future Earth',sans-serif;letter-spacing:.16em;color:#eef1f0}
body.ltbar .lt3 .ltlive i{width:8px;height:8px;border-radius:50%;background:#ff4d4d}
body.ltbar .lt3 .ltlive .dv{width:1px;height:14px;background:#36403d;margin:0 6px}
/* layouts 2/3 carry the same bar: */
/* L2 — side columns stop above the bar; markets go full width like layout 1; subline size matched to the other layouts */
body.l2.ltbar .side{height:648px}
body.l2.ltbar .mkts{left:var(--m,48px);right:var(--m,48px);top:889px;height:56px;gap:var(--g,16px)}
/* L2: same subline size as the other layouts (was a smaller 20px override) */
/* L3 — cameras keep 536px; the news feed row (no logo) sits between cameras and bar */
body.l3.ltbar .cams{height:536px}
body.l3.ltbar .mid{top:616px;height:96px;padding:0 32px;justify-content:flex-start;gap:32px}
body.l3.ltbar .col.mon{margin-left:0;flex:1;min-width:0;border-left:0;padding-left:0}
body.l3.ltbar #mon3{flex-direction:row;align-items:center;gap:32px}
body.l3.ltbar #mon3 .nf{min-width:0;max-width:33%}
body.l3.ltbar #mon3{justify-content:flex-start}
/* L2 left column is shorter now: one breaking-update card so both Kalshi charts keep their full height */
body.l2.ltbar #bu .card:nth-child(n+2){display:none}
/* L3: no strip above the bar — cameras use layout 1 height; news items render inside the centre feed tile (top-left), only when the operator has items on air */
body.l3.ltbar .cams{height:648px}
body.l3 .cam.feed .nf3{position:absolute;left:24px;top:24px;right:24px;z-index:3;display:none;flex-direction:column;gap:8px;align-items:flex-start}
body.l3 .cam.feed .nf3.on{display:flex}
body.l3 .cam.feed .nf3 .nf{background:rgba(0,0,0,.72);border-radius:4px;padding:8px 14px;max-width:100%}
body.l3 .cam.feed .nf3 .nh{font:400 20px/1.2 'Future Earth',sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#f2f5f3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.l3 .cam.feed .nf3 .ns{font:400 12px/1.4 'Future Earth',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#9aa5a1;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Overton wordmark: centred on frame, straddles bar top, never overlaps headline */
body.ltbar .brk.lt3 .ltwm-center{position:absolute;left:840px;top:0;width:220px;height:auto;transform:translate(-50%,-40%);z-index:4;pointer-events:none;display:block;padding:0;background:none;border:0}
/* clear the wordmark: ~34px tall, ~40% above bar → ~20px into bar; keep ≥8px gap before headline */
body.ltbar .lt3 .r1{height:64px;padding-top:42px;box-sizing:border-box;align-items:center}
body.ltbar .lt3 .r2{top:64px;height:48px}
body.ltbar .brk.lt3 .h{--max:44px;font-size:44px}

/* interrupt the bar-top hairline behind the wordmark (small black gap each side) */
body.ltbar .brk.lt3 .ltwm-gap{position:absolute;left:840px;top:-1px;width:260px;height:4px;transform:translateX(-50%);background:#000;z-index:3;pointer-events:none}

/* subline aligns with headline text: invisible spacer matches the BREAKING chip width whenever the tag is on (brkon) */
body.ltbar .brk.lt3 .lb-sp{display:none;flex:none;height:34px;align-items:center;gap:10px;padding:0 14px;margin-right:24px;border:1px solid transparent;border-radius:4px;font:400 16px 'Future Earth',sans-serif;letter-spacing:.2em;visibility:hidden;pointer-events:none;color:transparent}
body.ltbar .brk.lt3 .lb-sp::before{content:'';width:8px;height:8px;flex:none}
body.ltbar .brk.lt3.brkon .lb-sp{display:inline-flex}
/* top strip: hide placeholder status cluster; keep ros + clock + LIVE */
body.ltbar .topbar #st,body.ltbar .topbar #ver,body.ltbar .topbar #node,body.ltbar .topbar .bug{display:none!important}


/* L2 cleaned: left = Kalshi charts full height; no right column; cameras use the freed width */
body.l2.ltbar .side.right{display:none!important}
body.l2.ltbar .cams{right:var(--m,48px)!important;left:416px}
body.l2.ltbar .side.left{height:648px}
body.l2.ltbar #charts{flex:1;display:flex;flex-direction:column;min-height:0;height:100%;margin:0;gap:var(--g,16px)}
body.l2.ltbar #charts .pmp{flex:1;min-height:0;margin:0}
body.l2.ltbar #charts h4{margin:0 0 8px}
body.l2.ltbar #bu{display:none}



/* FLASH: chip stays static red outline; HEADLINE flashes normal↔red (theme-future @keyframes fh) */
@keyframes fh{50%{color:#ff4d4d}}
body.ltbar .brk.lt3.brkon .lb{
  display:inline-flex;
  background:none!important;
  color:#ff5a5a!important;
  border-color:rgba(255,77,77,.6);
  animation:none!important;
}
body.ltbar .brk.lt3.brkon .lb::before{background:#ff4d4d!important;animation:none!important}

/* subline LEFT-aligned with the headline's first letter (all layouts): r2 shares r1's left edge, and with breaking on the invisible
   .lb-sp spacer (same box as the BREAKING chip) pushes it past the tag exactly like the headline. Ends where the headline ends:
   right padding reserves the LIVE · time cluster (~190px + 24px gap), so it never runs under it.
   Size 26px (was 20px, +30%); shrinks to 18px for long sublines, then ellipsis (overlay.js fitSub). */
body.ltbar .brk.lt3 .r2{justify-content:flex-start;padding-right:240px}
body.ltbar .brk.lt3 .r2 .s{--max:26px;--min:18px;flex:1 1 auto;min-width:0;text-align:left;max-width:none}

/* Future Earth is single-weight: force 400 so theme-pro's `font:300 … !important` never applies to bar text */
body.ltbar .brk.lt3 .s,body.ltbar .brk.lt3 .h,body.ltbar .brk.lt3 .lb,body.ltbar .brk.lt3 .lb-sp,body.ltbar .brk.lt3 .ltlive,body.ltbar .brk.lt3 .ltlive *{font-weight:400!important}

/* L2 panels mode: the old right column is gone, so the right panel sits at the frame margin and the cameras narrow to make room */
body.l2.ltbar{--cr:var(--m,48px)}
body.l2.ltbar.pnR>.cams{right:calc(var(--cr) + var(--pw) + 8px)!important}

/* ===== L2 right rail (mock) — mirrors the left column: same width/margin/header style; real data only, empty sections hide ===== */
body.l2.ltbar.rail:not(.pnR) .side.right{display:flex!important;flex-direction:column;justify-content:flex-start;gap:14px;top:64px;right:var(--m,48px);width:352px;height:648px;overflow:hidden}
body.l2.ltbar.rail:not(.pnR)>.cams{right:416px!important}
body.l2.ltbar.rail.pnL:not(.pnR)>.cams{left:calc(var(--cl) + var(--pw) + 8px)!important}
body.l2 .side.right .rs{display:none;flex:none;min-height:0}
body.l2 .side.right .rs.on{display:block}
body.l2 .side.right h4,body.l2 #bu h4{display:flex;align-items:center;gap:10px}
body.l2 .side.right h4 .via{margin-left:auto;font:500 10px var(--mono);letter-spacing:.14em;color:var(--mut,#838b88)}
body.l2 .side.right h4 span:first-child{flex:none}
body.l2 .side.right .it{padding:6px 0;border-bottom:1px solid var(--hair2,rgba(255,255,255,.07))}
body.l2 .side.right .it:last-child{border-bottom:0}
body.l2 .side.right .it .tm{font:500 11px var(--mono);letter-spacing:.12em;color:var(--mut,#838b88);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.l2 .side.right .it .tm b{font-weight:700}body.l2 .side.right b.up{color:#3ddc97}body.l2 .side.right b.dn{color:#ff5a5a}
body.l2 .side.right .it .n,body.l2 .side.right .gvm .n{font:400 15px/1.25 var(--disp);letter-spacing:.05em;text-transform:uppercase;color:#fff;margin:3px 0 1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.l2 .side.right .it .r,body.l2 .side.right .gvm .r{font:300 14px/1.3 var(--sans);letter-spacing:.02em;color:#c9cfcc;text-transform:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.l2 .side.right .gvm .gv{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin:8px 0 6px}
body.l2 .side.right .gvm .gv div{border:1px solid var(--hair,rgba(255,255,255,.16));border-radius:4px;padding:6px 8px}
body.l2 .side.right .gvm .gv span{display:block;font:500 10px var(--mono);letter-spacing:.14em;color:var(--mut,#838b88)}
body.l2 .side.right .gvm .gv b{font:400 20px var(--disp);color:#fff}
body.l2 .side.right .gvm .tm{font:500 10px var(--mono);letter-spacing:.1em;color:var(--mut,#838b88);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* L2 left: timestamped breaking updates above the Politics Monitor charts (operator log, max 2); charts shrink to fit */
body.l2.ltbar #bu.on{display:block;flex:none;margin:0 0 12px}
body.l2.ltbar #bu .card{display:block!important;margin-bottom:8px;border-radius:4px}
body.l2.ltbar #bu .card .tm{margin-bottom:4px}
body.l2.ltbar #bu .card .tx{font-size:16px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* top status strip (all layouts): real fetch health only */
body .topbar #sys{display:flex;gap:20px;font:500 12px var(--mono);letter-spacing:.16em;color:var(--mut,#838b88)}
body .topbar #sys .sy{display:flex;align-items:center;gap:8px}
body .topbar #sys .syb{display:flex;align-items:center;font-weight:700;color:#97efca}   /* brand: same mono + tracking as the strip, heavier, wordmark mint; no box / divider */
body .topbar #sys .sy i{width:6px;height:6px;border-radius:50%;background:#3ddc97}
body .topbar #sys .sy.offline i{background:#ff5a5a}body .topbar #sys .sy.stale i{background:#ffd400}

/* rail fit: tighter headers/rows inside the right rail */
body.l2.ltbar.rail:not(.pnR) .side.right{gap:8px}
body.l2 .side.right h4{margin:0 0 2px!important;padding-bottom:6px!important}
body.l2 .side.right .it{padding:4px 0}
/* breaking updates on: charts share the remaining height, legend + axis rows drop so nothing overlaps */
body.l2.ltbar.bu-on #charts .pmp{overflow:hidden}
body.l2.ltbar.bu-on #charts .pmc .plg,body.l2.ltbar.bu-on #charts .pmc .pax,body.l2.ltbar.bu-on #charts .pmc .pq{display:none}
body.l2.ltbar.bu-on #charts h4{margin-bottom:6px}

/* rail v2: sections separated by space (no row divider lines) and spread over the full camera-row height */
body.l2.ltbar.rail:not(.pnR) .side.right{justify-content:space-between;gap:18px}
body.l2 .side.right .it{border-bottom:0!important;padding:5px 0 7px}
body.l2 .side.right .rs h4{margin-bottom:6px!important}
body.l2.ltbar.rail:not(.pnR) .side.right{gap:10px}body.l2 .side.right .it{padding:3px 0 5px}
/* rail v3: Upcoming events titles wrap to 2 lines (ellipsis after line 2) */
body.l2 .side.right #rsEv .it .n{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}
body.l2 .side.right #rsEv .it{padding:3px 0 3px}body.l2 .side.right #rsEv .it .n{line-height:1.2}