:root {
  --ink: #172033;
  --muted: #6f788a;
  --line: #e7eaf0;
  --surface: #ffffff;
  --canvas: #f4f6fa;
  --navy: #121a2d;
  --accent: #6f52ed;
  --accent-dark: #5840ca;
  --accent-soft: #f0edff;
  --green: #21a875;
  --green-soft: #e8f8f1;
  --amber: #db8a14;
  --amber-soft: #fff5df;
  --red: #df5261;
  --red-soft: #ffedf0;
  --shadow: 0 12px 35px rgba(27, 36, 58, 0.07);
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--canvas); }
body { margin: 0; color: var(--ink); background: var(--canvas); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
.svg-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 244px minmax(0, 1fr); }
.sidebar { position: sticky; top: 0; height: 100vh; padding: 28px 18px 22px; display: flex; flex-direction: column; color: #fff; background: var(--navy); }
.brand { display: flex; gap: 12px; align-items: center; padding: 0 10px 34px; }
.brand-mark { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; font-weight: 900; font-size: 19px; color: #fff; background: linear-gradient(145deg, #8a6cff, #5b3bd5); box-shadow: 0 8px 20px rgba(111, 82, 237, .35); }
.brand strong, .brand small { display: block; }
.brand strong { font-size: 18px; letter-spacing: -.4px; }
.brand small { color: #929bb0; font-size: 9px; letter-spacing: 1.9px; margin-top: 2px; }
.nav { min-height: 0; flex: 1; display: grid; align-content: start; gap: 8px; overflow-y: auto; scrollbar-width: thin; }
.nav-item { border: 0; background: transparent; color: #9ca5ba; min-height: 46px; border-radius: 11px; padding: 0 13px; display: flex; align-items: center; gap: 12px; cursor: pointer; text-align: left; transition: .2s ease; }
.nav-item:hover { color: #fff; background: rgba(255,255,255,.06); }
.nav-item.active { color: #fff; background: rgba(130, 103, 255, .17); }
.nav-item.active svg { color: #9983ff; }
.nav-item b { margin-left: auto; min-width: 24px; padding: 3px 6px; border-radius: 10px; font-size: 11px; text-align: center; background: rgba(255,255,255,.08); }
.integration-button { width: 100%; min-height: 45px; margin: 10px 0 8px; padding: 0 11px; display: flex; align-items: center; gap: 10px; border: 1px solid rgba(255,255,255,.09); border-radius: 11px; color: #aeb7c9; background: rgba(255,255,255,.045); cursor: pointer; }
.integration-button:hover { color: #fff; border-color: rgba(255,71,111,.48); background: rgba(255,71,111,.1); }
.integration-button > span:not(.integration-tiktok-mark) { font-size: 12px; font-weight: 750; }
.integration-button small { margin-left: auto; color: #818da4; font-size: 9px; }
.integration-tiktok-mark { width: 20px; color: #fff; font-size: 20px; font-weight: 900; text-align: center; text-shadow: -1px 0 #22d3d6, 1px 1px #ff476f; }
.appearance-control { position: relative; margin-top: auto; }
.appearance-button { width: 100%; min-height: 45px; padding: 0 11px; display: flex; align-items: center; gap: 10px; border: 1px solid rgba(255,255,255,.09); border-radius: 11px; color: #aeb7c9; background: rgba(255,255,255,.045); cursor: pointer; transition: .18s ease; }
.appearance-button:hover, .appearance-control.open .appearance-button { color: #fff; border-color: rgba(153,131,255,.42); background: rgba(130,103,255,.14); }
.appearance-button span { font-size: 12px; font-weight: 750; }
.appearance-button small { margin-left: auto; color: #818da4; font-size: 10px; }
.appearance-main-icon { width: 17px; color: #a994ff; }
.appearance-chevron { width: 13px; transform: rotate(-90deg); transition: .18s ease; }
.appearance-control.open .appearance-chevron { transform: rotate(90deg); }
.theme-menu { position: absolute; z-index: 80; left: 0; right: 0; bottom: calc(100% + 9px); padding: 7px; border: 1px solid #343d50; border-radius: 13px; background: #182033; box-shadow: 0 18px 45px rgba(4,8,18,.34); animation: themeMenuIn .16s ease; }
.theme-menu[hidden] { display: none; }
.theme-menu > button { width: 100%; min-height: 52px; padding: 8px 9px; display: flex; align-items: center; gap: 10px; border: 0; border-radius: 9px; color: #aeb7c9; text-align: left; background: transparent; cursor: pointer; }
.theme-menu > button:hover, .theme-menu > button.active { color: #fff; background: rgba(130,103,255,.16); }
.theme-menu > button > svg { width: 17px; color: #a994ff; }
.theme-menu > button span { min-width: 0; flex: 1; }
.theme-menu strong, .theme-menu small { display: block; }
.theme-menu strong { font-size: 12px; }
.theme-menu small { margin-top: 2px; color: #7f8aa0; font-size: 10px; }
.theme-menu i { width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%; color: transparent; background: rgba(255,255,255,.06); }
.theme-menu i svg { width: 12px; }
.theme-menu > button.active i { color: #fff; background: var(--accent); }
@keyframes themeMenuIn { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: none; } }
.sidebar-note { margin-top: 12px; display: flex; gap: 10px; align-items: center; border-top: 1px solid rgba(255,255,255,.08); padding: 18px 8px 0; }
.sidebar-note strong, .sidebar-note small { display: block; }
.sidebar-note strong { font-size: 12px; }
.sidebar-note small { color: #8791a8; font-size: 10px; margin-top: 3px; }
.pulse { position: relative; width: 8px; height: 8px; border-radius: 50%; background: #43d79a; box-shadow: 0 0 0 5px rgba(67,215,154,.12); }

main { min-width: 0; }
.topbar { height: 98px; padding: 0 36px; display: flex; align-items: center; justify-content: space-between; background: rgba(255,255,255,.88); border-bottom: 1px solid var(--line); backdrop-filter: blur(12px); }
.eyebrow { margin: 0 0 4px; color: var(--muted); font-weight: 600; font-size: 11px; letter-spacing: .7px; text-transform: uppercase; }
.topbar h1 { margin: 0; font-size: 24px; letter-spacing: -.6px; }
.primary-button, .secondary-button, .ghost-button, .danger-button { border: 0; border-radius: 10px; min-height: 42px; padding: 0 16px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-size: 13px; font-weight: 750; cursor: pointer; transition: .18s ease; }
.primary-button { color: #fff; background: var(--accent); box-shadow: 0 8px 18px rgba(111,82,237,.22); }
.primary-button:hover { background: var(--accent-dark); transform: translateY(-1px); }
.secondary-button { color: var(--accent); background: var(--accent-soft); }
.secondary-button:hover { background: #e8e2ff; }
.ghost-button { color: #5d6678; background: #f2f4f7; border: 1px solid #e8ebf0; }
.ghost-button:hover { color: var(--ink); background: #eceff4; }
.danger-button { color: #fff; background: var(--red); }
.content { padding: 30px 36px 48px; max-width: 1600px; margin: 0 auto; }
.view { display: none; }
.view.active { display: block; animation: fade .25s ease; }
@keyframes fade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

.welcome-card { min-height: 158px; padding: 29px 34px; border-radius: 18px; color: #fff; display: flex; align-items: center; justify-content: space-between; overflow: hidden; background: linear-gradient(115deg, #182238, #202b47 68%, #26324f); box-shadow: var(--shadow); }
.welcome-card .tag { color: #aa9bff; }
.welcome-card h2 { margin: 9px 0 7px; font-size: 26px; letter-spacing: -.7px; }
.welcome-card p { margin: 0; color: #aeb6c9; font-size: 14px; }
.tag { color: var(--accent); font-size: 9px; font-weight: 900; letter-spacing: 1.5px; }
.printer-art { align-self: stretch; width: 220px; position: relative; opacity: .85; }
.printer-art::before { content: ""; position: absolute; width: 180px; height: 180px; border-radius: 50%; right: -14px; top: -40px; background: radial-gradient(circle, rgba(134,103,255,.28), transparent 66%); }
.printer-frame { position: absolute; right: 35px; top: 13px; width: 110px; height: 104px; border: 8px solid rgba(255,255,255,.16); border-bottom-width: 12px; border-radius: 7px; }
.printer-frame::after { content: ""; position: absolute; left: 10px; right: 10px; top: 15px; height: 4px; background: #8064f4; box-shadow: 0 0 14px rgba(128,100,244,.8); }
.print-head { position: absolute; top: 15px; left: 42px; width: 19px; height: 27px; border-radius: 3px 3px 8px 8px; background: #979fb2; }
.printed-part { position: absolute; bottom: 8px; left: 34px; width: 38px; height: 37px; border-radius: 9px 9px 3px 3px; background: linear-gradient(#8269f5, #5d45c9); clip-path: polygon(15% 15%, 85% 15%, 100% 100%, 0 100%); }
.print-bed { position: absolute; left: 12px; bottom: 5px; width: 70px; height: 5px; border-radius: 5px; background: #afb5c4; }

.kpi-grid { margin: 20px 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }
.kpi-card { border: 1px solid var(--line); border-radius: 15px; background: var(--surface); padding: 19px; display: flex; gap: 15px; align-items: center; text-align: left; cursor: pointer; box-shadow: 0 4px 18px rgba(27,36,58,.035); transition: .18s ease; }
.kpi-card.revenue-card { cursor: default; }
.kpi-card:hover { transform: translateY(-2px); border-color: #d8dce5; box-shadow: var(--shadow); }
.kpi-icon { flex: 0 0 auto; width: 45px; height: 45px; border-radius: 13px; display: grid; place-items: center; }
.kpi-icon.amber { color: var(--amber); background: var(--amber-soft); }
.kpi-icon.violet { color: var(--accent); background: var(--accent-soft); }
.kpi-icon.green { color: var(--green); background: var(--green-soft); }
.kpi-icon.red { color: var(--red); background: var(--red-soft); }
.kpi-icon.revenue { color: #087f8c; background: #e4f6f7; }
.kpi-card small, .kpi-card strong, .kpi-card em { display: block; }
.kpi-card small { color: var(--muted); font-weight: 650; font-size: 11px; }
.kpi-card strong { font-size: 27px; letter-spacing: -.8px; line-height: 1.1; margin: 4px 0 3px; }
.revenue-card strong { font-size: 22px; white-space: nowrap; }
.kpi-card em { color: #9aa1af; font-size: 10px; font-style: normal; }

.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(280px, .75fr); gap: 20px; }
.panel { background: var(--surface); border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 6px 24px rgba(27,36,58,.04); }
.panel-header { padding: 22px 23px 18px; display: flex; align-items: center; justify-content: space-between; }
.panel-header h3 { margin: 5px 0 0; font-size: 16px; }
.text-button { padding: 7px 0; border: 0; color: var(--accent); background: transparent; font-size: 11px; font-weight: 800; display: flex; align-items: center; gap: 3px; cursor: pointer; }
.text-button svg { width: 14px; }
.queue-list { padding: 0 23px 12px; }
.queue-row { display: grid; grid-template-columns: 34px minmax(0, 1fr) 100px 104px; gap: 12px; align-items: center; padding: 14px 0; border-top: 1px solid var(--line); }
.queue-rank { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 9px; color: var(--accent); background: var(--accent-soft); font-size: 11px; font-weight: 900; }
.queue-info strong, .queue-info small { display: block; }
.queue-info strong { font-size: 12px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.queue-info small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.market-badge { justify-self: start; padding: 5px 8px; border-radius: 7px; color: #536075; background: #f1f3f7; font-size: 9px; font-weight: 800; }
.deadline { text-align: right; }
.deadline strong, .deadline small { display: block; }
.deadline strong { font-size: 11px; }
.deadline small { color: var(--muted); font-size: 9px; margin-top: 2px; }
.deadline.late strong { color: var(--red); }
.deadline.today strong { color: var(--amber); }
.channel-list { padding: 0 23px 21px; display: grid; gap: 18px; }
.channel-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 9px; align-items: center; }
.channel-meta { display: flex; justify-content: space-between; align-items: center; grid-column: 1 / -1; font-size: 11px; font-weight: 750; }
.channel-meta span:last-child { color: var(--muted); }
.channel-track { height: 7px; border-radius: 10px; overflow: hidden; background: #edf0f4; }
.channel-fill { height: 100%; border-radius: inherit; background: var(--accent); transition: width .4s ease; }

.section-intro { margin-bottom: 21px; display: flex; justify-content: space-between; align-items: end; }
.section-intro h2 { margin: 0 0 5px; font-size: 21px; letter-spacing: -.4px; }
.section-intro p { margin: 0; color: var(--muted); font-size: 12px; }
.printer-section-intro { align-items: center; }
.printer-sync-time { padding: 7px 10px; border-radius: 9px; color: var(--muted); background: #eceff4; font-size: 11px; font-weight: 750; }
.bridge-banner { margin-bottom: 17px; padding: 17px 18px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 14px; align-items: center; border: 1px solid #e0d8ff; border-radius: 15px; background: linear-gradient(145deg, #fbfaff, #f3f0ff); }
.bridge-banner.online { border-color: #bfe9d7; background: linear-gradient(145deg, #fbfffd, #ecfaf4); }
.bridge-icon { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 13px; color: var(--accent); background: #e9e4ff; }
.bridge-banner.online .bridge-icon { color: var(--green); background: var(--green-soft); }
.bridge-banner strong, .bridge-banner p { display: block; }
.bridge-banner strong { margin-bottom: 4px; font-size: 14px; }
.bridge-banner p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
.bridge-banner .primary-button { min-width: 210px; text-decoration: none; white-space: nowrap; }
.bridge-banner.online .primary-button { color: #147d59; background: var(--green-soft); box-shadow: none; }
.printer-fleet-summary { margin-bottom: 17px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.printer-fleet-summary article { min-height: 104px; padding: 16px 18px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); box-shadow: 0 4px 18px rgba(27,36,58,.035); }
.printer-fleet-summary span, .printer-fleet-summary strong, .printer-fleet-summary small { display: block; }
.printer-fleet-summary span { color: var(--muted); font-size: 11px; font-weight: 750; }
.printer-fleet-summary strong { margin: 5px 0 2px; font-size: 26px; letter-spacing: -.6px; }
.printer-fleet-summary small { color: #929aa9; font-size: 10px; }
.printer-monitor-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
.printer-monitor-card { position: relative; min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); box-shadow: 0 7px 25px rgba(27,36,58,.045); overflow: hidden; }
.printer-monitor-card::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: #a5acb8; }
.printer-monitor-card.printing::before { background: var(--accent); }
.printer-monitor-card.preparing::before { background: #238fa1; }
.printer-monitor-card.idle::before { background: var(--green); }
.printer-monitor-card.attention::before { background: var(--red); }
.printer-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.printer-card-identity { min-width: 0; display: flex; align-items: center; gap: 11px; }
.printer-card-icon { flex: 0 0 auto; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; color: #6d778a; background: #f0f2f6; }
.printer-monitor-card.printing .printer-card-icon { color: var(--accent); background: var(--accent-soft); }
.printer-monitor-card.idle .printer-card-icon { color: var(--green); background: var(--green-soft); }
.printer-monitor-card.attention .printer-card-icon { color: var(--red); background: var(--red-soft); }
.printer-card-identity strong, .printer-card-identity small { display: block; }
.printer-card-identity strong { font-size: 14px; }
.printer-card-identity small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.printer-state-badge { flex: 0 0 auto; padding: 7px 9px; display: inline-flex; align-items: center; gap: 6px; border-radius: 9px; color: #727b8b; background: #f0f2f5; font-size: 10px; font-weight: 850; }
.printer-state-badge i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.printer-monitor-card.printing .printer-state-badge { color: #5c43cb; background: var(--accent-soft); }
.printer-monitor-card.preparing .printer-state-badge { color: #147f91; background: #e5f6f8; }
.printer-monitor-card.idle .printer-state-badge { color: #147d59; background: var(--green-soft); }
.printer-monitor-card.attention .printer-state-badge { color: #bd3546; background: var(--red-soft); }
.printer-job-copy { min-width: 0; margin: 20px 0 15px; }
.printer-job-copy span, .printer-job-copy strong { display: block; }
.printer-job-copy span { color: #929aa9; font-size: 8px; font-weight: 850; letter-spacing: .8px; }
.printer-job-copy strong { margin-top: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 13px; }
.printer-progress-head { display: flex; justify-content: space-between; color: var(--muted); font-size: 10px; }
.printer-progress-head strong { color: var(--ink); font-size: 11px; }
.printer-progress-track { height: 8px; margin-top: 7px; border-radius: 10px; overflow: hidden; background: #edf0f4; }
.printer-progress-track i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #6f52ed, #9d87ff); transition: width .45s ease; }
.printer-metrics { margin-top: 16px; display: grid; grid-template-columns: 1.25fr 1fr 1fr; gap: 9px; }
.printer-metrics div { min-width: 0; padding: 10px 11px; border-radius: 10px; background: #f6f7f9; }
.printer-metrics span, .printer-metrics strong { display: block; }
.printer-metrics span { color: var(--muted); font-size: 9px; }
.printer-metrics strong { margin-top: 4px; font-size: 12px; }
.printer-error { margin: 13px 0 0; padding: 9px 10px; display: flex; align-items: center; gap: 7px; border-radius: 9px; color: #b83041; background: var(--red-soft); font-size: 10px; font-weight: 750; }
.printer-error svg { width: 14px; flex: 0 0 auto; }
.printer-monitor-card footer { margin-top: 14px; color: #9aa2b0; font-size: 9px; }
.printer-privacy-note { margin: 16px 0 0; display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 10px; }
.printer-privacy-note svg { width: 14px; color: var(--green); }
.filter-bar { display: grid; grid-template-columns: minmax(220px, 1.4fr) repeat(3, minmax(130px, .62fr)) auto; gap: 10px; align-items: end; margin-bottom: 12px; }
.filter-bar label { min-width: 0; }
.filter-bar label > span { display: block; margin: 0 0 6px 3px; color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .6px; }
.filter-bar select, .search-box, .form-grid input, .form-grid select, textarea { width: 100%; border: 1px solid #dde1e8; background: #fff; border-radius: 10px; outline: 0; transition: .18s ease; }
.filter-bar select { height: 43px; padding: 0 32px 0 11px; color: #4f596d; font-size: 11px; }
.search-box { height: 43px; padding: 0 12px; display: flex; align-items: center; gap: 8px; }
.search-box svg { color: #8f97a8; width: 16px; }
.search-box input { min-width: 0; flex: 1; border: 0; outline: 0; font-size: 12px; }
.search-box:focus-within, .filter-bar select:focus, .form-grid input:focus, .form-grid select:focus, textarea:focus { border-color: #9c8af0; box-shadow: 0 0 0 3px rgba(111,82,237,.1); }
.active-filter-note { min-height: 22px; color: var(--accent); font-size: 11px; font-weight: 700; }
.table-card { border: 1px solid var(--line); border-radius: 15px; background: #fff; overflow: hidden; box-shadow: 0 5px 22px rgba(27,36,58,.035); }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; min-width: 810px; }
th { padding: 13px 17px; text-align: left; color: #858d9c; background: #fafbfc; border-bottom: 1px solid var(--line); font-size: 9px; letter-spacing: .7px; text-transform: uppercase; }
td { padding: 14px 17px; border-bottom: 1px solid #edf0f3; font-size: 11px; vertical-align: middle; }
tbody tr { transition: background .15s ease; }
tbody tr:hover { background: #fbfbfe; }
.order-cell strong, .order-cell span, .items-cell strong, .items-cell small { display: block; }
.order-cell strong { font-size: 12px; }
.order-cell span, .items-cell small { color: var(--muted); font-size: 9px; margin-top: 3px; }
.items-cell { max-width: 280px; }
.items-cell strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.qty-badge { display: inline-grid; min-width: 28px; height: 28px; place-items: center; border-radius: 8px; color: var(--accent); background: var(--accent-soft); font-weight: 900; }
.status-select { border: 0; padding: 7px 25px 7px 9px; border-radius: 9px; font-weight: 800; font-size: 10px; outline: none; cursor: pointer; }
.status-select.status-pending { color: #ae6908; background: var(--amber-soft); }
.status-select.status-production { color: #5b43c2; background: var(--accent-soft); }
.status-select.status-ready { color: #167d5a; background: var(--green-soft); }
.status-select.status-done { color: #596273; background: #eef1f4; }
.row-actions { display: flex; justify-content: flex-end; gap: 5px; }
.row-action, .icon-button { width: 34px; height: 34px; border: 0; border-radius: 9px; display: grid; place-items: center; cursor: pointer; color: #7a8393; background: transparent; }
.row-action:hover, .icon-button:hover { color: var(--accent); background: var(--accent-soft); }
.row-action.delete:hover { color: var(--red); background: var(--red-soft); }
.row-action svg { width: 15px; }
.empty-state { display: none; padding: 54px 20px; text-align: center; }
.empty-state.show { display: block; }
.empty-state span { display: inline-grid; width: 48px; height: 48px; place-items: center; border-radius: 14px; color: #9aa2b1; background: #f1f3f6; font-size: 20px; }
.empty-state h3 { margin: 14px 0 5px; font-size: 14px; }
.empty-state p { margin: 0; color: var(--muted); font-size: 11px; }
.table-footer { padding: 12px 17px; display: flex; justify-content: space-between; color: #8b93a2; background: #fafbfc; font-size: 9px; }

.financial-section-intro h2 { margin-top: 5px; }
.financial-header-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.financial-import-button { cursor: pointer; }
.financial-import-button input { display: none; }
.financial-alert { margin: 0 0 14px; padding: 13px 15px; border: 1px solid #f0cf94; border-radius: 12px; color: #855510; background: #fff8e9; font-size: 12px; font-weight: 750; }
.financial-view-tabs { margin-bottom: 14px; padding: 4px; display: inline-flex; gap: 4px; border-radius: 12px; background: #e9edf3; }
.financial-view-tabs button { min-height: 38px; padding: 0 16px; border: 0; border-radius: 9px; color: #657083; background: transparent; cursor: pointer; font-size: 12px; font-weight: 800; }
.financial-view-tabs button.active { color: #fff; background: var(--accent); box-shadow: 0 5px 14px rgba(111,82,237,.2); }
.payable-entry { margin-bottom: 17px; padding: 21px 22px; border: 1px solid #d9d3f6; border-radius: 16px; background: linear-gradient(145deg, #fff, #f7f5ff); box-shadow: 0 7px 25px rgba(39,31,84,.05); }
.payable-entry-header { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.payable-entry-header h3 { margin: 5px 0 4px; font-size: 17px; }
.payable-entry-header p { margin: 0; color: var(--muted); font-size: 11px; }
.payable-preview { min-width: 190px; padding: 10px 12px; border: 1px solid #ded8f3; border-radius: 11px; text-align: right; background: #fff; }
.payable-preview span, .payable-preview strong { display: block; }
.payable-preview span { color: #81788e; font-size: 9px; font-weight: 750; }
.payable-preview strong { margin-top: 4px; color: var(--accent); font-size: 18px; }
.payable-form { margin-top: 18px; display: grid; grid-template-columns: minmax(115px,.55fr) minmax(165px,.8fr) minmax(190px,1fr) minmax(125px,.6fr); gap: 10px; align-items: end; }
.payable-form label > span { display: block; margin: 0 0 6px 2px; color: #5b6577; font-size: 10px; font-weight: 800; }
.payable-form input, .payable-form select, .money-form-input { width: 100%; height: 43px; border: 1px solid #dce1e8; border-radius: 10px; color: var(--ink); background: #fff; outline: 0; font-size: 12px; }
.payable-form input { padding: 0 11px; }
.payable-form select { padding: 0 10px; }
.payable-form input:focus, .payable-form select:focus, .money-form-input:focus-within { border-color: #9c8af0; box-shadow: 0 0 0 3px rgba(111,82,237,.1); }
.money-form-input { padding: 0 11px; display: flex; align-items: center; gap: 6px; }
.money-form-input b { color: #7d8798; font-size: 11px; }
.money-form-input input { height: 39px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none !important; }
.payable-form-actions { display: flex; justify-content: flex-end; gap: 8px; }
.payable-notes { grid-column: span 2; }
.payable-form .primary-button { min-width: 145px; }
.payable-form-error { min-height: 16px; margin: 8px 1px -4px; color: var(--red); font-size: 10px; font-weight: 750; }
.financial-summary-grid { margin-bottom: 17px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.financial-summary-grid article { min-height: 105px; padding: 16px 18px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); box-shadow: 0 4px 18px rgba(27,36,58,.035); }
.financial-summary-grid span, .financial-summary-grid strong, .financial-summary-grid small { display: block; }
.financial-summary-grid span { color: var(--muted); font-size: 11px; font-weight: 750; }
.financial-summary-grid strong { margin: 7px 0 3px; font-size: 22px; letter-spacing: -.45px; }
.financial-summary-grid small { color: #929aa9; font-size: 9px; }
.financial-summary-grid article:nth-child(2) strong { color: var(--amber); }
.financial-summary-grid article:nth-child(3) strong { color: var(--green); }
.financial-summary-grid article:nth-child(4) strong { color: var(--red); }
.cashflow-panel { margin-bottom: 17px; padding: 20px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); box-shadow: 0 6px 24px rgba(27,36,58,.04); }
.cashflow-chart { min-height: 180px; display: grid; grid-template-columns: repeat(6,minmax(95px,1fr)); gap: 12px; align-items: end; overflow-x: auto; }
.cashflow-month { min-width: 95px; text-align: center; }
.cashflow-bars { height: 112px; display: flex; align-items: end; justify-content: center; gap: 7px; }
.cashflow-bar { width: 25px; min-height: 3px; border-radius: 6px 6px 2px 2px; }
.cashflow-bar.in { background: #20a875; }
.cashflow-bar.out { background: #ef7d58; }
.cashflow-month > strong { margin-top: 7px; display: block; font-size: 11px; }
.cashflow-month > small { display: block; color: var(--muted); font-size: 9px; }
.cashflow-month.negative > strong { color: var(--red); }
.cashflow-legend { grid-column: 1 / -1; display: flex; justify-content: flex-end; gap: 14px; color: var(--muted); font-size: 10px; }
.cashflow-legend i { width: 9px; height: 9px; display: inline-block; margin-right: 5px; border-radius: 3px; }
.cashflow-empty { grid-column: 1 / -1; align-self: center; color: var(--muted); font-size: 12px; text-align: center; }
.payables-list-section { padding: 20px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); box-shadow: 0 6px 24px rgba(27,36,58,.04); }
.payables-list-header { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: 15px; }
.payables-list-header h3 { margin: 5px 0 0; font-size: 16px; }
.payables-list-header p { margin: 0; color: var(--muted); font-size: 10px; }
.payables-filters { margin: -3px 0 14px; display: flex; gap: 9px; flex-wrap: wrap; }
.payables-filters select { min-width: 180px; height: 39px; padding: 0 11px; border: 1px solid #dce1e8; border-radius: 10px; color: var(--ink); background: var(--surface); font-size: 11px; }
.payables-month-tabs { margin-bottom: 16px; padding-bottom: 3px; display: flex; gap: 7px; overflow-x: auto; scrollbar-width: thin; }
.payables-month-tabs button { min-height: 37px; padding: 0 11px; display: inline-flex; align-items: center; gap: 7px; flex: 0 0 auto; border: 1px solid #dfe3e9; border-radius: 10px; color: #697386; background: #f5f6f8; cursor: pointer; font-size: 10px; font-weight: 750; }
.payables-month-tabs button b { min-width: 21px; padding: 3px 6px; border-radius: 9px; color: #7e8795; background: #e6e9ee; text-align: center; font-size: 9px; }
.payables-month-tabs button:hover, .payables-month-tabs button.active { color: #fff; border-color: var(--accent); background: var(--accent); }
.payables-month-tabs button.active b, .payables-month-tabs button:hover b { color: #fff; background: rgba(255,255,255,.17); }
.payables-groups { display: grid; gap: 15px; }
.payables-month-group { border: 1px solid var(--line); border-radius: 13px; overflow: hidden; }
.payables-month-group > header { min-height: 58px; padding: 10px 15px; display: flex; align-items: center; justify-content: space-between; gap: 14px; background: #f7f8fa; }
.payables-month-group > header span, .payables-month-group > header small { display: block; }
.payables-month-group > header span { font-size: 13px; font-weight: 850; }
.payables-month-group > header small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.payables-month-group > header > strong { color: var(--accent); font-size: 16px; }
.payables-table-wrap { overflow-x: auto; }
.payables-table { min-width: 1180px; }
.payables-table th { padding: 11px 14px; color: #fff; background: #17486d; border-color: #2b638a; font-size: 9px; text-align: center; text-transform: none; letter-spacing: 0; }
.payables-table th:first-child, .payables-table th:nth-child(5) { text-align: left; }
.payables-table td { padding: 12px 14px; font-size: 10px; }
.payable-row.paid { background: #fbfefc; }
.payable-row.overdue { background: #fffafb; }
.payable-supplier strong { font-size: 11px; }
.payable-installment-value strong { color: var(--accent); font-size: 12px; }
.payable-number { display: inline-flex; min-width: 43px; padding: 6px 8px; justify-content: center; border-radius: 8px; color: #5944bb; background: var(--accent-soft); font-weight: 850; }
.payable-product { max-width: 280px; color: #566074; }
.payable-category { color: #6e788b; }
.payable-actions { white-space: nowrap; }
.payable-due-date strong, .payable-due-date small { display: block; white-space: nowrap; }
.payable-due-date small { margin-top: 3px; color: var(--red); font-size: 8px; font-weight: 800; }
.payable-status-button { min-width: 88px; min-height: 31px; padding: 0 9px; display: inline-flex; align-items: center; justify-content: center; gap: 5px; border: 0; border-radius: 9px; cursor: pointer; font-size: 9px; font-weight: 850; }
.payable-status-button svg { width: 12px; }
.payable-status-button.pending { color: #a7670a; background: var(--amber-soft); }
.payable-status-button.overdue { color: #b82f42; background: var(--red-soft); }
.payable-status-button.paid { color: #147c58; background: var(--green-soft); }
.financial-empty { min-height: 230px; padding: 38px 20px; display: grid; place-items: center; align-content: center; text-align: center; border: 1px dashed #d5dae2; border-radius: 13px; color: var(--muted); background: #fafbfc; }
.financial-empty > span { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 14px; color: var(--accent); background: var(--accent-soft); }
.financial-empty h3 { margin: 13px 0 5px; color: var(--ink); font-size: 14px; }
.financial-empty p { margin: 0; font-size: 10px; }
.financial-storage-note { margin: 14px 0 0; display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 10px; }
.financial-storage-note svg { width: 14px; color: var(--green); }

.profitability-intro h2 { margin-top: 5px; }
.profit-rules-card { margin-bottom: 16px; padding: 19px 21px; display: flex; align-items: center; justify-content: space-between; gap: 24px; border: 1px solid #d9d3f6; border-radius: 16px; background: linear-gradient(145deg,#fff,#f7f5ff); box-shadow: 0 7px 25px rgba(39,31,84,.05); }
.profit-rule-copy h3 { margin: 5px 0 4px; font-size: 17px; }
.profit-rule-copy p { max-width: 640px; margin: 0; color: var(--muted); font-size: 11px; }
.profit-settings { display: grid; grid-template-columns: repeat(3,105px); gap: 9px; flex: 0 0 auto; }
.profit-settings label > span { display: block; margin: 0 0 6px 2px; color: #5b6577; font-size: 10px; font-weight: 800; }
.profit-settings label > div { height: 42px; padding: 0 10px; display: flex; align-items: center; gap: 5px; border: 1px solid #dce1e8; border-radius: 10px; background: #fff; }
.profit-settings input { width: 100%; border: 0; color: var(--ink); background: transparent; outline: 0; font-size: 13px; font-weight: 750; }
.profit-settings em { color: var(--muted); font-size: 11px; font-style: normal; }
.profitability-summary-grid { margin-bottom: 16px; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
.profitability-summary-grid article { padding: 16px 18px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }
.profitability-summary-grid span,.profitability-summary-grid strong,.profitability-summary-grid small { display: block; }
.profitability-summary-grid span { color: var(--muted); font-size: 11px; font-weight: 750; }
.profitability-summary-grid strong { margin: 6px 0 3px; font-size: 22px; }
.profitability-summary-grid small { color: #929aa9; font-size: 9px; }
.profitability-summary-grid article:nth-child(3) strong { color: var(--amber); }
.profitability-summary-grid article:nth-child(4) strong { color: var(--green); }
.profitability-summary-grid article:nth-child(4) strong.negative { color: var(--red); }
.profitability-table-card { padding: 20px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); box-shadow: 0 6px 24px rgba(27,36,58,.04); }
.profitability-toolbar { margin-bottom: 15px; display: flex; align-items: end; justify-content: space-between; gap: 18px; }
.profitability-toolbar h3 { margin: 5px 0 0; font-size: 16px; }
.profitability-filters { display: flex; gap: 9px; }
.profitability-filters label > span { display: block; margin: 0 0 5px 2px; color: var(--muted); font-size: 9px; font-weight: 800; }
.profitability-filters input,.profitability-filters select { min-width: 165px; height: 39px; padding: 0 10px; border: 1px solid #dce1e8; border-radius: 9px; color: var(--ink); background: #fff; outline: 0; font-size: 11px; }
.profitability-warning { margin-bottom: 12px; padding: 11px 13px; display: none; border: 1px solid #f0cf94; border-radius: 10px; color: #855510; background: #fff8e9; font-size: 10px; font-weight: 750; }
.profitability-warning.show { display: block; }
.profitability-table-wrap { overflow-x: auto; }
.profitability-table { min-width: 1660px; }
.profitability-table th { padding: 11px 10px; color: #fff; background: #17486d; border-color: #2b638a; font-size: 9px; text-align: center; text-transform: none; letter-spacing: 0; white-space: nowrap; }
.profitability-table th:first-child,.profitability-table th:nth-child(2) { text-align: left; }
.profitability-table td { padding: 12px 10px; font-size: 10px; text-align: center; }
.profitability-table td:first-child,.profitability-table td:nth-child(2) { text-align: left; }
.profit-order strong,.profit-product strong,.profit-product small { display: block; }
.profit-order strong { font-size: 11px; }
.profit-order small,.profit-product small { margin-top: 2px; color: var(--muted); font-size: 8px; }
.profit-product { min-width: 190px; }
.profit-discount-input { width: 66px; height: 31px; padding: 0 7px; border: 1px solid #e5da75; border-radius: 8px; color: #675d00; background: #fffbd1; text-align: center; font-size: 10px; font-weight: 800; outline: 0; }
.profit-affiliate-control { min-width: 82px; display: grid; justify-items: center; gap: 4px; }
.profit-affiliate-control select { width: 72px; height: 31px; padding: 0 8px; border: 1px solid #d7c7ed; border-radius: 8px; color: #653993; background: #f7f0ff; font-size: 10px; font-weight: 800; outline: 0; cursor: pointer; }
.profit-affiliate-control small { color: var(--muted); font-size: 8px; font-weight: 750; white-space: nowrap; }
.profit-rate-chip { display: inline-flex; padding: 5px 7px; border-radius: 7px; color: #9c3e56; background: #fff1f4; font-weight: 800; white-space: nowrap; }
.profit-margin { font-weight: 900; }
.profit-margin.positive,.profit-value.positive { color: var(--green); }
.profit-margin.negative,.profit-value.negative { color: var(--red); }
.profit-margin.target { padding: 5px 7px; border-radius: 7px; background: var(--green-soft); }
.profit-cost-missing { color: var(--red); font-weight: 800; }
.profitability-table-card .financial-empty { min-height: 220px; }

.filament-section-intro h2 { margin-top: 5px; }
.filament-entry { margin-bottom: 16px; padding: 20px 21px; border: 1px solid #d7def0; border-radius: 16px; background: linear-gradient(145deg,#fff,#f4f8ff); box-shadow: 0 7px 25px rgba(31,59,104,.05); }
.filament-entry h3 { margin: 5px 0 4px; font-size: 17px; }
.filament-entry p { margin: 0; color: var(--muted); font-size: 11px; }
.filament-form { margin-top: 17px; display: grid; grid-template-columns: repeat(4,minmax(125px,1fr)); gap: 10px; align-items: end; }
.filament-form .primary-button { min-height: 43px; justify-content: center; }
.filament-manual-form { grid-template-columns: minmax(190px,1.2fr) 150px 140px minmax(220px,1.5fr) auto; }
.filament-description-field { min-width: 0; }
.filament-form label > span { display: block; margin: 0 0 6px 2px; color: #5b6577; font-size: 10px; font-weight: 800; }
.filament-form input,.filament-form select,.filament-unit-input { width: 100%; height: 43px; border: 1px solid #dce1e8; border-radius: 10px; color: var(--ink); background: #fff; outline: 0; font-size: 12px; }
.filament-form input,.filament-form select { padding: 0 11px; }
.filament-form input:focus,.filament-form select:focus,.filament-unit-input:focus-within { border-color: #6c8ee6; box-shadow: 0 0 0 3px rgba(64,105,211,.1); }
.filament-unit-input { padding: 0 10px; display: flex; align-items: center; gap: 6px; }
.filament-unit-input input { height: 39px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none !important; }
.filament-unit-input b,.filament-unit-input em { color: #7d8798; font-size: 11px; font-style: normal; }
.filament-form-error { min-height: 16px; margin: 8px 0 -4px !important; color: var(--red) !important; font-size: 10px !important; font-weight: 750; }
.filament-summary-grid { margin-bottom: 16px; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
.filament-summary-grid article { padding: 16px 18px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }
.filament-summary-grid span,.filament-summary-grid strong,.filament-summary-grid small { display: block; }
.filament-summary-grid span { color: var(--muted); font-size: 11px; font-weight: 750; }
.filament-summary-grid strong { margin: 6px 0 3px; font-size: 22px; }
.filament-summary-grid small { color: #929aa9; font-size: 9px; }
.filament-summary-grid article:nth-child(2) strong { color: var(--amber); }
.filament-summary-grid article:nth-child(3) strong { color: var(--accent); }
.filament-stock-section,.filament-history-section { margin-bottom: 16px; padding: 20px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); }
.filament-stock-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.filament-card { padding: 16px; border: 1px solid var(--line); border-radius: 13px; background: #fafbfc; }
.filament-card.low { border-color: #f0cf94; background: #fffaf1; }
.filament-card.empty { border-color: #efb6bd; background: #fff7f8; }
.filament-card.inactive { opacity: .68; }
.filament-card.negative { border-color: #efb6bd; background: #fff7f8; }
.filament-card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.filament-identity { display: flex; align-items: center; gap: 10px; }
.filament-color-dot { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 10px; color: #fff; background: #4266b6; font-size: 10px; font-weight: 900; }
.filament-identity strong,.filament-identity small { display: block; }
.filament-identity strong { font-size: 13px; }
.filament-identity small { margin-top: 2px; color: var(--muted); font-size: 9px; }
.filament-balance { margin: 17px 0 8px; display: flex; align-items: end; justify-content: space-between; gap: 10px; }
.filament-balance strong { font-size: 22px; }
.filament-balance span { color: var(--muted); font-size: 9px; }
.filament-progress { height: 7px; overflow: hidden; border-radius: 5px; background: #e7ebf1; }
.filament-progress i { height: 100%; display: block; border-radius: inherit; background: #5577d1; }
.filament-card.low .filament-progress i { background: var(--amber); }
.filament-card.empty .filament-progress i { background: var(--red); }
.filament-card.negative .filament-progress i { background: var(--red); }
.filament-card-footer { margin-top: 11px; display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: 9px; }
.filament-history { display: grid; gap: 7px; }
.filament-history-filters { margin: 14px 0 10px; display: grid; grid-template-columns: 190px 190px minmax(220px,1fr); gap: 10px; }
.filament-history-filters select,.filament-history-filters .search-box { height: 40px; border: 1px solid var(--line); border-radius: 10px; color: var(--ink); background: var(--bg); }
.filament-history-filters select { padding: 0 10px; }
.filament-movement { padding: 11px 12px; display: grid; grid-template-columns: 90px minmax(140px,1fr) 135px minmax(190px,1.2fr) 105px; gap: 12px; align-items: center; border-bottom: 1px solid var(--line); font-size: 10px; }
.filament-movement:last-child { border-bottom: 0; }
.filament-movement time,.filament-movement small { color: var(--muted); }
.filament-movement-type { color: var(--muted); font-size: 9px; font-weight: 800; }
.filament-movement-order { display: block; margin-top: 2px; color: var(--accent); font-size: 9px; font-weight: 800; }
.filament-movement strong.out { color: var(--red); text-align: right; }
.filament-movement strong.in { color: var(--green); text-align: right; }
.filament-empty { grid-column: 1 / -1; min-height: 150px; display: grid; place-items: center; align-content: center; border: 1px dashed #d5dae2; border-radius: 13px; color: var(--muted); text-align: center; }
.filament-empty strong { margin-bottom: 4px; color: var(--ink); font-size: 13px; }

.new-products-intro { align-items: center; }
.new-products-intro h2 { margin-top: 5px; }
.new-product-entry { margin-bottom: 16px; padding: 20px 21px; border: 1px solid #ded7ff; border-radius: 16px; background: linear-gradient(145deg, #fff, #f7f5ff); box-shadow: 0 7px 25px rgba(39,31,84,.05); }
.new-product-entry-copy h3 { margin: 0 0 4px; font-size: 15px; }
.new-product-entry-copy p { margin: 0; color: var(--muted); font-size: 11px; }
.new-product-form { margin-top: 16px; display: grid; grid-template-columns: minmax(180px, .8fr) minmax(280px, 1.5fr) auto; gap: 10px; align-items: end; }
.new-product-form label > span { display: block; margin: 0 0 6px 2px; color: #5b6577; font-size: 10px; font-weight: 800; }
.new-product-form label > span small { color: #9ba2ae; font-size: 9px; font-weight: 650; }
.new-product-form input { width: 100%; height: 43px; padding: 0 12px; border: 1px solid #dce1e8; border-radius: 10px; color: var(--ink); background: #fff; outline: 0; font-size: 12px; }
.new-product-link-field > div { height: 43px; padding: 0 11px; display: flex; align-items: center; gap: 8px; border: 1px solid #dce1e8; border-radius: 10px; background: #fff; }
.new-product-link-field > div svg { flex: 0 0 auto; width: 16px; color: #8f97a8; }
.new-product-link-field > div input { height: auto; padding: 0; border: 0; border-radius: 0; background: transparent; }
.new-product-form input:focus, .new-product-link-field > div:focus-within { border-color: #9c8af0; box-shadow: 0 0 0 3px rgba(111,82,237,.1); }
.new-product-link-field > div input:focus { box-shadow: none; }
.new-product-form .primary-button { min-width: 175px; }
.new-product-error { min-height: 16px; margin: 7px 0 -3px; color: var(--red); font-size: 10px; font-weight: 750; }
.new-product-summary { margin-bottom: 16px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.new-product-summary article { padding: 15px 18px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface); }
.new-product-summary span, .new-product-summary strong, .new-product-summary small { display: block; }
.new-product-summary span { color: var(--muted); font-size: 10px; font-weight: 750; }
.new-product-summary strong { margin: 4px 0 1px; font-size: 23px; }
.new-product-summary small { color: #929aa9; font-size: 9px; }
.new-product-kanban { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.kanban-column { min-width: 0; padding: 13px; border: 1px solid var(--line); border-radius: 16px; background: #eef1f5; }
.kanban-column > header { min-height: 38px; padding: 0 3px 10px; display: flex; align-items: center; justify-content: space-between; }
.kanban-column > header div { display: flex; align-items: center; gap: 8px; }
.kanban-column > header strong { font-size: 12px; }
.kanban-column > header b { min-width: 25px; padding: 4px 7px; border-radius: 10px; color: #667084; background: #dde2e9; text-align: center; font-size: 10px; }
.kanban-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--amber); box-shadow: 0 0 0 4px var(--amber-soft); }
.kanban-column.done .kanban-dot { background: var(--green); box-shadow: 0 0 0 4px var(--green-soft); }
.kanban-cards { display: grid; gap: 10px; }
.new-product-card { min-width: 0; padding: 16px; border: 1px solid #e1e5eb; border-radius: 13px; background: #fff; box-shadow: 0 4px 15px rgba(27,36,58,.04); }
.new-product-card.completed { border-color: #d9e9e1; }
.new-product-card-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.new-product-card-top > span { color: #a06a18; font-size: 8px; font-weight: 900; letter-spacing: .75px; }
.new-product-card.completed .new-product-card-top > span { color: var(--green); }
.new-product-delete { width: 27px; height: 27px; display: grid; place-items: center; border: 0; border-radius: 8px; color: #9aa2b0; background: transparent; cursor: pointer; }
.new-product-delete:hover { color: var(--red); background: var(--red-soft); }
.new-product-delete svg { width: 14px; }
.new-product-card h3 { margin: 10px 0 9px; font-size: 14px; line-height: 1.35; }
.new-product-card.completed h3 { color: #6e7888; text-decoration: line-through; text-decoration-color: #aab2bd; }
.new-product-card > a { min-width: 0; padding: 9px 10px; display: flex; align-items: center; gap: 7px; border-radius: 9px; color: #5b47bd; background: #f3f0ff; text-decoration: none; font-size: 10px; font-weight: 700; }
.new-product-card > a:hover { background: #ebe6ff; }
.new-product-card > a svg { flex: 0 0 auto; width: 14px; }
.new-product-card > a span { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.new-product-card > a .link-chevron { margin-left: auto; width: 12px; }
.new-product-card-footer { min-height: 34px; margin-top: 13px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.new-product-card-footer small { color: #929aa9; font-size: 9px; }
.complete-product-button, .reopen-product-button { min-height: 34px; padding: 0 11px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; border: 0; border-radius: 9px; cursor: pointer; font-size: 10px; font-weight: 800; }
.complete-product-button { color: #fff; background: var(--green); }
.complete-product-button:hover { background: #188a60; }
.complete-product-button svg { width: 13px; }
.reopen-product-button { color: #5d687a; background: #eef1f4; }
.reopen-product-button:hover { color: var(--accent); background: var(--accent-soft); }
.kanban-empty { min-height: 180px; padding: 28px 15px; display: grid; place-items: center; align-content: center; text-align: center; border: 1px dashed #d2d7df; border-radius: 12px; color: var(--muted); background: rgba(255,255,255,.52); }
.kanban-empty span { width: 38px; height: 38px; margin-bottom: 9px; display: grid; place-items: center; border-radius: 11px; color: #828b9a; background: #e4e8ed; font-size: 18px; }
.kanban-empty strong { color: #687285; font-size: 11px; }
.kanban-empty small { margin-top: 4px; font-size: 9px; }
.new-product-storage-note { margin: 14px 0 0; display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 10px; }
.new-product-storage-note svg { width: 14px; color: var(--green); }

.product-section-intro { align-items: center; }
.product-summary-grid { margin-bottom: 18px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.product-summary-card { min-height: 112px; padding: 19px 21px; border: 1px solid var(--line); border-radius: 15px; background: #fff; box-shadow: 0 5px 22px rgba(27,36,58,.035); }
.product-summary-card span, .product-summary-card strong, .product-summary-card small { display: block; }
.product-summary-card span { color: var(--muted); font-size: 12px; font-weight: 750; }
.product-summary-card strong { margin: 8px 0 4px; font-size: 24px; letter-spacing: -.6px; }
.product-summary-card small { color: #929aa9; font-size: 11px; }
.product-toolbar { margin-bottom: 13px; display: flex; justify-content: flex-end; }
.product-toolbar .search-box { width: min(440px, 100%); background: #fff; }
.products-table { min-width: 850px; }
.product-name-cell strong, .product-name-cell span, .product-print-cell strong, .product-print-cell span { display: block; }
.product-name-cell strong { font-size: 13px; }
.product-name-cell span, .product-print-cell span { margin-top: 4px; color: var(--muted); font-size: 11px; }
.product-print-cell strong { font-size: 12px; }
.sku-badge { display: inline-flex; padding: 6px 9px; border-radius: 8px; color: #5d46c2; background: var(--accent-soft); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11px; font-weight: 800; }
.product-cost-cell { color: var(--green); font-size: 14px; }
.product-date-cell { color: var(--muted); white-space: nowrap; }

.legend { display: flex; gap: 15px; color: var(--muted); font-size: 10px; }
.legend span { display: flex; gap: 6px; align-items: center; }
.dot { width: 7px; height: 7px; border-radius: 50%; }
.dot.late { background: var(--red); }
.dot.today { background: var(--amber); }
.dot.normal { background: var(--green); }
.production-planner { margin-bottom: 18px; display: grid; grid-template-columns: minmax(0, 1fr) 310px; border: 1px solid #dcd5ff; border-radius: 16px; background: linear-gradient(145deg, #fff, #f7f5ff); box-shadow: 0 7px 25px rgba(39,31,84,.06); overflow: hidden; }
.sales-import-main { min-width: 0; padding: 21px 22px; display: grid; grid-template-columns: minmax(220px, 1fr) 210px; gap: 10px 20px; align-items: center; }
.sales-import-copy h3 { margin: 5px 0 5px; font-size: 17px; }
.sales-import-copy p { margin: 0; max-width: 690px; color: var(--muted); font-size: 11px; line-height: 1.55; }
.sales-dropzone { min-height: 72px; padding: 12px 14px; display: flex; align-items: center; gap: 11px; border: 1px dashed #9b89e4; border-radius: 12px; color: #5d46c2; background: #f4f1ff; cursor: pointer; transition: .18s ease; }
.sales-dropzone:hover, .sales-dropzone.dragging { border-color: var(--accent); background: #eee9ff; transform: translateY(-1px); }
.sales-dropzone input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.sales-dropzone svg { flex: 0 0 auto; width: 23px; height: 23px; }
.sales-dropzone strong, .sales-dropzone small { display: block; }
.sales-dropzone strong { color: var(--ink); font-size: 12px; }
.sales-dropzone small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.sales-import-status { grid-column: 1 / -1; min-height: 18px; margin: 0; color: var(--muted); font-size: 10px; font-weight: 650; }
.sales-import-status.success { color: var(--green); }
.sales-import-status.error { color: var(--red); }
.daily-capacity-card { padding: 21px; border-left: 1px solid #e3ddfa; background: rgba(255,255,255,.66); }
.capacity-input-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.daily-capacity-card label > span { display: block; margin-bottom: 8px; color: #4f596b; font-size: 11px; font-weight: 800; }
.daily-capacity-card label > div { height: 44px; padding: 0 12px; display: flex; align-items: center; border: 1px solid #d8dce5; border-radius: 10px; background: #fff; }
.daily-capacity-card input { min-width: 0; width: 100%; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 16px; font-weight: 850; }
.daily-capacity-card em { color: var(--muted); font-size: 11px; font-style: normal; }
.daily-capacity-card small { display: block; margin-top: 9px; color: var(--muted); font-size: 10px; line-height: 1.45; }
.daily-plan-summary { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid #e3ddfa; background: #fff; }
.daily-plan-summary > div { min-height: 76px; padding: 15px 21px; border-right: 1px solid var(--line); }
.daily-plan-summary > div:last-child { border-right: 0; }
.daily-plan-summary span, .daily-plan-summary strong { display: block; }
.daily-plan-summary span { color: var(--muted); font-size: 10px; font-weight: 700; }
.daily-plan-summary strong { margin-top: 6px; font-size: 20px; letter-spacing: -.4px; }
.production-toolbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 17px; }
.production-toolbar p { color: var(--muted); font-size: 11px; }
.segmented { display: flex; padding: 4px; border-radius: 11px; background: #e9ecf1; }
.segmented button { border: 0; padding: 8px 13px; border-radius: 8px; background: transparent; color: #6b7485; font-size: 10px; font-weight: 800; cursor: pointer; }
.segmented button.active { color: var(--ink); background: #fff; box-shadow: 0 3px 9px rgba(27,36,58,.08); }
.production-board { display: grid; gap: 11px; }
.production-card { position: relative; display: grid; grid-template-columns: 48px minmax(190px, 1.2fr) minmax(160px, 1fr) 125px 132px 108px; gap: 15px; align-items: center; border: 1px solid var(--line); border-left: 4px solid var(--green); border-radius: 14px; background: #fff; padding: 17px 20px; box-shadow: 0 4px 18px rgba(27,36,58,.035); }
.production-card.late { border-left-color: var(--red); }
.production-card.today { border-left-color: var(--amber); }
.priority-number { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; background: #f1f2f7; font-size: 12px; font-weight: 900; }
.production-main strong, .production-main small { display: block; }
.production-main strong { font-size: 13px; }
.production-main small { margin-top: 4px; color: var(--muted); font-size: 10px; }
.production-items { color: #4f596b; font-size: 11px; line-height: 1.5; }
.production-duration strong, .production-duration small { display: block; }
.production-duration strong { font-size: 12px; }
.production-duration small { margin-top: 4px; color: var(--muted); font-size: 9px; line-height: 1.35; }
.production-duration small span { display: block; }
.production-duration.unknown strong { color: var(--red); }
.today-plan-badge { display: inline-flex; margin-top: 6px; padding: 4px 7px; border-radius: 7px; color: #167d5a; background: var(--green-soft); font-size: 8px; font-weight: 900; text-transform: uppercase; letter-spacing: .35px; }
.today-plan-badge.risk { color: #a65f06; background: var(--amber-soft); }
.production-date { text-align: right; }
.production-date strong, .production-date small { display: block; }
.production-date strong { font-size: 11px; }
.production-date small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.production-card.late .production-date strong { color: var(--red); }
.production-card.today .production-date strong { color: var(--amber); }
.empty-board { padding: 55px 20px; border: 1px dashed #d9dee7; border-radius: 14px; text-align: center; color: var(--muted); background: rgba(255,255,255,.55); }
.empty-board strong { display: block; color: var(--ink); margin-bottom: 5px; }

.calculator-intro { align-items: center; }
.cost-highlight-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 20px; }
.cost-highlight { position: relative; min-height: 122px; padding: 20px; border: 1px solid var(--line); border-radius: 15px; background: #fff; box-shadow: 0 5px 20px rgba(27,36,58,.035); overflow: hidden; }
.cost-highlight::after { content: ""; position: absolute; width: 65px; height: 65px; border-radius: 50%; right: -24px; bottom: -26px; background: #f0f2f7; }
.cost-highlight.primary { color: #fff; border-color: transparent; background: linear-gradient(135deg, #172138, #222e4a); }
.cost-highlight.primary::after { background: rgba(133,105,255,.18); }
.cost-highlight.accent { border-color: #dcd5ff; background: linear-gradient(145deg, #f7f5ff, #eeeaff); }
.cost-highlight.accent::after { background: rgba(111,82,237,.1); }
.cost-highlight > span, .cost-highlight strong, .cost-highlight small { position: relative; z-index: 1; display: block; }
.cost-highlight > span { color: var(--muted); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .55px; }
.cost-highlight.primary > span { color: #aeb6ca; }
.cost-highlight strong { margin: 9px 0 6px; font-size: 25px; letter-spacing: -.7px; }
.cost-highlight.accent strong { color: var(--accent); }
.cost-highlight small { color: #929aa9; font-size: 9px; }
.cost-highlight.negative strong { color: var(--red); }
.calculator-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: start; }
.calculator-panel { overflow: hidden; }
.calculator-panel-header { min-height: 91px; display: flex; align-items: center; gap: 14px; padding: 20px 22px; border-bottom: 1px solid var(--line); background: linear-gradient(180deg, #fff, #fcfcfe); }
.calculator-step { flex: 0 0 auto; width: 39px; height: 39px; display: grid; place-items: center; border-radius: 12px; color: var(--accent); background: var(--accent-soft); font-size: 12px; font-weight: 900; }
.calculator-panel-header h3 { margin: 4px 0 2px; font-size: 15px; }
.calculator-panel-header p { margin: 0; color: var(--muted); font-size: 9px; }
.calculator-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 12px; padding: 21px 22px; }
.calculator-fields label.wide { grid-column: 1 / -1; }
.calculator-fields label > span { display: block; margin: 0 0 6px 2px; color: #4f596b; font-size: 9px; font-weight: 800; }
.input-unit { min-height: 41px; padding: 0 10px; display: flex; align-items: center; gap: 6px; border: 1px solid #dde1e8; border-radius: 10px; background: #fff; transition: .18s ease; }
.input-unit:focus-within { border-color: #9c8af0; box-shadow: 0 0 0 3px rgba(111,82,237,.1); }
.input-unit b { color: #828a99; font-size: 10px; }
.input-unit input, .input-unit select { min-width: 0; width: 100%; height: 39px; padding: 0; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 12px; font-weight: 700; }
.input-unit em { margin-left: auto; color: #9198a6; font-size: 9px; font-style: normal; white-space: nowrap; }
.select-unit { padding-right: 7px; }
.price-input-row { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.price-input-row .secondary-button { min-height: 41px; padding-inline: 11px; font-size: 9px; white-space: nowrap; }
.calculation-breakdown { padding: 4px 22px 21px; display: grid; gap: 0; }
.calculation-breakdown > div { min-height: 38px; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid #edf0f3; color: #626c7d; font-size: 10px; }
.calculation-breakdown > div strong { color: var(--ink); font-size: 11px; }
.calculation-breakdown span small { color: #9aa1af; margin-left: 5px; font-size: 8px; }
.calculation-breakdown .breakdown-total { min-height: 50px; margin-top: 6px; padding: 0 13px; border: 0; border-radius: 10px; color: #fff; background: var(--navy); }
.calculation-breakdown .breakdown-total strong { color: #fff; font-size: 16px; }
.market-results { margin: 0 22px 16px; display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.market-results > div { min-height: 65px; padding: 12px 13px; border-radius: 10px; background: #f5f6f9; }
.market-results span, .market-results strong { display: block; }
.market-results span { color: #727b8c; font-size: 9px; font-weight: 750; }
.market-results span small { display: block; margin-top: 2px; color: #9ba2ae; font-size: 8px; font-weight: 500; }
.market-results strong { margin-top: 6px; font-size: 14px; }
.market-results .market-result-featured { grid-column: 1 / -1; min-height: 70px; display: flex; align-items: center; justify-content: space-between; color: #fff; background: linear-gradient(135deg, var(--accent), #5840ca); }
.market-results .market-result-featured span { color: #e6e0ff; }
.market-results .market-result-featured span small { color: #c8bdff; }
.market-results .market-result-featured strong { margin: 0; font-size: 19px; }
.negative-value { color: var(--red) !important; }
.calculator-warning { min-height: 20px; margin: 0 22px 14px; color: var(--red); font-size: 9px; font-weight: 750; }
.calculation-note { margin-top: 16px; padding: 13px 15px; display: flex; gap: 9px; align-items: flex-start; border: 1px solid #e3e0f5; border-radius: 11px; color: #666f80; background: #f8f7fd; }
.calculation-note svg { flex: 0 0 auto; width: 15px; color: var(--accent); }
.calculation-note p { margin: 0; font-size: 9px; line-height: 1.55; }

/* Dark pricing workspace */
.cost-workspace { margin: -30px -36px -48px; padding: 34px 36px 48px; min-height: calc(100vh - 98px); color: #f6f8fc; background: #0d1117; }
.cost-workspace-header { max-width: 1420px; margin: 0 auto 27px; display: flex; align-items: end; justify-content: space-between; gap: 20px; }
.cost-workspace-header h2 { margin: 7px 0 6px; font-size: 28px; letter-spacing: -.8px; }
.cost-workspace-header p { margin: 0; color: #8d99ad; font-size: 12px; }
.cost-workspace .tag { color: #b079ff; }
.dark-ghost-button { min-height: 40px; padding: 0 14px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid #343c49; border-radius: 10px; color: #aeb8c9; background: #171c24; font-size: 10px; font-weight: 800; cursor: pointer; }
.dark-ghost-button:hover { color: #fff; border-color: #69518f; background: #1c212b; }
.pricing-layout { max-width: 1420px; margin: 0 auto; display: grid; grid-template-columns: 1fr; gap: 23px; align-items: start; }
.pricing-product-lookup { padding: 23px 25px; display: grid; grid-template-columns: minmax(250px, .85fr) minmax(320px, 1.15fr); gap: 18px 28px; align-items: end; border: 1px solid #303744; border-radius: 15px; background: #171c24; box-shadow: 0 22px 55px rgba(0,0,0,.18); }
.pricing-lookup-copy h3 { margin: 6px 0 5px; color: #f4f6fa; font-size: 19px; }
.pricing-lookup-copy p { margin: 0; color: #8591a4; font-size: 11px; }
.pricing-sku-field > span { margin-bottom: 7px !important; font-size: 10px !important; text-transform: uppercase; letter-spacing: .6px; }
.pricing-sku-field .dark-input { padding-left: 12px; }
.pricing-sku-field .dark-input > svg { flex: 0 0 auto; width: 17px; color: #78859a; }
.pricing-sku-field .dark-input button { width: 30px; height: 30px; flex: 0 0 auto; display: grid; place-items: center; border: 0; border-radius: 8px; color: #7e899c; background: transparent; cursor: pointer; }
.pricing-sku-field .dark-input button:hover { color: #fff; background: #29303b; }
.pricing-sku-field .dark-input button svg { width: 14px; }
.pricing-product-found { grid-column: 1 / -1; min-height: 72px; padding: 12px 14px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; align-items: center; border: 1px solid #2d5946; border-radius: 12px; background: #15241e; }
.pricing-product-found[hidden] { display: none; }
.pricing-found-check { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; color: #55d69b; background: rgba(85,214,155,.13); }
.pricing-found-check svg { width: 18px; }
.pricing-product-found small, .pricing-product-found strong, .pricing-product-found div > span { display: block; }
.pricing-product-found small { color: #6fa98e; font-size: 8px; font-weight: 900; letter-spacing: .65px; }
.pricing-product-found strong { margin-top: 3px; overflow: hidden; color: #f1f5f3; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.pricing-product-found div > span { margin-top: 3px; color: #8a9d94; font-size: 10px; }
.pricing-found-cost { min-width: 150px; text-align: right; }
.pricing-found-cost strong { color: #55d69b; font-size: 18px; }
.pricing-sku-message { grid-column: 1 / -1; min-height: 16px; margin: -9px 1px -3px; color: #8995a8; font-size: 10px; font-weight: 700; }
.pricing-sku-message.success { color: #55d69b; }
.pricing-sku-message.error { color: #ff777f; }
.pricing-controls-grid { margin-bottom: 18px; padding: 18px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; border: 1px solid #303744; border-radius: 12px; background: #12171e; }
.pricing-controls-grid > label > span { margin-bottom: 7px !important; font-size: 10px !important; }
.pricing-controls-grid .dark-input { min-height: 44px; }
.pricing-controls-grid .dark-input input { height: 42px; font-size: 13px; }
.pricing-psychological-toggle { min-height: 68px; margin: 0; padding: 10px 12px; align-self: end; border: 1px solid #343c49; border-radius: 10px; background: #171c24; }
.pricing-psychological-toggle > span { margin: 0 !important; }
.pricing-empty-state { min-height: 250px; padding: 45px 20px; display: grid; place-items: center; align-content: center; border: 1px dashed #343c49; border-radius: 13px; color: #8490a3; text-align: center; background: #12171e; }
.pricing-empty-state > span { width: 48px; height: 48px; margin-bottom: 12px; display: grid; place-items: center; border-radius: 14px; color: #a78ae0; background: #211a2b; }
.pricing-empty-state > span svg { width: 20px; }
.pricing-empty-state strong { color: #c0c8d4; font-size: 14px; }
.pricing-empty-state p { max-width: 440px; margin: 6px 0 0; font-size: 10px; line-height: 1.5; }
.pricing-warning { min-height: 18px; margin: 12px 2px -4px; color: #ff777f; font-size: 10px; font-weight: 750; }
.cost-builder-card, .marketplace-comparison { border: 1px solid #303744; border-radius: 15px; background: #171c24; box-shadow: 0 22px 55px rgba(0,0,0,.18); }
.cost-builder-card { padding: 30px; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(330px, .65fr); gap: 30px; align-items: start; }
.cost-input-column, .cost-summary-column { min-width: 0; }
.cost-summary-column { position: sticky; top: 118px; }
.sliced-file-import { margin-bottom: 20px; padding: 18px; border: 1px solid #303744; border-radius: 13px; background: #12171e; }
.sliced-file-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.sliced-file-heading h3 { margin: 5px 0 4px; color: #f5f7fb; font-size: 17px; }
.sliced-file-heading p { margin: 0; color: #8290a4; font-size: 11px; line-height: 1.45; }
.three-mf-dropzone { min-width: 170px; min-height: 76px; padding: 10px 14px; display: grid; grid-template-columns: 22px 1fr; grid-template-rows: auto auto; column-gap: 8px; align-content: center; border: 1px dashed #685397; border-radius: 11px; color: #d9d0f3; background: #1f1a29; cursor: pointer; transition: .18s ease; }
.three-mf-dropzone:hover, .three-mf-dropzone.dragging { border-color: #b079ff; background: #282034; transform: translateY(-1px); }
.three-mf-dropzone input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.three-mf-dropzone svg { grid-row: 1 / span 2; align-self: center; width: 20px; color: #b079ff; }
.three-mf-dropzone span { align-self: end; font-size: 11px; font-weight: 850; }
.three-mf-dropzone small { align-self: start; color: #887b99; font-size: 9px; }
.three-mf-result { margin-top: 14px; padding-top: 14px; display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(90px, .6fr)); gap: 9px; border-top: 1px solid #2c333e; }
.three-mf-result[hidden] { display: none; }
.three-mf-result > div, .three-mf-plate-field { min-width: 0; min-height: 54px; padding: 9px 11px; border: 1px solid #303844; border-radius: 9px; background: #171c24; }
.three-mf-result span, .three-mf-result strong { display: block; }
.three-mf-result span { color: #758196; font-size: 8px; font-weight: 800; text-transform: uppercase; letter-spacing: .5px; }
.three-mf-result strong { margin-top: 5px; overflow: hidden; color: #f1f4f8; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.three-mf-plate-field { grid-column: 1 / -1; }
.three-mf-plate-field select { width: 100%; height: 28px; margin-top: 4px; border: 0; outline: 0; color: #eef2f8; background: transparent; font-size: 11px; font-weight: 750; }
.three-mf-status { min-height: 17px; margin: 10px 1px -4px; color: #7d899c; font-size: 10px; line-height: 1.45; }
.three-mf-status.success { color: #55d69b; }
.three-mf-status.error { color: #ff777f; }
.primary-cost-fields { display: grid; grid-template-columns: 1fr 1.25fr; gap: 14px; }
.cost-workspace label > span, .field-title > span { display: block; margin: 0 0 9px; color: #a8b6cc; font-size: 13px; font-weight: 650; }
.time-inputs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.dark-input { min-height: 48px; padding: 0 13px; display: flex; align-items: center; gap: 7px; border: 1px solid #343c49; border-radius: 10px; background: #141920; transition: .18s ease; }
.dark-input:focus-within { border-color: #9363dc; box-shadow: 0 0 0 3px rgba(176,121,255,.11); }
.dark-input input { width: 100%; min-width: 0; height: 46px; padding: 0; border: 0; outline: 0; color: #fff; background: transparent; font-size: 15px; font-weight: 750; }
.dark-input b, .dark-input em { color: #8e9cb2; font-size: 12px; font-style: normal; font-weight: 650; white-space: nowrap; }
.dark-input em { margin-left: auto; }
.profit-selector { margin-top: 23px; padding-bottom: 20px; border-bottom: 1px dashed #343b47; }
.field-title { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.field-title small { color: #76849a; font-size: 10px; }
.profit-options { display: flex; gap: 8px; flex-wrap: wrap; }
.profit-options button { min-width: 66px; height: 42px; padding: 0 14px; border: 1px solid #353e4d; border-radius: 21px; color: #a7b5c9; background: #141920; font-size: 12px; font-weight: 800; cursor: pointer; }
.profit-options button:hover, .profit-options button.active { color: #fff; border-color: #7661dc; background: #456fe1; }
.custom-profit { width: 110px; min-height: 42px; border-radius: 10px; }
.custom-profit input { height: 40px; }
.advanced-costs { padding: 19px 0; border-bottom: 1px solid #303744; }
.advanced-costs summary { display: flex; align-items: center; justify-content: space-between; color: #a8b7cc; font-size: 13px; font-weight: 800; cursor: pointer; list-style: none; }
.advanced-costs summary::-webkit-details-marker { display: none; }
.advanced-costs summary svg { width: 13px; transform: rotate(90deg); transition: .2s ease; }
.advanced-costs:not([open]) summary svg { transform: rotate(0); }
.advanced-grid { margin-top: 17px; display: grid; grid-template-columns: 1fr 1fr; gap: 13px 11px; }
.advanced-grid label > span { margin-bottom: 7px; font-size: 11px; }
.advanced-grid .dark-input { min-height: 44px; }
.advanced-grid .dark-input input { height: 42px; font-size: 13px; }
.product-register-box { margin-top: 19px; padding: 18px; border: 1px solid #3a344a; border-radius: 12px; background: linear-gradient(145deg, #211c2b, #1a1d27); }
.product-register-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 15px; }
.product-register-header h3 { margin: 5px 0 0; color: #f5f2fb; font-size: 17px; }
.product-cost-preview { min-width: 112px; padding: 8px 11px; border: 1px solid #433951; border-radius: 9px; text-align: right; background: #17131d; }
.product-cost-preview span, .product-cost-preview strong { display: block; }
.product-cost-preview span { color: #8f819c; font-size: 9px; font-weight: 800; text-transform: uppercase; }
.product-cost-preview strong { margin-top: 3px; color: #fff; font-size: 14px; }
.product-register-fields { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(140px, .65fr) minmax(170px,.8fr) auto; gap: 10px; align-items: end; }
.product-register-fields label > span { margin-bottom: 7px; font-size: 11px; }
.product-register-fields .dark-input { min-height: 44px; }
.product-register-fields .dark-input input { height: 42px; font-size: 13px; }
.product-register-fields .dark-input select { width: 100%; height: 42px; padding: 0 9px; color: inherit; border: 0; background: transparent; outline: 0; font-size: 12px; }
.product-save-button { min-height: 44px; padding: 0 16px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; border: 0; border-radius: 10px; color: #fff; background: #7954db; box-shadow: 0 8px 22px rgba(121,84,219,.22); font-size: 12px; font-weight: 850; white-space: nowrap; cursor: pointer; transition: .18s ease; }
.product-save-button:hover { background: #8a64e7; transform: translateY(-1px); }
.product-form-error { min-height: 16px; margin: 9px 1px -4px; color: #ff7d85; font-size: 11px; font-weight: 750; }
.psychological-toggle { margin: 18px 0; display: flex; gap: 10px; align-items: center; cursor: pointer; }
.psychological-toggle input { position: absolute; opacity: 0; pointer-events: none; }
.psychological-toggle i { position: relative; width: 38px; height: 22px; flex: 0 0 auto; border-radius: 20px; background: #303745; transition: .2s ease; }
.psychological-toggle i::after { content: ""; position: absolute; width: 16px; height: 16px; left: 3px; top: 3px; border-radius: 50%; background: #0b0e13; transition: .2s ease; }
.psychological-toggle input:checked + i { background: #7b56d8; }
.psychological-toggle input:checked + i::after { left: 19px; background: #fff; }
.psychological-toggle span { margin: 0 !important; }
.psychological-toggle strong, .psychological-toggle small { display: block; }
.psychological-toggle strong { color: #b1bfd1; font-size: 12px; }
.psychological-toggle small { margin-top: 3px; color: #738096; font-size: 10px; }
.cost-origin { padding: 22px 20px 15px; border-radius: 12px; background: #20252e; }
.cost-origin-title { display: block; margin-bottom: 13px; color: #94a5bd; font-size: 11px; font-weight: 900; letter-spacing: .7px; }
.cost-origin > div { min-height: 39px; display: flex; align-items: center; justify-content: space-between; color: #a2b1c7; font-size: 12px; }
.cost-origin > div strong { color: #fff; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; }
.cost-origin > div small { color: #748197; font-size: 10px; }
.cost-origin .cost-addition { color: #ff666c; }
.cost-origin .cost-total-row { min-height: 55px; margin-top: 8px; padding-top: 9px; border-top: 1px solid #3b424e; color: #fff; font-size: 15px; font-weight: 850; }
.cost-origin .cost-total-row strong { font-size: 21px; }
.cost-builder-card .calculator-warning { margin: 10px 0 0; min-height: 0; color: #ff7279; }

.marketplace-comparison { position: relative; padding: 25px; overflow: hidden; }
.marketplace-comparison::before { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: linear-gradient(90deg, #985de3, #c281ff); }
.marketplace-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 5px 2px 18px; }
.marketplace-heading h3 { margin: 6px 0 5px; font-size: 22px; }
.marketplace-heading p { margin: 0; color: #8c98aa; font-size: 12px; }
.marketplace-heading-controls { display: flex; align-items: end; gap: 11px; }
.market-profit-control { min-width: 210px; }
.market-profit-control > span { margin-bottom: 6px !important; font-size: 10px !important; text-align: right; }
.market-profit-control .dark-input { min-height: 43px; }
.market-profit-control .dark-input input { height: 41px; font-size: 15px; }
.cost-chip { min-width: 112px; padding: 9px 12px; border: 1px solid #383f4c; border-radius: 10px; text-align: right; background: #12161d; }
.cost-chip span, .cost-chip strong { display: block; }
.cost-chip span { color: #778398; font-size: 8px; text-transform: uppercase; }
.cost-chip strong { margin-top: 3px; color: #fff; font-size: 14px; }
.marketplace-note { margin-bottom: 18px; padding: 12px 13px; display: flex; align-items: flex-start; gap: 9px; border: 1px solid #393347; border-radius: 9px; color: #9ba6b6; background: #201b2a; font-size: 10px; line-height: 1.5; }
.marketplace-note svg { flex: 0 0 auto; width: 13px; color: #b57af2; }
.marketplace-card-grid { display: grid; grid-template-columns: 1fr; gap: 16px; }
.marketplace-price-card { --market-color: #9c6ade; position: relative; padding: 24px; display: grid; grid-template-columns: minmax(300px, .8fr) minmax(390px, 1.2fr); grid-template-rows: auto 1fr; column-gap: 36px; border: 1px solid #303744; border-radius: 13px; background: #12171e; overflow: hidden; }
.marketplace-price-card::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--market-color); }
.market-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.market-identity { display: flex; align-items: center; gap: 9px; min-width: 0; }
.market-logo { width: 48px; height: 48px; flex: 0 0 auto; display: grid; place-items: center; position: relative; border-radius: 13px; color: #fff; background: #202630; overflow: hidden; }
.market-logo i { font-style: normal; font-weight: 950; }
.tiktok-logo i { font-size: 27px; color: #fff; text-shadow: -2px 0 #22d3d6, 2px 1px #ff476f; transform: translateY(-4px); }
.tiktok-logo b { position: absolute; bottom: 5px; font-size: 6px; letter-spacing: .8px; }
.shopee-logo { color: #fff; background: #ee6542; }
.shopee-logo::before { content: ""; position: absolute; width: 21px; height: 14px; top: 8px; border: 2px solid rgba(255,255,255,.9); border-bottom: 0; border-radius: 10px 10px 0 0; }
.shopee-logo i { z-index: 1; font-size: 19px; transform: translateY(3px); }
.mercadolivre-logo { color: #253141; background: #f3d545; border-radius: 50%; }
.mercadolivre-logo i { font-size: 13px; letter-spacing: -.5px; }
.market-identity strong, .market-identity small { display: block; }
.market-identity strong { font-size: 15px; white-space: nowrap; }
.market-identity small { margin-top: 4px; color: #7d899d; font-size: 10px; }
.market-fee-editor { display: flex; gap: 5px; }
.mini-fee { width: 56px; }
.mini-fee span { display: block; margin-bottom: 4px; color: #778398; font-size: 8px; text-transform: uppercase; }
.mini-fee div { height: 32px; padding: 0 7px; display: flex; align-items: center; border: 1px solid #303845; border-radius: 7px; background: #171c24; }
.mini-fee input { width: 100%; min-width: 0; border: 0; outline: 0; color: #e4e9f1; background: transparent; font-size: 11px; font-weight: 750; }
.mini-fee em { color: #758196; font-size: 9px; font-style: normal; }
.tiktok-fixed-fee { min-width: 112px; padding: 8px 10px; border: 1px solid #403744; border-radius: 9px; text-align: right; background: #1e1921; }
.tiktok-fixed-fee span, .tiktok-fixed-fee strong { display: block; }
.tiktok-fixed-fee span { color: #8b788b; font-size: 7px; letter-spacing: .55px; }
.tiktok-fixed-fee strong { margin-top: 3px; color: #ffd9e2; font-size: 11px; }
.suggested-market-price { margin: 17px 0 12px; }
.suggested-market-price span, .suggested-market-price strong, .suggested-market-price small { display: block; }
.suggested-market-price span { color: #8490a3; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .55px; }
.suggested-market-price strong { margin: 6px 0 3px; color: #fff; font-size: 30px; letter-spacing: -.8px; }
.suggested-market-price small { color: var(--market-color); font-size: 10px; font-weight: 750; }
.market-profit-breakdown { grid-column: 2; grid-row: 1 / span 2; padding: 0 0 0 30px; border-top: 0; border-left: 1px solid #282f3a; }
.market-profit-breakdown > div { min-height: 30px; display: flex; justify-content: space-between; align-items: center; color: #8995a8; font-size: 10px; }
.market-profit-breakdown > div strong { color: #bac4d2; font-size: 10px; }
.market-profit-breakdown .real-profit-row { min-height: 47px; margin-top: 7px; padding-top: 9px; border-top: 1px dashed #303844; color: #c3ccd8; font-size: 13px; font-weight: 850; }
.market-profit-breakdown .real-profit-row strong { color: #55d69b; font-size: 18px; }
.market-profit-breakdown .affiliate-fee-row { color: #ef9ab0; }
.market-profit-breakdown .affiliate-fee-row strong { color: #ffd0db; }
.market-profit-breakdown .shipping-fee-row { color: #7fc7d6; }
.market-profit-breakdown .shipping-fee-row strong { color: #b8edf4; }
.marketplace-price-card.invalid .suggested-market-price strong, .marketplace-price-card.invalid .real-profit-row strong { color: #ff6c74; }

@media (max-width: 1250px) {
  .marketplace-card-grid { grid-template-columns: 1fr; }
  .kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 980px) {
  .cost-builder-card { grid-template-columns: 1fr; }
  .cost-summary-column { position: static; }
  .pricing-product-lookup { grid-template-columns: 1fr; }
  .pricing-controls-grid { grid-template-columns: 1fr 1fr; }
  .marketplace-card-grid { grid-template-columns: 1fr; }
  .product-register-fields { grid-template-columns: 1fr 1fr; }
  .product-save-button { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
  .cost-workspace { margin: -20px -16px -34px; padding: 25px 16px 35px; min-height: calc(100vh - 82px); }
  .cost-workspace-header { align-items: flex-start; }
  .cost-workspace-header h2 { font-size: 23px; }
  .dark-ghost-button { width: 40px; padding: 0; justify-content: center; font-size: 0; }
  .primary-cost-fields, .advanced-grid { grid-template-columns: 1fr; }
  .marketplace-card-grid { grid-template-columns: 1fr; }
  .marketplace-price-card { display: block; }
  .pricing-controls-grid { grid-template-columns: 1fr; }
  .pricing-product-found { grid-template-columns: auto minmax(0, 1fr); }
  .pricing-found-cost { grid-column: 2; text-align: left; }
  .market-profit-breakdown { margin-top: 14px; padding: 12px 0 0; border-top: 1px solid #282f3a; border-left: 0; }
  .marketplace-heading { align-items: flex-start; }
  .marketplace-heading-controls { flex-direction: column; align-items: stretch; }
  .market-profit-control { min-width: 150px; }
  .market-profit-control > span { text-align: left; }
  .product-summary-grid { grid-template-columns: 1fr; gap: 10px; }
  .product-section-intro { align-items: flex-start; }
  .three-mf-result { grid-template-columns: 1fr 1fr; }
  .three-mf-result > div:first-child { grid-column: 1 / -1; }
  .bridge-banner { grid-template-columns: auto minmax(0, 1fr); }
  .bridge-banner .primary-button { grid-column: 1 / -1; width: 100%; }
  .printer-fleet-summary { grid-template-columns: 1fr 1fr; }
  .printer-monitor-grid { grid-template-columns: 1fr; }
}

@media (max-width: 470px) {
  .cost-builder-card, .marketplace-comparison, .pricing-product-lookup { padding: 17px; }
  .primary-cost-fields { gap: 12px; }
  .field-title { display: block; }
  .field-title small { display: block; margin: -4px 0 9px; }
  .profit-options { gap: 6px; }
  .profit-options button { min-width: 51px; padding: 0 9px; }
  .marketplace-heading { align-items: flex-start; }
  .cost-chip { min-width: 98px; }
  .market-card-head { display: block; }
  .market-fee-editor { margin-top: 10px; }
  .mini-fee { width: 75px; }
  .printer-fleet-summary { grid-template-columns: 1fr; }
  .printer-section-intro { display: grid; }
  .printer-sync-time { justify-self: start; }
  .printer-card-head { align-items: flex-start; }
  .printer-metrics { grid-template-columns: 1fr 1fr; }
  .printer-metrics div:first-child { grid-column: 1 / -1; }
}

/* SaaS 2026 — camada visual global. Mantém a estrutura funcional existente. */
:root { --ink:#07163d; --muted:#63718d; --line:#e3eaf4; --surface:#fff; --canvas:#f3f7fc; --navy:#07163d; --accent:#0877f9; --accent-dark:#005ed4; --accent-soft:#e9f3ff; --green:#08aa6c; --green-soft:#e5f9ef; --amber:#f1a000; --amber-soft:#fff4d8; --red:#f04455; --red-soft:#ffeaed; --shadow:0 10px 30px rgba(35,71,120,.07); }
body { background:linear-gradient(180deg,#f5f9fd 0,#edf4fb 100%); }
.app-shell { display:block; min-height:100vh; padding-top:68px; }
.sidebar.top-navigation { position:fixed; z-index:100; inset:0 0 auto; width:100%; height:68px; padding:0 18px; display:flex; flex-direction:row; align-items:center; gap:18px; color:var(--ink); border-bottom:1px solid #e7edf6; background:rgba(255,255,255,.96); box-shadow:0 3px 18px rgba(35,65,110,.06); backdrop-filter:blur(16px); }
.top-navigation .brand { min-width:200px; padding:0; gap:10px; }.top-navigation .brand-mark { width:39px; height:39px; border-radius:11px; background:linear-gradient(145deg,#0877f9,#0b44d5); box-shadow:0 7px 18px rgba(8,119,249,.24); }.top-navigation .brand strong { color:#07163d; font-size:18px; }.top-navigation .brand small { color:#71809a; }
.top-navigation .nav { min-width:0; flex:1; display:flex; align-items:center; gap:3px; overflow:visible; }
.top-navigation .nav-item { min-height:40px; padding:0 9px; gap:6px; flex:0 0 auto; color:#263653; border-radius:10px; font-size:10px; font-weight:750; white-space:nowrap; }
.top-navigation .nav-item svg { width:16px; height:16px; }.top-navigation .nav-item:hover { color:#0877f9; background:#f0f6ff; }.top-navigation .nav-item.active { color:#0877f9; background:#e8f3ff; }.top-navigation .nav-item.active svg { color:#0877f9; }.top-navigation .nav-item b { min-width:18px; margin-left:1px; padding:2px 4px; color:#0877f9; background:#dcecff; font-size:8px; }
.nav-more { position:relative; flex:0 0 auto; }.nav-more summary { min-height:40px; padding:0 9px; display:flex; align-items:center; gap:5px; color:#263653; border-radius:10px; font-size:10px; font-weight:750; cursor:pointer; list-style:none; }.nav-more summary::-webkit-details-marker { display:none; }.nav-more summary svg { width:13px; }.nav-more[open] summary,.nav-more summary:hover { color:#0877f9; background:#f0f6ff; }.nav-more > div { position:absolute; z-index:20; top:45px; right:0; min-width:180px; padding:7px; border:1px solid var(--line); border-radius:13px; background:var(--surface); box-shadow:0 16px 45px rgba(35,65,110,.16); }.nav-more > div .nav-item { width:100%; }
.profile-control { position:relative; margin-left:auto; flex:0 0 auto; }.profile-button { height:48px; padding:0 4px 0 0; display:flex; align-items:center; gap:9px; color:var(--ink); border:0; background:transparent; cursor:pointer; }.profile-avatar { width:39px; height:39px; display:grid; place-items:center; color:#fff; border-radius:50%; background:linear-gradient(145deg,#0877f9,#1765df); font-size:14px; font-weight:850; }.profile-button > span:nth-child(2) { min-width:92px; text-align:left; }.profile-button strong,.profile-button small { display:block; }.profile-button strong { max-width:120px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:10px; }.profile-button small { margin-top:2px; color:var(--muted); font-size:8px; }.profile-button > svg { width:13px; }
.profile-menu { position:absolute; top:56px; right:0; width:220px; padding:8px; border:1px solid var(--line); border-radius:14px; background:var(--surface); box-shadow:0 18px 50px rgba(28,55,95,.18); }.profile-menu button { width:100%; min-height:39px; padding:0 10px; display:flex; align-items:center; gap:9px; color:var(--ink); border:0; border-radius:9px; background:transparent; font-size:10px; font-weight:700; cursor:pointer; }.profile-menu button:hover { color:#0877f9; background:#eff6ff; }.profile-menu .cloud-signout { margin-top:5px; color:#d94152; border-top:1px solid var(--line); border-radius:0 0 9px 9px; }.profile-menu .profile-tiktok span { font-size:16px; text-shadow:-1px 0 #22d3d6,1px 1px #ff476f; }
.mobile-nav-toggle { display:none; width:40px; height:40px; place-items:center; margin-left:auto; color:var(--ink); border:1px solid var(--line); border-radius:10px; background:var(--surface); }
main { width:100%; }.topbar { position:relative; top:auto; min-height:66px; padding:0 30px; border-bottom:0; background:transparent; }.topbar h1 { font-size:18px; }.topbar .eyebrow { color:#75839d; }.content { max-width:1600px; margin:0 auto; padding:10px 30px 50px; }
.dashboard-hero-grid { margin-bottom:16px; display:grid; grid-template-columns:minmax(0,2.35fr) minmax(290px,.85fr); gap:14px; }.dashboard-hero,.dashboard-day-card { min-height:210px; overflow:hidden; border:1px solid #e4ecf6; border-radius:18px; background:#fff; box-shadow:var(--shadow); }.dashboard-hero { position:relative; padding:25px 28px; display:flex; background:linear-gradient(120deg,#fff 0%,#f8fbff 49%,#d9ecff 100%); }.hero-copy { position:relative; z-index:2; max-width:640px; }.hero-copy > strong { color:#0877f9; font-size:12px; }.hero-copy h2 { margin:9px 0 3px; color:#06143b; font-size:34px; letter-spacing:-1.3px; }.hero-copy h3 { margin:0; color:#50617f; font-size:20px; }.hero-copy p { max-width:570px; margin:9px 0 13px; color:#697994; font-size:13px; line-height:1.55; }.hero-visual { position:absolute; inset:0 0 0 auto; width:42%; background:radial-gradient(circle at 52% 64%,rgba(255,255,255,.95) 0 15%,transparent 16%),radial-gradient(circle at 50% 90%,#b9ddff 0 34%,transparent 35%); }.hero-printer { position:absolute; right:76px; bottom:23px; width:145px; height:125px; border:8px solid #d9e3ed; border-radius:13px; background:linear-gradient(#71829b 0 11px,#eaf0f6 12px); box-shadow:0 18px 25px rgba(28,67,112,.18); }.hero-printer:before { content:""; position:absolute; inset:27px 22px 18px; border:5px solid #64758b; border-top-width:10px; background:#162238; }.hero-printer i { position:absolute; z-index:2; left:46px; bottom:21px; width:38px; height:23px; border-radius:6px 6px 3px 3px; background:#0877f9; }.hero-printer b { position:absolute; z-index:3; left:59px; bottom:23px; color:#fff; font-size:13px; }.hero-spool { position:absolute; right:23px; width:46px; height:46px; border:9px solid #0877f9; border-radius:50%; background:#163a78; box-shadow:0 8px 16px rgba(17,70,145,.2); }.hero-spool.one { bottom:77px; }.hero-spool.two { bottom:24px; }
.dashboard-day-card { padding:13px; display:grid; grid-template-rows:auto 1fr; gap:12px; }.dashboard-date { min-height:43px; padding:0 13px; display:flex; align-items:center; gap:9px; border:1px solid var(--line); border-radius:11px; }.dashboard-date svg { color:#1c579a; }.dashboard-date strong { font-size:11px; text-transform:capitalize; }.dashboard-tip { padding:17px; display:flex; gap:12px; border-radius:13px; background:linear-gradient(135deg,#eaf5ff,#dceeff); }.dashboard-tip > span { width:34px; height:34px; display:grid; place-items:center; color:#0877f9; border-radius:50%; background:#fff; }.dashboard-tip strong { color:#0877f9; font-size:12px; }.dashboard-tip p { margin:7px 0 0; color:#4d6383; font-size:10px; line-height:1.5; }
.kpi-grid { gap:14px; }.kpi-card { min-height:120px; padding:18px; border:1px solid #e4ecf5; border-radius:16px; box-shadow:var(--shadow); }.kpi-icon { width:50px; height:50px; border-radius:12px; }.kpi-card small { color:#172747; font-size:10px; text-transform:none; }.kpi-card strong,.revenue-card strong { margin-top:5px; color:#07163d; font-size:26px; }.kpi-card em { color:#6a7891; }.compact-status-strip { margin-top:-5px; opacity:.86; }
.panel,.table-card,.filter-bar,.payable-entry,.cashflow-panel,.payables-list-section,.filament-entry-panel,.profit-config-panel { border:1px solid #e4ebf4; border-radius:16px; box-shadow:var(--shadow); }.panel-header { padding:17px 20px; }.panel-header h3 { font-size:14px; }.tag { color:#0877f9; background:#eaf3ff; }
.dashboard-analytics-grid { grid-template-columns:minmax(0,1.25fr) minmax(260px,.85fr) minmax(320px,1fr); gap:14px; }.dashboard-analytics-grid > .panel { min-height:310px; }.production-overview-panel { margin:0; }.production-overview-summary { padding:13px 15px 2px; grid-template-columns:repeat(3,1fr); gap:6px; }.production-overview-summary > div { padding:9px; }.production-overview-summary span { font-size:8px; }.production-overview-summary strong { font-size:13px; }.machine-load-grid { padding:9px 15px 15px; display:grid; grid-template-columns:1fr; gap:5px; }.dashboard-machine-row { min-height:49px; padding:7px 8px; display:grid; grid-template-columns:30px minmax(0,1fr) auto; align-items:center; gap:8px; border:0; border-radius:10px; background:#f7faff; }.machine-icon { width:28px; height:28px; display:grid; place-items:center; color:#163662; border-radius:8px; background:#e6effa; }.dashboard-machine-row strong { font-size:9px; }.dashboard-machine-row small { margin-top:3px; color:var(--muted); font-size:7px; }.dashboard-machine-row .machine-load-track { height:5px; margin-top:5px; }.dashboard-machine-row .machine-state { font-size:7px; }
.dashboard-grid { grid-template-columns:minmax(0,1.55fr) minmax(340px,.85fr); gap:14px; }.recent-orders-panel { grid-column:1; grid-row:1; }.queue-panel { grid-column:2; grid-row:1; }.recent-orders-list { padding:0 18px 15px; }.recent-table-wrap { overflow:auto; }.recent-table-wrap table { width:100%; border-collapse:collapse; font-size:9px; }.recent-table-wrap th { padding:9px; color:#52627d; background:#f2f7fc; text-align:left; }.recent-table-wrap td { padding:9px; border-bottom:1px solid var(--line); white-space:nowrap; }.recent-table-wrap .icon-button { width:28px; height:28px; }.recent-table-wrap .status-pill { font-size:8px; }
.section-intro h2 { color:#07163d; letter-spacing:-.5px; }.primary-button { border-radius:10px; background:linear-gradient(135deg,#0877f9,#0961dd); box-shadow:0 7px 18px rgba(8,119,249,.2); }.secondary-button,.ghost-button { border-radius:10px; }.filter-bar input,.filter-bar select,input,select,textarea { border-radius:9px; }.status-pill,.market-badge { border-radius:999px; }
html[data-theme="dark"] { --ink:#edf5ff; --muted:#9aabc1; --line:#293a50; --surface:#151f2d; --canvas:#0e1622; --accent:#4da1ff; --accent-dark:#2385f2; --accent-soft:#183655; --shadow:0 12px 35px rgba(0,0,0,.2); }
html[data-theme="dark"] body { background:linear-gradient(180deg,#101923,#0c141e); } html[data-theme="dark"] .sidebar.top-navigation { color:var(--ink); border-color:var(--line); background:rgba(18,27,39,.96); } html[data-theme="dark"] .top-navigation .brand strong,html[data-theme="dark"] .top-navigation .nav-item,html[data-theme="dark"] .profile-button { color:var(--ink); } html[data-theme="dark"] .dashboard-hero,html[data-theme="dark"] .dashboard-day-card { border-color:var(--line); background:#151f2d; } html[data-theme="dark"] .dashboard-hero { background:linear-gradient(120deg,#151f2d,#162436 55%,#183b60); } html[data-theme="dark"] .hero-copy h2,html[data-theme="dark"] .kpi-card strong,html[data-theme="dark"] .section-intro h2 { color:#f3f7ff; } html[data-theme="dark"] .dashboard-tip { background:linear-gradient(135deg,#19344e,#17304a); } html[data-theme="dark"] .dashboard-machine-row,html[data-theme="dark"] .recent-table-wrap th { background:#182536; } html[data-theme="dark"] .profile-menu,.nav-more > div { background:var(--surface); border-color:var(--line); }
@media (max-width:1380px) { .top-navigation .brand { min-width:160px; }.top-navigation .nav-item { padding-inline:7px; }.top-navigation .nav-item b { display:none; }.profile-button > span:nth-child(2) { display:none; } }
@media (max-width:1120px) { .top-navigation .nav > .nav-item:nth-of-type(n+7) { display:none; }.dashboard-analytics-grid { grid-template-columns:1fr 1fr; }.production-overview-panel { grid-column:1/-1; }.dashboard-hero-grid { grid-template-columns:1fr; }.dashboard-day-card { min-height:130px; grid-template-columns:1fr 1fr; grid-template-rows:1fr; } }
@media (max-width:820px) { .app-shell { padding-top:62px; }.sidebar.top-navigation { height:62px; padding-inline:13px; }.top-navigation .brand { min-width:0; }.top-navigation .brand > div:last-child { display:none; }.mobile-nav-toggle { display:grid; }.top-navigation .nav { position:absolute; display:none; top:62px; left:10px; right:10px; padding:9px; flex-direction:column; align-items:stretch; border:1px solid var(--line); border-radius:14px; background:var(--surface); box-shadow:0 18px 45px rgba(25,55,90,.18); }.top-navigation.mobile-open .nav { display:flex; }.top-navigation .nav > .nav-item:nth-of-type(n) { display:flex; width:100%; }.top-navigation .nav-item { min-height:42px; }.nav-more { width:100%; }.nav-more summary { width:100%; }.nav-more > div { position:static; margin-top:4px; box-shadow:none; }.profile-control { margin-left:0; }.profile-button > span:nth-child(2) { display:none; }.topbar { min-height:58px; padding-inline:16px; }.content { padding:4px 14px 34px; }.dashboard-hero { min-height:255px; padding:21px; }.hero-copy { max-width:74%; }.hero-copy h2 { font-size:27px; }.hero-copy h3 { font-size:16px; }.hero-visual { width:46%; opacity:.65; }.dashboard-day-card { grid-template-columns:1fr; }.dashboard-analytics-grid,.dashboard-grid { grid-template-columns:1fr; }.production-overview-panel,.recent-orders-panel,.queue-panel { grid-column:auto; grid-row:auto; } }
@media (max-width:520px) { .profile-avatar { width:35px; height:35px; }.dashboard-hero { min-height:330px; }.hero-copy { max-width:100%; }.hero-copy p { max-width:90%; }.hero-visual { width:100%; opacity:.22; }.kpi-grid { grid-template-columns:1fr 1fr; }.kpi-card { min-height:115px; padding:14px; display:block; }.kpi-card strong,.revenue-card strong { font-size:20px; }.kpi-icon { width:36px; height:36px; float:right; }.compact-status-strip { grid-template-columns:1fr 1fr 1fr; }.compact-status-strip button { padding:10px 6px; }.recent-table-wrap { max-width:calc(100vw - 66px); }.hero-printer { right:85px; }.dashboard-date strong { font-size:9px; } }

/* Dashboard aprovado em etapas: elimina qualquer resíduo visual do shell anterior. */
[hidden] { display:none !important; }
.dashboard-mode .topbar { display:none; }
.dashboard-mode .content { padding-top:20px; }
.dashboard-mode .compact-status-strip { display:none; }
.view-overview .panel-header .tag { display:none; }
.view-overview .panel-header h3 { margin:0; font-size:15px; }
.top-actions { display:flex; align-items:center; gap:5px; padding-left:7px; border-left:1px solid var(--line); }
.top-actions button { position:relative; width:37px; height:37px; display:grid; place-items:center; color:#173156; border:0; border-radius:10px; background:transparent; cursor:pointer; }
.top-actions button:hover { color:#0877f9; background:#eef6ff; }
.top-actions i { position:absolute; top:7px; right:7px; width:7px; height:7px; border:2px solid #fff; border-radius:50%; background:#f04455; }
.top-navigation .integration-button[hidden],.top-navigation .appearance-control[hidden],.top-navigation .sidebar-note[hidden] { display:none !important; }
.dashboard-hero,.dashboard-day-card,.kpi-card,.view-overview .panel { border:1px solid #e8eef6; box-shadow:0 7px 22px rgba(38,72,116,.055); }
.kpi-card { outline:0; }.kpi-card:hover { border-color:#d9e7f8; box-shadow:0 10px 26px rgba(38,72,116,.08); transform:translateY(-1px); }
.dashboard-analytics-grid { margin-top:17px; }.dashboard-grid { margin-top:15px; }
.channel-list { min-height:225px; padding:10px 20px 20px; display:grid; grid-template-columns:150px minmax(0,1fr); align-items:center; gap:16px; }
.channel-donut { width:145px; height:145px; display:grid; place-items:center; border-radius:50%; background:var(--channel-gradient); }
.channel-donut:before { content:""; grid-area:1/1; width:92px; height:92px; border-radius:50%; background:var(--surface); }
.channel-donut > div { z-index:1; grid-area:1/1; text-align:center; }.channel-donut strong,.channel-donut span { display:block; }.channel-donut strong { color:var(--ink); font-size:25px; }.channel-donut span { margin-top:2px; color:var(--muted); font-size:9px; }
.channel-legend { display:grid; gap:11px; }.channel-legend > div { display:grid; grid-template-columns:9px minmax(0,1fr) auto; align-items:center; gap:8px; }.channel-legend i { width:8px; height:8px; border-radius:50%; }.channel-legend span { overflow:hidden; color:#53627d; font-size:9px; white-space:nowrap; text-overflow:ellipsis; }.channel-legend strong { color:var(--ink); font-size:10px; }
.queue-list { padding:0 18px 15px; }.queue-row { position:relative; min-height:58px; padding:8px 5px 8px 13px; border-bottom:1px solid var(--line); }.queue-row:before { content:""; position:absolute; left:0; top:9px; bottom:9px; width:3px; border-radius:3px; background:#8ba1bd; }.queue-row:has(.deadline.late):before { background:var(--red); }.queue-row:has(.deadline.today):before { background:var(--amber); }.queue-rank { color:#0877f9; background:#eaf3ff; }.queue-info strong { font-size:9px; }.queue-info small,.deadline small { font-size:8px; }.deadline strong { font-size:8px; }
.sales-profit-panel .panel-header { align-items:center; }.chart-legend { padding:7px 10px; border:1px solid var(--line); border-radius:9px; background:#fbfdff; }
html[data-theme="dark"] .top-actions i { border-color:#151f2d; } html[data-theme="dark"] .channel-donut:before { background:var(--surface); } html[data-theme="dark"] .chart-legend { background:#182536; }
@media (max-width:1380px) { .profile-button > span:nth-child(2) { display:block; }.top-navigation .brand { min-width:150px; }.top-navigation .nav-item { padding-inline:6px; font-size:9px; } }
@media (max-width:1250px) { .profile-button > span:nth-child(2) { display:none; }.top-navigation .nav > .nav-item:nth-of-type(n+8) { display:none; } }
@media (max-width:820px) { .top-actions { margin-left:auto; }.dashboard-mode .content { padding-top:14px; }.channel-list { grid-template-columns:140px minmax(0,1fr); }.dashboard-hero-grid { gap:12px; } }
@media (max-width:520px) { .top-actions { display:none; }.dashboard-hero-grid { margin-bottom:12px; }.channel-list { grid-template-columns:1fr; justify-items:center; }.channel-legend { width:100%; }.kpi-grid { gap:10px; }.dashboard-analytics-grid,.dashboard-grid { gap:10px; }.view-overview .panel { min-width:0; } }

/* Refinamento de densidade do shell e Dashboard — sem escala global. */
@media (min-width:821px) {
  .app-shell { padding-top:62px; }
  .sidebar.top-navigation { height:62px; padding:0 24px; gap:12px; }
  .top-navigation .brand { min-width:218px; gap:9px; }
  .top-navigation .brand-mark { width:36px; height:36px; border-radius:10px; }
  .top-navigation .brand strong { font-size:19px; line-height:1.05; }
  .top-navigation .brand small { font-size:10px; }
  .top-navigation .nav { gap:2px; }
  .top-navigation .nav-item,
  .nav-more summary { min-height:38px; padding:0 8px; gap:5px; font-size:14px; font-weight:600; }
  .top-navigation .nav-item svg { width:15px; height:15px; }
  .nav-more summary svg { width:12px; }
  .profile-button { height:44px; gap:8px; }
  .profile-avatar { width:36px; height:36px; font-size:13px; }
  .profile-button > span:nth-child(2) { min-width:86px; }
  .profile-button strong { max-width:112px; font-size:13px; }
  .profile-button small { font-size:10px; }
  .profile-menu { top:49px; }
  .top-actions button { width:35px; height:35px; }

  .content,
  .dashboard-mode .content { width:100%; max-width:none; padding:12px 28px 28px; }
  .dashboard-hero-grid { margin-bottom:14px; gap:14px; }
  .dashboard-hero,
  .dashboard-day-card { height:184px; min-height:184px; }
  .dashboard-hero { padding:19px 26px; }
  .hero-copy { max-width:650px; }
  .hero-copy > strong { font-size:13px; }
  .hero-copy h2 { margin:6px 0 1px; font-size:36px; line-height:1.06; }
  .hero-copy h3 { font-size:21px; line-height:1.2; }
  .hero-copy p { margin:7px 0 10px; font-size:14px; line-height:1.4; }
  .hero-visual { width:38%; }
  .hero-printer { right:70px; bottom:17px; width:126px; height:108px; border-width:7px; }
  .hero-printer:before { inset:23px 19px 16px; border-width:4px; border-top-width:8px; }
  .hero-printer i { left:39px; bottom:18px; width:34px; height:20px; }
  .hero-printer b { left:50px; bottom:20px; font-size:11px; }
  .hero-spool { right:20px; width:39px; height:39px; border-width:7px; }
  .hero-spool.one { bottom:68px; }
  .hero-spool.two { bottom:21px; }
  .dashboard-day-card { padding:11px; gap:9px; }
  .dashboard-date { min-height:40px; padding:0 11px; }
  .dashboard-date strong { font-size:12px; }
  .dashboard-tip { padding:13px; gap:10px; }
  .dashboard-tip > span { width:31px; height:31px; }
  .dashboard-tip strong { font-size:13px; }
  .dashboard-tip p { margin-top:5px; font-size:11px; line-height:1.35; }

  .kpi-grid { margin-bottom:14px; gap:14px; }
  .kpi-card { min-height:110px; height:110px; padding:15px 17px; }
  .kpi-icon { width:44px; height:44px; }
  .kpi-card small { font-size:14px; }
  .kpi-card strong,
  .revenue-card strong { margin:3px 0 2px; font-size:29px; line-height:1.05; }
  .kpi-card em { font-size:11px; line-height:1.25; }

  .dashboard-analytics-grid { margin-top:0; margin-bottom:14px; gap:14px; }
  .dashboard-analytics-grid > .panel { height:240px; min-height:0; overflow:hidden; }
  .panel-header { padding:12px 16px 10px; }
  .view-overview .panel-header h3 { font-size:14px; }
  .chart-legend { padding:5px 8px; gap:9px; }
  .dashboard-sales-chart { min-height:0; height:190px; padding:8px 16px 12px; gap:8px; }
  .dashboard-chart-bars { height:128px; }
  .dashboard-chart-day strong { margin-top:5px; }
  .channel-list { min-height:0; height:194px; padding:6px 16px 12px; grid-template-columns:124px minmax(0,1fr); gap:12px; }
  .channel-donut { width:118px; height:118px; }
  .channel-donut:before { width:76px; height:76px; }
  .channel-donut strong { font-size:21px; }
  .channel-legend { gap:8px; }
  .channel-legend span { font-size:10px; }
  .channel-legend strong { font-size:11px; }
  .production-overview-summary { margin-bottom:0; padding:7px 12px 1px; gap:5px; }
  .production-overview-summary > div { padding:7px 8px; }
  .production-overview-summary span { font-size:9px; }
  .production-overview-summary strong { margin-top:2px; font-size:13px; }
  .machine-load-grid { padding:5px 12px 10px; gap:3px; }
  .dashboard-machine-row { min-height:38px; padding:4px 7px; grid-template-columns:25px minmax(0,1fr) auto; gap:6px; }
  .machine-icon { width:24px; height:24px; }
  .dashboard-machine-row strong { font-size:10px; }
  .dashboard-machine-row small { margin-top:1px; font-size:8px; }
  .dashboard-machine-row .machine-load-track { height:4px; margin-top:3px; }
  .dashboard-machine-row .machine-state { padding:4px 6px; font-size:8px; }

  .dashboard-grid { margin-top:0; gap:14px; }
  .recent-orders-list,
  .queue-list { padding:0 16px 10px; }
  .recent-table-wrap th { height:34px; padding:6px 8px; font-size:10px; }
  .recent-table-wrap td { height:42px; padding:6px 8px; font-size:10px; }
  .recent-table-wrap .icon-button { width:26px; height:26px; }
  .queue-row { min-height:42px; padding:5px 4px 5px 11px; }
  .queue-row:before { top:6px; bottom:6px; }
  .queue-info strong { font-size:10px; }
  .queue-info small,
  .deadline small,
  .deadline strong { font-size:9px; }
}

@media (min-width:821px) and (max-width:1550px) {
  .sidebar.top-navigation { padding-inline:16px; gap:8px; }
  .top-navigation .brand { min-width:174px; }
  .top-navigation .brand strong { font-size:18px; }
  .top-navigation .nav-item,
  .nav-more summary { padding-inline:6px; font-size:13px; }
  .top-navigation .nav-item svg { display:none; }
  .profile-button > span:nth-child(2) { display:none; }
  .content,
  .dashboard-mode .content { padding-inline:24px; }
}

@media (min-width:821px) and (max-width:1250px) {
  .top-navigation .nav > .nav-item:nth-of-type(n+7) { display:none; }
  .dashboard-hero,
  .dashboard-day-card { height:auto; }
  .dashboard-analytics-grid > .panel { height:auto; min-height:240px; }
}

@media (max-width:820px) {
  .top-navigation .nav-item,
  .nav-more summary { font-size:14px; font-weight:600; }
  .profile-menu button { font-size:13px; }
}

dialog { width: min(720px, calc(100vw - 30px)); max-height: calc(100vh - 34px); border: 0; border-radius: 18px; padding: 0; color: var(--ink); box-shadow: 0 30px 80px rgba(14,21,38,.25); }
dialog::backdrop { background: rgba(10,15,28,.62); backdrop-filter: blur(4px); }
#orderForm { padding: 25px 27px 24px; overflow-y: auto; max-height: calc(100vh - 34px); }
.dialog-header { display: flex; justify-content: space-between; align-items: start; margin-bottom: 23px; }
.dialog-header h2 { margin: 5px 0 4px; font-size: 21px; }
.dialog-header p { margin: 0; color: var(--muted); font-size: 11px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.form-grid label, .notes-label { display: block; }
.form-grid label.full { grid-column: 1 / -1; }
.form-grid label > span, .notes-label > span { display: block; margin: 0 0 6px 2px; font-size: 10px; font-weight: 800; }
.form-grid input, .form-grid select { height: 42px; padding: 0 11px; font-size: 12px; }
.items-section { margin: 22px 0 17px; padding: 18px; border-radius: 13px; background: #f7f8fb; }
.items-header { display: flex; justify-content: space-between; gap: 15px; align-items: center; margin-bottom: 12px; }
.items-header h3 { margin: 0 0 3px; font-size: 13px; }
.items-header p { margin: 0; color: var(--muted); font-size: 9px; }
.items-header .secondary-button { min-height: 34px; padding: 0 11px; font-size: 10px; }
.item-row { display: grid; grid-template-columns: minmax(210px,.9fr) minmax(0,1.2fr) 90px 34px; gap: 8px; margin-top: 8px; }
.item-row input,.item-row select { height: 40px; border: 1px solid #dde1e8; border-radius: 9px; padding: 0 10px; color: var(--ink); background: var(--surface); outline: 0; font-size: 11px; }
.product-picker { position: relative; min-width: 0; }
.item-row .product-search { width: 100%; padding-right: 30px; }
.product-picker-results { position: absolute; z-index: 12; top: calc(100% + 5px); left: 0; width: max(100%, 310px); max-height: 224px; padding: 5px; overflow-y: auto; border: 1px solid #d8dde6; border-radius: 10px; background: var(--surface); box-shadow: 0 14px 35px rgba(19,27,44,.18); }
.product-picker-results[hidden] { display: none; }
.product-picker-option { width: 100%; min-height: 38px; padding: 8px 9px; display: flex; align-items: center; gap: 5px; border: 0; border-radius: 7px; color: var(--ink); background: transparent; text-align: left; cursor: pointer; font-size: 11px; }
.product-picker-option:hover,.product-picker-option.active { color: #593fc0; background: var(--accent-soft); }
.product-picker-option strong { flex: 0 0 auto; }
.product-picker-option span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.product-picker-empty { margin: 0; padding: 10px; color: var(--muted); font-size: 11px; text-align: center; }
.item-row .item-name[readonly] { color: var(--muted); background: var(--bg); }
.item-row input:focus { border-color: #9c8af0; box-shadow: 0 0 0 3px rgba(111,82,237,.1); }
.item-row .remove-item { width: 34px; height: 40px; border: 0; border-radius: 8px; color: #9299a7; background: #ebedf2; cursor: pointer; }
.item-row .remove-item:hover { color: var(--red); background: var(--red-soft); }
textarea { resize: vertical; padding: 10px 11px; font-size: 11px; }
.form-error { min-height: 25px; padding-top: 8px; color: var(--red); font-size: 10px; font-weight: 700; }
.dialog-actions { display: flex; justify-content: flex-end; gap: 9px; }
.confirm-dialog { width: min(420px, calc(100vw - 30px)); }
.confirm-content { padding: 30px; text-align: center; }
.confirm-icon { width: 52px; height: 52px; display: inline-grid; place-items: center; border-radius: 15px; color: var(--red); background: var(--red-soft); }
.confirm-content h2 { margin: 17px 0 7px; font-size: 18px; }
.confirm-content p { margin: 0 0 23px; color: var(--muted); font-size: 11px; }
.confirm-content .dialog-actions { justify-content: center; }
.integration-dialog { width: min(640px, calc(100vw - 30px)); }
.integration-content { padding: 26px 28px 25px; }
.integration-dialog-header { margin-bottom: 18px; }
.integration-security-note { padding: 11px 13px; display: flex; align-items: center; gap: 9px; border: 1px solid #ccebdd; border-radius: 10px; color: #39735d; background: #f0faf6; font-size: 11px; }
.integration-security-note svg { flex: 0 0 auto; width: 16px; color: var(--green); }
.tiktok-connections { min-height: 92px; margin-top: 15px; display: grid; gap: 9px; }
.tiktok-connection-loading,.tiktok-connection-empty,.tiktok-connection-card { min-height: 82px; padding: 15px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.tiktok-connection-loading { display: grid; place-items: center; color: var(--muted); font-size: 12px; }
.tiktok-connection-empty,.tiktok-connection-card { display: flex; align-items: center; gap: 13px; }
.integration-tiktok-logo { flex: 0 0 auto; width: 43px; height: 43px; display: grid; place-items: center; border-radius: 12px; color: #fff; background: #11151d; font-size: 25px; font-weight: 900; text-shadow: -2px 0 #22d3d6, 2px 1px #ff476f; }
.tiktok-connection-empty strong,.tiktok-connection-empty small,.tiktok-connection-card strong,.tiktok-connection-card small { display: block; }
.tiktok-connection-empty strong,.tiktok-connection-card strong { font-size: 13px; }
.tiktok-connection-empty small,.tiktok-connection-card small { margin-top: 4px; color: var(--muted); font-size: 10px; }
.tiktok-connection-card b { margin-left: auto; padding: 7px 9px; display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; color: var(--green); background: var(--green-soft); font-size: 10px; }
.tiktok-connection-card b i { width: 7px; height: 7px; border-radius: 50%; background: var(--green); }
.integration-error { min-height: 18px; margin: 10px 0 0; color: var(--red); font-size: 11px; font-weight: 700; }
.integration-actions { margin-top: 8px; display: flex; justify-content: flex-end; gap: 9px; }
.tiktok-connect-button { min-height: 42px; padding: 0 16px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 0; border-radius: 10px; color: #fff; background: #11151d; cursor: pointer; font-size: 12px; font-weight: 800; }
.tiktok-connect-button:hover { background: #242936; }
.tiktok-connect-button:disabled { opacity: .58; cursor: wait; }
.tiktok-connect-button span { font-size: 18px; text-shadow: -1px 0 #22d3d6, 1px 1px #ff476f; }
.toast { position: fixed; z-index: 100; right: 24px; bottom: 24px; padding: 12px 16px 12px 11px; display: flex; gap: 9px; align-items: center; border-radius: 12px; color: #fff; background: var(--navy); box-shadow: 0 16px 40px rgba(14,21,38,.25); opacity: 0; transform: translateY(16px); pointer-events: none; transition: .25s ease; }
.toast.show { opacity: 1; transform: none; }
.toast span { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 8px; color: #fff; background: var(--green); }
.toast span svg { width: 15px; }
.toast p { margin: 0; font-size: 11px; font-weight: 750; }

@media (max-width: 1050px) {
  .app-shell { grid-template-columns: 76px minmax(0,1fr); }
  .sidebar { padding-inline: 12px; }
  .brand { padding-inline: 6px; justify-content: center; }
  .brand > div:last-child, .nav-item span, .nav-item b, .sidebar-note div { display: none; }
  .nav-item { justify-content: center; padding: 0; }
  .integration-button { width: 50px; margin: 10px auto 8px; justify-content: center; padding: 0; }
  .integration-button > span:not(.integration-tiktok-mark), .integration-button small { display: none; }
  .appearance-button { width: 50px; margin: 0 auto; justify-content: center; padding: 0; }
  .appearance-button span, .appearance-button small, .appearance-chevron { display: none; }
  .theme-menu { right: auto; width: 218px; }
  .sidebar-note { justify-content: center; }
  .kpi-grid { grid-template-columns: 1fr 1fr; }
  .cost-highlight-grid { grid-template-columns: 1fr 1fr; }
  .calculator-grid { grid-template-columns: 1fr; }
  .filter-bar { grid-template-columns: 1fr 1fr; }
  .filter-bar .search-box { grid-column: 1 / -1; }
  .production-card { grid-template-columns: 44px minmax(180px,1fr) 1fr 120px; }
  .production-duration { grid-column: 2; }
  .production-card .status-select { grid-column: 3; justify-self: start; }
  .production-date { grid-column: 4; grid-row: 1 / span 2; }
  .payable-form { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .profit-rules-card { align-items: flex-start; flex-direction: column; }
  .profit-settings { width: 100%; grid-template-columns: repeat(3,1fr); }
  .filament-form { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .filament-form .primary-button { grid-column: 1 / -1; }
  .filament-stock-grid { grid-template-columns: 1fr 1fr; }
  .new-product-form { grid-template-columns: minmax(160px, .8fr) minmax(240px, 1.4fr); }
  .new-product-form .primary-button { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
  .app-shell { display: block; padding-bottom: 70px; }
  .sidebar { position: fixed; z-index: 50; inset: auto 0 0; width: 100%; height: 68px; padding: 8px 14px; display: block; border-top: 1px solid rgba(255,255,255,.08); }
  .brand, .sidebar-note { display: none; }
  .integration-button { position: fixed; z-index: 70; left: 70px; bottom: 80px; width: 46px; min-height: 46px; margin: 0; border-color: #30394c; background: #121a2d; box-shadow: 0 10px 28px rgba(14,21,38,.25); }
  .appearance-control { position: fixed; z-index: 70; left: 12px; bottom: 80px; margin: 0; }
  .appearance-button { width: 46px; min-height: 46px; border-color: #30394c; background: #121a2d; box-shadow: 0 10px 28px rgba(14,21,38,.25); }
  .theme-menu { left: 0; right: auto; width: 218px; }
  .nav { display: flex; gap: 3px; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
  .nav::-webkit-scrollbar { display: none; }
  .nav-item { min-height: 52px; flex: 0 0 66px; display: flex; flex-direction: column; gap: 3px; font-size: 9px; }
  .nav-item span { display: block; }
  .nav-item svg { width: 17px; }
  .topbar { height: 82px; padding: 0 18px; }
  .topbar h1 { font-size: 19px; }
  .primary-button { padding: 0 13px; }
  .content { padding: 20px 16px 34px; }
  .integration-content { padding: 21px 18px; }
  .integration-actions { align-items: stretch; flex-direction: column-reverse; }
  .integration-actions button { width: 100%; }
  .welcome-card { min-height: 145px; padding: 24px; }
  .welcome-card h2 { font-size: 21px; }
  .printer-art { display: none; }
  .kpi-grid { gap: 10px; }
  .kpi-card { padding: 14px; gap: 10px; }
  .kpi-icon { width: 37px; height: 37px; }
  .kpi-card strong { font-size: 23px; }
  .kpi-card em { display: none; }
  .dashboard-grid { grid-template-columns: 1fr; }
  .financial-section-intro { align-items: flex-start; }
  .financial-header-actions { justify-content: flex-start; }
  .payable-entry-header { align-items: flex-start; }
  .payable-form { grid-template-columns: 1fr 1fr; }
  .payable-form-actions { grid-column: 1 / -1; }
  .payable-form .primary-button { width: 100%; }
  .financial-summary-grid { grid-template-columns: 1fr 1fr; }
  .profitability-summary-grid { grid-template-columns: 1fr 1fr; }
  .profitability-toolbar { align-items: flex-start; flex-direction: column; }
  .filament-summary-grid { grid-template-columns: 1fr 1fr; }
  .cashflow-chart { grid-template-columns: repeat(6,95px); }
  .payables-list-header { align-items: flex-start; flex-direction: column; }
  .new-product-form { grid-template-columns: 1fr; }
  .new-product-form .primary-button { grid-column: auto; width: 100%; }
  .new-product-kanban { grid-template-columns: 1fr; }
  .cost-highlight-grid { gap: 10px; }
  .cost-highlight { min-height: 108px; padding: 16px; }
  .cost-highlight strong { font-size: 21px; }
  .queue-row { grid-template-columns: 31px minmax(0,1fr) 86px; }
  .queue-row .market-badge { display: none; }
  .filter-bar { grid-template-columns: 1fr 1fr; }
  .filter-bar .ghost-button { grid-column: 1 / -1; }
  .section-intro { align-items: start; gap: 12px; }
  .legend { display: none; }
  .production-planner { grid-template-columns: 1fr; }
  .sales-import-main { grid-template-columns: 1fr; }
  .sales-import-status { grid-column: auto; }
  .daily-capacity-card { border-top: 1px solid #e3ddfa; border-left: 0; }
  .capacity-input-grid { grid-template-columns: 1fr 1fr; }
  .daily-plan-summary { grid-template-columns: 1fr 1fr; }
  .daily-plan-summary > div:nth-child(2) { border-right: 0; }
  .daily-plan-summary > div:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .production-toolbar { display: block; }
  .production-toolbar p { margin: 10px 0 0; }
  .production-card { grid-template-columns: 38px minmax(0,1fr) 100px; padding: 14px; gap: 10px; }
  .production-items { grid-column: 2 / -1; }
  .production-duration { grid-column: 2 / -1; }
  .production-card .status-select { grid-column: 2 / -1; }
  .production-date { grid-column: 3; grid-row: 1; }
  .form-grid { grid-template-columns: 1fr; }
  .form-grid label.full { grid-column: auto; }
  .filament-form { grid-template-columns: 1fr; }
  .filament-form .primary-button { grid-column: auto; width: 100%; }
  .filament-stock-grid { grid-template-columns: 1fr; }
  .filament-summary-grid { grid-template-columns: 1fr; }
  .filament-history-filters { grid-template-columns: 1fr; }
  .filament-movement { grid-template-columns: 78px 1fr 82px; }
  .filament-movement-type { grid-column: 2; }
  .filament-movement small { grid-column: 2 / -1; }
  .financial-header-actions { width: 100%; display: grid; grid-template-columns: 1fr 1fr; }
  .financial-header-actions .financial-import-button { grid-column: 1 / -1; }
  .financial-view-tabs { width: 100%; display: grid; grid-template-columns: 1fr; }
  .payable-entry-header { display: grid; }
  .payable-preview { width: 100%; text-align: left; }
  .payable-form { grid-template-columns: 1fr; }
  .payable-form-actions { grid-column: auto; }
  .financial-summary-grid { grid-template-columns: 1fr; }
  .profit-settings { grid-template-columns: 1fr; }
  .profitability-summary-grid { grid-template-columns: 1fr; }
  .profitability-filters { width: 100%; flex-direction: column; }
  .profitability-filters label,.profitability-filters input,.profitability-filters select { width: 100%; }
  .items-header { align-items: start; }
  .product-toolbar { justify-content: stretch; }
  .product-toolbar .search-box { width: 100%; }
}

@media (max-width: 470px) {
  .topbar .primary-button { font-size: 0; width: 42px; padding: 0; }
  .topbar .primary-button svg { width: 19px; }
  .kpi-grid { grid-template-columns: 1fr; }
  .payable-entry-header { display: grid; }
  .payable-preview { width: 100%; min-width: 0; text-align: left; }
  .payable-form { grid-template-columns: 1fr; }
  .payable-form .primary-button { grid-column: auto; }
  .financial-summary-grid { grid-template-columns: 1fr; gap: 8px; }
  .new-product-summary { grid-template-columns: 1fr; gap: 8px; }
  .new-product-card-footer { align-items: flex-start; flex-direction: column; }
  .complete-product-button, .reopen-product-button { width: 100%; }
  .cost-highlight-grid { grid-template-columns: 1fr; }
  .calculator-fields { grid-template-columns: 1fr; padding: 18px 16px; }
  .calculator-fields label.wide { grid-column: auto; }
  .calculator-panel-header { padding-inline: 16px; }
  .calculation-breakdown { padding-inline: 16px; }
  .market-results { margin-inline: 16px; }
  .price-input-row { grid-template-columns: 1fr; }
  .kpi-card em { display: block; }
  .filter-bar { grid-template-columns: 1fr; }
  .daily-plan-summary { grid-template-columns: 1fr; }
  .capacity-input-grid { grid-template-columns: 1fr; }
  .daily-plan-summary > div { border-right: 0; border-bottom: 1px solid var(--line); }
  .daily-plan-summary > div:last-child { border-bottom: 0; }
  .filter-bar .search-box, .filter-bar .ghost-button { grid-column: auto; }
  .segmented { overflow-x: auto; }
  .segmented button { white-space: nowrap; }
  .production-card { grid-template-columns: 34px minmax(0,1fr); }
  .production-date { grid-column: 2; grid-row: auto; text-align: left; }
  .item-row { grid-template-columns: 1fr 1fr 70px 34px; }
  .product-section-intro { display: grid; }
  .product-section-intro .primary-button { width: 100%; }
  .product-register-header { align-items: flex-start; }
  .product-register-fields { grid-template-columns: 1fr; }
  .product-save-button { grid-column: auto; }
  .table-footer { gap: 12px; align-items: flex-start; }
  .sliced-file-heading { display: grid; }
  .three-mf-dropzone { width: 100%; min-width: 0; }
  .three-mf-result { grid-template-columns: 1fr; }
  .three-mf-result > div:first-child { grid-column: auto; }
}

/* Appearance themes */
html[data-theme="light"] { color-scheme: light; }
html[data-theme="dark"] {
  color-scheme: dark;
  --ink: #edf1f8;
  --muted: #9aa6b9;
  --line: #303846;
  --surface: #171c24;
  --canvas: #0d1117;
  --navy: #090e18;
  --accent-soft: rgba(130,103,255,.16);
  --green-soft: rgba(33,168,117,.15);
  --amber-soft: rgba(219,138,20,.16);
  --red-soft: rgba(223,82,97,.15);
  --shadow: 0 14px 38px rgba(0,0,0,.22);
  background: var(--canvas);
}

html[data-theme="dark"] .topbar { background: rgba(18,23,32,.92); border-color: var(--line); }
html[data-theme="dark"] .ghost-button { color: #b4bdcb; background: #202630; border-color: #353d4a; }
html[data-theme="dark"] .ghost-button:hover { color: #fff; background: #272e39; }
html[data-theme="dark"] .market-badge { color: #b5bfce; background: #272e38; }
html[data-theme="dark"] .filter-bar select,
html[data-theme="dark"] .search-box,
html[data-theme="dark"] .form-grid input,
html[data-theme="dark"] .form-grid select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .item-row input,html[data-theme="dark"] .item-row select { color: var(--ink); border-color: #343d4a; background: #141920; }

.cloud-signout { margin: 0 14px 10px; border: 0; color: var(--muted); background: transparent; font-size: 9px; cursor: pointer; text-align: left; }
.cloud-auth-gate { position: fixed; inset: 0; z-index: 9999; display: grid; place-items: center; padding: 20px; background: rgba(14,18,27,.72); backdrop-filter: blur(8px); }
.cloud-auth-gate[hidden] { display: none; }
.cloud-auth-card { width: min(430px,100%); padding: 32px; border: 1px solid var(--line); border-radius: 22px; background: var(--surface); box-shadow: 0 28px 90px rgba(0,0,0,.28); }
.cloud-auth-card .brand-mark { margin-bottom: 20px; }
.cloud-auth-card h2 { margin: 8px 0 7px; font-size: 25px; }
.cloud-auth-card > p { margin: 0 0 20px; color: var(--muted); font-size: 12px; line-height: 1.5; }
.cloud-auth-card label { display: block; margin-top: 12px; }
.cloud-auth-card label span { display: block; margin: 0 0 6px 2px; color: var(--muted); font-size: 10px; font-weight: 800; }
.cloud-auth-card input { width: 100%; height: 46px; padding: 0 12px; border: 1px solid var(--line); border-radius: 10px; color: var(--ink); background: var(--bg); outline: 0; }
.cloud-auth-card button { width: 100%; justify-content: center; margin-top: 10px; }
.cloud-auth-message { min-height: 18px; margin: 10px 0 0 !important; color: var(--red) !important; font-weight: 750; }
@media (max-width: 700px) { .item-row { grid-template-columns: 1fr 70px 34px; } .item-row .item-name { grid-column: 1 / -1; grid-row: 2; } }
html[data-theme="dark"] .search-box input { color: var(--ink); background: transparent; }
html[data-theme="dark"] .filter-bar select option,
html[data-theme="dark"] .form-grid select option { color: var(--ink); background: #171c24; }
html[data-theme="dark"] .table-card,
html[data-theme="dark"] .product-summary-card,
html[data-theme="dark"] .production-card { background: var(--surface); box-shadow: var(--shadow); }
html[data-theme="dark"] th,
html[data-theme="dark"] .table-footer { color: #919db0; background: #12171e; }
html[data-theme="dark"] td { border-color: #292f39; }
html[data-theme="dark"] tbody tr:hover { background: #1b212a; }
html[data-theme="dark"] .empty-state span,
html[data-theme="dark"] .priority-number { color: #a7b1c0; background: #272e38; }
html[data-theme="dark"] .product-toolbar .search-box { background: #141920; }
html[data-theme="dark"] .segmented { background: #222933; }
html[data-theme="dark"] .segmented button { color: #9da8ba; }
html[data-theme="dark"] .segmented button.active { color: #fff; background: #343c49; box-shadow: none; }
html[data-theme="dark"] .empty-board { border-color: #36404d; color: var(--muted); background: rgba(23,28,36,.7); }
html[data-theme="dark"] .channel-track { background: #2a313b; }
html[data-theme="dark"] .kpi-icon.revenue { color: #66d5dc; background: rgba(50,190,198,.15); }
html[data-theme="dark"] dialog { color: var(--ink); background: #171c24; }
html[data-theme="dark"] .integration-security-note { color: #94cfb7; border-color: #29483b; background: #15251f; }
html[data-theme="dark"] .tiktok-connection-loading,
html[data-theme="dark"] .tiktok-connection-empty,
html[data-theme="dark"] .tiktok-connection-card { border-color: #343d4a; background: #141920; }
html[data-theme="dark"] .items-section { background: #12171e; }
html[data-theme="dark"] .item-row .remove-item { color: #a0aabc; background: #282f39; }
html[data-theme="dark"] .product-picker-results { border-color: #343d4a; background: #1a2028; box-shadow: 0 18px 40px rgba(0,0,0,.34); }
html[data-theme="dark"] .product-date-cell,
html[data-theme="dark"] .product-name-cell span,
html[data-theme="dark"] .product-print-cell span { color: var(--muted); }
html[data-theme="dark"] .production-planner { border-color: #403751; background: linear-gradient(145deg, #171c24, #1b1825); box-shadow: var(--shadow); }
html[data-theme="dark"] .sales-dropzone { color: #c0afff; border-color: #665695; background: #211b2c; }
html[data-theme="dark"] .sales-dropzone:hover,
html[data-theme="dark"] .sales-dropzone.dragging { border-color: #9c83f4; background: #292136; }
html[data-theme="dark"] .daily-capacity-card { border-color: #403751; background: rgba(16,20,27,.58); }
html[data-theme="dark"] .daily-capacity-card label > span { color: #bac3d1; }
html[data-theme="dark"] .daily-capacity-card label > div { border-color: #3a4350; background: #12171e; }
html[data-theme="dark"] .daily-plan-summary { border-color: #403751; background: #141920; }
html[data-theme="dark"] .printer-sync-time { color: #a9b3c2; background: #252c36; }
html[data-theme="dark"] .bridge-banner { border-color: #403751; background: linear-gradient(145deg, #171c24, #1d1927); }
html[data-theme="dark"] .bridge-banner.online { border-color: #285742; background: linear-gradient(145deg, #171c24, #15251f); }
html[data-theme="dark"] .bridge-icon { background: rgba(130,103,255,.16); }
html[data-theme="dark"] .printer-fleet-summary article,
html[data-theme="dark"] .printer-monitor-card { background: var(--surface); box-shadow: var(--shadow); }
html[data-theme="dark"] .printer-card-icon,
html[data-theme="dark"] .printer-state-badge,
html[data-theme="dark"] .printer-metrics div { background: #242b35; }
html[data-theme="dark"] .printer-progress-track { background: #2a313b; }
html[data-theme="dark"] .printer-monitor-card.preparing .printer-state-badge { color: #75d7e4; background: rgba(35,143,161,.18); }
html[data-theme="dark"] .new-product-entry { border-color: #403751; background: linear-gradient(145deg, #171c24, #1b1825); box-shadow: var(--shadow); }
html[data-theme="dark"] .new-product-form label > span { color: #b5bfce; }
html[data-theme="dark"] .new-product-form input,
html[data-theme="dark"] .new-product-link-field > div { color: var(--ink); border-color: #343d4a; background: #141920; }
html[data-theme="dark"] .new-product-summary article { background: var(--surface); }
html[data-theme="dark"] .kanban-column { border-color: #303846; background: #11161d; }
html[data-theme="dark"] .kanban-column > header b { color: #a9b3c2; background: #272f39; }
html[data-theme="dark"] .new-product-card { border-color: #303846; background: #1a2028; box-shadow: var(--shadow); }
html[data-theme="dark"] .new-product-card.completed { border-color: #29483b; }
html[data-theme="dark"] .new-product-card > a { color: #c0b2ff; background: rgba(130,103,255,.15); }
html[data-theme="dark"] .new-product-card > a:hover { background: rgba(130,103,255,.23); }
html[data-theme="dark"] .reopen-product-button { color: #b6c0cf; background: #29313b; }
html[data-theme="dark"] .kanban-empty { border-color: #36404d; background: rgba(23,28,36,.7); }
html[data-theme="dark"] .kanban-empty span { color: #aab4c3; background: #29313b; }
html[data-theme="dark"] .kanban-empty strong { color: #aeb8c7; }
html[data-theme="dark"] .payable-entry { border-color: #403751; background: linear-gradient(145deg, #171c24, #1b1825); box-shadow: var(--shadow); }
html[data-theme="dark"] .financial-alert { color: #f3c97f; border-color: #5a492d; background: #282115; }
html[data-theme="dark"] .profit-rules-card { border-color: #403751; background: linear-gradient(145deg,#171c24,#1b1825); box-shadow: var(--shadow); }
html[data-theme="dark"] .profit-settings label > span { color: #b5bfce; }
html[data-theme="dark"] .profit-settings label > div,
html[data-theme="dark"] .profitability-filters input,
html[data-theme="dark"] .profitability-filters select { color: var(--ink); border-color: #343d4a; background: #141920; }
html[data-theme="dark"] .profit-settings input { color: var(--ink); }
html[data-theme="dark"] .profitability-filters select option { color: var(--ink); background: #171c24; }
html[data-theme="dark"] .profit-affiliate-control select { color: #d8b6ff; border-color: #5f4778; background: #251d2f; }
html[data-theme="dark"] .profitability-summary-grid article,
html[data-theme="dark"] .profitability-table-card { background: var(--surface); box-shadow: var(--shadow); }
html[data-theme="dark"] .profitability-warning { color: #f3c97f; border-color: #5a492d; background: #282115; }
html[data-theme="dark"] .profit-discount-input { color: #f5df79; border-color: #635b24; background: #292615; }
html[data-theme="dark"] .profit-rate-chip { color: #ff9bb3; background: rgba(236,79,117,.13); }
html[data-theme="dark"] .financial-view-tabs { background: #222933; }
html[data-theme="dark"] .payable-preview { border-color: #403751; background: #141920; }
html[data-theme="dark"] .payable-form label > span { color: #b5bfce; }
html[data-theme="dark"] .payable-form input,
html[data-theme="dark"] .payable-form select,
html[data-theme="dark"] .money-form-input { color: var(--ink); border-color: #343d4a; background: #141920; }
html[data-theme="dark"] .payable-form select option { color: var(--ink); background: #171c24; }
html[data-theme="dark"] .payables-filters select { border-color: #343d49; background: #171c24; }
html[data-theme="dark"] .money-form-input input { background: transparent; }
html[data-theme="dark"] .financial-summary-grid article,
html[data-theme="dark"] .cashflow-panel,
html[data-theme="dark"] .payables-list-section { background: var(--surface); box-shadow: var(--shadow); }
html[data-theme="dark"] .payables-month-tabs button { color: #aab4c3; border-color: #343d49; background: #242b35; }
html[data-theme="dark"] .payables-month-tabs button b { color: #aab4c3; background: #303844; }
html[data-theme="dark"] .payables-month-tabs button:hover,
html[data-theme="dark"] .payables-month-tabs button.active { color: #fff; border-color: var(--accent); background: var(--accent); }
html[data-theme="dark"] .payables-month-group > header { background: #12171e; }
html[data-theme="dark"] .payable-row.paid { background: rgba(33,168,117,.04); }
html[data-theme="dark"] .payable-row.overdue { background: rgba(223,82,97,.04); }
html[data-theme="dark"] .payable-product { color: #b5bfce; }
html[data-theme="dark"] .financial-empty { border-color: #36404d; background: #12171e; }
html[data-theme="dark"] .filament-entry { border-color: #33435c; background: linear-gradient(145deg,#171c24,#17202e); box-shadow: var(--shadow); }
html[data-theme="dark"] .filament-form label > span { color: #b5bfce; }
html[data-theme="dark"] .filament-form input,
html[data-theme="dark"] .filament-form select,
html[data-theme="dark"] .filament-unit-input { color: var(--ink); border-color: #343d4a; background: #141920; }
html[data-theme="dark"] .filament-form select option,
html[data-theme="dark"] .product-register-fields .dark-input select option { color: var(--ink); background: #171c24; }
html[data-theme="dark"] .filament-unit-input input { background: transparent; }
html[data-theme="dark"] .filament-summary-grid article,
html[data-theme="dark"] .filament-stock-section,
html[data-theme="dark"] .filament-history-section { background: var(--surface); box-shadow: var(--shadow); }
html[data-theme="dark"] .filament-card { background: #141920; }
html[data-theme="dark"] .filament-card.low { border-color: #5a492d; background: #211d16; }
html[data-theme="dark"] .filament-card.negative { border-color: #64333a; background: #25181b; }
html[data-theme="dark"] .filament-progress { background: #2a313b; }
html[data-theme="dark"] .filament-empty { border-color: #36404d; }

html[data-theme="light"] .cost-workspace { color: var(--ink); background: var(--canvas); }
html[data-theme="light"] .cost-workspace-header p { color: var(--muted); }
html[data-theme="light"] .dark-ghost-button { color: #5f6879; border-color: #dfe3ea; background: #fff; }
html[data-theme="light"] .dark-ghost-button:hover { color: var(--accent); border-color: #cfc5fb; background: #f5f2ff; }
html[data-theme="light"] .cost-builder-card,
html[data-theme="light"] .marketplace-comparison { border-color: var(--line); background: #fff; box-shadow: var(--shadow); }
html[data-theme="light"] .pricing-product-lookup { border-color: var(--line); background: #fff; box-shadow: var(--shadow); }
html[data-theme="light"] .pricing-lookup-copy h3 { color: var(--ink); }
html[data-theme="light"] .pricing-lookup-copy p { color: var(--muted); }
html[data-theme="light"] .pricing-product-found { border-color: #bfe9d7; background: #f1fbf6; }
html[data-theme="light"] .pricing-product-found strong { color: var(--ink); }
html[data-theme="light"] .pricing-product-found div > span { color: #738278; }
html[data-theme="light"] .pricing-found-cost strong { color: var(--green); }
html[data-theme="light"] .pricing-controls-grid { border-color: var(--line); background: #fafbfc; }
html[data-theme="light"] .pricing-psychological-toggle { border-color: #dfe3ea; background: #fff; }
html[data-theme="light"] .pricing-empty-state { border-color: #d7dce4; color: var(--muted); background: #fafbfc; }
html[data-theme="light"] .pricing-empty-state > span { color: #7252cd; background: #eee9ff; }
html[data-theme="light"] .pricing-empty-state strong { color: var(--ink); }
html[data-theme="light"] .sliced-file-import { border-color: #ded7f4; background: #faf9ff; }
html[data-theme="light"] .sliced-file-heading h3 { color: var(--ink); }
html[data-theme="light"] .sliced-file-heading p { color: var(--muted); }
html[data-theme="light"] .three-mf-dropzone { color: #5c46b4; border-color: #b8a8ef; background: #f1edff; }
html[data-theme="light"] .three-mf-dropzone:hover,
html[data-theme="light"] .three-mf-dropzone.dragging { border-color: var(--accent); background: #e9e3ff; }
html[data-theme="light"] .three-mf-dropzone small { color: #7d7192; }
html[data-theme="light"] .three-mf-result { border-color: #e2dced; }
html[data-theme="light"] .three-mf-result > div,
html[data-theme="light"] .three-mf-plate-field { border-color: #e0e4eb; background: #fff; }
html[data-theme="light"] .three-mf-result strong { color: var(--ink); }
html[data-theme="light"] .three-mf-plate-field select { color: var(--ink); }
html[data-theme="light"] .cost-workspace label > span,
html[data-theme="light"] .field-title > span,
html[data-theme="light"] .advanced-costs summary { color: #596477; }
html[data-theme="light"] .dark-input { border-color: #dfe3ea; background: #fff; }
html[data-theme="light"] .dark-input input { color: var(--ink); }
html[data-theme="light"] .dark-input b,
html[data-theme="light"] .dark-input em { color: #7d8798; }
html[data-theme="light"] .advanced-costs { border-color: var(--line); }
html[data-theme="light"] .product-register-box { border-color: #ded7f4; background: linear-gradient(145deg, #faf9ff, #f4f1ff); }
html[data-theme="light"] .product-register-header h3 { color: var(--ink); }
html[data-theme="light"] .product-cost-preview { border-color: #ded7f4; background: #fff; }
html[data-theme="light"] .product-cost-preview span { color: #80748d; }
html[data-theme="light"] .product-cost-preview strong { color: var(--ink); }
html[data-theme="light"] .psychological-toggle i { background: #d9dee7; }
html[data-theme="light"] .psychological-toggle i::after { background: #fff; box-shadow: 0 1px 4px rgba(25,34,52,.2); }
html[data-theme="light"] .psychological-toggle strong { color: #596477; }
html[data-theme="light"] .psychological-toggle small { color: #8791a2; }
html[data-theme="light"] .cost-origin { background: #f6f7fa; }
html[data-theme="light"] .cost-origin-title { color: #697589; }
html[data-theme="light"] .cost-origin > div { color: #637084; }
html[data-theme="light"] .cost-origin > div strong { color: var(--ink); }
html[data-theme="light"] .cost-origin > div small { color: #8a94a5; }
html[data-theme="light"] .cost-origin .cost-total-row { color: var(--ink); border-color: #dfe3e9; }
html[data-theme="light"] .marketplace-note { color: #655d70; border-color: #e2daf1; background: #faf7ff; }
html[data-theme="light"] .marketplace-price-card { border-color: #e0e4eb; background: #fafbfc; }
html[data-theme="light"] .market-identity small { color: #788497; }
html[data-theme="light"] .tiktok-fixed-fee { border-color: #e3d7de; background: #fff7f9; }
html[data-theme="light"] .tiktok-fixed-fee span { color: #907682; }
html[data-theme="light"] .tiktok-fixed-fee strong { color: #b33f60; }
html[data-theme="light"] .cost-chip { border-color: #dfe3ea; background: #f7f8fa; }
html[data-theme="light"] .cost-chip span { color: #768194; }
html[data-theme="light"] .cost-chip strong { color: var(--ink); }
html[data-theme="light"] .suggested-market-price strong { color: var(--ink); }
html[data-theme="light"] .market-profit-breakdown { border-color: #e1e5eb; }
html[data-theme="light"] .market-profit-breakdown > div { color: #687487; }
html[data-theme="light"] .market-profit-breakdown > div strong { color: #3f4a5b; }
html[data-theme="light"] .market-profit-breakdown .real-profit-row { color: #394456; border-color: #d9dee6; }
html[data-theme="light"] .market-profit-breakdown .real-profit-row strong { color: #13865e; }
html[data-theme="light"] .market-profit-breakdown .affiliate-fee-row,
html[data-theme="light"] .market-profit-breakdown .affiliate-fee-row strong { color: #b33f60; }
html[data-theme="light"] .market-profit-breakdown .shipping-fee-row,
html[data-theme="light"] .market-profit-breakdown .shipping-fee-row strong { color: #247a8b; }
html[data-theme="light"] .mini-fee div { border-color: #dfe3ea; background: #fff; }
html[data-theme="light"] .mini-fee input { color: var(--ink); }

/* SaaS visual refresh — global shell + dashboard */
:root {
  --ink: #111827;
  --muted: #697386;
  --line: #e7ebf2;
  --surface: #ffffff;
  --canvas: #f4f7fb;
  --navy: #111827;
  --accent: #1268f3;
  --accent-dark: #0b55cf;
  --accent-soft: #eaf2ff;
  --cyan: #10bfe8;
  --cyan-soft: #e8faff;
  --green: #16a36a;
  --green-soft: #eaf9f2;
  --amber: #e49a16;
  --amber-soft: #fff7e7;
  --red: #db4254;
  --red-soft: #fff0f2;
  --shadow: 0 12px 34px rgba(31, 49, 82, .06);
}

body { font-size: 16px; letter-spacing: -.01em; }
.app-shell { grid-template-columns: 224px minmax(0, 1fr); }
.sidebar { padding: 24px 14px 18px; background: #fff; color: var(--ink); border-right: 1px solid var(--line); }
.brand { padding: 0 9px 27px; }
.brand-mark { border-radius: 13px; background: linear-gradient(145deg, #176df5, #10bfe8); box-shadow: 0 9px 24px rgba(18,104,243,.24); }
.brand strong { color: #111827; }
.brand small { color: #8791a3; }
.nav { gap: 5px; }
.nav-item { min-height: 42px; border-radius: 10px; color: #6b7485; font-size: 13px; font-weight: 650; }
.nav-item:hover { color: #125ed9; background: #f2f6fd; }
.nav-item.active { color: #fff; background: linear-gradient(100deg, #1268f3, #10b8e3); box-shadow: 0 7px 18px rgba(18,104,243,.18); }
.nav-item.active svg { color: #fff; }
.nav-item b { background: #eef2f7; color: #6d7788; }
.nav-item.active b { background: rgba(255,255,255,.2); color: #fff; }
.integration-button, .appearance-button { color: #667085; border-color: var(--line); background: #f8fafc; }
.integration-button:hover, .appearance-button:hover, .appearance-control.open .appearance-button { color: var(--accent); border-color: #bed4ff; background: #eef5ff; }
.integration-button small, .appearance-button small { color: #8b95a5; }
.appearance-main-icon { color: var(--accent); }
.theme-menu { border-color: var(--line); background: #fff; box-shadow: 0 18px 45px rgba(30,45,70,.16); }
.theme-menu > button { color: #637083; }
.theme-menu > button:hover, .theme-menu > button.active { color: var(--accent); background: var(--accent-soft); }
.theme-menu strong { color: var(--ink); }
.theme-menu i { background: #edf1f6; }
.sidebar-note { border-top-color: var(--line); }
.sidebar-note strong { color: var(--ink); }
.sidebar-note small { color: #8a94a4; }
.cloud-signout { color: #788395; }

.topbar { height: 88px; padding: 0 34px; background: rgba(255,255,255,.9); box-shadow: 0 1px 0 var(--line); }
.topbar h1 { font-size: 25px; }
.content { padding: 28px 34px 48px; max-width: 1540px; }
.primary-button { border-radius: 999px; background: linear-gradient(100deg, #1268f3, #0abde6); box-shadow: 0 8px 20px rgba(18,104,243,.2); }
.panel, .table-card { border-color: var(--line); border-radius: 20px; box-shadow: var(--shadow); }

.dashboard-heading { margin-bottom: 22px; display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; }
.dashboard-heading h2 { margin: 7px 0 5px; font-size: 29px; letter-spacing: -.8px; }
.dashboard-heading p { margin: 0; color: var(--muted); font-size: 14px; }
.dashboard-live { padding: 8px 12px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid #cfeedd; border-radius: 999px; color: #168158; background: #f2fbf7; font-size: 12px; font-weight: 750; }
.dashboard-live i { width: 7px; height: 7px; border-radius: 50%; background: #20b879; box-shadow: 0 0 0 4px rgba(32,184,121,.1); }

.kpi-grid { margin: 0 0 16px; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.kpi-card { min-height: 150px; padding: 21px; align-items: flex-start; border-radius: 20px; box-shadow: var(--shadow); }
.kpi-card > span:last-child { min-width: 0; }
.kpi-icon { width: 42px; height: 42px; border-radius: 50%; }
.kpi-icon.blue { color: #1268f3; background: #eaf2ff; }
.kpi-icon.cyan { color: #079bbc; background: #e8faff; }
.kpi-card small { font-size: 13px; }
.kpi-card strong, .revenue-card strong { margin: 14px 0 5px; font-size: clamp(24px, 2vw, 34px); white-space: nowrap; }
.kpi-card em { font-size: 12px; line-height: 1.4; }
.kpi-card strong.negative { color: var(--red); }

.dashboard-status-strip { margin-bottom: 16px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.dashboard-status-strip button { min-height: 52px; padding: 0 16px; display: flex; align-items: center; gap: 9px; border: 1px solid var(--line); border-radius: 14px; color: var(--muted); background: rgba(255,255,255,.72); cursor: pointer; transition: .18s ease; }
.dashboard-status-strip button:hover { border-color: #bdd2f8; background: #fff; transform: translateY(-1px); }
.dashboard-status-strip small { font-size: 12px; font-weight: 700; }
.dashboard-status-strip strong { margin-left: auto; color: var(--ink); font-size: 17px; }
.status-dot { width: 9px; height: 9px; border-radius: 50%; }
.status-dot.pending { background: var(--amber); }
.status-dot.done { background: var(--green); }
.status-dot.overdue { background: var(--red); }

.dashboard-analytics-grid { margin-bottom: 16px; display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(290px, .75fr); gap: 16px; }
.panel-header { padding: 22px 24px 17px; }
.panel-header h3 { font-size: 17px; letter-spacing: -.25px; }
.chart-legend { display: flex; gap: 13px; color: var(--muted); font-size: 11px; font-weight: 700; }
.chart-legend span { display: inline-flex; align-items: center; gap: 6px; }
.chart-legend i { width: 8px; height: 8px; border-radius: 3px; }
.chart-legend i.sales { background: var(--accent); }
.chart-legend i.profit { background: var(--cyan); }
.dashboard-sales-chart { min-height: 260px; padding: 16px 24px 23px; display: grid; grid-template-columns: repeat(7, minmax(36px, 1fr)); align-items: end; gap: 12px; border-top: 1px solid #f0f2f6; background: linear-gradient(to top, rgba(18,104,243,.018), transparent); }
.dashboard-chart-day { min-width: 0; text-align: center; }
.dashboard-chart-bars { height: 185px; display: flex; align-items: flex-end; justify-content: center; gap: 5px; }
.dashboard-chart-bars i { width: min(18px, 36%); min-height: 3px; display: block; border-radius: 6px 6px 2px 2px; transition: height .45s ease; }
.dashboard-chart-bars i.sales { background: linear-gradient(#1776ff, #1268f3); }
.dashboard-chart-bars i.profit { background: linear-gradient(#19caeb, #09a8d0); }
.dashboard-chart-bars i.profit.negative { background: var(--red); }
.dashboard-chart-day strong, .dashboard-chart-day small { display: block; }
.dashboard-chart-day strong { margin-top: 9px; color: #687386; font-size: 11px; text-transform: capitalize; }
.dashboard-chart-day small { margin-top: 2px; color: #a0a8b5; font-size: 10px; }
.dashboard-chart-empty { grid-column: 1 / -1; min-height: 160px; display: grid; place-content: center; gap: 5px; color: var(--muted); text-align: center; }
.dashboard-chart-empty strong { color: var(--ink); font-size: 14px; }
.dashboard-chart-empty span { font-size: 12px; }
.channel-panel .channel-list { padding-top: 8px; }
.channel-track { height: 8px; background: #edf2f8; }
.channel-fill { background: linear-gradient(90deg, #1268f3, #10c0e8); }

.production-overview-panel { margin-bottom: 16px; }
.production-overview { padding: 0 24px 24px; }
.production-overview-summary { margin-bottom: 16px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.production-overview-summary > div { padding: 14px 16px; border-radius: 13px; background: #f6f9fd; }
.production-overview-summary span, .production-overview-summary strong { display: block; }
.production-overview-summary span { color: var(--muted); font-size: 11px; }
.production-overview-summary strong { margin-top: 5px; font-size: 20px; }
.machine-load-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.machine-load-grid article { padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.machine-load-grid article > div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.machine-load-grid span { color: var(--muted); font-size: 11px; font-weight: 700; }
.machine-load-grid strong { font-size: 13px; }
.machine-load-grid small { display: block; margin-top: 7px; color: #929cac; font-size: 10px; }
.machine-load-track { height: 7px; margin-top: 11px; overflow: hidden; border-radius: 999px; background: #edf2f7; }
.machine-load-track i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #1268f3, #11c3e8); }

.dashboard-grid { grid-template-columns: minmax(0, 1.25fr) minmax(340px, .9fr); gap: 16px; }
.queue-row { grid-template-columns: 34px minmax(0, 1fr) 94px 105px; }
.recent-orders-list { padding: 0 20px 14px; }
.recent-orders-list > button { width: 100%; min-height: 64px; padding: 10px 4px; display: grid; grid-template-columns: 36px minmax(0, 1fr) auto auto; gap: 10px; align-items: center; border: 0; border-top: 1px solid var(--line); text-align: left; background: transparent; cursor: pointer; }
.recent-orders-list > button:hover { background: #f8faff; }
.recent-order-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 11px; color: var(--accent); background: var(--accent-soft); }
.recent-order-copy { min-width: 0; }
.recent-order-copy strong, .recent-order-copy small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.recent-order-copy strong { font-size: 12px; }
.recent-order-copy small { margin-top: 4px; color: var(--muted); font-size: 10px; }
.recent-order-value { font-size: 12px; font-weight: 800; }
.status-pill { padding: 6px 8px; border-radius: 999px; font-size: 9px; font-weight: 850; }
.status-pill.status-pending { color: #ad7208; background: var(--amber-soft); }
.status-pill.status-production { color: #087d9a; background: var(--cyan-soft); }
.status-pill.status-done { color: #147c56; background: var(--green-soft); }

.admin-nav-item b { color: #245eae; background: #e9f2ff; }
.admin-section-intro { align-items: center; }
.admin-role-badge { min-height: 38px; padding: 0 13px; display: inline-flex; align-items: center; gap: 8px; color: #245fae; border: 1px solid #cfe0f8; border-radius: 11px; background: #eef5ff; font-size: 11px; font-weight: 850; }
.admin-role-badge svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.admin-summary-grid { margin-bottom: 16px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.admin-summary-grid article { min-height: 120px; padding: 22px; display: flex; align-items: center; gap: 15px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); box-shadow: var(--shadow); }
.admin-summary-icon { width: 46px; height: 46px; display: grid; place-items: center; flex: 0 0 auto; color: #2568d8; border-radius: 13px; background: #eaf2ff; }
.admin-summary-icon.users { color: #07869f; background: #e7f8fb; }
.admin-summary-icon svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.admin-summary-grid small,.admin-summary-grid strong,.admin-summary-grid em { display: block; }
.admin-summary-grid small { color: var(--muted); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.admin-summary-grid strong { margin-top: 5px; overflow-wrap: anywhere; font-size: 17px; }
.admin-summary-grid em { margin-top: 4px; color: #8b97a8; font-size: 10px; font-style: normal; }
.admin-grid { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(360px,.95fr); gap: 16px; }
.admin-settings-panel,.admin-users-panel { overflow: hidden; }
.admin-settings-panel .panel-header,.admin-users-panel .panel-header { padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.admin-settings-panel .panel-header p,.admin-users-panel .panel-header p { margin: 6px 0 0; color: var(--muted); font-size: 11px; }
.admin-settings-form { padding: 22px; display: grid; gap: 16px; }
.admin-settings-form label > span { display: block; margin-bottom: 7px; color: var(--muted); font-size: 11px; font-weight: 800; }
.admin-settings-form label > div { height: 45px; padding: 0 13px; display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 11px; background: var(--canvas); }
.admin-settings-form input { width: 100%; color: var(--ink); border: 0; outline: 0; background: transparent; font: inherit; font-weight: 800; }
.admin-settings-form em { color: var(--muted); font-size: 11px; font-style: normal; }
.admin-settings-form label > small { display: block; margin-top: 6px; color: #8b97a8; font-size: 10px; }
.admin-settings-form .primary-button { justify-self: start; }
.admin-form-message { min-height: 18px; margin: 0; color: #34715d; font-size: 11px; font-weight: 700; }
.admin-user-list { padding: 8px 22px 18px; }
.admin-user-list > article { min-height: 66px; padding: 10px 0; display: grid; grid-template-columns: 38px minmax(0,1fr) auto; align-items: center; gap: 11px; border-bottom: 1px solid var(--line); }
.admin-user-avatar { width: 36px; height: 36px; display: grid; place-items: center; color: #fff; border-radius: 11px; background: linear-gradient(145deg,#2368da,#20aee1); font-size: 13px; font-weight: 900; }
.admin-user-list strong,.admin-user-list small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.admin-user-list strong { font-size: 12px; }.admin-user-list small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.admin-user-role { padding: 6px 9px; color: #64748a; border-radius: 999px; background: #eef1f5; font-size: 9px; text-transform: uppercase; }
.admin-user-role.is-admin { color: #245fae; background: #e8f1ff; }
.admin-metric-grid { margin-bottom: 16px; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; }
.admin-metric-grid article { min-height: 112px; padding: 20px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); box-shadow: var(--shadow); }
.admin-metric-grid small,.admin-metric-grid strong,.admin-metric-grid span { display: block; }
.admin-metric-grid small { color: var(--muted); font-size: 10px; font-weight: 850; text-transform: uppercase; }
.admin-metric-grid strong { margin-top: 7px; color: #2166d5; font-size: 27px; }
.admin-metric-grid span { margin-top: 3px; color: #8a96a8; font-size: 10px; }
.admin-grid-secondary { margin-top: 16px; }
.admin-marketplace-panel,.admin-integrations-panel,.admin-system-panel,.admin-audit-panel { overflow: hidden; }
.admin-marketplace-panel .panel-header,.admin-integrations-panel .panel-header,.admin-system-panel .panel-header,.admin-audit-panel .panel-header { padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.admin-marketplace-panel .panel-header p,.admin-integrations-panel .panel-header p,.admin-audit-panel .panel-header p { margin: 6px 0 0; color: var(--muted); font-size: 11px; }
.admin-marketplace-list { padding: 20px 22px; }
.admin-marketplace-list > article { padding: 17px; border: 1px solid var(--line); border-radius: 14px; background: var(--canvas); }
.admin-marketplace-heading { display: flex; align-items: center; gap: 11px; }
.admin-marketplace-heading strong,.admin-marketplace-heading small { display: block; }.admin-marketplace-heading strong { font-size: 13px; }.admin-marketplace-heading small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.admin-fee-grid { margin-top: 17px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.admin-fee-grid > span { padding: 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.admin-fee-grid small,.admin-fee-grid strong { display: block; }.admin-fee-grid small { color: var(--muted); font-size: 9px; }.admin-fee-grid strong { margin-top: 3px; font-size: 11px; }
.admin-marketplace-list p { margin: 13px 0 0; color: var(--muted); font-size: 10px; line-height: 1.5; }
.admin-integration-list { padding: 8px 22px 18px; }
.admin-integration-list article { min-height: 68px; padding: 10px 0; display: grid; grid-template-columns: 38px minmax(0,1fr) auto; align-items: center; gap: 11px; border-bottom: 1px solid var(--line); }
.admin-integration-icon { width: 36px; height: 36px; display: grid; place-items: center; color: #fff; border-radius: 11px; font-size: 14px; font-weight: 900; }.admin-integration-icon.supabase { background:#28a985; }.admin-integration-icon.tiktok { background:#172033; }
.admin-integration-list strong,.admin-integration-list small { display: block; }.admin-integration-list strong { font-size: 12px; }.admin-integration-list small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.connection-state { padding: 6px 9px; color: #6d7788; border-radius: 999px; background: #edf0f4; font-size: 9px; }.connection-state.connected { color: #147d59; background: #e5f8f0; }.connection-state.attention { color: #a36d0d; background: #fff3d7; }
.admin-system-panel,.admin-audit-panel { margin-top: 16px; }
.admin-version { color: var(--muted); font-size: 10px; font-weight: 750; }
.admin-system-details { padding: 20px 22px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.admin-system-details > div { padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--canvas); }.admin-system-details span,.admin-system-details strong { display: block; }.admin-system-details span { color: var(--muted); font-size: 9px; }.admin-system-details strong { margin-top: 5px; overflow-wrap:anywhere; font-size: 12px; }
.admin-user-message { min-height: 18px; margin: 0 22px 16px; color: #34715d; font-size: 10px; font-weight: 700; }
.admin-role-select select { min-width: 92px; height: 35px; padding: 0 9px; color: var(--ink); border: 1px solid var(--line); border-radius: 9px; background: var(--canvas); font-size: 10px; font-weight: 800; }
.admin-role-select select:disabled { cursor: not-allowed; opacity:.58; }
.admin-audit-list { padding: 6px 22px 18px; }
.admin-audit-list > article { min-height: 70px; padding: 11px 0; display: grid; grid-template-columns: 36px minmax(0,1fr) auto; align-items: center; gap: 11px; border-bottom: 1px solid var(--line); }
.admin-audit-icon { width: 34px; height: 34px; display:grid; place-items:center; color:#2468d9; border-radius:10px; background:#eaf2ff; }.admin-audit-icon svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2; }
.admin-audit-list strong,.admin-audit-list small,.admin-audit-list > article > span:last-child b { display:block; }.admin-audit-list strong { font-size:11px; }.admin-audit-list small { margin-top:3px; color:var(--muted); font-size:9px; }.admin-audit-list > article > span:last-child { text-align:right; }.admin-audit-list > article > span:last-child b { font-size:10px; }
.sr-only { width:1px; height:1px; padding:0; margin:-1px; position:absolute; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
html[data-theme="dark"] .admin-role-badge,html[data-theme="dark"] .admin-nav-item b,html[data-theme="dark"] .admin-user-role.is-admin { color: #83b8ff; border-color: #29476c; background: #1a304e; }
html[data-theme="dark"] .admin-summary-icon { background: #1a304e; } html[data-theme="dark"] .admin-summary-icon.users { background: #15343c; }
html[data-theme="dark"] .admin-user-role { background: #263142; }
html[data-theme="dark"] .connection-state { background:#273244; } html[data-theme="dark"] .connection-state.connected { color:#6ed4a9; background:#18382f; } html[data-theme="dark"] .connection-state.attention { color:#e7bd68; background:#42351c; }
html[data-theme="dark"] .admin-audit-icon { background:#1a304e; }
.admin-tabs { margin: 0 0 18px; padding: 6px; display:flex; gap:5px; overflow-x:auto; border:1px solid var(--line); border-radius:14px; background:var(--surface); box-shadow:var(--shadow); scrollbar-width:thin; }
.admin-tabs button { min-height:38px; padding:0 13px; flex:0 0 auto; color:var(--muted); border:0; border-radius:10px; background:transparent; font:inherit; font-size:10px; font-weight:800; cursor:pointer; }
.admin-tabs button:hover,.admin-tabs button.active { color:#2468d9; background:#eaf2ff; }
.admin-tab-panel { display:none; }.admin-tab-panel.active { display:block; animation:admin-panel-in .18s ease-out; }
@keyframes admin-panel-in { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:none; } }
.admin-metric-grid-wide { grid-template-columns:repeat(4,minmax(0,1fr)); }
.admin-machines-panel,.admin-config-panel { overflow:hidden; }
.admin-machines-panel .panel-header,.admin-config-panel .panel-header { padding-bottom:16px; border-bottom:1px solid var(--line); }
.admin-machine-form { margin:16px 22px 8px; padding:15px; display:grid; grid-template-columns:1fr 1fr auto auto; align-items:end; gap:10px; border:1px solid #cfe0f8; border-radius:13px; background:#f6faff; }
.admin-machine-form[hidden] { display:none; }
.admin-machine-form label > span { display:block; margin-bottom:6px; color:var(--muted); font-size:9px; font-weight:800; }
.admin-machine-form input[type="text"],.admin-machine-form input:not([type]) { width:100%; height:38px; padding:0 10px; color:var(--ink); border:1px solid var(--line); border-radius:9px; background:var(--surface); }
.admin-machine-form .admin-check { height:38px; display:flex; align-items:center; gap:6px; }
.admin-machine-list { padding:7px 22px 16px; }
.admin-machine-list article { min-height:62px; padding:10px 0; display:grid; grid-template-columns:minmax(0,1fr) auto auto; align-items:center; gap:10px; border-bottom:1px solid var(--line); }
.admin-machine-list strong,.admin-machine-list small { display:block; }.admin-machine-list strong { font-size:12px; }.admin-machine-list small { margin-top:3px; color:var(--muted); font-size:9px; }
.machine-state { padding:6px 9px; color:#8a5b11; border-radius:999px; background:#fff2cf; font-size:9px; font-weight:800; }.machine-state.ready { color:#16775c; background:#e1f7ef; }
.ghost-button.compact { min-height:31px; padding:0 9px; font-size:9px; }
.admin-config-list { padding:18px 22px; display:grid; gap:10px; }
.admin-config-list article { padding:15px; border:1px solid var(--line); border-radius:12px; background:var(--canvas); }
.admin-config-list p { margin:9px 0 0; color:var(--muted); font-size:10px; line-height:1.6; }
.config-class { padding:5px 8px; display:inline-flex; border-radius:999px; font-size:9px; font-weight:850; }.config-class.safe { color:#176e56; background:#e1f7ef; }.config-class.internal { color:#7b5a12; background:#fff2cf; }.config-class.sensitive { color:#a43b4b; background:#feecef; }
.admin-audit-filters { padding:14px 22px 4px; display:grid; grid-template-columns:1.15fr 1fr 1fr .8fr .8fr; gap:8px; }
.admin-audit-filters select,.admin-audit-filters input { min-width:0; height:38px; padding:0 9px; color:var(--ink); border:1px solid var(--line); border-radius:9px; background:var(--canvas); font:inherit; font-size:9px; }
.admin-confirm-icon { color:#2468d9; background:#eaf2ff; }
html[data-theme="dark"] .admin-tabs button:hover,html[data-theme="dark"] .admin-tabs button.active,html[data-theme="dark"] .admin-confirm-icon { color:#83b8ff; background:#1a304e; }
html[data-theme="dark"] .admin-machine-form { border-color:#29476c; background:#142238; }
html[data-theme="dark"] .machine-state { color:#ffd778; background:#3d321a; } html[data-theme="dark"] .machine-state.ready { color:#79e3bf; background:#153a31; }

html[data-theme="dark"] {
  --ink: #f3f6fb; --muted: #99a5b7; --line: #293447; --surface: #171f2c; --canvas: #101722;
  --accent: #3c83f7; --accent-dark: #2871eb; --accent-soft: #1c3152; --shadow: 0 14px 36px rgba(0,0,0,.2);
}
html[data-theme="dark"] .sidebar { color: var(--ink); background: #141c28; border-color: var(--line); }
html[data-theme="dark"] .brand strong, html[data-theme="dark"] .theme-menu strong { color: var(--ink); }
html[data-theme="dark"] .nav-item b, html[data-theme="dark"] .integration-button, html[data-theme="dark"] .appearance-button { background: #1a2432; border-color: #2b3749; }
html[data-theme="dark"] .theme-menu { border-color: var(--line); background: #182231; }
html[data-theme="dark"] .topbar { background: rgba(20,28,40,.9); }
html[data-theme="dark"] .dashboard-live { color: #71d4ab; border-color: #265542; background: #162c25; }
html[data-theme="dark"] .dashboard-status-strip button, html[data-theme="dark"] .machine-load-grid article { background: var(--surface); }
html[data-theme="dark"] .dashboard-status-strip button:hover, html[data-theme="dark"] .recent-orders-list > button:hover { background: #1b2737; }
html[data-theme="dark"] .production-overview-summary > div { background: #131b27; }
html[data-theme="dark"] .channel-track, html[data-theme="dark"] .machine-load-track { background: #253143; }
html[data-theme="dark"] .dashboard-sales-chart { border-color: #253143; }

@media (max-width: 1200px) {
  .kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-analytics-grid, .dashboard-grid { grid-template-columns: 1fr; }
  .admin-grid { grid-template-columns: 1fr; }
  .admin-metric-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .admin-machine-form { grid-template-columns:1fr 1fr; }
  .admin-audit-filters { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 1050px) {
  .app-shell { grid-template-columns: 76px minmax(0,1fr); }
  .sidebar { padding-inline: 12px; }
}
@media (max-width: 760px) {
  .sidebar { background: #fff; border-color: var(--line); }
  html[data-theme="dark"] .sidebar { background: #141c28; }
  .nav-item { color: #697487; }
  .nav-item.active { color: #fff; }
  .content { padding: 20px 15px 34px; }
  .dashboard-heading { align-items: flex-start; flex-direction: column; }
  .dashboard-heading h2 { font-size: 25px; }
  .kpi-grid { grid-template-columns: 1fr 1fr; }
  .kpi-card { min-height: 126px; padding: 16px; display: block; }
  .kpi-icon { width: 36px; height: 36px; }
  .kpi-card strong, .revenue-card strong { margin-top: 11px; font-size: 22px; }
  .kpi-card em { display: block; font-size: 10px; }
  .dashboard-status-strip { grid-template-columns: 1fr; }
  .dashboard-sales-chart { min-height: 220px; padding-inline: 13px; gap: 5px; }
  .dashboard-chart-bars { height: 145px; }
  .production-overview-summary { grid-template-columns: 1fr; }
  .machine-load-grid { grid-template-columns: 1fr 1fr; }
  .admin-summary-grid { grid-template-columns: 1fr; }
  .admin-system-details { grid-template-columns: 1fr; }
  .queue-row { grid-template-columns: 30px minmax(0, 1fr) 96px; }
  .queue-row .market-badge { display: none; }
}
@media (max-width: 470px) {
  .topbar { padding-inline: 15px; }
  .kpi-grid { grid-template-columns: 1fr; }
  .kpi-card { min-height: 112px; display: flex; }
  .machine-load-grid { grid-template-columns: 1fr; }
  .recent-orders-list > button { grid-template-columns: 34px minmax(0,1fr) auto; }
  .recent-order-value { display: none; }
  .status-pill { grid-column: 2 / -1; justify-self: start; }
  .admin-metric-grid { grid-template-columns: 1fr; }
  .admin-fee-grid { grid-template-columns: 1fr; }
  .admin-audit-list > article { grid-template-columns: 34px minmax(0,1fr); }.admin-audit-list > article > span:last-child { grid-column:2; text-align:left; }
  .admin-machine-form,.admin-audit-filters { grid-template-columns:1fr; }
  .admin-machine-list article { grid-template-columns:minmax(0,1fr) auto; }.admin-machine-list article .ghost-button { grid-column:1/-1; justify-self:start; }
}

/* === NP3D Dashboard fidelity pass 2026-09-25 === */
@media (min-width: 821px) {
  body.dashboard-mode { background:#f4f8fd; }
  .app-shell { display:block; padding-top:64px; }
  .sidebar.top-navigation { position:fixed; inset:0 0 auto 0; z-index:100; width:100%; height:64px; padding:0 22px; display:flex; flex-direction:row; align-items:center; gap:14px; border:0; border-bottom:1px solid #e5edf7; background:rgba(255,255,255,.97); box-shadow:0 3px 16px rgba(30,64,110,.055); backdrop-filter:blur(14px); }
  .top-navigation .brand { min-width:205px; padding:0; gap:10px; display:flex; align-items:center; }
  .top-navigation .brand-mark { width:38px; height:38px; border-radius:11px; }
  .top-navigation .brand strong { color:#07163d; font-size:19px; line-height:1; }
  .top-navigation .brand small { margin-top:4px; color:#7b8ba5; font-size:9px; letter-spacing:2px; }
  .top-navigation .nav { min-width:0; flex:1; display:flex; align-items:center; gap:2px; overflow:visible; }
  .top-navigation .nav-item,.nav-more summary { min-height:40px; padding:0 8px; gap:6px; flex:0 0 auto; border-radius:10px; color:#213454; font-size:13px; font-weight:600; white-space:nowrap; }
  .top-navigation .nav-item svg { display:block; width:16px; height:16px; }
  .top-navigation .nav-item b { display:none; }
  .top-navigation .nav-item:hover { color:#0877f9; background:#f0f6ff; }
  .top-navigation .nav-item.active { color:#0877f9; background:#e8f3ff; box-shadow:none; }
  .top-navigation .nav-item.active svg { color:#0877f9; }
  .nav-more { display:none; }
  .top-actions { display:flex; margin-left:auto; gap:4px; }
  .top-actions button { width:36px; height:36px; }
  .profile-control { margin-left:0; }
  .profile-button { height:46px; gap:8px; }
  .profile-avatar { width:38px; height:38px; }
  .profile-button > span:nth-child(2) { display:block; min-width:92px; }
  .profile-button strong { max-width:120px; font-size:12px; }
  .profile-button small { font-size:10px; }
  .integration-button,.appearance-control,.sidebar-note { display:none !important; }

  .dashboard-mode .topbar { display:none !important; }
  .dashboard-mode .content { width:100%; max-width:none; margin:0; padding:20px 28px 30px; }
  .view-overview { width:100%; }

  .dashboard-hero-grid { margin:0 0 14px; display:grid; grid-template-columns:minmax(0, 3.15fr) minmax(300px, 1fr); gap:14px; }
  .dashboard-hero,.dashboard-day-card { height:190px; min-height:190px; border:1px solid #e6edf6; border-radius:17px; box-shadow:0 7px 22px rgba(38,72,116,.05); }
  .dashboard-hero { padding:20px 28px; background:linear-gradient(118deg,#fff 0%,#fbfdff 47%,#dceeff 100%); }
  .hero-copy { max-width:660px; }
  .hero-copy > strong { font-size:13px; }
  .hero-copy h2 { margin:6px 0 1px; font-size:36px; line-height:1.05; letter-spacing:-1.4px; }
  .hero-copy h3 { margin:0; font-size:21px; line-height:1.2; }
  .hero-copy p { max-width:610px; margin:7px 0 0; font-size:14px; line-height:1.45; }
  .dashboard-live { display:none !important; }
  .hero-visual { width:38%; }
  .hero-printer { right:74px; bottom:18px; width:128px; height:110px; border-width:7px; }
  .hero-printer:before { inset:23px 19px 16px; border-width:4px; border-top-width:8px; }
  .hero-printer i { left:40px; bottom:18px; width:34px; height:20px; }
  .hero-printer b { left:51px; bottom:20px; font-size:11px; }
  .hero-spool { right:22px; width:40px; height:40px; border-width:7px; }
  .hero-spool.one { bottom:68px; }.hero-spool.two { bottom:21px; }
  .dashboard-day-card { padding:11px; display:grid; grid-template-rows:42px 1fr; gap:9px; }
  .dashboard-date { min-height:42px; padding:0 12px; border-radius:11px; }
  .dashboard-date strong { font-size:12px; }
  .dashboard-tip { padding:13px; gap:10px; border-radius:12px; }
  .dashboard-tip > span { width:32px; height:32px; }
  .dashboard-tip strong { font-size:13px; }.dashboard-tip p { margin-top:5px; font-size:11px; line-height:1.35; }

  .kpi-grid { margin:0 0 14px; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
  .kpi-card { min-height:112px; height:112px; padding:15px 17px; align-items:center; gap:14px; border:1px solid #e6edf6; border-radius:16px; box-shadow:0 7px 22px rgba(38,72,116,.045); }
  .kpi-icon { width:46px; height:46px; flex:0 0 46px; border-radius:12px; }
  .kpi-card small { font-size:13px; font-weight:700; }
  .kpi-card strong,.revenue-card strong { margin:3px 0 2px; font-size:28px; line-height:1.05; }
  .kpi-card em { font-size:10px; line-height:1.2; }
  .compact-status-strip { display:none !important; }

  .dashboard-analytics-grid { margin:0 0 14px; display:grid; grid-template-columns:minmax(0,1.35fr) minmax(260px,.82fr) minmax(330px,1fr); gap:14px; }
  .dashboard-analytics-grid > .panel { height:238px; min-height:238px; margin:0; overflow:hidden; border:1px solid #e6edf6; border-radius:16px; box-shadow:0 7px 22px rgba(38,72,116,.045); }
  .panel-header { min-height:52px; padding:12px 16px 9px; }
  .view-overview .panel-header .tag { display:none; }
  .view-overview .panel-header h3 { margin:0; font-size:16px; letter-spacing:-.25px; }
  .chart-legend { padding:5px 8px; gap:9px; font-size:10px; border-radius:8px; }
  .dashboard-sales-chart { height:184px; min-height:0; padding:8px 16px 11px; gap:8px; }
  .dashboard-chart-bars { height:124px; }
  .dashboard-chart-day strong { margin-top:4px; font-size:9px; }.dashboard-chart-day small { font-size:8px; }
  .channel-panel .channel-list,.channel-list { height:184px; min-height:0; padding:6px 16px 11px; grid-template-columns:120px minmax(0,1fr); gap:12px; }
  .channel-donut { width:116px; height:116px; }.channel-donut:before { width:74px; height:74px; }.channel-donut strong { font-size:21px; }
  .channel-legend { gap:8px; }.channel-legend span { font-size:10px; }.channel-legend strong { font-size:11px; }
  .production-overview { padding:0 12px 10px; }
  .production-overview-summary { margin:0; padding:4px 0 2px; gap:5px; }
  .production-overview-summary > div { padding:6px 7px; }
  .production-overview-summary span { font-size:8px; }.production-overview-summary strong { margin-top:1px; font-size:12px; }
  .machine-load-grid { padding:3px 0 0; display:grid; grid-template-columns:1fr; gap:3px; }
  .dashboard-machine-row { min-height:34px; padding:3px 7px; grid-template-columns:24px minmax(0,1fr) auto; gap:6px; border-radius:8px; }
  .machine-icon { width:23px; height:23px; }.dashboard-machine-row strong { font-size:9px; }.dashboard-machine-row small { font-size:7px; }
  .dashboard-machine-row .machine-load-track { height:4px; margin-top:2px; }.dashboard-machine-row .machine-state { padding:3px 6px; font-size:7px; }

  .dashboard-grid { margin:0; display:grid; grid-template-columns:minmax(0,1.72fr) minmax(340px,.95fr); gap:14px; }
  .recent-orders-panel { grid-column:1; grid-row:1; }.queue-panel { grid-column:2; grid-row:1; }
  .dashboard-grid > .panel { min-height:0; border:1px solid #e6edf6; border-radius:16px; box-shadow:0 7px 22px rgba(38,72,116,.045); }
  .recent-orders-list,.queue-list { padding:0 16px 10px; }
  .recent-table-wrap th { height:31px; padding:5px 8px; font-size:9px; }.recent-table-wrap td { height:36px; padding:5px 8px; font-size:9px; }
  .recent-table-wrap .status-pill { font-size:8px; padding:4px 7px; }
  .queue-row { min-height:38px; padding:4px 4px 4px 11px; }
  .queue-row:before { top:5px; bottom:5px; }.queue-info strong { font-size:9px; }.queue-info small,.deadline small,.deadline strong { font-size:8px; }
}

@media (min-width: 821px) and (max-width: 1500px) {
  .sidebar.top-navigation { padding-inline:14px; gap:8px; }
  .top-navigation .brand { min-width:164px; }
  .top-navigation .brand strong { font-size:17px; }
  .top-navigation .brand small { font-size:8px; }
  .top-navigation .nav-item { padding-inline:6px; font-size:12px; }
  .top-navigation .nav-item svg { width:14px; height:14px; }
  .profile-button > span:nth-child(2) { display:none; }
  .dashboard-mode .content { padding-inline:22px; }
}
@media (min-width: 821px) and (max-width: 1250px) {
  .top-navigation .nav > .nav-item:nth-of-type(n+7) { display:none; }
  .nav-more { display:block; }
  .dashboard-hero-grid { grid-template-columns:1fr; }
  .dashboard-hero,.dashboard-day-card { height:auto; min-height:170px; }
  .dashboard-day-card { grid-template-columns:1fr 1fr; grid-template-rows:1fr; }
  .dashboard-analytics-grid { grid-template-columns:1fr 1fr; }
  .dashboard-analytics-grid > .panel { height:238px; }
  .production-overview-panel { grid-column:1/-1; }
}

/* === NP3D Dashboard operational-priority pass 2026-09-26 === */
@media (min-width: 821px) {
  /* Keep the top compact so operational information appears sooner. */
  .dashboard-hero-grid { margin-bottom:12px; grid-template-columns:minmax(0,3.35fr) minmax(300px,.95fr); gap:12px; }
  .dashboard-hero,.dashboard-day-card { height:160px; min-height:160px; }
  .dashboard-hero { padding:17px 26px; }
  .hero-copy h2 { font-size:32px; }
  .hero-copy h3 { font-size:19px; }
  .hero-copy p { margin-top:5px; font-size:13px; }
  .hero-printer { bottom:12px; transform:scale(.9); transform-origin:bottom right; }
  .hero-spool { transform:scale(.9); transform-origin:center; }
  .dashboard-day-card { grid-template-rows:40px 1fr; gap:7px; }

  .kpi-grid { margin-bottom:12px; gap:12px; }
  .kpi-card { height:102px; min-height:102px; padding:13px 16px; }
  .kpi-icon { width:42px; height:42px; flex-basis:42px; }
  .kpi-card strong,.revenue-card strong { font-size:26px; }

  /* Primary work area: large, readable and immediately below KPIs. */
  .dashboard-operations-grid { margin:0 0 12px; grid-template-columns:minmax(0,1.58fr) minmax(430px,1fr); gap:12px; align-items:stretch; }
  .dashboard-operations-grid > .panel { min-height:365px; max-height:none; overflow:hidden; }
  .dashboard-operations-grid .panel-header { min-height:64px; padding:15px 20px 12px; }
  .dashboard-operations-grid .panel-header h3 { font-size:19px; }
  .dashboard-operations-grid .text-button { font-size:12px; }
  .dashboard-operations-grid .recent-orders-list,
  .dashboard-operations-grid .queue-list { padding:0 20px 16px; }

  .dashboard-operations-grid .recent-table-wrap th { height:38px; padding:7px 10px; font-size:11px; letter-spacing:.02em; }
  .dashboard-operations-grid .recent-table-wrap td { height:49px; padding:8px 10px; font-size:11.5px; }
  .dashboard-operations-grid .recent-table-wrap td:first-child { font-weight:750; color:#102347; }
  .dashboard-operations-grid .recent-table-wrap .status-pill { padding:5px 9px; font-size:9.5px; }

  .dashboard-operations-grid .queue-row { min-height:57px; padding:8px 6px 8px 14px; gap:10px; }
  .dashboard-operations-grid .queue-row:before { top:7px; bottom:7px; width:3px; }
  .dashboard-operations-grid .queue-position { width:28px; height:28px; font-size:11px; }
  .dashboard-operations-grid .queue-info strong { font-size:11.5px; line-height:1.25; }
  .dashboard-operations-grid .queue-info small { margin-top:3px; font-size:9.5px; line-height:1.25; }
  .dashboard-operations-grid .deadline strong { font-size:10px; }
  .dashboard-operations-grid .deadline small { margin-top:3px; font-size:9px; }
  .dashboard-operations-grid .market-badge { font-size:9px; padding:4px 7px; }

  /* Production gets its own full-width row. */
  .dashboard-production-panel { margin:0 0 12px; min-height:210px; border:1px solid #e6edf6; border-radius:16px; box-shadow:0 7px 22px rgba(38,72,116,.045); overflow:hidden; }
  .dashboard-production-panel .panel-header { min-height:58px; padding:14px 20px 10px; }
  .dashboard-production-panel .panel-header h3 { font-size:18px; }
  .dashboard-production-panel .production-overview { padding:0 20px 16px; }
  .dashboard-production-panel .production-overview-summary { grid-template-columns:repeat(3,1fr); gap:10px; padding:4px 0 10px; }
  .dashboard-production-panel .production-overview-summary > div { padding:10px 12px; }
  .dashboard-production-panel .production-overview-summary span { font-size:10px; }
  .dashboard-production-panel .production-overview-summary strong { font-size:16px; }
  .dashboard-production-panel .machine-load-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
  .dashboard-production-panel .dashboard-machine-row { min-height:58px; padding:8px 10px; grid-template-columns:30px minmax(0,1fr) auto; gap:8px; }
  .dashboard-production-panel .machine-icon { width:30px; height:30px; }
  .dashboard-production-panel .dashboard-machine-row strong { font-size:10.5px; }
  .dashboard-production-panel .dashboard-machine-row small { font-size:8.5px; }
  .dashboard-production-panel .dashboard-machine-row .machine-state { font-size:8px; }

  /* Analytics are secondary and therefore live at the bottom. */
  .dashboard-analysis-bottom { margin:0; grid-template-columns:minmax(0,1.7fr) minmax(320px,.8fr); gap:12px; }
  .dashboard-analysis-bottom > .panel { height:225px; min-height:225px; }
  .dashboard-analysis-bottom .dashboard-sales-chart { height:171px; }
  .dashboard-analysis-bottom .dashboard-chart-bars { height:112px; }
  .dashboard-analysis-bottom .channel-list { height:171px; }
}

@media (min-width: 821px) and (max-width: 1250px) {
  .dashboard-operations-grid { grid-template-columns:1fr; }
  .dashboard-operations-grid > .panel { min-height:330px; }
  .dashboard-production-panel .machine-load-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dashboard-analysis-bottom { grid-template-columns:1fr 1fr; }
}

/* === NP3D v58 — fill lower dashboard with operational panels === */
@media (min-width: 821px) {
  .dashboard-operations-grid > .panel {
    min-height: 520px;
  }
  .dashboard-operations-grid .recent-orders-list,
  .dashboard-operations-grid .queue-list {
    min-height: 440px;
  }
}

@media (min-width: 821px) and (max-height: 820px) {
  .dashboard-operations-grid > .panel { min-height: 430px; }
  .dashboard-operations-grid .recent-orders-list,
  .dashboard-operations-grid .queue-list { min-height: 350px; }
}