/* Boysenberry Golf — Palette v02 (working candidate, per Design/Palettes/boysenberry-palette-v02.md).
   Ramps are exact; nothing is rounded or re-derived. Semantic roles mirror the Xcode
   asset catalogue names in Theme.swift (brandBackground, brandSurface, …). */
:root {
  /* ── Boysenberry ramp ── */
  --bg-boysenberry-50: #FFF0F9;
  --bg-boysenberry-100: #FFD2ED;
  --bg-boysenberry-200: #F9A5DB;
  --bg-boysenberry-300: #E579C2;
  --bg-boysenberry-400: #CD55A9;
  --bg-boysenberry-500: #B33790;
  --bg-boysenberry-600: #942776;
  --bg-boysenberry-700: #711E5A;
  --bg-boysenberry-800: #50153F;
  --bg-boysenberry-900: #310C26;

  /* ── Forest ramp ── */
  --bg-forest-50: #EEF8F0;
  --bg-forest-100: #D2E8D6;
  --bg-forest-200: #A7D0B0;
  --bg-forest-300: #7AB589;
  --bg-forest-400: #509563;
  --bg-forest-500: #1F6B3A;
  --bg-forest-600: #105329;
  --bg-forest-700: #0C3D1E;
  --bg-forest-800: #0B2B16;
  --bg-forest-900: #071B0D;
  /* Accessible dark-mode action. Deliberately between Forest 300 and 400. */
  --bg-forest-dark-action: #58A86D;

  /* ── Leather ramp (illustration + material; not a UI action family) ── */
  --bg-leather-50: #FFF2EE;
  --bg-leather-100: #FFD7CA;
  --bg-leather-200: #F7B19A;
  --bg-leather-300: #E78768;
  --bg-leather-400: #CD5C37;
  --bg-leather-500: #AC3601;
  --bg-leather-600: #872800;
  --bg-leather-700: #671E03;
  --bg-leather-800: #481605;
  --bg-leather-900: #2D0D04;

  /* ── Warm neutral ramp ── */
  --bg-neutral-50: #FBFAF8;
  --bg-neutral-100: #F5F3F0;
  --bg-neutral-200: #EAE7E3;
  --bg-neutral-300: #D4D1CA;
  --bg-neutral-400: #B4B1A9;
  --bg-neutral-500: #8F8C84;
  --bg-neutral-600: #6C6862;
  --bg-neutral-700: #4D4A44;
  --bg-neutral-800: #302E29;
  --bg-neutral-900: #171613;

  /* ── Illustration-only families (never arbitrary button colours) ── */
  --bg-illustration-olive: #868B02;
  --bg-illustration-fairway: #748200;
  --bg-illustration-sky: #3CA2DC;
  --bg-illustration-leather: #AC3601;
  --bg-illustration-leather-deep: #431001;
  --bg-illustration-cream: #FDF9F0;
  --bg-illustration-ink: #140604;

  /* ── Muted heritage support (editorial, secondary badges, player identity) ── */
  --bg-heritage-mauve: #765468;
  --bg-heritage-rose: #9A7585;
  --bg-heritage-moss: #657052;
  --bg-heritage-olive: #85866A;
  --bg-heritage-leather: #8B654E;
  --bg-heritage-sage: #A9BBB4;
  --bg-heritage-paper: #F4EAD7;
  --bg-heritage-ink: #3A3229;

  /* ── Semantic product roles — light appearance ── */
  --brand-background: #F5F1E9;
  --brand-surface: #FCFBF8;
  --brand-surface-raised: #FDF9F0;
  --brand-action-primary: #1F6B3A;
  --brand-action-primary-pressed: #105329;
  --brand-action-primary-soft: #E3EEE5;
  --brand-action-on-primary: #FFFFFF;
  --brand-accent: #B33790;
  --brand-accent-soft: rgba(179, 55, 144, 0.16);
  --brand-accent-tint: #F8D8EC;
  --brand-accent-ink: #711E5A;
  --brand-text-branded: #140604;
  --brand-text-primary: #140604;
  --brand-text-secondary: #6C6862;
  --brand-text-tertiary: #8F8C84;
  --brand-separator: #D9D0C4;
  --brand-separator-quiet: #EAE7E3;
  --brand-separator-hairline: #E8E2D9;

  /* Platform semantics — kept, not rebranded */
  --brand-danger: #B42318;
  --brand-danger-soft: #FEE4E2;
  --brand-warning: #8B5A00;
  --brand-warning-soft: #FFF0C2;
  --brand-warning-strip-ink: #744800;
  --brand-warning-strip-bg: #FBF2DF;
  --brand-warning-strip-border: #E4C997;
  --brand-success: #1F6B3A;
  --brand-success-soft: #DFF1E4;
  --brand-info-bg: #F8F3EA;
  --brand-info-border: #E3D7C8;
  /* Over par on a scorecard: leather, never system red (Theme.swift). */
  --brand-score-over-par: #AC3601;
  --brand-gold: #D6AB33;
  --brand-silver: #B8BAC2;
  --brand-bronze: #B87333;

  /* ── Player identity set (PlayerIdentity.swift; indexed, never called by name) ── */
  --player-rose-fill: #F2E0E8;
  --player-rose-ink: #7A4A5E;
  --player-plum-fill: #E9E1EC;
  --player-plum-ink: #63455F;
  --player-moss-fill: #E1EBE0;
  --player-moss-ink: #46583F;
  --player-olive-fill: #ECEBDD;
  --player-olive-ink: #5C5D42;
  --player-leather-fill: #F2E4D9;
  --player-leather-ink: #79553D;
  --player-sage-fill: #E0EAE8;
  --player-sage-ink: #45605A;
  --player-sky-fill: #DFEAF3;
  --player-sky-ink: #3A6480;
}

/* ── Dark appearance. Every semantic role carries a dark value; the app never
      pins a colour scheme. Warm charcoal layers, never pure black on black. ── */
[data-appearance="dark"] {
  --brand-background: #161616;
  --brand-surface: #22201E;
  --brand-surface-raised: #2B2825;
  --brand-action-primary: #58A86D;
  --brand-action-primary-pressed: #509563;
  --brand-action-primary-soft: #173D23;
  --brand-action-on-primary: #140604;
  --brand-accent: #D76CBC;
  --brand-accent-soft: rgba(215, 108, 188, 0.16);
  --brand-accent-tint: #50153F;
  --brand-accent-ink: #FFD2ED;
  --brand-text-branded: #F5F1E9;
  --brand-text-primary: #F5F1E9;
  --brand-text-secondary: #B4B1A9;
  --brand-text-tertiary: #8F8C84;
  --brand-separator: #403B37;
  --brand-separator-quiet: #302E29;
  --brand-separator-hairline: #302E29;

  --brand-danger: #FF6961;
  --brand-danger-soft: #4D1E1B;
  --brand-warning: #F1BD5D;
  --brand-warning-soft: #4A3511;
  --brand-warning-strip-ink: #F1BD5D;
  --brand-warning-strip-bg: #4A3511;
  --brand-warning-strip-border: #6B4E1A;
  --brand-success: #58A86D;
  --brand-success-soft: #173D23;
  --brand-info-bg: #2B2825;
  --brand-info-border: #403B37;
  --brand-score-over-par: #E78768;

  --player-rose-fill: #3B2A32;
  --player-rose-ink: #D8AEBE;
  --player-plum-fill: #322A38;
  --player-plum-ink: #C7ADCB;
  --player-moss-fill: #25302A;
  --player-moss-ink: #A8C4A2;
  --player-olive-fill: #2F2F26;
  --player-olive-ink: #C0C0A0;
  --player-leather-fill: #36291F;
  --player-leather-ink: #D3AE92;
  --player-sage-fill: #26302E;
  --player-sage-ink: #A4C0BA;
  --player-sky-fill: #222D36;
  --player-sky-ink: #A6C6DA;
}

/* Fraunces is the display face and only the display face. Setting the interface
   in it is named in BRAND_STATUS.md as the failure to avoid. San Francisco /
   system typography carries navigation, controls, labels, body and dense scoring data.

   Fraunces ships as ONE variable file whose default is Black at 9pt optical size
   (wght 900, opsz 9). Asking for it by name alone renders that. Every display
   role below therefore names wght and opsz explicitly. */
@font-face {
  font-family: "Fraunces";
  src: url("fonts/Fraunces-variable.ttf") format("truetype");
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --font-display: "Fraunces", Georgia, "Times New Roman", serif;
  /* San Francisco is a platform font: -apple-system / BlinkMacSystemFont resolve it
     on Apple hardware, so no family needs naming (and none can be shipped). */
  --font-system: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;

  /* Fraunces axis settings per role. SOFT/WONK values come from the approved mocks. */
  --font-display-variation-title: "opsz" 72, "SOFT" 25, "WONK" 1;
  --font-display-variation-heading: "opsz" 38, "SOFT" 25, "WONK" 1;
  --font-display-variation-numeral: "opsz" 72, "SOFT" 16;
  --font-display-weight: 720;
  --font-display-tracking: -0.022em;

  /* Display roles — sizes taken from BrandTypography.swift and the Play pilot. */
  --type-welcome-size: 30px;        /* BrandTypography.welcome() — a screen's identity moment */
  --type-round-name-size: 22px;     /* BrandTypography.roundName() */
  --type-numeral-size: 34px;        /* BrandTypography.expressiveNumeral() */
  --type-display-h1-size: 34px;     /* UI kit: Title 34pt / Fraunces 720 */
  --type-display-h2-size: 25px;
  --type-display-h3-size: 19px;

  /* System roles — iOS text styles, the sizes the app actually ships. */
  --type-body-size: 17px;           /* UI kit: Body 17pt / SF Regular */
  --type-section-size: 22px;        /* Section 22pt / SF 700 */
  --type-label-size: 13px;          /* Label 13pt / SF Semibold */
  --type-callout-size: 16px;
  --type-footnote-size: 13px;
  --type-caption-size: 12px;
  --type-caption2-size: 11px;

  --type-eyebrow-size: 11px;
  --type-eyebrow-tracking: 0.09em;
  --type-eyebrow-weight: 800;

  --line-tight: 1.02; /* @kind other */
  --line-heading: 1.08; /* @kind other */
  --line-body: 1.42; /* @kind other */
  --line-meta: 1.35; /* @kind other */
}

/* Utility classes — the same roles, ready to use in a mock or specimen. */
.bg-display { font-family: var(--font-display); font-weight: var(--font-display-weight); font-variation-settings: var(--font-display-variation-heading); letter-spacing: var(--font-display-tracking); line-height: var(--line-tight); font-optical-sizing: auto; }
.bg-display-h1 { font-size: var(--type-display-h1-size); }
.bg-display-h2 { font-size: var(--type-display-h2-size); }
.bg-display-h3 { font-size: var(--type-display-h3-size); line-height: var(--line-heading); }
.bg-numeral { font-family: var(--font-display); font-weight: 750; font-variation-settings: var(--font-display-variation-numeral); font-size: var(--type-numeral-size); line-height: 0.85; }
.bg-body { font-family: var(--font-system); font-size: var(--type-body-size); line-height: var(--line-body); }
.bg-meta { font-family: var(--font-system); font-size: var(--type-footnote-size); line-height: var(--line-meta); color: var(--brand-text-secondary); }
.bg-micro { font-family: var(--font-system); font-size: var(--type-caption2-size); line-height: 1.25; color: var(--brand-text-secondary); }
.bg-eyebrow { font-family: var(--font-system); font-size: var(--type-eyebrow-size); font-weight: var(--type-eyebrow-weight); letter-spacing: var(--type-eyebrow-tracking); color: var(--brand-accent); text-transform: uppercase; }

/* Spacing is in points, as the app's SwiftUI layout is. The scale below is the
   set the approved mocks actually use — it is not a 4/8 grid, and values are
   not snapped to one. */
:root {
  --space-1: 2px;
  --space-2: 4px;
  --space-3: 5px;
  --space-4: 7px;
  --space-5: 9px;
  --space-6: 11px;
  --space-7: 12px;
  --space-8: 15px;
  --space-9: 18px;
  --space-10: 22px;
  --space-11: 26px;
  --space-12: 32px;

  /* Screen-level geometry, iPhone 17 Pro (402 × 874 pt). */
  --screen-width: 402px;
  --screen-height: 874px;
  --screen-gutter: 18px;
  --nav-height: 45px;
  --status-height: 49px;
  --tabbar-height: 81px;
  --floating-tabbar-clearance: 16px;

  /* Never below this. BrandControlMetrics.minimumHitTarget */
  --hit-target-min: 44px;
  --row-min-height: 44px;
  --control-height: 48px;
  --avatar-size: 26px;
}

/* Radius bands from UI Kit v01. Role bands, not a different radius per component.
   Light appearance: subtle border plus a restrained warm shadow.
   Dark appearance: surface tone and borders carry elevation — no glow, no muddy shadow. */
:root {
  --radius-control: 13px;      /* compact controls: 12–16 pt band */
  --radius-control-lg: 16px;
  --radius-card: 15px;         /* the shipped mock card radius */
  --radius-card-lg: 20px;      /* content cards: 18–22 pt band */
  --radius-group: 26px;        /* large grouped surfaces: 24–28 pt band */
  --radius-capsule: 999px;     /* every action pill; BrandActionContract.usesCapsule */
  --radius-screen: 43px;       /* iPhone 17 Pro display corner */

  --border-hairline: 1px;
  --border-card: 1px;
  --border-control: 1.5px;
  --border-focus: 2px;
  --ring-identity: 1.5px;      /* PlayerAvatar ring */

  --shadow-card: 0 5px 12px rgba(20, 6, 4, 0.045);
  --shadow-card-lg: 0 10px 24px rgba(20, 6, 4, 0.07);
  --shadow-section: 0 12px 30px rgba(20, 6, 4, 0.08);
  --shadow-device: 0 20px 42px rgba(20, 6, 4, 0.18);
  --shadow-focus-ring: 0 0 0 3px rgba(31, 107, 58, 0.16);
}

[data-appearance="dark"] {
  --shadow-card: none;
  --shadow-card-lg: none;
  --shadow-section: none;
  --shadow-focus-ring: 0 0 0 3px rgba(88, 168, 109, 0.22);
}

/* Default component motion is critically damped — SwiftUI response 0.3–0.4, no
   decorative overshoot. Bounce only where a real gesture handed off momentum.
   Touch feedback begins on contact; a restrained 0.97 press scale may accompany
   the platform highlight. */
:root {
  --motion-duration-quick: 180ms; /* @kind other */
  --motion-duration-default: 320ms; /* @kind other */
  --motion-duration-settled: 400ms; /* @kind other */
  --motion-ease-damped: cubic-bezier(0.32, 0.72, 0, 1); /* @kind other */
  --motion-ease-momentum: cubic-bezier(0.2, 0.9, 0.15, 1.06); /* @kind other */
  --press-scale: 0.97; /* @kind other */
  --press-duration: 90ms; /* @kind other */
}

@media (prefers-reduced-motion: reduce) {
  :root {
    /* Reduced Motion replaces spatial travel with a short cross-fade. */
    --motion-duration-quick: 1ms; /* @kind other */
    --motion-duration-default: 120ms; /* @kind other */
    --motion-duration-settled: 120ms; /* @kind other */
    --press-scale: 1; /* @kind other */
  }
}

/* Minimal, opt-in base. Consumers get warm paper, system type, and link colours
   drawn from the palette rather than the browser default blue. */
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: var(--font-system); font-size: var(--type-body-size); line-height: var(--line-body); color: var(--brand-text-primary); background: var(--brand-background); }
a { color: var(--brand-action-primary); text-decoration: none; font-weight: 600; }
a:hover { color: var(--brand-action-primary-pressed); text-decoration: underline; }
[data-appearance="dark"] a:hover { color: var(--bg-forest-300); }
*, *::before, *::after { box-sizing: border-box; }

