/* Warehouse visual system, verified against its live /assets page and
   app/globals.css, ui/form.ts, and layout/app-shell.tsx. Screen treatment only. */
@media screen {
 :root {
  --background:160 30% 99%; --foreground:200 18% 12%; --card:0 0% 100%;
  --primary:161 94% 30%; --primary-foreground:0 0% 100%;
  --secondary:160 24% 95%; --muted-surface:160 20% 96%; --muted-foreground:200 10% 42%;
  --accent:158 64% 94%; --accent-foreground:163 94% 20%; --border:160 16% 90%; --radius:1rem;
  --bg:hsl(var(--background)); --ink:hsl(var(--foreground)); --muted:hsl(var(--muted-foreground));
  --green:hsl(var(--primary)); --green-dark:hsl(var(--accent-foreground)); --tint:hsl(var(--accent));
  --line:hsl(var(--border)); --surface:hsl(var(--muted-surface));
  --warehouse-card-shadow:0 2px 3px hsl(var(--foreground)/.015),0 8px 24px hsl(var(--foreground)/.025);
  font-family:Inter,-apple-system,"Segoe UI",system-ui,"Microsoft YaHei","PingFang SC",sans-serif;
  font-feature-settings:"rlig" 1,"calt" 1,"ss01" 1;
 }
 body{background:var(--bg);color:var(--ink);font-size:16px;line-height:1.5}
 button,a{font-feature-settings:inherit}
 h1,h2,h3{color:var(--ink);font-weight:600;letter-spacing:-.02em}
 h1,.home h1{font-size:34px;line-height:1.25;margin-bottom:8px}
 h2{font-size:24px;line-height:1.35}
 p,li{line-height:1.5}
 :is(button,a,summary):focus-visible{outline:2px solid var(--green);outline-offset:2px}
 .header-inner{min-height:64px}
 .brand{display:inline-flex;gap:10px;align-items:center}
 .brand-mark{width:36px;height:36px;display:flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:10px;background:white}
 .brand .brand-mark img{width:28px;height:28px;aspect-ratio:1}
 .brand-text{display:flex;flex-direction:column;gap:1px}
 .brand-text strong{font-size:16px;font-weight:600;line-height:20px;letter-spacing:-.01em}
 .brand-text small{font-size:10px;font-weight:400;line-height:15px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
 .site-header{box-shadow:none;border-bottom:1px solid var(--line)}
 .call-link{min-height:44px;border-radius:14px;background:hsl(var(--primary)/.04);border-color:hsl(var(--primary)/.18);color:var(--green-dark);font-size:14px;font-weight:500}
 .call-link:hover{background:var(--tint)}
 .language-bar{background:white;border-top-color:var(--line)}
 .language-label{font-size:12px}
 .languages{gap:5px}
 .languages button{border-radius:12px;font-weight:500;color:var(--muted)}
 .languages button[aria-pressed=true]{border-color:transparent;background:var(--tint);color:var(--green-dark);box-shadow:none;font-weight:600}
 .languages button:hover{background:var(--surface)}
 .back-link{color:var(--muted);margin-bottom:16px}
 .eyebrow{color:var(--muted);font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
 .eyebrow svg{color:var(--green)}
 .lead{font-size:14px;font-weight:400;line-height:20px;color:var(--muted)}
 .model-badge{border-radius:10px;padding:7px 11px;font-size:11px;background:var(--surface);border-color:transparent}
 .tasks{margin-top:26px}
 .tasks h2{font-size:18px;font-weight:600;line-height:26px}
 .task{font-size:14px;font-weight:500;border-radius:14px;border-color:var(--line);background:white}
 .task-icon{background:var(--surface);border-radius:10px;color:var(--muted)}
 .task-warm .task-icon,.task-cool .task-icon{background:var(--surface);color:var(--muted)}
 .task[aria-pressed=true]{padding:15px;border-width:1px;border-color:hsl(var(--primary)/.2);background:var(--tint);color:var(--green-dark);font-weight:600}
 .task[aria-pressed=true] .task-icon{background:hsl(var(--primary)/.08);color:var(--green-dark)}
 .task:hover{border-color:hsl(var(--primary)/.4);background:var(--surface)}
 .task[aria-pressed=true]:hover{background:var(--tint)}
 .workspace,.numbers-card,.keep-section,.home-card{border-radius:16px;border-color:var(--line);background:white;box-shadow:var(--warehouse-card-shadow)}
 .instruction-card{background:white;padding:24px;border-color:var(--line)}
 .device-card{padding:18px 24px 22px}
 .photo-stage{margin-bottom:0}
 .device-top{font-size:12px;font-weight:500}
 .icon-button{border:1px solid var(--line);background:white;color:var(--muted);border-radius:12px}
 .icon-button:hover{background:var(--surface)}
 .control-chips button{border-radius:10px;font-weight:500;color:var(--muted)}
 .control-chips button[aria-pressed=true]{background:var(--tint);color:var(--green-dark);border-color:hsl(var(--primary)/.2)}
 .view-switch{border:1px solid var(--line);border-radius:14px;padding:4px;background:var(--surface);margin-bottom:24px}
 .view-switch button{font-size:12px;font-weight:500;color:var(--muted);border-radius:10px}
 .view-switch button[aria-pressed=true]{background:white;color:var(--ink);box-shadow:0 1px 2px hsl(var(--foreground)/.07);font-weight:600}
 #instructions h2{font-size:24px;line-height:1.35;font-weight:600;letter-spacing:-.02em;margin-bottom:12px}
 .step-body{font-size:18px;line-height:1.5;font-weight:400}
 .step-meta{color:var(--muted);font-size:12px;font-weight:500}
 .step-progress span{background:var(--line)}
 .step-progress .filled{background:var(--green)}
 .check-box{background:var(--surface);border-color:var(--line);border-radius:12px;font-size:14px}
 .check-box strong{color:var(--ink);font-size:13px;font-weight:600}
 .check-box>svg{color:var(--green-dark)}
 .guide-only{color:var(--muted);border-color:var(--line)}
 .start-symbol,.done-symbol{background:var(--tint);color:var(--green-dark);border-radius:14px}
 /* Warehouse shared primaryButtonClass: ink is the default next/continue action. */
 .primary,.secondary{min-height:48px;padding:8px 16px;border-radius:14px;font-size:14px;line-height:20px;font-weight:700}
 .primary{background:var(--ink);color:white;border-color:var(--ink);box-shadow:inset 0 1px 0 rgb(255 255 255/.18),0 1px 2px hsl(var(--foreground)/.12)}
 .primary:hover{background:hsl(var(--foreground)/.9);border-color:transparent}
 .secondary{background:white;color:var(--ink);border-color:var(--line);box-shadow:none}
 .secondary:hover:not(:disabled){background:var(--surface)}
 .primary:active,.secondary:active:not(:disabled){transform:scale(.985)}
 .secondary:disabled{opacity:.6}
 .numbers-card summary{font-size:16px;font-weight:600}
 .number-examples>div{background:white;border-color:var(--line);border-radius:12px}
 .example-icon.heat,.example-icon.cool{background:var(--surface);color:var(--green-dark)}
 .number-pair b{font-weight:600;font-variant-numeric:tabular-nums}
 .section-heading h2{font-size:26px;line-height:1.3}
 .section-heading>p:not(.eyebrow){font-size:14px}
 .help-list summary{font-size:15px;font-weight:500}
 .help-body{font-size:14px}
 .keep-copy,.support-copy{background:white}
 .keep-section h2{font-size:22px;line-height:1.35}
 .keep-section p{font-size:14px}
 .phone-number{font-size:24px;font-weight:600;color:var(--ink);letter-spacing:-.02em}
 .phone-number svg{color:var(--green)}
 .text-link{color:var(--green-dark);font-weight:500}
 .home-card-body{background:white}
 .home-card h2{font-size:24px;line-height:1.35}
 .home-card .model{color:var(--muted)}
 .home-card:hover{border-color:hsl(var(--primary)/.4);box-shadow:var(--warehouse-card-shadow)}
 .dialog-top h2{font-size:22px;line-height:1.35}
 dialog{border-color:var(--line);border-radius:16px}
 @media(min-width:761px) and (max-width:1220px){.task,.task[aria-pressed=true]{padding:12px}}
 @media(max-width:760px){
  html{scroll-padding-top:132px}
  .header-inner{min-height:60px}.brand{gap:7px}.brand-text strong{font-size:15px}
  .brand-text small{font-size:8px;line-height:12px;letter-spacing:.14em}
  .call-link{font-size:12px;min-height:40px;padding:8px 10px}
  .language-bar{background:white}.languages button{font-size:12px}
  .back-link{margin-bottom:0;font-size:11px}
  .guide-intro h1,.home h1{font-size:28px;line-height:1.25;font-weight:600}
  .lead{font-size:15px;line-height:22px}.eyebrow{font-size:10px}
  .task,.task[aria-pressed=true]{padding:12px 6px;font-size:12px}
  .task-warm,.task-cool,.task-warm[aria-pressed=true],.task-cool[aria-pressed=true]{padding:12px 8px;font-size:13px}
  .device-card{padding:12px 14px 16px}.instruction-card{padding:18px}
  #instructions h2{font-size:24px;line-height:1.35}.step-body{font-size:18px;line-height:1.5}
  .view-switch button{font-size:11px}.step-visual{border-color:var(--line);background:white}
  .workspace.has-task .check-box{background:var(--surface);font-size:13px}.check-box strong{font-size:13px}
  .primary,.secondary{font-size:14px;min-height:48px}
  .section-heading h2{font-size:26px}.keep-section h2{font-size:22px}.help-list summary{font-size:14px}
 }
 @media(prefers-reduced-motion:reduce){.primary:active,.secondary:active:not(:disabled){transform:none}}
}