:root{
  --navy:#ffffff;--navy-2:#f7f8fc;--primary:#4f46e5;--primary-soft:#eef2ff;
  --ink:#162033;--muted:#687386;--line:#e5e9f2;--canvas:#f6f7fb;--white:#fff;
  --success:#07845b;--success-bg:#e8f8f1;--warning:#b76508;--warning-bg:#fff5df;
  --danger:#d23c4a;--danger-bg:#fff0f2;--radius:16px;
  --shadow:0 12px 36px rgba(35,45,75,.07);
  font-family:Inter,"Aptos","Segoe UI Variable","Segoe UI",ui-sans-serif,system-ui,-apple-system,sans-serif;
}
body{background:linear-gradient(145deg,#fafbff 0,#f4f6fb 48%,#f8fafc 100%);color:var(--ink);font-size:14px;letter-spacing:-.006em}
.app-shell{grid-template-columns:270px minmax(0,1fr)}
.sidebar{width:270px;background:rgba(255,255,255,.96);color:var(--ink);padding:18px 14px 20px;border-right:1px solid var(--line);box-shadow:8px 0 32px rgba(40,50,80,.035);backdrop-filter:blur(18px)}
.sidebar-brand{padding:2px 9px 20px;border-bottom:1px solid #edf0f5;margin-bottom:7px}.sidebar-brand b{font-size:15px;letter-spacing:-.02em}.sidebar-brand small{color:#8b95a7;font-size:10px;letter-spacing:.035em}
.brand-mark{background:linear-gradient(145deg,#5f58ec,#4338ca);box-shadow:0 9px 20px rgba(79,70,229,.22)}.brand-mark svg{width:27px;height:27px;fill:#fff}.brand-mark .brand-spark{fill:#fbbf24}
.sidebar nav{gap:2px;padding-right:4px}.sidebar-section{color:#a0a8b8;padding:17px 11px 6px;font-size:9px;letter-spacing:.14em}
.sidebar nav a{color:#5f6b7d;padding:9px 11px;border-radius:10px;font-weight:590;transition:background .15s,color .15s,transform .15s}.sidebar nav a:hover{background:#f3f5fa;color:#252e40;transform:translateX(1px)}
.sidebar nav a.active{background:linear-gradient(135deg,#eef2ff,#f3f0ff);color:#4338ca;font-weight:740;box-shadow:inset 3px 0 0 #6366f1}
.sidebar-nav-parent{display:grid;grid-template-columns:minmax(0,1fr) 34px;align-items:center;position:relative}.sidebar-nav-parent>a{min-width:0}.sidebar-nav-parent>button{width:30px;height:30px;display:grid;place-items:center;border:0;border-radius:8px;background:transparent;color:#8892a4;cursor:pointer}.sidebar-nav-parent>button:hover{background:#f0f2f7;color:#4f46e5}.sidebar-nav-parent>button svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}.sales-menu-collapsed .sidebar-nav-parent>button svg{transform:rotate(-90deg)}.sales-menu-collapsed .sales-submenu-item{display:none}
.sidebar nav a .icon{padding:2px;border-radius:6px}.sidebar nav a.sidebar-child{color:#788397;border-left:1px solid #e1e5ed;margin-left:17px}.sidebar nav a.sidebar-child.active{color:#4338ca;border-left-color:#6366f1;background:#f2f3ff}
.sidebar-footer{border-top:1px solid var(--line);color:#344054}.sidebar-footer small{color:#929bad}.status-dot{background:#10b981;box-shadow:0 0 0 4px #dff8ee}
.workspace{grid-column:2}.topbar{height:72px;background:rgba(255,255,255,.9);border-color:var(--line);padding:0 clamp(18px,2.4vw,34px);backdrop-filter:blur(16px)}
.global-search{height:42px;max-width:640px;border-color:#e1e5ee;background:#f8f9fc;border-radius:12px}.global-search .icon{width:17px;color:#8d97a8}.global-search:focus-within{border-color:#a7a5f6;background:#fff;box-shadow:0 0 0 4px rgba(99,102,241,.09)}
.workspace-switcher select,.icon-btn{border-color:#e1e5ee;background:#fff;border-radius:11px}.icon-btn:hover{background:#f6f7fb;color:var(--primary)}
.avatar{border-radius:11px;background:linear-gradient(145deg,#eef2ff,#e8e5ff);color:#4f46e5;border:1px solid #dddffd}
.content{padding:34px clamp(22px,3.4vw,52px);max-width:1680px}.page-header{margin-bottom:25px}.page-header h1,.sales-heading h1{font-size:29px;font-weight:760;letter-spacing:-.035em;color:#151e2f}.page-header p,.sales-heading p{color:#748094}.eyebrow{color:#5b55d9;font-size:10px;letter-spacing:.14em}
.panel,.metric-card{border-color:#e5e9f1;border-radius:16px;box-shadow:0 5px 22px rgba(31,43,75,.045)}.panel{padding:23px}.metric-card{padding:20px 21px;position:relative;overflow:hidden}.metric-card:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:linear-gradient(#7c73ed,#60a5fa);opacity:.72}.metric-card span{color:#7b8597;font-size:12px}.metric-card strong{font-size:25px;font-weight:760;color:#172033}
.btn{border-radius:11px;min-height:42px;padding:9px 16px;font-weight:690;transition:transform .12s,box-shadow .12s,background .12s}.btn:hover:not(:disabled){transform:translateY(-1px)}.btn.primary{background:linear-gradient(135deg,#5b55df,#4540c8);box-shadow:0 7px 17px rgba(79,70,229,.2)}.btn.primary:hover{background:linear-gradient(135deg,#514bd3,#3f3ab9)}.btn.secondary{border-color:#dde2eb;color:#465165;box-shadow:0 2px 5px rgba(30,40,70,.03)}
input,select,textarea{border-color:#dce2eb;border-radius:11px;background:#fff;min-height:44px}input:focus,select:focus,textarea:focus{border-color:#8985ed;box-shadow:0 0 0 4px rgba(99,102,241,.1)}
.summary-strip{border-radius:15px;box-shadow:0 4px 18px rgba(31,43,75,.035)}.summary-strip>div{padding:17px 24px}.summary-strip b{font-size:19px}.summary-strip span{font-size:10px;text-transform:uppercase;letter-spacing:.055em}
.sales-overview-grid button,.sales-module-grid button{border-color:#e3e7ef;border-radius:13px;box-shadow:0 3px 12px rgba(31,43,75,.025)}.sales-overview-grid button:hover,.sales-module-grid button:hover{border-color:#bfc1f6;background:#fafaff;box-shadow:0 8px 22px rgba(70,65,160,.075)}.sales-overview-grid button>span,.sales-module-icon,.template-icon{background:linear-gradient(145deg,#f0f2ff,#eceaff);color:#5b55d9}
.sales-list-panel{border-radius:16px}.sales-toolbar{background:#fafbfe;border-color:#e8ebf2}.responsive-table th{background:#f8f9fc;color:#7b8495;font-size:10px;letter-spacing:.075em}.responsive-table td{border-color:#edf0f5}.responsive-table tbody tr:hover{background:#fafaff}
.badge{padding:5px 9px;font-size:10px}.badge.info{background:#eeefff;color:#4f46e5}.badge.neutral{background:#f0f2f6}.empty-mini,.empty-table{background:#fafbfe;border-color:#dfe4ed}
.modal-overlay{background:rgba(25,31,48,.45);backdrop-filter:blur(5px)}.modal{border-radius:19px;border:1px solid rgba(255,255,255,.55);box-shadow:0 30px 90px rgba(20,27,50,.25)}.modal-header,.modal-footer{background:#fff;border-color:#e8ebf1}.toast{background:#252b40;border:1px solid rgba(255,255,255,.08);border-radius:12px}
.sync-footer{left:270px;height:38px;background:rgba(255,255,255,.94);border-color:#e5e8ef;color:#707b8e;padding:0 34px;gap:7px;backdrop-filter:blur(14px)}.sync-footer span b{color:#344054;margin-right:3px}.sync-footer a{color:#4f46e5;font-weight:700;text-decoration:none;margin-left:3px}.sync-footer .muted-dot{background:#a1a9b7;box-shadow:none}
.htmx-request{cursor:progress}.htmx-request .status-dot{animation:statusPulse 1s ease-in-out infinite}@keyframes statusPulse{50%{opacity:.35;transform:scale(.82)}}
.report-workspace{display:grid;grid-template-columns:minmax(360px,.75fr) minmax(480px,1.25fr);gap:18px;align-items:start}.report-result-panel{min-width:0}.report-result-panel .json-result{min-height:430px}.pos-operation-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.pos-operation-grid button{display:grid;grid-template-columns:40px minmax(0,1fr) 20px;align-items:center;gap:12px;padding:17px;border:1px solid var(--line);border-radius:13px;background:#fff;color:var(--ink);text-align:left;cursor:pointer}.pos-operation-grid button:hover:not(:disabled){border-color:#bfc1f6;background:#fafaff}.pos-operation-grid button:disabled{opacity:.55;cursor:not-allowed}.pos-operation-grid button>span{width:38px;height:38px;display:grid;place-items:center;border-radius:10px;background:#eeefff;color:#4f46e5}.pos-operation-grid button b,.pos-operation-grid button small{display:block}.pos-operation-grid button small{margin-top:3px;color:var(--muted);font-size:11px;line-height:1.4}.pos-operation-grid button i{font-style:normal;color:#7b8495}
@media(max-width:1000px){.report-workspace{grid-template-columns:1fr}.pos-operation-grid{grid-template-columns:1fr}}
@media(max-width:800px){.app-shell{display:block}.sidebar{width:286px;max-width:86vw}.workspace{display:block}.topbar{height:64px}.content{padding:24px 15px 72px}.sync-footer{left:0;padding:0 15px}.sidebar:after{background:rgba(20,26,40,.28);backdrop-filter:blur(2px)}}
@media(max-width:520px){body{font-size:13px}.page-header h1,.sales-heading h1{font-size:24px}.panel{padding:17px}.metric-card{padding:15px}.global-search{background:#f7f8fb}.top-actions{gap:6px}.sync-footer span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}