/* Büro › CAD-Studio (CAD_PLAN.md). A deliberately dark work surface for long days; drawings later on light paper.
   Motion: only transform/opacity, ease-out under 250 ms, press feedback scale(.97), hover only with a fine pointer. */
#cad-view {
  --cd-bg: #0a0f15; --cd-stage-a: #131c27; --cd-stage-b: #070b10;
  --cd-panel: #101821; --cd-glass: rgba(16, 24, 33, .84); --cd-raise: #16212d; --cd-raise-2: #1c2937;
  --cd-line: rgba(160, 185, 210, .11); --cd-line-2: rgba(160, 185, 210, .2);
  --cd-text: #e8eef4; --cd-muted: #94a3b2; --cd-faint: #66778a;
  --cd-accent: #5fb6ff; --cd-accent-soft: rgba(95, 182, 255, .14); --cd-ink: #04121f;
  --cd-ok: #5fd39a; --cd-warn: #f2b85b; --cd-warn-soft: rgba(242, 184, 91, .12); --cd-bad: #ff7d7d;
  --cd-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
  --cd-ease: cubic-bezier(.23, 1, .32, 1);
  position: relative; color: var(--cd-text); font-size: 13px; line-height: 1.45; color-scheme: dark;
  container-type: inline-size; container-name: cd;
}
#cad-view, #cad-view * { box-sizing: border-box; }
#cad-view button, #cad-view input, #cad-view select, #cad-view textarea { font: inherit; color: inherit; letter-spacing: normal; text-transform: none; }
#cad-view button { cursor: pointer; }
#cad-view :focus-visible { outline: 2px solid var(--cd-accent); outline-offset: 2px; }
#cad-view .num { font-variant-numeric: tabular-nums; }
#cad-view .cd-hide { display: none !important; }

/* buttons */
#cad-view .cd-btn { display: inline-flex; align-items: center; gap: 7px; min-height: 32px; padding: 0 13px; border-radius: 9px; border: 1px solid var(--cd-line-2);
  background: var(--cd-raise); color: var(--cd-text); font-weight: 550; white-space: nowrap; transition: transform 140ms var(--cd-ease), background-color 150ms ease, border-color 150ms ease; }
#cad-view .cd-btn:active { transform: scale(.97); }
#cad-view .cd-btn.primary { background: var(--cd-accent); border-color: transparent; color: var(--cd-ink); }
#cad-view .cd-btn.ghost { background: transparent; }
#cad-view .cd-btn.danger { color: var(--cd-bad); }
#cad-view .cd-btn.small { min-height: 26px; padding: 0 9px; font-size: 12px; border-radius: 7px; }
#cad-view .cd-btn:disabled { opacity: .5; cursor: default; transform: none; }
#cad-view .cd-btn svg { width: 15px; height: 15px; stroke: currentColor; fill: none; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
@media (hover: hover) and (pointer: fine) {
  #cad-view .cd-btn:hover:not(:disabled) { background: var(--cd-raise-2); }
  #cad-view .cd-btn.primary:hover:not(:disabled) { background: #7cc4ff; }
  #cad-view .cd-btn.ghost:hover:not(:disabled) { background: var(--cd-raise); }
}
#cad-view .cd-pill { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; border-radius: 99px; border: 1px solid var(--cd-line-2); color: var(--cd-muted); font-size: 12px; white-space: nowrap; background: transparent; }
#cad-view .cd-pill i { width: 7px; height: 7px; border-radius: 50%; background: var(--cd-ok); }
#cad-view .cd-pill.warn i { background: var(--cd-warn); }
#cad-view .cd-pill.bad i { background: var(--cd-bad); }
#cad-view .cd-eyebrow { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--cd-faint); font-weight: 650; margin: 0 0 8px; display: flex; justify-content: space-between; align-items: center; gap: 8px; }
#cad-view .cd-eyebrow span { text-transform: none; letter-spacing: 0; font-weight: 500; }

/* library ------------------------------------------------------------------------------------------------------ */
#cad-view .cd-lib { background: var(--cd-bg); border-radius: 18px; padding: 26px 26px 30px; min-height: 520px; border: 1px solid var(--cd-line); }
#cad-view .cd-lib-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin-bottom: 22px; }
#cad-view .cd-lib-head h2 { font-size: 26px; font-weight: 650; margin: 2px 0 4px; letter-spacing: -.015em; color: var(--cd-text); background: none; -webkit-text-fill-color: currentColor; }
#cad-view .cd-lib-head p { margin: 0; color: var(--cd-muted); max-width: 62ch; }
#cad-view .cd-lib-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
#cad-view .cd-search { height: 34px; min-width: 0; width: 240px; max-width: 100%; border-radius: 9px; border: 1px solid var(--cd-line-2); background: var(--cd-raise); padding: 0 12px; outline: none; }
#cad-view .cd-search::placeholder { color: var(--cd-faint); }
#cad-view .cd-start { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; margin-bottom: 26px; }
#cad-view .cd-tile { text-align: left; border: 1px solid var(--cd-line); background: linear-gradient(160deg, #142030, #0e1620); border-radius: 14px; padding: 14px 16px; display: grid; gap: 4px;
  transition: transform 140ms var(--cd-ease), border-color 160ms ease; }
#cad-view .cd-tile:active { transform: scale(.98); }
#cad-view .cd-tile b { font-weight: 600; }
#cad-view .cd-tile small { color: var(--cd-muted); font-size: 12px; }
#cad-view .cd-tile em { font-style: normal; color: var(--cd-accent); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; font-weight: 650; }
@media (hover: hover) and (pointer: fine) { #cad-view .cd-tile:hover { border-color: rgba(95, 182, 255, .4); } }
#cad-view .cd-docs { display: grid; gap: 6px; }
#cad-view .cd-doc { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 12px; align-items: center; width: 100%; text-align: left; padding: 10px 12px; border-radius: 12px;
  border: 1px solid transparent; background: var(--cd-panel); transition: transform 140ms var(--cd-ease), border-color 160ms ease; }
#cad-view .cd-doc:active { transform: scale(.99); }
@media (hover: hover) and (pointer: fine) { #cad-view .cd-doc:hover { border-color: var(--cd-line-2); } }
#cad-view .cd-doc-ico { width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; background: var(--cd-raise-2); color: var(--cd-accent); }
#cad-view .cd-doc-ico svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 1.5; }
#cad-view .cd-doc-t { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#cad-view .cd-doc-m { color: var(--cd-faint); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#cad-view .cd-doc-r { display: flex; gap: 6px; align-items: center; color: var(--cd-faint); font-size: 12px; }
#cad-view .cd-status { padding: 2px 8px; border-radius: 99px; font-size: 11px; border: 1px solid var(--cd-line-2); color: var(--cd-muted); white-space: nowrap; }
#cad-view .cd-status.review { color: var(--cd-warn); border-color: rgba(242, 184, 91, .4); }
#cad-view .cd-status.released { color: var(--cd-ok); border-color: rgba(95, 211, 154, .4); }
#cad-view .cd-empty { color: var(--cd-muted); padding: 24px 4px; }

/* editor ------------------------------------------------------------------------------------------------------- */
#cad-view .cd-ed { display: grid; grid-template-rows: 50px auto minmax(0, 1fr) 28px; height: calc(100dvh - var(--tarvi-head, 72px) - 28px); min-height: 560px;
  background: var(--cd-bg); border-radius: 16px; overflow: hidden; border: 1px solid var(--cd-line); }
#cad-view.is-full .cd-ed { height: 100dvh; border-radius: 0; border: 0; }
#cad-view.is-full { position: fixed; inset: 0; z-index: 1200; background: var(--cd-bg); padding: env(safe-area-inset-top, 0) env(safe-area-inset-right, 0) env(safe-area-inset-bottom, 0) env(safe-area-inset-left, 0); }
#cad-view .cd-top { display: flex; align-items: center; gap: 12px; padding: 0 12px 0 10px; border-bottom: 1px solid var(--cd-line); background: #0c131b; min-width: 0; }
#cad-view .cd-title { min-width: 0; display: flex; flex-direction: column; line-height: 1.2; }
#cad-view .cd-title b { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#cad-view .cd-title small { color: var(--cd-faint); font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#cad-view .cd-top .sp { flex: 1; }
#cad-view .cd-mob { display: none; }
#cad-view .cd-ribbon { display: flex; align-items: center; gap: 4px; padding: 6px 12px; border-bottom: 1px solid var(--cd-line); background: #0b1118; overflow-x: auto; scrollbar-width: none; }
#cad-view .cd-tool { display: grid; justify-items: center; gap: 2px; min-width: 64px; padding: 5px 6px 4px; border: 0; border-radius: 8px; background: transparent; color: var(--cd-muted); font-size: 11px; flex: none;
  transition: transform 120ms var(--cd-ease), background-color 150ms ease, color 150ms ease; }
#cad-view .cd-tool:active { transform: scale(.96); }
#cad-view .cd-tool svg { width: 20px; height: 20px; stroke: currentColor; fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
#cad-view .cd-tool[aria-pressed="true"] { background: var(--cd-accent-soft); color: var(--cd-accent); }
@media (hover: hover) and (pointer: fine) { #cad-view .cd-tool:hover { background: var(--cd-raise); color: var(--cd-text); } }
#cad-view .cd-sep { width: 1px; height: 30px; background: var(--cd-line); margin: 0 6px; flex: none; }
#cad-view .cd-rib-note { color: var(--cd-faint); font-size: 12px; margin-left: 10px; white-space: nowrap; }
#cad-view .cd-main { display: grid; grid-template-columns: 268px minmax(0, 1fr) 340px; min-height: 0; position: relative; }
#cad-view .cd-side, #cad-view .cd-insp { background: var(--cd-panel); overflow: auto; min-height: 0; scrollbar-width: thin; }
#cad-view .cd-side { border-right: 1px solid var(--cd-line); }
#cad-view .cd-insp { border-left: 1px solid var(--cd-line); }
#cad-view .cd-sec { padding: 13px 13px 11px; }
#cad-view .cd-sec + .cd-sec { border-top: 1px solid var(--cd-line); }
#cad-view .cd-tree { list-style: none; margin: 0; padding: 0; display: grid; gap: 1px; }
#cad-view .cd-node { width: 100%; display: flex; align-items: center; gap: 8px; border: 0; background: transparent; text-align: left; padding: 5px 7px; border-radius: 7px; color: var(--cd-text); }
#cad-view .cd-node[aria-current="true"] { background: var(--cd-accent-soft); box-shadow: inset 0 0 0 1px rgba(95, 182, 255, .25); }
@media (hover: hover) and (pointer: fine) { #cad-view .cd-node:hover:not([aria-current="true"]) { background: var(--cd-raise); } }
#cad-view .cd-node .ico { width: 16px; height: 16px; flex: none; color: var(--cd-muted); }
#cad-view .cd-node .ico svg { width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 1.5; }
#cad-view .cd-node .lab { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#cad-view .cd-node .meta { margin-left: auto; color: var(--cd-faint); font-size: 11.5px; white-space: nowrap; }
#cad-view .cd-node .ai { font-size: 9.5px; font-weight: 700; color: var(--cd-accent); background: var(--cd-accent-soft); border-radius: 4px; padding: 1px 4px; flex: none; }
#cad-view .cd-node .warn { color: var(--cd-warn); }
#cad-view .cd-node.err .lab { color: var(--cd-bad); }
#cad-view .cd-node.off .lab { color: var(--cd-faint); text-decoration: line-through; }
#cad-view .cd-params { display: grid; gap: 4px; }
#cad-view .cd-param { display: grid; grid-template-columns: minmax(0, 1fr) 96px; gap: 8px; align-items: center; }
#cad-view .cd-param label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--cd-muted); }
#cad-view .cd-param label b { color: var(--cd-text); font-weight: 500; font-family: var(--cd-mono); font-size: 12px; }
#cad-view .cd-in { width: 100%; height: 28px; border-radius: 7px; border: 1px solid var(--cd-line-2); background: var(--cd-raise); padding: 0 8px; outline: none; font-family: var(--cd-mono); font-size: 12px; text-align: right; min-width: 0; }
#cad-view .cd-in:focus { border-color: var(--cd-accent); }
#cad-view .cd-in.changed { border-color: var(--cd-warn); }
#cad-view select.cd-in { text-align: left; font-family: inherit; font-size: 12.5px; }
#cad-view textarea.cd-in { height: auto; min-height: 64px; padding: 6px 8px; line-height: 1.45; resize: vertical; text-align: left; }
#cad-view .cd-versions { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
#cad-view .cd-ver { width: 100%; display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 8px; border: 0; background: transparent; text-align: left; padding: 6px 7px; border-radius: 8px; color: var(--cd-text); }
#cad-view .cd-ver[aria-current="true"] { background: var(--cd-raise-2); }
@media (hover: hover) and (pointer: fine) { #cad-view .cd-ver:hover { background: var(--cd-raise); } }
#cad-view .cd-ver .who { width: 22px; height: 22px; border-radius: 6px; display: grid; place-items: center; font-size: 9.5px; font-weight: 700; background: var(--cd-raise-2); color: var(--cd-muted); }
#cad-view .cd-ver.ai .who { background: var(--cd-accent-soft); color: var(--cd-accent); }
#cad-view .cd-ver .t { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: 12.5px; }
#cad-view .cd-ver .m { color: var(--cd-faint); font-size: 11.5px; }

/* stage */
#cad-view .cd-stage { position: relative; min-width: 0; min-height: 0; background: radial-gradient(120% 90% at 50% 18%, var(--cd-stage-a), var(--cd-stage-b)); overflow: hidden; }
#cad-view .cd-stage canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; touch-action: none; outline: none; }
#cad-view .cd-glass { background: var(--cd-glass); border: 1px solid var(--cd-line-2); border-radius: 10px; backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
#cad-view .cd-chips { position: absolute; top: 12px; left: 14px; display: flex; gap: 8px; flex-wrap: wrap; max-width: calc(100% - 130px); pointer-events: none; }
#cad-view .cd-chips .cd-glass { padding: 6px 10px; font-size: 12px; color: var(--cd-muted); }
#cad-view .cd-chips b { color: var(--cd-text); font-weight: 550; }
#cad-view .cd-cube-wrap { position: absolute; top: 12px; right: 14px; width: 74px; height: 74px; perspective: 260px; }
#cad-view .cd-cube { position: absolute; inset: 9px; transform-style: preserve-3d; }
#cad-view .cd-cube button { position: absolute; inset: 0; border: 1px solid rgba(160, 185, 210, .3); background: rgba(22, 33, 45, .86); color: var(--cd-muted); font: 650 8px/1 Inter, system-ui, sans-serif;
  letter-spacing: .06em; display: grid; place-items: center; backface-visibility: hidden; padding: 0; min-height: 0; }
@media (hover: hover) and (pointer: fine) { #cad-view .cd-cube button:hover { background: var(--cd-accent); color: var(--cd-ink); } }
#cad-view .cd-viewbar { position: absolute; top: 94px; right: 14px; display: grid; gap: 4px; }
#cad-view .cd-viewbar button { width: 34px; height: 34px; border-radius: 8px; border: 1px solid var(--cd-line-2); background: var(--cd-glass); color: var(--cd-muted); display: grid; place-items: center; padding: 0;
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); transition: transform 120ms var(--cd-ease); }
#cad-view .cd-viewbar button:active { transform: scale(.94); }
#cad-view .cd-viewbar button[aria-pressed="true"] { color: var(--cd-accent); border-color: rgba(95, 182, 255, .45); }
#cad-view .cd-viewbar svg { width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
#cad-view .cd-banner { position: absolute; left: 50%; top: 12px; transform: translateX(-50%); display: flex; gap: 10px; align-items: center; padding: 6px 6px 6px 12px; font-size: 12.5px; max-width: calc(100% - 200px); }
#cad-view .cd-banner.warn { border-color: rgba(242, 184, 91, .45); }
#cad-view .cd-banner span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#cad-view .cd-loading { position: absolute; inset: 0; display: grid; place-items: center; color: var(--cd-muted); pointer-events: none; opacity: 0; transition: opacity 200ms ease; }
#cad-view .cd-loading[data-on="true"] { opacity: 1; }
#cad-view .cd-loading div { padding: 10px 16px; }
#cad-view .cd-cmd { position: absolute; left: 50%; bottom: 16px; transform: translateX(-50%); width: min(620px, calc(100% - 28px)); }
#cad-view .cd-cmd form { display: flex; align-items: center; gap: 8px; padding: 5px 5px 5px 14px; border-radius: 14px; box-shadow: 0 18px 50px rgba(0, 0, 0, .45); }
#cad-view .cd-cmd input { flex: 1; min-width: 0; border: 0; background: transparent; outline: none; height: 34px; font-size: 14px; }
#cad-view .cd-cmd input::placeholder { color: var(--cd-faint); }
#cad-view .cd-sugg { display: flex; gap: 6px; flex-wrap: wrap; justify-content: center; margin-bottom: 8px; transition: opacity 160ms var(--cd-ease), transform 160ms var(--cd-ease); }
#cad-view .cd-sugg[data-hide="true"] { opacity: 0; transform: translateY(6px); pointer-events: none; }
#cad-view .cd-sugg button { border: 1px solid var(--cd-line-2); background: var(--cd-glass); border-radius: 99px; padding: 4px 11px; font-size: 12px; color: var(--cd-muted); min-height: 0;
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); transition: transform 120ms var(--cd-ease); }
#cad-view .cd-sugg button:active { transform: scale(.96); }
@media (hover: hover) and (pointer: fine) { #cad-view .cd-sugg button:hover { color: var(--cd-text); border-color: rgba(95, 182, 255, .4); } }

/* inspector */
#cad-view .cd-insp h3 { font-size: 15.5px; font-weight: 600; margin: 0 0 2px; text-wrap: balance; color: var(--cd-text); }
#cad-view .cd-sub { color: var(--cd-muted); margin: 0; font-size: 12.5px; }
#cad-view .cd-kv { display: grid; grid-template-columns: auto 1fr; gap: 6px 14px; margin: 0; }
#cad-view .cd-kv dt { color: var(--cd-faint); }
#cad-view .cd-kv dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; }
#cad-view .cd-form { display: grid; gap: 8px; }
#cad-view .cd-field { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 8px; align-items: center; }
#cad-view .cd-field > span { color: var(--cd-muted); font-size: 12.5px; }
#cad-view .cd-trio { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }
#cad-view .cd-quote { margin: 0; padding: 9px 11px; border-radius: 8px; background: var(--cd-raise); border-left: 2px solid var(--cd-accent); }
#cad-view .cd-quote small { display: block; color: var(--cd-faint); margin-top: 4px; font-size: 11px; }
#cad-view .cd-as { padding: 9px 10px; border-radius: 8px; background: var(--cd-warn-soft); border: 1px solid rgba(242, 184, 91, .22); display: grid; gap: 6px; }
#cad-view .cd-as + .cd-as { margin-top: 6px; }
#cad-view .cd-as p { margin: 0; }
#cad-view .cd-as .why { color: var(--cd-muted); font-size: 12px; }
#cad-view .cd-as .acts { display: flex; gap: 6px; }
#cad-view .cd-as.done { background: rgba(95, 211, 154, .08); border-color: rgba(95, 211, 154, .22); }
#cad-view .cd-as.done p::before { content: "✓ "; color: var(--cd-ok); }
#cad-view .cd-rule { display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; padding: 6px 0; border-bottom: 1px solid var(--cd-line); }
#cad-view .cd-rule:last-child { border-bottom: 0; }
#cad-view .cd-rule .src { color: var(--cd-accent); font-size: 12px; white-space: nowrap; }
#cad-view .cd-err { padding: 9px 10px; border-radius: 8px; background: rgba(255, 125, 125, .08); border: 1px solid rgba(255, 125, 125, .25); color: #ffc1c1; display: grid; gap: 4px; }
#cad-view .cd-err + .cd-err { margin-top: 6px; }
#cad-view .cd-acts { display: flex; gap: 8px; flex-wrap: wrap; }
#cad-view .cd-meter { display: grid; grid-template-columns: 1fr auto; gap: 4px 10px; font-size: 12.5px; }
#cad-view .cd-meter span:nth-child(odd) { color: var(--cd-faint); }
#cad-view .cd-meter span:nth-child(even) { text-align: right; font-variant-numeric: tabular-nums; font-family: var(--cd-mono); font-size: 12px; }

/* status bar and toast */
#cad-view .cd-statusbar { display: flex; align-items: center; gap: 16px; padding: 0 12px; border-top: 1px solid var(--cd-line); background: #0c131b; color: var(--cd-faint); font-size: 12px; white-space: nowrap; overflow: hidden; }
#cad-view .cd-statusbar b { color: var(--cd-muted); font-weight: 500; font-variant-numeric: tabular-nums; }
#cad-view .cd-statusbar .w { color: var(--cd-warn); }
#cad-view .cd-toast { position: absolute; left: 50%; bottom: 92px; transform: translate(-50%, 8px); opacity: 0; padding: 9px 14px; border-radius: 10px; background: #1f2d3c; border: 1px solid var(--cd-line-2);
  box-shadow: 0 14px 40px rgba(0, 0, 0, .4); transition: opacity 180ms var(--cd-ease), transform 180ms var(--cd-ease); pointer-events: none; z-index: 30; max-width: calc(100% - 32px); }
#cad-view .cd-toast[data-on="true"] { opacity: 1; transform: translate(-50%, 0); }
#cad-view .cd-toast.bad { border-color: rgba(255, 125, 125, .4); }

@container cd (max-width: 1180px) { #cad-view .cd-main { grid-template-columns: 236px minmax(0, 1fr) 300px; } #cad-view .cd-rib-note { display: none; } }
@container cd (max-width: 880px) {
  #cad-view .cd-ed { grid-template-rows: 50px auto minmax(0, 1fr) 0; }
  #cad-view .cd-statusbar { display: none; }
  #cad-view .cd-top .cd-pill { display: none; }
  #cad-view .cd-mob { display: inline-flex; }
  #cad-view .cd-main { grid-template-columns: minmax(0, 1fr); }
  #cad-view .cd-side, #cad-view .cd-insp { position: absolute; z-index: 20; top: 0; bottom: 0; width: min(330px, 88%); transition: transform 240ms cubic-bezier(.32, .72, 0, 1); box-shadow: 0 20px 60px rgba(0, 0, 0, .5); }
  #cad-view .cd-side { left: 0; transform: translateX(-104%); }
  #cad-view .cd-insp { right: 0; transform: translateX(104%); }
  #cad-view .cd-side[data-open="true"], #cad-view .cd-insp[data-open="true"] { transform: none; }
  #cad-view .cd-tool { min-width: 58px; }
  #cad-view .cd-cube-wrap { top: 54px; }
  #cad-view .cd-viewbar { top: 136px; }
  #cad-view .cd-banner { top: 54px; left: 14px; transform: none; max-width: calc(100% - 110px); }
  #cad-view .cd-lib { padding: 18px 16px 22px; }
}
@media (prefers-reduced-motion: reduce) {
  #cad-view *, #cad-view *::before, #cad-view *::after { transition-property: opacity, background-color, border-color, color !important; }
}

/* app-wide label styles (ui-system/buero-look) do not apply inside the CAD work surface */
#workspace #cad-view label { font-weight: 500; color: inherit; }
#workspace #cad-view .cd-field > span { color: var(--cd-muted); font-weight: 500; }
#cad-view .cd-field.wide { grid-template-columns: minmax(0, 1fr); gap: 4px; }
#cad-view .cd-side { overflow-x: hidden; }
#cad-view .cd-node { min-width: 0; }
@container cd (max-width: 880px) {
  #cad-view .cd-title, #cad-view .cd-top .cd-full { display: none; }
  #cad-view .cd-top .sp { flex: 1; }
}

/* sketch editor (cad-sketch.js): a 2D sheet over the stage */
#cad-view .cd-sk { position: absolute; inset: 0; z-index: 12; background: radial-gradient(120% 90% at 50% 18%, #121b25, #070b10); }
#cad-view .cd-sk-canvas { position: absolute; inset: 0; outline: none; touch-action: none; }
#cad-view .cd-sk-head { position: absolute; top: 12px; left: 14px; display: flex; align-items: center; gap: 10px; padding: 6px 12px; font-size: 12.5px; max-width: calc(100% - 28px); }
#cad-view .cd-sk-head b { font-weight: 600; white-space: nowrap; }
#cad-view .cd-sk-state { color: var(--cd-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#cad-view .cd-sk-head[data-state="ok"] .cd-sk-state { color: var(--cd-ok); }
#cad-view .cd-sk-head[data-state="free"] .cd-sk-state { color: var(--cd-accent); }
#cad-view .cd-sk-head[data-state="bad"] .cd-sk-state { color: var(--cd-bad); }
#cad-view .cd-sk-bar { position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%); display: flex; gap: 2px; padding: 4px; max-width: calc(100% - 20px); overflow-x: auto; scrollbar-width: none; }
#cad-view .cd-sk-cbar { top: 12px; bottom: auto; left: auto; right: 14px; transform: none; flex-direction: column; overflow: visible; }
#cad-view .cd-sk-tool { display: grid; justify-items: center; gap: 2px; min-width: 58px; padding: 5px 6px 4px; border: 0; border-radius: 8px; background: transparent; color: var(--cd-muted); font-size: 10.5px; flex: none; min-height: 0;
  transition: transform 120ms var(--cd-ease), background-color 150ms ease, color 150ms ease; }
#cad-view .cd-sk-tool.small { min-width: 0; width: 34px; height: 34px; place-items: center; padding: 0; }
#cad-view .cd-sk-tool:active { transform: scale(.95); }
#cad-view .cd-sk-tool svg { width: 19px; height: 19px; stroke: currentColor; fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
#cad-view .cd-sk-tool[aria-pressed="true"] { background: var(--cd-accent-soft); color: var(--cd-accent); }
@media (hover: hover) and (pointer: fine) { #cad-view .cd-sk-tool:hover { background: var(--cd-raise); color: var(--cd-text); } }
#cad-view .cd-sk-inline { position: absolute; display: flex; gap: 6px; padding: 5px; z-index: 3; }
#cad-view .cd-sk-inline input { width: 130px; height: 28px; border-radius: 7px; border: 1px solid var(--cd-accent); background: var(--cd-raise); padding: 0 8px; font-family: var(--cd-mono); font-size: 12.5px; outline: none; }
#cad-view .cd-sk-words p { margin: 0 0 4px; }
#cad-view .cd-sk-words.ok p:first-child { color: var(--cd-ok); }
#cad-view .cd-sk-words.free p:first-child { color: var(--cd-accent); }
#cad-view .cd-sk-words.bad p { color: #ffb3b3; }
#cad-view .cd-sk-warn { margin: 6px 0 0; color: var(--cd-warn); font-size: 12px; }
#cad-view .cd-sk-cons { display: flex; flex-wrap: wrap; gap: 4px; }
#cad-view .cd-sk-con { display: inline-flex; align-items: center; gap: 4px; padding: 2px 4px 2px 8px; border-radius: 99px; border: 1px solid var(--cd-line-2); font-size: 11.5px; color: var(--cd-muted); }
#cad-view .cd-sk-con.bad { border-color: rgba(255, 125, 125, .5); color: #ffb3b3; }
#cad-view .cd-sk-con button { border: 0; background: transparent; color: var(--cd-faint); width: 18px; height: 18px; border-radius: 50%; padding: 0; min-height: 0; line-height: 1; }
#cad-view .cd-param label.bad b { color: var(--cd-bad); }
#cad-view .cd-checks { display: grid; gap: 4px; }
#cad-view .cd-checks label { display: flex; gap: 8px; align-items: center; font-size: 12.5px; }
#cad-view .cd-note { margin: 0; padding: 8px 10px; border-radius: 8px; background: var(--cd-raise); color: var(--cd-muted); font-size: 12.5px; }
#cad-view .cd-rib-group { display: grid; gap: 2px; flex: none; }
#cad-view .cd-rib-group > span { font-size: 10px; letter-spacing: .07em; text-transform: uppercase; color: var(--cd-faint); padding-left: 6px; }
#cad-view .cd-rib-group > div { display: flex; gap: 2px; }
@container cd (max-width: 880px) { #cad-view .cd-sk-cbar { top: 54px; } #cad-view .cd-sk-tool { min-width: 50px; } #cad-view .cd-rib-group > span { display: none; } }

/* TARVI designs (C3): dictation, proposal, design check */
#cad-view .cd-mic { width: 34px; height: 34px; border-radius: 10px; border: 0; background: var(--cd-raise-2); color: var(--cd-muted); display: grid; place-items: center; flex: none; padding: 0; min-height: 0;
  transition: transform 120ms var(--cd-ease), background-color 150ms ease; }
#cad-view .cd-mic:active { transform: scale(.94); }
#cad-view .cd-mic svg { width: 17px; height: 17px; stroke: currentColor; fill: none; stroke-width: 1.7; stroke-linecap: round; }
#cad-view .cd-mic.on { background: var(--cd-accent); color: var(--cd-ink); box-shadow: 0 0 0 4px rgba(95, 182, 255, .18); }
#cad-view .cd-think { color: var(--cd-accent); }
#cad-view .cd-think::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 8px; border-radius: 50%; background: var(--cd-accent); animation: cd-pulse 1s ease-in-out infinite; }
@keyframes cd-pulse { 50% { opacity: .3; } }
#cad-view .cd-ask { margin: 0 0 8px; padding: 9px 11px; border-radius: 8px; background: var(--cd-accent-soft); border: 1px solid rgba(95, 182, 255, .3); }
#cad-view .cd-did { margin: 0; padding-left: 18px; color: var(--cd-muted); display: grid; gap: 3px; }
#cad-view .cd-finding { padding: 9px 10px; border-radius: 8px; border: 1px solid var(--cd-line-2); background: var(--cd-raise); display: grid; gap: 4px; }
#cad-view .cd-finding + .cd-finding { margin-top: 6px; }
#cad-view .cd-finding p { margin: 0; }
#cad-view .cd-finding .why { color: var(--cd-muted); font-size: 12px; }
#cad-view .cd-finding .src { color: var(--cd-accent); font-size: 11.5px; }
#cad-view .cd-finding-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
#cad-view .cd-finding .lv { font-size: 11px; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; color: var(--cd-faint); }
#cad-view .cd-finding.error { border-color: rgba(255, 125, 125, .35); background: rgba(255, 125, 125, .07); }
#cad-view .cd-finding.error .lv { color: var(--cd-bad); }
#cad-view .cd-finding.warn { border-color: rgba(242, 184, 91, .35); background: var(--cd-warn-soft); }
#cad-view .cd-finding.warn .lv { color: var(--cd-warn); }
@media (prefers-reduced-motion: reduce) { #cad-view .cd-think::before { animation: none; } }

/* assemblies (C4) */
#cad-view .cd-bom-wrap { overflow-x: auto; padding-top: 4px; }
#cad-view .cd-bom { width: 100%; border-collapse: collapse; font-size: 12px; }
#cad-view .cd-bom th { text-align: left; color: var(--cd-faint); font-weight: 600; font-size: 11px; padding: 4px 6px 6px 0; border-bottom: 1px solid var(--cd-line-2); }
#cad-view .cd-bom td { padding: 6px 6px 6px 0; border-bottom: 1px solid var(--cd-line); vertical-align: top; }
#cad-view .cd-bom td small { display: block; color: var(--cd-faint); font-size: 11px; }
#cad-view .cd-bom td.num { text-align: right; font-variant-numeric: tabular-nums; }

/* drawings (C5): the sheet on a calm grey table; model-only parts of the editor step back */
#cad-view .cd-ed.cd-drawing .cd-stage > canvas, #cad-view .cd-ed.cd-drawing .cd-chips, #cad-view .cd-ed.cd-drawing .cd-cube-wrap,
#cad-view .cd-ed.cd-drawing .cd-viewbar, #cad-view .cd-ed.cd-drawing .cd-cmd, #cad-view .cd-ed.cd-drawing .cd-banner,
#cad-view .cd-ed.cd-drawing .cd-ribbon > .cd-rib-group:not(.cd-draw-tools), #cad-view .cd-ed.cd-drawing .cd-ribbon > .cd-sep,
#cad-view .cd-ed.cd-drawing .cd-ribbon > .cd-tool, #cad-view .cd-ed.cd-drawing .cd-top .cd-pill { display: none !important; }
#cad-view .cd-ed.cd-drawing .cd-top button[title^="Technische Zeichnung"], #cad-view .cd-ed.cd-drawing .cd-top button[title^="Als STEP"] { display: none; }
#cad-view .cd-sheet-wrap { position: absolute; inset: 0; overflow: hidden; background: radial-gradient(120% 90% at 50% 20%, #2a313a, #171c22); cursor: grab; touch-action: none; }
#cad-view .cd-sheet { position: absolute; left: 0; top: 0; transform-origin: 0 0; box-shadow: 0 30px 80px rgba(0, 0, 0, .5); background: #fff; }
#cad-view .cd-sheet svg { width: 100%; height: 100%; display: block; }
#cad-view .cd-sheet g[data-g^="view:"] { cursor: move; }
#cad-view .cd-sheet g.cd-view-sel { filter: drop-shadow(0 0 1.5px #2563eb); }
#cad-view .cd-sheet .cd-schema-svg { position: absolute; inset: 0; }
#cad-view .cd-sheet .cd-schema-over { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; overflow: visible; }
#cad-view .cd-sheet g[data-g^="item:"] { cursor: move; }
#cad-view .cd-sheet g[data-g^="line:"] { cursor: pointer; }
#cad-view .cd-sheet-wrap.cd-routing { cursor: crosshair; }
#cad-view .cd-schema-route { fill: none; stroke: #0b6aa2; stroke-width: .6; stroke-linejoin: round; }
#cad-view .cd-schema-route.sig { stroke-dasharray: 2 1.2; stroke-width: .35; }
#cad-view .cd-schema-pt { fill: #0b6aa2; }
#cad-view .cd-schema-pal { margin-top: 10px; }
#cad-view .cd-schema-pal .cd-chips { display: flex; flex-wrap: wrap; gap: 6px; }
#cad-view .cd-schema-pal .cd-chip { border: 1px solid var(--cd-line, rgba(255,255,255,.14)); background: transparent; color: inherit; border-radius: 999px; padding: 5px 10px; font: inherit; font-size: 12px; cursor: pointer; }
#cad-view .cd-schema-pal .cd-chip.on, #cad-view .cd-schema-pal .cd-chip:hover { border-color: #5fb6ff; color: #5fb6ff; }
#cad-view tr.cd-click { cursor: pointer; }
#cad-view tr.cd-click:hover td { color: #5fb6ff; }
#cad-view .cd-sheet-status { position: absolute; left: 14px; bottom: 14px; padding: 6px 12px; font-size: 12px; color: var(--cd-muted); }
#cad-view .cd-dimrow { display: flex; gap: 6px; align-items: center; justify-content: space-between; font-size: 12.5px; padding: 3px 0; }
#cad-view .cd-dimrow span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#cad-view .cd-dimrow.proposal span { color: #8fb7ff; }
#cad-view .cd-notes { height: auto; min-height: 70px; text-align: left; font-family: inherit; padding: 6px 8px; resize: vertical; }
#cad-view .cd-dimrow { width: 100%; }
#cad-view .cd-dimrow > button { flex: none; }
#cad-view .cd-dimrow > span { flex: 1 1 0; }

/* statics (C12) */
#cad-view .cd-st-hero { display: flex; align-items: baseline; gap: 10px; margin: 8px 0 4px; }
#cad-view .cd-st-hero b { font: 650 30px/1 var(--cd-mono); letter-spacing: -.02em; color: var(--cd-ok); font-variant-numeric: tabular-nums; }
#cad-view .cd-st-hero.bad b { color: var(--cd-bad); }
#cad-view .cd-st-hero span { color: var(--cd-muted); font-size: 12.5px; }
#cad-view .cd-st-list { display: flex; flex-direction: column; gap: 2px; max-height: 340px; overflow: auto; margin: 0 -6px; }
#cad-view .cd-st-row { display: grid; grid-template-columns: minmax(0, 1fr) auto 64px 38px; align-items: center; gap: 8px; padding: 6px; border: 0; border-radius: 7px;
  background: transparent; color: inherit; text-align: left; font: inherit; transition: background-color 150ms ease, transform 140ms var(--cd-ease); }
#cad-view button.cd-st-row:active { transform: scale(.985); }
@media (hover: hover) and (pointer: fine) { #cad-view button.cd-st-row:hover { background: var(--cd-raise); } }
#cad-view .cd-st-row .nm { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#cad-view .cd-st-row .pr { color: var(--cd-faint); font-size: 11.5px; white-space: nowrap; }
#cad-view .cd-st-row .bar { height: 5px; border-radius: 3px; background: var(--cd-raise-2); overflow: hidden; }
#cad-view .cd-st-row .bar i { display: block; height: 100%; transform-origin: left; border-radius: 3px; }
#cad-view .cd-st-row .u { font: 550 12px var(--cd-mono); text-align: right; font-variant-numeric: tabular-nums; }
#cad-view .cd-st-load { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--cd-line); }
#cad-view .cd-st-load b { display: block; font-weight: 550; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#cad-view .cd-st-load small { display: block; color: var(--cd-muted); font-size: 11.5px; }
#cad-view .cd-st-load .case { width: 22px; height: 22px; border-radius: 6px; display: grid; place-items: center; font: 650 11px var(--cd-mono); background: var(--cd-accent-soft); color: var(--cd-accent); }
#cad-view .cd-st-load .case-G { background: rgba(160, 185, 210, .14); color: var(--cd-text); }
#cad-view .cd-st-load .case-W { background: var(--cd-warn-soft); color: var(--cd-warn); }
#cad-view .cd-st-pick { display: flex; flex-direction: column; gap: 2px; max-height: 260px; overflow: auto; }
#cad-view .cd-st-pick label { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 4px 2px; }
#cad-view .cd-st-pick small { color: var(--cd-faint); font-size: 11.5px; }
#cad-view .cd-st-size { display: grid; grid-template-columns: minmax(0, 1fr) auto 76px; gap: 8px; align-items: center; padding: 7px 6px; border-bottom: 1px solid var(--cd-line); }
#cad-view .cd-st-size b { display: block; font-weight: 550; }
#cad-view .cd-st-size small { display: block; color: var(--cd-muted); font-size: 11.5px; }
#cad-view .cd-st-size .pr { font: 550 12px var(--cd-mono); color: var(--cd-accent); white-space: nowrap; }
#cad-view .cd-st-size .u { font: 12px var(--cd-mono); text-align: right; color: var(--cd-muted); font-variant-numeric: tabular-nums; }
#cad-view .cd-steel tr.loose td { color: var(--cd-faint); }
#cad-view .cd-steel td:last-child { text-align: right; }
#cad-view .cd-list { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 4px; font-size: 12.5px; }
#cad-view .cd-list li { display: flex; flex-wrap: wrap; gap: 4px; padding: 5px 8px; border-radius: 8px; background: color-mix(in srgb, var(--cd-muted) 9%, transparent); }
#cad-view .cd-list b { font-weight: 600; font-variant-numeric: tabular-nums; }
#cad-view .cd-list span { color: var(--cd-muted); }
#cad-view .cd-stress { display: grid; grid-template-columns: 9.5em 1fr auto; align-items: center; gap: 2px 8px; font-size: 12.5px; margin: 6px 0; }
#cad-view .cd-stress meter { width: 100%; height: 8px; }
#cad-view .cd-stress b { font-variant-numeric: tabular-nums; }
#cad-view .cd-stress small { grid-column: 1 / -1; color: var(--cd-muted); }
#cad-view .cd-stress.warn b { color: #d9a400; }
#cad-view .cd-stress.bad b { color: #e5484d; }
#cad-view .cd-list li .cd-btn { margin-left: auto; }

#cad-view .cd-instruments, #cad-view .cd-instrument-list { display: grid; gap: 8px; min-width: 0; }
#cad-view .cd-instrument-row { display: grid; gap: 8px; min-width: 0; margin: 0; padding: 10px; border: 1px solid var(--cd-line, #404854); border-radius: 8px; }
#cad-view .cd-instrument-row legend { padding: 0 5px; color: var(--cd-muted); font-size: 12px; }
#cad-view .cd-instrument-row > button { justify-self: start; }

#cad-view .cd-instrument-row .cd-field { grid-template-columns: minmax(0, 1fr); gap: 4px; }
#cad-view .cd-instrument-row input { text-align: left; }

#cad-view .cd-flat { margin: 8px 0; padding: 8px; border: 1px solid var(--cd-line, #404854); border-radius: 8px; background: var(--cd-raise); color: var(--cd-text);
  --cad-flat-fill: var(--cd-raise-2); --cad-flat-bg: var(--cd-raise); }
#cad-view .cd-flat svg { display: block; width: 100%; height: auto; max-height: 260px; }
#cad-view .cd-flat text { font-family: inherit; }
#cad-view .cd-check-row { display: flex; align-items: center; gap: 8px; margin: 6px 0; font-size: 12.5px; }

/* data list (Data Manager) over the 3D view */
#cad-view .cd-datasheet { position: absolute; inset: 10px; z-index: 6; display: flex; flex-direction: column; gap: 8px; padding: 14px 16px; overflow: hidden;
  background: var(--cd-panel); border: 1px solid var(--cd-line-2); border-radius: 12px; box-shadow: 0 18px 50px rgba(0, 0, 0, .45); }
#cad-view .cd-datahead { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
#cad-view .cd-datahead h3 { margin: 0; }
#cad-view .cd-datahead > .cd-btn { margin-left: auto; }
#cad-view .cd-datawrap { flex: 1; min-height: 0; overflow: auto; }
#cad-view .cd-datatable th { position: sticky; top: 0; background: var(--cd-panel); white-space: nowrap; }
#cad-view .cd-datatable td { padding: 2px 4px; white-space: nowrap; }
#cad-view .cd-datatable td.muted { color: var(--cd-muted); }
#cad-view .cd-datatable .cd-in { min-width: 72px; height: 28px; padding: 0 6px; }
#cad-view .cd-datatable .cd-in.inherited { color: var(--cd-faint); font-style: italic; }
#cad-view .cd-datatable .cd-in.edited { border-color: var(--cd-warn); background: var(--cd-warn-soft); }
@media (max-width: 880px) { #cad-view .cd-datasheet { inset: 4px; padding: 10px; } }
#cad-view .cd-spoolbox { margin-top: 6px; }
#cad-view .cd-spoolbox > summary { cursor: pointer; font-size: 12px; color: var(--cd-muted, #5b6b7a); padding: 4px 0; }
#cad-view .cd-spools td small { white-space: nowrap; }
#cad-view .cd-layers { display: flex; flex-direction: column; gap: 4px; max-height: 220px; overflow-y: auto; }
#cad-view .cd-layers small { display: block; }
#cad-view .cd-layers label { display: flex; align-items: center; justify-content: flex-start; gap: 8px; font-size: 12px; text-align: left; }
#cad-view .cd-layers input[type=checkbox] { margin: 0; flex: none; width: auto; height: auto; }
#cad-view .cd-layers label { width: 100%; }
#cad-view .cd-bom td.num.bad { color: #ff9d9d; font-weight: 600; }
#cad-view .cd-bom td.num.warn { color: #f2b85b; }
#cad-view .cd-spoolrow { display: grid; grid-template-columns: minmax(0, 1fr) 130px; gap: 8px; align-items: center; margin: 4px 0; }
#cad-view .cd-spoolrow .cd-note { margin: 0; }
#cad-view .cd-prefab-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; margin-bottom: 14px; }
#cad-view .cd-prefab-card { border: 1px solid var(--cd-line-2); border-radius: 10px; padding: 10px 12px; display: grid; gap: 4px; }
#cad-view .cd-prefab-card h4 { margin: 0; }
#cad-view .cd-prefab-bar { display: grid; grid-template-columns: 82px minmax(0, 1fr) 42px; gap: 6px; align-items: center; font-size: 12px; }
#cad-view .cd-prefab-bar meter { width: 100%; }
#cad-view .cd-prefab-bar b { text-align: right; font-variant-numeric: tabular-nums; }
#cad-view .cd-draft-sel { fill: none; stroke: #2f80ed; stroke-width: 0.9; stroke-opacity: .8; }
#cad-view .cd-draft-cursor { fill: none; stroke: #2f80ed; stroke-width: 0.35; }
#cad-view .cd-ed.cd-drawing .cd-ribbon:has(.cd-draw-tools) { scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, .25) transparent; }
#cad-view .cd-draft-grip { fill: #2f80ed; stroke: #fff; stroke-width: 0.25; }
#cad-view .cd-draft-frame { fill: rgba(47, 128, 237, .08); stroke: #2f80ed; stroke-width: 0.3; }
#cad-view .cd-draft-frame.crossing { fill: rgba(39, 174, 96, .08); stroke: #27ae60; stroke-dasharray: 1.2 0.8; }
#cad-view .cd-layerlist { display: grid; gap: 4px; }
#cad-view .cd-layerrow { display: grid; grid-template-columns: 28px 30px minmax(0, 1fr) 62px; gap: 4px; align-items: center; }
#cad-view .cd-layerrow input[type=color] { width: 28px; height: 24px; padding: 0; border: none; background: none; }
#cad-view .cd-layerrow .cd-node { text-align: left; }
#cad-view .cd-layerrow.active .cd-node { font-weight: 600; }