/* ==========================================================
   스텝튜브 · 제우스 — 디자인 시스템 (다크 + 골드)
   ========================================================== */
:root{
  --bg:#0d1013; --bg-2:#111619; --surface:#111619; --surface-2:#191f23; --surface-3:#272e33;
  --line:#2a3239; --line-2:#424b53;
  --text:#f3f2ed; --text-2:#c3c6c8; --muted:#969fa7; --faint:#717b85;
  --gold:#dfb14f; --gold-2:#c7942e; --gold-soft:rgba(223,177,79,.12); --gold-line:rgba(223,177,79,.42);
  --gold-fill:linear-gradient(115deg,#f0d07a 0%,#d7a641 65%,#c7942e 100%);
  --gold-ink:#201706; --gold-focus:#f5da94;
  --gold-shadow:0 5px 18px rgba(199,148,46,.18);
  --blue:#7fb4ff; --violet:#b79cff; --amber:#f0a868; --red:#ff7a7a; --green:#6fd3a4; --teal:#6fd0d3;
  --lv-start:#8fd3ff; --lv-early:#9fe3a0; --lv-mid:#f2c56b; --lv-spec:#e59cff;
  --r:8px; --r-sm:7px; --r-xs:5px;
  --shadow:0 10px 30px rgba(0,0,0,.35);
  --font:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Noto Sans KR","Malgun Gothic",system-ui,sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --wrap:1120px; --pad:20px;
  --tab-h:64px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:15.5px;line-height:1.62;letter-spacing:-.01em;
  -webkit-font-smoothing:antialiased;padding-bottom:calc(var(--tab-h) + env(safe-area-inset-bottom));
  background-image:radial-gradient(900px 400px at 15% -10%,rgba(230,194,90,.07),transparent 60%),radial-gradient(700px 300px at 100% 0,rgba(127,180,255,.05),transparent 60%)}
a{color:inherit;text-decoration:none}
b,strong{font-weight:700}
img{max-width:100%;display:block}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
kbd{font-family:var(--mono)}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad)}
.muted{color:var(--muted)}
.skip{position:absolute;left:-999px;top:0}
.skip:focus{left:8px;top:8px;background:var(--gold);color:#000;padding:6px 10px;border-radius:6px;z-index:99}
h1,h2,h3{margin:0;line-height:1.25;letter-spacing:-.02em;font-weight:800}
h1{font-size:clamp(26px,5vw,40px)}
p{margin:0}
.num,.data-table td.num,.data-table th.num{font-variant-numeric:tabular-nums;text-align:right}.data-table th.nw,.data-table td.nw{white-space:nowrap}

/* ---------- 헤더 */
.top{position:sticky;top:0;z-index:50;background:rgba(11,13,18,.78);backdrop-filter:saturate(160%) blur(14px);-webkit-backdrop-filter:saturate(160%) blur(14px);border-bottom:1px solid var(--line)}
.top-inner{display:flex;align-items:center;gap:22px;height:60px}
.brand{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.brand-mark{color:var(--gold);display:grid;place-items:center}
.brand-text{display:flex;flex-direction:column;line-height:1}
.brand-text b{font-size:12px;letter-spacing:.22em;color:var(--text-2)}
.brand-text i{font-style:normal;font-weight:800;font-size:15px;letter-spacing:.14em;color:var(--gold)}
.nav{display:none;gap:4px;margin-left:8px}
.nav a{padding:8px 12px;border-radius:8px;color:var(--text-2);font-weight:600;font-size:14.5px}
.nav a:hover{background:var(--surface-2);color:var(--text)}
.nav a[aria-current]{color:var(--gold);background:var(--gold-soft)}
.top-actions{margin-left:auto;display:flex;gap:8px;align-items:center}
.search-btn,.yt-btn{display:flex;align-items:center;gap:8px;height:38px;padding:0 12px;border-radius:10px;border:1px solid var(--line-2);color:var(--text-2);font-size:14px;font-weight:600}
.search-btn:hover,.yt-btn:hover{border-color:var(--gold-line);color:var(--text)}
.search-btn kbd{font-size:11px;padding:1px 6px;border:1px solid var(--line-2);border-radius:5px;color:var(--muted)}
.search-btn span,.search-btn kbd,.yt-btn span{display:none}
.yt-btn{color:#ff5a5a;border-color:rgba(255,90,90,.3)}
@media(min-width:760px){.nav{display:flex}.search-btn span,.search-btn kbd,.yt-btn span{display:inline}.search-btn{min-width:150px}}

/* ---------- 모바일 탭바 */
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:60;display:grid;grid-template-columns:repeat(5,1fr);height:calc(var(--tab-h) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:rgba(15,18,26,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--line)}
.tabbar a,.tabbar button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:11px;font-weight:600;color:var(--muted)}
.tabbar a[aria-current]{color:var(--gold)}
@media(min-width:760px){.tabbar{display:none}body{padding-bottom:0}}

/* ---------- 공통 요소 */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 20px;border-radius:12px;font-weight:700;font-size:15px;border:1px solid transparent;transition:.15s}
.btn-gold{background:linear-gradient(180deg,#f0d070,#d9b446);color:#1a1405;box-shadow:0 6px 20px rgba(230,194,90,.25)}
.btn-gold:hover{filter:brightness(1.05);transform:translateY(-1px)}
.btn-ghost{border-color:var(--line-2);color:var(--text)}
.btn-ghost:hover{border-color:var(--gold-line);background:var(--surface)}
.link{color:var(--gold);font-weight:600;font-size:14px}
.link-btn{color:var(--gold);font-weight:600;font-size:13.5px}
.eyebrow{font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);font-weight:700;margin-bottom:10px}
.lead{font-size:clamp(15.5px,2.2vw,17.5px);color:var(--text-2);line-height:1.7}
.br-wide{display:none}@media(min-width:900px){.br-wide{display:inline}}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:16px}
.sec-head-sm{margin-bottom:10px}
.sec-title{font-size:clamp(19px,3vw,24px)}
.sec-title-sm{font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:700;margin-bottom:12px}
.grid{display:grid;gap:14px;grid-template-columns:1fr}
@media(min-width:640px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}}
@media(min-width:960px){.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}}
section{margin:44px 0}
@media(min-width:760px){section{margin:64px 0}}

/* 배지 */
.badge{display:inline-flex;align-items:center;height:20px;padding:0 7px;border-radius:5px;font-size:11.5px;font-weight:700;letter-spacing:.02em;vertical-align:middle;white-space:nowrap;border:1px solid transparent}
.badge-measured{background:var(--gold-soft);color:var(--gold);border-color:var(--gold-line)}
.badge-fact{background:rgba(127,180,255,.14);color:var(--blue)}
.badge-estimate{background:rgba(240,168,104,.14);color:var(--amber);border-style:dashed;border-color:rgba(240,168,104,.5)}
.badge-judge{background:rgba(183,156,255,.14);color:var(--violet)}
.badge-unknown{background:rgba(255,255,255,.07);color:var(--muted)}
.badge-conflict{background:rgba(255,122,122,.14);color:var(--red)}
.badge-external{background:transparent;color:var(--muted);border-color:var(--line-2)}
.badge-warn{background:rgba(255,122,122,.14);color:var(--red)}

/* 수준 칩 */
.levels{display:inline-flex;gap:5px;flex-wrap:wrap}
.lv{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:999px;font-size:11.5px;font-weight:700;border:1px solid var(--line-2);color:var(--text-2)}
.levels-sm .lv{height:20px;font-size:11px;padding:0 7px}
.lv-start{color:var(--lv-start);border-color:rgba(143,211,255,.35)}
.lv-early{color:var(--lv-early);border-color:rgba(159,227,160,.35)}
.lv-mid{color:var(--lv-mid);border-color:rgba(242,197,107,.4)}
.lv-spec{color:var(--lv-spec);border-color:rgba(229,156,255,.4)}

/* 트랙 라벨 */
.track{display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:6px;font-size:11.5px;font-weight:800;letter-spacing:.06em}
.track-data{background:rgba(230,194,90,.16);color:var(--gold)}
.track-guide{background:rgba(111,211,164,.14);color:var(--green)}
.track-rule{background:rgba(111,208,211,.14);color:var(--teal)}
.track-site{background:var(--surface-3);color:var(--text-2)}
.new{display:inline-flex;align-items:center;height:20px;padding:0 7px;border-radius:5px;background:var(--gold);color:#1a1405;font-size:10.5px;font-weight:900;letter-spacing:.1em}

/* 카드 */
.card{display:flex;flex-direction:column;gap:8px;padding:18px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);transition:.18s;position:relative;overflow:hidden}
.card::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:transparent;transition:.18s}
.card-data::before{background:var(--gold)}.card-guide::before{background:var(--green)}.card-rule::before{background:var(--teal)}
.card:hover{border-color:var(--line-2);background:var(--surface-2);transform:translateY(-2px);box-shadow:var(--shadow)}
.card-top{display:flex;align-items:center;gap:8px}
.card-date{margin-left:auto;font-size:12px;font-variant-numeric:tabular-nums}
.card-title{font-size:17px;font-weight:800;line-height:1.35}
.card-sub{font-size:13.5px;color:var(--muted);line-height:1.5}
.card-foot{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:6px}
.has-video{margin-left:auto;color:#ff5a5a;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:rgba(255,90,90,.12)}

/* ---------- 홈 */
.hero{display:grid;gap:28px;padding:44px 0 8px}
@media(min-width:900px){.hero{grid-template-columns:1.4fr 1fr;align-items:center;padding:72px 0 16px}}
.hero h1{font-size:clamp(32px,6vw,54px);letter-spacing:-.03em;margin-bottom:16px}
.hero h1 em{font-style:normal;color:var(--gold);background:linear-gradient(90deg,#f3d77a,#c9a43b);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero-cta{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap}
.hero-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.hero-stats div{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px}
.hero-stats b{display:block;font-size:26px;font-weight:800;color:var(--gold);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.hero-stats span{font-size:12.5px;color:var(--muted)}

.level-grid{display:grid;gap:10px;grid-template-columns:repeat(2,1fr)}
@media(min-width:760px){.level-grid{grid-template-columns:repeat(4,1fr)}}
.level-btn{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:16px;text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);transition:.15s}
.level-btn:hover{border-color:var(--line-2);background:var(--surface-2)}
.level-btn[aria-checked=true]{border-color:var(--gold-line);background:var(--gold-soft);box-shadow:inset 0 0 0 1px var(--gold-line)}
.level-icon{font-size:18px;color:var(--gold)}
.level-name{font-weight:800;font-size:16px}
.level-desc{font-size:12.5px;color:var(--muted);line-height:1.45}
.level-result{margin-top:22px;padding-top:22px;border-top:1px dashed var(--line-2)}
.level-result h3{font-size:16px}
[data-level] .level-result .card{display:none}
html[data-level=start] .level-result .card[data-levels~=start],html[data-level=early] .level-result .card[data-levels~=early],html[data-level=mid] .level-result .card[data-levels~=mid],html[data-level=spec] .level-result .card[data-levels~=spec]{display:flex}

.track-card{display:block;padding:20px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);transition:.18s}
.track-card:hover{border-color:var(--line-2);transform:translateY(-2px);box-shadow:var(--shadow)}
.track-card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.track-card .count{font-size:22px;font-weight:800;color:var(--muted);font-variant-numeric:tabular-nums}
.track-card p{color:var(--text-2);font-size:14px;margin-bottom:12px}
.mini-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:5px}
.mini-list li{font-size:13.5px;color:var(--muted);padding-left:12px;position:relative}
.mini-list li::before{content:"";position:absolute;left:0;top:9px;width:5px;height:5px;border-radius:50%;background:var(--faint)}

.teaser-inner{display:grid;gap:18px;padding:26px;border:1px solid var(--gold-line);border-radius:var(--r);background:linear-gradient(135deg,rgba(230,194,90,.10),rgba(230,194,90,.02))}
@media(min-width:900px){.teaser-inner{grid-template-columns:1.1fr 1fr auto;align-items:center}}
.teaser h2{font-size:clamp(20px,3vw,26px)}.teaser h2 b{color:var(--gold)}
.teaser-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px}
.teaser-list li{font-size:14px;color:var(--text-2);padding-left:16px;position:relative}
.teaser-list li::before{content:"?";position:absolute;left:0;color:var(--gold);font-weight:800}

.vcard{display:block;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden}
.vcard img{aspect-ratio:16/9;object-fit:cover;width:100%}
.vcard span{display:block;padding:10px 12px;font-size:13.5px;font-weight:600;line-height:1.4}
.principle{padding:20px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
.principle b{display:block;font-size:16px;margin-bottom:8px}
.principle p{font-size:14px;color:var(--text-2);line-height:1.7}

/* ---------- 목록 페이지 */
.page-head{padding:36px 0 8px}
.page-head h1{margin:8px 0 10px}
.notice{display:flex;gap:10px;align-items:flex-start;margin-top:18px;padding:12px 14px;border-radius:var(--r-sm);font-size:14px;line-height:1.55;border:1px solid var(--line)}
.notice i{flex:0 0 8px;width:8px;height:8px;border-radius:50%;margin-top:7px}
.notice-live{background:var(--gold-soft);border-color:var(--gold-line)}.notice-live i{background:var(--gold);box-shadow:0 0 0 4px rgba(230,194,90,.2);animation:pulse 2s infinite}
.notice-done{background:rgba(111,211,164,.08);border-color:rgba(111,211,164,.3)}.notice-done i{background:var(--green)}
@keyframes pulse{0%,100%{box-shadow:0 0 0 3px rgba(230,194,90,.2)}50%{box-shadow:0 0 0 7px rgba(230,194,90,.05)}}
.filter{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0 18px;position:sticky;top:106px;z-index:5;padding:10px 0;background:linear-gradient(var(--bg) 85%,transparent)}
.chip{height:34px;padding:0 13px;border-radius:999px;border:1px solid var(--line-2);font-size:13.5px;font-weight:600;color:var(--text-2);transition:.15s}
.chip:hover{border-color:var(--gold-line)}
.chip[aria-pressed=true]{background:var(--gold);color:#1a1405;border-color:var(--gold)}
.list-grid .card.hide{display:none}
.empty{padding:40px 0;text-align:center}

/* ---------- 문서 공통 */
.doc{padding:32px 0 10px;max-width:860px}
.crumbs{display:flex;gap:8px;font-size:13px;color:var(--muted);margin-bottom:12px}
.crumbs a{color:var(--gold)}
.doc-head h1{margin-bottom:10px}
.doc-head-row{display:flex;flex-direction:column;gap:12px;margin-top:18px}
.meta{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;font-size:13.5px}
.meta-item b{font-variant-numeric:tabular-nums;font-weight:700}
.meta-src{flex-basis:100%;color:var(--text-2)}
.pill{display:inline-flex;align-items:center;gap:7px;height:26px;padding:0 10px;border-radius:999px;font-size:12.5px;font-weight:700;border:1px solid}
.pill i{width:7px;height:7px;border-radius:50%}
.pill-live{color:var(--gold);border-color:var(--gold-line);background:var(--gold-soft)}.pill-live i{background:var(--gold);animation:pulse 2s infinite}
.pill-done{color:var(--green);border-color:rgba(111,211,164,.35);background:rgba(111,211,164,.08)}.pill-done i{background:var(--green)}
.pill-rule{color:var(--teal);border-color:rgba(111,208,211,.35);background:rgba(111,208,211,.08)}.pill-rule i{background:var(--teal)}
.doc section{margin:34px 0}
.doc-summary{color:var(--text-2);margin-top:20px;line-height:1.75}

.conc-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px}
.conc-list li{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);font-size:15.5px;line-height:1.6;font-weight:500}
.conc-list .badge{margin-top:3px;flex:0 0 auto}
.kp-list{margin:0;padding:18px 18px 18px 40px;background:linear-gradient(135deg,rgba(230,194,90,.12),rgba(230,194,90,.03));border:1px solid var(--gold-line);border-radius:var(--r);display:flex;flex-direction:column;gap:8px;font-size:16px;font-weight:600;line-height:1.55;counter-reset:kp}
.kp-list li::marker{color:var(--gold);font-weight:800}
.formula pre{margin:0;padding:14px 16px;background:#0a0c10;border:1px solid var(--line-2);border-radius:var(--r-sm);font-family:var(--mono);font-size:13.5px;line-height:1.7;color:var(--gold);white-space:pre-wrap;overflow-x:auto}
.method p{padding:14px 16px;background:var(--surface);border-left:3px solid var(--blue);border-radius:0 var(--r-sm) var(--r-sm) 0;color:var(--text-2);line-height:1.75}

/* 표 */
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);margin:0}
table{border-collapse:collapse;width:100%;font-size:14px;min-width:100%}
th,td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top;line-height:1.5}
th{font-size:12px;letter-spacing:.06em;color:var(--muted);font-weight:700;background:var(--surface-2);white-space:nowrap;position:sticky;top:0}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover td{background:rgba(255,255,255,.02)}
td.emph{font-weight:800;color:var(--gold);font-size:15.5px;font-variant-numeric:tabular-nums}
th.emph{color:var(--gold)}
tr.hl td{background:var(--gold-soft)}
tr.hl td:first-child{box-shadow:inset 3px 0 0 var(--gold)}
.dtable-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:10px}
.dtable-head h2{font-size:18px}
.tnote{font-size:13px;margin-top:8px;line-height:1.6}
.sortable th{cursor:pointer;user-select:none}
.sortable th:hover{color:var(--text)}
.sortable th[data-dir]::after{content:" ↑";color:var(--gold)}.sortable th[data-dir=desc]::after{content:" ↓"}
@media(max-width:640px){table{font-size:13px}th,td{padding:9px 10px}}

.note-list,.pending-list,.hist{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.note{display:flex;gap:10px;align-items:flex-start;padding:11px 13px;border-radius:var(--r-sm);background:var(--surface);border:1px solid var(--line);font-size:14px;line-height:1.6;color:var(--text-2)}
.note .badge{flex:0 0 auto;margin-top:2px}
.note-judge{border-left:3px solid var(--violet)}.note-conflict{border-left:3px solid var(--red)}.note-external{opacity:.85}
.pending-list li{position:relative;padding:9px 12px 9px 30px;background:rgba(255,255,255,.025);border:1px dashed var(--line-2);border-radius:var(--r-sm);font-size:14px;color:var(--text-2)}
.pending-list li::before{content:"?";position:absolute;left:12px;top:8px;color:var(--gold);font-weight:900}
.hist li{display:flex;gap:14px;font-size:13.5px;color:var(--text-2)}
.hist time{font-variant-numeric:tabular-nums;color:var(--muted);flex:0 0 auto}

/* 영상 */
.video{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.video-play{position:relative;display:block;width:100%;aspect-ratio:16/9;background:#000}
.video-play img{width:100%;height:100%;object-fit:cover;opacity:.8}
.video-btn{position:absolute;inset:0;margin:auto;width:64px;height:64px;border-radius:50%;background:rgba(230,194,90,.95);color:#1a1405;display:grid;place-items:center;box-shadow:0 8px 30px rgba(0,0,0,.5);transition:.15s}
.video-play:hover .video-btn{transform:scale(1.06)}
.video iframe{display:block;width:100%;aspect-ratio:16/9;border:0}
.video-tools{display:flex;justify-content:space-between;gap:10px;padding:10px 14px;font-size:13px}
.video-tools a{color:var(--gold);font-weight:600}
.video.playing .video-play{display:none}
.vitem-meta{display:flex;justify-content:space-between;align-items:center;margin-top:8px;font-size:13px}
.vitem-rel{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.tag-link{font-size:12.5px;color:var(--gold);padding:3px 8px;border:1px solid var(--gold-line);border-radius:999px}
.empty-box{padding:50px 20px;text-align:center;border:1px dashed var(--line-2);border-radius:var(--r);display:flex;flex-direction:column;gap:16px;align-items:center;color:var(--muted)}

/* 본문(prose) */
.doc-body-wrap{display:grid;gap:28px}
@media(min-width:1000px){.doc-body-wrap{grid-template-columns:200px 1fr;align-items:start}.doc-wide{max-width:none}.doc-wide .doc-body{max-width:760px}}
.toc{position:sticky;top:124px;font-size:13px}
.toc-title{font-size:11.5px;letter-spacing:.12em;color:var(--muted);font-weight:700;margin-bottom:8px}
.toc ol{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:2px;border-left:1px solid var(--line)}
.toc a{display:block;padding:5px 12px;color:var(--muted);border-left:2px solid transparent;margin-left:-1px;line-height:1.4}
.toc a:hover{color:var(--text)}.toc a.active{color:var(--gold);border-left-color:var(--gold)}
@media(max-width:999px){.toc{position:static;padding:14px 16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm)}.toc ol{border:0;display:grid;grid-template-columns:1fr 1fr;gap:4px 10px}.toc a{padding:3px 0;border:0;margin:0}}
.prose{font-size:15.5px;line-height:1.8;color:var(--text)}
.prose h2{font-size:21px;margin:38px 0 14px;padding-top:6px;scroll-margin-top:80px}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:17px;margin:26px 0 10px}
.prose p{margin:0 0 14px}
.prose ul,.prose ol{margin:0 0 16px;padding-left:22px}
.prose li{margin:4px 0}
.prose li>ul{margin:4px 0 4px}
.prose strong{color:#fff}
.prose code{font-family:var(--mono);font-size:.9em;background:var(--surface-2);padding:1px 6px;border-radius:4px}
.prose .table-wrap{margin:16px 0}
.prose a{color:var(--gold);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--gold-line)}
.callout{margin:14px 0;padding:12px 14px;border-radius:var(--r-sm);background:var(--surface);border:1px solid var(--line);border-left-width:3px;font-size:14.5px;line-height:1.7;color:var(--text-2)}
.callout p{margin:0}.callout p+p{margin-top:6px}
.callout .badge{margin-right:6px;vertical-align:1px}
.callout-fact{border-left-color:var(--blue)}.callout-measured{border-left-color:var(--gold)}
.callout-judge{border-left-color:var(--violet);background:rgba(183,156,255,.05)}
.callout-unknown{border-left-color:var(--faint);border-style:dashed}
.callout-conflict{border-left-color:var(--red);background:rgba(255,122,122,.05)}
.callout-warn{border-left-color:var(--red);background:rgba(255,122,122,.06);color:var(--text)}
.callout-external{border-left-color:var(--faint);opacity:.85}
.callout-estimate{border-left-color:var(--amber)}
.callout-plain{border-left-color:var(--gold-line)}

/* 직업 */
.class-tabs{display:flex;gap:6px;overflow-x:auto;padding:4px 0 8px;margin:20px 0 8px;scrollbar-width:none;position:sticky;top:60px;background:linear-gradient(var(--bg) 80%,transparent);z-index:5}
.class-tabs::-webkit-scrollbar{display:none}
.class-tab{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:1px;padding:8px 14px;border-radius:10px;border:1px solid var(--line-2);color:var(--text-2);min-width:88px}
.class-tab b{font-size:14px}.class-tab span{font-size:11px;color:var(--muted)}
.class-tab[aria-selected=true]{background:var(--gold-soft);border-color:var(--gold-line);color:var(--gold)}
.class-tab[aria-selected=true] span{color:var(--gold-2)}
.class-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin:18px 0 6px}
.class-head h2{font-size:22px}.class-head h2 .muted{font-size:14px;font-weight:600;margin-left:8px}
.class-line{color:var(--gold);font-weight:600;margin-top:4px}
.skill-group{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:22px 0 10px;font-weight:700}
.skill-grid{display:grid;gap:10px;grid-template-columns:1fr}
@media(min-width:640px){.skill-grid{grid-template-columns:repeat(2,1fr)}}
.skill{padding:14px 15px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);border-top:2px solid var(--line-2)}
.skill.grade-고급{border-top-color:#8fd38f}.skill.grade-희귀{border-top-color:#7fb4ff}.skill.grade-영웅{border-top-color:#b79cff}.skill.grade-전설{border-top-color:var(--gold)}.skill.grade-특화{border-top-color:var(--teal)}
.skill-top{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.skill-name{font-size:15px}
.grade{font-size:11px;font-weight:700;color:var(--muted);padding:1px 6px;border:1px solid var(--line-2);border-radius:4px}
.skill-desc{font-size:13.5px;color:var(--text-2);margin:6px 0 8px;line-height:1.6}
.skill-stats{display:flex;flex-wrap:wrap;gap:6px 14px;margin:0;font-size:12.5px}
.skill-stats div{display:flex;gap:5px}.skill-stats dt{color:var(--muted)}.skill-stats dd{margin:0;font-weight:600;font-variant-numeric:tabular-nums}
.skill-cond{font-size:12.5px;margin-top:8px;padding-top:8px;border-top:1px dashed var(--line)}

/* 타임라인 */
.timeline{margin:24px 0 0;padding:0;list-style:none;display:flex;flex-direction:column}
.tl-item{display:grid;grid-template-columns:100px 1fr;gap:16px;padding:14px 0;border-bottom:1px solid var(--line)}
.tl-item time{font-variant-numeric:tabular-nums;color:var(--muted);font-size:13.5px;padding-top:2px}
.tl-link{display:inline-flex;align-items:center;gap:8px;font-weight:700;margin-bottom:4px}
.tl-body p{font-size:14px;color:var(--text-2)}
@media(max-width:520px){.tl-item{grid-template-columns:1fr;gap:4px}}

/* 관련 */
.related{border-top:1px solid var(--line);padding-top:36px}

/* 푸터 */
.foot{border-top:1px solid var(--line);margin-top:60px;padding:36px 0 30px;font-size:13.5px}
.foot-inner{display:grid;gap:18px}
@media(min-width:760px){.foot-inner{grid-template-columns:1.4fr 1fr;align-items:start}.foot-legal{grid-column:1/-1}}
.foot-brand{font-weight:800;letter-spacing:.14em;color:var(--gold);margin-bottom:8px}
.foot p{line-height:1.7}
.foot-links{display:flex;flex-wrap:wrap;gap:6px 16px}
.foot-links a{color:var(--text-2);font-weight:600}
.foot-links a:hover{color:var(--gold)}
.foot-legal{font-size:12.5px;padding-top:12px;border-top:1px solid var(--line)}

/* ---------- 검색 */
.search{position:fixed;inset:0;z-index:100;background:rgba(6,8,12,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:flex;align-items:flex-start;justify-content:center;padding:8vh 12px 12px}
.search[hidden]{display:none}
.search-panel{width:100%;max-width:680px;background:var(--surface);border:1px solid var(--line-2);border-radius:16px;box-shadow:0 30px 80px rgba(0,0,0,.6);overflow:hidden;max-height:84vh;display:flex;flex-direction:column}
.search-head{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line);color:var(--muted)}
#search-input{flex:1;background:none;border:0;outline:0;color:var(--text);font:inherit;font-size:17px;min-width:0}
#search-input::placeholder{color:var(--faint)}
.search-close{font-family:var(--mono);font-size:11px;padding:3px 7px;border:1px solid var(--line-2);border-radius:5px;color:var(--muted)}
.search-hint{padding:8px 16px;font-size:12.5px;border-bottom:1px solid var(--line)}
.search-hint b{color:var(--gold)}
.search-results{overflow:auto;padding:6px}
.sr{display:flex;flex-direction:column;gap:3px;padding:10px 12px;border-radius:10px}
.sr:hover,.sr.active{background:var(--surface-2)}
.sr-top{display:flex;gap:8px;align-items:center}
.sr-title{font-weight:700;font-size:15px}
.sr-title mark,.sr-sub mark{background:var(--gold-soft);color:var(--gold);padding:0 2px;border-radius:3px}
.sr-sub{font-size:13px;color:var(--muted);line-height:1.45}
.sr-group{padding:10px 12px 4px;font-size:11px;letter-spacing:.12em;color:var(--faint);font-weight:700}
.sr-empty{padding:30px;text-align:center;color:var(--muted)}
@media(max-width:640px){.search{padding:0;align-items:stretch}.search-panel{max-width:none;max-height:none;border-radius:0;height:100%}}

@media print{.top,.tabbar,.search,.foot,.related{display:none}body{background:#fff;color:#000}}

/* ---------- 도구 (계산기) */
.track-tool{background:rgba(183,156,255,.14);color:var(--violet)}
.card-tool::before{background:var(--violet)}
.track-card-tool .track{background:rgba(183,156,255,.14);color:var(--violet)}
.tabbar{grid-template-columns:repeat(auto-fit,minmax(0,1fr))}
.doc-tool{max-width:none}
.tool-input{margin:22px 0 18px;padding:18px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
.tool-input-grid{display:grid;gap:12px 16px;grid-template-columns:repeat(2,1fr)}
@media(min-width:760px){.tool-input-grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1100px){.tool-input-grid{grid-template-columns:repeat(6,1fr)}}
.field{display:flex;flex-direction:column;gap:5px;min-width:0}
.field label{font-size:12.5px;color:var(--text-2);font-weight:600}
.field label small{color:var(--muted);font-weight:500}
.field .hint{font-size:11.5px;color:var(--muted);line-height:1.4}
.field select,.field input[type=number],table.edit input[type=number]{width:100%;height:40px;padding:0 10px;border:1px solid var(--line-2);border-radius:8px;background:var(--surface-2);color:var(--text);font:inherit;font-size:15px;font-weight:600;font-variant-numeric:tabular-nums}
.field input[type=number]{text-align:right}
.field select:focus,.field input:focus,table.edit input:focus{outline:2px solid var(--gold-line);outline-offset:1px;border-color:var(--gold-line)}
.unit{display:flex;align-items:center;gap:8px}.unit span{flex:none;font-size:12.5px;color:var(--muted)}
.warn{margin-top:12px;padding:10px 14px;border-radius:var(--r-sm);background:rgba(255,122,122,.08);border:1px solid rgba(255,122,122,.3);color:var(--red);font-size:13.5px;line-height:1.5}
.warn-note{background:rgba(240,168,104,.09);border-color:rgba(240,168,104,.38);color:var(--amber)}
.tool-grid{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:1000px){.tool-grid{grid-template-columns:1fr 1fr}}
.tool-panel{padding:18px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);display:flex;flex-direction:column;gap:12px;min-width:0}
.tool-panel-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.tool-panel-head h2{font-size:17px}
.tool-panel-head h2 .muted{font-size:13px;font-weight:600}
.tool-panel-tag{font-size:11.5px;letter-spacing:.06em;color:var(--gold);font-weight:700;padding:2px 8px;border:1px solid var(--gold-line);border-radius:999px}
.tool-panel .table-wrap{margin:0}
.tool-table{font-size:13.5px}
.tool-table th{position:static;font-size:11px;line-height:1.3}
.tool-table th.pri,.tool-table td.pri{color:var(--gold)}
.tool-table td.pri .big{font-size:18px;font-weight:800;font-variant-numeric:tabular-nums}
.tool-table th.sec,.tool-table td.sec{color:var(--muted);font-size:12px}
.tool-table td.gold{color:var(--amber);font-weight:600}
.tool-table td.ess{color:var(--green)}
.tool-table td.ess small{display:block;font-size:11px;color:var(--muted);font-weight:500;white-space:nowrap}
.tool-table tr.hl td{background:var(--gold-soft)}
.tool-table tr.best td{background:rgba(111,211,164,.08)}
.tool-table td .badge{vertical-align:middle}
.tool-table.edit input[type=number]{width:104px;height:32px;font-size:13.5px;padding:0 8px;text-align:right}
.verdict{padding:11px 14px;border-radius:var(--r-sm);background:rgba(111,211,164,.08);border:1px solid rgba(111,211,164,.3);color:var(--text);font-size:14px;line-height:1.55}
.verdict b{color:var(--green)}
.tool-cards{display:grid;gap:8px;grid-template-columns:repeat(3,1fr)}
.tool-card{padding:10px 12px;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-sm);min-width:0}
.tool-card .k{font-size:11.5px;color:var(--muted)}
.tool-card .v{font-size:19px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.01em;margin-top:2px}
.tool-card .v small{font-size:12px;font-weight:600;color:var(--muted);margin-left:2px}
.tool-card .s{font-size:11px;color:var(--muted)}
.tool-card.pri{border-color:var(--gold-line);background:var(--gold-soft)}.tool-card.pri .v{color:var(--gold)}
.tool-card .v.gold{color:var(--amber)}.tool-card .v.ess{color:var(--green)}
.radios{display:flex;gap:14px;flex-wrap:wrap;font-size:13px;align-items:center}
.radios label{display:flex;align-items:center;gap:6px;cursor:pointer}
.tool-sub{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:700;margin-top:4px}
.breaks li::before{content:"!"}
.tool-table th:first-child,.tool-table td:first-child{white-space:nowrap;position:sticky;left:0;z-index:1;background:var(--surface)}
.tool-table th:first-child{background:var(--surface-2)}
.tool-table tr.hl td:first-child{background:linear-gradient(var(--gold-soft),var(--gold-soft)) var(--surface)}
.tool-table tr.best td:first-child{background:linear-gradient(rgba(111,211,164,.08),rgba(111,211,164,.08)) var(--surface)}
.tool-table td:first-child .badge{display:inline-block;margin-left:4px}

/* ---- 1차 수정 (2026-09-05): 할 일 블록 · 참고 자료 · 접기 ---- */
.action{margin:22px 0 8px;padding:18px 20px;border:1px solid var(--gold-line);border-radius:var(--r);background:linear-gradient(135deg,rgba(230,194,90,.14),rgba(230,194,90,.03))}
.action-label{display:inline-block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);font-weight:800;margin-right:8px}
.action-helps{margin:0;font-size:17px;font-weight:700;line-height:1.5}
.action-todo{margin:12px 0 0;padding-left:26px;display:flex;flex-direction:column;gap:6px;font-size:15px;line-height:1.55}
.action-todo li::marker{color:var(--gold);font-weight:800}
.brief{margin:18px 0 6px;padding:14px 18px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface)}
.brief .action-label{color:var(--muted)}
.brief-list{margin:8px 0 0;padding-left:20px;font-size:15px;line-height:1.55;display:flex;flex-direction:column;gap:4px}
.fold{margin-top:22px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface)}
.fold>summary{cursor:pointer;padding:14px 18px;font-weight:700;list-style:none;display:flex;align-items:center;gap:10px}
.fold>summary::-webkit-details-marker{display:none}
.fold>summary::before{content:"";width:8px;height:8px;border-right:2px solid var(--gold);border-bottom:2px solid var(--gold);transform:rotate(-45deg);transition:.18s;flex:0 0 8px}
.fold[open]>summary::before{transform:rotate(45deg)}
.fold[open]>summary{border-bottom:1px solid var(--line)}
.fold .doc-body-wrap{padding:6px 18px 18px}
.refs{margin-top:40px;padding-top:24px;border-top:1px solid var(--line)}
.refs .sec-head-sm{display:flex;flex-direction:column;gap:2px;margin-bottom:12px}
.list-grid-ref .card{opacity:.82}
.list-grid-ref .card:hover{opacity:1}
.track-card-ref{opacity:.8}
.featured{margin-top:36px}
.featured .sec-head{flex-wrap:wrap;gap:4px 16px}
@media (max-width:720px){.featured .sec-head{flex-direction:column;align-items:flex-start}.featured .sec-head .muted{font-size:13px}}

/* ---- 강화 계산기 v2 (2026-09-05): 버튼 묶음 · 시세 입력 · 통합 비교 ---- */
.seg-row{display:grid;gap:14px 18px;grid-template-columns:1fr}
@media(min-width:760px){.seg-row{grid-template-columns:auto auto 1fr}}
.seg-field{display:flex;flex-direction:column;gap:7px;min-width:0}
.seg-label{font-size:12.5px;color:var(--text-2);font-weight:700}
.seg-label small{font-weight:500}
.seg{display:inline-flex;flex-wrap:wrap;gap:4px;padding:4px;background:var(--surface-2);border:1px solid var(--line-2);border-radius:12px;width:max-content;max-width:100%}
.seg-btn{position:relative;display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 15px;border:1px solid transparent;border-radius:9px;background:transparent;color:var(--text-2);font:inherit;font-size:14px;font-weight:700;cursor:pointer;transition:.15s;white-space:nowrap}
.seg-btn:hover{color:var(--text);background:rgba(255,255,255,.04)}
.seg-btn[aria-checked=true]{color:var(--text);background:var(--surface);border-color:var(--line-2);box-shadow:0 1px 0 rgba(0,0,0,.25),inset 0 0 0 1px rgba(255,255,255,.03)}
.seg-btn:disabled{opacity:.3;cursor:not-allowed}
.seg-btn:focus-visible{outline:2px solid var(--gold-line);outline-offset:1px}
.seg-gold .seg-btn[aria-checked=true]{color:var(--gold);border-color:var(--gold-line);background:var(--gold-soft)}
.seg-sm .seg-btn{height:32px;padding:0 12px;font-size:13px}
.seg-btn i{width:9px;height:9px;border-radius:50%;flex:none;background:var(--muted);box-shadow:0 0 0 2px rgba(255,255,255,.06)}
.seg-btn.g-normal i{background:#c9c5b8}
.seg-btn.g-adv i{background:#6fd3a4;box-shadow:0 0 0 2px rgba(111,211,164,.25)}
.seg-btn.g-rare i{background:#7fb4ff;box-shadow:0 0 0 2px rgba(127,180,255,.25)}
.seg-btn.g-normal[aria-checked=true]{color:#e8e6df}
.seg-btn.g-adv[aria-checked=true]{color:#6fd3a4;border-color:rgba(111,211,164,.4);background:rgba(111,211,164,.1)}
.seg-btn.g-rare[aria-checked=true]{color:#7fb4ff;border-color:rgba(127,180,255,.4);background:rgba(127,180,255,.1)}
.price-block{margin-top:18px;padding-top:16px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:10px}
.price-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.price-grid{display:grid;gap:8px;grid-template-columns:repeat(4,1fr)}
@media(min-width:760px){.price-grid{grid-template-columns:repeat(7,1fr)}}
.price-grid-etc{grid-template-columns:repeat(2,1fr)}
@media(min-width:760px){.price-grid-etc{grid-template-columns:repeat(7,1fr)}.price-grid-etc .price{grid-column:span 2}}
.price{display:flex;flex-direction:column;gap:4px;min-width:0;transition:.15s}
.price>span{font-size:12px;font-weight:700;color:var(--text-2);display:flex;justify-content:space-between;align-items:baseline}
.price>span small{color:var(--muted);font-weight:500;font-size:11px}
.price input{width:100%;height:40px;padding:0 10px;border:1px solid var(--line-2);border-radius:9px;background:var(--surface-2);color:var(--text);font:inherit;font-size:15px;font-weight:700;text-align:right;font-variant-numeric:tabular-nums}
.price input:focus{outline:2px solid var(--gold-line);outline-offset:1px;border-color:var(--gold-line)}
.price input::placeholder{color:var(--faint,#555a66);font-weight:500}
.price.off{opacity:.35}
.price.is-target>span{color:var(--gold)}
.price.is-target input{border-color:var(--gold-line);background:var(--gold-soft)}
.price-ess input{border-color:rgba(111,211,164,.35)}
.price-block .hint{font-size:12px;color:var(--muted);line-height:1.5;margin:0}
.tool-panel-full{margin-bottom:16px}
.tool-table th.net-h.dim,.tool-table td.net.dim{opacity:.45}
.tool-table th small{display:block;font-weight:500;color:var(--muted);font-size:10px}
.tool-table th.ess-h{color:var(--green)}
#compare td:first-child{font-weight:500}
#compare tr.best td:first-child b{color:var(--green)}
@media(max-width:759px){.seg{width:100%}.seg-btn{flex:1 1 auto;justify-content:center;padding:0 8px}.seg-gold .seg-btn{min-width:0}}
@media(max-width:759px){
  .price-grid{grid-template-columns:repeat(3,1fr)}.price-grid-etc{grid-template-columns:repeat(2,1fr)}
  .price input{font-size:14px;padding:0 8px;height:38px}
  #compare .sec{display:none}
  #compare{font-size:12.5px}#compare td.pri .big{font-size:15px}
  #compare td.ess small{white-space:normal}
  .tool-cards{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:759px){
  #compare th:first-child,#compare td:first-child{white-space:normal;max-width:82px;padding-right:6px;line-height:1.3}
  #compare td:first-child .badge{display:block;margin:3px 0 0;width:max-content}
  #compare td.ess small{display:none}
}
@media(max-width:759px){#compare th,#compare td{padding-left:6px;padding-right:6px}#compare th:first-child,#compare td:first-child{padding-left:8px}}

/* ---- 계산기 v2.1: 입력 한 칸 ---- */
.seg-row-2{grid-template-columns:auto auto;justify-content:start}
.in-rows{margin-top:16px;padding-top:14px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:14px}
.in-row{display:flex;flex-wrap:wrap;gap:12px 22px;align-items:flex-end}
.in-row .seg-field{flex:0 0 auto}
.in-row .price{flex:0 1 240px;min-width:180px}
.unit-wrap{position:relative;display:block}
.unit-wrap input{padding-right:52px !important}
.unit-wrap em{position:absolute;right:12px;top:50%;transform:translateY(-50%);font-style:normal;font-size:12px;color:var(--muted);pointer-events:none}
.price-main>span b{color:var(--text);font-size:13px}
.price-main input{border-color:rgba(255,255,255,.18)}
.price-target>span b{color:var(--gold)}
.price-target input{border-color:var(--gold-line)}
.tool-input .hint{margin:12px 0 0;font-size:12px;color:var(--muted);line-height:1.5}
.seg-btn.g-normal{color:#d6d3ca}.seg-btn.g-adv{color:#6fd3a4}.seg-btn.g-rare{color:#7fb4ff}
.seg-btn.g-normal[aria-checked=true]{background:rgba(214,211,202,.12);border-color:rgba(214,211,202,.4)}
#compare tr.cur td:first-child{box-shadow:inset 3px 0 0 var(--text-2)}
#compare tr.best td:first-child{box-shadow:inset 3px 0 0 var(--green)}
#p-ref .price-ess{max-width:420px}
#p-ref .price-ess>span{flex-direction:column;align-items:flex-start;gap:2px}
@media(max-width:759px){.seg-row-2{grid-template-columns:1fr}.in-row .price{flex:1 1 100%}.in-row .seg-field{flex:1 1 100%}}

/* ---- 2차 (2026-09-06): 답 카드 ---- */
.answers{margin-top:40px}
.answers .sec-head{flex-wrap:wrap;gap:4px 16px}
.ans-grid{grid-template-columns:repeat(2,1fr)}
@media(min-width:1000px){.ans-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:640px){.ans-grid{grid-template-columns:1fr}}
.ans{display:flex;flex-direction:column;gap:10px;padding:18px 18px 16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);color:var(--text);text-decoration:none;position:relative;overflow:hidden;transition:.18s}
.ans::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--gold)}
.ans:hover{border-color:var(--gold-line);transform:translateY(-2px)}
.ans-q{font-size:17px;font-weight:800;letter-spacing:-.01em;line-height:1.3}
.ans-lines{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:7px;font-size:14px;line-height:1.5;color:var(--text-2);flex:1}
.ans-lines li::marker{color:var(--gold);font-weight:800}
.ans-lines .badge{vertical-align:middle;margin-left:2px}
.ans-link{font-size:12.5px;color:var(--gold);font-weight:700}
.action-todo .badge{vertical-align:middle;margin-left:4px}

/* ---- 3차 (2026-09-06): 주제 바 · 문서 안 영상 블록 ---- */
.topicbar{position:sticky;top:60px;z-index:40;background:rgba(11,13,18,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.topicbar-inner{display:flex;gap:6px;overflow-x:auto;padding:8px 20px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.topicbar-inner::-webkit-scrollbar{display:none}
.topicbar a{flex:none;font-size:13px;font-weight:700;color:var(--text-2);padding:7px 13px;border:1px solid var(--line);border-radius:999px;background:var(--surface);white-space:nowrap;transition:.15s}
.topicbar a:hover{color:var(--text);border-color:var(--gold-line)}
.topicbar a[aria-current=page]{color:var(--gold);border-color:var(--gold-line);background:var(--gold-soft)}
.vids{margin:18px 0 6px;display:flex;flex-direction:column;gap:14px}
.vid{display:grid;gap:14px;padding:14px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
@media(min-width:900px){.vid:not(.vid-more){grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:start}}
.vid .video{margin:0}
.vid-points{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:7px;font-size:14.5px;line-height:1.55}
.vid-points li::marker{color:var(--gold);font-weight:800}
.vid-points .badge{vertical-align:middle;margin-left:3px}
.vid-more{padding:10px 12px}
.vid-row{display:flex;gap:12px;align-items:center;color:var(--text);text-decoration:none}
.vid-row img{width:112px;aspect-ratio:16/9;object-fit:cover;border-radius:8px;flex:none}
.vid-row span{display:flex;flex-direction:column;gap:2px;min-width:0}
.vid-row b{font-size:14px;line-height:1.35}
.vid-row small{font-size:12px;color:var(--muted)}

/* 계산기 결과 이미지 저장 */
.share-row{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.btn-share{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 14px;border:1px solid var(--gold-line);border-radius:9px;background:var(--gold-soft);color:var(--gold);font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.btn-share:hover{background:rgba(230,194,90,.22)}
.share-overlay{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.7);display:flex;align-items:center;justify-content:center;padding:20px}
.share-box{max-width:720px;width:100%;background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r);padding:16px;display:flex;flex-direction:column;gap:12px;max-height:92vh;overflow:auto}
.share-box img{width:100%;height:auto;border-radius:8px;border:1px solid var(--line)}
.share-box .row{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.share-box .muted{font-size:12.5px}

/* ---- 신과 효율 계산기 ---- */
.two-col{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:900px){.two-col{grid-template-columns:1fr 1fr}}
.table-tall{max-height:520px;overflow:auto}
.table-tall thead th{position:sticky;top:0;z-index:2}
.pick-row{display:flex;gap:8px;flex-wrap:wrap}
.in-row-pick .seg-field{flex:1 1 100%}
#ladder td.stat-cell{white-space:nowrap}
#ladder tr.hl td{background:var(--gold-soft)}
#ladder td.ess small{display:block;font-size:10.5px;color:var(--muted)}
#picks select{width:100%;max-width:340px;height:34px;padding:0 8px;border:1px solid var(--line-2);border-radius:8px;background:var(--surface-2);color:var(--text);font:inherit;font-size:13px}
#rates input,#growth input{width:96px;height:32px;padding:0 8px;border:1px solid var(--line-2);border-radius:8px;background:var(--surface-2);color:var(--text);font:inherit;font-size:13.5px;text-align:right}
#growth .badge{margin-left:6px}
.tool-cards{grid-template-columns:repeat(3,1fr)}
@media(min-width:1000px){#p-result .tool-cards{grid-template-columns:repeat(6,1fr)}}
.seg-field .hint{font-size:12px;color:var(--muted)}
#p-result .table-tall{max-height:380px}
@media(min-width:1000px){.tool-grid-3{grid-template-columns:1fr 1fr 1fr}}
@media(min-width:1000px){.tool-grid-3{grid-template-columns:1.7fr 1fr}.tool-grid-3 #p-ref{grid-column:1/-1}}
#p-ref .ref-two{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:900px){#p-ref .ref-two{grid-template-columns:1fr 1.4fr}}
#growth td:last-child{white-space:nowrap}#growth input{width:80px}
#ladder th.num,#ladder td.num{white-space:nowrap}

/* 신과 v1.1 — 성공률 열 · 실패 보정 입력 */
.rate-cell{white-space:nowrap}.rate-cell small{display:block;font-size:10px;color:var(--muted);font-weight:500}
.price-pity{max-width:320px;margin:4px 0 6px}.price-pity input{padding-right:78px !important}
.hint-wide{flex:1 1 100%;font-size:12.5px;color:var(--muted)}

/* 영상 챕터 (유튜브 t= 링크) */
.vid-side{display:flex;flex-direction:column;gap:10px;min-width:0}
.vid-chapters{list-style:none;margin:0;padding:0;display:grid;gap:2px;font-size:13.5px}
.vid-chapters a{display:flex;gap:10px;align-items:baseline;padding:4px 8px;border-radius:6px;color:var(--text);text-decoration:none}
.vid-chapters a:hover{background:var(--surface-2);color:var(--gold)}
.vid-chapters time{font-variant-numeric:tabular-nums;color:var(--gold);font-weight:700;min-width:44px;font-size:12.5px}

/* 패치 예고 배너 */
.notice-patch{border-color:rgba(230,194,90,.45);background:rgba(230,194,90,.08)}
.notice-patch i{background:var(--gold)}
/* 정리 이미지 (영상 핵심 이미지) + 라이트박스 */
.figs{display:grid;gap:14px;margin:18px 0 6px}
@media(min-width:900px){.figs{grid-template-columns:repeat(2,minmax(0,1fr))}.figs-1{grid-template-columns:1fr}.figs .fig:first-child:nth-last-child(3){grid-column:1/-1}}
.fig{margin:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.fig-link{display:block;position:relative;line-height:0}
.fig-link img{width:100%;height:auto;display:block}
.fig-zoom{position:absolute;right:10px;bottom:10px;font-size:11.5px;line-height:1;padding:6px 9px;border-radius:999px;background:rgba(0,0,0,.65);color:#fff;border:1px solid rgba(255,255,255,.2)}
.fig figcaption{padding:10px 12px;font-size:13.5px;line-height:1.5}
.lightbox{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.92);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:16px;gap:10px;overflow:auto}
.lightbox img{max-width:100%;max-height:calc(100vh - 90px);object-fit:contain;border-radius:8px;cursor:zoom-in;transition:transform .15s}
.lightbox.zoomed{justify-content:flex-start;align-items:flex-start}
.lightbox.zoomed img{max-width:none;max-height:none;width:2000px;cursor:zoom-out}
.lightbox-bar{position:fixed;left:0;right:0;bottom:0;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 16px;background:rgba(0,0,0,.7);color:#ddd;font-size:13px}
.lightbox-bar a,.lightbox-bar button{color:var(--gold);background:none;border:0;font:inherit;cursor:pointer;padding:6px 8px}

.notice-newer{border-color:rgba(111,211,164,.4);background:rgba(111,211,164,.07)}.notice-newer i{background:var(--green)}.notice-newer a{color:var(--green);font-weight:700}
/* 강화 계산기 v3 — 부위 · 등급 · 티어 */
.seg-row-3{grid-template-columns:auto auto auto;justify-content:start;align-items:start}
@media(max-width:759px){.seg-row-3{grid-template-columns:1fr}}
.seg-off{opacity:.45}.seg-btn[disabled]{cursor:not-allowed}
.seg-btn.g-hero i{background:#b07cff}

.verdict .ok{color:var(--green);font-weight:700}

/* ---- 계산기 v3.2: 비교 표 안에서 시세 입력 (2026-09-24) ---- */
#compare td:first-child{vertical-align:top}
#compare .m-name{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-height:20px}
.row-price{display:block;margin-top:7px;width:138px;max-width:100%}
.row-price .unit-wrap input{width:100%;height:32px;padding:0 44px 0 10px !important;background:var(--surface-2);border:1px solid var(--line-2);border-radius:var(--r-xs);color:var(--text);font:700 14px var(--font);font-variant-numeric:tabular-nums;transition:border-color .15s,box-shadow .15s,background .15s}
.row-price .unit-wrap input::placeholder{color:var(--faint);font-weight:500}
.row-price .unit-wrap input:hover{border-color:var(--muted)}
.row-price .unit-wrap input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px var(--gold-soft);background:var(--surface-3)}
.row-price .unit-wrap input.need{border-color:var(--gold-line);background:var(--gold-soft)}
.row-price .unit-wrap em{right:9px;font-size:11px}
#compare tr.best .row-price input{border-color:rgba(111,211,164,.45)}
.row-x{margin-left:auto;display:inline-grid;place-items:center;width:22px;height:22px;border:0;border-radius:5px;background:none;color:var(--faint);font-size:17px;line-height:1;cursor:pointer}
.row-x:hover,.row-x:focus-visible{color:var(--text);background:var(--surface-3);outline:none}
.cmp-add{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin-top:12px;font-size:12.5px;color:var(--muted)}
.cmp-add[hidden]{display:none}
.cmp-add>span{margin-right:2px}
.cmp-add button{height:30px;padding:0 12px;border:1px dashed var(--line-2);border-radius:999px;background:none;color:var(--text-2);font:600 12.5px var(--font);cursor:pointer;transition:border-color .15s,color .15s,background .15s}
.cmp-add button:hover,.cmp-add button:focus-visible{border-style:solid;border-color:var(--gold-line);color:var(--gold);background:var(--gold-soft);outline:none}
.cmp-add button.buy{color:var(--gold)}
@media(max-width:759px){
  #compare th:first-child,#compare td:first-child{max-width:118px}
  .row-price{width:108px}
  .row-price .unit-wrap input{height:34px;font-size:15px;padding:0 38px 0 8px !important}
  .row-price .unit-wrap em{right:7px;font-size:10.5px}
}

/* ---- 성장도 계산기 (2026-09-24) ---- */
.gc-sets{display:grid;gap:14px;grid-template-columns:1fr}
.gc-sets.two{grid-template-columns:1fr 1fr}
.gc-set{display:flex;flex-direction:column;gap:10px;min-width:0}
.gc-sets.two .gc-set{padding:14px;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-sm)}
.gc-sets.two .gc-set[data-i="1"]{border-color:rgba(127,180,255,.35)}
.gc-set-head{display:flex;justify-content:space-between;align-items:center}
.gc-set-name{font-size:13px;font-weight:800;letter-spacing:.04em;color:var(--text-2)}
.gc-sets.two .gc-set[data-i="0"] .gc-set-name{color:var(--gold)}
.gc-sets.two .gc-set[data-i="1"] .gc-set-name{color:var(--blue)}
.gc-total{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;padding:12px 14px;border-radius:var(--r-sm);background:var(--gold-soft);border:1px solid var(--gold-line)}
.gc-total-k{font-size:13px;color:var(--muted);font-weight:700}
.gc-total-v{font-size:30px;font-weight:900;color:var(--gold);font-variant-numeric:tabular-nums;line-height:1.1}
.gc-total-n{font-size:12px;color:var(--muted)}
.gc-rows{display:flex;flex-direction:column;gap:8px}
.gc-row{display:grid;grid-template-columns:minmax(150px,1.3fr) 118px minmax(150px,1fr) 24px;gap:8px;align-items:center}
.gc-row input{width:100%;height:38px;padding:0 11px;background:var(--surface-2);border:1px solid var(--line-2);border-radius:var(--r-xs);color:var(--text);font:600 14px var(--font);transition:border-color .15s,box-shadow .15s}
.gc-sets.two .gc-row input{background:var(--surface)}
.gc-row input::placeholder{color:var(--faint);font-weight:500}
.gc-row input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px var(--gold-soft)}
.gc-row.bad .gc-stat{border-color:rgba(255,122,122,.55)}
.gc-row .gc-val{font-weight:800;font-variant-numeric:tabular-nums;padding-right:30px !important}
.gc-valwrap em{right:10px}
.gc-res{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;min-width:0;font-size:13px}
.gc-res .gc-g{font-size:19px;font-weight:900;color:var(--green);font-variant-numeric:tabular-nums}
.gc-res small{font-size:11.5px;color:var(--muted);display:inline-flex;align-items:center;gap:5px}
.gc-res .badge{font-size:10.5px}
.gc-miss{color:var(--red);font-size:12.5px}
.gc-add{align-self:flex-start;height:32px;padding:0 13px;border:1px dashed var(--line-2);border-radius:999px;background:none;color:var(--text-2);font:600 12.5px var(--font);cursor:pointer}
.gc-add:hover,.gc-add:focus-visible{border-style:solid;border-color:var(--gold-line);color:var(--gold);background:var(--gold-soft);outline:none}
.gc-bar{display:flex;gap:12px;align-items:flex-start;justify-content:space-between;margin-top:14px;padding-top:14px;border-top:1px solid var(--line);flex-wrap:wrap}
.gc-quick{display:flex;flex-wrap:wrap;gap:6px;align-items:center;flex:1 1 420px}
.gc-quick-h{font-size:12px;color:var(--muted);margin-right:2px}
.gc-quick button{height:28px;padding:0 11px;border:1px solid var(--line-2);border-radius:999px;background:var(--surface-2);color:var(--text-2);font:600 12.5px var(--font);cursor:pointer}
.gc-quick button:hover,.gc-quick button:focus-visible{border-color:var(--gold-line);color:var(--gold);outline:none}
.gc-cmp-btn{height:34px;padding:0 15px;border:1px solid rgba(127,180,255,.45);border-radius:var(--r-xs);background:rgba(127,180,255,.08);color:var(--blue);font:700 13px var(--font);cursor:pointer;white-space:nowrap}
.gc-cmp-btn:hover{background:rgba(127,180,255,.16)}
.gc-cmp-btn.on{border-color:var(--line-2);background:none;color:var(--muted)}
.gc-verdict{margin-top:14px}
.gc-search{display:flex;align-items:center;gap:7px;height:34px;padding:0 11px;background:var(--surface-2);border:1px solid var(--line-2);border-radius:var(--r-xs);color:var(--muted);min-width:230px}
.gc-search input{border:0;background:none;outline:none;color:var(--text);font:500 13.5px var(--font);width:100%}
.gc-search:focus-within{border-color:var(--gold)}
.gc-legend{font-size:12px;color:var(--muted);display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center}
.gc-ref{display:flex;flex-direction:column;gap:16px}
.gc-ref-g h3{font-size:13px;font-weight:700;color:var(--text-2);margin:0 0 8px;display:flex;align-items:center;gap:7px}
.gc-ref-l{display:grid;grid-template-columns:repeat(auto-fill,minmax(188px,1fr));gap:6px}
.gc-ref-l button{display:flex;justify-content:space-between;align-items:center;gap:8px;height:34px;padding:0 11px;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-xs);color:var(--text-2);font:500 13px var(--font);cursor:pointer;text-align:left}
.gc-ref-l button span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gc-ref-l button b{color:var(--text);font-variant-numeric:tabular-nums;flex:none}
.gc-ref-l button:hover,.gc-ref-l button:focus-visible{border-color:var(--gold-line);background:var(--gold-soft);outline:none}
@media(max-width:899px){.gc-sets.two{grid-template-columns:1fr}}
@media(max-width:759px){
  .gc-row{grid-template-columns:1fr 86px 24px;row-gap:4px}
  .gc-row .gc-stat{grid-column:1}
  .gc-row .gc-valwrap{grid-column:2}
  .gc-row .row-x{grid-column:3;grid-row:1}
  .gc-row .gc-res{grid-column:1/-1;grid-row:2;padding-left:2px}
  .gc-row input{height:40px;font-size:15px}
  .gc-total-v{font-size:26px}
  .gc-search{min-width:0;width:100%}
  .gc-ref-l{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gc-cmp-btn{width:100%}
}

/* ---- 신석 효율 계산기 (2026-09-27) ---- */
.gs .gs-prices{display:grid;grid-template-columns:200px 1fr;gap:14px;align-items:end}
.gs-pr{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.gs-p>span:first-child{font-weight:700}
.g-normal>span:first-child,.gs-sl.g-normal b,.gs-card.g-normal .gs-ck{color:#d6d3ca}
.g-adv>span:first-child,.gs-sl.g-adv b,.gs-card.g-adv .gs-ck{color:#6fd3a4}
.g-rare>span:first-child,.gs-sl.g-rare b,.gs-card.g-rare .gs-ck{color:#7fb4ff}
.g-hero>span:first-child,.gs-sl.g-hero b,.gs-card.g-hero .gs-ck{color:#b79cff}
.g-legend>span:first-child,.gs-sl.g-legend b,.gs-card.g-legend .gs-ck{color:#ff9d6b}
.gs .hint{margin-top:10px}
.gs-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.gs-card{padding:14px 16px;border-radius:var(--r-sm);background:var(--surface-2);border:1px solid var(--line)}
.gs-ck{font-size:14px;font-weight:800}
.gs-cv{font-size:32px;font-weight:900;font-variant-numeric:tabular-nums;line-height:1.15;margin-top:4px}
.gs-cv small{font-size:12px;color:var(--muted);font-weight:600;margin-left:6px}
.gs-cs{font-size:13px;color:var(--text-2);margin:2px 0 8px}
.gs-tag{display:inline-block;font-size:12px;font-weight:700;padding:2px 8px;border-radius:999px}
.gs-tag.ok{color:var(--green);background:rgba(111,211,164,.12)}.gs-tag.bad{color:var(--red);background:rgba(255,122,122,.12)}
.c1{color:var(--green)}.c2{color:var(--blue)}.c3{color:var(--amber)}.c4{color:var(--red)}
.gs-h3{font-size:15px;margin:6px 0 0}.gs-h3 .muted{font-size:12.5px;font-weight:500}
.gs-steps{display:flex;flex-direction:column;gap:10px}
.gs-srow{display:grid;grid-template-columns:96px 1fr;gap:10px;align-items:center}
.gs-sl b{display:block;font-size:16px}.gs-sl small{font-size:12px;color:var(--muted)}
.gs-grid{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:5px}
.gs-cell{padding:7px 3px;border-radius:8px;background:var(--surface-2);border:1px solid var(--line);text-align:center}
.gs-cell.key{border-color:rgba(183,156,255,.55);background:rgba(183,156,255,.09)}
.gs-cell .n{font-size:11px;color:var(--muted)}.gs-cell .a{font-size:13.5px;font-weight:800}
.gs-cell .v{font-size:17px;font-weight:900;font-variant-numeric:tabular-nums}.gs-cell .t{font-size:10.5px;color:var(--muted);line-height:1.25;margin-top:2px}
.gs-gods{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:12px;font-size:12.5px;color:var(--muted)}
.gs-gods>span{margin-right:2px;font-weight:700}
.gs-gods button{height:32px;padding:0 12px;border:1px solid var(--line-2);border-radius:999px;background:var(--surface-2);color:var(--text-2);font:700 13px var(--font);cursor:pointer}
.gs-gods button:hover,.gs-gods button.on{border-color:var(--gold-line);color:var(--gold);background:var(--gold-soft)}
.gs-godinfo{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:8px;font-size:12.5px;color:var(--text-2)}
.gs-godinfo em{font-style:normal;color:var(--muted);margin-right:5px}
.gs-godinfo b{color:var(--text);font-variant-numeric:tabular-nums}
.gs-godinfo i{font-style:normal;font-size:11px;color:var(--amber);margin-left:4px}
.gs-cg{margin-top:10px;padding-top:9px;border-top:1px dashed var(--line);font-size:13px;color:var(--text-2)}
.gs-cg b{font-size:17px;color:var(--gold);font-variant-numeric:tabular-nums}.gs-cg small{color:var(--muted)}
.gs-mk{font-size:10px;color:var(--amber);margin-left:4px;font-weight:600;vertical-align:super}
.gs-cmp tbody tr{cursor:pointer}.gs-cmp tbody tr.on td{background:var(--gold-soft)}.gs-cmp tbody tr.on td:first-child{color:var(--gold);font-weight:800}
.gs-presets{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:12.5px;color:var(--muted)}
.gs-presets>span{margin-right:2px}
.gs-presets button{height:30px;padding:0 12px;border:1px solid var(--line-2);border-radius:999px;background:var(--surface-2);color:var(--text-2);font:600 12.5px var(--font);cursor:pointer}
.gs-presets button:hover,.gs-presets button.on{border-color:var(--gold-line);color:var(--gold);background:var(--gold-soft)}
.gs-boards{display:grid;grid-template-columns:1fr 32px 1fr;gap:10px;align-items:center}
.gs-arrow{text-align:center;font-size:22px;color:var(--muted)}
.gs-board{padding:12px;border-radius:var(--r-sm);background:var(--surface-2);border:1px solid var(--line)}
.gs-board[data-b="tgt"]{border-color:var(--gold-line)}
.gs-bh{font-size:13px;color:var(--muted);font-weight:700;margin-bottom:8px}
.gs-bh b{font-size:24px;color:var(--text);margin-left:6px;font-variant-numeric:tabular-nums}.gs-bh small{margin-left:3px}
.gs-altars{display:flex;flex-direction:column;gap:6px}
.gs-alt{display:grid;grid-template-columns:52px repeat(3,minmax(0,1fr));gap:6px;align-items:center}
.gs-an{font-size:12px;color:var(--muted);font-weight:700}
.gs-slot{display:flex;flex-direction:column;gap:2px}
.gs-slot span{font-size:10.5px;color:var(--faint)}
.gs-slot select{height:34px;padding:0 6px;border-radius:7px;border:1px solid var(--line-2);background:var(--surface);color:var(--text);font:700 13px var(--font);cursor:pointer}
.gs-slot select.g-none{color:var(--faint);font-weight:500}
.gs-slot select.g-normal{color:#d6d3ca}.gs-slot select.g-adv{color:#6fd3a4;border-color:rgba(111,211,164,.4)}
.gs-slot select.g-rare{color:#7fb4ff;border-color:rgba(127,180,255,.45)}.gs-slot select.g-hero{color:#b79cff;border-color:rgba(183,156,255,.5)}
.gs-slot select.g-legend{color:#ff9d6b;border-color:rgba(255,157,107,.5)}
.gs-break{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.gs-break>div{padding:9px 12px;border-radius:var(--r-sm);background:var(--surface-2);border:1px solid var(--line);display:flex;flex-direction:column;gap:2px}
.gs-break span{font-size:11.5px;color:var(--muted)}.gs-break b{font-size:15px;font-variant-numeric:tabular-nums}
.gs-break i{font-style:normal;font-size:13px;font-weight:800;color:var(--muted)}.gs-break i.up{color:var(--green)}.gs-break i.dn{color:var(--red)}
@media(max-width:899px){.gs .gs-prices{grid-template-columns:1fr}.gs-boards{grid-template-columns:1fr}.gs-arrow{transform:rotate(90deg)}}
@media(max-width:759px){
  .gs-pr{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gs-srow{grid-template-columns:1fr}
  .gs-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
  .gs-break{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gs-alt{grid-template-columns:42px repeat(3,minmax(0,1fr))}
  .gs-slot select{font-size:12.5px;padding:0 3px}
}

.verdict.verdict-bad{background:rgba(255,122,122,.07);border-color:rgba(255,122,122,.35)}

/* ---- 신과 구간별 가성비 (2026-09-27) ---- */
.tool-card.per .v{color:var(--gold)}
#p-seg .tool-panel-head{align-items:center}
.seg-hint{margin:0;font-size:12.5px;color:var(--muted)}
#segTable td.seg-lv{white-space:nowrap}#segTable td.seg-lv small{display:inline;color:var(--muted);margin-left:2px;font-size:11px}
#segTable td small{display:block;font-size:10.5px;color:var(--muted)}
#segTable .seg-bar-h{min-width:190px}
#segTable td.seg-bar{min-width:190px}
#segTable .sbw{display:flex;align-items:center;gap:8px}
#segTable .sbw b{min-width:52px;text-align:right;font-variant-numeric:tabular-nums}
.sbar{flex:1;height:10px;border-radius:5px;background:rgba(255,255,255,.06);overflow:hidden}
.sbar i{display:block;height:100%;border-radius:5px;background:var(--muted)}
#segTable tr.c-good .sbar i{background:var(--green)}#segTable tr.c-good .sbw b{color:var(--green)}
#segTable tr.c-mid .sbar i{background:var(--blue)}#segTable tr.c-mid .sbw b{color:var(--blue)}
#segTable tr.c-bad .sbar i{background:var(--amber)}#segTable tr.c-bad .sbw b{color:var(--amber)}
@media(max-width:759px){#segTable .seg-bar-h,#segTable td.seg-bar{min-width:130px}}

#p-seg .sbar{min-width:60px}
#segTable thead th{background:var(--surface-2);position:sticky;top:0;z-index:2}
@media(max-width:759px){#segTable .hm{display:none}#segTable td,#segTable th{padding-left:6px;padding-right:6px}}
@media(max-width:759px){#segTable .seg-bar-h,#segTable td.seg-bar{min-width:120px}#p-seg .sbar{min-width:40px}}
@media(max-width:759px){#segTable td.seg-lv{white-space:normal;max-width:88px}#segTable td.seg-lv .badge{display:inline-block;margin-top:3px}#segTable .seg-bar-h,#segTable td.seg-bar{min-width:104px}#segTable .sbw b{min-width:40px}}
.seg-warn{color:#ff8a7a;font-weight:600}
/* ---------- 클래스 특화 계산기 (2026-09-27) */
.cs-top{display:grid;gap:12px 18px;grid-template-columns:1fr;margin-top:14px;align-items:end}
@media(min-width:760px){.cs-top{grid-template-columns:260px 1fr}}
.cs-price input{font-size:17px}
.cs-adv{margin-top:14px;border-top:1px solid var(--line);padding-top:10px}
.cs-adv>summary{cursor:pointer;font-size:13px;font-weight:700;color:var(--text-2);list-style:none}
.cs-adv>summary::-webkit-details-marker{display:none}
.cs-adv>summary::before{content:'▸ ';color:var(--muted)}.cs-adv[open]>summary::before{content:'▾ '}
.cs-adv>summary .muted{font-weight:500;font-size:12px}
.cs-adv[open]{display:flex;flex-direction:column;gap:10px}
.cs-adv .link-btn{align-self:flex-start;font-size:12.5px}
.cs-ori{display:grid;gap:12px;grid-template-columns:1fr;margin-top:6px}
@media(min-width:760px){.cs-ori{grid-template-columns:1fr 1fr}}
.cs-ori-g{display:flex;flex-direction:column;gap:6px;min-width:0}
.cs-ori-h{font-size:12.5px;font-weight:700;color:var(--text-2)}
.cs-ori-h small{font-weight:500;color:var(--muted);margin-left:4px}
.price-grid.cs-grid3{grid-template-columns:repeat(3,1fr)}
/* 요약 */
.cs-sum{position:sticky;top:64px;z-index:20;margin:0 0 16px;padding:12px;background:rgba(17,22,25,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--gold-line);border-radius:var(--r);box-shadow:var(--shadow)}
.cs-sgrid{display:grid;gap:8px;grid-template-columns:repeat(5,1fr)}
.cs-k{padding:8px 10px;border-radius:var(--r-sm);background:var(--surface-2);border:1px solid var(--line);min-width:0;display:flex;flex-direction:column}
.cs-k span{font-size:11.5px;color:var(--muted);font-weight:700}
.cs-k b{font-size:22px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.02em;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cs-k small{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cs-k.pri{background:var(--gold-soft);border-color:var(--gold-line)}.cs-k.pri b{color:var(--gold)}
.cs-k.hot b{color:var(--text)}
.cs-k.ess b{color:var(--green)}
.cs-need{font-size:13px;font-weight:700;color:var(--amber)}
.cs-line{margin:8px 2px 0;font-size:13px;color:var(--text-2);line-height:1.5}
.cs-line b.gold{color:var(--gold)}.cs-line b.ess{color:var(--green)}
/* 일괄 */
.cs-bulk{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;justify-content:space-between}
.cs-bulk-btns{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.cs-bulk-btns>span{font-size:12px;color:var(--muted);font-weight:700;margin-right:2px}
.cs-how{margin:0;font-size:12.5px;color:var(--muted)}
.cs-how b.g{color:var(--gold)}.cs-how b.c{color:var(--blue)}
.cs-how i{display:inline-block;width:11px;height:11px;border-radius:3px;vertical-align:-1px;margin:0 4px 0 8px}
.cs-how i.have{background:rgba(127,180,255,.35)}.cs-how i.plan{background:var(--gold)}
/* 트리 */
.cs-trees{display:grid;gap:14px;grid-template-columns:1fr}
@media(min-width:980px){.cs-trees{grid-template-columns:1fr 1fr}}
.cs-tree{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface-2);padding:10px;min-width:0}
.cs-tree.on{border-color:var(--gold-line);box-shadow:inset 0 0 0 1px rgba(223,177,79,.15)}
.cs-th{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;padding:2px 2px 8px;border-bottom:1px solid var(--line);margin-bottom:4px}
.cs-th b{font-size:15px}
.cs-th small{display:block;font-size:12px;color:var(--muted);margin-top:2px}
.cs-tb{display:flex;gap:4px;flex:none}
.chip.chip-xs{height:26px;min-width:28px;padding:0 8px;font-size:12px}
.cs-row{display:grid;grid-template-columns:minmax(0,1fr) auto 78px;gap:8px;align-items:center;padding:6px 2px;border-bottom:1px dashed rgba(255,255,255,.05)}
.cs-row:last-child{border-bottom:0}
.cs-rn{display:flex;align-items:center;gap:6px;min-width:0}
.cs-rn .nm{font-size:13.5px;font-weight:600;min-width:0;word-break:keep-all;overflow-wrap:anywhere;line-height:1.3}
.cs-rn .rt{font-size:10.5px;color:var(--faint);white-space:nowrap;margin-left:auto}
.cs-n{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:5px;background:var(--surface-3);color:var(--muted);font-size:11px;font-weight:800;font-variant-numeric:tabular-nums;flex:none}
.cs-pills{display:flex;gap:3px}
.cs-pill{min-width:40px;height:32px;padding:0 6px;border-radius:7px;border:1px solid var(--line-2);background:var(--surface);color:var(--text-2);font-size:12.5px;font-weight:700;font-variant-numeric:tabular-nums;transition:.12s}
.cs-pill.z{min-width:28px;color:var(--faint)}
.cs-pill:hover{border-color:var(--gold-line);color:var(--text)}
.cs-pill.have{background:rgba(127,180,255,.18);border-color:rgba(127,180,255,.35);color:var(--blue)}
.cs-pill.plan{background:var(--gold);border-color:var(--gold);color:#1a1405}
.cs-pill.at{box-shadow:0 0 0 2px var(--bg),0 0 0 3.5px var(--text-2)}
.cs-rc{text-align:right;min-width:0;line-height:1.25}
.cs-rc b{display:block;font-size:13px;font-variant-numeric:tabular-nums;color:var(--gold)}
.cs-rc b small{font-size:10px;color:var(--muted);margin-left:1px;font-weight:600}
.cs-rc em{font-style:normal;font-size:11.5px;color:var(--green);font-variant-numeric:tabular-nums}
.cs-row:not(.up) .cs-rn .nm{color:var(--text-2)}
/* 레벨 효과 */
.cs-lvs{display:grid;gap:4px;grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.cs-le{display:flex;align-items:center;gap:8px;padding:6px 9px;border-radius:7px;background:var(--surface-2);border:1px solid var(--line);font-size:13px;opacity:.55}
.cs-le .l{font-size:11.5px;color:var(--muted);font-weight:700;min-width:40px;font-variant-numeric:tabular-nums}
.cs-le .s{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text)}
.cs-le em{font-style:normal;font-size:11.5px;color:var(--green);font-variant-numeric:tabular-nums}
.cs-le.got{opacity:1;border-color:rgba(127,180,255,.35)}.cs-le.got .l{color:var(--blue)}
.cs-le.nw{opacity:1;border-color:var(--gold-line);background:var(--gold-soft)}.cs-le.nw .l{color:var(--gold)}
.cs-empty{margin:0;font-size:13px;color:var(--muted);line-height:1.6}
/* 접힘 패널 */
.cs-fold>summary{cursor:pointer;list-style:none}
.cs-fold>summary::-webkit-details-marker{display:none}
.cs-fold>summary h2{font-size:17px;display:inline}
.cs-fold>summary h2 .muted{font-size:13px;font-weight:600}
.cs-fold>summary::before{content:'▸ ';color:var(--muted)}.cs-fold[open]>summary::before{content:'▾ '}
.cs-name{font-weight:600}
.cs-name .cs-n{margin-right:7px}
.cs-st{font-size:12px;color:var(--gold);margin-left:4px}
.cs-rank td{vertical-align:middle}
.cs-rank tr.c-good td.pri b{color:var(--green)}
.cs-rank tr.c-mid td.pri b{color:var(--blue)}
.cs-rank tr.c-bad td.pri b{color:var(--amber)}
.cs-rank tr.c-na td{opacity:.6}
.cs-find{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;margin:4px 0 10px}
.cs-find input{flex:1 1 260px;min-width:0;height:40px;padding:0 12px;border:1px solid var(--line-2);border-radius:9px;background:var(--surface-2);color:var(--text);font:inherit;font-size:14.5px}
.cs-find input:focus{outline:2px solid var(--gold-line);outline-offset:1px}
.cs-find .muted{font-size:12px}
.cs-all{display:grid;gap:12px;grid-template-columns:1fr}
@media(min-width:900px){.cs-all{grid-template-columns:1fr 1fr}}
.cs-job{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface-2);padding:12px;min-width:0}
.cs-job.on{border-color:var(--gold-line)}
.cs-jh{display:flex;align-items:baseline;gap:8px;margin-bottom:8px}
.cs-jh b{font-size:15px}
.cs-jh .link-btn{margin-left:auto;font-size:12.5px}
.cs-trs{display:grid;gap:10px;grid-template-columns:1fr 1fr}
.cs-tr{min-width:0}
.cs-trh{font-size:11.5px;font-weight:700;color:var(--muted);margin-bottom:4px}
.cs-tr ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:3px}
.cs-tr li{display:flex;align-items:center;gap:6px;font-size:12.5px;line-height:1.35;min-width:0}
.cs-tr li .cs-n{width:17px;height:17px;font-size:10px}
.cs-tr li .nm{flex:1 1 auto;min-width:0;overflow-wrap:anywhere;word-break:keep-all;color:var(--text-2)}
.cs-tr li b{font-variant-numeric:tabular-nums;font-size:12.5px;flex:none}
.cs-tr li em{font-style:normal;color:var(--green);font-size:11px;min-width:30px;text-align:right;flex:none;font-variant-numeric:tabular-nums}
.cs-tr li em.un{color:var(--faint)}
.cs-tr li.hit .nm{color:var(--gold);font-weight:700}
.cs-tr li.miss{opacity:.3}
@media(max-width:759px){
  .cs-sum{top:56px;padding:8px}
  .cs-sgrid{grid-template-columns:repeat(3,1fr);gap:5px}
  .cs-k{padding:6px 7px}.cs-k b{font-size:16px}.cs-k span{font-size:10.5px}.cs-k small{font-size:10px}
  .cs-k:nth-child(4),.cs-k:nth-child(5){display:none}
  .cs-line{font-size:12px}.cs-un{display:none}
  .cs-row{grid-template-columns:minmax(0,1fr) 64px;gap:4px 6px}
  .cs-pills{grid-column:1 / -1;order:3}
  .cs-pill{flex:1;min-width:0}
  .cs-rn .rt{display:none}
  .cs-trs{grid-template-columns:1fr}
  .cs-bulk .seg{width:100%}
}