/* guide.css — 가이드 페이지 공용 스타일 (CSP style-src 'self' 대응: 인라인 <style> 금지)
   다크 기본 + 시스템 라이트 테마 자동 대응 */
:root{color-scheme:dark light;--bg:#0b1018;--card:#121a27;--txt:#eef4ff;--sub:#9fb0c6;--line:#243248;--blue:#5b9cf6;--green:#35bd8b;--red:#ed7082}
@media (prefers-color-scheme: light){
  :root{--bg:#eef2f8;--card:#ffffff;--txt:#172235;--sub:#4d5e73;--line:#d8e2ee;--blue:#176fd6;--green:#087f5b;--red:#c93851}
}
body{margin:0;background:var(--bg);color:var(--txt);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.75}
main{width:min(880px,calc(100% - 32px));margin:42px auto;padding:26px;border:1px solid var(--line);border-radius:16px;background:var(--card)}
h1{font-size:23px;margin:0 0 6px;line-height:1.4}
h2{font-size:16.5px;margin:26px 0 10px}
p,li{color:var(--sub);font-size:14px}
a{color:var(--blue);font-weight:700;text-decoration:none}
.lead{font-size:14.5px}
.formula{padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:rgba(91,156,246,.06);font-size:13.5px;color:var(--txt);overflow-x:auto}
.cta{display:block;margin:22px 0;padding:13px;border:1px solid var(--blue);border-radius:10px;background:rgba(91,156,246,.1);text-align:center;font-size:15px}
.others{margin-top:26px;padding-top:14px;border-top:1px solid var(--line);font-size:12.5px;color:var(--sub)}
.others a{margin-right:10px}
.disclaimer{margin-top:14px;font-size:11.5px;color:var(--sub);opacity:.75}
.scroll{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:13px;color:var(--sub)}
th,td{padding:7px 10px;border-bottom:1px solid var(--line);text-align:left}
th{color:var(--txt);font-size:12px}
/* history 페이지 전용 (숫자 그리드) */
.num-table th,.num-table td{text-align:right;white-space:nowrap;padding:5px 8px;font-size:12px}
.num-table th{color:var(--sub);font-size:10.5px}
.num-table td.yr,.num-table th:first-child{text-align:left;color:var(--txt);font-weight:800}
td.ds,th.ds{color:var(--blue);font-weight:800;background:rgba(91,156,246,.06)}
td.zero{color:var(--red);font-weight:800}
td.max{color:var(--green);font-weight:700}
td.note{text-align:left;white-space:normal;color:var(--sub);font-size:11px;min-width:160px}
.chip{display:inline-block;margin:1px 3px 1px 0;padding:2px 7px;border:1px solid var(--line);border-radius:999px;font-size:11px;font-weight:800;color:var(--txt);white-space:nowrap}
.chip em{font-style:normal;font-weight:650;color:var(--sub)}
/* calendar 페이지 */
.cal-month{color:var(--txt);font-weight:850;white-space:nowrap}
.cal-co{font-weight:800;white-space:nowrap}
.cal-co.sam{color:var(--blue)}
.cal-co.hx{color:var(--green)}
/* calendar 타임라인 */
.timeline{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:20px 0}
.item{padding:13px;border:1px solid var(--line);border-radius:10px;background:rgba(91,156,246,.05)}
.month{display:inline-block;padding:3px 9px;border-radius:999px;background:rgba(91,156,246,.12);color:var(--blue);font-size:12px;font-weight:900}
.item h2{margin:10px 0 6px;font-size:15px}
.item p{margin:0;font-size:13px}
@media(max-width:720px){.timeline{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* 표 셀 미니바 — 막대 폭은 5% 계단 클래스(w-N), CSP상 인라인 style 불가 */
.mini-bar{display:block;height:5px;margin-top:5px;min-width:64px;border-radius:999px;background:rgba(127,127,127,.15);overflow:hidden}
.mini-bar b{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--blue),var(--green));min-width:2px}
.mini-bar b.zero{background:var(--red)}
.mini-bar b.max{background:var(--green)}
td.ds .mini-bar{min-width:34px;margin-top:3px;height:4px}
.w-2{width:2%}
.w-5{width:5%}
.w-10{width:10%}
.w-15{width:15%}
.w-20{width:20%}
.w-25{width:25%}
.w-30{width:30%}
.w-35{width:35%}
.w-40{width:40%}
.w-45{width:45%}
.w-50{width:50%}
.w-55{width:55%}
.w-60{width:60%}
.w-65{width:65%}
.w-70{width:70%}
.w-75{width:75%}
.w-80{width:80%}
.w-85{width:85%}
.w-90{width:90%}
.w-95{width:95%}
.w-100{width:100%}
.td-left{text-align:left}
.txt-max{color:var(--green);font-weight:800}
.txt-zero{color:var(--red);font-weight:800}
/* 연봉별 성과급 랜딩 (gen-salary-pages) */
.sal-hero{margin:22px 0;padding:20px;border:1px solid var(--blue);border-radius:14px;background:rgba(91,156,246,.08)}
.sal-hero-label{font-size:12.5px;color:var(--sub);font-weight:700}
.sal-num{margin:4px 0 14px;font-size:34px;font-weight:900;color:var(--txt);line-height:1.1}
.sal-num span{font-size:18px;font-weight:700;margin-left:3px;color:var(--sub)}
.sal-break{display:flex;flex-direction:column;gap:7px}
.sal-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:8px 0;border-top:1px solid var(--line)}
.sal-row span{font-size:13px;color:var(--sub)}
.sal-row b{font-size:14px;color:var(--txt);font-weight:800;white-space:nowrap}
.sal-row.note span,.sal-row.note b{font-size:12px;color:var(--sub);font-weight:600}
.sal-siblings{display:flex;flex-wrap:wrap;gap:8px}
.sal-siblings a{padding:5px 11px;border:1px solid var(--line);border-radius:999px;font-size:12.5px;font-weight:700}
