:root{--night:#0b0918;--earth:#15100d;--earth-2:#1d1510;--ink:#f3e3b5;--ink-dim:#c2ae84;--gold:#ffe680;--amber:#ffa030;--ember:#e8541e;--wood:#634128;--wood-2:#956538;--edge:#2e1f27;--font-title:"Ruslan Display", Georgia, serif;--font-body:"Philosopher", Georgia, serif;--font-px:"Pixelify Sans", ui-monospace, monospace;--frame:0 -3px 0 0 var(--edge), 0 3px 0 0 var(--edge), -3px 0 0 0 var(--edge), 3px 0 0 0 var(--edge), inset 0 0 0 3px var(--wood), inset 0 0 0 4px #ffe0802e;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--earth)}body{background:var(--earth);color:var(--ink);font:18px/1.6 var(--font-body);-webkit-font-smoothing:antialiased;margin:0;overflow-x:hidden}img{max-width:100%;height:auto;display:block}a{color:var(--gold)}.wrap{width:min(1080px,100% - 32px);margin-inline:auto}.narrow{width:min(760px,100% - 32px)}.skip{position:absolute;left:-999px}.skip:focus{z-index:9;background:#000;padding:6px 10px;top:8px;left:8px}.px{image-rendering:pixelated}.bar{z-index:5;padding:14px 0;position:absolute;top:0;left:0;right:0}.bar .wrap{justify-content:space-between;align-items:center;gap:12px;display:flex}.brand{color:var(--gold);font:24px var(--font-title);text-shadow:0 2px 0 var(--edge);align-items:center;gap:10px;text-decoration:none;display:inline-flex}.brand img{width:32px;height:32px;image-rendering:pixelated}.bar nav{font:600 15px var(--font-px);letter-spacing:.02em;align-items:center;gap:20px;display:flex}.bar nav a{color:var(--ink-dim);text-shadow:0 1px #000;text-decoration:none}.bar nav a:hover{color:var(--gold)}.lang{box-shadow:0 -2px 0 0 var(--wood), 0 2px 0 0 var(--wood), -2px 0 0 0 var(--wood), 2px 0 0 0 var(--wood);background:#0b09188c;padding:3px 10px}.hero{isolation:isolate;text-align:center;background:var(--night);height:100svh;min-height:560px;max-height:1100px;position:relative;overflow:hidden}.hero .scene{z-index:-1}.hero:after{content:"";height:14px;image-rendering:pixelated;z-index:1;background:url(/img/px/edge.png) 0 0/128px 28px repeat-x;position:absolute;bottom:0;left:0;right:0;transform:translateY(50%)}.hero-copy{padding-top:clamp(92px,15vh,170px);position:relative}h1{font:clamp(48px, 10vw, 96px)/1 var(--font-title);color:var(--gold);text-shadow:0 4px 0 var(--edge), 0 0 36px #ffa03073;margin:0 0 10px;font-weight:400;animation:1.4s ease-out both rise-in}.lead{max-width:30em;color:var(--ink);text-shadow:0 2px #000,0 0 14px #0b0918;margin:0 auto 26px;font-size:clamp(18px,2.4vw,22px);animation:1.4s ease-out .15s both rise-in}.cta-note{font:15px var(--font-px);color:var(--ink-dim);text-shadow:0 1px #000;margin:16px 0 0;animation:1.4s ease-out .3s both rise-in}.hero .cta{animation:1.4s ease-out .25s both rise-in}@keyframes rise-in{0%{opacity:0;transform:translateY(10px)}}.scroll-hint{z-index:2;opacity:.7;background:linear-gradient(var(--gold), var(--gold)) 0 0 / 4px 4px no-repeat, linear-gradient(var(--gold), var(--gold)) 4px 4px / 4px 4px no-repeat, linear-gradient(var(--gold), var(--gold)) 7px 8px / 4px 4px no-repeat, linear-gradient(var(--gold), var(--gold)) 10px 4px / 4px 4px no-repeat, linear-gradient(var(--gold), var(--gold)) 14px 0 / 4px 4px no-repeat;width:18px;height:12px;margin-left:-9px;animation:2.2s ease-in-out infinite hint;position:absolute;bottom:26px;left:50%}@keyframes hint{0%,to{transform:translateY(0)}50%{transform:translateY(6px)}}.cta{font:24px var(--font-title);color:#3a2414;background:var(--gold);box-shadow:inset 0 -5px 0 #e8a030, inset 0 3px 0 #fff6c0, 0 -3px 0 0 var(--edge), 0 3px 0 0 var(--edge), -3px 0 0 0 var(--edge), 3px 0 0 0 var(--edge), 0 9px 0 0 #00000073, 0 0 34px #ffa03059;padding:14px 38px 12px;text-decoration:none;transition:transform .1s steps(2,end),filter .1s;display:inline-block;position:relative}.cta:before{content:"";width:9px;height:9px;image-rendering:pixelated;opacity:0;background:url(/scene/spark.png) 50%/100% no-repeat;margin-top:-5px;transition:opacity .2s;position:absolute;top:50%;left:10px}.cta:hover{filter:brightness(1.06);transform:translateY(-2px)}.cta:hover:before{opacity:1;animation:1.2s linear infinite twirl}.cta:active{box-shadow:inset 0 -2px 0 #e8a030, inset 0 3px 0 #fff6c0, 0 -3px 0 0 var(--edge), 0 3px 0 0 var(--edge), -3px 0 0 0 var(--edge), 3px 0 0 0 var(--edge);transform:translateY(3px)}.cta:focus-visible{outline-offset:6px;outline:3px solid #fff}@keyframes twirl{to{transform:rotate(360deg)}}section{padding:84px 0;position:relative}h2{font:clamp(30px, 5vw, 44px)/1.12 var(--font-title);color:var(--gold);text-shadow:0 3px 0 var(--edge);margin:0 0 8px;font-weight:400}.sub{color:var(--ink-dim);max-width:38em;margin:0 0 40px}.earth{background:radial-gradient(ellipse 60% 50% at 50% 0, #ffa03012, transparent 70%), var(--earth);padding-top:100px}#how,#faq{background:var(--earth-2)}#how:before,#faq:before,.street-sec+section:before{content:"";background:repeating-linear-gradient(90deg, var(--edge) 0 6px, transparent 6px 12px);opacity:.6;height:6px;position:absolute;top:0;left:0;right:0}.grid{grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:22px;display:grid}.card{min-height:140px;box-shadow:var(--frame), 0 10px 0 0 #0000004d;background:linear-gradient(#2c2016,#1d1510);padding:22px 22px 20px 96px;transition:transform .25s ease-out;position:relative}.card:hover{transform:translateY(-4px)}.card .ico{background:var(--img) center / contain no-repeat;width:64px;height:64px;image-rendering:pixelated;filter:drop-shadow(0 3px #00000080);transition:transform .25s steps(3,end);position:absolute;top:20px;left:18px}.card:hover .ico{transform:translateY(-4px)rotate(-4deg)}.card h3{font:21px/1.2 var(--font-title);color:var(--gold);margin:0 0 6px;font-weight:400}.card p{color:var(--ink);margin:0;font-size:16.5px}.steps{counter-reset:s;grid-template-columns:repeat(4,1fr);gap:26px;margin:0;padding:0;list-style:none;display:grid}.steps li{counter-increment:s}.steps p{margin:18px 0 0;font-size:16.5px}.steps b{font:22px var(--font-title);color:var(--gold);margin-bottom:2px;font-weight:400;display:block}.steps b:before{content:counter(s);width:30px;height:30px;font:600 16px var(--font-px);color:#3a2414;background:var(--gold);box-shadow:0 -2px 0 0 var(--edge), 0 2px 0 0 var(--edge), -2px 0 0 0 var(--edge), 2px 0 0 0 var(--edge);vertical-align:3px;place-items:center;margin-right:10px;display:inline-grid}.vig{--u:calc(100cqw / 96);aspect-ratio:3/2;box-shadow:var(--frame);image-rendering:pixelated;position:relative;overflow:hidden;container-type:inline-size}.vig i{background-repeat:no-repeat;display:block;position:absolute}.v-sky{background:linear-gradient(#1b1636,#2f2244 60%,#4a2d46);inset:0}.v-sky:after{content:"";background:radial-gradient(1px 1px at 20% 20%,#f2ece0 50%,#0000),radial-gradient(1px 1px at 70% 12%,#f2ece0 50%,#0000),radial-gradient(1px 1px at 86% 34%,#c8c0e8 50%,#0000),radial-gradient(1px 1px at 45% 28%,#c8c0e8 50%,#0000);position:absolute;inset:0}.v-sky.dawn{background:linear-gradient(#2f2244,#8a4a52 55%,#f0a070);animation:6s ease-in-out infinite alternate dawn}@keyframes dawn{0%{filter:brightness(.75)}to{filter:brightness(1.1)}}.v-ground{height:calc(var(--u) * 10);background:linear-gradient(#3a4a2c 0 calc(var(--u) * 2), #2f3f26 0 calc(var(--u) * 5), #263420 0);bottom:0;left:0;right:0}.v-sp{background:var(--img) 0 0 / 100% 100% no-repeat}.v-chop{transform-origin:80% 80%;animation:.9s steps(3,end) infinite chop}@keyframes chop{0%,to{transform:rotate(-30deg)}50%{transform:rotate(25deg) translateX(calc(var(--u) * -3))}}.v-chip{left:calc(var(--u) * 34);bottom:calc(var(--u) * 24);width:calc(var(--u) * 2);height:calc(var(--u) * 2);background:#c99558;animation:.9s ease-out infinite chip}.v-chip.b{background:#ecc890;animation-delay:-.45s}@keyframes chip{0%{opacity:1;transform:translate(0)}to{transform:translate(calc(var(--u) * -8), calc(var(--u) * 14));opacity:0}}.v-rise{transform-origin:50% 100%;animation:5s steps(6,end) infinite build}@keyframes build{0%{clip-path:inset(100% 0 0)}60%,to{clip-path:inset(0)}}.v-dust{left:calc(var(--u) * 20);right:calc(var(--u) * 20);bottom:calc(var(--u) * 8);height:calc(var(--u) * 4);background:repeating-linear-gradient(90deg, #ecc89080 0 calc(var(--u) * 2), transparent 0 calc(var(--u) * 5));animation:5s steps(6,end) infinite dust}@keyframes dust{0%,55%{opacity:1;transform:translateY(0)}70%,to{opacity:0;transform:translateY(calc(var(--u) * -6))}}.v-walk{bottom:calc(var(--u) * 7);left:calc(var(--u) * 52);width:calc(var(--u) * 20);height:calc(var(--u) * 24);background:var(--img) 0 0 / 200% 100% no-repeat;animation:6s linear infinite pace,.5s step-end infinite walk}@keyframes pace{0%{transform:translateX(calc(var(--u) * -6))}48%{transform:translateX(calc(var(--u) * 14))}50%{transform:translateX(calc(var(--u) * 14)) scaleX(-1)}98%{transform:translateX(calc(var(--u) * -6)) scaleX(-1)}to{transform:translateX(calc(var(--u) * -6))}}@keyframes walk{0%{background-position:0 0}50%{background-position:100% 0}}.v-hop{animation:2.4s ease-in-out infinite hop}@keyframes hop{0%,70%,to{transform:translateY(0)}80%{transform:translateY(calc(var(--u) * -5))}}.v-fade{animation:6s ease-in-out infinite alternate dream}@keyframes dream{0%{opacity:1}to{opacity:.25;filter:brightness(1.6)}}.v-mote{bottom:calc(var(--u) * 14);width:calc(var(--u) * 2);height:calc(var(--u) * 2);background:#fff0a8;animation:3.2s linear infinite mote}@keyframes mote{0%{opacity:0;transform:translateY(0)}20%{opacity:1}to{transform:translateY(calc(var(--u) * -40));opacity:0}}.street-sec{background:linear-gradient(var(--earth), #120e1c 40%);padding-bottom:0}.street{--u:calc(100cqh / 80);height:clamp(190px,26vw,300px);image-rendering:pixelated;margin-top:10px;position:relative;overflow:hidden;container-type:size}.street i{background-repeat:no-repeat;display:block;position:absolute}.st-sky{background:linear-gradient(#120e1c,#2a1f3c 70%,#3e2a44);inset:0}.st-b{bottom:calc(var(--u) * 6);background:var(--img) center bottom / 100% 100% no-repeat;transform:translate(-50%)}.st-lane{height:calc(var(--u) * 10);background:linear-gradient(#5e4c30 0 var(--u), #7c5e3a 0 calc(var(--u) * 3), #5e4c30 0 calc(var(--u) * 6), #2f3f26 0);bottom:0;left:0;right:0}.st-w{bottom:calc(var(--u) * 4);width:calc(var(--u) * 20);height:calc(var(--u) * 24);background:var(--img) 0 0 / 200% 100% no-repeat;animation:40s linear infinite stroll,.5s step-end infinite walk;left:0}.st-w.rev{animation-name:stroll-back,walk}@keyframes stroll{0%{transform:translateX(calc(var(--u) * -30))}to{transform:translate(100cqw)}}@keyframes stroll-back{0%{transform:translate(100cqw)scaleX(-1)}to{transform:translateX(calc(var(--u) * -30)) scaleX(-1)}}.st-fly{background:#fff0a8;width:3px;height:3px;animation:11s ease-in-out infinite sc-wander,2.6s steps(2,end) infinite sc-blink;box-shadow:0 0 8px 2px #ffe07880}.split{grid-template-columns:1fr 1.2fr;align-items:center;gap:48px;display:grid}.split p{margin:0 0 14px}.split .cta{margin-top:14px}.shots{display:grid;position:relative}.shot{box-shadow:var(--frame), 0 18px 40px #0000008c;background:var(--wood);grid-area:1/1;margin:0;padding:4px;transition:transform .4s ease-out}.shot img{image-rendering:auto}.shot:first-child{transform:rotate(-3deg)translate(-6%,-10%)scale(.86)}.shot:nth-child(2){transform:rotate(2.5deg)translate(8%,14%)scale(.86)}.shot:nth-child(3){z-index:1;transform:rotate(-.5deg)scale(.9)}.shots:hover .shot:first-child{transform:rotate(-5deg)translate(-12%,-16%)scale(.86)}.shots:hover .shot:nth-child(2){transform:rotate(4deg)translate(13%,20%)scale(.86)}details{box-shadow:var(--frame);background:linear-gradient(#2c2016,#1d1510);margin-bottom:14px;padding:14px 20px}summary{cursor:pointer;color:var(--gold);align-items:center;gap:12px;font-size:19px;font-weight:700;list-style:none;display:flex}summary::-webkit-details-marker{display:none}summary:before{content:"";width:12px;height:12px;image-rendering:pixelated;background:url(/scene/spark.png) 50%/100% no-repeat;flex:none;transition:transform .2s steps(2,end)}details[open] summary:before{transform:rotate(45deg)scale(1.2)}details[open] summary{margin-bottom:8px}details p{color:var(--ink);margin:0;padding-left:24px}.final{text-align:center;background:var(--night);isolation:isolate;align-items:start;height:78vh;min-height:480px;padding:0;display:grid;overflow:hidden}.final-scene{z-index:-1;position:absolute;inset:0}.final-copy{padding-top:clamp(60px,12vh,130px)}.final .sub{text-shadow:0 2px #000;color:var(--ink);margin-inline:auto}footer{color:var(--ink-dim);font:15px var(--font-px);background:#0d0a08;padding:26px 0 36px}footer .wrap{flex-wrap:wrap;justify-content:space-between;gap:8px 24px;display:flex}footer a{color:var(--ink-dim)}.js .reveal{opacity:0;transition:opacity .7s ease-out,transform .7s ease-out;transform:translateY(18px)}.js .reveal.in{opacity:1;transform:none}.js .steps .reveal:nth-child(2),.js .grid .reveal:nth-child(3n+2){transition-delay:.1s}.js .steps .reveal:nth-child(3),.js .grid .reveal:nth-child(3n){transition-delay:.2s}.js .steps .reveal:nth-child(4){transition-delay:.3s}@media (width<=960px){.steps{grid-template-columns:repeat(2,1fr)}}@media (width<=760px){body{font-size:17px}.bar nav a:not(.lang){display:none}section{padding:60px 0}.split{grid-template-columns:1fr;gap:40px}.shots{margin:30px 8px 40px}.card{padding-left:86px}.card .ico{width:52px;height:52px;left:16px}}@media (width<=520px){.steps,.grid{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition:none!important;animation:none!important}.js .reveal{opacity:1;transform:none}}.paused,.paused *,.paused :after{animation-play-state:paused!important}.street:after{content:"";height:14px;image-rendering:pixelated;background:url(/img/px/edge.png) 0 0/128px 28px repeat-x;position:absolute;bottom:0;left:0;right:0;transform:translateY(50%)}
