:root{--gs-accent: #8FA8BC;--gs-accent-hover: #A8B4C0;--gs-accent-soft: rgba(143, 168, 188, .12);--gs-accent-border: rgba(143, 168, 188, .35);--gs-accent-on: #0A0A0B;--gs-success: #6B9B7E;--gs-success-soft: rgba(107, 155, 126, .16);--gs-danger: #C97A82;--gs-danger-soft: rgba(201, 122, 130, .16);--gs-warning: #C4A574;--gs-warning-soft: rgba(196, 165, 116, .16);--gs-muted-soft: rgba(142, 142, 151, .14);--gs-bg: #0B0B0D;--gs-panel: #121214;--gs-panel-elev: #1C1C1E;--gs-sidebar: #0A0A0B;--gs-text: #F0F0F2;--gs-muted: #8E8E97;--gs-line: #2A2A2E;--gs-line-soft: rgba(240, 240, 242, .06);--gs-btn-primary-bg: #FFFFFF;--gs-btn-primary-fg: #0A0A0B;--gs-btn-primary-hover: #E8E8ED;--gs-font: "Montserrat", system-ui, -apple-system, sans-serif;--gs-fs-xs: 11px;--gs-fs-sm: 12px;--gs-fs-md: 13px;--gs-fs-lg: 15px;--gs-fs-xl: 18px;--gs-fs-2xl: 22px;--gs-fw-medium: 500;--gs-fw-semibold: 600;--gs-fw-bold: 700;--gs-space-1: 4px;--gs-space-2: 8px;--gs-space-3: 12px;--gs-space-4: 16px;--gs-space-5: 20px;--gs-space-6: 24px;--gs-space-8: 32px;--gs-radius-sm: 6px;--gs-radius-md: 8px;--gs-radius-lg: 12px;--gs-radius-pill: 999px;--gs-sidebar-w: 240px;--gs-content-max: 1200px;--gs-ease: cubic-bezier(.25, .1, .25, 1);--gs-dur: .15s;--gs-z-sidebar: 40;--gs-z-sticky: 30;--gs-z-dropdown: 50;--bg: var(--gs-bg);--panel: var(--gs-panel);--line: var(--gs-line);--text: var(--gs-text);--muted: var(--gs-muted);--accent: var(--gs-accent);color-scheme:dark}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;font-family:var(--gs-font);background:var(--gs-bg);color:var(--gs-text);font-size:var(--gs-fs-md);line-height:1.45;-webkit-font-smoothing:antialiased}a{color:var(--gs-accent);text-decoration:none;transition:color var(--gs-dur) var(--gs-ease)}a:hover{color:var(--gs-accent-hover)}.layout{display:grid;grid-template-columns:var(--gs-sidebar-w) 1fr;min-height:100vh;align-items:start}.side{position:sticky;top:0;height:100vh;overflow:auto;z-index:var(--gs-z-sidebar);border-right:1px solid var(--gs-line);padding:var(--gs-space-5) var(--gs-space-3);background:var(--gs-sidebar)}.side-brand{font-weight:var(--gs-fw-bold);font-size:var(--gs-fs-lg);letter-spacing:-.02em;color:var(--gs-text);padding:var(--gs-space-2) var(--gs-space-3);margin-bottom:var(--gs-space-4)}.side-nav{display:flex;flex-direction:column;gap:2px}.side a,.side-nav a{display:flex;align-items:center;gap:var(--gs-space-2);padding:9px var(--gs-space-3);border-radius:var(--gs-radius-md);color:var(--gs-muted);text-decoration:none;font-size:var(--gs-fs-md);font-weight:var(--gs-fw-medium);transition:background var(--gs-dur) var(--gs-ease),color var(--gs-dur) var(--gs-ease)}.side a.active,.side a:hover,.side-nav a.active,.side-nav a:hover{background:var(--gs-accent-soft);color:var(--gs-accent)}.side a.active{box-shadow:inset 2px 0 0 var(--gs-accent)}.main{padding:var(--gs-space-6) var(--gs-space-8);max-width:calc(var(--gs-content-max) + var(--gs-space-8) * 2);width:100%;min-width:0}.page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--gs-space-4);margin-bottom:var(--gs-space-5);flex-wrap:wrap}.page-header h1{margin:0}.page-header .page-actions{display:flex;flex-wrap:wrap;gap:var(--gs-space-2);align-items:center}h1{margin:0 0 var(--gs-space-4);font-size:var(--gs-fs-2xl);font-weight:var(--gs-fw-bold);letter-spacing:-.02em;line-height:1.25}h2{font-size:var(--gs-fs-xl);font-weight:var(--gs-fw-semibold);letter-spacing:-.01em;margin:0 0 var(--gs-space-3)}.muted{color:var(--gs-muted)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--gs-space-2);background:var(--gs-btn-primary-bg);color:var(--gs-btn-primary-fg);border:1px solid transparent;border-radius:var(--gs-radius-md);padding:7px 14px;font:inherit;font-size:var(--gs-fs-md);font-weight:var(--gs-fw-semibold);line-height:1.3;cursor:pointer;text-decoration:none;white-space:nowrap;transition:background var(--gs-dur) var(--gs-ease),border-color var(--gs-dur) var(--gs-ease),color var(--gs-dur) var(--gs-ease),opacity var(--gs-dur) var(--gs-ease)}.btn:hover{background:var(--gs-btn-primary-hover);color:var(--gs-btn-primary-fg)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.secondary,.btn.ghost{background:transparent;color:var(--gs-accent);border-color:var(--gs-accent-border)}.btn.secondary:hover,.btn.ghost:hover{background:var(--gs-accent-soft);color:var(--gs-accent-hover);border-color:var(--gs-accent)}.btn.danger{background:transparent;color:var(--gs-danger);border-color:#c97a8273}.btn.danger:hover{background:var(--gs-danger-soft);color:var(--gs-danger)}.btn.sm{padding:5px 10px;font-size:var(--gs-fs-sm)}a.btn{color:var(--gs-btn-primary-fg)}a.btn.secondary,a.btn.ghost{color:var(--gs-accent)}.badge,.status{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:var(--gs-radius-pill);font-size:var(--gs-fs-xs);font-weight:var(--gs-fw-semibold);letter-spacing:.02em;line-height:1.5;white-space:nowrap;border:1px solid transparent;vertical-align:middle}.badge.success,.status.success,.badge.confirmed,.badge.delivered,.badge.active{color:var(--gs-success);background:var(--gs-success-soft);border-color:#6b9b7e59}.badge.warn,.status.warn,.badge.assembling,.badge.out_for_delivery,.badge.draft{color:var(--gs-warning);background:var(--gs-warning-soft);border-color:#c4a57459}.badge.danger,.status.danger,.badge.cancelled,.badge.out,.badge.hidden{color:var(--gs-danger);background:var(--gs-danger-soft);border-color:#c97a8259}.badge.muted,.status.muted,.badge.new{color:var(--gs-muted);background:var(--gs-muted-soft);border-color:#8e8e974d}.badge.info,.badge.confirmed_soft{color:var(--gs-accent);background:var(--gs-accent-soft);border-color:var(--gs-accent-border)}.card{background:var(--gs-panel);border:1px solid var(--gs-line);border-radius:var(--gs-radius-lg);padding:var(--gs-space-4);margin-bottom:var(--gs-space-3)}.card h2{margin-top:0}.toolbar{display:flex;flex-wrap:wrap;gap:var(--gs-space-2);margin-bottom:var(--gs-space-4);align-items:center}.toolbar input,.toolbar select{margin:0;width:auto;min-width:0}.toolbar .spacer,.toolbar .grow{flex:1;min-width:8px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:var(--gs-space-3)}@media (max-width: 720px){.layout{grid-template-columns:1fr}.side{position:relative;height:auto;border-right:none;border-bottom:1px solid var(--gs-line)}.main{padding:var(--gs-space-4);max-width:none}.grid2{grid-template-columns:1fr}}.table-wrap{background:var(--gs-panel);border:1px solid var(--gs-line);border-radius:var(--gs-radius-lg);overflow:auto;margin-bottom:var(--gs-space-3)}.table-wrap .table{margin:0}.table-wrap .table th:first-child,.table-wrap .table td:first-child{padding-left:var(--gs-space-4)}.table-wrap .table th:last-child,.table-wrap .table td:last-child{padding-right:var(--gs-space-4)}.table{width:100%;border-collapse:collapse}.table th,.table td{text-align:left;padding:9px var(--gs-space-2);border-bottom:1px solid var(--gs-line);font-size:var(--gs-fs-md);vertical-align:middle}.table th{font-size:var(--gs-fs-xs);font-weight:var(--gs-fw-semibold);text-transform:uppercase;letter-spacing:.04em;color:var(--gs-muted);background:var(--gs-panel);position:sticky;top:0;z-index:var(--gs-z-sticky)}.table tbody tr:hover td{background:#ffffff05}.table tbody tr:last-child td{border-bottom:none}.field-label,label{display:block;font-size:var(--gs-fs-sm);font-weight:var(--gs-fw-medium);color:var(--gs-muted);margin:var(--gs-space-2) 0 var(--gs-space-1)}input,select,textarea{width:100%;background:var(--gs-panel-elev);border:1px solid var(--gs-line);color:var(--gs-text);border-radius:var(--gs-radius-sm);padding:8px 10px;margin:0 0 var(--gs-space-3);font:inherit;font-size:var(--gs-fs-md);outline:none;transition:border-color var(--gs-dur) var(--gs-ease),box-shadow var(--gs-dur) var(--gs-ease)}input:focus,select:focus,textarea:focus{border-color:var(--gs-accent-border);box-shadow:0 0 0 3px var(--gs-accent-soft)}input::placeholder,textarea::placeholder{color:var(--gs-muted);opacity:.75}.inline-restock{display:flex;gap:var(--gs-space-2);align-items:center}.inline-restock input{width:88px;margin:0}.image-slots-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--gs-space-3);margin-bottom:14px}.image-slot-preview{aspect-ratio:4 / 3;border-radius:var(--gs-radius-sm);overflow:hidden;background:var(--gs-bg);border:1px solid var(--gs-line);display:flex;align-items:center;justify-content:center;margin:8px 0}.image-slot-preview img{width:100%;height:100%;object-fit:cover;display:block}.cat-image-preview{aspect-ratio:4 / 3;max-width:280px;border-radius:var(--gs-radius-sm);overflow:hidden;background:var(--gs-bg);border:1px solid var(--gs-line);margin:8px 0;display:flex;align-items:center;justify-content:center}.cat-image-preview img{width:100%;height:100%;object-fit:cover}.auth-gate{max-width:420px;padding:var(--gs-space-6) 0}.auth-gate .auth-loading{display:flex;align-items:center;gap:var(--gs-space-3);color:var(--gs-muted)}@keyframes skel-pulse{0%,to{opacity:.28}50%{opacity:.55}}.skel-bar{display:inline-block;height:11px;border-radius:var(--gs-radius-sm);background:linear-gradient(90deg,var(--gs-panel-elev) 0%,#252528 50%,var(--gs-panel-elev) 100%);background-size:200% 100%;border:1px solid var(--gs-line);animation:skel-pulse 1.35s var(--gs-ease) infinite;max-width:100%;vertical-align:middle}.skel-bar-lg{height:22px}.skel-card .skel-bar{display:block}.table-skeleton td{padding-top:14px;padding-bottom:14px}.query-error{margin:var(--gs-space-3) 0;padding:var(--gs-space-4);border:1px solid rgba(201,122,130,.35);border-radius:var(--gs-radius-lg);background:var(--gs-danger-soft);max-width:480px}.query-error .muted{color:#e0b0b5}.empty-hint{margin:var(--gs-space-5) 0;padding:var(--gs-space-6) var(--gs-space-4);text-align:center;border:1px dashed var(--gs-line);border-radius:var(--gs-radius-lg);background:#12121480;color:var(--gs-muted);font-size:var(--gs-fs-md)}.seg-btns{display:inline-flex;gap:4px;padding:3px;background:var(--gs-panel);border:1px solid var(--gs-line);border-radius:var(--gs-radius-md)}.seg-btns .btn{background:transparent;color:var(--gs-muted);border-color:transparent;box-shadow:none}.seg-btns .btn:hover{background:var(--gs-accent-soft);color:var(--gs-accent)}.seg-btns .btn.active{background:var(--gs-panel-elev);color:var(--gs-text)}
