/* 춘몽 design_system — foundation 토큰 (design-spec §9).
   design-tokens.json 절단 178 토큰(색 70·타이포 49·간격 34·radius 14·그림자 11)을
   :root custom property로 재작성(직수입 아님). + 신규 등록 토큰(모션·프레임·영상 오버레이·veil·글래스 카드 그림자).
   값 리터럴은 여기서만 정의하고 소비는 var()로만 한다. */

@import url("./app_color.5bd268a75f9d.css");
@import url("./app_spacing.f3c715784004.css");
@import url("./app_typography.b2b80ef1dbf1.css");
@import url("./app_asset.de01c69785a4.css");

:root {
  /* ── colors (70) ───────────────────────────────────────────── */
  --accent: #D0727A;
  --accent-hover: #B95A64;
  --accent-press: #98444E;
  --accent-soft: #FAE6E6;
  --accent-soft-hover: #F4CFD0;
  /* §0.5 (G)·개정 13 — v5 재수집 값 반영(색 primitive 유지 · 퍼센트·mist blob 지오메트리만 조정):
     blossom 52→38 · gold 40→22 · mist 위치 98% 70% at 92% 102%→128% 88% at 80% 104%·46→58·transparent 62→66 · rose 32→22. */
  --bg-app: radial-gradient(122% 84% at 6% -8%, rgba(226,128,138,.38) 0%, rgba(226,128,138,0) 58%),radial-gradient(104% 72% at 98% -4%, rgba(208,166,92,.22) 0%, rgba(208,166,92,0) 56%),radial-gradient(128% 88% at 80% 104%, rgba(112,142,178,.58) 0%, rgba(112,142,178,0) 66%),radial-gradient(86% 58% at 2% 98%, rgba(178,76,92,.22) 0%, rgba(178,76,92,0) 60%),radial-gradient(64% 44% at 48% 44%, rgba(255,252,246,.92) 0%, rgba(255,252,246,0) 74%),linear-gradient(168deg,#FCF8F1 0%,#F1E8DD 54%,#E5DCD5 100%);
  --bg-app-night: radial-gradient(120% 76% at 10% -6%, rgba(178,72,86,.72) 0%, rgba(178,72,86,0) 56%),radial-gradient(100% 68% at 96% 4%, rgba(86,116,152,.66) 0%, rgba(86,116,152,0) 58%),radial-gradient(80% 54% at 84% 104%, rgba(190,159,98,.42) 0%, rgba(190,159,98,0) 60%),linear-gradient(168deg,#2A2520 0%,#1B1815 56%,#121010 100%);
  --bg-veil: linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.72) 62%,#F6F1E8 100%);
  --blossom-50: #FDF4F4;
  --blossom-100: #FAE6E6;
  --blossom-200: #F4CFD0;
  --blossom-300: #EBB0B2;
  --blossom-400: #DF9095;
  --blossom-500: #D0727A;
  --blossom-600: #B95A64;
  --blossom-700: #98444E;
  --blossom-800: #75333B;
  --blossom-900: #52242A;
  --border-accent: rgba(208,114,122,.45);
  --border-hairline: rgba(31,28,24,.10);
  --border-faint: color-mix(in srgb, var(--ink-900) 8%, transparent); /* 관계인 상세 원본 tokens/colors.css:99 */
  --border-strong: rgba(31,28,24,.18);
  --danger: #A93A32;
  --glass-sheen: linear-gradient(148deg,rgba(255,255,255,.78) 0%,rgba(255,255,255,.34) 14%,rgba(255,255,255,.06) 32%,rgba(255,255,255,0) 54%,rgba(255,255,255,0) 82%,rgba(255,255,255,.22) 100%);
  --glass-tint: rgba(255,253,249,.34);
  --glass-tint-accent: rgba(208,114,122,.20);
  --glass-tint-bar: rgba(253,250,244,.42);
  --glass-tint-dim: rgba(255,253,249,.18);
  --glass-tint-ink: rgba(28,24,21,.38);
  --glass-tint-press: color-mix(in srgb, var(--surface-solid) 86%, transparent); /* DS tokens/glass.css:18 --paper-50(#FFFDF9) 86%; web --surface-solid과 동색 */
  --glass-tint-strong: rgba(255,253,249,.52);
  --gold-300: #E3D0A6;
  --gold-400: #D3B87F;
  --gold-500: #BE9F62;
  --gold-600: #9A7E46;
  --gold: var(--gold-500); /* 14:55 _ds tokens/colors.css:64 */
  --info: #6C8298;
  --ink-50: #F7F3EB;
  --ink-100: #EDE7DC;
  --ink-200: #DED7CB;
  --ink-300: #C4BCB0;
  --ink-400: #A29A8E;
  --ink-500: #7C746A;
  --ink-600: #5C554C;
  --ink-700: #423D36;
  --ink-800: #2E2A25;
  --ink-900: #1F1C18;
  --ink-950: #14120F;
  --jade-400: #6BA487;
  --jade-500: #4F8A6C;
  --jade-600: #3B6C53;
  --mist-300: #B6C0CB;
  --mist-500: #6C8298;
  --mist-700: #48586A;
  --paper-100: #FBF8F2;
  --paper-50: #FFFDF9; /* 14:55 _ds tokens/colors.css:35 */
  --paper-200: #F6F1E8;
  --paper-300: #EFE9DE;
  --paper-400: #E6DFD2;
  --scrim: rgba(31,28,24,.30);
  --seal-400: #C24C42;
  --seal-500: #A93A32;
  --seal-600: #8C2D27;
  --solid: #2E2A25;
  --solid-hover: #1F1C18;
  --solid-press: #14120F;
  --success: #4F8A6C;
  --success-soft: color-mix(in srgb,var(--jade-500) 14%,transparent); /* 원본 DS tokens/colors.css:82 · chart soft badge jade */
  --surface-hover: rgba(31,28,24,.04);
  --surface-page: #F6F1E8;
  --surface-press: rgba(31,28,24,.08);
  --surface-selected: rgba(208,114,122,.12);
  --surface-solid: #FFFDF9;
  --surface-sunken: rgba(31,28,24,.045);
  --warning: #BE9F62;

  /* ── typography (49) ───────────────────────────────────────── */
  --font-sans: "Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;
  --font-serif: "Gowun Batang","Nanum Myeongjo","Apple SD Gothic Neo",serif;
  --font-mono: ui-monospace,SFMono-Regular,"SF Mono",Menlo,monospace;
  --font-icon: "lucide";
  --fs-micro: 11px;
  --fs-caption: 13px;
  --fs-label: 14px;
  --fs-body-sm: 15px;
  --fs-body: 16px;
  --fs-title-3: 17px;
  --fs-title-2: 20px;
  --fs-title-1: 22px;
  --fs-display-2: 28px;
  --fs-display-1: 34px;
  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --lh-tight: 1.2;
  --lh-display: 1.24;
  --lh-title: 1.34;
  --lh-body: 1.58;
  --ls-caption: 0;
  --ls-body: -0.01em;
  --ls-title: -0.02em;
  --ls-display: -0.03em;
  --ls-wide: 0.14em;
  --text-primary: #1F1C18;
  --text-secondary: #5C554C;
  --text-tertiary: #A29A8E;
  --text-placeholder: #A29A8E;
  --text-inverse: #FFFDF9;  /* = DS --text-inverse: var(--paper-50) (colors.css 권위값) */
  --text-link: #B95A64;
  --text-accent: #B95A64;
  --text-gold: #9A7E46;
  --text-info: var(--mist-700); /* 14:55 _ds tokens/colors.css:48 */
  --text-danger: #A93A32;
  --text-success: #3B6C53;
  --type-micro: 500 11px/1.3 "Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;
  --type-caption: 400 13px/1.45 "Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;
  --type-label: 500 14px/1.4 "Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;
  --type-body-sm: 400 15px/1.58 "Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;
  --type-body: 400 16px/1.58 "Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;
  --type-title-3: 600 17px/1.34 "Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;
  --type-title-2: 600 20px/1.34 "Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;
  --type-title-1: 600 22px/1.34 "Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;
  --type-quote: 400 20px/1.7 "Gowun Batang","Nanum Myeongjo","Apple SD Gothic Neo",serif;
  --type-display-2: 400 28px/1.24 "Gowun Batang","Nanum Myeongjo","Apple SD Gothic Neo",serif;
  --type-display-1: 400 34px/1.24 "Gowun Batang","Nanum Myeongjo","Apple SD Gothic Neo",serif;

  /* ── spacing (34) ──────────────────────────────────────────── */
  --space-0: 0px;
  --space-1: 2px;
  --space-2: 4px;
  --space-3: 6px;
  --space-4: 8px;
  --space-5: 12px;
  --space-6: 16px;
  --space-7: 20px;
  --space-8: 24px;
  --space-9: 32px;
  --space-10: 40px;
  --space-11: 48px;
  --space-12: 64px;
  --space-13: 80px;
  --stack-tight: 8px;
  --stack: 12px;
  --stack-loose: 20px;
  --inline: 8px;
  --gutter: 20px;
  --section: 32px;
  --card-pad: 20px;
  --sheet-pad: 24px;
  --content-max: 350px;
  --touch-min: 44px;
  --icon-size-sm: 16px;
  --icon-size: 20px;
  --icon-size-lg: 24px;
  --icon-size-xl: 32px;
  --appbar-h: 56px;
  --tabbar-h: 58px;
  --safe-top: 44px;
  --safe-bottom: 34px;
  --app-width: 390px;
  --app-height: 844px;
  --chat-detail-home-height: 22px; /* 점쟁이 상세.dc.html AppFrame: 844 - 44 - 778 */
  --chat-detail-home-width: 108px;
  --glass-button-sm-height: 36px; /* 사용자 정보 화면 원본 DS _ds_bundle.js:475-483 Button(glass,sm) */

  /* ── borderRadius (14) ─────────────────────────────────────── */
  --radius-xs: 8px;
  --radius-sm: 12px;
  --radius-md: 16px;
  --radius-lg: 22px;
  --radius-xl: 28px;
  --radius-2xl: 34px;
  --radius-3xl: 44px;
  --radius-pill: 999px;
  --radius-field: 18px;
  --radius-button: 26px;
  --radius-card: 26px;
  --radius-panel: 34px;
  --radius-sheet: 34px 34px 0 0;
  --app-radius: 44px;

  /* ── shadows (11) ──────────────────────────────────────────── */
  --shadow-0: none;
  --shadow-1: 0 1px 2px rgba(31,28,24,.06), 0 3px 10px rgba(31,28,24,.06);
  --shadow-2: 0 2px 6px rgba(31,28,24,.07), 0 10px 28px rgba(31,28,24,.10);
  --shadow-3: 0 4px 12px rgba(31,28,24,.08), 0 22px 50px rgba(31,28,24,.14);
  --shadow-4: 0 8px 24px rgba(31,28,24,.10), 0 38px 80px rgba(31,28,24,.18);
  --shadow-accent: 0 6px 18px color-mix(in srgb, var(--blossom-600) 30%, transparent);  /* = DS glass.css 권위값(blossom-600 30%) */
  --shadow-danger: 0 6px 18px color-mix(in srgb, var(--seal-500) 26%, transparent);  /* DS glass.css:86 */
  --shadow-solid: 0 6px 18px rgba(31,28,24,.24);
  --shadow-inset-press: inset 0 2px 6px rgba(31,28,24,.14);
  --focus-ring: 0 0 0 3px rgba(208,114,122,.30);
  --glass-edge: inset 0 1.5px 0 rgba(255,255,255,.95), inset 1.5px 0 0 rgba(255,255,255,.55), inset -1.5px 0 0 rgba(255,255,255,.32), inset 0 -1.5px 0 rgba(255,255,255,.45), inset 0 14px 26px -20px rgba(255,255,255,.95), inset 0 -14px 26px -18px rgba(31,28,24,.30);
  --glass-edge-sm: inset 0 1px 0 rgba(255,255,255,.92), inset 0 -1px 0 rgba(255,255,255,.4), inset 0 -8px 14px -10px rgba(31,28,24,.22);

  /* ── 신규: 모션 값 토큰 (design-spec §9 · DS tokens/motion.css 비영값) ── */
  --dur-instant: 90ms;
  --dur-fast: 150ms;
  --dur-base: 240ms;
  --dur-slow: 420ms;
  --dur-sheet: 520ms;
  --ease-glass: cubic-bezier(.32,.72,0,1);
  --ease-out: cubic-bezier(.22,.85,.24,1);
  --ease-in-out: cubic-bezier(.5,0,.2,1);
  --ease-soft-spring: cubic-bezier(.34,1.4,.64,1);
  --press-scale: .972;
  --transition-glass: transform var(--dur-base) var(--ease-glass), opacity var(--dur-base) var(--ease-out);
  --transition-control: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out);

  /* ── 신규: 엔트런스 duration (풀 밖 원본 — dc-local cm-rise .5s / 단계 진입 cm-rise .34s) ── */
  --dur-rise: 500ms;
  --dur-step: 340ms;

  /* ── 신규: 앱셸 프레임 치수 (발주 §1-3 explicit_frame 480×768 · DS 390×844와 별개·D15) ── */
  --app-frame-w: 480px;
  --app-frame-h: 768px;

  /* ── veil 강도 (배경 영상 위 veil opacity · background_media veil 소비 · design-spec §7 m3) ── */
  --veil-strength: 0.18;

  /* ── 신규: 영상 위 종이빛 그라디언트 오버레이 (dc 126/239 verbatim · 가입/비번찾기 화면 소유 · D36·§9.1) ── */
  --overlay-paper-fade: linear-gradient(to bottom, rgba(255,253,249,.22) 0%, rgba(255,253,249,0) 24%, rgba(255,253,249,.08) 56%, rgba(255,253,249,.26) 100%);

  /* ── 신규: 하단 글래스 카드 부양 그림자 (dc 140/253 box-shadow 첫 파트 verbatim · 하단→위 -14px · D44·§9.1) ── */
  --shadow-card-lift: 0 -14px 48px rgba(31,28,24,.18);

  /* ── 신규: 앱셸 프레임 그림자 (로그인.dc.html:36 데스크톱 부양 카드 · 풀 밖 원본) ── */
  --shadow-app-frame: 0 34px 90px rgba(31,28,24,.24), 0 2px 0 rgba(255,255,255,.5) inset;

  /* ── 신규: 글래스 머티리얼 토큰 (@kind other · 178 절단 제외 · 풀 밖 원본 · 출처 tokens/glass.css) ──
     GlassPanel의 backdrop blur·흰 테두리 — liquid-glass 렌더 충실도. 값 verbatim(glass.css L4·6·7·19). */
  --glass-blur: 30px;
  --glass-saturate: 200%;
  --glass-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate)) brightness(1.06);
  --glass-blur-lg: 52px;                                                           /* glass.css L5 verbatim · 하단 글래스 카드 backdrop(D44·§9.1) */
  --glass-filter-lg: blur(var(--glass-blur-lg)) saturate(210%) brightness(1.08);   /* glass.css L9 verbatim · 하단 글래스 카드(dc 140/253) */
  --glass-border: 1px solid rgba(255,255,255,.72);
  --glass-rim-dim: rgba(255,255,255,.5); /* 14:55 SegmentedControl · _ds tokens/glass.css:43 */
  --shadow-inset-track: inset 0 1px 2px color-mix(in srgb,var(--ink-900) 8%,transparent); /* _ds glass.css:88 */
  --ink-fill: var(--ink-500); /* 14:55 Button intent=detail · _ds colors.css:71-74 */
  --ink-fill-hover: var(--ink-600);
  --ink-fill-press: var(--ink-700);
  --shadow-ink-fill: 0 6px 18px color-mix(in srgb,var(--ink-600) 22%,transparent);
  --segmented-choice-inset: 4px; /* _ds_bundle.js:3240-3290 pill variant */
  --segmented-choice-gap: 2px;
  --segmented-choice-option-height: 38px;
  --spinner-size-md: 22px; /* _ds_bundle.js:1308-1341 */
  --spinner-size-lg: 28px;
  --spinner-border-md: 2px;
  --spinner-border-lg: 3px;
  --spinner-spin-duration: 720ms;
  --button-loading-spin-duration: 700ms; /* _ds_bundle.js:574-590 */
  --button-loading-opacity: .8;
  --button-loading-size-sm: 15px;
  --button-loading-size-md: 18px;
  --button-loading-size-lg: 20px;

  /* ── 신규: 사용자 정보 입력 폼 컨트롤 토큰 (design-spec §13.4 신규-등록 N · DS tokens/glass.css · design-tokens.json 값) ──
     필드/시트 표면 틴트 3(색) + 필드 dome/flat·시트/토스트 그림자 4(그림자). 값은 design-tokens.json verbatim
     (color-mix 원형 유지 · paper-50=#FFFDF9 · ink-900=#1F1C18 · jade-600=#3B6C53). 출처 glass.css L17·27·28·30·34·80·83. */
  --glass-tint-sheet: color-mix(in srgb, #FFFDF9 62%, transparent);  /* tok/glass.css:17 (paper-50 62%) · BottomSheet 판 ds:1073 · Dialog 판 ds:1153 */
  --glass-tint-mist: color-mix(in srgb,var(--mist-500) 18%,transparent); /* 원본 tokens/glass.css:25 · chart 가림 GlassPanel */
  --glass-border-mist: 1px solid color-mix(in srgb,var(--mist-500) 32%,transparent); /* 원본 tokens/glass.css:49 */
  --surface-field: color-mix(in srgb, #FFFDF9 72%, transparent);
  --surface-field-focus: color-mix(in srgb, #FFFDF9 90%, transparent);
  --field-dome:
    inset 0 1px 0 rgba(255,255,255,.92),
    inset 0 11px 16px -11px rgba(255,255,255,.98),
    inset 0 -11px 16px -11px color-mix(in srgb, #1F1C18 26%, transparent);
  --field-flat:
    inset 0 1px 0 rgba(255,255,255,.62),
    inset 0 0 0 rgba(255,255,255,0),
    inset 0 -1px 0 color-mix(in srgb, #1F1C18 6%, transparent);
  --shadow-sheet: 0 -12px 48px color-mix(in srgb, #1F1C18 20%, transparent);
  --shadow-success: 0 6px 18px color-mix(in srgb, #3B6C53 28%, transparent);

  /* ── 신규(풀 밖 · 230 절단 제외 · @kind other): 시트 scrim blur (design-spec §13.4 · DS glass.css:93 verbatim) ── */
  --scrim-blur: blur(14px) saturate(140%);  /* tok/glass.css:94 · BottomSheet 스크림 ds:1062-1063 · Dialog 스크림 ds:1141-1142 */

  /* ── v6 additive(풀 밖 · 230 절단 제외 · z-index 축): 커스텀 드롭다운 메뉴 stacking (design-spec §0.5 V6-6·§9.1 · DS tokens/layout.css 값 verbatim) ── */
  --z-menu: 35;  /* bundle Dropdown.jsx open menu z-index:var(--z-menu) — surface-field 팝오버가 프레임 내 상단 */
  --z-toast: 50; /* 원본 tokens/layout.css:22 · 만세력 Toast */
  --z-modal: 60; /* 원본 tokens/layout.css:23 · LoadingOverlay.jsx:16 */
  --z-sheet: 40; /* 원본 tokens/layout.css:21 · chart 저장 BottomSheet */
  --duration-chart-fade: .28s; /* 원본 만세력 화면.dc.html:68-71 · cm-fade */
  --chart-save-sheet-max-height: 82%; /* 원본 BottomSheet ds:1069 */
  --chart-save-sheet-padding: var(--space-5) var(--sheet-pad) calc(var(--safe-bottom) + var(--space-5)); /* ds:1072 */
  --chart-save-option-gap: 14px; /* 만세력 화면.dc.html:449 */
  --chart-save-option-icon-size: 19px; /* 만세력 화면.dc.html:451·462 */
  --chart-save-chevron-size: 18px; /* 만세력 화면.dc.html:457·465 */
  --chart-recalculate-icon-size: 15px; /* 원본 Button(sm) ds:479 */
  --chart-build-edit-icon-size: 15px; /* 원본 만세력.dc.html:141 Button(ghost,sm) · ds:479 */
  --chart-build-edit-border: 1px solid transparent; /* 원본 Button ghost · ds:399 */
  --chart-save-choice-title-line: 1.3; /* 만세력 화면.dc.html:454 */
  --chart-save-mask-icon-bg: color-mix(in srgb,var(--mist-500) 14%,transparent); /* 만세력 화면.dc.html:450 */
  --ds-badge-height-sm: 22px;            /* Badge.jsx size=sm:22 */
  --ds-badge-padding-sm: 0 8px;          /* Badge.jsx size=sm:8px 양쪽 */
  --ds-badge-gap-sm: 4px;                /* Badge.jsx size=sm:4 */
  --ds-badge-font-sm: var(--fw-medium) var(--fs-micro)/var(--lh-tight) var(--font-sans);
  /* 내비 슬롯과 형제인 1b 컴포저가 같은 예약 높이를 소비한다. */
  --home-nav-disc-normal: 34px;
  --home-nav-pad-normal: 9px;
  --home-nav-bottom-normal: calc(var(--safe-bottom) * .4 + 14px);
  --home-nav-border-width: 1px;
  --home-nav-slot-height: calc(var(--home-nav-disc-normal) + var(--home-nav-pad-normal) * 2 + var(--home-nav-border-width) * 2 + var(--home-nav-bottom-normal));
}

/* 감속 선호: 모션 duration 0 접힘 (DS tokens/motion.css 재현 · design-spec §9). */
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-instant: 0ms;
    --dur-fast: 0ms;
    --dur-base: 0ms;
    --dur-slow: 0ms;
    --dur-sheet: 0ms;
    --dur-rise: 0ms;
    --dur-step: 0ms;
    --press-scale: 1;
  }
}

/* 홈 한정 원본값 — 20260907-2249-home-bottom-nav design-ref의 하단 네비게이션 화면.
   배경과 프레임 inset을 같은 요소에 그린 뒤 장식 span을 겹친다. */
[data-home-background] {
  --bg-app: radial-gradient(122% 84% at 6% -8%, color-mix(in srgb,#DF9095 28%,transparent) 0%, transparent 58%),radial-gradient(104% 72% at 98% -4%, color-mix(in srgb,#D3B87F 40%,transparent) 0%, transparent 56%),radial-gradient(98% 70% at 92% 102%, color-mix(in srgb,#6C8298 46%,transparent) 0%, transparent 62%),radial-gradient(86% 58% at 2% 98%, color-mix(in srgb,#98444E 14%,transparent) 0%, transparent 60%),radial-gradient(64% 44% at 48% 44%, color-mix(in srgb,#FFFDF9 92%,transparent) 0%, transparent 74%),linear-gradient(168deg,#FBF8F2 0%,#EFE9DE 54%,#E6DFD2 100%);
  --home-frame-highlight: 0 2px 0 rgba(255,255,255,.5) inset;
  --home-disc-radius: 50%;
  --home-blob-blossom-size: 320px;
  --home-blob-blossom-top: 2%;
  --home-blob-blossom-left: -24%;
  --home-blob-blossom: radial-gradient(circle at 50% 50%, rgba(226,128,138,.42) 0%, rgba(255,255,255,0) 68%);
  --home-blob-gold-size: 340px;
  --home-blob-gold-top: 26%;
  --home-blob-gold-right: -26%;
  --home-blob-gold: radial-gradient(circle at 50% 50%, rgba(208,166,92,.30) 0%, rgba(255,255,255,0) 68%);
  --home-blob-mist-size: 330px;
  --home-blob-mist-bottom: -8%;
  --home-blob-mist-right: -22%;
  --home-blob-mist: radial-gradient(circle at 50% 50%, rgba(112,142,178,.34) 0%, rgba(255,255,255,0) 68%);
  --home-blob-rose-size: 300px;
  --home-blob-rose-bottom: 6%;
  --home-blob-rose-left: -22%;
  --home-blob-rose: radial-gradient(circle at 50% 50%, rgba(208,114,122,.28) 0%, rgba(255,255,255,0) 68%);
}

/* 네비게이션 바 원본 renderVals·nav 선언과 DS colors/glass/layout 값.
   슬롯 높이는 normal disc + padding + border + bottom의 합(D2)이다. */
[data-home-navigation] {
  --text-inverse: #FFFDF9;
  --shadow-accent: 0 6px 18px color-mix(in srgb,#B95A64 30%,transparent);
  --home-nav-disc-compact: 28px;
  --home-nav-pad-compact: 5px;
  --home-nav-bottom-compact: calc(var(--safe-bottom) * .4 + var(--space-4));
  --home-nav-border: 1px solid rgba(255,255,255,.62);
  --home-nav-highlight: inset 0 1px 0 rgba(255,255,255,.85);
  --home-disc-radius: 50%;
  --z-tabbar: 30;
}

/* 설정 동결 시안의 채택 토큰. 기존 전역·홈 토큰은 유지한다. */
:root {
  /* design-tokens.json: colors·typography·spacing·shadows의 채택값. */
  --settings-bg-app: radial-gradient(122% 84% at 6% -8%, color-mix(in srgb,#DF9095 28%,transparent) 0%, transparent 58%),radial-gradient(104% 72% at 98% -4%, color-mix(in srgb,#D3B87F 40%,transparent) 0%, transparent 56%),radial-gradient(98% 70% at 92% 102%, color-mix(in srgb,#6C8298 46%,transparent) 0%, transparent 62%),radial-gradient(86% 58% at 2% 98%, color-mix(in srgb,#98444E 14%,transparent) 0%, transparent 60%),radial-gradient(64% 44% at 48% 44%, color-mix(in srgb,#FFFDF9 92%,transparent) 0%, transparent 74%),linear-gradient(168deg,#FBF8F2 0%,#EFE9DE 54%,#E6DFD2 100%);
  --settings-blob-blossom: color-mix(in srgb,#DF9095 28%,transparent);
  --settings-blob-gold: color-mix(in srgb,#D3B87F 40%,transparent);
  --settings-blob-mist: color-mix(in srgb,#6C8298 46%,transparent);
  --settings-blob-rose: color-mix(in srgb,#98444E 14%,transparent);
  --settings-border-hairline: color-mix(in srgb,#1F1C18 10%,transparent);
  --settings-border-success: color-mix(in srgb,#4F8A6C 40%,transparent);
  --settings-focus-ring: 0 0 0 3px color-mix(in srgb,#D0727A 30%,transparent);
  --settings-glass-rim: rgba(255,255,255,.72);
  --settings-glass-tint: color-mix(in srgb,#FFFDF9 34%,transparent);
  --settings-glass-tint-press: color-mix(in srgb,#FFFDF9 86%,transparent);
  --settings-glass-tint-strong: color-mix(in srgb,#FFFDF9 52%,transparent);
  --settings-on-fill-border: 1px solid rgba(255,255,255,.26);
  --settings-on-fill-highlight: inset 0 1px 0 rgba(255,255,255,.22);
  --settings-scrim: color-mix(in srgb,#1F1C18 30%,transparent);
  --settings-surface-hover: color-mix(in srgb,#1F1C18 4%,transparent);
  --settings-surface-muted: color-mix(in srgb,#1F1C18 6%,transparent);
  --settings-surface-press: color-mix(in srgb,#1F1C18 8%,transparent);
  --settings-text-inverse: #FFFDF9;
  --settings-appbar-h: 52px;
  --settings-glass-edge: inset 0 1.5px 0 rgba(255,255,255,.95),
    inset 1.5px 0 0 rgba(255,255,255,.55),
    inset -1.5px 0 0 rgba(255,255,255,.32),
    inset 0 -1.5px 0 rgba(255,255,255,.45),
    inset 0 14px 26px -20px rgba(255,255,255,.95),
    inset 0 -14px 26px -18px color-mix(in srgb,#1F1C18 30%,transparent);
  --settings-glass-edge-sm: inset 0 1px 0 rgba(255,255,255,.92),
    inset 0 -1px 0 rgba(255,255,255,.4),
    inset 0 -8px 14px -10px color-mix(in srgb,#1F1C18 22%,transparent);
  --settings-shadow-1: 0 1px 2px color-mix(in srgb,#1F1C18 6%,transparent), 0 3px 10px color-mix(in srgb,#1F1C18 6%,transparent);
  --settings-shadow-2: 0 2px 6px color-mix(in srgb,#1F1C18 7%,transparent), 0 10px 28px color-mix(in srgb,#1F1C18 10%,transparent);
  --settings-shadow-4: 0 8px 24px color-mix(in srgb,#1F1C18 10%,transparent), 0 38px 80px color-mix(in srgb,#1F1C18 18%,transparent);
  --settings-shadow-accent: 0 6px 18px color-mix(in srgb,#B95A64 30%,transparent);
  --settings-shadow-inset-press: inset 0 2px 6px color-mix(in srgb,#1F1C18 14%,transparent);
  --settings-shadow-success: 0 6px 18px color-mix(in srgb,#3B6C53 28%,transparent);

  /* 설정 호출부·DS Avatar/ListRow/GlassPanel/Button/Dialog/AppFrame 정의의 풀 밖 값. */
  --settings-glass-filter-sm: blur(16px) saturate(180%) brightness(1.05);
  --settings-glass-border: 1px solid var(--settings-glass-rim);
  --settings-border-width: 1px;
  --settings-transparent-border: 1px solid transparent;
  --settings-radius-circle: 50%;
  --settings-icon-inline-size: 18px;
  --settings-row-icon-size: 36px;
  --settings-row-min-height: calc(var(--touch-min) + var(--space-6));
  --settings-row-border: 1px solid var(--settings-border-hairline);
  --settings-content-bottom-pad: calc(var(--tabbar-h) + 28px);
  --settings-appbar-fill: color-mix(in srgb,var(--success) 40%,transparent);
  --settings-appbar-border: 1px solid var(--settings-border-success);
  --settings-appbar-shadow: var(--settings-shadow-success), var(--settings-glass-edge-sm);
  --settings-appbar-z: 20;
  --settings-panel-shadow: var(--settings-shadow-2), var(--settings-glass-edge);
  --settings-dialog-shadow: var(--settings-shadow-4), var(--settings-glass-edge);
  --settings-dialog-max-width: 320px;
  --settings-dialog-icon-size: 52px;
  --settings-dialog-icon-margin: 14px;
  --settings-dialog-z: 60;
  --settings-button-md-padding: 22px;
  --settings-button-sm-height: 36px;
  --settings-button-md-font: var(--fw-semibold) var(--fs-body-sm)/1 var(--font-sans);
  --settings-button-sm-font: var(--fw-semibold) var(--fs-caption)/1 var(--font-sans);
  --settings-button-disabled-opacity: .42;
  --settings-primary-shadow: var(--settings-shadow-accent), var(--settings-on-fill-highlight);
  --settings-blob-blossom-top: 3%;
  --settings-blob-blossom-left: -26%;
  --settings-blob-blossom-size: 320px;
  --settings-blob-gold-top: 27%;
  --settings-blob-gold-right: -30%;
  --settings-blob-gold-size: 340px;
  --settings-blob-mist-top: 57%;
  --settings-blob-mist-left: -20%;
  --settings-blob-mist-size: 300px;
  --settings-blob-rose-top: 83%;
  --settings-blob-rose-right: -22%;
  --settings-blob-rose-size: 320px;
  --settings-blob-blossom-fill: radial-gradient(circle at 50% 50%, var(--settings-blob-blossom) 0%, transparent 68%);
  --settings-blob-gold-fill: radial-gradient(circle at 50% 50%, var(--settings-blob-gold) 0%, transparent 68%);
  --settings-blob-mist-fill: radial-gradient(circle at 50% 50%, var(--settings-blob-mist) 0%, transparent 68%);
  --settings-blob-rose-fill: radial-gradient(circle at 50% 50%, var(--settings-blob-rose) 0%, transparent 68%);
  --settings-profile-lock-inset: 10px;  /* 설정.dc.html:57 본명 자물쇠 padding-right */
  --settings-info-soft: color-mix(in srgb,#6C8298 16%,transparent);  /* colors.css:68 info-soft 풀 값 */
  --settings-toast-bottom: calc(var(--tabbar-h) + 18px);  /* ds:1420 Toast floating bottom */
  --settings-toast-z: 1;  /* 콘텐츠 < 토스트 < 내비 적층 등가(nick-success 캡처) */
}

/* 관계인 Dialog 공통 폭. */
:root {
  --dialog-max-width: 320px;
  --related-birth-button-md-padding: 22px;
}

/* 상담 공통 부품 — 20260908-0143-web-chat-spine의 동결 DS.
   기존 정의는 보존한다. 크기·상태는 _ds_bundle.js Button/IconButton/Avatar/
   GlassPanel/BottomSheet, 재질은 tokens/colors.css·glass.css·motion.css 원문이다. */
:root {
  --chat-zero: 0;
  --chat-one: 1;
  --chat-full: 100%;
  --chat-circle: 50%;
  --chat-flex-fixed: 0 0 auto;
  --chat-flex-fill: 1 1 auto;
  --chat-transparent: transparent;
  --chat-transparent-border: 1px solid transparent;
  --chat-text-inverse: #FFFDF9;
  --chat-control-border: 1px solid rgba(255,255,255,.26);
  --chat-control-highlight: inset 0 1px 0 rgba(255,255,255,.22);
  --chat-control-shadow-accent: 0 6px 18px color-mix(in srgb,var(--blossom-600) 30%,transparent);
  --chat-control-shadow-info: 0 6px 18px color-mix(in srgb,var(--mist-700) 28%,transparent);
  --chat-control-primary-shadow: var(--chat-control-shadow-accent), var(--chat-control-highlight);
  --chat-control-info-shadow: var(--chat-control-shadow-info), var(--chat-control-highlight);
  --chat-control-height-md: 48px;
  --chat-control-height-sm: 36px;
  --chat-control-padding-md: 0 22px;
  --chat-control-padding-sm: 0 16px;
  --chat-control-gap-md: 8px;
  --chat-control-gap-sm: 6px;
  --chat-control-font-md: var(--fw-semibold) var(--fs-body-sm)/1 var(--font-sans);
  --chat-control-font-sm: var(--fw-semibold) var(--fs-caption)/1 var(--font-sans);
  --chat-control-icon-md: 18px;
  --chat-control-icon-sm: 15px;
  --chat-control-disabled-opacity: .42;
  --chat-round-size-md: 40px;
  --chat-round-size-sm: 32px;
  --chat-round-icon-md: 19px;
  --chat-round-icon-sm: 16px;
  --chat-round-disabled-opacity: .4;
  --chat-glass-filter-sm: blur(16px) saturate(180%) brightness(1.05);
  --chat-glass-tint-press: color-mix(in srgb,var(--surface-solid) 86%,transparent);
  --chat-panel-tint-mist: color-mix(in srgb,var(--mist-500) 18%,transparent);
  --chat-panel-border-mist: 1px solid color-mix(in srgb,var(--mist-500) 32%,transparent);
  --chat-panel-padding: 16px;
  --chat-panel-shadow: var(--shadow-2), var(--glass-edge);
  --chat-avatar-size: 48px;
  --chat-avatar-size-large: 66px;
  --chat-avatar-font: var(--fw-semibold) 19px/1 var(--font-serif);
  --chat-avatar-font-large: var(--fw-semibold) 26px/1 var(--font-serif);
  --chat-avatar-media-background: color-mix(in srgb,var(--ink-900) 6%,transparent);
  --chat-avatar-background: linear-gradient(150deg,var(--accent-soft-hover),var(--chat-avatar-media-background));
  --chat-avatar-shadow: inset 0 0 0 1px color-mix(in srgb,var(--ink-900) 8%,transparent);
  --chat-sheet-z: 40;
  --chat-sheet-max-height: 82%;
  --chat-sheet-padding: var(--space-5) var(--sheet-pad) calc(var(--safe-bottom) + 12px);
  --chat-sheet-background: color-mix(in srgb,var(--surface-solid) 62%,transparent);
  --chat-sheet-scrim-filter: blur(14px) saturate(140%);
  --chat-sheet-shadow: 0 -12px 48px color-mix(in srgb,var(--ink-900) 20%,transparent), var(--glass-edge);
  --chat-sheet-grabber-width: 40px;
  --chat-sheet-grabber-height: 4px;
  --chat-sheet-grabber-radius: 4px;
  --chat-sheet-grabber-margin: 0 auto 14px;
  --chat-duration-fast: var(--dur-fast);
  --chat-duration-sheet: var(--dur-sheet);
  --chat-ease-out: var(--ease-out);
  --chat-ease-glass: var(--ease-glass);
  --chat-control-transition: background-color var(--chat-duration-fast) var(--chat-ease-out), color var(--chat-duration-fast) var(--chat-ease-out), border-color var(--chat-duration-fast) var(--chat-ease-out), box-shadow var(--chat-duration-fast) var(--chat-ease-out), transform var(--chat-duration-fast) var(--chat-ease-out);
}

/* 상담 S5 — 동결 DC53~100/111~198/898~1006의 헤더·히어로·장부·입력.
   D01: composer는 기존 홈 nav 슬롯 높이 위에 뜨고 실제 C+N을 장부 끝 여백이 맡는다.
   --chat-composer-padding의 마지막 0은 composer 자체에 추가 하단 여백이 없다는 뜻이다. */
:root {
  --chat-header-height: 76px;
  --chat-header-top: 24px;
  --chat-header-z: 2;
  --chat-hero-portrait-ratio: 3 / 4;
  --chat-hero-portrait-border: 1px solid var(--gold-400);
  --chat-hero-portrait-background: linear-gradient(150deg, var(--blossom-200), var(--ink-200));
  --chat-hero-divider-height: 1px;
  --chat-ledger-gap: 26px;
  --chat-ledger-padding: 94px 26px 10px;
  --chat-ledger-card-gap: 18px;
  --chat-ledger-card-padding: 92px 20px 8px;
  --chat-letter-font: var(--fw-regular) 16.5px/1.86 var(--font-serif);
  --chat-card-lead-font: var(--fw-regular) 15.5px/1.82 var(--font-serif);
  --chat-composer-padding: 10px 26px 0;
  --chat-composer-letter-padding: 10px 26px calc(var(--tabbar-h) + 28px - var(--home-nav-slot-height));
  --chat-composer-card-padding: 10px 20px 0;
  --chat-composer-field-gap: 8px;
  --chat-composer-field-padding: 7px 8px 7px 18px;
  --chat-composer-shadow: var(--shadow-2), var(--glass-edge);
  --chat-composer-min-height: 44px;
  --chat-composer-max-height: 132px;
  --chat-composer-input-padding: 11px 0 10px;
  --chat-composer-action-margin: 6px;
  --chat-composer-locked-gap: 10px;
  --chat-composer-locked-height: 52px;
  --chat-composer-locked-padding: 0 12px 0 18px;
}

/* 상담 S7 — 동결 DC62~89/126~184/381~471/671~715/1013~1066.
   원본 옵션·답 상태·후보·시트 내용의 값. 가격 상자는 P2의 DC153~164에만
   대응하며 소개에는 표시하지 않는다. Divider는 DS76~91이다. */
:root {
  --chat-card-gap: 12px;
  --chat-card-heading-gap: 8px;
  --chat-card-heading-font: var(--fw-semibold) 14px/1 var(--font-sans);
  --chat-card-icon-size: 17px;
  --chat-card-option-gap: 8px;
  --chat-card-row-gap: 10px;
  --chat-card-row-padding: 0 14px;
  --chat-card-row-border: 1px solid var(--border-hairline);
  --chat-card-option-height: 48px;
  --chat-card-option-background: rgba(255,253,249,.88);
  --chat-card-option-highlight: 0 1px 0 rgba(255,255,255,.7) inset;
  --chat-card-counter-background: rgba(255,253,249,.62);
  --chat-card-badge-height: 22px;
  --chat-card-badge-padding: 0 9px;
  --chat-card-badge-font: var(--fw-medium) 11.5px/1 var(--font-sans);
  --chat-card-counter-badge-background: rgba(108,130,152,.16);
  --chat-card-field-height: 44px;
  --chat-card-field-gap: 6px;
  --chat-card-field-icon: 15px;
  --chat-card-actions-gap: 7px;
  --chat-payment-amount-gap: 6px;
  --chat-payment-amount-min-height: 58px;
  --chat-payment-amount-padding: 10px 13px;
  --chat-payment-money-gap: 5px;
  --chat-payment-money-font: var(--fw-semibold) 15.5px/1.2 var(--font-sans);
  --chat-payment-coin-size: 17px;
  --chat-card-hint-gap: 9px;
  --chat-card-hint-padding: 11px 13px;
  --chat-card-hint-background: rgba(169,58,50,.06);
  --chat-card-hint-border: 1px solid rgba(169,58,50,.28);
  --chat-card-hint-icon-margin: 2px;
  --chat-card-return-background: rgba(255,253,249,.82);
  --chat-card-return-font: var(--fw-medium) var(--fs-caption)/1 var(--font-sans);
  --chat-card-answer-opacity: .62;
  --chat-card-answer-padding: 15px;
  --chat-card-answer-gap: 11px;
  --chat-card-answer-background: rgba(255,253,249,.72);
  --chat-card-answer-badge-gap: 5px;
  --chat-card-answer-badge-background: rgba(79,138,108,.14);
  --chat-card-answer-check-size: 12px;
  --chat-card-answer-row-background: rgba(255,253,249,.6);
  --chat-card-cancelled-opacity: .55;
  --chat-card-cancelled-padding: 13px 15px;
  --chat-card-cancelled-background: rgba(255,253,249,.7);
  /* 결제완료(paid) 배지 — DC286 «결제했어요»(§F.4:341 · architect 동결 처분: --chat-card-badge-*와 값이
     겹쳐도 의미 분리로 신규 등록 · DRY 재사용 금지 · 기존 토큰 제거·개명 0). */
  --chat-paid-badge-height: 22px;                        /* DC286 배지 height */
  --chat-paid-badge-padding: 0 9px;                      /* DC286 배지 padding */
  --chat-paid-badge-gap: 5px;                            /* DC286 check–글 gap */
  --chat-paid-badge-background: rgba(79,138,108,.14);    /* DC286 배지 bg(jade 14%) */
  --chat-paid-badge-font: var(--fw-medium) 11.5px/1 var(--font-sans);  /* DC286 배지 서체 */
  --chat-paid-badge-check-size: 12px;                    /* DC286 icon-check 크기 */
  --chat-card-notice-padding: 9px 14px;
  --chat-card-notice-background: rgba(108,130,152,.14);
  --chat-card-notice-border: 1px solid rgba(108,130,152,.28);
  --chat-candidates-gap: 11px;
  --chat-candidates-heading-padding: 0 2px;
  --chat-carousel-gap: 12px;
  --chat-carousel-margin: 0 -20px;
  --chat-carousel-padding: 2px 20px 0;
  --chat-candidate-width: 302px;
  --chat-candidate-flex: 0 0 var(--chat-candidate-width);
  --chat-candidate-portrait-height: 172px;
  --chat-candidate-portrait-border: 1px solid var(--gold-400);
  --chat-candidate-initial-font: var(--fw-bold) 58px/1 var(--font-serif);
  --chat-candidate-initial-color: rgba(31,28,24,.32);
  --chat-candidate-content-gap: 10px;
  --chat-candidate-content-padding: 14px 15px 15px;
  --chat-candidate-identity-gap: 4px;
  --chat-candidate-name-font: var(--fw-bold) 19px/1.25 var(--font-serif);
  --chat-candidate-description-font: var(--fw-regular) 14.5px/1.7 var(--font-serif);
  --chat-candidate-dots-gap: 6px;
  --chat-candidate-dot-size: 6px;
  --chat-candidate-dot-current-width: 18px;
  --chat-candidate-dot-radius: 3px;
  --chat-candidate-dot-background: rgba(31,28,24,.16);
  --chat-price-flex: 1 1 0;
  --chat-price-gap: 3px;
  --chat-price-padding: 9px 12px;
  --chat-price-background: rgba(255,253,249,.86);
  --chat-price-font: var(--fw-semibold) 14px/1.2 var(--font-sans);
  --chat-amount-font: var(--fw-semibold) 14.5px/17.4px var(--font-sans);  /* DC240 · §F.3.a 요금·잔액 값(원보 옆 숫자) */
  --chat-rooms-margin: 0 -4px;
  --chat-rooms-padding: 2px 0 14px;
  --chat-room-gap: 12px;
  --chat-room-padding: 12px;
  --chat-room-portrait-size: 34px;
  --chat-room-details-gap: 2px;
  --chat-room-identity-gap: 6px;
  --chat-room-name-font: var(--fw-medium) var(--fs-body-sm)/1.4 var(--font-sans);
  --chat-room-initial-font: var(--fw-semibold) 14px/1 var(--font-serif);
  --chat-room-transition: background-color var(--chat-duration-fast) var(--chat-ease-out);
  --chat-intro-gap: 10px;
  --chat-intro-padding-bottom: 18px;
  --chat-intro-name-font: var(--fw-bold) var(--fs-title-1)/1.3 var(--font-serif);
  --chat-intro-description-margin: 4px 0 0;
  --chat-intro-description-width: 300px;
  --chat-intro-description-font: var(--fw-regular) 15px/1.7 var(--font-serif);
  --chat-intro-divider-margin: var(--space-7) 0;
}

/* 상담 S8 — 동결 DC949~990 서신·손님 말, DC563~565 결과지 진입점,
   DC760~801/1147~1149 상태 표현. 결과지 상세와 원본 갤러리 외곽은 제외한다.
   모션은 명세 m2(cm-rise .34s)·m3(cm-dot 1.1s)만 추가한다. */
:root {
  --chat-letter-gap: 9px;
  --chat-letter-portrait-width: 27px;
  --chat-letter-initial-font: var(--fw-semibold) 13px/1 var(--font-serif);
  --chat-letter-author-font: var(--fw-medium) var(--fs-micro)/1.3 var(--font-sans);
  --chat-letter-author-spacing: .08em;
  --chat-letter-user-gap: 5px;
  --chat-letter-user-width: 82%;
  --chat-letter-user-padding: 11px 16px;
  --chat-letter-user-radius: var(--radius-lg) var(--radius-lg) var(--radius-sm) var(--radius-lg);
  --chat-letter-user-shadow: var(--shadow-1), var(--glass-edge);
  --chat-record-padding: 11px 14px;
  --chat-record-font: var(--fw-semibold) 13.5px/1 var(--font-sans);
  --chat-status-gap: 11px;
  --chat-status-error-padding: 14px 15px;
  --chat-status-error-font: var(--fw-semibold) var(--fs-body-sm)/1.4 var(--font-sans);
  --chat-status-replay-padding: 10px 14px;
  --chat-status-incomplete-padding: 12px 15px;
  --chat-status-progress-gap: 6px;
  --chat-status-progress-margin: 4px;
  --chat-status-streaming-gap: 10px;
  --chat-status-dot-size: 6px;
  --chat-status-network-padding: 9px 10px 0;
  --chat-status-network-icon: 14px;
  --chat-status-spinner-size: 16px;
  --chat-status-spinner-border: 2px solid var(--track-off);
  --chat-duration-message: .34s;
  --chat-duration-dot: 1.1s;
  --chat-delay-dot-one: .16s;
  --chat-delay-dot-two: .32s;
  --chat-ease-in-out: ease-in-out;
  --chat-dot-rest-opacity: .25;
  --chat-dot-peak-opacity: .9;
  --chat-dot-peak-transform: translateY(-2px);
}

/* 상담 2차 S2b — P3 DC219~231와 동결 DS GlassPanel/Button.
   glass.css L22/47의 jade tint·border, L83 shadow-success와 fill highlight를 합성한다. */
:root {
  --chat-panel-tint-jade: color-mix(in srgb,var(--jade-500) 16%,transparent);
  --chat-panel-border-jade: 1px solid color-mix(in srgb,var(--jade-500) 30%,transparent);
  --chat-control-success-shadow: var(--shadow-success), var(--chat-control-highlight);
  --chat-record-title-font: var(--fw-medium) 15.5px/1.4 var(--font-serif);
}

/* 상담 2차 S2d — P3 DC242~257의 F 숫자 행에서 기존 풀에 없는 exact값. */
:root {
  --chat-balance-gap: 14px;
  --chat-balance-padding: 14px 16px;
  --chat-balance-value-font: var(--fw-semibold) 17px/1.2 var(--font-sans);
}

/* 상담 2차 S2d — P3 DC261의 입력 field padding. */
:root {
  --chat-composer-record-field-padding: 0 8px 0 18px;
}

/* 상담 2차 S3b — H DC493. 글꼴·배경은 같은 원본 값의 기존 chat-* 토큰 재사용. */
:root {
  --chat-follow-up-question-padding: 12px 14px;
}

/* 상담 3차 s2 — 값 위젯(character_resting·retry·limit_exceeded·payment_values) exact값.
   동결 DC236(moon pill)·265(retry inline)·315/340(요금·잔액·재개 패널·행). 풀에 없던 신규만 등록하고
   moon pill notice(9px 14px·bg·border)·값 행 gap/padding/border·radius/색은 기존 --chat-* · palette 재사용.
   생 리터럴은 SoT인 여기에만 둔다(소비 CSS는 var()만). */
:root {
  --chat-value-notice-gap: 8px;                          /* DC236 moon pill 아이콘–글 gap */
  --chat-value-icon-size: 15px;                          /* DC236/265 moon·cloud-off 아이콘 크기 */
  --chat-value-panel-padding: 12px 13px;                 /* DC315/340 payment_values·limit 패널 padding */
  --chat-value-panel-gap: 6px;                           /* DC315/340 패널·본체 세로 gap */
  --chat-value-panel-background: rgba(255,253,249,.86);  /* DC315/340/265 값 패널·retry bg (#FFFDF9 86%) */
  --chat-value-row-min-height: 40px;                     /* DC240/315/340 값 행 min-height(마지막 선언 40px) */
  --chat-value-label-width: 106px;                       /* DC240/315/340 값 행 라벨 폭 flex: 0 0 106px */
  --chat-retry-inline-gap: 9px;                          /* DC265 retry inline 아이콘–글 gap */
  --chat-retry-inline-padding: 11px 13px;                /* DC265 retry inline padding */
}

/* web-login-2 시안 정합 — Input 글래스 필드(§W2.3). DS glass.css verbatim 등록.
   --glass-blur-sm / --glass-filter-sm = DS glass.css:3·8 그대로(기존 --glass-blur(30)·
   --glass-filter 판형과 동일). 스코프 사본(--settings-glass-filter-sm·--chat-glass-filter-sm)은
   있었으나 root 글로벌은 부재했다 → .input-field__control 이 소비할 글로벌로 등록.
   --glass-rim = Input 쉼 border 색. DS·번들에 직접 정의는 없고 Claude Design 캔버스 base층이
   제공한 해소값 rgba(255,255,255,.72). 3중 교차확인: 설정런 --settings-glass-rim ·
   DS glass.css:19 --glass-border(1px solid rgba(255,255,255,.72)) · components.css:487
   glass-rim→--glass-border 치환 선례 — 전부 .72 흰색으로 수렴(G1#1). */
:root {
  --glass-blur-sm: 16px;                                                       /* DS glass.css:3 */
  --glass-filter-sm: blur(var(--glass-blur-sm)) saturate(180%) brightness(1.05); /* DS glass.css:8 */
  --glass-rim: rgba(255,255,255,.72);                                          /* 캔버스 base층 해소 · glass.css:19 --glass-border 림색 교차확인 */
  --icon-glass-mask: radial-gradient(#fff, #000);                              /* glass 캡슐 backdrop-filter 를 실제 모양으로 클립하는 마스크(DS AppBar.jsx groupCapsule · Chrome 사각합성 교정) */
}

/* web-login-2 시안 정합 — SpecialButton 부품 내재 색(§W2.5·§4). DS _ds_bundle 은 --gold-leaf-rim·
   --blossom-shade(tokens/glass.css 권위값 · DesignSync get_file 확인)를 참조 → 램프에서 파생
   (생 색 리터럴 0 · houserules §4). 그림자 오프셋(0 1px 2px 등)은 치수라 리터럴 유지. */
:root {
  --special-button-inner-glow: color-mix(in srgb, var(--gold-300) 30%, transparent);      /* = DS --gold-leaf-rim (gold-300 30%): 금박 안쪽 1px 림 */
  --special-button-label-shadow: color-mix(in srgb, var(--blossom-900) 32%, transparent); /* = DS --blossom-shade (blossom-900 32%): label text-shadow */
  --special-button-mark-shadow: color-mix(in srgb, var(--blossom-900) 32%, transparent);  /* = DS --blossom-shade (blossom-900 32%): 화문 mark drop-shadow (번들은 label과 동일 토큰) */
}

/* 설정 최신 시안 — AppBar glass capsule과 mist profile의 exact 토큰·기존 alias override. */
:root {
  --settings-glass-tint-bar: color-mix(in srgb,#FFFDF9 18%,transparent);
  --settings-text-info: #48586A;
  --settings-appbar-fill: var(--settings-glass-tint-bar);
  --settings-appbar-border: var(--settings-glass-border);
  --settings-appbar-shadow: var(--shadow-3), var(--settings-glass-edge-sm);
}

/* 6-3-3 사용자 정보 화면 · 설정 하위 화면 층 — 원본(사용자 정보 화면.dc.html · 설정.dc.html · _ds_bundle.js ·
   tokens/*.css) 값을 화면 접두(--user-info-* · --settings-sub-layer-*)와 새 부품 접두(--aura-background-* ·
   --choice-pair-buttons-*)로 싣는다. 값이 원본과 다르거나 정의가 없는 전역 · 공용 이름은 재정의하지 않는다. */
:root {
  /* 원색 · 틴트 · 그림자 운반(tok = _ds/…/tokens). */
  --user-info-paper-50: #FFFDF9;                                                             /* tok/colors.css:35 --paper-50 */
  --user-info-track-off: color-mix(in srgb,#1F1C18 12%,transparent);                         /* tok/colors.css:95 --track-off */
  --user-info-shadow-inset-track: inset 0 1px 2px color-mix(in srgb,#1F1C18 8%,transparent); /* tok/glass.css:88 --shadow-inset-track */
  --user-info-glass-tint-ink: color-mix(in srgb,#1F1C18 38%,transparent);                    /* tok/glass.css:21 --glass-tint-ink */
  --user-info-glass-tint-ink-hover: color-mix(in srgb,#1F1C18 52%,transparent);              /* tok/glass.css:22 --glass-tint-ink-hover · SoundToggle hover ds:2553 */
  --user-info-glass-tint-press: color-mix(in srgb,#FFFDF9 86%,transparent);                  /* tok/glass.css:18 --glass-tint-press · Button glass 누름 ds:380 */
  --user-info-birth-check-gap: 9px;          /* 사용자 정보 화면.dc.html:96 · 확인 실패 상자 */
  --user-info-birth-check-pad-block: 11px;  /* 사용자 정보 화면.dc.html:96 · 확인 실패 상자 */
  --user-info-birth-check-pad-inline: 13px; /* 사용자 정보 화면.dc.html:96 · 확인 실패 상자 */
  --user-info-birth-check-icon-size: 15px;  /* 사용자 정보 화면.dc.html:97 · cloud-off */
  --user-info-bg-veil: linear-gradient(180deg, transparent 0%, color-mix(in srgb, var(--user-info-paper-50) 72%, transparent) 62%, var(--paper-200) 100%);  /* 사용자 정보 화면.dc.html:48 */
  --user-info-poster-position: 52% 22%;  /* 사용자 정보 화면.dc.html:215-219 · 제품 기본 자리 */

  /* AppFrame 바탕 · aura — 부품 background/aura_background.html(ds:2214 · ds:2276-2296 · cmAuraBlobs ds:2156-2176). */
  --aura-background-blob-blossom: color-mix(in srgb,#DF9095 28%,transparent);  /* tok/colors.css:119 --blob-blossom */
  --aura-background-blob-gold: color-mix(in srgb,#D3B87F 40%,transparent);     /* tok/colors.css:120 --blob-gold */
  --aura-background-blob-mist: color-mix(in srgb,#6C8298 46%,transparent);     /* tok/colors.css:121 --blob-mist */
  --aura-background-blob-rose: color-mix(in srgb,#98444E 14%,transparent);     /* tok/colors.css:122 --blob-rose */
  --aura-background-bg: radial-gradient(122% 84% at 6% -8%, var(--aura-background-blob-blossom) 0%, transparent 58%),radial-gradient(104% 72% at 98% -4%, var(--aura-background-blob-gold) 0%, transparent 56%),radial-gradient(98% 70% at 92% 102%, var(--aura-background-blob-mist) 0%, transparent 62%),radial-gradient(86% 58% at 2% 98%, var(--aura-background-blob-rose) 0%, transparent 60%),radial-gradient(64% 44% at 48% 44%, color-mix(in srgb,#FFFDF9 92%,transparent) 0%, transparent 74%),linear-gradient(168deg,#FBF8F2 0%,#EFE9DE 54%,#E6DFD2 100%);  /* tok/colors.css:123-124 --bg-app */
  --aura-background-blob-blossom-fill: radial-gradient(circle at 50% 50%, var(--aura-background-blob-blossom) 0%, transparent 68%);  /* ds:2295 */
  --aura-background-blob-gold-fill: radial-gradient(circle at 50% 50%, var(--aura-background-blob-gold) 0%, transparent 68%);        /* ds:2295 */
  --aura-background-blob-mist-fill: radial-gradient(circle at 50% 50%, var(--aura-background-blob-mist) 0%, transparent 68%);        /* ds:2295 */
  --aura-background-blob-rose-fill: radial-gradient(circle at 50% 50%, var(--aura-background-blob-rose) 0%, transparent 68%);        /* ds:2295 */
  --aura-background-blob-blossom-top: 3%;     /* ds:2157 */
  --aura-background-blob-blossom-left: -26%;  /* ds:2158 */
  --aura-background-blob-blossom-size: 320px; /* ds:2159 */
  --aura-background-blob-gold-top: 27%;       /* ds:2162 */
  --aura-background-blob-gold-right: -30%;    /* ds:2163 */
  --aura-background-blob-gold-size: 340px;    /* ds:2164 */
  --aura-background-blob-mist-top: 57%;       /* ds:2167 */
  --aura-background-blob-mist-left: -20%;     /* ds:2168 */
  --aura-background-blob-mist-size: 300px;    /* ds:2169 */
  --aura-background-blob-rose-top: 83%;       /* ds:2172 */
  --aura-background-blob-rose-right: -22%;    /* ds:2173 */
  --aura-background-blob-rose-size: 320px;    /* ds:2174 */
  --aura-background-blob-radius: 50%;         /* ds:2294 */

  /* ChoicePair 버튼 판 — 부품 choice/button_pair_choice.html(ds:1577-1702). */
  --choice-pair-buttons-thumb-shadow: var(--shadow-1), inset 0 1px 0 var(--glass-rim);  /* ds:1654 */

  /* 사용자 정보 화면 치수 · 쌓임(ui = 사용자 정보 화면.dc.html). */
  --user-info-appbar-h: 52px;                 /* tok/layout.css:14 --appbar-h */
  --user-info-card-z: 1;                      /* ui:51 form z 1 */
  --user-info-appbar-z: 2;                    /* form 안 --z-appbar(tok/layout.css:18)을 화면 쌓임 맥락에 평면화 — 카드 < AppBar < 소리 */
  --user-info-sound-box-z: 3;                 /* ui:33 */
  --user-info-sheet-z: 40;                    /* tok/layout.css:21 --z-sheet · ds:1051 */
  --user-info-toast-z: 50;                    /* tok/layout.css:22 --z-toast · ds:1473 */
  --user-info-sound-box-top: 14px;            /* ui:33 */
  --user-info-sound-box-right: 14px;          /* ui:33 */
  --user-info-sound-box-width: 132px;         /* ui:33 */
  --user-info-sound-box-height: 32px;         /* ui:33 */
  --user-info-form-padding: 10px var(--gutter) var(--gutter);  /* ui:51 */
  --user-info-menu-max-height: 320px;         /* ds:2893 */
  --user-info-menu-offset: calc(100% + 8px);  /* ds:2888 side top */
  --user-info-sheet-max-height: 82%;          /* ds:1069 */
  --user-info-sheet-padding: var(--space-5) var(--sheet-pad) calc(var(--safe-bottom) + 12px);  /* ds:1072 */
  --user-info-sheet-grabber-width: 40px;      /* ds:1085 */
  --user-info-sheet-grabber-height: 4px;      /* ds:1086 */
  --user-info-sheet-grabber-radius: 4px;      /* ds:1087 */
  --user-info-sheet-grabber-margin: 0 auto 14px;  /* ds:1089 */
  --user-info-toast-bottom: calc(var(--tabbar-h) + 18px);  /* ds:1472 */
  --user-info-field-disabled-opacity: .6;     /* ds:1758 */
  --user-info-trailing-icon-size: 18px;       /* ui:295 chevronEl Icon size 18 */
  --user-info-fade-up-offset: 10px;           /* tok/base.css:15 cm-fade-up */
  --user-info-menu-in-offset: -6px;           /* tok/base.css:18 cm-menu-in */

  /* 설정 하위 화면 층(설정.dc.html:143 인라인 값 · 감속 선호 블록 밖). */
  --settings-sub-layer-z: 50;                 /* 설정.dc.html:143 */
  --settings-sub-layer-duration: 320ms;       /* 설정.dc.html:143 */
}

/* 점쟁이 상세 s5 — 동결 DS foundation 보충과 source-exact component/화면 semantic 토큰.
   명세 §9의 C 28 + E 27 + K 29 + motion/geometry 10만 파일 끝에 추가한다. */
:root {
  /* 동결 foundation 보충 5. */
  --info-hover: #48586A;
  --on-fill-border: 1px solid rgba(255,255,255,.26);
  --on-fill-highlight: inset 0 1px 0 rgba(255,255,255,.22);
  --on-ink-rim: rgba(255,255,255,.18);
  --shadow-info: 0 6px 18px color-mix(in srgb,#48586A 28%,transparent);

  /* C-01~C-05: Button, Badge, IconButton, SoundToggle, Wonbo. */
  --ds-button-height-lg: 56px;
  --ds-button-padding-lg: 0 28px;
  --ds-button-gap-lg: 10px;
  --ds-button-font-lg: var(--fw-semibold) var(--fs-body)/1 var(--font-sans);
  --ds-button-icon-lg: 20px;
  --ds-button-disabled-opacity: .42;
  --ds-badge-height-md: 26px;
  --ds-badge-padding-md: 0 10px;
  --ds-badge-gap-md: 5px;
  --ds-badge-font-md: var(--fw-medium) var(--fs-caption)/var(--lh-tight) var(--font-sans);
  --ds-badge-icon-md: 14px;
  --ds-icon-button-size-md: 40px;
  --ds-icon-button-icon-md: 19px;
  --ds-icon-button-disabled-opacity: .4;
  --ds-sound-z-index: 2;
  --ds-sound-sm-height: 32px;
  --ds-sound-inset: 12px;
  --ds-sound-gap: 6px;
  --ds-sound-muted-padding-sm: 0 12px 0 10px;
  --ds-sound-font: var(--type-label);
  --ds-sound-icon-sm: 16px;
  --ds-sound-border: 1px solid var(--on-ink-rim);
  --ds-sound-background-hover: transparent;
  --ds-wonbo-sm-width: 18px;
  --ds-wonbo-image-ratio: 25/17;
  --ds-wonbo-gap-sm: 5px;
  --ds-wonbo-font-sm: var(--fw-semibold) var(--fs-label)/var(--lh-title) var(--font-sans);
  --ds-wonbo-unit-margin: .18em;
  --ds-wonbo-md-width: 24px;
  --ds-wonbo-gap-md: 7px;
  --ds-wonbo-font-md: var(--fw-semibold) var(--fs-body)/var(--lh-body) var(--font-sans);

  /* E-01~E-08: detail shell, body, content, footer and hero overlays. */
  --chat-teller-inset: 14px;
  --chat-teller-scrim: color-mix(in srgb,var(--ink-900) 34%,transparent);
  --chat-teller-hero-ratio: 4/3;
  --chat-teller-hero-background: linear-gradient(150deg,var(--blossom-200),var(--ink-200));
  --chat-teller-identity-gap: 7px;
  --chat-teller-name-font: var(--fw-bold) 24px/1.3 var(--font-serif);
  --chat-teller-rating-gap: 6px;
  --chat-teller-rating-star: 14px;
  --chat-teller-rating-font: var(--fw-semibold) 14px/1 var(--font-sans);
  --chat-teller-bio-font: var(--fw-regular) 15.5px/1.82 var(--font-serif);
  --chat-teller-overlay-inset: 12px;
  --chat-teller-video-chip-height: 28px;
  --chat-teller-video-chip-padding: 0 11px;
  --chat-teller-video-chip-gap: 6px;
  --chat-teller-video-chip-icon: 13px;
  --chat-teller-video-chip-font: var(--fw-semibold) 11.5px/1 var(--font-sans);

  /* K-02~K-08: card overlay, rating, content, prices, actions and carousel. */
  --chat-teller-card-overlay: color-mix(in srgb,var(--ink-900) 46%,transparent);
  --chat-teller-card-overlay-gap: 8px;
  --chat-teller-card-overlay-padding: 0 16px;
  --chat-teller-card-overlay-saturation: 40%;
  --chat-teller-card-rating-background: linear-gradient(to top,color-mix(in srgb,var(--ink-900) 62%,transparent),transparent);
  --chat-teller-card-rating-gap: 6px;
  --chat-teller-card-rating-padding: 18px 10px 8px;
  --chat-teller-card-rating-star: 13px;
  --chat-teller-card-rating-font: var(--fw-semibold) 13px/1 var(--font-sans);
  --chat-teller-card-content-gap: 8px;
  --chat-teller-card-content-padding: 10px 13px 12px;
  --chat-teller-card-name-font: var(--fw-bold) 18px/1.25 var(--font-serif);
  --chat-teller-card-prices-gap: 7px;
  --chat-teller-card-price-gap: 6px;
  --chat-teller-card-price-padding: 7px 8px;
  --chat-teller-card-price-background: color-mix(in srgb,var(--surface-solid) 86%,transparent);
  --chat-teller-card-free-font: var(--fw-semibold) 13.5px/1.2 var(--font-sans);
  --chat-teller-card-actions-gap: 7px;
  --chat-teller-card-width: 272px;
  --chat-teller-carousel-min-height: 400px;
  --chat-teller-carousel-padding: 10px 0;
  --chat-teller-selection-gap: 11px;
  --chat-teller-selection-heading-gap: 8px;
  --chat-teller-selection-heading-padding: 0 2px;
  --chat-teller-dot-hit: 26px;
  --chat-teller-dot-current: 18px 6px;
  --chat-teller-dot-size: 6px;
  --chat-teller-dot-gap: 6px;
  --chat-teller-dot-radius: 3px;

  /* m01~m08와 runtime card-origin geometry. */
  --chat-teller-hero-in: 520ms;
  --chat-teller-body-in: 416ms;
  --chat-teller-fade: 286ms;
  --chat-teller-hero-out: 374ms;
  --chat-teller-body-out: 312ms;
  --chat-teller-reduced: 1ms;
  --chat-teller-origin-left: 0px;
  --chat-teller-origin-top: 0px;
  --chat-teller-origin-width: 0px;
  --chat-teller-origin-height: 0px;
}

/* 상담 대화 서랍 s4 — 동결 foundation 보충 1개와 T-01~T-11 source-exact semantic 토큰. */
:root {
  --border-accent-soft: color-mix(in srgb,#D0727A 22%,transparent);

  --chat-drawer-width: 312px;
  --chat-drawer-padding: 22px 0 18px;
  --chat-drawer-z: 31;
  --chat-drawer-scrim: color-mix(in srgb,#1F1C18 26%,transparent);
  --chat-drawer-scrim-z: 30;
  --chat-drawer-scrim-duration: 420ms;
  --chat-drawer-header-padding: 0 12px 0 20px;
  --chat-drawer-header-gap: 8px;
  --chat-drawer-title-font: var(--fw-bold) var(--fs-title-2)/1.25 var(--font-serif);

  --chat-counter-gap: 7px;
  --chat-counter-padding: 14px 16px 13px;
  --chat-counter-eyebrow-padding: 0 4px;
  --chat-counter-action-width: 92px;
  --chat-counter-row-gap: 13px;
  --chat-counter-row-padding: 13px 15px;
  --chat-counter-avatar-size: 46px;
  --chat-counter-avatar-shadow: 0 0 0 2px var(--accent-soft), var(--shadow-1);
  --chat-counter-detail-gap: 4px;
  --chat-counter-identity-gap: 7px;
  --chat-counter-name-font: var(--fw-bold) 16px/1.25 var(--font-serif);

  --divider-thickness: 1px;
  --chat-drawer-divider-padding: 0 16px;
  --chat-drawer-list-gap: 8px;
  --chat-drawer-list-padding: 13px 10px 12px;
  --chat-drawer-list-heading-padding: 0 10px 2px;
  --chat-room-action-width: 84px;
  --chat-room-row-gap: 12px;
  --chat-room-row-padding: 10px 12px;
  --chat-room-portrait-width: 44px;
  --chat-room-portrait-ratio: 3 / 4;
  --chat-drawer-room-details-gap: 3px;
  --chat-drawer-room-identity-gap: 8px;
  --chat-drawer-room-name-font: var(--fw-semibold) 14.5px/1.3 var(--font-sans);
  --chat-drawer-room-initial-font: var(--fw-semibold) 18px/1 var(--font-serif);
  --chat-row-action-gap: 4px;
  --chat-row-action-icon: 18px;
  --chat-row-action-font: var(--fw-semibold) 12px/1 var(--font-sans);

  --chat-drawer-offset: -104%;
  --chat-drawer-duration: 520ms;
  --chat-row-duration: 240ms;
  --chat-long-press: 440ms;
  --chat-gesture-slop: 8px;
  --chat-swipe-threshold: 40px;
  --chat-counter-reveal-offset: -100px;
  --chat-room-reveal-offset: -92px;

  --chat-drawer-empty-gap: 9px;
  --chat-drawer-empty-padding: 26px 16px 20px;
  --chat-drawer-empty-icon: 26px;
  --chat-absence-gap: 15px;
  --chat-absence-padding: 92px 30px 96px;
  --chat-absence-icon: 32px;
  --chat-absence-copy-gap: 7px;
  --chat-absence-title-font: var(--fw-regular) 21px/1.4 var(--font-serif);
  --chat-absence-action-max: 250px;
  --chat-absence-action-padding-top: 2px;
  --chat-absence-action-height: 52px;
  --chat-absence-pill-gap: 9px;
  --chat-absence-pill-padding: 8px 15px 8px 9px;
  --chat-absence-pill-background: color-mix(in srgb,#FFFDF9 70%,transparent);
  --chat-absence-avatar-size: 32px;
  --chat-absence-offline-opacity: .6;
  --chat-absence-offline-filter: grayscale(1);

  --chat-exit-dialog-z: 60;
  --chat-exit-dialog-panel-max: 320px;
  --chat-exit-dialog-icon-size: 52px;
  --chat-exit-dialog-icon-gap: 14px;
  --chat-exit-dialog-icon-glyph: 24px;
  --chat-exit-dialog-description-gap: 8px;
  --chat-exit-dialog-action-gap: 8px;
  --chat-exit-dialog-action-margin: 24px;
  --chat-exit-dialog-control-height: 48px;
  --chat-exit-dialog-control-font: var(--fw-semibold) var(--fs-body-sm)/1 var(--font-sans);
  --chat-exit-dialog-danger-soft: color-mix(in srgb,#C24C42 16%,transparent);
  --chat-exit-dialog-danger-hover: #8C2D27;
  --chat-exit-dialog-danger-shadow: 0 6px 18px color-mix(in srgb,#A93A32 26%,transparent);
  --chat-exit-dialog-info-soft: color-mix(in srgb,#6C8298 16%,transparent);
  --chat-exit-dialog-info-color: #48586A;
  --chat-exit-dialog-info-hover: #48586A;
  --chat-exit-dialog-info-shadow: 0 6px 18px color-mix(in srgb,#48586A 28%,transparent), var(--chat-control-highlight);
  --chat-exit-spinner-size: 18px;
  --chat-exit-spinner-border: 2px solid currentColor;
  --chat-exit-spinner-duration: var(--dur-base);
  --chat-drawer-reduced-duration: 1ms;
}

/* P12의 opt-in DS Avatar offline 점 — 기존 avatar 소비자의 DOM·재질은 무변. */
:root {
  --chat-absence-status-dot-size: 9px;
  --chat-absence-status-dot-shadow: 0 0 0 2px var(--surface-solid);
  --chat-exit-spinner-opacity: .8;
}

/* 8-B-2 점쟁이 값 — 할인율 배지(점쟁이 카드.dc.html:62)·시트 값 줄·시트 무료(09-23 점쟁이 상세.dc.html:61). */
:root {
  --chat-discount-badge-height: 18px;
  --chat-discount-badge-padding: 0 6px;
  --chat-discount-badge-font: 800 10.5px/1 var(--font-sans);
  --chat-teller-card-rating-separator-color: color-mix(in srgb,var(--text-inverse) 60%,transparent);
  --chat-teller-card-rating-reviews-color: color-mix(in srgb,var(--text-inverse) 88%,transparent);
  --chat-teller-track-offset: 0px;
  --chat-teller-track-duration: 380ms;
  --chat-carousel-drag-slop: 4px;
  --chat-teller-zoom-rest-scale: .92;
  --chat-teller-zoom-rest-opacity: .62;
  --chat-teller-zoom-duration: 320ms;
  --chat-candidate-dot-hover-background: rgba(31,28,24,.30);

  /* 14:55 점쟁이 상세 본문.dc.html:35-203 — 새 전체 시트·탭·선반 정확값. */
  --chat-detail-sheet-radius: 26px;
  --chat-detail-scroll-pad-bottom: 104px;
  --chat-detail-identity-padding: 17px var(--gutter) 4px;
  --chat-detail-tab-padding: 10px var(--gutter);
  --chat-detail-tab-section-padding: 8px var(--gutter) 0;
  --chat-detail-section-gap: 20px;
  --chat-detail-bio-padding: 20px;
  --chat-detail-bio-gap: 13px;
  --chat-detail-question-padding: 14px 18px;
  --chat-detail-track-padding: 8px 28px 4px;
  --chat-detail-track-gap: 10px;
  --chat-detail-book-padding: 18px;
  --chat-detail-book-gap: 14px;
  --chat-detail-book-grid-gap: 18px 12px;
  --chat-detail-book-label-gap: 9px;
  --chat-detail-book-cover-radius: 3px 8px 8px 3px;
  --chat-detail-book-label-width: 26px;
  --chat-detail-book-heading-font: var(--fw-semibold) 16px/1.3 var(--font-sans);
  --chat-detail-book-title-font: var(--fw-bold) 14px/1.35 var(--font-serif);
  --chat-detail-book-drawn-font: var(--fw-bold) 14px/1 var(--font-serif);
  --chat-detail-book-stitch-inset: 12px;
  --chat-detail-book-spine-width: 8px;
  --chat-detail-footer-padding: 12px var(--gutter) calc(var(--gutter) + 2px);
  --chat-detail-footer-gap: 7px;
  --chat-detail-skeleton-padding: 19px var(--gutter) 0;
  --chat-detail-skeleton-gap: 20px;
  --chat-detail-skeleton-identity-gap: 10px;
  --chat-detail-skeleton-name-width: 132px;
  --chat-detail-skeleton-rating-width: 96px;
  --chat-detail-skeleton-rating-height: 14px;
  --chat-detail-skeleton-price-height: 52px;
  --chat-detail-skeleton-panel-padding: 20px;
  --chat-detail-skeleton-panel-height: 13px;
  --chat-detail-skeleton-panel-gap: 11px;
  --chat-detail-skeleton-line-long: 72%;
  --chat-detail-skeleton-line-short: 54%;
  --chat-detail-skeleton-tab-height: 40px;
  --chat-detail-failure-background: linear-gradient(150deg, var(--blossom-200), var(--ink-200));
  --chat-detail-failure-panel-padding: 24px;
  --chat-detail-failure-icon-size: 52px;
  --chat-detail-failure-title-font: var(--fw-bold) 18px/1.4 var(--font-sans);
  --chat-detail-failure-action-gap: 8px;
  --chat-detail-review-heading-padding: 14px 16px;
  --chat-detail-review-heading-gap: 14px;
  --chat-detail-review-star-size: 20px;
  --chat-detail-review-empty-star-size: 22px;
  --chat-detail-review-score-gap: 5px;
  /* 리뷰 목록.dc.html:24-84 — 행·Spinner·실패·빈 상태의 원본 inline 선언. */
  --chat-review-body-gap: 14px;
  --chat-review-row-gap: 9px;
  --chat-review-row-padding: 14px 0;
  --chat-review-author-font: var(--fw-semibold) 13.5px/1 var(--font-sans);
  --chat-review-stars-font: 12px/1 var(--font-sans);
  --chat-review-stars-tracking: 1px;
  --chat-review-feedback-padding: 11px 13px;
  --chat-review-feedback-background: rgba(255,253,249,.86);
  --chat-review-feedback-icon-size: 15px;
  --chat-review-loading-padding: 36px 0;
  --chat-review-loading-gap: 10px;
  --chat-review-empty-padding: 28px 0;
  --chat-review-empty-icon-size: 28px;

  /* 14:55 콘텐츠 숏 카드.dc.html:29-88 — 이미지·행·가격·단추 정확값. */
  --chat-short-hero-ratio: 16 / 10;
  --chat-short-title-font: var(--fw-bold) 18px/1.45 var(--font-serif);
  --chat-short-hero-title-padding: 44px 16px 14px;
  --chat-short-hero-shade: linear-gradient(to top, color-mix(in srgb,var(--ink-900) 76%,transparent), color-mix(in srgb,var(--ink-900) 40%,transparent) 55%, transparent);
  --chat-short-plain-title-padding: 18px 16px 12px;
  --chat-short-body-padding: 14px 16px 16px;
  --chat-short-body-gap: 9px;
  --chat-short-row-gap: 8px;
  --chat-short-key-width: 44px;
  --chat-short-row-font: var(--fw-semibold) 14px/1.4 var(--font-sans);
  --chat-short-rule-margin: 3px 0;
  --chat-short-price-gap: 8px;
  --chat-short-price-padding: 12px;
  --chat-short-button-height: 40px;
  --chat-short-free-font: var(--fw-semibold) 16px/1 var(--font-sans);

  /* 콘텐츠 상세 본문.dc.html:30-132 · 책 상세 본문.dc.html:25-91. */
  --chat-detail-background: var(--aura-background-bg);
  --chat-book-cover-theory: linear-gradient(160deg, color-mix(in srgb,var(--blossom-200) 70%,var(--paper-50)), color-mix(in srgb,var(--ink-200) 60%,var(--paper-50)));
  --chat-book-cover-guide: linear-gradient(160deg, color-mix(in srgb,var(--mist-300) 55%,var(--paper-50)), color-mix(in srgb,var(--ink-200) 60%,var(--paper-50)));
  --chat-content-hero-ratio: 16 / 10;
  --chat-content-hero-background: linear-gradient(150deg,var(--blossom-200),var(--mist-300));
  --chat-content-hero-shade: linear-gradient(to top,color-mix(in srgb,var(--ink-900) 78%,transparent),color-mix(in srgb,var(--ink-900) 42%,transparent) 55%,transparent);
  --chat-content-hero-title-padding: 56px var(--gutter) 18px;
  --chat-content-title-font: var(--fw-bold) 24px/1.35 var(--font-serif);
  --chat-content-plain-title-padding: 68px var(--gutter) 0;
  --chat-content-body-padding: 20px var(--gutter) 0;
  --chat-content-body-gap: 20px;
  --chat-content-scroll-bottom: 112px;
  --chat-content-back-inset: 12px;
  --chat-content-chapter-panel-padding: 8px 18px 6px;
  --chat-content-chapter-heading-height: 44px;
  --chat-content-chapter-row-height: 52px;
  --chat-content-chapter-label-width: 48px;
  --chat-content-chapter-item-padding: 0 0 16px 58px;
  --chat-content-shelf-panel-padding: 8px 18px;
  --chat-content-shelf-overhang: 18px;
  --chat-content-shelf-track-padding: 2px 18px 12px;
  --chat-content-shelf-tile-width: 112px;
  --chat-content-shelf-tile-padding: 14px 10px 12px;
  --chat-content-shelf-cover-width: 58px;
  --chat-content-shelf-cover-height: 78px;
  --chat-content-shelf-book-label-width: 15px;
  --chat-content-shelf-drawn-font: var(--fw-bold) 9px/1 var(--font-serif);
  --chat-content-shelf-title-font: var(--fw-bold) 14.5px/1.3 var(--font-serif);
  --chat-content-footer-padding: 12px var(--gutter) calc(var(--gutter) + 2px);
  --chat-content-toast-bottom: 92px;
  --chat-content-chrome-rise: 14px;
  --chat-content-bg-in: 320ms;
  --chat-content-chrome-delay-from-card: 180ms;
  --chat-content-chrome-delay-plain: 60ms;
  --chat-content-chrome-out: 160ms;
  --chat-content-bg-out: 380ms;
  --chat-content-bg-out-delay: 80ms;
  --chat-content-flip-out: 440ms;
  --chat-book-flip-out: 440ms;
  --chat-book-ghost-timeout: 700ms;
  --chat-book-heading-padding: 12px 12px 6px;
  --chat-book-scroll-padding: 22px var(--gutter) 24px;
  --chat-book-scroll-gap: 22px;
  --chat-book-hero-width: 112px;
  --chat-book-hero-height: 152px;
  --chat-book-hero-radius: 3px 8px 8px 3px;
  --chat-book-description-padding: 18px 20px;
  --chat-book-description-font: var(--fw-regular) 15.5px/1.82 var(--font-serif);
  --chat-book-title-font: var(--fw-bold) 28px/1.25 var(--font-serif);
  --chat-book-fortune-track-padding: 2px 28px 6px;
  --chat-book-fortunes-gap: 10px;
  --chat-book-empty-padding: 32px var(--gutter);
  --chat-book-empty-icon-size: 32px;
  --chat-book-large-stitch-inset: 14px;
  --chat-book-large-label-width: 32px;
  --chat-book-large-label-font: var(--fw-bold) 18px/1 var(--font-serif);
}

/* 5-1-1 방 입장 — 입장 베일(AI 캐릭터 채팅.dc.html:223-233)·방 머리(:184-192)·비행(:38)·시간표(:2059-2064)·출발 폴백(:1696-1697). */
:root {
  --chat-room-veil-z: 36;
  --chat-room-veil-background: color-mix(in srgb,#FFFDF9 44%,transparent);
  --chat-room-avatar-size: 56px;
  --chat-room-avatar-initial-font: var(--fw-bold) 22px/1 var(--font-serif);
  --chat-room-veil-avatar-top: 96px;
  --chat-room-veil-note-top: 176px;
  --chat-room-veil-note-gap: 12px;
  --chat-room-veil-note-font: var(--fw-regular) 16px/1.5 var(--font-serif);
  --chat-room-head-gap: 7px;
  --chat-room-head-padding: 10px 20px 6px;
  --chat-room-head-name-font: var(--fw-semibold) 15px/1.3 var(--font-sans);
  --chat-room-veil-in: 300ms;
  --chat-room-veil-out: 340ms;
  --chat-room-veil-fly: 620ms;
  --chat-room-veil-initial-delay: 460ms;
  --chat-room-veil-note-delay: 560ms;
  --chat-room-veil-settle: 1680ms;
  --chat-room-enter-elapsed: 0ms;
  --chat-room-leave-elapsed: 0ms;
  --chat-room-fly-from-radius: 26px;
  --chat-room-fly-fallback-height: 272px;
  --chat-room-fly-fallback-min-width: 120px;
  --chat-room-fly-from-left: var(--chat-teller-inset);
  --chat-room-fly-from-top: var(--chat-teller-inset);
  --chat-room-fly-from-width: max(var(--chat-room-fly-fallback-min-width),calc(var(--chat-full) - var(--chat-teller-inset) * 2));
  --chat-room-fly-from-height: var(--chat-room-fly-fallback-height);
  --chat-status-spinner-duration: 720ms;
  --chat-room-move-gap: 10px;
  --chat-composer-failed-border: 1px solid rgba(169,58,50,.34);
  --chat-status-cancelled-background: rgba(255,253,249,.62);
  --chat-dialog-pop-from-scale: .94;
  --chat-dialog-enter-elapsed: 0ms;
  --track-off: color-mix(in srgb,var(--ink-900) 12%,transparent);
  --chat-letter-caret-width: 2px;
  --chat-letter-caret-height: 15px;
  --chat-letter-caret-gap: 2px;
  --chat-letter-caret-offset: -2px;
}

/* 6-3-9 대체 화면의 제품 좌표 — 동결 04:29 프레임을 viewport 모드로 정규화. */
:root {
  --chat-replacement-content-offset: 41px;
  --chat-unavailable-nav-slot-height: 74px;
  --chat-replacement-header-capsule-size: 52px;
  --chat-absence-avatar-font: var(--fw-semibold) 13px/1 var(--font-serif);
  --border-success: color-mix(in srgb,var(--jade-500) 40%,transparent);
  --border-info: color-mix(in srgb,var(--mist-500) 42%,transparent);
}

/* 19:37 관계인 화면: 프레임 하단 등록 버튼·Toast·Dialog의 원본 좌표와 적층. */
:root {
  --related-floating-bottom: calc(var(--safe-bottom) * .4 + 14px);
  --related-toast-z: 50;
  --related-dialog-z: 60;
  --related-row-disc-size: 36px;
  --related-row-icon-size: 18px;
  --related-empty-copy-max: 260px;
  --related-detail-field-gap: 14px;
  --related-detail-label-width: 62px;
  --related-delete-disc-size: 52px;
  --related-delete-disc-gap: 14px;
  --related-failure-button-inline-padding: 22px;
  --surface-muted: color-mix(in srgb,var(--ink-900) 6%,transparent);
  --danger-soft: color-mix(in srgb,var(--seal-400) 16%,transparent);
}

/* 6-3-10 안내인 화면: design-ref-20260930-0321의 전담 안내인 화면.dc.html,
   _ds/tokens/*.css와 _ds_bundle.js의 실제 소비값. 기존 전역 토큰은 유지하고
   원본과 다른 값은 안내인 root의 source alias로만 소비한다(design-spec §8·§10). */
:root {
  /* DS colors.css --bg-app, glass.css --glass-tint-bar, layout.css --appbar-h. */
  --employee-choice-source-bg-app: radial-gradient(122% 84% at 6% -8%, color-mix(in srgb,#DF9095 28%,transparent) 0%, transparent 58%),radial-gradient(104% 72% at 98% -4%, color-mix(in srgb,#D3B87F 40%,transparent) 0%, transparent 56%),radial-gradient(98% 70% at 92% 102%, color-mix(in srgb,#6C8298 46%,transparent) 0%, transparent 62%),radial-gradient(86% 58% at 2% 98%, color-mix(in srgb,#98444E 14%,transparent) 0%, transparent 60%),radial-gradient(64% 44% at 48% 44%, color-mix(in srgb,#FFFDF9 92%,transparent) 0%, transparent 74%),linear-gradient(168deg,#FBF8F2 0%,#EFE9DE 54%,#E6DFD2 100%);
  --employee-choice-source-glass-tint-bar: color-mix(in srgb,#FFFDF9 18%,transparent);
  --employee-choice-source-appbar-h: 52px;

  /* GUIDE37·51·157~158·244~258: 프레임·무대·카드 강조. */
  --employee-choice-source-full: 100%;
  --employee-choice-source-opacity-hidden: 0;
  --employee-choice-source-opacity-visible: 1;
  --employee-choice-source-media-z: 1;
  --employee-choice-source-stage-clip: inset(-240px 0 -240px 0);
  --employee-choice-source-card-ratio: 3 / 4;
  --employee-choice-source-card-active-scale: 1;
  --employee-choice-source-card-side-scale: .84;
  --employee-choice-source-card-side-opacity: .92;
  --employee-choice-source-card-ring: 0 0 0 3px color-mix(in srgb,var(--accent) 30%,transparent);

  /* image-slot.js292·294~295·327~328·428: read-only 빈 이미지 자리.
     크기13/간격6/패딩12/굵기500은 --fs-caption/--space-3/--space-5/--fw-medium 재사용.
     원본 자간 .01em은 --ls-caption(0)과 다르므로 별도 source alias다. */
  --employee-choice-source-slot-font-family: system-ui,-apple-system,sans-serif;
  --employee-choice-source-slot-line-height: 1.3;
  --employee-choice-source-slot-fill: rgba(127,127,127,.08);
  --employee-choice-source-slot-caption-opacity: .75;
  --employee-choice-source-slot-icon-opacity: .45;
  --employee-choice-source-slot-caption-max-width: 90%;
  --employee-choice-source-slot-caption-letter-spacing: .01em;
  --employee-choice-source-slot-icon-size: 28px;
  /* image-slot.js334~335: 빈 이미지 자리의 점선과 전환. */
  --employee-choice-source-slot-ring-border: 1.5px dashed currentColor;
  --employee-choice-source-slot-ring-opacity: .35;
  --employee-choice-source-slot-ring-transition: border-color .12s,opacity .12s;

  /* GUIDE269~272: 가운데와 옆 카드의 베일은 별도 효과 조합이다. */
  --employee-choice-source-veil-z: 2;
  --employee-choice-source-veil-center-background: linear-gradient(to top, color-mix(in srgb,var(--gold-400) 34%,transparent) 0%, color-mix(in srgb,var(--ink-950) 84%,transparent) 6%, color-mix(in srgb,var(--ink-950) 92%,transparent) 100%);
  --employee-choice-source-veil-center-filter: blur(8px) saturate(50%);
  --employee-choice-source-veil-side-background: color-mix(in srgb,var(--ink-900) 40%,transparent);
  --employee-choice-source-veil-side-filter: blur(1.5px) saturate(72%);
  --employee-choice-source-veil-open-offset: -101%;

  /* GUIDE43~45·75~95·300~310: 제목·밴드·닷·form의 원본 scalar. */
  --employee-choice-source-heading-size: 23px;
  --employee-choice-source-heading-compact-size: 19px;
  --employee-choice-source-gap-top: 12px;
  --employee-choice-source-gap-bottom: 18px;
  --employee-choice-source-name-size: 23px;
  --employee-choice-source-band-padding: 10px var(--gutter) 2px;
  --employee-choice-source-dot-block-gap: 9px;
  --employee-choice-source-dot-hit: 26px;
  --employee-choice-source-dot-active-width: 18px;
  --employee-choice-source-dot-radius: 3px;
  --employee-choice-source-dot-idle-background: rgba(31,28,24,.16);
  --employee-choice-source-gap-control: 10px;
  --employee-choice-source-submit-bottom: calc(var(--gutter) + 8px);

  /* DS Button492~558·IconButton633~731의 lg/plain-md variant. */
  --employee-choice-source-button-height: 56px;
  --employee-choice-source-button-padding: 28px;
  --employee-choice-source-button-line-height: 1;
  --employee-choice-source-button-disabled-opacity: .42;
  --employee-choice-source-icon-button-size: 40px;
  --employee-choice-source-icon-button-icon-size: 19px;
  --employee-choice-source-icon-button-radius: 50%;

  /* DS Toast1459~1479, GUIDE29: 원본 floating 위치·패딩·등장 이동. */
  --employee-choice-source-toast-padding: 10px 16px;
  --employee-choice-source-toast-bottom: calc(var(--tabbar-h) + 18px);
  --employee-choice-source-toast-icon-size: 18px;
  --employee-choice-source-toast-rise: 8px;

  /* GUIDE28·163·258·264·269~282: m1~m4·m9의 원본 시간. */
  --duration-employee-choice-track: 520ms;
  --duration-employee-choice-emphasis: 320ms;
  --duration-employee-choice-breath: 12s;
  --duration-employee-choice-veil: 880ms;
  --duration-employee-choice-close: 420ms;
  --duration-employee-choice-opacity: 240ms;
  --duration-employee-choice-video: 420ms;
}

/* 5-1-6 정보 확인 카드.dc.html:34/44~55/75 — 요청 카드의 원본 부모 literal. */
:root {
  --chat-input-row-bg: rgba(255,253,249,.88);
  --chat-input-row-hover: rgba(255,253,249,.98);
  --chat-input-panel-bg: rgba(255,253,249,.92);
  --chat-input-row-min: 44px;
  --chat-input-row-px: 14px;
  --chat-input-label-basis: 92px;
  --chat-input-panel-pad: 12px;
  --chat-input-gap: 10px;
  --chat-input-heading-font: 14px;
  --chat-input-heading-weight: 600;
  --chat-input-heading-lh: 1.3;
  /* _ds_bundle.js:333/1513/1541 — Badge sm·Checkbox의 실제 치수. */
  --chat-input-edited-height: 22px;
  --chat-input-checkbox-size: 22px;
  --chat-input-checkbox-radius: 7px;
  /* _ds_bundle.js:1227/1239/1294 — continuous 트랙과 부모·fill의 전체 치수. */
  --chat-input-progress-height: 6px;
  --chat-input-progress-full: 100%;
  /* 승인 §8·§9의 모션 이름 — 기존 duration과 감속 선호 값을 그대로 참조한다. */
  --duration-control: var(--dur-fast);
  --duration-normal: var(--dur-base);
}

/* 5-1-6 23:03 보강: AI 캐릭터 채팅.dc.html:1243/1313의 값·오류 상태. */
:root {
  --chat-input-invalid-ring: 3px;
  --chat-input-error-gap: 5px;
  --chat-input-error-mt: -4px;
  --chat-input-error-icon-mt: 3px;
  --chat-input-value-min: 42px;
  --chat-input-value-py: 11px;
  /* 정보 확인 카드.dc.html:189/194 — 저장 실패·성공 Toast의 원본 적층. */
  --chat-input-toast-z: 5;
  /* AI 캐릭터 채팅.dc.html:1243 — M 제목·보기의 실제 서체와 표식. */
  --chat-input-value-label-font: var(--fw-semibold) 12.5px/1 var(--font-sans);
  --chat-input-value-pill-font: var(--fw-medium) 12.5px/1 var(--font-sans);
  --chat-input-value-list-font: var(--fw-medium) 13.5px/1.5 var(--font-sans);
  --chat-input-value-choice-px: 13px;
  --chat-input-value-mark-size: 18px;
  --chat-input-value-dot-size: 9px;
  --chat-input-value-mark-radius: 5px;
  --chat-input-value-mark-mt: 1px;
  --chat-input-value-mark-bg: rgba(255,253,249,.9);
}

/* 5-1-6 D 정정 Badge outline — 동결 DS tokens/colors.css:107. */
:root {
  --chat-input-badge-border-danger: color-mix(in srgb,var(--seal-500) 40%,transparent);
}

/* 5-1-6 최종 Source 대조 — 요청 카드의 원본 전체 값만 등록. */
:root {
  /* D 편집 panel: 정보 확인 카드.dc.html:63·116·159. */
  --chat-input-panel-border: 1px solid var(--blossom-300);
  /* M 선택·거절: AI 캐릭터 채팅.dc.html:1243·1313. danger = text-danger. */
  --chat-input-value-mark-border: 1px solid var(--border-strong);
  --chat-input-value-invalid-border: 1px solid var(--text-danger);
  /* Select: 동결 _ds_bundle.js:2735·2736·2953. */
  --chat-input-select-height: 52px;
  --chat-input-select-padding: 0 18px;
  --chat-input-select-option-padding: 9px 12px;
  /* Boolean thumb: _ds_bundle.js:1653 + tokens/colors.css:102. */
  --chat-input-boolean-thumb-border-color: color-mix(in srgb,var(--accent) 45%,transparent);
  /* N 궁합 묶음·행: AI 캐릭터 채팅.dc.html:1261. */
  --chat-input-summary-pair-background: rgba(31,28,24,.035);
  --chat-input-summary-person-min-height: 30px;
  --chat-input-summary-role-letter-spacing: .04em;
  /* N 항목 폭·지난 답: AI 캐릭터 채팅.dc.html:1257·1261·1263·1265. */
  --chat-input-summary-label-basis: 116px;
  --chat-input-summary-pair-label-basis: 104px;
  --chat-input-summary-previous-font: var(--fw-medium) 10.5px/1 var(--font-sans);
}

/* 5-1-6 D 정정 부제: AI 캐릭터 채팅.dc.html:1125. */
:root {
  --chat-input-correction-subheading-font: var(--fw-semibold) var(--fs-caption)/1.3 var(--font-sans);
}