@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#0c1118;--panel:#111821;--line:#27313c;--text:#edf3f7;--muted:#a1afbd;--accent:#b6f76b}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:16px 'DM Sans',sans-serif}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}header{height:76px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 32px;gap:20px}.brand{font:600 16px 'Space Grotesk',sans-serif;letter-spacing:1.4px;text-decoration:none;color:var(--text);display:flex;align-items:center;gap:13px}.brandmark{font-size:36px;color:var(--accent)}.edition{font-size:12px;color:var(--muted);letter-spacing:1px}.header-note{font-size:14px;color:var(--muted)}main{display:grid;grid-template-columns:minmax(0,1fr) 355px;height:calc(100dvh - 76px);min-height:680px}.workspace{position:relative;overflow:hidden;background:radial-gradient(ellipse at 55% 47%,#233342 0%,#121c28 42%,#0c1118 80%)}.intro{position:absolute;top:35px;left:36px;pointer-events:none;z-index:2}.eyebrow{font-size:12px;letter-spacing:2px;color:var(--accent);font-weight:600}h1{font:500 clamp(26px,3vw,45px)/1.13 'Space Grotesk',sans-serif;letter-spacing:-1.8px;margin:15px 0 12px}h1 span{color:#90a0af}.intro p{font-size:14px;color:var(--muted);margin:0}.view-tag{position:absolute;right:27px;top:39px;font-size:12px;letter-spacing:1px;color:var(--muted);display:flex;align-items:center;gap:9px;z-index:2}.dot{width:6px;height:6px;background:var(--accent);border-radius:50%}.divider{color:#435160}#viewport{position:absolute;inset:0 0 130px}canvas{display:block;touch-action:none}#loading{position:absolute;top:50%;left:0;width:100%;text-align:center;color:var(--muted);padding:24px}#tooltip{position:absolute;z-index:5;background:#0b111fee;border:1px solid #7d9a56;padding:8px 12px;border-radius:7px;font-size:13px;pointer-events:none}.view-controls{position:absolute;left:30px;bottom:156px;display:flex;gap:8px}.view-controls button{border:1px solid #344351;background:#111b25cc;color:#c4d0da;padding:9px 13px;border-radius:6px;font-size:13px}.stage-foot{position:absolute;bottom:124px;left:32px;right:32px;display:flex;justify-content:space-between;font-size:10px;letter-spacing:1.2px;color:#8092a3}.stage-foot b{margin:0 10px;font-weight:400}.animation-controls{position:absolute;bottom:22px;left:32px;right:32px;border:1px solid #34404c;background:#141e28e8;border-radius:12px;display:flex;align-items:center;gap:28px;padding:18px 21px;backdrop-filter:blur(12px)}.primary{background:var(--accent);color:#17220b;border:0;padding:15px 21px;font-weight:700;border-radius:7px;white-space:nowrap}.primary span{font-size:21px;margin-right:8px}.primary:hover{background:#ccff98}.scrub{flex:1}.scrub label{display:flex;justify-content:space-between;font-size:13px;color:#d8e1e9}output{color:var(--accent);font-variant-numeric:tabular-nums}input[type=range]{width:100%;accent-color:var(--accent);cursor:pointer;height:17px;margin:7px 0 0}.range-labels{display:flex;justify-content:space-between;font-size:11px;color:var(--muted)}aside{border-left:1px solid var(--line);background:var(--panel);padding:27px 24px;overflow:auto}.aside-heading{display:flex;align-items:center;justify-content:space-between}.count{color:var(--muted);font-size:12px;border:1px solid var(--line);padding:5px 8px;border-radius:5px}h2{font:500 28px/1.12 'Space Grotesk',sans-serif;letter-spacing:-.7px;margin:26px 0 13px}.muted{color:var(--muted);line-height:1.7;font-size:15px}.build-summary{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0;gap:22px;margin:25px 0}.build-summary strong{font:500 24px 'Space Grotesk',sans-serif;display:block}.build-summary span{font-size:12px;color:var(--muted);display:block;margin-top:5px}.component-heading{display:flex;justify-content:space-between;font-size:12px;letter-spacing:1px;color:#c3ced8;margin:25px 0 12px}.component-heading span{font-size:10px;color:#8b9bab}#parts{display:grid;gap:5px}.part{display:flex;align-items:center;gap:12px;background:transparent;border:1px solid transparent;border-radius:7px;text-align:left;padding:11px 8px;color:var(--text);width:100%;font-size:14px}.part:hover{background:#1b2633}.part.active{background:#233024;border-color:#647d44}.part .num{font-size:11px;color:#8394a3;font-variant-numeric:tabular-nums;min-width:19px}.part .symbol{color:var(--accent);font-size:21px;width:25px;text-align:center}.part small{display:block;color:var(--muted);font-size:11px;margin-top:4px}.part .chevron{margin-left:auto;color:#788997}.model-note{font-size:12px;line-height:1.6;color:#8797a8;border-top:1px solid var(--line);margin-top:23px;padding-top:17px}.detail-type{font-size:12px;letter-spacing:1.5px;color:var(--accent);margin:24px 0 0}.detail-title{margin:9px 0 10px}.detail-model{font-size:14px;color:#d3dee8;margin:0 0 17px;line-height:1.5}.detail-body{font-size:15px;line-height:1.65;color:#abbac8}.detail-section{font-size:12px;letter-spacing:1.2px;color:var(--accent);margin:23px 0 8px}.specs{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:6px;overflow:hidden;margin:20px 0}.specs div{padding:12px;background:#16212d;font-size:15px}.specs small{display:block;color:#94a7b6;font-size:11px;margin-bottom:6px}.source{color:var(--accent);font-size:13px;text-underline-offset:4px}.detail-top{display:flex;justify-content:space-between;align-items:center}.close{background:transparent;color:var(--muted);border:1px solid var(--line);border-radius:5px;padding:4px 9px;margin-top:20px}.label3d{position:absolute;border:1px solid #526478;background:#111c28df;color:#dce9f5;border-radius:4px;font:11px 'DM Sans',sans-serif;padding:5px 7px;cursor:pointer;transform:translate(-50%,-50%);white-space:nowrap}.label3d:hover,.label3d.selected{color:var(--accent);border-color:var(--accent)}@media(min-width:1500px){main{grid-template-columns:minmax(0,1fr) 390px}}@media(max-width:1100px){.view-tag{top:22px;right:20px}.intro{top:55px;left:25px}.intro p{max-width:190px}.stage-foot span:last-child{display:none}main{grid-template-columns:minmax(0,1fr) 320px}.animation-controls{gap:15px;left:20px;right:20px;padding:15px}.primary{padding:13px}.edition{display:none}}@media(max-width:760px){header{height:61px;padding:0 18px}.header-note{display:none}.brand{font-size:14px}main{display:block;height:auto;min-height:0}.workspace{height:720px;max-height:90dvh;min-height:580px}.intro{top:52px;left:20px}h1{font-size:29px}.intro p{display:none}.view-tag{left:20px;right:auto;top:19px;font-size:10px}aside{border-left:0;border-top:1px solid var(--line);overflow:visible;padding:25px 22px}.stage-foot{font-size:9px;left:20px;right:20px;bottom:126px}.stage-foot b{margin:0 5px}.animation-controls{left:15px;right:15px;gap:17px}.primary{font-size:14px}.primary span{display:none}.view-controls{left:20px}.build-summary{grid-template-columns:repeat(4,1fr);gap:10px}.build-summary strong{font-size:20px}#parts{grid-template-columns:1fr 1fr}.part{padding:9px 4px}.part .symbol{display:none}.part small{font-size:10px}.label3d{font-size:10px}}