/* Agentic commerce, in a carton box: the interactive journey. Board language from the main site. */
@font-face{font-family:"EB Garamond";font-weight:400;font-display:swap;src:url(../assets/fonts/eb-400.woff) format("woff")}
@font-face{font-family:"EB Garamond";font-weight:400;font-style:italic;font-display:swap;src:url(../assets/fonts/eb-i400.woff) format("woff")}
@font-face{font-family:"EB Garamond";font-weight:600 900;font-display:swap;src:url(../assets/fonts/eb-700.woff2) format("woff2")}
@font-face{font-family:"ITWeralionis";font-style:italic;font-display:swap;src:url(../assets/fonts/it-weralionis-demo.italic.otf) format("opentype")}
@font-face{font-family:"SuisseMono";font-weight:400;font-display:swap;src:url(/assets/fonts/suisse-mono-400.otf) format("opentype")}
@font-face{font-family:"SuisseMono";font-weight:500 900;font-display:swap;src:url(/assets/fonts/suisse-mono-500.otf) format("opentype")}
:root{--paper:#f4f1e6;--paper2:#fbf8ef;--ink:#1d1a16;--dim:#6b6152;--red:#b93b2f;--red2:#c74335;--kr:#c9a46e;--kr-d:#ad8650;--kr-l:#dcbd8c;--manila:#e7d3a4;--night:#17140f;
 --sans:"Inter Tight","Helvetica Neue",Arial,sans-serif;--serif:"EB Garamond",Georgia,serif;--mono:"SuisseMono",ui-monospace,Menlo,monospace;--type:"Courier New",Courier,monospace}
*{box-sizing:border-box}
html,body{margin:0;background:var(--paper);color:var(--ink)}
html.lenis,html.lenis body{height:auto}.lenis.lenis-smooth{scroll-behavior:auto!important}
body{font:18px/1.5 var(--serif);-webkit-font-smoothing:antialiased;overflow-x:hidden}
button{font:inherit;color:inherit;cursor:pointer}
a{color:inherit}
img{max-width:100%}
:focus-visible{outline:2px solid var(--red);outline-offset:3px}

/* loader */
.j-loader{position:fixed;inset:0;z-index:100;background:var(--paper);display:grid;place-content:center;gap:1.2rem;justify-items:center;transition:opacity .6s,visibility .6s}
.j-loader.done{opacity:0;visibility:hidden}
.jl-box{width:120px;height:80px;background:linear-gradient(170deg,var(--kr-l),var(--kr) 60%,var(--kr-d));position:relative;box-shadow:0 14px 24px -14px rgba(60,40,20,.6)}
.jl-tape{position:absolute;left:0;top:44%;height:12%;width:0;background:rgba(255,248,232,.55);animation:jl 1.4s ease-in-out infinite}
@keyframes jl{0%{width:0}60%,100%{width:100%}}
.j-loader p{font:500 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--dim);margin:0}

/* hud */
.j-hud{position:fixed;left:0;right:0;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:14px 20px;pointer-events:none}
.j-hud>*{pointer-events:auto}
.j-brand{display:flex;align-items:center;gap:.55rem;text-decoration:none}
.j-brand img{width:30px}
.j-brand span{font:italic 400 21px/1 "ITWeralionis",serif;color:#8f8977;word-spacing:-.08em;text-shadow:0 1px 1px rgba(255,255,255,.7)}
.j-chip{display:flex;align-items:center;gap:.6rem;background:var(--paper2);border:1px solid rgba(70,50,20,.18);padding:7px 13px 6px;font:500 10.5px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;box-shadow:0 6px 14px -10px rgba(60,40,20,.5)}
.j-chip b{color:var(--red)}
.j-tools{display:flex;gap:.5rem}
.j-btn{background:var(--paper2);border:1px solid rgba(70,50,20,.25);padding:7px 12px 6px;font:500 10.5px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase}
.j-btn[aria-pressed=false]{opacity:.55}
body.on-dark .j-brand span{color:#cfc6b2;text-shadow:none}
.j-menu{position:fixed;right:20px;top:58px;z-index:60;width:min(360px,calc(100vw - 40px));background:var(--paper2);padding:1.3rem 1.3rem 1rem;box-shadow:0 22px 40px -20px rgba(60,40,20,.6);transform:rotate(.6deg)}
.j-menu ol{list-style:none;margin:0;padding:0;counter-reset:m}
.j-menu li a{display:flex;gap:.8rem;padding:.42rem 0;border-bottom:1px solid rgba(70,90,140,.14);text-decoration:none;font:600 1rem/1.25 var(--sans);letter-spacing:-.01em}
.j-menu li a span{font:700 11px/1.9 var(--type);color:var(--red);width:1.6rem}
.j-menu li a.on{color:var(--red)}
.j-menu-foot{font:13px/1.4 var(--serif);color:var(--dim);margin:.8rem 0 0}

/* progress rail: a red thread with a pin per layer */
.j-rail{position:fixed;left:22px;top:50%;transform:translateY(-50%);z-index:40;height:min(64vh,560px);width:24px}
.j-rail ol{list-style:none;margin:0;padding:0;height:100%;display:flex;flex-direction:column;justify-content:space-between;position:relative;z-index:2}
.j-rail li a{display:block;width:12px;height:12px;margin-left:6px;border-radius:50%;background:var(--paper2);border:1.5px solid rgba(70,50,20,.4);position:relative}
.j-rail li a.on{background:var(--red);border-color:#7e2219;box-shadow:0 0 0 4px rgba(185,59,47,.18)}
.j-rail li a span{position:absolute;left:22px;top:-5px;white-space:nowrap;font:500 10px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;background:var(--paper2);padding:5px 7px 4px;opacity:0;transform:translateX(-4px);transition:.2s;pointer-events:none;color:var(--ink)}
.j-rail li a:hover span,.j-rail li a:focus-visible span{opacity:1;transform:none}
.j-rail-wire{position:absolute;left:0;top:0;width:24px;height:100%;overflow:visible;z-index:1}
.j-rail-wire .bg{stroke:rgba(70,50,20,.18);stroke-width:2;fill:none}
.j-rail-wire .fg{stroke:var(--red2);stroke-width:2.6;fill:none;stroke-linecap:round}

/* scenes */
.sc{position:relative}
.stage{position:relative;height:100vh;height:100svh;overflow:hidden;padding:88px max(64px,6vw) 48px;display:flex;flex-direction:column}
.board{background:repeating-linear-gradient(90deg,rgba(90,60,20,.07) 0 2px,transparent 2px 9px),radial-gradient(ellipse at 18% 12%,rgba(255,240,210,.4),transparent 60%),radial-gradient(ellipse at 85% 95%,rgba(90,58,20,.25),transparent 60%),linear-gradient(160deg,var(--kr-l),var(--kr) 45%,var(--kr-d))}
.board::before,.paper::before,.night::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;mix-blend-mode:multiply;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' seed='3'/%3E%3CfeColorMatrix values='0 0 0 0 .45 0 0 0 0 .32 0 0 0 0 .16 0 0 0 .3 0'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)'/%3E%3C/svg%3E")}
.paper{background:radial-gradient(ellipse at 20% 10%,#fffdf6,transparent 55%),var(--paper)}
.paper::before{opacity:.35}
.night{background:radial-gradient(ellipse at 50% 40%,#2b241a,var(--night) 70%);color:#efe7d6}
.night::before{opacity:.25;mix-blend-mode:screen}
.ch-h{position:relative;z-index:3;max-width:56rem}
.ch-n{display:inline-block;font:500 11px/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--red);background:var(--paper2);padding:6px 9px 5px;transform:rotate(-1.5deg);box-shadow:1px 3px 5px rgba(60,40,20,.2)}
.night .ch-n{background:#2f281d;color:#ef8a7c;box-shadow:none}
.ch-h h2{margin:.7rem 0 0;font:600 clamp(2rem,4.2vw,3.9rem)/1 var(--sans);letter-spacing:-.04em;text-wrap:balance}
.year{position:absolute;right:max(40px,5vw);top:76px;font:800 clamp(3rem,10vw,9.5rem)/.9 var(--sans);letter-spacing:-.06em;color:transparent;-webkit-text-stroke:1.5px rgba(40,24,8,.32);z-index:1;pointer-events:none;font-variant-numeric:tabular-nums}
.paper .year{-webkit-text-stroke-color:rgba(29,26,22,.18)}
.night .year{-webkit-text-stroke-color:rgba(239,231,214,.2)}
.ch-grid{position:relative;z-index:2;flex:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(1.5rem,4vw,4.5rem);align-items:center;margin-top:1rem;min-height:0}
.col-copy{display:flex;flex-direction:column;gap:1rem;max-width:30rem}
.cap{margin:0;background:var(--paper2);padding:1rem 1.2rem .95rem;font:clamp(16px,1.25vw,19px)/1.42 var(--serif);box-shadow:0 1px 2px rgba(60,40,20,.12),2px 12px 22px -14px rgba(60,40,20,.55);transform:rotate(var(--r,-.6deg));position:relative}
.cap:nth-child(2){--r:.7deg}.cap:nth-child(3){--r:-.3deg}
.cap::before{content:"";position:absolute;left:50%;top:-10px;width:70px;height:20px;margin-left:-35px;background:rgba(244,232,200,.75);box-shadow:0 1px 2px rgba(60,40,20,.15);transform:rotate(-3deg)}
.cap.red{border-left:4px solid var(--red)}
.cap i{display:block;margin-top:.35rem;font:500 10px/1.3 var(--mono);font-style:normal;letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.night .cap{background:#262017;color:#efe7d6;box-shadow:0 14px 26px -16px #000}
.night .cap::before{background:rgba(231,211,164,.4)}
.moral{position:relative;z-index:3;margin:1rem 0 0;max-width:46rem;font:clamp(18px,1.6vw,24px)/1.35 var(--serif)}
.moral b{font-weight:600}
.moral.small{font-size:clamp(15px,1.2vw,18px);max-width:40rem}
.col-art{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.4rem;min-height:0}
.obj{margin:0;position:relative;filter:drop-shadow(3px 14px 12px rgba(50,30,10,.4))}
.obj img{display:block;width:100%;height:auto}
.tag,.obj figcaption{display:block;width:max-content;margin:.4rem auto 0;background:var(--paper2);padding:.35rem .6rem;font:700 10.5px/1.2 var(--type);letter-spacing:.12em;text-transform:uppercase;transform:rotate(-2deg)}
.jpin{position:absolute;left:50%;top:-16px;width:30px;height:35px;margin-left:-15px;z-index:6;filter:drop-shadow(1px 3px 2px rgba(60,20,10,.45))}
.spot{position:absolute;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;border:0;background:var(--ink);color:#fff;font:600 18px/30px var(--sans);box-shadow:0 0 0 5px rgba(255,255,255,.45);animation:pulse 2.2s infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 4px rgba(255,255,255,.5)}50%{box-shadow:0 0 0 10px rgba(255,255,255,.12)}}
.j-tip{position:fixed;z-index:80;max-width:260px;background:var(--paper2);padding:.8rem .95rem;font:15px/1.4 var(--serif);box-shadow:0 18px 30px -16px rgba(60,40,20,.65);transform:rotate(-1deg);pointer-events:none}

/* 00 intro */
.sc-intro .stage{background:radial-gradient(ellipse at 50% 70%,#fffaf0,var(--paper) 60%);align-items:center;justify-content:center;padding-top:70px}
.intro-copy{position:relative;z-index:4;text-align:center;max-width:44rem;margin-bottom:auto;margin-top:2vh}
.kick{font:500 11px/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--red);margin:0 0 .9rem}
.intro-copy h1{margin:0;font:600 clamp(2.4rem,6vw,5.4rem)/.96 var(--sans);letter-spacing:-.045em}
.intro-copy .sub{margin:1rem auto 0;max-width:30rem;font:clamp(17px,1.4vw,21px)/1.4 var(--serif);color:#4a4134}
.scene3d{position:absolute;left:0;right:0;bottom:12vh;height:52vh;perspective:1600px;perspective-origin:50% 20%;z-index:3;display:grid;place-items:center;touch-action:pan-y}
.cam{position:relative;transform-style:preserve-3d;width:0;height:0}
.b3{--w:min(34vw,420px);--h:min(23vw,280px);--d:min(25vw,300px);position:absolute;left:0;top:0;transform-style:preserve-3d;transform:rotateX(-22deg) rotateY(-28deg);cursor:grab}
.b3 .f,.b3 .fl{position:absolute;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.b3 .f{background:repeating-linear-gradient(90deg,rgba(90,60,20,.06) 0 2px,transparent 2px 9px),linear-gradient(170deg,var(--kr-l),var(--kr) 55%,#b38c56);border:1px solid rgba(90,62,24,.3)}
.b3 .front,.b3 .back,.b3 .in-front,.b3 .in-back{width:var(--w);height:var(--h);left:calc(var(--w)/-2);top:calc(var(--h)/-2)}
.b3 .left,.b3 .right,.b3 .in-left,.b3 .in-right{width:var(--d);height:var(--h);left:calc(var(--d)/-2);top:calc(var(--h)/-2)}
.b3 .front{transform:translateZ(calc(var(--d)/2))}
.b3 .back{transform:rotateY(180deg) translateZ(calc(var(--d)/2))}
.b3 .left{transform:rotateY(-90deg) translateZ(calc(var(--w)/2));background:linear-gradient(180deg,#c9a977,#b8975f)}
.b3 .right{transform:rotateY(90deg) translateZ(calc(var(--w)/2));background:linear-gradient(180deg,#c9a977,#b8975f)}
.b3 .bottom{width:var(--w);height:var(--d);left:calc(var(--w)/-2);top:calc(var(--d)/-2);transform:rotateX(90deg) translateZ(calc(var(--h)/-2));background:#8d6c3f}
.b3 .in-front{transform:rotateY(180deg) translateZ(calc(var(--d)/-2 + 1px));background:linear-gradient(180deg,#8a6838,#a98450)}
.b3 .in-back{transform:translateZ(calc(var(--d)/-2 + 1px));background:linear-gradient(180deg,#8a6838,#a98450)}
.b3 .in-left{transform:rotateY(90deg) translateZ(calc(var(--w)/-2 + 1px));background:linear-gradient(180deg,#7d5e33,#9a7846)}
.b3 .in-right{transform:rotateY(-90deg) translateZ(calc(var(--w)/-2 + 1px));background:linear-gradient(180deg,#7d5e33,#9a7846)}
.b3 .glow{position:absolute;width:var(--w);height:var(--d);left:calc(var(--w)/-2);top:calc(var(--d)/-2);transform:rotateX(90deg) translateZ(calc(var(--h)/2 - 2px));background:radial-gradient(ellipse at 50% 50%,rgba(255,236,190,1),rgba(255,214,140,.7) 40%,rgba(255,200,120,0) 75%);opacity:0;pointer-events:none}
/* flaps hinge on the top edges; --o goes 0 (closed) to 1 (open) */
.b3{--o:0}
.b3 .fl{background:linear-gradient(180deg,#d9b884,#c49d65);border:1px solid rgba(90,62,24,.3);backface-visibility:visible;-webkit-backface-visibility:visible}
.b3 .fl-f,.b3 .fl-b{width:var(--w);height:calc(var(--d)/2);left:calc(var(--w)/-2);top:0;transform-origin:50% 0}
.b3 .fl-f{transform:translateY(calc(var(--h)/-2)) translateZ(calc(var(--d)/2)) rotateX(calc(-90deg - var(--o)*112deg))}
.b3 .fl-b{transform:translateY(calc(var(--h)/-2)) translateZ(calc(var(--d)/-2)) rotateX(calc(90deg + var(--o)*112deg))}
.b3 .fl-l,.b3 .fl-r{width:calc(var(--w)/2);height:var(--d);top:calc(var(--d)/-2)}
.b3 .fl-l{left:0;transform-origin:0 50%;transform:translateX(calc(var(--w)/-2)) translateY(calc(var(--h)/-2)) rotateZ(calc(var(--o)*-125deg)) rotateX(90deg);background:linear-gradient(90deg,#c9a46e,#d9b884)}
.b3 .fl-r{left:calc(var(--w)/-2);transform-origin:100% 50%;transform:translateX(calc(var(--w)/2)) translateY(calc(var(--h)/-2)) rotateZ(calc(var(--o)*125deg)) rotateX(90deg);background:linear-gradient(270deg,#c9a46e,#d9b884)}
.b3 .fl-f .tape,.b3 .fl-b .tape{position:absolute;left:46%;width:8%;top:0;height:100%;background:rgba(255,248,232,.5)}
.b3 .cutter{position:absolute;width:44px;height:14px;left:-22px;top:-7px;transform:translateY(calc(var(--h)/-2 - 6px)) translateZ(calc(var(--d)/2 * (1 - 2*var(--c,0)))) rotateX(90deg);background:linear-gradient(90deg,#d8d8d2,#9a9a94);clip-path:polygon(0 50%,30% 0,100% 0,100% 100%,30% 100%);opacity:var(--co,0)}
.b3 .lab{position:absolute;left:7%;top:12%;width:52%;background:#fbf8ef;border:3px solid #111;padding:4% 5%;display:flex;gap:.6rem;align-items:center;transform:rotate(-2deg)}
.b3 .lab img{width:16%}
.b3 .lab b{font:600 clamp(11px,1.5vw,19px)/1.02 var(--sans);letter-spacing:-.03em}
.b3 .stp{position:absolute;right:7%;top:16%;border:3px solid #a3201d;color:#a3201d;font:700 clamp(9px,1.2vw,15px)/1.2 var(--type);letter-spacing:.14em;text-transform:uppercase;padding:.15em .45em;transform:rotate(12deg);opacity:.88}
.b3 .ship{position:absolute;left:7%;right:7%;bottom:10%;font:clamp(7px,.75vw,10px)/1.5 var(--type);letter-spacing:.1em;text-transform:uppercase;color:#3a2a12}
.b3 .ship i{display:block;height:1px;background:rgba(58,42,18,.3);margin:.3rem 0}
.side-t{position:absolute;inset:0;display:grid;place-items:center;text-align:center;font:clamp(8px,.9vw,12px)/1.5 var(--type);letter-spacing:.12em;text-transform:uppercase;color:#3a2a12;padding:10%}
.shadow3{position:absolute;left:-260px;top:120px;width:520px;height:70px;background:radial-gradient(ellipse,rgba(70,48,14,.32),transparent 68%);transform:translateY(calc(min(23vw,280px)/2 - 60px))}
.rays{position:absolute;left:50%;bottom:30vh;width:160vmax;height:160vmax;margin-left:-80vmax;margin-bottom:-80vmax;z-index:2;opacity:0;pointer-events:none;
 background:repeating-conic-gradient(from 0deg at 50% 50%,rgba(255,226,170,.55) 0deg 4deg,rgba(255,226,170,0) 4deg 13deg);-webkit-mask:radial-gradient(circle,#000 0,rgba(0,0,0,.6) 18%,transparent 52%);mask:radial-gradient(circle,#000 0,rgba(0,0,0,.6) 18%,transparent 52%)}
.dust{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none;opacity:0}
.spill{position:absolute;left:50%;bottom:34vh;width:0;height:0;z-index:5;pointer-events:none}
.spill img{position:absolute;max-width:none;width:var(--w);left:calc(var(--w)/-2);top:0;opacity:0;filter:drop-shadow(4px 16px 14px rgba(50,30,10,.35))}
.hint{position:absolute;left:50%;bottom:3.2vh;transform:translateX(-50%);z-index:6;display:flex;flex-direction:column;align-items:center;gap:.55rem;text-align:center}
.hint span{font:500 10px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
.open-b,.run-b,.tagbtn,.swap,.w-buy{position:relative;display:inline-flex;align-items:center;gap:.6rem;border:0;background:#1d1a16;color:#f4f1e6;padding:.85rem 1.3rem .8rem 2.2rem;font:600 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;clip-path:polygon(14px 0,100% 0,100% 100%,14px 100%,0 50%);text-decoration:none;transition:transform .2s,background .2s}
.open-b::before,.run-b::before,.tagbtn::before,.swap::before,.w-buy::before{content:"";position:absolute;left:14px;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;background:var(--kr);box-shadow:0 0 0 2px #b8913f}
.open-b:hover,.run-b:hover,.tagbtn:hover,.swap:hover,.w-buy:hover{background:var(--red);transform:rotate(-2deg)}
.whiteout{position:absolute;inset:0;z-index:9;pointer-events:none;opacity:0;background:radial-gradient(circle at 50% 60%,#fff8e6,#f3e2bd 60%,var(--kr) 100%)}

/* 01 barter */
.barter{position:relative;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.8rem;width:min(100%,30rem)}
.trader{background:var(--paper2);padding:.8rem .9rem;font:14px/1.35 var(--serif);display:flex;flex-direction:column;box-shadow:2px 10px 18px -12px rgba(60,40,20,.55)}
.trader b{font:600 1rem/1.2 var(--sans);margin-bottom:.2rem}
.trader:first-child{transform:rotate(-2deg)}.trader:nth-child(3){transform:rotate(2deg)}
.swap{padding-left:2rem;font-size:10px}
.barter-out{grid-column:1/-1;margin:.2rem 0 0;font:14px/1.4 var(--serif);text-align:center;color:#3a2a12;min-height:2.8em}
.barter.shake{animation:shake .45s}
@keyframes shake{20%,60%{transform:translateX(-7px)}40%,80%{transform:translateX(7px)}}
.tablet{width:min(26vw,320px)}
/* 02 coin */
.scale{width:min(20vw,250px)}
.coin{position:relative;width:min(13vw,160px);aspect-ratio:1;border:0;background:none;padding:0;perspective:600px;filter:drop-shadow(3px 12px 10px rgba(50,30,10,.4))}
.coin .cf{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;transition:transform .9s cubic-bezier(.3,1.6,.5,1)}
.coin .cf img{width:100%;height:100%;object-fit:contain}
.coin .back{transform:rotateY(180deg)}.coin .back img{transform:scaleX(-1);filter:sepia(.4) brightness(.92)}
.coin.flip .front{transform:rotateY(180deg)}.coin.flip .back{transform:rotateY(360deg)}
.coin-note{margin:0;font:500 10px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
/* 03 ledger */
.ledger{position:relative;width:min(100%,25rem);background:#f3edda;padding:1rem 1.1rem 1.4rem;font:16px/2 var(--serif);box-shadow:2px 14px 24px -14px rgba(60,40,20,.6);transform:rotate(-1.2deg);
 background-image:linear-gradient(90deg,transparent 58%,rgba(185,59,47,.45) 58% calc(58% + 1px),transparent calc(58% + 1px) 79%,rgba(185,59,47,.45) 79% calc(79% + 1px),transparent calc(79% + 1px)),repeating-linear-gradient(180deg,transparent 0 31px,rgba(70,90,140,.25) 31px 32px)}
.lg-h,.lg-r{display:flex}.lg-h{font:700 11px/2.6 var(--type);letter-spacing:.1em;text-transform:uppercase}
.lg-h span:first-child,.lg-r span:first-child{width:58%}.lg-h span,.lg-r span{width:21%;padding-left:8px}
.lg-r{font-style:italic}.lg-r.tot{font-weight:700;font-style:normal;border-top:2px solid rgba(29,26,22,.6)}
.stamp-ok{position:absolute;right:-10px;bottom:-18px;border:3px solid #3f6b3a;color:#3f6b3a;font:700 14px/1 var(--type);letter-spacing:.16em;text-transform:uppercase;padding:.35rem .6rem;transform:rotate(-9deg);background:rgba(251,248,239,.6)}
.note-tag{position:relative;background:var(--manila);padding:1.5rem 1rem .9rem;width:14rem;font:15px/1.35 var(--serif);clip-path:polygon(14% 0,86% 0,100% 12%,100% 100%,0 100%,0 12%);transform:rotate(3deg);align-self:flex-end}
.note-tag b{display:block;font:600 1.4rem/1 var(--sans);color:var(--red)}
/* 04 haggle + tag */
.haggle-wrap{min-height:22rem}
.haggle{position:absolute;inset:0}
.hb{position:absolute;left:var(--x);top:var(--y);background:#fff;padding:.6rem .9rem;border-radius:18px;font:17px/1.2 var(--serif);box-shadow:0 8px 16px -10px rgba(60,40,20,.5)}
.hb::after{content:"";position:absolute;left:18px;bottom:-7px;border:7px solid transparent;border-top-color:#fff;border-bottom:0}
.hb.x{color:#9c958a;text-decoration:line-through;text-decoration-color:var(--red);text-decoration-thickness:2px}
.ptag{position:relative;margin-top:6rem;width:12rem;background:#fbf6ea;border:2.5px solid var(--ink);padding:2rem 1rem 1.2rem;text-align:center;transform-origin:50% -2.4rem;clip-path:polygon(18% 0,82% 0,100% 14%,100% 100%,0 100%,0 14%);filter:drop-shadow(3px 12px 10px rgba(50,30,10,.35))}
.ptag::before{content:"";position:absolute;left:50%;top:-3rem;height:3rem;border-left:1.5px solid #6b5a40}
.pt-hole{position:absolute;left:50%;top:.6rem;width:12px;height:12px;margin-left:-6px;border-radius:50%;border:2px solid var(--ink);background:var(--paper)}
.pt-k{display:block;font:700 11px/1 var(--type);letter-spacing:.16em;text-transform:uppercase;color:var(--red)}
.pt-p{display:block;font:600 3.2rem/1 var(--sans);letter-spacing:-.05em;margin:.4rem 0}
.pt-s{display:block;font:14px/1.3 var(--serif)}
/* 05 catalog + rail */
.rail-line{position:absolute;left:0;right:0;bottom:16vh;height:70px;z-index:1;border-bottom:3px solid rgba(40,24,8,.35);background:repeating-linear-gradient(90deg,transparent 0 22px,rgba(40,24,8,.28) 22px 26px) bottom/100% 10px no-repeat}
.train{position:absolute;bottom:4px;left:0;width:min(14vw,170px);filter:drop-shadow(3px 8px 6px rgba(50,30,10,.4))}
.rail-line .farm,.rail-line .city{position:absolute;bottom:-1.9rem;font:700 10px/1 var(--type);letter-spacing:.14em;text-transform:uppercase;color:rgba(40,24,8,.7)}
.rail-line .city{left:6vw}.rail-line .farm{right:6vw}
.catalogue{width:min(15vw,190px);transform:rotate(-5deg)}
.order{position:relative;background:#fbf8ef;padding:1.3rem 1.2rem 1.6rem;width:min(100%,19rem);font:13px/1.8 var(--type);text-transform:uppercase;letter-spacing:.04em;transform:rotate(2deg);box-shadow:2px 12px 20px -12px rgba(60,40,20,.55)}
.order>b{display:block;text-align:center;letter-spacing:.14em;border-bottom:1px dashed #9c958a;margin-bottom:.4rem}
.of{display:flex;justify-content:space-between}
/* 06 barcode */
.scan-wrap{gap:1rem}
.scanbed{position:relative;width:min(100%,24rem);height:12rem;background:linear-gradient(180deg,#3a3630,#24211c);border-radius:6px;box-shadow:inset 0 2px 0 rgba(255,255,255,.1),0 18px 30px -16px rgba(0,0,0,.6)}
.laser{position:absolute;left:50%;top:10%;bottom:10%;width:3px;margin-left:-1.5px;background:#ff3b2a;box-shadow:0 0 12px 3px rgba(255,59,42,.75);animation:laser 1.1s ease-in-out infinite alternate}
@keyframes laser{from{opacity:.65}to{opacity:1}}
.gum{position:absolute;left:8%;top:50%;width:8.5rem;transform:translateY(-50%) rotate(-8deg);border:0;background:none;padding:0;touch-action:none;cursor:grab;z-index:2}
.gum img{width:100%;display:block;pointer-events:none}
.gum .code{position:absolute;left:30%;top:36%;width:34%;height:26%;background:#fff repeating-linear-gradient(90deg,#111 0 2px,#fff 2px 3px,#111 3px 4px,#fff 4px 6px,#111 6px 8px,#fff 8px 9px);transform:rotate(-24deg);box-shadow:0 0 0 2px #fff}
.scanner{position:absolute;right:-14%;bottom:-24%;width:42%;transform:rotate(-24deg);filter:drop-shadow(3px 10px 8px rgba(0,0,0,.45));pointer-events:none}
.till{width:min(100%,17rem);background:#fbf8ef;padding:.9rem 1rem 1.3rem;font:12.5px/1.6 var(--type);text-transform:uppercase;box-shadow:2px 12px 20px -12px rgba(60,40,20,.55);transform:rotate(1.5deg);
 -webkit-mask:linear-gradient(#000 0 0) top/100% calc(100% - 8px) no-repeat,conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/12px 8px repeat-x;mask:linear-gradient(#000 0 0) top/100% calc(100% - 8px) no-repeat,conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/12px 8px repeat-x}
.till>b{display:block;text-align:center;letter-spacing:.14em}.till>span{display:block;text-align:center;font-size:10.5px;color:var(--dim);border-bottom:1px dashed #9c958a;padding-bottom:.4rem;margin-bottom:.3rem}
.till-lines div{display:flex;justify-content:space-between}.till-lines .ok{color:var(--red);font-weight:700}
.drag-hint{margin:0;font:500 10px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.flyer{position:absolute;z-index:1;pointer-events:none;filter:drop-shadow(4px 14px 10px rgba(50,30,10,.35))}
.plane{width:min(16vw,200px);left:-20vw;top:22vh}
.box-ship{width:min(9vw,120px);right:3vw;bottom:9vh;transform:rotate(-6deg);opacity:.95}
.ticker{font-variant-numeric:tabular-nums}
/* 07 web */
.win94{position:relative;width:min(100%,28rem);background:#c3c0b6;border:2px solid #fff;border-right-color:#5d5a52;border-bottom-color:#5d5a52;box-shadow:3px 16px 26px -14px rgba(0,0,0,.55);transform:rotate(-1.4deg)}
.w-bar{display:flex;align-items:center;gap:5px;padding:5px 7px;background:linear-gradient(90deg,#1f3b8a,#5a7fd0);color:#fff;font:600 12px/1 var(--sans)}
.w-bar i{width:9px;height:9px;background:#c3c0b6;border:1px solid #fff}
.w-bar span{margin-left:6px}
.w-body{display:grid;grid-template-columns:7rem 1fr;gap:1rem;background:#fff;margin:6px;padding:1rem;font:15px/1.35 "Times New Roman",serif;color:#000}
.w-body img{width:100%}
.w-body b{display:block;font-size:19px}
.w-body span{display:block}
.w-price{margin:.4rem 0 .7rem;font-weight:700}
.w-buy{clip-path:none;padding:.55rem 1rem;background:#d6d3c9;color:#000;border:2px solid #fff;border-right-color:#5d5a52;border-bottom-color:#5d5a52;font:600 12px/1 var(--sans);letter-spacing:.04em}
.w-buy::before{display:none}
.w-buy:hover{background:#e6e3d9;transform:none}
.w-out{display:block;margin-top:.6rem;font:12.5px/1.45 var(--type);color:#1a5c1a;min-height:3em;word-break:break-all}
.flag-pin{position:relative;align-self:flex-end;margin-right:6%;width:12.5rem;padding-top:2.4rem;text-align:center}
.flag-pin svg{position:absolute;left:50%;top:-6px;width:54px;height:63px;margin-left:-27px;z-index:2;filter:drop-shadow(2px 6px 4px rgba(60,20,10,.5))}
.flag-pin .fl{display:block;background:#f4ead0;border:2px solid var(--ink);padding:.75rem .8rem;box-shadow:2px 10px 18px -10px rgba(60,40,20,.55)}
.flag-pin .fl b{display:block;font:600 1.6rem/1 var(--sans);letter-spacing:-.03em}
.flag-pin .fl span{display:block;margin-top:.35rem;font:700 10px/1.3 var(--type);letter-spacing:.12em;text-transform:uppercase;color:var(--red)}
.books{width:min(13vw,170px);position:absolute;left:4%;bottom:-2%}
.xray{position:relative;z-index:3;align-self:center;width:min(100%,40rem);height:9.5rem;margin-top:.8rem;background:#fff;box-shadow:2px 14px 26px -14px rgba(60,40,20,.6);--x:18%}
.xr-page{position:absolute;inset:0;display:grid;grid-template-columns:7rem 1fr;gap:1rem;padding:1rem;font:15px/1.4 var(--serif)}
.xp-img{background:linear-gradient(160deg,#c9b98a,#7d6a3c);border-radius:2px}
.xr-page b{display:block;font:600 1.1rem/1.2 var(--sans)}.xr-page span{display:block}.xp-pr{font-weight:700}.xp-btn{display:inline-block!important;margin-top:.4rem;background:var(--ink);color:#fff;font:600 11px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;padding:.5rem .7rem;width:max-content}
.xr-code{position:absolute;inset:0;margin:0;padding:1rem 1.2rem;background:#1d1a16;color:#e9dcc0;font:13px/1.55 var(--type);clip-path:inset(0 0 0 var(--x));white-space:pre;overflow:hidden}
.xr-range{position:absolute;left:0;right:0;bottom:-1.6rem;width:100%;accent-color:var(--red)}
.xr-l,.xr-r{position:absolute;top:-1.5rem;font:500 10px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:#3a2a12}
.xr-l{left:0}.xr-r{right:0}
/* 08 till wall */
.tillwall{position:relative;z-index:2;flex:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.6rem 1.4rem;align-content:center;margin-top:1rem}
.tk{position:relative;background:var(--paper2);padding:1.5rem 1.2rem 1.2rem;box-shadow:0 1px 2px rgba(60,40,20,.12),2px 14px 24px -14px rgba(60,40,20,.55);transform:rotate(var(--r,-1deg))}
.tk:nth-child(2){--r:1.2deg}.tk:nth-child(3){--r:-.5deg}.tk:nth-child(4){--r:1deg}.tk:nth-child(5){--r:-1.4deg}
.tk.big{grid-column:span 2;grid-row:span 2;display:flex;flex-direction:column;justify-content:center}
.tk-k{display:block;font:500 10.5px/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.tk b{display:block;margin:.5rem 0 .3rem;font:600 clamp(2rem,3.4vw,3.2rem)/1 var(--sans);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.tk.big b{font-size:clamp(3rem,7vw,6.6rem);color:var(--red)}
.tk small{font:13px/1.3 var(--serif);color:var(--dim)}
/* 09 new buyer */
.robot{position:absolute;bottom:6vh;left:-18vw;width:min(17vw,220px);z-index:3;filter:drop-shadow(6px 18px 14px rgba(0,0,0,.6))}
.ask{position:absolute;z-index:4;left:max(56px,5vw);bottom:calc(9vh + min(19vw,250px));max-width:min(19rem,24vw);background:#fbf8ef;color:var(--ink);padding:.9rem 1.1rem;border-radius:18px;font:17px/1.35 var(--serif);box-shadow:0 14px 24px -14px #000}
.ask::after{content:"";position:absolute;left:24px;bottom:-9px;border:9px solid transparent;border-top-color:#fbf8ef;border-bottom:0}
.dark .ch-grid,.dark .moral{margin-left:min(26vw,360px)}
.passport{position:relative;width:min(100%,24rem);background:#2b2419;border:1px solid #4a3f2e;padding:1.2rem;display:grid;grid-template-columns:1fr 1fr;gap:1rem;transform:rotate(1.5deg)}
.passport>b{grid-column:1/-1;font:500 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:#cfc6b2}
.ps{display:flex;flex-direction:column;align-items:center;justify-content:center;aspect-ratio:1.5;border:3px solid #ef8a7c;color:#ef8a7c;border-radius:50%;font:700 1.05rem/1 var(--sans);letter-spacing:-.01em;transform:rotate(var(--r,-8deg));text-align:center;padding:.4rem}
.ps:nth-child(3){--r:6deg;border-color:#e9c46a;color:#e9c46a}.ps:nth-child(4){--r:-4deg;border-color:#9fc2a0;color:#9fc2a0}.ps:nth-child(5){--r:9deg;border-color:#a9b8e8;color:#a9b8e8}
.ps.big{grid-column:1/-1;aspect-ratio:auto;border-radius:6px;padding:.8rem;font-size:1.8rem;border-color:#fbf8ef;color:#fbf8ef;--r:-3deg}
.ps i{display:block;margin-top:.3rem;font:500 9.5px/1 var(--mono);font-style:normal;letter-spacing:.14em;text-transform:uppercase}
/* 10 + 11 demos */
.demo{position:relative;z-index:3;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:1.2rem 1.6rem;margin-top:1.4rem;align-items:start}
.d-tabs{grid-column:1/-1;display:flex;gap:.5rem}
.d-tabs button{border:1px solid rgba(40,24,8,.35);background:rgba(251,248,239,.6);padding:.6rem .9rem .55rem;font:500 10.5px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase}
.d-tabs button[aria-selected=true]{background:var(--ink);color:#f4f1e6;border-color:var(--ink)}
.d-stage{position:relative;height:clamp(15rem,34vh,20rem);background:#fff;box-shadow:2px 16px 28px -14px rgba(60,40,20,.65);overflow:hidden}
.shop{position:absolute;inset:0;margin:0;transition:opacity .35s,transform .35s}
.human-v{padding:.9rem 1rem;font:14px/1.4 var(--sans)}
.s-top{display:flex;justify-content:space-between;border-bottom:1px solid #e8e2d4;padding-bottom:.5rem;font-size:13px}
.s-main{display:grid;grid-template-columns:40% 1fr;gap:1rem;margin-top:.8rem}
.s-img{aspect-ratio:1;background:linear-gradient(160deg,#d8c48a,#6f5a2a);display:grid;place-items:end start;padding:.5rem;color:#fff;font:600 12px/1 var(--sans)}
.s-info b{display:block;font-size:18px;margin-bottom:.3rem}
.s-pimg{display:inline-block;padding:.25rem .45rem;background:linear-gradient(90deg,#f6e7b8,#efd38a);font:800 22px/1 var(--sans);border-radius:3px;transform:rotate(-2deg)}
.s-sizes{display:flex;gap:.35rem;margin:.6rem 0}
.s-sizes span{border:1px solid #ccc;padding:.3rem .45rem;font-size:12px}.s-sizes .dim{color:#bbb;border-color:#eee}
.s-add{display:inline-block;background:#111;color:#fff;padding:.5rem .8rem;font-size:12px}
.s-cookie{position:absolute;left:0;right:0;bottom:0;background:#1d1a16;color:#fff;padding:.8rem 1rem;font-size:13px;display:flex;gap:.6rem;align-items:center}
.s-cookie span{border:1px solid #fff;padding:.25rem .5rem;font-size:11px}
.s-captcha{position:absolute;right:.8rem;top:3rem;width:11rem;background:#fff;border:1px solid #ccc;box-shadow:0 8px 20px rgba(0,0,0,.2);padding:.6rem;font-size:12px;opacity:0;transform:translateY(8px);transition:.3s}
.s-captcha.show{opacity:1;transform:none}
.agent-v{padding:1rem 1.1rem;background:#1d1a16;color:#e9dcc0;font:13px/1.65 var(--type);white-space:pre;overflow:auto;opacity:0;transform:translateY(10px)}
.agent-v em{color:#ef8a7c;font-style:normal}
.d-stage.agent .agent-v{opacity:1;transform:none}.d-stage.agent .human-v{opacity:0}
.d-run{display:flex;flex-direction:column;gap:.8rem;align-items:flex-start}
.log{width:100%;min-height:11rem;background:#fbf8ef;padding:.9rem 1rem;font:12.5px/1.6 var(--type);box-shadow:2px 12px 22px -14px rgba(60,40,20,.6);transform:rotate(.6deg)}
.log div{opacity:0;transform:translateY(4px);animation:ln .3s forwards}
@keyframes ln{to{opacity:1;transform:none}}
.log .bad{color:var(--red);font-weight:700}.log .good{color:#3f6b3a;font-weight:700}
.bench{position:relative;z-index:3;margin-top:1.4rem;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.6rem 1.2rem;background:rgba(251,248,239,.82);padding:.9rem 1.1rem;font:13px/1.35 var(--serif)}
.bench>b{grid-column:1/-1;font:500 10.5px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.bn span{display:block;font:600 13px/1.2 var(--sans)}
.bn i{display:block;position:relative;height:10px;margin:.4rem 0;background:rgba(40,24,8,.12)}
.bn i::before{content:"";position:absolute;left:0;top:0;bottom:0;width:calc(var(--a)*1%);background:var(--red)}
.bn i::after{content:"";position:absolute;top:-3px;bottom:-3px;left:calc(var(--h,0)*1%);width:2px;background:var(--ink);opacity:calc(var(--h,0)/var(--h,1))}
.bn em{font-style:normal;color:var(--dim);font-size:12.5px}
.lineage{position:relative;z-index:3;display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.2rem}
.lineage span{background:var(--manila);padding:.55rem .8rem .5rem 1.3rem;font:600 13px/1 var(--sans);clip-path:polygon(10px 0,100% 0,100% 100%,10px 100%,0 50%);transform:rotate(var(--r,-1deg))}
.lineage span:nth-child(even){--r:1.4deg}
.lineage .now{background:var(--red);color:#fff}
.demo.small{grid-template-columns:1fr;margin-top:0}
.rec{margin:0;background:#1d1a16;color:#e9dcc0;padding:1rem 1.1rem;font:13px/1.6 var(--type);white-space:pre;overflow:auto;border-left:4px solid var(--red)}
/* 12 end */
.sc-end .stage{height:auto;min-height:100vh;overflow:visible;padding-bottom:3rem}
.lead{margin:0 0 1rem;font:clamp(17px,1.4vw,21px)/1.45 var(--serif);background:var(--paper2);padding:1rem 1.2rem;box-shadow:2px 12px 22px -14px rgba(60,40,20,.55)}
.pack{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.7rem}
.pack li{background:var(--paper2);transform:rotate(var(--r,-.5deg));box-shadow:2px 10px 18px -12px rgba(60,40,20,.55)}
.pack li:nth-child(even){--r:.6deg}
.pack label{display:flex;gap:.9rem;padding:.85rem 1rem;cursor:pointer;font:16px/1.4 var(--serif)}
.pack input{appearance:none;flex:none;width:1.4rem;height:1.4rem;border:2px solid var(--ink);margin:.1rem 0 0;display:grid;place-items:center;background:#fff;cursor:pointer}
.pack input:checked::after{content:"✓";font:800 1.1rem/1 var(--sans);color:var(--red);transform:rotate(-8deg) scale(1.25)}
.pack b{font-family:var(--sans);font-weight:600}
.endbox{position:relative;width:min(100%,24rem);aspect-ratio:1.25;margin:2rem auto 0}
.endbox::before{content:"";position:absolute;left:4%;right:4%;top:22%;height:10%;background:linear-gradient(180deg,#6f5029,#9a7846);transition:opacity .4s}
.endbox.closed::before{opacity:0}
.eb-body{position:absolute;left:0;right:0;bottom:0;height:70%;background:repeating-linear-gradient(90deg,rgba(90,60,20,.06) 0 2px,transparent 2px 9px),linear-gradient(170deg,var(--kr-l),var(--kr) 55%,#b38c56);box-shadow:0 22px 34px -18px rgba(60,40,20,.65);display:grid;place-items:center}
.eb-count{font:700 13px/1 var(--type);letter-spacing:.14em;text-transform:uppercase;color:#3a2a12}
.eb-flap{position:absolute;top:6%;width:50%;height:24%;background:linear-gradient(180deg,#e0c291,#c49d65);border:1px solid rgba(90,62,24,.25);transition:transform .8s cubic-bezier(.5,1.4,.5,1)}
.eb-flap.l{left:0;transform-origin:0 100%;transform:rotate(-24deg);clip-path:polygon(0 0,88% 0,100% 100%,0 100%)}
.eb-flap.r{right:0;transform-origin:100% 100%;transform:rotate(24deg);clip-path:polygon(12% 0,100% 0,100% 100%,0 100%)}
.endbox.closed .eb-flap.l{transform:scaleY(.06)}
.endbox.closed .eb-flap.r{transform:scaleY(.06)}
.eb-label{position:absolute;left:12%;bottom:12%;width:62%;background:#fbf8ef;border:2.5px solid #111;padding:.7rem .8rem;transform:rotate(-3deg) translateY(30px) scale(.9);opacity:0;transition:.6s cubic-bezier(.3,1.5,.5,1) .5s}
.eb-label small{display:block;font:700 9.5px/1 var(--type);letter-spacing:.16em;text-transform:uppercase;color:var(--red)}
.eb-label b{display:block;font:600 1.35rem/1.05 var(--sans);letter-spacing:-.03em;margin:.3rem 0}
.eb-label span{display:block;font:12px/1.3 var(--serif)}
.eb-label i{display:block;height:20px;margin-top:.5rem;background:repeating-linear-gradient(90deg,#111 0 2px,#fff 2px 4px,#111 4px 5px,#fff 5px 8px)}
.endbox.closed .eb-label{opacity:1;transform:rotate(-3deg)}
.endbox.closed .eb-body::after{content:"";position:absolute;left:0;right:0;top:0;height:14%;background:rgba(255,248,232,.5)}
.cta{position:relative;z-index:3;margin-top:3rem;display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.6rem;background:var(--paper2);padding:1.4rem 1.6rem;box-shadow:2px 14px 24px -14px rgba(60,40,20,.55)}
.cta p{flex:1 1 28rem;margin:0;font:17px/1.45 var(--serif)}
.cta .link{font:500 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;text-decoration:underline;text-decoration-color:var(--red);text-underline-offset:4px}
.sources{position:relative;z-index:3;margin-top:1.4rem;background:rgba(251,248,239,.85);padding:.9rem 1.2rem;font:14px/1.5 var(--serif)}
.sources summary{cursor:pointer;font:500 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase}
.foot{position:relative;z-index:3;margin:1.4rem 0 0;font:500 10px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:#3a2a12}

/* responsive */
@media(max-width:900px){
 .stage{padding:84px 18px 56px;height:auto;min-height:0;overflow:visible}
 .ch .stage{overflow:hidden}
 .sc-intro .stage{height:100svh;padding:70px 18px 28px}
 .j-rail{display:none}
 .j-rail li a{width:10px;height:10px;margin-left:7px}
 .j-brand span{display:none}
 .j-chip{padding:6px 9px 5px;font-size:9.5px}
 .j-btn{padding:6px 8px 5px;font-size:9.5px}
 #j-sound{display:none}
 .ch-grid{grid-template-columns:1fr;gap:1.6rem}
 .year{position:relative;top:auto;right:auto;order:-1;align-self:flex-end;font-size:clamp(2.8rem,15vw,4.6rem);margin:-.4rem 0 -.6rem}
 .b3{--w:62vw;--h:42vw;--d:46vw}
 .scene3d{bottom:13vh;height:46vh}
 .tablet{width:62vw}.scale{width:46vw}.coin{width:34vw}.catalogue{width:40vw}.books{display:none}
 .haggle-wrap{min-height:19rem}
 .rail-line{position:relative;bottom:auto;top:auto;margin:1.4rem -18px 0;order:5}
 .tillwall{grid-template-columns:1fr 1fr}.tk.big{grid-column:1/-1;grid-row:auto}
 .dark .ch-grid{margin-left:0}
 .robot{position:relative;left:0;bottom:auto;width:34vw;margin:1rem 0 0;order:4}.ask{position:relative;left:auto;bottom:auto;max-width:none;margin-top:1.2rem;font-size:16px;order:3}
 .dark .ch-grid,.dark .moral{margin-left:0}
 .plane{position:relative;left:auto;top:auto;bottom:auto;width:44vw;margin:1rem 0 0 -44vw}
 .haggle-wrap{min-height:22rem}
 .demo{grid-template-columns:1fr}.bench{grid-template-columns:1fr 1fr}
 .xray{height:12rem}.xr-page{grid-template-columns:5rem 1fr}
 .plane{top:auto;bottom:30vh}.box-ship{display:none}
 .w-body{grid-template-columns:5rem 1fr}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.laser{opacity:1}}

/* ===== v2: hands-on box, figures, timeline, dust, charts ===== */
.b3 .lab{flex-direction:column;align-items:flex-start;gap:.3rem;padding:4% 5% 3.5%}
.b3 .lab img{width:22%}
.b3 .lab .wm{font:italic 400 clamp(14px,2.2vw,30px)/1 "ITWeralionis",serif;word-spacing:-.08em;color:#8f8977;letter-spacing:0;text-shadow:0 1px 1px rgba(255,255,255,.8),0 -1px 1px rgba(107,98,88,.3)}
.b3 .ship b{display:block;font:600 clamp(8px,1vw,13px)/1.2 var(--sans);letter-spacing:-.01em;text-transform:none;color:#2a1d0c}
.b3 .anc{position:absolute;width:2px;height:2px;left:-1px;top:-1px}
.b3 .anc-f{transform:translateY(calc(var(--h)/-2)) translateZ(calc(var(--d)/2))}
.b3 .anc-b{transform:translateY(calc(var(--h)/-2)) translateZ(calc(var(--d)/-2))}
.b3 .seam{position:absolute;width:6px;height:var(--d);left:-3px;top:calc(var(--d)/-2);transform:translateY(calc(var(--h)/-2 - 1px)) rotateX(90deg);background:linear-gradient(90deg,transparent,rgba(255,226,160,.95),transparent);opacity:var(--seam,0);filter:blur(1.5px);pointer-events:none}
.b3 .fl{cursor:grab}
.b3 .fl:hover{filter:brightness(1.06)}
.b3.rattle{animation:rattle .5s}
@keyframes rattle{20%{translate:-3px 0}40%{translate:3px -1px}60%{translate:-2px 0}80%{translate:2px 0}}
.scene3d.cutting{cursor:crosshair}
.hint .step{margin:0;font:600 clamp(15px,1.3vw,18px)/1.2 var(--sans);letter-spacing:-.01em;color:var(--ink);background:var(--paper2);padding:.5rem .9rem;box-shadow:0 8px 16px -10px rgba(60,40,20,.5);transform:rotate(-1deg)}
.hint-row{display:flex;gap:.6rem}
.climb-b{position:relative;display:inline-flex;border:0;background:var(--red);color:#fff;padding:.85rem 1.3rem .8rem 2.2rem;font:600 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;clip-path:polygon(14px 0,100% 0,100% 100%,14px 100%,0 50%);animation:pulse-b 1.6s infinite}
.climb-b::before{content:"";position:absolute;left:14px;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;background:#f4d9a8}
@keyframes pulse-b{50%{transform:scale(1.06) rotate(-1.5deg)}}
.toss{position:absolute;inset:0;z-index:7;pointer-events:none}
.toss img{position:absolute;left:0;top:0;pointer-events:auto;cursor:grab;touch-action:none;user-select:none;-webkit-user-drag:none;filter:drop-shadow(4px 14px 12px rgba(50,30,10,.38));will-change:transform}
.sc-intro.manual .spill{display:none}
/* figures: an engineering drawing taped to the board */
.figslot{position:relative;width:min(100%,calc((100vh - 230px)*1.3),760px);background:var(--paper2);padding:6px;box-shadow:0 1px 2px rgba(60,40,20,.15),3px 18px 30px -16px rgba(60,40,20,.6);transform:rotate(.4deg)}
.figslot::before,.figslot::after{content:"";position:absolute;width:86px;height:24px;background:rgba(244,232,200,.78);box-shadow:0 1px 2px rgba(60,40,20,.18);z-index:3}
.figslot::before{left:-18px;top:14px;transform:rotate(-38deg)}.figslot::after{right:-18px;bottom:16px;transform:rotate(-38deg)}
.figslot.tall{width:min(100%,calc((100vh - 200px)*1.05),720px)}
.fig{display:block;width:100%;height:clamp(300px,calc((100vh - 240px)),560px);border:0;background:transparent}
.figslot.tall .fig{height:calc(100vh - 200px)}
.wide-art{grid-template-columns:minmax(0,.8fr) minmax(0,1.3fr)}
/* timeline across the bottom */
.j-tl{position:fixed;left:50%;bottom:14px;transform:translateX(-50%);z-index:45;display:flex;align-items:center;gap:1rem;background:rgba(251,248,239,.92);padding:.55rem .9rem .5rem;box-shadow:0 10px 24px -14px rgba(60,40,20,.55);backdrop-filter:blur(6px);width:min(860px,calc(100vw - 32px))}
.tl-track{position:relative;flex:1;height:22px}
.tl-track::before{content:"";position:absolute;left:0;right:0;top:50%;height:2px;margin-top:-1px;background:rgba(70,50,20,.18)}
.tl-fill{position:absolute;left:0;top:50%;height:2.6px;margin-top:-1.3px;width:0;background:var(--red2);box-shadow:0 1px 1px rgba(60,20,10,.3)}
.j-tl ol{list-style:none;margin:0;padding:0;position:absolute;inset:0;display:flex;justify-content:space-between;align-items:center}
.j-tl li a{display:block;width:10px;height:10px;border-radius:50%;background:var(--paper2);border:1.5px solid rgba(70,50,20,.45);position:relative}
.j-tl li a.on{background:var(--red);border-color:#7e2219;transform:scale(1.35)}
.j-tl li a span{position:absolute;left:50%;bottom:18px;transform:translateX(-50%) translateY(4px);white-space:nowrap;font:500 9.5px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;background:var(--ink);color:#f4f1e6;padding:5px 7px 4px;opacity:0;transition:.18s;pointer-events:none}
.j-tl li a:hover span,.j-tl li a:focus-visible span{opacity:1;transform:translateX(-50%)}
.j-tl li a.on span{background:var(--red)}
.tl-year{flex:none;min-width:6.4rem;text-align:right;font:600 15px/1 var(--sans);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.j-rail{display:none}
body.on-dark .j-tl{background:rgba(38,32,23,.92);color:#efe7d6}
.j-dust{position:fixed;inset:0;width:100%;height:100%;z-index:30;pointer-events:none}
/* chart cards */
.chart-card{position:relative;margin:0;background:var(--paper2);padding:1rem 1.1rem .8rem;box-shadow:0 1px 2px rgba(60,40,20,.12),3px 16px 26px -14px rgba(60,40,20,.55);transform:rotate(-.4deg)}
.chart-card figcaption b{display:block;font:600 1.05rem/1.2 var(--sans);letter-spacing:-.015em}
.chart-card figcaption span{display:block;margin-top:.15rem;font:500 10px/1.4 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.chart-card .src{margin:.4rem 0 0;font:500 9.5px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.chart svg{display:block;width:100%;height:auto;overflow:visible}
.chart .ax{stroke:rgba(70,50,20,.3);stroke-width:1}
.chart .gr{stroke:rgba(70,90,140,.14);stroke-width:1}
.chart .lbl{font:500 10px var(--mono);fill:var(--dim);letter-spacing:.06em}
.chart .val{font:600 12px var(--sans);fill:var(--ink)}
.chart .ln{fill:none;stroke:var(--red);stroke-width:2.4;stroke-linejoin:round;stroke-linecap:round}
.chart .ar{fill:rgba(185,59,47,.1)}
.chart .bar{fill:var(--kr);stroke:#9c7a45;stroke-width:1;transition:fill .2s}
.chart .bar.neg{fill:#8a7d68}.chart .bar.pos{fill:var(--red)}
.chart .bar:hover,.chart .bar.on{fill:var(--red)}
.chart .dot{fill:var(--red);stroke:var(--paper2);stroke-width:2}
.chart .hair{stroke:var(--ink);stroke-width:1;stroke-dasharray:3 3}
.chart .tipbox rect{fill:var(--ink)}.chart .tipbox text{fill:#f4f1e6;font:500 10.5px var(--mono);letter-spacing:.05em}
.night-card{background:#262017;color:#efe7d6}
.night-card figcaption span,.night-card .src{color:#a99c84}
.night-card .chart .lbl{fill:#a99c84}.night-card .chart .val{fill:#efe7d6}.night-card .chart .ax{stroke:rgba(239,231,214,.25)}.night-card .chart .gr{stroke:rgba(239,231,214,.08)}
.night-card .chart .bar{fill:#6b5a40;stroke:#8a7650}.night-card .chart .bar.pos,.night-card .chart .bar:hover,.night-card .chart .bar.on{fill:#ef8a7c}.night-card .chart .bar.neg{fill:#4a4134}
.night-card .chart .tipbox rect{fill:#efe7d6}.night-card .chart .tipbox text{fill:#1d1a16}
.chart-card.wide{position:relative;z-index:3;margin-top:1.4rem}
.till-grid{position:relative;z-index:2;flex:1;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:2rem;align-items:center;margin-top:1rem;min-height:0}
.till-grid .tillwall{margin:0;grid-template-columns:1fr 1fr}
.till-grid .tk.big{grid-column:1/-1;grid-row:auto}
.buyer-grid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1fr) minmax(0,1fr);gap:1.4rem;align-items:start;margin:1rem 0 0 min(22vw,300px)}
.buyer-grid .col-copy{max-width:none}
/* protocol timeline */
.ptl{position:relative;z-index:3;margin:1.4rem 0 0 min(22vw,300px)}
.ptl-k{display:block;font:500 10.5px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:#cfc6b2;margin-bottom:.8rem}
.ptl-track{position:relative;display:flex;gap:.7rem;flex-wrap:wrap;align-items:center}
.ptl-track::before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:rgba(239,231,214,.25)}
.pst{position:relative;border:2.5px solid var(--c);color:var(--c);background:#1d1912;border-radius:50%;padding:.6rem .8rem;min-width:6.4rem;text-align:center;transform:rotate(var(--r,-5deg));transition:transform .25s}
.pst:nth-child(even){--r:4deg}
.pst b{display:block;font:700 .95rem/1 var(--sans)}.pst i{display:block;margin-top:.25rem;font:500 9px/1 var(--mono);font-style:normal;letter-spacing:.12em;text-transform:uppercase}
.pst.big{border-radius:6px;padding:.7rem 1rem}.pst.big b{font-size:1.35rem}
.pst:hover,.pst.on{transform:rotate(0) scale(1.08)}.pst.on{background:var(--c);color:#1d1912}
.ptl-d{margin:.9rem 0 0;max-width:40rem;font:16px/1.45 var(--serif);color:#efe7d6;min-height:3em}
/* gauges */
.gauge-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.gauge{background:var(--paper2);padding:.8rem .9rem;box-shadow:2px 12px 22px -14px rgba(60,40,20,.55);font:13px/1.35 var(--serif)}
.gauge svg{display:block;width:100%;max-width:150px}
.gauge .g-bg,.gauge .g-fg{fill:none;stroke-width:10;stroke-linecap:round}
.gauge .g-bg{stroke:rgba(70,50,20,.12)}.gauge .g-fg{stroke:var(--red)}
.gauge b{display:block;font:600 1.25rem/1.1 var(--sans);letter-spacing:-.03em;margin-top:.2rem}
@media(max-width:900px){
 .figslot,.figslot.tall{width:100%;transform:none}.fig{height:auto;aspect-ratio:4/3.4}.figslot.tall .fig{height:auto;aspect-ratio:3/4}
 .wide-art,.till-grid,.buyer-grid{grid-template-columns:1fr}.buyer-grid,.ptl{margin-left:0}
 .till-grid .tillwall{grid-template-columns:1fr 1fr}
 .j-tl{bottom:8px;padding:.45rem .6rem}.tl-year{min-width:4.6rem;font-size:13px}.j-tl li a{width:8px;height:8px}
 .gauge-row{grid-template-columns:1fr}
}
.climb-b[hidden]{display:none}
.sc-intro .hint{bottom:calc(9vh + 12px)}
.sc-intro .scene3d{bottom:18vh}

#l10 .chart-card.wide{max-width:820px}
#l10 .demo{margin-top:.8rem}
#l10 .d-stage{height:clamp(13rem,30vh,17rem)}
#l10 .log{min-height:9rem}
.buyer-grid .chart-card{padding:.8rem .9rem .6rem}
@media(max-width:900px){#l7 .col-art .flag-pin{position:relative;right:auto;bottom:auto;align-self:flex-end}}
