:root{color-scheme:dark;--bg:#10151b;--line:#ffffff12;--text:#ecf1f5;--muted:#8e9ba9;--blue:#91bce0;--font:'Segoe UI Variable','Aptos','Segoe UI',sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.5 var(--font);height:100dvh;display:grid;grid-template-rows:74px minmax(0,1fr) 78px;overflow:hidden}button,a,input{font:inherit}button,a{color:inherit}button{cursor:pointer;border:1px solid var(--line);background:#ffffff06;border-radius:10px;padding:8px 12px}button:hover{background:#ffffff10;border-color:#ffffff25}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--blue);outline-offset:3px}button:disabled{opacity:.45;cursor:default}a{text-decoration:none}[hidden]{display:none!important}
.topbar{display:flex;justify-content:space-between;align-items:center;padding:0 28px;border-bottom:1px solid var(--line);gap:20px}.brand{display:flex;align-items:center;gap:12px;font-weight:650}.brand small{display:block;font-size:9px;letter-spacing:1.5px;font-weight:500;color:var(--muted);margin-top:2px}.mark{display:grid;place-items:center;width:39px;height:39px;border:1px solid #7797b63d;background:linear-gradient(130deg,#53769344,#22334433);border-radius:12px;color:#c6e1f7;font-size:13px}.view-modes{display:flex;background:#ffffff06;border:1px solid var(--line);padding:4px;border-radius:99px;gap:3px}.view-modes button{border:0;border-radius:99px;padding:7px 17px;font-size:12px;color:var(--muted);background:transparent}.view-modes button.active{background:#d5e5f21c;color:var(--text);box-shadow:inset 0 1px #ffffff12}.top-actions{display:flex;align-items:center;gap:10px}.download{padding:10px 15px;background:#bdd9ed;color:#1a2a37;border-radius:11px;font-size:12px;font-weight:650}.download span{margin-left:12px}
main{min-height:0;display:grid;grid-template-columns:268px minmax(0,1fr)}.navigator{padding:28px 22px 20px;border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#ffffff20 transparent}.eyebrow{color:#7d94a7;font-size:9px;letter-spacing:1.6px;font-weight:600}.design-meta h1{margin:7px 0 6px;font-size:23px;line-height:1.15;letter-spacing:-.8px}.design-meta p{margin:0;color:var(--muted);font-size:11px}.side-heading{display:flex;align-items:center;justify-content:space-between;margin:30px 0 10px}.side-heading h2{font-size:12px;font-weight:600;margin:0}.side-heading button{font-size:10px;padding:3px 7px;border:0;color:var(--muted)}.group-list{display:grid;gap:3px}.group-row{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:7px 9px;border-radius:9px;cursor:pointer;font-size:11px;color:#c4cdd7}.group-row:hover{background:#ffffff06}.group-row input{width:13px;height:13px;margin:0;accent-color:#9ac4e4}.group-row small{font-size:9px;color:#6a7b8e}.group-row .swatch{display:inline-block;width:6px;height:6px;border-radius:2px;margin-right:7px;vertical-align:middle}.side-tools{margin-top:22px;padding-top:20px;border-top:1px solid var(--line)}.side-tools>label:first-child{display:flex;justify-content:space-between;font-size:11px}.side-tools output{color:var(--muted)}input[type=range]{width:100%;height:4px;accent-color:#a7c8df;cursor:pointer}.side-tools input[type=range]{margin:14px 0 17px}.toggle{display:flex;align-items:center;gap:9px;font-size:11px;color:var(--muted);margin:10px 0}.toggle input{accent-color:#a7c8df}.side-bottom{margin-top:auto;padding-top:25px}.side-bottom button{width:100%;text-align:left;font-size:10px;padding:10px;background:#7caccb0d;border-color:#7caccb29}.side-bottom button span{float:right}.side-bottom p{font-size:10px;line-height:1.5;color:#738494;margin:9px 0 12px}.side-bottom a{font-size:10px;color:#a6bfd3}
.viewport{position:relative;min-width:0;min-height:0;background:radial-gradient(ellipse at 50% 47%,#293744 0%,#1a242e 55%,#131c24 100%)}canvas{display:block;width:100%;height:100%;touch-action:none}.viewport-caption{position:absolute;left:30px;top:25px;pointer-events:none}.viewport-caption span{display:block;font-size:12px;color:#b6c6d4}.viewport-caption small{display:block;margin-top:4px;font-size:8px;letter-spacing:1.1px;color:#718596}.camera-controls{position:absolute;right:24px;top:22px;display:flex;gap:5px}.camera-controls button{font-size:10px;padding:6px 9px;background:#10192380;backdrop-filter:blur(12px)}.viewport-footer{position:absolute;bottom:20px;left:28px;right:28px;display:flex;justify-content:space-between;color:#7b90a2;font-size:10px;pointer-events:none}.inspection{position:absolute;right:24px;top:76px;width:300px;padding:22px;background:#101820eF;border:1px solid #ffffff18;border-radius:18px;box-shadow:0 18px 60px #0005;backdrop-filter:blur(20px)}.inspection .close{position:absolute;right:10px;top:8px;border:0;background:transparent;color:var(--muted);font-size:19px}.inspection h2{font-size:19px;line-height:1.2;letter-spacing:-.5px;margin:9px 0 18px;max-width:240px}.inspection dl{margin:0}.inspection dl>div{display:flex;justify-content:space-between;gap:15px;padding:7px 0;border-top:1px solid var(--line);font-size:10px}.inspection dt{color:var(--muted)}.inspection dd{margin:0;text-align:right}.inspection p{font-size:10px;color:#899aa9;line-height:1.55;margin:15px 0}.inspection>div{display:flex;gap:7px}.inspection>div button{font-size:11px;flex:1}.load-state{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;background:#141d26;z-index:3}.load-state strong{font-size:17px;margin-top:17px}.load-state p{font-size:12px;color:var(--muted)}.spinner{width:27px;height:27px;border:2px solid #ffffff10;border-top-color:#9dc3df;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.notice{position:absolute;bottom:60px;left:50%;transform:translateX(-50%);max-width:560px;width:calc(100% - 50px);padding:12px 18px;border:1px solid #abc6df30;background:#101923eF;border-radius:13px;font-size:11px;box-shadow:0 10px 35px #0004}
.assembly-timeline{display:flex;align-items:center;gap:18px;border-top:1px solid var(--line);padding:0 28px;background:#10161c}.assembly-timeline>button{width:35px;height:35px;padding:0;font-size:13px}.stage-description{min-width:255px}.stage-description>span{display:block;font-size:8px;letter-spacing:1.4px;color:#6e8496}.stage-description strong{font-size:12px;font-weight:500}.assembly-timeline input{flex:1;margin-inline:25px}.assembly-timeline output{font-size:11px;min-width:48px;color:var(--muted)}#dimensionOverlay{position:absolute;inset:0;pointer-events:none}.dimension-label{position:absolute;transform:translate(-50%,-50%);font:10px Consolas,monospace;padding:4px 7px;background:#102132e6;border:1px solid #a4ccea44;border-radius:5px;color:#cce4f5;white-space:nowrap}
@media(max-width:1050px){.topbar{padding-inline:18px}.brand small{display:none}.view-modes button{padding-inline:12px}.download{font-size:11px}main{grid-template-columns:228px minmax(0,1fr)}.navigator{padding:22px 16px}.stage-description{min-width:210px}.assembly-timeline{padding:0 18px;gap:10px}.assembly-timeline input{margin-inline:5px}.viewport-footer span:first-child{display:none}}
@media(max-width:720px){body{grid-template-rows:110px minmax(0,1fr) 82px}.topbar{flex-wrap:wrap;align-content:center;gap:10px}.view-modes{order:3;width:100%;justify-content:center}.brand{font-size:13px}.top-actions{margin-left:auto}.download{padding:8px}.top-actions>button{display:none}main{grid-template-columns:1fr}.navigator{position:absolute;z-index:2;top:125px;left:12px;width:166px;max-height:calc(100dvh - 230px);background:#101820e6;border:1px solid var(--line);border-radius:14px;padding:14px;backdrop-filter:blur(15px)}.design-meta h1{font-size:17px}.side-heading{margin-top:15px}.side-tools{margin-top:12px;padding-top:10px}.side-bottom,.design-meta p,.eyebrow{display:none}.group-row{font-size:10px;padding:4px 0;gap:6px}.group-row small{font-size:8px}.viewport-caption{display:none}.camera-controls{right:12px;top:16px;flex-direction:column}.inspection{right:12px;top:200px;width:220px;padding:17px;z-index:3}.assembly-timeline{gap:9px;flex-wrap:wrap;align-content:center}.stage-description{min-width:0;flex:1}.assembly-timeline input{order:5;flex-basis:100%;margin:2px 0 0}.assembly-timeline output{display:none}.viewport-footer{left:auto;right:15px;bottom:12px}}
.component-tree{border:1px solid var(--line);border-radius:11px;padding:10px}.component-tree summary{font-size:11px;cursor:pointer}.component-tree summary span{float:right;color:var(--muted);font-size:9px;padding-top:2px}.component-tree .group-list{margin-top:9px;max-height:240px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#ffffff20 transparent}.component-tree .group-row{padding-inline:0}.design-meta #snapshotState{font-size:10px;margin-top:10px;color:#b9a077}.inspection{max-height:calc(100% - 125px);overflow-y:auto;scrollbar-width:thin}#mobileControls{display:none}
@media(max-width:720px){.navigator{display:none;top:170px}.navigator.mobile-open{display:flex}#mobileControls{display:block;position:absolute;z-index:2;left:12px;top:15px;font-size:11px;background:#101820e6}.component-tree .group-list{max-height:200px}.camera-controls{top:60px}.inspection{top:75px;max-height:calc(100% - 115px)}}
@media(min-width:721px) and (max-height:800px){.navigator{padding:20px 18px 16px}.side-heading{margin-top:18px}.side-tools{margin-top:16px;padding-top:14px}.side-bottom{padding-top:16px}.design-meta h1{font-size:21px}.side-bottom p{margin-bottom:8px}}
@media(prefers-reduced-motion:reduce){.spinner{animation:none}}