/* Dark visual baseline, 2026-10-12. Public pages and the real CAD studio share tokens. */
:root:not(:has(.admin-layout,.admin-auth)) {
  color-scheme: dark;
  --ink: #f3f7f8; --muted: #acc1cd; --paper: #081419; --surface: #11232b;
  --canvas: #0b1b22; --line: #25424f; --accent: #43edf0; --green: #43edf0;
  --tint: #102d34; --orange: #43edf0; --danger: #ffac93;
}
body:not(:has(.admin-layout,.admin-auth)) { color: var(--ink); background: radial-gradient(ellipse at 50% 0,#18303b66,transparent 55vh),#061116; }
body:not(:has(.admin-layout,.admin-auth)) :is(button,a,input,select,summary):focus-visible { outline-color: var(--accent); }
:is(.stage,.detail-stage) { --preview-rule:#2a4a59; }
:is(.stage,.detail-stage) .viewport-tools { background:#091920e8; border-color:var(--preview-rule); border-radius:7px; padding:5px; }
:is(.stage,.detail-stage) .viewport-tools button { color:#c4d8e1; border-radius:5px; }
:is(.stage,.detail-stage) .viewport-tools button[aria-pressed=true] { color:var(--accent); background:#103239; }
:is(.stage,.detail-stage) .viewport-tools button:hover:not(:disabled):not([aria-pressed=true]) { background:#1c353f; }
:is(.stage,.detail-stage) :is(.assembly-control,.zoom-controls) { background:#0c1d25eb; color:#e8f4f8; border-color:var(--preview-rule); }
:is(.stage,.detail-stage) .assembly-control input { accent-color:#e8f4f8; }
:is(.stage,.detail-stage) :is(.stage-hint,.stage-state,.stage-footer) { color:#b9ceda; }
:is(.stage,.detail-stage) .stage-state { background:#112730ed; border-color:var(--line); }
:is(.stage,.detail-stage) .preview-dock .stage-hint { font-size:12px; }
:is(.stage,.detail-stage) .preview-dock .stage-hint::before { content:''; display:inline-block; width:14px; height:22px; margin-right:12px; vertical-align:middle; border:1.4px solid #c1d5df; border-radius:8px; background:linear-gradient(#c1d5df,#c1d5df) center 0 / 1px 10px no-repeat,linear-gradient(#c1d5df,#c1d5df) center 9px / 100% 1px no-repeat; }
:is(#dimensions,.detail-dimensions) path { stroke:var(--accent); }
:is(#dimensions,.detail-dimensions) rect { fill:#112731; stroke:#315968; }
:is(#dimensions,.detail-dimensions) text { fill:#e3f6fb; }
body:has(.workspace) { height:100dvh; overflow:hidden; font-family:Inter,-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif; }
.topbar { background:#09171dc9; border-color:var(--line); }
.topbar .brand-mark { transform:none; }
.topbar .brand strong { font-size:23px; font-weight:700; }
.topbar .brand-mark svg { width:34px; height:38px; }
.top-actions .secondary-button { color:var(--ink); background:#10212a; border-color:var(--line); }
body:has(.workspace) .workspace { grid-template-columns:clamp(208px,15.5vw,260px) minmax(0,1fr) clamp(320px,26vw,400px); padding:18px 22px 24px; gap:16px; }
.workspace > :is(.library,.stage,.inspector) { border:1px solid var(--line); border-radius:9px; background:linear-gradient(135deg,#11242c88,#08171e); }
.library-heading { padding:17px 12px 10px; }
.library-heading h1 { display:flex; align-items:center; gap:12px; font-size:20px; margin:0 0 17px; }
.library-heading h1::before { content:''; width:21px; height:21px; border:1.8px solid var(--accent); border-radius:3px; background:linear-gradient(var(--accent),var(--accent)) center / 1.5px 100% no-repeat,linear-gradient(var(--accent),var(--accent)) center / 100% 1.5px no-repeat; }
.search-style { height:43px; padding:8px 10px; background:#142932; border-color:#365361; border-radius:6px; }
.search-style > span { font-size:26px; font-weight:300; }
.search-style input { color:var(--ink); font-size:14px; }
.search-style input::placeholder { color:var(--muted); }
.filter-pills { justify-content:space-between; border-bottom:1px solid var(--line); border-radius:0; }
.filter-pills button { padding:8px 12px 12px; color:var(--muted); font-size:13px; border-radius:0; position:relative; }
.filter-pills .active { background:transparent; color:var(--accent); font-weight:600; }
.filter-pills .active::after { content:''; position:absolute; height:3px; left:2px; right:2px; bottom:-1px; background:var(--accent); border-radius:4px 4px 0 0; }
.template-list { padding:0 9px 8px; scrollbar-width:thin; scrollbar-color:#284451 transparent; }
.template-card { position:relative; border:1px solid #203d49; border-radius:7px; background:#0e2028; margin-bottom:9px; }
.template-card.selected { border-color:var(--accent); box-shadow:0 0 0 1px #43edf020; }
.template-card.selected::after { content:'当前款式'; position:absolute; top:9px; right:9px; background:#10343a; color:var(--accent); border:1px solid #297d84; border-radius:4px; padding:3px 7px; font-size:12px; font-weight:600; }
.template-card .template-image { background:#10212a; border-radius:0; }
.template-card img { background:transparent; aspect-ratio:1.5; }
.template-card strong { margin:0 12px 11px; font-size:14px; font-weight:600; }
.template-card small { display:none; }
.library-loading { padding:8px 9px 15px; border-color:var(--line); }
.library-loading :is(p,button) { color:var(--muted); }
.library-loading .secondary-button { background:#11252e; border-color:#335462; }
.stage-heading { left:24px; top:20px; right:78px; z-index:1; }
.stage-heading h2 { font-size:clamp(24px,2.1vw,34px); letter-spacing:-.8px; line-height:1.35; color:var(--ink); font-weight:700; }
.stage-subtitle { color:#bfd5e1; font-size:14px; line-height:1.7; margin-top:5px; }
.stage .viewport-tools { top:20px; right:18px; }
.inspector { --panel-gutter:18px; overflow:hidden; }
.inspector-heading { padding:17px var(--panel-gutter) 10px; }
.inspector-heading h2 { color:var(--ink); font-size:20px; }
.inspector .top-note { margin:0 var(--panel-gutter) 12px; color:var(--muted); font-size:11px; }
.inspector-scroll { scrollbar-width:thin; scrollbar-color:#284451 transparent; }
.inspector .config-section { padding:8px var(--panel-gutter); border-bottom:0; }
.inspector .section-title { min-height:18px; margin-bottom:6px; }
.inspector :is(.section-title h3,.advanced-fields>summary>span) { font-size:14px; color:var(--ink); }
.inspector .parameter-fields { gap:6px 16px; }
.inspector .parameter-fields.envelope-fields { grid-template-columns:repeat(auto-fit,minmax(100px,1fr)); }
.inspector .parameter-field>label { color:#bed0db; font-size:13px; margin-bottom:2px; }
.inspector .parameter-field .number-box { background:linear-gradient(110deg,#152b35,#11232b); border-color:#345160; border-radius:6px; height:38px; }
.inspector .number-box:focus-within { border-color:var(--accent); box-shadow:0 0 0 1px #43edf050; }
.inspector :is(.parameter-field input,.parameter-field select) { color:var(--ink); font-size:15px; }
.inspector .parameter-field select option { background:#12252e; }
.inspector .parameter-field:has(select),.inspector .advanced-fields .parameter-field:only-child { display:grid; grid-template-columns:85px minmax(0,1fr); align-items:center; gap:4px 10px; }
.inspector .parameter-field:has(select)>label,.inspector .advanced-fields .parameter-field:only-child>label { margin:0; }
.inspector .parameter-field:has(select) :is(.parameter-hint,.field-error),.inspector .advanced-fields .parameter-field:only-child :is(.parameter-hint,.field-error) { grid-column:2; }
.inspector .advanced-fields .parameter-field:only-child { grid-column:1/-1; }
.inspector .number-box>span { color:var(--muted); font-size:12px; }
.inspector .parameter-field .number-box>small { color:var(--muted); }
.inspector .count-control button { color:var(--ink); height:36px; border-radius:0; }
.inspector .count-control input { border-inline:1px solid #28424f; }
.inspector .parameter-hint { color:#b0c7d3!important; font-size:11px!important; margin-top:3px!important; }
.inspector :is(.model-details,.connection-info) { padding:12px var(--panel-gutter); color:var(--muted); border-color:var(--line); }
.inspector :is(.model-details h3,.connection-info h3) { color:var(--ink); font-size:14px; }
.inspector #detail-values { font-size:12px; line-height:1.6; }
.inspector :is(.print-notes,.field-note) { color:var(--muted); }
.inspector .print-notes { margin:0 var(--panel-gutter); padding-block:12px; border-color:var(--line); }
.inspector .print-notes summary { color:var(--ink); font-size:14px; }
.inspector .swatches { gap:18px; padding:2px 4px; }
.inspector .swatch { width:32px; height:32px; border:2px solid #14262e; box-shadow:0 0 0 1px #55636b; }
.inspector .swatch.selected { box-shadow:0 0 0 2px var(--accent); }
.inspector .swatch.selected::after { display:none; }
.inspector-export { flex:none; padding:10px 15px 14px; border-top:1px solid var(--line); background:#0b1b22; }
.inspector-export .primary-button { display:flex; justify-content:center; width:100%; min-height:48px; background:var(--accent); color:#021518; font-size:17px; font-weight:700; border-color:var(--accent); }
.inspector-export p { color:var(--muted); text-align:center; font-size:12px; margin:8px 0 0; }
body:has(.workspace) :is(.primary-button,.secondary-button) { border-radius:6px; }
body:has(.workspace) .primary-button { background:var(--accent); color:#021518; border-color:var(--accent); }
body:has(.workspace) .primary-button:hover:not(:disabled) { background:#8cf8fa; border-color:#8cf8fa; }
body:has(.workspace) .secondary-button { background:#142831; color:var(--ink); border-color:#34515e; }
body:has(.workspace) :is(dialog,.canvas-error) { background:#10232c; color:var(--ink); border-color:var(--line); }
body:has(.workspace) dialog :is(p,small,.export-part,.export-format) { color:var(--muted); }
body:has(.workspace) .export-config { color:var(--ink); background:#18323d; }
.generation-footer { background:#10262e; color:var(--muted); border-color:var(--line); }
.generation-footer :is(span,.text-button) { color:var(--muted); }
@media(min-width:1000px) { .workspace .stage { margin-bottom:0; } }
@media(min-width:1000px) and (max-width:1250px) { body:has(.workspace) .workspace { grid-template-columns:196px minmax(0,1fr) 300px; padding:14px; gap:12px; } .stage-heading h2 { font-size:24px; } .inspector { --panel-gutter:13px; } }
@media(max-width:999px) {
  body:has(.workspace) .workspace { display:block; padding:12px; }
  .workspace>.stage,.workspace>.library,.workspace>.inspector { inset:12px; height:calc(100% - 24px); }
  .workspace>.stage { margin:0; }
  .workspace>.library,.workspace>.inspector { background:#0b1a21; }
  .mobile-switch { background:#091820; border-color:var(--line); }
  .mobile-switch button { color:var(--muted); }
  .mobile-switch button.active { color:var(--accent); border-color:var(--accent); }
  .inspector .parameter-fields { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .panel-reset,.panel-help { background:#142831; border-color:var(--line); color:var(--ink); }
  .template-card img { aspect-ratio:1.5; }
  .stage-heading { left:17px; right:72px; }
  .stage-heading h2 { font-size:24px; }
  .stage-subtitle { font-size:12px; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; } }
/* Keep generated facts close to the object; the inspector retains its complete list. */
.stage .stage-heading .stage-subtitle { color:#b8cfdd; font-size:14px; }
.stage .preview-dock .stage-hint>span { color:inherit; }
.inspector .parameter-field:has(.count-control) .parameter-hint { display:none; }
.inspector .parameter-field:has(.count-control):last-child .parameter-hint { display:block; }
.inspector .count-control>small { display:none; }
.inspector .model-details { background:transparent; }
.inspector .model-details summary { cursor:pointer; color:var(--ink); font-size:14px; font-weight:600; }
.stage-metrics { min-width:0; }
.stage-metrics dl { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; margin:0; }
.stage-metrics dl>div { min-width:0; padding:10px 22px; }
.stage-metrics dl>div:not(:first-child) { border-left:1px solid var(--line); }
.stage-metrics dt { color:#b4cddc; font-size:13px; }
.stage-metrics dd { margin:7px 0 0; color:var(--ink); font-size:25px; font-weight:650; line-height:1.3; overflow-wrap:anywhere; }
.stage-metrics .metric-text dd { font-size:14px; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
@media(min-width:1000px) {
  .workspace>.library { grid-column:1; grid-row:1; }
  .workspace>.stage { grid-column:2; grid-row:1; }
  .workspace>.inspector { grid-column:3; grid-row:1; }
  .workspace>.stage { margin-bottom:105px; }
  .workspace>.stage-metrics { grid-column:2; grid-row:1; align-self:end; height:86px; }
}
@media(min-width:1400px) {
  .inspector { position:relative; }
  .inspector-heading { padding-bottom:8px; }
  .inspector .top-note { position:absolute; top:19px; right:17px; margin:0; max-width:210px; font-size:10px; text-align:right; line-height:1.6; }
}
@media(max-width:999px) { .workspace>.stage-metrics { display:none!important; }.stage .stage-heading .stage-subtitle { font-size:12px; } }

/* Disabled controls and secondary hover states stay legible on dark surfaces. */
body:has(.workspace) .secondary-button:hover:not(:disabled):not([aria-disabled=true]) { background:#24424e; border-color:#57909a; color:#f3f7f8; }
body:has(.workspace) :is(.primary-button,.secondary-button):disabled,body:has(.workspace) :is(.primary-button,.secondary-button)[aria-disabled=true] { opacity:1; background:#182e38; color:#8fa8b6; border-color:#34505e; cursor:not-allowed; }
body:has(.workspace) .dialog-close { color:#d6e7ef; }
body:has(.workspace) .dialog-close:hover { background:#24424e; color:#fff; }
body:has(.workspace) .default-download { width:auto; text-decoration:none; border-color:#51dadd; }
.default-download small { background:#43edf0; color:#052025; border-radius:4px; padding:2px 5px; font-size:11px; font-weight:700; }
body:has(.workspace) .export-config strong,body:has(.workspace) .export-format strong { color:#e2eff5; }
body:has(.workspace) .preview-poster { background:#0b1b22; }
body:has(.workspace) :is(.filter-pills button,.mobile-switch button):hover:not(.active) { color:#e7f5fa; background:#19323d; }
:is(.stage,.detail-stage) .zoom-controls button:hover { background:#24424e; color:#f3f7f8; }
:is(.stage,.detail-stage) .viewport-tools button[aria-pressed=true]:focus-visible { outline-color:var(--accent); }

/* Loading and recovery stay on the object the user is watching. */
.stage .generation-footer { position:absolute; z-index:4; top:50%; left:50%; right:auto; bottom:auto; transform:translate(-50%,-50%); display:block; width:min(400px,calc(100% - 40px)); max-width:none; min-height:164px; padding:22px; margin:0; border:1px solid #365663; border-radius:10px; background:#10252ef5; box-shadow:0 12px 48px #0005; overflow:hidden; text-align:center; }
.generation-status strong { display:flex; align-items:center; justify-content:center; gap:9px; min-height:24px; color:#e7f3f8; font-size:16px; font-weight:650; }
.generation-status strong::before { content:''; display:block; width:7px; height:7px; flex:none; border-radius:50%; background:#7f9fac; }
.generation-status p { margin:10px 0 18px; font-size:13px; line-height:1.7; color:#bfd2dd; overflow-wrap:anywhere; }
.generation-footer[data-state=error] .generation-status strong { color:#ffd2a1; }
.generation-footer:is([data-state=dirty],[data-state=error]) strong::before { background:#edbd79; }
.generation-footer:is([data-state=loading],[data-state=generating]) strong::before { width:15px; height:15px; border:2px solid #37616e; border-top-color:#43edf0; background:transparent; animation:studio-job-spin 1s linear infinite; }
.generation-actions { display:flex; justify-content:center; flex-wrap:wrap; gap:10px; }
.generation-actions .secondary-button { flex:1; min-width:110px; min-height:44px; margin:0; padding:9px 14px; border-color:#477783; background:#173640; color:#e3f4fa; font-size:13px; }
.stage .generation-actions #preview-retry { background:#43edf0; border-color:#43edf0; color:#032026; font-weight:650; }
.stage .generation-actions #preview-retry:hover { background:#80f8f9; border-color:#80f8f9; color:#032026; }
.generation-progress { position:absolute; left:0; right:0; bottom:0; height:3px; overflow:hidden; background:transparent; }
.generation-progress span { display:none; height:100%; width:38%; background:#43edf0; }
.generation-footer:is([data-state=loading],[data-state=generating]) .generation-progress { background:#193c47; }
.generation-footer:is([data-state=loading],[data-state=generating]) .generation-progress span { display:block; animation:studio-job-progress 1.8s ease-in-out infinite; }
.stage[data-has-frame=true]:is([data-task-state=generating],[data-task-state=error],[data-task-state=cancelled]) #viewport { opacity:.45; }
.inspector-export { padding:12px 15px; border-top:1px solid #294652; }
.inspector-preview-actions { display:flex; gap:8px; margin-bottom:10px; }
.inspector-preview-actions .secondary-button { flex:1; min-height:40px; width:auto; margin:0; padding:8px; color:#dff9fb; background:#153641; border-color:#477783; }
#show-preview { display:none; }
.inspector-export .primary-button { min-height:44px; }
.inspector-export p { min-height:18px; font-size:11px; margin-top:6px; }
@keyframes studio-job-progress { from { transform:translateX(-105%); } to { transform:translateX(365%); } }
@keyframes studio-job-spin { to { transform:rotate(360deg); } }
@media(prefers-reduced-motion:reduce) { .generation-progress span { animation:none!important; width:100%; opacity:.7; }.generation-status strong::before { animation:none!important; } }
@media(max-width:999px) {
  #show-preview { display:block; }
  .inspector-preview-actions .secondary-button { min-height:44px; }
  .stage .generation-footer { width:calc(100% - 32px); min-height:150px; padding:16px; }
}
/* Low-height browser windows scroll instead of collapsing the form to zero. */
@media(max-height:500px) {
  .workspace>.inspector { overflow:auto; }
  .inspector .inspector-scroll { flex:none; overflow:visible; }
  .inspector-heading,.inspector-export { flex:none; }
}
