:root{
  --bg:#061126;--bg-soft:#091834;--panel:#0a1b38;--panel-2:#0d2346;--panel-3:#102a54;--text:#eef4ff;
  --muted:#8fa3c7;--line:#16315d;--line-soft:rgba(126,158,227,.12);--primary:#3168ff;--primary-2:#4f7cff;
  --success:#28c76f;--warning:#ff9f43;--danger:#ff5c5c;--shadow:0 18px 50px rgba(2,10,24,.34)
}
*{box-sizing:border-box}html,body{margin:0;padding:0;background:radial-gradient(circle at top left,#0d2552 0,#07152e 28%,#061126 62%,#050d1e 100%);color:var(--text);font-family:Inter,Arial,sans-serif}
button,input,select,textarea{font:inherit}.hidden{display:none!important}.muted{color:var(--muted)}.small{font-size:12px}.empty-state{padding:18px;color:var(--muted);text-align:center}
.login-shell{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at top left,#14367a 0,#081733 28%,#061126 55%,#050d1d 100%)}
.login-card{width:min(440px,100%);background:rgba(11,24,49,.94);border:1px solid rgba(125,162,255,.16);border-radius:28px;padding:28px;box-shadow:var(--shadow)}
.login-brand{display:flex;align-items:center;gap:14px;margin-bottom:24px}.login-logo{width:54px;height:54px;border-radius:18px;background:linear-gradient(135deg,#275dff,#6f8dff);display:grid;place-items:center;font-weight:800}
.login-brand h1{margin:0;font-size:26px}.login-brand p{margin:4px 0 0;color:var(--muted)}.login-copy h2{margin:0 0 6px;font-size:22px}.login-copy p{margin:0 0 16px;color:var(--muted);line-height:1.5}
.login-form{display:grid;gap:12px}.login-form label{display:grid;gap:6px}.login-form span{font-size:13px;color:#cfe0ff}.login-form input{width:100%;padding:14px 16px;border-radius:14px;border:1px solid var(--line);background:#08162f;color:var(--text);outline:0}
.login-form input:focus{border-color:#4c78ff;box-shadow:0 0 0 3px rgba(47,102,255,.12)}.login-form button{margin-top:8px;width:100%;padding:14px 16px;border-radius:14px;border:0;background:linear-gradient(135deg,var(--primary),#4e79ff);color:#fff;font-weight:700;cursor:pointer}.login-note{margin-top:14px;color:var(--muted);font-size:13px}
.app-shell{min-height:100vh;display:grid;grid-template-columns:238px 1fr;background:linear-gradient(180deg,#061126,#08162f)}
.app-sidebar{padding:14px 12px;border-right:1px solid rgba(118,150,226,.12);background:linear-gradient(180deg,#061126,#08162f 60%,#071731);display:flex;flex-direction:column;gap:16px}
.brand-block{display:flex;align-items:center;gap:12px;padding:8px 10px 18px;border-bottom:1px solid rgba(118,150,226,.12)}.brand-logo{width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg,#214df0,#6b8cff);display:grid;place-items:center;font-weight:800}.brand-block strong{font-size:16px}.brand-block strong span{color:#5a86ff}.brand-block small{display:block;margin-top:3px;color:var(--muted)}
.nav-list{display:flex;flex-direction:column;gap:8px}.nav-btn{display:flex;align-items:center;gap:12px;width:100%;padding:13px 14px;border:1px solid transparent;border-radius:15px;background:transparent;color:#dbe7ff;cursor:pointer;text-align:left;transition:.16s ease}
.nav-btn:hover{background:rgba(255,255,255,.04);border-color:rgba(118,150,226,.12)}.nav-btn.active{background:linear-gradient(135deg,#214ecf,#2f66ff);box-shadow:0 12px 24px rgba(38,91,255,.22)}.nav-icon{width:18px;display:inline-block;text-align:center;font-size:14px}
.sidebar-mini-card{margin-top:auto;padding:14px;border:1px solid rgba(118,150,226,.15);background:rgba(13,28,58,.7);border-radius:18px}.mini-title{font-size:12px;color:#dfe9ff;margin-bottom:10px;font-weight:700}.mini-row{display:flex;justify-content:space-between;padding:6px 0;color:var(--muted)}.mini-row strong{color:#fff}
.sidebar-user{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid rgba(118,150,226,.15);border-radius:18px;background:rgba(13,28,58,.7)}.user-avatar{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,#6b8cff,#2f66ff);display:grid;place-items:center;font-weight:800}.sidebar-user small{color:var(--muted)}
.app-main{display:flex;flex-direction:column;min-width:0}.topbar{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:16px 22px;border-bottom:1px solid rgba(118,150,226,.1);position:sticky;top:0;background:rgba(6,17,38,.9);backdrop-filter:blur(10px);z-index:10}
.topbar-title h1{margin:0;font-size:22px;font-weight:800}.topbar-title p{margin:6px 0 0;color:var(--muted);font-size:14px}.topbar-right{display:flex;align-items:center;gap:12px;min-width:0}.global-search-wrap{min-width:320px}
.global-search{width:100%;padding:13px 16px;border-radius:13px;border:1px solid var(--line);background:#08162f;color:#fff;outline:0}.global-search:focus{border-color:#4c78ff}.topbar-actions{display:flex;gap:10px;align-items:center}
.ghost-btn,.primary-btn,.danger-btn,.filter-btn,.secondary-btn{padding:11px 15px;border-radius:13px;border:1px solid var(--line);background:#0b1b38;color:#fff;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}
.primary-btn{background:linear-gradient(135deg,#2f66ff,#4c79ff);border-color:#2f66ff}.danger-btn{background:#31111a;border-color:#5d1e2f;color:#ffcad4}.secondary-btn{background:#12264b}.page-content{padding:18px}.screen-grid{display:grid;gap:16px}
.kpi-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.kpi-card{background:linear-gradient(180deg,#0b1b39,#0b1934);border:1px solid var(--line-soft);border-radius:20px;padding:18px 18px 16px;box-shadow:var(--shadow)}
.kpi-card-head{display:flex;align-items:center;gap:14px}.kpi-icon{width:64px;height:64px;border-radius:22px;display:grid;place-items:center;font-size:28px;flex-shrink:0}.kpi-icon.primary{background:rgba(47,102,255,.18);color:#7fa0ff}.kpi-icon.warning{background:rgba(255,157,46,.16);color:#ffb45a}.kpi-icon.success{background:rgba(39,196,107,.16);color:#55dc87}
.kpi-label{color:#c9d8fa;font-size:14px}.kpi-value{font-size:28px;font-weight:800;margin-top:4px}.kpi-trend{margin-top:10px;font-size:13px}.up{color:var(--success)}.down{color:var(--danger)}
.panel{background:linear-gradient(180deg,#0a1a37,#091630);border:1px solid var(--line-soft);border-radius:20px;box-shadow:var(--shadow)}.panel-head{padding:14px 16px;border-bottom:1px solid var(--line-soft);display:flex;justify-content:space-between;align-items:center;gap:12px}
.panel-head h3{margin:0;font-size:18px}.panel-head .actions{display:flex;gap:8px;align-items:center}.page-badge{padding:6px 10px;border-radius:999px;background:rgba(47,102,255,.16);color:#9fb6ff;font-size:12px;font-weight:700}.subtle-link{color:#90acff;font-size:13px;font-weight:700;cursor:pointer}
.content-two-col{display:grid;grid-template-columns:1.65fr .95fr;gap:16px}.content-three-col{display:grid;grid-template-columns:.95fr 1.1fr .95fr;gap:16px}.lower-grid{display:grid;grid-template-columns:1.45fr .95fr;gap:16px}
.table-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line-soft)}.table-toolbar .left,.table-toolbar .right{display:flex;align-items:center;gap:10px}
.table-wrap{overflow:auto}.inventory-table{width:100%;border-collapse:collapse}.inventory-table th,.inventory-table td{padding:13px 14px;border-bottom:1px solid rgba(130,157,215,.12);text-align:left;font-size:14px;white-space:nowrap}.inventory-table th{font-size:11px;color:#8fa3c7;text-transform:uppercase;letter-spacing:.06em}
.product-cell{display:flex;align-items:center;gap:12px;min-width:220px}.thumb{width:42px;height:42px;border-radius:12px;background:linear-gradient(135deg,#243d6d,#111a30);border:1px solid rgba(255,255,255,.08);display:grid;place-items:center;overflow:hidden;color:#8fa3c7}.thumb img{width:100%;height:100%;object-fit:cover}
.product-name{font-weight:700}.product-sub{font-size:12px;color:var(--muted);margin-top:3px;white-space:normal}.status-pill{display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:999px;font-weight:700;font-size:12px}.status-pill.ok{background:rgba(39,196,107,.12);color:#5ddd90}.status-pill.low{background:rgba(255,157,46,.12);color:#ffb45a}.status-pill.out{background:rgba(255,91,87,.12);color:#ff8a86}
.row-actions{display:flex;gap:8px}.icon-btn{width:36px;height:36px;border-radius:10px;border:1px solid rgba(255,255,255,.08);background:#0c1d3d;color:#dce7ff;cursor:pointer}.icon-btn:hover{background:#12264c}.table-footer{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;color:var(--muted);font-size:13px}
.pagination{display:flex;gap:8px;align-items:center}.pagination span,.pagination button{min-width:32px;height:32px;border-radius:10px;border:1px solid rgba(255,255,255,.08);display:grid;place-items:center;background:#0c1d3d;color:#dce7ff}.pagination .active{background:linear-gradient(135deg,#2f66ff,#4c79ff);border-color:#2f66ff}
.list-card{padding:14px 16px}.customer-snapshot-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.snapshot-card{padding:14px;border:1px solid var(--line-soft);border-radius:16px;background:linear-gradient(180deg,#0b1d3f,#0b1834)}
.snapshot-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.snapshot-brand{display:flex;align-items:center;gap:10px}.snapshot-logo{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-weight:800;background:linear-gradient(135deg,#2f66ff,#6b8cff)}
.snapshot-name{font-weight:700}.snapshot-meta{font-size:12px;color:var(--muted);margin-top:4px}.snapshot-actions{display:flex;gap:8px;margin-top:12px}.snapshot-actions button{flex:1;padding:9px 10px;border-radius:12px;border:1px solid rgba(255,255,255,.08);background:#0d2346;color:#dce7ff;cursor:pointer}
.customer-list{padding:8px 10px 12px}.customer-row{padding:14px 14px;border-radius:14px;border:1px solid transparent;cursor:pointer;display:flex;flex-direction:column;gap:4px}.customer-row small{color:var(--muted)}.customer-row:hover{background:rgba(255,255,255,.03);border-color:var(--line-soft)}.customer-row.active{background:linear-gradient(180deg,#0f2855,#0c1f42);border-color:rgba(82,118,214,.32)}
.customer-profile{padding:16px;display:grid;gap:16px}.customer-shell{display:grid;gap:16px}.profile-top{display:flex;align-items:flex-start;gap:16px}.profile-avatar{width:72px;height:72px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#5f71ff,#814eff);font-size:28px;font-weight:800;flex-shrink:0}.profile-name h3{margin:0;font-size:18px}.meta{display:grid;gap:6px;margin-top:8px;color:var(--muted);font-size:13px}
.metric-split{display:grid;grid-template-columns:1fr 1fr;gap:12px}.small-stat{padding:14px;border:1px solid var(--line-soft);border-radius:16px;background:#0b1b38}.small-stat .value{font-size:28px;font-weight:800;margin:8px 0 4px}.notes-box{padding:14px;border:1px solid var(--line-soft);border-radius:16px;background:#0b1b38;color:#dce7ff;line-height:1.5;min-height:92px}.quick-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.quick-actions button{padding:12px 12px;border-radius:13px;border:1px solid rgba(255,255,255,.08);background:#0d2346;color:#dce7ff;cursor:pointer}
.form-panel{padding:16px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.field,.field-full{display:flex;flex-direction:column;gap:7px}.field-full{grid-column:1 / -1}
label{font-size:13px;font-weight:600;color:#dce7ff}input,select,textarea{border:1px solid var(--line);border-radius:12px;padding:11px 12px;font:inherit;background:#0b1730;color:#fff;outline:0;width:100%}input:focus,select:focus,textarea:focus{border-color:#4c78ff}textarea{min-height:92px;resize:vertical}
.upload-box{border:1.5px dashed #304f87;border-radius:16px;padding:14px;background:#091a36;color:#aac0ea}.form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:16px;flex-wrap:wrap}
.recent-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 22px;padding:14px 16px}.recent-card-item{display:flex;gap:12px;padding:10px 0;border-bottom:1px solid rgba(130,157,215,.12)}.activity-icon{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-weight:700;flex-shrink:0}.activity-icon.blue{background:rgba(47,102,255,.16);color:#7fa0ff}.activity-icon.green{background:rgba(39,196,107,.16);color:#55dc87}.activity-icon.orange{background:rgba(255,157,46,.16);color:#ffb45a}.activity-icon.purple{background:rgba(129,78,255,.16);color:#b39dff}.activity-copy strong{display:block}.activity-copy small{display:block;color:var(--muted);margin-top:4px;line-height:1.45}.activity-meta{margin-left:auto;text-align:right;color:var(--muted);font-size:12px;min-width:120px}
.chart-card{padding:16px}.chart-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.chart-value{font-size:38px;font-weight:800}.chart-trend{font-size:13px;color:var(--success);margin-top:6px}.chart-box{height:190px;border-radius:16px;border:1px solid var(--line-soft);background:linear-gradient(180deg,rgba(49,104,255,.08),rgba(49,104,255,.02));padding:12px;position:relative;overflow:hidden}.chart-grid-line{position:absolute;left:0;right:0;height:1px;background:rgba(151,178,236,.08)}.chart-grid-line.l1{top:32px}.chart-grid-line.l2{top:72px}.chart-grid-line.l3{top:112px}.chart-grid-line.l4{top:152px}.chart-svg{position:absolute;left:12px;right:12px;top:12px;bottom:26px}.chart-axis{position:absolute;left:12px;right:12px;bottom:8px;display:flex;justify-content:space-between;color:var(--muted);font-size:11px}
.simple-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.simple-form{padding:16px}.list-table{padding:0 0 8px}.toolbar-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line-soft)}.toolbar-row .actions{display:flex;gap:8px;flex-wrap:wrap}
.notice-box{padding:14px 16px;border:1px solid var(--line-soft);border-radius:16px;background:#0b1b38;color:var(--muted)}
.camera-box{margin-top:12px;display:grid;gap:10px;border:1px solid var(--line-soft);border-radius:16px;padding:12px;background:#08162f}
.camera-box video{width:100%;max-height:320px;border-radius:12px;background:#000;object-fit:cover}
.clickable-row{cursor:pointer}
.clickable-row:hover{background:rgba(255,255,255,.03)}
.customer-detail-layout{align-items:start}
.customer-summary-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.customer-summary-grid.compact{grid-template-columns:repeat(4,minmax(0,1fr))}
.customer-actions-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.payment-pill.partial{background:rgba(255,159,67,.14);color:#ffb45a}
.payment-pill.bank{background:rgba(47,102,255,.14);color:#8fb2ff}
.payment-pill.credit{background:rgba(129,78,255,.16);color:#c2b1ff}
.sale-detail-shell{display:grid;gap:16px}
.sale-detail-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.sale-detail-title{font-size:20px;font-weight:800}
.sale-detail-columns{display:grid;grid-template-columns:1.1fr .9fr;gap:16px}
.detail-stack{display:grid;gap:12px}
.detail-card{padding:14px;border:1px solid var(--line-soft);border-radius:16px;background:#0b1b38}
.detail-card strong{display:block;margin-bottom:8px}
.detail-meta{color:var(--muted);line-height:1.6}
.detail-pre{white-space:pre-wrap}
.sale-line-row{margin-bottom:10px}
.stack-list{display:grid;gap:12px}
.supplier-link-row,.identifier-schema-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto auto;gap:10px;align-items:end;padding:12px;border:1px solid var(--line-soft);border-radius:16px;background:#091834}
.identifier-schema-row{grid-template-columns:1fr 1.2fr auto}
.supplier-link-preferred-wrap{display:flex;align-items:center;gap:8px;padding:0 4px 10px 4px;font-size:13px;color:var(--muted)}
.toggle-line{display:flex;align-items:center;gap:10px}
.toggle-line input{width:auto}
.purchase-line-row,.sale-line-row{padding:12px;border:1px solid var(--line-soft);border-radius:16px;background:#091834}
.tracked-purchase-note{padding:10px 12px;border:1px dashed rgba(126,158,227,.18);border-radius:12px;color:var(--muted);font-size:12px}
.sale-unit-picker-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border:1px dashed rgba(126,158,227,.18);border-radius:12px}
.unit-picker-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.unit-picker-card{display:grid;gap:6px;padding:14px;border:1px solid var(--line-soft);border-radius:16px;background:#0b1b38;cursor:pointer}
.unit-picker-card.active{border-color:rgba(82,118,214,.42);background:#0c2145}
.unit-picker-card input{width:auto}
.unit-editor-card{padding:14px;border:1px solid var(--line-soft);border-radius:16px;background:#0b1b38}
.unit-editor-head{font-weight:800;margin-bottom:10px}
.unit-editor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.unit-inline{margin-top:6px;padding:8px 10px;border-radius:10px;background:rgba(47,102,255,.1);color:#dce7ff;font-size:12px;line-height:1.4}
.compact-btn{padding:8px 12px;border-radius:10px}
body.theme-paper .clickable-row:hover{background:#fafbff}
body.theme-paper .payment-pill.partial{background:rgba(255,159,67,.14);color:#f09321}
body.theme-paper .payment-pill.bank{background:#eef2ff;color:#4a63f7}
body.theme-paper .payment-pill.credit{background:#f3edff;color:#7b58e8}
body.theme-paper .detail-card,body.theme-paper .app-modal-card .small-stat{background:#fff;border-color:#e5e9f3}
body.theme-paper .supplier-link-row,body.theme-paper .identifier-schema-row,body.theme-paper .purchase-line-row,body.theme-paper .sale-line-row,body.theme-paper .unit-picker-card,body.theme-paper .unit-editor-card{background:#fff;border-color:#e5e9f3}
body.theme-paper .tracked-purchase-note,body.theme-paper .sale-unit-picker-bar{border-color:#dfe5f2}
body.theme-paper .unit-inline{background:#eef2ff;color:#3045be}
@media (max-width:1400px){.content-two-col,.lower-grid,.content-three-col,.simple-grid{grid-template-columns:1fr}.customer-snapshot-grid{grid-template-columns:1fr}}
@media (max-width:1200px){.app-shell{grid-template-columns:1fr}.app-sidebar{display:none}.global-search-wrap{min-width:260px}.sale-detail-columns,.customer-summary-grid.compact{grid-template-columns:1fr 1fr}}
@media (max-width:900px){.kpi-row{grid-template-columns:1fr 1fr}.topbar{flex-direction:column;align-items:flex-start}.topbar-right{width:100%;flex-wrap:wrap}.global-search-wrap{min-width:unset;width:100%}}
@media (max-width:700px){.page-content{padding:12px}.kpi-row,.metric-split,.quick-actions,.recent-grid,.form-grid,.customer-snapshot-grid,.simple-grid,.customer-summary-grid,.customer-summary-grid.compact,.customer-actions-grid,.sale-detail-columns,.unit-picker-grid,.unit-editor-grid,.supplier-link-row,.identifier-schema-row{grid-template-columns:1fr}.inventory-table th,.inventory-table td{padding:11px 10px}.sale-detail-top{align-items:stretch;flex-direction:column}.sale-unit-picker-bar{flex-direction:column;align-items:stretch}}



.app-modal{position:fixed;inset:0;z-index:1200;display:grid;place-items:center;padding:20px}
.app-modal.hidden{display:none!important}
.app-modal-backdrop{position:absolute;inset:0;background:rgba(2,10,24,.72);backdrop-filter:blur(4px)}
.app-modal-card{position:relative;z-index:1;width:min(760px,100%);max-height:calc(100vh - 40px);overflow:auto;border-radius:22px;background:linear-gradient(180deg,#0a1a37,#091630);border:1px solid rgba(126,158,227,.12);box-shadow:0 18px 50px rgba(2,10,24,.34)}
.app-modal-head{padding:16px 18px;border-bottom:1px solid rgba(126,158,227,.12);display:flex;align-items:center;justify-content:space-between;gap:12px}
.app-modal-head h3{margin:0;font-size:18px}
.app-modal-body{padding:18px}
.modal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.modal-grid .field-full{grid-column:1/-1}
.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:16px}
.secondary-btn{padding:11px 15px;border-radius:13px;border:1px solid var(--line);background:#0b1b38;color:#fff;cursor:pointer}
.secondary-btn:hover{background:#12264c}
.form-help{font-size:12px;color:var(--muted);margin-top:4px}
.mobile-menu-btn{display:none;width:42px;height:42px;border-radius:12px;border:1px solid var(--line);background:#0b1b38;color:#fff;cursor:pointer;margin-right:10px}
.mobile-sidebar-backdrop{display:none}
@media (max-width:1200px){
  .mobile-menu-btn{display:inline-grid;place-items:center}
  .mobile-sidebar-backdrop{display:block;position:fixed;inset:0;background:rgba(2,10,24,.55);z-index:40}
  .mobile-sidebar-backdrop.hidden{display:none!important}
  .app-sidebar{display:flex;position:fixed;left:0;top:0;bottom:0;width:280px;transform:translateX(-100%);transition:transform .2s ease;z-index:50;overflow:auto}
  .app-sidebar.mobile-open{transform:translateX(0)}
  .app-shell{grid-template-columns:1fr}
}
@media (max-width:900px){.modal-grid{grid-template-columns:1fr}}

.theme-switcher-host{display:flex;align-items:center}
.theme-switcher{display:inline-flex;align-items:center;gap:4px;padding:4px;border-radius:14px;border:1px solid var(--line);background:rgba(11,27,56,.72)}
.theme-switcher.compact{flex-wrap:nowrap}
.theme-option{min-width:108px;padding:9px 12px;border:0;border-radius:10px;background:transparent;color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:700;white-space:nowrap}
.theme-option:hover{color:#fff;background:rgba(255,255,255,.06)}
.theme-option.active{background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff;box-shadow:0 10px 18px rgba(47,102,255,.22)}
.theme-option-icon{font-size:13px;line-height:1}
.theme-settings-card{display:grid;gap:14px}
.theme-settings-card strong{display:block;font-size:15px;color:var(--text)}
.kpi-icon.orange{background:rgba(129,78,255,.16);color:#b39dff}

body.theme-paper{--text:#1a2340;--muted:#6d7892;--line:#dbe3ef;--line-soft:rgba(105,123,170,.16);--primary:#4d63ff;--primary-2:#6b81ff;--shadow:0 18px 40px rgba(48,64,105,.08);background:#f5f7fb;color:var(--text)}
body.theme-paper .login-shell{background:radial-gradient(circle at top left,#edf2ff 0,#fafbff 38%,#f0f3f9 100%)}
body.theme-paper .login-card{background:rgba(255,255,255,.96);border-color:#e3e8f2;box-shadow:0 30px 60px rgba(45,60,102,.12)}
body.theme-paper .login-brand p,body.theme-paper .login-copy p,body.theme-paper .login-note{color:#6d7892}
body.theme-paper .login-form span{color:#53617e}
body.theme-paper .login-form input{background:#fff;border-color:#dce3ef;color:#1a2340}
body.theme-paper .app-shell{background:#f5f7fb}
body.theme-paper .app-sidebar{background:
linear-gradient(180deg,#08112a,#0b1633 68%,#111d42),
radial-gradient(circle at left bottom,rgba(77,99,255,.28),transparent 38%);border-right:0;box-shadow:18px 0 40px rgba(17,27,54,.06)}
body.theme-paper .brand-block{border-bottom:1px solid rgba(255,255,255,.08)}
body.theme-paper .sidebar-mini-card,body.theme-paper .sidebar-user{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.08)}
body.theme-paper .app-main{background:linear-gradient(180deg,#fbfcff,#f3f5fb)}
body.theme-paper .topbar{background:rgba(255,255,255,.92);border-bottom:1px solid #e7ebf3;box-shadow:0 8px 24px rgba(56,72,118,.06)}
body.theme-paper .topbar-title h1,body.theme-paper .panel-head h3,body.theme-paper .product-name,body.theme-paper .snapshot-name,body.theme-paper .profile-name h3{color:#1a2340}
body.theme-paper .topbar-title p,body.theme-paper .muted,body.theme-paper .empty-state,body.theme-paper .product-sub,body.theme-paper .meta,body.theme-paper .customer-row small,body.theme-paper .table-footer,body.theme-paper .form-help{color:#6d7892}
body.theme-paper .page-content{padding:24px}
body.theme-paper .global-search,body.theme-paper input,body.theme-paper select,body.theme-paper textarea{background:#fff;border-color:#dce3ef;color:#1a2340}
body.theme-paper input:focus,body.theme-paper select:focus,body.theme-paper textarea:focus{border-color:#6580ff;box-shadow:0 0 0 3px rgba(90,113,255,.12)}
body.theme-paper .global-search::placeholder,body.theme-paper input::placeholder,body.theme-paper textarea::placeholder{color:#94a0b8}
body.theme-paper .ghost-btn,body.theme-paper .filter-btn,body.theme-paper .secondary-btn,body.theme-paper .icon-btn,body.theme-paper .mobile-menu-btn{background:#fff;border-color:#dce3ef;color:#223050}
body.theme-paper .ghost-btn:hover,body.theme-paper .filter-btn:hover,body.theme-paper .secondary-btn:hover,body.theme-paper .icon-btn:hover,body.theme-paper .mobile-menu-btn:hover{background:#f7f9ff}
body.theme-paper .primary-btn{background:linear-gradient(135deg,#4d63ff,#6b81ff);border-color:#4d63ff;box-shadow:0 12px 22px rgba(77,99,255,.22)}
body.theme-paper .danger-btn{background:#fff6f7;border-color:#f0d4d8;color:#c05267}
body.theme-paper .theme-switcher{background:#eef2ff;border-color:#dfe5f2}
body.theme-paper .theme-option{color:#5f6c86}
body.theme-paper .theme-option:hover{color:#223050;background:rgba(255,255,255,.88)}
body.theme-paper .theme-option.active{color:#fff}
body.theme-paper .app-main .panel,body.theme-paper .app-main .kpi-card,body.theme-paper .app-main .small-stat,body.theme-paper .app-main .notes-box,body.theme-paper .app-main .snapshot-card,body.theme-paper .app-main .notice-box,body.theme-paper .app-main .chart-box,body.theme-paper .app-modal-card{background:#fff;border:1px solid #e5e9f3;box-shadow:var(--shadow)}
body.theme-paper .app-main .panel-head,body.theme-paper .app-main .table-toolbar,body.theme-paper .app-main .toolbar-row,body.theme-paper .app-modal-head{border-bottom:1px solid #eef1f6}
body.theme-paper .app-main .inventory-table th{color:#7d889f}
body.theme-paper .app-main .inventory-table td,body.theme-paper .app-main .inventory-table th{border-bottom:1px solid #eef1f6}
body.theme-paper .app-main .inventory-table tbody tr:hover{background:#fafbff}
body.theme-paper .thumb{background:#f7f8fc;border-color:#e3e8f1;color:#8894ae}
body.theme-paper .page-badge{background:#eef2ff;color:#5268ff}
body.theme-paper .customer-row:hover{background:#f7f9ff;border-color:#e4e9f3}
body.theme-paper .customer-row.active{background:#eef2ff;border-color:rgba(82,104,255,.22)}
body.theme-paper .small-stat,body.theme-paper .notes-box,body.theme-paper .snapshot-card{background:#fff}
body.theme-paper .quick-actions button,body.theme-paper .snapshot-actions button{background:#fff;border-color:#dfe5ef;color:#243150}
body.theme-paper .upload-box,body.theme-paper .camera-box{background:#fafbff;border-color:#dbe3ef;color:#74819b}
body.theme-paper .kpi-card{padding:22px 20px}
body.theme-paper .kpi-label{color:#66738d}
body.theme-paper .kpi-icon.primary{background:#eef2ff;color:#5b6fff}
body.theme-paper .kpi-icon.warning{background:#fff3e6;color:#ff9a27}
body.theme-paper .kpi-icon.success{background:#ebf8ee;color:#23a455}
body.theme-paper .kpi-icon.orange{background:#f2ecff;color:#7f59ff}
body.theme-paper .chart-box{background:linear-gradient(180deg,rgba(77,99,255,.08),rgba(77,99,255,.02))}
body.theme-paper .chart-grid-line{background:rgba(122,138,181,.12)}
body.theme-paper .app-modal-backdrop{background:rgba(20,29,49,.34)}
body.theme-paper .app-modal-card input,body.theme-paper .app-modal-card select,body.theme-paper .app-modal-card textarea{background:#fff;border-color:#dce3ef;color:#1a2340}
body.theme-paper .app-modal-card .secondary-btn,body.theme-paper .app-modal-card .icon-btn{background:#fff;border-color:#dce3ef;color:#223050}
body.theme-paper .status-pill.ok{background:rgba(39,196,107,.12);color:#2aa85d}
body.theme-paper .status-pill.low{background:rgba(255,159,67,.14);color:#ff981f}
body.theme-paper .status-pill.out{background:rgba(255,92,92,.12);color:#eb5d5d}
body.theme-paper label{color:#4f5d79}
body.theme-paper .mobile-sidebar-backdrop{background:rgba(18,26,48,.32)}

@media (max-width:900px){
  .theme-switcher.compact{width:100%}
  .theme-switcher.compact .theme-option{flex:1;min-width:0}
  .theme-switcher-host{width:100%}
}

html{height:100%}
body{min-height:100dvh}
.login-shell,.app-shell{min-height:100dvh}
.app-sidebar{padding-top:calc(14px + env(safe-area-inset-top));padding-bottom:calc(14px + env(safe-area-inset-bottom))}
.topbar{padding-top:calc(16px + env(safe-area-inset-top))}
.page-content{padding-bottom:calc(18px + env(safe-area-inset-bottom))}
.table-wrap{overflow:auto;-webkit-overflow-scrolling:touch}
.app-modal{padding:calc(20px + env(safe-area-inset-top)) 20px calc(20px + env(safe-area-inset-bottom))}
.native-shell .login-shell,.native-shell .app-shell{min-height:100dvh}

@media (max-width:700px){
  .topbar{padding:calc(12px + env(safe-area-inset-top)) 12px 12px;gap:12px}
  .topbar-title{width:100%}
  .topbar-title h1{font-size:20px}
  .topbar-right,.topbar-actions{width:100%}
  .topbar-right{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .topbar-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .topbar-actions > *{min-width:0}
  .global-search-wrap,.theme-switcher-host{grid-column:1 / -1}
  .theme-switcher{width:100%}
  .theme-option{flex:1;min-width:0}
  .panel-head,.table-toolbar,.table-footer,.toolbar-row,.form-actions,.modal-actions{flex-direction:column;align-items:stretch}
  .panel-head .actions,.table-toolbar .left,.table-toolbar .right,.toolbar-row .actions{width:100%;flex-wrap:wrap}
  .ghost-btn,.primary-btn,.danger-btn,.filter-btn,.secondary-btn{width:100%}
  .app-sidebar{width:min(86vw,320px)}
  .app-modal{padding:calc(12px + env(safe-area-inset-top)) 12px calc(12px + env(safe-area-inset-bottom))}
  .app-modal-card{width:100%;max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));border-radius:18px}
}