/* ============================================================================
   BASTILLE MANSION — DESIGN TOKENS  (정본 v2, claude.ai/design 핸드오프 2026-07-19)
   레거시 변수 호환 드롭인 — 기존 대시보드 변수명을 그대로 재값화.
   ============================================================================ */

:root {
  /* ---- LEGACY COMPAT (mansion-current) — do not rename -------------- */
  --bg:        #1a120f;
  --panel:     #2d1e18;
  --border:    #3d2e24;
  --accent:    #c5a059;
  --accent2:   #135bec;
  --warn:      #e8833a;
  --danger:    #f43f5e;
  --text:      #ece3d6;
  --muted:     #9a8f7d;
  --code:      #1f1512;
  --radius:    10px;
  --font:      'Pretendard','Pretendard Variable',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,'Malgun Gothic',sans-serif;
  --mono:      'JetBrains Mono',ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;

  --ok:          #10b981;
  --gold-bright: #d4af37;
  --on-accent:   #1a120f;

  --serif-chosun: 'Chosun Centennial','Nanum Myeongjo',Georgia,'Batang',serif;
  --serif-heir:   'Heir of Light','Chosun Centennial',Georgia,'Batang',serif;
  --font-serif:   var(--serif-chosun);

  /* Espresso surfaces */
  --espresso-950: #140d0a;
  --espresso-900: #1a120f;
  --espresso-850: #201510;
  --espresso-800: #241813;
  --espresso-700: #2d1e18;
  --espresso-600: #3d2e24;
  --espresso-500: #4d3a2d;

  /* Gold ramp */
  --gold-deep:    #8a6d3b;
  --gold:         #c5a059;
  --gold-bright-2:#d4af37;
  --gold-pale:    #e6cf96;

  /* Functional */
  --primary:      #135bec;
  --primary-600:  #3b78f0;
  --primary-700:  #0f49bd;
  --success:      #10b981;
  --success-alt:  #0bda5e;
  --warning:      #e8b339;
  --danger-color: #f43f5e;
  --info:         #60a5fa;

  /* Text ramp */
  --text-strong:  #f7f1e6;
  --text-body:    #ece3d6;
  --text-muted:   #9a8f7d;
  --text-faint:   #6d6353;
  --on-gold:      #1a120f;
  --on-primary:   #ffffff;

  /* Translucent overlays */
  --tint-gold-08:  rgba(197,160,89,.08);
  --tint-gold-12:  rgba(197,160,89,.12);
  --tint-gold-20:  rgba(197,160,89,.20);
  --tint-gold-40:  rgba(197,160,89,.40);
  --tint-primary-10: rgba(19,91,236,.10);
  --tint-primary-20: rgba(19,91,236,.20);
  --tint-danger-12:  rgba(244,63,94,.12);
  --white-05: rgba(255,255,255,.05);
  --white-08: rgba(255,255,255,.08);
  --white-10: rgba(255,255,255,.10);
  --white-20: rgba(255,255,255,.20);

  /* Hairlines */
  --hairline:        rgba(197,160,89,.20);
  --hairline-strong: rgba(197,160,89,.50);
  --hairline-neutral:rgba(255,255,255,.10);

  /* Gradients & texture */
  --grad-gold-ribbon: linear-gradient(90deg,#8a6d3b 0%,var(--gold-bright-2) 50%,#8a6d3b 100%);
  --grad-bg-radial: radial-gradient(circle at 50% 0%, #3a2922 0%, var(--bg) 78%);
  --wood-base:    #2a1d16;
  --wood-base-2:  #34241a;
  --leather-base: #2d1e18;
  --leather-base-2:#241813;
  --grad-glossy:    linear-gradient(180deg, rgba(255,255,255,.08) 0%, rgba(255,255,255,0) 55%, rgba(0,0,0,.10) 100%);
  --grad-glossy-blue: linear-gradient(180deg, rgba(255,255,255,.30) 0%, rgba(255,255,255,0) 60%), var(--primary);
  --grad-card:      linear-gradient(180deg, #2d1e18 0%, #241813 100%);

  /* Typography */
  --font-sans:  var(--font);
  --font-mono:  var(--mono);
  --fs-micro:  10px;
  --fs-2xs:    11px;
  --fs-xs:     12px;
  --fs-sm:     13px;
  --fs-base:   14px;
  --fs-md:     16px;
  --fs-lg:     18px;
  --fs-xl:     22px;
  --fs-2xl:    28px;
  --fs-3xl:    32px;
  --lh-tight:  1.15;
  --lh-snug:   1.35;
  --lh-body:   1.55;
  --fw-light:   300;
  --fw-normal:  400;
  --fw-medium:  500;
  --fw-semibold:600;
  --fw-bold:    700;
  --fw-black:   800;
  --tracking-micro: 0.2em;
  --tracking-wide:  0.12em;
  --tracking-caps:  0.05em;

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

  /* Radius */
  --r-xs: 4px; --r-sm: 6px; --r-md: 10px; --r-lg: 14px; --r-xl: 20px; --r-full: 9999px;

  /* Shadow / elevation */
  --shadow-card:   0 4px 20px rgba(0,0,0,.40);
  --shadow-inset:  inset 0 1px 0 rgba(255,255,255,.06);
  --shadow-modal:  0 20px 60px rgba(0,0,0,.65);
  --shadow-glow-primary: 0 0 15px rgba(19,91,236,.40);
  --shadow-glow-gold:    0 0 10px rgba(212,175,55,.30);
  --shadow-glow-success: 0 0 8px rgba(16,185,129,.55);
  --bloom-gold:   0 8px 28px rgba(197,160,89,.30), 0 2px 10px rgba(212,175,55,.22);
  --bloom-blue:   0 8px 30px rgba(19,91,236,.38),  0 2px 12px rgba(19,91,236,.28);
  --bloom-rose:   0 8px 30px rgba(244,63,94,.34),  0 2px 12px rgba(244,63,94,.24);
  --bloom-emerald:0 8px 28px rgba(16,185,129,.34), 0 2px 12px rgba(16,185,129,.24);
  --sheen-gold: radial-gradient(120% 80% at 25% -10%, rgba(230,207,150,.35) 0%, rgba(197,160,89,.10) 32%, transparent 60%);
  --sheen-blue: radial-gradient(120% 80% at 25% -10%, rgba(122,166,245,.40) 0%, rgba(19,91,236,.12) 32%, transparent 60%);

  /* Motion */
  --ease-standard: cubic-bezier(.4,0,.2,1);
  --ease-out:      cubic-bezier(0,0,.2,1);
  --dur-fast:  120ms;
  --dur-base:  180ms;
  --dur-slow:  300ms;

  /* Z-index */
  --z-base: 0; --z-sticky: 50; --z-nav: 60; --z-fab: 70;
  --z-overlay: 100; --z-modal: 110; --z-toast: 120;

  /* Iconography (Material Symbols Outlined) */
  --icon-fill: 0; --icon-wght: 300; --icon-grad: 0; --icon-opsz: 24;
}

[data-display="heir"]  { --font-serif: var(--serif-heir); }
[data-display="chosun"]{ --font-serif: var(--serif-chosun); }

.material-symbols-outlined {
  font-variation-settings: 'FILL' var(--icon-fill), 'wght' var(--icon-wght), 'GRAD' var(--icon-grad), 'opsz' var(--icon-opsz);
  font-size: 22px;
  line-height: 1;
  user-select: none;
}
.material-symbols-outlined.is-filled { font-variation-settings: 'FILL' 1, 'wght' var(--icon-wght); }

/* ── Risk palette — 고위험=크림슨, 주의=앰버, 정상=그린, 행동/브랜드=골드 ── */
:root{ --crimson:#b8383b; --crimson-bright:#d95c55; --crimson-deep:#7e2427; --tint-crimson-10:rgba(184,56,59,.10); }

/* ── Question cards — 전 타입 중립(에스프레소+골드 헤어라인) ── */
:root{
  --qcard-pad: 15px 18px;
  --qcard-radius: var(--r-lg);
  --qcard-gap: 10px;
  --qcard-title-size: 15px;
  --qcard-body-size: 13.5px;
  --qcard-note-size: 12px;
  --qcard-expiry-color: var(--text-faint);
  --qcard-answered-opacity: .82;
  --qcard-expired-opacity: .55;
  --qcard-urgent-hairline: var(--hairline-strong);
}
