/* 하루한장 테마 토큰 — scripts/gen_css.py 로 생성 (직접 수정 대신 tokens.json/스크립트를 고치세요)
   사용: <html data-theme="system|paper|ink|slate" data-accent="blue|indigo|teal|coral|rose|graphite">
   system = 라이트일 때 paper, 다크일 때 ink. 속성이 없으면 paper + blue. */
:root{
  --font:"Pretendard Variable","Pretendard",-apple-system,"Apple SD Gothic Neo","Noto Sans KR",system-ui,sans-serif;
  --tap:44px;
  --r-pill:999px;
  --lh-tight:1.2;
  --lh-base:1.5;
  --sp-1:4px;
  --sp-2:8px;
  --sp-3:12px;
  --sp-4:16px;
  --sp-5:20px;
  --sp-6:24px;
  --sp-7:32px;
  --fs-xs:11px;
  --fs-s:12px;
  --fs-m:13px;
  --fs-b:15px;
  --fs-h3:17px;
  --fs-h2:20px;
  --fs-h1:30px;
}

/* ---- 콘셉트(바탕·글자·형태) ---- */
:root,[data-theme="paper"],[data-theme="system"]{
  color-scheme:light;
  --bg:#F4F2ED;
  --surface:#FFFFFF;
  --surface-2:#ECE9E2;
  --line:#E4E0D7;
  --line-strong:#8D8A95;
  --text:#1C1B21;
  --text-2:#47454F;
  --text-muted:#6B6873;
  --text-faint:#8D8A95;
  --now:#C4383D;
  --on-now:#FFFFFF;
  --danger:#B42318;
  --tabbar:#1C1B21;
  --on-tabbar:#B9B6C0;
  --scrim:rgba(28,27,33,.42);
  --theme-color:#F4F2ED;
  --r-card:24px;
  --r-row:18px;
  --r-ctl:14px;
  --r-tag:8px;
  --r-day:16px;
  --bw-block:0px;
  --fw-title:700;
  --fw-display:700;
  --fs-display:30px;
  --fs-ev:15.5px;
  --fw-ev:600;
  --shadow-card:0 1px 2px rgba(28,27,33,.05);
  --cat-green:#1F8A5B;
  --cat-green-soft:#E2F0EA;
  --cat-green-ink:#1B7A4F;
  --cat-violet:#6A4FD8;
  --cat-violet-soft:#ECE8FA;
  --cat-violet-ink:#6A4FD8;
  --cat-orange:#C85A1E;
  --cat-orange-soft:#F8EAE2;
  --cat-orange-ink:#B04E18;
  --cat-teal:#0F7C86;
  --cat-teal-soft:#E0EEEF;
  --cat-teal-ink:#0E747C;
  --cat-rose:#C2415A;
  --cat-rose-soft:#F7E6EA;
  --cat-rose-ink:#B83C53;
  --cat-amber:#A86E00;
  --cat-amber-soft:#F4ECDE;
  --cat-amber-ink:#8F5F00;
  --accent:#2B62E3;
  --on-accent:#FFFFFF;
  --accent-soft:#E6ECFC;
  --accent-ink:#1D57DC;
  --focus:#2B62E3;
}
[data-theme="ink"]{
  color-scheme:dark;
  --bg:#0D0D0D;
  --surface:#171717;
  --surface-2:#222222;
  --line:#2E2E2E;
  --line-strong:#6F6A62;
  --text:#F3EFE6;
  --text-2:#BDB7AA;
  --text-muted:#8F897E;
  --text-faint:#6F6A62;
  --now:#D8FF3E;
  --on-now:#0D0D0D;
  --danger:#FF6B5E;
  --tabbar:#000000;
  --on-tabbar:#BDB7AA;
  --scrim:rgba(0,0,0,.6);
  --theme-color:#0D0D0D;
  --r-card:0px;
  --r-row:0px;
  --r-ctl:0px;
  --r-tag:0px;
  --r-day:0px;
  --bw-block:2px;
  --fw-title:900;
  --fw-display:900;
  --fs-display:104px;
  --fs-ev:24px;
  --fw-ev:900;
  --shadow-card:none;
  --cat-green:#4FD08F;
  --cat-green-soft:#21382D;
  --cat-green-ink:#4FD08F;
  --cat-violet:#A897FF;
  --cat-violet-soft:#312E41;
  --cat-violet-ink:#A897FF;
  --cat-orange:#FF9A5C;
  --cat-orange-soft:#412F23;
  --cat-orange-ink:#FF9A5C;
  --cat-teal:#4CC9D3;
  --cat-teal-soft:#213739;
  --cat-teal-ink:#4CC9D3;
  --cat-rose:#FF8AA0;
  --cat-rose-soft:#412C30;
  --cat-rose-ink:#FF8AA0;
  --cat-amber:#F2C14E;
  --cat-amber-soft:#3E3621;
  --cat-amber-ink:#F2C14E;
  --accent:#4D8DFF;
  --on-accent:#0D0D0D;
  --accent-soft:#222F45;
  --accent-ink:#6B9FFF;
  --focus:#4D8DFF;
}
[data-theme="slate"]{
  color-scheme:dark;
  --bg:#12161D;
  --surface:#1A2029;
  --surface-2:#232A35;
  --line:#2D3542;
  --line-strong:#5F6B7D;
  --text:#E7EBF2;
  --text-2:#B4BDCB;
  --text-muted:#8A94A5;
  --text-faint:#5F6B7D;
  --now:#FFB547;
  --on-now:#12161D;
  --danger:#FF7B72;
  --tabbar:#0B0E13;
  --on-tabbar:#B4BDCB;
  --scrim:rgba(0,0,0,.55);
  --theme-color:#12161D;
  --r-card:22px;
  --r-row:16px;
  --r-ctl:14px;
  --r-tag:8px;
  --r-day:14px;
  --bw-block:0px;
  --fw-title:700;
  --fw-display:700;
  --fs-display:30px;
  --fs-ev:15.5px;
  --fw-ev:600;
  --shadow-card:none;
  --cat-green:#4FD08F;
  --cat-green-soft:#24403B;
  --cat-green-ink:#4FD08F;
  --cat-violet:#A897FF;
  --cat-violet-soft:#343550;
  --cat-violet-ink:#A897FF;
  --cat-orange:#FF9A5C;
  --cat-orange-soft:#433632;
  --cat-orange-ink:#FF9A5C;
  --cat-teal:#4CC9D3;
  --cat-teal-soft:#233E48;
  --cat-teal-ink:#4CC9D3;
  --cat-rose:#FF8AA0;
  --cat-rose-soft:#43333E;
  --cat-rose-ink:#FF8AA0;
  --cat-amber:#F2C14E;
  --cat-amber-soft:#413D30;
  --cat-amber-ink:#F2C14E;
  --accent:#4D8DFF;
  --on-accent:#12161D;
  --accent-soft:#243654;
  --accent-ink:#7AA8FF;
  --focus:#4D8DFF;
}

/* ---- 메인색(콘셉트마다 대비 보정값) ---- */
[data-theme="paper"][data-accent="blue"],[data-theme="system"][data-accent="blue"],:root:not([data-theme])[data-accent="blue"]{
  --accent:#2B62E3;
  --on-accent:#FFFFFF;
  --accent-soft:#E6ECFC;
  --accent-ink:#1D57DC;
  --focus:#2B62E3;
}
[data-theme="paper"][data-accent="indigo"],[data-theme="system"][data-accent="indigo"],:root:not([data-theme])[data-accent="indigo"]{
  --accent:#4F46E5;
  --on-accent:#FFFFFF;
  --accent-soft:#EAE9FC;
  --accent-ink:#4F46E5;
  --focus:#4F46E5;
}
[data-theme="paper"][data-accent="teal"],[data-theme="system"][data-accent="teal"],:root:not([data-theme])[data-accent="teal"]{
  --accent:#0E7C7B;
  --on-accent:#FFFFFF;
  --accent-soft:#E2EFEF;
  --accent-ink:#0C6D6C;
  --focus:#0E7C7B;
}
[data-theme="paper"][data-accent="coral"],[data-theme="system"][data-accent="coral"],:root:not([data-theme])[data-accent="coral"]{
  --accent:#CA4C1D;
  --on-accent:#FFFFFF;
  --accent-soft:#F9EAE4;
  --accent-ink:#AC3E16;
  --focus:#CA4C1D;
}
[data-theme="paper"][data-accent="rose"],[data-theme="system"][data-accent="rose"],:root:not([data-theme])[data-accent="rose"]{
  --accent:#C8365C;
  --on-accent:#FFFFFF;
  --accent-soft:#F8E7EB;
  --accent-ink:#B43152;
  --focus:#C8365C;
}
[data-theme="paper"][data-accent="graphite"],[data-theme="system"][data-accent="graphite"],:root:not([data-theme])[data-accent="graphite"]{
  --accent:#2E2D33;
  --on-accent:#FFFFFF;
  --accent-soft:#E6E6E7;
  --accent-ink:#2E2D33;
  --focus:#2E2D33;
}
[data-theme="ink"][data-accent="blue"]{
  --accent:#4D8DFF;
  --on-accent:#0D0D0D;
  --accent-soft:#222F45;
  --accent-ink:#6B9FFF;
  --focus:#4D8DFF;
}
[data-theme="ink"][data-accent="indigo"]{
  --accent:#9C96FF;
  --on-accent:#0D0D0D;
  --accent-soft:#323045;
  --accent-ink:#A19BFF;
  --focus:#9C96FF;
}
[data-theme="ink"][data-accent="teal"]{
  --accent:#3CC8BF;
  --on-accent:#0D0D0D;
  --accent-soft:#1E3A39;
  --accent-ink:#3CC8BF;
  --focus:#3CC8BF;
}
[data-theme="ink"][data-accent="coral"]{
  --accent:#FF6A33;
  --on-accent:#0D0D0D;
  --accent-soft:#45281D;
  --accent-ink:#FF7642;
  --focus:#FF6A33;
}
[data-theme="ink"][data-accent="rose"]{
  --accent:#FF7A9C;
  --on-accent:#0D0D0D;
  --accent-soft:#452B32;
  --accent-ink:#FF7A9C;
  --focus:#FF7A9C;
}
[data-theme="ink"][data-accent="graphite"]{
  --accent:#E8E4DA;
  --on-accent:#0D0D0D;
  --accent-soft:#41403E;
  --accent-ink:#E8E4DA;
  --focus:#E8E4DA;
}
[data-theme="slate"][data-accent="blue"]{
  --accent:#4D8DFF;
  --on-accent:#12161D;
  --accent-soft:#243654;
  --accent-ink:#7AA8FF;
  --focus:#4D8DFF;
}
[data-theme="slate"][data-accent="indigo"]{
  --accent:#9C96FF;
  --on-accent:#12161D;
  --accent-soft:#343854;
  --accent-ink:#ABA5FF;
  --focus:#9C96FF;
}
[data-theme="slate"][data-accent="teal"]{
  --accent:#3CC8BF;
  --on-accent:#12161D;
  --accent-soft:#214247;
  --accent-ink:#3CC8BF;
  --focus:#3CC8BF;
}
[data-theme="slate"][data-accent="coral"]{
  --accent:#FF6A33;
  --on-accent:#12161D;
  --accent-soft:#482F2B;
  --accent-ink:#FF8656;
  --focus:#FF6A33;
}
[data-theme="slate"][data-accent="rose"]{
  --accent:#FF7A9C;
  --on-accent:#12161D;
  --accent-soft:#483240;
  --accent-ink:#FF84A4;
  --focus:#FF7A9C;
}
[data-theme="slate"][data-accent="graphite"]{
  --accent:#E8E4DA;
  --on-accent:#12161D;
  --accent-soft:#43474C;
  --accent-ink:#E8E4DA;
  --focus:#E8E4DA;
}

/* ---- 시스템 설정 따르기: 다크일 때 ink ---- */
@media (prefers-color-scheme: dark){
  [data-theme="system"]{
    color-scheme:dark;
    --bg:#0D0D0D;
    --surface:#171717;
    --surface-2:#222222;
    --line:#2E2E2E;
    --line-strong:#6F6A62;
    --text:#F3EFE6;
    --text-2:#BDB7AA;
    --text-muted:#8F897E;
    --text-faint:#6F6A62;
    --now:#D8FF3E;
    --on-now:#0D0D0D;
    --danger:#FF6B5E;
    --tabbar:#000000;
    --on-tabbar:#BDB7AA;
    --scrim:rgba(0,0,0,.6);
    --theme-color:#0D0D0D;
    --r-card:0px;
    --r-row:0px;
    --r-ctl:0px;
    --r-tag:0px;
    --r-day:0px;
    --bw-block:2px;
    --fw-title:900;
    --fw-display:900;
    --fs-display:104px;
    --fs-ev:24px;
    --fw-ev:900;
    --shadow-card:none;
    --cat-green:#4FD08F;
    --cat-green-soft:#21382D;
    --cat-green-ink:#4FD08F;
    --cat-violet:#A897FF;
    --cat-violet-soft:#312E41;
    --cat-violet-ink:#A897FF;
    --cat-orange:#FF9A5C;
    --cat-orange-soft:#412F23;
    --cat-orange-ink:#FF9A5C;
    --cat-teal:#4CC9D3;
    --cat-teal-soft:#213739;
    --cat-teal-ink:#4CC9D3;
    --cat-rose:#FF8AA0;
    --cat-rose-soft:#412C30;
    --cat-rose-ink:#FF8AA0;
    --cat-amber:#F2C14E;
    --cat-amber-soft:#3E3621;
    --cat-amber-ink:#F2C14E;
    --accent:#4D8DFF;
    --on-accent:#0D0D0D;
    --accent-soft:#222F45;
    --accent-ink:#6B9FFF;
    --focus:#4D8DFF;
}
  [data-theme="system"][data-accent="blue"]{
    --accent:#4D8DFF;
    --on-accent:#0D0D0D;
    --accent-soft:#222F45;
    --accent-ink:#6B9FFF;
    --focus:#4D8DFF;
}
  [data-theme="system"][data-accent="indigo"]{
    --accent:#9C96FF;
    --on-accent:#0D0D0D;
    --accent-soft:#323045;
    --accent-ink:#A19BFF;
    --focus:#9C96FF;
}
  [data-theme="system"][data-accent="teal"]{
    --accent:#3CC8BF;
    --on-accent:#0D0D0D;
    --accent-soft:#1E3A39;
    --accent-ink:#3CC8BF;
    --focus:#3CC8BF;
}
  [data-theme="system"][data-accent="coral"]{
    --accent:#FF6A33;
    --on-accent:#0D0D0D;
    --accent-soft:#45281D;
    --accent-ink:#FF7642;
    --focus:#FF6A33;
}
  [data-theme="system"][data-accent="rose"]{
    --accent:#FF7A9C;
    --on-accent:#0D0D0D;
    --accent-soft:#452B32;
    --accent-ink:#FF7A9C;
    --focus:#FF7A9C;
}
  [data-theme="system"][data-accent="graphite"]{
    --accent:#E8E4DA;
    --on-accent:#0D0D0D;
    --accent-soft:#41403E;
    --accent-ink:#E8E4DA;
    --focus:#E8E4DA;
}
}

/* ---- 공통 파생 ---- */
:root{--accent-softer:color-mix(in srgb,var(--accent-soft) 55%,var(--surface));--ring:0 0 0 2px var(--bg),0 0 0 4px var(--focus)}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
html{background:var(--bg);color:var(--text)}
.theme-switching,.theme-switching *{transition:none!important}

/* ---- 기존 app.css 변수 호환 별칭 (단계적 이전용, 이전 완료 후 삭제) ---- */
:root,[data-theme]{
  --card:var(--surface);--fill:var(--surface-2);--line-2:var(--line-strong);
  --ink:var(--text);--ink-2:var(--text-2);--ink-3:var(--text-muted);--ink-4:var(--text-faint);
  --pri:var(--accent);--pri-ink:var(--accent-ink);--pri-soft:var(--accent-soft);--pri-softer:var(--accent-softer);
  --deep:var(--accent);--deep-2:var(--accent-ink);--deep-ink:var(--on-accent);
  --green:var(--cat-green);--green-ink:var(--cat-green-ink);--green-soft:var(--cat-green-soft);
  --violet:var(--cat-violet-ink);--violet-soft:var(--cat-violet-soft);
  --orange:var(--cat-orange);--orange-ink:var(--cat-orange-ink);--orange-soft:var(--cat-orange-soft);
  --blue:var(--cat-teal);--blue-ink:var(--cat-teal-ink);--blue-soft:var(--cat-teal-soft);
  --rose:var(--cat-rose-ink);--rose-ink:var(--cat-rose-ink);--rose-soft:var(--cat-rose-soft);
  --amber:var(--cat-amber);--amber-ink:var(--cat-amber-ink);--amber-soft:var(--cat-amber-soft);
  --shadow:var(--shadow-card);
}