/* ============================================================
   ENHANCEMENT LAYER — cinematic FX, simulations and interaction
   ============================================================ */

/* --- cinematic reveal + depth ------------------------------------------------ */
#stage{font-variant-numeric:tabular-nums}
.slide{perspective:1800px}
.reveal{
  opacity:0;
  transform:translate3d(0,22px,0) scale(.988) rotateX(3deg);
  filter:blur(4px);
  transform-origin:50% 80%;
  backface-visibility:hidden;
  transition:opacity .58s ease,transform .76s var(--ease),filter .5s ease;
  transition-delay:var(--d,0s);
}
.slide.active .reveal{opacity:1;transform:none;filter:none}

/* --- canvas / light field -------------------------------------------------- */
#fxCanvas{
  position:absolute;inset:0;z-index:60;width:100%;height:100%;
  pointer-events:none;mix-blend-mode:screen;opacity:.62;
}
.fx-sweep{
  position:absolute;inset:0;z-index:70;pointer-events:none;overflow:hidden;opacity:0;
}
.fx-sweep i{
  position:absolute;top:-25%;left:-32%;width:24%;height:150%;
  background:linear-gradient(90deg,transparent 0%,rgba(225,6,0,.34) 45%,rgba(255,70,55,.16) 60%,transparent 100%);
  transform:skewX(-19deg);filter:blur(14px);
}
.fx-sweep i:nth-child(2){
  width:2px;height:140%;background:linear-gradient(180deg,transparent,#fff 50%,transparent);
  filter:none;box-shadow:0 0 18px rgba(255,255,255,.5);
}
.fx-sweep i:nth-child(3){
  width:8%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.08),transparent);
  filter:blur(6px);
}
.fx-sweep.run{opacity:1}
.fx-sweep.run i:nth-child(1){animation:sweepBand .62s cubic-bezier(.16,.84,.24,1) both}
.fx-sweep.run i:nth-child(2){animation:sweepBand .5s cubic-bezier(.16,.84,.24,1) .035s both}
.fx-sweep.run i:nth-child(3){animation:sweepBand .7s cubic-bezier(.16,.84,.24,1) .05s both}
.fx-sweep.reverse i{animation-direction:reverse!important}
@keyframes sweepBand{
  0%{transform:translateX(-40vw) skewX(-19deg);opacity:0}
  12%{opacity:.9}
  72%{opacity:.55}
  100%{transform:translateX(118vw) skewX(-19deg);opacity:0}
}
html.static #fxCanvas,html.static .fx-sweep{display:none!important}

/* --- F1 car cursor ---------------------------------------------------------- */
html.f1-cursor,html.f1-cursor *{
  cursor:url("assets/cursor-f1.png") 24 12,auto!important;
}
html.f1-cursor :is(input[type="range"],textarea,select,.video-frame,.control-dock,.notes-panel,.modal,.lightbox-stage),
html.f1-cursor :is(input[type="range"],textarea,select,.video-frame,.control-dock,.notes-panel,.modal,.lightbox-stage) *{
  cursor:auto!important;
}
body.laser-on,body.laser-on *{cursor:none!important}
@media (hover:none){
  html.f1-cursor,html.f1-cursor *{cursor:auto!important}
}

/* --- portrait gate ---------------------------------------------------------- */
.portrait-gate{
  display:none;position:fixed;inset:0;z-index:450;overflow:hidden;
  background:#08080b;color:#f3f3f5;
}
.portrait-gate-visual{
  position:absolute;inset:0;
  background:url("assets/cover.webp") center/cover no-repeat;
  filter:brightness(.32) saturate(.72);
  transform:scale(1.04);
}
.portrait-gate::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(8,8,11,.28),rgba(8,8,11,.9) 64%,#08080b 100%);
}
.portrait-gate-copy{
  position:absolute;left:28px;right:28px;bottom:calc(48px + env(safe-area-inset-bottom));
  z-index:2;
}
.portrait-gate-kicker{
  display:block;font-family:var(--tech);font-size:10px;letter-spacing:.18em;
  color:var(--red);
}
.portrait-gate h2{
  margin:15px 0 12px;font-size:clamp(42px,12vw,62px);line-height:1.05;
  font-weight:800;letter-spacing:-.045em;
}
.portrait-gate p{
  margin:0;max-width:340px;font-size:13.5px;line-height:1.75;color:#a8a8b2;
}
.portrait-gate-icon{
  margin-top:22px;font-size:36px;line-height:1;color:var(--red);
}
.portrait-gate button{
  display:block;width:100%;height:46px;margin-top:18px;
  border:1px solid var(--red);background:var(--red);color:#fff;
  font-family:var(--sans);font-size:13px;letter-spacing:.04em;
  transition:background .2s,border-color .2s;
}
.portrait-gate button:hover{background:#ff1b0d;border-color:#ff1b0d}
body.portrait-ok .portrait-gate{display:none!important}
@media (max-aspect-ratio:5/6){
  .portrait-gate{display:block}
}
@media (prefers-reduced-motion:reduce){
  .portrait-gate-visual{transform:none}
}

/* --- speaker script --------------------------------------------------------- */
.notes-plan{
  display:flex;align-items:baseline;gap:10px;
  margin:0 0 12px;padding:8px 10px;
  border-left:2px solid var(--red);background:rgba(225,6,0,.045);
}
.notes-plan b{font-family:var(--tech);font-size:15px;color:var(--red);font-weight:500;letter-spacing:.04em}
.notes-plan span{font-size:11px;line-height:1.5;color:#aaaab5}
.notes-cue{
  margin:0 0 14px;padding:8px 10px;border:1px solid rgba(255,255,255,.09);
  font-size:11.5px;line-height:1.7;color:#8f8f9a;background:rgba(255,255,255,.018);
}
.notes-cue::before{content:"动作 / ";color:var(--red);font-family:var(--tech);font-size:9px;letter-spacing:.08em;margin-right:5px}
.notes-script-p{font-size:14.2px;line-height:1.9;color:#d6d6de;letter-spacing:.01em;margin-bottom:15px}
.notes-caveat{
  margin:16px 0 6px;padding:10px 12px;border:1px solid rgba(225,6,0,.24);
  background:rgba(225,6,0,.04);font-size:11.5px;line-height:1.75;color:#b9b9c4;
}
.notes-caveat b{display:block;font-family:var(--tech);font-size:9px;letter-spacing:.1em;color:var(--red);margin-bottom:4px}

/* --- HUD additions --------------------------------------------------------- */
.time-hud{
  position:absolute;left:50%;top:13px;z-index:6;
  display:flex;align-items:center;gap:12px;
  height:36px;padding:0 12px;
  border:1px solid rgba(255,255,255,.13);
  background:rgba(7,7,9,.74);
  backdrop-filter:blur(14px) saturate(120%);
  transform:translate(-50%,-8px);opacity:0;visibility:hidden;
  transition:opacity .25s ease,transform .25s var(--ease),border-color .25s,background .25s;
  cursor:pointer;
}
body.timer-started .time-hud{opacity:1;visibility:visible;transform:translate(-50%,0)}
.time-block{display:flex;align-items:baseline;gap:7px;position:relative;padding-bottom:3px}
.time-label{font-family:var(--tech);font-size:7.5px;letter-spacing:.13em;color:#666672}
.time-block b{font-family:var(--tech);font-size:14px;line-height:1;font-weight:500;letter-spacing:.04em;color:#e7e7ed;font-variant-numeric:tabular-nums}
.time-page b{color:#fff;font-size:15px}
.time-divider{width:1px;height:15px;background:rgba(255,255,255,.14)}
.time-page-bar{position:absolute;left:0;right:0;bottom:0;height:2px;background:rgba(255,255,255,.12);overflow:hidden}
.time-page-bar i{display:block;height:100%;width:100%;background:var(--red);transition:width .25s linear}
.time-hud.low .time-block b{color:#ff7167}
.time-hud.over{border-color:rgba(225,6,0,.6);background:rgba(45,4,5,.82)}
.time-hud.over .time-page b{color:#ff5d50}
@media (max-width:900px){.time-hud{display:none!important}}
.timer-chip{
  height:23px;min-width:48px;padding:0 6px;
  font-family:var(--tech);font-size:10px;letter-spacing:.08em;color:#8e8e99;
  border:1px solid transparent;transition:.2s;
}
.timer-chip:hover{color:#fff;border-color:rgba(255,255,255,.16);background:rgba(255,255,255,.055)}
.timer-chip.running{color:var(--red);border-color:rgba(225,6,0,.35);background:rgba(225,6,0,.08)}
.timer-chip.low{color:#ff6a5f;border-color:rgba(225,6,0,.55);background:rgba(225,6,0,.12)}
.timer-chip.running.low{animation:timerPulse 1.8s ease-in-out infinite}
@keyframes timerPulse{50%{border-color:rgba(225,6,0,.95);box-shadow:0 0 14px rgba(225,6,0,.18)}}
.timer-chip.reset{animation:timerBlink .45s ease}
@keyframes timerBlink{0%,100%{color:#8e8e99}40%{color:#fff}}
.dock-btn[data-action="sound"].active,.dock-btn[data-action="laser"].active{color:var(--red);background:rgba(225,6,0,.11)}
.page-readout.flip{animation:readoutFlip .42s cubic-bezier(.22,1,.36,1)}
@keyframes readoutFlip{0%{opacity:.2;transform:translateY(-7px) skewX(-8deg)}55%{opacity:1;transform:translateY(2px) skewX(2deg)}100%{transform:none}}
body.laser-on, body.laser-on *{cursor:none!important}
body.laser-on .video-frame,body.laser-on .control-dock,body.laser-on .modal,body.laser-on .race-intro{cursor:auto!important}
body.laser-on .control-dock *{cursor:pointer!important}

/* --- race intro ------------------------------------------------------------ */
.race-intro{
  position:fixed;inset:0;z-index:500;overflow:hidden;
  display:flex;align-items:center;justify-content:center;
  background:
    radial-gradient(ellipse at 50% 48%,rgba(225,6,0,.14),transparent 34%),
    linear-gradient(135deg,#050506 0%,#0a0a0d 48%,#040405 100%);
  transition:opacity .58s ease,transform .58s var(--ease);
}
.race-intro[hidden]{display:none!important}
.race-intro.out{opacity:0;transform:scale(1.025);pointer-events:none}
.race-intro.go{background:radial-gradient(ellipse at 50% 48%,rgba(255,255,255,.08),transparent 33%),#050506}
.ri-grid{
  position:absolute;inset:0;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.024) 1px,transparent 1px);
  background-size:96px 96px;
  mask-image:radial-gradient(ellipse at center,#000 10%,transparent 72%);
}
.ri-top,.ri-bottom{position:absolute;left:56px;right:56px;z-index:3;display:flex;justify-content:space-between;align-items:center;font-family:var(--tech);font-size:11px;letter-spacing:.16em;color:#777782;text-transform:uppercase}
.ri-top{top:43px;border-bottom:1px solid rgba(255,255,255,.12);padding-bottom:13px}
.ri-top b{color:var(--red);margin:0 7px;font-weight:400}
.ri-top em{font-style:normal;color:var(--red)}
.ri-bottom{bottom:42px;border-top:1px solid rgba(255,255,255,.12);padding-top:14px}
.ri-center{position:relative;z-index:3;display:flex;flex-direction:column;align-items:center;gap:44px}
.ri-lights{display:flex;gap:16px;padding:20px 22px;border:1px solid rgba(255,255,255,.16);background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.008));box-shadow:0 30px 100px rgba(0,0,0,.55)}
.ri-lights i{position:relative;display:block;width:30px;height:104px;border:1px solid rgba(255,255,255,.11);border-radius:2px;background:linear-gradient(180deg,#15151a,#08080a)}
.ri-lights i::before{content:"";position:absolute;left:50%;top:18px;width:22px;height:22px;margin-left:-11px;border-radius:50%;background:#3d1012;box-shadow:inset 0 0 7px #000;opacity:.65;transition:.18s}
.race-intro.running .ri-lights i:nth-child(1)::before{animation:riLight .22s forwards .15s}
.race-intro.running .ri-lights i:nth-child(2)::before{animation:riLight .22s forwards .38s}
.race-intro.running .ri-lights i:nth-child(3)::before{animation:riLight .22s forwards .61s}
.race-intro.running .ri-lights i:nth-child(4)::before{animation:riLight .22s forwards .84s}
.race-intro.running .ri-lights i:nth-child(5)::before{animation:riLight .22s forwards 1.07s}
.race-intro.go .ri-lights i::before{animation:none!important;background:#360b0d;box-shadow:none;opacity:.4}
@keyframes riLight{to{background:#ff1a0e;box-shadow:0 0 20px #e10600,0 0 48px rgba(225,6,0,.55),inset 0 0 8px #ff8c7c;opacity:1}}
.ri-status{text-align:center}
.ri-status span{display:block;font-family:var(--tech);font-size:11px;letter-spacing:.28em;color:var(--red);transition:.2s}
.ri-status b{display:block;margin-top:14px;font-size:52px;line-height:1.05;font-weight:700;letter-spacing:-.03em;color:#f2f2f4}
.race-intro.go .ri-status span{color:#fff;letter-spacing:.34em;text-shadow:0 0 20px rgba(255,255,255,.45)}
.ri-flash{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;background:radial-gradient(circle at center,rgba(255,255,255,.88),rgba(255,20,10,.32) 22%,transparent 58%)}
.race-intro.go .ri-flash{animation:raceFlash .5s ease-out}
@keyframes raceFlash{0%{opacity:0}12%{opacity:.9}100%{opacity:0}}
.ri-skip{
  display:flex;align-items:center;gap:10px;height:31px;padding:0 11px;
  border:1px solid rgba(255,255,255,.18);color:#a7a7b2;font-family:var(--tech);font-size:9px;letter-spacing:.12em;
}
.ri-skip:hover{background:var(--red);border-color:var(--red);color:#fff}
.ri-skip kbd{font-family:var(--tech);font-size:8px;border:1px solid rgba(255,255,255,.2);padding:2px 4px;color:#777782}
.ri-skip:hover kbd{border-color:rgba(255,255,255,.55);color:#fff}

/* --- video extras ---------------------------------------------------------- */
.video-progress{position:relative;cursor:pointer;touch-action:none;height:4px;background:rgba(255,255,255,.22);pointer-events:auto}
.video-progress::before{content:"";position:absolute;left:0;right:0;top:-7px;bottom:-7px}
.video-progress i{height:100%;background:linear-gradient(90deg,var(--red),#ff4a3e);box-shadow:0 0 12px rgba(225,6,0,.45)}
.video-impact-marker{position:absolute;top:50%;left:34%;width:9px;height:9px;margin:-4px 0 0 -4px;background:#fff;border:2px solid var(--red);transform:rotate(45deg);box-shadow:0 0 10px rgba(225,6,0,.6);z-index:2}
.video-progress:focus-visible{outline:2px solid #fff;outline-offset:5px}
.video-speed,.video-replay{
  width:29px;height:28px;display:grid;place-items:center;flex:none;
  color:rgba(255,255,255,.8);border:1px solid rgba(255,255,255,.18);
  font-family:var(--tech);font-size:9px;letter-spacing:.02em;pointer-events:auto;
}
.video-speed:hover,.video-replay:hover{color:#fff;border-color:var(--red);background:rgba(225,6,0,.35)}
.video-speed.slow{color:var(--red);border-color:rgba(225,6,0,.6);background:rgba(225,6,0,.16)}
.video-replay svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.6}
.video-time{font-variant-numeric:tabular-nums}

/* --- simulator launcher + panel -------------------------------------------- */
.constraints-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.constraints-head > div{min-width:0}
.sim-btn{
  flex:none;display:flex;align-items:center;gap:7px;height:25px;padding:0 8px;
  border:1px solid rgba(225,6,0,.3);background:rgba(225,6,0,.055);
  font-size:9px;letter-spacing:.04em;color:#c78380;
  transition:.25s;
}
.sim-btn kbd{font-family:var(--tech);font-size:8px;border:1px solid rgba(225,6,0,.32);padding:1px 4px;color:var(--red)}
.sim-btn:hover{background:var(--red);border-color:var(--red);color:#fff}
.sim-btn:hover kbd{border-color:rgba(255,255,255,.5);color:#fff}

.sim-modal{z-index:250}
.sim-panel{
  position:relative;width:min(1220px,94vw);max-height:94vh;overflow:auto;
  background:#0b0b0f;border:1px solid rgba(255,255,255,.16);
  padding:23px 27px 15px;box-shadow:0 40px 120px rgba(0,0,0,.7);
  transform:translateY(20px) scale(.99);transition:.42s var(--ease);
}
.modal.open .sim-panel{transform:none}
.sim-layout{display:grid;grid-template-columns:326px 1fr;gap:30px;padding:18px 0 6px}
.sim-controls{border-right:1px solid rgba(255,255,255,.1);padding-right:28px;display:flex;flex-direction:column}
.sim-control-head{display:flex;justify-content:space-between;align-items:baseline;padding-bottom:10px;border-bottom:1px solid var(--line)}
.sim-control-head span{font-size:13px;color:#dedee4;font-weight:600}
.sim-control-head em{font-style:normal;font-family:var(--tech);font-size:8px;letter-spacing:.12em;color:#676772}
.sim-slider{display:block;margin-top:15px}
.sim-slider > span{display:flex;justify-content:space-between;align-items:baseline;font-size:11.5px;color:#a4a4ae}
.sim-slider output{font-family:var(--tech);font-size:18px;color:var(--red);font-weight:600}
.sim-slider input[type=range]{
  -webkit-appearance:none;appearance:none;width:100%;height:4px;margin:12px 0 7px;cursor:pointer;
  border-radius:2px;outline:none;
  background:linear-gradient(90deg,var(--red) 0 var(--p,50%),#32323b var(--p,50%) 100%);
}
.sim-slider input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;
  background:#fff;border:3px solid var(--red);box-shadow:0 0 0 4px rgba(225,6,0,.14),0 0 18px rgba(225,6,0,.35);
}
.sim-slider input[type=range]::-moz-range-thumb{
  width:13px;height:13px;border-radius:50%;background:#fff;border:3px solid var(--red);
}
.sim-slider small{display:block;font-size:9.2px;line-height:1.55;color:#72727d}
.sim-switch{display:grid;grid-template-columns:31px 1fr;gap:10px;align-items:center;margin-top:17px;padding:11px 11px;border:1px solid rgba(255,255,255,.11);background:rgba(255,255,255,.018);cursor:pointer}
.sim-switch input{appearance:none;width:29px;height:16px;border-radius:10px;background:#303039;position:relative;transition:.2s;cursor:pointer}
.sim-switch input::after{content:"";position:absolute;left:2px;top:2px;width:12px;height:12px;border-radius:50%;background:#888893;transition:.2s}
.sim-switch input:checked{background:rgba(225,6,0,.55)}
.sim-switch input:checked::after{left:15px;background:#fff;box-shadow:0 0 8px rgba(255,255,255,.45)}
.sim-switch b{display:block;font-size:10.5px;color:#d1d1d8;font-weight:600}
.sim-switch small{display:block;margin-top:2px;font-size:8.4px;line-height:1.4;color:#6f6f7a}
.sim-presets{display:flex;gap:6px;margin-top:15px}
.sim-presets button{flex:1;height:30px;border:1px solid rgba(255,255,255,.13);font-size:9.5px;color:#9999a4;transition:.2s}
.sim-presets button:hover,.sim-presets button.active{border-color:rgba(225,6,0,.55);color:#fff;background:rgba(225,6,0,.12)}
.sim-disclaimer{margin-top:15px;padding-top:11px;border-top:1px solid rgba(255,255,255,.08);font-size:8.4px;line-height:1.6;color:#5e5e69}
.sim-howto{margin-top:auto;padding:11px 12px;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.018)}
.sim-howto span{display:block;font-family:var(--tech);font-size:8px;letter-spacing:.12em;color:var(--red)}
.sim-howto p{margin-top:5px;font-size:9.1px;line-height:1.62;color:#858590}
.sim-visual{min-width:0}
.sim-readout{display:flex;align-items:flex-end;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:8px}
.sim-readout > span{font-family:var(--tech);font-size:8.5px;letter-spacing:.13em;color:#7d7d88;padding-bottom:5px}
.sim-readout > div{display:flex;align-items:baseline;gap:4px}
.sim-readout b{font-family:var(--tech);font-size:54px;line-height:.82;font-weight:600;letter-spacing:-.03em}
.sim-readout small{font-size:11px;color:var(--red)}
.sim-readout em{font-style:normal;font-size:9.5px;line-height:1.4;color:#c78380;border:1px solid rgba(225,6,0,.28);padding:3px 7px;background:rgba(225,6,0,.06)}
.sim-readout em[data-level="高"],#simRisk[data-level="高"]{color:#ff3a2b;border-color:rgba(255,58,43,.45);background:rgba(255,58,43,.09)}
.sim-readout em[data-level="中"],#simRisk[data-level="中"]{color:#ffb15c;border-color:rgba(255,177,92,.32);background:rgba(255,177,92,.06)}
.sim-readout em[data-level="低"],#simRisk[data-level="低"]{color:#7fd6bb;border-color:rgba(127,214,187,.32);background:rgba(127,214,187,.06)}
.sim-readout > div.risk-high b{color:#ff3a2b;text-shadow:0 0 22px rgba(255,58,43,.2)}
.sim-readout > div.risk-mid b{color:#f2f2f5}
.sim-readout > div.risk-low b{color:#7fd6bb}
.sim-chart-wrap{margin-top:10px;border:1px solid rgba(255,255,255,.09);background:linear-gradient(180deg,rgba(255,255,255,.026),rgba(255,255,255,.006));padding:9px 10px 1px}
.sim-chart{display:block;width:100%;height:238px}
.sim-grid path{stroke:rgba(255,255,255,.07);stroke-width:1}
.sim-soc-area{fill:url(#simFill)}
.sim-soc-line{fill:none;stroke:var(--red);stroke-width:2.5;filter:drop-shadow(0 0 5px rgba(225,6,0,.35))}
.sim-speed-line{fill:none;stroke:rgba(255,255,255,.9);stroke-width:1.6;stroke-dasharray:5 5}
.sim-lap-marker{stroke:rgba(225,6,0,.45);stroke-width:1;stroke-dasharray:3 4}
.sim-axis-label{fill:#c27d79;font-family:var(--tech);font-size:8px;letter-spacing:.08em}
.sim-x-labels text{fill:#5f5f6a;font-family:var(--tech);font-size:7.5px;letter-spacing:.05em}
.sim-legend{display:flex;gap:18px;align-items:center;margin-top:5px;font-size:8.5px;color:#81818c}
.sim-legend span{display:flex;align-items:center;gap:6px}
.sim-legend i{width:15px;height:2px;display:block}
.sim-legend i.soc{background:var(--red)}
.sim-legend i.speed{background:#e8e8ee;height:1px}
.sim-legend em{font-style:normal;margin-left:auto;color:#5d5d68;font-family:var(--tech);font-size:7.5px}
.sim-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}
.sim-stats > div{padding:8px 10px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.018)}
.sim-stats span{display:block;font-size:8.5px;color:#74747f}
.sim-stats b{display:block;margin-top:5px;font-family:var(--tech);font-size:24px;line-height:1;font-weight:600;color:#e2e2e7}
.sim-stats b small{font-size:9px;color:var(--red);margin-left:2px}
.sim-verdict{margin-top:10px;padding:10px 12px;border-left:2px solid var(--red);background:rgba(225,6,0,.055);font-size:10px;line-height:1.6;color:#aaaab5;min-height:50px}
.sim-foot{display:flex;justify-content:space-between;gap:12px;border-top:1px solid rgba(255,255,255,.09);margin-top:11px;padding-top:10px;font-family:var(--tech);font-size:8px;letter-spacing:.06em;color:#5c5c67}

/* --- document lightbox ----------------------------------------------------- */
.zoomable{cursor:zoom-in;position:relative;outline-offset:3px}
.zoom-hint{
  position:absolute;right:9px;bottom:8px;z-index:4;
  display:flex;align-items:center;gap:5px;height:23px;padding:0 7px;
  background:rgba(7,7,9,.78);border:1px solid rgba(255,255,255,.22);
  font-size:8.5px;letter-spacing:.04em;color:#e2e2e7;backdrop-filter:blur(6px);
  transition:.25s;
}
.zoom-hint b{font-size:13px;line-height:1;color:var(--red)}
.zoomable:hover .zoom-hint,.zoomable:focus-visible .zoom-hint{background:var(--red);border-color:var(--red);color:#fff}
.zoomable:hover .zoom-hint b,.zoomable:focus-visible .zoom-hint b{color:#fff}
.lightbox-modal{z-index:260}
.lightbox-panel{
  position:relative;width:min(1180px,95vw);height:min(760px,94vh);max-height:94vh;display:flex;flex-direction:column;
  background:#0b0b0f;border:1px solid rgba(255,255,255,.16);box-shadow:0 40px 120px rgba(0,0,0,.72);
  transform:translateY(18px);transition:.42s var(--ease);
}
.modal.open .lightbox-panel{transform:none}
.lightbox-head{display:flex;justify-content:space-between;align-items:flex-start;padding:19px 22px 13px;border-bottom:1px solid rgba(255,255,255,.1)}
.lightbox-head h2{margin-top:5px;font-size:19px;font-weight:600;line-height:1.35}
.lightbox-toolbar{display:flex;align-items:center;gap:7px;padding:9px 22px;border-bottom:1px solid rgba(255,255,255,.08)}
.lightbox-toolbar button{min-width:29px;height:26px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.14);font-family:var(--tech);font-size:13px;color:#b9b9c2;padding:0 8px}
.lightbox-toolbar button:hover{color:#fff;border-color:var(--red);background:rgba(225,6,0,.3)}
.lightbox-toolbar span{min-width:44px;text-align:center;font-family:var(--tech);font-size:9px;color:#7f7f8a}
.lightbox-stage{overflow:auto;background:#f3f5f8;padding:16px;flex:1;min-height:0;scrollbar-width:thin}
.lightbox-stage img{display:block;width:100%;height:auto;margin:0 auto;transition:width .22s ease;box-shadow:0 10px 40px rgba(0,0,0,.22)}
.lightbox-stage img.zoomed{cursor:grab}

/* --- slide 14 priority picker ---------------------------------------------- */
.priority-picker{margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,255,255,.1)}
.priority-picker > span{display:block;font-size:8.5px;letter-spacing:.09em;color:#777782}
.priority-picker > div{display:flex;gap:5px;margin-top:6px}
.priority-picker button{flex:1;height:25px;border:1px solid rgba(255,255,255,.12);font-size:9.5px;color:#9696a1;transition:.2s}
.priority-picker button:hover{border-color:rgba(225,6,0,.45);color:#fff}
.priority-picker button.active{background:var(--red);border-color:var(--red);color:#fff}
.priority-verdict{margin-top:7px;font-size:9px;line-height:1.5;color:#8d8d98;min-height:27px}
.trade-row{transition:background .3s,border-color .3s,transform .3s}
.trade-row.active{background:linear-gradient(90deg,rgba(225,6,0,.11),rgba(225,6,0,.015));border-color:rgba(225,6,0,.45);padding-left:12px;padding-right:10px}
.trade-row.active .trade-title span{color:#fff}
.trade-row.active .trade-title em{color:var(--red)}
.trade-row.active .tension-meter i{width:12px;height:12px;margin:-6px 0 0 -6px;background:var(--red);border-color:#fff}

/* --- sequential numbered items --------------------------------------------- */
.mode-tab.reveal{
  transition:
    opacity .68s ease,
    transform .84s var(--ease),
    background .3s var(--ease),
    border-color .3s var(--ease);
  transition-delay:var(--d,0s),var(--d,0s),0s,0s;
}

/* --- lines that grow / slide to their result ------------------------------- */
.power-line i{width:0;transition:width 1.05s var(--ease) .32s}
.slide.active .power-line i{width:var(--w)}

.tension-meter i{left:50%;transition:left 1.05s var(--ease) .35s,width .2s,height .2s,margin .2s}
.slide.active .tension-meter i{left:var(--pos)}

.corpus-bars i{width:0;transition:width 1.05s var(--ease) .3s}
.slide.active .corpus-bars i{width:var(--w)}

.gridline{transform:scaleX(0);transform-origin:left center;transition:transform .9s var(--ease) .25s}
.slide.active .gridline{transform:scaleX(1)}

.pt-connector i{
  background-image:linear-gradient(90deg,rgba(225,6,0,.15),var(--red),rgba(225,6,0,.15));
  background-repeat:no-repeat;background-position:left center;background-size:0 1px;
  transition:background-size .85s var(--ease) .35s;
}
.slide.active .pt-connector i{background-size:100% 1px}

.energy-link{
  background-color:transparent;
  background-image:linear-gradient(90deg,rgba(255,255,255,.17),rgba(255,255,255,.17));
  background-repeat:no-repeat;background-position:left center;background-size:0 1px;
  transition:background-size .85s var(--ease) .4s;
}
.slide.active .energy-link{background-size:100% 1px}

.reg-switch svg path{stroke-dasharray:80;stroke-dashoffset:80;transition:stroke-dashoffset .9s var(--ease) .35s}
.slide.active .reg-switch svg path{stroke-dashoffset:0}

.cover-kicker span{width:0;transition:width .8s var(--ease) .25s}
.cover.active .cover-kicker span{width:54px}
.cover-side-line{height:0;transition:height .9s var(--ease) .5s}
.cover.active .cover-side-line{height:96px}

.section-slide::after{height:0;transition:height 1.05s var(--ease) .28s}
.section-slide.active::after{height:590px}

.timeline-rule i{transition-timing-function:var(--ease);transition-duration:1.15s}
.timeline-rule i{box-shadow:0 0 8px rgba(225,6,0,.25)}

.sim-modal.open .sim-soc-line{animation:simDraw 1.05s var(--ease) .12s both}
@keyframes simDraw{from{stroke-dashoffset:900}to{stroke-dashoffset:0}}
.sim-modal .sim-soc-line{stroke-dasharray:900}

/* --- tilt cards ------------------------------------------------------------ */
.tilt-card{transform-style:preserve-3d;will-change:transform}

/* --- small screens HUD ----------------------------------------------------- */
@media (max-width:1100px){
  .timer-chip{display:none}
  .sim-layout{grid-template-columns:1fr;gap:15px}
  .sim-controls{border-right:0;border-bottom:1px solid rgba(255,255,255,.1);padding-right:0;padding-bottom:12px}
  .sim-chart{height:180px}
}
@media (prefers-reduced-motion:reduce){
  #fxCanvas,.fx-sweep,.race-intro{display:none!important}
}