/* Round 5. Existing fonts and colours, one sampled stage-ground token. */
.hook-stage,.hook-stage::before,.hook-mount,.hook-mount canvas,.hook-mount .object-still{background:var(--stage-ground)}
.section-five{min-width:0;scroll-margin-top:112px}
.section-five [hidden],.collection-piece[hidden],.phone-action[hidden],#site-chain[hidden]{display:none}
.section-five h2{font-family:var(--font-display)}
.section-five fieldset{min-width:0;border:0;padding:0;margin:0}
.section-five legend{text-transform:capitalize;font:500 14px/1.5 var(--font-body);margin-bottom:12px}
.line-band{width:100%;padding:80px max(16px,calc((100vw - 1800px)/2));margin-top:64px;background:var(--tint)}
.line-row{display:grid;grid-template-columns:minmax(0,1fr) 160px;gap:24px;align-items:center;max-width:1600px;margin:auto}
.line-row p{font:700 clamp(32px,5.4vw,88px)/1.06 var(--font-display);letter-spacing:-.035em;margin:0}
.line-row+.line-row{margin-top:32px}.line-row em{font-style:normal;color:var(--accent-deep)}
.line-coin{position:relative;width:100%;aspect-ratio:1}.line-coin .snag-lottie{inset:0;width:100%;height:100%;max-width:none}
.line-row .piece-card{width:100%}
#linePiece{position:relative;min-height:88px}#linePiece .piece-card.is-flipped{position:absolute;right:0;top:0;width:min(280px,calc(100vw - 32px));min-height:360px;z-index:5}
.collection-tools{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-block:24px}
.collection-tools label{margin:0}.collection-tools select{min-height:44px;max-width:100%;border:1px solid var(--line);border-radius:12px;background:var(--card);font:inherit;color:var(--ink);padding:8px 32px 8px 12px}
.collection-tools output{margin-right:auto;font-variant-numeric:tabular-nums}
.collection-filters{display:grid;gap:20px;margin-bottom:32px}
.filter-chips{display:flex;flex-wrap:wrap;gap:8px}
.filter-chip{border:1px solid var(--line);border-radius:24px;padding:8px 16px;min-height:44px;background:transparent;color:var(--ink);font:400 14px/1.4 var(--font-body);max-width:100%;overflow-wrap:anywhere;cursor:pointer}
.filter-chip[aria-pressed=true],.segments button[aria-pressed=true]{background:var(--glow);border-color:var(--glow)}
.filter-chip:hover,.segments button:hover{outline:1px solid var(--accent-deep);outline-offset:2px}
.collection-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:24px 16px;align-items:start}
.collection-piece{min-width:0;transition:opacity 240ms var(--ease);border-radius:24px}
.collection-piece>.piece-card{width:100%}.collection-piece>p{font-size:13px;margin:12px 0 0;display:flex;justify-content:space-between;gap:8px;padding-inline:8px}.collection-piece>p span{color:var(--ink-soft)}
.collection-piece.rank-match{outline:2px solid var(--accent-deep);outline-offset:6px}.collection-piece.rank-muted{opacity:.35}
.collection-empty{padding:48px 0;border-block:1px solid var(--line);font-size:20px;max-width:60ch}
.build-bench{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);gap:64px;align-items:start}
.build-object{display:grid;justify-items:center;gap:24px}.build-card{width:min(100%,340px)}
.build-card .piece-body{transform-origin:50px 75px}.build-card .piece-pane{transform-origin:center}
.build-maths{width:100%;max-width:42ch;text-align:center}.build-maths>strong{display:block;font:700 clamp(36px,4vw,64px)/1.1 var(--font-display);letter-spacing:-.04em}.build-maths .tag{margin-block:16px}.build-maths p{font-size:15px;line-height:1.6}
.build-controls{display:grid;gap:32px}.segments{display:flex;flex-wrap:wrap;gap:8px}.segments button{display:grid;gap:4px;flex:1 1 116px;min-height:64px;border:1px solid var(--line);border-radius:12px;padding:12px;background:transparent;color:var(--ink);font:400 14px/1.3 var(--font-body);text-align:left;cursor:pointer}.segments small{font:400 12px/1.5 var(--font-body)}
.build-shortcuts{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.rank-bar{display:flex;min-height:48px;gap:4px;width:100%;border-radius:12px;overflow:hidden}
.rank-segment{flex-basis:0;min-width:0;border:0;min-height:48px;cursor:pointer}.rank-0{background:var(--glow)}.rank-1{background:var(--accent)}.rank-2{background:var(--accent-deep)}.rank-3{background:var(--ink)}
.rank-segment:focus-visible{outline:3px solid var(--card);outline-offset:-5px}
.rank-labels{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:20px}.rank-labels>button{display:grid;gap:8px;align-content:start;background:transparent;border:0;padding:4px 0;min-height:44px;color:var(--ink);text-align:left;font-family:var(--font-body);cursor:pointer}.rank-labels span{font-size:13px}.rank-labels strong{font:500 22px/1.2 var(--font-display);font-variant-numeric:tabular-nums}
.chain-pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,.8fr) minmax(0,1fr);align-items:center;gap:48px}.chain-pair figure{margin:0;min-width:0}.chain-pair figcaption{margin-top:16px;text-align:center;font-size:14px}.chain-pair svg{display:block;width:100%}.chain-traits{margin:0}.chain-traits>div{padding:16px 0;border-bottom:1px solid var(--line);display:grid;gap:4px}.chain-traits dt{font-size:13px;text-transform:capitalize;color:var(--ink-soft)}.chain-traits dd{margin:0;font-size:15px}.is-in .chain-traits>div{animation:trait-light 700ms var(--ease) var(--row-delay) both}
@keyframes trait-light{from{color:var(--accent-deep);opacity:.35;transform:translateY(8px)}to{color:var(--ink);opacity:1;transform:translateY(0)}}
.check-layout{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:64px;align-items:start}.check-form{min-width:0}.hash-row{display:flex;gap:8px}.hash-row input{width:100%;min-width:0;height:48px;border:1px solid var(--line);border-radius:12px;background:var(--card);padding:12px;font:14px/1.4 var(--font-mono);color:var(--ink)}.check-form>label{display:block;margin-bottom:12px}.check-form>.btn{margin-top:20px}.check-result{min-width:0;padding:24px 0;border-block:1px solid var(--line)}.check-result dl>div{display:grid;gap:8px;margin-block:16px}.check-result dt{font-size:13px;color:var(--ink-soft)}.check-result dd{margin:0;overflow-wrap:anywhere}.check-result p{line-height:1.6}#checkBuyButton[aria-busy=true]{opacity:.65;cursor:progress}
.runtime-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}.runtime-card{min-width:0;display:flex;flex-direction:column;gap:32px;justify-content:space-between;background:var(--card);border-radius:24px;padding:24px;text-decoration:none;color:var(--ink);font:500 17px/1.4 var(--font-body);transform:perspective(700px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform 180ms var(--ease)}.runtime-card svg{width:48px;height:48px;fill:none;stroke:var(--accent-deep);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.runtime-card [data-draw]{stroke-dasharray:180;stroke-dashoffset:180}.is-in .runtime-card [data-draw]{animation:runtime-draw 700ms var(--ease) calc(var(--fact-index)*70ms) both}.runtime-status{margin-top:24px;color:var(--ink-soft);font-size:14px}
@keyframes runtime-draw{to{stroke-dashoffset:0}}
.question-item{border-top:1px solid var(--line)}.question-item summary{min-height:56px;padding:20px 0;font:500 20px/1.4 var(--font-display);cursor:pointer}.question-item p{padding:0 0 24px;max-width:68ch}.questions-link{margin-top:24px}
.closing-band{display:grid;grid-template-columns:180px minmax(0,1fr);gap:48px;align-items:center;background:var(--tint);padding:64px 32px;margin-top:96px;width:100%}.closing-hook{position:relative;aspect-ratio:1}.closing-hook>svg{width:100%;height:100%;fill:none;stroke:var(--card);stroke-width:9;stroke-linecap:round}.closing-hook .snag-lottie{inset:0;max-width:none;width:100%;height:100%}.closing-hook:has(.snag-lottie svg path)>svg{opacity:0}.closing-band h2{font:700 clamp(36px,5vw,80px)/1.04 var(--font-display);letter-spacing:-.035em;max-width:18ch}.closing-band .hero-actions{margin-top:32px}.closing-band .publication-note{margin-top:24px}
.site-foot.full-footer{display:grid;grid-template-columns:1.6fr repeat(3,minmax(0,1fr));gap:48px;padding-top:64px;margin-top:0}.footer-brand .nav-wordmark{display:inline-flex}.footer-brand p{margin-top:16px;max-width:24ch}.footer-links h2{font:500 15px/1.5 var(--font-body);margin:0 0 12px}.footer-links a{display:flex;align-items:center;min-height:44px;color:var(--ink-soft);text-decoration:none;font-size:14px}.footer-links a:hover{color:var(--accent-deep)}.footer-bottom{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:16px 32px;align-items:center;border-top:1px solid var(--line);padding-top:24px}.footer-bottom .back-top{margin-left:auto;min-height:44px;display:flex;align-items:center;color:var(--ink)}
.phone-action{display:none}.nav-links{display:flex;overflow-x:auto;overflow-y:hidden;flex-wrap:nowrap;scrollbar-width:none;min-width:0}.nav-links::-webkit-scrollbar{display:none}.nav-links a{flex:0 0 auto;width:auto;padding-inline:14px;white-space:nowrap}.nav-indicator{width:var(--chip-width,68px);left:0;transform:translateX(var(--chip-left,0px))}.nav-links a[aria-current=location]{color:var(--ink)}
.page-progress{position:absolute;bottom:-5px;left:16px;right:16px;height:2px;overflow:hidden;pointer-events:none}.page-progress span{display:block;height:100%;background:var(--glow);transform:scaleX(0);transform-origin:left}
.section-five.is-offscreen *,.section-five.is-offscreen *::before,.section-five.is-offscreen *::after,.motion-paused .section-five *,.motion-paused .section-five *::before,.motion-paused .section-five *::after{animation-play-state:paused!important}
@media(min-width:1440px){.section-five{--section-gap:64px}.line-band{padding-inline:64px}.line-row{grid-template-columns:minmax(0,1fr) 220px}.build-bench,.chain-pair,.check-layout{gap:64px}.runtime-card{padding:32px}.closing-band{padding:80px max(64px,calc((100vw - 1600px)/2))}.site-foot.full-footer{gap:64px}.nav-links{flex:1 1 600px}.phone-action{display:none}.collection-grid{gap:32px 24px}.rank-labels{gap:24px}.question-item summary{padding-block:24px}}
@media(min-width:1024px) and (max-width:1439px){.section-five{--section-gap:40px}.line-band{padding-inline:32px}.line-row{grid-template-columns:minmax(0,1fr) 168px}.build-bench,.chain-pair,.check-layout{gap:32px}.runtime-card{padding:20px;font-size:15px}.site-foot.full-footer{gap:32px}.closing-band{gap:32px}.nav-links{flex:1 1 480px}.phone-action{display:none}.collection-grid{gap:24px 16px}.rank-labels{gap:16px}.question-item summary{font-size:20px}}
@media(max-width:1023px){.build-bench{grid-template-columns:minmax(0,1fr);gap:40px}.build-object{grid-row:1}.chain-pair{gap:24px}.runtime-row{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;padding:8px 2px 24px}.runtime-card{flex:0 0 220px;scroll-snap-align:start;min-height:216px}.nav-bar{gap:12px}.nav-links{flex:1 1 280px}.check-layout{gap:32px}}
@media(max-width:768px){.section-five{--section-gap:32px;scroll-margin-top:96px}.line-band{padding:48px 16px}.line-row{grid-template-columns:minmax(0,1fr) 104px;gap:16px}.line-row p{font-size:clamp(30px,5.5vw,42px)}.collection-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 12px}.collection-filters{gap:16px}.collection-tools{gap:12px}.collection-piece .piece-back{padding:12px;font-size:12px}.collection-piece .piece-back dl>div{display:block}.collection-piece .piece-back dd{text-align:left}.collection-piece .piece-back .piece-name{font-size:13px}.collection-piece .piece-card.is-flipped{min-height:380px}.build-bench{grid-template-columns:minmax(0,1fr);gap:32px}.build-card{width:min(100%,280px)}.rank-labels{gap:8px}.rank-labels strong{font-size:18px}.rank-labels span{font-size:12px}.chain-pair{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.chain-traits{grid-column:1/-1;grid-row:2;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px}.check-layout{grid-template-columns:minmax(0,1fr);gap:24px}.runtime-card{flex-basis:216px}.question-item summary{font-size:18px}.closing-band{grid-template-columns:80px minmax(0,1fr);gap:16px;padding:48px 16px}.closing-band h2{font-size:36px}.closing-band .hero-actions{flex-wrap:wrap}.site-foot.full-footer{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 12px;padding-bottom:calc(184px + env(safe-area-inset-bottom))}.footer-brand{grid-column:1/-1}.footer-bottom{display:grid;gap:16px}.footer-bottom .back-top{margin-left:0}.nav-links{display:flex;position:fixed;inset:auto 16px 16px;flex-wrap:nowrap;padding:8px 8px calc(8px + env(safe-area-inset-bottom));gap:0}.nav-links a{font-size:14px;min-width:52px;padding-inline:12px}.nav-indicator{top:8px}.phone-action{position:fixed;z-index:39;inset:auto 16px calc(84px + env(safe-area-inset-bottom));display:flex;align-items:center;gap:12px;min-height:60px;background:var(--ground);border:1px solid var(--line);border-radius:18px;padding:8px 12px;box-shadow:0 4px 16px var(--hairline)}.phone-action #phonePiece{width:36px;flex:0 0 36px;pointer-events:none}.phone-action .piece-rank,.phone-action .piece-back{display:none}.phone-action p{font-size:13px;margin:0;margin-right:auto;font-variant-numeric:tabular-nums}.phone-action .btn{font-size:13px;min-height:44px;padding-inline:12px}.phone-action .piece-card{min-height:0}.page-progress{bottom:-4px;left:12px;right:12px}}
@media(max-width:390px){.section-five{--section-gap:24px}.line-row{grid-template-columns:minmax(0,1fr) 80px;gap:12px}.line-row p{font-size:30px}.collection-grid{gap:20px 8px}.filter-chip{padding-inline:12px}.collection-tools label{font-size:13px}.build-controls{gap:24px}.segments button{flex-basis:104px}.rank-labels strong{font-size:16px}.rank-labels span{font-size:12px}.chain-pair{gap:12px}.hash-row{flex-wrap:wrap}.hash-row input{flex-basis:100%}.runtime-card{flex-basis:208px}.question-item summary{font-size:17px}.closing-band{grid-template-columns:56px minmax(0,1fr);gap:12px}.closing-band h2{font-size:32px}.site-foot.full-footer{gap:24px 8px}.footer-links a{font-size:13px}.phone-action{gap:8px;padding-inline:8px}.nav-links a{padding-inline:10px}}
@media(max-width:360px){.section-five{--section-gap:20px}.line-row{grid-template-columns:minmax(0,1fr) 72px;gap:8px}.line-row p{font-size:28px}.collection-piece>p{display:block;font-size:12px}.collection-piece>p span{display:block}.filter-chips{gap:6px}.filter-chip{font-size:13px}.build-card{width:248px;max-width:100%}.segments button{padding:10px}.rank-labels{gap:4px}.rank-labels strong{font-size:15px}.chain-traits{gap:0 12px}.check-result{padding-block:20px}.runtime-card{flex-basis:200px}.question-item summary{font-size:16px}.closing-band h2{font-size:30px}.closing-band .btn{padding-inline:12px}.footer-links h2{font-size:14px}.phone-action p{font-size:12px}.phone-action .btn{font-size:12px}.nav-links a{padding-inline:9px}.page-progress{left:8px;right:8px}}
@media(prefers-reduced-motion:reduce){.section-five *,.section-five *::before,.section-five *::after{animation:none!important;transition:none!important}.runtime-card [data-draw]{stroke-dashoffset:0}.runtime-card{transform:none}.chain-traits>div{opacity:1}.nav-indicator{transition:none}}

/* LOCKET redesign: "Build a piece" reads as a wall of glass lockers, not a plain two-column
   bench. Additive only: .build-bench, .build-object, .build-controls and .segments above keep
   every rule, so machine.html (its markup untouched) still renders exactly as before. */
.locker-bay{position:relative}
.locker-floor{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);gap:64px;align-items:start;margin-top:32px}
.locker-door{display:grid;justify-items:center;gap:24px}
/* The wall of glass locker doors lives only inside the hero door's own glass, behind the
   robot piece, so it can never sit under the section heading or the label plate's text. */
.locker-door-glass{position:relative;width:min(100%,340px);padding:16px;border-radius:28px;border:2px solid var(--line);background:linear-gradient(160deg,rgba(142,227,3,.1),transparent 65%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.5);transform-origin:0 center;transform-style:preserve-3d;overflow:hidden}
.locker-door.is-swinging .locker-door-glass{animation:locker-swing 420ms var(--ease)}
.locker-wall{position:absolute;inset:0;z-index:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(48px,1fr));gap:6px;padding:6px;opacity:.16;pointer-events:none}
.locker-tile{position:relative;aspect-ratio:1;border:1px solid var(--line);border-radius:6px;background:linear-gradient(150deg,var(--tint),transparent 70%)}
.locker-tile::after{content:"";position:absolute;top:50%;left:50%;width:4px;height:4px;border-radius:50%;background:var(--ink-soft);transform:translate(-50%,-50%)}
.locker-door-glass .build-card{position:relative;z-index:1;width:100%}
.locker-plate{width:100%;max-width:340px;position:relative;padding:16px 20px;border:1px solid var(--line);border-radius:14px;background:var(--card);text-align:center;font-family:var(--font-mono)}
.locker-plate::before,.locker-plate::after{content:"";position:absolute;top:9px;width:5px;height:5px;border-radius:50%;background:var(--line)}
.locker-plate::before{left:9px}.locker-plate::after{right:9px}
.locker-plate>strong{display:block;font:700 clamp(28px,3vw,44px)/1.1 var(--font-display);letter-spacing:-.03em;font-family:var(--font-display)}
.locker-plate>.tag{margin-block:10px}
.locker-plate>p{font-size:13px;line-height:1.6;color:var(--ink-soft);font-family:var(--font-body)}
.locker-panel{display:grid;gap:20px}
.locker-group{min-width:0;border:0;padding:0;margin:0}
.locker-tab{display:inline-flex;align-items:center;padding:4px 10px;margin-bottom:10px;border:1px solid var(--line);border-radius:6px 6px 0 0;background:var(--tint);font:500 12px/1.4 var(--font-body);text-transform:uppercase;letter-spacing:.06em;color:var(--ink-soft)}
.locker-switches{display:flex;flex-direction:column;gap:6px}
.locker-switch{display:flex;align-items:center;gap:12px;min-height:48px;padding:8px 14px;border:1px solid var(--line);border-radius:10px;background:transparent;color:var(--ink);font:400 14px/1.3 var(--font-body);text-align:left;cursor:pointer;transition:border-color 160ms var(--ease),background 160ms var(--ease)}
.locker-switch-toggle{position:relative;width:32px;height:18px;flex:none;border-radius:999px;border:1px solid var(--line);background:var(--ground)}
.locker-switch-toggle::after{content:"";position:absolute;top:1px;left:1px;width:14px;height:14px;border-radius:50%;background:var(--ink-soft);transition:transform 160ms var(--ease),background 160ms var(--ease)}
.locker-switch-text{flex:1 1 auto}
.locker-switch-pct{font:400 12px/1.5 var(--font-mono);color:var(--ink-soft)}
.locker-switch[aria-pressed=true]{border-color:var(--accent-deep);background:var(--tint)}
.locker-switch[aria-pressed=true] .locker-switch-toggle{background:var(--tint);border-color:var(--accent-deep)}
.locker-switch[aria-pressed=true] .locker-switch-toggle::after{transform:translateX(14px);background:var(--glow)}
.locker-switch:focus-visible{outline:3px solid var(--accent-deep);outline-offset:2px}
@keyframes locker-swing{0%{transform:perspective(600px) rotateY(0deg)}35%{transform:perspective(600px) rotateY(-10deg)}100%{transform:perspective(600px) rotateY(0deg)}}
@media(max-width:1023px){.locker-floor{grid-template-columns:minmax(0,1fr)}}
@media(max-width:767px){.locker-door-glass{width:min(100%,280px)}.locker-wall{grid-template-columns:repeat(auto-fill,minmax(56px,1fr))}}
@media(prefers-reduced-motion:reduce){.locker-door.is-swinging .locker-door-glass{animation:none}}