/* Additive local Metal surface. Shared .button/.field/.settings-section own control styling. */
.metal-local-workspace { color: var(--ink); }
.metal-local-workspace .workspace-head { gap: 16px; flex-wrap: wrap; margin-bottom: 12px; }
.metal-local-workspace .workspace-head p { margin: 8px 0 0; font-size: 14px; color: var(--workspace-muted, #586771); }
.metal-local-workspace [data-metal-title] { white-space: normal; overflow-wrap: anywhere; hyphens: auto; font-size: 32px; line-height: 1.2; }
.metal-local-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 320px); gap: 14px 18px; align-items: start; }
.metal-local-catalog { grid-column: 1 / -1; min-width: 0; padding-bottom: 10px; border-bottom: 1px solid var(--line); }
.metal-local-catalog [data-metal-products] { display: flex; flex-wrap: nowrap; align-items: center; gap: 8px; min-width: 0; }
.metal-local-inspector { grid-column: 2; grid-row: 2; min-width: 0; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius, 16px); padding: 18px; scroll-margin-top: 100px; }
.metal-local-workspace h2:not([data-metal-title]) { font-size: 16px; line-height: 1.4; margin: 24px 0 12px; }
.metal-local-workspace h3 { font-size: 14px; margin: 16px 0 10px; }
.metal-local-catalog a { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 6px 4px; text-decoration: none; border-radius: 8px; color: var(--navy); font-size: 13px; white-space: nowrap; }
.metal-local-catalog a:hover { background: var(--stage); }
.metal-local-catalog a[aria-current="page"] { background: var(--navy); color: var(--surface); }
.metal-local-catalog .metal-catalog-separator { color: var(--muted); }
.metal-local-catalog .metal-catalog-category { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.metal-local-catalog [data-tool-picker] { margin-left: auto; flex-shrink: 0; }
.metal-local-inspector .metal-variants { margin: 0 0 12px; border-bottom: 1px solid var(--line); }
.metal-local-inspector .metal-variants summary { cursor: pointer; min-height: 42px; padding: 10px 0; color: var(--navy); font-size: 13px; font-weight: 600; }
.metal-local-inspector [data-metal-presets] { display: flex; flex-wrap: wrap; gap: 8px; padding-bottom: 12px; }
.metal-local-main { grid-column: 1; grid-row: 2; min-width: 0; scroll-margin-top: 100px; }
.metal-local-toolbar, .metal-local-views, .metal-local-actions, .metal-local-format-list { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.metal-local-workspace .button { min-height: var(--control-size, 42px); font-size: 13px; line-height: 1.2; }
.metal-local-workspace .button.primary { background: var(--orange); box-shadow: none; }
.metal-local-workspace .button.primary:hover:not(:disabled) { background: var(--brand-orange-hover, #ff8c5a); }
.metal-local-workspace .input { min-height: var(--control-size, 42px); font-size: 14px; }
.metal-local-workspace .field, .metal-local-workspace .check-field { font-size: 13px; line-height: 1.4; }
.metal-local-toolbar [data-metal-action="parameters"] { display: none; }
.metal-local-toolbar { margin-bottom: 12px; }
.metal-history { display: flex; flex: 0 0 auto; gap: 6px; }
.metal-local-toolbar .metal-history .button { width: 42px; min-width: 42px; padding: 0; }
.metal-local-toolbar .metal-history span { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.metal-local-views { padding: 6px; gap: 4px; margin-bottom: 0; border: 1px solid var(--line); border-bottom: 0; border-radius: 12px 12px 0 0; background: var(--surface); }
.metal-local-workspace .metal-local-views .button { border-color: transparent; padding: 8px 12px; box-shadow: none; }
.metal-local-views:empty { display: none; }
.metal-local-views [aria-pressed="true"] { color: var(--surface); background: var(--navy); }
.metal-local-status { flex: 1 1 180px; margin: 0 0 0 auto; line-height: 1.5; min-height: 1.5em; font-size: 13px; color: var(--workspace-muted, #586771); text-align: right; }
.metal-local-status[data-state="ready"]::before { content: ''; display: inline-block; width: 6px; height: 6px; margin: 0 7px 2px 0; border-radius: 50%; background: #537c72; }
.metal-local-status[data-state="blocked"] { font-weight: 700; }
.metal-local-stage { position: relative; height: min(52dvh, 560px); min-height: 420px; box-sizing: border-box; padding: 30px 0 42px; display: flex; align-items: center; justify-content: center; background: var(--catalog-surface, #f2f4f3); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.metal-local-stage[data-state="ready"] { padding-top: 0; border-radius: 0 0 12px 12px; }
.metal-local-stage img { display: block; width: 100%; height: 100%; min-width: 0; min-height: 0; object-fit: contain; }
.metal-local-stage > p:not(.metal-stage-caption) { padding: 32px; max-width: 50ch; }
.metal-stage-label { position: absolute; top: 0; left: 0; right: 0; min-height: 30px; box-sizing: border-box; padding: 6px 14px; background: #fffefb; border-bottom: 1px solid var(--line); color: var(--navy); font-size: 12px; font-weight: 700; }
.metal-stage-caption { position: absolute; bottom: 0; left: 0; right: 0; margin: 0; padding: 10px 16px; min-height: 42px; box-sizing: border-box; background: var(--surface); border-top: 1px solid var(--line); color: var(--workspace-muted, #586771); font-size: 12px; }
.metal-local-stage[data-state="ready"] { display: grid; grid-template-rows: minmax(0, 1fr) auto; padding: 0; }
.metal-local-stage div.metal-stage-caption { position: static; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; padding: 8px 12px; }
.metal-stage-caption p { flex: 1 1 9em; margin: 0; }
.metal-stage-caption .button { flex: 0 0 auto; }
/* Exact local triangle preview: controls occupy their own row, never the canvas. */
.metal-local-stage.has-metal-mesh { height: auto; min-height: 0; grid-template-rows: auto auto; }
.metal-mesh-viewport { position: relative; width: 100%; height: clamp(320px, 48dvh, 540px); min-width: 0; overflow: hidden; }
.metal-mesh-viewport .model-canvas { display: block; width: 100%; height: 100%; }
.metal-mesh-controls { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; min-width: 0; padding: 10px; border-top: 1px solid var(--line); background: var(--surface); }
.metal-mesh-controls .button { flex: 0 0 auto; }
.metal-local-workspace [data-metal-action="cancel"][hidden] { display: none; }
@media (max-width: 760px) {
  .metal-mesh-viewport { height: clamp(290px, 42dvh, 400px); }
}
.metal-projection-dialog { width: min(1320px, calc(100vw - 32px)); max-width: none; height: calc(100dvh - 32px); max-height: none; padding: 16px; border: 1px solid var(--line); border-radius: 16px; color: var(--ink); background: var(--surface); }
.metal-projection-dialog[open] { display: flex; flex-direction: column; gap: 12px; }
.metal-projection-dialog::backdrop { background: #102235b3; }
.metal-projection-dialog header { display: flex; flex: 0 0 auto; flex-wrap: wrap; align-items: start; gap: 12px; }
.metal-projection-dialog header > div { flex: 1 1 12em; min-width: 0; }
.metal-local-workspace .metal-projection-dialog h2 { margin: 0; font-size: 20px; }
.metal-projection-dialog p { margin: 4px 0 0; color: var(--workspace-muted, #586771); }
.metal-projection-tools { display: flex; flex: 0 0 auto; flex-wrap: wrap; align-items: center; gap: 8px; }
.metal-projection-tools output { min-width: 4em; text-align: center; font-size: 13px; font-variant-numeric: tabular-nums; }
.metal-projection-scroll { flex: 1 1 0; min-height: 0; overflow: auto; border: 1px solid var(--line); border-radius: 10px; background: var(--catalog-surface, #f2f4f3); overscroll-behavior: contain; }
.metal-projection-sheet { width: calc(100% * var(--projection-zoom, 1)); height: calc(100% * var(--projection-zoom, 1)); }
.metal-projection-sheet img { display: block; width: 100%; height: 100%; object-fit: contain; }
.metal-local-stage[data-state="calculating"] img { opacity: .45; }
.metal-local-stage[data-state="calculating"] .metal-stage-label { background: var(--navy); color: white; }
.metal-local-model-facts { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 18px; padding: 15px 0 5px; font-size: 13px; }
.metal-local-model-facts strong { font-size: 15px; color: var(--navy); }
.metal-local-exports { margin-top: 16px; padding: 17px 20px; border: 1px solid var(--line); border-radius: var(--radius, 16px); background: var(--surface); }
.metal-local-exports h2 { margin: 0 0 4px !important; color: var(--navy); }
.metal-local-exports [data-metal-export-note] { margin: 0 0 14px; color: var(--muted); }
.metal-local-primary-export { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 15px; }
.metal-local-primary-export > span { color: var(--muted); font-size: 12px; }
.metal-local-format-list { padding: 3px 0 7px; }
.metal-local-workspace .field { margin: 12px 0; }
.metal-local-workspace .check-field { margin: 12px 0; }
.metal-local-workspace .check-field input[type="checkbox"] { flex: 0 0 16px; width: 16px; height: 16px; }
.current-server-bridge { margin-top: 24px; max-width: 800px; }
.current-server-bridge .project-actions { flex-wrap: wrap; }
.current-server-bridge .check-field input[type="checkbox"] { flex: 0 0 16px; width: 16px; height: 16px; }
.current-server-bridge .field { margin: 12px 0; }
.current-server-bridge .input { width: 100%; }
.current-server-bridge .section-content { padding: 12px 0; }
.current-server-bridge summary { padding: 14px 0; cursor: pointer; font-weight: 600; }
.metal-local-workspace .section-content { padding: 8px 0 14px; }
.metal-local-workspace .settings-section { border-bottom: 1px solid var(--line); }
.metal-local-workspace .settings-section summary { cursor: pointer; min-height: 44px; padding: 12px 0; font-size: 13px; font-weight: 600; color: var(--navy); }
.metal-local-essentials { padding-bottom: 11px; border-bottom: 1px solid var(--line); }
.metal-local-essentials h3 { margin: 5px 0 12px; color: var(--navy); }
.metal-local-field-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 4px 12px; }
.metal-local-field-grid .field { margin: 0 0 8px; }
.metal-local-form-actions { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 16px; }
.metal-local-inspector-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: start; gap: 10px; font-size: 13px; }
.metal-local-inspector-head > div { flex: 1 1 10em; min-width: 0; }
.metal-local-inspector-head h2 { overflow-wrap: anywhere; }
.metal-local-inspector-head [data-metal-action="model"] { display: none; }
.metal-local-workspace input, .metal-local-workspace select, .metal-local-workspace textarea { max-width: 100%; min-width: 0; caret-color: var(--navy); }
.metal-local-workspace textarea { width: 100%; resize: vertical; font: inherit; line-height: 1.5; }
.metal-local-workspace :focus-visible { outline: 2px solid var(--navy); outline-offset: 3px; }
.metal-local-workspace ::selection { color: var(--surface); background: var(--navy); }
.metal-local-workspace p, .metal-local-workspace li { line-height: 1.55; overflow-wrap: anywhere; }
.metal-local-workspace ul { padding-left: 22px; }
.metal-local-workspace li + li { margin-top: 8px; }
.metal-local-table-wrap { overflow: auto; scrollbar-color: var(--muted) var(--stage); }
.metal-local-workspace table { width: 100%; border-collapse: collapse; font-size: 13px; font-variant-numeric: tabular-nums; }
.metal-local-workspace th, .metal-local-workspace td { padding: 8px; text-align: left; border-bottom: 1px solid var(--line); }
.metal-local-workspace table input { width: 100%; }
.metal-local-workspace pre { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 12px; max-height: 360px; overflow: auto; }
.metal-local-cell { border: 1px solid var(--line); padding: 10px; margin: 12px 0; }
.metal-local-cell legend { font-weight: 600; }
.metal-local-safety { margin-top: 24px; color: var(--muted); max-width: 70ch; }
.metal-local-guide-link:empty { display: none; }
.metal-local-guide-link:not(:empty) { margin-top: 8px; }
.metal-local-guide-link .seo-entry-link { display: inline-flex; align-items: center; min-height: 40px; font-size: 13px; }
.metal-local-projects { margin-top: 24px; }
.metal-local-workspace .metal-local-inspector-head h2 { margin: 0 0 4px; }
.metal-local-inspector-intro { margin: 0 0 12px; color: var(--muted); }
.metal-catalog-picker>summary {cursor:pointer;min-height:40px;padding-block:10px;font-weight:600;}
.metal-catalog-picker[open] {max-height:65dvh;overflow:auto;scrollbar-width:thin;}
.metal-local-inspector .input {width:100%;}
.metal-local-workspace :is(p,li) {font-size:12px;}
.metal-local-cell {border-radius:8px;}
@media(min-width:761px) {
 .metal-local-inspector {max-height:calc(100dvh - var(--public-header-height,72px) - 32px);overflow:auto;scrollbar-width:thin;position:sticky;top:calc(var(--public-header-height,72px) + 16px);scroll-margin-top:calc(var(--public-header-height,72px) + 16px);}
}
@media(min-width:761px) and (max-width:980px) {
 .metal-local-inspector {top:calc(var(--workspace-mobile-offset,154px) + 12px);max-height:calc(100dvh - var(--workspace-mobile-offset,154px) - 24px);scroll-margin-top:calc(var(--workspace-mobile-offset,154px) + 12px);}
}
@media (max-width: 1200px) {
  .metal-local-layout { gap: 16px; }
}
@media (max-width: 760px) {
  .metal-local-layout { grid-template-columns: minmax(0, 1fr); }
  .metal-local-main, .metal-local-inspector { scroll-margin-top: calc(var(--workspace-mobile-offset, 154px) + 12px); }
  .metal-local-stage { height: clamp(300px, 40dvh, 360px); min-height: 300px; padding-bottom: 58px; }
  .metal-local-inspector { grid-column: 1; grid-row: 3; }
  .metal-local-main { grid-column: 1; grid-row: 2; }
  .metal-local-toolbar [data-metal-action="parameters"] { display: inline-flex; }
  .metal-local-inspector-head [data-metal-action="model"] { display: inline-flex; flex: 0 0 auto; }
  .metal-local-form-actions .primary { flex: 1 1 160px; }
  .metal-local-exports { padding: 15px; }
  .metal-stage-label { padding-inline: 10px; }
  .metal-stage-caption { padding: 10px; min-height: 58px; }
  .metal-projection-dialog { width: calc(100vw - 16px); height: calc(100dvh - 16px); padding: 12px; border-radius: 12px; }
  .metal-local-toolbar [data-metal-action="undo"], .metal-local-toolbar [data-metal-action="redo"] { width: 44px; min-width: 44px; padding: 0; }
  .metal-local-toolbar :is([data-metal-action="undo"], [data-metal-action="redo"]) span { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .metal-local-toolbar [data-metal-action="undo"] svg, .metal-local-toolbar [data-metal-action="redo"] svg { width: 18px; height: 18px; }
  .metal-local-catalog [data-metal-products] { gap: 6px; }
  .metal-local-catalog [data-metal-products] { flex-wrap: wrap; }
  .metal-local-catalog .metal-catalog-category { flex: 0 1 auto; overflow: visible; text-overflow: clip; white-space: normal; overflow-wrap: anywhere; }
  .metal-local-catalog [data-metal-switch] { flex: 1 1 100%; justify-content: center; margin-left: 0; }
  .metal-local-catalog a { font-size: 12px; }
  .metal-local-catalog [data-tool-picker] { padding-inline: 10px; font-size: 12px; }
  .metal-local-workspace .workspace-head { margin-bottom: 12px; }
  .metal-local-workspace [data-metal-title] { font-size: 25px; }
  .metal-local-status { flex-basis: 100%; text-align: left; margin: 2px 0 0; }
  .metal-local-toolbar { gap: 8px 6px; }
  .metal-local-toolbar [data-metal-action="calculate"] { flex: 1 1 auto; }
  .metal-local-toolbar [data-metal-action="parameters"] { flex: 1 1 auto; }
}
@media (prefers-reduced-motion: reduce) {
  .metal-local-workspace *, .metal-local-workspace *::before, .metal-local-workspace *::after { transition: none; animation: none; }
}
.metal-local-exports[hidden] {display:none;}
.metal-model-information {margin-top:16px;border-top:1px solid var(--line);}
.metal-model-information>summary {display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:44px;list-style:none;padding:12px 0;cursor:pointer;color:var(--muted);font-size:13px;}
.metal-model-information>summary::-webkit-details-marker {display:none;}
.metal-model-information[open]>summary>svg {transform:rotate(180deg);}
.metal-model-information .metal-local-safety {margin:0 0 16px;}
.metal-local-catalog [data-metal-switch] {margin-left:auto;}

/* The product chooser uses real geometry on the same quiet surface as the studio. */
.metal-catalogue .metal-tool-card { display: flex; flex-direction: column; padding: 0; overflow: hidden; border-radius: var(--catalog-radius, 18px); background: var(--surface); transition: border-color 180ms ease, box-shadow 180ms ease; }
.metal-catalogue .metal-tool-card:hover { background: var(--surface); border-color: var(--navy); box-shadow: 0 3px 12px #17335a0a; }
.metal-catalogue .metal-tool-card .catalog-preview { background: var(--catalog-surface, #f2f4f3); padding: 12px; }
.metal-catalogue .metal-product-copy { padding: 16px; min-width: 0; }
.metal-catalogue .metal-product-copy h3 { display: flex; justify-content: space-between; gap: 12px; margin: 0 0 8px; font-size: 18px; line-height: 1.4; overflow-wrap: anywhere; hyphens: auto; }
.metal-catalogue .metal-product-copy h3 > span { flex: 0 0 18px; }
.metal-catalogue .metal-product-copy p { font-size: 13px; color: var(--workspace-muted, #586771); }
.metal-catalogue .metal-product-copy small { color: var(--workspace-muted, #586771); }
.metal-local-workspace :is(.button, summary), .metal-catalogue .catalogue-categories a { transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease; }
@media(max-width:600px) {
 .metal-catalogue .catalogue-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 9em), 1fr)); gap: 16px 12px; font-size: 15px; }
 .metal-catalogue .metal-tool-card .catalog-preview { --catalog-preview-height: 156px; padding: 8px; }
 .metal-catalogue .metal-product-copy { padding: 12px; }
 .metal-catalogue .metal-product-copy h3 > span { display: none; }
}
@media(prefers-reduced-motion:reduce) {
 .metal-catalogue *, .metal-local-workspace :is(.button, summary) { transition: none; }
}
