/* MyDS marketing features page (S02, M2 T13b): sort scene, one-record panel with four lane modules, glovebox, finale.
   Ported from the frozen prototype F01-features; loaded after www.css (tokens, nav, footer, buttons live there). */
.row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
@keyframes nudge{to{transform:rotate(90deg) translateX(6px)}}

/* ===== 1. Sort scene: twelve jobs fall into four lanes (D-068) ===== */
.scene.sort{height:calc(var(--len,2.4)*100svh);background:radial-gradient(55% 38% at 14% 0%,rgb(201 162 74/.11),transparent),var(--bg)}
.sort .stage{position:sticky;top:0;height:100svh;overflow:hidden;display:flex;flex-direction:column;padding-top:clamp(84px,11vh,120px);padding-bottom:var(--space-5)}
.sort .stage>.wrap{flex:1;min-height:0;width:100%;display:flex;flex-direction:column}
.sort header{display:grid;gap:var(--space-4);margin-bottom:clamp(20px,4.5vh,48px)}
.sw{font:800 clamp(34px,6.1vw,104px)/var(--lh-display) var(--font-display);font-stretch:var(--display-stretch);letter-spacing:var(--track-display);max-width:15em;text-wrap:balance;display:grid}
.sw em{font-style:normal;color:var(--gold)}
.sw>span{grid-area:1/1;transition:opacity 420ms,transform 520ms var(--ease-drive),visibility 420ms}
.sw .before{opacity:0;visibility:hidden;transform:translateY(-.25em)}
.sw .after{opacity:1}
.js:not(.rm) .sort:not(.swapped) .sw .before{opacity:1;visibility:visible;transform:none}
.js:not(.rm) .sort:not(.swapped) .sw .after{opacity:0;visibility:hidden;transform:translateY(.25em)}
.lanes{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-content:start}
.lane{position:relative;padding-inline:clamp(10px,1.6vw,24px);container-type:inline-size}
.lane::before{content:"";position:absolute;inset-inline-start:0;top:0;bottom:-40px;width:2px;background:repeating-linear-gradient(180deg,var(--border-strong) 0 14px,transparent 14px 26px);transform-origin:top;transform:scaleY(var(--lane,1))}
.lane:first-child::before{background:var(--border-strong)}
.lane:last-child::after{content:"";position:absolute;inset-inline-end:0;top:0;bottom:-40px;width:2px;background:var(--border-strong);transform-origin:top;transform:scaleY(var(--lane,1))}
.lane-t{display:block;margin-bottom:var(--space-4);font:800 clamp(16px,14cqi,50px)/1 var(--font-display);font-stretch:var(--display-stretch);letter-spacing:var(--track-display);color:var(--text);text-decoration:none;transition:color 400ms}
.lane-t .L{display:flex;width:max-content;margin-bottom:12px;font:700 12px/1 var(--font-ui);letter-spacing:.1em;color:var(--gold-text);border:1px solid currentColor;border-radius:var(--radius-full);padding:5px 9px}
.lane-t .nm{display:flex;align-items:center;gap:.3em;padding-bottom:14px;border-bottom:1px solid var(--night-line)}
.lane-t .arr{width:.5em;height:.5em;flex:none;margin-inline-start:auto;transition:transform var(--dur-slow) var(--ease-drive),opacity 400ms}
[dir="rtl"] .lane-t .arr{transform:scaleX(-1)}
.lane-t:hover .arr{transform:translateX(5px)}[dir="rtl"] .lane-t:hover .arr{transform:scaleX(-1) translateX(5px)}
.lane-t:hover{color:var(--gold)}
.pre .lane-t{color:var(--text-muted)}
.pre .lane-t .arr{opacity:0}
.chips{display:grid;gap:clamp(10px,2.2vh,20px);justify-items:start}
.job{display:inline-flex;align-items:center;gap:10px;max-width:100%;min-height:clamp(50px,7.4vh,76px);padding:8px 16px 8px 12px;border-radius:var(--radius-md);background:linear-gradient(180deg,var(--surface-2),var(--surface-1));border:1px solid color-mix(in srgb,var(--gold) 38%,var(--night-line));box-shadow:inset 0 1px 0 rgb(255 255 255/.06),0 8px 18px -10px rgb(0 0 0/.7);color:var(--text);font-size:clamp(15px,1.3vw,19px);line-height:1.3;will-change:transform;transition:border-color 300ms,color 300ms,background-color 300ms}
[dir="rtl"] .job{padding:8px 12px 8px 16px}
.job .mk{width:clamp(24px,2vw,30px);height:clamp(24px,2vw,30px);flex:none;border-radius:50%;background:var(--gold);color:var(--on-gold);display:grid;place-items:center;border:2px solid transparent}
.job .mk svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.job .bad{display:none}
.job .t{display:grid}
.job .t>span{grid-area:1/1;transition:opacity 260ms}
.job .t .b{opacity:0;visibility:hidden}
.job.mess{border-style:dashed;border-color:var(--danger);color:var(--text-2)}
.job.mess .mk{background:transparent;border-color:var(--danger);color:var(--danger)}
.job.mess .ok{display:none}.job.mess .bad{display:block}
.job.mess .t .b{opacity:1;visibility:visible}
.job.mess .t .a{opacity:0;visibility:hidden}
.hint{margin-top:auto;padding-top:var(--space-4);display:grid;justify-items:center;color:var(--text-muted);font-size:14px}
.hint>span{grid-area:1/1;display:flex;align-items:center;gap:10px;transition:opacity 400ms}
.hint svg{width:16px;height:16px;transform:rotate(90deg);animation:nudge 1.6s var(--ease-shift) infinite alternate}
.hint .h-a{opacity:0;visibility:hidden}
.pre .hint .h-a{opacity:1;visibility:visible}.pre .hint .h-b{opacity:0;visibility:hidden}
html:not(.js) .scene.sort,.rm .scene.sort,.scene.sort.flow{height:auto}
html:not(.js) .sort .stage,.rm .sort .stage,.sort.flow .stage{position:static;height:auto;overflow:visible;padding-bottom:var(--space-8)}
.sort.flow .hint{margin-top:var(--space-7)}.rm .hint svg{animation:none}
@media (max-width:900px){.lanes{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:var(--space-6)}.lane:nth-child(2)::after{content:"";position:absolute;inset-inline-end:0;top:0;bottom:-40px;width:2px;background:var(--border-strong);transform-origin:top;transform:scaleY(var(--lane,1))}.lane:nth-child(3)::before{background:var(--border-strong)}.lane:nth-child(4)::before{background:repeating-linear-gradient(180deg,var(--border-strong) 0 14px,transparent 14px 26px)}}
@media (max-width:520px){.job{font-size:13px;padding:8px 10px 8px 8px;gap:8px}.job .mk{width:20px;height:20px}.job .mk svg{width:11px;height:11px}.chips{gap:8px}.lane{padding-inline:10px}.lane-t .L{font-size:11px;padding:4px 7px;margin-bottom:8px}.lane-t .nm{padding-bottom:10px}.sw{font-size:clamp(30px,9vw,44px)}}

/* ===== 2. One record: pick an event, one record entry, four lane modules ===== */
.dash{padding-block:var(--section)}
.dash .sec-h{max-width:980px}
.stepl{display:flex;align-items:center;gap:10px;margin-bottom:var(--space-3);font:600 14px/1.3 var(--font-ui);color:var(--text-2)}
.stepl .n{width:26px;height:26px;flex:none;border-radius:50%;display:grid;place-items:center;border:1px solid var(--gold-text);color:var(--gold-text);font:700 12px/1 var(--font-ui)}
.evs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:var(--space-7)}
.ev{display:flex;align-items:center;gap:12px;min-height:76px;padding:12px 16px 12px 12px;border-radius:var(--radius-md);border:1px solid var(--border-strong);background:var(--surface-1);color:var(--text);text-align:start;cursor:pointer;transition:background-color var(--dur-base),border-color var(--dur-base),transform var(--dur-slow) var(--ease-drive),box-shadow var(--dur-slow)}
[dir="rtl"] .ev{padding:12px 12px 12px 16px}
.ev .ib{width:42px;height:42px;flex:none;border-radius:11px;display:grid;place-items:center;background:var(--surface-2);transition:background-color var(--dur-base)}
.ev .ib svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ev .t{display:grid;gap:3px;min-width:0}
.ev .t b{font:600 16px/1.2 var(--font-ui)}
.ev .t i{font:400 13px/1.3 var(--font-ui);font-style:normal;color:var(--text-muted)}
.ev:hover{border-color:var(--text);transform:translateY(-2px);box-shadow:var(--e2)}
.ev[aria-pressed="true"]{background:var(--gold);border-color:var(--gold);color:var(--on-gold);box-shadow:0 10px 24px -12px rgb(201 162 74/.9)}
.ev[aria-pressed="true"] .ib{background:rgb(20 20 20/.12)}
.ev[aria-pressed="true"] .t i{color:rgb(20 20 20/.74)}
.cluster{position:relative;display:grid;gap:var(--space-5);border-radius:clamp(20px,3vw,36px);padding:clamp(18px,3.2vw,48px);border:1px solid var(--night-line);box-shadow:inset 0 1px 0 rgb(255 255 255/.06),var(--e3);background:radial-gradient(90% 60% at 50% 0%,#1f1f24,#0b0b0d 75%)}
.cluster::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(40% 30% at 50% 0%,rgb(201 162 74/.10),transparent)}
.cluster .top{display:flex;justify-content:space-between;align-items:center;gap:12px;font:600 12px/1 var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}
[dir="rtl"] .cluster .top{letter-spacing:0;font-size:13px}
.cluster .stepl{margin:0;color:var(--text-2)}
/* the one record entry */
.rec{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:var(--space-5) var(--space-6);padding:clamp(14px,2vw,22px) clamp(16px,2.4vw,28px);border-radius:var(--radius-md);border:1px solid var(--night-line);background:linear-gradient(180deg,#1d1d22,#141417);box-shadow:inset 0 1px 0 rgb(255 255 255/.05)}
.rec .who{display:flex;align-items:center;gap:14px;min-width:0}
.av{width:54px;height:54px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--gold);color:var(--on-gold);font:800 19px/1 var(--font-display);box-shadow:0 0 0 4px rgb(201 162 74/.18)}
.rec .nm{font:700 clamp(18px,1.7vw,23px)/1.2 var(--font-display);font-stretch:var(--display-stretch);letter-spacing:var(--track-display)}
.rec .rmeta{margin-top:3px;font-size:14px;color:var(--text-muted)}
.rec .wr{padding-inline:var(--space-6);border-inline:1px solid var(--night-line);display:grid;gap:6px;min-width:0}
.rec .wl{font:600 11px/1 var(--font-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-text)}
[dir="rtl"] .rec .wl{letter-spacing:0;font-size:13px;text-transform:none}
.rec .lg{display:flex;align-items:center;gap:10px;font:500 clamp(16px,1.5vw,20px)/1.35 var(--font-ui);color:var(--text)}
.rec .dot{width:10px;height:10px;flex:none;border-radius:50%;background:var(--gold);box-shadow:0 0 12px var(--gold-glow)}
.fire .rec .dot{animation:ping 900ms var(--ease-drive)}
@keyframes ping{0%{box-shadow:0 0 0 0 rgb(201 162 74/.7)}100%{box-shadow:0 0 0 16px rgb(201 162 74/0)}}
.sc{display:flex;gap:var(--space-5)}
.sc>div{display:grid;gap:3px;justify-items:center;text-align:center;min-width:76px;max-width:110px}
.sc b{font:800 clamp(28px,2.8vw,40px)/1 var(--font-display);font-stretch:var(--display-stretch);color:var(--text);font-variant-numeric:tabular-nums}
.sc .my b{color:var(--gold)}
.sc span{font-size:12px;line-height:1.3;color:var(--text-muted)}
/* four lane modules: a dial on top, a perforation, then what MyDS did */
.gauges4{position:relative;--gap:clamp(10px,1.6vw,22px);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap);margin-top:24px}
.gauges4::before{content:"";position:absolute;top:-24px;inset-inline:calc((100% - 3 * var(--gap)) / 8);height:2px;background:linear-gradient(90deg,transparent,var(--gold),transparent) -60% 0/40% 100% no-repeat,var(--night-line)}
.fire .gauges4::before{animation:rail 900ms var(--ease-shift)}
@keyframes rail{from{background-position:-60% 0,0 0}to{background-position:160% 0,0 0}}
.mod{position:relative;display:flex;flex-direction:column;transition:filter 500ms}
.mod.hot{filter:drop-shadow(0 12px 24px rgb(201 162 74/.14))}
.mod::before{content:"";position:absolute;top:-24px;inset-inline-start:50%;width:2px;height:24px;margin-inline-start:-1px;background:var(--night-line);transition:background-color 300ms calc(var(--m) * 90ms),box-shadow 300ms calc(var(--m) * 90ms)}
.mod.hot::before{background:var(--gold);box-shadow:0 0 10px var(--gold-glow)}
.mtop,.mbot{border:1px solid var(--night-line);background:linear-gradient(180deg,#1a1a1e,#111114);transition:border-color 400ms}
.mod.hot :is(.mtop,.mbot){border-color:rgb(201 162 74/.5)}
.mtop{display:grid;justify-items:center;align-content:start;gap:6px;padding:16px 14px 18px;border-bottom:0;border-radius:18px 18px 0 0;-webkit-mask:radial-gradient(circle 9px at 0 100%,#0000 97%,#000),radial-gradient(circle 9px at 100% 100%,#0000 97%,#000);-webkit-mask-composite:source-in;mask:radial-gradient(circle 9px at 0 100%,#0000 97%,#000),radial-gradient(circle 9px at 100% 100%,#0000 97%,#000);mask-composite:intersect}
.mbot{position:relative;flex:1;display:grid;align-content:start;gap:14px;padding:20px 16px 18px;border-top:0;border-radius:0 0 18px 18px;-webkit-mask:radial-gradient(circle 9px at 0 0,#0000 97%,#000),radial-gradient(circle 9px at 100% 0,#0000 97%,#000);-webkit-mask-composite:source-in;mask:radial-gradient(circle 9px at 0 0,#0000 97%,#000),radial-gradient(circle 9px at 100% 0,#0000 97%,#000);mask-composite:intersect}
.mbot::before{content:"";position:absolute;top:0;inset-inline:18px;border-top:2px dashed var(--night-line);transition:border-color 400ms}
.mod.hot .mbot::before{border-color:rgb(201 162 74/.4)}
.mtop header{display:flex;align-items:center;gap:10px;width:100%}
.mtop header b{font:700 12px/1 var(--font-ui);letter-spacing:.1em;color:var(--gold-text);border:1px solid currentColor;border-radius:var(--radius-full);padding:5px 8px}
.mtop h3{font:800 clamp(18px,1.8vw,26px)/1 var(--font-display);font-stretch:var(--display-stretch);letter-spacing:var(--track-display)}
.mod svg.dial{width:min(100%,190px);height:auto;overflow:visible;margin-top:4px}
.mod .fa{fill:none;stroke:#6A6A72;stroke-width:8;stroke-linecap:round;stroke-dasharray:var(--v) 1;transition:stroke-dasharray 900ms var(--ease-snap),stroke 300ms}
.mod .nd{transform:rotate(calc(-90deg + var(--v)*180deg));transform-origin:100px 104px;transition:transform 900ms var(--ease-snap)}
.mod .nd line{stroke:#C6C3BA;stroke-width:4;stroke-linecap:round;transition:stroke 300ms}
.mod .nd circle{fill:#C6C3BA;transition:fill 300ms}
.mod.hot .fa{stroke:var(--gold);filter:drop-shadow(0 0 8px var(--gold-glow))}
.mod.hot .nd line{stroke:var(--gold)}.mod.hot .nd circle{fill:var(--gold)}
.mod .big{margin-top:-2px;font:800 clamp(24px,2.4vw,34px)/1.1 var(--font-display);font-stretch:var(--display-stretch);letter-spacing:var(--track-display);text-align:center;color:var(--text-muted);font-variant-numeric:tabular-nums}
.mod.hot .big{color:var(--text)}
.mod .cap{min-height:2.7em;font-size:13px;line-height:1.35;color:var(--text-muted);text-align:center;text-wrap:balance}
.tag{display:inline-flex;align-items:center;gap:7px;width:max-content;max-width:100%;font:600 12px/1.2 var(--font-ui);padding:6px 11px;border-radius:var(--radius-full)}
.tag::before{content:"";width:7px;height:7px;flex:none;border-radius:50%;background:currentColor}
.tag.done{background:rgb(82 196 141/.14);color:#52C48D}
.tag.wait{background:rgb(201 162 74/.16);color:var(--gold-text)}
.tag.none{background:rgb(255 255 255/.06);color:var(--text-muted)}
.st{display:grid;gap:12px}
.st li{display:grid;grid-template-columns:20px minmax(0,1fr);gap:10px;font-size:14.5px;line-height:1.45;color:var(--text-2);animation:stepin 420ms var(--ease-drive) both;animation-delay:calc(var(--m) * 90ms + var(--k) * 70ms)}
@keyframes stepin{from{opacity:0;transform:translateY(8px)}}
.st svg{width:18px;height:18px;margin-top:1px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.st .d svg{color:#52C48D}.st .w svg{color:var(--gold-text)}.st .n svg{color:var(--text-muted)}
.st .n{color:var(--text-muted)}
@media (max-width:1100px){.rec{grid-template-columns:minmax(0,1fr) auto}.rec .wr{grid-column:1/-1;grid-row:2;padding:var(--space-4) 0 0;border-inline:0;border-top:1px solid var(--night-line)}}
@media (max-width:900px){.evs{grid-template-columns:repeat(2,minmax(0,1fr))}.gauges4{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:0}.gauges4::before,.mod::before{display:none}}
@media (max-width:620px){.gauges4{grid-template-columns:1fr}.rec{grid-template-columns:1fr}.sc{justify-content:space-between}.sc>div{min-width:0;flex:1}}
@media (max-width:520px){.evs{grid-template-columns:1fr}.cluster .top{letter-spacing:.06em;font-size:11px}}

/* ===== 3. Glovebox: the smaller things ===== */
.glove-s{padding-block:0 var(--section)}
.glove{position:relative;perspective:1600px}
.gb{position:relative;border-radius:clamp(20px,2.6vw,36px);padding:clamp(24px,4.4vw,72px);border:1px solid var(--night-line);box-shadow:inset 0 24px 48px rgb(0 0 0/.55),var(--e3);background:radial-gradient(70% 38% at 50% 0,rgb(201 162 74/.11),transparent 70%),linear-gradient(180deg,#0d0d0f,#17171b)}
.gb-cols{display:grid}
.gb-cols>div{padding-block:clamp(26px,2.8vw,42px);border-top:1px solid var(--night-line)}
.gb-cols>div:first-child{padding-top:0;border-top:0}
.gb-cols>div:last-child{padding-bottom:0}
.gb h3{display:flex;align-items:center;gap:clamp(14px,1.6vw,22px);margin-bottom:clamp(20px,2vw,28px);font:800 clamp(30px,3.6vw,52px)/1 var(--font-display);font-stretch:var(--display-stretch);letter-spacing:var(--track-display);color:var(--text)}
.gb h3 b{flex:none;display:grid;place-items:center;width:clamp(40px,3.6vw,52px);aspect-ratio:1;font:700 clamp(15px,1.4vw,19px)/1 var(--font-ui);letter-spacing:0;color:var(--gold-text);border:1px solid rgb(201 162 74/.6);border-radius:50%;background:rgb(201 162 74/.12)}
.gb h3::after{content:"";flex:1;height:1px;background:linear-gradient(to right,rgb(201 162 74/.55),var(--night-line) 70%);transform-origin:0 50%}
[dir="rtl"] .gb h3::after{background:linear-gradient(to left,rgb(201 162 74/.55),var(--night-line) 70%);transform-origin:100% 50%}
.gb ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.gb li{display:grid;align-content:start;gap:18px;padding-inline:clamp(20px,2.8vw,44px)}
.gb li:first-child{padding-inline-start:0}.gb li:last-child{padding-inline-end:0}
.gb li+li{border-inline-start:1px solid var(--night-line)}
.gb .ib{width:clamp(52px,4.4vw,64px);aspect-ratio:1;border-radius:16px;display:grid;place-items:center;background:rgb(201 162 74/.12);color:var(--gold-text);border:1px solid rgb(201 162 74/.28);transition:background-color var(--dur-base),color var(--dur-base),transform var(--dur-slow) var(--ease-drive)}
.gb .ib svg{width:55%;height:55%;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.gb li:hover .ib{background:var(--gold);color:var(--on-gold);transform:translateY(-3px)}
.gb li b{display:block;margin-bottom:8px;font:600 clamp(19px,1.55vw,23px)/1.25 var(--font-ui);color:var(--text);text-wrap:balance}
.gb li div span{display:block;max-width:34ch;font-size:clamp(16px,1.2vw,18px);line-height:1.6;color:var(--text-2);text-wrap:pretty}
.js:not(.rm) .glove.open .gb-cols>div{animation:gbin 700ms var(--ease-drive) both;animation-delay:calc(var(--i,0)*130ms + 260ms)}
.js:not(.rm) .glove.open .gb h3::after{animation:gbline 900ms var(--ease-drive) both;animation-delay:calc(var(--i,0)*130ms + 360ms)}
.gb-cols>div:nth-child(2){--i:1}.gb-cols>div:nth-child(3){--i:2}.gb-cols>div:nth-child(4){--i:3}
@keyframes gbin{from{opacity:0;transform:translateY(22px)}}
@keyframes gbline{from{transform:scaleX(0)}}
.gb-foot{display:flex;justify-content:flex-end;margin-top:var(--space-5)}
.lid{position:absolute;inset:0;z-index:3;display:grid;place-content:center;justify-items:center;gap:20px;text-align:center;border-radius:clamp(18px,2.4vw,30px);padding:var(--space-5);background:linear-gradient(180deg,#2d2d33,#19191d);border:1px solid #3a3a42;box-shadow:inset 0 1px 0 rgb(255 255 255/.08),0 24px 50px rgb(0 0 0/.35);transform-origin:50% 100%;color:#F4F2EC;transition:transform 1000ms var(--ease-snap),opacity 500ms 400ms,visibility 0s 1000ms}
.lid::before{content:"";position:absolute;top:20px;inset-inline-start:calc(50% - 44px);width:88px;height:8px;border-radius:4px;background:var(--gold);box-shadow:0 0 14px var(--gold-glow)}
.lid .big{font:800 clamp(28px,4.6vw,64px)/1 var(--font-display);font-stretch:var(--display-stretch);letter-spacing:var(--track-display)}
.lid p{color:var(--text-muted)}.lid .big{color:#F4F2EC}
.glove.open .lid{transform:rotateX(-100deg);opacity:0;visibility:hidden;pointer-events:none}
.js .glove:not(.open) .gb-body{visibility:hidden}
.js:not(.rm) .glove:not(.open) .gb{max-height:clamp(260px,40vw,360px);overflow:hidden}
.js:not(.rm) .glove.open .gb{max-height:3200px;transition:max-height 900ms var(--ease-drive)}
.glove:not(.open) .gbc{visibility:hidden}
html:not(.js) .lid,html:not(.js) .gbc,.rm .lid,.rm .gbc{display:none}
@media (max-width:900px){.gb ul{grid-template-columns:1fr;gap:0}.gb li{grid-template-columns:auto minmax(0,1fr);align-items:start;gap:18px;padding:22px 0}.gb li:first-child{padding-top:0}.gb li:last-child{padding-bottom:0}.gb li+li{border-inline-start:0;border-top:1px solid var(--night-line)}.gb li:last-child,.gb li:first-child{padding-inline:0}}

/* ===== 4. Finale: four lanes merge into one road ===== */
.finale{position:relative;min-height:88svh;display:grid;place-items:center;text-align:center;overflow:hidden;padding-block:var(--section) clamp(160px,28vw,320px)}
.finale .inner{position:relative;z-index:1;display:grid;justify-items:center;gap:var(--space-5);padding-inline:var(--margin);width:100%;max-width:var(--max)}
.finale .mega{width:100%}
.finale .lead{margin-inline:auto}
.merge{position:absolute;inset:auto 0 0 0;height:min(46%,360px);width:100%}
.merge{transform-origin:50% 100%}
.merge path{fill:none;vector-effect:non-scaling-stroke;stroke-linecap:round}
.merge .l{stroke:var(--border-strong);stroke-width:2}
.merge .g{stroke:var(--gold);stroke-width:5;filter:drop-shadow(0 0 8px var(--gold-glow))}
.js:not(.rm) .finale:not(.in) .merge{opacity:0;transform:scaleY(.2)}
.js:not(.rm) .finale:not(.in) .merge .g{opacity:0}
.finale.in .merge{transition:opacity 600ms,transform 900ms var(--ease-drive)}
.finale.in .merge .g{transition:opacity 500ms 700ms}
.js:not(.rm) .finale .rv{opacity:0;transform:translateY(16px)}
.js:not(.rm) .finale.in .rv{opacity:1;transform:none;transition:opacity var(--dur-reveal) var(--ease-drive),transform var(--dur-reveal) var(--ease-drive)}
.js:not(.rm) .finale.in .rv:nth-child(2){transition-delay:80ms}.js:not(.rm) .finale.in .rv:nth-child(3){transition-delay:160ms}
.rm .finale .rv{opacity:1!important;transform:none!important}

/* values the prototype set inline */
.finale .row{justify-content:center}
.mod:nth-child(1){--m:0;--v:.55}.mod:nth-child(2){--m:1;--v:.4}.mod:nth-child(3){--m:2;--v:.75}.mod:nth-child(4){--m:3;--v:.08}
.st li:nth-child(1){--k:0}.st li:nth-child(2){--k:1}.st li:nth-child(3){--k:2}

/* ===== Reduced motion: static final states (the script adds .rm for the same device setting) ===== */
@media (prefers-reduced-motion:reduce){
  .st li,.hint svg,.fire .rec .dot,.fire .gauges4::before,.glove .gb-cols>div,.glove .gb h3::after{animation:none!important}
  .lid,.mod,.mod .fa,.mod .nd,.mtop,.mbot,.sw>span,.job,.ev,.finale .merge,.finale .merge .g,.finale .rv{transition:none!important}
}