@import"https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800&family=DM+Sans:wght@400;500;600;700&display=swap";:root{color-scheme:dark;--gold:#ffc640;--ink:#090b0d;--line:#ffffff18;--font:"DM Sans",Arial,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--ink);color:#f1f1eb;font:16px var(--font)}button,input,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;border:0;transition:background .2s,color .2s,box-shadow .2s}button:disabled{cursor:wait;opacity:.4}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:5px}button:hover:not(:disabled){color:var(--gold)}[hidden]{display:none!important}.masthead{height:88px;padding:0 48px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);position:relative;z-index:5;background:#090b0dd9}.brand{display:flex;gap:14px;align-items:center;color:inherit;text-decoration:none;font-size:12px;letter-spacing:1.6px;line-height:1.5}.brand b{font-weight:600;color:#b4b6b8}.brand-icon{display:flex;align-items:center;font:700 32px Barlow Condensed,Arial,sans-serif;color:var(--gold);border-right:1px solid #ffffff32;padding-right:15px;gap:4px;letter-spacing:-1px}.brand-icon span{font-size:12px;writing-mode:vertical-rl;letter-spacing:1px}.chapter{font-size:12px;letter-spacing:2px;display:flex;align-items:center;gap:16px;color:#b3b5ba}.chapter span{color:var(--gold)}.chapter i{width:42px;height:1px;background:#51565d}.quiet{background:none;color:#9da1a6;font-size:14px;display:flex;gap:9px;align-items:center}.quiet span{font-size:23px}main{height:calc(100svh - 128px);min-height:670px;position:relative;overflow:hidden}#viewport{position:absolute;inset:0}canvas{width:100%;height:100%;display:block;touch-action:none}.ambient{pointer-events:none;position:absolute;inset:0;background:linear-gradient(90deg,#090b0dd9 0%,#090b0d70 25%,transparent 42%),linear-gradient(0deg,#090b0d 0%,transparent 30%)}.intro{position:absolute;left:48px;top:17%;pointer-events:none;transition:opacity .3s}.eyebrow{font-size:12px;letter-spacing:2px;color:#c3b48a;display:flex;align-items:center;gap:10px}.eyebrow i{width:16px;height:2px;background:var(--gold)}h1{font-family:Barlow Condensed,Arial Narrow,Impact,sans-serif;font-size:clamp(70px,7.5vw,114px);font-weight:700;line-height:.84;letter-spacing:-1.5px;margin:27px 0 23px}h1 span{display:block;color:var(--gold)}.intro p{font-size:16px;color:#e0e0dc;line-height:1.65;margin:0}.intro p span{color:#8b9299}.hero-meta{display:flex;align-items:center;gap:20px;font-size:11px;letter-spacing:1.5px;margin-top:35px;color:#999e9f}.hero-meta span+span{color:#d6ccad;border:1px solid #ffffff25;padding:5px 7px;font-size:10px}.view-tools{position:absolute;right:38px;top:15%;display:flex;flex-direction:column;gap:12px}.view-tools button{display:grid;grid-template-columns:30px 1fr;column-gap:9px;text-align:left;align-items:center;padding:12px 14px;border:1px solid #ffffff0c;background:#0c1014aa;border-radius:6px;backdrop-filter:blur(12px);font-size:12px;min-width:110px}.tool-icon{grid-row:span 2;font-size:26px;color:#8e959f}.view-tools i{font-size:10px;letter-spacing:1.2px;font-style:normal;color:#737c85;margin-top:3px}.view-tools button[aria-pressed=true]{border-color:#ffc6406b}.view-tools button[aria-pressed=true] .tool-icon,.view-tools button[aria-pressed=true] i{color:var(--gold)}.view-hint{position:absolute;bottom:236px;left:59%;transform:translate(-50%);display:flex;gap:10px;align-items:center;white-space:nowrap;font-size:10px;letter-spacing:1.5px;color:#747d86;pointer-events:none}.view-hint i{font-style:normal;color:#434b53}.mouse-icon{width:11px;height:16px;border:1px solid #67717c;border-radius:6px;position:relative}.mouse-icon:after{content:"";position:absolute;width:1px;height:4px;left:4px;top:3px;background:#87919d}.console{position:absolute;left:48px;right:48px;bottom:24px;background:linear-gradient(125deg,#171a1de8,#0e1114ed);border:1px solid #ffffff20;border-radius:12px;backdrop-filter:blur(24px);box-shadow:0 20px 60px #0007}.console-top{height:41px;padding:0 24px;display:flex;align-items:center;justify-content:space-between;font-size:10px;letter-spacing:1.4px;border-bottom:1px solid var(--line);color:#818991}.live-status{display:flex;gap:9px;align-items:center;color:#d0cec3}.signal{width:5px;height:5px;border-radius:50%;background:var(--gold);box-shadow:0 0 9px #ffc64066}.console-id{font-size:9px}.console-body{display:grid;grid-template-columns:1.1fr .85fr 1fr;align-items:center;padding:20px 24px;gap:28px}.form-controls{display:flex;flex-direction:column;gap:9px}.segmented{display:flex;border:1px solid #ffffff1f;border-radius:5px;background:#080a0b;padding:3px;width:180px}.segmented button{flex:1;background:none;border-radius:3px;padding:5px 10px;font-size:12px;color:#8e959d}.segmented button[aria-pressed=true]{color:#f2f0e8;background:#24282b}.transform{display:flex;align-items:center;gap:11px;background:var(--gold);color:#161410;border-radius:5px;font-size:14px;font-weight:700;padding:13px 14px;min-height:47px;text-align:left;box-shadow:0 0 30px #ffc64008}.transform:hover:not(:disabled){background:#ffda7c;color:#0a0a0a;box-shadow:0 0 28px #ffc64026}.transform-symbol{font-size:24px;line-height:1}.duration{margin-left:auto;padding-left:10px;font-size:11px;color:#786127;border-left:1px solid #5b431943}.assembly-controls{border-left:1px solid var(--line);border-right:1px solid var(--line);padding:5px 28px}.assembly{display:flex;gap:11px;align-items:center;width:100%;background:none;padding:9px 0;font-size:14px;white-space:nowrap}.assembly>span:first-child{font-size:27px;line-height:1;color:#a5a9ac}.state-indicator{margin-left:auto;width:7px;height:7px;border-radius:50%;background:#3c4248}.assembly[aria-pressed=true] .state-indicator{background:var(--gold);box-shadow:0 0 10px #ffc64066}.assembly[aria-pressed=true]{color:var(--gold)}.separation{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;margin-top:12px;color:#8b939b;font-size:11px}input[type=range]{accent-color:var(--gold);width:100%;min-width:30px;height:3px;cursor:pointer}.separation output{font-variant-numeric:tabular-nums;min-width:28px;font-size:10px}.finish-label{display:flex;justify-content:space-between;gap:10px;align-items:center;font-size:10px;letter-spacing:1.2px;color:#8c939b}.finish-label strong{font-size:11px;letter-spacing:0;font-weight:400;color:#c8cace}.swatches{display:flex;gap:12px;align-items:center;margin-top:20px}.swatches button,.custom-color{position:relative;width:28px;height:28px;border:3px solid #15181b;border-radius:50%;background:var(--color);box-shadow:0 0 0 1px #ffffff14}.swatches button:before{content:"";position:absolute;inset:0;border-radius:50%;background:linear-gradient(145deg,#ffffff48,transparent 65%,#0004)}.swatches button[aria-pressed=true]{box-shadow:0 0 0 1px var(--color),0 0 0 4px #ffc64015}.custom-color{border:1px solid #4e555d;background:none;display:grid;place-items:center;cursor:pointer;overflow:hidden}.custom-color input{position:absolute;opacity:0;width:100%;height:100%;cursor:pointer}.custom-color span{font-size:18px;color:#979ea5;pointer-events:none}.console-bottom{display:flex;align-items:center;gap:18px;border-top:1px solid var(--line);padding:12px 24px;color:#7e8790;font-size:9px;letter-spacing:1.2px}.sequence-track{height:2px;background:#ffffff0c;flex:1}.sequence-track i{display:block;width:0;height:100%;background:var(--gold);box-shadow:0 0 8px #ffc64040}.sequence-number{font-variant-numeric:tabular-nums;min-width:65px;text-align:right}footer{height:40px;padding:0 48px;display:flex;justify-content:space-between;align-items:center;color:#555f68;font-size:9px;letter-spacing:1.3px;border-top:1px solid #ffffff08}footer i{font-style:normal;padding:0 8px;color:#8b7845}#loading{position:absolute;inset:0;background:#090b0d;z-index:30;display:flex;align-items:center;justify-content:center;flex-direction:column;transition:opacity .6s,visibility .6s}.load-symbol{font-family:Barlow Condensed,Impact,sans-serif;font-size:60px;color:var(--gold);letter-spacing:4px}#loading h2{font-size:18px;font-weight:500;color:#aeb4b9;margin:20px 0 26px}#loading p{font-size:12px;color:#757f89}.loading-track{width:220px;height:2px;background:#ffffff14}.loading-track i{height:100%;width:5%;background:var(--gold);display:block;transition:width .2s}#loading.finished{opacity:0;visibility:hidden;pointer-events:none}#retry{background:var(--gold);color:#111;border-radius:4px;padding:10px 24px;margin-top:12px}#hotspots{position:absolute;inset:0;pointer-events:none}.hotspot{position:absolute;width:22px;height:22px;border-radius:50%;border:1px solid #ffdd8680;background:#16181480;box-shadow:0 0 0 5px #ffc64009;color:#ffda84;pointer-events:auto;display:grid;place-items:center;font-size:16px;line-height:1;transform:translate(-50%,-50%)}.hotspot:after{content:attr(data-label);position:absolute;left:30px;white-space:nowrap;font-size:10px;letter-spacing:1px;padding:5px 7px;background:#0d1015d9;color:#bfc4c8;opacity:0;transition:opacity .2s;pointer-events:none}.hotspot:hover:after,.hotspot:focus-visible:after{opacity:1}.inspection{position:absolute;left:48px;top:20%;width:280px;padding:24px;border:1px solid #ffffff22;border-radius:8px;background:#0d1116ee;backdrop-filter:blur(20px)}.inspection>span{font-size:10px;letter-spacing:2px;color:var(--gold)}.inspection h2{font:600 40px Barlow Condensed,Impact,sans-serif;margin:18px 0 12px}.inspection p{color:#a7afb7;font-size:14px;line-height:1.65}.inspection button{background:none;text-align:left;color:#d5c89d;font-size:12px;padding:10px 0}#close-inspection{position:absolute;top:12px;right:16px;font-size:22px;padding:0}.inspecting .intro{opacity:0}@media(min-width:1600px){.console{max-width:1340px;left:50%;right:auto;width:calc(100% - 96px);transform:translate(-50%)}.intro{left:max(48px,calc((100vw - 1480px)/2))}}@media(max-width:1100px){.masthead{padding:0 28px}.intro{left:28px}h1{font-size:78px}.console{left:28px;right:28px}.console-body{gap:18px;padding:18px}.assembly-controls{padding:5px 18px}.swatches{gap:9px}.view-tools{right:24px}.console-id{display:none}.finish-label{align-items:flex-start;flex-direction:column;gap:4px}.swatches{margin-top:14px}.view-tools button{min-width:82px;padding:10px}.view-hint{left:60%;bottom:232px}footer{padding:0 28px}}@media(max-width:760px){.masthead{height:66px;padding:0 20px}.brand{font-size:9px;gap:9px}.brand-icon{font-size:28px;padding-right:9px}.brand-icon span{font-size:9px}.chapter{display:none}.quiet{font-size:12px}main{height:calc(100svh - 96px);min-height:700px}.ambient{background:linear-gradient(0deg,#090b0d 24%,transparent 48%)}.intro{left:22px;top:24px}.eyebrow{font-size:9px;letter-spacing:1.3px;gap:6px}.eyebrow i{width:10px}h1{font-size:51px;margin:17px 0 0;line-height:.88}.intro p,.hero-meta{display:none}.view-tools{top:26px;right:18px;gap:7px}.view-tools button{min-width:44px;width:44px;display:flex;justify-content:center;padding:7px;height:42px;background:#0c10148a}.view-tools button>span:not(.tool-icon),.view-tools i{display:none}.tool-icon{font-size:25px}.console{left:14px;right:14px;bottom:10px;border-radius:9px}.console-top{height:32px;padding:0 14px;font-size:8px;letter-spacing:.8px}#part-count{font-size:8px;max-width:132px;text-align:right}.console-body{grid-template-columns:1fr 1fr;gap:15px;padding:13px 14px}.form-controls{grid-column:1/-1;display:grid;grid-template-columns:128px 1fr;align-items:center;gap:12px}.segmented{width:128px;height:39px}.segmented button{font-size:11px;padding:5px}.transform{font-size:12px;padding:9px 10px;gap:7px;min-height:39px}.transform-symbol{font-size:21px}.duration{font-size:9px;padding-left:7px}.assembly-controls{border-left:0;border-right:1px solid var(--line);padding:0 14px 0 0}.assembly{font-size:12px;gap:8px;padding:4px 0}.assembly>span:first-child{font-size:23px}.separation{gap:7px;font-size:9px;margin-top:13px}.separation label{display:none}.finish-label{font-size:8px;gap:3px}.finish-label strong{font-size:10px}.swatches{gap:8px;margin-top:10px}.swatches button,.custom-color{width:22px;height:22px;flex-shrink:0;border-width:2px}.custom-color{border-width:1px}.console-bottom{padding:9px 14px;font-size:8px;gap:10px}.sequence-number{min-width:56px}.view-hint{left:50%;bottom:243px;font-size:8px;gap:7px;letter-spacing:1px}.inspection{left:20px;top:22px;width:235px;padding:18px}.inspection h2{font-size:30px;margin:12px 0}.inspection p{font-size:12px}.hotspot{width:19px;height:19px;font-size:14px}footer{height:30px;padding:0 20px;font-size:7px;letter-spacing:.8px}footer>span:last-child{display:none}}@media(max-width:380px){.swatches{gap:5px}.transform{font-size:11px}.duration{display:none}.console-body{gap:12px}.form-controls{grid-template-columns:115px 1fr}.segmented{width:115px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}.view-tools button,.segmented button,.separation,.inspection button{font-size:14px}.console-top,.console-bottom,.finish-label,.finish-label strong,.hero-meta,.view-hint,footer{font-size:12px}.view-tools i,.duration,.separation output{font-size:12px}@media(max-width:760px){.console-top,.console-bottom,.finish-label,.finish-label strong,.view-hint,footer{font-size:10px}.console-id,#part-count{display:none}.transform,.assembly,.segmented button{font-size:13px}.swatches{gap:7px}.view-hint{bottom:253px}}.view-hint{bottom:255px}main{height:100svh}.console{background:#0e12177a;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:none;border-color:#ffffff14;--line:#ffffff12}.console-top,.console-bottom{background:transparent}.segmented{background:#080a0b40;border-color:#ffffff12}.segmented button[aria-pressed=true]{background:#ffffff0e}@media(max-width:760px){.view-tools{gap:6px}.view-tools button{height:38px}}main{display:grid;grid-template-columns:320px minmax(0,1fr);grid-template-rows:1fr;gap:0;padding:0;height:100svh;min-height:720px}#viewport{position:relative;inset:auto;grid-area:1 / 2;min-width:0;min-height:0;width:100%;height:100%}.console{position:relative;grid-area:1 / 1;inset:auto;align-self:end;margin:350px 18px 24px;width:auto;max-width:none;transform:none;background:#0e12177a}.console-top{padding:14px;height:auto;font-size:10px}.console-id,#part-count{display:none}.console-body{display:flex;flex-direction:column;align-items:stretch;padding:16px;gap:20px}.form-controls{display:flex;flex-direction:column}.segmented{width:100%}.assembly-controls{border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 0}.finish-label{flex-direction:row}.swatches{justify-content:space-between}.console-bottom{padding:12px;font-size:9px;gap:8px}.intro{left:32px;top:36px}.intro h1{font-size:76px}.intro .eyebrow{font-size:10px}.hero-meta{margin-top:20px;font-size:10px}.ambient,.view-hint{display:none}.view-tools{right:18px;top:50%;transform:translateY(-50%);gap:7px}.view-tools button{padding:8px;min-width:95px}@media(max-width:760px){main{height:auto;min-height:0;display:flex;flex-direction:column;overflow:visible}#viewport{height:100svh;min-height:560px;flex:none;bottom:auto}.console{align-self:stretch;margin:0 14px 18px;flex:none}.console-body{display:grid;grid-template-columns:1fr 1fr;gap:16px}.form-controls{grid-column:1/-1}.assembly-controls{border:0;padding:0}.finish-label{flex-direction:column}.intro{top:24px;left:20px}.intro h1{font-size:51px}.view-tools button{min-width:44px}}main{background:radial-gradient(ellipse at 0% 65%,#244b4930,transparent 34%),#090b0d}.console{background:linear-gradient(135deg,#b9e9e90d,#151c232b);border-color:#c8f4ff24;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:inset 0 1px #ffffff12,0 12px 40px #00000014}.intro{left:28px;top:32px;width:264px}.title-code{margin-top:24px;font:600 13px var(--font);letter-spacing:3px;color:#ffce61;display:flex;align-items:center;justify-content:space-between}.title-code>span{font-size:8px;letter-spacing:1px;color:#748a90}.intro h1{font-size:80px;font-style:italic;font-weight:800;line-height:.88;letter-spacing:1px;margin:22px 0;position:relative}.intro h1 .title-outline{color:transparent;-webkit-text-stroke:1px #e2f6ffab;text-shadow:0 0 24px #8ddfff16;display:block}.intro h1 .title-gold{display:block;font-size:118px;letter-spacing:3px;color:#ffca47;text-shadow:0 0 28px #ffbd342e}.intro h1 .title-dot{display:inline;color:#edfff8;text-shadow:0 0 18px #77ffe9aa}.intro h1:after{content:"";display:block;width:54px;height:3px;background:#ffc640;margin-top:21px;box-shadow:64px 0 #ffc64030,82px 0 #ffc64014}.intro p{font-size:13px;letter-spacing:.2px}.intro .hero-meta{margin-top:18px;gap:12px;font-size:9px}@media(max-width:760px){.intro{width:150px;left:20px;top:24px}.title-code{margin-top:12px;font-size:10px}.title-code>span{display:none}.intro h1{font-size:44px;margin:14px 0}.intro h1 .title-gold{font-size:66px}.intro h1:after{margin-top:14px;width:32px}}main{background:none}.console{background:linear-gradient(135deg,#24323b70,#10161c80);border:1px solid #d4e2ee24;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:inset 0 1px #ffffff12}.intro{top:44px;left:28px;width:280px}.franchise-title{font:700 22px Barlow Condensed,Impact,sans-serif;letter-spacing:4px;color:#cbd3d7;margin-bottom:23px}.intro .eyebrow{font-size:10px;letter-spacing:1.7px;color:#bbae87}.intro h1{font-family:Barlow Condensed,Impact,sans-serif;font-size:96px;line-height:.86;font-style:normal;font-weight:800;letter-spacing:-1px;margin:28px 0 24px;filter:drop-shadow(0 4px 0 #020304) drop-shadow(0 10px 18px #0008)}.intro h1>span{display:block;background-clip:text;-webkit-background-clip:text;color:transparent}.steel-title{background-image:linear-gradient(#fafcfc 4%,#9aa8b1 44%,#eff5f8 49%,#67757e 53%,#c6d0d5 85%)}.gold-title{font-size:134px;letter-spacing:3px;background-image:linear-gradient(#ffeab1,#ffc33d 46%,#a86613 49%,#ffcc4d 57%,#e29e22);margin-top:5px}.intro h1:after{display:none}.title-rule{height:3px;width:234px;background:linear-gradient(90deg,#ffc640 0 25%,#ffc64033 25% 90%,transparent 90%);margin-bottom:20px;clip-path:polygon(0 0,100% 0,98% 100%,0 100%)}.intro p{font-size:14px}.intro .hero-meta{margin-top:22px}.inspecting .intro{opacity:1}.inspecting .console{opacity:0;pointer-events:none;transform:translateY(12px)}.inspection{left:28px;top:42%;z-index:6}@media(max-width:760px){#viewport{position:relative;inset:auto;height:100svh;min-height:560px}.intro{top:25px;left:20px;width:165px}.franchise-title{font-size:14px;letter-spacing:2px;margin-bottom:12px}.intro .eyebrow{font-size:8px;letter-spacing:1px}.intro h1{font-size:54px;margin:18px 0}.gold-title{font-size:78px}.title-rule{width:140px}.view-tools{top:26px;transform:none}}.inspection{left:auto;right:clamp(28px,7vw,110px);top:58%;transform:translateY(-50%)}.inspection.detail-left{left:clamp(28px,7vw,110px);right:auto}.inspection.detail-right{left:auto;right:clamp(28px,7vw,110px)}@media(max-width:760px){.inspection{left:20px;right:auto;top:38%;transform:none;width:235px}}@media(min-width:1200px){#viewport{inset:0 clamp(28px,5vw,96px)}.intro{left:calc(clamp(28px,5vw,96px) + 28px)}.view-tools{right:calc(clamp(28px,5vw,96px) + 18px)}.console{margin-left:calc(clamp(28px,5vw,96px) + 18px);margin-right:18px}}main{display:block;position:relative;background:#090b0d}#viewport{position:absolute;inset:0;width:100%;height:100%;grid-area:auto}.console{position:absolute;left:28px;right:auto;bottom:24px;width:min(450px,calc(100% - 56px));margin:0;z-index:4}@media(min-width:1200px){.console{left:clamp(28px,5vw,96px);width:min(450px,calc(100% - 56px))}}@media(max-width:760px){main{display:flex;flex-direction:column;min-height:0;height:auto}.console{position:relative;left:auto;right:auto;bottom:auto;width:auto;margin:0 14px 18px;z-index:4}#viewport{position:relative;inset:auto;width:100%;height:100svh;min-height:560px;flex:none}}@media(max-width:760px){.inspection.detail-left,.inspection.detail-right{left:20px;right:auto;top:38%;transform:none}}.view-tools{gap:14px}@media(max-width:760px){.view-tools{gap:8px}}.inspecting .console{opacity:1;pointer-events:auto;transform:none}.author-link{position:fixed;top:24px;right:28px;z-index:20;display:inline-flex;align-items:center;gap:10px;padding:11px 15px;border:1px solid #ffffff20;border-radius:6px;background:#0c1014aa;backdrop-filter:blur(12px);color:#bfc4c8;text-decoration:none!important;font-size:11px;letter-spacing:1.4px;transition:.2s}.author-link strong{color:#e9e6db;font-weight:500}.author-link span{color:var(--gold);font-size:16px}.author-link:hover{color:var(--gold);border-color:#ffc6406b}.hotspot{animation:hotspot-pulse 1.5s ease-in-out infinite}@keyframes hotspot-pulse{0%,to{transform:translate(-50%,-50%) scale(1);box-shadow:0 0 0 5px #ffc64012}50%{transform:translate(-50%,-50%) scale(1.2);box-shadow:0 0 0 12px #ffc6402b}}
