:root {
  color-scheme: light;
  --ink:#17211b;
  --muted:#68746c;
  --line:#dfe5df;
  --paper:#f4f6f2;
  --surface:#fff;
  --green:#225b42;
  --green-2:#347855;
  --lime:#dcebdc;
  --red:#a43f34;
  --red-bg:#fff0ed;
  --amber:#8b6119;
  --amber-bg:#fff7df;
  --blue:#315f7a;
  --shadow:0 5px 22px rgba(25,45,32,.045);
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font:15px/1.48 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; }
a { color:inherit; }
button,input,textarea,select { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
.skip-link { position:fixed; z-index:200; top:8px; left:8px; padding:9px 13px; background:var(--ink); color:#fff; border-radius:8px; transform:translateY(-150%); }
.skip-link:focus { transform:none; }

.topbar { position:sticky; z-index:60; top:0; min-height:66px; padding:0 3.2vw; display:flex; align-items:center; gap:30px; background:rgba(255,255,255,.96); border-bottom:1px solid var(--line); backdrop-filter:blur(12px); }
.brand { flex:0 0 auto; font-size:20px; font-weight:850; text-decoration:none; letter-spacing:-.035em; }
.brand span { color:var(--green); }
.desktop-nav { display:flex; align-self:stretch; align-items:center; gap:17px; }
.desktop-nav a { position:relative; display:flex; align-items:center; height:100%; color:#526057; font-size:13px; font-weight:620; text-decoration:none; white-space:nowrap; }
.desktop-nav a:hover,.desktop-nav a.active { color:var(--green); }
.desktop-nav a.active::after { position:absolute; right:0; bottom:-1px; left:0; height:3px; border-radius:3px 3px 0 0; background:var(--green); content:""; }
.logout { margin-left:auto; display:flex; flex:0 0 auto; align-items:center; gap:13px; color:var(--muted); font-size:13px; }
.link-button { border:0; background:none; color:var(--green); cursor:pointer; padding:0; }
.mobile-nav { display:none; margin-left:auto; position:relative; }
.mobile-nav summary { list-style:none; cursor:pointer; padding:8px 11px; border:1px solid var(--line); border-radius:9px; color:var(--green); font-weight:700; }
.mobile-nav summary::-webkit-details-marker { display:none; }
.mobile-nav nav { position:absolute; top:44px; right:0; width:230px; padding:9px; display:grid; background:#fff; border:1px solid var(--line); border-radius:12px; box-shadow:0 16px 40px rgba(20,35,25,.18); }
.mobile-nav nav a { padding:10px 11px; border-radius:7px; text-decoration:none; color:#405047; }
.mobile-nav nav a:hover { background:var(--paper); color:var(--green); }

.page { width:min(1520px,93vw); margin:0 auto; padding:36px 0 64px; }
.page-head { display:flex; justify-content:space-between; gap:26px; align-items:flex-end; margin-bottom:23px; }
h1 { margin:.15rem 0 0; font-size:clamp(29px,3.5vw,47px); letter-spacing:-.045em; line-height:1.04; }
h2 { margin:0 0 17px; font-size:20px; line-height:1.25; letter-spacing:-.015em; }
.eyebrow { margin:0; color:var(--green); font-size:12px; font-weight:850; letter-spacing:.12em; text-transform:uppercase; }
.muted,.freshness,small { color:var(--muted); }
.freshness { max-width:600px; font-size:13px; text-align:right; }
.block { display:block; margin-top:4px; }

.cards { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:13px; margin-bottom:14px; }
.cards-five { grid-template-columns:repeat(5,minmax(0,1fr)); }
.metric,.panel,.login-card { background:var(--surface); border:1px solid var(--line); border-radius:16px; box-shadow:var(--shadow); }
.metric { min-height:142px; padding:19px; display:flex; flex-direction:column; }
.metric>span { color:var(--muted); font-size:13px; }
.metric strong { margin:auto 0 0; font-size:30px; line-height:1; letter-spacing:-.045em; }
.metric small { margin-top:7px; }
.metric.danger strong,.negative { color:var(--red); }
.metric.warning strong { color:var(--amber); }
.metric.opportunity strong,.positive { color:var(--green); }
.panel { padding:21px; overflow:hidden; }
.grid-two { display:grid; grid-template-columns:1fr 1.55fr; gap:14px; }
.dashboard-main { grid-template-columns:1.45fr 1fr; margin:14px 0; }
.dashboard-lower { margin-top:14px; grid-template-columns:1.15fr 1fr; }
.panel-head { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; }
.panel-head a,.panel-action { color:var(--green); font-weight:650; text-decoration:none; white-space:nowrap; }
.counter { min-width:28px; padding:3px 8px; border-radius:999px; background:var(--paper); color:var(--muted); text-align:center; font-weight:750; }

.notice,.alert,.success { padding:14px 16px; border-radius:12px; margin:0 0 14px; }
.notice { background:var(--amber-bg); border:1px solid #ead7a2; color:#6f511b; }
.notice a { color:#5c4317; font-weight:750; }
.alert { background:var(--red-bg); border:1px solid #efcbc5; color:var(--red); }
.success { background:#e2f3e5; border:1px solid #c8e6cf; color:var(--green); }
.confidence-note { font-size:13px; }
.empty { color:var(--muted); padding:24px 0; }
.empty-state { min-height:150px; padding:28px; display:grid; place-content:center; gap:5px; text-align:center; color:var(--muted); }
.empty-state b { color:var(--ink); font-size:17px; }
.good-state b { color:var(--green); }

table { width:100%; border-collapse:collapse; }
th,td { padding:11px 12px; text-align:left; border-bottom:1px solid var(--line); vertical-align:top; }
th { color:var(--muted); font-size:11px; font-weight:780; text-transform:uppercase; letter-spacing:.055em; white-space:nowrap; }
tbody tr:last-child td { border-bottom:0; }
tbody tr:hover { background:#fafcf9; }
.table-wrap { overflow:auto; scrollbar-width:thin; }
.table-wrap>h2 { position:sticky; left:0; }
.why { min-width:300px; max-width:560px; }
.catalog-table,.plan-table,.risk-table,.shipment-table { font-size:13px; }
.risk-table { min-width:1380px; }
.shipment-table { min-width:1280px; }
.plan-table { min-width:1420px; }
.sewing-table { min-width:1150px; }
.catalog-table { min-width:1050px; }
.history-table { min-width:850px; }
.cluster-table { min-width:760px; }

.badge { display:inline-block; max-width:620px; padding:4px 8px; border-radius:8px; background:#edf1ed; font-size:12px; font-weight:750; }
.badge.ok,.sev-2,.flag-need,.conf-high { background:#e2f3e5; color:var(--green); }
.badge.warn,.sev-0,.sev-1,.flag-stuck { background:var(--red-bg); color:var(--red); }
.sev-3,.sev-4,.flag-covered,.conf-low { background:#eef0ee; color:#5c665f; }
.flag-neigh,.conf-medium,.flag-disabled { background:var(--amber-bg); color:#72531a; }
.urgent-label { color:var(--red); font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.06em; }
.sev-row-0 { background:#fffaf9; }
.sev-row-1 { background:#fffdf7; }

.decision-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin:0 0 14px; }
.decision-card { position:relative; min-height:238px; padding:21px; display:flex; flex-direction:column; overflow:visible; border:1px solid var(--line); border-radius:17px; background:#fff; box-shadow:var(--shadow); text-decoration:none; transition:transform .15s ease,box-shadow .15s ease; }
.decision-card:hover { transform:translateY(-2px); box-shadow:0 12px 30px rgba(25,45,32,.09); }
.decision-card::before { position:absolute; top:0; right:0; left:0; height:4px; background:#aeb9b0; content:""; }
.decision-card.danger-card::before { background:var(--red); }
.decision-card.warning-card::before,.decision-card.needs-input::before { background:#d59a32; }
.decision-card.ok-card::before { background:#4a9667; }
.decision-card.opportunity-card::before { background:#4d7e9b; }
.decision-step { color:var(--muted); font-size:11px; font-weight:850; letter-spacing:.09em; text-transform:uppercase; }
.decision-card h2 { margin:15px 0 12px; }
.decision-card>strong { margin-top:auto; font-size:25px; line-height:1.1; letter-spacing:-.035em; }
.decision-card p { min-height:42px; margin:8px 0 16px; color:var(--muted); font-size:13px; }
.card-link { color:var(--green); font-weight:750; font-size:13px; }

.alert-list { display:grid; gap:8px; }
.alert-item { display:grid; grid-template-columns:7px 1fr; gap:12px; padding:12px; border:1px solid var(--line); border-radius:11px; text-decoration:none; background:#fff; }
.alert-item:hover { border-color:#b8c7bb; }
.alert-mark { width:7px; min-height:100%; border-radius:8px; background:#d39b36; }
.alert-danger .alert-mark { background:var(--red); }
.alert-item>span:last-child { display:grid; gap:3px; }
.alert-item small { display:block; }
.alert-item em { color:var(--green); font-size:12px; font-style:normal; font-weight:750; }
.data-checks { display:grid; gap:0; }
.data-checks>div { display:grid; grid-template-columns:12px 1fr; gap:11px; align-items:start; padding:11px 0; border-bottom:1px solid var(--line); }
.data-checks>div:last-child { border-bottom:0; }
.data-checks b,.data-checks small { display:block; }
.data-checks .dot { margin-top:6px; }
.data-panel .panel-action { display:inline-block; margin-top:16px; }
.dashboard-table { margin-top:14px; }

.dot { display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:4px; background:#a4ada6; }
.dot.good { background:#3a9a61; }
.dot.bad { background:#d05b4d; }
.dot.warn { background:#d39b36; }

.workflow { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:14px; }
.workflow>a,.workflow>div { min-height:76px; padding:14px 16px; display:grid; gap:4px; align-content:center; border:1px solid var(--line); border-radius:12px; background:#fff; text-decoration:none; }
.workflow span { color:var(--muted); font-size:12px; }
.decision { display:inline-block; padding:6px 9px; border-radius:8px; background:#edf1ed; color:#465249; font-size:11px; font-weight:820; line-height:1.35; text-transform:uppercase; letter-spacing:.025em; }
.decision-go,.flag-need { background:#e2f3e5; color:var(--green); }
.decision-stop,.flag-stuck { background:var(--red-bg); color:var(--red); }
.decision-wait,.flag-neigh,.flag-disabled { background:var(--amber-bg); color:#72531a; }
.decision-ok,.flag-covered { background:#edf1ed; color:#546058; }

.filters { margin-bottom:14px; display:flex; align-items:flex-end; justify-content:space-between; gap:18px; overflow:visible; }
.compact-filters { justify-content:flex-start; }
.tabs { display:flex; gap:5px; padding:4px; border-radius:10px; background:var(--paper); }
.tabs a { padding:8px 12px; border-radius:7px; color:var(--muted); font-size:13px; font-weight:720; text-decoration:none; white-space:nowrap; }
.tabs a.active { background:#fff; color:var(--green); box-shadow:0 1px 5px rgba(20,35,25,.08); }
.filter-form { display:flex; align-items:flex-end; gap:9px; }
.filter-form label,.settings-form label { display:grid; gap:6px; }
.filter-form label>span,.field-label { color:#4f5c53; font-size:13px; font-weight:680; }
.clear-filter { padding:9px 4px; color:var(--green); font-size:13px; }
.secondary { min-height:41px; padding:9px 14px; border:1px solid #bfcac1; border-radius:9px; background:#fff; color:var(--green); font-weight:720; cursor:pointer; }
.primary { border:0; border-radius:9px; background:var(--green); color:#fff; padding:12px 18px; font-weight:750; cursor:pointer; }
.primary:hover { background:#194a34; }

input,textarea,select { width:100%; padding:10px 11px; border:1px solid #cbd4cc; border-radius:8px; background:#fff; color:var(--ink); }
input:focus,textarea:focus,select:focus { border-color:#6d9b7c; outline:3px solid rgba(60,130,83,.12); }
input:disabled,textarea:disabled,select:disabled { background:#f2f4f1; color:#69736c; }
textarea { line-height:1.45; resize:vertical; }
.form-actions { position:sticky; left:0; display:flex; justify-content:flex-end; padding:18px 0 0; }
.catalog-form { padding-bottom:20px; }
.catalog-table input { min-width:105px; }
.catalog-product { min-width:300px; }
.catalog-product strong,.catalog-product small { display:block; }
.catalog-product small { margin-top:4px; }
.catalog-tags { display:flex; flex-wrap:wrap; gap:5px; margin-top:8px; }
.catalog-tags .badge { padding:3px 6px; font-size:10px; }
.settings-form { display:grid; grid-template-columns:minmax(0,1fr); gap:14px; }
.settings-form>* { min-width:0; }
.settings-section { min-width:0; overflow:visible; }
.settings-grid { display:grid; grid-template-columns:repeat(4,minmax(170px,1fr)); gap:16px; }
.settings-lower { grid-template-columns:1.1fr 1fr; }
.settings-lower label+label { margin-top:15px; }
.section-intro { margin:-7px 0 15px; color:var(--muted); font-size:13px; }
.cluster-table input,.cluster-table select { min-width:105px; }
.cluster-table td:first-child { min-width:280px; }

.login-card { width:min(440px,100%); margin:7vh auto 0; padding:34px; }
.login-card h1 { font-size:34px; }
.stack { display:grid; gap:16px; margin-top:28px; }
.stack label { display:grid; gap:7px; font-weight:650; }
.history-filter { margin-bottom:14px; }
.inline-form { display:flex; align-items:flex-end; gap:14px; flex-wrap:wrap; }
.inline-form label { display:grid; gap:6px; color:var(--muted); }
.input-suffix { display:flex; align-items:center; gap:8px; }
.input-suffix input { width:90px; }

.row-details { margin-top:8px; color:var(--muted); font-size:12px; }
.row-details summary { color:var(--green); cursor:pointer; font-weight:700; }
.row-details span { display:block; margin-top:3px; }
code { background:#eef1ed; padding:2px 5px; border-radius:5px; }

.field-label { display:inline-flex; align-items:center; gap:4px; }
.field-help { position:relative; display:inline-flex; align-items:center; justify-content:center; margin-left:3px; vertical-align:middle; color:var(--green); cursor:help; text-transform:none; letter-spacing:normal; }
.field-help__icon { display:grid; place-items:center; width:17px; height:17px; border:1px solid #a9b8ad; border-radius:50%; background:#f8faf8; color:var(--green); font:800 11px/1 ui-sans-serif,system-ui,sans-serif; }
.field-help__bubble { position:absolute; z-index:100; top:calc(100% + 8px); left:50%; width:max-content; max-width:min(330px,calc(100vw - 32px)); padding:10px 12px; border-radius:10px; background:#17211b; color:#fff; box-shadow:0 9px 28px rgba(18,32,23,.24); font:12px/1.35 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; text-align:left; text-transform:none; letter-spacing:normal; white-space:normal; visibility:hidden; opacity:0; pointer-events:none; transform:translate(-50%,-3px); transition:opacity .12s ease,transform .12s ease; }
.field-help__bubble>span { display:block; color:#fff; }
.field-help__bubble>span+span { margin-top:4px; }
.field-help__bubble b { color:#bfe2ca; }
.field-help:hover .field-help__bubble,.field-help:focus .field-help__bubble,.field-help:focus-within .field-help__bubble { visibility:visible; opacity:1; transform:translate(-50%,0); }
.field-help:focus-visible { outline:2px solid #6ba77d; outline-offset:2px; border-radius:50%; }
th:first-child .field-help__bubble { left:0; transform:translate(0,-3px); }
th:first-child .field-help:hover .field-help__bubble,th:first-child .field-help:focus .field-help__bubble { transform:translate(0,0); }
th:last-child .field-help__bubble { right:0; left:auto; transform:translate(0,-3px); }
th:last-child .field-help:hover .field-help__bubble,th:last-child .field-help:focus .field-help__bubble { transform:translate(0,0); }

@media (max-width:1280px) {
  .desktop-nav { gap:12px; }
  .desktop-nav a { font-size:12px; }
  .cards-five { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .decision-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .settings-grid { grid-template-columns:repeat(3,minmax(170px,1fr)); }
}

@media (max-width:1080px) {
  .desktop-nav { display:none; }
  .mobile-nav { display:block; }
  .logout { margin-left:0; }
  .cards { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .grid-two,.dashboard-main,.dashboard-lower,.settings-lower { grid-template-columns:minmax(0,1fr); }
  .settings-grid { grid-template-columns:repeat(2,minmax(170px,1fr)); }
  .page-head { align-items:flex-start; }
  .field-help__bubble { right:-8px; left:auto; transform:translate(0,-3px); }
  .field-help:hover .field-help__bubble,.field-help:focus .field-help__bubble,.field-help:focus-within .field-help__bubble { transform:translate(0,0); }
}

@media (max-width:700px) {
  .topbar { padding:0 16px; gap:12px; }
  .logout span { display:none; }
  .page { width:calc(100% - 26px); padding-top:24px; }
  .page-head { display:block; }
  .freshness { margin-top:11px; text-align:left; }
  .cards,.cards-five,.decision-grid,.workflow,.settings-grid { grid-template-columns:1fr; }
  .metric { min-height:126px; }
  .decision-card { min-height:220px; }
  .filters { align-items:stretch; flex-direction:column; }
  .filter-form { align-items:stretch; flex-wrap:wrap; }
  .filter-form label { flex:1 0 100%; }
  .tabs { overflow:auto; }
  .panel { padding:16px; }
  .login-card { margin-top:3vh; padding:24px; }
  .form-actions { justify-content:stretch; }
  .form-actions .primary { width:100%; }
  .field-help__bubble { right:-8px; left:auto; max-width:min(290px,calc(100vw - 36px)); transform:translate(0,-3px); }
  .field-help:hover .field-help__bubble,.field-help:focus .field-help__bubble,.field-help:focus-within .field-help__bubble { transform:translate(0,0); }
}
