@import "https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap";
:root{--bg-canvas:#eceefb;--surface:#fff;--surface-sunken:#f4f5fb;--border:#ecedf6;--border-strong:#dad9ec;--text-primary:#2a2a35;--text-secondary:#6b6b78;--text-muted:#9a9aa8;--accent:#6c5ce7;--accent-hover:#5b4bd6;--accent-soft:#eae8fb;--shadow-card:0 12px 28px #5b4bd61a;--shadow-accent:0 6px 16px #6c5ce74d;--cat-violet:#6c5ce7;--cat-amber:#f8be3e;--cat-pink:#e879c9;--cat-green:#45d483;--cat-blue:#5b8def;--r-sm:12px;--r-md:14px;--r-card:22px;--font-ui:"Plus Jakarta Sans", sans-serif;--bg-surface:var(--surface);--bg-elevated:var(--surface-sunken);--border-subtle:var(--border);--bg:var(--bg-canvas);--panel:var(--surface);--fg:var(--text-primary);--muted:var(--text-secondary)}*{box-sizing:border-box;margin:0;padding:0}html,body{min-height:100%}body{background:var(--bg-canvas);color:var(--text-primary);font-family:var(--font-ui);-webkit-font-smoothing:antialiased;font-size:15px}::selection{color:var(--text-primary);background:#d9d3f7}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{border:3px solid var(--bg-canvas);background:#d6d8ec;border-radius:999px}a{color:inherit;text-decoration:none}h1{letter-spacing:-.02em;font-size:28px;font-weight:800;line-height:1.1}h2{letter-spacing:-.01em;font-size:18px;font-weight:700}.metric{letter-spacing:-.03em;font-variant-numeric:tabular-nums;font-weight:800;line-height:1}.label{color:var(--text-muted);font-size:12px;font-weight:600}.muted{color:var(--text-secondary);font-size:13px}.error{color:#d9534f;font-size:13px}.message{color:#1e9e63;font-size:13px}.shell{gap:20px;min-height:100vh;padding:20px;display:flex}.sidebar{background:var(--surface);width:72px;box-shadow:var(--shadow-card);border-radius:24px;flex-direction:column;flex:none;align-items:center;height:calc(100vh - 40px);padding:22px 13px;transition:width .18s;display:flex;position:sticky;top:20px}.sidebar.expanded{align-items:stretch;width:236px}.sidebar-logo{cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;gap:12px;width:100%;padding:3px;display:flex}.sidebar.expanded .sidebar-logo{justify-content:flex-start}.brand-name{letter-spacing:-.02em;color:var(--text-primary);white-space:nowrap;font-size:20px;font-weight:800;display:none}.sidebar.expanded .brand-name{display:inline}.snav{flex-direction:column;align-self:stretch;align-items:center;gap:8px;margin-top:30px;display:flex}.sidebar.expanded .snav{align-items:stretch}.snav a,.snav-out{width:46px;height:46px;color:var(--text-muted);cursor:pointer;border-radius:14px;justify-content:center;align-items:center;display:flex}.snav-out{background:0 0;border:none;font-family:inherit}.sidebar.expanded .snav a,.sidebar.expanded .snav-out{justify-content:flex-start;gap:12px;width:100%;padding:0 13px}.sidebar .lbl{white-space:nowrap;font-size:14px;font-weight:600;display:none}.sidebar.expanded .lbl{display:inline}.snav a:hover,.snav-out:hover{background:var(--surface-sunken);color:var(--text-secondary)}.snav a.active{background:var(--accent-soft);color:var(--accent)}.main{flex-direction:column;flex:1;gap:22px;min-width:0;display:flex}.topbar{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.topbar .sub{color:var(--text-secondary);margin-top:4px;font-size:13px}.bot-online{color:#1e9e63;white-space:nowrap;background:#dcf4e6;border-radius:999px;align-items:center;gap:7px;padding:9px 14px;font-size:12px;font-weight:700;display:flex}.bot-online .dot{background:#1e9e63;border-radius:999px;width:7px;height:7px}.card{background:var(--surface);border-radius:var(--r-card);box-shadow:var(--shadow-card);padding:24px}.card-pad0{background:var(--surface);border-radius:var(--r-card);box-shadow:var(--shadow-card);overflow:hidden}.section-head{justify-content:space-between;align-items:center;margin-bottom:18px;display:flex}.btn{font-family:var(--font-ui);cursor:pointer;color:#fff;background:var(--accent);box-shadow:var(--shadow-accent);border:none;border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:12px 22px;font-size:14px;font-weight:700;display:inline-flex}.btn:hover{background:var(--accent-hover)}.btn.secondary{background:var(--accent-soft);color:var(--accent-hover);box-shadow:none}.btn.ghost{border:1.5px solid var(--border-strong);color:var(--text-secondary);box-shadow:none;background:0 0}.btn.ghost:hover{background:var(--surface-sunken)}.btn.danger{color:#d9534f;box-shadow:none;background:#fbe0e0}.btn:disabled{opacity:.7;cursor:not-allowed;box-shadow:none}.field{flex-direction:column;gap:8px;margin-bottom:16px;display:flex}.field label{color:var(--text-muted);font-size:12px;font-weight:600}input:not([type=checkbox]):not([type=color]),select,textarea{background:var(--surface-sunken);color:var(--text-primary);border-radius:var(--r-sm);border:1.5px solid #0000;width:100%;padding:12px 15px;font-family:inherit;font-size:14px}input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft);background:#fff;outline:none}input[type=color]{background:var(--surface-sunken);border:1px solid var(--border);border-radius:var(--r-sm);width:52px;height:40px;padding:2px}input[type=file]{background:var(--surface-sunken);border:1.5px dashed var(--border-strong);border-radius:var(--r-sm);color:var(--text-secondary);cursor:pointer;width:100%;padding:11px 15px;font-size:13px;transition:border-color .15s,background .15s}input[type=file]:hover{border-color:var(--accent);background:var(--accent-soft)}input[type=file]::file-selector-button{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:999px;margin-right:12px;padding:7px 14px;font-size:13px;font-weight:600;transition:background .15s}input[type=file]::file-selector-button:hover{background:var(--accent-hover)}.pill{border-radius:999px;width:max-content;padding:5px 12px;font-size:12px;font-weight:700;display:inline-block}.pill.pending{color:#b07d0a;background:#fbf0ce}.pill.confirmed{color:#6c5ce7;background:#eae8fb}.pill.shipped{color:#2e6fd6;background:#e3edfd}.pill.delivered{color:#1e9e63;background:#dcf4e6}.pill.cancelled{color:#d9534f;background:#fbe0e0}.stats{grid-template-columns:repeat(4,1fr);gap:20px;display:grid}.stat{background:var(--surface);border-radius:var(--r-card);box-shadow:var(--shadow-card);padding:22px}.tile{border-radius:14px;justify-content:center;align-items:center;width:46px;height:46px;margin-bottom:18px;display:flex}.stat .metric{font-size:30px}.stat .label{margin-bottom:6px}.listrow{border-radius:14px;align-items:center;gap:13px;padding:10px;display:flex}.listrow:hover{background:var(--surface-sunken)}.avatar{border-radius:999px;flex:none;justify-content:center;align-items:center;width:36px;height:36px;font-size:12px;font-weight:700;display:flex}.tile-sm{color:#fff;border-radius:13px;flex:none;justify-content:center;align-items:center;width:42px;height:42px;font-size:16px;font-weight:800;display:flex}.pts{color:var(--accent);background:var(--accent-soft);white-space:nowrap;font-variant-numeric:tabular-nums;border-radius:999px;align-items:center;gap:5px;padding:5px 11px;font-size:13px;font-weight:700;display:flex}.thead,.trow{align-items:center;gap:14px;padding:14px 24px;display:grid}.thead{text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted);font-size:11px;font-weight:700}.trow{border-top:1px solid var(--border)}.trow:hover{background:#fafafe}.amount{font-variant-numeric:tabular-nums;font-size:14px;font-weight:800}.products-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px;display:grid}.product-card{background:var(--surface);border-radius:var(--r-card);box-shadow:var(--shadow-card);flex-direction:column;display:flex;overflow:hidden}.product-photo{background-image:repeating-linear-gradient(135deg,#f4f5fb 0 12px,#ecedf6 12px 24px);background-position:50%;background-size:cover;height:150px;position:relative}.product-photo .badge{border-radius:999px;padding:5px 12px;font-size:11px;font-weight:700;position:absolute;top:12px;left:12px}.product-body{flex-direction:column;gap:12px;padding:18px;display:flex}.empty{background:var(--surface);border-radius:var(--r-card);box-shadow:var(--shadow-card);text-align:center;flex-direction:column;align-items:center;padding:48px;display:flex}.empty .ico{background:var(--accent-soft);border-radius:18px;justify-content:center;align-items:center;width:64px;height:64px;margin-bottom:18px;font-size:26px;display:flex}.auth{justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.auth-card{background:var(--surface);border-radius:var(--r-card);width:100%;max-width:400px;box-shadow:var(--shadow-card);padding:32px}.row{justify-content:space-between;align-items:center;gap:12px;display:flex}.actions{flex-wrap:wrap;gap:10px;display:flex}.shop{max-width:560px;margin:0 auto;padding:16px 16px 96px}.shop-header{align-items:center;gap:12px;margin-bottom:16px;display:flex}.shop-logo{object-fit:cover;border-radius:12px;width:48px;height:48px}.items{flex-direction:column;gap:10px;display:flex}.item{background:var(--surface);box-shadow:var(--shadow-card);border-radius:16px;align-items:center;gap:12px;padding:12px;display:flex}.item-photo{object-fit:cover;border-radius:12px;flex-shrink:0;width:56px;height:56px}.item-photo.placeholder{background:var(--surface-sunken)}.item-body{flex-direction:column;flex:1;gap:2px;font-size:14px;display:flex}.qty{align-items:center;gap:8px;display:flex}.qty button{background:var(--surface-sunken);width:32px;height:32px;color:var(--text-primary);cursor:pointer;border:none;border-radius:999px;padding:0;font-size:18px;line-height:1}.cartbar{background:var(--surface);justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;display:flex;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -8px 24px #5b4bd61f}.cartbar button{cursor:pointer;border:none;border-radius:999px;padding:12px 18px;font-size:14px;font-weight:700}