/* ===== 고교 진로설계 대시보드 v4 — 공통 스타일 =====
   여기는 디자인 파일입니다. 학교/과목 데이터는 data/ 폴더의 JSON에 있습니다. */

:root{
  --bg:#0f1729; --panel:#16213a; --panel2:#1d2b48;
  --line:#2a3a5c; --txt:#e8eefc; --sub:#9fb0d0; --accent:#4f8cff;
  --eng:#ff6b6b; --nat:#34d399; --soc:#fbbf24; --hum:#a78bfa;
  --chip:#22324f; --ok:#34d399; --warn:#fbbf24; --bad:#ff6b6b;
  --page:linear-gradient(160deg,#0b1120,#101a30);
}
body.gray{ --page:linear-gradient(160deg,#5a6068,#43484f); --panel:#4d535b; --panel2:#565d66;
  --line:#6b727c; --txt:#f1f3f6; --sub:#c8ced6; --chip:#5b636d; --accent:#7eb0ff; }
body.light{ --page:linear-gradient(160deg,#fafbfc,#eef1f6); --panel:#ffffff; --panel2:#f5f7fa;
  --line:#e2e7ef; --txt:#1c2530; --sub:#5d6877; --chip:#eaeef4; --accent:#2f6bd6;
  --ok:#1f9d6b; --warn:#b3820a; --bad:#d64545; }
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Pretendard','Malgun Gothic',-apple-system,system-ui,sans-serif;
  background:var(--page);color:var(--txt);line-height:1.55;padding:24px;min-height:100vh;transition:background .25s,color .25s}
.wrap{max-width:1180px;margin:0 auto}
header{text-align:center;margin-bottom:8px}
h1{font-size:26px;font-weight:800;letter-spacing:-.5px}
.lead{color:var(--sub);font-size:14px;margin-top:6px}
.cur-school{display:inline-block;margin-top:8px;background:var(--chip);border:1px solid var(--accent);color:var(--txt);font-weight:700;font-size:15px;padding:5px 14px;border-radius:20px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:20px;margin-top:18px}
.sec-title{font-size:13px;font-weight:700;color:var(--sub);text-transform:uppercase;letter-spacing:1px;margin-bottom:14px}
.row{display:flex;flex-wrap:wrap;gap:10px}
.seg{display:flex;gap:8px;background:var(--chip);padding:5px;border-radius:12px}
.seg button{background:transparent;border:0;color:var(--sub);padding:9px 18px;border-radius:9px;font-size:14px;font-weight:600;cursor:pointer;transition:.15s}
.seg button.on{background:var(--accent);color:#fff}
.fields{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media(max-width:860px){.fields{grid-template-columns:repeat(2,1fr)}}
.field{border:1.5px solid var(--line);border-radius:14px;padding:16px;cursor:pointer;transition:.18s;background:var(--panel2);position:relative;overflow:hidden}
.field:hover{transform:translateY(-3px)}
.field .bar{position:absolute;left:0;top:0;bottom:0;width:5px}
.field h3{font-size:16px;margin-bottom:4px}
.field p{font-size:12px;color:var(--sub)}
.field.on{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent) inset}
.f-eng .bar{background:var(--eng)} .f-nat .bar{background:var(--nat)}
.f-soc .bar{background:var(--soc)} .f-hum .bar{background:var(--hum)}
.grid2{display:grid;grid-template-columns:1.4fr 1fr;gap:18px}
@media(max-width:900px){.grid2{grid-template-columns:1fr}}
.road{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
@media(max-width:760px){.road{grid-template-columns:repeat(2,1fr)}}
.term{background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:12px;min-height:120px}
.term h4{font-size:13px;color:var(--accent);margin-bottom:8px;border-bottom:1px solid var(--line);padding-bottom:6px}
.pill{display:inline-block;background:var(--chip);border:1px solid var(--line);border-radius:8px;padding:4px 8px;font-size:11.5px;margin:3px 3px 0 0}
.pill.rec{border-color:var(--accent);color:var(--accent)}
.theme-seg{display:inline-flex;align-items:center;gap:6px;margin-top:12px;font-size:12px;color:var(--sub);background:var(--chip);padding:5px 8px;border-radius:10px}
.theme-seg button{background:transparent;border:1px solid transparent;color:var(--sub);padding:5px 12px;border-radius:7px;font-size:12.5px;font-weight:600;cursor:pointer;transition:.15s}
.theme-seg button.on{background:var(--accent);color:#fff}
.school-select{background:var(--panel2);color:var(--txt);border:1.5px solid var(--accent);border-radius:10px;padding:10px 14px;font-size:15px;font-weight:700;font-family:inherit;cursor:pointer;min-width:230px}
.school-select optgroup{color:var(--sub)}
.notready{margin-top:14px;background:var(--chip);border:1px dashed var(--warn);border-radius:12px;padding:16px;font-size:13.5px;line-height:1.7}
.ach-form{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:14px}
.ach-form input{background:var(--panel2);border:1px solid var(--line);color:var(--txt);border-radius:8px;padding:8px 10px;font-size:13px;font-family:inherit}
.ach-form input#achSubj{min-width:170px}
.ach-form input[type=number]{width:74px}
.ach-sep{font-size:12px;color:var(--sub);margin-left:6px;font-weight:600}
.ach-table{width:100%;border-collapse:collapse;font-size:13px;margin-top:6px}
.ach-table th,.ach-table td{border-bottom:1px solid var(--line);padding:8px 6px;text-align:left;vertical-align:middle}
.ach-table th{color:var(--sub);font-size:11.5px;font-weight:700}
.ach-bar{display:flex;height:20px;border-radius:5px;overflow:hidden;min-width:190px;background:var(--chip)}
.ach-bar .seg{display:flex;align-items:center;justify-content:center;font-size:10px;color:#fff;font-weight:700;transition:width .3s}
.ach-bar .s0{background:#34d399}.ach-bar .s1{background:#4f8cff}.ach-bar .s2{background:#fbbf24}.ach-bar .s3{background:#fb923c}.ach-bar .s4{background:#ff6b6b}
.ach-legend{font-size:11px;color:var(--sub);margin:8px 0}
.ach-legend span{display:inline-block;margin-right:10px}
.ach-legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:3px;vertical-align:middle}
.mini-del{background:var(--chip);border:1px solid var(--line);color:var(--sub);border-radius:6px;cursor:pointer;padding:2px 7px}
.mini-del:hover{border-color:var(--bad);color:var(--bad)}
.ach-sem{margin-bottom:18px}
.ach-sem h4{font-size:14px;color:var(--accent);margin-bottom:6px}
.ach-table td:nth-child(2),.ach-table td:nth-child(3),.ach-table th:nth-child(2),.ach-table th:nth-child(3){text-align:center;white-space:nowrap}
.note{font-size:13px;color:var(--sub)}
.uni{margin-top:8px}
.uni li{margin:7px 0;font-size:13.5px;list-style:none;padding-left:16px;position:relative}
.uni li::before{content:"▸";position:absolute;left:0;color:var(--accent)}
.builder{margin-top:8px}
.pool-group{margin-bottom:14px}
.pool-group .gh{font-size:12.5px;font-weight:700;color:var(--sub);margin:10px 0 6px;display:flex;justify-content:space-between;align-items:center}
.rule{font-size:11px;color:var(--warn);font-weight:600}
.pool{display:flex;flex-wrap:wrap;gap:7px}
.opt{border:1px solid var(--line);background:var(--panel2);border-radius:9px;padding:7px 10px;font-size:12.5px;cursor:pointer;transition:.12s;user-select:none}
.opt:hover{border-color:var(--accent)}
.opt.sel{background:var(--accent);border-color:var(--accent);color:#fff}
.opt.rec::after{content:"★";color:var(--warn);margin-left:5px;font-size:11px}
.opt.core{border-color:var(--warn);box-shadow:0 0 0 1px var(--warn) inset}
.opt.core::after{content:"★핵심";color:var(--warn);font-weight:800;font-size:9.5px;margin-left:5px}
.opt.sel.core::after{color:#fff2c2}
.opt.sel.rec::after{color:#fff2c2}
.tag{font-size:10px;opacity:.6;margin-left:4px}
.summary{position:sticky;top:16px}
.meter{display:flex;justify-content:space-between;align-items:baseline;margin:6px 0}
.meter b{font-size:22px}
.bar2{height:8px;background:var(--chip);border-radius:6px;overflow:hidden;margin-top:4px}
.bar2 i{display:block;height:100%;background:var(--accent);width:0;transition:.3s}
.matchbox{margin-top:12px;font-size:13px}
.matchbox .mrow{display:flex;justify-content:space-between;padding:4px 0;border-bottom:1px dashed var(--line)}
.ok{color:var(--ok)} .warnc{color:var(--warn)} .badc{color:var(--bad)}
.btn{background:var(--accent);color:#fff;border:0;border-radius:10px;padding:10px 14px;font-weight:600;cursor:pointer;font-size:13px;margin-top:12px;width:100%}
.btn.ghost{background:transparent;border:1px solid var(--line);color:var(--sub)}
footer{text-align:center;color:var(--sub);font-size:11.5px;margin-top:28px;line-height:1.7}
.legend{font-size:11.5px;color:var(--sub);margin-top:6px}
.selected-list{font-size:12px;color:var(--sub);margin-top:8px;max-height:140px;overflow:auto}
.selected-list span{display:inline-block;background:var(--chip);border-radius:6px;padding:2px 7px;margin:2px;font-size:11px}
.hl{color:var(--txt);font-weight:600}
.rbtn{margin-left:6px;cursor:pointer;font-size:13px;filter:grayscale(.3)}
.opt:hover .rbtn{filter:none}
.modal-bg{position:fixed;inset:0;background:rgba(5,9,18,.78);display:none;align-items:flex-start;justify-content:center;z-index:50;padding:30px 16px;overflow:auto}
.modal-bg.on{display:flex}
.modal{background:var(--panel);border:1px solid var(--line);border-radius:18px;max-width:760px;width:100%;padding:24px;position:relative;animation:pop .18s ease}
@keyframes pop{from{transform:translateY(12px);opacity:0}to{transform:none;opacity:1}}
.modal h2{font-size:20px;margin-bottom:2px}
.modal .mtag{font-size:12px;color:var(--sub);margin-bottom:14px}
.mblock{background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:14px;margin-bottom:12px}
.mblock h3{font-size:14px;color:var(--accent);margin-bottom:8px}
.topic{font-size:13.5px;margin:6px 0;padding-left:16px;position:relative}
.topic::before{content:"🔎";position:absolute;left:-2px;font-size:11px}
.design{font-size:13px;line-height:1.7}
.design b{color:var(--txt)}
.src{display:block;font-size:13px;margin:7px 0;padding:8px 10px;background:var(--chip);border-radius:8px;border:1px solid var(--line);text-decoration:none;color:var(--txt)}
.src:hover{border-color:var(--accent)}
.src .meta{color:var(--sub);font-size:11.5px}
.src .go{float:right;color:var(--accent);font-size:11.5px}
.mclose{position:absolute;top:14px;right:16px;background:var(--chip);border:1px solid var(--line);color:var(--txt);width:32px;height:32px;border-radius:8px;cursor:pointer;font-size:16px}
.disc{font-size:11.5px;color:var(--sub);margin-top:8px}

/* ===== v4 추가 스타일 ===== */

/* 진행 스텝 */
.steps{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin:16px 0 4px}
.steps button{background:var(--chip);border:1px solid var(--line);color:var(--sub);border-radius:999px;
  padding:7px 15px;font-size:12.5px;font-weight:700;cursor:pointer;font-family:inherit;transition:.15s}
.steps button.on{background:var(--accent);border-color:var(--accent);color:#fff}
.steps button.done{border-color:var(--ok);color:var(--ok)}
.steps button:disabled{opacity:.45;cursor:not-allowed}
.panel[hidden]{display:none}

/* 오류/알림 배너 */
#banners{position:sticky;top:0;z-index:40}
.banner{border-radius:12px;padding:11px 14px;font-size:13px;margin-bottom:8px;display:flex;gap:10px;align-items:flex-start}
.banner.err{background:rgba(255,107,107,.13);border:1px solid var(--bad);color:var(--txt)}
.banner.warn{background:rgba(251,191,36,.13);border:1px solid var(--warn);color:var(--txt)}
.banner.info{background:var(--chip);border:1px solid var(--line);color:var(--sub)}
.banner b{color:var(--txt)}
.banner .x{margin-left:auto;background:none;border:0;color:inherit;cursor:pointer;font-size:15px;opacity:.7}

/* 폼 요소 공통 */
.fld{display:flex;flex-direction:column;gap:5px;min-width:180px}
.fld label{font-size:11.5px;font-weight:700;color:var(--sub);letter-spacing:.3px}
select,input[type=text],input[type=search],input[type=number],textarea{
  background:var(--panel2);color:var(--txt);border:1px solid var(--line);border-radius:10px;
  padding:9px 12px;font-size:14px;font-family:inherit}
select:focus,input:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:1px}
textarea{width:100%;min-height:160px;line-height:1.6;resize:vertical}
.btn.sm{width:auto;padding:8px 14px;margin-top:0}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btnrow{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:14px}

/* 학교 편제 표 */
.curr-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px;margin-top:10px}
.curr-col{background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:14px}
.curr-col h4{font-size:14px;color:var(--accent);margin-bottom:4px}
.curr-col .rule{margin-bottom:8px;display:block}
.cat-공통과목{border-color:#94a3b8}
.cat-일반선택{border-color:#4f8cff}
.cat-진로선택{border-color:#34d399}
.cat-융합선택{border-color:#a78bfa}
.catlegend span{display:inline-flex;align-items:center;gap:5px;margin-right:12px;font-size:11.5px;color:var(--sub)}
.catlegend i{width:11px;height:11px;border-radius:3px;border:2px solid}
.badge{display:inline-block;font-size:10.5px;font-weight:700;border-radius:6px;padding:2px 7px;margin-left:6px;
  border:1px solid var(--line);color:var(--sub)}
.badge.est{border-style:dashed;border-color:var(--warn);color:var(--warn)}
.badge.ok{border-color:var(--ok);color:var(--ok)}
.badge.none{border-style:dashed}

/* 이수과목 고정(3학년 진입) */
.locked{background:var(--chip);border:1px dashed var(--ok);color:var(--ok)}
.opt.locked::after{content:"🔒";margin-left:5px;font-size:10px}
.opt[aria-disabled="true"]{opacity:.45;cursor:not-allowed}

/* 재설계 카드 */
.redesign{border:1px solid var(--warn);border-radius:12px;padding:14px;margin-top:12px;background:rgba(251,191,36,.08)}
.redesign h4{font-size:13.5px;color:var(--warn);margin-bottom:6px}
.redesign ul{margin:6px 0 0 0;padding:0}
.redesign li{list-style:none;font-size:13px;margin:5px 0;padding-left:15px;position:relative}
.redesign li::before{content:"→";position:absolute;left:0;color:var(--warn)}

/* 동의 화면 */
.consent{background:var(--panel2);border:1px solid var(--line);border-radius:14px;padding:18px}
.consent h4{font-size:15px;margin-bottom:10px}
.consent ul{margin:0 0 12px 18px;font-size:13px;color:var(--sub);line-height:1.8}
.chk{display:flex;gap:9px;align-items:flex-start;font-size:13.5px;margin:8px 0;cursor:pointer}
.chk input{margin-top:3px;width:16px;height:16px;accent-color:var(--accent)}
.dropzone{border:2px dashed var(--line);border-radius:14px;padding:26px;text-align:center;color:var(--sub);
  font-size:13.5px;cursor:pointer;transition:.15s}
.dropzone.hot{border-color:var(--accent);color:var(--accent);background:var(--chip)}

/* 진단 결과 */
.diag{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.diag-card{background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:14px}
.diag-card h4{font-size:14px;color:var(--accent);margin-bottom:8px;display:flex;justify-content:space-between;align-items:center}
.score{font-size:12px;font-weight:800;padding:2px 9px;border-radius:8px;background:var(--chip);color:var(--sub)}
.score.hi{color:var(--ok)} .score.mid{color:var(--warn)} .score.lo{color:var(--bad)}
.evd{font-size:12.5px;line-height:1.65;margin:6px 0;padding:8px 10px;border-radius:8px;background:var(--chip);border-left:3px solid var(--ok)}
.evd.gap{border-left-color:var(--warn)}
.evd .q{color:var(--sub);font-style:italic;display:block;margin-top:3px}
.kv{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.kv span{background:var(--chip);border:1px solid var(--line);border-radius:8px;padding:3px 9px;font-size:11.5px}

/* 리포트 */
.report{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:26px}
.report h2{font-size:19px;margin:22px 0 8px;padding-bottom:6px;border-bottom:2px solid var(--accent)}
.report h2:first-of-type{margin-top:8px}
.report h3{font-size:15px;margin:14px 0 6px;color:var(--accent)}
.report p,.report li{font-size:13.5px;line-height:1.75}
.report ul{margin-left:18px}
.report table{width:100%;border-collapse:collapse;font-size:12.5px;margin:8px 0}
.report th,.report td{border:1px solid var(--line);padding:7px 9px;text-align:left;vertical-align:top}
.report th{background:var(--chip);color:var(--sub);font-size:11.5px}
.cover{text-align:center;padding:18px 0 8px;border-bottom:1px solid var(--line)}
.cover h1{font-size:24px}
.cover .meta{color:var(--sub);font-size:13px;margin-top:8px}
.disclaimer{margin-top:20px;font-size:11.5px;color:var(--sub);border-top:1px dashed var(--line);padding-top:12px;line-height:1.8}

/* 저장/이력 */
.hist{font-size:12.5px;color:var(--sub);max-height:190px;overflow:auto;margin-top:8px}
.hist div{padding:5px 0;border-bottom:1px dashed var(--line)}
.idchip{font-family:ui-monospace,Menlo,Consolas,monospace;background:var(--chip);border:1px solid var(--line);
  border-radius:8px;padding:3px 9px;font-size:12px}

/* 자동완성 */
.ac{position:relative}
.ac-list{position:absolute;z-index:20;left:0;right:0;top:calc(100% + 4px);background:var(--panel);
  border:1px solid var(--accent);border-radius:10px;max-height:260px;overflow:auto;display:none}
.ac-list.on{display:block}
.ac-list button{display:block;width:100%;text-align:left;background:none;border:0;color:var(--txt);
  padding:9px 12px;font-size:13.5px;cursor:pointer;font-family:inherit}
.ac-list button:hover,.ac-list button.on{background:var(--chip)}
.ac-list .rg{color:var(--sub);font-size:11.5px;margin-left:6px}

/* 인쇄 */
@media print{
  body{background:#fff!important;color:#111!important;padding:0}
  .noprint,header .theme-seg,.steps,#banners,footer .noprint,header h1,header .lead,header .cur-school{display:none!important}
  .note,.legend,.disc,footer{color:#444!important}
  .hl{color:#111!important}
  .report .badge{color:#444!important;border-color:#999!important}
  .idchip{background:#eee!important;border-color:#999!important;color:#111!important}
  .cover{border-bottom:1px solid #999}
  .cover .meta{color:#444!important}
  .inq,.scard,.semSide,.planbox,.subchip,.gapbanner{background:#fff!important;border-color:#999!important;color:#111!important}
  .inq .fld2 b,.kyoh,.semh{color:#333!important}
  .cmp th,.cmp td{border:1px solid #999}
  .bar{background:#ddd!important} .bar i{background:#666!important}
  .report{border:0;padding:0;background:#fff!important;color:#111!important}
  .report h2{border-bottom:2px solid #333;color:#111}
  .report h3{color:#333}
  .report th{background:#eee;color:#333}
  .report th,.report td{border:1px solid #999}
  .evd{background:#f4f4f4;border-left:3px solid #666;color:#111}
  .disclaimer{color:#444}
  a{color:#111;text-decoration:none}
  .page-break{page-break-before:always}
}

/* ===== v4.1 추가: 참조 바스켓 · 과목 성취 · 학과 · 보완점 · 탐구카드 ===== */

/* 학과 카드 */
.progrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px;margin-top:10px}
.progcard{border:1.5px solid var(--line);background:var(--panel2);border-radius:12px;padding:13px;cursor:pointer;transition:.15s}
.progcard:hover{border-color:var(--accent);transform:translateY(-2px)}
.progcard.on{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent) inset}
.progcard .f{font-size:11px;color:var(--sub);font-weight:700;letter-spacing:.4px}
.progcard .m{font-size:15.5px;font-weight:700;margin:3px 0}
.progcard .c{font-size:11.5px;color:var(--sub)}
.progcard.soon{opacity:.55;cursor:not-allowed}

/* 참조 바스켓 비교표 */
.cmp{width:100%;border-collapse:collapse;font-size:13px;margin-top:8px}
.cmp th,.cmp td{border-bottom:1px solid var(--line);padding:10px 8px;text-align:left;vertical-align:top}
.cmp th{color:var(--sub);font-size:11.5px;font-weight:700}
.cmp td.num{text-align:center;white-space:nowrap;font-variant-numeric:tabular-nums}
.cmp td.num b{font-size:15px}
.cmp .aoc{font-size:11px;color:var(--sub);margin-top:4px}
.bar{height:7px;background:var(--chip);border-radius:5px;overflow:hidden;margin-top:6px;max-width:260px}
.bar i{display:block;height:100%;background:var(--accent)}
.badge.b-good{border-color:var(--ok);color:var(--ok)}
.badge.b-bad{border-color:var(--bad);color:var(--bad)}
.badge.b-eq{border-color:var(--accent);color:var(--accent)}
.badge.b-real{border-color:var(--ok);color:var(--ok)}
.cmp-note{font-size:12px;color:var(--sub);margin-top:10px;line-height:1.7;border-left:3px solid var(--accent);padding-left:10px}
.members{font-size:11.5px;color:var(--sub);margin-top:6px}

/* 과목 단위 성취 카드 */
.semSplit{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
@media(max-width:900px){.semSplit{grid-template-columns:1fr}}
.semSide{background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:12px}
.semh{display:inline-block;font-size:12px;font-weight:700;color:var(--accent);margin-bottom:8px}
.kyoGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
@media(max-width:640px){.kyoGrid{grid-template-columns:repeat(2,1fr)}}
.kyoCell{min-width:0}
.kyoh{font-size:11px;font-weight:700;color:var(--sub);margin-bottom:5px;padding-bottom:3px;border-bottom:1px solid var(--line)}
.scard{background:var(--chip);border:1px solid var(--line);border-left:3px solid var(--accent);
  border-radius:8px;padding:6px 8px;margin-bottom:5px}
.scard .cn{font-size:11.5px;font-weight:600;line-height:1.35;word-break:keep-all}
.scard .srow{display:flex;align-items:baseline;justify-content:space-between;gap:6px;margin-top:3px}
.scard .cavg{font-size:14px;font-weight:800;font-variant-numeric:tabular-nums}
.scard .cach{font-size:10px;color:var(--sub);white-space:nowrap}
.scard .ccr{font-size:10px;color:var(--sub);white-space:nowrap}
.emptyk{font-size:11px;color:var(--sub);opacity:.6;padding:4px 0}
.k-국어{border-left-color:#4f8cff}.k-수학{border-left-color:#ff6b6b}.k-영어{border-left-color:#a78bfa}
.k-사회{border-left-color:#fbbf24}.k-과학{border-left-color:#34d399}.k-국사{border-left-color:#fb923c}
.k-예체능{border-left-color:#94a3b8}.k-제2외국어{border-left-color:#22d3ee}.k-기타{border-left-color:#64748b}

/* 학점배당표 편제 */
.planbox{background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:14px}
.chiprow{display:flex;flex-wrap:wrap;gap:6px;margin:5px 0 10px}
.subchip{display:inline-flex;align-items:center;gap:5px;background:var(--chip);border:1px solid var(--line);
  border-radius:8px;padding:4px 8px;font-size:11.5px}
.cat{font-size:9.5px;font-weight:800;border-radius:5px;padding:1px 5px;border:1px solid}
.cat.공통과목{color:#94a3b8;border-color:#94a3b8}
.cat.일반선택{color:#4f8cff;border-color:#4f8cff}
.cat.진로선택{color:#34d399;border-color:#34d399}
.cat.융합선택{color:#a78bfa;border-color:#a78bfa}
.cat.전문교과{color:#fbbf24;border-color:#fbbf24}
.picknotes{font-size:11.5px;color:var(--sub);line-height:1.8;margin-top:8px}

/* 진단 보완점 배너 */
.gapbanner{background:rgba(251,191,36,.10);border:1px solid var(--warn);border-radius:12px;padding:12px 14px;margin-bottom:12px;font-size:13px}
.gapbanner b{color:var(--warn)}
.gapchip{display:inline-block;background:var(--chip);border:1px solid var(--warn);color:var(--warn);
  border-radius:999px;padding:3px 10px;font-size:11.5px;font-weight:700;margin:6px 6px 0 0}
.tag-gap{display:inline-block;background:rgba(251,191,36,.16);border:1px solid var(--warn);color:var(--warn);
  border-radius:6px;padding:1px 6px;font-size:9.5px;font-weight:800;margin-left:4px}
.opt.gapfill{border-color:var(--warn)}
.tag-ext{display:inline-block;border:1px solid #22d3ee;color:#22d3ee;border-radius:6px;padding:1px 6px;font-size:9.5px;font-weight:800;margin-left:4px}

/* 구조화 탐구 카드 */
.inq{background:var(--panel2);border:1px solid var(--line);border-radius:14px;padding:16px;margin-top:12px}
.inq .htitle{display:flex;gap:10px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap}
.inq h4{font-size:15px;line-height:1.5}
.inq .fld2{margin-top:9px;font-size:13px;line-height:1.7}
.inq .fld2 b{display:inline-block;min-width:78px;color:var(--accent);font-size:11.5px;font-weight:800;
  letter-spacing:.3px;vertical-align:top}
.inq ol{margin:4px 0 0 96px;padding:0}
.inq ol li{font-size:13px;margin:3px 0}
.inq.res ul{margin:6px 0 0 0;padding:0}
.inq.res li{list-style:none;font-size:13px;margin:8px 0;padding:9px 11px;background:var(--chip);border-radius:9px;border:1px solid var(--line)}
.v-ok{display:inline-block;border:1px solid var(--ok);color:var(--ok);border-radius:6px;padding:1px 6px;
  font-size:9.5px;font-weight:800;margin-right:6px}
.hint{font-size:11.5px;color:var(--sub);margin-top:4px}
.regen{white-space:nowrap}

/* ---------- Expert-Course 연결 (bridge.js) ---------- */
.ec-bridge{margin:12px 0;padding:12px 14px;border:1px dashed var(--line, #8894a6);border-radius:10px;font-size:13px}
.ec-bridge .note{display:inline;margin:0}
.ec-link{position:absolute;right:16px;top:14px;font-size:12.5px;font-weight:700;text-decoration:none;padding:5px 10px;border-radius:8px;border:1px solid currentColor;color:var(--accent);opacity:.9}
.ec-link:hover{opacity:1}
header{position:relative}
.ec-report .ec-card{border:1px solid rgba(128,128,128,.35);border-radius:10px;padding:10px 14px;margin:8px 0}
.ec-report .ec-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.ec-report ul{margin:4px 0 0;padding-left:18px}
@media (max-width:720px){.ec-report .ec-cols{grid-template-columns:1fr}.ec-link{position:static;display:inline-block;margin-top:8px}}

/* ===== ⑦ 서울대 배출 격차 분석 (snu.js) ===== */
:root{ --snu-ja:#4f8cff; --snu-il:#c97a0c; }
body.light{ --snu-ja:#2f6bd6; --snu-il:#c2760a; }
.snu-find{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:12px}
.snu-fcard{background:var(--panel2);border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:12px;padding:14px}
.snu-fcard h4{font-size:14.5px;margin-bottom:6px}
.snu-fcard p{font-size:13px;color:var(--sub);line-height:1.7}
.snu-scroll{overflow-x:auto}
.snu-fw td{font-size:12.5px}
.snu-q{color:var(--sub);font-style:italic;min-width:220px}
.snu-chart{position:relative;margin-top:12px;background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:12px}
.snu-svg{width:100%;height:auto;display:block}
.snu-svg .grid{stroke:var(--line);stroke-width:1}
.snu-svg .axis{stroke:var(--sub);stroke-width:1}
.snu-svg .tick{fill:var(--sub);font-size:11px}
.snu-svg .axl{fill:var(--sub);font-size:11.5px;font-weight:600}
.snu-svg .plab{fill:var(--txt);font-size:11.5px;font-weight:600;paint-order:stroke;stroke:var(--panel2);stroke-width:3px}
.mk{stroke:var(--panel2);stroke-width:2}
.mk.g-ja{fill:var(--snu-ja)} .mk.g-il{fill:var(--snu-il)}
.mk.on{stroke:var(--txt);stroke-width:2.5}
.snu-svg .hit{fill:transparent;cursor:pointer}
.snu-svg .pt:focus{outline:none} .snu-svg .pt:focus .mk{stroke:var(--txt)}
.snu-legend{display:flex;flex-wrap:wrap;gap:14px;align-items:center;font-size:12px;color:var(--sub);margin-bottom:6px}
.snu-legend span{display:inline-flex;align-items:center;gap:5px}
.snu-legend svg .mk{stroke:none}
.snu-rho{margin-left:auto;color:var(--txt)}
.snu-tip{position:absolute;z-index:5;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-size:12px;line-height:1.6;pointer-events:none;box-shadow:0 6px 20px rgba(0,0,0,.25);min-width:180px}
.snu-tbl th{cursor:pointer;white-space:nowrap} .snu-tbl th.num{text-align:center}
.snu-row{cursor:pointer} .snu-row:hover td{background:var(--panel2)} .snu-row.on td{background:var(--chip)}
.snu-detail h3{font-size:17px}
.snu-read{font-size:13.5px;line-height:1.8}
.ybars{display:flex;gap:10px;align-items:flex-end;height:140px;padding-top:6px}
.yb{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%}
.ystack{display:flex;flex-direction:column;justify-content:flex-end;width:28px}
.ystack .ys{background:var(--snu-ja);border-radius:0}
.ystack .yj{background:var(--line);border-radius:4px 4px 0 0;margin-bottom:2px}
.yv{font-size:12px;font-weight:700;margin-top:4px} .yv span{color:var(--sub);font-weight:500}
.yv.none{color:var(--sub)}
.yl{font-size:11px;color:var(--sub)}
.lg-s,.lg-j{display:inline-block;width:10px;height:10px;border-radius:2px}
.lg-s{background:var(--snu-ja)} .lg-j{background:var(--line)}
@media(max-width:640px){ .snu-rho{margin-left:0} .snu-find{grid-template-columns:1fr} }
.snu-fw{min-width:760px} .snu-tbl{min-width:940px}
.snu-fw td:first-child,.snu-rec td:first-child{white-space:nowrap}
.snu-detail .cmp td:first-child{min-width:150px;width:44%}
.snu-detail .cmp td{padding:8px 6px}
/* 불리 요인 진단 */
.snu-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:6px}
.snu-tile{background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:12px;text-align:center}
.snu-tile .n{font-size:26px;font-weight:800;font-variant-numeric:tabular-nums}
.snu-tile .l{font-size:12px;color:var(--sub);font-weight:700}
.snu-tile.lv-bad{border-top:3px solid var(--bad)} .snu-tile.lv-warn{border-top:3px solid var(--warn)}
.snu-tile.lv-good{border-top:3px solid var(--ok)} .snu-tile.lv-none{border-top:3px dashed var(--line)}
.lvb{display:inline-block;white-space:nowrap;font-size:11px;font-weight:800;border-radius:6px;padding:2px 7px;border:1px solid var(--line);color:var(--sub)}
.lvb.lv-bad{border-color:var(--bad);color:var(--bad)} .lvb.lv-warn{border-color:var(--warn);color:var(--warn)}
.lvb.lv-good{border-color:var(--ok);color:var(--ok)} .lvb.lv-none{border-style:dashed}
.snu-h4{font-size:13.5px;margin:16px 0 4px}
.snu-dtbl{min-width:720px} .snu-dtbl td:nth-child(2){min-width:190px}
.snu-todo{margin:6px 0 0 18px;font-size:13.5px} .snu-todo>li{margin:10px 0}
.snu-todo ul{list-style:none;margin:4px 0 0 4px;color:var(--sub);font-size:13px}
.snu-report{margin-top:22px;page-break-inside:auto}
.snu-report h2{font-size:17px;margin-bottom:10px}
@media(max-width:640px){.snu-tiles{grid-template-columns:repeat(2,1fr)}}
@media print{.snu-dtbl{min-width:0}}
.snu-type{min-width:760px} .snu-cg{min-width:640px}
.hbar{position:relative;display:flex;align-items:center;gap:8px;min-width:200px}
.hbar i{display:block;height:14px;border-radius:0 4px 4px 0;min-width:2px}
.hbar i.g-ja{background:var(--snu-ja)} .hbar i.g-il{background:var(--snu-il)}
.hbar span{font-size:12.5px;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.dbar{position:relative;height:10px;background:var(--chip);border-radius:3px;min-width:160px}
.dbar .mid{position:absolute;left:50%;top:-2px;bottom:-2px;width:1px;background:var(--sub)}
.dbar i{position:absolute;top:0;bottom:0;border-radius:2px}
.dbar i.pos{background:var(--accent)} .dbar i.neg{background:var(--sub)}
.dval{font-size:12px;margin-top:3px;font-variant-numeric:tabular-nums}