/* ════════════════════════════════════════════════════════════════════
   ClaroPro — palette ported 1:1 from the iOS app (Theme/Color+Brand.swift)
   Dark workspace = the night; Porcelain welcome canvas = the daybreak.
   ════════════════════════════════════════════════════════════════════ */
:root {
  /* Workspace (dark appearance) */
  --canvas: #050C08;          /* canvasGreen · dark */
  --canvas-2: #08130D;
  --card: #181E1B;            /* cardGreen · dark */
  --forest: #1F5C40;          /* brandGreen */
  --mint: #87BD9F;            /* brandMint / workspaceMint · dark */
  --money: #7BB494;           /* moneyGreen · dark */
  --mint-hi: #8AD5AC;         /* mapSelectionMint */
  --amber: #D4A359;           /* pendingAmber · dark */
  --blue: #66BEFA;            /* sentBlue · dark */
  --rose: #C98773;            /* refundRose · dark */
  --sys-red: #FF453A;         /* iOS system red (Start over / REC) */
  --ink: #FFFFFF;
  --ink-2: rgba(255,255,255,.74);
  --ink-3: rgba(255,255,255,.54);
  --ink-4: rgba(255,255,255,.30);
  --hair: rgba(140,180,152,.24); /* hairlineGreen · dark */
  --hair-soft: rgba(140,180,152,.13);
  --glass: rgba(18,26,22,.52);

  /* Porcelain (welcome canvas) */
  --porcelain: #F8F7F4;
  --p-ink: #050C08;
  --p-2: #465049;
  --p-3: #8C948C;
  --p-well: #EFEEE9;
  --p-edge: #D1DBD1;
  --p-hair: #6B927F;
  --p-forest: #1F5C40;
  --p-amber: #855510;
  --p-blue: #17669D;

  /* App icon */
  --icon-bg-a: #191B1F;
  --icon-bg-b: #282B32;
  --icon-amber-a: #F3BC7C;
  --icon-amber-b: #FEE4C1;
  --icon-green-a: #249A74;
  --icon-green-b: #51CD99;

  --serif: 'Instrument Serif', 'Iowan Old Style', 'Palatino', Georgia, serif;
  --sans: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Inter', 'Segoe UI', system-ui, sans-serif;
  --rounded: ui-rounded, 'SF Pro Rounded', -apple-system, BlinkMacSystemFont, 'Inter', system-ui, sans-serif;
  --display: 'Gill Sans UltraBold', 'Claro Display', 'Inter', system-ui, sans-serif;
  --display-soft: 'Gill Sans', 'Gill Sans MT', 'Inter', system-ui, sans-serif; /* the hero's family in a lighter cut (Bold/SemiBold) */

  --r-btn: 14px;     /* MoneyGreenSolidButtonStyle */
  --r-card: 18px;
  --r-sheet: 36px;   /* presentationCornerRadius(36) */
  --ease: cubic-bezier(.2,.7,.2,1);
  --ease-soft: cubic-bezier(.45,0,.2,1);
  --gutter: clamp(16px, 5vw, 64px);
  --nav-h: 76px;
}

/* Gill Sans UltraBold ships with macOS/iOS (and MS Office on Windows).
   It's Monotype-licensed, so it's matched locally rather than hosted. */
@font-face {
  font-family: 'Gill Sans UltraBold';
  src: local('Gill Sans UltraBold'), local('GillSans-UltraBold'), local('Gill Sans Ultra Bold');
  font-weight: 900;
}
/* Everywhere else (Android, ChromeOS, Linux, Windows without Office) the titles would drop to Inter and lose
   their chunk, so they get Rammetto One (OFL, 13 KB, self-hosted; license beside it), the closest free match.
   It's tuned to Gill: 98% size matches its x-height and keeps lines no wider, and the ascent/descent
   overrides (divided by the 98%, as Chrome scales them) put the baseline where Gill's is. Devices with Gill
   never download it: the browser only fetches a web font when the families before it can't draw the text. */
@font-face {
  font-family: 'Claro Display';
  src: url('../fonts/rammetto-one-latin.woff2') format('woff2');
  font-weight: 900; font-display: swap;
  size-adjust: 98%; ascent-override: 101.4%; descent-override: 25.7%; line-gap-override: 0%;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}