/* 이안에 입시 — 화면 스타일
   원칙: 넓은 화면을 다 쓴다. 좁은 폭에 욱여넣지 않는다. */

:root {
  --paper:#F4F2ED; --surface:#FFFFFF; --raise:#FAF9F6; --sunk:#EFEDE6;
  --ink:#1F2229; --soft:#5C616B; --faint:#8C9099; --line:#E3DED2; --line2:#EFEBE1;
  --accent:#2B4C7E; --accent-soft:#E9F0F8; --accent-ink:#1E3A63;
  --gold:#8F6414; --gold-soft:#F7EFDC; --gold-line:#E6D3A8;
  --ok:#16C07B; --ok-soft:#E4F7EE; --warn:#F2B315; --warn-soft:#FDF3DA;
  --risk:#FF5B4D; --risk-soft:#FEE9E6; --na:#8C9099; --na-soft:#EEECE6;
  --flip:#5B6CF0; --flip-soft:#EBEDFE; --flip-line:#C3C9FA;
  --shadow:0 1px 2px rgba(31,34,41,.05), 0 8px 24px -12px rgba(31,34,41,.18);
  --r:14px; --r-sm:9px;
  /* 🔴 상단 바 높이는 **여기 한 곳에서만** 정한다.
        `.editor`(정밀 입력 창)가 `inset:58px` 로 그 수를 따로 베껴 두고 있었는데,
        폰에서 상단 바가 52px 라 6px 이 어긋나 있었고, 메뉴를 두 줄로 내리면
        입력 창이 **메뉴를 덮어** 버린다. 두 곳이 같은 수를 보게 묶는다. */
  --topH:58px;
}
/* 어두운 모드는 쓰지 않는다(원장 지시: 흰 바탕 고정). 아래 규칙은 꺼 둔다. */
@media (prefers-color-scheme:dark) and (min-width:99999px){
  :root{
    --paper:#111318; --surface:#191C22; --raise:#20242C; --sunk:#15181D;
    --ink:#E9E6DF; --soft:#9DA2AC; --faint:#71767F; --line:#2B2F38; --line2:#232730;
    --accent:#82A3D6; --accent-soft:#1E2836; --accent-ink:#A9C3E8;
    --gold:#D3A855; --gold-soft:#2A2415; --gold-line:#4A3F22;
    --ok:#22D48D; --ok-soft:#122E23; --warn:#F5C13B; --warn-soft:#2E2712;
    --risk:#FF6E62; --risk-soft:#33201E; --na:#71767F; --na-soft:#20242C;
    --flip:#7E8CFF; --flip-soft:#1C1F3A; --flip-line:#39408A;
    --shadow:0 1px 2px rgba(0,0,0,.3), 0 8px 24px -12px rgba(0,0,0,.6);
  }
}
:root[data-theme="light"]{
  --paper:#F4F2ED; --surface:#FFFFFF; --raise:#FAF9F6; --sunk:#EFEDE6;
  --ink:#1F2229; --soft:#5C616B; --faint:#8C9099; --line:#E3DED2; --line2:#EFEBE1;
  --accent:#2B4C7E; --accent-soft:#E9F0F8; --accent-ink:#1E3A63;
  --gold:#8F6414; --gold-soft:#F7EFDC; --gold-line:#E6D3A8;
  --ok:#16C07B; --ok-soft:#E4F7EE; --warn:#F2B315; --warn-soft:#FDF3DA;
  --risk:#FF5B4D; --risk-soft:#FEE9E6; --na:#8C9099; --na-soft:#EEECE6;
  --flip:#5B6CF0; --flip-soft:#EBEDFE; --flip-line:#C3C9FA;
}
:root[data-theme="dark"]{
  --paper:#111318; --surface:#191C22; --raise:#20242C; --sunk:#15181D;
  --ink:#E9E6DF; --soft:#9DA2AC; --faint:#71767F; --line:#2B2F38; --line2:#232730;
  --accent:#82A3D6; --accent-soft:#1E2836; --accent-ink:#A9C3E8;
  --gold:#D3A855; --gold-soft:#2A2415; --gold-line:#4A3F22;
  --ok:#22D48D; --ok-soft:#122E23; --warn:#F5C13B; --warn-soft:#2E2712;
  --risk:#FF6E62; --risk-soft:#33201E; --na:#71767F; --na-soft:#20242C;
  --flip:#7E8CFF; --flip-soft:#1C1F3A; --flip-line:#39408A;
}

*{box-sizing:border-box}
/* display:grid/flex 를 준 요소에도 hidden 이 확실히 먹도록 */
[hidden]{display:none !important}
html,body{margin:0;padding:0}
body{
  background:var(--paper); color:var(--ink); min-height:100vh;
  font-family:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Pretendard","Malgun Gothic","Noto Sans KR",sans-serif;
  -webkit-font-smoothing:antialiased; font-size:14px; line-height:1.5;
}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
button{cursor:pointer}
.num{font-variant-numeric:tabular-nums}

/* ── 상단 바 ───────────────────────────────────────────────────────────── */
.top{
  position:sticky; top:0; z-index:60; background:var(--surface);
  border-bottom:1px solid var(--line);
  display:flex; align-items:center; gap:18px; padding:0 22px; height:var(--topH);
}
.brand{display:flex; align-items:baseline; gap:7px; font-weight:800; letter-spacing:-.02em; font-size:17px}
/* 🔴 상단 바는 **어떤 폭에서도 글자가 쪼개지면 안 된다.**
      (창을 줄이거나 메뉴가 늘어나면 「이안에 입 / 시」처럼 한 글자씩 잘렸다)
      대신 가운데 메뉴만 옆으로 밀리고, 브랜드와 오른쪽(로그인/계정)은 항상 보인다. */
.top>*{flex:0 0 auto}
.brand,.top .meta,.top .meta>*,.nav button{white-space:nowrap}
.nav{flex:1 1 auto; min-width:0; overflow-x:auto; scrollbar-width:none}
.nav::-webkit-scrollbar{display:none}
.nav button{flex:0 0 auto}
.brand small{font-weight:600; font-size:11.5px; color:var(--faint); letter-spacing:0}
.top .meta{margin-left:auto; display:flex; align-items:center; gap:8px; flex-wrap:wrap}
.tag{
  font-size:11px; font-weight:700; color:var(--soft); background:var(--raise);
  border:1px solid var(--line); border-radius:999px; padding:4px 10px; white-space:nowrap;
}
.tag b{color:var(--ink)}
.icon-btn{
  background:var(--raise); border:1px solid var(--line); border-radius:var(--r-sm);
  width:34px; height:34px; display:grid; place-items:center; color:var(--soft); font-size:15px;
}
.icon-btn:hover{border-color:var(--accent); color:var(--accent)}

/* ── 전체 골격: 왼쪽 입력/필터 + 오른쪽 결과 ───────────────────────────── */
.shell{display:grid; grid-template-columns:312px minmax(0,1fr); gap:18px; padding:18px 20px 60px; align-items:start}
/* `.shell.wide` (왼쪽 패널 접기)는 단추를 없애면서 함께 지웠다 — 2026-08-02, 검증 ㊶ */
.side{position:sticky; top:78px; display:flex; flex-direction:column; gap:14px; max-height:calc(100vh - 96px); overflow-y:auto; padding-right:4px}
.side::-webkit-scrollbar{width:8px} .side::-webkit-scrollbar-thumb{background:var(--line);border-radius:4px}
.main{display:flex; flex-direction:column; gap:16px; min-width:0}

.card{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--shadow)}
.card>.hd{
  display:flex; align-items:center; gap:9px; padding:13px 16px; border-bottom:1px solid var(--line2);
}
.card>.hd h2{margin:0; font-size:13.5px; font-weight:800; letter-spacing:-.01em}
.card>.hd .sub{font-size:12px; color:var(--faint); margin-left:auto; font-weight:600}
.card>.bd{padding:14px 16px}
.card>.bd.tight{padding:10px 12px}

/* ── 입력 ─────────────────────────────────────────────────────────────── */

/* 기준 지표 — 8개가 한 줄에 안 들어가 글자가 깨지던 것을 4×2 격자로 */
.basisgrid{display:grid; grid-template-columns:repeat(4,1fr); gap:5px}
.basisgrid button{
  border:1px solid var(--line); background:var(--raise); color:var(--soft);
  border-radius:8px; padding:7px 2px; text-align:center; line-height:1.25;
}
.basisgrid button .t{display:block; font-size:12px; font-weight:800; white-space:nowrap}
.basisgrid button .c{display:block; font-size:9.5px; font-weight:600; opacity:.7; font-variant-numeric:tabular-nums}
.basisgrid button:hover{border-color:var(--accent); color:var(--accent)}
.basisgrid button[aria-selected="true"]{background:var(--accent); border-color:var(--accent); color:#fff}
:root[data-theme="dark"] .basisgrid button[aria-selected="true"]{color:#0f1116}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .basisgrid button[aria-selected="true"]{color:#0f1116}}

/* 「학기까지 나누기」 — 상지대처럼 학기마다 과목을 뽑는 대학용(기본 꺼짐) */
.qsemtog{display:block; width:100%; margin-top:6px; padding:7px 9px; text-align:left;
  border:1px dashed var(--line); border-radius:10px; background:transparent;
  color:var(--soft); font-size:11.5px; font-weight:800; cursor:pointer}
.qsemtog:hover{border-color:var(--accent); color:var(--accent)}
.qsemtog.on{border-style:solid; border-color:var(--accent); color:var(--accent); background:var(--sunk)}
.qsemtog .hint{display:block; margin-top:3px; font-size:10.5px; font-weight:600; color:var(--faint); line-height:1.45}
.qsemtog.on .hint{color:var(--soft)}
.qmoved{margin:6px 0 0; padding:6px 8px; border-radius:8px; background:var(--sunk);
  font-size:11px; font-weight:700; color:var(--warn); line-height:1.5}

.fld{
  width:100%; padding:9px 11px; border:1px solid var(--line); border-radius:var(--r-sm);
  background:var(--raise); color:var(--ink); font-size:13.5px;
}
.fld:focus{outline:2px solid var(--accent); outline-offset:-1px; border-color:var(--accent)}
.fld.bad{border-color:var(--risk); background:var(--risk-soft)}
select.fld{cursor:pointer}

.dhead,.drow{display:grid; grid-template-columns:62px 1fr 48px 44px 24px; gap:5px; align-items:center}
.dhead{font-size:10px; color:var(--faint); font-weight:700; margin:10px 0 4px; padding:0 2px}
.drow{margin-top:5px}
.drow .fld{padding:7px 6px; font-size:12.5px; text-align:center}
.drow .fld.nm{text-align:left}
.drow .del{background:transparent;border:0;color:var(--faint);font-size:16px;line-height:1;padding:2px}
.drow .del:hover{color:var(--risk)}
.dsec{font-size:11px; font-weight:800; color:var(--accent); margin-top:14px; padding-bottom:5px; border-bottom:1px solid var(--line2)}
.dadd{
  margin-top:8px; width:100%; background:var(--raise); border:1px dashed var(--line); color:var(--soft);
  border-radius:var(--r-sm); padding:9px; font-size:12px; font-weight:700;
}
.dadd:hover{border-color:var(--accent); color:var(--accent)}

.btns{display:flex; gap:8px; margin-top:13px}
.btn{border:0; border-radius:10px; padding:11px 14px; font-size:13.5px; font-weight:800}
.btn.go{flex:1; background:var(--accent); color:#fff}
:root[data-theme="dark"] .btn.go{color:#0f1116}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .btn.go{color:#0f1116}}
.btn.ghost{background:var(--raise); color:var(--soft); border:1px solid var(--line); font-weight:700}
.btn.ghost:hover{border-color:var(--accent); color:var(--accent)}

/* 🔴 원장 지시(2026-08-11 · 61차) — 「작은 글씨가 너무 많아.」
      11px 은 폰에서 거의 안 읽힌다. 덮어쓰는 규칙도 없어 **쓰이는 12곳이 전부** 그랬다 → 12.5px. */
.note{font-size:12.5px; color:var(--faint); line-height:1.6; margin:10px 0 0}
.note b{color:var(--soft)}

/* 🔴 「눌러서 펴는 설명」 — 모양을 **여기 한 곳에서만** 정한다(61차).
      성적진단 화면 세 자리(`#chgHead` · `#discFull` · 성적 입력 카드)가 같은 모양을 쓴다.
      전에는 긴 설명이 전부 펼쳐진 채라 결과보다 설명이 먼저 보였다. */
.foldy{margin:12px 0 0}
/* 🔴 접기·펼치기 화살표는 화면에 그리지 않는다 (원장 지시 2026-08-12 · 64차)
   「다른곳들도 있으면 다 지워 굳이 보여줄 필요 없잖아. 누르면 나오면 되는거」
   ⚠️ 아래 `list-style:none` 과 `::-webkit-details-marker{display:none}` 은 **지우지 마라** —
      지우면 브라우저가 자기 기본 삼각형을 대신 그려서 점이 도로 생긴다. */
.foldy>summary{
  cursor:pointer; font-size:13px; font-weight:800; color:var(--accent-ink);
  list-style:none; padding:6px 0;
}
.foldy>summary::-webkit-details-marker{display:none}
.foldy>summary:hover{text-decoration:underline}
.err{font-size:11.5px; color:var(--risk); font-weight:700; line-height:1.5; margin-top:10px}

/* ── 필터 ─────────────────────────────────────────────────────────────── */
.fgrp{margin-top:13px}
.fgrp:first-child{margin-top:0}
.fgrp>.t{font-size:11px; font-weight:800; color:var(--faint); letter-spacing:.04em; margin-bottom:7px; display:flex; align-items:center; gap:6px}
.fgrp>.t .clr{margin-left:auto; font-size:10.5px; font-weight:700; color:var(--accent); background:none; border:0; padding:0}
.chips{display:flex; flex-wrap:wrap; gap:5px}
.chip{
  border:1px solid var(--line); background:var(--raise); color:var(--soft);
  border-radius:999px; padding:5px 11px; font-size:11.5px; font-weight:700;
}
.chip[aria-pressed="true"]{background:var(--accent); border-color:var(--accent); color:#fff}
:root[data-theme="dark"] .chip[aria-pressed="true"]{color:#0f1116}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .chip[aria-pressed="true"]{color:#0f1116}}
.chip .c{opacity:.65; font-weight:600; margin-left:4px; font-size:10.5px}
.swrow{display:flex; align-items:center; gap:9px; padding:7px 0; font-size:12.5px; color:var(--soft)}
.swrow input{margin:0; accent-color:var(--accent); width:15px; height:15px}
.swrow label{cursor:pointer; user-select:none}
.swrow .c{margin-left:auto; font-size:11px; color:var(--faint)}
.moreflt{
  margin-top:13px; width:100%; background:var(--raise); border:1px solid var(--line); color:var(--soft);
  border-radius:var(--r-sm); padding:9px; font-size:11.5px; font-weight:700; text-align:left;
}
.moreflt:hover{border-color:var(--accent); color:var(--accent)}
.moreflt[aria-expanded="true"]{background:var(--accent-soft); color:var(--accent); border-color:transparent}

/* ── 요약 스트립 ───────────────────────────────────────────────────────── */
.summary{display:flex; gap:22px; align-items:center; padding:15px 18px}
.myg{display:flex; align-items:baseline; gap:10px; flex:0 0 auto}
.myg .v{font-size:34px; font-weight:800; letter-spacing:-.03em; line-height:1}
.myg .k{font-size:11.5px; color:var(--faint); font-weight:700}
.myg .k b{display:block; color:var(--soft); font-size:12.5px}
.lights{flex:1; display:grid; grid-template-columns:repeat(4,1fr); gap:10px}
/* 색은 왼쪽 막대가 맡고 배경은 비운다 — 색 구별이 또렷해지고 화면이 조용해진다 */
.light{
  border:1px solid var(--line); border-left:5px solid var(--line); border-radius:10px;
  padding:10px 14px; background:var(--surface);
}
.light .l{font-size:12px; font-weight:700; color:var(--soft)}
.light .n{font-size:24px; font-weight:800; line-height:1; margin-top:5px; letter-spacing:-.02em}
.light.ok{border-left-color:var(--ok)}    .light.ok .n{color:var(--ok)}
.light.warn{border-left-color:var(--warn)} .light.warn .n{color:var(--warn)}
.light.risk{border-left-color:var(--risk)} .light.risk .n{color:var(--risk)}
.light.flip{border-left-color:var(--flip)} .light.flip .n{color:var(--flip)}
.subjline{display:flex; flex-wrap:wrap; gap:6px; margin-top:10px}
.subjline .s{font-size:11px; color:var(--soft); background:var(--raise); border:1px solid var(--line2); border-radius:7px; padding:3px 8px; font-weight:700}

/* ── 탭 ───────────────────────────────────────────────────────────────── */
.tabs{display:flex; gap:2px; border-bottom:1px solid var(--line); padding:0 4px}
.tabs button{
  background:none; border:0; border-bottom:2px solid transparent; padding:10px 15px;
  font-size:13.5px; font-weight:700; color:var(--faint); margin-bottom:-1px;
}
.tabs button[aria-selected="true"]{color:var(--accent); border-bottom-color:var(--accent)}
.tabs .cnt{font-size:11px; font-weight:700; opacity:.7; margin-left:5px}

/* 카드에서 특정 대학으로 들어왔을 때 되돌아가는 줄 */
.ctxbar{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  padding:10px 14px; background:var(--flip-soft); border-bottom:1px solid var(--flip-line);
  font-size:12.5px; color:var(--soft);
}
.ctxbar .back{
  border:1px solid var(--flip); background:var(--surface); color:var(--flip);
  border-radius:8px; padding:6px 12px; font-size:12px; font-weight:800; white-space:nowrap;
}
.ctxbar .back:hover{background:var(--flip); color:#fff}
.ctxbar .who{font-weight:800; color:var(--ink)}
.ctxbar .clear{
  margin-left:auto; border:1px solid var(--line); background:var(--surface); color:var(--soft);
  border-radius:8px; padding:6px 11px; font-size:11.5px; font-weight:700; white-space:nowrap;
}
.ctxbar .clear:hover{border-color:var(--accent); color:var(--accent)}

.toolbar{display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:11px 14px; border-bottom:1px solid var(--line2)}
.toolbar .grow{flex:1; min-width:120px}
.toolbar .lb{font-size:11px; font-weight:800; color:var(--faint); letter-spacing:.03em}

/* ── 표 ───────────────────────────────────────────────────────────────── */
.twrap{overflow-x:auto}
table.grid{width:100%; min-width:921px; table-layout:fixed; border-collapse:separate; border-spacing:0; font-size:13px}
table.grid th{
  position:sticky; top:0; z-index:2; background:var(--raise); color:var(--faint);
  font-size:11.5px; font-weight:800; letter-spacing:.02em; text-align:left; white-space:nowrap;
  padding:9px 10px; border-bottom:1px solid var(--line);
}
table.grid th.r{text-align:right} table.grid th.c{text-align:center}
table.grid td{
  padding:8px 10px; border-bottom:1px solid var(--line2); vertical-align:middle;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
table.grid tbody tr:hover td{background:var(--raise)}

/* 대학·전형 한 줄(접힌 상태) */
tr.ghead>td{background:var(--raise); cursor:pointer; padding:0; border-bottom:1px solid var(--line)}
tr.ghead:hover>td{background:var(--accent-soft)}
.grow2{display:flex; align-items:center; gap:9px; padding:9px 12px; min-width:0}
.gu{font-weight:800; font-size:13px; white-space:nowrap}
.gj{color:var(--soft); font-size:11.5px; max-width:170px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; flex:0 1 auto}
.gr{color:var(--faint); font-size:11px; flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.gmy{font-size:11px; color:var(--faint); white-space:nowrap} .gmy b{color:var(--ink); font-size:13px}
.gpills{display:flex; gap:4px; flex:0 0 auto}
.gp{font-size:10.5px; font-weight:800; padding:2px 7px; border-radius:5px; background:var(--raise); border-left:3px solid var(--line); color:var(--soft)}
.gp.ok{border-left-color:var(--ok); color:var(--ok)}
.gp.warn{border-left-color:var(--warn); color:var(--warn)}
.gp.risk{border-left-color:var(--risk); color:var(--risk)}
.gp.flip{border-left-color:var(--flip); color:var(--flip)}
.gp.na{border-left-color:var(--na); color:var(--na)}
.gn{font-size:10.5px; color:var(--faint); white-space:nowrap; flex:0 0 auto}

/* 펼쳐진 학과 줄 — 왼쪽에 가는 선으로 묶음에 속한 것을 표시 */
table.grid tr.hrow td.ind{box-shadow:inset 12px 0 0 -10px var(--flip-line)}
table.grid td.r{text-align:right}
table.grid td.c{text-align:center; overflow:visible}
.uname{font-weight:700}
.jname{color:var(--soft); font-size:11.5px; overflow:hidden; text-overflow:ellipsis}
.hname{font-weight:600}
.rulecell{display:flex; align-items:center; gap:5px; min-width:0}
.rule{flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11.5px; color:var(--soft)}
.rbadge{flex:0 0 auto; display:flex; gap:4px}
.sub2{color:var(--faint); font-size:12px; margin-top:1px; overflow:hidden; text-overflow:ellipsis}
.sub2.ch{color:var(--gold); font-weight:700; cursor:help}

/* 🔴🔴 「물음표 커서인데 아무 설명이 없다」를 없앤다 (원장 지시 2026-08-08)
   ── 「근사」·「추가합격인원(…」처럼 **커서만 ? 로 바뀌고 끝나면** 사용자는 알 길이 없다.
      그래서 ① 눌러서 열리는 설명 상자를 붙이고 ② 「누를 수 있다」는 것이 보이게 점선을 깐다.
   🔴 아래 목록은 이 파일에서 `cursor:help` 를 쓰는 **모든 자리**와 같아야 한다 — 검사기 (114)가 지킨다. */
.sub2.ch, .badge.ax, .badge.gw, .badge.hy, .badge.hyo,
.badge.chg, .badge.oy, .badge.exact, .badge.gone, .badge.oldunk, .refcut,
.ns-day-got{
  text-decoration:underline dotted currentColor; text-underline-offset:2px;
  -webkit-text-decoration:underline dotted currentColor}
.sub2.ch::after{content:' ⓘ'; opacity:.75; font-weight:800}

/* 눌러서 여는 설명 상자 */
.tippop{position:fixed; z-index:80; max-width:min(340px, calc(100vw - 24px));
  background:var(--surface); color:var(--ink); border:1px solid var(--line2);
  border-radius:12px; box-shadow:0 12px 34px rgba(0,0,0,.22); padding:12px 13px;
  font-size:12.5px; line-height:1.7; font-weight:600}
.tippop .tp-h{display:flex; align-items:center; gap:8px; margin-bottom:6px}
.tippop .tp-h b{font-size:12px; color:var(--soft)}
.tippop .tp-x{margin-left:auto; border:0; background:transparent; cursor:pointer;
  color:var(--faint); font-size:15px; line-height:1; padding:2px 4px}
.tippop .tp-b{white-space:pre-wrap; word-break:break-word}
.mg{font-weight:800}
/* 🔴 원장 지시(2026-08-11 · 61차) — 「작은 글씨가 너무 많아.」
      딱지(안정·적정·도전 · 이안에 픽! · 그룹 …)는 **결과 목록에서 가장 많이 보이는 글자**인데
      10px 이라 폰에서 잘 안 읽혔다 → 11.5px. 자리를 먹지 않게 여백만 조금 줄인다. */
.badge{
  display:inline-block; font-size:11.5px; font-weight:800; padding:2px 6px; border-radius:5px;
  border:1px solid var(--line); color:var(--soft); background:var(--raise); white-space:nowrap;
}
.badge.grp{border-color:var(--line)}
.badge.rg{color:var(--accent); background:var(--accent-soft); border-color:transparent}
.badge.sp{color:var(--gold); background:var(--gold-soft); border-color:transparent}
.badge.yr{color:var(--risk); background:var(--risk-soft); border-color:transparent}
.badge.ax{color:var(--warn); background:var(--warn-soft); border-color:transparent; cursor:help}
.badge.flip{color:var(--flip); background:var(--flip-soft); border-color:var(--flip-line)}
.badge.gw{color:var(--risk); background:var(--risk-soft); border-color:transparent; cursor:help; font-weight:800}
.badge.hy{color:var(--warn); background:var(--warn-soft); border-color:transparent; cursor:help; font-weight:800; white-space:nowrap}
.badge.hyo{color:var(--ok); background:var(--ok-soft); border-color:transparent; cursor:help; font-weight:800; white-space:nowrap}
.sig{
  display:inline-block; min-width:48px; text-align:center; font-size:12.5px; font-weight:800;
  padding:3px 9px; background:var(--raise); border-left:3px solid var(--line);
  border-radius:0 6px 6px 0; color:var(--soft);
}
.sig.ok{border-left-color:var(--ok); color:var(--ok)}
.sig.warn{border-left-color:var(--warn); color:var(--warn)}
.sig.risk{border-left-color:var(--risk); color:var(--risk)}
.sig.na{border-left-color:var(--na); color:var(--na); font-weight:700}
/* 🔴 43차 — 「대학이 안 냈다(지표없음)」와 「학생이 원점수를 아직 안 넣었다」를 눈으로도 가른다.
   뒤엣것은 학생이 지금 바로 고칠 수 있는 것이라 **눌러 보고 싶은 색**(강조색)으로 둔다. */
.sig.need{border-left-color:var(--accent); color:var(--accent); min-width:64px}
/* 등급이 아니라 환산점수로 잰 줄 — 신호등 밑에 작게 밝힌다(절대원칙 4) */
.byscore{color:var(--faint); font-size:10.5px; margin-top:3px; letter-spacing:-.2px}

/* 정확 비교 상자 — 「무엇으로 쟀는가」를 밝히는 줄 */
.ex-why{
  margin-top:9px; padding:9px 11px; border-radius:8px; font-size:12px; line-height:1.75;
  background:var(--accent-soft); color:var(--soft); border-left:3px solid var(--accent);
}

.more{display:block; width:100%; background:var(--raise); border:0; border-top:1px solid var(--line2); padding:13px; font-size:12.5px; font-weight:800; color:var(--accent)}
.more:hover{background:var(--accent-soft)}
.empty{padding:52px 20px; text-align:center; color:var(--faint); font-size:13px; line-height:1.8}
.empty .t{color:var(--soft); display:block; font-size:15px; font-weight:800; margin-bottom:8px}
.empty b{color:var(--soft)}
.empty p{max-width:560px; margin:0 auto}

/* ── 좁은 화면용 결과 카드 ─────────────────────────────────────────────── */
#cardList{padding:10px 12px; display:flex; flex-direction:column; gap:9px}
.gwrap{border:1px solid var(--line); border-radius:var(--r); background:var(--surface); overflow:hidden}
.ghead-m{padding:11px 13px; cursor:pointer}
.ghead-m:active{background:var(--raise)}
.ghead-m .l1{display:flex; align-items:center; gap:7px}
.ghead-m .l1 .gu{font-weight:800; font-size:14px}
.ghead-m .l1 .gn{margin-left:auto; font-size:12px; color:var(--faint)}
.ghead-m .l2{font-size:12.5px; color:var(--soft); margin-top:4px}
.ghead-m .l3{display:flex; align-items:center; gap:8px; margin-top:8px}
.ghead-m .l3 .gmy{margin-left:auto}
.gbody{padding:0 10px 10px; display:flex; flex-direction:column; gap:8px; background:var(--sunk)}
.gbody .rcard{border-color:var(--line2)}
.rcard{border:1px solid var(--line); border-radius:var(--r); padding:12px 13px; background:var(--surface); cursor:pointer}
.rcard:active{background:var(--raise)}
.rc-h{display:flex; align-items:center; gap:7px; flex-wrap:wrap}
.rc-u{font-weight:800; font-size:14px}
.rc-h .sig{margin-left:auto}
.rc-hak{font-weight:700; font-size:13.5px; margin-top:6px; line-height:1.45}
.rc-sub{font-size:12.5px; color:var(--faint); margin-top:3px; line-height:1.45}
.rc-nums{display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:10px; text-align:center}
.rc-nums>div{background:var(--raise); border-radius:var(--r-sm); padding:7px 4px}
.rc-nums .k{display:block; font-size:11.5px; color:var(--faint); font-weight:700}
.rc-nums b{font-size:16px; font-weight:800}
.rc-rule{font-size:12.5px; color:var(--soft); margin-top:9px; line-height:1.5}
.rc-meta{font-size:12px; color:var(--faint); margin-top:5px}

.gainhelp{
  margin:14px 14px 0; padding:11px 14px; background:var(--flip-soft); border:1px solid var(--flip-line);
  border-radius:var(--r-sm); font-size:12px; color:var(--soft); line-height:1.65;
}
.gainhelp b{color:var(--ink)}
/* 🏅 무엇으로 줄 세웠는지 밝히는 줄 — 설명 아래에 한 칸 띄워 붙인다 */
.gainsort{margin-top:7px; padding-top:7px; border-top:1px dashed var(--flip-line); font-size:11.5px}

/* ── 유리한 대학 카드 ───────────────────────────────────────────────────── */
.cards{display:grid; grid-template-columns:repeat(auto-fill,minmax(330px,1fr)); gap:12px; padding:14px}
.badge.flip{white-space:nowrap}
.gcard{border:1px solid var(--line); border-left:5px solid var(--flip); background:var(--surface); border-radius:var(--r); overflow:hidden}
/* 🔴 80차 — **대학 이름이 한 글자씩 세로로 깨졌다**(원장 지적 2026-08-19 · 나사렛대).
   머리줄이 flex 인데 이름에 nowrap 이 없어, 딱지가 하나 더 붙는 곳
   (「⚠️ 작년 규칙 확인 안 됨」이 붙는 7곳)에서 자리가 모자라 이름이 통째로 눌렸다.
   → 이름은 **안 줄인다**(nowrap · shrink 0), 자리가 모자라면 **딱지가 아랫줄로 내려간다**. */
.gcard .gh{display:flex; align-items:center; flex-wrap:wrap; gap:8px; padding:12px 14px; background:var(--flip-soft); border-bottom:1px solid var(--flip-line)}
.gcard .gh .u{font-weight:800; font-size:14px; white-space:nowrap; flex:0 0 auto}
.gcard .gh .g{margin-left:auto; font-size:12px; font-weight:800; color:var(--flip); white-space:nowrap}
.gcard .gb{padding:11px 14px}
.gcard .why{font-size:12.5px; color:var(--soft); line-height:1.6}
.gcard .why b{color:var(--ink)}
.gcard .hl{margin-top:9px; display:flex; flex-direction:column; gap:5px}
.gcard .hl .row{display:flex; align-items:center; gap:8px; font-size:13px}
.gcard .hl .row .n{flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.gcard .hl .row .v{color:var(--faint); font-size:12px}
.gcard{cursor:pointer; transition:border-color .12s, transform .12s}
.gcard:hover{border-color:var(--flip); transform:translateY(-1px)}
.gcard .gmore{
  margin-top:10px; padding-top:9px; border-top:1px solid var(--line2);
  font-size:12.5px; font-weight:700; color:var(--accent); text-align:right;
}

/* ── 상세 패널 ─────────────────────────────────────────────────────────── */
.drawer{position:fixed; inset:0; z-index:80; display:none}
.drawer.on{display:block}
.drawer .scrim{position:absolute; inset:0; background:rgba(20,22,27,.45)}
.drawer .panel{
  position:absolute; right:0; top:0; bottom:0; width:min(820px,96vw); background:var(--surface);
  border-left:1px solid var(--line); display:flex; flex-direction:column;
}
.drawer .ph{display:flex; align-items:flex-start; gap:10px; padding:18px 22px; border-bottom:1px solid var(--line)}
.drawer .ph h3{margin:0; font-size:19px; font-weight:800}
.drawer .ph .x{margin-left:auto; background:none; border:0; font-size:20px; color:var(--faint); line-height:1}
.drawer .pb{padding:18px 22px; overflow-y:auto; flex:1}
.dl{display:grid; grid-template-columns:112px 1fr; gap:9px 14px; font-size:14.5px; margin-bottom:18px}
.dl dt{color:var(--faint); font-weight:700}
.dl dd{margin:0; color:var(--ink)}
.raw{
  background:var(--sunk); border:1px solid var(--line2); border-radius:var(--r-sm);
  padding:13px 15px; font-size:13.5px; color:var(--soft); line-height:1.75; white-space:pre-wrap;
  word-break:break-word; margin-bottom:13px;
}
.raw .k{display:block; font-weight:800; color:var(--faint); font-size:12px; letter-spacing:.04em; margin-bottom:6px}

/* ── 면책 ─────────────────────────────────────────────────────────────── */
/* 🔴 원장 지시(2026-08-11 · 61차) — 「작은 글씨가 너무 많아.」
      기본이 11.5px 이라 폰에서 잘 안 읽혔다 → 12.5px. 제목도 12 → 13px. */
.disc{font-size:12.5px; color:var(--faint); line-height:1.75; padding:16px 18px; border:1px dashed var(--line); border-radius:var(--r); background:var(--raise)}
.disc b{color:var(--soft)}
.disc h4{margin:0 0 7px; font-size:13px; color:var(--soft)}

/* ── 첫 화면 ──────────────────────────────────────────────────────────── */
.brand{background:none; border:0; padding:0; cursor:pointer}
.hwrap{max-width:1240px; margin:0 auto; padding:0 32px}
.hero{padding:64px 0 54px; background:linear-gradient(180deg,var(--accent-soft),transparent)}
.hbadge{display:inline-block; font-size:11.5px; font-weight:800; color:var(--accent);
  background:var(--surface); border:1px solid var(--line); border-radius:999px; padding:6px 14px}
.hero h1{font-size:clamp(34px,4.2vw,52px); line-height:1.28; font-weight:800; letter-spacing:-.035em; margin:20px 0 0; text-wrap:balance}
.hero h1 .hl{color:var(--flip)}
.hsub{font-size:clamp(15px,1.35vw,18px); color:var(--soft); line-height:1.85; margin:18px 0 0; max-width:820px}
.hsub b{color:var(--ink)}
.hbtns{display:flex; gap:10px; margin-top:26px; flex-wrap:wrap}
.hbtns .btn{flex:0 0 auto}
.hbig{padding:14px 26px; font-size:14.5px}
.hstats{display:flex; gap:9px; flex-wrap:wrap; margin-top:26px}
.hstats span{font-size:12px; font-weight:700; color:var(--soft); background:var(--surface);
  border:1px solid var(--line); border-radius:9px; padding:8px 13px}
.hstats span b{color:var(--ink); font-size:14px}

.hsec{padding:clamp(48px,4.5vw,72px) 0}
.hsec.alt{background:var(--surface); border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.hh{font-size:clamp(22px,2.3vw,30px); font-weight:800; letter-spacing:-.025em; margin:0 0 20px}
.hh-sub{font-size:clamp(14px,1.25vw,16.5px); color:var(--soft); line-height:1.8; margin:-8px 0 24px; max-width:900px}

/* 다른 곳과 무엇이 다른가 — 좌우 비교 */
.vs{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.vs-col{border:1px solid var(--line); border-radius:16px; padding:20px 20px 18px; background:var(--surface)}
.vs-col.old{opacity:.82}
.vs-col.ours{border:2px solid var(--flip-line); background:var(--flip-soft)}
.vs-h{font-size:13px; font-weight:800; letter-spacing:-.01em; margin-bottom:12px;
  display:inline-block; padding:4px 11px; border-radius:999px}
.vs-col.old .vs-h{background:var(--sunk); color:var(--faint)}
.vs-col.ours .vs-h{background:var(--flip); color:#fff}
.vs-col ul{margin:0; padding:0; list-style:none}
.vs-col li{font-size:clamp(13px,1.1vw,15px); line-height:1.7; color:var(--soft); padding:8px 0 8px 22px; position:relative;
  border-top:1px solid var(--line2)}
.vs-col li:first-child{border-top:0}
.vs-col.old li::before{content:'✕'; position:absolute; left:0; top:8px; color:var(--faint); font-weight:800; font-size:11px}
.vs-col.ours li::before{content:'✓'; position:absolute; left:0; top:8px; color:var(--flip); font-weight:800; font-size:12px}
.vs-col.ours li{color:var(--ink)}
.vs-col b{color:var(--ink)}
.vs-col.ours b{color:var(--flip)}

.whyrow{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:14px; margin-top:16px}
.why{background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:18px 18px 16px}
.hsec.alt .why{background:var(--paper)}
.why-t{font-size:clamp(15.5px,1.3vw,18px); font-weight:800; letter-spacing:-.01em; margin-bottom:8px}
.why-s{font-size:clamp(14px,1.15vw,15.5px); color:var(--soft); line-height:1.85}
@media (max-width:760px){ .vs{grid-template-columns:1fr} }

.excard{display:grid; grid-template-columns:1fr auto 1fr; gap:18px; align-items:center;
  background:var(--surface); border:1px solid var(--line); border-radius:18px; padding:26px 24px}
.ex-l{text-align:center}
.ex-k{font-size:11.5px; font-weight:700; color:var(--faint)}
.ex-v{font-size:38px; font-weight:800; letter-spacing:-.03em; line-height:1.1; margin-top:5px}
.ex-v.risk{color:var(--risk)} .ex-v.ok{color:var(--ok)}
.ex-t{font-size:12px; font-weight:800; margin-top:4px; color:var(--soft)}
.ex-arrow{font-size:24px; color:var(--flip); font-weight:800}
.ex-note{grid-column:1/-1; border-top:1px solid var(--line2); padding-top:16px; margin-top:4px;
  font-size:13px; color:var(--soft); line-height:1.85}
.ex-note b{color:var(--ink)}

.steps{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:14px}
.step{background:var(--paper); border:1px solid var(--line); border-radius:var(--r); padding:22px 20px}
.hsec:not(.alt) .step{background:var(--surface)}
.st-n{width:30px; height:30px; border-radius:50%; background:var(--flip); color:#fff;
  display:grid; place-items:center; font-weight:800; font-size:14px}
:root[data-theme="dark"] .st-n{color:#0f1116}
.st-t{font-size:15px; font-weight:800; margin-top:13px}
.st-s{font-size:12.5px; color:var(--soft); line-height:1.8; margin-top:7px}

.trust{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:14px}
.tr{background:var(--surface); border:1px solid var(--line); border-left:4px solid var(--ok);
  border-radius:var(--r); padding:20px}
.tr-t{font-size:14.5px; font-weight:800}
.tr-s{font-size:12.5px; color:var(--soft); line-height:1.8; margin-top:7px}
.tr-s b{color:var(--ink)}

.hprice{display:flex; align-items:center; gap:20px; flex-wrap:wrap;
  background:var(--paper); border:1px solid var(--line); border-radius:18px; padding:26px 24px}
.hsec.alt .hprice{background:var(--paper)}
.hprice>div:first-child{flex:1; min-width:260px}
.hprice .btn{flex:0 0 auto}
.hbadge2{display:inline-block; font-size:11px; font-weight:800; color:#fff; background:var(--flip);
  border-radius:999px; padding:4px 12px}
:root[data-theme="dark"] .hbadge2{color:#0f1116}
.hpsub{font-size:15px; color:var(--soft); line-height:2; margin:0}
.hpsub s{color:var(--faint)} .hpsub b{color:var(--ink); font-size:15px}

.hlogin{background:var(--surface); border:1px solid var(--line); border-radius:var(--r);
  padding:20px 22px; display:flex; align-items:center; gap:14px; flex-wrap:wrap}
.hlogin .hl-t{font-size:14px; font-weight:800}
.hlogin .hl-s{font-size:12.5px; color:var(--soft); margin-top:4px; line-height:1.7}
.hlogin .btn{margin-left:auto; flex:0 0 auto}

@media (max-width:700px){
  .hero{padding:40px 0 36px} .hero h1{font-size:27px}
  .hsub{font-size:14px} .hh{font-size:19px} .hsec{padding:34px 0}
  .excard{grid-template-columns:1fr; gap:12px}
  /* 🔴 폰에서 화살표가 깨져 보인다는 지적(원장 2026-08-16).
     전에는 「→」를 90도 **돌려서** 아래를 향하게 했는데, 돌린 글자는 칸 높이가
     모자라면 잘린다. 돌리지 말고 **아래 화살표 글자를 그대로** 그린다. */
  /* 🔴 세로로 쌓일 때 화살표만 **왼쪽에 붙어** 삐뚤어 보였다 — 가운데로 맞춘다 */
  .ex-arrow{transform:none; font-size:0; line-height:1; height:auto;
    justify-self:center; text-align:center; width:100%}
  .ex-arrow::after{content:'↓'; font-size:24px; display:block; text-align:center}
  .hbig{width:100%} .hlogin .btn{margin-left:0; width:100%}
}

/* ── 상단 파트 ────────────────────────────────────────────────────────── */
.nav{display:flex; gap:2px}
.nav button{
  background:none; border:0; padding:8px 13px; border-radius:9px;
  font-size:13px; font-weight:700; color:var(--soft);
}
/* 🔴 메뉴가 넘칠 때 「옆으로 더 있다」를 알린다 — app.js `navHint()` 가 이 class 를 붙인다.
      전에는 아무 표시가 없어 마지막 메뉴가 그냥 잘려 보였다(폰 375px에서 「자료출처」→「자료출」).
      끝까지 밀면(atend) 표시를 거둔다. 그리기만 바꾸므로 누르는 데는 영향이 없다. */
.nav.canscroll{
  -webkit-mask-image:linear-gradient(to right,#000 calc(100% - 26px),rgba(0,0,0,.12));
          mask-image:linear-gradient(to right,#000 calc(100% - 26px),rgba(0,0,0,.12));
}
.nav.canscroll.atend{-webkit-mask-image:none; mask-image:none}
.nav button:hover{background:var(--raise); color:var(--ink)}
.nav button[aria-selected="true"]{background:var(--accent-soft); color:var(--accent); font-weight:800}
.plantag{
  font-size:11px; font-weight:800; color:var(--flip); background:var(--flip-soft);
  border:1px solid var(--flip-line); border-radius:999px; padding:4px 10px; white-space:nowrap;
}

/* ── 일반 페이지(요금제·이용안내·자료출처) ───────────────────────────── */
.pwrap{max-width:1100px; margin:0 auto; padding:38px 32px 74px}
.ptitle{font-size:32px; font-weight:800; letter-spacing:-.03em; margin:0 0 12px}
/* 🔴 한 쪽 안에서 큰 덩어리를 가르는 제목 — 2026-08-11(62차)에
   「자료출처」+「못 하는 것」을 한 쪽으로 합치면서 만들었다(원장 지시).
   ptitle 보다 작고 h3 보다 커서, 같은 쪽 안의 **다른 이야기**임이 눈에 든다. */
.ptitle2{font-size:24px; font-weight:800; letter-spacing:-.02em; margin:44px 0 10px;
  padding-top:30px; border-top:1px solid var(--line)}
.psub{font-size:16px; color:var(--soft); line-height:1.8; margin:0 0 28px}
.promo-badge{
  display:inline-block; font-size:11.5px; font-weight:800; color:#fff; background:var(--flip);
  border-radius:999px; padding:5px 13px; margin-bottom:12px;
}

/* ── 성적표 고르기 — 요금제는 성적표마다 붙는다 ───────────────────────── */
.sheetlist{display:flex; flex-direction:column; gap:6px}
.sheetrow{
  display:flex; align-items:center; gap:8px; width:100%; text-align:left;
  background:var(--raise); border:1.5px solid var(--line); border-radius:var(--r-sm);
  padding:9px 11px; font-size:12.5px; cursor:pointer;
}
.sheetrow:hover{border-color:var(--accent)}
.sheetrow[aria-selected="true"]{border-color:var(--accent); background:var(--surface); box-shadow:var(--shadow)}
.sheetrow .sh-n{font-weight:800; letter-spacing:-.02em}
.sheetrow .sh-s{color:var(--faint); font-size:11px}
.sheetrow .sh-p{
  margin-left:auto; font-size:10.5px; font-weight:800; border-radius:999px;
  padding:3px 8px; background:var(--na-soft); color:var(--na); white-space:nowrap;
}
.sheetrow .sh-p.on{background:var(--ok-soft); color:var(--ok)}
.sheetrow .sh-p.need{background:var(--risk-soft); color:var(--risk)}
/* 잠긴 줄의 '이 학교 열기' 단추 */
.mini.open{
  margin-left:auto; background:var(--accent); color:#fff; border:0; border-radius:999px;
  padding:5px 11px; font-size:11.5px; font-weight:800; white-space:nowrap; cursor:pointer;
}
.mini.open:hover{filter:brightness(1.08)}
.mini.open[disabled]{opacity:.5}
.sheetrow .sh-lk{font-size:11px}

/* ── 동의 페이지 — 저장·대학 돌리기·결제 전에 지나가는 경고 화면 ─────────── */
#page-consent .pwrap{max-width:820px}
.cs-box{display:flex; flex-direction:column; gap:12px; margin-bottom:22px}
.cs-item{
  background:var(--surface); border:1px solid var(--line); border-left:4px solid var(--line);
  border-radius:var(--r-sm); padding:15px 17px;
}
.cs-item .cs-k{font-size:16.5px; font-weight:800; letter-spacing:-.02em; margin-bottom:7px}
.cs-item p{margin:0; font-size:15px; line-height:1.85; color:var(--soft)}
.cs-item.cs-red{border-left-color:var(--risk); background:var(--risk-soft)}
.cs-item.cs-red .cs-k{color:var(--risk)}
.cs-item.cs-red p{color:var(--ink)}
.cs-agree{
  display:flex; align-items:flex-start; gap:11px; cursor:pointer;
  background:var(--raise); border:2px solid var(--line); border-radius:var(--r-sm);
  padding:18px 20px; font-size:16px; line-height:1.6;
  /* 🔴 위 상자와 **붙어 보이지 않게**(원장 지적 2026-08-20). 결제 앞 상자들과 같은 18px 로 맞춘다.
     ⚠️ 상자 **안**에 들어가는 체크(.cs-agree2)는 아래에서 margin:0 으로 되돌린다. */
  margin:18px 0 0;
}
.cs-agree:hover{border-color:var(--accent)}
.cs-agree input{width:20px; height:20px; margin:1px 0 0; flex:0 0 auto; accent-color:var(--accent)}
.cs-agree:has(input:checked){border-color:var(--accent); background:var(--accent-soft, var(--raise))}
.cs-err{color:var(--risk); font-size:13px; font-weight:700; min-height:18px; margin:10px 2px}
.cs-btns{display:flex; gap:10px; margin-top:6px}
.cs-btns .btn{flex:1; padding:14px; font-size:15px}
.cs-btns .btn[disabled]{opacity:.45; cursor:not-allowed}
@media (max-width:640px){
  #page-consent .pwrap{padding:22px 14px 46px}
  .cs-item{padding:13px 14px}
  .cs-btns{flex-direction:column-reverse}
}
:root[data-theme="dark"] .promo-badge{color:#0f1116}
.plans{display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:16px}
.plan{
  position:relative; background:var(--surface); border:1px solid var(--line);
  border-radius:18px; padding:26px 24px; box-shadow:var(--shadow);
}
.plan.best{border-color:var(--flip); border-width:2px}
.pl-best{
  position:absolute; top:-11px; left:24px; font-size:11px; font-weight:800; color:#fff;
  background:var(--flip); border-radius:999px; padding:4px 12px;
}
:root[data-theme="dark"] .pl-best{color:#0f1116}
.pl-name{font-size:14.5px; font-weight:800; color:var(--faint); letter-spacing:.03em}
.pl-price{display:flex; align-items:baseline; gap:9px; margin-top:9px}
.pl-price s{font-size:15px; color:var(--faint)}
.pl-price b{font-size:32px; font-weight:800; letter-spacing:-.03em}
.pl-tag{font-size:11.5px; font-weight:700; color:var(--flip); margin-top:4px}
.pl-list{list-style:none; padding:0; margin:20px 0 0; display:flex; flex-direction:column; gap:10px}
.pl-list li{font-size:14.5px; color:var(--soft); line-height:1.6; padding-left:22px; position:relative}
.pl-list li::before{content:'✓'; position:absolute; left:0; color:var(--ok); font-weight:800}
.pl-list li b{color:var(--ink)}
.pl-list .bonus{display:inline-block; font-size:10.5px; font-weight:700; color:var(--flip);
  background:var(--flip-soft); border-radius:5px; padding:1px 7px; margin-left:5px}
.pl-btn{width:100%; margin-top:22px; padding:13px}
.pnote{
  margin-top:20px; background:var(--warn-soft); border:1px solid var(--gold-line);
  border-radius:var(--r-sm); padding:13px 16px; font-size:12.5px; color:var(--soft); line-height:1.65;
}
.pnote b{color:var(--ink)}
.gsec{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:24px 26px; margin-bottom:14px}
.gsec h3{margin:0 0 10px; font-size:17.5px; font-weight:800}
.gsec p{margin:0; font-size:15px; color:var(--soft); line-height:1.9}
.gsec p b{color:var(--ink)}
.gsec .badge{margin-right:3px}
.gsec-strong{background:var(--accent-soft); border-color:var(--accent)}
.gsec-strong h3{color:var(--accent-ink)}
/* 약관·처리방침의 목록과 표 (전자상거래법 표시 항목) */
.gsec .gl{margin:8px 0 0; padding-left:20px; font-size:15px; color:var(--soft); line-height:1.9}
.gsec .gl li{margin:4px 0}
.gsec .gl b{color:var(--ink)}
.gsec .ptb{width:100%; border-collapse:collapse; font-size:14px; margin:10px 0 0}
.gsec .ptb th{font-size:12.5px; font-weight:800; color:var(--faint); text-align:left;
  padding:6px 10px 6px 0; border-bottom:1px solid var(--line); white-space:nowrap}
.gsec .ptb td{padding:8px 10px 8px 0; border-bottom:1px solid var(--line2);
  color:var(--soft); line-height:1.7; vertical-align:top}
.gsec .ptb tr:last-child td{border-bottom:0}
@media (max-width:640px){ .gsec .ptb{font-size:13px} .gsec .ptb th{white-space:normal} }

/* ── 사업자정보 꼬리말 — 🔴 모든 화면에 보여야 한다(전자상거래법·PG 심사) ──────── */
.foot{border-top:1px solid var(--line); background:var(--raise); margin-top:36px}
.foot-in{max-width:1080px; margin:0 auto; padding:22px 20px 34px}
.foot-nav{display:flex; flex-wrap:wrap; gap:6px 14px; margin-bottom:14px}
.foot-nav button{background:none; border:0; padding:2px 0; cursor:pointer;
  font-size:13.5px; font-weight:700; color:var(--soft); font-family:inherit}
.foot-nav button:hover{color:var(--accent); text-decoration:underline}
.foot-nav button b{color:var(--ink)}
.foot-biz{display:flex; flex-wrap:wrap; gap:4px 16px; font-size:12.5px;
  color:var(--faint); line-height:1.9}
.foot-biz b{color:var(--soft); font-weight:700}
.foot-note{margin:12px 0 0; font-size:12.5px; color:var(--faint); line-height:1.75; word-break:keep-all}
.foot-note b{color:var(--soft)}
.foot-copy{margin:10px 0 0; font-size:12px; color:var(--faint)}
.foot-copy b{color:var(--faint); font-weight:700}


/* ── 잠긴 결과 ────────────────────────────────────────────────────────── */
.locked{
  margin:14px; background:var(--flip-soft); border:1px dashed var(--flip-line);
  border-radius:var(--r); padding:24px 20px; text-align:center;
}
.locked .lk-t{font-size:15px; font-weight:800; color:var(--ink)}
.locked .lk-s{font-size:12.5px; color:var(--soft); line-height:1.7; margin-top:8px; max-width:520px; margin-left:auto; margin-right:auto}
.locked .lk-s b{color:var(--flip)}
.locked .btn{margin-top:15px; padding:11px 26px}
tr.lockrow td{background:var(--flip-soft); padding:0}
tr.lockrow .locked{margin:12px}

/* ── 계정 표시 ────────────────────────────────────────────────────────── */
.acct{display:flex; align-items:center; gap:7px; font-size:11.5px; color:var(--soft); font-weight:700}
.acct .em{max-width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.acct .out{border:1px solid var(--line); background:var(--raise); color:var(--soft);
  border-radius:7px; padding:4px 9px; font-size:11px; font-weight:700}
.acct .out:hover{border-color:var(--accent); color:var(--accent)}
.acct .adm{color:var(--flip); background:var(--flip-soft); border-radius:5px; padding:2px 6px; font-size:10px}

/* ── 로그인 화면 ──────────────────────────────────────────────────────── */
/* 🔴🔴 78차 — **가입 창이 화면보다 길면 아래쪽에 손이 닿지 않았다**(원장 지적 2026-08-18
   — 「회원가입할때 창이 밑에있어. 동의가 안되!!!!!!」).
   `position:fixed; inset:0` 이라 **화면 높이에 묶여 있는데 `overflow` 가 없어**,
   회원가입 칸(이름·추천인코드·동의 둘)이 길어지면 **동의 체크와 가입 단추가 잘려** 나갔다.
   🔴 `place-items:center` 로 가운데 맞추면 넘칠 때 **위아래가 함께 잘려** 스크롤도 막힌다.
      → **flex + 자식 `margin:auto`** 로 바꾼다. 짧으면 지금처럼 가운데, 길면 카드째 스크롤된다.
   ⚠️ 팝업(.modal)은 이미 `max-height:88vh; overflow:auto` 라 멀쩡하다 — 건드리지 않았다. */
.gate{position:fixed; inset:0; z-index:120; background:var(--paper); display:flex;
  overflow-y:auto; -webkit-overflow-scrolling:touch; padding:20px}
.gatebox{width:min(400px,100%); margin:auto; flex:0 0 auto;
  background:var(--surface); border:1px solid var(--line);
  border-radius:18px; padding:30px 28px; box-shadow:var(--shadow)}
.gb-top{display:flex; align-items:center; gap:10px}
.gb-x{margin-left:auto; border:1px solid var(--line); background:var(--raise); color:var(--soft);
  border-radius:7px; padding:5px 10px; font-size:11.5px; font-weight:700}
.gb-x:hover{border-color:var(--accent); color:var(--accent)}
.gb-brand{display:flex; align-items:center; gap:8px; font-weight:800; font-size:16px; letter-spacing:-.02em}
.gatebox h1{font-size:22px; margin:18px 0 8px; letter-spacing:-.02em}
.gb-sub{font-size:12.5px; color:var(--soft); line-height:1.65; margin:0 0 20px}
.gb-l{display:block; font-size:11.5px; font-weight:800; color:var(--faint); margin:12px 0 5px}
.gb-err{font-size:12px; color:var(--risk); font-weight:700; margin-top:11px; line-height:1.5; min-height:1px}
.gb-reset{display:block; width:100%; margin-top:11px; background:none; border:0; color:var(--faint);
  font-size:11.5px; font-weight:700; text-decoration:underline; text-underline-offset:3px}
.gb-reset:hover{color:var(--accent)}

/* 로그인 / 회원가입 전환 */
.gb-tabs{display:grid; grid-template-columns:1fr 1fr; gap:4px; margin:18px 0 14px;
  background:var(--sunk); border:1px solid var(--line); border-radius:11px; padding:4px}
.gb-tabs button{border:0; background:none; border-radius:8px; padding:9px 0;
  font-size:13px; font-weight:800; color:var(--faint); letter-spacing:-.01em}
.gb-tabs button.on{background:var(--surface); color:var(--ink); box-shadow:var(--shadow)}

/* 구글 버튼 */
.gbtn-google{width:100%; display:flex; align-items:center; justify-content:center; gap:9px;
  border:1px solid var(--line); background:var(--surface); color:var(--ink);
  border-radius:10px; padding:12px; font-size:13.5px; font-weight:800; letter-spacing:-.01em}
.gbtn-google:hover{border-color:var(--accent); background:var(--raise)}
.gbtn-google:disabled{opacity:.55}

.gb-or{display:flex; align-items:center; gap:10px; margin:16px 0 2px;
  font-size:11px; font-weight:700; color:var(--faint)}
.gb-or::before,.gb-or::after{content:''; flex:1; height:1px; background:var(--line)}

.gb-hint{font-weight:700; color:var(--faint); font-size:10.5px; margin-left:5px}
.gb-fine{font-size:11px; color:var(--faint); line-height:1.6; margin:9px 0 0}
.gb-ok{font-size:12px; color:var(--ok); font-weight:700; margin-top:11px; line-height:1.5}

/* 번호인증 — 보이지 않는 캡차가 자리를 차지하지 않도록 */
#recaptchaBox{height:0; overflow:hidden}

/* ── ‘이안에 픽!’ · 반영과목 태그 ─────────────────────────────────────── */
.badge.pick{background:var(--flip-soft); color:var(--flip); border:1px solid var(--flip-line);
  font-weight:800; letter-spacing:-.01em}
.badge.pick b{color:var(--risk); font-weight:900}
.light.flip .l .pk{color:var(--risk); font-weight:900}

/* 왜 유리한가 — 대학이 공개한 규칙에서만 뽑은 태그 */
.rtags{display:flex; flex-wrap:wrap; gap:5px; margin:9px 0 2px}
.rtag{font-size:12px; font-weight:700; color:var(--accent-ink); background:var(--accent-soft);
  border:1px solid var(--line); border-radius:999px; padding:3px 9px; white-space:nowrap}

/* 유리한 대학 카드 — 한 줄 요약 */
.gline{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:10px;
  padding:10px 12px; background:var(--sunk); border-radius:10px}
.gline .was{font-size:12px; color:var(--faint)}
.gline .was b{font-size:15px; color:var(--soft); font-variant-numeric:tabular-nums}
.gline .ar{color:var(--flip); font-weight:800}
.gline .now{font-size:12px; color:var(--soft)}
.gline .now b{font-size:19px; color:var(--flip); font-variant-numeric:tabular-nums; letter-spacing:-.02em}

/* 상세 — 픽 안내 상자 */
.pickbox{background:var(--flip-soft); border:1px solid var(--flip-line); border-radius:12px;
  padding:13px 15px; margin-bottom:12px}
.pb-t{font-size:14px; font-weight:800; color:var(--flip); margin-bottom:5px}
.pb-t b{color:var(--risk); font-weight:900}
.pb-s{font-size:12.5px; color:var(--soft); line-height:1.7}

/* 상세 — 올해(2027) 바뀐 점. 작년값과 나란히 보여준다 */
.chgbox{background:var(--risk-soft); border:1px solid var(--risk); border-radius:12px;
  padding:13px 15px; margin-bottom:12px}
.cb-t{font-size:16px; font-weight:800; color:var(--risk); margin-bottom:6px}
.cb-warn{font-size:14px; color:var(--ink); line-height:1.7; margin-bottom:9px}
.cb-row{font-size:14px; color:var(--ink); line-height:1.75; margin-top:7px}
.cb-k{display:inline-block; font-size:12.5px; font-weight:800; color:var(--risk);
  background:var(--surface); border-radius:6px; padding:2px 7px; margin-right:7px; vertical-align:1px}
.cb-old{color:var(--soft)}
.cb-old .cb-k{color:var(--faint)}
.cb-src{font-size:12.5px; color:var(--faint); line-height:1.6; margin-top:9px}
.badge.chg{color:var(--risk); background:var(--risk-soft); border-color:transparent;
  cursor:help; font-weight:800; white-space:nowrap}

/* 🔴🔴 「작년 규칙 확인 안 됨」 — 원장 지시(2026-08-09 · 결정 「ㄴ」)
   「눌러 보지 않아도 보이게. 「더보기」 속에 묻어 두지 않는다」
   → 목록 줄·카드에서 **테두리까지 둘러** 다른 딱지보다 먼저 눈에 들어오게 한다. */
.badge.oldunk{color:var(--risk); background:var(--risk-soft); border-color:var(--risk);
  cursor:help; font-weight:800; white-space:nowrap}

/* 🔴🔴 상세(더보기) 맨 위 — 「작년 규칙을 확인하지 못했다」
   원장 지시(2026-08-09) — 「더보기」에도 **크게** 적는다. */
.unkbox{background:var(--risk-soft); border:2px solid var(--risk); border-radius:12px;
  padding:13px 15px; margin-bottom:12px}
.unk-t{font-size:15.5px; font-weight:800; color:var(--risk); margin-bottom:7px}
.unk-b{font-size:14px; color:var(--ink); line-height:1.75; margin-top:6px}
.unk-do{color:var(--risk); font-weight:800}
/* 🔴 원장 지시(2026-08-10) 「더보기에 들어가면 보이게 하자」 —
   그 대학에서 우리가 실제로 확인한 것. 겁주는 빨간 글이 아니라 **사실 기록**이라 색을 낮춘다. */
.unk-why{background:var(--surface); border:1px solid var(--line); border-radius:var(--r-sm);
  padding:9px 11px; margin-top:9px}
.unk-why-t{display:block; font-size:12.5px; font-weight:800; color:var(--soft);
  letter-spacing:.2px; margin-bottom:4px}

/* 🔴 작년·올해 규칙이 다른 곳 — 두 값을 다 보여 준다(판정은 컷과 같은 해 규칙 값 하나로)
   원장 결정 2026-08-03: 「두 값 다 보여주자. 그래야 헷갈리지 않지.」 */
.oybox{background:var(--warn-soft); border:1px solid var(--warn); border-radius:12px;
  padding:13px 15px; margin-bottom:12px}
.oy-t{font-size:15.5px; font-weight:800; color:var(--warn); margin-bottom:7px}
.oy-row{font-size:14px; color:var(--ink); line-height:1.75; margin-top:6px}
.oy-row .num{font-variant-numeric:tabular-nums}
.oy-warn{color:var(--risk)}
.oybox .faint{color:var(--faint); font-size:12.5px}
.oy-k{display:inline-block; font-size:12.5px; font-weight:800; color:var(--warn);
  background:var(--surface); border-radius:6px; padding:2px 7px; margin-right:7px; vertical-align:1px}
.oy-was{color:var(--soft); text-decoration:line-through}
.oy-ar{color:var(--faint); margin:0 6px}
.oy-up{color:var(--ok); font-weight:800}       /* 올해 규칙이 유리 */
.oy-down{color:var(--risk); font-weight:800}   /* 올해 규칙이 불리 */

/* 🔴 올해 늘어난 교과 · 빠진 교과 — **색으로 한눈에** (원장 지시 2026-08-07)
   「확인하세요」라고만 하면 이용자가 긴 글 두 줄을 눈으로 견줘야 한다. 그러지 않게 한다. */
.oy-sub{background:var(--surface); border-radius:10px; padding:10px 12px; margin:8px 0 4px}
.oy-srow{font-size:14px; line-height:2.1; margin-bottom:3px}
.oy-sk{display:inline-block; font-size:12.5px; font-weight:800; border-radius:6px;
  padding:2px 8px; margin-right:8px; vertical-align:1px}
.oy-sk.add{color:var(--ok); background:var(--ok-soft)}
.oy-sk.del{color:var(--risk); background:var(--risk-soft)}
.subj-add{display:inline-block; font-size:14.5px; font-weight:800; color:#fff;
  background:var(--ok); border-radius:7px; padding:2px 10px; margin-right:6px}
.subj-del{display:inline-block; font-size:14.5px; font-weight:800; color:#fff;
  background:var(--risk); border-radius:7px; padding:2px 10px; margin-right:6px;
  text-decoration:line-through}
.oy-snote{font-size:12.5px; color:var(--soft); line-height:1.7; margin-top:6px}

/* 목록 딱지 — 올해 규칙으로 내 등급이 어느 쪽으로 움직이나(판정은 안 바꾼다) */
.badge.oy{cursor:help; font-weight:800; white-space:nowrap; border-color:transparent}
.badge.oy.up{color:var(--ok); background:var(--ok-soft)}
.badge.oy.down{color:var(--risk); background:var(--risk-soft)}

/* 「올해 바뀐 곳」 화면 — 이 화면이 무엇인지 먼저 밝힌다
   🔴 원장 지시(2026-08-11 · 61차) — 전에는 **노란 경고 바탕 + 노란 제목 + 빨간 글씨**였다.
      내용은 「이 화면이 왜 쓸모 있나」인데 **차림새가 경고**라 겁을 먼저 줬다.
      → 담담한 안내 상자로 바꾼다(파란 계열). 글자 크기는 그대로 둔다(줄이지 않는다). */
.chgi{background:var(--accent-soft); border:1px solid var(--flip-line); border-radius:12px;
  padding:14px 16px; margin:12px 0 10px}
.chgi-t{font-size:16px; font-weight:800; color:var(--accent-ink); margin-bottom:7px}
.chgi p{font-size:14px; color:var(--ink); line-height:1.75; margin:6px 0}
.chgi-l{margin:8px 0 8px 18px; padding:0}
.chgi-l li{font-size:14px; color:var(--ink); line-height:1.8; margin:4px 0}
/* 자세한 것은 접어 둔다 — **지운 말은 없다.** 눌러야 보일 뿐이다(모양은 `.foldy` 한 곳에서) */
.chgi-w{color:var(--soft); margin-top:6px}
.chgk{display:flex; flex-wrap:wrap; gap:6px; margin:0 0 10px}
.chgb{border:1px solid var(--line); background:var(--surface); color:var(--soft);
  border-radius:999px; padding:7px 13px; font-size:12.5px; font-weight:700; cursor:pointer}
.chgb.on{border-color:var(--accent); background:var(--accent-soft); color:var(--accent-ink)}
@media (max-width:640px){ .chgi{padding:12px 13px} .chgi p,.chgi-l li{font-size:13.5px} }

/* 🟢 정확 비교 — 이 대학 산출식 그대로 계산해 대학 공개 점수컷과 직접 견준 것 */
.badge.exact{color:var(--ok); background:var(--ok-soft); border:1px solid var(--ok);
  cursor:help; font-weight:800; white-space:nowrap}
.exbox{background:var(--ok-soft); border:1.5px solid var(--ok); border-radius:12px;
  padding:14px 16px; margin:0 0 12px}
.exbox.off{background:var(--sunk); border:1px solid var(--line2)}
/* 🔴 부분 정확비교 — 대학이 「교과 점수」만 따로 공개한 곳.
   요강 그대로 계산한 값이지만 **전형 총점이 아니다** → 초록(다 됐다)이 아니라 주의색으로 구별한다 */
.badge.exact.part{color:var(--warn); background:var(--warn-soft); border-color:var(--warn)}
.exbox.part{background:var(--warn-soft); border-color:var(--warn)}
.exbox.part .ex-tag{color:var(--warn); border-color:var(--warn)}
.ex-part{background:var(--surface); border:1px solid var(--warn); border-radius:9px;
  padding:11px 13px; margin:0 0 10px; font-size:13.5px; color:var(--ink);
  line-height:1.75; word-break:keep-all}
.ex-t{font-size:14.5px; font-weight:800; color:var(--ink); margin-bottom:8px}
.ex-tag{display:inline-block; font-size:11.5px; font-weight:800; color:var(--ok);
  background:var(--surface); border:1px solid var(--ok); border-radius:999px; padding:1px 7px; margin-left:5px}
.ex-b{font-size:25px; font-weight:900; color:var(--ink); letter-spacing:-.01em; margin-bottom:9px}
.ex-b .ex-lab{font-size:13px; font-weight:800; color:var(--faint); letter-spacing:0; margin-right:5px}
.ex-b .ex-full{font-size:13.5px; font-weight:700; color:var(--faint); letter-spacing:0}
.ex-tb{width:100%; border-collapse:collapse; font-size:14px; margin:0 0 4px}
.ex-tb th{font-size:12px; font-weight:800; color:var(--faint); text-align:left;
  padding:4px 8px 4px 0; border-bottom:1px solid var(--line2); white-space:nowrap}
.ex-tb th:last-child, .ex-tb td:last-child{text-align:right; padding-right:0}
.ex-tb td{padding:5px 8px 5px 0; border-bottom:1px solid var(--line2); color:var(--ink)}
.ex-tb tr:last-child td{border-bottom:0}
.ex-up{color:var(--ok); font-weight:900}
.ex-down{color:var(--risk); font-weight:900}
.ex-warn{background:var(--risk-soft); border:1px solid var(--risk); border-radius:9px;
  padding:11px 13px; margin:8px 0 4px; font-size:13.5px; color:var(--ink); line-height:1.7; word-break:keep-all}
.ex-how{font-size:13.5px; color:var(--ink); line-height:1.75; margin-top:9px;
  padding-top:9px; border-top:1px solid var(--line2); word-break:keep-all}
.ex-k{display:block; font-size:12px; font-weight:800; color:var(--faint); margin-bottom:3px}
.ex-notes{font-size:13.5px; color:var(--ink); line-height:1.7; margin-top:9px; word-break:keep-all}
.ex-notes ul{margin:0; padding-left:17px}
.ex-notes li{margin:3px 0}
.ex-src{font-size:12.5px; color:var(--faint); line-height:1.6; margin-top:8px; word-break:keep-all}
.ex-s{font-size:13px; color:var(--faint); line-height:1.65; margin-top:8px; word-break:keep-all}

/* 이 대학 환산표로 본 내 점수(참고) */
.convbox{background:var(--sunk); border:1px solid var(--line2); border-radius:12px;
  padding:13px 15px; margin:0 0 12px}
.convbox.up{background:var(--ok-soft); border-color:var(--ok)}
.convbox.down{background:var(--warn-soft); border-color:var(--warn)}
.convbox.off{background:var(--sunk); border-color:var(--line2)}
.cv-t{font-size:14px; font-weight:800; color:var(--faint); margin-bottom:6px}
.cv-tag{display:inline-block; font-size:12px; font-weight:800; color:var(--faint);
  background:var(--surface); border:1px solid var(--line); border-radius:999px; padding:1px 7px; margin-left:5px}
/* 🔴 한 전형 안에서 모집단위마다 반영교과가 다를 때 밝히는 표시 (v90)
   그냥 첫 줄 값을 전체인 양 보여 주면 나머지 학과에 거짓이 된다 */
.varies{display:inline-block; font-size:12px; font-weight:700; color:var(--gold);
  background:var(--gold-soft); border:1px solid var(--gold-line); border-radius:8px;
  padding:4px 9px; margin:5px 0 2px; line-height:1.55; word-break:keep-all}
.varies b{color:var(--gold); font-weight:900}
.varn{display:inline-block; font-style:normal; font-size:10.5px; font-weight:700;
  color:var(--gold); margin-left:5px; letter-spacing:0}

/* 숫자를 보기 **전에** 무슨 값인지 알려 주는 한 줄 */
.cv-lead{font-size:13px; color:var(--soft); line-height:1.65; margin:0 0 9px; word-break:keep-all}
.cv-b{font-size:23px; font-weight:900; color:var(--ink); letter-spacing:-.01em}
.cv-b .cv-full{font-size:13.5px; font-weight:700; color:var(--faint); letter-spacing:0}
.cv-c{font-size:14px; color:var(--ink); line-height:1.7; margin-top:5px; word-break:keep-all}
.cv-up{color:var(--ok)} .cv-down{color:var(--risk)}
.cv-s{font-size:13px; color:var(--faint); line-height:1.65; margin-top:7px; word-break:keep-all}
/* 오해하기 쉬운 것은 접어 둔다 — 펼쳐 두면 상자가 글로 가득 차 정신없다 */
.cv-d{margin-top:9px; border-top:1px solid var(--line); padding-top:2px}
.cv-d>summary{list-style:none; cursor:pointer; font-size:12.5px; font-weight:800;
  color:var(--faint); padding:7px 0 1px; user-select:none}
.cv-d>summary::-webkit-details-marker{display:none}
.cv-d>summary:hover{color:var(--accent)}
.cv-d .cv-s:first-of-type{margin-top:4px}

/* 진로선택 */
.achhint{display:inline-block; font-weight:900; color:var(--accent);
  background:var(--accent-soft); border-radius:5px; padding:0 5px}
.jin-ok{font-weight:800; color:var(--ok)}
.usedline .uc.jinu{color:var(--accent); font-weight:800}
.jin-no{font-weight:800; color:var(--warn)}
/* 대학이 아예 반영하지 않는 곳 — 우리 값이 정확하다는 뜻이라 경고색을 쓰지 않는다 */
.jin-off{font-weight:800; color:var(--faint)}
.ucrow .jinm{font-style:normal; font-size:11px; font-weight:800; color:var(--accent);
  background:var(--accent-soft); border-radius:4px; padding:1px 4px; margin-left:3px}

/* 결과 위 안내 — 목록은 '작년 입결이 있는 전형' 기준이라는 사실 */
.lastyear{background:var(--gold-soft); border:1px solid var(--gold-line); border-radius:12px;
  padding:11px 14px; margin:0 0 12px; font-size:12.5px; color:var(--ink); line-height:1.8; word-break:keep-all}
.lastyear .badge.gone{font-size:10.5px; padding:2px 7px; vertical-align:1px}

/* 올해 새로 생긴 전형 — 작년 입결이 없어 비교는 못 하고 정보로만 보여준다 */
.ly-more{margin-top:9px}
.ly-more button{font-size:12px; font-weight:800; color:var(--gold); background:var(--surface);
  border:1px solid var(--gold-line); border-radius:999px; padding:5px 12px; cursor:pointer}
.ly-more button:hover{background:var(--raise)}
#newJeonBox{margin-top:11px; border-top:1px solid var(--gold-line); padding-top:11px}
.nj-head{font-size:12px; color:var(--soft); line-height:1.75; margin-bottom:11px}
.nj-none{font-size:12.5px; color:var(--faint)}
.nj-g{font-size:11px; font-weight:800; color:var(--faint); letter-spacing:.04em; margin:12px 0 5px}
.nj-i{background:var(--surface); border:1px solid var(--line2); border-radius:10px;
  padding:9px 12px; margin-bottom:7px}
.nj-t{font-size:12.5px; color:var(--ink); line-height:1.6; word-break:keep-all}
.nj-m{font-size:11.5px; color:var(--soft); line-height:1.6; margin-top:3px; word-break:keep-all}
.nj-s{font-size:11px; color:var(--faint); line-height:1.55; margin-top:4px; word-break:keep-all}
.badge.new{color:#fff; background:var(--accent); border-color:transparent; font-weight:800}

/* 목록·상세 — 올해 없어졌거나 개편된 전형 */
.badge.gone{color:#fff; background:var(--risk); border-color:transparent;
  cursor:help; font-weight:800; white-space:nowrap}
.gonebox{background:var(--risk-soft); border:1px solid var(--risk); border-radius:12px;
  padding:13px 15px; margin:0 0 12px}
.gb-t{font-size:15px; font-weight:800; color:var(--risk); margin-bottom:6px}
.gb-b{font-size:14.5px; color:var(--ink); line-height:1.8; word-break:keep-all}
.gb-s{font-size:12.5px; color:var(--faint); line-height:1.65; margin-top:8px}

/* 상세 — 2027 모집요강의 수능최저 원문. 우리가 충족판정을 하지 않는다는 걸 분명히 한다 */
.sm27{background:var(--gold-soft); border:1px solid var(--gold-line); border-radius:12px;
  padding:13px 15px; margin:0 0 12px}
.s27-t{font-size:15px; font-weight:800; color:var(--gold); margin-bottom:8px}
.s27-tag{display:inline-block; font-size:12px; font-weight:800; letter-spacing:.03em;
  color:var(--gold); background:var(--surface); border:1px solid var(--gold-line);
  border-radius:999px; padding:2px 8px; margin-left:6px; vertical-align:1px}
.s27-b{font-size:14.5px; color:var(--ink); line-height:1.8; white-space:pre-wrap; word-break:keep-all}
.s27-none{font-size:13px; font-weight:800; color:var(--ok)}
.s27-s{font-size:12.5px; color:var(--faint); line-height:1.6; margin-top:9px}

/* 상세 — 이 대학이 보는 교과 */
.reflect{background:var(--sunk); border-radius:12px; padding:13px 15px; margin-bottom:12px}
.rf-t{font-size:12.5px; font-weight:800; color:var(--faint); margin-bottom:9px}
.rf-l{display:flex; flex-wrap:wrap; gap:6px}
.rsub{font-size:13px; font-weight:700; color:var(--ink); background:var(--surface);
  border:1px solid var(--line); border-radius:8px; padding:5px 10px; font-variant-numeric:tabular-nums}
.rsub b{color:var(--accent)}
.rsub.off{color:var(--faint); text-decoration:line-through; opacity:.5; background:transparent}
.rsub.off b{color:var(--faint)}
.rf-n{font-size:12.5px; color:var(--soft); line-height:1.65; margin-top:9px}
.rf-n.faint{color:var(--faint)}

/* ── 회원관리 (원장님 전용) ───────────────────────────────────────────── */
.pwrap.wide{max-width:1180px}
.adm-bar{display:flex; align-items:center; gap:9px; margin:18px 0 12px}
.adm-bar .fld{flex:1; max-width:520px}
.adm-msg{font-size:12.5px; font-weight:700; margin:0 0 10px; min-height:18px; color:var(--ok)}
.adm-msg.bad{color:var(--risk)}
table.adm-tbl td{vertical-align:middle; padding:11px 10px; font-size:12.5px}
table.adm-tbl .em{font-weight:700; word-break:break-all}
table.adm-tbl .uid{font-size:10px; color:var(--faint)}
table.adm-tbl .ph{font-variant-numeric:tabular-nums; font-weight:700}
table.adm-tbl .ph.none{color:var(--risk); font-weight:700}
table.adm-tbl select.fld{padding:6px 7px; font-size:12px; width:100%}
.pt-now{font-weight:800; font-variant-numeric:tabular-nums}
.pt-row{display:flex; gap:4px; margin-top:5px}
.pt-row .fld{padding:5px 6px; font-size:11.5px; width:66px; text-align:right}
.mini{border:1px solid var(--line); background:var(--raise); color:var(--soft);
  border-radius:6px; padding:5px 8px; font-size:11px; font-weight:700; white-space:nowrap}
.mini:hover{border-color:var(--accent); color:var(--accent)}
.mini.warn:hover{border-color:var(--risk); color:var(--risk)}
/* 🔴 되돌릴 수 없는 단추(성적표 지우기) — 눈에 띄게 해서 잘못 누르지 않게 한다 */
.mini.danger{border-color:var(--risk); color:var(--risk); font-weight:800}
.mini.danger:hover{background:var(--risk); color:#fff}
.refbadge{display:inline-block; background:var(--flip-soft); color:var(--flip);
  border-radius:5px; padding:2px 6px; font-size:10.5px; font-weight:800; letter-spacing:.06em}
.reffrom{font-size:10.5px; color:var(--faint); margin-top:4px; word-break:break-all}
/* 회원관리 — 성적 잠금 상태 */
.gr-lock{font-size:12px; font-weight:800; color:var(--risk)}
.gr-open{font-size:12px; font-weight:800; color:var(--ok)}
.gr-no{font-size:12px; color:var(--faint)}
.gr-n{font-size:10.5px; color:var(--faint); margin-top:3px}
.shp{margin-bottom:7px}
.shp:last-child{margin-bottom:0}
.shp-n{display:block; font-size:10.5px; font-weight:700; color:var(--faint); margin-bottom:3px}
.ledger{background:var(--sunk); font-size:11.5px}
.ledger .lg-row{display:flex; gap:10px; padding:4px 0; border-bottom:1px solid var(--line)}
.ledger .lg-row:last-child{border-bottom:0}
.ledger .lg-w{width:120px; color:var(--faint); font-variant-numeric:tabular-nums}
.ledger .lg-k{width:78px; font-weight:800}

/* ── 정밀 성적 입력 (전체 화면) ───────────────────────────────────────── */
/* 상단 메뉴(성적진단·요금제·이용안내…)는 항상 보이게 — 헤더 아래에서 시작한다 */
/* 🔴🔴 스크롤은 **하나뿐이다** (원장 지시 2026-08-08 — 「세로가 너무 작아 휠을 많이 돌려야 된다」).
   전에는 안쪽 상자(.ed-body)만 움직여서, 위(법 안내·안내문)와 아래(버튼 줄)에 낀
   **좁은 틈**에서만 과목이 오르내렸다. 이제 화면이 **통째로** 내려간다.
   🔴 대신 **저장·계산 버튼 줄만 아래 붙박이**로 남긴다 — 과목 40개를 넣고
      맨 아래까지 내려가야 저장이 되면 안 된다(지금 구조의 유일한 장점이라 반드시 지킨다).
   ⚠️ 스크롤 상자가 여기 하나이므로, 붙박이(`position:sticky`)를 쓰는 자리
      (.ed-jump · .ycol-h · .ed-foot)는 **모두 이 상자를 기준으로** 붙는다.
      그래서 .ycol 에 `overflow:hidden` 을 두면 안 된다(그 순간 학년 머리줄이 안 붙는다). */
.editor{position:fixed; inset:var(--topH) 0 0 0; z-index:50; background:var(--paper);
  display:flex; flex-direction:column; overflow-y:auto; overscroll-behavior:contain}
.ed-top{display:flex; align-items:center; gap:12px; padding:14px 22px; background:var(--surface);
  border-bottom:1px solid var(--line)}
.ed-top h2{margin:0; font-size:17px; font-weight:800; letter-spacing:-.02em}
.ed-note{font-size:11.5px; color:var(--faint); margin-top:3px}
/* 🔴 안내문 접기 — 매번 화면 위쪽을 통째로 먹어서 접어 둔다(원장 지시 2026-08-08).
   ⚠️ **법 안내(.ed-law)는 접지 않는다** — 가리면 알리는 뜻이 없다(검사기 ㉕가 막는다).
      접는 것은 📌 넣는 요령뿐이다. */
.ed-guide-t{display:inline-flex; align-items:center; gap:7px; margin-top:7px; padding:6px 11px;
  border:1px dashed var(--line); background:var(--raise); color:var(--soft);
  border-radius:9px; font-size:11.5px; font-weight:800}
.ed-guide-t:hover{border-color:var(--accent); color:var(--accent)}
.ed-guide-t .s{font-weight:600; color:var(--faint)}
.ed-guide-t.on{border-style:solid; border-color:var(--accent); color:var(--accent)}
/* 🔴 법 안내 — 눈에 띄되 겁주지 않게. 「우리만 그런 게 아니다」를 알리는 자리다(원장 지시 2026-08-05) */
.ed-law{font-size:11.5px; line-height:1.6; margin-top:6px; padding:8px 10px;
  border:1px solid var(--line); border-left:3px solid var(--accent);
  border-radius:6px; background:var(--accent-soft); color:var(--ink)}
/* 🔴 80차 — 첫 줄은 **한 눈에 들어와야 한다**(원장 지시 2026-08-19 —
   「기존꺼를 키운다고 사람들이 이해하진 못할것 같아」). 글씨만 키우지 않고 **줄을 나눈다**. */
.ed-law-hd{font-size:12.5px; font-weight:700; line-height:1.65; margin:0 0 6px;
  padding-bottom:6px; border-bottom:1px solid var(--line2)}
.ed-top .btn{padding:9px 15px; font-size:13px}
.ed-top>div:first-child{flex:1; min-width:0}
.ed-lock{font-size:11.5px; font-weight:800; color:var(--warn); background:var(--warn-soft);
  border-radius:8px; padding:7px 12px; white-space:nowrap}
.ed-tools{display:flex; align-items:center; gap:9px; flex-wrap:wrap; padding:11px 22px;
  background:var(--raise); border-bottom:1px solid var(--line2)}
.ed-tools .btn{padding:7px 13px; font-size:12.5px}
.ed-tools .grow{flex:1}
/* 🔴 안쪽 스크롤을 없앴다 — 페이지(.editor)가 통째로 내려간다 */
.ed-body{flex:0 0 auto; overflow:visible; padding:0 22px 18px}

/* 🔴 학년 바로가기 — 세로로 길어졌으니 ［1학년］［2학년］［3학년］로 건너뛴다.
   맨 위에 붙박이로 남아, 지금 어디 있든 다른 학년으로 바로 갈 수 있다. */
/* ⚠️ `.editor` 가 세로 flex 라 **줄들이 눌려 찌그러진다** — 특히 `overflow-x:auto` 를 가진 이 줄은
   최소 높이가 0 이 되어 실제로 **1px 로 납작해졌다**. `flex:0 0 auto` 로 못박는다. */
.ed-jump{position:sticky; top:0; z-index:8; flex:0 0 auto; display:flex; align-items:center; gap:7px;
  height:46px; box-sizing:border-box; padding:0 22px; overflow-x:auto; white-space:nowrap;
  background:var(--paper); border-bottom:1px solid var(--line2)}
.ed-top, .ed-tools, .ed-nice, .ed-foot{flex:0 0 auto}
.ed-jump .edj-l{font-size:11px; font-weight:800; color:var(--faint); flex:0 0 auto}
.ed-jump .edj{flex:0 0 auto; border:1px solid var(--line); background:var(--surface); color:var(--soft);
  border-radius:999px; padding:6px 13px; font-size:12px; font-weight:800}
.ed-jump .edj:hover{border-color:var(--accent); color:var(--accent)}
.ed-jump .edj b{color:var(--ink); font-weight:800}
.ed-jump .edj.warn{border-color:var(--warn); color:var(--warn)}
table.edtbl{width:100%; max-width:1000px; margin:14px auto 30px; border-collapse:separate; border-spacing:0}
table.edtbl th{position:sticky; top:0; z-index:2; background:var(--paper); color:var(--faint);
  font-size:11px; font-weight:800; text-align:left; padding:10px 10px; border-bottom:1px solid var(--line)}
table.edtbl th .opt{font-weight:600; opacity:.7}
table.edtbl td{padding:5px 6px; border-bottom:1px solid var(--line2)}
table.edtbl td .fld{padding:9px 10px; font-size:14px}
table.edtbl td .fld.mid{text-align:center}
table.edtbl .del{background:transparent; border:0; color:var(--faint); font-size:18px; padding:6px 8px; border-radius:7px}
table.edtbl .del:hover{color:var(--risk); background:var(--risk-soft)}
table.edtbl tr.locked .fld{background:var(--sunk); color:var(--soft); pointer-events:none}
/* 학년 구역 — 학년마다 띄워서 눈으로 구분되게 */
table.edtbl tr.yhead td{padding:0; border-bottom:0}
.yh{display:flex; align-items:center; gap:10px; padding:10px 12px; margin-top:6px;
  background:var(--accent-soft); border:1px solid var(--line); border-radius:10px 10px 0 0}
.yh-t{font-size:13.5px; font-weight:800; color:var(--accent-ink)}
:root[data-theme="dark"] .yh-t{color:var(--accent)}
.yh-s{font-size:11.5px; color:var(--soft); font-weight:700}
.yh-s b{color:var(--ink)}
.yh-add{margin-left:auto; border:1px solid var(--accent); background:var(--surface); color:var(--accent);
  border-radius:8px; padding:6px 12px; font-size:11.5px; font-weight:800; white-space:nowrap}
.yh-add:hover{background:var(--accent); color:#fff}
:root[data-theme="dark"] .yh-add:hover{color:#0f1116}
table.edtbl tr.yempty td{padding:14px 14px; color:var(--faint); font-size:12.5px;
  background:var(--surface); border-bottom:0}
table.edtbl tr.yempty td b{color:var(--accent)}
table.edtbl tr.ygap td{height:22px; border-bottom:0; padding:0}
.ed-empty{text-align:center; color:var(--faint); font-size:13px; padding:40px 0; line-height:1.8}
/* 🔴🔴 저장·계산 줄만 **아래 붙박이**다 — 과목을 아무리 많이 넣어도 저장이 늘 손 닿는 곳에 있다.
   `margin-top:auto` 는 성적이 적어 화면이 안 넘칠 때도 줄을 맨 아래에 붙여 둔다. */
.ed-foot{position:sticky; bottom:0; z-index:7; margin-top:auto;
  display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:14px;
  padding:14px 22px; background:var(--surface); border-top:1px solid var(--line);
  box-shadow:0 -6px 18px rgba(0,0,0,.06)}
:root[data-theme="dark"] .ed-foot{box-shadow:0 -6px 18px rgba(0,0,0,.35)}
.ed-act{display:flex; gap:10px; justify-self:center}
.ed-act .btn{padding:12px 26px; font-size:14px; font-weight:800}
/* 🔴 좁은 화면 — 발밑 줄이 **붙박이**가 되었으니 최대한 납작해야 한다.
   전에는 요약 딱지가 두 줄로 접히고 버튼이 위아래로 쌓여 화면의 40%를 먹었다.
   → 요약은 **한 줄로 옆으로 밀어** 보고, 버튼은 **나란히** 둔다. */
@media (max-width:760px){
  .ed-foot{grid-template-columns:1fr; text-align:center; gap:9px; padding:10px 14px}
  .ed-act{width:100%}
  .ed-act .btn{flex:1; padding:12px 10px; font-size:13.5px}
  /* ⚠️ `.ed-sum` 규칙이 이 미디어쿼리 **뒤에** 또 나온다 — 같은 세기면 뒤가 이긴다.
     그래서 `.ed-foot` 를 앞에 붙여 세기를 한 칸 올린다(안 그러면 접힘이 안 풀린다). */
  .ed-foot .ed-sum{flex-wrap:nowrap; overflow-x:auto; justify-content:flex-start; padding-bottom:2px}
  .ed-foot .ed-sum span{flex:0 0 auto}
}
.ed-sum{display:flex; gap:7px; flex-wrap:wrap; font-size:11.5px; min-width:0}
.ed-sum span{background:var(--raise); border:1px solid var(--line2); border-radius:7px;
  padding:5px 10px; font-weight:700; color:var(--soft)}
.ed-sum span b{color:var(--ink)}
.ed-msg{justify-self:end; text-align:right; font-size:12px; font-weight:700}
.ed-msg.ok{color:var(--ok)} .ed-msg.err{color:var(--risk)}

/* 🔴 성적표 이름 — 발밑 줄 맨 위에 한 줄로 깔린다(성적표를 고른 사람에게만 보인다) */
.ed-name{grid-column:1 / -1; display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  padding:9px 12px; margin-bottom:2px; border:1px solid var(--line2); border-radius:10px;
  background:var(--raise)}
.ed-name .edn-l{font-size:12px; font-weight:800; color:var(--soft); white-space:nowrap}
.ed-name .edn-l i{font-style:normal; font-weight:600; color:var(--faint)}
.ed-name .fld{flex:1 1 200px; min-width:0; max-width:340px}
.ed-name .edn-h2{font-size:11.5px; color:var(--faint); min-width:0}
@media (max-width:760px){ .ed-name{text-align:left} .ed-name .fld{max-width:none} }

/* 🔴🔴 관리자 전용 — 나이스 학생부 PDF 불러오기 (일반 이용자에게는 아예 안 보인다) */
.ed-nice{margin:0 22px 10px; padding:11px 13px; border:1px dashed var(--line2);
  border-radius:12px; background:var(--raise)}
.ed-nice .edn-h{font-size:12.5px; font-weight:800; color:var(--soft)}
.ed-nice .edn-h .edn-s{margin-left:8px; font-size:11px; font-weight:700; color:var(--faint)}
.ed-nice .edn-w{margin-top:6px; font-size:11.5px; line-height:1.7; color:var(--soft)}
.ed-nice .edn-b{display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-top:8px}
.ed-nice .edn-n{flex:1 1 320px; min-width:0; font-size:11.5px; line-height:1.7; color:var(--faint)}
.ed-nice .edn-msg{margin-top:7px; font-size:12px; font-weight:700; line-height:1.6}
.ed-nice .edn-msg.ok{color:var(--ok)} .ed-nice .edn-msg.err{color:var(--risk)}
@media (max-width:760px){ .ed-nice{margin:0 14px 10px} }
@media (max-width:760px){
  .ed-top{padding:12px 14px; flex-wrap:wrap} .ed-tools{padding:10px 14px} .ed-body{padding:0 10px}
  .ed-top h2{font-size:15px}
  table.edtbl th:nth-child(3), table.edtbl td:nth-child(3){display:none}   /* 과목명은 좁은 화면에서 숨김 */
  .ed-foot{padding:11px 14px}
}

/* ── 계산 중 ──────────────────────────────────────────────────────────── */
/* 결과 영역을 흐리게 하고 위에 표시를 띄운다 — 지금 다시 계산 중임을 분명히 알린다 */
.calcwrap{position:relative}
.calcwrap.busy>.card, .calcwrap.busy>.discline{opacity:.32; pointer-events:none}
.calcwrap>.card, .calcwrap>.discline{transition:opacity .15s}
.calcnow{position:sticky; top:70px; z-index:40; display:none; justify-content:center; margin-bottom:-40px}
.calcwrap.busy>.calcnow{display:flex}
.calcnow span{
  display:inline-flex; align-items:center; gap:9px; background:var(--accent); color:#fff;
  border-radius:999px; padding:9px 18px; font-size:12.5px; font-weight:800;
  box-shadow:0 6px 20px -6px rgba(0,0,0,.35);
}
.calcnow .sp{
  width:14px; height:14px; border:2px solid rgba(255,255,255,.45); border-top-color:#fff;
  border-radius:50%; animation:sp .7s linear infinite;
}
/* 결과가 새로 오면 잠깐 반짝여 "바뀌었다"를 알린다 */
@keyframes flashin{from{background:var(--flip-soft)} to{background:var(--surface)}}
.flashed{animation:flashin .9s ease-out}

/* ── 로딩 ─────────────────────────────────────────────────────────────── */
.boot{display:grid; place-items:center; height:60vh; gap:12px; color:var(--faint); font-size:13px}
.spin{width:26px;height:26px;border:2.5px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:sp .8s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}

/* ── 좁은 화면 ─────────────────────────────────────────────────────────── */
@media (max-width:1100px){
  .shell{grid-template-columns:1fr; padding:14px}
  .side{position:static; max-height:none; overflow:visible}
  .summary{grid-template-columns:1fr; gap:12px}
}
@media (max-width:820px){
  .lights{grid-template-columns:repeat(2,1fr)}
  .summary{flex-direction:column; align-items:stretch; gap:14px}
  .myg{justify-content:center}
  .cards{grid-template-columns:1fr; padding:12px}
}
@media (max-width:1280px){ .tag.hide-m{display:none} }
@media (max-width:980px){
  .nav button{padding:7px 9px; font-size:12px}
}
@media (max-width:640px){
  /* 🔴 메뉴가 아랫줄로 내려가므로 상단 바가 **두 줄**이다 — 높이를 그만큼 잡는다.
        `.editor`(정밀 입력 창)도 이 변수를 보고 붙으므로 여기만 고치면 따라온다. */
  :root{--topH:88px}
  .top{padding:0 10px; gap:6px; height:var(--topH); overflow-x:auto}
  .pwrap{padding:24px 14px 50px} .ptitle{font-size:23px}
  .plan{padding:22px 18px}
  .top .meta .tag{display:none}
  .brand{font-size:15px} .brand small{display:none}
  /* 🔴 폰 화면(375px)에서 상단 바가 「이안에 입 / 시」, 「로그 / 인」처럼 글자가 잘려 줄바꿈됐다.
        게다가 바 전체가 가로로 밀리는 구조라 **[로그인] 단추가 화면 밖으로 나가** 보이지 않았다.
        → 글자는 줄바꿈 금지, 미는 것은 **가운데 메뉴만**, 브랜드와 로그인은 항상 보이게 고정한다. */
  /* 🔴🔴 폰에서는 **메뉴를 아랫줄로 내린다**(61차 · 원장 지시 「다 고쳐」).
        한 줄에 이름·메뉴·로그인을 다 넣으면 메뉴가 쓸 수 있는 폭이 210px 뿐이라
        일곱 개 중 **「논술」·「못 하는 것」이 화면 밖으로 나갔다.**
        아랫줄로 내리면 폭이 통째로 355px 이 되어 **일곱 개가 다 들어간다.**
        (로그인해서 메뉴가 더 늘면 그때는 `navHint()` 의 흐림이 옆으로 더 있다고 알린다) */
  .top{overflow:visible; flex-wrap:wrap; align-content:center; row-gap:0}
  .brand,.top .meta,.top .meta>*{white-space:nowrap}
  .brand{order:1; flex:0 0 auto}
  .top .meta{order:2; flex:0 0 auto; flex-wrap:nowrap; gap:6px; margin-left:auto}
  .nav{order:3; flex:1 0 100%; width:100%; min-width:0;
       overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch}
  .nav::-webkit-scrollbar{display:none}
  .nav button{flex:0 0 auto; white-space:nowrap}
  /* 요금제 배지는 폰에서 자리를 너무 먹는다 — 요금제는 '내 정보'에서 본다 */
  .top .meta .plantag{display:none}
  /* 폰에서는 이메일 주소까지 넣을 자리가 없다 — 계정은 '내 정보'에서 본다 */
  .acct .em{display:none}
  /* 🔴 폰에서 메뉴가 잘려 보이던 것을 고친다(2026-08-02, 원장님 지시로 「글자 줄임」).
        ⚠️ **그때는 손님 메뉴가 4개라 이 줄임만으로 다 들어갔다.**
           그 뒤 「대학 목록·논술·못 하는 것」이 늘어 **7개**가 되면서 다시 잘렸다
           — 375px 에서 메뉴가 쓸 수 있는 폭은 210px 뿐인데 필요한 폭이 347px 였다.
           `navHint()` 의 흐림만으로는 「논술」이 있는 줄도 몰랐다(61차 · 원장님 지적). */
  .nav button{padding:7px 6px; font-size:11.5px; letter-spacing:-.02em}
  /* [관리자] 딱지도 폰에서는 자리를 먹는다 — 「회원관리」 메뉴가 보이면 관리자인 것을 안다 */
  .top .meta .adm{display:none}
  .shell{padding:12px 12px 48px; gap:12px}
  .card>.bd{padding:12px}
  .card>.hd{padding:11px 13px}
  .myg .v{font-size:30px}
  .light{padding:9px 8px} .light .n{font-size:19px} .light .l{font-size:11.5px}
  .tabs button{padding:10px 12px; font-size:13px}
  .toolbar{padding:10px 12px}
  .toolbar #sortSel{flex:1; min-width:0}
  .drawer .panel{width:100%}
  .dl{grid-template-columns:84px 1fr; font-size:12px}
  .dhead,.drow{grid-template-columns:56px 1fr 44px 40px 22px}
}

/* ── 정밀 입력 — 학년을 **세로로** 잇는다 ───────────────────────────────
   🔴 원장 결정(2026-08-08) — 1학년 전부 → 2학년 전부 → 3학년 전부.
      · 학생부가 그 순서라 **옮겨 적을 때 눈이 좌우로 안 움직인다**(가장 큰 까닭)
      · 학년마다 과목 수가 달라서(예: 22·30·22) 가로 3칸이면 한 칸만 길고 나머지는 빈다
      · 폰과 PC 모양이 같아진다 — 좁은 화면에서 과목명을 숨기지 않아도 된다 */
/* 🔴🔴 90차 — **학년을 나란히 세 칸**으로(원장 지시 2026-08-23).
   원장님 말씀 — 「가로가 너무 넓어 좌우로 빈공간이 많아서 잘 쓰면 넣기 편하게 해줄 수 있을것같아」.
   🔴 좁은 화면(1000px 아래)에서는 **한 칸으로 되돌린다** — 세 칸을 우겨넣으면 못 쓴다. */
.ycols{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; align-items:start;
  max-width:1400px; margin:0 auto}
@media (max-width:1000px){ .ycols{grid-template-columns:1fr; max-width:1000px} }
.ysemwrap{grid-column:1/-1}
/* ⚠️ `overflow:hidden` 을 두면 안 된다 — 학년 머리줄(.ycol-h) 붙박이가 죽는다.
   모서리는 머리줄에 따로 둥글게 준다. */
.ycol{background:var(--surface); border:1px solid var(--line); border-radius:14px;
  box-shadow:var(--shadow)}
.ycol.wide{grid-column:1/-1}
/* 🔴 90차 — **출결·학년 미지정은 세 칸을 다 쓴다**(학년 칸 하나에 끼면 글이 다 잘린다) */
.ycol.att{grid-column:1/-1}
/* 🔴 세로로 길어졌으니 **지금 어느 학년인지** 머리줄이 위에 붙어 따라온다
   (바로가기 줄 46px 바로 아래에 선다) */
.ycol-h{position:sticky; top:46px; z-index:5;
  display:flex; align-items:center; gap:8px; padding:11px 14px;
  border-bottom:1px solid var(--line2); background:var(--raise); border-radius:13px 13px 0 0}
.ycol-h .t{font-size:14px; font-weight:800; letter-spacing:-.02em}
.ycol-h .s{margin-left:auto; font-size:11px; color:var(--faint); font-weight:700}
.ycol-h .s b{color:var(--ink)}
.ycol-b{padding:8px 10px 12px}
/* 🔴🔴 90차 — **한 과목이 두 단**이다(원장 결정 · 시안 2).
   윗단(.r1) = 교과 · 등급 · 단위 · 삭제   |   아랫단(.r2) = 과목명 · 원점수 · 수강자 수 */
.ehead,.erow .r1{display:grid; grid-template-columns:minmax(0,1fr) 52px 46px 22px; gap:6px; align-items:center}
.ycol.wide .ehead,.ycol.wide .erow .r1{grid-template-columns:84px minmax(0,1fr) 52px 46px 22px}
.ehead{padding:2px 2px 6px; font-size:10.5px; font-weight:800; color:var(--faint)}
.ehead i{font-style:normal; font-weight:600}
.ehead span:nth-last-child(2),.ehead span:nth-last-child(3){text-align:center}
.erow{padding:5px 2px}
.erow + .erow{border-top:1px solid var(--line2)}
.erow .fld{padding:7px 7px; font-size:12.5px}
.erow .fld.mid{text-align:center; padding-left:2px; padding-right:2px}
/* 교과 고르는 칸만 왼쪽 맞춤 — 넓은 칸에서 가운데로 두면 무슨 칸인지 눈에 안 들어온다 */
.erow .fld.mid.subj{text-align:left; padding-left:8px}
/* 아랫단 — **선택 입력**이라 눈에 덜 띄게 둔다(점선·작은 글씨). 안 채워도 지금과 똑같이 돌아간다. */
.erow .r2{display:grid; grid-template-columns:minmax(0,1fr) 118px 44px; gap:5px; margin-top:4px; padding-right:28px}
.erow .r2 .fld{border-style:dashed; border-color:var(--line2); background:transparent;
  padding:4px 6px; font-size:10.5px; color:var(--soft); min-width:0}
.erow .r2 .fld:focus{border-style:solid; background:var(--surface)}
.erow .r2 .fld:not(:placeholder-shown){border-style:solid; border-color:var(--ok); background:var(--ok-soft); color:var(--ink)}
.erow .r2 .nmf{text-align:left}
.erow .r2 .su,.erow .r2 .rs{text-align:center}
/* 🔴 **원점수·수강자 칸은 접을 수 있다** — 「＋ 더 정확하게」 단추로 여닫는다(42차 · 원장 지시).
   🔴 90차부터 **기본이 펴 둔 것**이다(원장 결정) — 접어도 넣어 둔 값은 **그대로 남는다**. */
.fld.rs,.erow .r2 .su{display:none}
.ycols.raw .fld.rs,.ycols.raw .erow .r2 .su{display:block}
.ycols:not(.raw) .erow .r2{grid-template-columns:minmax(0,1fr)}
/* 🔴 진로선택 줄에서는 **접어 둔 것보다 세게** 감춘다 — 위 `.ycols.raw …` 가 class 다섯이라
   `.erow.jin …`(넷)보다 세다. 그대로 두면 진로선택 줄에 수강자 칸이 남아 줄이 두 단으로 접힌다. */
.ycols.raw .erow.jin .r2 .rs,.ycols.raw .erow.jin .r2 .su{display:none}
.qsemtog.raw.on{border-color:var(--ok); color:var(--ok); background:var(--ok-soft)}
/* 성취도 비율 칸 — **진로선택(A~E) 줄에서만** 보이고, 그때는 원점수·수강자를 감춘다
   (요강이 성취도 과목은 원점수·수강자 대상이 아니라고 못박았다). */
.erow .r2 .pct{display:none; text-align:center;
  background:var(--accent-soft); border-color:var(--accent); border-style:solid; color:var(--accent-ink)}
.erow.jin .r2{grid-template-columns:minmax(0,1fr) 142px}
.erow.jin .r2 .pct{display:block}
.erow.jin .r2 .rs,.erow.jin .r2 .su{display:none}
/* 🔴 90차 — **학기 탭**(학년 칸 안에서 1학기·2학기를 오간다). 3학년은 탭이 없다. */
.semtabs{display:flex; border-bottom:1px solid var(--line2)}
.semtabs .semtab{flex:1; border:0; background:transparent; padding:8px 0; font-size:12px;
  font-weight:700; color:var(--faint); border-bottom:2px solid transparent; cursor:pointer}
.semtabs .semtab.on{color:var(--accent); font-weight:800;
  border-bottom-color:var(--accent); background:var(--accent-soft)}
.semtabs .semtab i{font-style:normal; margin-left:4px; font-size:10px; font-weight:800;
  color:var(--ok); background:var(--ok-soft); border-radius:999px; padding:1px 5px}
/* 🔴 90차 — 3학년 2학기 탭에만 붙는 한 줄(원장 지시 — 길게 설명하거나 막지 않는다) */
.semnote{margin:0 0 8px; padding:8px 10px; font-size:11.5px; line-height:1.6;
  color:var(--gold); background:var(--gold-soft); border:1px solid var(--gold-line); border-radius:9px}
.semnote b{color:#6B4B0E}
/* 🔴 수강자 수 칸 — 등급 칸 **안에** 둔다(격자 칸 수를 바꾸지 않으려고). 2026-08-06 · 36차.
   **석차등급 줄에서만** 보인다(성취도 A~E 줄에서는 숨긴다 — 요강이 성취도 과목은 대상이 아니라 못박음).
   ⚠️ 선택 입력이라 눈에 덜 띄게 둔다 — 대부분 학생은 비워 두면 된다. */
.erow.locked .fld{background:var(--sunk); color:var(--soft); pointer-events:none}
.erow .del{border:0; background:none; color:var(--faint); font-size:15px; line-height:1; padding:0}
.erow .del:hover{color:var(--risk)}
/* ── 🔴🔴 출결 (2026-08-08 · 45차 · 원장 결정) ─────────────────────────
   학년마다 「미인정 결석·지각·조퇴·결과」 넷. 성적 칸과 **눈에 띄게 다르게** 둔다 —
   같은 표처럼 보이면 「과목 하나」로 오해한다. */
.ycol.att .ycol-h .t i.opt{font-style:normal; font-weight:600; font-size:11.5px; color:var(--faint)}
.atnote{margin:2px 2px 12px; font-size:11.5px; line-height:1.8; color:var(--faint)}
.atnote b{color:var(--soft)}
.atrow{display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:9px 2px}
.atrow + .atrow{border-top:1px solid var(--line2)}
.aty{flex:0 0 58px; font-size:13px; font-weight:800}
.atc{display:flex; align-items:center; gap:5px; flex:0 0 auto}
.atc .atl{font-size:11px; font-weight:700; color:var(--faint); white-space:nowrap}
.atc .fld{width:58px; padding:7px 6px; font-size:12.5px}
.atc .atu{font-size:11px; color:var(--faint)}
/* 넣은 칸은 눈에 보이게 — 「넣었는지 안 넣었는지」가 그 자체로 뜻이 있다(빈칸 ≠ 0) */
.atc .fld:not(:placeholder-shown){border-color:var(--ok); background:var(--ok-soft)}
@media (max-width:620px){
  .aty{flex:0 0 100%}
  .atc{flex:1 1 44%}
  .atc .fld{flex:1; width:auto; min-width:0}
}
.yempty{font-size:11.5px; color:var(--faint); padding:12px 4px}
.yadd{width:100%; margin-top:9px; border:1px dashed var(--line); background:var(--raise);
  color:var(--soft); border-radius:9px; padding:8px; font-size:12px; font-weight:700}
.yadd:hover{border-color:var(--accent); color:var(--accent)}
/* 「＋ 그 밖의 교과」 — 몇몇 대학만 보는 교과라 접어 둔다(안 배웠으면 비워 두면 된다) */
.yadd.more{margin-top:5px; padding:7px 8px; font-size:11.5px; color:var(--faint); text-align:left}
.yadd.more .hint{display:block; margin-top:2px; font-size:10.5px; font-weight:600;
  color:var(--faint); line-height:1.45; word-break:keep-all}
.yadd.more:hover .hint{color:var(--soft)}
/* 폰·좁은 화면 — 칸 너비를 줄인다(가로 3분할이던 시절 쓰던 값이 그대로 맞는다).
   🔴 **과목명은 이제 숨기지 않는다** — 세로로 이어 놓아 자리가 난다(원장 지시). */
@media (max-width:620px){
  /* 🔴 90차 — 두 단으로 바뀌어 **윗단만** 좁히면 된다(아랫단은 그대로 흐른다) */
  .ehead,.erow .r1{grid-template-columns:minmax(0,1fr) 50px 44px 22px; gap:5px}
  .ycol.wide .ehead,.ycol.wide .erow .r1{grid-template-columns:64px minmax(0,1fr) 50px 44px 22px}
  .erow .r2{grid-template-columns:minmax(0,1fr) 84px 42px; padding-right:26px}
  .ed-jump{padding:0 14px}
}

/* ── 잠긴 학교 — 이름은 서버가 안 보낸다. 자리만 흐릿하게 ─────────────── */
.lkrows{display:flex; flex-direction:column; gap:6px; margin-bottom:14px; text-align:left}
.lkrow{display:flex; align-items:center; gap:8px; padding:9px 12px; background:var(--surface);
  border:1px solid var(--line); border-radius:10px; border-left:4px solid var(--na)}
.lkrow.ok{border-left-color:var(--ok)} .lkrow.warn{border-left-color:var(--warn)}
.lkrow.risk{border-left-color:var(--risk)}
.lkrow .mask{font-size:13px; font-weight:800; color:var(--faint); letter-spacing:.06em;
  filter:blur(2.5px); user-select:none}
.lkrow .mask.sm{font-size:11.5px; font-weight:700; margin-left:auto; filter:blur(2px)}
.lkrow .lk{font-size:13px; opacity:.6; filter:none}
.lkmore{font-size:11.5px; color:var(--faint); font-weight:700; text-align:center; padding:4px}

/* 요금제 — 업그레이드 안내 */
.pl-up{font-size:12.5px; color:var(--accent-ink); line-height:1.65; background:var(--accent-soft);
  border:1px solid var(--gold-line); border-radius:10px; padding:10px 12px; margin:12px 0 4px}
.pl-up b{color:var(--accent-ink)}
.pl-up .up-n{color:var(--risk); font-weight:900; font-size:14px}
/* 왜 그 값인지(할인은 처음 결제 때만) — 한 줄 아래에 작게 */
.pl-up .pl-why{display:block; margin-top:6px; font-size:11.5px; color:var(--faint); line-height:1.6}

/* ── 이 대학이 실제로 쓴 내 과목 ──────────────────────────────────────── */
.usedline{display:flex; flex-wrap:wrap; gap:4px; margin-top:5px}
.uc{font-size:12px; font-weight:700; color:var(--soft); background:var(--sunk);
  border-radius:5px; padding:2px 6px; white-space:nowrap}
.uc b{color:var(--accent); margin-left:4px; font-variant-numeric:tabular-nums}
.uc.more{color:var(--faint); background:transparent}

/* 대학이 「부족분」을 9등급으로 채운 자리 — 값이 왜 나쁜지 반드시 밝힌다 */
.fillnote{background:var(--warn-soft); color:var(--warn); border-radius:10px;
  padding:10px 12px; margin:8px 0 12px; font-size:13px; font-weight:700; line-height:1.55}
.fillnote b{font-weight:900}

.usedbox{background:var(--sunk); border-radius:12px; padding:13px 15px; margin-bottom:12px}
.ub-t{font-size:13px; font-weight:800; color:var(--faint); margin-bottom:9px}
.ub-t b{color:var(--accent)}
.ub-t.off{margin-top:13px}
.ub-l{display:flex; flex-wrap:wrap; gap:5px}
.ucrow{display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:700;
  background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:4px 8px}
.ucrow i{font-style:normal; font-size:12px; color:var(--faint); font-weight:700}
.ucrow .nm{color:var(--ink)}
.ucrow b{color:var(--accent); font-variant-numeric:tabular-nums}
.ucrow em{font-style:normal; font-size:11px; color:var(--faint)}
.ucrow.off{opacity:.5; background:transparent; border-style:dashed}
.ucrow.off .nm{text-decoration:line-through}
.ucrow.off b{color:var(--faint)}

/* ── 내 정보 ─────────────────────────────────────────────────────────── */
.mecard{background:var(--surface); border:1px solid var(--line); border-radius:14px;
  box-shadow:var(--shadow); padding:20px 22px; margin-bottom:14px}
.mecard h3{margin:0 0 14px; font-size:15px; font-weight:800; letter-spacing:-.02em}
.mecard.danger{border-color:var(--risk-soft)}
.mecard.danger h3{color:var(--risk)}
.mecard.danger .btn{border-color:var(--risk); color:var(--risk)}
.mecard.danger .btn:hover{background:var(--risk-soft)}
.mefine{font-size:12px; color:var(--soft); line-height:1.75; margin:0 0 14px}
.mecode{font-size:26px; font-weight:800; letter-spacing:.14em; color:var(--flip);
  background:var(--flip-soft); border:1px solid var(--flip-line); border-radius:12px;
  padding:14px; text-align:center; margin-bottom:12px}
.megrid{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:12px}
.meyear{background:var(--sunk); border-radius:12px; padding:13px 15px}
.my-t{font-size:12.5px; font-weight:800; margin-bottom:9px}
.my-t span{font-weight:700; color:var(--faint); font-size:11px; margin-left:5px}
.my-l{display:flex; flex-wrap:wrap; gap:5px}

/* 요약 타일 — '유리한 대학'이라는 뜻을 함께 보여 준다 */
/* 🔴 원장 지시(61차) — 9.5px 은 폰에서 거의 안 읽힌다 → 11px */
.light.flip .l .l1{display:block; font-size:11px; font-weight:700; color:var(--faint); letter-spacing:0}

/* ── 면책 — 눈에 띄게 ─────────────────────────────────────────────────── */
.warn-red{color:var(--risk); font-weight:800}
.disc-more{border:1px solid var(--line); background:var(--surface); color:var(--soft);
  border-radius:7px; padding:3px 9px; font-size:11.5px; font-weight:700; margin-left:4px}
.disc-more:hover{border-color:var(--accent); color:var(--accent)}
.disc-big{font-size:15.5px; font-weight:800; color:var(--risk); line-height:1.75;
  margin:14px 0; padding:13px 15px; background:var(--risk-soft);
  border:1px solid var(--risk); border-radius:11px}
.disc-big u{text-decoration:underline; text-underline-offset:3px}
.disc-tail{font-size:13.5px; font-weight:800; color:var(--ink); margin:12px 0 0}

/* ── 면책 정리판 (v89) ────────────────────────────────────────────────
   왜 바꿨나: 빨간 상자가 **두 개**에 본문 굵은 글씨가 **일곱 개**라, 어디를 먼저
   봐야 할지 알 수 없었다(원장 지적 "문구도 강조도 좋은데 너무 정신없다").
   고친 방법 — 문구는 그대로 살리고 **강조만 한 곳으로 모았다**:
     · 빨강은 맨 위 상자 **하나뿐**. 꼭 읽어야 할 두 문장을 그 안에 함께 담는다
     · 나머지 설명은 굵게 하지 않고 **항목으로 쪼갠다**(제목만 굵게) */
.disc-warn{margin:12px 0 14px; padding:13px 15px; background:var(--risk-soft);
  border:1px solid var(--risk); border-radius:11px}
.disc-warn p{margin:0; font-size:14.5px; font-weight:800; color:var(--risk); line-height:1.7;
  word-break:keep-all}
.disc-warn p + p{margin-top:10px; padding-top:10px; border-top:1px dashed var(--risk)}
.disc-warn u{text-decoration:underline; text-underline-offset:3px}

/* 🔴 원장 지시(61차) — 12px 흐린 글씨라 읽기 힘들었다 → 13px · 색도 한 단계 진하게 */
.disc-list{margin:0; display:grid; grid-template-columns:auto 1fr; gap:7px 14px; align-items:baseline}
.disc-list dt{font-size:13px; font-weight:800; color:var(--soft); white-space:nowrap}
.disc-list dd{margin:0; font-size:13px; color:var(--soft); line-height:1.7; word-break:keep-all}
/* 다섯 항목을 접어 두는 상자 — ［자세히］ 단추가 이것을 편다(app.js `discMore`).
   모양은 `.foldy` 한 곳에서 정한다 */
.foldy>.disc-list{margin-top:8px}
@media (max-width:560px){
  /* 좁은 화면에서는 제목을 위에, 설명을 아래에 — 한 줄에 두 칸이면 글이 다 쪼개진다 */
  .disc-list{grid-template-columns:1fr; gap:2px}
  .disc-list dt{margin-top:9px}
  .disc-list dt:first-child{margin-top:0}
  .disc-warn p{font-size:13.5px}
}

/* 수능최저 — 있으면 눈에 띄게, 조건은 모집요강에서 확인하라고 분명히 */
.smw{display:inline-block; font-size:12px; font-weight:700; color:var(--gold);
  background:var(--gold-soft); border:1px solid var(--gold-line); border-radius:7px;
  padding:3px 7px; line-height:1.45}
.smw b{color:var(--gold); font-weight:900}
.smw i{display:block; font-style:normal; font-size:9.5px; font-weight:700; opacity:.85}
.smn{font-size:11.5px; color:var(--faint)}
.rulecell .rule{font-size:11px; color:var(--faint)}

/* 진로선택 — 대학마다 '어떻게' 넣는지가 달라 그 차이를 밝힌다 */
.jin-more{font-size:11.5px; color:var(--faint); line-height:1.65; margin-top:4px; word-break:keep-all}

/* 「전체 탐색」 → 「올해 바뀐 곳」으로 가는 안내 */
.chgtip{background:var(--warn-soft); border:1px solid var(--warn); border-radius:10px;
  padding:10px 13px; margin:10px 0 0; font-size:13.5px; color:var(--ink); line-height:1.7}
.chgtip-go{border:0; background:transparent; color:var(--accent-ink); font-weight:800;
  font-size:13.5px; cursor:pointer; padding:0 0 0 4px; text-decoration:underline}

/* ── 「우리가 어떻게 할 수 없는 것」 페이지 ───────────────────────────────── */
.limnote{background:var(--raise); border:1px solid var(--line); border-radius:12px;
  padding:14px 16px; margin:14px 0 18px}
.limnote p{margin:0 0 8px; font-size:12.5px; line-height:1.75; color:var(--soft); word-break:keep-all}
.limnote p:last-child{margin-bottom:0}
.limk{border:1px solid var(--line); border-radius:12px; padding:14px 16px; margin-bottom:12px;
  background:var(--surface)}
.limk-h{display:flex; align-items:baseline; gap:10px; flex-wrap:wrap}
.limk-h b{font-size:14.5px}
.limk-n{font-size:11.5px; font-weight:800; color:var(--accent);
  background:var(--accent-soft); border-radius:20px; padding:2px 9px}
.limk-w{margin:8px 0 0; font-size:12.5px; line-height:1.8; color:var(--soft); word-break:keep-all}
.limk-d{margin-top:10px}
.limk-d summary{cursor:pointer; font-size:12px; font-weight:800; color:var(--accent);
  list-style:none}
.limk-d summary::-webkit-details-marker{display:none}
.limk-b{margin-top:10px; display:grid; gap:9px}
.limu{border-top:1px solid var(--line2); padding-top:9px}
.limu-t{font-size:12.5px; font-weight:800}
.limu-n{font-size:10.5px; font-weight:700; color:var(--faint)}
.limu-w{margin-top:4px; font-size:11.5px; line-height:1.7; color:var(--faint); word-break:keep-all}

/* 🔴 가입 — 광고·이벤트 수신동의(선택). 체크박스가 눈에 띄되 「필수처럼」 보이면 안 된다 */
.gb-agree{display:flex;align-items:flex-start;gap:9px;margin:14px 0 6px;
  padding:11px 12px;border:1px solid var(--line);border-radius:10px;
  background:var(--sunk);cursor:pointer;font-size:13.5px;line-height:1.5}
.gb-agree input{margin-top:2px;width:17px;height:17px;flex:0 0 auto;cursor:pointer}
.gb-agree span{color:var(--ink)}
.gb-agree b{color:var(--accent)}

/* 🔴 내 정보 — 광고·이벤트 수신동의 켜고 끄기(언제든 철회) */
.hl-ad{display:flex;align-items:flex-start;gap:8px;margin-top:10px;
  font-size:12.5px;line-height:1.5;color:var(--faint);cursor:pointer}
.hl-ad input{margin-top:1px;width:16px;height:16px;flex:0 0 auto;cursor:pointer}
.hl-ad b{color:var(--ink)}

/* ── 🔴 대학 전체 목록 (원장 지시 2026-08-04) ────────────────────────────
   못 찾아주는 곳을 **빨간색**으로. 입결 값은 이 화면에 하나도 없다. */
.uc-tools{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:16px 0 10px}
.uc-tools .fld{flex:1 1 240px;margin:0}
.uc-only{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--faint);cursor:pointer;white-space:nowrap}
.uc-only input{width:16px;height:16px;cursor:pointer}
.uc-sum{font-size:12.5px;color:var(--faint);margin:0 0 14px;line-height:1.7}
.uc-sum b{color:var(--ink)}
.uc-f{color:var(--accent)}
b.uc-bad,.uc-bad{color:var(--risk)}
b.uc-nocut,.uc-nocut{color:var(--gold)}
b.uc-sc,.uc-sc{color:var(--accent)}

.uc-u{border:1px solid var(--line);border-radius:12px;background:var(--surface);margin-bottom:8px}
.uc-u.bad{border-color:var(--risk-soft)}
.uc-u>summary{display:flex;align-items:center;gap:9px;flex-wrap:wrap;
  padding:13px 15px;cursor:pointer;list-style:none}
.uc-u>summary::-webkit-details-marker{display:none}
/* 🏅 「이안에 대학순위」 번호 — 우리 입결로 우리가 정한 순서(원장 지시 2026-08-08).
   🔴 번호만 보인다. 「왜 이 자리인가」는 화면에 적지 않는다. */
.uc-rk{flex:0 0 auto; min-width:30px; text-align:right; font-size:12.5px; font-weight:800;
  color:var(--faint); font-variant-numeric:tabular-nums}
.uc-u.bad .uc-rk{color:var(--risk)}
.uc-rkn{margin-left:8px; font-size:11.5px; color:var(--faint); white-space:nowrap}
.uc-rkn b{color:var(--soft)}
.uc-ut{font-weight:800;font-size:14.5px}
.uc-u.bad .uc-ut{color:var(--risk)}
.uc-g{font-size:11px;color:var(--faint);border:1px solid var(--line);border-radius:999px;padding:1px 8px}
.uc-un{font-size:11.5px;color:var(--faint);margin-left:auto}
.uc-tag{font-size:11px;font-weight:800;border-radius:999px;padding:2px 9px;white-space:nowrap}
.uc-tag.bad{color:var(--risk);background:var(--risk-soft)}
.uc-tag.nocut{color:var(--gold);background:var(--gold-soft)}
/* 🔴 63차 — 등급 대신 **점수**로 공개된 곳. 「입결 없음」(금색 경고)과 **다른 색**이어야 한다 —
   같은 색이면 학생이 또 「없다」로 읽는다. 값이 있는 곳이므로 차분한 파랑을 쓴다. */
.uc-tag.sc{color:var(--accent);background:var(--accent-soft)}

.uc-jl{padding:0 12px 12px}
.uc-j{border-top:1px solid var(--line2)}
.uc-j>summary{display:block;padding:10px 4px;cursor:pointer;list-style:none}
.uc-j>summary::-webkit-details-marker{display:none}
.uc-jt{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px}
.uc-j.bad .uc-jt{color:var(--risk);font-weight:700}
.uc-jn{font-size:11.5px;color:var(--faint);margin-left:auto}
.uc-why{margin:0 4px 8px;padding:9px 11px;border-radius:9px;
  background:var(--risk-soft);color:var(--risk);font-size:12.5px;line-height:1.6}
/* 🔴 63차 — 「입결이 없는 까닭」은 **우리 잘못이 아니다**(대학이 안 낸 것).
   그래서 빨강(계산 못 함)이 아니라 「입결 없음」 딱지와 같은 금색으로 둔다. */
.uc-why.nocut{background:var(--gold-soft);color:var(--gold)}
/* 🔴 63차 — 「없다 = 가기 어렵다」로 읽히지 않게 붙이는 한 줄(원장 지시 2026-08-12) */
.uc-why-s{display:block;margin-top:5px;color:var(--soft);font-size:11.5px;line-height:1.6}
.uc-hs{display:flex;flex-wrap:wrap;gap:5px;padding:0 4px 10px}
.uc-h{font-size:11.5px;border:1px solid var(--line);border-radius:7px;padding:3px 8px;color:var(--ink)}
.uc-h.nocut{color:var(--gold);border-color:var(--gold-line);background:var(--gold-soft)}
.uc-h.sc{color:var(--accent);border-color:var(--accent);background:var(--accent-soft)}
.uc-h i{font-style:normal;font-size:10.5px;opacity:.85}

/* ── 🔴 되돌릴 수 없는 일 앞의 팝업 (원장 지시 2026-08-04) ──────────────────
   학교 열기 · 성적 저장이 **같은 팝업 하나**를 쓴다. */
.modal{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:18px}
.modal[hidden]{display:none}
.modal-back{position:absolute;inset:0;background:rgba(31,34,41,.55)}
.modal-box{position:relative;width:min(520px,100%);max-height:88vh;overflow:auto;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  box-shadow:var(--shadow);padding:22px 22px 18px}
.modal-t{margin:0 0 12px;font-size:19px;font-weight:800;letter-spacing:-.01em}
.ask-big{background:var(--accent-soft);border:1px solid var(--line);border-radius:var(--r-sm);
  padding:14px 16px;font-size:16px;line-height:1.6;text-align:center;margin-bottom:13px;color:var(--accent-ink)}
.ask-big[hidden]{display:none}
.ask-n{font-size:24px;font-weight:800;color:var(--accent)}
.ask-n.zero{color:var(--risk)}
.ask-all{font-size:16px;font-weight:700}
.ask-sm{font-size:13px;color:var(--soft);font-weight:600}
.ask-list{margin:0 0 14px;padding-left:20px;font-size:13.5px;line-height:1.75;color:var(--soft)}
.ask-list li{margin-bottom:5px}
.ask-list b{color:var(--ink)}
.modal-btns{display:flex;gap:9px;justify-content:flex-end;margin-top:14px}
body.modal-on{overflow:hidden}

/* 🔴 남은 자리를 늘 보이게 — 값은 서버가 센 것만 쓴다 */
.seatbar{margin:0 16px 14px;padding:9px 13px;border-radius:var(--r-sm);font-size:13px;
  background:var(--accent-soft);border:1px solid var(--line);color:var(--accent-ink)}
.seatbar[hidden]{display:none}
.seatbar.low{background:var(--warn-soft);border-color:var(--gold-line);color:var(--gold)}
.seatbar.none{background:var(--risk-soft);border-color:var(--risk-soft);color:var(--risk)}
.seatbar.all{background:var(--ok-soft);border-color:var(--ok-soft);color:#0F7A50}
.seatbar .sbz{font-size:11.5px;opacity:.8;font-weight:600}

/* 🔴 내 정보 — 내가 연 학교 */
.mo-card{border:1px solid var(--line);border-radius:var(--r-sm);padding:12px 14px;margin-bottom:9px;background:var(--raise)}
.mo-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px;font-size:13px}
.mo-p{font-size:11.5px;border:1px solid var(--line);border-radius:999px;padding:1px 9px;color:var(--soft)}
.mo-s{font-size:12px;color:var(--soft);margin-left:auto}
.mo-s.none{color:var(--risk)}
.mo-s.all{color:#0F7A50;font-weight:700}
.mo-b{font-size:11.5px;color:var(--gold);background:var(--gold-soft);border-radius:999px;padding:1px 9px}
.mo-l{margin:0;padding-left:22px;font-size:13px;line-height:1.9}
.mo-u{font-weight:700}
.mo-t{font-size:11.5px;color:var(--faint);margin-left:8px}

/* ── 🔴 관리자 — 회원 한 명 상세 ───────────────────────────────────────── */
.adm-detail{margin-top:18px;border:1px solid var(--line);border-radius:var(--r);
  background:var(--surface);box-shadow:var(--shadow);padding:18px 18px 20px}
.adm-detail[hidden]{display:none}
.ad-head{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.ad-head h3{margin:0;font-size:16px}
.ad-load{padding:22px;text-align:center;color:var(--faint)}
.ad-load.bad{color:var(--risk)}
.ad-msg{min-height:19px;font-size:13px;color:var(--accent);margin-bottom:8px}
.ad-msg.bad{color:var(--risk)}
.ad-dl{margin-bottom:6px}
.ad-yes{color:#0F7A50}
.ad-no{color:var(--faint)}
.ad-w{font-size:11.5px;color:var(--faint)}
.ad-fine{font-size:12px;color:var(--faint);margin:4px 0}
.ad-sub{font-size:12.5px;font-weight:800;color:var(--soft);margin:14px 0 7px;
  display:flex;align-items:center;gap:8px}
.ad-sub.big{font-size:14px;color:var(--ink);border-top:1px solid var(--line2);padding-top:14px}
.ad-sheet{border:1px solid var(--line);border-radius:var(--r-sm);padding:13px 14px;margin-bottom:11px;background:var(--raise)}
.ad-sh-h{display:flex;align-items:center;gap:7px;flex-wrap:wrap;font-size:13.5px;margin-bottom:9px}
.ad-tag{font-size:11px;border:1px solid var(--line);border-radius:999px;padding:1px 9px;color:var(--soft)}
.ad-tag.free{color:#0F7A50;border-color:var(--ok-soft);background:var(--ok-soft)}
.ad-tag.lock{color:var(--gold);border-color:var(--gold-line);background:var(--gold-soft)}
.ad-tag.refund{color:var(--risk);border-color:var(--risk-soft);background:var(--risk-soft)}
.ad-n{font-size:11.5px;color:var(--faint)}
.ad-seatrow{display:flex;align-items:center;gap:7px;flex-wrap:wrap;font-size:13px;
  background:var(--surface);border:1px solid var(--line2);border-radius:var(--r-sm);padding:8px 11px}
.ad-left{color:var(--accent)}
.ad-zero{color:var(--risk)}
.ad-all{color:#0F7A50}
.ad-bonus{font-size:11.5px;color:var(--gold)}
.ad-ol{margin:0;padding-left:22px;font-size:13px;line-height:2}
.ad-ol li{display:list-item}
.ad-u{font-weight:700}
.ad-ol .ad-w{margin:0 8px}
.ad-gr{width:100%;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px;
  line-height:1.7;border:1px solid var(--line);border-radius:var(--r-sm);padding:9px 11px;
  background:var(--surface);color:var(--ink);resize:vertical}
.ad-grh{font-size:11.5px;color:var(--faint);margin:5px 0 7px;line-height:1.6}
.ad-lg{border:1px solid var(--line2);border-radius:var(--r-sm);padding:6px 10px;background:var(--raise)}

/* ── 논술 (별도 페이지) ─────────────────────────────────────────────────
   🔴 절대원칙 1 — 논술은 별도 페이지다. 교과 화면의 모양을 건드리지 않는다.
   그래서 여기 규칙은 전부 `ns-` 로 시작하고, 남의 이름(.card·.pwrap)을 쓸 때는
   반드시 `#page-nonsul` 안으로 **가둔다**(교과 화면에 새어 나가지 않게). */

/* 🔴 폭 — 전에는 교과와 같은 1180px 이라 큰 화면에서 **양옆이 휑했다**(원장 지적 2026-08-06).
   논술 표는 칸이 많아(모집단위·계열·고사일·수능최저…) 넓을수록 읽기 쉽다. */
#page-nonsul .pwrap{max-width:1460px; padding-left:clamp(20px,3vw,44px); padding-right:clamp(20px,3vw,44px)}

/* 🔴🔴 `.card` 는 **스스로 여백이 없다**(교과 화면은 안쪽 `.bd` 가 여백을 준다).
   논술 카드는 `.bd` 없이 바로 내용을 담아서 **글씨가 테두리에 딱 붙어 있었다**
   (실측 — 찾기 칸이 카드 선에서 1px 떨어져 있었다). 여기서 여백을 준다. */
#page-nonsul .card{padding:24px 26px; margin-bottom:16px}
#page-nonsul .card .hh{margin-bottom:16px}
#page-nonsul .limnote{padding:18px 20px; margin:16px 0 22px}
#page-nonsul .limnote p{font-size:13px; line-height:1.85; margin-bottom:10px}

.ns-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px 16px;margin:4px 0 0}
.ns-grid label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--soft)}
.ns-hd-sub{font-weight:400;font-size:12.5px;color:var(--soft)}
.ns-tam{border-top:1px dashed var(--line);margin-top:20px;padding-top:18px}
.ns-hint{font-size:12.5px;color:var(--soft);line-height:1.75;margin:16px 0 0}
.ns-btns{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:20px}
.ns-state{font-size:12.5px;color:var(--soft)}
.ns-filters{display:flex;flex-wrap:wrap;gap:14px 18px;align-items:center}
.ns-filters label{display:flex;align-items:center;gap:7px;font-size:13px}
/* 🔴 찾기 칸이 카드 폭을 통째로 먹어 **줄을 혼자 차지**하고 양끝이 선에 붙었다 */
.ns-filters .fld{flex:1 1 260px; max-width:420px; min-width:220px}
.ns-count{margin-top:16px;padding-top:14px;border-top:1px solid var(--line2);
  font-size:13px;color:var(--soft)}
.ns-board{margin-top:2px}
/* ══ 🎓 논술 「한눈에 보기」 목록 (75차 · 원장 지시 2026-08-16) ═══════════════════
   「논술도 성적진단 처럼 갈 수 있는 대학교 목록이 따로 떠야해」
   🔴 넓은 표는 **상자**가 옆으로 밀고, 표는 제 폭을 다 쓴다(ns-tblwrap 와 같은 규칙) */
.nsb-head{margin:0 0 12px;font-size:14px;line-height:1.6;color:var(--soft)}
.nsb-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.nsb-tbl{width:100%;border-collapse:collapse;font-size:14px}
.nsb-tbl th{text-align:left;padding:10px 12px;border-bottom:2px solid var(--line);
  font-weight:700;font-size:13px;color:var(--soft);white-space:nowrap}
.nsb-tbl th i{font-style:normal;font-weight:400;font-size:11px;opacity:.75}
.nsb-tbl td{padding:11px 12px;border-bottom:1px solid var(--line2);vertical-align:top}
.nsb-row{cursor:pointer}
.nsb-row:hover{background:var(--raise)}
.nsb-row.on{background:var(--raise)}
.nsb-row.on>td{border-bottom-color:transparent}
.nsb-arw{display:inline-block;width:14px;color:var(--faint);font-size:11px}
/* 🔴 상세는 **누른 줄 바로 아래**에서 펴진다(원장 지시 — 「그냥 바로 볼 수 있게」) */
.nsb-open>td{padding:0 0 18px;background:var(--raise)}
.nsb-open .ns-body{padding:4px 16px 0}
/* 🔴 원장 지시(2026-08-16) — 「굳이 두줄로 보여줄 필요가 없는데 밸런스가 안맞아서 두줄로 가」
   → 이름과 숫자를 **한 줄로** 두고, 넘치면 말줄임으로 자른다 */
.nsb-u{font-weight:600;min-width:270px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* 🔴 여기에 white-space:nowrap 을 걸면 안 된다 — 「내신 안 봄」 까닭이 서술형이라
   한 줄로 쭉 뻗어 **수능최저·고사일 칸을 통째로 밀어낸다**(75차에 실제로 그랬다). */
.nsb-g{max-width:340px;min-width:215px}
/* 🔴 원장 지시(2026-08-16) — 「숫자에 색 넣어서 눈에띄게 · 지금보다 크기를 좀 키웠음 좋겠어」
   🔴 값에 따라 색을 바꾸지 않는다 — 그러면 신호등처럼 보여 「합격 예측을 하지 않는다」와 어긋난다. */
.nsb-big{font-size:17px;font-weight:800;color:var(--accent);line-height:1.3;
  display:block;white-space:nowrap}
.nsb-cutv{font-size:19px;font-weight:800;color:var(--ink);line-height:1.3;
  display:block;white-space:nowrap}
.nsb-c{min-width:150px}
/* 까닭은 두 줄까지만 — 전문은 줄을 눌러 자세히 보기에서 읽는다 */
.nsb-g .nsb-sub{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden}
.nsb-m{white-space:nowrap}
.nsb-d{white-space:nowrap;font-variant-numeric:tabular-nums}
.nsb-n{white-space:nowrap;text-align:right}
.nsb-sub{display:block;font-style:normal;font-size:11.5px;color:var(--faint);
  opacity:.85;margin-top:4px;font-weight:400;line-height:1.5}
.nsb-ok{color:var(--ok);font-weight:600}
.nsb-no{color:var(--risk);font-weight:600}
.nsb-wait{color:var(--soft);opacity:.75}
.nsb-none{color:var(--soft);opacity:.85}
.nsb-hid{margin:12px 0 0;font-size:13px;line-height:1.6;color:var(--soft);
  padding:10px 12px;border:1px dashed var(--line);border-radius:10px}
.nsb-note{margin:12px 0 0;font-size:12px;line-height:1.65;color:var(--soft);opacity:.9}
@media (max-width:700px){
  .nsb-tbl{font-size:13px}
  .nsb-u{min-width:160px}
  .nsb-tbl th,.nsb-tbl td{padding:9px 8px}
}

.ns-list{margin-top:18px;display:flex;flex-direction:column;gap:10px}
.ns-uni{border:1px solid var(--line);border-radius:12px;background:var(--surface);overflow:hidden}
.ns-uni>summary{cursor:pointer;padding:16px 20px;display:flex;justify-content:space-between;
  align-items:center;gap:14px;flex-wrap:wrap;line-height:1.6;list-style:none}
.ns-uni>summary::-webkit-details-marker{display:none}
.ns-uni[open]>summary{border-bottom:1px solid var(--line2)}
.ns-sum{font-size:12.5px;color:var(--soft)}
.ns-body{padding:18px 20px 20px}
.ns-note{background:#fff8e6;border:1px solid #f0dfae;border-radius:9px;padding:12px 14px;
  font-size:12.5px;line-height:1.75;margin:0 0 14px}
.ns-line{font-size:12.5px;line-height:1.85;margin:0 0 12px;color:var(--soft)}
/* 넘칠 때 옆으로 미는 일은 **감싼 상자**가 한다(표에 걸면 표가 폭을 안 채운다) */
.ns-tblwrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.ns-tbl{width:100%;border-collapse:collapse;font-size:13.5px;min-width:580px}
.ns-tbl th,.ns-tbl td{border-top:1px solid var(--line2);padding:11px 14px;text-align:left;
  vertical-align:top;line-height:1.6}
.ns-tbl th{background:var(--raise);font-weight:600;white-space:nowrap;padding-top:10px;padding-bottom:10px}
/* 🔴 칸 너비를 정해 준다 — 안 그러면 넉 칸이 폭을 똑같이 나눠 가져
   「인원 15명」 한 칸이 300px 을 차지하고 **빈 곳만 넓어 보인다**(원장 지적 2026-08-06).
   글이 긴 마지막 칸(수능최저)이 남는 자리를 가져가게 한다. */
/* 🔴 원장 지시(2026-08-16) — 「맨 오른쪽 여백이 쓸데없이 넓다. 작년 교과등급 칸을 넓혀서
   내 등급이 얼마나 앞서는지 좀더 크게 · 국어 수학 이런것들은 글씨를 크게 봐야지」
   → 모집단위·인원·고사일은 **필요한 만큼만** 쓰고, 남는 자리를 등급·수능최저에 준다. */
/* 🔴 원장 지시(2026-08-16) — 오른쪽이 비어 있으니 **판정·조건·일정**으로 나눠 쓴다 */
.ns-tbl th:nth-child(1),.ns-tbl td:nth-child(1){width:19%;min-width:120px}
.ns-tbl th:nth-child(2),.ns-tbl td:nth-child(2){width:52px}
/* 🔴 78차 — 차례가 바뀌었다(원장 지시 2026-08-18 — 고사일을 일정 옆 뒤쪽으로):
   모집단위 · 인원 · **작년 교과등급** · 수능최저 · **조건** · **고사일** · 일정 */
.ns-tbl th:nth-child(3),.ns-tbl td:nth-child(3){width:20%;min-width:170px}
.ns-tbl th:nth-child(4),.ns-tbl td:nth-child(4){width:82px}
.ns-tbl th:nth-child(5),.ns-tbl td:nth-child(5){width:auto}
.ns-tbl th:nth-child(6),.ns-tbl td:nth-child(6){width:120px}
.ns-tbl th:nth-child(7),.ns-tbl td:nth-child(7){width:74px}
.ns-day{white-space:nowrap}
.ns-day .ns-hm{display:block;font-style:normal;font-size:11.5px;color:var(--faint)}
.ns-vd{white-space:nowrap}
/* 🔴 78차 — 조건 칸에 **까닭이 함께** 들어간다(원장 지시 「누르지말고」) →
   한 줄로 묶어 두면(`nowrap`) 표가 옆으로 터진다. 줄바꿈을 허락한다. */
.ns-cond{font-size:12.5px;color:var(--soft);line-height:1.65}
/* 🔴 조건 칸 「4(5 이내)」 — 채우면 초록 · 넘치면 빨강 (원장 결정 2026-08-16) */
.ns-cv{font-size:15.5px;font-weight:800}
.ns-cv.ok{color:var(--ok)}
.ns-cv.no{color:var(--risk)}
.ns-cb{font-size:12px;color:var(--soft);margin-left:4px}
.ns-pk{white-space:nowrap}
.ns-pk .ns-pick{font-size:11.5px;padding:4px 8px}
/* 🔴🔴 78차 — 쓴 과목과 까닭이 **조건 칸 안에 바로** 보인다(원장 지시 2026-08-18).
   눌러서 펴던 줄(.ns-whyrow)과 그 손잡이(.ns-clk)는 없앴다. */
.ns-cwhy{display:block;margin-top:3px;font-size:11.5px;line-height:1.6;color:var(--risk)}
/* 충족한 줄은 빨강이 아니다 — 못 했다는 뜻으로 읽힌다 */
.ns-cwhy.ok{color:var(--soft)}
/* 성적을 안 넣었을 때 보이는 **대학이 요구하는 조건** */
.ns-cwant{font-size:12.5px;color:var(--soft)}
.ns-n{white-space:nowrap}
/* ══ 📊 작년(2026) 논술전형 교과 등급 (74차 · 2026-08-15 · 원장 지시) ══════
   🔴 「교과가 10%만 들어가도 작년 등급컷이 있으면 보여준다」
   🔴 합격 예측이 아니다 — 「작년에 이랬다」는 사실로만 보인다 */
.ns-cut{white-space:nowrap}
.ns-cut b{font-size:19px;font-weight:800;line-height:1.25}
/* 🔴 78차 — **내 등급이 너무 작게 보인다**(원장 지적 2026-08-18) → 내 등급만 키운다.
   작년 컷(.ns-cut b)은 19px 이라, 견줄 수 있게 그 바로 아래 크기로 둔다. */
.ns-gapin{font-size:13.5px;font-weight:700;margin-left:5px}
.ns-gapin .ns-mine{font-size:17px;font-weight:800}
.ns-gapin.up{color:var(--ok)}
.ns-gapin.dn{color:var(--risk)}
.ns-cut.na{color:var(--faint)}
.ns-cut-k{display:block;font-size:11.5px;color:var(--faint);margin-top:3px;font-weight:600}
.ns-cutbox{margin:16px 0 12px;padding:14px 15px;border:1px solid var(--line2);
  border-radius:10px;background:var(--raise)}
.ns-cutbox>b{display:block;margin-bottom:7px;color:var(--ink)}
.ns-cut-meta{font-size:11.5px;color:var(--faint);margin:0 0 5px;line-height:1.7}
.ns-cut-warn{font-size:11.5px;color:var(--soft);margin:7px 0 0;line-height:1.75;
  padding:9px 11px;border-radius:8px;background:var(--sunk)}
/* 접기 화살표는 안 보인다(원장 지시 — 「굳이 보여줄 필요 없잖아」) */
.ns-cutdet>summary{list-style:none;cursor:pointer;font-size:12px;font-weight:700;
  color:var(--soft);padding:9px 0 0}
.ns-cutdet>summary::-webkit-details-marker{display:none}
.ns-cuttbl{min-width:420px}
.ns-cuttbl th:nth-child(n),.ns-cuttbl td:nth-child(n){width:auto;min-width:0}
.ns-cuttbl th:first-child,.ns-cuttbl td:first-child{min-width:170px}
.ns-cuttbl i{font-style:normal;color:var(--faint);font-size:11px}
/* ── 🎓 내 내신 등급 (74차 · 원장 지시) ────────────────────────────── */
.ns-my{padding:16px 18px;border:1px solid var(--line2);border-radius:12px;
  background:var(--raise);margin:0 0 16px}
.ns-my>b{font-size:13.5px;color:var(--ink)}
.ns-my-n{font-size:30px;font-weight:800;color:var(--ink);margin-left:12px;letter-spacing:-.5px}
.ns-my p{font-size:12px;color:var(--soft);line-height:1.8;margin:8px 0 0}
.ns-my-none p{margin-top:6px}
.ns-gap{display:block;font-size:13px;color:var(--faint);margin-top:5px;font-weight:700}
.ns-gap.up{color:var(--ok)}
.ns-gap.dn{color:var(--soft)}
.ns-cutnone{padding:13px 15px;border:1px solid var(--line2);border-radius:10px;
  background:var(--raise);margin:16px 0 12px}
.ns-cutnone b{color:var(--ink)}
.ns-why{font-size:13px;color:var(--soft);line-height:1.7;margin-top:6px}
.ns-src{font-size:11.5px;color:var(--faint);margin:16px 0 0;padding-top:12px;
  border-top:1px solid var(--line2);line-height:1.7}

/* 작은 화면 — 여백을 줄여 글자 자리를 넓힌다(그래도 선에 붙이지는 않는다) */
@media (max-width:640px){
  #page-nonsul .card{padding:16px 15px}
  #page-nonsul .limnote{padding:14px 15px}
  .ns-uni>summary{padding:13px 14px}
  .ns-body{padding:14px 14px 16px}
  .ns-tbl th,.ns-tbl td{padding:9px 10px}
  .ns-filters .fld{max-width:none}
}
/* ══ 🗓️ 내 논술 일정 (56차 · 2026-08-10 · 원장 지시) ═══════════════════
   · 고사 일정 한 줄마다 ［＋ 내 일정에 넣기］ 단추가 붙는다(.ns-sch)
   · 달력은 **날짜 묶음**으로 그린다(.ns-day) — 겹치는 줄은 붉게(.ns-ev-bad)
   🔴 「시각 미정」은 회색으로 **그대로 밝힌다** — 지어내지 않는다(.ns-nodata) */
.ns-sch{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;
  padding:8px 0;border-top:1px dashed var(--line2)}
.ns-sch:first-of-type{border-top:0}
.ns-sch-t{flex:1 1 auto;font-size:12.5px;line-height:1.75;color:var(--soft)}
.ns-nodata{color:var(--faint);font-style:normal}
/* 🔴 80차 — 일정 비고(「수능 전 논술」·「평일」)와 논술고사 상세를 보이는 자리 */
/* 🔴 80차 · 원장 지시(2026-08-19) — **왼쪽 모의고사 · 오른쪽 내 논술 일정**.
   모의고사는 칸이 열이라 넓게(1.4), 일정은 좁게(1). 폰에서는 위아래로 쌓인다. */
.ns-top2{display:grid;grid-template-columns:1.4fr 1fr;gap:18px;align-items:start;margin-bottom:18px}
.ns-top2>.card{margin:0}
@media (max-width:900px){ .ns-top2{grid-template-columns:1fr} }
/* 거르기 — 이제 「한눈에 보기」 **머리 안**이라 카드 테두리를 두르지 않는다 */
.ns-filterwrap{margin:2px 0 0}
.ns-cnt-hid{color:var(--faint)}
/* 🔴 80차 — 가입 화면 「포인트 받는 방법」(원장 지시 2026-08-19) */
.gb-pt{margin-top:11px;padding:13px 15px;border:1px solid #f0dfae;background:#fff8e6;
  border-radius:10px;font-size:12.5px;line-height:1.8;color:var(--ink)}
.gb-pt-t{font-size:13.5px;display:block;margin-bottom:5px}
.gb-pt p{margin:4px 0 0}
.gb-pt-s{color:var(--faint);font-size:.94em;margin-top:7px!important}
/* 🔴 80차 — 모집단위 칸에 고사일이 없어 **대학이 낸 일정에서 찾아낸** 날.
   🔴 점선 밑줄은 **위 묶음(물음표 커서 자리)에서 함께** 깐다 — 검사기 (114)가 그 목록을 지킨다.
      여기서 따로 그리면 같은 일을 두 곳에서 하게 되고, 그물이 그것을 잡는다(80차에 걸렸다). */
.ns-day-got{cursor:help}
/* 🔴🔴 80차 · 원장 지시(2026-08-19) — 「버튼이 너무 작아!!」·「좀 크게해서 눈에 확 띄게」.
   「내신을 안 보는 전형만 보기」는 뜻이 센 거르개라 **따로 크게** 뺀다. */
.ns-bigfilter{margin:14px 0 0}
.ns-big{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  padding:14px 18px;border:2px solid var(--line);border-radius:12px;
  background:var(--raise);cursor:pointer;transition:border-color .12s,background .12s}
.ns-big:hover{border-color:var(--accent)}
.ns-big input{width:20px;height:20px;flex:0 0 auto;cursor:pointer;accent-color:var(--accent)}
.ns-big-t{font-size:15px;font-weight:600}
.ns-big-s{font-size:12.5px;color:var(--faint);flex:1 1 100%;margin-left:32px}
/* 켜지면 한눈에 보이게 */
.ns-big:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.ns-big:has(input:checked) .ns-big-t{color:var(--accent)}
/* 나머지 거르개도 누르기 쉽게 알약 모양으로 키운다 */
.ns-filters label{padding:8px 12px;border:1px solid var(--line2);border-radius:20px;
  cursor:pointer;background:var(--surface)}
.ns-filters label:hover{border-color:var(--accent)}
.ns-filters label input{width:16px;height:16px;cursor:pointer;accent-color:var(--accent)}
.ns-filters label:has(input:checked){border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}
.ns-sch-note{margin-top:4px;font-size:12px;line-height:1.7;color:var(--ink)}
.ns-sch-more{margin-top:3px;font-size:11.5px;line-height:1.7;color:var(--faint)}
.ns-gosa{border-top:1px dashed var(--line2);padding:8px 0}
.ns-gosa:first-of-type{border-top:0}
.ns-gosa-h{font-weight:700;font-size:12.5px;line-height:1.7}
.ns-gosa-b{margin-top:3px;font-size:12px;line-height:1.75;color:var(--soft)}
.btn.tiny{padding:4px 10px;font-size:11.5px;border-radius:7px;white-space:nowrap;flex:0 0 auto}
.btn.tiny.on{background:var(--raise);border-color:var(--line);color:var(--soft)}
.ns-plan{margin-top:16px;display:flex;flex-direction:column;gap:12px}
.ns-day{border:1px solid var(--line);border-radius:11px;overflow:hidden;background:var(--surface)}
.ns-day-h{background:var(--raise);padding:9px 14px;font-weight:700;font-size:13px;
  display:flex;align-items:center;gap:9px;border-bottom:1px solid var(--line2)}
.ns-when{font-size:11px;font-weight:600;padding:1px 8px;border-radius:999px}
.ns-when.before{background:#eef2fb;color:#31508f;border:1px solid #ccd8f0}
.ns-when.after{background:#f2f2f2;color:#777;border:1px solid #e0e0e0}
.ns-ev{padding:11px 14px;border-top:1px solid var(--line2);position:relative;padding-right:74px}
.ns-ev:first-of-type{border-top:0}
.ns-ev-t{font-size:12.5px;font-weight:600}
.ns-ev-u{font-size:13px;margin-top:2px}
.ns-ev-x{font-size:11.5px;color:var(--soft);line-height:1.6;margin-top:3px}
.ns-ev .ns-del{position:absolute;right:12px;top:11px}
.ns-ev-bad{background:#fdecec;box-shadow:inset 3px 0 0 #a32626}
.ns-ev-warn{background:#fff8e6;box-shadow:inset 3px 0 0 #b8860b}
.ns-ev-unk{background:#f6f6f6;box-shadow:inset 3px 0 0 #999}
.ns-clash{border:1px solid var(--risk);border-left:4px solid var(--risk);border-radius:10px;
  background:var(--raise);padding:13px 15px;font-size:12.5px;line-height:1.75}
.ns-cl{margin:9px 0 0}
.ns-cl-bad{color:#a32626}
.ns-cl-warn{color:#8a5a12}
.ns-cl-unk{color:var(--soft)}
.ns-cl-foot{margin:12px 0 0;padding-top:10px;border-top:1px solid var(--line2);color:var(--soft)}
.ns-noclash{font-size:12.5px;color:var(--soft);margin:4px 0 0}
/* 🔑 로그인 전 손님에게 — 막다른 길을 만들지 않는다(들어가는 문을 함께 보인다) */
.ns-needlogin{border:1px solid var(--line);border-radius:11px;background:var(--surface);
  padding:18px 20px;font-size:13px;line-height:1.8}
.ns-needlogin p{margin:0 0 10px}
.ns-needlogin p:last-child{margin:0}
/* 🔒 요금제가 없을 때 — 대학·전형 이름만 */
.ns-locklist{display:flex;flex-direction:column;gap:1px}
.ns-lk{display:flex;gap:12px;align-items:baseline;padding:9px 13px;border-radius:8px;font-size:13px}
.ns-lk:nth-child(odd){background:var(--raise)}
.ns-lk>b{flex:0 0 190px}
.ns-lk>span{flex:1 1 auto;font-size:12px;color:var(--soft);line-height:1.6}
@media (max-width:640px){
  .ns-sch{flex-direction:column;gap:6px}
  .ns-lk{flex-direction:column;gap:2px}
  .ns-lk>b{flex:0 0 auto}
}

.ns-badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:11.5px;white-space:nowrap}
.ns-ok{background:#e7f6ec;color:#1c6b39;border:1px solid #bfe4cd}
.ns-no{background:#fdecec;color:#a32626;border:1px solid #f2c4c4}
.ns-free{background:#eef2fb;color:#31508f;border:1px solid #ccd8f0}
.ns-hold{background:#fff4e2;color:#8a5a12;border:1px solid #f0d9ae}
.ns-none{background:#f2f2f2;color:#777;border:1px solid #e0e0e0}

/* ══ 🔴 우리가 안 다루는 대학 — 대학 목록 맨 위 (원장 지시 2026-08-07 · 43차) ══
   「빨간색이든 뭐든 따로 대학교 써주고 포함이 안된 이유를 적어야 할 것 같아」
   눈에 띄되 겁주지 않게 — 붉은 테두리 + 옅은 바탕. 10곳만 보이고 나머지는 접는다. */
.ucn{
  border:1px solid var(--risk); border-left:4px solid var(--risk); border-radius:10px;
  background:var(--raise); padding:14px 16px; margin:0 0 16px;
}
.ucn-t{font-size:14px; font-weight:800; color:var(--risk); margin-bottom:4px}
.ucn-s{font-size:12.5px; color:var(--soft); line-height:1.7; margin-bottom:10px}
.ucn-l{display:flex; flex-direction:column; gap:1px}
/* 🔴 이름과 까닭을 **한 줄에 나란히**(원장 지시 2026-08-07 — 「밑에줄 말고 옆줄에. 줄이 너무 길어져」) */
.ucn-row{display:flex; align-items:baseline; gap:12px; padding:7px 10px; border-radius:7px; background:var(--sunk)}
.ucn-row:nth-child(even){background:transparent}
.ucn-h{display:flex; align-items:center; gap:6px; flex:0 0 224px; min-width:0}
.ucn-u{font-size:13px; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.ucn-g{font-size:10.5px; color:var(--faint); border:1px solid var(--line2);
  border-radius:20px; padding:1px 7px; white-space:nowrap; flex:none}
.ucn-w{font-size:12px; color:var(--soft); line-height:1.65; flex:1 1 auto; min-width:0}
/* 좁은 화면에서는 위아래로 떨어뜨린다 — 옆으로 두면 글자가 뭉개진다 */
@media (max-width:640px){
  .ucn-row{display:block; padding:8px 10px}
  .ucn-h{flex:none}
  .ucn-u{white-space:normal}
  .ucn-w{margin-top:2px}
}
.ucn-more{margin-top:8px}
.ucn-more>summary{
  cursor:pointer; font-size:12.5px; font-weight:800; color:var(--accent);
  padding:8px 10px; border-radius:7px; background:var(--accent-soft); list-style:none; text-align:center;
}
.ucn-more>summary::-webkit-details-marker{display:none}
.ucn-more>summary:hover{filter:brightness(1.05)}
.ucn-more[open]>summary{margin-bottom:6px}

/* ══ 🔴 결제 전 「대학 목록을 확인하셨나요」 (원장 지시 2026-08-07 · 필수) ══
   글로만 적으면 아무도 안 본다 → **목록으로 가는 버튼 + 따로 체크**. 눈에 띄게 둔다. */
.cs-check-uni{
  margin:18px 0 0; padding:14px 16px; border-radius:10px;
  background:var(--accent-soft); border:1px solid var(--accent); border-left:4px solid var(--accent);
}
.cs-check-uni .cs-k{font-size:13.5px; font-weight:800; color:var(--accent); margin-bottom:5px}
.cs-check-uni p{font-size:12.5px; color:var(--soft); line-height:1.75; margin:0 0 10px}
.cs-uni-go{
  display:inline-block; padding:9px 16px; border-radius:8px; text-decoration:none;
  background:var(--accent); color:#fff; font-size:12.5px; font-weight:800; margin-bottom:10px;
}
.cs-uni-go:hover{filter:brightness(1.06)}
.cs-agree2{margin:0}

/* 🔴🔴 결제 앞 — **이 요금제가 어느 성적표에 붙는지**(81차 · 원장 지시 2026-08-20)
   🔴🔴 **색이 파란 상자와 같으면 묻힌다**(원장 지적 — 「모르고 지나가기 딱좋아」).
      결제 앞 상자 가운데 파란 것이 이미 둘(대학 목록·포인트)이라 **경고색으로 갈랐다.**
   🔴 자리도 **결제 단추 바로 위**다 — 맨 위에 두면 아래 상자들에 밀려 화면 밖으로 나간다. */
.cs-sheet{
  margin:18px 0 0; padding:15px 17px; border-radius:10px;
  background:var(--warn-soft); border:2px solid var(--warn);
}
.cs-sh-k{font-size:12.5px; font-weight:800; color:var(--warn); margin-bottom:4px}
.cs-sh-now{font-size:21px; font-weight:800; line-height:1.4; word-break:keep-all}
.cs-sh-pick{margin-top:12px}
.cs-sh-pick label{display:block; font-size:12.5px; color:var(--soft); margin-bottom:5px}
.cs-sh-pick select{max-width:420px}
.cs-sh-fine{font-size:12.5px; color:var(--soft); line-height:1.7; margin:10px 0 0}

/* 🔴 검색이 빈손인데 그 이름이 「안 다루는 대학」일 때 — 그 자리에서 까닭을 말한다(43차) */
.uc-none{
  padding:16px 18px; border-radius:10px; background:var(--raise);
  border:1px solid var(--risk); border-left:4px solid var(--risk);
}
.uc-none-t{font-size:13.5px; color:var(--ink); margin:0 0 5px}
.uc-none-w{font-size:12.5px; color:var(--soft); line-height:1.75; margin:0 0 12px}
.uc-none-s{font-size:12px; color:var(--faint); line-height:1.7; margin:0; padding-top:10px; border-top:1px solid var(--line2)}

/* 🔴🔴 54차 — 참고컷(원장 결정 2026-08-10)
   대학이 합격자 등급을 안 내고 다른 값만 낸 줄에 그 값을 보여 준다(한국교원대 = 지원자 평균).
   🔴 판정(신호등)이 아니다 — 신호등 색(ok/warn/risk)을 쓰지 않고 회색 계열로 둔다. */
/* 🔴 점선 밑줄은 위 「눌러서 여는 설명」 묶음 규칙이 깔아 준다(검사기 (114)가 그 목록을 지킨다).
   여기서 따로 밑줄을 그으면 두 줄이 겹친다 — 색·굵기만 정한다. */
.refcut{color:var(--na); font-weight:700; cursor:help}

/* ── 📌 공통과목 고르기 (57차 · 2026-08-10) ─────────────────────────────
   과목명으로 저절로 가르고, **못 가른 것만** 물어보는 자리. 접혀 있다가 눌러서 편다. */
.ed-kind{margin:14px 0 0;border:1px solid var(--line);border-radius:11px;background:var(--surface);overflow:hidden}
.edk-t{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:12px 16px;background:none;border:0;cursor:pointer;font:inherit;font-size:13.5px;font-weight:700;text-align:left}
.edk-t:hover{background:var(--raise)}
.edk-sum{font-weight:400;font-size:12.5px;color:var(--soft)}
.edk-warn{color:var(--risk)}
.edk-body{padding:0 16px 16px;border-top:1px solid var(--line2)}
.edk-note,.edk-help{font-size:12.5px;line-height:1.8;color:var(--soft);margin:12px 0 0}
.edk-help{padding-top:10px;border-top:1px dashed var(--line2)}
.edk-ok{font-size:12.5px;color:var(--soft);margin:12px 0 0}
.edk-list{display:flex;flex-direction:column;gap:6px;margin-top:12px}
.edk-row{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;background:var(--raise)}
.edk-nm{flex:1 1 auto;font-size:12.5px}
@media (max-width:640px){ .edk-row{flex-wrap:wrap} .edk-nm{flex:1 1 100%} }


/* ── 🔴 광고 수신동의 (91차 · 원장 지시 2026-08-23) ─────────────────────
   동의한 사람에게만 광고 문자를 보낼 수 있다(정보통신망법 제50조).
   🔴 **숫자는 서버가 센다.** 회원 목록은 최근 200명까지만 보므로 화면이 세면 그 아래가 빠진다. */
.adm-ad{display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  background:var(--accent-soft); border:1.5px solid var(--accent);
  border-radius:var(--r-sm); padding:10px 13px; margin:0 0 12px}
.adm-ad .ad-sw{display:inline-flex; align-items:center; gap:7px;
  font-weight:800; font-size:14px; cursor:pointer; color:var(--accent-ink)}
.adm-ad .ad-sw input{width:17px; height:17px}
.adm-ad .lb{font-size:13px; color:var(--soft)}
.adm-ad .grow{flex:1; min-width:8px}
.adm-ad .btn.ghost{background:var(--surface)}
.ad-yes-n{color:var(--ok)}
.adm-nm{font-weight:800}
.adm-tbl .ad-yes{display:inline-block; background:var(--ok-soft); color:var(--ok);
  border:1px solid var(--ok); border-radius:5px; font-size:11px; font-weight:800;
  padding:1px 6px; white-space:nowrap}
.adm-tbl .ad-no{display:inline-block; background:var(--na-soft); color:var(--na);
  border:1px solid var(--line); border-radius:5px; font-size:11px;
  padding:1px 6px; white-space:nowrap}
.adm-tbl .ad-w{font-size:11px; color:var(--faint)}
.adm-tbl .ad-w.bad{color:var(--risk)}
.adm-adbox{background:var(--surface); border:2px solid var(--accent);
  border-radius:var(--r); padding:15px 17px; margin:0 0 14px}
.adm-adbox[hidden]{display:none}
.adm-adbox .ad-hd{display:flex; align-items:center; justify-content:space-between;
  gap:10px; font-size:15px}
.adm-adbox .ad-when{margin:3px 0 10px; font-size:12.5px; font-weight:800; color:var(--risk)}
.adm-adbox .ad-nums{background:var(--sunk); border:1px solid var(--line);
  border-radius:var(--r-sm); padding:11px; font-size:12.5px; line-height:1.8;
  font-family:ui-monospace,Menlo,monospace; max-height:190px; overflow:auto;
  word-break:break-all; -webkit-user-select:text; user-select:text}
.adm-adbox .ad-btns{display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin-top:11px}
.adm-adbox .ad-btns .btn{flex:0 0 auto}
.adm-adbox .ad-ok{font-size:12.5px; color:var(--ok); font-weight:800}
.adm-adbox .ad-warn{background:var(--warn-soft); border:1px solid var(--gold-line);
  border-radius:var(--r-sm); padding:10px 12px; font-size:12.5px; line-height:1.7; margin-top:11px}
.adm-adbox .ad-load{padding:14px; font-size:13px; color:var(--faint)}
.adm-adbox .ad-load.bad{color:var(--risk)}
@media (max-width:700px){
  .adm-ad{gap:8px}
  .adm-adbox .ad-nums{font-size:12px}
}

/* 🔴 91차 — 점수로 잰 줄(환산점수 비교)을 **폰 카드에서도** 보인다(원장 지시 2026-08-23) */
.rc-byscore{margin:6px 0 0; font-size:12.5px; color:var(--soft);
  background:var(--sunk); border:1px solid var(--line); border-radius:var(--r-sm); padding:5px 8px}
/* 🔴 91차 — 점수로 잰 줄의 **점수를 표에 바로** 보인다(원장 지시 2026-08-23) */
.sub2.sc{font-size:11.5px; color:var(--soft); font-weight:700; margin-top:1px}
.sub2.sc.need{color:var(--risk)}
.rc-byscore .k{color:var(--faint); font-size:11.5px; margin-right:4px}
.rc-byscore .need{color:var(--risk)}

/* ── 🔴🔴 원점수 경고 (2026-09-06 · 원장 지시 「경고처럼 눈에 확 띄게 해줘」) ──────────
   원점수를 한 과목도 안 넣으셨을 때만 뜬다. 성적 입력 화면과 결과 화면이 **같은 모양**을 쓴다.
   ⚠️ 글과 숫자는 app.js `rawWarnHTML()` 한 곳에서 만든다 — 여기에는 색만 있다. */
.rawwarn{margin:10px 0; padding:11px 13px; border-radius:10px;
  border:1.5px solid var(--risk); background:var(--risk-soft); box-shadow:var(--shadow)}
.rawwarn .rw-h{display:flex; align-items:center; gap:6px;
  font-size:13.5px; font-weight:800; color:var(--risk); letter-spacing:-.2px}
.rawwarn .rw-h::before{content:'!'; display:inline-flex; align-items:center; justify-content:center;
  width:17px; height:17px; border-radius:50%; background:var(--risk); color:#fff;
  font-size:12px; font-weight:900; flex:0 0 auto}
.rawwarn .rw-b{margin-top:5px; font-size:12px; font-weight:600; color:var(--ink); line-height:1.6}
.rawwarn .rw-b b{font-weight:800}
.rawwarn .rw-red{color:var(--risk)}
.rawwarn .rw-l{display:flex; flex-wrap:wrap; gap:4px 6px; margin-top:7px}
.rawwarn .rw-u{padding:2px 7px; border-radius:99px; background:var(--surface);
  border:1px solid var(--line); font-size:10.5px; font-weight:700; color:var(--soft)}
.rawwarn .rw-u.blk{border-color:var(--risk); color:var(--risk)}
.rawwarn .rw-a{display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-top:9px}
.rawwarn .rw-lock{font-size:11.5px; font-weight:600; color:var(--soft); line-height:1.55}
.rawwarn .rw-go{padding:7px 14px; border-radius:8px; border:0; cursor:pointer;
  background:var(--risk); color:#fff; font-size:12.5px; font-weight:800; font-family:inherit}
.rawwarn .rw-go:hover{filter:brightness(1.06)}