/* Shared appearance layer. Shape and luminance are independent preferences. */
.appearance-controls{display:flex;align-items:center;gap:8px;margin-left:4px;flex:none}.theme-label{font-size:10px;color:#777}.appearance-controls select{height:34px;padding:0 25px 0 10px;border:1px solid #ddd;background:#f6f6f6;border-radius:3px;font:11px inherit;color:#333;cursor:pointer}.appearance-controls button{width:34px;height:34px;display:grid;place-items:center;padding:7px;border:1px solid #ddd;background:transparent;border-radius:3px;cursor:pointer;color:#333}.appearance-controls svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.sun-icon{display:none}.in-studio .nav-start{display:none!important}.navigation{gap:24px}.navigation nav{gap:24px}.playground{background:#e9eaec}.playground>img{filter:none;mix-blend-mode:normal;object-fit:contain;width:76%;height:100%;right:0;object-position:center}.scene-panel{background:#e9eaec}.scene-panel>img{object-fit:contain}.make-visual{background:#e9eaec}.make-visual img{object-fit:contain}.floating-tag{display:none}.visual-note{color:#7e838c}.mini-label{color:#737983}.scene-card{background:#ffffffed}.playground-caption strong{position:relative;z-index:1}.hero-note{color:#777}
:root[data-mode=dark]{color-scheme:dark;--bg:#17191c;--ink:#eceff2;--muted:#a1a6af;--blue:#7a9dff;--border:#353a41;--stage:#202329;--surface:#262a30f5;--field:#30353d;--line:#444a54;--text:#eef0f3;--accent:#7a9dff;--accent-soft:#303f61;--accent-text:#b5caff;--handle:#30353d;--grid-major:#414750;--grid-minor:#2b3037;--model-shell:#8e949e;--model-drawer:#d4d7dc}
:root[data-mode=dark] body{background:#17191c;color:#eceff2}:root[data-mode=dark] .navigation{background:#1e2126;border-color:#393e46}:root[data-mode=dark] .brand-symbol i{background:#eef0f3}:root[data-mode=dark] .brand-light{color:#a0a6af}:root[data-mode=dark] .badge{background:#333841;color:#bac2ce}:root[data-mode=dark] .appearance-controls select,:root[data-mode=dark] .appearance-controls button,:root[data-mode=dark] .menu-toggle{background:#2b3038;border-color:#454c58;color:#e5eaf1}:root[data-mode=dark] .moon-icon{display:none}:root[data-mode=dark] .sun-icon{display:block}:root[data-mode=dark] .hero-tag,:root[data-mode=dark] .hero-subtitle,:root[data-mode=dark] .hero-note,:root[data-mode=dark] .kicker,:root[data-mode=dark] .section-top>p,:root[data-mode=dark] .feature p,:root[data-mode=dark] .steps p,:root[data-mode=dark] .contact-intro>p,:root[data-mode=dark] .print-note,:root[data-mode=dark] .scene-hint,:root[data-mode=dark] .scene-options small,:root[data-mode=dark] .mini-label,:root[data-mode=dark] .questions details p{color:#a6adb8}:root[data-mode=dark] h1>span{color:#eef0f3}:root[data-mode=dark] .playground,:root[data-mode=dark] .scene-panel,:root[data-mode=dark] .make-visual{background:#24292f}:root[data-mode=dark] .playground img,:root[data-mode=dark] .scene-panel>img,:root[data-mode=dark] .make-visual img{filter:brightness(.82)}:root[data-mode=dark] .scene-card,:root[data-mode=dark] .scene-options button[aria-selected=true],:root[data-mode=dark] .feature,:root[data-mode=dark] .contact-links>div,:root[data-mode=dark] .questions details{background:#252a31;border-color:#3a414b}:root[data-mode=dark] .scene-card{color:#eef0f3}:root[data-mode=dark] .scene-options button:hover{background:#292e36}:root[data-mode=dark] .scene-options button{background:transparent}:root[data-mode=dark] .scene-emoji,:root[data-mode=dark] .benefit-icon,:root[data-mode=dark] .card-icon,:root[data-mode=dark] .contact-icon,:root[data-mode=dark] .steps li>span,:root[data-mode=dark] .coming{background:#343b45!important;color:#ccd3de!important}:root[data-mode=dark] .section-pill,:root[data-mode=dark] .format-pills span{color:#b2bac8;border-color:#424a57}:root[data-mode=dark] .dimension-demo>span{border-color:#3b424d}:root[data-mode=dark] .dimension-demo b{color:#9bb6ff}:root[data-mode=dark] .make-visual>span{background:#262c35ee}:root[data-mode=dark] .cta{background:#242a34}:root[data-mode=dark] .contact-intro .avatar{background:#343c49;color:#d6deec}:root[data-mode=dark] footer{border-color:#363e48}:root[data-mode=dark] .blue,:root[data-mode=dark] .dark,:root[data-mode=dark] .nav-start{background:#4272ee;color:white}:root[data-mode=dark] nav{background:#1e2126;border-color:#393e46}:root[data-mode=dark] .spec>div,:root[data-mode=dark] .spec>div:first-child,:root[data-mode=dark] .spec>div+div,:root[data-mode=dark] .stage>.assembly-dock,:root[data-mode=dark] .main-settings,:root[data-mode=dark] .stage>.material-panel,:root[data-mode=dark] .panel-switch{background:#262a30f5;border-color:#414852}:root[data-mode=dark] .measure-value{background:#303640;border-color:#505b6b;color:#e3e9f2}:root[data-mode=dark] .panel-switch button{color:#b8c1ce}:root[data-mode=dark] .panel-switch button[aria-pressed=true]{background:#dbe4f6;color:#1b2536}:root[data-mode=dark] .material-swatch:hover{background:#353d49}:root[data-mode=dark] .export-actions #mf{background:#4272ee;color:white}:root[data-mode=dark] #parts-menu{background:#262c35}:root[data-mode=dark] .material-ball{border-color:#68717f}
:root[data-design=rounded] .navigation{border-bottom:0;box-shadow:0 4px 24px #15254209}:root[data-design=rounded] .nav-start,:root[data-design=rounded] .button{border-radius:100px}:root[data-design=rounded] .hero-tag{border-radius:100px;background:#e8e8e8;padding:7px 16px;letter-spacing:1px}:root[data-design=rounded] .playground{border-radius:36px}:root[data-design=rounded] .scene-panel,:root[data-design=rounded] .make-visual{border-radius:32px}:root[data-design=rounded] .feature{border-radius:30px;border-color:transparent;box-shadow:0 8px 32px #1b253608}:root[data-design=rounded] .scene-options button{border-radius:20px;border-left:0}:root[data-design=rounded] .scene-options button[aria-selected=true]{box-shadow:0 5px 20px #1e2d4408}:root[data-design=rounded] .scene-card{border:0;border-radius:20px;box-shadow:0 6px 24px #1e2d4412}:root[data-design=rounded] .scene-emoji,:root[data-design=rounded] .card-icon,:root[data-design=rounded] .benefit-icon,:root[data-design=rounded] .contact-icon{border-radius:14px}:root[data-design=rounded] .cta{border-radius:32px}:root[data-design=rounded] .contact-links>div,:root[data-design=rounded] .questions details{border-radius:20px;border-color:transparent}:root[data-design=rounded] .avatar{border-radius:22px}:root[data-design=rounded] .appearance-controls select,:root[data-design=rounded] .appearance-controls button,:root[data-design=rounded] .menu-toggle{border-radius:100px}:root[data-design=rounded] .format-pills span,:root[data-design=rounded] .section-pill,:root[data-design=rounded] .coming{border-radius:100px}:root[data-design=rounded] .make-visual>span{border-radius:14px}:root[data-design=rounded] .steps li>span{border-radius:50%}:root[data-design=rounded] .material-panel,:root[data-design=rounded] .main-settings,:root[data-design=rounded] .stage>.assembly-dock{border-radius:22px;border-color:transparent;box-shadow:0 6px 24px #182b4412}:root[data-design=rounded] .spec>div,:root[data-design=rounded] .spec>div:first-child,:root[data-design=rounded] .spec>div+div{border-radius:14px;border-color:transparent}:root[data-design=rounded] .segmented,:root[data-design=rounded] .subtle,:root[data-design=rounded] .precision-control input,:root[data-design=rounded] #parts-trigger,:root[data-design=rounded] .measure-value{border-radius:12px}:root[data-design=rounded] button,:root[data-design=rounded] select{border-radius:9px}:root[data-design=rounded] .panel-switch{border-radius:18px;box-shadow:0 3px 20px #172a3e12}:root[data-design=rounded] .panel-switch button{border-radius:13px}:root[data-design=rounded] .export-actions button{border-radius:12px}:root[data-design=rounded] .material-families{border-radius:12px}:root[data-design=rounded] .precision-control button{background:var(--field);border-color:transparent}:root[data-design=rounded][data-mode=dark] .hero-tag{background:#2a3039;color:#c3ccdb}
@media(max-width:1100px){.navigation{gap:16px}.navigation nav{gap:16px}.nav-start{padding:10px 13px;gap:8px}.theme-label{display:none}}
@media(max-width:760px){.navigation{gap:9px;padding:0 12px}.navigation>.brand{font-size:17px}.brand-symbol{margin-right:5px}.brand-symbol i{width:18px}.appearance-controls{margin-left:auto;gap:6px}.appearance-controls select{width:69px;height:32px;padding:0 4px 0 8px;font-size:10px}.appearance-controls button{width:32px;height:32px}.menu-toggle{margin-left:0;min-width:32px;min-height:32px;font-size:17px}.playground>img{width:100%;height:78%;top:19%;right:0}.playground-caption strong{font-size:22px}.scene-panel>img{height:350px}:root[data-design=rounded] .playground{border-radius:26px}:root[data-design=rounded] .feature{border-radius:24px}:root[data-design=rounded] .scene-panel,:root[data-design=rounded] .make-visual{border-radius:24px}:root[data-design=rounded] .cta{border-radius:26px}.scene-options button[aria-selected=true]{background:#222;color:white}:root[data-mode=dark] .scene-options button[aria-selected=true]{background:#d6deec;color:#172333}}
/* Rounded is a separate consumer-facing palette, not merely a radius variant. */
:root[data-design=rounded][data-mode=light]{--bg:#fff;--ink:#202e4b;--muted:#7c899e;--blue:#4169ee;--border:#e5ebf5;--stage:#f4f7fc;--surface:#ffffffef;--field:#f2f5fb;--line:#e1e7f1;--text:#23324d;--accent:#4169ee;--accent-soft:#eaf0ff;--accent-text:#4169ee;--handle:#fff;--grid-major:#d5deef;--grid-minor:#e8edf6}
:root[data-design=rounded][data-mode=light] body{background:#fff;color:#202e4b}:root[data-design=rounded][data-mode=light] .navigation{background:#fffffff5;box-shadow:0 4px 24px #24366405}:root[data-design=rounded][data-mode=light] .brand-symbol i{background:#5277ed}:root[data-design=rounded][data-mode=light] .brand-symbol i:nth-child(2){background:#9aaef6}:root[data-design=rounded][data-mode=light] .brand-symbol i:nth-child(3){background:#cdd7ff}:root[data-design=rounded][data-mode=light] h1>span{color:#4169ee}:root[data-design=rounded][data-mode=light] .hero-tag{background:#eff3ff;color:#6b83b9}:root[data-design=rounded][data-mode=light] .hero-tag>span{background:#7496f7;border-radius:50%}:root[data-design=rounded][data-mode=light] .hero-subtitle,:root[data-design=rounded][data-mode=light] .hero-note,:root[data-design=rounded][data-mode=light] .section-top>p,:root[data-design=rounded][data-mode=light] .feature p,:root[data-design=rounded][data-mode=light] .steps p,:root[data-design=rounded][data-mode=light] .contact-intro>p{color:#7d8aa1}:root[data-design=rounded][data-mode=light] .playground{background:#f1f5ff}:root[data-design=rounded][data-mode=light] .scene-panel{background:#f1f8f5}:root[data-design=rounded][data-mode=light] .make-visual{background:#f3f0ff}:root[data-design=rounded][data-mode=light] .benefit-icon{background:#edf2ff;color:#6583d3}:root[data-design=rounded][data-mode=light] .benefit-icon.green{background:#eef8f2;color:#69a78c}:root[data-design=rounded][data-mode=light] .benefit-icon.pink{background:#fff1e8;color:#d39a72}:root[data-design=rounded][data-mode=light] .scene-emoji{background:#edf2ff;color:#6583d3}:root[data-design=rounded][data-mode=light] .scene-options button:nth-child(2) .scene-emoji{background:#f2edff;color:#a28bc8}:root[data-design=rounded][data-mode=light] .scene-options button:nth-child(3) .scene-emoji{background:#fff2e6;color:#c99b74}:root[data-design=rounded][data-mode=light] .scene-options button[aria-selected=true]{background:#f1f5ff}:root[data-design=rounded][data-mode=light] .size-feature{background:#f3f6ff}:root[data-design=rounded][data-mode=light] .color-feature{background:#f6f2ff}:root[data-design=rounded][data-mode=light] .stack-feature{background:#f0f8f3}:root[data-design=rounded][data-mode=light] .card-icon{background:#e8eeff;color:#6080d1}:root[data-design=rounded][data-mode=light] .color-feature .card-icon{background:#eee6ff;color:#9d84ca}:root[data-design=rounded][data-mode=light] .stack-feature .card-icon{background:#e0f1e6;color:#72a48c}:root[data-design=rounded][data-mode=light] .cta{background:#edf3ff;color:#243759}:root[data-design=rounded][data-mode=light] .cta-chip,:root[data-design=rounded][data-mode=light] .cta p{color:#8195b5}:root[data-design=rounded][data-mode=light] .dark,:root[data-design=rounded][data-mode=light] .blue,:root[data-design=rounded][data-mode=light] .nav-start{background:#4169ee;color:#fff;box-shadow:0 7px 18px #4169ee16}:root[data-design=rounded][data-mode=light] .contact-intro .avatar{background:#e5efff;color:#6184d0}:root[data-design=rounded][data-mode=light] .contact-links>div,:root[data-design=rounded][data-mode=light] .questions details{background:#f6f8fc}:root[data-design=rounded][data-mode=light] .contact-icon{background:#e7eeff;color:#6689cc}:root[data-design=rounded][data-mode=light] .contact-links>div:nth-child(2) .contact-icon{background:#e6f4ec;color:#75aa90}:root[data-design=rounded][data-mode=light] .contact-links>div:nth-child(3) .contact-icon{background:#fff0e8;color:#cc997c}:root[data-design=rounded][data-mode=light] .contact-links>div:nth-child(4) .contact-icon{background:#eee7ff;color:#9b87c5}:root[data-design=rounded][data-mode=light] .appearance-controls select,:root[data-design=rounded][data-mode=light] .appearance-controls button{background:#f6f8fc;border-color:#e7ebf4;color:#647692}:root[data-design=rounded][data-mode=light] .coming{background:#eaf0f8;color:#99a7bb}:root[data-design=rounded][data-mode=light] .section-pill{background:#f1f5fc;color:#8b9cb8;border-color:transparent}:root[data-design=rounded][data-mode=light] .scene-card{background:#ffffffed}:root[data-design=rounded][data-mode=light] .material-panel,:root[data-design=rounded][data-mode=light] .main-settings,:root[data-design=rounded][data-mode=light] .stage>.assembly-dock{background:#ffffffed;box-shadow:0 8px 30px #29426d08}:root[data-design=rounded][data-mode=light] .panel-switch{background:#fffffff0;border-color:#e7edf6}:root[data-design=rounded][data-mode=light] .panel-switch button[aria-pressed=true]{background:#4169ee;color:#fff}:root[data-design=rounded][data-mode=light] .export-actions #mf{background:#4169ee}:root[data-design=rounded][data-mode=light] .stack-demo i{background:#8daaf4;box-shadow:6px -5px 0 #7291db}:root[data-design=rounded][data-mode=light] .stack-demo i:nth-child(2){background:#fff;box-shadow:6px -5px 0 #e0e6f0}:root[data-design=rounded][data-mode=light] .stack-demo i:nth-child(3){background:#a8d7c1;box-shadow:6px -5px 0 #8cbaa5}
:root[data-design=rounded][data-mode=dark]{--bg:#182131;--ink:#edf2fa;--stage:#1c283b;--surface:#253247f5;--field:#2d3e58;--line:#425470;--text:#edf2fa;--muted:#a3b2c9;--accent:#94b0ff;--accent-soft:#344d78;--accent-text:#c5d5ff;--grid-major:#405271;--grid-minor:#2a3951}:root[data-design=rounded][data-mode=dark] body{background:#182131}:root[data-design=rounded][data-mode=dark] .navigation{background:#202b3e}:root[data-design=rounded][data-mode=dark] .playground{background:#26364d}:root[data-design=rounded][data-mode=dark] .scene-panel{background:#273e3d}:root[data-design=rounded][data-mode=dark] .make-visual{background:#342f4c}:root[data-design=rounded][data-mode=dark] .feature{background:#26354b}:root[data-design=rounded][data-mode=dark] .color-feature{background:#332e48}:root[data-design=rounded][data-mode=dark] .stack-feature{background:#283c39}:root[data-design=rounded][data-mode=dark] .cta{background:#2b3e60}
/* All dock groups have the same title row and control baseline. */
.assembly-dock .dock-group{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:10px}.assembly-dock .control-title,.assembly-dock .control-title:has(#countValue),.assembly-dock .dock-opening .control-title{display:flex;align-items:center;justify-content:space-between;min-height:18px;height:18px;line-height:18px;margin:0;gap:8px}.assembly-dock .dock-label{display:block;min-height:18px;height:18px;line-height:18px;font-size:11px;margin:0;font-weight:400}.assembly-dock .layer-row,.assembly-dock .layer-row+.layer-row{min-height:36px;margin:0;gap:8px;align-items:center}.assembly-dock .set-controls,.assembly-dock .assembly-controls{margin:0;min-height:36px;align-items:stretch}.assembly-dock .set-controls button,.assembly-dock .assembly-controls button,.assembly-dock .count-controls button{height:36px;min-height:36px}.assembly-dock #opening{display:block;appearance:none;height:36px;min-height:36px;margin:0;background:linear-gradient(var(--line),var(--line)) center/100% 2px no-repeat}.assembly-dock .count-controls{align-items:center}.assembly-dock #countValue{display:block;line-height:18px;margin:0;font-size:9px;overflow:hidden;text-overflow:ellipsis}.assembly-dock #openValue{line-height:18px}.assembly-dock .dock-opening{justify-content:flex-start}.assembly-dock .control-title h3{line-height:18px}.stage>.assembly-dock{align-items:start}
@media(max-width:1100px){.assembly-dock #countValue{display:none}}
@media(max-width:760px){:root[data-design=rounded][data-mode=light] .scene-options button[aria-selected=true]{background:#e9efff;color:#4169ee}:root[data-design=rounded][data-mode=light] .scene-options button[aria-selected=true] .scene-emoji{background:#dce6ff;color:#4169ee}.assembly-dock .dock-group{gap:8px}}
