:root{--bg:#f6f7fb;--card:#fff;--ink:#20242b;--muted:#6b7280;--accent:#6d4aff;--danger:#d83a52;--ok:#12805c;--line:#e7e8ee}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,sans-serif;background:var(--bg);color:var(--ink)}header{background:#171923;color:#fff;padding:14px 3%;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}header small{color:#bbb}nav{display:flex;gap:8px;flex-wrap:wrap}nav a{color:#fff;text-decoration:none;padding:8px 10px;border-radius:9px}nav a:hover{background:#2c3040}main{max-width:1280px;margin:22px auto;padding:0 16px}.grid{display:grid;grid-template-columns:1.6fr .9fr;gap:18px}.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:0 4px 18px #1111}.products{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}.product{border:1px solid var(--line);border-radius:14px;padding:14px;background:#fff;cursor:pointer;text-align:left}.product:hover{border-color:var(--accent);transform:translateY(-1px)}.product strong{display:block;font-size:16px}.product span{color:var(--accent);font-weight:800}.btn,button{border:0;border-radius:10px;padding:10px 14px;font-weight:700;cursor:pointer;background:var(--accent);color:#fff}.btn.secondary,button.secondary{background:#ececf3;color:#242631}.danger{background:var(--danger)!important}.ok{background:var(--ok)!important}input,select,textarea{width:100%;padding:10px;border:1px solid #d8dae3;border-radius:9px;font:inherit}.row{display:flex;gap:10px;align-items:end}.row>*{flex:1}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:10px;border-bottom:1px solid var(--line)}.right{text-align:right}.muted{color:var(--muted)}.total{font-size:28px;font-weight:900}.login{max-width:420px;margin:9vh auto}.alert{padding:12px;border-radius:10px;background:#fff2c7;margin-bottom:12px}.success{background:#dff7ec}.qty{display:flex;gap:6px;align-items:center}.qty button{padding:5px 9px}.receipt{max-width:320px;margin:auto;background:#fff;color:#000;padding:10px;font-family:monospace}.receipt h2{text-align:center;margin:4px}.receipt hr{border:0;border-top:1px dashed #000}.no-print{}.actions{display:flex;gap:8px;flex-wrap:wrap}footer{text-align:center;color:#999;padding:25px}@media(max-width:800px){.grid{grid-template-columns:1fr}header{align-items:flex-start}.row{flex-direction:column;align-items:stretch}}@media print{body{background:#fff}.no-print,header,footer{display:none!important}.receipt{width:72mm;max-width:72mm;padding:0}.receipt *{font-size:11px}.receipt h2{font-size:16px}}