/* Tour, live half: #accounts #journal #data #flows #remote. All data illustrative. */
.tl-sec{max-width:1240px;margin:0 auto;padding:110px 24px}
.tl-head{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:end;margin-bottom:44px}
.tl-head p{color:var(--muted);max-width:50ch}
.tl-glass{position:relative;border-radius:var(--r-lg);background:linear-gradient(180deg,oklch(0.215 0.022 250 / .66),oklch(0.17 0.025 250 / .66));
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 40px 90px -40px oklch(0.05 0.03 250 / .9)}
.tl-glass::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;
  background:linear-gradient(160deg,oklch(1 0 0 / .22),oklch(1 0 0 / .04) 38%,oklch(1 0 0 / .02) 62%,oklch(0.78 0.118 196 / .35));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.tl-card{position:relative;border-radius:13px;background:oklch(0.215 0.022 250 / .75);box-shadow:0 0 0 1px var(--line) inset;padding:14px 16px;min-width:0}
.tl-ch{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.tl-ch b{color:var(--text);font-weight:600;font-size:13.5px}
.tl-ch .muted{font-size:11.5px}
.tl-legend{display:flex;align-items:center;gap:6px 12px;flex-wrap:wrap;font-size:11px;color:var(--faint)}
.tl-legend span{display:inline-flex;align-items:center;gap:6px}
.tl-legend i{display:inline-block;width:12px;height:2px;border-radius:2px}
.tl-svg{display:block;width:100%;overflow:visible}
.tl-scroll{overflow-x:auto}
/* anything that loops stops when its section is off-screen */
.tl-sec:not(.tl-vis) *,.tl-sec:not(.tl-vis) *::before,.tl-sec:not(.tl-vis) *::after{animation-play-state:paused!important}

/* ---------- account frame ---------- */
.tl-frame{padding:22px 24px 24px;font-size:12.5px;color:var(--muted);box-shadow:0 60px 120px -40px oklch(0.05 0.03 250 / .9),0 0 120px -30px oklch(0.78 0.118 196 / .3)}
.ac-title{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ac-title h3{font-size:22px;color:var(--text);letter-spacing:-.025em;margin-right:4px}
.ac-pill{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;padding:3px 10px;border-radius:999px;background:oklch(1 0 0 / .04);box-shadow:0 0 0 1px var(--line) inset;color:var(--muted);white-space:nowrap}
.ac-pill.ok{color:var(--pos);background:oklch(0.76 0.118 152 / .1);box-shadow:0 0 0 1px oklch(0.76 0.118 152 / .35) inset}
.ac-pill.sm{font-size:10.5px;padding:2px 8px}
.ac-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.ac-chips li{font-size:11.5px;color:var(--text);padding:3px 9px;border-radius:7px;background:oklch(1 0 0 / .035);box-shadow:0 0 0 1px var(--line) inset}
.ac-chips small{font-size:10px;color:var(--faint);margin-right:6px}
.ac-metrics{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-top:16px}
.ac-metrics>div{border-radius:11px;background:oklch(1 0 0 / .03);box-shadow:0 0 0 1px var(--line) inset;padding:10px 12px;display:flex;flex-direction:column;min-width:0}
.ac-metrics small{font-size:10.5px;color:var(--faint)}
.ac-metrics b{font-family:var(--mono);font-weight:500;font-size:19px;color:var(--text);letter-spacing:-.02em;white-space:nowrap}
.ac-metrics b.pos{color:var(--pos)}.ac-metrics b.neg{color:var(--neg)}.ac-metrics b.warn{color:var(--warn)}
.ac-metrics em{font-style:normal;font-size:10.5px;color:var(--faint)}
.ac-tabs{display:flex;gap:4px;margin:18px 0 14px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.ac-tabs button,.lb-pick button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.ac-tabs button{position:relative;padding:9px 12px 11px;font-size:13px;white-space:nowrap;color:var(--muted);transition:color .2s}
.ac-tabs button:hover{color:var(--text)}
.ac-tabs button[aria-selected=true]{color:var(--text)}
.ac-tabs button::after{content:"";position:absolute;left:10px;right:10px;bottom:-1px;height:2px;border-radius:2px;background:var(--teal);transform:scaleX(0);transition:transform .35s var(--ease)}
.ac-tabs button[aria-selected=true]::after{transform:scaleX(1)}
.ac-tabs em{font-style:normal;font-family:var(--mono);font-size:10px;padding:1px 6px;border-radius:5px;background:oklch(1 0 0 / .07);margin-left:4px}
.ac-tabs em.flag{color:var(--neg);background:oklch(0.76 0.118 27 / .14);animation:flagPulse 2.2s ease-in-out infinite}
@keyframes flagPulse{50%{box-shadow:0 0 0 4px oklch(0.76 0.118 27 / .12)}}
.ac-pane{animation:paneIn .45s var(--ease)}
@keyframes paneIn{from{opacity:0;transform:translateY(8px)}}

.ov-grid{display:grid;grid-template-columns:1fr 1fr 330px;grid-template-areas:"curve curve made" "since attn rec";gap:12px}
.ov-curve{grid-area:curve}.ov-made{grid-area:made}.ov-since{grid-area:since}.ov-attn{grid-area:attn}.ov-rec{grid-area:rec}
#acCurve{height:270px}
.lg-bal{background:var(--teal)}
.lg-dep,.lg-wd{width:8px!important;height:8px!important;border-radius:50%!important}
.lg-dep{background:var(--pos)}.lg-wd{background:none;box-shadow:0 0 0 1.5px var(--neg) inset}
.ac-line{fill:none;stroke:var(--teal);stroke-width:2;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1}
.ac-area{opacity:0;transition:opacity 1.2s .9s}
.jr-line{fill:none;stroke-width:1.8;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1}
.tl-in .jr-line{transition:stroke-dashoffset 2.4s var(--ease);stroke-dashoffset:0}
.tl-in .ac-line{transition:stroke-dashoffset 2.4s var(--ease);stroke-dashoffset:0}
.tl-in .ac-area{opacity:1}
.mk{transform-box:fill-box;transform-origin:center;transform:scale(0);transition:transform .5s cubic-bezier(.3,1.6,.5,1)}
.tl-in .mk{transform:scale(1)}
.mk-lab{font-size:10.5px;fill:var(--muted);paint-order:stroke;stroke:var(--bg);stroke-width:4px;stroke-linejoin:round;opacity:0;transition:opacity .5s}
.tl-in .mk-lab{opacity:1}
.ax{font:10.5px var(--mono);fill:var(--faint)}
.grid-l{stroke:oklch(1 0 0 / .06)}

.made li{display:grid;grid-template-columns:1fr auto 76px;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid var(--line);color:var(--text);font-size:12.5px}
.made li:last-child{border:0}
.made .nm{min-width:0}
.made .nm i{display:block;height:2px;border-radius:2px;margin-top:5px;transform-origin:0 0;transform:scaleX(0);transition:transform 1s var(--ease)}
.tl-in .made .nm i{transform:scaleX(var(--w))}
.made b{font-family:var(--mono);font-weight:500;text-align:right}
.rate{font-size:9.5px;font-weight:600;letter-spacing:.02em;padding:2px 7px;border-radius:5px}
.rate.ex{color:var(--pos);background:oklch(0.76 0.118 152 / .14);box-shadow:0 0 0 1px oklch(0.76 0.118 152 / .4) inset}
.rate.st{color:var(--teal);box-shadow:0 0 0 1px oklch(0.78 0.118 196 / .45) inset}
.rate.wk{color:var(--warn);box-shadow:0 0 0 1px oklch(0.76 0.118 78 / .45) inset}
.rate.lo{color:var(--neg);background:oklch(0.76 0.118 27 / .12);box-shadow:0 0 0 1px oklch(0.76 0.118 27 / .4) inset}

.since-sum{font-size:12px;margin-bottom:6px}
.since li{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px solid var(--line);font-size:12px;opacity:0;transform:translateX(-8px);transition:opacity .5s,transform .5s var(--ease)}
.since li:last-child{border:0}
.since li span{color:var(--teal)}.since li small{color:var(--faint);margin-left:6px;font-size:11px}
.since li b{font-family:var(--mono);font-weight:500}
.tl-in .since li{opacity:1;transform:none}
.count{font:500 11px var(--mono);padding:1px 8px;border-radius:999px;color:var(--warn);background:oklch(0.76 0.118 78 / .14)}
.attn li{position:relative;padding:4px 0 10px 16px;font-size:12px;line-height:1.4}
.attn li::before{content:"";position:absolute;left:0;top:8px;width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 8px currentColor}
.attn li.neg::before{animation:ledPulse 1.8s ease-in-out infinite}
@keyframes ledPulse{50%{box-shadow:0 0 0 5px oklch(0.76 0.118 27 / .15),0 0 8px currentColor}}
.attn b{display:block;color:var(--text);font-weight:600}
.attn span{color:var(--muted)}
.rec div{display:flex;justify-content:space-between;gap:10px;padding:5px 0;font-size:12px}
.rec dd{font-family:var(--mono);color:var(--text)}
.rec .tot{border-top:1px solid oklch(1 0 0 / .2);margin-top:4px;padding-top:8px}
.rec .tot dt,.rec .tot dd{color:var(--text);font-weight:600}
.rec .diff dd{font-family:var(--sans);color:var(--pos);font-weight:600}
.rec-foot{font-size:11px;color:var(--faint);margin-top:6px}

.tl-table{width:100%;border-collapse:collapse;font-size:12.5px;white-space:nowrap}
.tl-table th{font-weight:500;font-size:11px;color:var(--faint);text-align:left;padding:6px 10px;border-bottom:1px solid var(--line)}
.tl-table td{padding:9px 10px;border-bottom:1px solid var(--line);color:var(--text)}
.tl-table tr:last-child td{border:0}
.tl-table .r{text-align:right;font-family:var(--mono)}
.tl-table th.r{font-family:var(--sans)}
.tl-table .sbar{display:inline-block;width:70px;height:4px;border-radius:4px;background:oklch(1 0 0 / .07);vertical-align:middle;margin-right:8px;overflow:hidden}
.tl-table .sbar i{display:block;height:100%;border-radius:4px}
.tl-table tbody tr{transition:background .2s}.tl-table tbody tr:hover{background:oklch(1 0 0 / .025)}
.side{font-size:10.5px;font-weight:600;padding:1px 6px;border-radius:4px}
.side.buy{color:var(--pos);background:oklch(0.76 0.118 152 / .12)}.side.sell{color:var(--neg);background:oklch(0.76 0.118 27 / .12)}

.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.cal .dow{font-size:10.5px;color:var(--faint);padding-left:4px}
.cal .d{min-height:62px;border-radius:9px;padding:7px 8px;background:oklch(1 0 0 / .025);box-shadow:0 0 0 1px var(--line) inset;display:flex;flex-direction:column;justify-content:space-between;font-size:10.5px;color:var(--faint)}
.cal .d b{font:500 12px var(--mono);letter-spacing:-.02em}
.cal .d.x{background:none;box-shadow:none}
.cal .d em{font-style:normal;font-size:10px}

.lb-pick{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.lb-pick button{font-size:12px;padding:6px 12px;border-radius:999px;background:oklch(1 0 0 / .04);box-shadow:0 0 0 1px var(--line) inset;color:var(--muted);display:inline-flex;gap:7px;align-items:center}
.lb-pick button[aria-pressed=true]{color:var(--text);background:oklch(0.78 0.118 196 / .12);box-shadow:0 0 0 1px oklch(0.78 0.118 196 / .4) inset}
.lb-pick b{font:500 11px var(--mono)}
.lb-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
#lbCurve,#lbScore{height:270px}
.lg-live{background:var(--teal)}.lg-band{height:8px!important;background:oklch(0.85 0.065 82 / .3)}.lg-thr{border-top:1.5px dashed var(--neg);height:0!important}
.lb-note{font-size:11.5px;color:var(--faint);margin-top:8px;min-height:1.5em}
.lb-note.bad{color:var(--neg)}
.pulse-ring{fill:none;stroke:var(--neg);stroke-width:2;transform-box:fill-box;transform-origin:center;animation:ring 1.6s ease-out infinite}
@keyframes ring{from{transform:scale(.4);opacity:1}to{transform:scale(2.6);opacity:0}}
.flag-lab{font:600 11px var(--sans);fill:var(--neg)}

/* ---------- journal ---------- */
.jr-wrap{display:grid;grid-template-columns:7fr 5fr;gap:40px;align-items:start}
.jr-chart{position:sticky;top:96px;padding:20px 22px 16px}
.jr-chart figcaption{display:flex;gap:14px;align-items:baseline;flex-wrap:wrap;margin-bottom:12px}
.jr-chart figcaption span{color:var(--faint);font-size:12.5px}
#jrSvg{height:330px}
.jr-leg{margin-top:10px;font-size:12px}
.jr-mk{transition:transform .3s var(--ease);transform-box:fill-box;transform-origin:center}
.jr-mk.hot{transform:scale(1.7)}
.jr-seg{fill:none;stroke-width:6;stroke-linecap:round;opacity:0;transition:opacity .3s}
.jr-seg.hot{opacity:.35}
.jr-list{position:relative;padding-left:30px}
.jr-list::before{content:"";position:absolute;left:5px;top:8px;bottom:8px;width:1px;background:linear-gradient(var(--teal),oklch(0.85 0.065 82 / .6));transform-origin:0 0;transform:scaleY(0);transition:transform 1.6s var(--ease)}
.tl-in .jr-list::before{transform:none}
.jr-list li{position:relative;padding:12px 14px 14px;margin-bottom:10px;border-radius:14px;cursor:default;opacity:0;transform:translateY(18px);transition:opacity .6s,transform .7s var(--ease),background .25s}
.tl-in .jr-list li{opacity:1;transform:none}
.jr-list li:hover,.jr-list li:focus-visible,.jr-list li.hot{background:oklch(1 0 0 / .035)}
.jr-list li::before{content:"";position:absolute;left:-29px;top:18px;width:9px;height:9px;transform:rotate(45deg);background:var(--c,var(--gold));box-shadow:0 0 0 3px var(--bg),0 0 12px var(--c,var(--gold))}
.jr-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12px;color:var(--faint)}
.jr-kind{font-size:11px;font-weight:600;padding:2px 8px;border-radius:6px;color:var(--c);box-shadow:0 0 0 1px color-mix(in oklch,var(--c) 45%,transparent) inset}
.jr-list h3{font-size:16px;margin-top:6px;letter-spacing:-.015em}
.jr-list p{font-size:14px;color:var(--muted);margin-top:4px;line-height:1.45}
.jr-link{display:inline-flex;align-items:center;gap:8px;margin-top:9px;font-size:12px;color:var(--text);padding:4px 10px;border-radius:999px;background:oklch(1 0 0 / .04);box-shadow:0 0 0 1px var(--line) inset}
.jr-link b{font:500 12px var(--mono)}

/* ---------- data ---------- */
.dt-wrap>*,.fl-wrap>*,.jr-wrap>*,.tl-remote>*{min-width:0}
.dt-wrap{display:grid;grid-template-columns:1fr 330px;gap:14px;align-items:start}
.dt-grid-card{padding:20px 22px}
.dt-scroll{overflow-x:auto;margin:0 -4px;padding:4px}
.dt-grid{display:grid;grid-template-columns:minmax(160px,1.1fr) repeat(24,minmax(16px,1fr));gap:3px;align-items:center;min-width:600px}
.dt-grid .yr{font:10px var(--mono);color:var(--faint);grid-row:1}
.dt-grid .yr{font:10px var(--mono);color:var(--muted);border-left:1px solid var(--line);padding-left:4px}
.dt-grid .mo{font:9.5px var(--mono);color:var(--faint);text-align:center}
.dt-grid .sym{position:sticky;left:0;z-index:1;background:oklch(0.2 0.024 250);align-self:stretch;display:flex;flex-direction:column;justify-content:center;font-size:12px;color:var(--text);padding-right:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dt-grid .sym small{display:block;font-size:10.5px;color:var(--faint)}
.dt-grid .sym .cu{font-size:9.5px;color:var(--gold);margin-left:6px;font-weight:600}
.cell{height:24px;border-radius:4px;background:oklch(1 0 0 / .04);position:relative}
.cell::after{content:"";position:absolute;inset:0;border-radius:inherit;background:var(--cc);transform:scaleY(.15);opacity:0;transition:transform .35s var(--ease),opacity .35s;transition-delay:var(--dl)}
.tl-in .cell::after{transform:none;opacity:1}
.cell.t{--cc:oklch(0.78 0.118 196 / .75)}
.cell.b{--cc:oklch(0.78 0.118 196 / .28)}
.cell.n{--cc:transparent}
.cell.g{--cc:repeating-linear-gradient(135deg,oklch(0.76 0.118 27 / .85) 0 3px,oklch(0.76 0.118 27 / .25) 3px 6px);box-shadow:0 0 0 1px oklch(0.76 0.118 27 / .7)}
.tl-in .cell.g::after{animation:flick 2.8s steps(1) calc(var(--dl) + .4s) infinite}
@keyframes flick{0%,100%{opacity:1}8%{opacity:.35}12%{opacity:1}16%{opacity:.5}20%{opacity:1}}
.cell.hl{outline:1.5px solid var(--neg);outline-offset:2px}
.c-t{background:oklch(0.78 0.118 196 / .75);height:10px!important;width:10px!important;border-radius:3px!important}
.c-b{background:oklch(0.78 0.118 196 / .28);height:10px!important;width:10px!important;border-radius:3px!important}
.c-g{background:repeating-linear-gradient(135deg,oklch(0.76 0.118 27 / .85) 0 2px,oklch(0.76 0.118 27 / .25) 2px 4px);height:10px!important;width:10px!important;border-radius:3px!important}
.c-n{background:oklch(1 0 0 / .06);height:10px!important;width:10px!important;border-radius:3px!important}
.dt-callout{margin-top:16px;font-size:13px;color:var(--muted);padding:10px 14px;border-radius:10px;background:oklch(0.76 0.118 27 / .07);box-shadow:0 0 0 1px oklch(0.76 0.118 27 / .25) inset}
.dt-callout b{color:var(--neg)}
.dt-side{display:grid;gap:14px}
.dt-card{padding:18px 20px}
.dt-card h3{font-size:16px;margin-bottom:10px}
.dt-list li{display:flex;flex-direction:column;padding:8px 0;border-bottom:1px solid var(--line);font-size:13px;color:var(--text)}
.dt-list li:last-child{border:0}
.dt-list span{display:flex;align-items:center;gap:8px}
.dt-list .mono{color:var(--teal)}
.dt-list em{font-style:normal;font-size:12px;color:var(--faint)}

/* ---------- flows ---------- */
.fl-wrap{display:grid;grid-template-columns:300px 1fr;gap:20px;align-items:start}
.fl-tabs{display:flex;flex-direction:column;gap:8px}
.fl-tabs button{font:inherit;text-align:left;cursor:pointer;border:0;color:var(--muted);padding:14px 16px;border-radius:14px;background:oklch(1 0 0 / .03);box-shadow:0 0 0 1px var(--line) inset;transition:background .25s,color .25s,box-shadow .25s;position:relative;overflow:hidden}
.fl-tabs button b{display:block;color:var(--text);font-weight:600;font-size:15px;letter-spacing:-.01em}
.fl-tabs button small{font-size:12px;color:var(--faint)}
.fl-tabs button[aria-selected=true]{background:oklch(0.78 0.118 196 / .1);box-shadow:0 0 0 1px oklch(0.78 0.118 196 / .4) inset}
.fl-tabs button .prog{position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--teal);transform-origin:0 0;transform:scaleX(0)}
.tl-term{min-width:0}
.fl-replay{margin-left:auto;font:inherit;font-size:12px;color:var(--muted);background:oklch(1 0 0 / .05);border:0;border-radius:999px;padding:3px 11px;cursor:pointer}
.fl-replay:hover{color:var(--text)}
.fl-body{height:560px;overflow-y:auto;padding:22px 24px 26px;display:flex;flex-direction:column;gap:12px;font-size:14.5px;scrollbar-width:thin;scrollbar-color:oklch(1 0 0 / .15) transparent}
.fl-body>*{flex:none;animation:stepIn .45s var(--ease) both}
@keyframes stepIn{from{opacity:0;transform:translateY(10px)}}
.fl-u{align-self:flex-end;max-width:80%;padding:10px 15px;border-radius:16px 16px 4px 16px;background:oklch(0.78 0.118 196 / .14);box-shadow:0 0 0 1px oklch(0.78 0.118 196 / .25) inset;color:var(--text)}
.fl-a{color:var(--text);max-width:64ch;line-height:1.55}
.fl-c{border-radius:11px;background:oklch(0.13 0.022 250 / .7);box-shadow:0 0 0 1px var(--line) inset;font-size:12.5px;overflow:hidden}
.fl-ch{display:flex;align-items:center;gap:10px;padding:8px 12px;flex-wrap:wrap}
.fl-ch .mono{color:var(--teal)}
.fl-ch em{font-style:normal;color:var(--faint);font-family:var(--mono);font-size:11.5px;min-width:0;overflow-wrap:anywhere}
.fl-ch .st{margin-left:auto;display:flex;align-items:center;gap:6px;color:var(--faint);font-size:11px}
.fl-c.done .st{color:var(--pos)}
.fl-res{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s var(--ease)}
.fl-c.done .fl-res{grid-template-rows:1fr}
.fl-res>div{overflow:hidden}
.fl-res dl{display:grid;grid-template-columns:repeat(auto-fill,minmax(105px,1fr));gap:6px 14px;padding:8px 12px 10px;border-top:1px solid var(--line)}
.fl-res dt{font-size:10.5px;color:var(--faint)}
.fl-res dd{font:500 12.5px var(--mono);color:var(--text)}
.fl-card{border-radius:16px;padding:16px 18px;background:linear-gradient(180deg,oklch(0.26 0.03 200 / .5),oklch(0.2 0.025 230 / .5));box-shadow:0 0 0 1px oklch(0.78 0.118 196 / .35) inset,0 20px 50px -24px oklch(0.78 0.118 196 / .5)}
.fl-card h4{font-size:17px;color:var(--text);letter-spacing:-.02em;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.fl-card .verdict{font-size:11px;font-weight:600;padding:2px 9px;border-radius:999px}
.fl-card .v-ok{color:var(--pos);background:oklch(0.76 0.118 152 / .14)}.fl-card .v-bad{color:var(--neg);background:oklch(0.76 0.118 27 / .14)}.fl-card .v-info{color:var(--teal);background:oklch(0.78 0.118 196 / .14)}
.fl-card p{font-size:13px;color:var(--muted);margin-top:8px}
.fl-kv{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;margin-top:12px}
.fl-kv div{border-radius:10px;padding:8px 10px;background:oklch(1 0 0 / .04)}
.fl-kv small{display:block;font-size:10.5px;color:var(--faint)}
.fl-kv b{font:500 16px var(--mono);color:var(--text)}
.fl-viz{display:block;width:100%;height:96px;margin-top:12px}
.fl-bars{display:flex;flex-direction:column;gap:6px;margin-top:12px;font-size:12px}
.fl-bars div{display:grid;grid-template-columns:130px 1fr 44px;gap:10px;align-items:center;color:var(--text)}
.fl-bars i{height:6px;border-radius:4px;background:var(--c,var(--teal));transform-origin:0 0;animation:grow 1s var(--ease) both}
.fl-bars b{font:500 12px var(--mono);text-align:right}
@keyframes grow{from{transform:scaleX(0)}}
.fl-typing::after{content:"";display:inline-block;width:7px;height:14px;background:var(--teal);vertical-align:-2px;margin-left:3px;animation:blink 1.1s steps(2) infinite}

/* ---------- remote ---------- */
.tl-remote{display:grid;grid-template-columns:4fr 7fr;gap:56px;align-items:center}
.rm-copy>p{color:var(--muted);margin-top:18px;max-width:46ch}
.rm-dev{margin-top:28px;display:flex;flex-direction:column;gap:2px}
.rm-dev li{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);font-size:14px}
.rm-dev b{font-weight:600;color:var(--text)}.rm-dev em{margin-left:auto;font-style:normal;color:var(--faint);font-size:13px}
.rm-phones{display:flex;justify-content:center;gap:28px;padding:20px 0}
.rm-phones .phone{height:440px;max-height:none;flex:none}
.rm-p:nth-child(2){transform:translateY(34px)}
.rm-lock{background:radial-gradient(120% 70% at 30% 0%,oklch(0.35 0.08 200),oklch(0.16 0.03 250) 70%)}
.rm-clock{text-align:center;color:var(--text);margin:14px 0 8px}
.rm-clock b{display:block;font-size:44px;font-weight:500;letter-spacing:-.04em;line-height:1}
.rm-clock span{font-size:11px;color:var(--muted)}
.rm-notes{display:flex;flex-direction:column;gap:7px}
.rm-notes li{border-radius:14px;padding:9px 11px;background:oklch(0.3 0.02 240 / .7);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 0 0 1px oklch(1 0 0 / .1) inset;font-size:11px;color:var(--muted);line-height:1.35;
  animation:dropIn .7s cubic-bezier(.3,1.4,.5,1) both}
.rm-notes li.alert{box-shadow:0 0 0 1px oklch(0.76 0.118 27 / .55) inset,0 0 24px -6px oklch(0.76 0.118 27 / .6)}
.rm-notes .nh{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--faint);margin-bottom:2px}
.rm-notes .nh svg{width:11px;height:11px;fill:var(--teal)}
.rm-notes b{display:block;color:var(--text);font-size:11.5px}
@keyframes dropIn{from{opacity:0;transform:translateY(-26px) scale(.94)}}
.rm-fleet{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}
.rm-fleet span{display:flex;align-items:center;gap:5px;justify-content:center;height:26px;border-radius:7px;background:oklch(1 0 0 / .045);font:10px var(--mono);color:var(--faint)}
.rm-fleet .led.run{animation:pulse 1.6s ease-in-out infinite}
.rm-q{border-radius:12px;padding:9px 11px;background:oklch(1 0 0 / .045)}
.rm-qh{display:flex;justify-content:space-between;font-size:10.5px;color:var(--faint);margin-bottom:6px}
.rm-qh b{color:var(--text);font-weight:500}
.rm-q .bar i{transition:width .8s var(--ease)}
.rm-jobs li{font-size:11px}
#rmSpark{fill:none;stroke:var(--teal);stroke-width:1.6;vector-effect:non-scaling-stroke}
.rm-flag i{animation:blink 1.4s steps(2) infinite}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .tl-head{grid-template-columns:1fr;gap:18px}
  .ac-metrics{grid-template-columns:repeat(3,1fr)}
  .ov-grid{grid-template-columns:1fr 1fr;grid-template-areas:"curve curve" "made rec" "since attn"}
  .jr-wrap{grid-template-columns:1fr}.jr-chart{position:relative;top:0}
  .dt-wrap{grid-template-columns:1fr}.dt-side{grid-template-columns:1fr 1fr}
  .fl-wrap{grid-template-columns:1fr}
  .fl-tabs{flex-direction:row;overflow-x:auto;scrollbar-width:none;padding:1px}
  .fl-tabs button{flex:0 0 240px}
  .tl-remote{grid-template-columns:1fr;gap:28px}
}
@media (max-width:760px){
  .tl-sec{padding:70px 16px}
  .tl-head{margin-bottom:28px}
  .tl-frame{padding:16px 12px 14px;border-radius:18px}
  .ac-title h3{font-size:19px}
  .ac-metrics{grid-template-columns:repeat(2,1fr);gap:8px}
  .ac-metrics b{font-size:16px}
  .ov-grid,.lb-grid{grid-template-columns:1fr}
  .ov-grid{grid-template-areas:"curve" "made" "since" "attn" "rec"}
  #acCurve{height:200px}#lbCurve,#lbScore{height:220px}
  .cal{gap:3px}.cal .d{min-height:46px;padding:4px 5px}.cal .d b{font-size:9.5px}.cal .d em{display:none}
  #jrSvg{height:240px}
  .jr-chart{padding:16px 14px 12px}
  .dt-grid-card{padding:16px 14px}
  .dt-grid{grid-template-columns:118px repeat(24,16px)}
  .dt-side{grid-template-columns:1fr}
  .fl-tabs button{flex-basis:210px;padding:12px 14px}
  .fl-body{height:520px;padding:16px;font-size:14px}
  .fl-bars div{grid-template-columns:96px 1fr 40px}
  .rm-phones{overflow-x:auto;justify-content:flex-start;scroll-snap-type:x mandatory;margin:0 -16px;padding:20px 16px 50px}
  .rm-phones .phone{scroll-snap-align:center}
}
@media (prefers-reduced-motion:reduce){
  .ac-line,.jr-line{stroke-dashoffset:0}.ac-area,.mk-lab,.since li,.jr-list li,.cell::after{opacity:1!important;transform:none!important}
  .mk,.made .nm i{transform:none!important}.made .nm i{transform:scaleX(var(--w))!important}
  .jr-list::before{transform:none}
}