/* ── type_page.php 전용 CSS ── */
#typePageBody { font-family:'Inter',sans-serif; }

/* 빵부스러기 링크 호버 */
.breadcrumb a:hover { color:#7c3aed; }

/* 타입 히어로 (배경색은 인라인 --tc 변수로 제어) */
.type-hero {
    border-radius:20px; padding:28px 24px; margin-bottom:20px; color:#fff;
}
.type-hero-badge  { font-size:11px; font-weight:700; background:rgba(255,255,255,.2); padding:3px 10px; border-radius:99px; display:inline-block; margin-bottom:12px; letter-spacing:.06em; }
.type-hero-top    { display:flex; align-items:center; gap:16px; margin-bottom:10px; }
.type-hero-emoji  { font-size:40px; }
.type-hero-name   { font-size:36px; font-weight:900; letter-spacing:.04em; line-height:1; }
.type-hero-label  { font-size:16px; font-weight:600; opacity:.85; margin-top:4px; }
.type-hero-desc   { font-size:14px; opacity:.8; line-height:1.6; }

/* 섹션 제목 */
.section-title       { padding:16px 20px 0; font-size:13px; font-weight:700; color:#0f172a; display:flex; align-items:center; gap:8px; }
.section-title span  { font-size:16px; }

/* 운세 헤더 */
.fortune-header       { padding:20px; border-bottom:1px solid #f1f5f9; }
.fortune-date-badge   { font-size:11px; font-weight:700; color:#7c3aed; background:#f5f3ff; padding:3px 10px; border-radius:99px; display:inline-block; margin-bottom:8px; }
.fortune-title        { font-size:18px; font-weight:800; color:#0f172a; margin-bottom:8px; }
.fortune-content      { font-size:14px; color:#374151; line-height:1.8; }

/* 행운 카드 그리드 */
.lucky-grid     { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; padding:16px 20px; }
.lucky-card     { background:#f8fafc; border-radius:12px; padding:14px 10px; text-align:center; }
.lucky-card-lbl { font-size:10px; font-weight:700; color:#94a3b8; text-transform:uppercase; letter-spacing:.07em; margin-bottom:8px; }
.lucky-card-val { font-size:15px; font-weight:800; color:#1e293b; line-height:1.3; }

/* 궁합 리스트 */
.compat-row        { display:flex; align-items:center; gap:12px; padding:10px 20px; border-bottom:1px solid #f8fafc; }
.compat-row:last-child { border-bottom:none; }
.compat-type-badge { font-size:13px; font-weight:800; width:44px; height:44px; border-radius:10px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.compat-bar-wrap   { flex:1; }
.compat-level      { font-size:11px; font-weight:700; padding:2px 8px; border-radius:99px; white-space:nowrap; flex-shrink:0; }

/* 전체 타입 링크 그리드 */
.types-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; padding:16px 20px; }
.type-link {
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    padding:10px 6px; border-radius:10px; border:1.5px solid #e2e8f0;
    text-decoration:none; transition:.15s; background:#fff;
}
.type-link:hover        { border-color:var(--tc); background:#fafbff; transform:translateY(-1px); }
.type-link.current      { border-color:var(--tc); background:var(--tc); }
.type-link .tl-name     { font-size:12px; font-weight:800; color:#374151; }
.type-link .tl-label    { font-size:10px; color:#94a3b8; margin-top:2px; }
.type-link.current .tl-name,
.type-link.current .tl-label { color:#fff; }