:root{
  --bg:#f5f7fb;--panel:#fff;--ink:#172033;--muted:#718096;--line:rgba(148,163,184,.24);
  --blue:#5b67f1;--blue2:#3e49c9;--green:#18a875;--red:#e14c5a;--amber:#d59016;--nav:#111827;
  --radius:20px;--shadow:0 18px 55px rgba(15,23,42,.09);--shadow-hover:0 24px 70px rgba(15,23,42,.16);
  --glass:rgba(255,255,255,.72);--input:rgba(255,255,255,.82);
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;background:var(--bg);color:var(--ink);min-height:100vh;overflow-x:hidden}a{text-decoration:none;color:inherit}button,input,select,textarea{font:inherit}.ambient{position:fixed;border-radius:999px;filter:blur(90px);pointer-events:none;opacity:.22;z-index:-1}.ambient-one{width:420px;height:420px;background:var(--blue);top:-150px;right:-120px}.ambient-two{width:360px;height:360px;background:var(--green);bottom:-180px;left:16%}
.app{display:grid;grid-template-columns:270px minmax(0,1fr);min-height:100vh}.sidebar{background:linear-gradient(180deg,color-mix(in srgb,var(--nav) 96%,white),var(--nav));color:#dce5f7;padding:18px 14px;position:sticky;top:0;height:100vh;overflow:auto;z-index:30;border-right:1px solid rgba(255,255,255,.06);box-shadow:18px 0 55px rgba(8,15,31,.13)}.sidebar::-webkit-scrollbar{width:5px}.sidebar::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14);border-radius:99px}.logo{display:flex;align-items:center;gap:11px;font-weight:800;font-size:17px;padding:8px 9px 20px}.logo-badge,.brandmark{display:grid;place-items:center;background:linear-gradient(135deg,var(--blue),color-mix(in srgb,var(--blue) 55%,#9bdcff));color:#fff;border-radius:15px;font-weight:900;box-shadow:0 10px 28px color-mix(in srgb,var(--blue) 34%,transparent)}.logo-badge{width:44px;height:44px;flex:0 0 44px}.logo-image{width:44px;height:44px;border-radius:15px;background:#fff;display:grid;place-items:center;overflow:hidden;flex:0 0 44px;box-shadow:0 10px 25px rgba(0,0,0,.12)}.logo-image img{width:100%;height:100%;object-fit:contain;padding:4px}.logo-text{display:flex;flex-direction:column;min-width:0}.logo-text strong{color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.logo-text span{font-size:10px;color:#8fa2c6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}.nav-title{font-size:10px;text-transform:uppercase;letter-spacing:.14em;color:#7283a2;padding:17px 11px 7px}.nav a{position:relative;display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:13px;margin:3px 0;color:#bac7df;font-size:13.5px;transition:transform .2s ease,background .2s ease,color .2s ease,box-shadow .2s ease}.nav a:before{content:"";position:absolute;left:4px;top:50%;width:3px;height:0;background:#fff;border-radius:99px;transform:translateY(-50%);transition:.2s}.nav a:hover{background:rgba(255,255,255,.08);color:#fff;transform:translateX(3px)}.nav a.active{background:linear-gradient(135deg,color-mix(in srgb,var(--blue) 78%,transparent),color-mix(in srgb,var(--blue2) 58%,transparent));color:#fff;box-shadow:0 11px 30px color-mix(in srgb,var(--blue) 20%,transparent)}.nav a.active:before{height:19px}.main{min-width:0}.topbar{height:74px;background:color-mix(in srgb,var(--panel) 87%,transparent);backdrop-filter:blur(18px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 25px;position:sticky;top:0;z-index:20}.topbar-left,.top-store{display:flex;align-items:center;gap:10px}.top-store{gap:9px;min-width:0}.top-store b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.top-actions{align-items:center}.content{padding:26px;max-width:1800px;margin:0 auto;width:100%}.page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:21px}.page-head h1{margin:0;font-size:28px;letter-spacing:-.035em;line-height:1.15}.page-head .muted{margin-top:5px}.muted{color:var(--muted)}.tiny{font-size:12px}.grid{display:grid;gap:16px}.kpis{grid-template-columns:repeat(4,minmax(0,1fr))}.two{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.card{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:19px;box-shadow:var(--shadow);overflow:hidden;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}.glass-ui .card{background:linear-gradient(145deg,color-mix(in srgb,var(--panel) 90%,transparent),color-mix(in srgb,var(--panel) 70%,transparent));backdrop-filter:blur(18px)}.card:after{content:"";position:absolute;inset:-1px;background:linear-gradient(115deg,transparent 15%,rgba(255,255,255,.26) 42%,transparent 62%);transform:translateX(-140%);pointer-events:none}.animations-on .card:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover);border-color:color-mix(in srgb,var(--blue) 24%,var(--line))}.animations-on .card:hover:after{animation:cardShine .7s ease}.card h3{margin:0 0 14px;font-size:15px;letter-spacing:-.01em}.kpi{min-height:126px;display:flex;flex-direction:column;justify-content:space-between}.kpi:before{content:"";position:absolute;width:100px;height:100px;border-radius:50%;right:-42px;top:-45px;background:color-mix(in srgb,var(--blue) 11%,transparent)}.kpi .value,.value{font-size:26px;font-weight:850;letter-spacing:-.045em;margin-top:8px}.kpi .label,.label{color:var(--muted);font-size:12.5px}.alert-card{border-color:color-mix(in srgb,var(--amber) 25%,var(--line))}
.badge{display:inline-flex;align-items:center;width:max-content;padding:5px 9px;border-radius:999px;background:color-mix(in srgb,var(--blue) 10%,var(--panel));color:var(--blue2);font-size:11px;font-weight:800;border:1px solid color-mix(in srgb,var(--blue) 12%,transparent)}.badge.green{background:color-mix(in srgb,var(--green) 11%,var(--panel));color:color-mix(in srgb,var(--green) 80%,#063);border-color:color-mix(in srgb,var(--green) 18%,transparent)}.badge.red{background:color-mix(in srgb,var(--red) 10%,var(--panel));color:#b82e3b;border-color:color-mix(in srgb,var(--red) 16%,transparent)}.badge.amber{background:color-mix(in srgb,var(--amber) 11%,var(--panel));color:#8d5d00;border-color:color-mix(in srgb,var(--amber) 18%,transparent)}
.btn,.icon-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid var(--line);border-radius:13px;padding:10px 14px;font-weight:750;cursor:pointer;background:color-mix(in srgb,var(--panel) 90%,#e9eef7);color:var(--ink);transition:transform .18s ease,box-shadow .18s ease,background .18s ease,border-color .18s ease}.btn:hover,.icon-btn:hover{transform:translateY(-1px);box-shadow:0 9px 24px rgba(15,23,42,.1);border-color:color-mix(in srgb,var(--blue) 22%,var(--line))}.btn.primary{background:linear-gradient(135deg,var(--blue),var(--blue2));border-color:transparent;color:#fff;box-shadow:0 11px 26px color-mix(in srgb,var(--blue) 24%,transparent)}.btn.primary:hover{filter:saturate(1.08) brightness(1.02)}.btn.danger{background:color-mix(in srgb,var(--red) 11%,var(--panel));color:#b52b38}.btn.success{background:color-mix(in srgb,var(--green) 11%,var(--panel));color:#0f7752}.btn.full{width:100%}.btn.glow{box-shadow:0 0 0 1px rgba(255,255,255,.18) inset,0 12px 30px color-mix(in srgb,var(--blue) 30%,transparent)}.icon-btn{width:39px;height:39px;padding:0;border-radius:12px}.toolbar{display:flex;gap:8px;flex-wrap:wrap}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:calc(var(--radius) - 5px);background:var(--panel)}.table{width:100%;border-collapse:collapse}.table th,.table td{text-align:left;padding:11px 12px;border-bottom:1px solid var(--line);font-size:13px;white-space:nowrap}.table th{background:color-mix(in srgb,var(--panel) 88%,#e7edf7);color:#5d6a80;font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;position:sticky;top:0;z-index:1}.table tbody tr{transition:background .16s ease,transform .16s ease}.table tbody tr:hover{background:color-mix(in srgb,var(--blue) 4%,var(--panel))}.table tr:last-child td{border-bottom:0}.voided-row{opacity:.67;background:color-mix(in srgb,var(--red) 5%,var(--panel))}.voided-row td:first-child{color:var(--red)}
.form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}label{display:block;font-size:11.5px;font-weight:750;color:color-mix(in srgb,var(--ink) 76%,var(--muted));margin-bottom:6px}input,select,textarea{width:100%;border:1px solid color-mix(in srgb,var(--line) 90%,#aeb9ca);background:var(--input);border-radius:13px;padding:10px 11px;color:var(--ink);outline:none;transition:border-color .16s ease,box-shadow .16s ease,background .16s ease}input:focus,select:focus,textarea:focus{border-color:color-mix(in srgb,var(--blue) 60%,white);box-shadow:0 0 0 4px color-mix(in srgb,var(--blue) 10%,transparent);background:var(--panel)}textarea{min-height:90px;resize:vertical}.theme-grid input[type=color]{height:45px;padding:4px;cursor:pointer}.alert{padding:12px 14px;border-radius:14px;margin-bottom:15px;border:1px solid transparent}.alert.success{background:color-mix(in srgb,var(--green) 9%,var(--panel));color:#116845;border-color:color-mix(in srgb,var(--green) 20%,transparent)}.alert.danger{background:color-mix(in srgb,var(--red) 9%,var(--panel));color:#9d2d37;border-color:color-mix(in srgb,var(--red) 18%,transparent)}.alert.info{background:color-mix(in srgb,var(--blue) 8%,var(--panel));color:color-mix(in srgb,var(--blue2) 90%,#122);border-color:color-mix(in srgb,var(--blue) 16%,transparent)}
.pos-layout{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(330px,.75fr);gap:16px;align-items:start}.pos-layout>.card:last-child{position:sticky;top:92px}.pos-search{display:flex;gap:8px}.pos-search input{font-size:16px;padding:13px 14px}.cart-row{display:grid;grid-template-columns:2fr 90px 110px 40px;gap:8px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line)}.cart-row:last-child{border-bottom:0}.summary-line{display:flex;justify-content:space-between;padding:8px 0}.summary-line.total{font-size:22px;font-weight:900;border-top:2px solid var(--line);margin-top:5px;padding-top:13px}.chart{height:250px;display:flex;align-items:flex-end;gap:8px;padding-top:20px}.bar{flex:1;background:linear-gradient(180deg,color-mix(in srgb,var(--blue) 55%,#b8e8ff),var(--blue));border-radius:9px 9px 3px 3px;min-width:12px;position:relative;box-shadow:0 8px 20px color-mix(in srgb,var(--blue) 14%,transparent);transition:filter .2s,transform .2s}.bar:hover{filter:brightness(1.06);transform:translateY(-3px)}.bar span{position:absolute;bottom:-23px;left:50%;transform:translateX(-50%);font-size:9.5px;color:var(--muted);white-space:nowrap}
.metric-list{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.metric{background:color-mix(in srgb,var(--panel) 90%,#e8edf5);border:1px solid var(--line);border-radius:14px;padding:12px}.metric b{display:block;font-size:18px}.insight-line{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}.insight-line:last-child{border-bottom:0}.logo-preview{margin-top:14px;display:flex;align-items:center;gap:12px;padding:12px;border:1px dashed var(--line);border-radius:14px}.logo-preview img{width:64px;height:64px;object-fit:contain;border-radius:12px;background:#fff;border:1px solid var(--line)}
.login-body{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 20% 10%,color-mix(in srgb,var(--blue) 18%,transparent),transparent 35%),radial-gradient(circle at 82% 78%,color-mix(in srgb,var(--green) 14%,transparent),transparent 28%),var(--bg);padding:20px}.login-card{position:relative;width:min(430px,94vw);background:color-mix(in srgb,var(--panel) 88%,transparent);backdrop-filter:blur(24px);border:1px solid rgba(255,255,255,.45);border-radius:26px;padding:31px;box-shadow:0 28px 90px rgba(15,23,42,.17);overflow:hidden}.login-card:before{content:"";position:absolute;inset:0 0 auto;height:4px;background:linear-gradient(90deg,var(--blue),var(--green))}.brandmark{width:56px;height:56px;margin-bottom:19px}.login-logo{width:90px;height:72px;display:flex;align-items:center;margin-bottom:16px}.login-logo img{max-width:90px;max-height:72px;object-fit:contain}.login-card h1{margin:0 0 4px;letter-spacing:-.04em}.login-card input{margin-bottom:14px}.print-only{display:none}.receipt{max-width:760px;margin:auto;background:white;padding:24px;color:#172033}.receipt h2{text-align:center;margin-bottom:4px}.right{text-align:right}.nowrap{white-space:nowrap}.receipt.thermal{max-width:320px;font-size:12px;padding:10px}.receipt.thermal .table th,.receipt.thermal .table td{padding:5px 4px;font-size:10px}.receipt.thermal .grid.two{grid-template-columns:1fr}.receipt.thermal .right{text-align:left}
.ai-shell{display:grid;gap:16px}.ai-hero{display:flex;align-items:center;justify-content:space-between;min-height:190px;background:linear-gradient(135deg,color-mix(in srgb,var(--blue) 12%,var(--panel)),color-mix(in srgb,var(--green) 7%,var(--panel)))}.ai-hero h2{font-size:30px;letter-spacing:-.04em;margin:12px 0 5px}.ai-hero p{max-width:720px;line-height:1.6}.ai-orb{width:112px;height:112px;flex:0 0 112px;border-radius:34px;display:grid;place-items:center;color:#fff;font-size:31px;font-weight:950;background:linear-gradient(145deg,var(--blue),var(--green));box-shadow:0 24px 55px color-mix(in srgb,var(--blue) 25%,transparent);transform:rotate(7deg)}.ai-form{display:grid;grid-template-columns:1fr auto;gap:9px}.ai-form input{font-size:16px;padding:13px 14px}.quick-prompts{display:flex;gap:7px;flex-wrap:wrap;margin-top:11px}.quick-prompts a{padding:7px 10px;border:1px solid var(--line);border-radius:999px;font-size:11px;color:var(--muted);transition:.16s}.quick-prompts a:hover{color:var(--blue);border-color:color-mix(in srgb,var(--blue) 28%,var(--line));transform:translateY(-1px)}.ai-answer{border-color:color-mix(in srgb,var(--blue) 24%,var(--line))}.ai-answer-head{display:flex;align-items:center;gap:9px}.ai-answer-head h3{margin:0}.ai-dot{width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 0 6px color-mix(in srgb,var(--green) 12%,transparent)}.ai-answer p{font-size:15px;line-height:1.65}.ai-list{display:grid;gap:7px}.ai-list>div{padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--panel) 90%,#eef2f7)}
.notice-list{display:grid;gap:9px}.notice{display:flex;align-items:center;gap:11px;padding:10px;border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--panel) 92%,#eef2f7);transition:transform .18s}.notice:hover{transform:translateX(3px)}.notice-icon{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;font-weight:900}.notice-icon.amber{background:color-mix(in srgb,var(--amber) 12%,var(--panel));color:#9b6700}.notice-icon.red{background:color-mix(in srgb,var(--red) 11%,var(--panel));color:#b42b38}.empty-state{padding:26px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:14px}
.command-backdrop{position:fixed;inset:0;background:rgba(8,15,31,.48);backdrop-filter:blur(8px);display:none;align-items:flex-start;justify-content:center;padding-top:min(16vh,150px);z-index:100}.command-backdrop.open{display:flex}.command-box{width:min(620px,92vw);background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:12px;box-shadow:0 34px 100px rgba(0,0,0,.28)}.command-title{display:flex;justify-content:space-between;align-items:center;padding:6px 7px 11px}.command-box input{padding:13px 14px;font-size:15px}.command-list{display:grid;gap:3px;max-height:390px;overflow:auto;margin-top:8px}.command-list a{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-radius:12px;font-size:13px}.command-list a:hover,.command-list a.active{background:color-mix(in srgb,var(--blue) 9%,var(--panel));color:var(--blue)}
.mobile-toggle{display:none}.density-compact .card{padding:14px}.density-compact .table th,.density-compact .table td{padding:8px 10px}.density-compact .nav a{padding:8px 11px}
body.dark-ui{--bg:#0b1020;--panel:#121a2b;--ink:#e8edf7;--muted:#95a3ba;--line:rgba(148,163,184,.16);--glass:rgba(18,26,43,.78);--input:#11192a;--shadow:0 18px 55px rgba(0,0,0,.25);--shadow-hover:0 25px 75px rgba(0,0,0,.38)}body.dark-ui .topbar{background:rgba(18,26,43,.78)}body.dark-ui .table th{background:#172135}body.dark-ui .receipt{color:#172033}body.dark-ui input[type=color]{background:#fff}
@keyframes cardShine{to{transform:translateX(140%)}}@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes softPop{from{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}.animations-on .content>.page-head{animation:fadeUp .36s ease both}.animations-on .content>.grid,.animations-on .content>.card,.animations-on .content>.table-wrap,.animations-on .content>.pos-layout,.animations-on .ai-shell{animation:fadeUp .42s ease both}.animations-on .kpis>.card:nth-child(2){animation-delay:.04s}.animations-on .kpis>.card:nth-child(3){animation-delay:.08s}.animations-on .kpis>.card:nth-child(4){animation-delay:.12s}.animations-on .login-card{animation:softPop .45s ease both}
@media(max-width:1180px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.pos-layout{grid-template-columns:1fr}.pos-layout>.card:last-child{position:static}.two{grid-template-columns:1fr}.three{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1050px){.app{grid-template-columns:1fr}.sidebar{position:fixed;left:-290px;width:270px;transition:left .24s ease}.sidebar.open{left:0}.mobile-toggle{display:inline-flex}.content{padding:20px}.form-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.content{padding:14px}.topbar{padding:0 13px;height:66px}.top-store b{max-width:150px}.top-actions .muted{display:none}.page-head{flex-direction:column}.page-head h1{font-size:24px}.kpis,.three,.form-grid{grid-template-columns:1fr}.cart-row{grid-template-columns:1fr 70px 82px 36px}.ai-hero{min-height:unset}.ai-orb{display:none}.ai-form{grid-template-columns:1fr}.toolbar{width:100%}.page-head .toolbar .btn{flex:1}.card{padding:15px}.command-backdrop{padding-top:8vh}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}.card:hover{transform:none!important}.notice:hover{transform:none!important}}
@media print{.sidebar,.topbar,.no-print,.ambient,.command-backdrop{display:none!important}.app{display:block}.content{padding:0}.print-only{display:block}.card{box-shadow:none;border:0;background:#fff}.receipt{padding:0}.receipt.thermal{width:80mm;max-width:80mm;margin:0;padding:3mm;font-size:11px}.receipt.thermal .table th,.receipt.thermal .table td{white-space:normal}}