/* ACN Co. Booking App Design Tokens v1.3 — 2026-11-02 America/Chicago
   Sources: PALETTE v2.2 · DESIGN DRAFT v1.3.3 · Card Specs v1.2 · Legal Lines v4.2
   Fonts: self-hosted Poppins 400/500/600/700 + Lato 400/700 (OFL). No Raleway. No remote font URLs.
   Changelog v1.1 → v1.3: local @font-face; mobile header single-row + .studio-bar. */

/* Self-hosted OFL fonts — relative paths only */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../assets/fonts/Poppins-Regular.woff2') format('woff2');
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../assets/fonts/Poppins-Medium.woff2') format('woff2');
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../assets/fonts/Poppins-SemiBold.woff2') format('woff2');
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../assets/fonts/Poppins-Bold.woff2') format('woff2');
}
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../assets/fonts/Lato-Regular.woff2') format('woff2');
}
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../assets/fonts/Lato-Bold.woff2') format('woff2');
}

:root {
  /* Core six */
  --acn-porcelain: #F4F5F5;
  --acn-stone: #CEBFB2;
  --acn-blue-mist: #8DACB7;
  --acn-dusty-teal: #3E6060;
  --acn-dusty-mauve: #5C4B53; /* Branding QA 2026-11-04: Cherry line uses #5C4B53 */
  --acn-ink: #0B0B0B;
  --acn-white: #FFFFFF;

  /* 25% / 30% tints */
  --acn-clear-up-25: #C6D0D0;
  --acn-smooth-over-25: #DAE3E6;
  --acn-glow-up-25: #DAD5D8;
  --acn-stone-25: #EAE8E4;
  --acn-stone-30: #E9E5E1;

  /* Tier shades */
  --acn-tier-clear-ess: #9EB0B0;
  --acn-tier-clear-enh: #3E6060;
  --acn-tier-clear-eli: #283E3E;
  --acn-tier-mist-ess: #C6D6DB;
  --acn-tier-mist-enh: #8DACB7;
  --acn-tier-mist-eli: #4E5F65;
  --acn-tier-mauve-ess: #C6BAC0;
  --acn-tier-mauve-enh: #8E7480;
  --acn-tier-mauve-eli: #5C4B53;

  /* UI */
  --acn-btn-primary-bg: #3E6060;
  --acn-btn-primary-text: #F4F5F5;
  --acn-btn-primary-hover: #2C4646;
  --acn-btn-disabled-bg: #CEBFB2;
  --acn-btn-disabled-text: rgba(11,11,11,0.55);
  --acn-focus: #3E6060;
  --acn-border: #CEBFB2;
  --acn-error-bg: #DAD5D8;
  --acn-error-border: #8E7480;
  --acn-info-bg: #DAE3E6;
  --acn-success-bg: #C6D0D0;
  --acn-skeleton: #EAE8E4;
  --acn-map: #DAE3E6;
  --acn-overlay: rgba(11,11,11,0.45);

  /* Type */
  --font-heading: Poppins, Arial, sans-serif;
  --font-body: Lato, Arial, sans-serif;
  --fs-display: 28px;
  --fs-h1: 24px;
  --fs-h2: 20px;
  --fs-h3: 18px;
  --fs-body: 17px;
  --fs-meta: 16px; /* Branding QA: tagline/step notes/studio sub ≥16 */
  --fs-meta-tight: 14px;
  --fs-legal: 14px;
  --fs-chip: 14px;
  --fs-btn: 16px;
  --fs-link: 16px;

  /* Space */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 40px;

  /* Radius / shadow / size */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-pill: 9999px;
  --shadow-soft: 0 1px 2px rgba(11,11,11,0.06);
  --shadow-lift: 0 4px 12px rgba(11,11,11,0.08);
  --tap-min: 44px;
  --btn-min-h: 48px;
  --input-min-h: 48px;
  --radio-min-h: 52px;
  --header-h: 64px;
}

/* Header v1.3 — single-row top bar; studio chip in .studio-bar below */
.app-header{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:var(--header-h);padding:8px 12px;background:var(--acn-white);border-bottom:1px solid var(--acn-border);flex-wrap:nowrap}
.app-header .logo{height:36px;width:auto;flex-shrink:0}
.app-header .nav-links{display:flex;align-items:center;gap:4px;flex-wrap:nowrap;flex-shrink:0}
.app-header .nav-links a{font:700 14px/1.2 var(--font-body);color:var(--acn-ink);text-decoration:none;min-height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center;padding:8px 10px;white-space:nowrap}
.app-header .nav-links a.manage{color:var(--acn-dusty-teal)}
.studio-bar{display:flex;align-items:center;gap:8px;min-height:36px;padding:6px 12px;background:var(--acn-porcelain);border-bottom:1px solid var(--acn-border)}
.studio-bar .acn-chip-studio{font:700 14px/1.2 var(--font-body)}
.studio-bar .acn-link{font:700 14px/1.2 var(--font-body)}
