/* 다키스트 던전 분위기: 어두운 바탕 + 낡은 금색 포인트 */
:root,
[data-bs-theme="dark"] {
    --bs-body-bg: #121110;
    --bs-body-color: #d8d2c4;
    --dd-gold: #b8955a;
}

.site-brand {
    color: var(--dd-gold) !important;
    font-weight: 600;
    letter-spacing: .02em;
}

.trinket-table td,
.curio-table td {
    border-color: #2a2724;
}

.icon-cell {
    width: 64px;
}

.trinket-icon {
    width: 56px;
    height: auto;
    image-rendering: auto;
}


.battle-source { color: #d9a066; }

.extra-lines { margin-top: .25rem; }
.extra-heading { color: var(--dd-gold); font-weight: 600; margin-top: .15rem; }
.extra-effect { padding-left: .75rem; }
.extra-property { color: #8fb3c9; }

/* 희귀도 색: 게임 화면의 테두리 색을 대략 따름 */
.rarity-badge { background: #3a3631; color: #e3dccb; }
.rarity-common, .rarity-very_common { background: #4a4a4a; }
.rarity-uncommon { background: #3b5a3b; }
.rarity-rare { background: #2f4f78; }
.rarity-very_rare, .rarity-collector, .rarity-madman, .rarity-courtier { background: #6b3f86; }
.rarity-ancestral, .rarity-ancestral_shambler { background: #8a6d2b; }
.rarity-trophy { background: #7a2f2f; }
.rarity-crimson_court { background: #8a1f2b; }
.rarity-comet { background: #2c6f73; }
.rarity-kickstarter { background: #5c4b33; }

/* 골동품 */
.curio-image-cell { width: 120px; }
.curio-image { width: 110px; height: 90px; object-fit: contain; }
.tracker-icon { width: 20px; height: 20px; vertical-align: -5px; }
.item-icon { width: 24px; height: 24px; vertical-align: -6px; }
.curio-results li { margin-bottom: .2rem; }
.result-label { color: var(--dd-gold); }
.result-percent { font-variant-numeric: tabular-nums; }
.result-details { color: #b9b2a3; }
.variant-label { color: #8fb3c9; }

/* 영웅 */
.hero-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 1rem; }
.hero-card { display: block; text-align: center; color: inherit; text-decoration: none; padding: .5rem;
             border: 1px solid #2a2724; border-radius: .4rem; }
.hero-card:hover { border-color: var(--dd-gold); }
.hero-card img { width: 100%; max-width: 120px; height: auto; margin-bottom: .35rem; }
.hero-portrait { width: 140px; height: auto; border: 1px solid #2a2724; }
.hero-head { flex: 1; min-width: 260px; }
.resist-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: .35rem 1.2rem; max-width: 820px; }
.resist { display: flex; align-items: center; gap: .35rem; }
.resist img { width: 22px; height: 22px; }
.skill-card { border: 1px solid #2a2724; border-radius: .4rem; padding: .75rem; margin-bottom: .75rem; }
.skill-icon { width: 48px; height: 48px; }
.skill-levels td, .equipment td { border-color: #2a2724; }
.effect-missing { color: #7d766a; font-style: italic; }
.ranks { display: flex; align-items: center; gap: .4rem; margin-left: auto; }
.rank-group { display: inline-flex; gap: 3px; }
.rank { width: 14px; height: 14px; border-radius: 50%; border: 1px solid #5a554d; display: inline-block; }
.rank.launch.on { background: #d8c89a; border-color: #d8c89a; }
.rank.enemy.on { background: #b3443a; border-color: #b3443a; }
.rank.ally.on { background: #4f9a5a; border-color: #4f9a5a; }
.rank-group.many { padding: 1px 3px; border: 1px dashed #8a8174; border-radius: 9px; }
.rank-arrow { color: #8a8174; }
.equip-icon-cell { width: 44px; }
.equip-icon { width: 36px; height: 36px; }
.camping-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: .9rem 1.2rem; }
.camping { display: flex; gap: .6rem; align-items: center; }
.camping-icon { width: 44px; height: 44px; }
/* 스킬 카드: 넓은 화면에서 두 장씩. 표는 촘촘하게(숫자 가운데, 같은 값은 칸 합침) */
.skill-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 620px), 1fr)); gap: .75rem; }
.skill-grid .skill-card { margin-bottom: 0; }
.skill-name-en { color: #8a8174; }
.skill-levels th.num, .skill-levels td.num { width: 1%; white-space: nowrap; text-align: center; padding: .25rem .8rem; }
.skill-levels td.details { vertical-align: middle; }
.skill-levels td[rowspan] { vertical-align: middle; }
.equipment-row { max-width: 1280px; }
.camping-selection { color: var(--dd-gold); margin-right: .25rem; }
.camping-effects { margin-top: .1rem; }
.ability-chips { display: flex; flex-wrap: wrap; gap: .35rem; }
.matched-skills { color: var(--dd-gold); margin-top: .2rem; }
.hero-card.matched { border: 2px solid var(--dd-gold); box-shadow: 0 0 0 1px var(--dd-gold), 0 0 12px rgba(184, 149, 90, .45); }
.hero-count { color: var(--dd-gold); min-height: 1.2em; }
.hero-sort { width: auto; }
.sort-value { color: #e3dccb; font-weight: 600; font-size: .9rem; min-height: 0; }

/* 몬스터 */
.monster-table td { border-color: #2a2724; }
.monster-table th.num, .monster-table td.num, .encounter-table th.num, .encounter-table td.num { text-align: center; white-space: nowrap; }
.monster-icon-cell { width: 76px; }
.monster-icon { width: 68px; height: 68px; object-fit: contain; }
.monster-image { width: 220px; max-height: 300px; object-fit: contain; }
.monster-skill-stats { display: flex; gap: 1rem; }
.variant-links { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem; }
.encounter-table td { border-color: #2a2724; }
.monster-table tr.tier-fallback td { opacity: .5; }
.mode-diff { color: #d9a066; }
.monster-table tr.section-row td { background: #1d1a17; color: var(--dd-gold); font-weight: 600; padding-top: .9rem; }
.place-note { color: #8fb3c9; }
.monster-skill { overflow: hidden; }
.skill-pose { float: left; width: 150px; height: 130px; object-fit: contain; margin: 0 .9rem .3rem 0; }
.monster-preview { position: fixed; z-index: 1050; width: 280px; height: 280px; object-fit: contain; pointer-events: none;
                   background: #1a1715; border: 1px solid var(--dd-gold); border-radius: .4rem; padding: .4rem; }
.monster-icon { cursor: zoom-in; }

/* 기벽·질병 */
.quirk-table td { border-color: #2a2724; }
.quirk-positive { background: #3b5a3b; }
.quirk-negative { background: #7a2f2f; }
.quirk-behavior { color: #d9a066; }

/* 마을 이벤트 */
.event-table td { border-color: #2a2724; }
.event-image-cell { width: 128px; }
.event-image { width: 120px; height: 80px; object-fit: cover; border: 1px solid #2a2724; cursor: zoom-in; }
.event-summary { color: var(--dd-gold); }
.event-tooltip { color: #8fb3c9; }
.event-description { max-width: 34rem; }
.tone-good { background: #3b5a3b; }
.tone-neutral { background: #4a4a4a; }
.tone-bad { background: #7a2f2f; }

/* 건물 */
.building-name { color: var(--dd-gold); border-bottom: 1px solid #2a2724; padding-bottom: .3rem; }
.tree-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 430px), 1fr)); gap: .75rem; }
.tree-card { border: 1px solid #2a2724; border-radius: .4rem; padding: .75rem; }
.upgrade-table td { border-color: #2a2724; }
.upgrade-table th.num, .upgrade-table td.num { width: 1%; text-align: center; white-space: nowrap; }

/* 붕괴·각성 */
.trait-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 380px), 1fr)); gap: .75rem; }
.trait-card { border: 1px solid #2a2724; border-radius: .4rem; padding: .75rem; }
.trait-name.trait-affliction, .trait-section.trait-affliction { color: #d0584c; }
.trait-name.trait-virtue, .trait-section.trait-virtue { color: #e1c06a; }
.trait-acts td { border-color: #2a2724; padding: .15rem .4rem; }
.trait-acts td.num { width: 1%; text-align: right; white-space: nowrap; }
.trait-table { width: auto; min-width: 50%; }
.trait-table th, .trait-table td { border-color: #2a2724; }
.trait-table th.num, .trait-table td.num { text-align: center; white-space: nowrap; padding: .25rem .7rem; }
.trait-table thead th.num { font-weight: 500; font-size: .85rem; color: #b9b2a3; }
.trait-name-col { white-space: nowrap; font-weight: 500; }
.tone-cell-good { color: #7fc77f; }
.tone-cell-bad { color: #e07d72; }
/* 설명이 있는 글자: 돋보기 커서 + 점선 밑줄(사용자 요구) */
.has-note { cursor: zoom-in; text-decoration: underline dotted; text-underline-offset: 3px; }
.tooltip-inner { max-width: 360px; text-align: left; white-space: pre-line; }   /* 툴팁 글자의 줄바꿈을 그대로 */

/* 구역 */
.district-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 420px), 1fr)); gap: .75rem; }
.district-card { display: flex; gap: .9rem; border: 1px solid #2a2724; border-radius: .4rem; padding: .75rem; }
.district-image { width: 130px; height: 120px; object-fit: contain; flex-shrink: 0; }
.district-heroes { color: var(--dd-gold); }
.district-costs { border-top: 1px solid #2a2724; padding-top: .3rem; }