/* ============================================================
 * variables.css — All :root CSS custom properties
 * My Travel History v2.0 — Modular CSS
 * ============================================================ */

/* v9 — Modern Minimal Design System */
:root {
    /* Primary — blue */
    --primary:#2563EB;--primary-dark:#1D4ED8;--primary-light:#60A5FA;--primary-bg:#EFF6FF;
    --secondary:#0EA5E9;--secondary-bg:#F0F9FF;--accent:#6366F1;
    --success:#22C55E;--success-bg:#F0FDF4;--warning:#F59E0B;--warning-bg:#FFFBEB;
    --error:#EF4444;--error-bg:#FEF2F2;

    /* Stone grays — warm tone */
    --g50:#FAFAF9;--g100:#F5F5F4;--g200:#E7E5E4;--g300:#D6D3D1;--g400:#A8A29E;
    --g500:#78716C;--g600:#57534E;--g700:#44403C;--g800:#292524;--g900:#1C1917;
    --white:#fff;--black:#000;

    /* Layout tokens */
    --tv-nav-h:64px;--dv-nav-h:56px;--dv-bnav-h:64px;--dv-side-w:440px;

    /* Typography */
    --font-h:'Plus Jakarta Sans','Noto Sans KR',sans-serif;
    --font:'Inter','Noto Sans KR',-apple-system,sans-serif;

    /* Shadows — softer, warm */
    --shadow:0 1px 3px rgba(28,25,23,.05),0 1px 2px rgba(28,25,23,.03);
    --shadow-md:0 4px 16px -2px rgba(28,25,23,.07),0 2px 4px rgba(28,25,23,.04);
    --shadow-lg:0 12px 32px -4px rgba(28,25,23,.1),0 4px 8px rgba(28,25,23,.04);
    --shadow-xl:0 24px 56px -8px rgba(28,25,23,.14),0 8px 16px rgba(28,25,23,.05);

    /* Radii — slightly larger */
    --r:10px;--r-lg:14px;--r-xl:20px;--r-2xl:28px;--r-full:9999px;

    /* Spacing (4px unit) */
    --sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:20px;--sp-6:24px;--sp-8:32px;--sp-10:40px;

    --safe-b:env(safe-area-inset-bottom,0px);
    --vvh:100dvh;
    --ease:cubic-bezier(.32,.72,0,1);
}