/* You & Me — template tokens
   Ported from the missing `shared/tokens.css` that Homepage.html and Admin.html
   reference. Values reconstructed from the templates' inline JS palette defaults
   ("teal") and from context (ink/paper/cream/hairline usage across the file). */
:root {
  /* Core palette — "teal" default from Homepage.html tweaks panel */
  --teal: #0E5A51;
  --teal-ink: #083A34;
  --teal-soft: #CDE0DC;
  --teal-tint: #EAF2F0;

  --terracotta: #E98A3B;
  --terracotta-soft: #F6D9BE;
  --terracotta-tint: #FCEEDE;

  /* Aliases the templates rely on */
  --accent: var(--teal);
  --accent-ink: var(--teal-ink);
  --accent-soft: var(--teal-soft);
  --accent-tint: var(--teal-tint);
  --warm: var(--terracotta);
  --warm-soft: var(--terracotta-soft);
  --warm-tint: var(--terracotta-tint);

  /* Neutrals */
  --cream: #F6F1E8;
  --paper: #FFFFFF;
  --ink: #1A2220;
  --ink-2: #4A5553;
  --muted: #8A938F;
  --sand: #E6D9C2;

  --bg: var(--cream);
  --surface: var(--paper);
  --sidebar: #0F1F1C;

  /* Lines & status */
  --hairline: rgba(26, 34, 32, 0.08);
  --hairline-strong: rgba(26, 34, 32, 0.18);
  --ok: #5FA67F;
  --bad: #C35F5A;

  /* Type */
  --serif: "Fraunces", "Cormorant Garamond", Georgia, serif;
  --sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "JetBrains Mono", ui-monospace, monospace;

  /* Radius */
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 28px;
  --r-full: 9999px;

  /* Shadow */
  --shadow-sm: 0 1px 2px rgba(15, 31, 28, 0.04), 0 2px 4px rgba(15, 31, 28, 0.04);
  --shadow-md: 0 6px 16px rgba(15, 31, 28, 0.06), 0 12px 36px rgba(15, 31, 28, 0.06);
  --shadow-lg: 0 10px 30px rgba(15, 31, 28, 0.08), 0 20px 60px rgba(15, 31, 28, 0.1);
}

html, body { font-family: var(--sans); color: var(--ink); background: var(--bg); margin: 0; padding: 0; }
*, *::before, *::after { box-sizing: border-box; }
a { color: inherit; text-decoration: none; }
button { font-family: inherit; }
img { max-width: 100%; height: auto; display: block; }