/* The talk is drawn over the site's own stylesheet, which its page links first: its --c-* colour tokens, dark theme, dot field and
   series colours (--hm-provider-N). Its own rules are scoped to .lt-. The routing panel's literal palette (site.css .rt) is named
   here once. */

:root {
  --lt-ok: #8FD9A8; --lt-ok-line: #3B5444; --lt-ok-fill: #142019;
  --lt-warn: #F0BE85; --lt-bad: var(--c-warn-text); --lt-bad-line: rgba(242, 162, 107, 0.55); --lt-bad-fill: rgba(242, 162, 107, 0.07);
  --lt-cream: #EDE9DE; --lt-orange: #E05A1E; --lt-wire: #34312E; --lt-hub-line: #3A3531; --lt-hub-fill: #1C1C1C;
  --lt-sans: 'Geist', ui-sans-serif, system-ui, sans-serif; --lt-mono: 'Geist Mono', ui-monospace, monospace;
  --lt-ease: cubic-bezier(0.65, 0, 0.25, 1); --lt-out: cubic-bezier(0.2, 0.8, 0.2, 1);
}
html, body { height: 100%; }
body { margin: 0; overflow: hidden; color: var(--c-ink); font-family: var(--lt-sans); -webkit-font-smoothing: antialiased; user-select: none; cursor: default; }

/* Stage: a fixed 1600 × 900 canvas scaled into the window over the site's dot field. */
.lt-viewport { position: fixed; inset: 0; overflow: hidden; isolation: isolate; touch-action: manipulation; --bg-op: 0.5; background: radial-gradient(1200px 700px at 50% 45%, rgba(143, 217, 168, 0.035), transparent 70%), var(--c-bg); }
.lt-stage { position: absolute; left: 50%; top: 50%; transform-origin: 50% 50%; }
.lt-layer { position: absolute; inset: 0; transform-origin: var(--fx) var(--fy); }
.lt-scene { position: absolute; inset: 0; }
.lt-svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.lt-place { position: absolute; box-sizing: border-box; }

/* Zooms between scenes: into a deeper one at its focus, out of it back to the focus, or a slide between neighbours. */
.lt-layer.is-enter-in { animation: lt-enter-in 1100ms var(--lt-ease) both; z-index: 2; }
.lt-layer.is-leave-in { animation: lt-leave-in 1100ms var(--lt-ease) both; z-index: 1; }
.lt-layer.is-enter-out { animation: lt-enter-out 1100ms var(--lt-ease) both; z-index: 1; }
.lt-layer.is-leave-out { animation: lt-leave-out 1100ms var(--lt-ease) both; z-index: 2; }
.lt-layer.is-enter-next { animation: lt-enter-next 800ms var(--lt-ease) both; }
.lt-layer.is-leave-next { animation: lt-leave-next 800ms var(--lt-ease) both; }
.lt-layer.is-enter-back { animation: lt-enter-back 800ms var(--lt-ease) both; }
.lt-layer.is-leave-back { animation: lt-leave-back 800ms var(--lt-ease) both; }
@keyframes lt-enter-in { from { transform: scale(0.18); opacity: 0; } 35% { opacity: 1; } to { transform: none; opacity: 1; } }
@keyframes lt-leave-in { from { transform: none; opacity: 1; filter: blur(0); } 70% { opacity: 0; } to { transform: scale(4.2); opacity: 0; filter: blur(6px); } }
@keyframes lt-enter-out { from { transform: scale(4.2); opacity: 0; filter: blur(6px); } 40% { opacity: 0.4; } to { transform: none; opacity: 1; filter: blur(0); } }
@keyframes lt-leave-out { from { transform: none; opacity: 1; } 65% { opacity: 0.9; } to { transform: scale(0.18); opacity: 0; } }
.lt-stage { --lt-slide: 160px; }
@keyframes lt-enter-next { from { transform: translateX(var(--lt-slide)); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes lt-leave-next { from { transform: none; opacity: 1; } to { transform: translateX(calc(-1 * var(--lt-slide))); opacity: 0; } }
@keyframes lt-enter-back { from { transform: translateX(calc(-1 * var(--lt-slide))); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes lt-leave-back { from { transform: none; opacity: 1; } to { transform: translateX(var(--lt-slide)); opacity: 0; } }

/* Caption: eyebrow, title and line, each rising in when its text changes. */
.lt-caption { position: absolute; left: 96px; top: 52px; right: 96px; z-index: 5; pointer-events: none; }
.lt-eyebrow { margin: 0; font: 500 14px/1 var(--lt-mono); letter-spacing: 0.14em; text-transform: uppercase; color: var(--c-muted); display: flex; align-items: center; gap: 10px; animation: lt-rise 600ms var(--lt-out) both; }
.lt-eyebrow::before { content: ""; width: 8px; height: 8px; border-radius: 2px; background: var(--lt-orange); }
.lt-title { margin: 16px 0 0; font-size: 50px; line-height: 1.04; font-weight: 600; letter-spacing: -0.035em; color: var(--c-ink); animation: lt-rise 700ms var(--lt-out) 60ms both; }
.lt-sub { margin: 14px 0 0; max-width: 1080px; font-size: 21px; line-height: 1.45; color: var(--c-body); text-wrap: pretty; animation: lt-rise 700ms var(--lt-out) 140ms both; }
@keyframes lt-rise { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }

/* Footer: logo, chapters, beat count. */
.lt-footer { position: absolute; left: 96px; right: 96px; bottom: 26px; height: 36px; z-index: 6; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.lt-home { display: inline-flex; text-decoration: none; }
.lt-chapters { display: flex; gap: 6px; }
.lt-chapters button { all: unset; cursor: pointer; position: relative; padding: 8px 12px 10px; font: 500 12px/1 var(--lt-mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-faint); transition: color 300ms; }
.lt-chapters button:hover { color: var(--c-text-2); }
.lt-chapters button.is-current { color: var(--c-ink); }
.lt-chapters button i { position: absolute; left: 12px; right: 12px; bottom: 2px; height: 2px; border-radius: 2px; background: var(--c-line-strong); transform-origin: left; transition: transform 500ms var(--lt-ease), background-color 300ms; }
.lt-chapters button.is-current i { background: var(--lt-orange); }
.lt-count { display: inline-flex; align-items: center; gap: 6px; font: 13px var(--lt-mono); color: var(--c-faint); }
.lt-count kbd { display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 4px; box-sizing: border-box; border: 1px solid var(--c-line); border-radius: 5px; font: 12px var(--lt-mono); color: var(--c-muted); }
.lt-count kbd + kbd { margin-right: 8px; }

/* Map nodes, after the routing panel's. */
.lt-col-label { position: absolute; font: 500 12px/1 var(--lt-mono); letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-faint); }
.lt-node { display: flex; align-items: center; gap: 12px; padding: 0 16px; border: 1px solid var(--c-line); border-radius: 10px; background: var(--c-surface); color: var(--c-text-2); font-size: 18px; font-weight: 500; white-space: nowrap; transition: border-color 400ms, background-color 400ms, color 400ms, opacity 400ms; }
.lt-node-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.lt-node.is-on { border-color: var(--lt-ok-line); background: var(--lt-ok-fill); color: #FAFAF9; }
.lt-node.is-bad { border-color: var(--lt-bad-line); background: var(--lt-bad-fill); color: #FAFAF9; }
.lt-node.is-down { border-style: dashed; background: transparent; color: var(--c-faint); }
.lt-node.is-dim { opacity: 0.35; }
.lt-tag { margin-left: auto; font: 400 13px var(--lt-mono); color: var(--lt-ok); }
.lt-node.is-bad .lt-tag { color: var(--lt-bad); animation: lt-blink 900ms steps(2, end) infinite; }
.lt-node.is-down .lt-tag, .lt-node.is-idle .lt-tag { color: var(--c-faint); }
@keyframes lt-blink { 50% { opacity: 0.35; } }
.is-shaking { animation: lt-shake 520ms var(--lt-ease) 1; }
@keyframes lt-shake { 20% { translate: -6px 0; } 40% { translate: 5px 0; } 60% { translate: -3px 0; } 80% { translate: 2px 0; } }
.lt-logo { flex: none; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 7px; background: var(--c-logo-tile); }
.lt-logo img { width: 21px; height: 21px; object-fit: contain; }
.lt-logo.is-bare { background: transparent; }
.lt-logo.is-bare img { width: 24px; height: 24px; opacity: 0.7; }
.lt-monogram { flex: none; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 7px; border: 1px solid var(--c-line-strong); background: var(--c-fill); font: 600 13px var(--lt-mono); color: var(--c-text-2); }
.lt-rank { flex: none; width: 22px; font: 500 13px var(--lt-mono); color: var(--c-faint); }

/* Sandbox Router's hub. */
.lt-hub { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; border: 1px solid var(--lt-hub-line); border-radius: 18px; background: var(--lt-hub-fill); box-shadow: 0 0 0 8px rgba(143, 217, 168, 0.05), 0 0 80px rgba(143, 217, 168, 0.08); z-index: 1; }
.lt-hub::after { content: ""; position: absolute; inset: -1px; border-radius: inherit; border: 1px solid rgba(143, 217, 168, 0.4); animation: lt-pulse 2.6s var(--lt-out) infinite; pointer-events: none; }
@keyframes lt-pulse { from { transform: scale(1); opacity: 0.8; } to { transform: scale(1.18, 1.32); opacity: 0; } }
.lt-hub-logo { zoom: 1.55; pointer-events: none; }
.lt-hub.is-small { border-radius: 14px; }
.lt-hub.is-small .lt-hub-logo { zoom: 1.05; }
.lt-hub-label { font: 500 11.5px/1 var(--lt-mono); letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-muted); }

/* Wires and particles. */
.lt-wire path { fill: none; stroke: var(--lt-wire); stroke-width: 1.5; transition: stroke 400ms, opacity 400ms; }
.lt-wire .lt-wire-glow { stroke-width: 7; opacity: 0; }
.lt-wire.is-on path { stroke: var(--lt-ok); }
.lt-wire.is-on .lt-wire-glow { opacity: 0.1; }
.lt-wire.is-bad path { stroke: var(--lt-bad); stroke-dasharray: 5 6; }
.lt-wire.is-bad .lt-wire-glow { opacity: 0; }
.lt-wire.is-down path { stroke: #57534E; stroke-dasharray: 3 5; }
.lt-wire.is-dim path { opacity: 0.45; }
.lt-dot circle { fill: var(--lt-cream); }
.lt-dot .lt-dot-halo { opacity: 0.16; }
.lt-dot.is-ok circle { fill: var(--lt-ok); }
.lt-dot.is-bad circle { fill: var(--lt-bad); }
.lt-dot.is-quiet circle { fill: var(--c-faint); }
.lt-ripple { fill: none; stroke-width: 1.5; stroke: var(--lt-ok); }
.lt-ripple.is-bad { stroke: var(--lt-bad); }
.lt-arrow { fill: none; stroke: var(--c-line-strong); stroke-width: 1.5; stroke-dasharray: 2 6; stroke-linecap: round; }
.lt-token { stroke-width: 2; transition: fill 300ms, stroke 300ms; }
.lt-token.is-live { fill: var(--lt-cream); stroke: transparent; }
.lt-token.is-ok { fill: var(--lt-ok); stroke: rgba(143, 217, 168, 0.3); stroke-width: 8; }
.lt-token.is-gone { fill: var(--c-faint); stroke: transparent; }
.lt-token.is-fallback { fill: transparent; stroke: var(--c-muted); }

/* Panels: the site's mono header bar over a surface card. */
.lt-panel { border: 1px solid var(--c-line); border-radius: 14px; background: var(--c-surface); overflow: hidden; transition: border-color 400ms, box-shadow 400ms; }
.lt-panel.is-lit { border-color: var(--lt-ok-line); box-shadow: 0 0 0 4px rgba(143, 217, 168, 0.06); }
.lt-panel-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 18px; border-bottom: 1px solid var(--c-line); font: 500 11.5px/1 var(--lt-mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-muted); }
.lt-panel-bar span + span { color: var(--c-faint); letter-spacing: 0.06em; text-transform: none; }
.lt-pop { animation: lt-pop 700ms var(--lt-out) both; transform-origin: 100% 50%; }
@keyframes lt-pop { from { opacity: 0; transform: scale(0.6) translateX(-40px); } to { opacity: 1; transform: none; } }

/* YAML. */
.lt-code { margin: 0; padding: 16px 0; font: 16px/1.62 var(--lt-mono); white-space: pre; }
.lt-code-line { display: block; padding: 0 20px; border-left: 3px solid transparent; transition: background-color 400ms, border-color 400ms; }
.lt-code-line.is-marked { background: rgba(240, 190, 133, 0.08); border-left-color: var(--lt-warn); }
.lt-code-key { color: var(--c-muted); }
.lt-code-value { color: var(--c-ink); }
.lt-code-line.is-marked .lt-code-value { color: var(--lt-warn); }
.lt-code-comment { color: var(--c-faint); }

/* Event log, after the routing panel's. */
.lt-log { padding: 12px 20px; border: 1px solid var(--c-line); border-radius: 14px; background: var(--c-panel); font: 14px/1.7 var(--lt-mono); }
.lt-log-head { margin: 0 0 4px; font-size: 11.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-faint); }
.lt-log ol { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: auto auto minmax(0, 1fr); column-gap: 18px; }
.lt-log li { display: contents; }
.lt-log li > span { animation: lt-rise 400ms var(--lt-out) both; }
.lt-log-time { color: #57534E; }
.lt-log-type { color: #D6D3D1; white-space: pre; }
.lt-log-data { color: #A8A29E; }
.lt-log .is-skip .lt-log-type, .lt-log .is-skip .lt-log-data { color: #78716C; }
.lt-log .is-ok .lt-log-data { color: var(--lt-ok); }
.lt-log .is-bad .lt-log-type, .lt-log .is-bad .lt-log-data { color: var(--lt-bad); }

/* Request lens. */
.lt-ask { display: flex; align-items: center; gap: 16px; padding: 0 20px; border: 1px solid var(--c-line); border-radius: 14px; background: var(--c-surface); opacity: 0; transform: translateY(10px); transition: opacity 500ms var(--lt-out), transform 500ms var(--lt-out), border-color 400ms; }
.lt-ask.is-shown { opacity: 1; transform: none; border-color: rgba(240, 190, 133, 0.45); }
.lt-ask-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 10px; background: rgba(240, 190, 133, 0.12); font: 600 20px var(--lt-mono); color: var(--lt-warn); }
.lt-ask-text { display: flex; flex-direction: column; gap: 3px; }
.lt-ask-text small { font: 500 11px var(--lt-mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-faint); }
.lt-ask-text strong { font-size: 22px; font-weight: 600; letter-spacing: -0.02em; }
.lt-ask-rule { margin-left: auto; font: 13px var(--lt-mono); color: var(--c-muted); }
.lt-table-head, .lt-table-row { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; align-items: center; padding: 0 20px; }
.lt-table-head { border-bottom: 1px solid var(--c-line-soft); font: 500 11.5px var(--lt-mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--c-faint); }
.lt-table-head span, .lt-table-row span { transition: color 400ms; }
.lt-table-head .is-lit { color: var(--lt-warn); }
.lt-table-row { position: relative; border-bottom: 1px solid var(--c-line-soft); font: 16px var(--lt-mono); color: var(--c-text-2); transition: opacity 400ms, background-color 400ms; }
.lt-table-row:last-child { border-bottom: 0; }
.lt-table-row > span:first-child { display: flex; align-items: center; gap: 12px; font: 500 17px var(--lt-sans); color: var(--c-ink); white-space: nowrap; }
.lt-table-row .is-lit { color: var(--lt-warn); }
.lt-table-row em { position: absolute; left: 60px; bottom: 9px; padding: 1px 7px; border-radius: 999px; background: var(--lt-ok-fill); border: 1px solid var(--lt-ok-line); font: normal 11.5px var(--lt-mono); color: var(--lt-ok); animation: lt-rise 400ms var(--lt-out) both; }
.lt-table-row.is-winner { background: rgba(143, 217, 168, 0.06); box-shadow: inset 3px 0 0 var(--lt-ok); }
.lt-table-row.is-winner .is-lit { color: var(--lt-ok); }
.lt-table-row.is-winner .lt-meter b { background: var(--lt-ok); }
.lt-table-row.is-out { opacity: 0.32; }
.lt-table-row.is-fallback { opacity: 0.6; }
.lt-table-row.is-fallback em { background: transparent; border-color: var(--c-line-strong); color: var(--c-muted); }
.lt-scan { border-radius: 2px; background: rgba(240, 190, 133, 0.07); box-shadow: inset 3px 0 0 var(--lt-warn); pointer-events: none; }

/* Decision cards. */
.lt-stage-card { display: flex; flex-direction: column; gap: 10px; padding: 24px; border: 1px solid var(--c-line); border-radius: 16px; background: var(--c-surface); transition: border-color 400ms, box-shadow 400ms, background-color 400ms; }
.lt-stage-card h2 { margin: 6px 0 0; font-size: 28px; font-weight: 600; letter-spacing: -0.025em; }
.lt-stage-card p { margin: 0; font-size: 16px; color: var(--c-body); }
.lt-stage-n { font: 500 12px/1 var(--lt-mono); letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-faint); }
.lt-stage-card.is-active { border-color: var(--lt-ok-line); background: var(--lt-ok-fill); box-shadow: 0 0 0 6px rgba(143, 217, 168, 0.06); }
.lt-stage-card.is-active .lt-stage-n { color: var(--lt-ok); }
.lt-stage-card.is-done .lt-stage-n::after { content: "  ✓"; color: var(--lt-ok); }
.lt-stage-card.is-source, .lt-stage-card.is-sink { background: transparent; border-style: dashed; }
.lt-chips { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 6px; }
.lt-chips span { padding: 5px 9px; border: 1px solid var(--c-line); border-radius: 7px; font: 12.5px var(--lt-mono); color: var(--c-muted); background: var(--c-surface-2); }
.lt-stage-result { margin-top: auto; font: 13px var(--lt-mono); color: var(--c-faint); opacity: 0; transform: translateY(6px); transition: opacity 400ms, transform 400ms var(--lt-out), color 400ms; }
.lt-stage-card.is-active .lt-stage-result, .lt-stage-card.is-done .lt-stage-result { opacity: 1; transform: none; }
.lt-stage-card.is-active .lt-stage-result { color: var(--lt-ok); }
.lt-sink-label { position: absolute; left: 0; right: 0; text-align: center; font: 500 11px var(--lt-mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-faint); }

/* Preferences. */
.lt-order { margin: 0; padding: 18px 20px; list-style: none; display: flex; flex-wrap: wrap; gap: 10px; }
.lt-order li { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid var(--c-line); border-radius: 9px; font-size: 16px; font-weight: 500; color: var(--c-text-2); }
.lt-order li span { font: 12px var(--lt-mono); color: var(--c-faint); }
.lt-panel.is-lit .lt-order li { border-color: var(--lt-ok-line); }
.lt-pool { display: flex; align-items: center; gap: 14px; padding: 0 18px; border: 1px solid var(--c-line); border-radius: 12px; background: var(--c-surface); transition: left 800ms var(--lt-ease), top 800ms var(--lt-ease), opacity 500ms, transform 500ms var(--lt-ease), border-color 400ms, background-color 400ms; }
.lt-pool-name { display: flex; flex-direction: column; gap: 3px; }
.lt-pool-name strong { font-size: 18px; font-weight: 600; }
.lt-pool-name small { font: 13px var(--lt-mono); color: var(--c-muted); }
.lt-pool-badges { margin-left: auto; display: flex; gap: 6px; }
.lt-badge { padding: 4px 8px; border: 1px solid var(--c-line-strong); border-radius: 6px; font: 12px var(--lt-mono); color: var(--c-text-2); white-space: nowrap; }
.lt-badge.is-missing { border-style: dashed; color: var(--c-faint); text-decoration: line-through; }
.lt-badge.is-reason { border-color: var(--lt-bad-line); color: var(--lt-bad); animation: lt-rise 400ms var(--lt-out) both; }
.lt-badge.is-rank { border-color: var(--c-line-strong); color: var(--c-muted); }
.lt-pool.is-out { opacity: 0.4; }
.lt-pool.is-gone { opacity: 0; transform: scale(0.92); }
.lt-pool.is-ranked { border-color: var(--c-line-strong); }
.lt-pool.is-winner { border-color: var(--lt-ok-line); background: var(--lt-ok-fill); box-shadow: 0 0 0 6px rgba(143, 217, 168, 0.06); }
.lt-pool.is-winner .lt-badge.is-rank { border-color: var(--lt-ok-line); color: var(--lt-ok); }
.lt-strip { display: flex; align-items: center; gap: 12px; padding: 0 24px; border: 1px solid var(--c-line); border-radius: 14px; background: var(--c-panel); }
.lt-strip > span { display: inline-flex; align-items: baseline; gap: 10px; padding-right: 12px; font-size: 16px; color: var(--c-faint); transition: color 400ms; }
.lt-strip > span + span::before { content: "→"; margin-right: 12px; color: var(--c-line-strong); }
.lt-strip strong { font-size: 30px; font-weight: 600; letter-spacing: -0.03em; color: var(--c-faint); transition: color 400ms; }
.lt-strip .is-on { color: var(--c-body); }
.lt-strip .is-on strong { color: var(--c-ink); }
.lt-strip .is-ok strong { color: var(--lt-ok); }

/* Analytics. */
.lt-signal { display: flex; flex-direction: column; justify-content: center; gap: 4px; padding: 0 22px; border: 1px solid var(--c-line); border-radius: 14px; background: var(--c-surface); transition: border-color 400ms, background-color 400ms; }
.lt-signal small { font: 500 11.5px var(--lt-mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-faint); }
.lt-signal strong { font: 500 22px var(--lt-mono); color: var(--c-text-2); }
.lt-signal span { font-size: 15px; color: var(--c-muted); }
.lt-signal.is-on { border-color: rgba(240, 190, 133, 0.45); }
.lt-signal.is-on strong { color: var(--lt-warn); }
.lt-analytics { overflow: hidden; }
.lt-analytics-cols { grid-template-columns: 200px 290px 1fr 1.2fr; }
.lt-moving { position: absolute; left: 0; right: 0; box-sizing: border-box; transition: top 800ms var(--lt-ease), opacity 400ms, background-color 400ms; }
.lt-band { position: absolute; left: 8px; right: 8px; border: 1px dashed rgba(240, 190, 133, 0.5); border-radius: 10px; pointer-events: none; animation: lt-rise 400ms var(--lt-out) both; transition: border-color 400ms; }
.lt-band span { position: absolute; right: 12px; top: -10px; padding: 0 8px; background: var(--c-surface); font: 11.5px var(--lt-mono); color: var(--lt-warn); }
.lt-band.is-resolved { border-color: var(--c-line-strong); }
.lt-band.is-resolved span { color: var(--c-muted); }
.lt-spark polyline { fill: none; stroke: var(--hm-provider-3); stroke-width: 1.6; }
.lt-meter { position: relative; display: inline-block; width: 120px; height: 8px; margin-right: 12px; border-radius: 4px; background: var(--c-fill); vertical-align: middle; overflow: hidden; }
.lt-meter b { position: absolute; left: 0; top: 0; bottom: 0; border-radius: inherit; background: var(--c-muted); transition: width 200ms linear, background-color 300ms; }
.is-lit .lt-meter b { background: var(--lt-warn); }
.lt-meter.is-wide { width: 100%; margin-right: 0; }

/* Benchmarks. */
.lt-note { display: flex; flex-direction: column; gap: 10px; padding: 26px; border: 1px solid var(--c-line); border-radius: 14px; background: var(--c-surface); }
.lt-note small { font: 500 11.5px var(--lt-mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-faint); }
.lt-note strong { font-size: 26px; font-weight: 600; letter-spacing: -0.02em; }
.lt-note p { margin: 0; font-size: 17px; line-height: 1.55; color: var(--c-body); }
.lt-result { margin-top: auto; align-self: flex-start; padding: 10px 14px; border: 1px solid var(--c-line); border-radius: 10px; font: 15px var(--lt-mono); color: var(--c-faint); transition: border-color 400ms, color 400ms, background-color 400ms; }
.lt-result.is-on { border-color: var(--lt-ok-line); background: var(--lt-ok-fill); color: var(--lt-ok); }
.lt-tabs { display: flex; gap: 8px; padding: 18px 24px 4px; }
.lt-tabs span { padding: 7px 12px; border: 1px solid var(--c-line); border-radius: 8px; font: 13px var(--lt-mono); color: var(--c-faint); }
.lt-tabs .is-on { border-color: rgba(240, 190, 133, 0.45); color: var(--lt-warn); }
.lt-lanes { display: flex; flex-direction: column; gap: 6px; padding: 14px 24px; }
.lt-lane { display: grid; grid-template-columns: 170px 1fr 150px 70px; align-items: center; gap: 16px; height: 74px; padding: 0 14px; border-radius: 10px; transition: background-color 400ms, box-shadow 400ms, opacity 400ms; }
.lt-lane-name { display: flex; align-items: center; gap: 12px; font-size: 17px; font-weight: 500; }
.lt-lane-track { position: relative; height: 14px; border-radius: 7px; background: var(--c-fill); overflow: hidden; }
.lt-lane-track b { position: absolute; left: 0; top: 0; bottom: 0; border-radius: inherit; background: linear-gradient(90deg, rgba(240, 190, 133, 0.5), var(--lt-warn)); }
.lt-lane-value { font: 500 18px var(--lt-mono); text-align: right; font-variant-numeric: tabular-nums; }
.lt-lane-value small { font-size: 12px; color: var(--c-muted); }
.lt-lane-rank { font: 13px var(--lt-mono); color: var(--c-muted); text-align: right; }
.lt-lane.is-ranked { opacity: 0.55; }
.lt-lane.is-winner { opacity: 1; background: rgba(143, 217, 168, 0.06); box-shadow: inset 3px 0 0 var(--lt-ok); }
.lt-lane.is-winner .lt-lane-track b { background: linear-gradient(90deg, rgba(143, 217, 168, 0.5), var(--lt-ok)); }
.lt-lane.is-winner .lt-lane-rank { color: var(--lt-ok); }
.lt-lanes:has(.is-winner) .lt-lane:not(.is-winner) { opacity: 0.45; }

/* Precedence. */
.lt-tier { display: flex; align-items: center; gap: 24px; padding: 0 28px; border: 1px solid var(--c-line); border-radius: 16px; background: var(--c-surface); transition: border-color 400ms, background-color 400ms, box-shadow 400ms; }
.lt-tier .lt-stage-n { width: 30px; }
.lt-tier-text { display: flex; flex-direction: column; gap: 4px; max-width: 680px; }
.lt-tier-text strong { font-size: 26px; font-weight: 600; letter-spacing: -0.02em; }
.lt-tier-text span { font-size: 16px; color: var(--c-body); }
.lt-tier-count { margin-left: auto; font: 500 14px var(--lt-mono); color: var(--c-faint); opacity: 0; transition: opacity 400ms, color 400ms; }
.lt-tier.is-done .lt-tier-count { opacity: 1; color: var(--c-muted); }
.lt-tier.is-active { border-color: var(--lt-ok-line); background: var(--lt-ok-fill); box-shadow: 0 0 0 6px rgba(143, 217, 168, 0.06); }
.lt-tier.is-active .lt-stage-n { color: var(--lt-ok); }
.lt-tier.is-active .lt-tier-count { opacity: 1; color: var(--lt-ok); }
.lt-tier.is-placement { border-style: dashed; background: transparent; }
.lt-tier.is-placement.is-done { border-style: solid; border-color: var(--lt-ok-line); }

/* Burst. */
.lt-burst-head { display: flex; align-items: baseline; gap: 12px; padding: 22px 20px 6px; }
.lt-burst-head strong { font-size: 44px; font-weight: 600; letter-spacing: -0.035em; }
.lt-burst-head span { font-size: 16px; color: var(--c-body); }
.lt-spike { display: block; margin: 8px 20px 0; overflow: visible; }
.lt-spike-ghost { fill: none; stroke: var(--c-line-strong); stroke-width: 1.5; stroke-dasharray: 3 4; }
.lt-spike-fill { fill: rgba(240, 190, 133, 0.12); }
.lt-spike-line { fill: none; stroke: var(--lt-warn); stroke-width: 2; }
.lt-tally { display: flex; flex-direction: column; justify-content: center; gap: 22px; padding: 0 22px; border: 1px solid var(--c-line); border-radius: 14px; background: var(--c-panel); }
.lt-tally > span { display: grid; grid-template-columns: 1fr auto; align-items: baseline; row-gap: 10px; }
.lt-tally small { font: 500 12px var(--lt-mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-faint); }
.lt-tally strong { font: 600 34px/1 var(--lt-sans); letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.lt-tally .lt-meter { grid-column: 1 / -1; }
.lt-tally .is-ok strong { color: var(--lt-ok); }
.lt-tally .is-ok .lt-meter b { background: var(--lt-ok); }
.lt-tally .is-bad strong { color: var(--lt-bad); }
.lt-tally .lt-meter.is-bad b { background: var(--lt-bad); }
.lt-group-head { display: flex; align-items: center; gap: 10px; padding: 0 4px; font-size: 15px; color: var(--c-faint); transition: color 400ms; }
.lt-group-head .lt-monogram { width: 22px; height: 22px; border-radius: 5px; font-size: 11px; }
.lt-group-head strong { font-weight: 600; }
.lt-group-head > span:last-child { margin-left: auto; font: 12px var(--lt-mono); }
.lt-group-head.is-on { color: var(--c-text-2); }
.lt-account { display: grid; grid-template-columns: 110px 1fr 100px 80px; align-items: center; gap: 16px; padding: 0 14px; border: 1px solid var(--c-line); border-radius: 9px; background: var(--c-surface); font: 13.5px var(--lt-mono); color: var(--c-text-2); transition: opacity 400ms, border-color 300ms, background-color 300ms; }
.lt-account-count { text-align: right; font-variant-numeric: tabular-nums; color: var(--c-muted); }
.lt-account-tag { text-align: right; font-size: 12px; color: var(--c-faint); }
.lt-account .lt-meter b { background: var(--lt-ok); }
.lt-account.is-unused { opacity: 0.32; border-style: dashed; background: transparent; }
.lt-account.is-taking { border-color: var(--lt-ok-line); }
.lt-account.is-full { border-color: var(--lt-ok-line); background: var(--lt-ok-fill); }
.lt-account.is-full .lt-account-tag { color: var(--lt-ok); }
.lt-account.is-refusing { border-color: var(--lt-bad-line); background: var(--lt-bad-fill); }
.lt-account.is-refusing .lt-account-tag { color: var(--lt-bad); font-weight: 500; }

/* Burst totals. */
.lt-totals-row { position: absolute; left: 0; right: 0; }
.lt-totals-label { position: absolute; translate: 0 -50%; white-space: nowrap; font-size: 20px; font-weight: 500; color: var(--c-text-2); }
.lt-totals-row.is-router .lt-totals-label { color: var(--c-ink); font-weight: 600; }
.lt-totals-bar { position: absolute; top: 8px; bottom: 8px; border-radius: 8px; background: var(--c-line-strong); }
.lt-totals-value { position: absolute; top: 50%; translate: 0 -50%; font: 500 22px var(--lt-mono); color: var(--c-muted); }
.lt-totals-seg { position: absolute; top: 0; bottom: 0; display: grid; place-items: center; border-radius: 6px; font: 600 13px var(--lt-mono); color: rgba(15, 14, 13, 0.75); opacity: 0; transform: translateY(-26px) scaleY(0.4); transition: opacity 400ms var(--lt-out), transform 500ms var(--lt-out); }
.lt-totals-seg.is-in { opacity: 1; transform: none; }
.is-series-1 { --series: var(--hm-provider-1); }
.is-series-2 { --series: var(--hm-provider-2); }
.is-series-3 { --series: var(--hm-provider-3); }
.is-series-4 { --series: var(--hm-provider-4); }
.lt-totals-seg, .lt-usage-bars i, .lt-usage-legend i { background: var(--series); }
.lt-totals-sum { position: absolute; font: 600 54px/1 var(--lt-sans); letter-spacing: -0.04em; color: var(--c-ink); font-variant-numeric: tabular-nums; text-align: right; }
.lt-totals-sum small { font: 500 18px var(--lt-mono); letter-spacing: 0; color: var(--c-muted); }
.lt-limit { position: absolute; border-left: 2px dashed var(--lt-warn); }
.lt-limit span { position: absolute; left: 10px; bottom: -6px; white-space: nowrap; font: 13px var(--lt-mono); color: var(--lt-warn); }
.lt-axis { position: absolute; height: 30px; border-top: 1px solid var(--c-line); }
.lt-axis span { position: absolute; top: 10px; translate: -50% 0; font: 13px var(--lt-mono); color: var(--c-faint); }
.lt-legend { display: grid; grid-template-columns: 14px 1fr; align-items: center; column-gap: 12px; row-gap: 4px; padding: 0 20px; border: 1px solid var(--c-line); border-radius: 12px; background: var(--c-surface); opacity: 0; transform: translateY(10px); transition: opacity 500ms var(--lt-out), transform 500ms var(--lt-out); }
.lt-legend.is-in { opacity: 1; transform: none; }

/* The measured burst, replayed: a cell per sandbox, sent, then running at its measured time. */
.lt-run-head { position: absolute; display: grid; grid-template-columns: 30px 1fr auto; column-gap: 12px; row-gap: 6px; align-items: center; }
.lt-run-head .lt-logo { grid-row: 1 / span 2; }
.lt-run-head strong { font-size: 18px; font-weight: 600; color: var(--c-ink); }
.lt-run-head small { grid-column: 2 / -1; font: 13px var(--lt-mono); color: var(--c-muted); }
.lt-run-count { font: 500 15px var(--lt-mono); font-variant-numeric: tabular-nums; color: var(--c-text-2); transition: color 300ms; }
.lt-run-count.is-done { color: var(--lt-ok); }
.lt-run-grid { position: absolute; display: grid; }
.lt-run-grid i { width: var(--cell); height: var(--cell); border-radius: calc(var(--cell) / 4); }
.lt-run-grid i, .lt-run-key i { background: var(--c-fill); transition: background-color 200ms, box-shadow 200ms; }
.lt-run-grid i.is-sent, .lt-run-key i.is-sent { background: rgba(237, 233, 222, 0.12); box-shadow: inset 0 0 0 1px rgba(237, 233, 222, 0.32); }
.lt-run-grid i.is-up, .lt-run-key i.is-up { background: var(--lt-ok); box-shadow: none; }
.lt-run-grid i.is-up { transition: none; animation: lt-cell 420ms var(--lt-out) both; }
@keyframes lt-cell { from { transform: scale(1.7); filter: brightness(1.6); } }
.lt-run-key { position: absolute; display: flex; gap: 20px; font: 13px var(--lt-mono); color: var(--c-muted); }
.lt-run-key span { display: inline-flex; align-items: center; gap: 8px; }
.lt-run-key i { width: 12px; height: 12px; border-radius: 3px; }
.lt-run-note { position: absolute; margin: 0; font: 13px/1.55 var(--lt-mono); color: var(--c-faint); }
.lt-run-clock { position: absolute; left: 0; right: 0; bottom: 0; display: grid; place-content: center; justify-items: center; gap: 12px; }
.lt-run-clock strong { font: 600 66px/1 var(--lt-sans); letter-spacing: -0.04em; font-variant-numeric: tabular-nums; color: var(--c-ink); transition: color 300ms; }
.lt-run-clock.is-done strong { color: var(--lt-ok); }
.lt-run-clock small { font: 13px var(--lt-mono); color: var(--c-muted); }
.lt-run-bars { position: absolute; display: flex; align-items: flex-end; gap: 2px; }
.lt-run-bars i { flex: 1; border-radius: 2px 2px 0 0; background: var(--lt-ok); }
.lt-run-mark { position: absolute; border-left: 1px dashed var(--c-line-strong); opacity: 0.4; transition: opacity 300ms, border-color 300ms; }
.lt-run-mark > span { position: absolute; top: 0; left: 0; translate: -50% -100%; padding-bottom: 3px; white-space: nowrap; font: 12.5px var(--lt-mono); color: var(--c-muted); transition: color 300ms; }
.lt-run-mark.is-end > span { translate: -100% -100%; }
.lt-run-mark.is-lit { opacity: 1; border-color: var(--lt-warn); }
.lt-run-mark.is-lit > span { color: var(--lt-warn); }
.lt-run-fact { display: flex; flex-direction: column; justify-content: center; gap: 8px; padding: 0 20px; border: 1px solid var(--c-line); border-radius: 12px; background: var(--c-surface); opacity: 0; transform: translateY(10px); transition: opacity 500ms var(--lt-out), transform 500ms var(--lt-out); }
.lt-run-fact.is-in { opacity: 1; transform: none; }
.lt-run-fact strong { font: 600 30px/1 var(--lt-sans); letter-spacing: -0.03em; font-variant-numeric: tabular-nums; color: var(--c-ink); }
.lt-run-fact span { font: 13px/1.4 var(--lt-mono); color: var(--c-muted); }
.lt-run-marks { display: flex; align-items: stretch; gap: 6px; }
.lt-run-marks span { flex: 1; display: flex; align-items: center; justify-content: center; gap: 5px; border: 1px dashed var(--c-line-strong); border-radius: 7px; font: 10.5px var(--lt-mono); color: var(--c-faint); white-space: nowrap; transition: color 300ms, border-color 300ms; }
.lt-run-marks b { font-weight: 500; }
.lt-run-marks span.is-lit { border-style: solid; border-color: rgba(240, 190, 133, 0.45); color: var(--lt-warn); }
.lt-legend i { grid-column: 1; grid-row: 1 / span 2; width: 14px; height: 14px; border-radius: 4px; background: var(--series); }
.lt-legend strong { grid-column: 2; font-size: 17px; font-weight: 600; }
.lt-legend span { grid-column: 2; font: 13px var(--lt-mono); color: var(--c-muted); }

/* Failover order. */
.lt-order-row { display: flex; align-items: center; gap: 14px; padding: 0 22px; border: 1px solid var(--c-line); border-radius: 14px; background: var(--c-surface); transition: left 800ms var(--lt-ease), top 800ms var(--lt-ease), opacity 500ms, border-color 400ms, background-color 400ms; }
.lt-order-row strong { font-size: 21px; font-weight: 600; letter-spacing: -0.01em; }
.lt-order-tag { margin-left: auto; font: 14px var(--lt-mono); color: var(--c-faint); }
.lt-order-row.is-trying { border-color: rgba(240, 190, 133, 0.45); }
.lt-order-row.is-trying .lt-order-tag { color: var(--lt-warn); }
.lt-order-row.is-bad { border-color: var(--lt-bad-line); background: var(--lt-bad-fill); }
.lt-order-row.is-bad .lt-order-tag { color: var(--lt-bad); }
.lt-order-row.is-skipped { border-style: dashed; background: transparent; opacity: 0.55; }
.lt-order-row.is-skipped strong { text-decoration: line-through; text-decoration-color: var(--lt-bad); }
.lt-order-row.is-skipped .lt-order-tag { color: var(--lt-bad); }
.lt-order-row.is-running { border-color: var(--lt-ok-line); background: var(--lt-ok-fill); box-shadow: 0 0 0 6px rgba(143, 217, 168, 0.06); }
.lt-order-row.is-running .lt-order-tag { color: var(--lt-ok); }
.lt-walker { display: grid; place-items: center; font-size: 18px; color: var(--c-faint); opacity: 0; transition: opacity 400ms; }
.lt-walker.is-on { opacity: 1; color: var(--lt-warn); animation: lt-nudge 1.2s ease-in-out infinite; }
@keyframes lt-nudge { 50% { translate: 6px 0; } }
.lt-id-value { display: block; padding: 22px 22px 8px; font: 500 32px var(--lt-mono); color: var(--c-ink); }
.lt-id dl { margin: 0; padding: 6px 22px 18px; display: grid; gap: 10px; }
.lt-id dl > div { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding-bottom: 8px; border-bottom: 1px solid var(--c-line-soft); }
.lt-id dt { font-size: 15px; color: var(--c-muted); }
.lt-id dd { margin: 0; font: 16px var(--lt-mono); color: var(--c-text-2); }
.lt-id dd.is-ok { color: var(--lt-ok); }
.lt-flip { animation: lt-rise 450ms var(--lt-out) both; }

/* Console. */
.lt-window { display: flex; flex-wrap: wrap; align-content: flex-start; border: 1px solid var(--c-line); border-radius: 16px; background: var(--c-bg); box-shadow: 0 30px 80px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.02); overflow: hidden; opacity: 0; transform: scale(0.94); transition: opacity 600ms var(--lt-out), transform 700ms var(--lt-out); }
.lt-window.is-open { opacity: 1; transform: none; }
.lt-window-bar { flex: 1 0 100%; height: 40px; display: flex; align-items: center; gap: 8px; padding: 0 16px; border-bottom: 1px solid var(--c-line); background: var(--c-surface); }
.lt-window-bar i { width: 11px; height: 11px; border-radius: 50%; background: var(--c-line-strong); }
.lt-window-bar span { margin: 0 auto; padding: 4px 14px; border-radius: 7px; background: var(--c-fill); font: 12.5px var(--lt-mono); color: var(--c-muted); }
.lt-console-nav { width: 220px; height: 544px; box-sizing: border-box; padding: 20px 18px; border-right: 1px solid var(--c-line); background: var(--c-surface); }
.lt-console-nav ul { margin: 26px 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 2px; }
.lt-console-nav li { padding: 8px 10px; border-radius: 7px; font-size: 14.5px; color: var(--c-body); }
.lt-console-nav li.is-on { background: var(--c-fill); color: var(--c-ink); font-weight: 500; }
.lt-console-main { flex: 1; min-width: 0; padding: 18px 22px; display: flex; flex-direction: column; gap: 14px; }
.lt-console-totals { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.lt-console-totals > div { display: flex; flex-direction: column; gap: 6px; padding: 14px 16px; border: 1px solid var(--c-line); border-radius: 12px; background: var(--c-surface); }
.lt-console-totals span { font-size: 13px; color: var(--c-muted); }
.lt-console-totals strong { font-size: 28px; font-weight: 600; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.lt-console-grid { flex: 1; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 196px 1fr; gap: 12px; }
.lt-console-card { min-width: 0; padding: 14px 16px; border: 1px solid var(--c-line); border-radius: 12px; background: var(--c-surface); overflow: hidden; }
.lt-console-card h3 { margin: 0 0 10px; font: 500 11.5px var(--lt-mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-faint); }
.lt-console-providers { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 4px; }
.lt-console-providers li { display: grid; grid-template-columns: 24px 1fr auto 214px; align-items: center; gap: 12px; height: 34px; font-size: 15px; }
.lt-console-providers em { text-align: right; }
.lt-console-providers .lt-monogram { width: 24px; height: 24px; font-size: 11px; }
.lt-console-providers span { font: 12.5px var(--lt-mono); color: var(--c-muted); }
.lt-console-providers em { font: normal 12.5px var(--lt-mono); color: var(--lt-ok); }
.lt-console-providers em::before { content: "● "; }
.lt-console-providers .is-bad em { color: var(--lt-bad); }
.lt-console-routing dl { margin: 0; display: flex; flex-direction: column; gap: 10px; }
.lt-console-routing dl > div { display: flex; justify-content: space-between; gap: 12px; padding-bottom: 9px; border-bottom: 1px solid var(--c-line-soft); }
.lt-console-routing dt { font-size: 14px; color: var(--c-muted); }
.lt-console-routing dd { margin: 0; font: 13.5px var(--lt-mono); color: var(--c-text-2); }
.lt-console-usage { display: flex; flex-direction: column; }
.lt-usage-bars { flex: 1; display: grid; grid-template-columns: repeat(14, minmax(0, 1fr)); gap: 7px; align-items: end; padding-bottom: 6px; border-bottom: 1px solid var(--c-line); }
.lt-usage-bars > span { display: flex; flex-direction: column-reverse; overflow: hidden; border-radius: 3px 3px 0 0; }
.lt-usage-bars i { display: block; flex-basis: 0; min-height: 0; }
.lt-usage-legend { display: flex; gap: 14px; margin-top: 8px; font-size: 12.5px; color: var(--c-muted); }
.lt-usage-legend span { display: inline-flex; align-items: center; gap: 6px; }
.lt-usage-legend i { width: 9px; height: 9px; border-radius: 2px; }
.lt-console-audit ol { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 2px; }
.lt-console-audit li { display: grid; grid-template-columns: 120px 1fr; gap: 12px; padding: 3px 0; border-bottom: 1px solid var(--c-line-soft); font-size: 13px; animation: lt-rise 450ms var(--lt-out) both; }
.lt-console-audit li strong { font: 500 12.5px var(--lt-mono); color: var(--c-text-2); }
.lt-console-audit li span { color: var(--c-body); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lt-silo { z-index: 3; display: flex; flex-direction: column; gap: 10px; padding: 16px; border: 1px solid var(--c-line-strong); border-radius: 12px; background: var(--c-surface); box-shadow: 0 18px 40px rgba(0, 0, 0, 0.4); overflow: hidden; animation: lt-float 3.6s ease-in-out infinite; transition: left 800ms var(--lt-ease), top 800ms var(--lt-ease), width 800ms var(--lt-ease), height 800ms var(--lt-ease), opacity 500ms 450ms, padding 800ms var(--lt-ease); }
.lt-silo:nth-of-type(odd) { animation-delay: -1.8s; }
.lt-silo.is-in { opacity: 0; padding: 6px 10px; animation: none; }
.lt-silo > span { transition: opacity 250ms; }
.lt-silo.is-in > span:not(.lt-silo-head) { opacity: 0; }
.lt-silo-head { display: flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 600; white-space: nowrap; }
.lt-silo-lines { display: flex; flex-direction: column; gap: 7px; }
.lt-silo-lines i { height: 7px; border-radius: 4px; background: var(--c-fill); }
.lt-silo-lines i:nth-child(2) { width: 72%; }
.lt-silo-lines i:nth-child(3) { width: 48%; }
.lt-silo-foot { margin-top: auto; font: 12px var(--lt-mono); color: var(--c-faint); white-space: nowrap; }
@keyframes lt-float { 50% { translate: 0 -6px; } }

/* Closing. */
.lt-closing { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 26px; padding-bottom: 60px; }
.lt-closing-logo { zoom: 3.4; animation: lt-rise 900ms var(--lt-out) both; }
.lt-closing-title { margin: 0; font-size: 76px; line-height: 1; font-weight: 600; letter-spacing: -0.04em; animation: lt-rise 900ms var(--lt-out) 150ms both; }
.lt-closing-links { margin: 6px 0 0; display: flex; gap: 28px; font: 20px var(--lt-mono); color: var(--c-muted); animation: lt-rise 900ms var(--lt-out) 300ms both; }
.lt-closing-links span:first-child { color: var(--c-ink); }
.lt-closing-links span + span::before { content: "·"; margin-right: 28px; color: var(--c-faint); }
.lt-rings { position: absolute; left: 50%; top: 40%; width: 0; height: 0; }
.lt-rings i { position: absolute; left: -160px; top: -160px; width: 320px; height: 320px; border-radius: 50%; border: 1px solid rgba(143, 217, 168, 0.28); animation: lt-ring 5.2s var(--lt-out) infinite; }
.lt-rings i:nth-child(2) { animation-delay: -1.3s; }
.lt-rings i:nth-child(3) { animation-delay: -2.6s; border-color: rgba(224, 90, 30, 0.22); }
.lt-rings i:nth-child(4) { animation-delay: -3.9s; }
@keyframes lt-ring { from { transform: scale(0.4); opacity: 0.9; } to { transform: scale(3.6); opacity: 0; } }

/* The tall stage, a phone held upright: its scenes lay themselves out in its own coordinates, and these rules size the type and
   the chrome to them. */
.lt-stage.is-tall { --lt-slide: 64px; }
.is-tall .lt-caption { left: 20px; right: 20px; top: 26px; }
.is-tall .lt-eyebrow { gap: 8px; font-size: 11px; letter-spacing: 0.12em; }
.is-tall .lt-eyebrow::before { width: 7px; height: 7px; }
.is-tall .lt-title { margin-top: 12px; font-size: 28px; line-height: 1.08; letter-spacing: -0.03em; }
.is-tall .lt-sub { margin-top: 10px; font-size: 14px; line-height: 1.45; }

.is-tall .lt-footer { left: 20px; right: 20px; bottom: 14px; height: 32px; gap: 14px; }
.is-tall .lt-home { zoom: 0.8; }
.is-tall .lt-chapters { flex: 1; gap: 5px; }
.is-tall .lt-chapters button { flex: 1; padding: 14px 0; }
.is-tall .lt-chapters button span { display: none; }
.is-tall .lt-chapters button::before { content: ""; position: absolute; left: 0; right: 0; bottom: 13px; height: 3px; border-radius: 2px; background: var(--c-line); }
.is-tall .lt-chapters button i { left: 0; right: 0; bottom: 13px; height: 3px; }
.is-tall .lt-count { font-size: 11px; }
.is-tall .lt-count kbd { display: none; }

.is-tall .lt-col-label { font-size: 10.5px; letter-spacing: 0.1em; }
.is-tall .lt-node { gap: 8px; padding: 0 10px; border-radius: 8px; font-size: 13.5px; }
.is-tall .lt-tag { font-size: 10.5px; }
.is-tall .lt-logo { width: 22px; height: 22px; border-radius: 5px; }
.is-tall .lt-logo img { width: 15px; height: 15px; }
.is-tall .lt-logo.is-bare img { width: 18px; height: 18px; }
.is-tall .lt-monogram { width: 22px; height: 22px; border-radius: 5px; font-size: 11px; }
.is-tall .lt-rank { width: 12px; font-size: 11px; }
.is-tall .lt-hub { gap: 8px; border-radius: 14px; box-shadow: 0 0 0 5px rgba(143, 217, 168, 0.05), 0 0 40px rgba(143, 217, 168, 0.08); }
.is-tall .lt-hub-logo, .is-tall .lt-hub.is-small .lt-hub-logo { zoom: 0.78; }
.is-tall .lt-hub.is-small { border-radius: 11px; }
.is-tall .lt-hub-label { font-size: 9.5px; letter-spacing: 0.1em; }
.is-tall .lt-dot circle { r: 3.5px; }
.is-tall .lt-dot .lt-dot-halo { r: 8px; }
.is-tall .lt-token { r: 7px; }

.is-tall .lt-panel { border-radius: 11px; }
.is-tall .lt-panel-bar { gap: 8px; padding: 0 12px; font-size: 10px; letter-spacing: 0.08em; }
.is-tall .lt-code { padding: 10px 0; font-size: 12px; line-height: 1.55; }
.is-tall .lt-code-line { padding: 0 12px; }

.is-tall .lt-ask { gap: 10px; padding: 0 12px; border-radius: 11px; }
.is-tall .lt-ask-icon { width: 30px; height: 30px; border-radius: 8px; font-size: 15px; }
.is-tall .lt-ask-text small { font-size: 9.5px; }
.is-tall .lt-ask-text strong { font-size: 16px; }
.is-tall .lt-ask-rule { display: none; }
.is-tall .lt-table-head, .is-tall .lt-table-row { padding: 0 12px; }
.is-tall .lt-table-head { font-size: 9.5px; line-height: 1.25; letter-spacing: 0.04em; }
.is-tall .lt-table-row { font-size: 12.5px; }
.is-tall .lt-table-row > span:first-child { gap: 8px; font-size: 14px; }
.is-tall .lt-table-row em { left: 42px; bottom: 3px; padding: 0 5px; font-size: 9.5px; }

.is-tall .lt-stage-card { gap: 4px; padding: 12px 16px; border-radius: 12px; }
.is-tall .lt-stage-card h2 { margin-top: 2px; font-size: 20px; }
.is-tall .lt-stage-card p { font-size: 13px; }
.is-tall .lt-stage-n { font-size: 10px; }
.is-tall .lt-chips { display: none; }
.is-tall .lt-stage-result { font-size: 11px; }
.is-tall .lt-sink-label { font-size: 9.5px; }

.is-tall .lt-order { gap: 6px; padding: 10px 12px; }
.is-tall .lt-order li { gap: 5px; padding: 4px 7px; border-radius: 7px; font-size: 12px; }
.is-tall .lt-order li span { font-size: 10px; }
.is-tall .lt-pool { gap: 8px; padding: 0 10px; border-radius: 10px; }
.is-tall .lt-pool-name { gap: 1px; }
.is-tall .lt-pool-name strong { font-size: 13.5px; }
.is-tall .lt-pool-name small { font-size: 10.5px; }
.is-tall .lt-pool-badges { gap: 4px; }
.is-tall .lt-badge { padding: 2px 5px; border-radius: 5px; font-size: 9.5px; }
.is-tall .lt-pool.is-out .lt-badge:not(.is-reason) { display: none; }

.is-tall .lt-signal { gap: 3px; padding: 0 12px; border-radius: 11px; }
.is-tall .lt-signal small { font-size: 9.5px; }
.is-tall .lt-signal strong { font-size: 14px; }
.is-tall .lt-signal span { font-size: 11.5px; line-height: 1.35; }
.is-tall .lt-analytics-cols { grid-template-columns: 112px 92px 54px 1fr; }
.is-tall .lt-meter:not(.is-wide) { width: 46px; height: 6px; margin-right: 6px; }
.is-tall .lt-band span { top: -8px; right: 8px; padding: 0 5px; font-size: 9.5px; }

.is-tall .lt-note { gap: 6px; padding: 14px 16px; border-radius: 11px; }
.is-tall .lt-note small { font-size: 9.5px; }
.is-tall .lt-note strong { font-size: 18px; }
.is-tall .lt-note p { font-size: 12.5px; line-height: 1.45; }
.is-tall .lt-result { padding: 6px 10px; border-radius: 8px; font-size: 12px; }
.is-tall .lt-tabs { gap: 5px; padding: 12px 12px 2px; }
.is-tall .lt-tabs span { padding: 5px 8px; border-radius: 6px; font-size: 10.5px; }
.is-tall .lt-lanes { gap: 4px; padding: 8px 12px; }
.is-tall .lt-lane { grid-template-columns: 96px 1fr 76px 40px; gap: 8px; height: 38px; padding: 0 8px; }
.is-tall .lt-lane-name { gap: 8px; font-size: 13px; }
.is-tall .lt-lane-track { height: 8px; }
.is-tall .lt-lane-value { font-size: 13px; }
.is-tall .lt-lane-value small { font-size: 9.5px; }
.is-tall .lt-lane-rank { font-size: 10.5px; }

.is-tall .lt-tier { align-items: flex-start; gap: 10px; padding: 14px 14px 0; border-radius: 12px; }
.is-tall .lt-tier .lt-stage-n { width: 18px; padding-top: 5px; }
.is-tall .lt-tier-text { gap: 3px; }
.is-tall .lt-tier-text strong { font-size: 18px; }
.is-tall .lt-tier-text span { font-size: 12.5px; line-height: 1.4; }
.is-tall .lt-tier-count { padding-top: 4px; font-size: 11px; white-space: nowrap; }

.is-tall .lt-burst-head { gap: 6px; padding: 10px 12px 0; }
.is-tall .lt-burst-head strong { font-size: 26px; }
.is-tall .lt-burst-head span { font-size: 12px; }
.is-tall .lt-spike { margin: 6px 12px 0; }
.is-tall .lt-tally { gap: 12px; padding: 0 12px; border-radius: 11px; }
.is-tall .lt-tally > span { row-gap: 5px; }
.is-tall .lt-tally small { font-size: 9.5px; letter-spacing: 0.08em; }
.is-tall .lt-tally strong { font-size: 20px; }
.is-tall .lt-group-head { gap: 6px; padding: 0 2px; font-size: 12px; }
.is-tall .lt-group-head .lt-monogram { width: 16px; height: 16px; border-radius: 4px; font-size: 9px; }
.is-tall .lt-group-head > span:last-child { font-size: 10px; }
.is-tall .lt-account { grid-template-columns: 60px 1fr 62px 48px; gap: 8px; padding: 0 8px; border-radius: 6px; font-size: 10.5px; }
.is-tall .lt-account-count { white-space: nowrap; }
.is-tall .lt-account-tag { font-size: 9.5px; white-space: nowrap; }

.is-tall .lt-totals-label { font-size: 13px; }
.is-tall .lt-totals-bar { top: 4px; bottom: 4px; border-radius: 5px; }
.is-tall .lt-totals-value { font-size: 14px; }
.is-tall .lt-totals-seg { border-radius: 4px; font-size: 9.5px; }
.is-tall .lt-totals-sum { font-size: 34px; }
.is-tall .lt-totals-sum small { font-size: 12px; }
.is-tall .lt-limit span { left: 6px; font-size: 10.5px; }
.is-tall .lt-axis span { font-size: 10px; }
.is-tall .lt-legend { column-gap: 10px; row-gap: 2px; padding: 0 12px; border-radius: 10px; }
.is-tall .lt-legend i { width: 11px; height: 11px; border-radius: 3px; }
.is-tall .lt-legend strong { font-size: 14px; }
.is-tall .lt-legend span { font-size: 10.5px; }

.is-tall .lt-run-head { grid-template-columns: 22px 1fr; column-gap: 8px; row-gap: 2px; }
.is-tall .lt-run-head strong { font-size: 14px; }
.is-tall .lt-run-count { grid-column: 2; font-size: 11.5px; }
.is-tall .lt-run-head small { display: none; }
.is-tall .lt-run-key { gap: 12px; font-size: 10.5px; }
.is-tall .lt-run-key i { width: 9px; height: 9px; border-radius: 2px; }
.is-tall .lt-run-note { font-size: 10px; line-height: 1.45; }
.is-tall .lt-run-clock { gap: 6px; }
.is-tall .lt-run-clock strong { font-size: 30px; }
.is-tall .lt-run-clock small { padding: 0 10px; font-size: 10px; text-align: center; }
.is-tall .lt-run-fact { gap: 4px; padding: 0 10px; border-radius: 10px; }
.is-tall .lt-run-fact strong { font-size: 20px; }
.is-tall .lt-run-fact span { font-size: 10px; line-height: 1.35; }

.is-tall .lt-order-row { gap: 9px; padding: 0 12px; border-radius: 11px; }
.is-tall .lt-order-row strong { font-size: 15px; }
.is-tall .lt-order-tag { font-size: 10.5px; }
.is-tall .lt-walker { font-size: 13px; }
.is-tall .lt-id-value { padding: 14px 14px 4px; font-size: 22px; }
.is-tall .lt-id dl { gap: 6px; padding: 4px 14px 12px; }
.is-tall .lt-id dl > div { padding-bottom: 6px; }
.is-tall .lt-id dt, .is-tall .lt-id dd { font-size: 12.5px; }

.is-tall .lt-window { border-radius: 12px; }
.is-tall .lt-window-bar { height: 32px; gap: 6px; padding: 0 10px; }
.is-tall .lt-window-bar i { width: 8px; height: 8px; }
.is-tall .lt-window-bar span { padding: 3px 10px; font-size: 10.5px; }
.is-tall .lt-console-nav, .is-tall .lt-console-routing, .is-tall .lt-console-providers li > span:not(.lt-monogram) { display: none; }
.is-tall .lt-console-main { gap: 10px; padding: 12px; }
.is-tall .lt-console-totals { gap: 6px; }
.is-tall .lt-console-totals > div { gap: 4px; padding: 8px; border-radius: 9px; }
.is-tall .lt-console-totals span { font-size: 9.5px; line-height: 1.25; }
.is-tall .lt-console-totals strong { font-size: 17px; }
.is-tall .lt-console-grid { grid-template-columns: 1fr; grid-template-rows: auto auto 1fr; gap: 10px; }
.is-tall .lt-console-card { padding: 10px 12px; border-radius: 9px; }
.is-tall .lt-console-card h3 { margin-bottom: 8px; font-size: 10px; }
.is-tall .lt-console-providers li { grid-template-columns: 22px 1fr auto; gap: 8px; height: 28px; font-size: 13px; }
.is-tall .lt-console-providers em { font-size: 11px; }
.is-tall .lt-usage-bars { flex: none; height: 64px; gap: 5px; }
.is-tall .lt-usage-legend { gap: 10px; font-size: 10.5px; }
.is-tall .lt-console-audit li { grid-template-columns: 84px 1fr; gap: 8px; font-size: 11.5px; }
.is-tall .lt-console-audit li strong { font-size: 11px; }
.is-tall .lt-silo { gap: 8px; padding: 12px; border-radius: 10px; }
.is-tall .lt-silo.is-in { padding: 4px 8px; }
.is-tall .lt-silo-head { gap: 8px; font-size: 12.5px; }
.is-tall .lt-silo-lines i { height: 5px; }
.is-tall .lt-silo-foot { font-size: 9.5px; white-space: normal; }

.is-tall .lt-closing { gap: 18px; padding: 0 20px 60px; text-align: center; }
.is-tall .lt-closing-logo { zoom: 1.7; }
.is-tall .lt-closing-title { font-size: 36px; }
.is-tall .lt-closing-links { flex-direction: column; align-items: center; gap: 6px; font-size: 13px; }
.is-tall .lt-closing-links span + span::before { content: none; }
.is-tall .lt-rings i { left: -90px; top: -90px; width: 180px; height: 180px; }
