:root {
    --ink: #171714;
    --muted: #77776f;
    --line: #e7e6df;
    --paper: #f5f4ef;
    --surface: #ffffff;
    --nav: #121311;
    --lime: #d7f56c;
    --lime-dark: #657d12;
    --amber: #f4b855;
    --danger: #b33b36;
    --shadow: 0 18px 50px rgba(30, 31, 25, 0.07);
}
* { box-sizing: border-box; }

html { min-height: 100%; }

body {
    margin: 0;
    min-height: 100vh;
    background: var(--paper);
    color: var(--ink);
    font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    -webkit-font-smoothing: antialiased;
}

button, input, select, textarea { font: inherit; }
a { color: inherit; text-decoration: none; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 252px minmax(0, 1fr); }

.sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    display: flex;
    flex-direction: column;
    padding: 28px 20px 20px;
    color: #f7f7f2;
    background: var(--nav);
}

.brand { display: inline-flex; align-items: center; }
.brand-logo { display: block; width: 118px; height: auto; }
.sidebar .brand-logo { filter: invert(1); }

.module-switcher { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 30px; padding: 11px 12px; border: 1px solid #30322d; border-radius: 11px; background: #1a1b18; }
.module-switcher span { color: white; font-size: 11px; font-weight: 800; }
.module-switcher small { color: var(--lime); font-size: 8px; font-weight: 750; }
.module-switcher:hover { border-color: #4b4e44; background: #20221e; }
.navigation { display: flex; flex: 1; flex-direction: column; gap: 5px; margin-top: 10px; }
.nav-label { margin: 24px 12px 8px; color: #72756d; font-size: 9px; font-weight: 800; letter-spacing: .18em; }
.nav-item { display: flex; width: 100%; min-height: 42px; align-items: center; justify-content: space-between; padding: 0 13px; border: 0; border-radius: 10px; color: #aeb0a8; background: transparent; font: inherit; font-size: 13px; font-weight: 650; text-align: left; cursor: pointer; }
.nav-item:hover:not(.disabled) { color: white; background: #20221e; }
.nav-item.active { color: var(--nav); background: var(--lime); }
.nav-item small { font-size: 9px; font-weight: 500; opacity: .52; }
.nav-item.disabled { cursor: default; }
.nav-subitems { display: grid; gap: 3px; margin: -1px 0 5px 14px; padding-left: 12px; border-left: 1px solid #30322d; }
.nav-subitems[hidden] { display: none; }
.nav-group-chevron { color: inherit; font-size: 14px; line-height: 1; transition: transform .18s ease; }
.nav-group-toggle[aria-expanded="true"] .nav-group-chevron { transform: rotate(180deg); }
.nav-subitem { padding: 7px 8px; border-radius: 7px; color: #81847b; font-size: 9px; font-weight: 650; }
.nav-subitem:hover, .nav-subitem.active { color: var(--lime); background: #1c1e1a; }

.sidebar-footer { display: grid; grid-template-columns: 34px 1fr auto; gap: 9px; align-items: center; padding: 14px 8px 0; border-top: 1px solid #2b2d28; }
.user-avatar { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid #3b3e37; border-radius: 50%; color: var(--lime); font-size: 12px; font-weight: 800; }
.user-meta strong, .user-meta a { display: block; max-width: 112px; overflow: hidden; text-overflow: ellipsis; }
.user-meta strong { font-size: 10px; }
.user-meta a { margin-top: 3px; color: #8e9188; font-size: 9px; }
.text-button { padding: 0; border: 0; color: #8e9188; background: none; cursor: pointer; font-size: 10px; }
.text-button:hover, .user-meta a:hover { color: var(--lime); }

.main-content { min-width: 0; padding: 44px clamp(28px, 4vw, 64px) 72px; }
.page-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 32px; }
.page-header h1 { max-width: 780px; margin: 7px 0 8px; font-size: clamp(30px, 4vw, 46px); line-height: 1.04; letter-spacing: -.045em; }
.page-header p:not(.eyebrow) { max-width: 720px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.header-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.header-actions .secondary-button { margin-top: 0; }
.eyebrow { margin: 0; color: var(--lime-dark); font-size: 9px; font-weight: 850; letter-spacing: .18em; }
.eyebrow.light { color: var(--lime); }
.status-chip, .pill { display: inline-flex; align-items: center; white-space: nowrap; border: 1px solid var(--line); border-radius: 999px; background: rgba(255,255,255,.7); color: #66685f; font-size: 10px; font-weight: 700; }
.status-chip { gap: 7px; padding: 8px 12px; }
.status-chip span { width: 7px; height: 7px; border-radius: 50%; background: var(--lime-dark); box-shadow: 0 0 0 4px rgba(101,125,18,.12); }
.pill { padding: 6px 10px; }

.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; margin-bottom: 13px; }
.metric-grid.five { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.metric-grid.six { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.metric-card { min-height: 132px; padding: 21px; border: 1px solid var(--line); border-radius: 17px; background: rgba(255,255,255,.78); }
.metric-card > span { display: block; color: var(--muted); font-size: 10px; font-weight: 750; text-transform: uppercase; letter-spacing: .08em; }
.metric-card strong { display: block; margin: 16px 0 4px; font-size: 32px; line-height: 1; letter-spacing: -.04em; }
.metric-card .metric-text { font-size: 20px; }
.metric-card .metric-money { font-size: 22px; }
.metric-card small { color: #9b9b93; font-size: 10px; }
.danger-card strong { color: var(--danger); }

.dashboard-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; }
.dashboard-sales-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dashboard-sales-grid .trend-panel { grid-row: span 2; }
.panel { min-width: 0; padding: 24px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); box-shadow: var(--shadow); }
.panel.span-two { grid-column: span 2; }
.panel.span-three { grid-column: 1 / -1; }
.narrow-panel { max-width: 650px; }
.panel-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 22px; }
.panel h2 { margin: 5px 0 0; font-size: 18px; letter-spacing: -.025em; }
.muted { color: var(--muted); font-size: 12px; line-height: 1.6; }

.roadmap { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.roadmap li { position: relative; display: grid; grid-template-columns: 38px 1fr; gap: 13px; align-items: flex-start; padding: 10px 0; color: #a2a299; }
.roadmap li:not(:last-child)::after { content: ""; position: absolute; left: 18px; top: 45px; bottom: -4px; width: 1px; background: var(--line); }
.roadmap li > span { z-index: 1; width: 37px; height: 37px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: white; font-size: 9px; font-weight: 800; }
.roadmap strong, .roadmap small { display: block; }
.roadmap strong { margin-top: 2px; color: inherit; font-size: 13px; }
.roadmap small { margin-top: 5px; color: #9d9d95; font-size: 10px; }
.roadmap li.done, .roadmap li.active { color: var(--ink); }
.roadmap li.done > span { border-color: var(--lime); background: var(--lime); }
.roadmap li.active > span { border-color: var(--ink); }

.exception-count { margin: 30px 0 8px; font-size: 60px; font-weight: 750; line-height: 1; letter-spacing: -.06em; }
.secondary-button, .primary-button { display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; cursor: pointer; font-weight: 750; }
.secondary-button { min-height: 38px; margin-top: 12px; padding: 0 14px; border: 1px solid var(--line); background: white; font-size: 10px; }
.secondary-button:hover { border-color: #b6b7ae; }
.primary-button { min-height: 44px; padding: 0 20px; border: 0; color: var(--nav); background: var(--lime); font-size: 12px; }
.primary-button:hover { background: #c9ec53; }
.primary-button.is-loading,
.primary-button.is-loading:hover {
    color: #777a6d;
    background: #e5e8da;
    cursor: wait;
    opacity: .72;
}
.primary-button.is-loading::before {
    content: "";
    width: 12px;
    height: 12px;
    margin-right: 8px;
    border: 2px solid rgba(101, 125, 18, .22);
    border-top-color: var(--lime-dark);
    border-radius: 50%;
    animation: submit-spinner .7s linear infinite;
}
@keyframes submit-spinner { to { transform: rotate(360deg); } }
.wide { width: 100%; }

.table-wrap { overflow-x: auto; }
.sales-plan-table { min-width: 1760px; }
.sales-plan-table input { width: 126px; min-height: 36px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 8px; background: white; color: var(--ink); }
.sales-plan-table input:disabled { color: #77786f; background: #f0f0eb; }
.sales-plan-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 20px; }
.sales-plan-actions .secondary-button { min-height: 44px; margin: 0; }
.sales-plan-locked { margin: 18px 0 0; }
.month-selection a.selection-chip { text-decoration: none; }
.month-selection a.selection-chip.active span { border-color: #d7bf66; color: #171714; background: #e7ca68; }
.warehouse-table-wrap { max-height: 680px; overflow: auto; }
.warehouse-table-wrap thead th { position: sticky; top: 0; z-index: 2; background: var(--surface); }
.inventory-filter { padding: 17px 20px; }
.inventory-filter-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; align-items: end; }
.turnover-filter-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.turnover-filter-grid .filter-field { min-width: 0; }
.report-filter .inventory-filter-grid { width: 100%; }
.header-warehouse-filter label { display: grid; gap: 4px; color: #77786f; font-size: 8px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.header-warehouse-filter select { min-width: 150px; min-height: 36px; padding: 7px 10px; border: 1px solid var(--line); border-radius: 9px; background: white; color: var(--ink); }
.inventory-filter-grid .inventory-search-field { grid-column: span 2; }
.inventory-filter-grid label { display: grid; gap: 6px; color: #77786f; font-size: 8px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.inventory-filter-grid input, .inventory-filter-grid select { width: 100%; min-height: 40px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 9px; outline: none; background: white; color: var(--ink); font-size: 10px; }
.inventory-filter-grid .secondary-button, .inventory-filter-grid .primary-button { min-height: 40px; margin: 0; }
.requirement-status-form { display: block; }
.requirement-table { min-width: 900px; table-layout: fixed; }
.requirement-table th:nth-child(1), .requirement-table td:nth-child(1) { width: 14%; }
.requirement-table th:nth-child(2), .requirement-table td:nth-child(2) { width: 10%; }
.requirement-table th:nth-child(3), .requirement-table td:nth-child(3) { width: 26%; }
.requirement-table th:nth-child(4), .requirement-table td:nth-child(4),
.requirement-table th:nth-child(5), .requirement-table td:nth-child(5),
.requirement-table th:nth-child(6), .requirement-table td:nth-child(6) { width: 12%; }
.requirement-table th:nth-child(7), .requirement-table td:nth-child(7) { width: 14%; }
.requirement-status-heading { padding-top: 7px; padding-bottom: 7px; overflow: visible; }
.requirement-status-select { min-width: 120px; color: #8d8e86; }
.requirement-status-select .multi-select-trigger { min-height: 30px; padding: 5px 8px; border-radius: 7px; font-size: 8px; }
.requirement-status-select .multi-select-menu { right: 0; left: auto; width: 240px; }
.requirement-status-select .multi-select-search input { width: 100%; min-height: 34px; padding: 7px 8px; border: 1px solid var(--line); border-radius: 7px; }
.requirement-status-select .multi-select-option { display: flex; align-items: center; gap: 8px; padding: 9px 4px; color: var(--ink); cursor: pointer; font-size: 10px; font-weight: 650; text-transform: none; letter-spacing: normal; }
.requirement-status-select .multi-select-option input { width: 15px; height: 15px; margin: 0; accent-color: var(--lime-dark); }
.pagination { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--line); color: var(--muted); font-size: 10px; }
.pagination > div { display: flex; gap: 7px; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 13px 10px; border-bottom: 1px solid #efeee9; text-align: left; font-size: 11px; }
th { color: #8d8e86; font-size: 8px; letter-spacing: .1em; text-transform: uppercase; }
tbody tr:last-child td { border-bottom: 0; }
.code-label { padding: 4px 7px; border-radius: 6px; background: #f0f1eb; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 9px; }
.table-subtext { display: block; margin-top: 3px; color: var(--muted); }
.row-link { color: var(--lime-dark); font-size: 10px; font-weight: 800; }
.status-badge, .action-badge { display: inline-flex; align-items: center; border-radius: 999px; font-size: 8px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.status-badge { padding: 6px 9px; color: #65665f; background: #edede8; }
.status-badge.large { padding: 9px 13px; font-size: 9px; }
.status-badge.ready, .status-badge.committed { color: #49600a; background: #e9f6be; }
.status-badge.blocked { color: #96342f; background: #fde3e1; }
.status-badge.parsing { color: #836016; background: #fff0c9; }
.action-badge { padding: 4px 7px; }
.action-badge.new { color: #49600a; background: #e9f6be; }
.action-badge.update { color: #765611; background: #fff0c9; }
.action-badge.status_update { color: #765611; background: #fff0c9; }
.action-badge.pure_cancel { color: #666860; background: #edede8; }
.action-badge.unchanged { color: #666860; background: #edede8; }
.action-badge.blocked { color: #96342f; background: #fde3e1; }
.empty-state { padding: 48px 20px; border: 1px dashed #d9d8d1; border-radius: 13px; color: #8f9088; text-align: center; font-size: 11px; line-height: 1.6; }
.quality-list { display: grid; gap: 12px; margin: 0; }
.quality-list div { display: flex; align-items: center; justify-content: space-between; padding-bottom: 12px; border-bottom: 1px solid #efeee9; }
.quality-list dt { color: var(--muted); font-size: 11px; }
.quality-list dd { margin: 0; font-size: 17px; font-weight: 800; }

.messages { display: grid; gap: 8px; margin-bottom: 18px; }
.message { padding: 11px 14px; border: 1px solid #cfe29a; border-radius: 10px; background: #eff8d9; font-size: 11px; }
.message.warning { color: #765611; border-color: #e8cb82; background: #fff4d7; }
.special-case-notice { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 16px 18px; color: #684b08; border: 1px solid #e4c36c; border-radius: 13px; background: #fff5d9; }
.special-case-notice h2 { margin: 3px 0 5px; }
.special-case-notice p { margin: 0; font-size: 10px; line-height: 1.55; }
.special-case-notice > span { flex: 0 0 auto; padding: 7px 9px; border-radius: 8px; background: #f5d98f; font-size: 9px; font-weight: 900; }
.historical-audit-notice { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 16px 18px; color: #315d65; border: 1px solid #9acbd0; border-radius: 13px; background: #eaf7f8; }
.historical-audit-notice h2 { margin: 3px 0 5px; }
.historical-audit-notice p { margin: 0; font-size: 10px; line-height: 1.55; }
.historical-audit-notice > span { flex: 0 0 auto; padding: 7px 9px; border-radius: 8px; background: #c9e9ec; font-size: 9px; font-weight: 900; }
.requirement-summary-table th:first-child, .requirement-summary-table td:first-child { width: 180px; }
.requirement-summary-table td { padding-top: 14px; padding-bottom: 14px; }
.requirement-detail { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--line); }
.stack-form { display: grid; gap: 8px; }
.stack-form label, .auth-card label { color: #64655e; font-size: 10px; font-weight: 750; }
.stack-form p { display: grid; gap: 6px; margin: 0 0 8px; }
.stack-form input, .stack-form select, .stack-form textarea, .auth-card input, .upload-form select { width: 100%; min-height: 44px; padding: 9px 12px; border: 1px solid #d9d8d1; border-radius: 9px; outline: none; background: white; }
.stack-form textarea { resize: vertical; }
.stack-form input[type="checkbox"] { width: auto; min-height: 0; }
.stack-form input:focus, .stack-form select:focus, .stack-form textarea:focus, .auth-card input:focus, .upload-form select:focus { border-color: #768f21; box-shadow: 0 0 0 3px rgba(118,143,33,.12); }
.stack-form .errorlist { margin: 0; padding-left: 18px; color: var(--danger); font-size: 9px; }
.inline-form { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.inline-form input { width: 110px; min-height: 34px; padding: 6px 8px; border: 1px solid var(--line); border-radius: 7px; }
.primary-button.compact, .secondary-button.compact { min-height: 34px; margin-top: 0; padding: 0 10px; font-size: 9px; }
.table-input { width: 80px; min-height: 34px; padding: 5px 7px; border: 1px solid var(--line); border-radius: 7px; }
.projection-qty-input { width: 94px; font-weight: 850; }
.preview-edit-note { margin: -4px 0 14px; font-size: 9px; }
.ratio-alert { min-width: 54px; display: inline-flex; justify-content: center; padding: 6px 8px; border: 1px solid #e2b4b1; border-radius: 7px; color: var(--danger); background: #fde3e1; font-weight: 900; }
.danger-button { color: var(--danger); border-color: #e2b4b1; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 14px; }
.guide-list { display: grid; gap: 10px; margin: 0; padding-left: 20px; color: var(--muted); font-size: 12px; line-height: 1.6; }
.guide-flow { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.guide-step { display: grid; grid-template-columns: 42px 1fr; gap: 14px; }
.guide-step > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: var(--lime); font-size: 10px; font-weight: 900; }
.guide-step h2 { margin-top: 2px; }
.guide-step p { margin: 8px 0 0; color: var(--muted); font-size: 11px; line-height: 1.65; }
.section-gap { margin-top: 14px; }
.production-table { min-width: 920px; }
.production-monitor-wrap { max-height: 680px; overflow: auto; }
.production-monitor-wrap thead th { position: sticky; top: 0; z-index: 2; background: white; }
.approval-queue { display: grid; gap: 8px; }
.approval-queue-row { display: grid; gap: 4px; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: #fafaf7; }
.approval-queue-row:hover { border-color: #c6d78e; background: #fbffe9; }
.approval-queue-row strong { font-size: 11px; }
.approval-queue-row span { color: var(--muted); font-size: 9px; }
.compact-empty { padding: 28px 16px; }
.production-roadmap { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0; margin: 0; padding: 0; list-style: none; }
.production-roadmap li { position: relative; display: grid; gap: 9px; padding-right: 14px; }
.production-roadmap li:not(:last-child)::after { content: ""; position: absolute; top: 16px; right: 0; left: 34px; height: 1px; background: var(--line); }
.production-roadmap li > span { z-index: 1; width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: var(--lime); font-size: 8px; font-weight: 900; }
.production-roadmap strong, .production-roadmap small { display: block; }
.production-roadmap strong { font-size: 10px; line-height: 1.3; }
.production-roadmap small { margin-top: 4px; color: var(--muted); font-size: 8px; line-height: 1.45; }
.production-stage-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.production-stage-card:last-child { grid-column: 1 / -1; }
#material-purchase, .production-trial-card { grid-column: 1 / -1; }
.production-progress { height: 8px; overflow: hidden; border-radius: 999px; background: #ecece6; }
.production-progress span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--lime-dark), var(--lime)); }
.production-progress-label { display: block; margin: 6px 0 16px; color: var(--muted); text-align: right; font-size: 9px; font-weight: 800; }
.cmt-quantity-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-bottom: 12px; }
.cmt-quantity-grid > div { min-width: 0; display: grid; gap: 5px; padding: 11px; border: 1px solid var(--line); border-radius: 9px; background: #fafaf7; }
.cmt-quantity-grid span { color: var(--muted); font-size: 7px; font-weight: 900; letter-spacing: .07em; text-transform: uppercase; }
.cmt-quantity-grid strong { font-size: 14px; }
.cmt-quantity-grid small { color: var(--muted); font-size: 7px; line-height: 1.4; }
.production-stage-form { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: end; }
.production-stage-form p:first-of-type, .production-stage-form p:last-of-type, .production-stage-form button { grid-column: 1 / -1; }
.production-stage-form .secondary-button:disabled,
.production-stage-form .secondary-button:disabled:hover { border-color: var(--line); color: #9a9b93; background: #eeeeea; cursor: not-allowed; opacity: .65; }
.production-stage-form .secondary-button.is-loading,
.production-stage-form .secondary-button.is-loading:hover { color: #777a6d; background: #e5e8da; cursor: wait; opacity: .72; }
.production-stage-form .secondary-button.is-loading::before { content: ""; width: 12px; height: 12px; margin-right: 8px; border: 2px solid rgba(101, 125, 18, .22); border-top-color: var(--lime-dark); border-radius: 50%; animation: submit-spinner .7s linear infinite; }
.trial-overview-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; margin: 4px 0 18px; align-items: stretch; }
.trial-overview-grid.has-monitoring { grid-template-columns: minmax(0, 1.45fr) minmax(280px, .75fr); }
.trial-product-section { min-width: 0; margin: 0; padding: 12px; border: 1px solid var(--line); border-radius: 11px; background: #fafaf7; }
.trial-product-section .panel-header.compact { margin-bottom: 10px; }
.trial-product-section h3 { margin: 0; font-size: 13px; }
.trial-product-wrap { max-height: 258px; overflow: auto; border: 1px solid var(--line); border-radius: 9px; background: white; }
.trial-product-table { min-width: 420px; }
.trial-product-table th, .trial-product-table td { padding-top: 9px; padding-bottom: 9px; }
.trial-product-table thead th { position: sticky; top: 0; z-index: 2; background: #f4f4ef; }
.trial-summary.trial-monitoring-summary { grid-template-columns: 1fr; gap: 8px; margin: 0; }
.trial-monitoring-summary > div:last-child { grid-column: auto; }
.trial-workflow-forms { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 12px; align-items: start; }
.trial-target-form { display: contents; }
.trial-target-form .trial-date-field { grid-column: 1; grid-row: 1; }
.trial-target-form > .secondary-button { grid-column: 1; grid-row: 2; width: 100%; }
.trial-submit-form { display: contents; }
.trial-note-form { display: contents; }
.trial-date-field, .trial-notes-field { display: grid; gap: 6px; min-width: 0; }
.trial-approved-date-field { grid-column: 2; grid-row: 1; }
.trial-submit-form > .primary-button { grid-column: 2; grid-row: 2; width: 100%; }
.trial-notes-field { grid-column: 1 / -1; grid-row: 3; }
.trial-note-form > .secondary-button { grid-column: 1 / -1; grid-row: 4; width: 100%; }
.trial-approval-meta { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.trial-approval-meta .muted { margin: 0; }
.trial-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin-bottom: 18px; }
.trial-summary > div { display: grid; gap: 6px; padding: 13px; border: 1px solid var(--line); border-radius: 10px; background: #fafaf7; }
.trial-summary .span-two { grid-column: 1 / -1; }
.trial-summary span { color: var(--muted); font-size: 8px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.trial-summary strong { font-size: 11px; line-height: 1.5; }
.help-text { margin-bottom: 8px; color: var(--muted); font-size: 9px; line-height: 1.55; }
.help-text ul { margin: 4px 0 0; padding-left: 16px; }
.field-error { color: var(--danger); font-size: 9px; }
.form-alert { padding: 10px 12px; border: 1px solid #e2b4b1; border-radius: 9px; background: #fff2f1; color: #8f2d29; font-size: 10px; line-height: 1.5; }
.planning-product-multi { position: relative; display: grid; gap: 6px; margin: 0 0 8px; }
.planning-product-multi .builder-field-label { color: #64655e; font-size: 10px; font-weight: 750; }
.planning-product-multi .builder-product-source { display: none; }
.planning-product-multi .multi-select-search { display: grid; gap: 6px; color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.planning-product-multi .multi-select-search input { width: 100%; min-height: 40px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; }
.planning-product-multi .multi-select-option { display: flex; align-items: flex-start; gap: 9px; padding: 9px 4px; border-bottom: 1px solid #f0efe9; color: var(--ink); cursor: pointer; font-size: 10px; font-weight: 650; line-height: 1.4; }
.planning-product-multi .multi-select-option:hover { background: #fafbf4; }
.planning-product-multi .multi-select-option input { width: 15px; height: 15px; min-height: 0; flex: 0 0 auto; margin: 0; accent-color: var(--lime-dark); }
.scenario-list { display: grid; gap: 9px; }
.scenario-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: end; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: #fafaf7; }
.scenario-edit-form { display: grid; grid-template-columns: minmax(170px, 1.4fr) repeat(2, minmax(130px, .75fr)) auto auto; gap: 8px; align-items: end; }
.scenario-edit-form label { display: grid; gap: 5px; color: var(--muted); font-size: 8px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.scenario-edit-form input { width: 100%; min-height: 34px; padding: 6px 8px; border: 1px solid var(--line); border-radius: 7px; background: white; color: var(--ink); }
.scenario-edit-form input:disabled { color: var(--muted); background: #efefe9; }
.scenario-edit-form .secondary-button:disabled,
.scenario-edit-form .secondary-button:disabled:hover { border-color: var(--line); color: #9a9b93; background: #eeeeea; cursor: not-allowed; opacity: .65; }
.scenario-meta { min-height: 34px; display: grid; gap: 3px; align-content: center; }
.scenario-meta small, .scenario-lock { white-space: nowrap; font-size: 8px; }
.scenario-row-actions { display: flex; align-items: center; gap: 7px; }
.scenario-row-actions form { margin: 0; }
.preview-header-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
.preview-header-actions .primary-button { min-width: 170px; margin: 0; }
.scenario-approval-actions { display: grid; gap: 14px; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); }
.scenario-approval-actions label { display: grid; gap: 7px; font-weight: 700; }
.scenario-approval-actions textarea { width: 100%; resize: vertical; }
.scenario-approval-actions .preview-header-actions { justify-content: flex-start; }
.preview-grain-selector { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; margin: 0 0 14px; }
.preview-grain-label { margin-right: 3px; color: var(--muted); font-size: 8px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.preview-grain-option { position: relative; cursor: pointer; }
.preview-grain-option input { position: absolute; opacity: 0; pointer-events: none; }
.preview-grain-option span { min-height: 30px; display: inline-flex; align-items: center; gap: 7px; padding: 0 10px; border: 1px solid var(--line); border-radius: 8px; background: #fafaf7; color: var(--muted); font-size: 9px; font-weight: 800; }
.preview-grain-option span::before { content: ""; width: 13px; height: 13px; display: grid; place-items: center; border: 1px solid #bfc0b7; border-radius: 3px; background: white; color: var(--nav); font-size: 9px; line-height: 1; }
.preview-grain-option input:checked + span { border-color: #b9d455; color: var(--ink); background: #f1f8d9; }
.preview-grain-option input:checked + span::before { content: "✓"; border-color: var(--lime); background: var(--lime); font-weight: 950; }
.preview-grain-option input:focus-visible + span { outline: 2px solid #768f21; outline-offset: 2px; }
.preview-grain-selector small { color: var(--muted); font-size: 8px; }
.draft-delete-selection-button { position: relative; width: 34px; height: 34px; display: inline-grid; place-items: center; margin-left: auto; padding: 0; border: 1px solid #e2b4b1; border-radius: 9px; color: var(--danger); background: #fff2f1; cursor: pointer; }
.draft-delete-selection-button[hidden] { display: none; }
.draft-delete-selection-button svg { width: 17px; height: 17px; fill: currentColor; }
.draft-delete-selection-button:hover, .draft-delete-selection-button:focus-visible { border-color: var(--danger); background: #fde3e1; }
.draft-delete-tooltip { position: absolute; right: 0; bottom: calc(100% + 8px); z-index: 20; width: max-content; max-width: 240px; padding: 7px 9px; border-radius: 7px; color: white; background: #2b2c28; font-size: 8px; font-weight: 750; line-height: 1.35; box-shadow: 0 6px 20px rgba(17,23,14,.15); opacity: 0; pointer-events: none; transform: translateY(3px); transition: opacity .15s ease, transform .15s ease; }
.draft-delete-selection-button:hover .draft-delete-tooltip, .draft-delete-selection-button:focus-visible .draft-delete-tooltip { opacity: 1; transform: translateY(0); }
.draft-sales-value { display: inline-flex; align-items: center; gap: 8px; }
.draft-sales-value small { font-size: 8px; font-weight: 850; white-space: nowrap; }
.draft-selection-table .draft-selection-col { position: sticky; left: 0; z-index: 4; width: 44px; min-width: 44px; padding-left: 13px; padding-right: 8px; background: white; }
.draft-selection-table thead .draft-selection-col { z-index: 9; background: #f3f3ed; }
.draft-selection-table tfoot .draft-selection-col { z-index: 9; background: #e6f1bd; }
.draft-selection-table .draft-selection-col input { width: 15px; height: 15px; margin: 0; accent-color: var(--lime-dark); cursor: pointer; }
.draft-selection-table th, .draft-selection-table td { text-align: center; }
.draft-selection-table .sticky-col-2 { text-align: left; }
.draft-selection-table .table-input { text-align: center; }
.draft-selection-table .sticky-col-1 { left: 44px; }
.draft-selection-table .sticky-col-2 { left: 174px; }
[data-preview-grain-panel][hidden], [data-draft-grain-panel][hidden] { display: none; }
.preview-table-wrap { overflow: auto; scrollbar-gutter: stable; }
.preview-table-wrap thead th { position: sticky; top: 0; z-index: 3; background: var(--surface); }
.preview-table-wrap tfoot td, #projection-preview [data-sales-planning-total] td { position: sticky; bottom: 0; z-index: 3; border-top: 2px solid #c8dc7e; border-bottom: 0; background: #f0f7d8; color: #27300d; font-weight: 850; }
.planning-history-baseline { background: #f7fbe7 !important; color: #526b10; font-weight: 850; }
.sales-draft-matrix table { width: max-content; min-width: 100%; }
.sales-draft-matrix th, .sales-draft-matrix td { white-space: nowrap; }
.sales-draft-matrix input[type="number"] { width: 100px; }
.sales-draft-matrix thead th { position: static; }

.auth-page { background: var(--nav); }
.auth-layout { min-height: 100vh; display: grid; grid-template-columns: minmax(420px, 1.05fr) minmax(440px, .95fr); }
.auth-story { position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; padding: clamp(36px, 6vw, 80px); color: white; background-image: linear-gradient(90deg, rgba(7,10,8,.78) 0%, rgba(7,10,8,.52) 58%, rgba(7,10,8,.22) 100%), url("../img/login-vobia-forest.a3c9012e2561.jpg"); background-size: cover; background-position: center 42%; background-repeat: no-repeat; }
.auth-brand { align-self: flex-start; }
.auth-brand-logo { display: block; width: clamp(128px, 12vw, 172px); height: auto; filter: brightness(0) invert(1); }
.auth-story h1 { max-width: 700px; margin: 14px 0 20px; font-size: clamp(40px, 5vw, 74px); line-height: .98; letter-spacing: -.055em; text-shadow: 0 2px 24px rgba(0,0,0,.35); }
.auth-story p:not(.eyebrow) { max-width: 620px; color: #a9aca2; font-size: 14px; line-height: 1.75; }
.auth-story p.auth-tagline { margin: 0; color: rgba(255,255,255,.88); font-weight: 650; letter-spacing: .06em; text-transform: uppercase; }
.auth-principles { display: flex; flex-wrap: wrap; gap: 8px; }
.auth-principles span { padding: 7px 10px; border: 1px solid #34362f; border-radius: 999px; color: #a8aba1; font-size: 9px; letter-spacing: .04em; }
.auth-panel { display: grid; place-items: center; padding: 28px; background: var(--paper); }
.auth-card { width: min(100%, 420px); display: grid; gap: 11px; padding: clamp(28px, 5vw, 48px); border: 1px solid var(--line); border-radius: 22px; background: white; box-shadow: var(--shadow); }
.auth-card h2 { margin: 7px 0 6px; font-size: 27px; letter-spacing: -.04em; }
.auth-card .muted { margin: 0 0 18px; }
.security-note { margin: 4px 0 0; color: #96978f; text-align: center; font-size: 9px; }

.module-hub-page {
    min-height: 100vh;
    background:
        radial-gradient(circle at 88% 8%, rgba(215,245,108,.23), transparent 24%),
        radial-gradient(circle at 8% 82%, rgba(116,145,32,.09), transparent 28%),
        var(--paper);
}
.module-topbar { position: sticky; top: 0; z-index: 50; height: 88px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 0 clamp(24px, 5vw, 72px); border-bottom: 1px solid rgba(23,23,20,.09); background: rgba(245,244,239,.92); box-shadow: 0 8px 28px rgba(23,23,20,.035); backdrop-filter: blur(16px); }
.module-brand { width: 118px; flex-direction: column; align-items: center; gap: 5px; color: var(--ink); }
.module-brand-legacy { color: #686a61; text-align: center; font-size: 6px; font-weight: 850; letter-spacing: .18em; line-height: 1; text-transform: uppercase; white-space: nowrap; }
.module-space-brand { position: absolute; left: 50%; top: 50%; width: 230px; display: flex; flex-direction: column; align-items: center; gap: 2px; transform: translate(-50%, -50%); pointer-events: none; }
.module-space-wordmark { display: block; margin-bottom: 6px; color: #11120f; font-size: 27px; font-weight: 900; letter-spacing: .035em; line-height: 1; white-space: nowrap; }
.module-space-tagline { width: 100%; color: #686a61; text-align: center; font-size: 6px; font-weight: 800; letter-spacing: .1em; line-height: 1.25; white-space: nowrap; }
.module-user { display: flex; align-items: center; gap: 12px; }
.module-user-copy { display: grid; gap: 2px; text-align: right; }
.module-user-copy small { color: var(--muted); font-size: 8px; font-weight: 850; letter-spacing: .12em; }
.module-user-copy strong { font-size: 11px; }
.module-user .user-avatar { color: var(--ink); border-color: #d8d8cf; background: white; }
.module-logout { padding: 8px 10px; border: 0; color: var(--muted); background: transparent; cursor: pointer; font-size: 9px; font-weight: 750; }
.module-logout:hover { color: var(--ink); }
.module-hub { width: min(1380px, calc(100% - 48px)); margin: 0 auto; padding: 28px 0 64px; }
.module-messages { max-width: 760px; margin-bottom: 24px; }
.module-hero { display: flex; align-items: flex-end; justify-content: space-between; gap: 48px; margin-bottom: 42px; }
.module-hero h1 { margin: 8px 0 12px; font-size: clamp(48px, 7vw, 88px); line-height: .92; letter-spacing: -.065em; }
.module-hero > div:first-child > p:last-child { max-width: 680px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.7; }
.module-hero-note { width: min(100%, 330px); display: grid; grid-template-columns: 42px 1fr; gap: 14px; align-items: center; padding: 15px; border: 1px solid rgba(23,23,20,.1); border-radius: 15px; background: rgba(255,255,255,.6); }
.module-hero-note > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; color: var(--nav); background: var(--lime); font-size: 10px; font-weight: 900; }
.module-hero-note strong, .module-hero-note small { display: block; }
.module-hero-note strong { font-size: 11px; }
.module-hero-note small { margin-top: 4px; color: var(--muted); font-size: 9px; line-height: 1.5; }
.module-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.module-card {
    --module-accent: var(--lime);
    position: relative;
    isolation: isolate;
    min-height: 330px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(23,23,20,.11);
    border-radius: 22px;
    color: white;
    background-image:
        linear-gradient(180deg, rgba(8,10,8,.11) 0%, rgba(8,10,8,.18) 30%, rgba(8,10,8,.82) 100%),
        var(--module-image);
    background-size: cover;
    background-position: var(--module-position, center);
    box-shadow: 0 14px 35px rgba(30,31,25,.05);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.module-card::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(90deg, rgba(8,10,8,.16), transparent 60%); }
.module-card > * { position: relative; z-index: 1; }
.module-card:hover { transform: translateY(-4px); border-color: rgba(255,255,255,.32); box-shadow: 0 22px 50px rgba(30,31,25,.18); }
.module-card.module-teal { --module-accent: #83ded0; }
.module-card.module-violet { --module-accent: #c6b5f6; }
.module-card.module-coral { --module-accent: #ffb2a3; }
.module-card.module-blue { --module-accent: #9ecaf6; }
.module-card.module-amber { --module-accent: #f2cc83; }
.module-card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 24px 24px 0; }
.module-icon { width: 64px; height: 64px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.2); border-radius: 18px; color: var(--ink); background: color-mix(in srgb, var(--module-accent) 84%, white); box-shadow: 0 12px 30px rgba(0,0,0,.14); }
.module-icon svg { width: 31px; height: 31px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.module-status { padding: 7px 10px; border: 1px solid rgba(255,255,255,.24); border-radius: 999px; color: white; background: rgba(12,14,12,.42); box-shadow: 0 8px 22px rgba(0,0,0,.1); backdrop-filter: blur(10px); font-size: 8px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.module-card:not(.coming-soon) .module-status { color: white; background: rgba(72,92,13,.6); }
.module-card-copy { flex: 1; padding: 32px 24px 24px; }
.module-card-copy p { margin: 0 0 7px; color: rgba(255,255,255,.74); font-size: 8px; font-weight: 850; letter-spacing: .13em; }
.module-card-copy h2 { margin: 0 0 12px; color: white; text-shadow: 0 2px 18px rgba(0,0,0,.28); font-size: 29px; letter-spacing: -.045em; }
.module-card-copy span { display: block; max-width: 330px; color: rgba(255,255,255,.78); text-shadow: 0 1px 10px rgba(0,0,0,.35); font-size: 11px; line-height: 1.65; }
.module-card-action { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 0 24px; border-top: 1px solid rgba(255,255,255,.15); color: white; background: rgba(10,12,10,.54); backdrop-filter: blur(12px); font-size: 10px; font-weight: 850; }
.module-card-action span { font-size: 18px; transition: transform .2s ease; }
.module-card-action:hover span { transform: translateX(4px); }
.module-card.coming-soon { filter: saturate(.86); }
.module-card.coming-soon .module-icon { opacity: .78; }
.module-card.coming-soon .module-card-action { color: rgba(255,255,255,.82); background: rgba(10,12,10,.62); }
.module-footer { display: flex; justify-content: space-between; gap: 20px; padding: 20px clamp(24px, 5vw, 72px) 28px; color: #92938b; font-size: 8px; font-weight: 750; letter-spacing: .1em; }

.upload-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr); gap: 13px; }
.upload-panel { min-height: 410px; display: grid; align-items: center; }
.upload-form { display: grid; gap: 14px; }
.drop-zone { min-height: 270px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 30px; border: 1.5px dashed #c9c9c0; border-radius: 16px; background: #fafaf7; text-align: center; cursor: pointer; }
.drop-zone:hover { border-color: var(--lime-dark); background: #f8fbe9; }
.drop-zone input { width: min(100%, 280px); height: auto; margin-top: 14px; border: 0; font-size: 10px; }
.drop-zone strong { font-size: 15px; }
.drop-zone small { max-width: 410px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.upload-icon { width: 48px; height: 48px; display: grid; place-items: center; margin-bottom: 6px; border-radius: 14px; color: var(--nav); background: var(--lime); font-size: 22px; font-weight: 800; }
.contract-panel h2 { margin-bottom: 20px; }
.check-list { display: grid; gap: 14px; margin: 0; padding: 0; list-style: none; }
.check-list li { position: relative; padding-left: 23px; color: #676860; font-size: 11px; line-height: 1.5; }
.check-list li::before { content: "✓"; position: absolute; left: 0; top: 0; width: 15px; height: 15px; display: grid; place-items: center; border-radius: 50%; color: #4f640e; background: #e9f6be; font-size: 8px; font-weight: 900; }
.import-summary-grid { margin-top: 13px; }
.approval-panel { display: flex; flex-direction: column; justify-content: center; }
.approval-panel h2 { margin: 8px 0 6px; }
.approval-panel .primary-button { margin-top: 12px; }
.approval-panel button:disabled { color: #989991; background: #e7e7e1; cursor: not-allowed; }
.quality-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; overflow: hidden; margin: 0; border: 1px solid var(--line); border-radius: 12px; background: var(--line); }
.quality-grid div { padding: 16px; background: white; }
.quality-grid dt { color: var(--muted); font-size: 9px; }
.quality-grid dd { margin: 8px 0 0; font-size: 21px; font-weight: 800; }
.filter-links { display: flex; flex-wrap: wrap; gap: 5px; }
.filter-links a { padding: 6px 9px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: 8px; font-weight: 800; text-transform: uppercase; }
.filter-links a:hover { border-color: #b2b3aa; color: var(--ink); }
.report-filter { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; box-shadow: none; }
.dashboard-period-filter { margin-bottom: 13px; }
.report-filter label { min-width: 145px; display: grid; gap: 6px; color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.report-filter input, .report-filter select { min-height: 40px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: white; color: var(--ink); }
.report-filter .secondary-button { margin-top: 0; }
.po-generator-filter { align-items: end; }
.po-generator-filter .filter-field { min-width: 190px; flex: 1 1 190px; }
.po-generator-filter .primary-button, .po-generator-filter .secondary-button { min-height: 40px; margin: 0; }
.po-confirmation { padding: 20px; border: 1px solid var(--line); border-radius: 14px; background: #fafaf7; }
.po-confirmation-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.po-confirmation-grid label { display: grid; gap: 6px; color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.po-confirmation-grid input, .po-confirmation-grid select, .po-confirmation-grid textarea { width: 100%; min-height: 40px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: white; color: var(--ink); }
.po-confirmation-grid .po-notes-field { grid-column: 1 / -1; }
.po-confirmation .primary-button:disabled { color: #989991; background: #e7e7e1; cursor: not-allowed; }
.filter-field { position: relative; min-width: 250px; display: grid; gap: 6px; color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.multi-select-trigger { min-height: 40px; width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: white; color: var(--ink); cursor: pointer; text-align: left; }
.multi-select-trigger [data-filter-summary] { max-width: 210px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.multi-select-menu { position: absolute; z-index: 30; top: calc(100% + 7px); left: 0; width: min(390px, 85vw); padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: white; box-shadow: 0 20px 45px rgba(30,31,25,.16); text-transform: none; letter-spacing: normal; }
.report-filter .multi-select-search { min-width: 0; display: grid; gap: 6px; color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.report-filter .multi-select-search input { width: 100%; min-height: 40px; }
.multi-select-toolbar { min-height: 34px; display: flex; align-items: center; justify-content: space-between; gap: 10px; color: var(--muted); font-size: 9px; }
.multi-select-toolbar button { padding: 4px 0; border: 0; color: var(--lime-dark); background: transparent; cursor: pointer; font-size: 9px; font-weight: 850; }
.multi-select-options { max-height: 280px; overflow-y: auto; border-top: 1px solid var(--line); }
.report-filter .multi-select-option { min-width: 0; display: flex; align-items: flex-start; gap: 9px; padding: 9px 4px; border-bottom: 1px solid #f0efe9; color: var(--ink); cursor: pointer; font-size: 10px; font-weight: 650; line-height: 1.4; text-transform: none; letter-spacing: normal; }
.report-filter .multi-select-option:hover { background: #fafbf4; }
.report-filter .multi-select-option input { width: 15px; height: 15px; min-height: 0; flex: 0 0 auto; margin: 0; padding: 0; accent-color: var(--lime-dark); }
.multi-select-option[hidden], .multi-select-menu[hidden] { display: none; }
.compact-filter { padding: 0; }
.compact-filter label { min-width: 170px; }
.bar-chart { display: grid; gap: 13px; }
.period-trend { grid-auto-rows: 14px; max-height: 662px; overflow-y: auto; padding-right: 8px; scrollbar-gutter: stable; }
.dashboard-sales-grid .trend-panel { display: flex; flex-direction: column; }
.dashboard-sales-grid .trend-panel .period-trend { min-height: 257px; flex: 1; align-content: start; }
.period-trend .bar-row { grid-template-columns: 58px minmax(100px, 1fr) minmax(110px, auto); }
.bar-row { display: grid; grid-template-columns: 42px minmax(100px, 1fr) minmax(110px, auto); gap: 10px; align-items: center; font-size: 10px; }
.bar-row > div { height: 9px; overflow: hidden; border-radius: 999px; background: #efeee8; }
.bar-row i { display: block; height: 100%; min-width: 2px; border-radius: inherit; background: linear-gradient(90deg, var(--lime-dark), var(--lime)); }
.bar-row strong { text-align: right; font-size: 10px; }
.monthly-sales-panel { display: flex; flex-direction: column; }
.monthly-chart-wrap { min-width: 0; overflow-x: auto; padding: 4px 0 2px; }
.monthly-chart { min-width: 270px; height: 185px; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(18px, 1fr); gap: 5px; align-items: end; }
.monthly-bar-item { position: relative; height: 100%; min-width: 0; display: grid; grid-template-rows: minmax(0, 1fr) auto auto; gap: 7px; padding: 0 3px 7px; text-align: center; }
.monthly-bar-item::before { content: ""; position: absolute; inset: 0; border-radius: 7px; background: #f0f0e9; }
.monthly-bar-item > * { position: relative; z-index: 1; }
.monthly-bar-track { min-height: 90px; display: flex; align-items: end; justify-content: center; overflow: hidden; border-radius: 7px; background: transparent; }
.monthly-bar-track i { width: 70%; min-height: 2px; display: block; border-radius: 6px 6px 2px 2px; background: linear-gradient(180deg, var(--lime), var(--lime-dark)); }
.monthly-bar-item strong { font-size: 8px; }
.monthly-bar-item span { color: var(--muted); font-size: 8px; font-weight: 800; }
.monthly-bar-item:last-child::before { background: #e9efd2; box-shadow: inset 0 0 0 1px #d7e39f; }
.monthly-bar-item:last-child strong, .monthly-bar-item:last-child span { color: var(--ink); font-weight: 900; }
.monthly-sales-panel .monthly-bar-item::before { border-radius: 7px 7px 0 0; }
.monthly-growth-divider { position: relative; z-index: 2; min-width: 270px; height: 1px; margin: 0; background: var(--line); }
.monthly-growth-row { min-width: 270px; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(18px, 1fr); gap: 5px; text-align: center; }
.monthly-growth-row span { min-height: 30px; display: grid; place-items: center; padding: 5px 2px 7px; border-radius: 0 0 7px 7px; background: #f0f0e9; font-size: 8px; font-weight: 900; white-space: nowrap; }
.monthly-growth-row span:last-child { background: #e9efd2; box-shadow: inset 0 0 0 1px #d7e39f; }
.growth-positive { color: #4e7612; }
.growth-negative { color: var(--danger); }
.metric-negative { color: var(--danger); font-weight: 850; }
.growth-neutral { color: var(--muted); }
.pareto-legend { display: flex; gap: 6px; }
.pareto-legend span, .pareto-class { padding: 5px 8px; border-radius: 999px; font-size: 8px; font-weight: 850; }
.class-a { color: #49600a; background: #e9f6be; }
.class-b { color: #765611; background: #fff0c9; }
.class-c { color: #96342f; background: #fde3e1; }
.issue-list { display: grid; gap: 7px; }
.issue-row { display: grid; grid-template-columns: 62px 1fr; gap: 12px; align-items: flex-start; padding: 11px 13px; border: 1px solid var(--line); border-radius: 10px; }
.issue-row > span { padding: 4px 6px; border-radius: 6px; text-align: center; font-size: 8px; font-weight: 900; }
.issue-row.error > span { color: #96342f; background: #fde3e1; }
.issue-row.warning > span { color: #765611; background: #fff0c9; }
.issue-row strong, .issue-row small { display: block; }
.issue-row strong { font-size: 10px; }
.issue-row small { margin-top: 4px; color: var(--muted); font-size: 9px; line-height: 1.5; }
.pagination { display: flex; align-items: center; justify-content: flex-end; gap: 9px; margin-top: 18px; color: var(--muted); font-size: 9px; }
.pagination a { padding: 6px 9px; border: 1px solid var(--line); border-radius: 7px; background: white; }

.source-exception-banner { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 17px 19px; border: 1px solid #e4c36c; border-radius: 14px; color: #684b08; background: #fff5d9; }
.source-exception-banner strong { display: block; margin: 5px 0; font-size: 13px; }
.source-exception-banner p:not(.eyebrow) { max-width: 900px; margin: 0; font-size: 10px; line-height: 1.6; }
.source-exception-banner > span { flex: 0 0 auto; padding: 8px 10px; border-radius: 8px; background: #f5d98f; font-size: 8px; font-weight: 900; letter-spacing: .05em; }
.merchandising-summary-wrap { max-height: 640px; }
.merchandising-summary-table { min-width: 1560px; }
.merchandising-summary-table th, .merchandising-summary-table td { border-right: 1px solid #efeee9; text-align: center; }
.merchandising-summary-table thead th { color: var(--ink); font-weight: 900; }
.merchandising-summary-table th:first-child, .merchandising-summary-table td:first-child { position: sticky; left: 0; z-index: 2; min-width: 190px; text-align: left; background: white; }
.merchandising-summary-table thead th:first-child { z-index: 4; }
.merchandising-summary-table th:not(:first-child), .merchandising-summary-table td:not(:first-child) { min-width: 105px; white-space: nowrap; }

.projection-filter { overflow: visible; border: 1px solid var(--line); border-radius: 18px; background: white; color: var(--ink); box-shadow: var(--shadow); }
.projection-filter-top { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; padding: 18px; border-bottom: 1px solid var(--line); }
.projection-filter .filter-field, .projection-search { min-width: 210px; display: grid; gap: 6px; color: var(--muted); font-size: 8px; font-weight: 850; text-transform: uppercase; letter-spacing: .07em; }
.projection-filter .multi-select-trigger, .projection-search input { min-height: 40px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: #fafaf7; }
.projection-filter .sku-type-field select { min-height: 40px; padding: 8px 32px 8px 10px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: #fafaf7; }
.projection-filter .multi-select-menu { color: var(--ink); }
.projection-filter .multi-select-search { min-width: 0; display: grid; gap: 6px; color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; }
.projection-filter .multi-select-search input { width: 100%; min-height: 40px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; }
.projection-filter .multi-select-option { min-width: 0; display: flex; align-items: flex-start; gap: 9px; padding: 9px 4px; border-bottom: 1px solid #f0efe9; color: var(--ink); cursor: pointer; font-size: 10px; font-weight: 650; line-height: 1.4; text-transform: none; letter-spacing: normal; }
.projection-filter .multi-select-option[hidden] { display: none; }
.projection-filter .multi-select-option input { width: 15px; height: 15px; min-height: 0; margin: 0; accent-color: var(--lime-dark); }
.projection-filter .secondary-button { border-color: var(--line); color: var(--ink); background: #fafaf7; }
.selection-rail { padding: 16px 18px 18px; }
.selection-group { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; }
.selection-group + .selection-group { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--line); }
.selection-title { min-width: 58px; color: var(--muted); font-size: 8px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.selection-chip { position: relative; cursor: pointer; }
.selection-chip input { position: absolute; opacity: 0; pointer-events: none; }
.selection-chip span, .selection-chip.disabled { min-height: 34px; display: inline-flex; align-items: center; padding: 0 13px; border: 1px solid var(--line); border-radius: 999px; color: #77786f; background: #fafaf7; font-size: 10px; font-weight: 750; }
.selection-chip input:checked + span { border-color: #d7bf66; color: #171714; background: #e7ca68; }
.metric-selection .selection-chip input:checked + span { border-color: #b8d5ee; color: #315f84; background: #eaf5ff; }
.submetric-selection .selection-chip input:checked + span { border-color: #b8d5ee; color: #315f84; background: #eaf5ff; }
.selection-help { margin-left: 5px; color: var(--muted); font-size: 8px; line-height: 1.45; }
.selection-chip.disabled { cursor: not-allowed; opacity: .45; }
.projection-data-panel { padding-bottom: 18px; }
.projection-table-wrap { max-height: 660px; overflow: auto; border: 1px solid var(--line); border-radius: 12px; }
.projection-table { min-width: max-content; }
.projection-table thead th { position: sticky; top: 0; z-index: 5; min-width: 115px; background: #f3f3ed; }
.projection-table thead th span { display: block; margin-bottom: 4px; color: var(--lime-dark); }
.projection-table .automatic-column-label { display: block; margin-top: 5px; color: #8b8b81; font-size: 7px; font-weight: 800; letter-spacing: .04em; }
.projection-table td { white-space: nowrap; background: white; }
.projection-table tfoot td { position: sticky; bottom: 0; z-index: 6; border-top: 2px solid #c8dc7e; border-bottom: 0; color: #27300d; background: #f0f7d8; font-weight: 850; }
.projection-table tfoot .sticky-col { z-index: 8; background: #e6f1bd; }
.projection-table .projection-total-row td:last-child { color: var(--lime-dark); }
.projection-table .parent-sku-count { display: block; margin-top: 4px; color: var(--muted); font-size: 7px; font-weight: 750; }
.projection-table .muted-cell { color: var(--muted); font-size: 8px; }
.projection-table .sticky-col { position: sticky; z-index: 3; }
.projection-table .sticky-col-1 { left: 0; min-width: 130px; }
.projection-table .sticky-col-2 { left: 130px; min-width: 260px; max-width: 260px; overflow: hidden; text-overflow: ellipsis; }
.projection-table thead .sticky-col { z-index: 7; }
.workflow-divider { display: flex; align-items: center; gap: 12px; color: var(--muted); font-size: 8px; font-weight: 900; letter-spacing: .15em; }
.workflow-divider::before, .workflow-divider::after { content: ""; height: 1px; flex: 1; background: var(--line); }
.money-input { display: inline-flex; min-width: 150px; align-items: center; gap: 7px; }
.money-input > span { color: var(--muted); font-size: 11px; font-weight: 800; }
.money-input input { width: 122px; min-height: 38px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 9px; background: #fff; font: inherit; font-weight: 800; }
.money-input input:focus { border-color: var(--lime-dark); outline: 2px solid rgba(118, 151, 31, .15); }
.money-input input.input-error { border-color: #d76a62; background: #fff3f1; }

/* Production v2: Plan → Activity ledger → read-only Monitoring */
.production-plan-selector { grid-template-columns: minmax(320px, 1fr) auto; align-items: end; }
.production-plan-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; }
.production-plan-field, .production-plan-pair { display: grid; gap: 7px; }
.production-plan-field.full { grid-column: span 2; }
.production-plan-field.wide { grid-column: 1 / -1; }
.production-plan-field > label, .production-plan-pair > strong, .production-plan-pair label,
.production-activity-form-grid label { color: var(--muted); font-size: 9px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.production-plan-pair { grid-column: span 2; grid-template-columns: 1fr 1fr; padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: #fafaf7; }
.production-plan-pair > strong { grid-column: 1 / -1; color: var(--ink); }
.production-plan-pair label { display: grid; gap: 7px; }
.production-plan-grid input, .production-plan-grid textarea,
.production-activity-form-grid input, .production-activity-form-grid select, .production-activity-form-grid textarea {
    width: 100%; min-height: 42px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 9px; background: white; color: var(--ink);
}
.production-plan-grid textarea, .production-activity-form-grid textarea { min-height: 84px; resize: vertical; }
.production-roadmap-seven { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.production-roadmap.production-roadmap-five { display: flex; }
.production-roadmap-five li { flex: 1; }
.production-roadmap-five li:last-child { flex: 0 0 110px; padding-right: 0; }
.production-monitor-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.production-read-card { min-height: 195px; }
.production-read-card h2 { margin: 7px 0 16px; }
.production-process-detail { margin-top: 10px; border-top: 1px solid var(--line); }
.production-detail-toggle { display: flex; justify-content: flex-end; padding-top: 10px; color: var(--lime-dark); font-size: 9px; font-weight: 850; cursor: pointer; list-style: none; }
.production-detail-toggle::-webkit-details-marker { display: none; }
.production-detail-open { display: none; }
.production-process-detail[open] .production-detail-closed { display: none; }
.production-process-detail[open] .production-detail-open { display: inline; }
.production-process-detail-table { margin-top: 9px; max-height: 265px; overflow: auto; border: 1px solid var(--line); border-radius: 9px; }
.production-process-detail-table table { min-width: 0; }
.production-process-detail-table th, .production-process-detail-table td { padding: 7px 8px; }
.production-process-detail-table th:nth-child(1), .production-process-detail-table td:nth-child(1) { text-align: left; }
.production-process-detail-table th:nth-child(2), .production-process-detail-table td:nth-child(2),
.production-process-detail-table th:nth-child(3), .production-process-detail-table td:nth-child(3) { width: 92px; text-align: center; }
.production-process-detail-table thead th { position: sticky; top: 0; z-index: 2; background: #f3f3ed; }
.po-product-scope-table th:nth-child(3), .po-product-scope-table td:nth-child(3) { width: 180px; text-align: center; }
.po-product-scope-table th:nth-child(4), .po-product-scope-table td:nth-child(4) { width: 130px; text-align: center; }
.po-product-scope-toggle { display: inline-flex; align-items: center; gap: 8px; padding: 0; border: 0; background: transparent; color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.po-product-scope-toggle.product-name-toggle { font-weight: 800; }
.po-product-scope-toggle:hover, .po-product-scope-toggle:focus-visible { color: var(--lime-dark); }
.po-product-scope-chevron { display: inline-block; color: var(--lime-dark); font-size: 14px; transition: transform .16s ease; }
.po-product-scope-toggle[aria-expanded="true"] .po-product-scope-chevron { transform: rotate(180deg); }
.po-product-detail-row > td { padding: 0 12px 12px; background: #fafaf7; }
.po-product-detail-panel { padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: white; }
.po-product-detail-panel > p { margin: 0 0 9px; font-size: 10px; }
.po-product-detail-panel table { min-width: 0; }
.po-product-detail-panel th, .po-product-detail-panel td { padding: 7px 9px; }
.po-product-detail-panel th:nth-child(2), .po-product-detail-panel td:nth-child(2),
.po-product-detail-panel th:nth-child(3), .po-product-detail-panel td:nth-child(3) { width: 110px; text-align: center; }
.compact-definition-list { display: grid; gap: 0; margin: 0; }
.compact-definition-list > div { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-top: 1px solid var(--line); }
.compact-definition-list dt { color: var(--muted); font-size: 9px; }
.compact-definition-list dd { margin: 0; text-align: right; font-size: 10px; font-weight: 800; }
.cmt-mini-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 16px; }
.cmt-mini-grid div { padding: 11px; border: 1px solid var(--line); border-radius: 9px; background: #fafaf7; }
.cmt-mini-grid span, .cmt-mini-grid strong { display: block; }
.cmt-mini-grid span { color: var(--muted); font-size: 8px; text-transform: uppercase; }
.cmt-mini-grid strong { margin-top: 6px; font-size: 17px; }
.production-audit-wrap { max-height: 600px; overflow: auto; }
.production-audit-wrap thead th { position: sticky; top: 0; z-index: 2; background: #f3f3ed; }
.production-monitor-table { min-width: 1520px; }
.production-monitor-table td > small, .production-monitor-table td > strong { display: block; }
.production-monitor-table td > small { margin-top: 4px; color: var(--muted); font-size: 8px; }
.state-done { color: var(--lime-dark); }
.production-activity-layout { grid-template-columns: minmax(260px, .7fr) repeat(2, minmax(0, 1fr)); }
.activity-choice-list { display: grid; gap: 8px; margin: 14px 0; }
.activity-choice { padding: 10px 12px; border: 1px solid #d6e79c; border-radius: 9px; color: #4e650b; background: #f3f9dd; font-size: 10px; font-weight: 800; }
.production-activity-form-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; margin-bottom: 15px; }
.production-activity-form-grid > div { display: grid; gap: 7px; }
.production-activity-form-grid .wide { grid-column: 1 / -1; }
.production-activity-form-grid [hidden] { display: none; }
.production-line-entry-wrap { max-height: 430px; border: 1px solid var(--line); border-radius: 12px; }
.production-line-entry-table { min-width: 620px; table-layout: fixed; }
.production-line-entry-table thead th { position: sticky; top: 0; z-index: 2; background: #f3f3ed; }
.production-line-entry-table th { padding: 7px 8px; }
.production-line-entry-table td { padding: 3px 8px; line-height: 1.15; }
.production-line-entry-table th:nth-child(1), .production-line-entry-table td:nth-child(1) { text-align: left; }
.production-line-entry-table th:nth-child(2), .production-line-entry-table td:nth-child(2) { width: 65px; text-align: center; }
.production-line-entry-table th:nth-child(3), .production-line-entry-table td:nth-child(3) { width: 95px; text-align: center; }
.production-line-entry-table th:nth-child(4), .production-line-entry-table td:nth-child(4) { width: 95px; text-align: center; }
.production-line-entry-table th:nth-child(5), .production-line-entry-table td:nth-child(5) { width: 75px; text-align: center; }
.production-line-entry-table input { width: 75px; min-height: 28px; padding: 3px 6px; text-align: center; }
.production-line-static-qty { color: var(--ink); font-size: 10px; font-weight: 850; line-height: 1.15; }
.delivery-order-queue-table { min-width: 900px; }
.delivery-order-queue-table > thead > tr > th:last-child,
.delivery-order-queue-table > tbody > tr:not(.delivery-order-detail-row) > td:last-child { width: 100px; text-align: right; }
.delivery-order-toggle { padding: 0; border: 0; background: transparent; cursor: pointer; }
.delivery-order-detail-row[hidden] { display: none; }
.delivery-order-detail-row > td { padding: 0; background: #fafaf7; }
.delivery-order-detail { padding: 16px; }
.delivery-order-product-table { min-width: 1120px; }
.delivery-order-product-table input, .delivery-order-product-table select { width: 100%; min-height: 34px; padding: 6px 7px; border: 1px solid var(--line); border-radius: 7px; background: white; color: var(--ink); }
.delivery-order-product-table th:nth-child(1) { width: 105px; }
.delivery-order-product-table th:nth-child(2) { width: 180px; }
.delivery-order-product-table th:nth-child(3) { width: 65px; }
.delivery-order-product-table th:nth-child(4) { width: 105px; }
.delivery-order-product-table th:nth-child(5) { width: 120px; }
.delivery-order-product-table th:nth-child(6) { width: 150px; }
.delivery-order-product-table th:nth-child(7) { width: 145px; }
.delivery-order-product-table th:nth-child(8) { width: 105px; }
.delivery-order-product-table th:nth-child(9) { width: 85px; }
.delivery-receive-error-row td { padding: 8px 12px; background: #fff7f6; }
.primary-button:disabled, .secondary-button:disabled { color: #96978f; background: #e7e7e1; border-color: #e1e1dc; cursor: not-allowed; opacity: .8; }

@media (max-width: 1080px) {
    .metric-grid.five, .metric-grid.six { grid-template-columns: repeat(3, 1fr); }
    .dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .panel.span-three { grid-column: 1 / -1; }
    .upload-layout { grid-template-columns: 1fr; }
    .module-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .inventory-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .scenario-edit-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .production-roadmap { grid-template-columns: repeat(4, minmax(0, 1fr)); row-gap: 22px; }
    .production-plan-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .production-activity-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
    .po-confirmation-grid { grid-template-columns: 1fr; }
    .po-confirmation-grid .po-notes-field { grid-column: auto; }
    .app-shell { display: block; }
    .sidebar { position: static; width: 100%; height: auto; padding: 18px; }
    .navigation { display: grid; grid-template-columns: 1fr 1fr; margin-top: 22px; }
    .nav-label, .nav-item.disabled { display: none; }
    .sidebar-footer { margin-top: 16px; }
    .main-content { padding: 30px 18px 54px; }
    .page-header { flex-direction: column; }
    .metric-grid, .metric-grid.five, .metric-grid.six, .dashboard-grid { grid-template-columns: 1fr 1fr; }
    .panel.span-two, .panel.span-three { grid-column: 1 / -1; }
    .dashboard-sales-grid .trend-panel, .dashboard-sales-grid .monthly-sales-panel { grid-column: 1 / -1; }
    .dashboard-sales-grid .trend-panel { grid-row: auto; }
    .auth-layout { grid-template-columns: 1fr; }
    .scenario-row, .scenario-edit-form { grid-template-columns: 1fr; }
  .auth-story { min-height: 580px; padding: 34px 24px; background-position: center 36%; }
    .auth-story h1 { font-size: 43px; }
    .auth-panel { padding: 24px 16px; }
    .quality-grid { grid-template-columns: 1fr 1fr; }
    .guide-flow { grid-template-columns: 1fr; }
    .filter-field { width: 100%; }
    .module-topbar { height: 76px; padding: 0 18px; }
    .module-brand { width: 104px; }
    .module-brand .brand-logo { width: 104px; }
    .module-space-brand { width: 178px; }
    .module-space-wordmark { margin-bottom: 5px; font-size: 20px; }
    .module-space-tagline { font-size: 4.7px; letter-spacing: .06em; }
    .module-user-copy { display: none; }
    .module-hub { width: min(100% - 32px, 680px); padding-top: 48px; }
    .module-hero { align-items: flex-start; flex-direction: column; gap: 24px; }
    .module-hero h1 { font-size: 54px; }
    .module-hero-note { width: 100%; }
    .module-grid { grid-template-columns: 1fr; }
    .module-card { min-height: 290px; }
    .module-footer { flex-direction: column; padding: 12px 18px 24px; }
    .source-exception-banner { align-items: flex-start; flex-direction: column; }
    .projection-filter-top { display: grid; grid-template-columns: 1fr; }
    .inventory-filter-grid { grid-template-columns: 1fr; }
    .inventory-filter-grid .inventory-search-field { grid-column: auto; }
    .production-stage-grid { grid-template-columns: 1fr; }
    .production-stage-card:last-child { grid-column: auto; }
    .production-roadmap { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .production-stage-form, .trial-summary { grid-template-columns: 1fr; }
    .trial-overview-grid.has-monitoring, .trial-workflow-forms { grid-template-columns: 1fr; }
    .trial-target-form .trial-date-field { grid-column: 1; grid-row: 1; }
    .trial-target-form > .secondary-button { grid-column: 1; grid-row: 2; }
    .trial-approved-date-field { grid-column: 1; grid-row: 3; }
    .trial-submit-form > .primary-button { grid-column: 1; grid-row: 4; }
    .trial-notes-field { grid-column: 1; grid-row: 5; }
    .trial-note-form > .secondary-button { grid-column: 1; grid-row: 6; }
    .cmt-quantity-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .trial-summary .span-two { grid-column: auto; }
    .production-plan-selector, .production-plan-grid, .production-monitor-card-grid, .production-activity-form-grid { grid-template-columns: 1fr; }
    .production-plan-field.full, .production-plan-field.wide, .production-activity-form-grid .wide { grid-column: auto; }
    .production-plan-pair { grid-column: auto; }
    .production-activity-layout { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .metric-grid, .metric-grid.five, .metric-grid.six, .dashboard-grid { grid-template-columns: 1fr; }
    .panel.span-two, .panel.span-three { grid-column: auto; }
}
