/* plus-jakarta-sans-vietnamese-wght-normal */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-display: swap;
  font-weight: 200 800;
  src: url(./fonts/plus-jakarta-sans-vietnamese-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* plus-jakarta-sans-latin-ext-wght-normal */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-display: swap;
  font-weight: 200 800;
  src: url(./fonts/plus-jakarta-sans-latin-ext-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* plus-jakarta-sans-latin-wght-normal */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-display: swap;
  font-weight: 200 800;
  src: url(./fonts/plus-jakarta-sans-latin-wght-normal.woff2) format('woff2-variations');
  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;
}

/* Shared easy identity: public website and administration.
   Primary palette: Lime, Ink, Background, Neutral, Muted. */
:root {
  --easy-lime: #C7F43D;
  --easy-ink: #161713;
  --easy-white: #FAFAF7;
  --easy-neutral: #ECEDE7;
  --easy-muted: #777A70;
  --easy-surface: var(--easy-neutral);
  --easy-line: color-mix(in srgb, var(--easy-ink) 10%, var(--easy-neutral));
  --easy-soft-lime: color-mix(in srgb, var(--easy-lime) 38%, var(--easy-white));
  --easy-family-game: #8B5CF6;
  --easy-family-tools: #25C9D0;
  --easy-family-web: #FF7849;
  --easy-family-learn: #FFCA3A;
  --easy-family-ai: #F45AA5;
  --easy-purple: color-mix(in srgb, var(--easy-family-game) 22%, var(--easy-white));
  --easy-purple-ink: var(--easy-family-game);
  --easy-cyan: color-mix(in srgb, var(--easy-family-tools) 24%, var(--easy-white));
  --easy-cyan-ink: var(--easy-family-tools);
  --easy-peach: color-mix(in srgb, var(--easy-family-web) 24%, var(--easy-white));
  --easy-peach-ink: var(--easy-family-web);
  --easy-yellow: color-mix(in srgb, var(--easy-family-learn) 28%, var(--easy-white));
  --easy-pink: color-mix(in srgb, var(--easy-family-ai) 22%, var(--easy-white));
  --easy-error: #A62E39;
  --easy-error-bg: #FFF0F1;
  --easy-backdrop: rgb(22 23 19 / 45%);
  --easy-shadow: 0 12px 36px rgb(22 23 19 / 5%);
  --easy-shadow-modal: 0 24px 80px rgb(22 23 19 / 18%);
  --easy-font: 'Plus Jakarta Sans', system-ui, sans-serif;
  --easy-weight-body: 400;
  --easy-weight-medium: 500;
  --easy-weight-label: 600;
  --easy-weight-heading: 700;
  --easy-weight-display: 800;
  --easy-text-xs: 0.75rem;
  --easy-text-sm: 0.9375rem;
  --easy-text-body: 1.0625rem;
  --easy-text-lead: 1.1875rem;
  --easy-text-card: 1.5rem;
  --easy-text-h3: 1.75rem;
  --easy-text-h2: clamp(2rem, 3.6vw, 3.25rem);
  --easy-text-h1: clamp(2.25rem, 4.4vw, 3.75rem);
  --easy-text-hero: clamp(2.85rem, 6.4vw, 5.35rem);
  --easy-text-stat: 2.75rem;
  --easy-leading-body: 1.7;
  --easy-leading-label: 1.45;
  --easy-leading-heading: 1.15;
  --easy-leading-display: 1.02;
  --easy-tracking-heading: -0.04em;
  --easy-tracking-display: -0.06em;
  --easy-tracking-label: 0;
  --spacing-0: 0;
  --spacing-0-5: 2px;
  --spacing-1: 4px;
  --spacing-2: 8px;
  --spacing-3: 12px;
  --spacing-4: 16px;
  --spacing-5: 20px;
  --spacing-6: 24px;
  --spacing-7: 28px;
  --spacing-8: 32px;
  --spacing-10: 40px;
  --spacing-12: 48px;
  --spacing-16: 64px;
  --spacing-20: 80px;
  --spacing-24: 96px;
  /* Keep controls that intentionally use the pill token rounded; every surface
     and card uses a compact, consistent 10px corner radius. */
  --radius-sm: 10px;
  --radius-md: 10px;
  --radius-lg: 10px;
  --radius-xl: 10px;
  --radius-pill: 999px;
  --easy-border: 1px;
  --easy-focus: 3px;
  --easy-control: 48px;
  --easy-icon: 48px;
  --easy-icon-small: 36px;
  --easy-logo: 40px;
  --easy-page: 1440px;
  --easy-page-gutter: 28px;
  --easy-section-gap: 88px;
  --easy-copy-width: 42ch;
  --easy-title-width: 18ch;
  --easy-modal: 760px;
  --easy-hero-height: 620px;
  --easy-content-min: 320px;
  --easy-admin-sidebar: 240px;
  --easy-fast: 180ms;
  --easy-ease: cubic-bezier(.2,.7,.2,1);
}