/* ===== Reset ===== */
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Noto Sans KR',sans-serif;background:#f5f5f5;color:#333;font-size:14px;line-height:1.4;-webkit-font-smoothing:antialiased}
:root{
    --chart-label-col:64px;
    --fortune-label-col:68px;
    --fortune-card-pad-top:14px;
    --fortune-header-row:22px;
    --fortune-tengod-row:18px;
    --fortune-pill-row:52px;
    --fortune-meta-row:18px;
}

/* ===== Container ===== */
.app-container{max-width:420px;margin:0 auto;background:transparent;min-height:100vh}
.screen{display:none}
.screen.active{display:block}

/* ===== Input Screen ===== */
#input-screen{min-height:100vh;background:#f0f0f0;padding:24px 16px}
#input-screen.active{display:flex;flex-direction:column;justify-content:center}

.logo-section{text-align:center;margin-bottom:36px}
.logo-icon{width:80px;height:80px;margin:0 auto -4px;display:flex;align-items:center;justify-content:center}
.logo-icon img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 4px 15px rgba(0,0,0,0.15))}
/* 로고 애니메이션 제거됨 */
.logo-title{font-size:22px;font-weight:700;color:#1a1a2e;letter-spacing:1px;margin-bottom:2px;margin-top:0}
.logo-subtitle{font-size:11px;color:#666}

/* ===== Form ===== */
.input-wrapper{width:100%;max-width:420px;margin:0 auto}
.saju-form{background:rgba(255,255,255,0.97);border-radius:16px;padding:20px 16px;box-shadow:0 12px 40px rgba(0,0,0,0.25)}
.form-group{margin-bottom:14px}
.form-group label{display:block;font-size:11px;font-weight:600;color:#444;margin-bottom:5px}
.form-group label .optional{font-weight:400;color:#999;font-size:10px}
.form-group input[type="text"]{width:100%;padding:10px 12px;border:1.5px solid #e0e0e0;border-radius:8px;font-size:14px;background:#fff;transition:all 0.2s}
.form-group input:focus{outline:none;border-color:#22c55e;box-shadow:0 0 0 2px rgba(34,197,94,0.1)}

/* Date/Time Inputs */
.date-input-row{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:6px}
.date-field,.time-field{position:relative}
.date-field input,.time-field input{width:100%;padding:10px 8px;padding-right:22px;border:1.5px solid #e0e0e0;border-radius:8px;font-size:14px;text-align:center}
.date-field input:focus,.time-field input:focus{outline:none;border-color:#22c55e}
.field-label{position:absolute;right:10px;top:50%;transform:translateY(-50%);font-size:15px;color:#555;pointer-events:none;font-weight:600}
.time-input-row{display:flex;align-items:center;gap:4px}
.time-input-row .time-field{flex:1}
.time-separator{font-size:16px;font-weight:600;color:#999}
.input-hint{font-size:10px;color:#999;margin-top:4px}
.error-msg{font-size:11px;color:#e53935;margin-top:4px;min-height:16px;font-weight:500;display:none}
.error-msg.show{display:block}
.date-field input.error,.time-field input.error{border-color:#e53935;background:#fff5f5}
.time-info{display:none;margin-top:6px;padding:6px 10px;background:#f0f7ff;border-radius:6px;font-size:10px;color:#1976d2}
.time-info i{margin-right:4px}

/* Buttons */
.gender-buttons,.calendar-toggle{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.gender-btn,.cal-btn{padding:10px;border:1.5px solid #e0e0e0;border-radius:8px;background:#fff;font-size:12px;font-weight:500;color:#666;cursor:pointer;transition:all 0.2s}
.gender-btn i{margin-right:4px}
.gender-btn.active[data-gender="female"]{border-color:#e94560;background:linear-gradient(135deg,#fff5f7,#ffe8ec);color:#e94560}
.gender-btn.active[data-gender="male"]{border-color:#3b82f6;background:linear-gradient(135deg,#eff6ff,#dbeafe);color:#3b82f6}
.cal-btn.active{border-color:#22c55e;background:linear-gradient(135deg,#f0fdf4,#dcfce7);color:#22c55e}
.submit-btn{width:100%;padding:12px;background:#1a1a2e;border:none;border-radius:10px;font-size:14px;font-weight:600;color:#fff;cursor:pointer;margin-top:6px;transition:all 0.2s}
.submit-btn:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(26,26,46,0.35)}
.submit-btn i{margin-right:6px}

/* ===== Result Screen (Toss Style) ===== */
#result-screen{background:#f2f4f6;display:none}
#result-screen.active{display:block}
.result-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:#fff;position:sticky;top:0;z-index:100;border-bottom:1px solid #f0f0f0}
.back-btn,.copy-btn{width:36px;height:36px;border:none;background:transparent;font-size:16px;color:#191f28;cursor:pointer;border-radius:50%;display:flex;align-items:center;justify-content:center}
.copy-btn:active,.back-btn:active{background:#f2f4f6}
.header-title{font-size:17px;font-weight:700;color:#191f28}

/* User Info - Toss 카드 스타일 */
.user-info-result{display:flex;align-items:center;padding:20px 16px 16px;background:#fff;margin-bottom:8px}
.user-avatar{width:52px;height:52px;border-radius:50%;background:#f2f4f6;display:flex;align-items:center;justify-content:center;margin-right:12px;border:1px solid #e8ebef;overflow:hidden;box-shadow:inset 0 1px 0 rgba(255,255,255,0.75)}
.user-avatar i{font-size:20px;color:#6b7684}
.user-avatar.has-animal{background:transparent;border-color:#f1e6c7}
.user-avatar img{width:100%;height:100%;display:block;object-fit:cover}
.user-details{flex:1}
.user-details h3{font-size:20px;font-weight:700;color:#191f28;margin-bottom:3px}
.user-details p{font-size:13px;color:#8b95a1}
.result-age{margin-top:2px;color:#8b95a1!important;font-size:12px!important;font-weight:400!important}

/* ===== Saju Chart - Toss Chip Style ===== */
.saju-chart-section{background:#fff;margin:0 0 8px;padding:16px 12px;box-shadow:none;border-bottom:8px solid #f2f4f6}
.chart-title{font-size:15px;font-weight:700;color:#191f28;margin-bottom:12px;display:flex;align-items:center;justify-content:space-between}
.chart-title i{margin-right:6px;color:#3182f6;font-size:11px}
.ilgan-info{font-size:11px;font-weight:600;color:#3182f6;background:#eff6ff;padding:4px 10px;border-radius:20px}

.saju-chart{width:100%}
.chart-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-bottom:6px;align-items:center}
.chart-cell{text-align:center}
.row-label{font-size:11px;color:#6b7684;font-weight:700;display:flex;align-items:center;justify-content:center;padding:0 8px;text-align:center;white-space:nowrap;min-height:18px;border-radius:999px;background:linear-gradient(180deg,#fbfcfe 0%,#f3f6fa 100%);border:1px solid #eef2f6;box-shadow:inset 0 1px 0 rgba(255,255,255,0.85);letter-spacing:-0.03em;line-height:1.05;font-variant-numeric:tabular-nums}
.row-label.for-header{min-height:20px;background:transparent;border:none;box-shadow:none}
.row-label.for-tengod{min-height:20px}
.row-label.for-header{min-height:18px}
.row-label.for-tengod{min-height:18px}
.row-label.for-element{min-height:56px}
.row-label.for-hidden{min-height:30px}
.row-label.for-unseong{min-height:24px}
.row-label.for-sinsal{min-height:24px}
.row-label.for-napeum{min-height:24px}
.header-cell{font-size:12px;color:#8b95a1;padding:2px 0;font-weight:600;min-height:18px;display:flex;align-items:center;justify-content:center}
.tengod-cell{font-size:11px;color:#3182f6;padding:2px 0;font-weight:700;min-height:18px;display:flex;align-items:center;justify-content:center}

/* 칩 스타일 오행 셀 (이미지 참고) */
.element-cell{border-radius:14px;padding:0;min-height:56px;width:100%;aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;max-width:60px;margin:0 auto}
.element-cell.empty{background:#f2f4f6;color:#c4c9d1}
.element-cell .hanja{font-size:22px;font-weight:700;line-height:1;letter-spacing:-1px}
.element-cell .korean{font-size:10px;margin-top:3px;font-weight:600;opacity:0.85}

.element-cell.wood{background:#2d8a4e;color:#fff}
.element-cell.fire{background:#e84040;color:#fff}
.element-cell.earth{background:#f5a623;color:#fff}
.element-cell.metal{background:#8b95a1;color:#fff}
.element-cell.water{background:#1a1a2e;color:#fff}

.hidden-cell{font-size:11px;color:#555;padding:4px 2px;display:flex;flex-wrap:wrap;justify-content:center;gap:5px;min-height:26px;align-items:center}
.hidden-item{padding:0;border-radius:0;font-size:11px;font-weight:700;display:inline-flex;align-items:flex-end;line-height:1;background:none!important}
.hidden-item:not(:last-child)::after{content:'\00B7';margin-left:5px;color:#c2c8d0;font-weight:500}
.hidden-item.wood{color:#2d8a4e}
.hidden-item.fire{color:#d14343}
.hidden-item.earth{color:#b7791f}
.hidden-item.metal{color:#6b7280}
.hidden-item.water{color:#2563b8}
.hidden-item sub{font-size:9px;color:inherit;margin-left:1px;opacity:0.7}

/* 십이운성 */
.unseong-cell{font-size:12px;color:#8b95a1;padding:3px 0;text-align:center;font-weight:600;min-height:20px;display:flex;align-items:center;justify-content:center}
/* 납음 */
.napeum-cell{font-size:11px;color:#8b95a1;padding:2px;text-align:center;font-weight:500}
/* 신살 */
.sinsal-cell{font-size:11px;color:#8b95a1;padding:2px;text-align:center;font-weight:600;min-height:20px;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:2px}
/* 라벨 행 */
.label-row{margin-top:4px}
.label-cell{font-size:11px;color:#8b95a1;font-weight:600;text-align:center;padding:3px 0;background:#f8f9fa;border-radius:4px}
/* 자운성 */
.self-unseong-cell{font-size:11px;color:#6d28d9;padding:2px;text-align:center;font-weight:500}

/* ===== Reading Page Banner ===== */
.reading-page-banner{background:linear-gradient(135deg,#1d4ed8 0%,#3b82f6 100%);padding:20px 20px 16px;text-align:center;color:#fff;display:flex;flex-direction:column;align-items:center;gap:4px}
.rpb-icon{font-size:28px;line-height:1}
.rpb-title{font-size:22px;font-weight:800;letter-spacing:-0.03em;line-height:1.15}
.rpb-sub{font-size:12px;opacity:0.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;margin-top:2px;font-weight:400}

/* ===== Fortune Section (Toss Style) ===== */
.fortune-section{background:#fff;margin:0 0 8px;padding:16px 12px;box-shadow:none;border-bottom:8px solid #f2f4f6}
.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.section-header h3{font-size:15px;font-weight:600;color:#333;display:flex;align-items:center;gap:5px}
.section-header h3{font-size:15px;font-weight:700;color:#191f28}
.section-header h3 i{color:#3182f6;font-size:10px}
.section-desc{font-size:11px;font-weight:400;color:#8b95a1}
.current-badge{font-size:10px;padding:3px 10px;background:#eff6ff;color:#3182f6;border-radius:20px;font-weight:600}
.close-section-btn{width:24px;height:24px;border:none;background:#f2f4f6;border-radius:50%;cursor:pointer;color:#8b95a1;font-size:11px;display:flex;align-items:center;justify-content:center}
.section-subtitle{font-size:12px;color:#8b95a1;margin-bottom:10px}
.fortune-section h3{font-size:15px!important;font-weight:700!important;color:#191f28!important}
.age-basis-info{font-size:11px;color:#8b95a1;margin-bottom:8px}

/* ===== Timeline with Labels ===== */
.timeline-with-labels{display:flex;align-items:flex-start;gap:10px}
.timeline-labels{display:none}
.tl-label{font-size:11px;color:#6b7684;font-weight:700;background:linear-gradient(180deg,#fbfcfe 0%,#f3f6fa 100%);padding:0 10px;text-align:center;width:var(--fortune-label-col);min-width:var(--fortune-label-col);display:flex;align-items:center;justify-content:center;height:17px;margin-bottom:0;white-space:nowrap;border-radius:16px;border:1px solid #eef2f6;box-shadow:inset 0 1px 0 rgba(255,255,255,0.85);letter-spacing:-0.03em;line-height:1.08;font-variant-numeric:tabular-nums}
.tl-label-header{height:var(--fortune-header-row);background:transparent;border:none;box-shadow:none}
.tl-label-tengod{height:var(--fortune-tengod-row)}
.tl-label-stem{height:var(--fortune-pill-row)}
.tl-label-branch{height:var(--fortune-pill-row)}
.tl-label-info{height:var(--fortune-meta-row)}

/* ===== Timeline Common (Toss Chip Style) ===== */
.daeun-scroll-wrapper,.seun-scroll-wrapper,.wolun-scroll-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch;padding:4px 0 8px}
.daeun-timeline,.seun-timeline,.wolun-timeline{display:flex;gap:8px;padding-bottom:4px;min-width:max-content}

.daeun-item,.seun-item,.wolun-item{background:#f8f9fa;border-radius:16px;padding:10px 8px 10px;text-align:center;cursor:pointer;transition:all 0.15s;border:2px solid transparent;min-width:76px;flex-shrink:0;display:grid;grid-template-rows:var(--fortune-header-row) var(--fortune-tengod-row) var(--fortune-pill-row) var(--fortune-pill-row) var(--fortune-tengod-row) var(--fortune-meta-row) var(--fortune-meta-row) var(--fortune-meta-row);row-gap:4px;align-items:center;box-shadow:inset 0 1px 0 rgba(255,255,255,0.8)}
.daeun-item:active,.seun-item:active,.wolun-item:active{transform:scale(0.96)}
.daeun-item.selected,.seun-item.selected,.wolun-item.selected{border-color:#3182f6;background:#eff6ff}

.daeun-age,.seun-year,.wolun-month{font-size:12px;font-weight:800;color:#191f28;height:auto;display:flex;align-items:center;justify-content:center;margin:0;line-height:1.05;letter-spacing:-0.03em}
.seun-age{display:none}
.daeun-tengod,.seun-tengod,.wolun-tengod{font-size:10px;color:#3182f6;font-weight:700;height:auto;display:flex;align-items:center;justify-content:center;line-height:1.1}

/* 타임라인 칩 (대운/세운/월운) */
.daeun-elem,.seun-elem,.wolun-elem{border-radius:14px;padding:5px 0 5px;font-size:16px;font-weight:700;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;height:var(--fortune-pill-row);width:50px;margin:0 auto;box-sizing:border-box;box-shadow:inset 0 1px 0 rgba(255,255,255,0.16)}
.daeun-elem .hanja-char,.seun-elem .hanja-char,.wolun-elem .hanja-char{font-size:20px;font-weight:700;line-height:1;letter-spacing:-0.04em}
.daeun-elem .korean-char,.seun-elem .korean-char,.wolun-elem .korean-char{font-size:10px;font-weight:600;opacity:0.9;line-height:1;letter-spacing:-0.02em}
.daeun-elem.wood,.seun-elem.wood,.wolun-elem.wood{background:#2d8a4e;color:#fff}
.daeun-elem.fire,.seun-elem.fire,.wolun-elem.fire{background:#e84040;color:#fff}
.daeun-elem.earth,.seun-elem.earth,.wolun-elem.earth{background:#f5a623;color:#fff}
.daeun-elem.metal,.seun-elem.metal,.wolun-elem.metal{background:#8b95a1;color:#fff}
.daeun-elem.water,.seun-elem.water,.wolun-elem.water{background:#1a1a2e;color:#fff}

.daeun-branch-tg,.seun-branch-tg,.wolun-branch-tg{font-size:10px;color:#3182f6;font-weight:700;height:auto;display:flex;align-items:center;justify-content:center;line-height:1.1}
.daeun-unseong,.seun-unseong,.wolun-unseong{font-size:9px;color:#8b95a1;font-weight:600;min-height:var(--fortune-meta-row);display:flex;align-items:center;justify-content:center;line-height:1.15;padding:0 2px}
.daeun-sinsal,.seun-sinsal,.wolun-sinsal{font-size:9px;color:#8b95a1;font-weight:600;min-height:var(--fortune-meta-row);display:flex;align-items:center;justify-content:center;line-height:1.15;padding:0 2px;white-space:normal}
.daeun-napeum,.seun-napeum,.wolun-napeum{font-size:9px;color:#8b95a1;font-weight:500;min-height:var(--fortune-meta-row);display:flex;align-items:center;justify-content:center;line-height:1.15;padding:0 2px;white-space:normal}
.daeun-self-un,.daeun-years{font-size:9px;color:#8b95a1;margin-top:1px}
.wolun-elem{border-radius:14px}
.wolun-branch-tg{color:#3182f6}
.wolun-unseong{color:#8b95a1}
.wolun-sinsal{color:#8b95a1}
.wolun-napeum{color:#8b95a1;background:none}

/* ===== Calendar ===== */
.calendar-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.cal-nav-btn{width:28px;height:28px;border:1px solid #e0e0e0;background:#fff;border-radius:50%;cursor:pointer;color:#666;font-size:11px}
.cal-month-title{font-size:13px;font-weight:600}
.calendar-container{border:1px solid #e0e0e0;border-radius:10px;overflow:hidden}

/* 절기 네비게이션 */
.jeolgi-nav{display:flex;justify-content:space-between;background:#f8f9fa;padding:8px 10px;border-bottom:1px solid #eef2f6}
.jeolgi-prev,.jeolgi-current,.jeolgi-next{text-align:center}
.jeolgi-prev{text-align:left}
.jeolgi-next{text-align:right}
.jeolgi-current{flex:1}
.jeolgi-name{display:block;font-size:12px;font-weight:700;color:#374151}
.jeolgi-date{display:block;font-size:10px;color:#8b95a1;margin-top:2px}
.jeolgi-current .jeolgi-name{font-size:14px;color:#191f28;font-weight:800}
.jeolgi-current .jeolgi-date{font-size:11px;color:#6b7684}

.calendar-header{display:grid;grid-template-columns:repeat(7,1fr);background:#fafafa;border-bottom:1px solid #e0e0e0}
.cal-day{padding:10px 0;text-align:center;font-size:13px;font-weight:600;color:#666}
.cal-day.sun{color:#e53935}
.cal-day.sat{color:#1976d2}
.calendar-body{display:grid;grid-template-columns:repeat(7,1fr)}
.cal-cell{padding:6px 4px;text-align:center;border-bottom:1px solid #f0f0f0;border-right:1px solid #f0f0f0;min-height:100px;cursor:pointer;transition:background 0.15s;position:relative}
.cal-cell:nth-child(7n){border-right:none}
.cal-cell:hover{background:#f8f8f8}
.cal-cell.empty{background:#fafafa;cursor:default}
.cal-cell.today{background:#fff;box-shadow:inset 0 0 0 2px #3182f6}
.cal-cell.sun .cal-date{color:#e53935}
.cal-cell.sat .cal-date{color:#1976d2}
/* 절입일 전 표시 */
.cal-cell.before-jeolgi{background:#fafafa}
.cal-cell.before-jeolgi::before{content:'';position:absolute;top:0;right:0;border-width:6px;border-style:solid;border-color:#e0e0e0 #e0e0e0 transparent transparent}
/* 절입일 당일 표시 - 강조 없음 */
.cal-cell.jeolgi{background:inherit}
.cal-cell.jeolgi::after{display:none}

.cal-saju-month{font-size:10px;color:#8b95a1;font-weight:600;height:14px}
.cal-date{font-size:16px;font-weight:700;margin-bottom:3px}
.cal-cell.today .cal-date{color:#3182f6;font-weight:800}
.cal-tengod{font-size:13px;color:#374151;font-weight:400}
.cal-ganzhi-box{display:flex;justify-content:center;gap:3px;margin:3px 0}
.cal-stem,.cal-branch{font-size:15px;font-weight:400;padding:3px 5px;border-radius:4px;display:flex;flex-direction:column;align-items:center;line-height:1.1}
.cal-stem sub,.cal-branch sub{font-size:8px;color:#666;font-weight:500;margin-top:1px}
.cal-branch-tg{font-size:13px;color:#374151;font-weight:400}
.cal-unseong{font-size:12px;color:#8b95a1;font-weight:400}
.cal-sinsal{font-size:12px;color:#8b95a1}
.cal-self-un{font-size:12px;color:#8b95a1}

.cal-ganzhi{font-size:12px;display:flex;justify-content:center;gap:2px}
.cal-ganzhi span{padding:1px 3px;border-radius:2px}
.cal-ganzhi .wood{background:#c8e6c9;color:#2e7d32}
.cal-ganzhi .fire{background:#ffcdd2;color:#c62828}
.cal-ganzhi .earth{background:#fff9c4;color:#f9a825}
.cal-ganzhi .metal{background:#e0e0e0;color:#616161}
.cal-ganzhi .water{background:#bbdefb;color:#1565c0}

/* ===== Modal ===== */
.day-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.6);display:none;align-items:center;justify-content:center;z-index:1000;padding:16px}
.day-modal.show{display:flex}
.modal-content{background:#fff;border-radius:16px;width:100%;max-width:320px;overflow:hidden;animation:modalIn 0.2s ease}
@keyframes modalIn{from{opacity:0;transform:scale(0.9)}to{opacity:1;transform:scale(1)}}
.modal-header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;background:linear-gradient(135deg,#1a1a2e,#16213e);color:#fff}
.modal-header h3{font-size:14px;font-weight:600}
.modal-close{width:26px;height:26px;border:none;background:rgba(255,255,255,0.1);border-radius:50%;cursor:pointer;color:#fff;font-size:11px}
.modal-body{padding:16px}
.modal-ilun{text-align:center}
.modal-label{font-size:10px;color:#888;margin-bottom:10px}
.modal-ganzhi{display:flex;justify-content:center;gap:10px;margin-bottom:14px}
.modal-elem{width:60px;height:76px;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 3px 10px rgba(0,0,0,0.1)}
.modal-elem .hanja{font-size:26px;font-weight:500}
.modal-elem .korean{font-size:11px;margin-top:4px;opacity:0.85}
.modal-elem.wood{background:linear-gradient(135deg,#81c784,#66bb6a);color:#1b5e20}
.modal-elem.fire{background:linear-gradient(135deg,#e57373,#ef5350);color:#fff}
.modal-elem.earth{background:linear-gradient(135deg,#ffd54f,#ffca28);color:#7c5800}
.modal-elem.metal{background:linear-gradient(135deg,#e0e0e0,#bdbdbd);color:#424242}
.modal-elem.water{background:linear-gradient(135deg,#64b5f6,#42a5f5);color:#fff}
.modal-info-row{display:flex;justify-content:center;gap:20px;margin-bottom:14px}
.modal-info-item{text-align:center}
.modal-info-item .label{display:block;font-size:9px;color:#999;margin-bottom:2px}
.modal-info-item .value{font-size:12px;font-weight:600;color:#e94560}
.modal-desc{font-size:11px;color:#555;line-height:1.6;text-align:left;background:#f8f8f8;padding:12px;border-radius:10px}
.modal-desc b{color:#333}

/* ===== Responsive ===== */
@media(max-width:380px){
.element-cell .hanja{font-size:14px}
.element-cell{min-height:36px;padding:3px 1px}
.daeun-item{min-width:48px;padding:5px 6px}
.seun-item{min-width:42px;padding:4px 5px}
.date-input-row{grid-template-columns:1.2fr 1fr 1fr}
}

/* ===== Age Info ===== */
.age-basis-info{font-size:8px;color:#999;text-align:right;margin-top:-4px;margin-bottom:6px}

/* ===== Scrollbar ===== */
::-webkit-scrollbar{width:6px;height:6px}
::-webkit-scrollbar-track{background:#f1f1f1;border-radius:3px}
::-webkit-scrollbar-thumb{background:#ccc;border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:#aaa}

/* 가로 스크롤 영역 전용 스크롤바 */
.daeun-scroll-wrapper,
.seun-scroll-wrapper,
.wolun-scroll-wrapper{
    scrollbar-width:thin;
    scrollbar-color:#888 #e0e0e0;
    padding-bottom:10px
}
.daeun-scroll-wrapper::-webkit-scrollbar,
.seun-scroll-wrapper::-webkit-scrollbar,
.wolun-scroll-wrapper::-webkit-scrollbar{
    height:8px
}
.daeun-scroll-wrapper::-webkit-scrollbar-track,
.seun-scroll-wrapper::-webkit-scrollbar-track,
.wolun-scroll-wrapper::-webkit-scrollbar-track{
    background:#e0e0e0;
    border-radius:4px;
    margin:0 10px
}
.daeun-scroll-wrapper::-webkit-scrollbar-thumb,
.seun-scroll-wrapper::-webkit-scrollbar-thumb,
.wolun-scroll-wrapper::-webkit-scrollbar-thumb{
    background:#888;
    border-radius:4px
}
.daeun-scroll-wrapper::-webkit-scrollbar-thumb:hover,
.seun-scroll-wrapper::-webkit-scrollbar-thumb:hover,
.wolun-scroll-wrapper::-webkit-scrollbar-thumb:hover{
    background:linear-gradient(90deg,#5a6fd6,#6a4190)
}

/* ===== Analysis Page ===== */
.analysis-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:linear-gradient(135deg,#667eea,#764ba2);position:sticky;top:0;z-index:100}
.analysis-content{padding:12px;padding-bottom:80px;background:#f5f5f5;min-height:calc(100vh - 56px)}

/* Analysis Card */
.analysis-card{background:#fff;border-radius:16px;margin-bottom:12px;overflow:hidden;box-shadow:0 2px 12px rgba(0,0,0,0.06)}
.card-header{padding:14px 16px;background:linear-gradient(135deg,#1a1a2e,#16213e);color:#fff;display:flex;align-items:center;gap:10px}
.card-header i{font-size:16px}
.card-header h3{font-size:14px;font-weight:600;flex:1}
.card-header .tag{font-size:9px;padding:3px 8px;background:rgba(255,255,255,0.15);border-radius:10px}
.card-body{padding:16px}

/* Summary Section */
.summary-box{background:linear-gradient(135deg,#fff5f7,#ffeef2);border-radius:12px;padding:16px;margin-bottom:16px;border-left:4px solid #e94560}
.summary-title{font-size:13px;font-weight:700;color:#e94560;margin-bottom:8px;display:flex;align-items:center;gap:6px}
.summary-text{font-size:12px;color:#555;line-height:1.7}

/* Ohaeng Balance */
.ohaeng-chart{display:flex;justify-content:space-around;padding:16px 0}
.ohaeng-item{text-align:center;flex:1}
.ohaeng-icon{width:44px;height:44px;border-radius:50%;margin:0 auto 6px;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;color:#fff}
.ohaeng-icon.wood{background:linear-gradient(135deg,#66bb6a,#43a047)}
.ohaeng-icon.fire{background:linear-gradient(135deg,#ef5350,#e53935)}
.ohaeng-icon.earth{background:linear-gradient(135deg,#ffca28,#ffc107)}
.ohaeng-icon.metal{background:linear-gradient(135deg,#bdbdbd,#9e9e9e)}
.ohaeng-icon.water{background:linear-gradient(135deg,#42a5f5,#1e88e5)}
.ohaeng-name{font-size:11px;font-weight:600;color:#333}
.ohaeng-count{font-size:10px;color:#888;margin-top:2px}
.ohaeng-bar{height:4px;background:#eee;border-radius:2px;margin-top:4px;overflow:hidden}
.ohaeng-bar-fill{height:100%;border-radius:2px;transition:width 0.5s ease}
.ohaeng-bar-fill.wood{background:#66bb6a}
.ohaeng-bar-fill.fire{background:#ef5350}
.ohaeng-bar-fill.earth{background:#ffca28}
.ohaeng-bar-fill.metal{background:#bdbdbd}
.ohaeng-bar-fill.water{background:#42a5f5}

/* Pillar Analysis */
.pillar-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:16px}
.pillar-box{background:#f8f9fa;border-radius:12px;padding:12px 8px;text-align:center}
.pillar-label{font-size:9px;color:#888;margin-bottom:6px}
.pillar-hanja{font-size:22px;font-weight:600;color:#333;margin-bottom:4px}
.pillar-hangul{font-size:10px;color:#666;margin-bottom:8px}
.pillar-info{font-size:8px;color:#888;line-height:1.4}
.pillar-info .highlight{color:#e94560;font-weight:600}

/* Personality Section */
.personality-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.personality-item{background:#f8f9fa;border-radius:10px;padding:12px}
.personality-label{font-size:9px;color:#888;margin-bottom:4px}
.personality-value{font-size:12px;font-weight:600;color:#333}
.personality-desc{font-size:10px;color:#666;margin-top:4px;line-height:1.5}

/* Sipsin Grid */
.sipsin-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.sipsin-item{background:#f8f9fa;border-radius:10px;padding:12px;border-left:3px solid #667eea}
.sipsin-name{font-size:11px;font-weight:700;color:#667eea;margin-bottom:4px}
.sipsin-hanja{font-size:9px;color:#888;margin-bottom:6px}
.sipsin-desc{font-size:10px;color:#555;line-height:1.5}

/* Relationship Section */
.relation-item{padding:12px 0;border-bottom:1px solid #f0f0f0}
.relation-item:last-child{border-bottom:none}
.relation-type{font-size:10px;font-weight:600;padding:3px 8px;border-radius:10px;display:inline-block;margin-bottom:6px}
.relation-type.chung{background:#ffebee;color:#c62828}
.relation-type.hap{background:#e8f5e9;color:#2e7d32}
.relation-type.hyung{background:#fff3e0;color:#e65100}
.relation-pair{font-size:12px;font-weight:600;color:#333;margin-bottom:4px}
.relation-desc{font-size:10px;color:#666;line-height:1.5}

/* Fortune Advice */
.advice-box{background:linear-gradient(135deg,#e3f2fd,#e8eaf6);border-radius:12px;padding:16px;margin-top:12px}
.advice-title{font-size:12px;font-weight:700;color:#5c6bc0;margin-bottom:8px;display:flex;align-items:center;gap:6px}
.advice-list{list-style:none;padding:0;margin:0}
.advice-list li{font-size:11px;color:#555;padding:6px 0;padding-left:20px;position:relative;line-height:1.5}
.advice-list li::before{content:'✓';position:absolute;left:0;color:#5c6bc0;font-weight:bold}

/* Gung Analysis */
.gung-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.gung-item{background:#f8f9fa;border-radius:10px;padding:12px}
.gung-label{font-size:10px;font-weight:600;color:#e94560;margin-bottom:4px}
.gung-period{font-size:9px;color:#888;margin-bottom:6px}
.gung-desc{font-size:10px;color:#555;line-height:1.5}

/* Yongsin Section */
.yongsin-box{background:linear-gradient(135deg,#fce4ec,#f8bbd9);border-radius:12px;padding:16px;text-align:center}
.yongsin-element{font-size:28px;font-weight:700;margin-bottom:6px}
.yongsin-name{font-size:14px;font-weight:600;color:#c2185b;margin-bottom:8px}
.yongsin-desc{font-size:11px;color:#666;line-height:1.6}

/* Current Year Analysis */
.year-analysis{background:#f8f9fa;border-radius:12px;padding:14px;margin-top:12px}
.year-title{font-size:11px;font-weight:600;color:#333;margin-bottom:8px;display:flex;align-items:center;gap:6px}
.year-content{font-size:11px;color:#555;line-height:1.6}

/* Expand Section */
.expand-section{margin-top:12px}
.expand-toggle{width:100%;padding:12px;background:#f0f0f0;border:none;border-radius:10px;font-size:11px;font-weight:600;color:#666;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px}
.expand-toggle:active{background:#e8e8e8}
.expand-content{display:none;padding:12px 0}
.expand-content.show{display:block}

/* Info Tooltip */
.info-badge{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;background:#e0e0e0;border-radius:50%;font-size:9px;color:#666;cursor:pointer;margin-left:4px}

/* ===== PC/Tablet 반응형 ===== */
@media(min-width:768px){
    :root{
        --chart-label-col:68px;
        --fortune-label-col:72px;
        --fortune-card-pad-top:16px;
        --fortune-pill-row:56px;
        --fortune-meta-row:20px;
    }
    body{background:#e8e8e8;min-height:100vh;font-size:15px}
    .app-container{max-width:800px;margin:40px auto;overflow:hidden;background:transparent}
    .input-wrapper{max-width:700px}
    .saju-form{width:100%;box-shadow:0 20px 60px rgba(0,0,0,0.4);border-radius:20px}
    #input-screen{min-height:auto;padding:60px 40px;background:transparent}
    .saju-form{padding:32px 28px}
    .logo-icon{width:100px;height:100px;margin-bottom:6px}
    .logo-title{font-size:28px}
    .logo-subtitle{font-size:14px}
    .form-group label{font-size:14px}
    .form-group input[type="text"]{font-size:16px;padding:14px 16px}
    .date-field input,.time-field input{font-size:16px;padding:14px 12px}
    .gender-btn,.cal-btn{font-size:14px;padding:14px}
    .submit-btn{font-size:16px;padding:16px}
    .result-header{padding:16px 20px}
    .header-title{font-size:18px}
    .user-details h3{font-size:20px}
    .user-details p{font-size:14px}
    .saju-chart-section{margin:16px;padding:20px 16px}
    .chart-title{font-size:16px}
    .element-cell .hanja{font-size:24px}
    .element-cell .korean{font-size:13px}
    .fortune-section{margin:16px;padding:20px 16px}
    .section-header h3{font-size:17px}
    .daeun-item{min-width:82px;padding:10px 10px 10px}
    .daeun-age{font-size:13px}
    .daeun-elem{font-size:20px}
    .daeun-elem .hanja-char,.seun-elem .hanja-char,.wolun-elem .hanja-char{font-size:26px}
    .daeun-elem .korean-char,.seun-elem .korean-char,.wolun-elem .korean-char{font-size:11px}
    .seun-item{min-width:82px;padding:10px 10px 10px}
    .seun-year{font-size:13px}
    .seun-elem{font-size:20px}
    .wolun-item{min-width:82px;padding:10px 10px 10px}
    .wolun-month{font-size:13px}
    .wolun-elem{font-size:20px}
    .analysis-card{margin-bottom:20px}
    .card-header{padding:18px 22px}
    .card-header h3{font-size:18px}
    .card-body{padding:24px}
    .summary-text{font-size:14px}
    .ohaeng-icon{width:56px;height:56px;font-size:22px}
    .ohaeng-name{font-size:13px}
    /* 사주팔자 추가 정보 */
    .hidden-item{font-size:13px;padding:0}
    .hidden-item sub{font-size:11px}
    .label-cell{font-size:14px}
    .unseong-cell{font-size:15px}
    .napeum-cell{font-size:14px}
    .sinsal-cell{font-size:14px}
    .self-unseong-cell{font-size:13px}
    /* 대운/세운/월운 추가 정보 */
    .daeun-branch-tg,.seun-branch-tg,.wolun-branch-tg{font-size:11px}
    .daeun-unseong,.seun-unseong,.wolun-unseong{font-size:11px}
    .daeun-sinsal,.seun-sinsal,.wolun-sinsal{font-size:11px}
    .daeun-napeum,.seun-napeum,.wolun-napeum{font-size:11px}
    .daeun-self-un,.seun-self-un,.wolun-self-un{font-size:10px}
    /* 라벨 크기 */
    .row-label{font-size:13px;min-width:52px}
    .tl-label{font-size:13px;min-width:54px}
}

@media(min-width:1024px){
    :root{
        --chart-label-col:72px;
        --fortune-label-col:76px;
        --fortune-card-pad-top:18px;
        --fortune-pill-row:58px;
        --fortune-meta-row:20px;
    }
    body{font-size:16px}
    .app-container{max-width:900px;margin:40px auto;background:transparent}
    .input-wrapper{max-width:800px}
    #input-screen{padding:60px 40px}
    .saju-form{padding:36px 32px}
    .logo-icon{width:130px;height:130px;margin-bottom:8px}
    .logo-title{font-size:32px}
    .logo-subtitle{font-size:15px}
    .form-group label{font-size:15px}
    .form-group input[type="text"]{font-size:17px;padding:16px 18px}
    .date-field input,.time-field input{font-size:17px;padding:16px 14px}
    .gender-btn,.cal-btn{font-size:15px;padding:16px}
    .submit-btn{font-size:18px;padding:18px}
    .header-title{font-size:20px}
    .user-details h3{font-size:22px}
    .user-details p{font-size:15px}
    .chart-title{font-size:18px}
    .element-cell .hanja{font-size:28px}
    .element-cell .korean{font-size:14px}
    .section-header h3{font-size:18px}
    .daeun-item{min-width:106px;padding:18px 16px 16px}
    .daeun-age{font-size:16px}
    .daeun-elem{font-size:28px}
    .daeun-elem .hanja-char,.seun-elem .hanja-char,.wolun-elem .hanja-char{font-size:38px}
    .daeun-elem .korean-char,.seun-elem .korean-char,.wolun-elem .korean-char{font-size:13px}
    .seun-item{min-width:106px;padding:18px 16px 16px}
    .seun-year{font-size:16px}
    .seun-elem{font-size:28px}
    .wolun-item{min-width:106px;padding:18px 16px 16px}
    .wolun-month{font-size:16px}
    .wolun-elem{font-size:28px}
    .card-header h3{font-size:20px}
    .card-body{padding:28px}
    .summary-text{font-size:15px}
    /* 사주팔자 추가 정보 (PC) */
    .hidden-item{font-size:14px;padding:0}
    .hidden-item sub{font-size:12px}
    .label-cell{font-size:15px}
    .unseong-cell{font-size:16px}
    .napeum-cell{font-size:15px}
    .sinsal-cell{font-size:15px}
    .self-unseong-cell{font-size:14px}
    /* 대운/세운/월운 추가 정보 (PC) */
    .daeun-branch-tg,.seun-branch-tg,.wolun-branch-tg{font-size:12px}
    .daeun-unseong,.seun-unseong,.wolun-unseong{font-size:12px}
    .daeun-sinsal,.seun-sinsal,.wolun-sinsal{font-size:12px}
    .daeun-napeum,.seun-napeum,.wolun-napeum{font-size:12px}
    .daeun-self-un,.seun-self-un,.wolun-self-un{font-size:11px}
    /* 라벨 크기 (PC) */
    .row-label{font-size:14px;min-width:55px}
    .tl-label{font-size:14px;min-width:58px}
}

/* ===== 모바일 최적화 (작은 화면) ===== */
@media(max-width:480px){
    /* 달력 셀 크기 축소 */
    .cal-cell{padding:4px 2px;min-height:80px}
    .cal-date{font-size:14px;margin-bottom:2px}
    .cal-tengod{font-size:10px}
    .cal-stem,.cal-branch{font-size:12px;padding:2px 3px}
    .cal-stem sub,.cal-branch sub{font-size:7px}
    .cal-branch-tg{font-size:10px}
    .cal-unseong{font-size:9px}
    .cal-sinsal{font-size:9px}
    .cal-self-un{font-size:9px}
    .cal-saju-month{font-size:9px;height:12px}
    .calendar-header{font-size:11px}
    .cal-day{padding:8px 0;font-size:11px}
    /* 달력이 화면에 맞게 표시되도록 */
    .calendar-container{overflow-x:auto;-webkit-overflow-scrolling:touch}
    .calendar-body{min-width:100%}
    /* 절기 네비게이션 축소 */
    .jeolgi-name{font-size:11px}
    .jeolgi-date{font-size:9px}
    .jeolgi-current .jeolgi-name{font-size:12px}
    .jeolgi-current .jeolgi-date{font-size:10px}
}

/* ===== 사주 풀이 카드 섹션 ===== */
.saju-reading-section{background:#fff;padding:20px 16px;border-top:8px solid #f2f4f6;padding-bottom:40px}
.reading-section-header{margin-bottom:16px}
.reading-section-header h3{font-size:18px;font-weight:700;color:#191f28;margin-bottom:4px}
.reading-section-header p{font-size:13px;color:#8b95a1}
.reading-cat-group{margin-bottom:14px}
.reading-cat-label{font-size:11px;font-weight:600;color:#8b95a1;margin-bottom:8px;letter-spacing:0.3px}
.reading-cat-row{display:flex;flex-wrap:wrap;gap:8px}
.r-cat-btn{border:1.5px solid #e8ebef;background:#fff;padding:8px 14px;border-radius:20px;font-size:13px;cursor:pointer;transition:all 0.15s;font-weight:500;color:#4e5968;white-space:nowrap}
.r-cat-btn:active{transform:scale(0.96)}
.r-cat-btn.active{background:#3182f6;border-color:#3182f6;color:#fff;font-weight:600}

/* ===== Toss 스타일 메뉴 ===== */
#reading-menu{padding-bottom:4px}
.toss-manse-btn{width:100%;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(135deg,#3182f6 0%,#1a56db 100%);border:none;border-radius:16px;padding:16px 18px;cursor:pointer;margin-bottom:24px;transition:all 0.15s;box-shadow:0 4px 12px rgba(49,130,246,0.25)}
.toss-manse-btn:active{transform:scale(0.98);filter:brightness(0.93)}
.toss-manse-left{display:flex;align-items:center;gap:12px}
.toss-manse-icon{font-size:24px}
.toss-manse-texts{text-align:left}
.toss-manse-title{display:block;font-size:16px;font-weight:700;color:#fff}
.toss-manse-sub{display:block;font-size:12px;color:rgba(255,255,255,0.75);margin-top:2px}
.toss-manse-arrow{font-size:22px;color:rgba(255,255,255,0.55);font-weight:300}
.toss-section-header{display:flex;align-items:baseline;gap:6px;margin-bottom:12px}
.toss-section-label{font-size:15px;font-weight:700;color:#191f28}
.toss-section-sub{font-size:12px;color:#8b95a1}
.toss-topic-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-bottom:4px}
.toss-topic-btn{background:#fff;border:1.5px solid #f2f4f6;border-radius:14px;padding:12px 4px 10px;display:flex;flex-direction:column;align-items:center;gap:7px;cursor:pointer;transition:all 0.15s;box-shadow:0 1px 4px rgba(0,0,0,0.05)}
.toss-topic-btn:active{transform:scale(0.92);background:#f4f6f8}
.toss-topic-btn.active{border-color:#3182f6;background:#eff6ff;box-shadow:0 0 0 2px rgba(49,130,246,0.2)}
.toss-icon-wrap{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
.toss-topic-label{font-size:10.5px;font-weight:600;color:#191f28;text-align:center;line-height:1.3}
.toss-period-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}
.toss-period-btn{background:#fff;border:1.5px solid #f2f4f6;border-radius:14px;padding:14px 4px 12px;display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;transition:all 0.15s;box-shadow:0 1px 4px rgba(0,0,0,0.05)}
.toss-period-btn:active{transform:scale(0.92);background:#f4f6f8}
.toss-period-btn.active{border-color:#3182f6;box-shadow:0 0 0 2px rgba(49,130,246,0.15)}
.toss-period-label{font-size:13px;font-weight:700;color:#191f28}
.toss-period-sub{font-size:10px;color:#8b95a1}
.toss-back-btn{display:flex;align-items:center;gap:8px;background:none;border:none;font-size:15px;font-weight:600;color:#191f28;padding:4px 0 18px;cursor:pointer;width:100%}
.toss-back-btn:active{opacity:0.5}
.toss-back-arrow{font-size:20px;line-height:1}
.toss-page-label{font-size:17px;font-weight:700;color:#191f28}

/* 풀이 카드 */
#reading-cards-container{margin-top:8px;display:flex;flex-direction:column;gap:12px}
.rc-card{border-radius:16px;overflow:hidden;box-shadow:0 2px 12px rgba(0,0,0,0.08);background:#fff}
.rc-card-header{padding:14px 16px;display:flex;justify-content:space-between;align-items:center}
.rc-card-title{font-size:15px;font-weight:700;color:#fff}
.rc-card-close{background:rgba(255,255,255,0.25);border:none;color:#fff;width:26px;height:26px;border-radius:50%;cursor:pointer;font-size:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.rc-card-body{padding:16px;font-size:13px;line-height:1.7;color:#333}
.rc-card-body p{margin-bottom:8px}
.rc-card-body p:last-child{margin-bottom:0}
.rc-card-body strong{font-weight:700;color:#191f28}

/* 섹션 블록 */
.rc-section{padding:12px;border-radius:12px;margin-bottom:10px}
.rc-section-title{font-size:12px;font-weight:700;color:#4e5968;margin-bottom:6px}

/* 요약 행 */
.rc-summary-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
.rc-summary-item{background:#f8f9fa;border-radius:10px;padding:10px 12px}
.rc-summary-label{display:block;font-size:10px;color:#8b95a1;font-weight:600;margin-bottom:3px}
.rc-summary-value{font-size:13px;font-weight:700;color:#191f28}
.rc-strong{color:#3182f6!important}
.rc-weak{color:#6d28d9!important}

/* 오행 바 */
.rc-oh-bars{display:flex;flex-direction:column;gap:8px}
.rc-oh-row{display:grid;grid-template-columns:22px minmax(0,1fr) 32px 26px;align-items:center;gap:4px}
.rc-oh-label{font-size:12px;font-weight:700;text-align:center}
.rc-oh-bar-bg{height:10px;background:#f2f4f6;border-radius:999px;overflow:hidden}
.rc-oh-bar-fill{height:100%;border-radius:4px;transition:width 0.5s ease}
.rc-oh-pct{font-size:11px;color:#4e5968;font-weight:600;text-align:right}
.rc-oh-ss{font-size:9px;color:#8b95a1;letter-spacing:-0.2px;text-align:right;white-space:nowrap}

/* 용신 행 */
.rc-yongsin-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin:12px 0}
.rc-yongsin-item{padding:10px 8px;border-radius:12px;text-align:center}
.rc-yongsin-tag{font-size:10px;font-weight:600;color:#8b95a1;margin-bottom:4px}
.rc-yongsin-val{font-size:20px;font-weight:700;color:#191f28;margin-bottom:2px}
.rc-yongsin-desc{font-size:10px;color:#4e5968;line-height:1.4}

/* 리스트 */
.rc-list{padding-left:0;list-style:none;margin:0}
.rc-list li{padding:6px 0;border-bottom:1px solid #f2f4f6;font-size:13px;line-height:1.6}
.rc-list li:last-child{border-bottom:none}
.rc-list li::before{content:'·';margin-right:6px;color:#3182f6;font-weight:700}
.rc-list-dot{padding-left:0;list-style:none;margin:0}
.rc-list-dot li{padding:4px 0;font-size:12px;color:#333;line-height:1.5}
.rc-list-dot li::before{content:'✓';margin-right:6px;color:#22c55e;font-weight:700}
.rc-ordered-list{padding-left:20px;margin:0}
.rc-ordered-list li{padding:4px 0;font-size:13px;color:#333;line-height:1.6}

/* 2열 그리드 */
.rc-two-col{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px}

/* 칩 */
.rc-chip{display:inline-block;padding:3px 8px;border-radius:20px;font-size:11px;font-weight:600;margin:2px}

/* 주제 점수 */
.rc-topic-score-card{background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:14px;margin-bottom:12px;box-shadow:0 1px 4px rgba(15,23,42,0.04)}
.rc-topic-score-card.excellent{background:linear-gradient(135deg,#eff6ff,#f8fbff);border-color:#93c5fd}
.rc-topic-score-card.good{background:linear-gradient(135deg,#f0fdf4,#f7fee7);border-color:#86efac}
.rc-topic-score-card.mid{background:linear-gradient(135deg,#f8fafc,#fdfdfd);border-color:#e2e8f0}
.rc-topic-score-card.warn{background:linear-gradient(135deg,#fff7ed,#fffaf5);border-color:#fdba74}
.rc-topic-score-card.weak{background:linear-gradient(135deg,#fff5f5,#fff7f7);border-color:#fecaca}
.rc-topic-score-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:10px}
.rc-topic-score-label{font-size:12px;font-weight:800;color:var(--topic-accent,#3182f6);margin-bottom:4px}
.rc-topic-score-summary{font-size:12px;color:#4e5968;line-height:1.6}
.rc-topic-score-main{display:flex;flex-direction:column;align-items:flex-end;min-width:76px}
.rc-topic-score-number{font-size:30px;line-height:1;color:#191f28}
.rc-topic-score-grade{font-size:11px;font-weight:700;color:#4e5968;margin-top:4px}
.rc-topic-score-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.rc-topic-stat{background:rgba(255,255,255,0.75);border-radius:10px;padding:9px 8px;text-align:center}
.rc-topic-stat span{display:block;font-size:10px;color:#8b95a1;font-weight:600;margin-bottom:3px}
.rc-topic-stat strong{font-size:15px;color:#191f28}
.rc-topic-subscore-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.rc-topic-subscore{background:#f8fafc;border-radius:10px;padding:9px 10px}
.rc-topic-sub-label{display:block;font-size:10px;color:#8b95a1;font-weight:600;margin-bottom:3px}
.rc-topic-sub-value{font-size:14px;color:#191f28}
.rc-score-mini-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.rc-score-mini{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:10px 8px;text-align:center}
.rc-score-mini.excellent{background:linear-gradient(135deg,#eff6ff,#f8fbff);border-color:#93c5fd}
.rc-score-mini.good{background:linear-gradient(135deg,#f0fdf4,#f7fee7);border-color:#86efac}
.rc-score-mini.mid{background:linear-gradient(135deg,#f8fafc,#fdfdfd);border-color:#e2e8f0}
.rc-score-mini.warn{background:linear-gradient(135deg,#fff7ed,#fffaf5);border-color:#fdba74}
.rc-score-mini.weak{background:linear-gradient(135deg,#fff5f5,#fff7f7);border-color:#fecaca}
.rc-score-mini.active{border-color:var(--grade-accent,#3182f6);box-shadow:0 0 0 2px color-mix(in srgb, var(--grade-accent,#3182f6) 18%, transparent)}
.rc-score-mini-head{display:flex;flex-direction:column;gap:2px;font-size:10px;font-weight:700;color:#4e5968;line-height:1.25;min-height:34px}
.rc-score-mini-num{font-size:22px;font-weight:800;color:#191f28;line-height:1;margin:5px 0 4px}
.rc-score-mini-grade{font-size:10px;color:var(--grade-accent,#3182f6);font-weight:700}
.rc-list-dot-caution li::before{content:'!';color:#ef4444}

/* 성격 카드 */
.rc-persona-hero{display:flex;align-items:center;gap:12px;padding:14px;background:#f8f9fa;border-radius:12px;margin-bottom:12px}
.rc-persona-symbol{font-size:36px}
.rc-persona-nature{font-size:12px;color:#8b95a1;margin-bottom:2px}
.rc-persona-essence{font-size:14px;font-weight:700;color:#191f28}

/* 스트레스 */
.rc-stress-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.rc-stress-item p{font-size:12px;color:#333;margin-top:4px;line-height:1.6}
.rc-stress-label{font-size:11px;font-weight:700;color:#4e5968}

/* 연도 비교 */
.rc-year-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}
.rc-year-card{padding:12px;border-radius:12px;text-align:center}
.rc-year-label{font-size:10px;color:#8b95a1;font-weight:600;margin-bottom:4px}
.rc-year-tg{font-size:16px;font-weight:700;color:#191f28;margin-bottom:4px}
.rc-year-desc{font-size:11px;color:#4e5968;line-height:1.5}

/* 직업 */
.rc-career-type{display:flex;align-items:center;gap:8px;padding:12px;background:#f0f7ff;border-radius:12px;margin-bottom:12px}
.rc-career-badge{background:#3182f6;color:#fff;padding:4px 10px;border-radius:20px;font-size:11px;font-weight:700;white-space:nowrap}
.rc-career-best{font-size:13px;color:#1e3a8a;font-weight:500;line-height:1.5}
.rc-job-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.rc-job-chip{background:#eff6ff;color:#1e40af;padding:5px 10px;border-radius:20px;font-size:12px;font-weight:600}

/* 건강 */
.rc-health-overview{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;margin-bottom:12px}
.rc-health-item{padding:10px 8px;border-radius:12px;text-align:center}
.rc-health-item.weakness{background:#fff5f5}
.rc-health-item.excess{background:#fff8e1}
.rc-health-item.ksin{background:#fdf4ff}
.rc-health-label{font-size:10px;font-weight:600;color:#4e5968;display:block;margin-bottom:4px}
.rc-health-val{font-size:14px;font-weight:700;color:#191f28}

/* 대운/세운 기간 선택 */
.rc-period-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;padding:4px 0 8px;margin-bottom:12px}
.rc-period-btns{display:flex;gap:8px;min-width:max-content}
.rc-period-btn{background:#f8f9fa;border:2px solid transparent;border-radius:12px;padding:8px 10px;text-align:center;cursor:pointer;min-width:64px;transition:all 0.15s;font-family:inherit}
.rc-period-btn:active{transform:scale(0.96)}
.rc-period-btn.active{border-color:#3182f6;background:#eff6ff}
.rc-period-age{display:block;font-size:12px;font-weight:700;color:#191f28;margin-bottom:2px}
.rc-period-gan{display:block;font-size:14px;font-weight:700;color:#191f28;margin-bottom:2px}
.rc-period-tg{display:block;font-size:10px;font-weight:600;color:#3182f6}

/* 대운 상세 */
.rc-daeun-header{padding:12px;background:#f5f3ff;border-radius:10px;margin-bottom:12px;font-size:13px;color:#191f28;font-weight:600}
.rc-seun-header{padding:12px;background:#eff6ff;border-radius:10px;margin-bottom:12px;font-size:13px;color:#191f28;font-weight:600}
.rc-fortune-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0}
.rc-fortune-box{padding:12px;border-radius:12px;background:#f8f9fa}
.rc-fortune-label{font-size:11px;font-weight:700;color:#4e5968;margin-bottom:4px}
.rc-fortune-box p{font-size:12px;color:#333;line-height:1.5;margin:0}

/* 월별 타이밍 */
.rc-month-row{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.rc-month-item{text-align:center;padding:8px 4px;background:#f8f9fa;border-radius:10px}
.rc-month-label{display:block;font-size:10px;color:#8b95a1;font-weight:600;margin-bottom:3px}
.rc-month-gan{display:block;font-size:14px;font-weight:700;color:#191f28;margin-bottom:2px}
.rc-month-tg{display:block;font-size:10px;color:#3182f6;font-weight:600}

/* 일진 달력 */
.rc-ilun-nav{display:flex;align-items:center;justify-content:space-between;padding:8px 0 12px;font-size:15px;font-weight:700;color:#191f28}
.rc-nav-btn{background:#f2f4f6;border:none;width:32px;height:32px;border-radius:50%;cursor:pointer;font-size:16px;color:#4e5968;display:flex;align-items:center;justify-content:center}

/* 주제 심층 해석 */
.rc-focus-quote{position:relative;background:linear-gradient(135deg,#ffffff,#f8fafc);border:1px solid #dbeafe;border-radius:14px;padding:16px 16px 16px 18px;margin-bottom:12px;box-shadow:0 1px 4px rgba(15,23,42,0.04)}
.rc-focus-quote::before{content:'';position:absolute;left:0;top:12px;bottom:12px;width:4px;border-radius:4px;background:var(--topic-accent,#3182f6)}
.rc-focus-quote-label{font-size:11px;font-weight:800;letter-spacing:.02em;color:var(--topic-accent,#3182f6);margin-bottom:8px}
.rc-focus-quote-text{font-size:14px;line-height:1.8;color:#191f28;font-weight:600}
.rc-focus-quote-text strong{color:var(--topic-accent,#2563eb)}
.rc-topic-longform{display:flex;flex-direction:column;gap:12px}
.rc-topic-longform p{margin:0;font-size:13px;line-height:1.9;color:#333}
.rc-topic-longform strong{color:#191f28;font-weight:700}