.shape-workspace { display:grid; grid-template-columns:280px minmax(0,1fr); gap:20px; align-items:start; }
.shape-workspace > .panel-card { min-width:0; padding:24px; }
.shape-controls .panel-title { margin-bottom:24px; font-size:22px; }
.shape-controls .field-group { margin:0 0 18px; }
.shape-controls .field-label { font-size:13px; margin-bottom:8px; }
.shape-controls .field-hint { margin:-6px 0 18px; font-size:12px; line-height:1.55; }
.shape-dimensions { display:flex; gap:12px; }
.shape-dimensions > div { min-width:0; flex:1; }
.shape-controls .voxel-quick-sizes { gap:6px; margin:0 0 22px; }
.shape-size-btn { min-width:36px; min-height:36px; padding:5px 9px; border:1px solid #383838; border-radius:10px; background:#191919; color:#cfcfcf; font:inherit; font-size:13px; cursor:pointer; }
.shape-size-btn[aria-pressed=true] { background:#eee; color:#111; border-color:#eee; }
.shape-workspace button:focus-visible,.shape-workspace a:focus-visible { outline:2px solid #eee; outline-offset:3px; }
.shape-materials { border-top:1px solid #333; padding-top:22px; margin-top:24px; }
.shape-materials > span { display:block; font-size:12px; color:#aaa; }
.shape-materials strong { display:block; margin:8px 0 12px; font-size:34px; font-weight:400; line-height:1.2; letter-spacing:-.04em; }
.shape-materials strong small { font-size:14px; color:#aaa; letter-spacing:0; }
.shape-materials p { margin:6px 0; font-size:12px; color:#aaa; line-height:1.6; }
.shape-howto { margin-top:24px; padding-top:18px; border-top:1px solid #333; font-size:13px; line-height:1.6; }
.shape-howto summary { cursor:pointer; color:#e2e2e2; }
.shape-howto ol { margin:14px 0 0; padding-left:18px; color:#aaa; }
.shape-howto li+li { margin-top:10px; }
.shape-howto p { font-size:12px; color:#aaa; }
.shape-form-error { margin:0 0 16px; font-size:12px; color:#ebbfad; line-height:1.6; }
.shape-form-error:empty { display:none; }
.shape-preview-heading { display:flex; justify-content:space-between; align-items:start; gap:16px; margin-bottom:22px; }
.shape-preview-heading .panel-title { margin:0 0 7px; font-size:24px; }
.shape-preview-heading p { margin:0; color:#aaa; font-size:13px; line-height:1.5; }
.shape-preview-heading .version-pill { flex:0 0 auto; margin-top:3px; }
.shape-layer-bar { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:14px; }
.shape-layer-bar > div { display:flex; flex-direction:column; gap:5px; text-align:center; }
.shape-layer-bar strong { font-size:15px; font-weight:500; }
.shape-layer-bar span { font-size:12px; color:#999; }
.shape-layer-btn { display:grid; place-items:center; flex:0 0 42px; width:42px; height:42px; border:1px solid #3b3b3b; border-radius:50%; background:#1b1b1b; color:#eee; font:inherit; font-size:22px; cursor:pointer; }
.shape-layer-btn:disabled { opacity:.3; cursor:default; }
.shape-layer-range { display:block; width:100%; height:24px; margin:0 0 14px; accent-color:#e8e8e8; cursor:pointer; }
.shape-canvas { width:100%; max-width:660px; aspect-ratio:1; margin-inline:auto; border:1px solid #363636; border-radius:16px; overflow:auto; overscroll-behavior:contain; background:#101010; scrollbar-width:thin; scrollbar-color:#555 #111; }
.shape-canvas svg { display:block; width:calc(100% * var(--shape-zoom,1)); min-width:100%; max-width:none; height:auto; }
.shape-canvas [data-shape-row] { cursor:pointer; }
.shape-canvas-toolbar { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px; margin:16px 0 22px; }
.shape-legend { display:flex; gap:14px; flex-wrap:wrap; }
.shape-legend span { display:flex; align-items:center; gap:6px; color:#aaa; font-size:11px; }
.shape-legend i { display:block; width:9px; height:9px; background:#eee; border:1px solid #eee; border-radius:2px; }
.shape-legend .outline { background:#222; border-color:#777; }
.shape-zoom { display:flex; gap:3px; padding:3px; border:1px solid #363636; border-radius:10px; background:#141414; }
.shape-zoom button { min-width:34px; min-height:30px; padding:3px 8px; border:0; border-radius:7px; background:transparent; color:#aaa; font:inherit; font-size:12px; cursor:pointer; }
.shape-zoom button[aria-pressed=true] { background:#eee; color:#111; }
.shape-row-guide { padding:18px; margin-bottom:20px; border:1px solid #303030; border-radius:14px; background:#111; }
.shape-row-guide label { display:block; margin-bottom:8px; font-size:12px; color:#aaa; }
.shape-row-guide select { font-size:14px!important; min-height:46px!important; }
.shape-row-guide p,.shape-placement-note { margin:12px 0 0; font-size:13px; color:#c3c3c3; line-height:1.7; overflow-wrap:anywhere; }
.shape-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:20px; }
.shape-actions .btn { min-height:44px; padding:10px 16px; font-size:12px; }
.shape-actions button:disabled { opacity:.4; cursor:not-allowed; }
.shape-edit-link { display:none; }
.shape-back-link { display:none; }
.shape-static-plan { max-width:540px; margin:20px auto; }
.shape-static-plan svg { display:block; width:100%; height:auto; }
.shape-static-plan [data-shape-row] { pointer-events:none; }
@media(max-width:1000px) { .shape-workspace { grid-template-columns:240px minmax(0,1fr); gap:16px; } .shape-workspace > .panel-card { padding:18px; } }
@media(max-width:760px) {
  .shape-workspace { display:flex; flex-direction:column; gap:16px; }
  .shape-workspace > .panel-card { width:100%; }
  .shape-preview { order:0; }
  .shape-controls { order:1; }
  .shape-preview-heading .panel-title { font-size:22px; }
  .shape-preview-heading { gap:10px; }
  .shape-preview-heading .version-pill { font-size:11px; padding:5px 8px; }
  .shape-edit-link { display:inline-block; margin-top:10px; color:#ccc; font-size:12px; text-underline-offset:4px; }
  .shape-back-link { display:block; margin-bottom:18px; color:#bbb; font-size:12px; text-underline-offset:4px; }
  .shape-actions .btn { flex:1 1 auto; }
  .shape-canvas-toolbar { gap:10px; }
  .shape-controls .field-group { margin-bottom:16px; }
  .shape-controls .voxel-quick-sizes { margin-top:0; }
}