/* launch.css — 출시 다듬기(2026-09-29): 필드 첫 도전 안내 등 */
.prep-field { max-width: 460px; margin: 12vh auto 0; padding: 18px 20px; text-align: center; background: var(--panel, rgba(14,10,28,.9)); border: 1px solid var(--edge, #5a4a7a); border-radius: 10px; box-shadow: 0 6px 20px rgba(0,0,0,.5); }
.prep-field b { display: block; font-size: 18px; margin-bottom: 8px; color: #ffe6a0; }
.prep-field p { font-size: 13px; line-height: 1.5; margin: 0 0 12px; }
.prep-field small { opacity: .75; }

/* ---------- 히로인 상세 · 탭(hero-tabs.js): 스크롤 없이 한 화면 ---------- */
.menu.scr-hero .hd.tabbed { grid-template-columns: minmax(180px, .62fr) minmax(0, 1.7fr); gap: 14px; padding: 8px 14px; overflow: hidden; }
.menu.scr-hero .hd.tabbed .hd-profile { overflow: hidden; justify-content: center; }
.menu.scr-hero .hd.tabbed .hd-profile .hd-art { flex: 1 1 auto; height: auto; min-height: 0; max-height: none; }
.menu.scr-hero .hd.tabbed .hd-profile .hd-training { margin: 6px 0 0; min-height: 44px; font-size: 16px; }
.menu.scr-hero .hd.tabbed .hd-info { display: flex; flex-direction: column; min-height: 0; overflow: hidden; padding: 2px 4px 4px; }
.hd.tabbed .hd-top { flex: none; display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 0 10px; }
.hd.tabbed .hd-top .hd-head { grid-column: 1 / -1; }
.hd.tabbed .hd-top h2 { font-size: 24px; line-height: 1.15; }
.hd.tabbed .hd-top .hero-tags { justify-self: start; }
.hd-tabs { flex: none; display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; margin: 6px 0; }
.hd-tabs button { position: relative; min-height: 34px; font-weight: 900; font-size: 13px; color: #cfc8e8; background: #1c1830; border: 1px solid #4a4266; border-radius: 6px; }
.hd-tabs button[aria-selected="true"] { color: #201a10; background: linear-gradient(#fff2b0, #ffc840); border-color: #ffd84a; }
.hd-dot { position: absolute; top: 4px; right: 6px; width: 7px; height: 7px; border-radius: 50%; background: #ff5a4a; box-shadow: 0 0 0 1px #000; }
.hd-pane { flex: 1; min-height: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; }
.hd-pane[hidden] { display: none !important; }
/* 육성: 능력치 + 레벨 + 물약 4칸 한 줄 */
.hd-pane[data-pane="grow"] table { margin: 0 0 4px; }
.hd-pane[data-pane="grow"] .grow { border-top: 0; padding-top: 0; }
.hd-pane[data-pane="grow"] .grow { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.hd-pane[data-pane="grow"] .grow > .lvl, .hd-pane[data-pane="grow"] .grow > .row:has(.tok) { grid-column: 1 / -1; }
.hd-pane[data-pane="grow"] .grow > .row:not(:has(.tok)), .hd-pane[data-pane="grow"] .grow > .qol-actions { display: contents; }
.hd-pane[data-pane="grow"] .grow button { min-height: 44px; height: auto; padding: 4px 6px; font-size: 12px; line-height: 1.25; }
.hd-pane[data-pane="grow"] .grow button small { font-size: 9px; }
.hd-pane[data-pane="grow"] .grow > small.dim { display: none; }
/* 장비: 세 칸 한 줄 */
.hd-pane[data-pane="gear"] .eqs { border-top: 0; padding-top: 0; }
.hd-pane[data-pane="gear"] .eq-row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
/* 스킬: 세 장 나란히 */
.hd-pane[data-pane="skill"]:not([hidden]) { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; align-content: start; }
.hd-pane[data-pane="skill"] .sk { display: flex; flex-direction: column; gap: 4px; margin: 0; padding: 6px; min-width: 0; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.1); border-radius: 6px; }
.hd-pane[data-pane="skill"] .sk-title { display: flex; align-items: center; gap: 6px; min-width: 0; }
.hd-pane[data-pane="skill"] .sk-title > em { flex: none; display: flex; flex-direction: column; align-items: center; padding: 2px 3px; font-size: 9px; line-height: 1.1; }
.hd-pane[data-pane="skill"] .sk-title > em :is(svg, img, .ico) { width: 26px; height: 26px; }
.hd-pane[data-pane="skill"] .sk-title > b { min-width: 0; font-size: 12px; line-height: 1.25; }
.hd-pane[data-pane="skill"] .sk-title .sk-level { display: block; font-size: 10px; color: #ffe2a0; }
.hd-pane[data-pane="skill"] .sk-btns { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 4px; min-width: 0; }
.hd-pane[data-pane="skill"] .sk-btns .nbtn { width: 100%; min-width: 0; max-width: none; overflow: hidden; min-height: 38px; height: auto; padding: 3px 4px; font-size: 11px; line-height: 1.2; }
.hd-pane[data-pane="skill"] .sk-btns .nbtn small { display: block; font-size: 9px; opacity: .85; white-space: normal; }
.hd-pane[data-pane="skill"] .sk > span { font-size: 11px; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.hd-pane[data-pane="skill"] .sk > small { font-size: 10px; }
.hd-pane[data-pane="skill"] .sk .sk-effect { display: none; }
/* 정보: 직업·패시브·연계기·이야기 */
.hd-pane[data-pane="info"] .hd-story { max-width: none; margin-top: 6px; padding: 8px 10px; }
.hd-pane[data-pane="info"] .hd-story p { font-size: 12px; line-height: 1.6; }
@media (max-width: 700px) {
  .menu.scr-hero .hd.tabbed { grid-template-columns: minmax(0, 1fr); grid-template-rows: 150px minmax(0, 1fr); }
  .hd-pane[data-pane="skill"]:not([hidden]) { grid-template-columns: minmax(0, 1fr); }
}

/* 패배 결과: 레벨 부족 안내(수련 던전) */
.res-train { margin: 6px 0; padding: 6px 8px; border-radius: 6px; background: rgba(120, 40, 20, .55); color: #ffd8b0; font-size: 12px; font-weight: 700; line-height: 1.45; }
.res-train .nbtn { margin-left: 6px; padding: 3px 10px; font-size: 12px; }

/* ---------- 보스 체력 막대 (최종 미감 점검) ---------- */
/* 로비 배너의 .bn 규칙(투명·절대 위치)이 보스 이름에도 걸려 이름이 보이지 않던 문제 */
#hud #bossbar .bn { position: static; inset: auto; opacity: 1; transform: none; overflow: visible; background: none; border-radius: 0; transition: none; pointer-events: none; display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 14px; letter-spacing: 3px; }
#hud #bossbar .bn span { font-family: 'Black Han Sans', sans-serif; font-weight: 400; color: #ffe0d6; text-shadow: 2px 2px 0 #000, 0 0 10px #ff3020; }
#hud #bossbar { width: min(460px, 46vw); top: 64px; }
#hud #bossbar .bb { height: 12px; }
#hud #bossbar .brk { height: 6px; margin: 5px 4% 0 4%; }
#hud #bossbar .brk span { left: 0; right: auto; top: 8px; font-size: 10px; letter-spacing: 1px; }
#hud #bossbar.broken .bn span { color: #fff6c0; text-shadow: 2px 2px 0 #000, 0 0 12px #ffd84a; }
