/* The live tape — shared by the landing and the dashboard.
   Reads its colours from each page's own tokens, so it inherits the palette. */
#tape{border-bottom:1px solid var(--line);background:rgba(10,15,26,.6);overflow:hidden}
.tp-in{max-width:var(--maxw,1080px);margin:0 auto;padding:9px 22px;display:flex;align-items:center;gap:18px}
.tp-in>*{min-width:0}

.tp-now{display:flex;align-items:center;gap:9px;flex-shrink:0}
.tp-dot{width:7px;height:7px;border-radius:50%;background:var(--good);
        box-shadow:0 0 0 3px rgba(72,209,138,.15);animation:tp-pulse 2.4s infinite;flex-shrink:0}
@keyframes tp-pulse{50%{box-shadow:0 0 0 6px rgba(72,209,138,0)}}
.tp-clock{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11.5px;color:var(--ink);
          font-weight:600;letter-spacing:.02em;white-space:nowrap}
.tp-ses{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:10.5px;color:var(--brass);
        white-space:nowrap;letter-spacing:.04em}

/* the moving part */
.tp-scroll{flex:1;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
           -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.tp-run{display:flex;gap:26px;width:max-content;animation:tp-slide 90s linear infinite}
.tp-scroll:hover .tp-run{animation-play-state:paused}
@keyframes tp-slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.tp-run{animation:none}}

.ti{display:inline-flex;align-items:baseline;gap:7px;white-space:nowrap;
    font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11.5px}
.ti b{color:var(--ink2);font-weight:600}
.ti i{font-style:normal;font-variant-numeric:tabular-nums}
.ti i.u{color:var(--up)} .ti i.d{color:var(--down)}
.ti s{text-decoration:none;color:var(--muted);font-size:10px}
.ti.sig b{color:var(--brass)}
.ti.sp{width:44px;flex-shrink:0}

.tp-next{display:flex;align-items:center;gap:9px;flex-shrink:0}
.tp-lbl{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:9.5px;letter-spacing:.11em;
        text-transform:uppercase;color:var(--muted)}
.tp-w{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px;color:var(--ink2);white-space:nowrap}
.tp-w b{color:var(--ink)}
.tp-w i{font-style:normal;font-size:9px;font-weight:800;letter-spacing:.05em;padding:2px 6px;border-radius:5px;margin-left:3px}
.tp-w i.long{background:rgba(63,201,221,.16);color:var(--up)}
.tp-w i.short{background:rgba(240,114,90,.16);color:var(--down)}
.tp-cd{font-size:11.5px;color:var(--brass);font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:600}

/* On phones the countdown is the part worth keeping — the symbol tape scrolls
   under it, and the "next window" label drops to save the row. */
@media(max-width:900px){
  .tp-in{padding:7px 15px;gap:8px 14px;flex-wrap:wrap}
  .tp-lbl{display:none}
  .tp-now{flex:1 1 auto}
  .tp-next{flex:0 0 auto;margin-left:auto;gap:7px}
  .tp-scroll{order:3;flex-basis:100%}
  .tp-w{font-size:10px} .tp-cd{font-size:11px}
  .ti{font-size:11px} .ti.sp{width:26px}
}
@media(max-width:520px){
  .tp-ses{display:none}
  .tp-w{max-width:none}
  .tp-clock{font-size:11px}
}