:root {
    --color-bg-0: #0e0f12;
    --color-bg-1: #15171c;
    --color-bg-2: #1c1f26;
    --color-bg-3: #262a33;

    --color-fg-0: #f2f3f5;
    --color-fg-1: #c9ccd3;
    --color-fg-2: #8a8f99;
    --color-fg-3: #555a65;

    --color-border: #2a2e37;
    --color-border-strong: #3a3f4a;

    --color-accent: #e4b363;
    --color-accent-hover: #f0c378;

    --color-standard: #74cfdb;
    --color-deep:     #c05fff;

    /* Tier 2 色を橋渡しするブランドグラデーション。cyan (Standard) → purple (DEEP) を
       135deg で流す。ヒーロー / ピックアップ / CTA で再利用する。 */
    --gradient-brand: linear-gradient(135deg, var(--color-standard) 0%, var(--color-deep) 100%);
    --gradient-brand-h: linear-gradient(90deg, var(--color-standard) 0%, var(--color-deep) 100%);
    --gradient-brand-soft: linear-gradient(135deg, rgba(116, 207, 219, .10) 0%, rgba(192, 95, 255, .10) 100%);
    --gradient-brand-glow: radial-gradient(ellipse 80% 60% at 50% 40%, rgba(116, 207, 219, .12) 0%, rgba(192, 95, 255, .08) 40%, transparent 70%);

    --color-success: #4caf82;
    --color-warning: #e4b363;
    --color-danger:  #e05a6b;

    --font-sans: "Hiragino Sans", "Noto Sans JP", system-ui, -apple-system,
                 "Segoe UI", sans-serif;
    --font-serif: "Hiragino Mincho ProN", "Noto Serif JP", Georgia, serif;
    --font-mono: "SFMono-Regular", "Consolas", monospace;

    --fs-xs: 12px;
    --fs-sm: 14px;
    --fs-md: 16px;
    --fs-lg: 18px;
    --fs-xl: 22px;
    --fs-2xl: 28px;
    --fs-3xl: 36px;

    --lh-tight: 1.25;
    --lh-normal: 1.6;
    --lh-loose: 1.9;

    --sp-1: 4px;
    --sp-2: 8px;
    --sp-3: 12px;
    --sp-4: 16px;
    --sp-5: 24px;
    --sp-6: 32px;
    --sp-7: 48px;
    --sp-8: 64px;

    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 14px;
    --radius-pill: 999px;

    --shadow-1: 0 1px 2px rgba(0, 0, 0, .4);
    --shadow-2: 0 4px 12px rgba(0, 0, 0, .5);
    --shadow-3: 0 12px 32px rgba(0, 0, 0, .6);

    --content-max: 1200px;
    --reading-max: 720px;
    --header-h: 56px;

    --ease: cubic-bezier(.4, 0, .2, 1);
    --dur-fast: 120ms;
    --dur-base: 200ms;
    --dur-slow: 320ms;
}
