/* Dr. Dinooooo tokens: primitive -> semantic -> component (design-system skill).
   Values from vault Dino Brand Guide (palette PROVISIONAL, fonts LOCKED Option D). */

/* === PRIMITIVES === */
:root{
  --p-dino-white:#F7F5EF;
  --p-quiet-ink:#2F3338;
  --p-ink-soft:#4E545B;
  --p-soft-grey:#E7E9EA;
  --p-mist:#D9E5EC;
  --p-warm:#F6DEC2;
  --p-lavender:#DDD4EC;
  --p-dusk:#4A5A78;
  --p-dusk-deep:#3B4862;
  --p-friend-blue:#BFDDEB;
  --p-friend-yellow:#F4DF9A;
  --p-friend-pink:#F1C5D2;
  --p-friend-green:#C8DFC5;
  --p-friend-purple:#CCBFE5;

  --p-font-zh-display:"Iansui","Noto Serif TC","Songti TC",serif;
  --p-font-zh-text:"Chiron Hei HK","PingFang TC","Noto Sans TC",system-ui,sans-serif;
  --p-font-en-display:"Young Serif",Georgia,serif;

  --p-space-1:4px; --p-space-2:8px; --p-space-3:12px; --p-space-4:16px; --p-space-5:24px;
  --p-space-6:32px; --p-space-7:48px; --p-space-8:72px; --p-space-9:112px;
  --p-ease-out:cubic-bezier(.22,1,.36,1);
}

/* === SEMANTIC === */
:root{
  --bg:var(--p-dino-white);
  --ink:var(--p-quiet-ink);
  --ink-soft:var(--p-ink-soft);
  --accent:var(--p-dusk);
  --accent-press:var(--p-dusk-deep);
  --on-accent:var(--p-dino-white);

  --room-white:var(--p-dino-white);
  --room-mist:var(--p-mist);
  --room-lavender:var(--p-lavender);
  --room-warm:var(--p-warm);
  --room-grey:var(--p-soft-grey);
  --room-field:var(--p-dusk);

  --friend-blue:var(--p-friend-blue);
  --friend-yellow:var(--p-friend-yellow);
  --friend-pink:var(--p-friend-pink);
  --friend-green:var(--p-friend-green);
  --friend-purple:var(--p-friend-purple);

  --font-display:var(--p-font-zh-display);
  --font-text:var(--p-font-zh-text);
  --font-en:var(--p-font-en-display);

  /* five type steps */
  --t-1:clamp(2.25rem,1.3rem + 3.1vw,3.5rem);   /* 36 -> 56 */
  --t-2:clamp(1.625rem,1.2rem + 1.4vw,2.125rem); /* 26 -> 34 */
  --t-3:clamp(1.25rem,1.1rem + .5vw,1.375rem);   /* 20 -> 22 */
  --t-4:1.0625rem;                               /* 17 */
  --t-5:.875rem;                                 /* 14 */

  --margin:clamp(20px,5vw,80px);
  --gutter:clamp(16px,2vw,32px);
  --room-pad:clamp(96px,14vh,180px);
  --dur-room:900ms;
  --dur-ui:280ms;
  --ease:var(--p-ease-out);
}

/* === COMPONENTS === */
:root{
  --btn-bg:var(--accent);
  --btn-bg-press:var(--accent-press);
  --btn-fg:var(--on-accent);
  --btn-h:48px;
  --btn-radius:999px;
  --label-fg:var(--ink-soft);
  --focus:var(--accent);
}

/* motion helpers for taste-skill layer */
:root{
  --t-reveal:800ms;
  --t-hover:180ms;
  --t-press:140ms;
  --ease-soft:cubic-bezier(.33,1,.68,1);
  --radius:0px;
}