:root{--bg:#f4f6f8;--panel:#fff;--ink:#17202a;--muted:#697586;--dark:#111827;--green:#16a34a;--orange:#f59e0b;--red:#dc2626;--blue:#2563eb;--line:#e5e7eb;--radius:16px}*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;background:var(--bg);color:var(--ink)}a{text-decoration:none;color:inherit}.app{min-height:100vh;display:grid;grid-template-columns:245px 1fr}aside{background:var(--dark);color:#fff;padding:20px;display:flex;flex-direction:column;gap:24px}.brand{display:flex;align-items:center;gap:10px}.brand>span,.logo-big{display:grid;place-items:center;background:var(--orange);color:#111827;font-weight:900;border-radius:12px}.brand>span{width:42px;height:42px}.brand small{display:block;color:#9ca3af}nav{display:grid;gap:7px}nav a{padding:11px 12px;border-radius:10px;color:#d1d5db}nav a:hover,nav a.active{background:#1f2937;color:#fff}.logout{margin-top:auto;width:100%;background:transparent;color:#fff;border:1px solid #374151;padding:10px;border-radius:10px}main{padding:22px;min-width:0}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}header h1{margin:0;font-size:26px}header p{margin:4px 0;color:var(--muted)}.avatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#fff;font-weight:800}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:16px}.stat,.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 4px 14px rgba(17,24,39,.04)}.stat{padding:17px}.stat small,.stat span{color:var(--muted);display:block}.stat strong{font-size:25px;display:block;margin:5px 0}.card{padding:20px;margin-bottom:16px}.card h2{margin-top:0}.grid2{display:grid;grid-template-columns:1.35fr .65fr;gap:16px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.full{grid-column:1/-1}label{display:block;font-size:13px;font-weight:700;margin:10px 0}input,select,textarea{width:100%;margin-top:6px;padding:11px 12px;border:1px solid #d5dae0;border-radius:10px;background:#fff;font:inherit}textarea{min-height:90px;resize:vertical}button,.primary,.secondary{border:0;border-radius:10px;padding:11px 15px;font-weight:800;cursor:pointer}.primary{background:var(--orange);color:#111827;display:inline-block}.secondary{background:#e5e7eb;color:#111827}.danger{background:#fee2e2;color:#991b1b}.table{overflow:auto}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:11px;border-bottom:1px solid var(--line);white-space:nowrap}th{font-size:12px;color:var(--muted);text-transform:uppercase}.status{background:#dcfce7;color:#166534;padding:4px 8px;border-radius:999px;font-size:12px}.status.warn{background:#fef3c7;color:#92400e}.status.bad{background:#fee2e2;color:#991b1b}.alert{padding:12px 14px;border-radius:10px;margin-bottom:14px}.alert.success{background:#dcfce7;color:#166534}.alert.error{background:#fee2e2;color:#991b1b}.auth-shell{min-height:100vh;display:grid;grid-template-columns:1fr 1fr}.auth-hero{background:var(--dark);color:#fff;padding:8vw}.logo-big{width:68px;height:68px}.auth-main{display:grid;place-items:center;padding:30px}.auth-card{width:min(620px,100%)}.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.product-card{padding:12px;border:1px solid var(--line);border-radius:12px;background:#fff;cursor:pointer;text-align:left;min-height:110px}.product-card:hover{border-color:var(--orange)}.product-card b{display:block}.product-card small{color:var(--muted);display:block;margin:4px 0}.product-card strong{display:block;margin-top:8px}.product-thumb{width:44px;height:44px;border-radius:9px;object-fit:cover;background:#f3f4f6;border:1px solid var(--line);vertical-align:middle;margin-right:8px}.product-photo{width:100%;height:90px;border-radius:9px;object-fit:cover;background:#f3f4f6;margin-bottom:8px}.pos-layout{display:grid;grid-template-columns:1.25fr .75fr;gap:16px}.cart-row{display:grid;grid-template-columns:1fr 76px 94px 36px;gap:8px;align-items:center;border-bottom:1px solid var(--line);padding:8px 0}.cart-row input{margin:0}.cart-total{font-size:28px;font-weight:900}.muted{color:var(--muted)}.receipt{max-width:430px;margin:auto;background:white;padding:24px}.receipt h2{text-align:center;margin-bottom:2px}.receipt .center{text-align:center}.receipt-line{display:flex;justify-content:space-between;padding:6px 0;gap:16px}.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:14px}.toolbar input,.toolbar select{width:auto;min-width:180px;margin:0}.tabs{display:flex;gap:8px;overflow:auto;margin-bottom:14px}.tab{padding:8px 12px;background:#fff;border:1px solid var(--line);border-radius:999px;white-space:nowrap;cursor:pointer}.tab.active{background:var(--dark);color:#fff}.variant-box{border:1px solid var(--line);border-radius:12px;padding:12px;margin:8px 0;background:#fafafa}.inline{display:flex;gap:8px;align-items:center}.inline>*{flex:1}.kpi-row{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--line)}.empty{padding:30px;text-align:center;color:var(--muted)}.hide-print{}@media(max-width:1100px){.product-grid{grid-template-columns:repeat(3,1fr)}.stats{grid-template-columns:repeat(2,1fr)}}@media(max-width:900px){.app{grid-template-columns:1fr}aside{position:sticky;top:0;z-index:4;padding:10px;display:block}.brand{margin-bottom:8px}aside nav{display:flex;overflow:auto}aside nav a{white-space:nowrap}.logout{display:none}main{padding:14px}.grid2,.grid3,.pos-layout{grid-template-columns:1fr}.product-grid{grid-template-columns:repeat(2,1fr)}.auth-shell{grid-template-columns:1fr}.auth-hero{display:none}}@media(max-width:560px){.stats{grid-template-columns:1fr 1fr}.product-grid{grid-template-columns:1fr 1fr}.card{padding:14px}.form-grid{grid-template-columns:1fr}.full{grid-column:auto}.cart-row{grid-template-columns:1fr 60px 80px 32px}header h1{font-size:23px}}@media print{aside,header,.hide-print{display:none!important}.app{display:block}main{padding:0}.card{border:0;box-shadow:none}.receipt{max-width:80mm}}

/* v0.4 business operations */
aside nav{max-height:calc(100vh - 150px);overflow-y:auto}.stats+.grid2{margin-top:2px}details{margin-top:10px}.card .table{max-height:520px}.toolbar label{margin:0}.toolbar label input{margin-top:4px}