:root{--color-background:#f3f6fa;--color-surface:#fff;--color-ink:#172033;--color-muted:#61708a;--color-border:#dbe2ec;--color-accent:#2457d6;--color-accent-hover:#1d48b5;--color-accent-soft:#edf2ff;--color-success:#18794e;--color-success-soft:#eaf8f0;--color-warning:#a15c00;--color-warning-soft:#fff5df;--color-error:#b42318;--color-error-soft:#fff0ee;--color-focus:#2457d633;--color-accent-wash:#2457d61a;--color-shadow:#17203314;--color-shadow-deep:#1720330a;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--radius-card:16px;--radius-control:10px;--radius-pill:999px;--font-display:clamp(2rem, 4vw, 2.75rem);--font-h2:1.125rem;--font-body:1rem;--font-small:.875rem;--font-caption:.75rem;--font-overline:.6875rem;color:var(--color-ink);background:var(--color-background);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(circle at 8% 0%, var(--color-accent-wash), transparent 32rem), var(--color-background);min-block-size:100dvh;margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}button:disabled{cursor:wait;opacity:.62}h1,h2,p{margin:0}h1{color:var(--color-ink);font-size:var(--font-display);letter-spacing:-.04em;line-height:1.1}h2{color:var(--color-ink);font-size:var(--font-h2);letter-spacing:-.02em;line-height:1.3}.app-shell{grid-template-columns:240px minmax(0,1fr);min-block-size:100dvh;display:grid}.sidebar{block-size:100dvh;padding:var(--space-8) var(--space-5) var(--space-6);border-inline-end:1px solid var(--color-border);background:#ffffffc2;flex-direction:column;display:flex;position:sticky;inset-block-start:0}.brand{align-items:center;gap:var(--space-2);color:var(--color-muted);font-size:var(--font-caption);letter-spacing:.08em;text-transform:uppercase;font-weight:750;display:inline-flex}.brand-mark{block-size:28px;inline-size:28px;color:var(--color-surface);background:var(--color-accent);border-radius:var(--radius-control);font-size:var(--font-small);letter-spacing:0;flex:none;place-items:center;display:grid}.sidebar-rule{block-size:1px;margin-block:var(--space-8) var(--space-6);background:var(--color-border)}.nav-label,.eyebrow{color:var(--color-accent);font-size:var(--font-overline);letter-spacing:.1em;text-transform:uppercase;font-weight:750}.nav-label{color:var(--color-muted);margin-block-end:var(--space-3)}.primary-nav{gap:var(--space-1);display:grid}.nav-link{align-items:center;gap:var(--space-3);min-block-size:44px;padding:var(--space-3);color:var(--color-muted);border-radius:var(--radius-control);font-size:var(--font-small);font-weight:700;text-decoration:none;transition:color .15s ease-out,background-color .15s ease-out,transform .15s ease-out;display:flex}.nav-link:hover,.nav-link.active{color:var(--color-accent);background:var(--color-accent-soft)}.nav-link:active{transform:translateY(1px)}.nav-link.active{box-shadow:inset 3px 0 0 var(--color-accent)}.nav-dot{opacity:.62;background:currentColor;border-radius:50%;block-size:7px;inline-size:7px}.sidebar-footer{gap:var(--space-4);margin-block-start:auto;display:grid}.sidebar-footnote{color:var(--color-muted);font-size:var(--font-caption)}.sign-out,.text-button{min-block-size:40px;padding:var(--space-2) var(--space-3);color:var(--color-muted);border:1px solid var(--color-border);border-radius:var(--radius-control);font-size:var(--font-small);background:0 0;font-weight:700;transition:color .15s ease-out,background-color .15s ease-out,border-color .15s ease-out,transform .15s ease-out}.sign-out:hover,.text-button:hover{color:var(--color-accent);background:var(--color-surface);border-color:var(--color-accent)}.sign-out:active,.text-button:active{transform:translateY(1px)}.main-shell{min-inline-size:0}.main-content{inline-size:min(100%,1440px);padding:var(--space-12) clamp(var(--space-5), 4vw, var(--space-10));margin-inline:auto}.mobile-header{display:none}.page-stack{gap:var(--space-6);display:grid}.page-heading{justify-content:space-between;align-items:end;gap:var(--space-6);display:flex}.intro{max-inline-size:620px;color:var(--color-muted);font-size:var(--font-small);margin-block-start:var(--space-2);line-height:1.6}.summary{gap:var(--space-2);display:flex}.summary>div{min-inline-size:90px;padding:var(--space-3);text-align:center;border:1px solid var(--color-border);border-radius:var(--radius-control);background:#ffffffad}.summary strong,.summary span{display:block}.summary strong{color:var(--color-ink);font-size:1.25rem;line-height:1.1}.summary span{color:var(--color-muted);font-size:var(--font-overline);letter-spacing:.07em;text-transform:uppercase;margin-block-start:var(--space-1);font-weight:750}.notice{padding:var(--space-3) var(--space-4);color:var(--color-error);background:var(--color-error-soft);border-radius:var(--radius-control);font-size:var(--font-small);border:1px solid #b423182e;line-height:1.5}.surface-card{background:var(--color-surface);border-radius:var(--radius-card);min-inline-size:0;box-shadow:0 20px 50px var(--color-shadow), 0 2px 8px var(--color-shadow-deep);border:1px solid #dbe2ece6}.card-heading{justify-content:space-between;align-items:center;gap:var(--space-4);display:flex}.card-heading .eyebrow{margin-block-end:var(--space-1)}.card-subtitle{color:var(--color-muted);font-size:var(--font-caption);margin-block-start:var(--space-2);line-height:1.5}.count-badge{min-block-size:24px;padding:var(--space-1) var(--space-3);color:var(--color-accent);background:var(--color-accent-soft);border-radius:var(--radius-pill);font-size:var(--font-caption);white-space:nowrap;align-items:center;font-weight:750;display:inline-flex}.products-layout,.orders-layout{align-items:start;gap:var(--space-6);grid-template-columns:minmax(0,1fr) minmax(280px,360px);display:grid}.orders-layout{grid-template-columns:minmax(0,1fr) minmax(300px,380px)}.orders-main,.orders-side{gap:var(--space-6);min-inline-size:0;display:grid}.inventory-card,.orders-card,.notifications-card{overflow:hidden}.table-heading{padding:var(--space-6)}.catalogue-filters{align-items:end;gap:var(--space-3);padding:var(--space-5) var(--space-6);border-block:1px solid var(--color-border);background:#fbfcfe;grid-template-columns:minmax(180px,1.6fr) repeat(3,minmax(140px,1fr)) auto;display:grid}.catalogue-filters .field{gap:var(--space-1)}.catalogue-filters .field label{color:var(--color-muted)}.catalogue-filters .filter-search{min-inline-size:0}.filter-actions{align-items:center;gap:var(--space-2);display:flex}.filter-actions .primary-button,.filter-actions .text-button{white-space:nowrap;min-block-size:44px}.catalogue-pagination{justify-content:center;align-items:center;gap:var(--space-4);padding:var(--space-4) var(--space-6);border-block-start:1px solid var(--color-border);color:var(--color-muted);font-size:var(--font-small);display:flex}.catalogue-pagination .text-button{min-inline-size:92px}.table-wrap{border-block-start:1px solid var(--color-border);overflow-x:auto}table{border-collapse:collapse;text-align:start;inline-size:100%;min-inline-size:800px}th,td{padding:var(--space-4) var(--space-6);vertical-align:middle;text-align:start}th{color:var(--color-muted);font-size:var(--font-overline);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;background:#fbfcfe;font-weight:750}td{border-block-start:1px solid var(--color-border);color:var(--color-ink);font-size:var(--font-small)}tbody tr:hover{background:#fbfcff}.product-name,.sku,.order-id,.customer-name,.date,.items-summary{display:block}.product-name,.customer-name{font-weight:700}.sku,.date,.items-summary,.numeric{color:var(--color-muted);font-variant-numeric:tabular-nums}.stock-value{font-variant-numeric:tabular-nums;margin-inline-end:var(--space-2);font-weight:750;display:inline-block}.order-id{color:var(--color-accent);font-weight:750}.badge,.status{min-block-size:24px;padding:var(--space-1) var(--space-2);border-radius:var(--radius-pill);font-size:var(--font-caption);white-space:nowrap;align-items:center;font-weight:750;display:inline-flex}.badge.warning,.status-pending{color:var(--color-warning);background:var(--color-warning-soft)}.status{gap:var(--space-2);padding-inline:var(--space-3);text-transform:capitalize}.status:before{content:"";background:currentColor;border-radius:50%;block-size:6px;inline-size:6px}.status-shipped{color:var(--color-accent);background:var(--color-accent-soft)}.status-delivered{color:var(--color-success);background:var(--color-success-soft)}.complete-label{color:var(--color-muted);font-size:var(--font-caption);font-weight:700}.empty-state{padding-block:var(--space-8);color:var(--color-muted);text-align:center}.stock-controls{gap:var(--space-2);min-inline-size:250px;display:grid}.stock-entry{gap:var(--space-2);grid-template-columns:72px minmax(120px,1fr);display:grid}.stock-entry input,.field input,.field select,.field textarea{min-block-size:44px;inline-size:100%;padding:var(--space-3);color:var(--color-ink);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-control);outline:none;transition:border-color .15s ease-out,box-shadow .15s ease-out}.stock-entry input{min-block-size:36px;padding:var(--space-2);font-size:var(--font-caption)}.stock-entry input:focus,.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--color-accent);box-shadow:0 0 0 3px var(--color-focus)}.stock-entry input::placeholder,.field input::placeholder{color:var(--color-muted);opacity:.72}.button-cluster{gap:var(--space-2);flex-wrap:wrap;display:flex}.small-button{min-block-size:36px;padding:var(--space-2) var(--space-3);color:var(--color-accent);background:var(--color-surface);border-radius:var(--radius-control);font-size:var(--font-caption);border:1px solid #2457d647;font-weight:750;transition:color .15s ease-out,background-color .15s ease-out,border-color .15s ease-out,transform .15s ease-out}.small-button:hover{background:var(--color-accent-soft);border-color:var(--color-accent)}.small-button:active{transform:translateY(1px)}.success-button{color:var(--color-success);border-color:#18794e47}.success-button:hover{background:var(--color-success-soft);border-color:var(--color-success)}.danger-button{color:var(--color-error);border-color:#b4231838}.danger-button:hover{background:var(--color-error-soft);border-color:var(--color-error)}.form-card{padding:var(--space-6)}.form-stack{gap:var(--space-5);display:grid}.product-form,.order-form{margin-block-start:var(--space-6)}.variant-fieldset{gap:var(--space-3);display:grid}.variant-editor{gap:var(--space-3);padding:var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-control);background:#fbfcfe;display:grid}.field{gap:var(--space-2);min-inline-size:0;display:grid}.field label,legend{color:var(--color-ink);font-size:var(--font-caption);font-weight:750}.field-hint{color:var(--color-muted);font-size:var(--font-caption);line-height:1.4}.form-grid{gap:var(--space-3);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.checkbox-field{align-items:center;gap:var(--space-2);display:flex}.primary-button{min-block-size:44px;padding:var(--space-3) var(--space-4);color:var(--color-surface);background:var(--color-accent);border-radius:var(--radius-control);border:0;font-weight:750;transition:background-color .15s ease-out,transform .15s ease-out}.primary-button:hover{background:var(--color-accent-hover)}.primary-button:active{transform:translateY(1px)}.full-width{inline-size:100%}.form-error,.form-success{min-block-size:1.5em;font-size:var(--font-caption);line-height:1.5}.form-error{color:var(--color-error)}.form-success{color:var(--color-success)}.login-cover{min-block-size:100dvh;padding:var(--space-6);background:radial-gradient(circle at 16% 12%, var(--color-accent-wash), transparent 28rem), var(--color-background);place-items:center;display:grid}.login-card{inline-size:min(100%,440px);padding:clamp(var(--space-6), 6vw, var(--space-8));background:var(--color-surface);border-radius:var(--radius-card);box-shadow:0 20px 50px var(--color-shadow), 0 2px 8px var(--color-shadow-deep);border:1px solid #dbe2ece6}.login-card>.brand{margin-block-end:var(--space-10)}.login-heading{gap:var(--space-2);display:grid}.login-heading h1{font-size:clamp(1.75rem,5vw,2rem)}.login-heading p:last-child{color:var(--color-muted);font-size:var(--font-small);line-height:1.6}.login-card .form-stack{margin-block-start:var(--space-6)}fieldset{border:0;min-inline-size:0;margin:0;padding:0}legend{margin-block-end:var(--space-3)}.item-list{gap:var(--space-3);display:grid}.item-row{gap:var(--space-2);grid-template-columns:minmax(0,1fr) 78px auto;align-items:end;display:grid}.remove-button{min-block-size:44px;padding:var(--space-2);color:var(--color-muted);border:1px solid var(--color-border);border-radius:var(--radius-control);font-size:var(--font-caption);background:0 0;font-weight:700}.remove-button:hover{color:var(--color-error);background:var(--color-error-soft)}.add-item{justify-self:start;margin-block-start:var(--space-3)}.notifications-list{margin:0;padding:0;list-style:none;display:grid}.notification{gap:var(--space-2);padding:var(--space-4) var(--space-6);border-block-start:1px solid var(--color-border);display:grid}.notification:first-child{border-block-start:0}.notification-meta{justify-content:space-between;gap:var(--space-3);display:flex}.notification-type{color:var(--color-accent);font-size:var(--font-overline);letter-spacing:.08em;text-transform:uppercase;font-weight:750}.notification time{color:var(--color-muted);font-size:var(--font-overline);white-space:nowrap}.notification p{color:var(--color-ink);font-size:var(--font-caption);line-height:1.5}.role-list{gap:var(--space-2);flex-wrap:wrap;display:flex}.role-check{color:var(--color-muted);font-size:var(--font-overline);white-space:nowrap;align-items:center;gap:.3rem;font-weight:700;display:inline-flex}.role-check input{accent-color:var(--color-accent)}.state-panel{padding:var(--space-8);color:var(--color-muted);border:1px solid var(--color-border);border-radius:var(--radius-card);text-align:center;background:#ffffffad}.loading-panel{justify-content:center;align-items:center;gap:var(--space-3);display:flex}.loading-line{background:var(--color-accent-soft);border-radius:var(--radius-pill);block-size:4px;inline-size:48px;overflow:hidden}.loading-line:after{content:"";background:var(--color-accent);block-size:100%;inline-size:40%;animation:.9s ease-in-out infinite loading;display:block}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@keyframes loading{0%{transform:translate(-100%)}to{transform:translate(250%)}}@media (width<=1080px){.products-layout,.orders-layout{grid-template-columns:1fr}.orders-side{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.catalogue-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.catalogue-filters .filter-search{grid-column:1/-1}}@media (width<=768px){.app-shell{display:block}.sidebar{display:none}.mobile-header{justify-content:space-between;align-items:center;gap:var(--space-4);padding:var(--space-4) var(--space-5);border-block-end:1px solid var(--color-border);background:#ffffffd6;display:flex}.main-content{padding:var(--space-8) var(--space-5)}.page-heading{align-items:start;display:grid}.summary{justify-content:start}.orders-side{grid-template-columns:1fr}}@media (width<=560px){.main-content{padding:var(--space-6) var(--space-4)}.table-heading,th,td{padding-inline:var(--space-4)}.form-card{padding:var(--space-5)}.form-grid{grid-template-columns:1fr}.catalogue-filters{padding-inline:var(--space-4);grid-template-columns:1fr}.catalogue-filters .filter-search{grid-column:auto}.filter-actions{justify-content:space-between}.catalogue-pagination{padding-inline:var(--space-4)}.item-row{grid-template-columns:minmax(0,1fr) 72px}.remove-button{grid-column:1/-1;justify-self:start}.login-cover{padding:var(--space-4)}.login-card{padding:var(--space-6) var(--space-5)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important}}