:root{--canvas:#fffaf0;--surface-soft:#faf5e8;--surface-card:#f5f0e0;--surface-strong:#ebe6d6;--ink:#0a0a0a;--body:#3a3a3a;--muted:#6a6a6a;--pink:#ff4d8b;--teal:#1a3a3a;--lavender:#b8a4ed;--peach:#ffb084;--ochre:#e8b94a;--mint:#a4d4c5;--coral:#ff6b5a;--success:#22c55e;--warning:#f59e0b;--error:#ef4444;--border:#e5e5e5;--r1:12px;--r2:16px;--r3:24px}*{box-sizing:border-box}html,body{margin:0;background:var(--canvas);color:var(--body);font-family:Inter,system-ui,sans-serif}body{min-height:100vh}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}.app-shell{display:flex;min-height:100vh}.sidebar{width:250px;position:fixed;inset:0 auto 0 0;background:var(--teal);color:#fff;padding:22px 16px;display:flex;flex-direction:column;z-index:30}.brand{display:flex;align-items:center;gap:12px;margin-bottom:26px}.logo{width:46px;height:46px;border-radius:14px;background:var(--pink);color:#fff;display:grid;place-items:center;font-weight:700;letter-spacing:-.06em}.logo.big{width:72px;height:72px;border-radius:24px;font-size:22px}.brand strong{display:block;font-size:14px}.brand small{opacity:.65}.sidebar nav{display:grid;gap:5px}.sidebar nav a{padding:12px;border-radius:12px;color:#e9eeee;font-size:14px}.sidebar nav a:hover,.sidebar nav a:focus{background:rgba(255,255,255,.12)}.sidebar-foot{margin-top:auto;display:flex;gap:8px;align-items:center;font-size:12px;flex-wrap:wrap}.sidebar-foot a{margin-left:auto;text-decoration:underline}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--error)}.status-dot.online{background:var(--success)}.main{margin-left:250px;width:calc(100% - 250px)}.topbar{padding:28px 34px 12px;display:flex;align-items:flex-end;justify-content:space-between}.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:var(--muted)}h1{margin:5px 0 0;color:var(--ink);font-size:30px;letter-spacing:-.04em}.content{padding:18px 34px 80px;max-width:1450px}.grid{display:grid;gap:16px}.stats{grid-template-columns:repeat(4,minmax(0,1fr))}.stat{padding:20px;border:1px solid var(--border);border-radius:16px;background:var(--surface-card);min-height:125px}.stat.pink{background:var(--pink);color:#fff}.stat.teal{background:var(--teal);color:#fff}.stat.lav{background:var(--lavender);color:var(--ink)}.stat.peach{background:var(--peach);color:var(--ink)}.stat .label{font-size:12px;opacity:.75}.stat .value{font-size:25px;font-weight:600;letter-spacing:-.04em;margin-top:12px}.section{margin-top:28px}.section-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:12px}.section h2{font-size:18px;color:var(--ink);margin:0}.card{background:var(--surface-soft);border:1px solid var(--border);border-radius:16px;padding:18px}.feature{border-radius:24px}.table-wrap{overflow:auto;border:1px solid var(--border);border-radius:16px;background:#fffdf7}table{width:100%;border-collapse:collapse;min-width:760px}th,td{text-align:left;padding:13px 14px;border-bottom:1px solid var(--border);font-size:13px}th{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);background:var(--surface-card)}tr:last-child td{border-bottom:0}.btn{border:1px solid var(--ink);background:var(--ink);color:#fff;border-radius:12px;min-height:44px;padding:10px 16px;font-weight:600}.btn.secondary{background:transparent;color:var(--ink);border-color:var(--border)}.btn.pink{background:var(--pink);border-color:var(--pink)}.btn.danger{background:var(--error);border-color:var(--error)}.full{width:100%}.input,.form-grid input,.form-grid select,.form-grid textarea,input,select,textarea{width:100%;border:1px solid #d9d7cf;background:#fffdf7;border-radius:12px;padding:11px 12px;min-height:44px;outline:none}input:focus,select:focus,textarea:focus{border-color:var(--ink);box-shadow:0 0 0 3px rgba(255,77,139,.14)}label{display:grid;gap:6px;font-size:12px;font-weight:600;color:var(--ink)}textarea{min-height:100px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.span-2{grid-column:span 2}.filters{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:10px;margin-bottom:14px}.badge{display:inline-flex;align-items:center;padding:5px 9px;border-radius:999px;background:var(--surface-strong);font-size:11px;font-weight:700}.badge.success{background:#d9f7e2;color:#166534}.badge.warning{background:#fff0c7;color:#8a5a00}.badge.error{background:#ffe0dc;color:#9d2417}.phone-card{display:flex;justify-content:space-between;gap:14px;align-items:center}.phone-card h3{margin:0;color:var(--ink);font-size:15px}.phone-meta{font-size:12px;color:var(--muted);margin-top:5px}.phone-price{font-weight:700;color:var(--ink)}.empty{text-align:center;padding:42px 18px}.alert{padding:12px 14px;border-radius:12px;margin-bottom:12px}.alert.error{background:#ffe0dc;color:#8b1e14}.offline-banner{position:fixed;top:0;left:0;right:0;background:var(--error);color:#fff;text-align:center;padding:8px;z-index:100;font-size:12px}.online-pill{font-size:12px;display:flex;align-items:center;gap:6px}.online-pill i{width:8px;height:8px;border-radius:50%;background:var(--success)}.online-pill i.offline{background:var(--error)}.mobile-only,.bottom-nav{display:none}.login-page{display:grid;place-items:center;padding:20px}.login-card{width:min(430px,100%);background:var(--surface-soft);border:1px solid var(--border);border-radius:24px;padding:34px;box-shadow:0 12px 30px rgba(10,10,10,.05)}.login-card h1{font-size:32px;margin:8px 0}.login-card p{margin:0 0 22px;color:var(--muted)}.login-card form{display:grid;gap:14px}.login-card small{display:block;margin-top:18px;color:var(--muted)}.toast{position:fixed;right:20px;bottom:20px;background:var(--ink);color:#fff;padding:12px 16px;border-radius:12px;z-index:100}.offline-banner[x-cloak],.toast[x-cloak]{display:none!important}.pos-layout{display:grid;grid-template-columns:1.6fr .9fr;gap:16px}.cart{position:sticky;top:20px}.cart-item{padding:12px 0;border-bottom:1px solid var(--border)}.cart-total{display:grid;gap:8px;margin-top:16px}.total-row{display:flex;justify-content:space-between}.total-row.grand{font-size:20px;color:var(--ink);font-weight:700;border-top:1px solid var(--border);padding-top:12px}.search-results{display:grid;gap:8px;margin-top:12px}.search-result{padding:12px;border:1px solid var(--border);border-radius:12px;background:#fffdf7;display:flex;justify-content:space-between;gap:10px;align-items:center}.install-card{background:var(--lavender);border-radius:24px;padding:18px;display:flex;justify-content:space-between;gap:12px;align-items:center}.kpi-row{display:flex;gap:8px;flex-wrap:wrap}.kpi{padding:8px 11px;border-radius:999px;background:var(--surface-strong);font-size:12px}
@media(max-width:1024px){.sidebar{transform:translateX(-100%);transition:.2s}.sidebar.open{transform:none}.main{margin-left:0;width:100%}.mobile-only{display:inline-grid}.topbar{padding:18px 18px 8px;align-items:center}.content{padding:12px 18px 90px}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.pos-layout{grid-template-columns:1fr}.cart{position:static}.bottom-nav{position:fixed;display:grid;grid-template-columns:repeat(5,1fr);bottom:0;left:0;right:0;background:#fffdf7;border-top:1px solid var(--border);z-index:40;padding:6px 8px calc(6px + env(safe-area-inset-bottom))}.bottom-nav a{text-align:center;font-size:19px;padding:5px;border-radius:12px}.bottom-nav span{display:block;font-size:9px;margin-top:2px}.bottom-nav .primary{background:var(--ink);color:#fff}.filters{grid-template-columns:1fr 1fr}.filters .wide{grid-column:span 2}}
@media(max-width:600px){h1{font-size:23px}.stats{grid-template-columns:1fr 1fr;gap:10px}.stat{padding:14px;min-height:108px}.stat .value{font-size:20px}.form-grid{grid-template-columns:1fr}.span-2{grid-column:auto}.filters{grid-template-columns:1fr}.filters .wide{grid-column:auto}.section{margin-top:20px}.card{padding:14px}.phone-card{align-items:flex-start}.top-actions{display:none}}