:root{font-family:Inter,'Segoe UI',Arial,sans-serif;color:#20333e;background:#f5f7f8;font-synthesis:none;--ink:#172c38;--muted:#687c88;--line:#dde4e8;--accent:#007e78;--pale:#e9f5f2}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select{outline-offset:4px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent)}button{cursor:pointer;color:inherit;border:1px solid var(--line);background:#fff;border-radius:7px;padding:9px 12px;font-size:12px;font-weight:600;transition:background .15s}button:hover{background:#edf3f4}button:disabled{opacity:.4;cursor:default}button[aria-pressed=true]{color:var(--accent);border-color:#b1d6cf;background:var(--pale)}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}[hidden]{display:none!important}.topbar{height:64px;display:flex;align-items:center;gap:24px;padding:0 28px;background:var(--ink);color:#f4f8fa}.brand{font-size:25px;font-weight:400;letter-spacing:-1px;display:flex;align-items:center;color:#fff;gap:0}.brand:hover{text-decoration:none}.brand>span:last-child{font-weight:650}.brand-icon{width:31px;height:31px;border:1px solid #66b7ae;display:grid;place-items:center;margin-right:10px;border-radius:8px;color:#72d6c4;font-weight:700}.divider{height:22px;width:1px;background:#40505a}.product{font-size:10px;letter-spacing:2.2px;color:#a5bdc8;font-weight:650}.top-actions{margin-left:auto;display:flex;gap:9px}.top-actions button{background:#263c49;border-color:#3e5461;color:#dce7eb}.top-actions button:hover{background:#344e5d}.projectbar{height:99px;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:18px 28px;border-bottom:1px solid var(--line)}.eyebrow{font-size:9px;font-weight:700;letter-spacing:1.6px;color:var(--muted)}h1{font-size:27px;letter-spacing:-.9px;margin:6px 0 0;font-weight:650}h1 span{font-size:12px;color:var(--muted);font-weight:400;margin-left:12px;letter-spacing:0}.project-meta{display:flex;align-items:center;gap:15px;font-size:12px;color:var(--muted)}.status{display:inline-block;border:1px solid #efd7ae;border-radius:20px;padding:7px 11px;font-size:10px;font-weight:650;background:#fff7e8;color:#906024}.status.released{background:var(--pale);border-color:#b1d6cf;color:#126d59}.studio{height:calc(100dvh - 194px);min-height:560px;display:grid;grid-template-columns:258px minmax(340px,1fr) 310px}.navigator,.inspector{background:#fff;overflow:auto;scrollbar-width:thin}.navigator{border-right:1px solid var(--line)}.nav-tabs{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--line);padding:0 15px}.nav-tabs button{border:0;border-radius:0;background:none;height:49px;font-size:11px;border-bottom:2px solid transparent;color:var(--muted)}.nav-tabs button[aria-selected=true]{border-bottom-color:var(--accent);color:var(--accent)}.nav-intro{padding:23px 22px 14px}.nav-intro p{font-size:11px;color:var(--muted);margin:7px 0}.overview,.step-button{display:flex;gap:11px;align-items:center;text-align:left;width:calc(100% - 24px);margin:3px 12px;border:1px solid transparent;padding:13px 11px;background:none}.overview.selected,.step-button.selected{background:var(--pale);border-color:#c7e2da}.step-number{flex-shrink:0;display:grid;place-items:center;width:29px;height:29px;border:1px solid #d9e1e5;border-radius:7px;font-size:10px;color:#7a8b95;background:#fff}.selected .step-number{color:#fff;background:var(--accent);border-color:var(--accent)}.step-button strong,.overview strong{display:block;font-size:11px;font-weight:650}.step-button small,.overview small{display:block;font-size:10px;font-weight:400;color:var(--muted);margin-top:4px;line-height:1.4}.step-button.done .step-number{color:var(--accent);border-color:#9ac7ba}.nav-foot{font-size:10px;line-height:1.6;color:var(--muted);border-top:1px solid var(--line);margin:20px;padding-top:14px}.tiny-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#349a88;margin-right:5px}.stage{position:relative;display:flex;min-width:0;flex-direction:column;background:radial-gradient(ellipse at 50% 35%,#fbfcfd,#e6ecef)}.stage-head{position:absolute;z-index:2;top:24px;left:25px;right:25px;display:flex;justify-content:space-between;align-items:start;pointer-events:none}.stage-head h2{font-size:18px;font-weight:500;letter-spacing:-.45px;margin:7px 0;color:#526874}.mesh-badge{padding:6px 8px;font-size:9px;border:1px solid #cdd7dd;border-radius:5px;color:#657e8b;background:#ffffff88}.stage #viewport{position:relative;flex:1;min-height:300px;overflow:hidden}canvas{display:block;touch-action:none}#view-cube{position:absolute;right:20px;top:84px;display:grid;gap:4px;z-index:2}#view-cube button{padding:6px 8px;border-radius:4px;font-size:8px;letter-spacing:1px;background:#ffffffaa}#loading{position:absolute;top:45%;left:15%;right:15%;text-align:center;background:#fff;padding:24px;border:1px solid var(--line);border-radius:10px;font-size:13px;z-index:5}.model-caption{position:absolute;left:22px;bottom:15px;font-size:9px;color:#738a97;pointer-events:none}.view-tools{margin:0 20px 18px;padding:9px;display:flex;align-items:center;justify-content:center;gap:5px;background:#ffffffeb;border:1px solid #d4dfe4;border-radius:10px;box-shadow:0 4px 20px #213e4810;z-index:3}.view-tools button{font-size:10px;padding:8px;border-color:transparent}.view-tools label,.view-tools output{font-size:10px;color:var(--muted)}.view-tools output{width:28px;font-variant-numeric:tabular-nums}.view-tools input{width:100px;accent-color:var(--accent)}.tools-divider{height:20px;width:1px;background:var(--line);margin:0 7px}.step-footer{background:#fff;border-top:1px solid var(--line);padding:18px 24px;min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:15px}.step-footer p{font-size:11px;line-height:1.5;margin:7px 0 0;max-width:360px}.step-controls{display:flex;gap:7px;flex-shrink:0}.primary{background:var(--accent);border-color:var(--accent);color:#fff}.primary:hover{background:#006860}.inspector{border-left:1px solid var(--line);padding:24px}.inspector-head{display:flex;align-items:center;justify-content:space-between;min-height:24px;margin-bottom:14px}.inspector-head button{border:0;padding:1px 7px;font-size:22px}.inspector h2{font-size:23px;letter-spacing:-.65px;line-height:1.2;margin:5px 0 12px}.inspector p{font-size:12px;line-height:1.75;color:#667d88}.inspector h3{font-size:11px;font-weight:700;margin-top:25px;letter-spacing:.25px}.spec-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:22px 0}.spec{border-top:1px solid var(--line);padding-top:12px}.spec strong{display:block;font-size:21px;font-weight:550}.spec span{display:block;font-size:10px;color:var(--muted);margin-top:5px}.notice{border-left:2px solid #c9994c;background:#fbf7ed;padding:12px 14px;margin:20px 0;color:#86602e;font-size:11px;line-height:1.7}.notice strong{display:block;margin-bottom:5px}.inspector .feature-list{padding-left:17px;font-size:11px;color:#627987;line-height:1.9}.inspector .instruction-list{padding-left:19px;font-size:12px;line-height:1.75}.instruction-list li{padding-left:3px;margin:0 0 14px}.complete-button{width:100%;margin-top:16px}.part-chip{border:1px solid var(--line);padding:7px 9px;border-radius:5px;font-size:10px;margin:0 5px 6px 0;display:inline-block;cursor:pointer}.part-chip:hover{background:var(--pale)}.part-id{display:inline-block;background:var(--pale);color:var(--accent);padding:5px 8px;border-radius:4px;font-size:10px;letter-spacing:1px;margin-bottom:10px}.meta-row{display:flex;justify-content:space-between;border-bottom:1px solid #edf1f3;padding:11px 0;font-size:11px;gap:15px}.meta-row span{color:var(--muted)}.source-name{font:10px/1.7 Consolas,monospace;overflow-wrap:anywhere;color:#687d88}.purchase-link{display:flex;justify-content:space-between;border:1px solid var(--line);padding:11px;border-radius:6px;margin:7px 0;font-size:11px}.purchase-link small{color:var(--muted);font-size:9px}.search-wrap{padding:17px 14px 10px}.search-wrap input,.search-wrap select{width:100%;padding:10px;border:1px solid var(--line);border-radius:6px;background:#f8fafb;font-size:11px;margin-bottom:8px}.list-meta{display:flex;align-items:center;justify-content:space-between;padding:0 16px 9px;font-size:10px;color:var(--muted)}.list-meta button{padding:5px 8px;font-size:10px}.part-row{border:0;border-bottom:1px solid #edf1f3;border-radius:0;display:grid;grid-template-columns:32px 1fr 20px;gap:7px;width:100%;padding:12px 14px;text-align:left;align-items:start}.part-row.selected{background:var(--pale)}.part-row .number{font:9px Consolas,monospace;color:var(--accent);padding-top:2px}.part-row strong{font-size:10px;line-height:1.5;display:block}.part-row small{font-size:9px;font-weight:400;color:var(--muted);display:block;margin-top:4px}.part-row .qty{font-size:10px;text-align:right;font-weight:500}.statusbar{height:31px;background:#fff;border-top:1px solid var(--line);font-size:9px;color:var(--muted);padding:8px 20px;display:flex;justify-content:space-between;gap:20px}#callouts{position:absolute;inset:0;pointer-events:none;z-index:2}.callout{position:absolute;pointer-events:auto;display:flex;align-items:center;gap:6px;padding:4px 7px 4px 4px;border:1px solid #d0dce2;border-radius:20px;background:#ffffffed;font-size:9px;font-weight:600;box-shadow:0 2px 8px #142d3810;white-space:nowrap;transform:translate(-50%,-50%)}.callout .bubble{background:#e2edee;color:#38646b;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;font-size:9px}.callout.selected{border-color:var(--accent);color:var(--accent);z-index:4}.callout.selected .bubble{background:var(--accent);color:#fff}.callout:hover{background:#fff}.empty-results{padding:22px;font-size:12px;color:var(--muted)}dialog{width:min(690px,calc(100vw - 30px));max-height:85vh;padding:28px;border:1px solid var(--line);border-radius:14px;box-shadow:0 25px 100px #12202d40;color:var(--ink)}dialog::backdrop{background:#12243077;backdrop-filter:blur(3px)}.dialog-head{display:flex;justify-content:space-between;align-items:start}.dialog-head h2{font-size:25px;margin:10px 0}.dialog-head button{font-size:21px;border:0}dialog p,dialog li{font-size:12px;line-height:1.8;color:var(--muted)}dialog code{font-size:10px;overflow-wrap:anywhere;display:block;background:#f2f5f6;padding:10px}.dialog-holds{padding-left:20px}dialog h3{font-size:13px;margin-top:24px}.empty-results button{margin-top:10px}
@media(min-width:1700px){.studio{grid-template-columns:285px 1fr 350px}.inspector{padding:30px}.step-button strong{font-size:12px}.stage-head{left:35px;top:30px}}
@media(max-width:1150px){.studio{grid-template-columns:220px minmax(300px,1fr) 260px}.inspector{padding:18px}.view-tools{margin-left:10px;margin-right:10px;gap:2px}.view-tools input{width:60px}.view-tools button{padding:6px}.step-footer{padding:14px}.step-footer p{max-width:210px}.topbar{padding:0 20px}}
@media(max-width:900px){.studio{grid-template-columns:205px minmax(280px,1fr);height:auto;min-height:0}.stage{height:calc(100dvh - 194px);min-height:530px}.inspector{grid-column:1/-1;border-top:1px solid var(--line);display:block;max-height:none}.navigator{max-height:calc(100dvh - 194px);min-height:530px}.inspector-content{max-width:700px}.projectbar{padding:15px 20px}.project-meta{flex-direction:column;align-items:end;gap:6px}.product{display:none}.topbar{gap:10px}.divider{display:none}.top-actions{gap:5px}.top-actions button{font-size:10px}.statusbar{height:auto;min-height:31px}.statusbar>span:last-child{display:none}}
@media(max-width:560px){.studio{display:flex;flex-direction:column}.stage{order:0;height:65dvh;min-height:480px}.navigator{order:1;min-height:0;max-height:400px}.inspector{order:2}.topbar{height:58px;padding:0 12px}.brand{font-size:21px}.brand-icon{width:26px;height:26px}.top-actions button{padding:8px 6px}#release-button{display:none}.projectbar{height:96px;padding:12px 16px}.projectbar .eyebrow{font-size:8px;letter-spacing:1px}h1{font-size:24px}h1 span{display:none}.project-meta{font-size:9px}.status{font-size:9px}.stage-head{left:16px;top:18px}.stage-head h2{font-size:15px}.mesh-badge{display:none}.view-tools{flex-wrap:wrap;margin:0 10px 10px}.view-tools input{width:74px}.step-footer{padding:12px}.step-footer p{font-size:10px}.step-controls button{font-size:10px;padding:9px}.callout .label{display:none}.callout{padding:3px}.tools-divider{margin:0 3px}.nav-intro{padding:15px 20px}.overview,.step-button{padding:10px}.inspector h2{font-size:23px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.callout-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.callout-lines line{stroke:#7a9aa5;stroke-width:1;opacity:.65}
/* Theme and product controls */
#theme-choice{max-width:88px;background:#263c49;border:1px solid #3e5461;border-radius:7px;color:#dce7eb;padding:7px;font-size:11px;cursor:pointer}.project-meta select{max-width:170px;background:transparent;border:1px solid var(--line);color:inherit;padding:8px;border-radius:6px;font-size:11px}.project-meta select option{color:var(--ink);background:var(--surface,#fff)}.demo-tools{display:flex;align-items:center;justify-content:center;gap:8px;padding:8px 15px}.demo-tools:has(button:not([hidden])){border-top:1px solid var(--line)}.demo-tools span{font-size:10px;color:var(--muted)}.demo-tools button{font-size:11px}body[data-workspace=showcase] .navigator{display:none}body[data-workspace=showcase] .studio{grid-template-columns:minmax(340px,1fr) 310px}body[data-workspace=showcase] .step-footer{display:none}body[data-workspace=service] .step-footer{display:none}
:root[data-theme=dark]{color-scheme:dark;--ink:#e2edf2;--muted:#9bafbb;--line:#314651;--accent:#65d6c5;--pale:#183d3c;--surface:#172832;color:#dce7ed;background:#101b23}
[data-theme=dark] .topbar{background:#101d26}[data-theme=dark] :is(.projectbar,.navigator,.inspector,.step-footer,.statusbar,dialog,#loading){background:var(--surface);color:var(--ink)}[data-theme=dark] button{background:#213641;color:#dce7ed;border-color:var(--line)}[data-theme=dark] button:hover{background:#2c4652}[data-theme=dark] :is(.overview,.step-button,.nav-tabs button){background:transparent}[data-theme=dark] :is(.overview.selected,.step-button.selected,.part-row.selected,button[aria-pressed=true]){background:var(--pale);color:var(--accent);border-color:#31665f}[data-theme=dark] .step-number{background:#203742;border-color:#3b5260;color:#afc6d0}[data-theme=dark] .selected .step-number{background:#297e72;color:white}[data-theme=dark] .stage{background:radial-gradient(ellipse at 50% 35%,#283e49,#111f29)}[data-theme=dark] :is(.stage-head h2,.inspector p,.source-name,.inspector .feature-list,.model-caption){color:#acc0ca}[data-theme=dark] :is(.view-tools,.callout,#view-cube button,.mesh-badge){background:#1b303dec;color:#dce9ef;border-color:#405968}[data-theme=dark] .callout .bubble{background:#2b4d56;color:#9fe8dc}[data-theme=dark] .callout-lines line{stroke:#a6c7cf}[data-theme=dark] :is(.notice,.status){background:#392e1d;color:#e5bd7e;border-color:#8c703e}[data-theme=dark] :is(.search-wrap input,.search-wrap select,dialog code){background:#10222c;color:#dce7ed;border-color:#314651}[data-theme=dark] :is(.part-row,.meta-row){border-color:var(--line)}[data-theme=dark] .primary{background:#247d71;color:#fff}[data-theme=dark] .primary:hover{background:#2c9486}
@media(max-width:1150px){.topbar{gap:12px}.project-meta{gap:8px}.project-meta select{max-width:145px}.demo-tools{flex-wrap:wrap}.demo-tools span{font-size:9px}body[data-workspace=showcase] .studio{grid-template-columns:minmax(300px,1fr) 260px}}
@media(max-width:900px){.projectbar{height:auto;min-height:110px;gap:12px}.project-meta{flex-direction:row;flex-wrap:wrap;justify-content:flex-end;max-width:320px}.project-meta select{max-width:130px}body[data-workspace=showcase] .studio{grid-template-columns:1fr}body[data-workspace=showcase] .inspector{grid-column:auto}.topbar{height:auto;min-height:64px;flex-wrap:wrap;padding:12px}.top-actions{flex-wrap:wrap}}
@media(max-width:560px){.topbar{gap:8px}.brand{font-size:20px}.top-actions{gap:4px}.top-actions button{padding:7px 5px}#open{display:none}#theme-choice{padding:7px 3px;font-size:10px;max-width:70px}.projectbar{align-items:flex-start}.project-meta{max-width:145px;gap:5px}.project-meta select{padding:5px;width:145px}.project-meta #release-status{display:none}.projectbar h1{font-size:22px}.projectbar .eyebrow{max-width:165px;line-height:1.6}body[data-workspace=showcase] .studio{display:flex}.demo-tools span{flex-basis:100%;text-align:center}}

/* Keep the WebGL drawing buffer from determining flex/grid layout size. */
.stage{min-height:0}.stage #viewport canvas{position:absolute;inset:0;width:100%;height:100%}