:root {
  color-scheme: dark;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --background: #050505;
  --primary: #111111;
  --secondary: #191919;
  --accent: #f2f2f2;
  --icon: #8c8c8c;
  --valid: #183b2a;
  --error: #421c20;
  --background-text: #f2f2f2;
  --primary-text: #d0d0d0;
  --secondary-text: #888888;
  --accent-text: #0a0a0a;
  --error-text: #ff9aa2;
  --valid-text: #8ddaaf;
  --bg: var(--background);
  --sidebar: var(--primary);
  --surface: var(--primary);
  --surface-2: var(--secondary);
  --surface-3: #202020;
  --border: #2a2a2a;
  --border-soft: #222222;
  --text: var(--background-text);
  --text-2: var(--primary-text);
  --text-3: var(--secondary-text);
  --blue: var(--accent);
  --blue-soft: var(--secondary);
  --green: var(--valid-text);
  --green-soft: var(--valid);
  --amber: var(--primary-text);
  --amber-soft: var(--secondary);
  --red: var(--error-text);
  --red-soft: var(--error);
  --radius: 10px;
  --shadow: 0 18px 42px rgba(0, 0, 0, .22);
  --font-compact: 14px;
  --font-text: 16px;
  --font-subtitle: 20px;
  --font-title: 26px;
}

* { box-sizing: border-box; }
html, body { min-height: 100%; }
body { margin: 0; background: var(--bg); color: var(--text); font-size: var(--font-text); line-height: 1.45; }
button, input, select, textarea { font: inherit; }
small { font-size: var(--font-text); }
h3 { font-size: var(--font-subtitle); }
button { color: inherit; }
.svg-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.icon { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 auto; }
.app-shell { min-width: 1180px; min-height: 100vh; display: grid; grid-template-columns: 248px minmax(0, 1fr); }
.sidebar { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; padding: 18px 14px; border-right: 1px solid var(--border-soft); background: var(--sidebar); z-index: 20; }
.brand { height: 54px; display: flex; align-items: center; gap: 12px; padding: 0 8px 18px; border-bottom: 1px solid var(--border-soft); }
.brand-mark { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 9px; background: var(--accent); color: var(--accent-text); font-weight: 800; letter-spacing: -.04em; }
.brand-copy strong { display: block; font-size: var(--font-text); }
.brand-copy span { display: block; margin-top: 1px; color: var(--text-3); font-size: var(--font-text); }
.nav { display: grid; gap: 5px; padding: 22px 0; }
.nav-label { margin: 13px 12px 6px; color: var(--text-3); font-size: var(--font-text); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.nav-button { width: 100%; min-height: 42px; display: flex; align-items: center; gap: 12px; padding: 0 12px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--text-2); cursor: pointer; text-align: left; transition: background .18s ease, color .18s ease, border-color .18s ease; }
.nav-button:hover { background: var(--surface-2); color: var(--text); }
.nav-button.active { border-color: #383838; background: var(--secondary); color: var(--background-text); }
.nav-button.active .icon { color: var(--accent); }
.sidebar-foot { margin-top: auto; display: grid; gap: 8px; }
.profile { display: flex; align-items: center; gap: 10px; padding: 12px 9px; border-top: 1px solid var(--border-soft); }
.avatar { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; background: #303030; color: var(--background-text); font-size: var(--font-text); font-weight: 700; }
.profile strong, .profile span { display: block; }
.profile strong { font-size: var(--font-text); }
.profile span { color: var(--text-3); font-size: var(--font-text); }
.workspace { min-width: 0; }
.icon-button { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); color: var(--text-2); cursor: pointer; transition: border-color .18s ease, color .18s ease; }
.icon-button:hover { border-color: #4a4a4a; color: var(--text); }
.content { padding: 22px 28px; }
.page { max-width: 1680px; margin: 0 auto; }
.page-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 16px; }
.page-header-back { display: flex; align-items: center; gap: 8px; }
.page-header-back h1 { margin-bottom: 0; }
.page-back-button { width: 34px; height: 34px; flex: 0 0 34px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 6px; background: transparent; color: var(--text-2); cursor: pointer; }
.page-back-button:hover, .page-back-button:focus-visible { background: var(--surface-2); color: var(--text); outline: none; }
.page-back-button .icon { width: 21px; height: 21px; }
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: 3px; font-size: var(--font-title); line-height: 1.25; letter-spacing: -.025em; }
h2 { font-size: var(--font-subtitle); letter-spacing: -.01em; }
.page-subtitle { margin-bottom: 0; color: var(--text-2); font-size: var(--font-text); }
.date-chip { display: inline-flex; align-items: center; gap: 8px; color: var(--text-2); }
.btn { min-height: 40px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 0 16px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface-2); color: var(--text); cursor: pointer; font-weight: 650; transition: border-color .18s ease, background .18s ease, color .18s ease; }
.btn:hover { border-color: #4a4a4a; background: var(--surface-3); }
.btn-primary { border-color: var(--accent); background: var(--accent); color: var(--accent-text); }
.btn-primary:hover { border-color: #ffffff; background: #ffffff; }
.kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.card { border: 1px solid var(--border-soft); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }
.kpi { min-height: 132px; padding: 20px; display: flex; flex-direction: column; justify-content: space-between; }
.kpi-top { display: flex; align-items: center; justify-content: space-between; color: var(--text-2); }
.kpi-icon { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 9px; background: var(--surface-3); color: var(--icon); }
.kpi-value { font-size: var(--font-title); font-weight: 720; letter-spacing: -.04em; }
.kpi-note { color: var(--text-3); font-size: var(--font-text); }
.kpi-note strong { color: var(--green); font-weight: 650; }
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(320px, .72fr); gap: 14px; margin-top: 14px; }
@media (max-width: 1280px) { .dashboard-grid { grid-template-columns: minmax(0, 1fr); } }
.card-head { min-height: 61px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 0 20px; border-bottom: 1px solid var(--border-soft); }
.card-head h2 { margin: 0; }
.link-button { border: 0; background: none; color: var(--primary-text); cursor: pointer; font-weight: 600; transition: color .18s ease; }
.workflow-person-link { padding: 0; font: inherit; text-align: left; text-decoration: underline; text-decoration-color: var(--border); text-underline-offset: 3px; }
.link-button:hover { color: var(--background-text); }
.order-list { display: grid; }
.order-item { min-height: 70px; display: grid; grid-template-columns: 1.2fr 1fr .8fr .7fr 24px; align-items: center; gap: 18px; padding: 12px 20px; border: 0; border-bottom: 1px solid var(--border-soft); background: transparent; color: inherit; cursor: pointer; text-align: left; }
.order-item:last-child { border-bottom: 0; }
.order-item:hover { background: #181818; }
.primary-cell strong, .primary-cell span { display: block; }
.primary-cell strong { font-size: var(--font-text); }
.primary-cell span, .cell-label { color: var(--text-3); font-size: var(--font-text); }
.order-item > span:not(.status) { color: var(--text-2); }
.status { width: max-content; display: inline-flex; align-items: center; gap: 7px; padding: 5px 9px; border-radius: 999px; font-size: var(--font-text); font-weight: 650; }
.status::before { width: 6px; height: 6px; content: ""; border-radius: 50%; background: currentColor; }
.status-blue { background: #252525; color: var(--primary-text); }
.status-green { background: var(--green-soft); color: var(--green); }
.status-amber { background: var(--amber-soft); color: var(--amber); }
.status-red { background: var(--red-soft); color: var(--red); }
.task-list { padding: 6px 20px 10px; }
.task { display: grid; grid-template-columns: 35px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--border-soft); }
.task:last-child { border-bottom: 0; }
.task-icon { width: 35px; height: 35px; display: grid; place-items: center; border-radius: 8px; background: var(--surface-3); color: var(--icon); }
.task-copy strong, .task-copy span { display: block; }
.task-copy strong { margin-bottom: 2px; font-size: var(--font-text); }
.task-copy span { color: var(--text-3); font-size: var(--font-text); }
.due { color: var(--text-2); font-size: var(--font-text); }
.pipeline { margin-top: 14px; }
.pipeline-body { padding: 20px; }
.pipeline-track { height: 10px; display: grid; grid-template-columns: 16fr 11fr 9fr 7fr 5fr; gap: 3px; overflow: hidden; border-radius: 999px; background: var(--surface-3); }
.pipeline-track span:nth-child(1) { background: #4a4a4a; }
.pipeline-track span:nth-child(2) { background: #666666; }
.pipeline-track span:nth-child(3) { background: #858585; }
.pipeline-track span:nth-child(4) { background: #aaaaaa; }
.pipeline-track span:nth-child(5) { background: var(--valid-text); }
.pipeline-labels { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-top: 18px; }
.pipeline-labels strong, .pipeline-labels span { display: block; }
.pipeline-labels strong { margin-bottom: 4px; font-size: var(--font-subtitle); }
.pipeline-labels span { color: var(--text-3); font-size: var(--font-text); }
.focus-ring:focus-visible, button:focus-visible, input:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
.page-actions, .toolbar-actions, .inline-actions { display: flex; align-items: center; gap: 10px; }
.toolbar { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
@media (max-width: 1350px) { .people-toolbar { flex-wrap: wrap; } .people-toolbar .toolbar-actions { margin-left: auto; } }
.segmented { display: inline-flex; align-items: center; gap: 3px; padding: 3px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface); }
.segment { min-height: 34px; padding: 0 14px; border: 0; border-radius: 6px; background: transparent; color: var(--text-2); cursor: pointer; font-weight: 600; }
.segment:hover { color: var(--text); }
.segment.active { background: var(--surface-3); color: var(--text); box-shadow: 0 1px 2px rgba(0,0,0,.3); }
.search-field { width: 250px; height: 40px; position: relative; }
.search-field .icon { position: absolute; left: 12px; top: 10px; width: 18px; height: 18px; color: var(--text-3); }
.search-field input { width: 100%; height: 100%; padding: 0 12px 0 39px; border: 1px solid var(--border); border-radius: 8px; outline: none; background: var(--surface); color: var(--text); }
.search-field input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(242,242,242,.1); }
.table-card { overflow: hidden; border: 1px solid var(--border-soft); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }
.table-scroll { overflow-x: auto; }
.data-table { width: 100%; border-collapse: collapse; text-align: left; }
.data-table th { height: 44px; padding: 0 16px; border-bottom: 1px solid var(--border); background: #151515; color: var(--text-3); font-size: var(--font-text); font-weight: 700; letter-spacing: .025em; white-space: nowrap; }
.data-table td { height: 56px; padding: 8px 16px; border-bottom: 1px solid var(--border-soft); color: var(--text-2); white-space: nowrap; }
.data-table tbody tr:last-child td { border-bottom: 0; }
.data-table tbody tr[data-action] { cursor: pointer; transition: background .15s ease; }
.data-table tbody tr[data-action]:hover { background: #181818; }
.data-table tbody tr[data-action]:focus-visible { outline: 2px solid var(--blue); outline-offset: -2px; }
.data-table strong { color: var(--text); font-weight: 650; }
.muted { color: var(--text-3); }
.mono { font-variant-numeric: tabular-nums; }
.avatar-name { display: flex; align-items: center; gap: 11px; }
.avatar-sm { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 8px; background: #303030; color: var(--background-text); font-size: var(--font-text); font-weight: 750; }
.person-profile-hero { display: grid; grid-template-columns: minmax(250px, .8fr) minmax(0, 1.6fr); align-items: center; gap: 28px; padding: 22px 24px; }
.person-profile-identity { min-width: 0; display: flex; align-items: center; gap: 16px; }
.person-profile-identity .avatar-sm { width: 56px; height: 56px; flex: 0 0 auto; border-radius: 12px; font-size: var(--font-subtitle); }
.person-profile-type { color: var(--text-3); font-size: var(--font-text); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.person-profile-identity h2 { margin: 2px 0 3px; font-size: var(--font-subtitle); }
.person-profile-identity p { margin: 0; color: var(--text-2); font-size: var(--font-text); }
.person-profile-facts { min-width: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 0; }
.person-profile-facts div { min-width: 0; }
.person-profile-facts dt { margin-bottom: 5px; color: var(--text-3); font-size: var(--font-text); }
.person-profile-facts dd { margin: 0; color: var(--primary-text); font-size: var(--font-text); font-weight: 650; overflow-wrap: anywhere; }
.person-profile-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 14px 0; }
.person-profile-metric { min-height: 98px; display: flex; flex-direction: column; justify-content: space-between; gap: 12px; padding: 17px 20px; }
.person-profile-metric span { color: var(--text-3); font-size: var(--font-text); }
.person-profile-metric strong { font-size: var(--font-title); font-variant-numeric: tabular-nums; letter-spacing: -.03em; }
.person-profile-sections { display: grid; gap: 14px; }
.person-related .card-head .page-subtitle { color: var(--text-3); font-size: var(--font-text); }
.person-empty { padding: 30px 20px; color: var(--text-3); text-align: center; }
@media (max-width: 1280px) { .person-profile-hero { grid-template-columns: minmax(0, 1fr); gap: 22px; } .person-profile-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.table-foot { min-height: 50px; display: flex; align-items: center; justify-content: space-between; padding: 0 16px; border-top: 1px solid var(--border-soft); color: var(--text-3); font-size: var(--font-text); }
.pagination { display: flex; gap: 5px; }
.page-number { width: 30px; height: 30px; border: 1px solid var(--border); border-radius: 7px; background: transparent; color: var(--text-2); cursor: pointer; transition: border-color .18s ease, background .18s ease, color .18s ease; }
.page-number:not(:disabled):hover { border-color: #454545; background: var(--surface-2); color: var(--background-text); }
.page-number.active { border-color: #454545; background: var(--secondary); color: var(--background-text); }
.history-card { margin-top: 2px; }
.history-table { table-layout: fixed; }
.history-table th:nth-child(1) { width: 17%; }
.history-table th:nth-child(2) { width: 20%; }
.history-table th:nth-child(3) { width: 15%; }
.history-table th:nth-child(4) { width: 48%; }
.history-table th { height: 40px; }
.history-table td { height: 48px; padding-top: 6px; padding-bottom: 6px; }
.history-type { display: inline-flex; align-items: center; padding: 4px 8px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface-2); color: var(--primary-text); font-size: var(--font-text); font-weight: 650; }
.history-description { overflow: hidden; text-overflow: ellipsis; }
.history-table .mono { color: var(--text-3); font-size: var(--font-text); }
.page-number:disabled { opacity: .35; cursor: default; }
.filter-row { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.toolbar > .filter-row { margin-bottom: 0; }
.filter-chip { min-height: 34px; display: inline-flex; align-items: center; gap: 7px; padding: 0 12px; border: 1px solid var(--border); border-radius: 999px; background: transparent; color: var(--text-2); cursor: pointer; }
.filter-chip:hover { color: var(--text); }
.filter-chip.active { border-color: #454545; background: var(--secondary); color: var(--background-text); }
.count { min-width: 26px; height: 26px; display: inline-grid; place-items: center; padding: 0 6px; border-radius: 999px; background: var(--surface-3); color: var(--text-2); font-size: var(--font-text); }
.filter-chip.active .count { background: #383838; color: var(--background-text); }
.thumb { width: 38px; height: 38px; display: grid; place-items: center; overflow: hidden; border: 1px solid var(--border); border-radius: 8px; background: linear-gradient(145deg, #303030, #141414); color: var(--icon); }
.thumb .icon { width: 23px; height: 23px; }
.thumb.cream { background: linear-gradient(145deg, #d0d0d0, #888888); color: #202020; }
.thumb.navy { background: linear-gradient(145deg, #303030, #090909); color: var(--primary-text); }
.thumb.black { background: linear-gradient(145deg, #30343a, #090b0e); color: #adb5c0; }
.thumb.art { background: radial-gradient(circle at 35% 35%, #d0d0d0 0 14%, #666666 15% 32%, #111111 33% 55%, #8c8c8c 56% 70%, #151515 71%); }
.detail-title { display: flex; align-items: center; gap: 14px; }
.detail-title .thumb { width: 48px; height: 48px; }
.status-stepper { display: grid; grid-template-columns: repeat(6, minmax(110px, 1fr)); gap: 0; margin-bottom: 10px; overflow-x: auto; border: 1px solid var(--border-soft); border-radius: var(--radius); background: var(--surface); }
.step { min-width: 155px; position: relative; display: flex; align-items: center; gap: 9px; padding: 13px 16px; color: var(--text-3); font-size: var(--font-text); font-weight: 650; }
.step + .step { border-left: 1px solid var(--border-soft); }
.step-number { width: 26px; height: 26px; flex: 0 0 26px; display: grid; place-items: center; border: 1px solid var(--border); border-radius: 50%; font-size: var(--font-compact); }
.step.done { color: var(--green); }
.step.done .step-number { border-color: var(--valid-text); background: var(--green-soft); }
.step.current { background: var(--secondary); color: var(--background-text); }
.step.current .step-number { border-color: var(--blue); background: var(--blue); color: #fff; }
.info-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1px; margin-bottom: 10px; overflow: hidden; border: 1px solid var(--border-soft); border-radius: var(--radius); background: var(--border-soft); }
.info-cell { min-height: 72px; padding: 13px 16px; background: var(--surface); }
.info-cell span, .info-cell strong { display: block; }
.info-cell span { margin-bottom: 6px; color: var(--text-3); font-size: var(--font-text); }
.info-cell strong { overflow: hidden; color: var(--text); font-size: var(--font-text); text-overflow: ellipsis; white-space: nowrap; }
.order-layout { display: grid; grid-template-columns: minmax(0, 1fr) 290px; gap: 12px; }
.model-list { display: grid; gap: 8px; }
.model-block { overflow: hidden; border: 1px solid var(--border-soft); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }
.model-head { display: grid; grid-template-columns: minmax(300px, 1.7fr) minmax(140px, .8fr) 78px 116px; align-items: center; gap: 16px; min-height: 68px; padding: 10px 14px; border-bottom: 1px solid var(--border-soft); }
.model-name { display: flex; align-items: center; gap: 12px; }
.model-name strong, .model-name span, .model-meta strong, .model-meta span, .model-total strong, .model-total span { display: block; }
.model-name span, .model-meta span { color: var(--text-3); font-size: var(--font-text); }
.model-meta strong { margin-top: 3px; color: var(--text-2); font-size: var(--font-text); }
.model-total { text-align: right; }
.model-total span { color: var(--text-3); font-size: var(--font-text); }
.model-total strong { margin-top: 3px; font-size: var(--font-text); white-space: nowrap; }
.model-matrix { overflow-x: auto; }
.matrix-row { min-width: 1100px; display: grid; grid-template-columns: minmax(200px, 1.15fr) repeat(var(--size-count), minmax(72px, .55fr)) 72px 110px; align-items: center; gap: 8px; padding: 9px 14px; border-bottom: 1px solid var(--border-soft); }
.matrix-head { min-height: 34px; padding-block: 7px; background: #151515; color: var(--text-3); font-size: var(--font-compact); font-weight: 700; letter-spacing: .035em; text-transform: uppercase; }
.matrix-head > span:not(:first-child) { text-align: center; }
.matrix-head > span:nth-last-child(-n+2) { text-align: right; }
.matrix-label strong, .matrix-label span { display: block; }
.matrix-label span { margin-top: 2px; color: var(--text-3); font-size: var(--font-compact); }
.matrix-input { height: 36px; display: flex; align-items: center; overflow: hidden; border: 1px solid var(--border); border-radius: 6px; background: #080808; }
.matrix-input:focus-within { border-color: var(--accent); box-shadow: 0 0 0 2px rgba(242,242,242,.08); }
.matrix-input > span { padding-left: 7px; color: var(--text-3); font-size: var(--font-compact); }
.matrix-input input { width: 100%; min-width: 0; height: 100%; padding: 0 5px; border: 0; outline: none; background: transparent; color: var(--text); text-align: center; font-size: var(--font-text); }
.price-input { border-color: #454545; background: var(--secondary); }
.price-input input { padding-left: 2px; }
.price-input.changed { border-color: #b9782d; background: #2a1b0c; }
.price-input.changed > span, .price-input.changed input { color: #f2ad55; }
.drawing-row { min-height: 68px; }
.drawing-name { display: flex; align-items: flex-start; gap: 11px; }
.drawing-name strong, .drawing-name span { display: block; }
.drawing-name span { color: var(--text-3); font-size: var(--font-text); }
.drawing-name .thumb { width: 50px; height: 50px; flex: 0 0 50px; border-radius: 7px; }
.drawing-name .thumb .icon { width: 28px; height: 28px; }
.drawing-copy { min-width: 0; }
.price-toggle { display: inline-flex; align-items: center; gap: 4px; margin-top: 5px; padding: 0; border: 0; background: transparent; color: var(--text-3); cursor: pointer; font-size: var(--font-compact); }
.price-toggle:hover, .price-toggle.active { color: var(--text); }
.price-toggle .icon { width: 12px; height: 12px; }
.quantity-cell { display: grid; align-content: center; gap: 4px; }
.quantity-cell .matrix-input { height: 36px; }
.quantity-cell .price-input { height: 30px; }
.quantity-cell .price-input input { font-size: var(--font-compact); }
.price-change, .price-placeholder { height: 16px; display: flex; align-items: center; justify-content: center; font-size: var(--font-compact); }
.price-change { gap: 4px; border: 1px solid #454545; border-radius: 99px; background: var(--secondary); color: var(--primary-text); }
.price-change::before { width: 4px; height: 4px; content: ""; border-radius: 50%; background: var(--accent); }
.matrix-total, .matrix-empty { text-align: right; }
.matrix-total { font-size: var(--font-text); white-space: nowrap; }
.matrix-empty { color: var(--text-3); }
.matrix-footer { min-width: 1100px; min-height: 44px; display: flex; align-items: center; justify-content: space-between; padding: 5px 14px; color: var(--text-3); font-size: var(--font-text); }
.matrix-footer .link-button { display: inline-flex; align-items: center; gap: 6px; padding: 5px 0; }
.matrix-footer .icon { width: 15px; height: 15px; }
.summary-card { position: sticky; top: 22px; align-self: start; }
.summary-body { padding: 18px 20px; }
.summary-line { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 10px 0; color: var(--text-2); }
.summary-line.total { margin-top: 8px; padding-top: 18px; border-top: 1px solid var(--border); color: var(--text); font-size: var(--font-subtitle); font-weight: 700; }
.summary-actions { display: grid; gap: 8px; padding: 0 20px 20px; }
.summary-actions .btn { width: 100%; }
.drawer-layer { position: fixed; inset: 0; z-index: 50; display: flex; justify-content: flex-end; background: rgba(3, 5, 8, .62); backdrop-filter: blur(2px); }
.drawer { width: min(520px, 100vw); height: 100%; display: flex; flex-direction: column; border-left: 1px solid var(--border); background: var(--surface); box-shadow: -25px 0 60px rgba(0,0,0,.4); }
.drawer-head { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 0 24px; border-bottom: 1px solid var(--border); }
.drawer-head h2 { margin: 0 0 2px; font-size: var(--font-subtitle); }
.drawer-head p { margin: 0; color: var(--text-3); font-size: var(--font-text); }
.drawer-body { flex: 1; overflow-y: auto; padding: 22px 24px; }
.drawer-foot { display: flex; justify-content: flex-end; gap: 10px; padding: 16px 24px; border-top: 1px solid var(--border); background: var(--primary); }
.person-hero { display: flex; align-items: center; gap: 14px; margin-bottom: 22px; }
.person-hero .avatar-sm { width: 52px; height: 52px; border-radius: 12px; font-size: var(--font-text); }
.person-hero h3 { margin: 0 0 3px; font-size: var(--font-subtitle); }
.person-hero p { margin: 0; color: var(--text-3); }
.mini-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 24px; }
.mini-stat { padding: 13px; border: 1px solid var(--border-soft); border-radius: 8px; background: #151515; }
.mini-stat span, .mini-stat strong { display: block; }
.mini-stat span { color: var(--text-3); font-size: var(--font-text); }
.mini-stat strong { margin-top: 5px; font-size: var(--font-text); }
.section-label { margin: 22px 0 10px; color: var(--text-3); font-size: var(--font-text); font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.detail-list { display: grid; gap: 1px; overflow: hidden; border: 1px solid var(--border-soft); border-radius: 8px; background: var(--border-soft); }
.detail-row { display: grid; grid-template-columns: 120px 1fr; gap: 16px; padding: 12px 14px; background: var(--primary); }
.detail-row span { color: var(--text-3); }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 14px; }
.field { display: grid; gap: 7px; }
.field.full { grid-column: 1 / -1; }
.field label, .field > span { color: var(--text-2); font-size: var(--font-text); font-weight: 650; }
.field input, .field select, .field textarea { width: 100%; min-height: 40px; padding: 9px 11px; border: 1px solid var(--border); border-radius: 8px; outline: none; background: #0b0b0b; color: var(--text); }
.field textarea { min-height: 90px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(242,242,242,.1); }
.settings-layout { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 14px; }
.settings-nav { padding: 8px; }
.settings-nav button { width: 100%; min-height: 42px; display: flex; align-items: center; justify-content: space-between; padding: 0 12px; border: 0; border-radius: 7px; background: transparent; color: var(--text-2); cursor: pointer; text-align: left; }
.settings-nav button:hover { background: var(--surface-2); color: var(--text); }
.settings-nav button.active { background: var(--secondary); color: var(--background-text); }
.settings-main { min-width: 0; }
.property-add { display: flex; gap: 8px; }
.property-add input { width: 220px; height: 38px; padding: 0 11px; border: 1px solid var(--border); border-radius: 7px; outline: none; background: #0b0b0b; color: var(--text); }
.production-page { height: calc(100vh - 44px); display: flex; flex-direction: column; min-height: 0; }
.production-page .page-header { flex: 0 0 auto; margin-bottom: 10px; }
.production-total { min-height: 76px; flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 10px 18px; }
.production-total > div > span { display: block; color: var(--text-2); font-size: var(--font-text); }
.production-total > div > strong { display: block; margin-top: 2px; font-size: var(--font-title); letter-spacing: -.04em; }
.production-total dl { display: flex; align-items: center; gap: 42px; margin: 0; }
.production-total dl div { min-width: 92px; }
.production-total dt { color: var(--text-3); font-size: var(--font-text); }
.production-total dd { margin: 2px 0 0; color: var(--primary-text); font-size: var(--font-subtitle); font-weight: 750; }
.production-list-head { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 13px 0 7px; }
.production-list-head h2 { margin: 0; font-size: var(--font-subtitle); }
.production-list-head > span { color: var(--text-3); font-size: var(--font-text); }
.production-stock-scroll { min-height: 0; flex: 1 1 auto; overflow-y: auto; padding-right: 4px; scrollbar-color: var(--surface-3) transparent; scrollbar-width: thin; }
.stock-group { overflow: hidden; margin-bottom: 8px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--primary); box-shadow: var(--shadow); }
.stock-group:last-child { margin-bottom: 0; }
.stock-group-head { min-height: 43px; display: grid; grid-template-columns: minmax(260px, 1fr) auto; align-items: center; gap: 16px; padding: 5px 14px; border-bottom: 1px solid #bcbcbc; background: var(--accent); color: var(--accent-text); }
.stock-group-title { display: flex; align-items: center; gap: 9px; }
.stock-group-title .icon { width: 18px; height: 18px; }
.stock-group-title strong { font-size: var(--font-text); text-transform: uppercase; }
.stock-group-summary { display: grid; grid-template-columns: repeat(3, 90px); gap: 10px; }
.stock-group-summary div { text-align: right; }
.stock-group-summary span, .stock-group-summary strong { display: block; }
.stock-group-summary span { color: #626262; font-size: var(--font-compact); }
.stock-group-summary strong { margin-top: 0; color: var(--accent-text); font-size: var(--font-text); }
.roll-details { display: grid; grid-template-columns: repeat(4, minmax(120px, 1fr)); align-items: center; border-bottom: 1px solid var(--border-soft); background: #0c0c0c; }
.roll-detail-value { min-width: 0; display: grid; gap: 3px; padding: 7px 14px; border-right: 1px solid var(--border-soft); }
.roll-detail-value:last-child { border-right: 0; }
.roll-detail-value > span { color: var(--text-3); font-size: var(--font-compact); }
.roll-detail-value > strong { color: var(--primary-text); font-size: var(--font-text); }
.roll-detail-value input { width: min(100%, 150px); height: 30px; padding: 0 2px 2px; border: 0; border-bottom: 1px solid #383838; border-radius: 0; outline: none; background: transparent; color: var(--primary-text); font: inherit; font-size: var(--font-text); }
.roll-detail-value input:hover { border-bottom-color: #777; }
.roll-detail-value input:focus { border-bottom-color: var(--accent); box-shadow: 0 1px 0 var(--accent); }
.stock-matrix-frame { display: grid; grid-template-columns: 110px minmax(0, 1fr); background: #0a0a0a; }
.stock-matrix-labels, .stock-matrix-model { display: grid; grid-template-rows: 38px 32px repeat(3, 36px); }
.stock-matrix-labels { border-right: 1px solid var(--border); background: #121212; }
.stock-matrix-labels strong, .stock-matrix-labels span { display: flex; align-items: center; padding: 0 9px; border-bottom: 1px solid var(--border-soft); color: var(--text-2); font-size: var(--font-compact); }
.stock-matrix-labels strong { color: var(--primary-text); }
.stock-matrix-labels span:last-child { border-bottom: 0; }
.stock-matrix-models { min-width: 0; display: grid; grid-template-columns: repeat(var(--stock-size-total), minmax(0, 1fr)); }
.stock-matrix-model { min-width: 0; border-right: 1px solid var(--border); }
.stock-matrix-model:last-child { border-right: 0; }
.stock-matrix-model > strong { display: flex; align-items: center; justify-content: center; overflow: hidden; padding: 0 6px; border-bottom: 1px solid var(--border-soft); color: var(--primary-text); font-size: var(--font-compact); text-align: center; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.stock-matrix-sizes, .stock-matrix-values { min-width: 0; display: grid; grid-template-columns: repeat(var(--stock-size-count), minmax(0, 1fr)); border-bottom: 1px solid var(--border-soft); }
.stock-matrix-sizes span { display: grid; place-items: center; overflow: hidden; color: var(--text-3); font-size: var(--font-compact); text-overflow: ellipsis; white-space: nowrap; }
.stock-matrix-values { padding: 0; }
.stock-matrix-values:last-child { border-bottom: 0; }
.stock-matrix-values span { min-width: 0; display: grid; place-items: center; color: var(--primary-text); font-size: var(--font-compact); font-weight: 700; }
.stock-matrix-values.cutting span { color: var(--text-3); font-weight: 600; }
.stock-matrix-values.provisional span { color: var(--valid-text); }
.task-detail-layout { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(280px, .8fr); gap: 14px; align-items: start; }
@media (max-width: 1280px) { .task-detail-layout { grid-template-columns: minmax(0, 1fr); } }
.task-main, .task-history, .production-create { padding: 18px; }
.task-main .card-head, .task-history .card-head, .production-create .card-head { padding: 0 0 16px; }
.task-size-list { display: grid; margin: 14px 0; border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }
.task-size-row { min-height: 40px; display: grid; grid-template-columns: 1fr minmax(100px, 180px); align-items: center; gap: 12px; padding: 5px 12px; border-bottom: 1px solid var(--border-soft); background: var(--primary); color: var(--text-2); }
.task-size-row:last-child { border-bottom: 0; }
.task-size-row input { width: 100%; min-height: 32px; padding: 4px 8px; border: 1px solid var(--border); border-radius: 6px; background: #0b0b0b; color: var(--text); }
.task-size-heading { min-height: 34px; background: #151515; color: var(--text-3); font-size: var(--font-text); }
.task-quantity-grid { width: 100%; min-width: 0; display: grid; grid-template-columns: repeat(var(--task-size-count), minmax(78px, 1fr)); margin: 14px 0; overflow-x: auto; border: 1px solid var(--border); border-radius: 8px; background: var(--primary); }
.task-qty-cell { min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; min-height: 74px; padding: 8px; border-right: 1px solid var(--border-soft); color: var(--text-2); }
.task-qty-cell:last-child { border-right: 0; }
.task-qty-cell > span { color: var(--text-3); font-size: var(--font-text); font-weight: 700; }
.task-qty-cell > strong { color: var(--primary-text); font-size: var(--font-subtitle); }
.task-qty-cell small { color: var(--text-3); font-size: var(--font-compact); }
.task-quantity-grid.edit .task-qty-cell { align-items: stretch; min-height: 90px; }
.task-quantity-grid.edit .task-qty-cell > span { text-align: center; }
.task-quantity-grid.edit .task-qty-cell input { width: 100%; min-height: 32px; padding: 4px 6px; border: 1px solid var(--border); border-radius: 6px; background: #0b0b0b; color: var(--text); text-align: center; }
.task-note { margin: 18px 0 10px; }
.task-note textarea { min-height: 74px; }
#task-transition-form { margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--border); }
#task-transition-form h3 { margin: 0 0 5px; }
.task-assignee { max-width: 360px; margin: 16px 0; }
.roll-availability { display: grid; grid-template-columns: repeat(3, 1fr); margin: 18px 0; border: 1px solid var(--border); border-radius: 8px; background: #151515; }
.roll-availability > div { display: grid; gap: 5px; padding: 13px; border-right: 1px solid var(--border); }
.roll-availability > div:last-child { border-right: 0; }
.roll-availability span, .task-event span { color: var(--text-3); font-size: var(--font-text); }
.workflow-roll-warning { margin: 0; color: var(--error-text); font-size: var(--font-text); }
.task-timeline { display: grid; margin-top: 16px; }
.task-event { position: relative; padding: 0 0 18px 16px; border-left: 1px solid var(--border); }
.task-event:last-child { padding-bottom: 0; }
.task-event::before { position: absolute; left: -4px; top: 4px; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); content: ""; }
.task-event strong, .task-event span { display: block; }
.task-event p { margin: 5px 0 0; color: var(--text-2); font-size: var(--font-text); }
.production-create { max-width: 850px; }
.production-create > .field { max-width: 520px; margin-top: 18px; }
.production-create > .page-subtitle { margin: 14px 0; }
.completion-note { margin-top: 18px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface-2); color: var(--valid-text); font-weight: 650; }
.empty-cell { padding: 30px !important; color: var(--text-3); text-align: center; }
.serigraphy-create { display: grid; gap: 10px; }
.serigraphy-create > .card-head { padding: 0 0 2px; }
.serigraphy-line { padding: 16px; }
.serigraphy-line-fields { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) minmax(160px, .8fr) 40px; align-items: end; gap: 12px; }
.serigraphy-line-fields .field select { min-width: 0; }
.serigraphy-line-fields .icon-button { margin-bottom: 0; }
.serigraphy-line .task-quantity-grid { max-width: 760px; }
.serigraphy-create-foot { display: flex; justify-content: flex-end; padding-top: 8px; }
.serigraphy-task-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 14px 0; }
.serigraphy-task-heading h2, .serigraphy-printer h3 { margin: 0 0 4px; font-size: var(--font-subtitle); }
.serigraphy-validation { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 12px; padding: 14px 18px; }
.serigraphy-validation p { margin: 0; color: var(--text-2); }
.serigraphy-printers { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 12px; margin-bottom: 14px; }
@media (max-width: 1500px) { .serigraphy-printers { grid-template-columns: minmax(0, 1fr); } }
.serigraphy-printer { min-width: 0; padding: 16px; }
.serigraphy-printer .card-head { padding: 0 0 8px; }
.serigraphy-line-list { display: grid; }
.serigraphy-print-line { padding: 12px 0; border-top: 1px solid var(--border-soft); }
.serigraphy-print-meta { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.serigraphy-print-meta strong { font-size: var(--font-text); }
.serigraphy-print-meta span { color: var(--text-3); font-size: var(--font-text); }
.serigraphy-printer .task-quantity-grid { margin: 8px 0 0; }
.serigraphy-step-form { display: flex; justify-content: flex-end; margin-top: 12px; }
.serigraphy-step-form .btn { min-height: 34px; }
.history-page { max-width: none; height: calc(100vh - 44px); display: flex; flex-direction: column; min-height: 0; }
.history-page .page-header { flex: 0 0 auto; }
.history-page .history-card { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.history-page .table-scroll { flex: 1 1 auto; min-height: 0; overflow: auto; }
.history-page .table-foot { flex: 0 0 auto; }
.empty-state { min-height: 350px; display: grid; place-items: center; padding: 40px; text-align: center; }
.empty-state .empty-icon { width: 54px; height: 54px; display: grid; place-items: center; margin: 0 auto 16px; border-radius: 14px; background: var(--surface-3); color: var(--blue); }
.empty-state h2 { margin-bottom: 7px; }
.empty-state p { max-width: 420px; margin: 0 auto 18px; color: var(--text-3); }
.toast { position: fixed; right: 24px; bottom: 24px; z-index: 70; display: flex; align-items: center; gap: 10px; padding: 13px 16px; border: 1px solid var(--valid-text); border-radius: 9px; background: var(--valid); color: var(--valid-text); box-shadow: var(--shadow); animation: toast-in .2s ease; }
@keyframes toast-in { from { opacity: 0; transform: translateY(8px); } }

.search-field input:focus, .size-box input:focus, .field input:focus, .field select:focus, .field textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(242, 242, 242, .1); }
.data-table th { background: #151515; }
.data-table tbody tr[data-action]:hover, .order-item:hover { background: #181818; }
.data-table tbody tr[data-action]:focus-visible { outline-color: var(--accent); }
.avatar-sm { background: #303030; color: var(--background-text); }
.page-number.active, .filter-chip.active, .settings-nav button.active { border-color: #454545; background: var(--secondary); color: var(--background-text); }
.filter-chip.active .count { background: #383838; color: var(--background-text); }
.thumb { background: linear-gradient(145deg, #303030, #141414); color: var(--icon); }
.thumb.navy, .thumb.black { background: linear-gradient(145deg, #303030, #090909); color: var(--primary-text); }
.thumb.art { background: radial-gradient(circle at 35% 35%, #d0d0d0 0 14%, #666666 15% 32%, #111111 33% 55%, #8c8c8c 56% 70%, #151515 71%); }
.step.current { background: var(--secondary); color: var(--background-text); }
.step.current .step-number { border-color: var(--accent); background: var(--accent); color: var(--accent-text); }
.size-box input, .field input, .field select, .field textarea, .property-add input { background: #0b0b0b; }
.drawer-foot, .detail-row { background: var(--primary); }
.mini-stat { background: #151515; }
.progress span { background: var(--accent); }
.empty-state .empty-icon { color: var(--icon); }
.toast { border-color: var(--valid-text); background: var(--valid); color: var(--valid-text); }
.workflow-record-title, .workflow-section-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 14px 0; }
.workflow-record-title h2 { margin: 0 0 5px; font-size: var(--font-subtitle); letter-spacing: -.025em; }
.workflow-section-head { margin-top: 24px; }
.workflow-section-head h2 { margin: 0; font-size: var(--font-subtitle); }
.workflow-order-main .card-head { padding-bottom: 0; }
.workflow-form-body { padding: 16px; }
.workflow-line-list { display: grid; gap: 10px; }
.workflow-order-line { padding: 16px; }
.workflow-line-head, .workflow-line-summary, .workflow-save-bar, .workflow-pack-head, .workflow-package, .workflow-task-link { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.workflow-line-fields { display: grid; grid-template-columns: repeat(2, minmax(190px, 1fr)); gap: 12px; flex: 1; }
.workflow-line-summary { margin: 12px 0; padding: 9px 0; border-top: 1px solid var(--border-soft); color: var(--text-2); font-size: var(--font-text); }
.workflow-line-summary strong { color: var(--background-text); }
.workflow-size-grid { display: grid; grid-template-columns: repeat(var(--workflow-size-count), minmax(80px, 1fr)); gap: 6px; overflow-x: auto; }
.workflow-size-cell { min-width: 80px; display: grid; gap: 5px; padding: 9px; border: 1px solid var(--border); border-radius: 6px; background: var(--secondary); }
.workflow-size-cell span { font-weight: 700; }
.workflow-size-cell small { color: var(--text-3); font-size: var(--font-compact); }
.workflow-size-cell input, .workflow-pack-form input[type="number"] { width: 100%; min-width: 0; min-height: 32px; padding: 5px 7px; border: 1px solid var(--border); border-radius: 5px; background: #0b0b0b; color: var(--background-text); }
.workflow-save-bar { margin-top: 12px; padding: 14px 16px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--primary); }
.workflow-save-bar div { display: grid; gap: 4px; }
.workflow-save-bar span, .workflow-summary span, .workflow-package span, .workflow-task-link span { color: var(--text-3); font-size: var(--font-text); }
.workflow-save-bar strong { font-size: var(--font-subtitle); }
.workflow-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 12px 0; }
.workflow-summary { min-width: 0; display: grid; gap: 6px; padding: 16px; }
.workflow-summary strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--font-subtitle); }
.workflow-subcell { display: block; margin-top: 4px; color: var(--text-3); font-size: var(--font-text); }
.workflow-shortage { color: var(--error-text) !important; }
.workflow-task-links { display: grid; gap: 8px; margin-top: 12px; }
.workflow-task-link { padding: 12px 16px; }
.workflow-task-link > div:first-child, .workflow-package > div:first-child { display: grid; gap: 4px; }
.workflow-pack-form { overflow: hidden; }
.workflow-pack-head { padding: 16px; }
.workflow-pack-head .field { width: min(360px, 60%); }
.workflow-package-list { display: grid; gap: 8px; margin-top: 10px; }
.workflow-package { padding: 12px 16px; }
.workflow-history { margin-top: 18px; }
.workflow-history .task-timeline { padding: 4px 16px 16px; }
.workflow-meta-form, .workflow-step-form { display: grid; gap: 12px; padding: 16px; border-top: 1px solid var(--border-soft); }
.workflow-meta-form { grid-template-columns: minmax(140px, .5fr) minmax(220px, 2fr) auto; align-items: end; }
.workflow-meta-form .field.full { grid-column: auto; }
.workflow-step-form h3 { margin: 0; font-size: var(--font-subtitle); }
.workflow-step-form > .btn, .workflow-printer-step > .btn { justify-self: end; }
.workflow-printer-due { display: flex; align-items: end; gap: 10px; padding: 10px 0; border-top: 1px solid var(--border-soft); }
.workflow-printer-step { display: grid; gap: 12px; padding-top: 14px; border-top: 1px solid var(--border-soft); }
.workflow-create-head { display: grid; gap: 12px; padding: 16px; }
.workflow-create-head h2 { margin: 0 0 5px; font-size: var(--font-subtitle); }
.workflow-stock-page { max-width: none; height: calc(100vh - 44px); min-height: 0; display: flex; flex-direction: column; }
.workflow-stock-page .page-header { flex: 0 0 auto; }
.workflow-stock-page .stock-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 310px), 1fr)); overflow-x: hidden; padding-bottom: 0; }
.workflow-stock-page .stock-card { min-width: 0; }
.stock-cards { flex: 0 0 auto; display: flex; gap: 7px; overflow-x: auto; padding-bottom: 3px; scrollbar-color: var(--surface-3) transparent; scrollbar-width: thin; }
.stock-card { min-width: 340px; flex: 1 0 340px; overflow: hidden; border: 1px solid var(--border); border-radius: 6px; background: var(--primary); }
.stock-card-total { border-color: #666; background: #191919; }
.stock-card-head { min-height: 42px; display: flex; align-items: center; justify-content: center; gap: 7px; padding: 5px 9px; border-bottom: 1px solid var(--border); }
.stock-card-head .icon { width: 15px; height: 15px; flex: 0 0 15px; }
.stock-card-head strong { overflow: hidden; font-size: var(--font-compact); text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.stock-card-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); min-height: 84px; }
.stock-card-metrics > div { min-width: 0; display: grid; align-content: space-between; gap: 5px; padding: 9px 5px 8px; text-align: center; }
.stock-card-metrics > div + div { border-left: 1px solid var(--border-soft); }
.stock-card-metrics span { color: var(--text-3); font-size: var(--font-compact); line-height: 1.15; }
.stock-card-metrics strong { color: var(--text); font-size: var(--font-text); font-variant-numeric: tabular-nums; }
.stock-card-total .stock-card-metrics strong { font-size: var(--font-subtitle); }
.workflow-stock-page .stock-card-metrics strong.shortage { color: var(--error-text); }
.workflow-stock-scroll { min-height: 0; flex: 1 1 auto; overflow: auto; display: block; }
.workflow-stock-page .stock-group-head { grid-template-columns: minmax(0, 1fr) auto; }
.stock-roll-button { display: inline-flex; align-items: center; gap: 5px; min-height: 28px; padding: 0 8px; border: 1px solid #999; border-radius: 4px; background: transparent; color: var(--accent-text); font: inherit; font-size: var(--font-text); font-weight: 650; cursor: pointer; }
.stock-roll-button:hover, .stock-roll-button:focus-visible { border-color: #111; outline: none; background: #e0e0e0; }
.stock-roll-button .icon { width: 13px; height: 13px; }
.stock-matrix-scroll { overflow-x: auto; scrollbar-color: var(--surface-3) transparent; scrollbar-width: thin; }
.workflow-stock-page .stock-matrix-model { grid-column: span var(--stock-size-count); border-right: 0; box-shadow: inset -1px 0 var(--border); }
.workflow-stock-page .stock-matrix-labels, .workflow-stock-page .stock-matrix-model { grid-template-rows: 38px 32px repeat(4, 36px); }
.workflow-stock-page .stock-matrix-scroll { overflow-x: hidden; }
.stock-matrix-model-title { min-width: 0; display: flex; align-items: center; justify-content: center; gap: 3px; padding: 0 3px; border-bottom: 1px solid var(--border-soft); }
.stock-matrix-model-title strong { min-width: 0; overflow: hidden; color: var(--primary-text); font-size: var(--font-compact); text-align: center; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.stock-plan-open { width: 25px; height: 25px; flex: 0 0 25px; display: grid; place-items: center; padding: 0; border: 1px solid var(--border); border-radius: 4px; background: var(--secondary); color: var(--text-2); cursor: pointer; }
.stock-plan-open .icon { width: 15px; height: 15px; }
.stock-plan-open:hover, .stock-plan-open:focus-visible { border-color: var(--accent); color: var(--text); outline: none; }
.workflow-stock-page .stock-matrix-values span { font-size: var(--font-compact); }
.workflow-stock-page .stock-matrix-values.orders span { color: var(--text-2); }
.workflow-stock-page .stock-matrix-values.effective span { color: var(--text); }
.workflow-stock-page .stock-matrix-values.effective span.shortage { background: var(--error); color: var(--error-text); }
.workflow-stock-plan-drawer { width: min(660px, 100vw); }
.stock-plan-intro { margin: 0 0 16px; color: var(--text-2); }
.stock-plan-matrix { border: 1px solid var(--border); border-radius: 7px; overflow: hidden; }
.stock-plan-labels, .stock-plan-values { grid-template-rows: 32px repeat(6, 44px); }
.stock-plan-values { min-width: 0; display: grid; }
.stock-plan-values .stock-matrix-sizes, .stock-plan-values .stock-matrix-values, .stock-plan-inputs { grid-template-columns: repeat(var(--stock-size-count), minmax(0, 1fr)); }
.stock-plan-values .stock-matrix-values span { font-size: var(--font-text); }
.stock-plan-values .stock-matrix-values.effective span.shortage { background: var(--error); color: var(--error-text); }
.stock-plan-inputs { min-width: 0; display: grid; border-bottom: 1px solid var(--border-soft); }
.stock-plan-inputs label { min-width: 0; display: grid; place-items: center; padding: 3px; }
.stock-plan-inputs input { width: 100%; min-width: 0; max-width: 58px; height: 34px; padding: 0 3px; border: 1px solid var(--border); border-radius: 4px; background: var(--secondary); color: var(--text); font: inherit; text-align: center; }
.stock-plan-inputs input:focus-visible { outline: 1px solid var(--accent); }
.stock-plan-totals { display: flex; justify-content: space-between; gap: 12px; margin-top: 16px; padding: 14px; border: 1px solid var(--border); border-radius: 7px; background: var(--secondary); }
.stock-plan-totals span, .stock-plan-totals strong { display: block; }
.stock-plan-totals span { color: var(--text-3); font-size: var(--font-compact); }
.stock-plan-totals strong { margin-top: 4px; font-size: var(--font-subtitle); }
.workflow-stock-plan-drawer .btn:disabled { opacity: .45; cursor: not-allowed; }
.stock-roll-fields { display: grid; gap: 16px; margin-top: 22px; }
.workflow-page-count { color: var(--text-2); font-size: var(--font-text); }
.workflow-backup { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 18px; padding: 20px; }
.workflow-backup h2 { margin: 0 0 6px; font-size: var(--font-subtitle); }
.workflow-backup p { max-width: 540px; margin: 0; color: var(--text-2); font-size: var(--font-text); line-height: 1.5; }
.workflow-import-button { position: relative; overflow: hidden; cursor: pointer; }
.workflow-import-button input { position: absolute; width: 1px; height: 1px; opacity: 0; }
@media (max-width: 1250px) { .workflow-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .workflow-meta-form { grid-template-columns: 1fr; } .workflow-line-fields { grid-template-columns: 1fr; } .workflow-backup { align-items: start; flex-direction: column; } }
.workflow-pipeline { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; padding: 18px; }
.workflow-pipeline > div { display: grid; gap: 5px; padding: 12px; border: 1px solid var(--border); border-radius: 6px; background: var(--secondary); }
.workflow-pipeline strong { font-size: var(--font-subtitle); }
.workflow-pipeline span { color: var(--text-3); font-size: var(--font-text); }
.workflow-attention { width: 100%; border: 0; border-top: 1px solid var(--border-soft); background: transparent; color: inherit; text-align: left; cursor: pointer; }
.workflow-attention:hover { background: var(--secondary); }
.dashboard-page { max-width: 1680px; }
.dashboard-focus { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 14px; }
.dashboard-focus-secondary { margin-top: 14px; }
.dashboard-panel { min-width: 0; overflow: hidden; }
.dashboard-panel .card-head { min-height: 70px; }
.dashboard-panel .card-head > div { min-width: 0; }
.dashboard-head-note { display: block; margin-top: 3px; color: var(--text-3); font-size: var(--font-text); }
.dashboard-panel .link-button { display: inline-flex; align-items: center; gap: 3px; white-space: nowrap; }
.dashboard-panel .link-button .icon { width: 15px; height: 15px; }
.dashboard-list { min-height: 72px; }
.dashboard-row { width: 100%; min-height: 66px; display: grid; grid-template-columns: minmax(0, 1fr) auto 18px; align-items: center; gap: 14px; padding: 10px 20px; border: 0; border-bottom: 1px solid var(--border-soft); background: transparent; color: var(--text); cursor: pointer; text-align: left; transition: background .18s ease; }
.dashboard-row:last-child { border-bottom: 0; }
.dashboard-row:hover, .dashboard-row:focus-visible { background: var(--secondary); }
.dashboard-row:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.dashboard-row-main { min-width: 0; }
.dashboard-row-main strong, .dashboard-row-main small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-row-main strong { font-size: var(--font-text); }
.dashboard-row-main small { margin-top: 2px; color: var(--text-3); font-size: var(--font-text); }
.dashboard-row-end { color: var(--text-2); font-size: var(--font-text); white-space: nowrap; }
.dashboard-row-end.dashboard-urgent { color: var(--error-text); }
.dashboard-row > .icon { width: 16px; height: 16px; color: var(--text-3); }
.dashboard-empty { padding: 24px 20px; color: var(--text-3); font-size: var(--font-text); }
.workflow-model-edit { display: grid; gap: 14px; padding: 16px; }
.workflow-model-edit .card-head { padding: 0; }
.workflow-model-edit .btn { justify-self: end; }
.workflow-model-fixed { display: flex; flex-wrap: wrap; gap: 14px; padding: 10px 0; border-top: 1px solid var(--border-soft); color: var(--text-2); font-size: var(--font-text); }
.workflow-drawer-link { width: 100%; display: flex; justify-content: space-between; gap: 10px; padding: 12px 0; border: 0; border-bottom: 1px solid var(--border-soft); background: transparent; color: var(--text-2); text-align: left; cursor: pointer; }
.workflow-drawer-link strong { color: var(--background-text); }
.workflow-drawer-link:hover { color: var(--background-text); }
.workflow-linked-task { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 16px; color: var(--background-text); text-align: left; cursor: pointer; }
.workflow-linked-task > span:first-child { display: grid; gap: 4px; flex: 1; }
.workflow-linked-task small { color: var(--text-3); }
.workflow-linked-task:hover { background: var(--secondary); }
.btn:disabled { opacity: .45; cursor: not-allowed; }
select:focus-visible, textarea:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .toast { animation: none; } *, *::before, *::after { scroll-behavior: auto !important; transition-duration: 0s !important; } }
.workflow-order-info .info-cell { min-width: 0; }
.workflow-order-progress { display: grid; grid-template-columns: repeat(6, minmax(168px, 1fr)); gap: 5px; overflow-x: auto; margin: 0 0 18px; padding: 10px; border: 1px solid var(--border-soft); border-radius: 9px; background: #0b0b0b; }
.workflow-order-progress-step { min-width: 168px; min-height: 52px; display: flex; align-items: center; gap: 9px; padding: 8px 10px; border: 1px solid #303030; border-radius: 6px; background: #151515; color: var(--text-3); text-align: left; font-size: var(--font-text); font-weight: 650; white-space: nowrap; }
.workflow-order-progress-marker { width: 23px; height: 23px; display: grid; flex: 0 0 23px; place-items: center; border-radius: 50%; background: #252525; font-size: var(--font-compact); }
.workflow-order-progress-step.current { border-color: var(--order-step-color); color: var(--order-step-color); background: color-mix(in srgb, var(--order-step-color) 12%, #111); }
.workflow-order-progress-step.current .workflow-order-progress-marker, .workflow-order-progress-step.complete .workflow-order-progress-marker { background: var(--order-step-color); color: #101010; }
.workflow-order-progress-step.complete { color: #8ad8ad; border-color: #244431; }
.workflow-order-stage-0 { --order-step-color: #bfc3ca; }
.workflow-order-stage-1 { --order-step-color: #f0c97c; }
.workflow-order-stage-2 { --order-step-color: #85b8ff; }
.workflow-order-stage-3 { --order-step-color: #85b8ff; }
.workflow-order-stage-4 { --order-step-color: #8ad8ad; }
.workflow-order-stage-5 { --order-step-color: #c7b2ff; }
.workflow-order-step-actions { display: flex; justify-content: flex-end; margin: -8px 0 18px; }
.workflow-add-model-icon { width: 40px; height: 40px; padding: 0; }
.workflow-add-model-icon .icon { width: 17px; height: 17px; }
.workflow-order-model-empty { padding: 15px 18px; border-top: 1px solid var(--border-soft); color: var(--text-3); font-size: var(--font-text); }
.btn-danger { border-color: #54262b; background: #211113; color: #ff9aa2; }
.btn-danger:hover { border-color: #8a3b43; background: #32171b; }
.workflow-order-selection-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 22px 0 12px; }
.workflow-order-selection-head h2 { margin: 0; font-size: var(--font-subtitle); }
.workflow-order-save { display: flex; justify-content: flex-end; padding: 16px 0 0; }
.workflow-choice-search { width: 100%; margin-bottom: 12px; }
.workflow-choice-list { display: grid; gap: 6px; }
.workflow-choice-option { width: 100%; min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 12px; border: 1px solid var(--border-soft); border-radius: 6px; background: #141414; color: var(--text); text-align: left; cursor: pointer; }
.workflow-choice-option:hover, .workflow-choice-option:focus-visible { border-color: #666; background: #1b1b1b; }
.workflow-choice-option > span:nth-last-child(2) { min-width: 0; flex: 1; display: grid; gap: 3px; }
.workflow-choice-option strong { overflow: hidden; text-overflow: ellipsis; }
.workflow-choice-option small { overflow: hidden; color: var(--text-3); font-size: var(--font-compact); text-overflow: ellipsis; white-space: nowrap; }
.workflow-choice-option[hidden] { display: none; }
.workflow-choice-image { width: 40px; height: 40px; flex: 0 0 40px; border: 1px solid var(--border); border-radius: 5px; background: #101010; object-fit: contain; }
.workflow-choice-drawer .drawer-body { display: flex; flex-direction: column; }
.workflow-info-field input, .workflow-info-field select { width: 100%; min-width: 0; padding: 2px 0 5px; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; background: transparent; color: var(--text); font: inherit; font-size: var(--font-text); }
.workflow-info-field input:focus, .workflow-info-field select:focus { outline: none; border-color: var(--accent); }
.workflow-info-field select option, .workflow-drawing-picker select option { background: var(--surface); color: var(--text); }
.workflow-order-model .drawing-name { min-width: 0; }
.workflow-drawing-thumb { width: 50px; height: 50px; flex: 0 0 50px; border: 1px solid var(--border); border-radius: 7px; background: #101010; object-fit: contain; }
.workflow-order-pending-label { margin-top: 3px; color: var(--text-3); font-size: var(--font-compact) !important; }
.workflow-order-model .model-head { grid-template-columns: minmax(260px, 1.7fr) 78px 116px 36px; }
.workflow-order-model .matrix-row { min-width: 1100px; grid-template-columns: minmax(210px, 250px) repeat(var(--size-count), minmax(72px, 1fr)) 72px 72px 110px; }
.workflow-order-model .model-matrix.with-printer .matrix-row { min-width: 1230px; grid-template-columns: minmax(190px, 220px) repeat(var(--size-count), minmax(60px, 1fr)) minmax(140px, 160px) 110px 56px 65px 100px; gap: 6px; }
.workflow-order-printer-cell { min-width: 0; }
.workflow-order-printer-cell select { width: 100%; height: 36px; padding: 0 7px; border: 1px solid var(--border); border-radius: 6px; outline: none; background: var(--secondary); color: var(--text); font: inherit; font-size: var(--font-compact); }
.workflow-order-printer-cell select:focus { border-color: var(--accent); }
.workflow-order-printer-price { height: 36px; background: var(--secondary); }
.workflow-order-printer-price input { font-size: var(--font-compact); }
.workflow-quantity-actions-head { width: 60px; }
.workflow-quantity-actions { display: flex; align-items: center; justify-content: center; gap: 4px; opacity: 0; pointer-events: none; transition: opacity .15s ease; }
.workflow-quantity-actions .icon-button { width: 27px; height: 27px; border-radius: 5px; }
.workflow-quantity-actions .icon { width: 14px; height: 14px; }
.workflow-order-model:hover .workflow-quantity-actions, .workflow-order-model:focus-within .workflow-quantity-actions { opacity: 1; pointer-events: auto; }
.workflow-remove-model { width: 34px; height: 34px; border-color: #54262b; background: #211113; color: #ff9aa2; }
.workflow-remove-model:hover { border-color: #8a3b43; background: #32171b; color: #ff9aa2; }
.workflow-add-drawing-full { width: 100%; min-height: 38px; border: 0; border-top: 1px solid var(--border-soft); border-radius: 0; background: transparent; color: var(--text-2); }
.workflow-add-drawing-full:hover { background: var(--surface-2); color: var(--text); }
@media (hover: none) { .workflow-quantity-actions { opacity: 1; pointer-events: auto; } }
.workflow-drawing-picker { display: grid; gap:3px; }
.workflow-drawing-picker > span { color: var(--text-3); font-size: var(--font-compact); }
.workflow-drawing-picker select { max-width: 150px; padding: 3px 2px; border: 0; border-bottom: 1px solid var(--border); background: transparent; color: var(--text); font-size: var(--font-text); }
.workflow-drawing-actions { display: flex; align-items: center; gap: 14px; }
.workflow-drawing-actions .price-toggle { margin-top: 3px; }
.workflow-order-note { margin-top: 18px; }
.workflow-order-note textarea { min-height: 86px; }
@media (max-width: 1250px) { .workflow-pipeline { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.workflow-model-production { max-width: none; }
.person-production-section { margin-top: 18px; }
.production-status-scroll { overflow-x: auto; margin: 0 0 16px; scrollbar-color: var(--surface-3) transparent; scrollbar-width: thin; }
.production-status-bar { min-width: 1600px; display: grid; grid-template-columns: minmax(150px, 1fr) minmax(300px, 2fr) minmax(450px, 3fr) minmax(450px, 3fr) minmax(150px, 1fr); gap: 7px; padding: 16px 7px 7px; border-radius: 12px; background: #0b0b0b; color: #f3f3f3; }
.production-status-bar .phase { position: relative; display: grid; grid-template-columns: repeat(var(--cols), minmax(140px, 1fr)); gap: 1px; padding: 1px; border: 1px solid rgba(255,255,255,.065); border-radius: 9px; background: rgba(255,255,255,.055); }
.production-status-bar .phase-label { position: absolute; top: -11px; left: 9px; z-index: 1; padding: 0 5px; background: #0b0b0b; color: #727278; font-size: var(--font-compact); font-weight: 750; line-height: 20px; letter-spacing: .075em; text-transform: uppercase; }
.production-status-bar .stage { position: relative; min-width: 0; min-height: 70px; display: grid; grid-template-rows: auto auto; gap: 7px; padding: 9px 10px 8px; background: #0d0d0d; }
.production-status-bar .phase .stage:first-of-type { border-radius: 7px 0 0 7px; }
.production-status-bar .phase .stage:last-child { border-radius: 0 7px 7px 0; }
.production-status-bar .phase[style*="--cols:1"] .stage { border-radius: 7px; }
.production-status-bar .stage::after { content: ""; position: absolute; right: 10px; bottom: 0; left: 10px; height: 2px; border-radius: 2px 2px 0 0; background: var(--status-color); opacity: .9; }
.production-status-bar .topline, .production-status-bar .bottomline { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.production-status-bar .status-id { color: var(--status-color); font-size: var(--font-compact); font-weight: 760; font-variant-numeric: tabular-nums; }
.production-status-bar .status-count { color: #fff; font-size: var(--font-subtitle); line-height: 1; font-weight: 760; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.production-status-bar .status-name { min-width: 0; overflow: hidden; color: #98989e; font-size: var(--font-compact); font-weight: 560; white-space: nowrap; text-overflow: ellipsis; }
.production-status-bar .dot { width: 6px; height: 6px; flex: 0 0 6px; border-radius: 50%; background: var(--status-color); }
.production-status-bar .workflow-status-tone-new { --status-color: #b7bec7; }
.production-status-bar .workflow-status-tone-in { --status-color: #5b92ff; }
.production-status-bar .workflow-status-tone-received { --status-color: #58c38c; }
.production-status-bar .workflow-status-tone-ready { --status-color: #e0b44f; }
.production-status-bar .workflow-status-tone-finished { --status-color: #b38cff; }
.workflow-model-stage { max-width: 100%; display: inline-flex; align-items: center; gap: 7px; padding: 5px 9px 5px 5px; border: 1px solid currentColor; border-radius: 999px; font-size: var(--font-text); font-weight: 700; white-space: nowrap; }
.workflow-model-stage-number { width: 24px; height: 24px; display: inline-grid; place-items: center; border-radius: 50%; background: currentColor; font-size: var(--font-compact); line-height: 1; }
.workflow-model-stage-new { color: #bfc3ca; background: #23262a; }
.workflow-model-stage-in { color: #85b8ff; background: #15263d; }
.workflow-model-stage-received { color: #8ad8ad; background: #173125; }
.workflow-model-stage-ready { color: #f0c97c; background: #352816; }
.workflow-model-stage-finished { color: #c7b2ff; background: #292139; }
.workflow-model-stage-new .workflow-model-stage-number { background: #bfc3ca; color: #23262a; }
.workflow-model-stage-in .workflow-model-stage-number { background: #85b8ff; color: #15263d; }
.workflow-model-stage-received .workflow-model-stage-number { background: #8ad8ad; color: #173125; }
.workflow-model-stage-ready .workflow-model-stage-number { background: #f0c97c; color: #352816; }
.workflow-model-stage-finished .workflow-model-stage-number { background: #c7b2ff; color: #292139; }
.workflow-model-production .table-scroll { overflow-x: hidden; }
.workflow-model-table { min-width: 0; table-layout: fixed; }
.workflow-model-table th:nth-child(1) { width: 6%; }
.workflow-model-table th:nth-child(2) { width: 9%; }
.workflow-model-table th:nth-child(3) { width: 13%; }
.workflow-model-table th:nth-child(4) { width: 12%; }
.workflow-model-table th:nth-child(5) { width: 10%; }
.workflow-model-table th:nth-child(6) { width: 25%; }
.workflow-model-table th:nth-child(7) { width: 10%; }
.workflow-model-table th:nth-child(8) { width: 10%; }
.workflow-model-table th:nth-child(9) { width: 5%; }
.workflow-model-table th, .workflow-model-table td { padding-right: 6px; padding-left: 6px; }
.workflow-model-table th { height: auto; min-height: 44px; padding-top: 10px; padding-bottom: 10px; font-size: var(--font-compact); white-space: normal; }
.workflow-model-table td { height: auto; min-height: 76px; padding-top: 10px; padding-bottom: 10px; vertical-align: middle; white-space: normal; overflow-wrap: anywhere; }
.workflow-priority-input { width: 100%; max-width: 46px; padding: 7px 2px; border: 1px solid var(--border-soft); border-radius: 5px; background: #151515; color: var(--text-1); text-align: center; font-variant-numeric: tabular-nums; }
.production-total-phase .stage { border-color: #444; background: #191919; }
.workflow-task-id { display: grid; gap: 3px; font-variant-numeric: tabular-nums; }
.workflow-task-id small { color: var(--text-3); font-size: var(--font-compact); }
.workflow-model-name { max-width: 100%; display: grid; gap: 2px; }
.workflow-model-name strong { overflow-wrap: anywhere; }
.workflow-model-name small { color: var(--text-3); font-size: var(--font-compact); overflow-wrap: anywhere; }
.workflow-model-table .workflow-model-stage { gap: 4px; padding: 3px 5px 3px 3px; font-size: var(--font-compact); line-height: 1.2; white-space: normal; }
.workflow-model-table .workflow-model-stage-number { width: 20px; height: 20px; flex: 0 0 20px; }
.workflow-model-table .workflow-person-link { white-space: normal; text-align: left; }
.workflow-model-quantities { display: flex; align-items: flex-start; gap: 10px; }
.workflow-model-size-values { min-width: 0; display: flex; flex-wrap: wrap; gap: 4px; }
.workflow-model-quantity { min-width: 40px; display: grid; gap: 1px; padding: 4px 5px; border: 1px solid var(--border-soft); border-radius: 5px; background: #151515; text-align: center; font-variant-numeric: tabular-nums; }
.workflow-model-quantity small { color: var(--text-3); font-size: var(--font-compact); line-height: 1; }
.workflow-model-quantity strong { font-size: var(--font-text); line-height: 1.3; }
.workflow-model-quantity.changed { border-color: #96662d; background: #2b2114; }
.workflow-model-quantity.changed strong { color: #ffbd68; }
.workflow-model-quantity.total { min-width: 56px; flex: 0 0 56px; border-color: #424242; }
.workflow-model-order-list { display: grid; gap: 4px; }
.workflow-model-order-list .link-button { text-align: left; white-space: normal; overflow-wrap: anywhere; }
.workflow-model-note { width: 100%; min-width: 0; min-height: 34px; padding: 5px 8px; border: 1px solid transparent; border-radius: 5px; background: transparent; color: var(--text); font-size: var(--font-text); }
.workflow-model-note:hover, .workflow-model-note:focus { border-color: var(--border); background: #0a0a0a; }
.workflow-task-open { width: 34px; height: 34px; margin-left: auto; }
.workflow-task-open .icon { width: 16px; height: 16px; }
@media (max-width: 1280px) { .workflow-model-table th, .workflow-model-table td { padding-right: 4px; padding-left: 4px; } }
.workflow-model-drawer { width: min(610px, 100vw); }
.workflow-model-drawer .drawer-head > div:first-child { min-width: 0; }
.workflow-model-drawer .drawer-head p { overflow-wrap: anywhere; }
.workflow-model-step-body, .workflow-model-create-fields { display: grid; align-content: start; gap: 18px; }
.workflow-model-step-flow { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.workflow-model-step-flow > span[aria-hidden] { color: var(--text-3); }
.workflow-task-header-actions, .workflow-task-step-actions { display: flex; align-items: center; gap: 10px; }
.workflow-task-header-actions { flex: 0 0 auto; }
.workflow-task-delete { border-color: #54262b; color: var(--error-text); }
.workflow-task-delete:hover { border-color: #8a3b43; color: var(--error-text); }
.workflow-task-delete:disabled { opacity: .45; cursor: not-allowed; }
.workflow-task-step-actions { justify-content: flex-end; }
.workflow-task-step-actions .btn:disabled { opacity: .45; cursor: not-allowed; }
.workflow-task-drawer-note textarea { min-height: 72px; }
.workflow-model-step-heading span { color: var(--text-3); font-size: var(--font-text); }
.workflow-model-step-heading { display: grid; gap: 3px; }
.workflow-model-step-body .task-quantity-grid, .workflow-model-create-fields .task-quantity-grid { margin: 0; }
.workflow-task-section { min-width: 0; display: grid; gap: 12px; padding: 16px; border: 1px solid var(--border); border-radius: 8px; background: var(--secondary); }
.workflow-task-primary { border-color: #525252; background: var(--primary); }
.workflow-task-extra { display: grid; gap: 10px; padding-top: 20px; border-top: 1px solid var(--border); }
.workflow-task-extra-heading { color: var(--text-3); font-size: var(--font-compact); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.workflow-task-disclosure { min-width: 0; border: 1px solid var(--border); border-radius: 8px; background: var(--secondary); }
.workflow-task-disclosure summary { min-height: 52px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; cursor: pointer; list-style: none; }
.workflow-task-disclosure summary::-webkit-details-marker { display: none; }
.workflow-task-disclosure summary > strong { font-size: var(--font-subtitle); }
.workflow-task-disclosure summary > span { display: inline-flex; align-items: center; gap: 10px; color: var(--text-3); font-size: var(--font-compact); white-space: nowrap; }
.workflow-task-disclosure summary .icon { width: 16px; height: 16px; transition: transform .18s ease; }
.workflow-task-disclosure[open] summary .icon { transform: rotate(90deg); }
.workflow-task-disclosure[open] summary { border-bottom: 1px solid var(--border); }
.workflow-task-disclosure-body { display: grid; gap: 12px; padding: 16px; }
.workflow-task-section .task-quantity-grid { grid-template-columns: repeat(auto-fit, minmax(70px, 1fr)); overflow-x: visible; }
.workflow-task-linked-orders { display: flex; flex-wrap: wrap; gap: 8px 12px; }
.workflow-task-linked-orders .link-button { text-align: left; white-space: normal; }
.workflow-task-order-add { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.workflow-task-order-add select { min-width: 0; height: 40px; padding: 0 10px; border: 1px solid var(--border); border-radius: 7px; background: var(--primary); color: var(--text); font: inherit; }
.workflow-task-disclosure .workflow-model-history-original { margin: 0; }
.workflow-task-disclosure .task-timeline { margin-top: 2px; }
.workflow-model-history-current, .workflow-model-history-original { display: grid; gap: 10px; margin-bottom: 18px; padding: 14px; border: 1px solid var(--border); border-radius: 7px; background: var(--secondary); }
.workflow-model-history-current > span, .workflow-model-history-original > span { color: var(--text-3); font-size: var(--font-text); }
.workflow-model-history-original .workflow-model-quantities { flex-wrap: wrap; }
.workflow-model-history-heading { margin: 22px 0 12px; font-size: var(--font-subtitle); font-weight: 700; }
.workflow-serigraphy-page { max-width: none; }
.workflow-serigraphy-cards { margin-bottom: 10px; }
.workflow-serigraphy-card { min-width: 380px; flex-basis: 380px; }
.workflow-serigraphy-card .stock-card-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.workflow-serigraphy-card .stock-card-metrics > div { padding-right: 3px; padding-left: 3px; }
.workflow-serigraphy-card .stock-card-metrics span { font-size: var(--font-compact); }
.workflow-serigraphy-card-person { min-width: 0; max-width: 100%; display: inline-flex; align-items: center; gap: 7px; padding: 0; }
.workflow-serigraphy-card-person strong { min-width: 0; }
.workflow-serigraphy-card-person .icon { width: 14px; height: 14px; }
.workflow-serigraphy-card .workflow-serigraphy-metric-not-separated { color: #b7bec7; background: #23262a; }
.workflow-serigraphy-card .workflow-serigraphy-metric-separated { color: #85b8ff; background: #15263d; }
.workflow-serigraphy-card .workflow-serigraphy-metric-taken { color: #f0c97c; background: #352816; }
.workflow-serigraphy-card .workflow-serigraphy-metric-not-separated span, .workflow-serigraphy-card .workflow-serigraphy-metric-separated span, .workflow-serigraphy-card .workflow-serigraphy-metric-taken span { color: inherit; font-size: var(--font-text); }
.workflow-serigraphy-card .stock-card-metrics > div:last-child span { font-size: var(--font-text); }
.workflow-serigraphy-table { min-width: 1570px; table-layout: fixed; }
.workflow-serigraphy-section-head th { height: 34px; background: var(--primary); font-size: var(--font-compact); letter-spacing: .08em; text-transform: uppercase; }
.workflow-serigraphy-section-head th:last-child { padding-left: 16px; border-left: 2px solid #444; background: #1b1b1b; }
.workflow-serigraphy-table thead tr:last-child th:nth-child(n+5) { background: #1b1b1b; }
.workflow-serigraphy-table thead tr:last-child th:nth-child(5) { border-left: 2px solid #444; }
.workflow-serigraphy-table col:nth-child(1) { width: 160px; }
.workflow-serigraphy-table col:nth-child(2) { width: 110px; }
.workflow-serigraphy-table col:nth-child(3) { width: 95px; }
.workflow-serigraphy-table col:nth-child(4) { width: 130px; }
.workflow-serigraphy-table col:nth-child(5) { width: 170px; }
.workflow-serigraphy-table col:nth-child(6) { width: 150px; }
.workflow-serigraphy-table col:nth-child(7) { width: 95px; }
.workflow-serigraphy-table col:nth-child(8) { width: 130px; }
.workflow-serigraphy-table col:nth-child(9) { width: 70px; }
.workflow-serigraphy-table col:nth-child(10) { width: 330px; }
.workflow-serigraphy-table col:nth-child(11) { width: 130px; }
.workflow-serigraphy-table td { vertical-align: middle; }
.workflow-serigraphy-table th:nth-child(n), .workflow-serigraphy-table td:nth-child(n) { text-align: left; }
.workflow-serigraphy-order-row .workflow-serigraphy-order-cell { background: var(--primary); }
.workflow-serigraphy-order-row .workflow-serigraphy-printer-cell { background: #1b1b1b; }
.workflow-serigraphy-order-row.alternate .workflow-serigraphy-order-cell { background: #151515; }
.workflow-serigraphy-order-row.alternate .workflow-serigraphy-printer-cell { background: #202020; }
.workflow-serigraphy-order-row .workflow-serigraphy-printer-start { border-left: 2px solid #444; }
.workflow-serigraphy-order-gap td { height: 12px; padding: 0; border: 0; background: #080808; }
.workflow-serigraphy-client { display: block; margin-top: 4px; overflow: hidden; color: var(--text-3); font-size: var(--font-text); text-overflow: ellipsis; white-space: nowrap; }
.workflow-serigraphy-printer-name { min-width: 0; max-width: 100%; display: block; overflow: hidden; font-size: var(--font-text); font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.workflow-serigraphy-task-number { display: block; margin-top: 3px; color: var(--text-3); font-size: var(--font-compact); }
.workflow-serigraphy-days { font-weight: 750; }
.workflow-serigraphy-table .workflow-serigraphy-status { margin: 0; }
.workflow-serigraphy-status { width: fit-content; max-width: 100%; display: inline-flex; align-items: center; padding: 5px 8px; border: 1px solid currentColor; border-radius: 5px; font-size: var(--font-compact); font-weight: 700; white-space: nowrap; }
.workflow-serigraphy-status-not-separated { color: #b7bec7; background: #23262a; }
.workflow-serigraphy-status-separated { color: #85b8ff; background: #15263d; }
.workflow-serigraphy-status-taken { color: #f0c97c; background: #352816; }
.workflow-serigraphy-status-arrived { color: #8ad8ad; background: #173125; }
.workflow-serigraphy-next { min-height: 31px; justify-self: stretch; padding: 0 8px; font-size: var(--font-compact); white-space: nowrap; }
.workflow-serigraphy-stock { display: inline-flex; align-items: center; gap: 5px; font-variant-numeric: tabular-nums; }
.workflow-serigraphy-stock .icon { width: 17px; height: 17px; }
.workflow-serigraphy-stock.enough { color: var(--valid-text); }
.workflow-serigraphy-stock.missing { color: var(--error-text); }
.workflow-orders-table { min-width: 1300px; }
.workflow-order-stock { display: inline-flex; align-items: center; gap: 6px; font-variant-numeric: tabular-nums; font-weight: 700; }
.workflow-order-stock .icon { width: 17px; height: 17px; }
.workflow-order-stock.enough { color: var(--valid-text); }
.workflow-order-stock.missing { color: var(--error-text); }
button.workflow-order-stock { padding: 4px 7px; border: 1px solid transparent; border-radius: 5px; background: transparent; font: inherit; cursor: pointer; }
button.workflow-order-stock:hover, button.workflow-order-stock:focus-visible { border-color: var(--error-text); background: var(--error); outline: none; }
.workflow-order-shortage-total { display: flex; align-items: baseline; gap: 10px; padding-bottom: 18px; border-bottom: 1px solid var(--border); }
.workflow-order-shortage-total strong { color: var(--error-text); font-size: 28px; }
.workflow-order-shortage-total span { color: var(--text-3); }
.workflow-order-shortage-list { display: grid; gap: 10px; padding-top: 18px; }
.workflow-order-shortage-item { display: flex; justify-content: space-between; gap: 14px; padding: 14px; border: 1px solid var(--border); border-radius: 6px; background: var(--secondary); }
.workflow-order-shortage-item > div { min-width: 0; display: grid; gap: 5px; }
.workflow-order-shortage-item span, .workflow-order-shortage-item small { color: var(--text-3); }
.workflow-order-shortage-item > strong { flex: 0 0 auto; white-space: nowrap; }
.workflow-serigraphy-note { width: 100%; }
.workflow-serigraphy-step-body, .workflow-serigraphy-drawer-lines { display: grid; gap: 16px; }
.workflow-serigraphy-step-flow { display: flex; align-items: center; gap: 10px; }
.workflow-serigraphy-step-flow > span[aria-hidden] { color: var(--text-3); }
.workflow-serigraphy-drawer-line { padding-top: 14px; border-top: 1px solid var(--border-soft); }
.workflow-serigraphy-drawer-line-title { display: flex; justify-content: space-between; gap: 12px; }
.workflow-serigraphy-drawer-line-title strong { font-size: var(--font-text); }
.workflow-serigraphy-drawer-line-title span { color: var(--text-3); font-size: var(--font-text); }
.workflow-serigraphy-drawer-line .task-quantity-grid { margin: 10px 0 0; }
.workflow-serigraphy-step-body .workflow-serigraphy-drawer-lines { gap: 12px; }
.workflow-serigraphy-step-body .workflow-serigraphy-drawer-line:first-child { padding-top: 0; border-top: 0; }
.workflow-serigraphy-original-line { display: grid; gap: 8px; }
.workflow-serigraphy-original-line + .workflow-serigraphy-original-line { padding-top: 12px; border-top: 1px solid var(--border-soft); }
.workflow-serigraphy-original-line > strong { font-size: var(--font-text); }
.workflow-serigraphy-original-line .workflow-model-quantities { flex-wrap: wrap; }
.workflow-serigraphy-settings-body { display: grid; align-content: start; }
.workflow-serigraphy-settings-row { display: grid; grid-template-columns: minmax(0, 1fr) 54px; align-items: center; gap: 16px; }
.workflow-serigraphy-settings-row + .workflow-serigraphy-settings-row { padding-top: 12px; border-top: 1px solid var(--border-soft); }
.workflow-serigraphy-settings-row > div { display: grid; gap: 4px; }
.workflow-serigraphy-settings-row > div span { color: var(--text-3); font-size: var(--font-text); }
.workflow-serigraphy-settings-row .field input { max-width: 130px; }
.workflow-serigraphy-settings-row > input[type="color"] { width: 54px; height: 40px; padding: 3px; border: 1px solid var(--border); border-radius: 7px; background: var(--secondary); cursor: pointer; }
.person-name-only { grid-template-columns: 1fr; }
.person-client-fields { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 14px; }
.person-client-fields[hidden] { display: none; }
.drawing-list-name { display: flex; align-items: center; gap: 12px; }
.drawing-artwork { width: 44px; height: 44px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid var(--border); border-radius: 6px; background: linear-gradient(135deg, #282828, #131313); color: var(--text-3); }
.drawing-artwork .icon { width: 24px; height: 24px; }
.drawing-artwork-large { width: 100%; height: 210px; margin-bottom: 20px; }
.drawing-artwork-large .icon { width: 62px; height: 62px; }
.drawing-artwork[src] { display: block; background: #101010; object-fit: contain; }
.model-detail-page { max-width: none; }
.model-detail-summary { display: grid; grid-template-columns: 160px minmax(0, 1fr); align-items: center; gap: 22px; margin-bottom: 16px; }
.model-detail-picture { min-height: 145px; display: grid; place-items: center; }
.model-detail-picture .thumb { width: 108px; height: 120px; border-radius: 12px; }
.model-detail-picture .thumb .icon { width: 72px; height: 72px; }
.model-detail-info { min-height: 145px; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); align-items: center; gap: 16px; padding: 20px 26px; border: 1px solid var(--border-soft); border-radius: var(--radius); background: var(--surface); }
.model-detail-info > div { min-width: 0; display: grid; gap: 8px; text-align: center; }
.model-detail-info span { color: var(--text-3); font-size: var(--font-text); font-weight: 700; }
.model-detail-info strong { overflow: hidden; color: var(--text); font-size: var(--font-text); text-overflow: ellipsis; white-space: nowrap; }
.model-cost-table { min-width: 1400px; table-layout: fixed; }
.model-cost-table th, .model-cost-table td { padding-left: 10px; padding-right: 10px; text-align: center; }
.model-cost-table th:first-child, .model-cost-table td:first-child { width: 70px; text-align: left; }
.model-cost-table th:nth-last-child(3), .model-cost-table td:nth-last-child(3), .model-cost-table th:last-child, .model-cost-table td:last-child { width: 125px; }
.model-cost-input { width: 100%; max-width: 82px; height: 34px; padding: 0 5px; border: 1px solid transparent; border-radius: 5px; background: transparent; color: var(--text); font: inherit; text-align: center; font-variant-numeric: tabular-nums; }
.model-cost-input:hover { border-color: var(--border); background: var(--secondary); }
.model-cost-input:focus { border-color: var(--accent); background: var(--secondary); outline: none; }
.model-cost-total { color: var(--text) !important; font-weight: 700; font-variant-numeric: tabular-nums; }
.model-cost-margin { color: var(--valid-text) !important; font-weight: 700; font-variant-numeric: tabular-nums; }
.model-cost-margin.negative { color: var(--error-text) !important; }
@media (max-width: 1450px) { .model-detail-info { grid-template-columns: repeat(3, minmax(0, 1fr)); } }