:root { --brand-graphite: #151a1f; --brand-panel: #202830; --brand-copper: #a7431d; --brand-gold: #d08a2f; --brand-steel: #687782; --brand-paper: #f3f5f6; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: var(--brand-paper); color: var(--brand-graphite); }
* { box-sizing: border-box; }
body { margin: 0; }
button, input, select, textarea { font: inherit; }
button, .download { align-items: center; background: var(--brand-copper); border: 0; border-radius: 8px; color: #fff; cursor: pointer; display: inline-flex; font-weight: 800; justify-content: center; min-height: 42px; padding: 0 14px; text-decoration: none; }
.download.disabled { opacity: .5; pointer-events: none; }
button.loading { cursor: progress; opacity: .86; }
button.loading::after { animation: spin .8s linear infinite; border: 2px solid rgba(255, 255, 255, .42); border-radius: 999px; border-top-color: #fff; content: ""; height: 13px; margin-left: 8px; width: 13px; }
button.ghost { background: #e7ecef; color: #17202a; }
button.danger { background: #fee4e2; color: #b42318; }
@keyframes spin { to { transform: rotate(360deg); } }
.shell { margin: 0 auto; max-width: 1280px; padding: 22px; }
.topbar { align-items: center; background: linear-gradient(135deg, var(--brand-graphite), var(--brand-panel)); border: 1px solid rgba(208, 138, 47, .35); border-radius: 8px; box-shadow: 0 16px 32px rgba(21, 26, 31, .14); color: #f5f0e8; display: flex; justify-content: space-between; margin-bottom: 18px; padding: 14px 16px; }
.top-actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
h1, h2, p { margin: 0; }
h1 { font-size: 26px; }
h2 { font-size: 18px; }
.topbar p { color: #c9d0d6; margin-top: 4px; }
.brand-lockup { align-items: center; display: flex; gap: 14px; min-width: 0; }
.brand-logo { background: #151a1f; border: 1px solid rgba(208, 138, 47, .45); border-radius: 8px; height: 58px; max-width: min(340px, 42vw); object-fit: contain; padding: 4px; width: 230px; }
.hidden { display: none !important; }
.login-view { display: grid; min-height: 70vh; place-items: center; }
.panel { background: #fff; border: 1px solid #dfe4ea; border-radius: 8px; box-shadow: 0 16px 32px rgba(23, 32, 42, .06); padding: 18px; }
.form-panel { display: grid; gap: 14px; max-width: 420px; width: 100%; }
label { color: #344054; display: grid; font-size: 14px; gap: 8px; }
input, select, textarea { border: 1px solid #cfd7df; border-radius: 8px; min-height: 42px; padding: 0 12px; width: 100%; }
textarea { grid-column: span 2; min-height: 88px; padding-top: 10px; resize: vertical; }
.tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.tabs button { background: #e7ecef; color: #17202a; }
.tabs button.active { background: var(--brand-graphite); color: #fff; }
.global-action-bar { align-items: center; background: #020617; border: 1px solid #334155; border-radius: 8px; box-shadow: 0 16px 34px rgba(2, 6, 23, .22); color: #f8fafc; display: flex; gap: 14px; justify-content: space-between; margin: -4px 0 16px; padding: 12px 14px; position: sticky; top: 8px; z-index: 20; }
.global-action-bar > div:first-child { display: grid; gap: 2px; min-width: 220px; }
.global-action-bar span { color: #f97316; font-size: 11px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.global-action-bar strong { font-size: 18px; }
.global-action-bar small { color: #94a3b8; font-size: 12px; line-height: 1.35; }
.global-action-buttons { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.global-action-extra { display: contents; }
.global-action-buttons button { min-height: 36px; padding: 0 11px; }
.global-action-buttons .ghost { background: #1e293b; border: 1px solid #475569; color: #e2e8f0; }
.global-action-buttons button:disabled, .global-action-buttons button.disabled { cursor: not-allowed; opacity: .46; }
.contextual-sidebar { background: #0f172a; border: 1px solid #334155; border-left: 5px solid #f97316; border-radius: 8px; bottom: 16px; box-shadow: 0 20px 50px rgba(2, 6, 23, .28); color: #e2e8f0; display: grid; gap: 10px; max-height: min(72vh, 620px); overflow: auto; padding: 14px; position: fixed; right: 16px; width: min(360px, calc(100vw - 32px)); z-index: 30; }
.context-sidebar-head { align-items: flex-start; display: flex; gap: 10px; justify-content: space-between; }
.context-sidebar-head > div { display: grid; gap: 6px; min-width: 0; }
.context-sidebar-close { background: #1e293b; border: 1px solid #475569; border-radius: 8px; color: #f8fafc; cursor: pointer; flex: 0 0 auto; font-size: 12px; font-weight: 900; min-height: 32px; padding: 0 10px; }
.context-sidebar-close:hover { background: #334155; }
.contextual-sidebar h3 { font-size: 15px; margin: 0; }
.contextual-sidebar p { color: #94a3b8; font-size: 13px; line-height: 1.4; margin: 0; }
.contextual-sidebar ul { display: grid; gap: 8px; list-style: none; margin: 0; padding: 0; }
.contextual-sidebar li { background: #111827; border: 1px solid #334155; border-radius: 8px; display: grid; gap: 2px; padding: 9px; }
.contextual-sidebar li span { color: #94a3b8; font-size: 11px; font-weight: 900; text-transform: uppercase; }
.contextual-sidebar li strong { color: #f8fafc; font-size: 14px; overflow-wrap: anywhere; }
.triage-cnpj-card { background: #0f172a; border: 1px solid #334155; border-left: 5px solid #22c55e; border-radius: 8px; color: #e2e8f0; display: grid; gap: 12px; margin: 12px 0; padding: 14px; }
.triage-cnpj-card span { color: #86efac; display: block; font-size: 11px; font-weight: 900; text-transform: uppercase; }
.triage-cnpj-card strong { color: #f8fafc; display: block; font-size: 16px; margin-top: 2px; }
.triage-cnpj-card small { color: #94a3b8; display: block; margin-top: 4px; }
.triage-cnpj-card dl { display: grid; gap: 8px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; }
.triage-cnpj-card dl div { background: #111827; border: 1px solid #334155; border-radius: 8px; padding: 8px; }
.triage-cnpj-card dt { color: #94a3b8; font-size: 11px; font-weight: 900; margin: 0 0 3px; text-transform: uppercase; }
.triage-cnpj-card dd { color: #f8fafc; margin: 0; overflow-wrap: anywhere; }
.triage-invoice-card { background: #0f172a; border: 1px solid #334155; border-left: 5px solid #f97316; border-radius: 8px; color: #e2e8f0; display: grid; gap: 12px; margin: 12px 0; padding: 14px; }
.triage-invoice-card span { color: #fed7aa; display: block; font-size: 11px; font-weight: 900; text-transform: uppercase; }
.triage-invoice-card strong { color: #f8fafc; display: block; font-size: 16px; margin-top: 2px; }
.triage-invoice-card small { color: #cbd5e1; display: block; margin-top: 4px; }
.triage-invoice-card dl { display: grid; gap: 8px; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; }
.triage-invoice-card dl div { background: #111827; border: 1px solid #334155; border-radius: 8px; padding: 8px; }
.triage-invoice-card dt { color: #94a3b8; font-size: 11px; font-weight: 900; margin: 0 0 3px; text-transform: uppercase; }
.triage-invoice-card dd { color: #f8fafc; margin: 0; overflow-wrap: anywhere; }
.triage-invoice-items { border: 1px solid #334155; border-radius: 8px; display: grid; max-height: 360px; overflow: auto; }
.triage-invoice-item { align-items: center; border-bottom: 1px solid #1e293b; display: grid; gap: 10px; grid-template-columns: auto minmax(0, 1fr) auto auto; padding: 10px; }
.triage-invoice-item:last-child { border-bottom: 0; }
.triage-invoice-item input { height: 18px; width: 18px; }
.triage-invoice-item b, .triage-invoice-item em { color: #f8fafc; font-style: normal; white-space: nowrap; }
.triage-invoice-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 12px; }
.global-skeleton { animation: skeletonPulse 1.2s ease-in-out infinite; background: #fff; border: 1px solid #dfe4ea; border-radius: 8px; display: grid; gap: 12px; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 16px; padding: 14px; }
.global-skeleton span { background: linear-gradient(90deg, #e2e8f0, #f8fafc, #e2e8f0); border-radius: 8px; height: 72px; }
.skeleton-card { animation: skeletonPulse 1.2s ease-in-out infinite; background: linear-gradient(90deg, #e2e8f0, #f8fafc, #e2e8f0); border-radius: 8px; min-height: 120px; }
@keyframes skeletonPulse { 0%, 100% { opacity: .62; } 50% { opacity: 1; } }
.card, .crm-card, .metric, .module-table tr, .machine-card, .purchase-step { transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.card:hover, .crm-card:hover, .metric:hover, .machine-card:hover, .purchase-step:hover { box-shadow: 0 14px 28px rgba(15, 23, 42, .12); transform: translateY(-1px); }
.module-table tbody tr:hover { background: #f8fafc; }
.badge.OK, .status-pill.OK { background: #dcfae6; color: #067647; }
.badge.ATTENTION, .status-pill.ATTENTION { background: #fef0c7; color: #b54708; }
.badge.NC, .status-pill.NC { background: #fee4e2; color: #b42318; }
.tab { display: none; }
.tab.active { display: grid; gap: 16px; }
.metrics { display: grid; gap: 12px; grid-template-columns: repeat(4, minmax(160px, 1fr)); }
.metric { background: #fff; border: 1px solid #dfe4ea; border-radius: 8px; padding: 18px; }
.metric span { color: #667085; display: block; font-size: 13px; margin-bottom: 8px; }
.metric strong { font-size: 28px; }
.section-head { align-items: center; display: flex; justify-content: space-between; gap: 12px; }
.form-grid { display: grid; gap: 10px; grid-template-columns: repeat(4, minmax(160px, 1fr)); }
.form-grid .span-2 { grid-column: span 2; }
.form-section-title { align-self: center; color: #344054; font-size: 12px; font-weight: 900; letter-spacing: .02em; padding-top: 8px; text-transform: uppercase; }
.client-cnpj-lookup { display: grid; gap: 8px; grid-template-columns: minmax(0, 1fr) auto; }
.client-cnpj-lookup input { min-width: 0; width: 100%; }
.client-cnpj-lookup button { min-height: 42px; white-space: nowrap; }
.list, .sector-grid, .photo-grid, .map-board, .sector-result-grid { display: grid; gap: 12px; }
.list { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.card { background: #fff; border: 1px solid #dfe4ea; border-radius: 8px; display: grid; gap: 8px; padding: 16px; }
.card small { color: #667085; }
.order-card { align-content: start; }
.orders-workspace { align-items: start; display: grid; gap: 12px; grid-template-columns: minmax(0, 1fr) 380px; }
.orders-industrial-list { grid-template-columns: 1fr; }
.industrial-order { border-left: 5px solid var(--brand-copper); }
.industrial-order.active { box-shadow: 0 0 0 2px rgba(167, 67, 29, .25), 0 16px 32px rgba(23, 32, 42, .08); }
.order-card-top { align-items: flex-start; display: flex; gap: 12px; justify-content: space-between; }
.order-stage-line { display: flex; flex-wrap: wrap; gap: 6px; }
.stage-chip { background: #e7ecef; color: #344054; font-size: 11px; min-height: 30px; padding: 0 9px; }
.stage-chip.active { background: var(--brand-graphite); color: #fff; }
.order-spec-grid { display: grid; gap: 8px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.order-spec-grid span { background: #f8fafc; border: 1px solid #edf1f5; border-radius: 8px; color: #475467; display: grid; font-size: 13px; gap: 3px; padding: 9px; }
.order-spec-grid strong { color: #17202a; font-size: 12px; text-transform: uppercase; }
.order-timeline-panel { align-content: start; display: grid; gap: 12px; position: sticky; top: 12px; }
.input-error { border-color: #b42318 !important; box-shadow: 0 0 0 3px rgba(180, 35, 24, .12); }
.field-error { color: #b42318; font-size: 12px; margin-top: -6px; }
.badge { border-radius: 999px; display: inline-flex; font-size: 11px; font-weight: 900; justify-content: center; max-width: max-content; padding: 4px 8px; }
.OVERDUE, .CRITICAL { background: #fee4e2; color: #b42318; }
.DUE_TODAY, .HIGH { background: #fff1c6; color: #b54708; }
.DUE_SOON { background: #e0f2fe; color: #026aa2; }
.ON_TRACK, .DELIVERED { background: #dcfae6; color: #067647; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.chip-button { background: #e7ecef; color: #17202a; min-height: 34px; padding: 0 10px; }
.chip-button.active { background: var(--brand-copper); color: #fff; }
.sector-result-grid { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); margin-top: 12px; }
.sector-result { background: #f8fafc; border: 1px solid #dfe4ea; border-radius: 8px; display: grid; gap: 6px; padding: 12px; }
.sector-result strong { color: #17202a; }
.sector-result span { color: #475467; font-size: 13px; }
.crm-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); }
.crm-card { background: #fff; border: 1px solid #dfe4ea; border-left: 5px solid var(--brand-copper); border-radius: 8px; display: grid; gap: 12px; padding: 16px; }
.crm-card.active { border-color: #f97316; border-left-color: #f97316; box-shadow: 0 0 0 2px rgba(249, 115, 22, .16); }
.crm-card.inactive { border-left-color: #98a2b3; opacity: .78; }
.crm-card-head { align-items: flex-start; display: flex; gap: 12px; justify-content: space-between; }
.crm-card-head small { color: #667085; display: block; font-weight: 900; text-transform: uppercase; }
.crm-card-head span { color: #475467; display: block; font-size: 13px; margin-top: 2px; }
.crm-badges { align-items: flex-end; display: flex; flex-direction: column; gap: 6px; }
.crm-load-more-card { border-left-color: #f59e0b; }
.crm-kpis { display: grid; gap: 8px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.crm-kpis span { background: #f8fafc; border: 1px solid #edf1f5; border-radius: 8px; color: #475467; display: grid; font-size: 12px; gap: 2px; padding: 9px; }
.crm-kpis strong { color: #17202a; font-size: 16px; }
.crm-details { color: #475467; display: grid; font-size: 13px; gap: 5px; }
.client-fiscal-grid { display: grid; gap: 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.client-fiscal-grid article { background: #f8fafc; border: 1px solid #edf1f5; border-radius: 8px; display: grid; gap: 4px; padding: 10px; }
.client-fiscal-grid article.span-2 { grid-column: 1 / -1; }
.client-fiscal-grid span { color: #667085; font-size: 11px; font-weight: 900; text-transform: uppercase; }
.client-fiscal-grid strong { color: #17202a; overflow-wrap: anywhere; }
.crm-history { background: #f8fafc; border: 1px solid #edf1f5; border-radius: 8px; display: grid; gap: 7px; padding: 10px; }
.crm-history > strong { color: #344054; font-size: 12px; text-transform: uppercase; }
.crm-history span { background: #fff; border: 1px solid #edf1f5; border-radius: 8px; color: #475467; display: grid; font-size: 13px; gap: 2px; padding: 8px; }
.crm-history b { color: #17202a; }
.crm-history small { color: #667085; }
.map-board { background: linear-gradient(135deg, #eef6ff, #eef8f1); border: 1px solid #cfd7df; border-radius: 8px; min-height: 420px; padding: 16px; position: relative; }
.map-point { background: #fff; border: 1px solid #cfd7df; border-left: 6px solid var(--brand-copper); border-radius: 8px; box-shadow: 0 10px 24px rgba(23, 32, 42, .08); padding: 12px; }
.photo-grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.photo { aspect-ratio: 4/3; background: #e7ecef; border-radius: 8px; object-fit: cover; width: 100%; }
.sector-grid { grid-template-columns: 1fr; }
.sector-card { background: #fff; border: 1px solid #dfe4ea; border-left: 6px solid var(--brand-copper); border-radius: 8px; display: grid; gap: 14px; padding: 16px; }
.sector-card-head { align-items: flex-start; display: flex; gap: 12px; justify-content: space-between; }
.sector-card-head small { color: #667085; font-weight: 800; }
.sector-card-head span { background: #f2f4f7; border-radius: 999px; color: #344054; font-size: 12px; font-weight: 800; padding: 5px 9px; white-space: nowrap; }
.sector-card p { color: #475467; }
.sector-columns { display: grid; gap: 12px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.sector-columns div { background: #f8fafc; border: 1px solid #edf1f5; border-radius: 8px; padding: 12px; }
.sector-columns strong { display: block; font-size: 13px; margin-bottom: 8px; }
.sector-columns ul { color: #475467; display: grid; font-size: 13px; gap: 6px; margin: 0; padding-left: 18px; }
.report-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.ai-layout { display: grid; gap: 12px; grid-template-columns: minmax(0, 1fr) 320px; }
.ai-layout-wide { align-items: start; display: grid; gap: 12px; grid-template-columns: minmax(0, 1.25fr) minmax(360px, .75fr); margin-top: 12px; }
.ai-command-hero { align-items: flex-start; background: #fff; border: 1px solid #dfe4ea; border-left: 6px solid var(--brand-copper); border-radius: 8px; box-shadow: 0 16px 32px rgba(23, 32, 42, .06); display: flex; gap: 16px; justify-content: space-between; margin-bottom: 12px; padding: 18px; }
.ai-command-hero h2 { font-size: 28px; margin: 4px 0; }
.ai-command-hero p, .ai-side-panel p { color: #667085; }
.eyebrow { color: var(--brand-copper); font-size: 12px; font-weight: 900; text-transform: uppercase; }
.ai-action-bar { align-items: center; background: #151a1f; border: 1px solid rgba(208, 138, 47, .32); border-left: 6px solid var(--brand-copper); border-radius: 8px; display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 12px; padding: 10px; }
.ai-action-bar button.ghost { background: #202830; border-color: #3b4652; color: #eef2f5; }
.ai-action-bar button.active { background: var(--brand-copper); border-color: var(--brand-copper); color: #fff; }
.ai-management-tabs { align-items: center; display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.ai-management-tabs button { background: #fff; border: 1px solid #dfe4ea; color: #17202a; }
.ai-management-tabs button.active { background: var(--brand-graphite); border-color: var(--brand-graphite); color: #fff; }
.ai-management-tabs small { background: rgba(21, 26, 31, .08); border-radius: 999px; display: inline-flex; font-size: 11px; font-weight: 900; margin-left: 4px; padding: 3px 7px; }
.ai-management-tabs button.active small { background: rgba(255, 255, 255, .18); }
.ai-executive-grid { display: grid; gap: 12px; grid-template-columns: repeat(6, minmax(0, 1fr)); }
.ai-kpi { background: #fff; border: 1px solid #dfe4ea; border-top: 4px solid #98a2b3; border-radius: 8px; min-height: 116px; padding: 14px; }
.ai-kpi span, .ai-automation-card span, .ai-usage-row span, .ai-healing-kpis span, .ai-governance-grid span { color: #667085; display: block; font-size: 12px; font-weight: 900; margin-bottom: 6px; text-transform: uppercase; }
.ai-kpi strong { display: block; font-size: 24px; overflow-wrap: anywhere; }
.ai-kpi small { color: #667085; display: block; line-height: 1.35; margin-top: 8px; }
.ai-kpi.green { border-top-color: #067647; }
.ai-kpi.amber { border-top-color: #b54708; }
.ai-kpi.red { border-top-color: #b42318; }
.ai-kpi.blue { border-top-color: #026aa2; }
.ai-report-form { background: #f8fafc; border: 1px solid #edf1f5; border-radius: 8px; margin-bottom: 10px; padding: 10px; }
.ai-preset-grid { display: grid; gap: 8px; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 10px; }
.ai-preset-button { background: #fff; border: 1px solid #dfe4ea; color: #17202a; display: grid; gap: 3px; justify-content: start; min-height: 64px; text-align: left; }
.ai-preset-button small { color: #667085; }
.ai-report-panel { align-content: start; display: grid; gap: 14px; }
.ai-metrics { grid-template-columns: repeat(4, minmax(140px, 1fr)); }
.ai-report-text { background: #f8fafc; border: 1px solid #dfe4ea; border-radius: 8px; color: #17202a; font-family: inherit; line-height: 1.55; margin: 0; min-height: 320px; overflow: auto; padding: 16px; white-space: pre-wrap; }
.ai-history-list { display: grid; gap: 8px; margin-top: 12px; }
.ai-history-row { background: #f8fafc; border: 1px solid #dfe4ea; color: #17202a; justify-content: flex-start; min-height: 62px; text-align: left; width: 100%; }
.ai-history-row.active { background: var(--brand-graphite); color: #fff; }
.ai-history-row span { display: grid; gap: 2px; }
.ai-history-row small { color: inherit; opacity: .76; }
.ai-action-plan-output { display: grid; gap: 10px; margin-top: 10px; }
.ai-action-plan-card { background: #fff; border: 1px solid #dfe4ea; border-left: 6px solid var(--brand-copper); border-radius: 8px; display: grid; gap: 12px; padding: 14px; }
.ai-action-plan-card header { align-items: flex-start; display: flex; gap: 12px; justify-content: space-between; }
.ai-action-plan-card h3 { font-size: 16px; margin: 0; }
.ai-action-plan-card p { color: #475467; line-height: 1.45; }
.ai-action-plan-card ul { color: #475467; display: grid; gap: 6px; margin: 0; padding-left: 18px; }
.ai-action-plan-card pre { background: #0f172a; border: 1px solid #334155; border-radius: 8px; color: #e2e8f0; font-size: 12px; line-height: 1.45; margin: 0; max-height: 240px; overflow: auto; padding: 12px; white-space: pre-wrap; }
.ai-action-impact { display: flex; flex-wrap: wrap; gap: 6px; }
.ai-action-impact span { background: #fef0c7; border-radius: 999px; color: #b54708; font-size: 11px; font-weight: 900; padding: 4px 8px; text-transform: uppercase; }
.ai-action-approval { align-items: center; background: #fff8f3; border: 1px solid #fedf89; border-radius: 8px; display: flex; flex-wrap: wrap; gap: 10px; justify-content: space-between; padding: 10px; }
.ai-action-approval strong { color: #b54708; font-size: 13px; }
.ai-action-approval button { min-height: 36px; }
.ai-dashboard-summary { margin-top: 12px; }
.ai-summary-grid { display: grid; gap: 12px; grid-template-columns: repeat(4, minmax(160px, 1fr)); }
.ai-summary-grid article, .triage-grid article { background: #f8fafc; border: 1px solid #dfe4ea; border-radius: 8px; display: grid; gap: 6px; padding: 12px; }
.ai-summary-grid span, .muted-line { color: #667085; font-size: 13px; }
.ai-summary-grid strong { font-size: 22px; }
.ai-trend { border-top: 1px solid #edf1f5; display: grid; gap: 10px; margin-top: 14px; padding-top: 14px; }
.ai-trend h3 { font-size: 15px; margin: 0; }
.ai-risk-bars { display: grid; gap: 8px; }
.ai-risk-bars article { align-items: center; display: grid; gap: 8px; grid-template-columns: 86px minmax(0, 1fr) 52px; }
.ai-risk-bars span, .ai-risk-bars strong { color: #475467; font-size: 12px; }
.ai-automation-board, .ai-usage-list, .ai-self-healing-summary, .ai-error-list { display: grid; gap: 10px; }
.ai-automation-card { align-items: center; background: #f8fafc; border: 1px solid #dfe4ea; border-left: 5px solid var(--brand-copper); border-radius: 8px; display: grid; gap: 12px; grid-template-columns: minmax(0, 1fr) minmax(190px, auto) auto; padding: 12px; }
.ai-automation-card strong, .ai-automation-card small { display: block; }
.ai-automation-card small { color: #667085; line-height: 1.35; margin-top: 4px; }
.ai-usage-columns { display: grid; gap: 12px; grid-template-columns: 1fr 1fr; }
.ai-usage-columns > div { background: #f8fafc; border: 1px solid #edf1f5; border-radius: 8px; display: grid; gap: 8px; padding: 12px; }
.ai-usage-row { background: #fff; border: 1px solid #dfe4ea; border-radius: 8px; padding: 10px; }
.ai-usage-row strong, .ai-usage-row small { display: block; }
.ai-usage-row small { color: #667085; margin-top: 4px; }
.ai-policy-panel { align-content: start; }
.ai-governance-grid { display: grid; gap: 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ai-governance-grid article { background: #f8fafc; border: 1px solid #edf1f5; border-left: 5px solid #98a2b3; border-radius: 8px; padding: 12px; }
.ai-governance-grid strong, .ai-governance-grid small { display: block; }
.ai-governance-grid small { color: #667085; line-height: 1.35; margin-top: 5px; }
.ai-healing-kpis { display: grid; gap: 10px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ai-healing-kpis article { background: #f8fafc; border: 1px solid #dfe4ea; border-radius: 8px; padding: 12px; }
.ai-healing-kpis strong { font-size: 22px; }
.ai-health-chart { background: #0f172a; border: 1px solid #334155; border-radius: 8px; color: #e2e8f0; display: grid; gap: 9px; margin-top: 10px; padding: 12px; }
.ai-health-chart .section-head { margin-bottom: 2px; }
.ai-health-chart h3 { color: #fff; font-size: 15px; margin: 0; }
.ai-health-chart small { color: #94a3b8; }
.ai-health-chart article { align-items: center; display: grid; gap: 8px; grid-template-columns: 150px minmax(0, 1fr) 54px; }
.ai-health-chart article > span, .ai-health-chart strong { color: #cbd5e1; font-size: 12px; }
.ai-health-chart article div { background: #1e293b; border-radius: 999px; height: 10px; overflow: hidden; }
.ai-health-chart i { display: block; height: 100%; }
.ai-health-chart i.red { background: #f04438; }
.ai-health-chart i.amber { background: #f79009; }
.ai-health-chart i.blue { background: #2e90fa; }
.ai-health-chart i.green { background: #12b76a; }
.ai-attempt-list { display: grid; gap: 10px; margin-top: 10px; }
.ai-attempt { background: #f8fafc; border: 1px solid #dfe4ea; border-left: 5px solid #026aa2; border-radius: 8px; padding: 12px; }
.ai-attempt small, .ai-attempt p { color: #667085; display: block; line-height: 1.4; margin: 5px 0 0; }
.attempt-head { align-items: center; display: flex; gap: 8px; justify-content: space-between; }
.attempt-head span { background: #101828; border-radius: 999px; color: #fff; font-size: 11px; font-weight: 800; padding: 4px 8px; }
.patch-preview { background: #0f172a; border: 1px solid #334155; border-radius: 8px; color: #e2e8f0; font-size: 11px; line-height: 1.45; margin: 10px 0; max-height: 220px; overflow: auto; padding: 10px; white-space: pre-wrap; }
.ai-error-row { align-items: center; background: #fff; border: 1px solid #dfe4ea; border-left: 5px solid #98a2b3; border-radius: 8px; display: grid; gap: 12px; grid-template-columns: minmax(0, 1fr) auto; padding: 12px; }
.ai-error-row.error { background: #fff8f3; border-left-color: #b42318; }
.ai-error-row strong, .ai-error-row small { display: block; }
.ai-error-row small { color: #667085; line-height: 1.35; margin-top: 4px; }
.module-actions.compact { gap: 8px; margin-top: 10px; }
.module-actions.compact button, .module-actions.compact a { min-height: 34px; padding: 8px 10px; }
.module-actions.vertical { align-items: stretch; display: grid; }
.ghost.danger { border-color: #fda29b; color: #b42318; }
.triage-result { background: #f8fafc; border: 1px solid #dfe4ea; border-radius: 8px; display: grid; gap: 14px; padding: 16px; }
.triage-result h3 { font-size: 15px; margin: 0; }
.triage-result ul { margin: 0; padding-left: 18px; }
.triage-grid { display: grid; gap: 12px; grid-template-columns: repeat(3, minmax(160px, 1fr)); }
.triage-grid span { color: #667085; font-size: 13px; }
.triage-grid strong { font-size: 18px; }
.triage-file-preview { align-items: center; background: #fff; border: 1px solid #dfe4ea; border-left: 5px solid var(--brand-copper); border-radius: 8px; display: grid; gap: 6px; grid-template-columns: minmax(0, 1fr) auto; padding: 10px; }
.triage-file-preview strong, .triage-file-preview small { display: block; }
.triage-file-preview small { color: #667085; overflow-wrap: anywhere; }
.risk-bar { background: #e7ecef; border-radius: 999px; height: 8px; overflow: hidden; width: 100%; }
.risk-bar span { background: linear-gradient(90deg, #067647, #b54708, #b42318); display: block; height: 100%; }
.module-layout { display: grid; gap: 12px; grid-template-columns: 360px minmax(0, 1fr); }
.module-layout.wide { grid-template-columns: 420px minmax(0, 1fr); }
.module-stack { display: grid; gap: 12px; }
.module-form { display: grid; gap: 10px; }
.module-form textarea { grid-column: auto; min-height: 84px; }
.module-analytics { display: grid; gap: 12px; }
.module-notice { border-radius: 8px; font-weight: 800; padding: 12px 14px; }
.module-notice.success { background: #ecfdf3; border: 1px solid #abefc6; color: #067647; }
.module-notice.error { background: #fff5f5; border: 1px solid #fecdca; color: #b42318; }
.filter-bar { background: #f8fafc; border: 1px solid #edf1f5; border-radius: 8px; display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); margin: 12px 0; padding: 10px; }
.table-wrap { max-height: 620px; overflow: auto; width: 100%; }
.table-wrap.compact { max-height: 360px; }
.module-table { border-collapse: collapse; width: 100%; }
.module-table th, .module-table td { border-bottom: 1px solid #edf1f5; font-size: 13px; padding: 9px; text-align: left; vertical-align: top; }
.module-table th { background: #fff; color: #667085; font-size: 12px; position: sticky; text-transform: uppercase; top: 0; z-index: 1; }
.module-table td small { color: #667085; display: block; margin-top: 3px; }
.table-alert { background: #fff8f3; }
.stock-alerts { display: grid; gap: 10px; margin: 12px 0; }
.stock-alert { border-radius: 8px; display: grid; gap: 4px; padding: 12px; }
.stock-alert span { font-size: 13px; }
.stock-alert.danger { background: #fff5f5; border: 1px solid #fecdca; color: #b42318; }
.stock-alert.warning { background: #fffbeb; border: 1px solid #fedf89; color: #b54708; }
.module-standard-shell { display: grid; gap: 12px; }
.layout-standard-actionbar { align-items: center; background: #0f172a; border: 1px solid #334155; border-left: 5px solid #f97316; border-radius: 8px; display: flex; flex-wrap: wrap; gap: 8px; padding: 10px; }
.layout-standard-actionbar .ghost, .layout-standard-actionbar a.download { background: #1e293b; border: 1px solid #475569; color: #e2e8f0; }
.layout-standard-tabs { align-items: center; }
.layout-master-detail { align-items: start; display: grid; gap: 12px; grid-template-columns: minmax(0, 1fr); }
.layout-master-detail:has(.detail-pane) { grid-template-columns: minmax(0, 1fr) minmax(320px, 380px); }
.master-pane { min-width: 0; }
.detail-pane { background: #fff; border: 1px solid #dfe4ea; border-left: 5px solid #f97316; border-radius: 8px; box-shadow: 0 12px 24px rgba(15, 23, 42, .08); display: grid; gap: 12px; max-height: min(68vh, 720px); overflow: auto; padding: 12px; position: sticky; top: 92px; }
.detail-pane > header { align-items: flex-start; border-bottom: 1px solid #edf1f5; display: flex; gap: 10px; justify-content: space-between; padding-bottom: 10px; }
.detail-pane > header span { color: #f97316; display: block; font-size: 11px; font-weight: 900; text-transform: uppercase; }
.detail-pane > header strong { color: #17202a; display: block; overflow-wrap: anywhere; }
.stock-view-tabs { background: #f8fafc; border: 1px solid #edf1f5; border-radius: 8px; display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; padding: 8px; }
.stock-view-tabs button { background: #e7ecef; color: #17202a; min-height: 34px; padding: 0 10px; }
.stock-view-tabs button.active { background: #151a1f; color: #fff; }
.stock-main-list { display: grid; gap: 12px; max-height: min(62vh, 620px); overflow: auto; padding-right: 4px; }
.stock-card-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.stock-material-card { background: #fff; border: 1px solid #dfe4ea; border-left: 5px solid #687782; border-radius: 8px; display: grid; gap: 12px; padding: 14px; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.stock-material-card:hover { box-shadow: 0 14px 28px rgba(15, 23, 42, .12); transform: translateY(-1px); }
.stock-material-card.low { background: #fff8f3; border-left-color: #b42318; }
.stock-material-head { align-items: flex-start; display: flex; gap: 10px; justify-content: space-between; }
.stock-material-head small { color: #667085; display: block; font-weight: 900; text-transform: uppercase; }
.stock-material-head strong { color: #17202a; display: block; font-size: 16px; overflow-wrap: anywhere; }
.stock-material-head span { color: #475467; display: block; font-size: 13px; margin-top: 2px; }
.stock-card-kpis { display: grid; gap: 8px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.stock-card-kpis span { background: #f8fafc; border: 1px solid #edf1f5; border-radius: 8px; color: #475467; display: grid; font-size: 12px; gap: 2px; padding: 8px; }
.stock-card-kpis strong { color: #17202a; font-size: 15px; }
.ux-drawer-backdrop { background: rgba(2, 6, 23, .52); bottom: 0; display: flex; justify-content: flex-end; left: 0; position: fixed; right: 0; top: 0; z-index: 80; }
.ux-drawer { background: #fff; box-shadow: -24px 0 48px rgba(2, 6, 23, .28); display: grid; gap: 14px; grid-template-rows: auto minmax(0, 1fr); height: 100%; max-width: 100%; overflow: auto; padding: 18px; width: min(560px, 100vw); }
.ux-drawer-header { align-items: flex-start; border-bottom: 1px solid #edf1f5; display: flex; gap: 12px; justify-content: space-between; padding-bottom: 12px; }
.ux-drawer-header h2 { font-size: 20px; }
.ux-drawer-header p { color: #667085; font-size: 13px; margin-top: 4px; }
.ux-drawer-body { display: grid; gap: 14px; }
.drawer-detail-grid { display: grid; gap: 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.drawer-detail-grid article { background: #f8fafc; border: 1px solid #edf1f5; border-radius: 8px; display: grid; gap: 4px; padding: 10px; }
.drawer-detail-grid span { color: #667085; font-size: 12px; font-weight: 900; text-transform: uppercase; }
.drawer-detail-grid strong { color: #17202a; overflow-wrap: anywhere; }
.stock-report-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
.stock-report-grid article { background: #fff; border: 1px solid #dfe4ea; border-radius: 8px; display: grid; gap: 5px; padding: 12px; }
.stock-report-grid span { color: #667085; font-size: 12px; font-weight: 900; text-transform: uppercase; }
.stock-report-grid strong { color: #17202a; font-size: 22px; }
.stock-report-grid small { color: #667085; line-height: 1.35; }
.stock-report-filter { align-items: center; }
.standard-report-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
.standard-report-grid article { background: #fff; border: 1px solid #dfe4ea; border-radius: 8px; display: grid; gap: 5px; padding: 12px; }
.standard-report-grid span { color: #667085; font-size: 12px; font-weight: 900; text-transform: uppercase; }
.standard-report-grid strong { color: #17202a; font-size: 22px; }
.standard-report-grid small { color: #667085; line-height: 1.35; }
.module-table tr.selected-row { box-shadow: inset 4px 0 0 #f97316; }
.purchase-alerts { display: grid; gap: 10px; margin: 12px 0; }
.purchase-alert { border-radius: 8px; display: grid; gap: 4px; padding: 12px; }
.purchase-alert span { font-size: 13px; }
.purchase-alert.danger { background: #fff5f5; border: 1px solid #fecdca; color: #b42318; }
.purchase-alert.warning { background: #fffbeb; border: 1px solid #fedf89; color: #b54708; }
.purchase-flow { display: grid; gap: 10px; grid-template-columns: repeat(5, minmax(120px, 1fr)); margin-bottom: 12px; }
.purchase-step { align-items: center; background: #f8fafc; border: 1px solid #dfe4ea; border-radius: 8px; display: grid; gap: 5px; grid-template-columns: 32px 1fr auto; padding: 10px; }
.purchase-step span { align-items: center; background: var(--brand-graphite); border-radius: 999px; color: #fff; display: inline-flex; font-size: 12px; font-weight: 900; height: 28px; justify-content: center; width: 28px; }
.purchase-step strong { color: #344054; font-size: 13px; }
.purchase-step b { color: #17202a; font-size: 20px; }
.purchase-items { display: grid; gap: 8px; }
.purchase-items > strong { color: #344054; font-size: 13px; text-transform: uppercase; }
.purchase-item-grid { background: #f8fafc; border: 1px solid #edf1f5; border-radius: 8px; display: grid; gap: 8px; grid-template-columns: minmax(150px, 1fr) minmax(180px, 1.4fr) 86px 70px 110px; padding: 8px; }
.purchase-item-grid input, .purchase-item-grid select { min-height: 34px; padding: 0 9px; }
.item-list { display: grid; gap: 5px; min-width: 190px; }
.item-list span { background: #f8fafc; border: 1px solid #edf1f5; border-radius: 8px; color: #475467; display: grid; gap: 2px; padding: 7px; }
.item-list strong { color: #17202a; font-size: 12px; }
.module-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.module-actions button, .module-actions .download { min-height: 34px; padding: 0 10px; }
.row-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.row-actions button { min-height: 32px; padding: 0 9px; }
.row-actions .download { min-height: 32px; padding: 0 9px; }
.quality-form .form-section-title { background: #f8fafc; border: 1px solid #edf1f5; border-radius: 8px; color: #344054; font-size: 13px; font-weight: 900; padding: 10px 12px; text-transform: uppercase; }
.quality-checklist-grid { display: grid; gap: 10px; }
.quality-check-item { background: #f8fafc; border: 1px solid #dfe4ea; border-radius: 8px; display: grid; gap: 8px; padding: 10px; }
.quality-check-item strong { color: #17202a; font-size: 13px; }
.quality-check-item small { color: #667085; }
.quality-alerts { display: grid; gap: 10px; margin: 12px 0; }
.quality-alert { border-radius: 8px; display: grid; gap: 4px; padding: 12px; }
.quality-alert span { font-size: 13px; }
.quality-alert.danger { background: #fff5f5; border: 1px solid #fecdca; color: #b42318; }
.quality-alert.warning { background: #fffbeb; border: 1px solid #fedf89; color: #b54708; }
.action-plan-list { display: grid; gap: 5px; min-width: 180px; }
.action-plan-list span { background: #f8fafc; border: 1px solid #edf1f5; border-radius: 8px; color: #475467; display: grid; gap: 2px; padding: 7px; }
.action-plan-list strong { color: #17202a; font-size: 11px; text-transform: uppercase; }
.evidence-links { display: flex; flex-wrap: wrap; gap: 6px; }
.evidence-links a { background: #e0f2fe; border-radius: 999px; color: #026aa2; font-size: 12px; font-weight: 800; padding: 5px 8px; text-decoration: none; }
.quality-evidence-grid { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); margin-top: 10px; }
.quality-evidence-grid article { background: #f8fafc; border: 1px solid #dfe4ea; border-radius: 8px; display: grid; gap: 6px; padding: 8px; }
.quality-evidence-grid img { aspect-ratio: 4 / 3; background: #e7ecef; border-radius: 6px; object-fit: cover; width: 100%; }
.quality-evidence-grid a { color: #a7431d; font-weight: 800; text-decoration: none; }
.machine-grid { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); margin: 12px 0; }
.machine-card { background: #f8fafc; border: 1px solid #dfe4ea; border-left: 5px solid #687782; border-radius: 8px; display: grid; gap: 8px; padding: 12px; }
.machine-card.IN_USE { border-left-color: #b54708; background: #fffbeb; }
.machine-card.AVAILABLE { border-left-color: #067647; }
.machine-card.MAINTENANCE, .machine-card.INACTIVE { border-left-color: #b42318; background: #fff5f5; }
.machine-card small { color: #667085; display: block; margin-top: 2px; }
.production-step-input { background: #f8fafc; border: 1px solid #edf1f5; border-radius: 8px; display: grid; gap: 8px; grid-template-columns: minmax(160px, 1fr) 90px 120px 80px; padding: 8px; }
.inline-shopfloor-form { display: grid; gap: 6px; min-width: 260px; }
.inline-shopfloor-form input, .inline-shopfloor-form select { min-height: 34px; padding: 0 9px; }
.inline-shopfloor-form button { min-height: 34px; }
.inline-shopfloor-form small { color: #667085; }
.compact-action { margin-top: 6px; min-height: 30px; padding: 0 8px; }
.progress { background: #edf1f5; border-radius: 999px; height: 8px; margin-top: 6px; overflow: hidden; width: 100%; }
.progress span { background: linear-gradient(90deg, #067647, #d08a2f); display: block; height: 100%; }
.module-card-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
.status-pill { background: #e7ecef; border-radius: 999px; color: #344054; display: inline-flex; font-size: 11px; font-weight: 900; padding: 4px 8px; }
.status-pill.PAID, .status-pill.RECEIVED, .status-pill.APPROVED, .status-pill.ACTIVE, .status-pill.DONE, .status-pill.AVAILABLE { background: #dcfae6; color: #067647; }
.status-pill.OPEN, .status-pill.REQUESTED, .status-pill.ORDERED, .status-pill.READY, .status-pill.IN_ANALYSIS, .status-pill.QUOTING { background: #e0f2fe; color: #026aa2; }
.status-pill.OVERDUE, .status-pill.REJECTED, .status-pill.CRITICAL, .status-pill.BLOCKED, .status-pill.DENY { background: #fee4e2; color: #b42318; }
.status-pill.CANCELED, .status-pill.INACTIVE, .status-pill.CLOSED { background: #f2f4f7; color: #475467; }
.status-pill.IN_PROGRESS, .status-pill.HIGH, .status-pill.MAINTENANCE, .status-pill.ACTION_REQUIRED, .status-pill.PARTIAL, .status-pill.PARTIAL_RECEIVED, .status-pill.SCHEDULED, .status-pill.AI { background: #fef0c7; color: #b54708; }
.mini-chart { display: grid; gap: 10px; }
.bar-row { align-items: center; display: grid; gap: 10px; grid-template-columns: minmax(130px, .4fr) minmax(150px, 1fr) minmax(64px, auto); }
.bar-row span { color: #344054; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bar-row div { background: #edf1f5; border-radius: 999px; height: 10px; overflow: hidden; }
.bar-row i { background: linear-gradient(90deg, var(--brand-copper), var(--brand-gold)); border-radius: inherit; display: block; height: 100%; }
.bar-row strong { color: #667085; font-size: 12px; text-align: right; white-space: nowrap; }
.finance-chart { align-items: end; display: grid; gap: 12px; grid-auto-flow: column; grid-auto-columns: minmax(96px, 1fr); min-height: 190px; overflow-x: auto; padding-bottom: 4px; }
.finance-chart article { align-content: end; display: grid; gap: 8px; min-height: 170px; }
.finance-chart article strong { color: #344054; font-size: 13px; }
.finance-chart article small { color: #667085; font-size: 12px; }
.dual-bars { align-items: end; background: #f2f4f7; border-radius: 8px; display: grid; gap: 4px; grid-template-columns: 1fr 1fr; height: 110px; padding: 8px; }
.dual-bars span, .dual-bars i { border-radius: 6px 6px 2px 2px; display: block; min-height: 4px; }
.dual-bars span { background: #067647; }
.dual-bars i { background: #b42318; }
.finance-alerts { display: grid; gap: 10px; margin: 12px 0; }
.finance-alert { border-radius: 8px; display: grid; gap: 4px; padding: 12px; }
.finance-alert span { font-size: 13px; }
.finance-alert.danger { background: #fff5f5; border: 1px solid #fecdca; color: #b42318; }
.finance-alert.warning { background: #fffbeb; border: 1px solid #fedf89; color: #b54708; }
.finance-action-header { align-items: center; background: #0f172a; border: 1px solid #334155; border-left: 5px solid #f97316; border-radius: 8px; color: #e2e8f0; display: flex; gap: 14px; justify-content: space-between; padding: 14px; }
.finance-action-header span { color: #f97316; display: block; font-size: 11px; font-weight: 900; letter-spacing: .08em; margin-bottom: 4px; text-transform: uppercase; }
.finance-action-header strong { color: #f8fafc; display: block; font-size: 20px; }
.finance-action-header small { color: #94a3b8; display: block; line-height: 1.45; margin-top: 4px; }
.finance-fullscreen { width: 100%; }
.finance-fullscreen .table-wrap { max-height: min(66vh, 720px); overflow: auto; }
.finance-fullscreen .module-table { min-width: 1080px; }
.dre-grid { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.dre-grid article { background: #f8fafc; border: 1px solid #dfe4ea; border-radius: 8px; display: grid; gap: 5px; padding: 12px; }
.dre-grid strong { color: #17202a; }
.dre-grid span { color: #475467; font-size: 13px; }
.dre-grid b { color: #344054; font-size: 16px; }
.timeline-feed { display: grid; gap: 10px; max-height: 620px; overflow: auto; padding-right: 4px; }
.timeline-item { background: #f8fafc; border: 1px solid #dfe4ea; border-left: 5px solid var(--brand-copper); border-radius: 8px; display: grid; gap: 6px; padding: 12px; }
.timeline-item.system { border-left-color: #b54708; }
.origin-badge { background: #e7ecef; border-radius: 999px; color: #344054; display: inline-flex; font-size: 11px; font-weight: 900; margin-left: 6px; padding: 3px 7px; vertical-align: middle; }
.origin-badge.whatsapp { background: #dcfae6; color: #067647; }
.origin-badge.portal { background: #e0f2fe; color: #026aa2; }
.origin-badge.system { background: #fef0c7; color: #b54708; }
.upload-thumb { aspect-ratio: 4 / 3; background: #e7ecef; border-radius: 8px; object-fit: cover; width: 100%; }
.upload-file-thumb { align-content: center; border: 1px dashed #98a2b3; color: #344054; display: grid; justify-items: center; padding: 14px; text-align: center; }
.upload-file-thumb strong { color: #b42318; font-size: 28px; }
.upload-file-thumb small { color: #667085; overflow-wrap: anywhere; }
.status-line { color: #667085; font-size: 13px; min-height: 18px; }
.status-line.info, .status-line.processing { color: #026aa2; }
.status-line.success { color: #067647; font-weight: 800; }
.status-line.error { color: #b42318; }
.empty { background: #fff; border: 1px dashed #cfd7df; border-radius: 8px; color: #667085; padding: 16px; }
.access-layout { display: grid; gap: 12px; grid-template-columns: 280px minmax(0, 1fr) 320px; }
.access-layout.two-columns { grid-template-columns: minmax(260px, 340px) minmax(0, 1fr); }
.access-layout.single { grid-template-columns: minmax(0, 1fr); }
.access-layout.security { grid-template-columns: minmax(240px, 320px) minmax(0, 1fr) minmax(260px, 340px); }
.access-list { display: grid; gap: 8px; margin-top: 12px; }
.access-row { background: #f8fafc; border: 1px solid #dfe4ea; border-radius: 8px; color: #17202a; display: grid; gap: 8px; justify-content: stretch; min-height: 58px; padding: 10px; text-align: left; width: 100%; }
.access-row.active { background: var(--brand-graphite); color: #fff; }
.access-row span { display: grid; gap: 2px; }
.access-row small { color: inherit; opacity: .76; }
.access-select { background: transparent; color: inherit; justify-content: flex-start; min-height: 0; padding: 0; text-align: left; }
.access-badges { display: flex; flex-wrap: wrap; gap: 6px; }
.permissions-matrix { display: grid; gap: 12px; margin-top: 12px; max-height: 680px; overflow: auto; padding-right: 4px; }
.permission-group { background: #f8fafc; border: 1px solid #edf1f5; border-radius: 8px; display: grid; gap: 8px; padding: 12px; }
.permission-group-head { align-items: center; display: flex; gap: 10px; justify-content: space-between; }
.permission-group h3 { font-size: 14px; margin: 0; }
.permission-toggle { align-items: flex-start; background: #fff; border: 1px solid #edf1f5; border-radius: 8px; display: grid; gap: 10px; grid-template-columns: 18px 1fr; padding: 10px; }
.permission-toggle input { margin-top: 3px; min-height: 16px; width: 16px; }
.permission-toggle span { display: grid; gap: 2px; }
.permission-toggle small { color: #667085; }
.user-access-card { background: #f8fafc; border: 1px solid #dfe4ea; border-radius: 8px; display: grid; gap: 10px; padding: 12px; }
.user-access-card.highlight { box-shadow: 0 0 0 2px rgba(167, 67, 29, .22); }
.user-access-card.inactive { opacity: .78; }
.user-access-head { align-items: flex-start; display: flex; gap: 10px; justify-content: space-between; }
.user-access-card small { color: #667085; display: block; margin-top: 2px; }
.user-profile-checks { display: grid; gap: 6px; }
.user-profile-checks label { align-items: center; display: grid; gap: 8px; grid-template-columns: 16px 1fr; }
.user-profile-checks input { min-height: 16px; width: 16px; }
.inline-check { align-items: center; display: inline-grid; gap: 8px; grid-template-columns: 18px 1fr; min-height: 44px; }
.inline-check input { min-height: 16px; width: 16px; }
.user-admin-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.access-denied-panel { background: #fff7ed; border: 1px solid #fed7aa; border-radius: 8px; color: #9a3412; padding: 14px; }
.security-charts { display: grid; gap: 18px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.error { color: #b42318; min-height: 18px; }
@media (max-width: 900px) { .metrics, .form-grid { grid-template-columns: repeat(2, 1fr); } .shell { padding: 14px; } }
@media (max-width: 900px) { .global-action-bar { align-items: stretch; flex-direction: column; position: static; } .global-action-buttons { justify-content: flex-start; } .contextual-sidebar { bottom: 10px; left: 10px; right: 10px; width: auto; } .global-skeleton { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 900px) { .sector-columns, .access-layout, .ai-layout, .ai-layout-wide, .ai-summary-grid, .ai-executive-grid, .ai-preset-grid, .ai-automation-card, .ai-usage-columns, .ai-healing-kpis, .ai-error-row, .ai-governance-grid, .triage-grid, .module-layout, .module-layout.wide, .bar-row, .orders-workspace, .order-spec-grid { grid-template-columns: 1fr; } textarea { grid-column: 1 / -1; } .order-timeline-panel { position: static; } }
@media (max-width: 900px) { .security-charts, .permission-group-head, .user-access-head { grid-template-columns: 1fr; } .permission-group-head, .user-access-head { align-items: flex-start; flex-direction: column; } }
@media (max-width: 900px) { .crm-grid, .crm-kpis, .client-fiscal-grid { grid-template-columns: 1fr; } .client-fiscal-grid article.span-2 { grid-column: auto; } }
@media (max-width: 900px) { .production-step-input { grid-template-columns: 1fr; } }
@media (max-width: 900px) { .purchase-flow, .purchase-item-grid { grid-template-columns: 1fr; } }
@media (max-width: 900px) { .finance-action-header { align-items: flex-start; flex-direction: column; } }
@media (max-width: 900px) { .layout-master-detail, .layout-master-detail:has(.detail-pane), .stock-card-kpis, .drawer-detail-grid { grid-template-columns: 1fr; } .detail-pane { max-height: none; position: static; } .stock-main-list { max-height: none; overflow: visible; } }
@media (max-width: 560px) { .metrics, .form-grid, .sector-columns, .ai-metrics, .client-cnpj-lookup { grid-template-columns: 1fr; } .form-grid .span-2 { grid-column: auto; } .ai-command-hero { align-items: flex-start; flex-direction: column; } .ai-action-bar, .ai-management-tabs { width: 100%; } .ai-action-bar > *, .ai-management-tabs > * { flex: 1 1 100%; } .ai-health-chart article { grid-template-columns: 1fr; } .topbar { align-items: flex-start; flex-direction: column; } .brand-lockup { align-items: flex-start; flex-direction: column; } .brand-logo { max-width: 100%; width: 100%; } .top-actions { justify-content: flex-start; } .tabs { overflow-x: auto; flex-wrap: nowrap; } textarea { grid-column: auto; } }