/* Backup lab design tokens (HANDOFF section 13). */
:root {
  --coral: #C97272;
  --sage: #5B9B8E;      /* accepted */
  --amber: #C89464;     /* pending */

  --bg-base: #FAF6F1;
  --bg-raised: #F0EBE3;
  --bg-card: #FFFFFF;
  --text-primary: #1A1218;
  --text-secondary: #6B6572;
  --text-tertiary: #B0AAA8;
  --border: #E4DCD5;

  --font-display: 'Fraunces', Georgia, serif;
  --font-body: 'DM Sans', system-ui, -apple-system, sans-serif;

  --shadow-card: 0 1px 2px rgba(26,18,24,.04), 0 6px 20px rgba(26,18,24,.06);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --radius-card: 16px;
  --gutter: 24px;
  color-scheme: light;
}

:root[data-theme="dark"] {
  --bg-base: #1A0E10;
  --bg-raised: #221318;
  --bg-card: #2C1A1F;
  --text-primary: rgba(255,255,255,.88);
  --text-secondary: rgba(255,255,255,.55);
  --text-tertiary: rgba(255,255,255,.28);
  --border: rgba(255,255,255,.08);
  --shadow-card: 0 1px 2px rgba(0,0,0,.3), 0 8px 24px rgba(0,0,0,.35);
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }

html, body {
  margin: 0;
  min-height: 100%;
  background: var(--bg-base);
  color: var(--text-primary);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.45;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* Subtle grain overlay. */
.grain {
  position: fixed; inset: 0; pointer-events: none; z-index: 0; opacity: .05;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

.app-shell {
  position: relative; z-index: 1;
  max-width: 560px; margin: 0 auto;
  padding: calc(24px + env(safe-area-inset-top)) var(--gutter) calc(24px + env(safe-area-inset-bottom));
}

.wordmark {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 28px;
  letter-spacing: -0.4px;
  margin: 0 0 6px;
}

.muted { color: var(--text-secondary); margin: 0; }