@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap');
:root{--ink:#22262b;--muted:#85898c;--line:#e7e8e8;--accent:#db3438;--mono:'IBM Plex Mono',monospace}*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden}body{height:100dvh;display:grid;grid-template-rows:72px minmax(0,1fr) 28px;background:#fff;color:var(--ink);font-family:'DM Sans',Arial,sans-serif}button,a,label,input{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{font:inherit;cursor:pointer;color:inherit}a{color:inherit;text-decoration:none}header{display:flex;align-items:center;padding:0 30px;border-bottom:1px solid var(--line);gap:58px}.brand{font-family:var(--mono);font-weight:500;font-size:25px;letter-spacing:-1.5px;line-height:1}.brand>span{display:block;font-size:7px;letter-spacing:2px;color:var(--muted);margin-top:8px}.breadcrumb{display:flex;align-items:center;gap:16px;font-size:11px;color:#85898b}.breadcrumb strong{font-weight:500;color:#41474c}.breadcrumb small{font:8px var(--mono);border:1px solid #dddfe0;padding:4px;border-radius:3px}.header-note{margin-left:auto;display:flex;align-items:center;gap:8px;font:8px var(--mono);letter-spacing:1px;color:#7c8285}.header-note i,.note-dot{width:5px;height:5px;background:var(--accent);border-radius:50%;flex-shrink:0}.studio{min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 326px}.workbench{position:relative;min-width:0;min-height:0;background-color:#f6f7f7;background-image:linear-gradient(#dfe2e340 1px,transparent 1px),linear-gradient(90deg,#dfe2e340 1px,transparent 1px);background-size:56px 56px;overflow:hidden}#viewport{position:absolute;inset:75px 18px 46px;touch-action:none}#viewport canvas{display:block;cursor:grab}#viewport canvas:active{cursor:grabbing}#loading{position:absolute;inset:45% 0;text-align:center;font-size:12px}.stage-top{position:absolute;top:28px;left:30px;pointer-events:none;z-index:1}.eyebrow{font:8px var(--mono);letter-spacing:1.4px;color:#7f868a}h1{font-size:36px;letter-spacing:-1.8px;font-weight:500;margin:10px 0 4px;line-height:1}h1>span{color:var(--accent)}.stage-top p{font-size:10px;color:#8a9092;margin:9px 0 0}.stage-edition{position:absolute;right:28px;top:30px;font:8px var(--mono);letter-spacing:1px;color:#8c9396;z-index:1;pointer-events:none}.object-note{position:absolute;left:30px;bottom:68px;display:flex;align-items:center;gap:10px;font:7px var(--mono);letter-spacing:1px;color:#8e9598;pointer-events:none}.small-cross{font-size:21px;color:#aab0b2}.stage-bottom{position:absolute;bottom:20px;left:30px;right:28px;display:flex;align-items:center;justify-content:space-between;gap:10px}.drag-hint{font-size:9px;color:#8c9295}.drag-hint span{margin-left:7px}.zoom-controls{display:flex;background:#fff;border:1px solid #dedfe0;border-radius:6px;padding:2px}.zoom-controls button{background:none;border:0;min-width:32px;height:30px;font-size:18px}#reset{font-size:9px;min-width:62px;border-left:1px solid #eceeee;border-right:1px solid #eceeee}.panel-heading{padding-bottom:20px}h2{font-size:25px;letter-spacing:-1px;font-weight:500;margin:11px 0 7px}.panel-subtitle{font-size:10px;color:#8b9094}aside{min-height:0;border-left:1px solid var(--line);padding:28px 24px 17px;display:flex;flex-direction:column;gap:0;background:#fff}.control-section{border-top:1px solid var(--line);padding:20px 0}.section-label{font:8px var(--mono);letter-spacing:.9px;color:#6c767c;display:flex;justify-content:space-between;align-items:center}.section-label>span:last-child{font-size:7px;color:#a0a5a8}.model-list{display:flex;gap:10px;margin-top:17px}.model{background:none;border:1px solid transparent;border-radius:6px;flex:1;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;padding:8px 3px;color:#82898e}.model strong{font-size:9px;font-weight:400}.model.active{background:#f6f7f8;border-color:#e8eaeb;color:#272e32}.swatch{width:28px;height:28px;border-radius:50%;box-shadow:inset 0 0 0 1px #00000012;position:relative}.model.active .swatch:after{content:'';position:absolute;inset:-4px;border:1px solid #656e73;border-radius:50%}.black{background:#23272b}.graphite{background:#737980}.silver{background:#c9ced2}.mode-switch{display:flex;border:1px solid #e2e5e7;border-radius:6px;padding:3px;margin-top:13px;gap:2px}.mode-switch button{flex:1;padding:9px 4px;border:0;border-radius:4px;background:none;font-size:9px;white-space:nowrap}.mode-switch button.active{background:#272e33;color:white}#mode-caption{font-size:9px;line-height:1.6;color:#969da1;margin:10px 0 0}.views{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:14px}.views button{display:flex;align-items:center;gap:10px;border:1px solid #e5e8e9;border-radius:5px;background:#fff;padding:10px;font-size:15px;color:#9da5aa}.views button span{font-size:9px;color:#69747b}.views button.active{border-color:#b9c0c5;background:#f4f6f7;color:#303c43}.views button.active span{color:#303c43}.specification{padding-top:18px;border-top:1px solid var(--line)}dl{margin:12px 0 0}dl>div{display:flex;justify-content:space-between;padding:6px 0;font-size:9px;gap:10px}dt{color:#939ca1}dd{margin:0;color:#58646c}.engineering-note{margin-top:auto;display:flex;gap:9px;align-items:flex-start;padding-top:17px}.engineering-note .note-dot{margin-top:4px;background:#a8afb3}.engineering-note p{font-size:8px;line-height:1.6;margin:0;color:#9ba2a6}footer{display:flex;justify-content:space-between;align-items:center;padding:0 30px;border-top:1px solid var(--line);font:7px var(--mono);letter-spacing:.8px;color:#989fa3}footer b{margin:0 9px;font-weight:400;color:#c1c7ca}button:hover{background-color:#f0f2f3}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}@media(max-height:800px) and (min-width:701px){body{grid-template-rows:62px minmax(0,1fr) 25px}aside{padding:20px 20px 12px}.panel-heading{padding-bottom:14px}h2{font-size:23px;margin:8px 0 6px}.control-section{padding:13px 0}.model-list{margin-top:10px}.model{gap:8px;padding:6px 3px}.swatch{width:25px;height:25px}.views{margin-top:10px}.views button{padding:8px}.specification{padding-top:12px}dl{margin-top:7px}dl>div{padding:4px 0}.engineering-note{padding-top:10px}#mode-caption{margin-top:7px}.stage-top{top:22px}}@media(max-height:720px) and (min-width:701px){body{grid-template-rows:52px minmax(0,1fr) 22px}.panel-heading{padding-bottom:9px}aside{padding:14px 18px 9px}.panel-subtitle{display:none}h2{font-size:21px;margin:5px 0}.control-section{padding:9px 0}.model{flex-direction:row;gap:8px}.swatch{width:19px;height:19px}.model-list{margin-top:8px}.views{grid-template-columns:repeat(4,1fr);gap:4px}.views button{padding:8px 2px;justify-content:center}.views button>span{font-size:8px}.views button{font-size:0;gap:0}#mode-caption{font-size:8px}.specification{padding-top:9px}dl>div{padding:3px 0}.engineering-note{padding-top:8px}.stage-top p{display:none}}
@media(max-width:900px) and (min-width:701px){.studio{grid-template-columns:minmax(0,1fr) 285px}header{gap:30px}.header-note{font-size:7px}aside{padding-left:18px;padding-right:18px}.stage-edition{display:none}}
@media(max-width:700px){body{grid-template-rows:54px minmax(0,1fr) 21px}header{padding:0 17px;gap:22px}.brand{font-size:21px}.brand>span{font-size:6px;margin-top:5px}.breadcrumb{font-size:9px;gap:9px}.header-note{display:none}.studio{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) 250px}.stage-top{left:18px;top:17px}.eyebrow{font-size:7px}h1{font-size:28px;margin-top:7px}.stage-top p{display:none}.stage-edition{top:20px;right:17px;font-size:7px}#viewport{inset:50px 8px 39px}.stage-bottom{bottom:8px;left:18px;right:14px}.drag-hint{font-size:8px}.drag-hint span{display:none}.object-note{display:none}.zoom-controls button{min-width:36px;height:32px}aside{border-left:0;border-top:1px solid var(--line);padding:13px 18px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto auto;gap:12px 18px}.panel-heading{display:none}.control-section{padding:0;border:0;min-width:0}.finish-section{grid-row:1;grid-column:1}.model-list{gap:2px;margin-top:12px}.model{gap:10px;padding:8px 1px;min-height:68px}.swatch{width:23px;height:23px}.model strong{font-size:8px}.section-label{font-size:7px}.section-label>span:last-child{display:none}.mode-switch{margin-top:9px;flex-wrap:wrap;gap:2px;padding:2px}.mode-switch button{font-size:8px;padding:8px 3px;min-height:32px}.mode-switch button:last-child{flex-basis:100%}#mode-caption{display:none}.views{gap:4px;margin-top:8px}.views button{padding:6px 3px;gap:0;justify-content:center;min-height:32px;font-size:0}.views button span{font-size:8px}.specification{grid-column:1;grid-row:2;padding:0;border:0;align-self:end}.specification>.section-label{display:none}dl{margin:0}dl>div{font-size:7px;padding:2px 0}.specification dl>div:nth-child(4){display:none}.engineering-note{grid-column:1 / -1;padding:0;margin:0}.engineering-note p{font-size:7px}.engineering-note .note-dot{margin-top:3px}footer{padding:0 17px;font-size:6px;letter-spacing:.4px}}@media(max-width:700px) and (max-height:650px){.studio{grid-template-rows:minmax(0,1fr) 225px}aside{padding:10px 16px;gap:8px 16px}.model{min-height:61px}.model-list{margin-top:8px}.mode-switch button{padding:6px 3px}.views button{min-height:29px}.stage-top{top:12px}h1{font-size:23px}.stage-top .eyebrow{font-size:6px}#viewport{inset:38px 5px 38px}}