:root{--font-family-brand: "Graphit", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-family-body: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-md: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.375rem;--font-size-2xl: 1.75rem;--font-size-3xl: 2.125rem;--line-height-tight: 1.2;--line-height-normal: 1.45;--line-height-relaxed: 1.6;--space-0: 0px;--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-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--radius-pill: 999px;--border-hairline: 1px;--border-strong: 2px;--shadow-sm: 0 1px 2px rgba(62,43,46,.08);--shadow-md: 0 4px 16px rgba(62,43,46,.1);--shadow-lg: 0 12px 32px rgba(62,43,46,.16);--motion-duration-fast: .12s;--motion-duration-normal: .22s;--motion-duration-slow: .36s;--motion-easing-standard: cubic-bezier(.2, 0, 0, 1);--touch-target-min: 44px;--layer-base: 0;--layer-sticky: 10;--layer-nav: 20;--layer-overlay: 30;--layer-modal: 40;--layer-toast: 50;--color-background-primary: #F7F3F1;--color-background-secondary: #F4F4F4;--color-surface-primary: #FFFFFF;--color-surface-raised: #FFFFFF;--color-surface-inverse: #3E2B2E;--color-text-primary: #3E2B2E;--color-text-secondary: #4B4143;--color-text-tertiary: #7A6E70;--color-text-on-action: #FFFFFF;--color-text-on-inverse: #FFFFFF;--color-action-primary: #CE0058;--color-action-primary-pressed: #A30046;--color-action-secondary: #3E2B2E;--color-action-destructive: #DA291C;--color-accent-highlight: #F440B8;--color-status-success: #1F7A4D;--color-status-warning: #9A5B00;--color-status-error: #DA291C;--color-border-default: #E4DEDC;--color-border-strong: #7A6E70;--color-focus-ring: #CE0058;--color-scheme: light dark}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--color-background-primary: #1B1415;--color-background-secondary: #271E1F;--color-surface-primary: #271E1F;--color-surface-raised: #3A2E30;--color-surface-inverse: #F7F3F1;--color-text-primary: #F4ECEA;--color-text-secondary: #C9BCBA;--color-text-tertiary: #7A6E70;--color-text-on-action: #FFFFFF;--color-text-on-inverse: #3E2B2E;--color-action-primary: #CE0058;--color-action-primary-pressed: #A30046;--color-action-secondary: #F4ECEA;--color-action-destructive: #DA291C;--color-accent-highlight: #F440B8;--color-status-success: #4CC38A;--color-status-warning: #F0B44C;--color-status-error: #FF6B5E;--color-border-default: #3A2E30;--color-border-strong: #7A6E70;--color-focus-ring: #FF5C9A}}:root[data-theme=dark]{--color-background-primary: #1B1415;--color-background-secondary: #271E1F;--color-surface-primary: #271E1F;--color-surface-raised: #3A2E30;--color-surface-inverse: #F7F3F1;--color-text-primary: #F4ECEA;--color-text-secondary: #C9BCBA;--color-text-tertiary: #7A6E70;--color-text-on-action: #FFFFFF;--color-text-on-inverse: #3E2B2E;--color-action-primary: #CE0058;--color-action-primary-pressed: #A30046;--color-action-secondary: #F4ECEA;--color-action-destructive: #DA291C;--color-accent-highlight: #F440B8;--color-status-success: #4CC38A;--color-status-warning: #F0B44C;--color-status-error: #FF6B5E;--color-border-default: #3A2E30;--color-border-strong: #7A6E70;--color-focus-ring: #FF5C9A}*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;font-family:var(--font-family-body);font-size:var(--font-size-md);line-height:var(--line-height-normal);color:var(--color-text-primary);background:var(--color-background-primary);-webkit-font-smoothing:antialiased}h1,h2,h3{font-family:var(--font-family-brand);line-height:var(--line-height-tight);margin:0;letter-spacing:-.01em}h1{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold)}h2{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold)}h3{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold)}p{margin:0}img{max-width:100%;display:block}a{color:inherit}button,input,textarea,select{font:inherit;color:inherit}:focus-visible{outline:3px solid var(--color-focus-ring);outline-offset:2px;border-radius:var(--radius-sm)}.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}.shell{min-height:100dvh;display:flex;flex-direction:column}.topbar{position:sticky;top:0;z-index:var(--layer-sticky);display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:calc(var(--space-3) + env(safe-area-inset-top)) max(var(--space-4),env(safe-area-inset-right)) var(--space-3) max(var(--space-4),env(safe-area-inset-left));background:color-mix(in srgb,var(--color-background-primary) 88%,transparent);-webkit-backdrop-filter:saturate(1.4) blur(12px);backdrop-filter:saturate(1.4) blur(12px);border-bottom:var(--border-hairline) solid var(--color-border-default)}.brand{display:flex;align-items:center;gap:var(--space-2);text-decoration:none;font-family:var(--font-family-brand);font-weight:var(--font-weight-bold);font-size:var(--font-size-lg)}.brand-mark{width:32px;height:32px;border-radius:var(--radius-sm);background:var(--color-surface-inverse);color:var(--color-text-on-inverse);display:grid;place-items:center;font-size:var(--font-size-sm)}.main{flex:1;width:100%;max-width:960px;margin:0 auto;padding:var(--space-4) max(var(--space-4),env(safe-area-inset-right)) calc(96px + env(safe-area-inset-bottom)) max(var(--space-4),env(safe-area-inset-left));display:flex;flex-direction:column;gap:var(--space-6)}.tabbar{position:fixed;inset:auto 0 0 0;z-index:var(--layer-nav);display:grid;grid-auto-flow:column;grid-auto-columns:1fr;align-items:end;padding:var(--space-2) max(var(--space-2),env(safe-area-inset-right)) calc(var(--space-2) + env(safe-area-inset-bottom)) max(var(--space-2),env(safe-area-inset-left));background:var(--color-surface-primary);border-top:var(--border-hairline) solid var(--color-border-default);box-shadow:0 -4px 16px #0000000a}.tab{min-height:var(--touch-target-min);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-decoration:none;font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);color:var(--color-text-tertiary);position:relative}.tab svg{width:24px;height:24px}.tab[aria-current=page]{color:var(--color-action-primary)}.tab-scan{margin-top:-28px}.tab-scan .scan-fab{width:60px;height:60px;border-radius:var(--radius-pill);background:var(--color-action-primary);color:var(--color-text-on-action);display:grid;place-items:center;box-shadow:var(--shadow-lg)}.tab-scan[aria-current=page] .scan-fab{background:var(--color-action-primary-pressed)}.tab-scan .scan-fab svg{width:28px;height:28px}.badge{position:absolute;top:2px;left:calc(50% + 6px);min-width:18px;height:18px;padding:0 5px;border-radius:var(--radius-pill);background:var(--color-action-primary);color:var(--color-text-on-action);font-size:11px;font-weight:var(--font-weight-bold);display:grid;place-items:center}@media(min-width:1024px){.shell{flex-direction:row}.shell>.topbar{display:none}.tabbar{position:sticky;inset:auto;height:100dvh;width:220px;display:flex;flex-direction:column;align-items:stretch;gap:var(--space-1);padding:var(--space-6) var(--space-3);border-top:0;border-right:var(--border-hairline) solid var(--color-border-default);box-shadow:none}.tabbar .brand{margin-bottom:var(--space-6);padding:0 var(--space-3)}.tab{flex-direction:row;justify-content:flex-start;gap:var(--space-3);padding:0 var(--space-3);font-size:var(--font-size-md);border-radius:var(--radius-md)}.tab[aria-current=page]{background:var(--color-background-secondary)}.tab-scan{margin-top:0}.tab-scan .scan-fab{width:24px;height:24px;box-shadow:none;background:none;color:inherit}.tab-scan .scan-fab svg{width:24px;height:24px}.badge{position:static;margin-left:auto}.main{padding-bottom:var(--space-12)}.desktop-only-brand{display:flex}}@media(max-width:1023px){.desktop-only-brand{display:none}}.btn{min-height:var(--touch-target-min);padding:0 var(--space-5);border-radius:var(--radius-pill);border:0;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);font-weight:var(--font-weight-semibold);cursor:pointer;text-decoration:none;white-space:nowrap;transition:transform var(--motion-duration-fast) var(--motion-easing-standard),background var(--motion-duration-fast)}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn-primary{background:var(--color-action-primary);color:var(--color-text-on-action)}.btn-primary:hover:not(:disabled){background:var(--color-action-primary-pressed)}.btn-secondary{background:var(--color-surface-primary);color:var(--color-text-primary);border:var(--border-hairline) solid var(--color-border-strong)}.btn-ghost{background:transparent;color:var(--color-text-primary)}.btn-danger{background:transparent;color:var(--color-action-destructive)}.btn-block{width:100%}.btn-lg{min-height:56px;font-size:var(--font-size-lg)}.icon-btn{width:var(--touch-target-min);height:var(--touch-target-min);border-radius:var(--radius-pill);border:var(--border-hairline) solid var(--color-border-default);background:var(--color-surface-primary);display:grid;place-items:center;cursor:pointer}.icon-btn svg{width:20px;height:20px}.card{background:var(--color-surface-primary);border:var(--border-hairline) solid var(--color-border-default);border-radius:var(--radius-lg);padding:var(--space-4);box-shadow:var(--shadow-sm)}.card-inverse{background:var(--color-surface-inverse);color:var(--color-text-on-inverse);border:0}.stack{display:flex;flex-direction:column;gap:var(--space-3)}.row{display:flex;align-items:center;gap:var(--space-3)}.spread{justify-content:space-between}.muted{color:var(--color-text-secondary)}.small{font-size:var(--font-size-sm)}.eyebrow{font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-tertiary)}.price{font-variant-numeric:tabular-nums;font-weight:var(--font-weight-semibold)}.banner{display:flex;gap:var(--space-3);align-items:flex-start;padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);background:var(--color-background-secondary);border:var(--border-hairline) solid var(--color-border-default);font-size:var(--font-size-sm)}.banner-warning{border-color:var(--color-status-warning)}.banner-error{border-color:var(--color-status-error)}.banner svg{flex:none;width:20px;height:20px;margin-top:1px}.input,.textarea{width:100%;min-height:var(--touch-target-min);padding:var(--space-2) var(--space-4);border-radius:var(--radius-md);border:var(--border-hairline) solid var(--color-border-strong);background:var(--color-surface-primary)}.textarea{min-height:88px;resize:vertical}label.field{display:flex;flex-direction:column;gap:var(--space-1);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.chips{display:flex;gap:var(--space-2);overflow-x:auto;padding-bottom:var(--space-1);scrollbar-width:none}.chip{min-height:36px;padding:0 var(--space-4);border-radius:var(--radius-pill);border:var(--border-hairline) solid var(--color-border-strong);background:var(--color-surface-primary);cursor:pointer;white-space:nowrap;font-size:var(--font-size-sm)}.chip[aria-pressed=true]{background:var(--color-surface-inverse);color:var(--color-text-on-inverse);border-color:transparent}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:var(--space-3)}.product-card{display:flex;flex-direction:column;overflow:hidden;padding:0}.product-card img,.thumb{aspect-ratio:1;object-fit:cover;background:var(--color-background-secondary);width:100%}.product-card .body{padding:var(--space-3);display:flex;flex-direction:column;gap:var(--space-2);flex:1}.product-card .name{font-weight:var(--font-weight-semibold);line-height:var(--line-height-tight)}.thumb{width:64px;height:64px;border-radius:var(--radius-md);flex:none}.stepper{display:inline-flex;align-items:center;border-radius:var(--radius-pill);border:var(--border-hairline) solid var(--color-border-strong);background:var(--color-surface-primary)}.stepper button{width:var(--touch-target-min);height:var(--touch-target-min);border:0;background:none;cursor:pointer;display:grid;place-items:center}.stepper button svg{width:18px;height:18px}.stepper output{min-width:2.5ch;text-align:center;font-variant-numeric:tabular-nums;font-weight:var(--font-weight-semibold)}.list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}.list>li{padding:var(--space-3) 0;border-bottom:var(--border-hairline) solid var(--color-border-default)}.list>li:last-child{border-bottom:0}.summary-row{display:flex;justify-content:space-between;gap:var(--space-3)}.summary-total{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold)}.empty{text-align:center;padding:var(--space-10) var(--space-4);display:flex;flex-direction:column;align-items:center;gap:var(--space-3)}.empty svg{width:48px;height:48px;color:var(--color-text-tertiary)}.spinner{width:24px;height:24px;border-radius:50%;border:3px solid var(--color-border-default);border-top-color:var(--color-action-primary);animation:spin .8s linear infinite}.center{min-height:50dvh;display:grid;place-items:center}@keyframes spin{to{transform:rotate(360deg)}}.switch{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);min-height:var(--touch-target-min);cursor:pointer}.switch input{width:48px;height:28px;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:var(--radius-pill);background:var(--color-border-strong);position:relative;cursor:pointer;transition:background var(--motion-duration-fast);flex:none}.switch input:after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;transition:transform var(--motion-duration-fast);box-shadow:var(--shadow-sm)}.switch input:checked{background:var(--color-action-primary)}.switch input:checked:after{transform:translate(20px)}.scan-stage{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--space-4);padding:var(--space-8) var(--space-4)}.scan-ring{width:168px;height:168px;border-radius:50%;display:grid;place-items:center;background:var(--color-background-secondary);color:var(--color-action-primary);position:relative}.scan-ring svg{width:72px;height:72px}.scan-ring[data-active=true]:before,.scan-ring[data-active=true]:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;border:2px solid var(--color-action-primary);animation:pulse 1.8s var(--motion-easing-standard) infinite}.scan-ring[data-active=true]:after{animation-delay:.9s}@keyframes pulse{0%{transform:scale(1);opacity:.7}to{transform:scale(1.5);opacity:0}}.scan-result{display:flex;gap:var(--space-3);align-items:center}.scan-result[data-fresh=true]{animation:pop var(--motion-duration-slow) var(--motion-easing-standard)}@keyframes pop{0%{transform:scale(.96);opacity:.4}to{transform:scale(1);opacity:1}}.toasts{position:fixed;z-index:var(--layer-toast);left:50%;transform:translate(-50%);bottom:calc(96px + env(safe-area-inset-bottom));width:min(560px,calc(100% - 2 * var(--space-4)));display:flex;flex-direction:column;gap:var(--space-2);pointer-events:none}@media(min-width:1024px){.toasts{bottom:var(--space-6)}}.toast{pointer-events:auto;display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);background:var(--color-surface-inverse);color:var(--color-text-on-inverse);box-shadow:var(--shadow-lg);animation:pop var(--motion-duration-normal) var(--motion-easing-standard)}.toast .msg{flex:1;font-size:var(--font-size-sm)}.toast .btn{min-height:36px;padding:0 var(--space-3);color:var(--color-text-on-inverse);background:transparent;border:1px solid currentColor}.toast[data-kind=error]{background:var(--color-status-error);color:#fff}.login{min-height:100dvh;display:grid;place-items:center;padding:var(--space-6) var(--space-4);background:radial-gradient(120% 80% at 50% 0%,color-mix(in srgb,var(--color-accent-highlight) 18%,transparent),transparent 60%),var(--color-background-primary)}.login-card{width:min(420px,100%);display:flex;flex-direction:column;gap:var(--space-6);text-align:center}.login-card .brand-mark{width:72px;height:72px;margin:0 auto;border-radius:var(--radius-lg);font-size:var(--font-size-xl)}.salon-switch{display:inline-flex;align-items:center;min-height:var(--touch-target-min);padding:0 var(--space-2)}
