:root{
  --bg:#fbfaf6;
  --surface:#ffffff;
  --surface-2:#f4f2ea;
  --border:#e7e3d6;
  --ink:#1b1a17;
  --ink-soft:#57544b;
  --ink-faint:#8d897d;
  --accent:#f2b705;          /* PIYO 병아리 노랑 */
  --accent-ink:#3a2c00;
  --accent-soft:#fff4cc;
  --link:#1f5fbf;
  --must:#b8412a;  --must-soft:#fbe9e4;
  --ok:#2f7a51;    --ok-soft:#e5f3eb;
  --maybe:#8a6a12; --maybe-soft:#fbf2d9;
  --info:#3b5aa8;  --info-soft:#e8eefb;
  --shadow:0 1px 2px rgba(30,25,10,.05), 0 10px 28px -16px rgba(30,25,10,.18);
  --radius:14px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#15140f; --surface:#1e1c16; --surface-2:#27251d; --border:#38352a;
    --ink:#f1eee4; --ink-soft:#c4bfae; --ink-faint:#8f8a79;
    --accent:#f5c431; --accent-ink:#241b00; --accent-soft:#3a3113;
    --link:#8fb4f5;
    --must:#f08a70; --must-soft:#3b231d; --ok:#7fcb9f; --ok-soft:#1d3226;
    --maybe:#e6c265; --maybe-soft:#352c16; --info:#9fb5ef; --info-soft:#222b43;
    --shadow:0 1px 2px rgba(0,0,0,.35), 0 10px 28px -16px rgba(0,0,0,.6);
  }
}
:root[data-theme="dark"]{
  --bg:#15140f; --surface:#1e1c16; --surface-2:#27251d; --border:#38352a;
  --ink:#f1eee4; --ink-soft:#c4bfae; --ink-faint:#8f8a79;
  --accent:#f5c431; --accent-ink:#241b00; --accent-soft:#3a3113;
  --link:#8fb4f5;
  --must:#f08a70; --must-soft:#3b231d; --ok:#7fcb9f; --ok-soft:#1d3226;
  --maybe:#e6c265; --maybe-soft:#352c16; --info:#9fb5ef; --info-soft:#222b43;
  --shadow:0 1px 2px rgba(0,0,0,.35), 0 10px 28px -16px rgba(0,0,0,.6);
}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:"Noto Sans KR",system-ui,-apple-system,sans-serif;
  font-size:15px; line-height:1.6; word-break:keep-all; overflow-wrap:anywhere;
}
a{color:var(--link)}
.wrap{max-width:1120px; margin:0 auto; padding:0 16px}
.visually-hidden{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}

/* header */
.site-header{position:sticky; top:0; z-index:10; background:color-mix(in srgb,var(--bg) 88%,transparent); backdrop-filter:blur(8px); border-bottom:1px solid var(--border)}
.header-inner{display:flex; align-items:center; justify-content:space-between; height:58px}
.brand{display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--ink)}
.brand-mark{display:grid; place-items:center; width:36px; height:36px; border-radius:11px; background:var(--accent); font-size:21px}
.brand-text{display:flex; align-items:baseline; gap:7px}
.brand-name{font-weight:900; font-size:18px; letter-spacing:-.02em}
.brand-by{font-size:12px; font-weight:700; color:var(--ink-faint); letter-spacing:.04em}
.theme-toggle{border:1px solid var(--border); background:var(--surface); color:var(--ink); width:36px; height:36px; border-radius:10px; font-size:16px; cursor:pointer}

/* hero */
.hero{padding:34px 0 10px}
.hero h1{margin:0 0 6px; font-size:clamp(24px,4.4vw,34px); font-weight:900; letter-spacing:-.03em}
.hero p{margin:0 0 18px; color:var(--ink-soft)}
.search input{
  width:100%; font:inherit; font-size:16px; padding:14px 16px; border-radius:var(--radius);
  border:1.5px solid var(--border); background:var(--surface); color:var(--ink); box-shadow:var(--shadow);
}
.search input:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 4px var(--accent-soft)}
.filters{display:flex; flex-direction:column; gap:8px; margin-top:14px}
.filter-row{display:flex; flex-wrap:wrap; align-items:center; gap:6px}
.filter-label{font-size:12px; font-weight:700; color:var(--ink-faint); width:64px; flex-shrink:0}
.chip{
  font:inherit; font-size:13px; padding:5px 11px; border-radius:999px; cursor:pointer;
  border:1px solid var(--border); background:var(--surface); color:var(--ink-soft);
}
.chip[aria-pressed="true"]{background:var(--accent); border-color:var(--accent); color:var(--accent-ink); font-weight:700}
.chip.reset{border-style:dashed}

/* tabs */
.tabs{display:flex; gap:4px; margin:22px 0 0; border-bottom:1px solid var(--border); overflow-x:auto}
.tabs button{font:inherit; font-weight:700; padding:10px 14px; border:0; background:none; color:var(--ink-faint); cursor:pointer; border-bottom:3px solid transparent; white-space:nowrap}
.tabs button[aria-selected="true"]{color:var(--ink); border-bottom-color:var(--accent)}
.result-meta{font-size:13px; color:var(--ink-faint); margin:12px 0}
.loading,.empty{padding:40px 0; text-align:center; color:var(--ink-faint)}

/* cards */
.grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:12px; padding-bottom:40px}
.card{
  display:flex; flex-direction:column; gap:8px; padding:16px; border-radius:var(--radius);
  background:var(--surface); border:1px solid var(--border); box-shadow:var(--shadow);
  text-decoration:none; color:inherit; transition:transform .12s ease, border-color .12s ease;
}
.card:hover{transform:translateY(-2px); border-color:var(--accent)}
.card-top{display:flex; justify-content:space-between; gap:8px; align-items:flex-start}
.card h3{margin:0; font-size:16px; font-weight:700; line-height:1.35}
.card .prog{font-size:20px; font-weight:900; letter-spacing:-.02em; line-height:1.2}
.card .sub{font-size:12.5px; color:var(--ink-faint)}
.badges{display:flex; flex-wrap:wrap; gap:4px}
.badge{font-size:11.5px; font-weight:700; padding:2px 8px; border-radius:6px; background:var(--surface-2); color:var(--ink-soft); white-space:nowrap}
.badge.must{background:var(--must-soft); color:var(--must)}
.badge.ok{background:var(--ok-soft); color:var(--ok)}
.badge.maybe{background:var(--maybe-soft); color:var(--maybe)}
.badge.info{background:var(--info-soft); color:var(--info)}
.badge.accent{background:var(--accent); color:var(--accent-ink)}
.card-foot{margin-top:auto; display:flex; justify-content:space-between; align-items:center; gap:8px; padding-top:8px; border-top:1px dashed var(--border); font-size:12.5px}
.next-label{color:var(--ink-faint)}
.dday{font-weight:900; font-size:12px; padding:2px 8px; border-radius:6px; white-space:nowrap}
.dday.soon{background:var(--must-soft); color:var(--must)}
.dday.open{background:var(--ok-soft); color:var(--ok)}
.dday.past{background:var(--surface-2); color:var(--ink-faint)}

/* table */
.table-wrap{overflow-x:auto; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); margin-bottom:40px}
table.compare{border-collapse:collapse; width:100%; min-width:760px; font-size:13px}
.compare th,.compare td{padding:9px 10px; border-bottom:1px solid var(--border); text-align:left; vertical-align:top}
.compare thead th{position:sticky; top:0; background:var(--surface-2); font-size:12px; color:var(--ink-soft); white-space:nowrap; cursor:pointer; user-select:none}
.compare thead th[aria-sort] ::after{content:""}
.compare tbody tr:hover{background:var(--surface-2)}
.compare td:not(.name){white-space:nowrap}
.compare td.name a{font-weight:700; text-decoration:none; color:var(--ink)}
.compare td.name small{display:block; color:var(--ink-faint); font-weight:400}
.dash{color:var(--ink-faint)}

/* months */
.months{display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:12px; padding-bottom:40px}
.month{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:14px}
.month h3{margin:0 0 8px; font-size:15px; display:flex; justify-content:space-between; align-items:baseline}
.month h3 span{font-size:12px; color:var(--ink-faint); font-weight:400}
.month ul{list-style:none; margin:0; padding:0}
.month li{display:flex; justify-content:space-between; gap:8px; padding:5px 0; border-top:1px dashed var(--border); font-size:13px}
.month li:first-child{border-top:0}
.month li a{color:var(--ink); text-decoration:none}
.month li a:hover{text-decoration:underline}
.month li time{color:var(--ink-faint); white-space:nowrap; font-variant-numeric:tabular-nums}
.month li.upcoming time{color:var(--must); font-weight:700}
.note-box{background:var(--accent-soft); border-radius:12px; padding:12px 14px; font-size:13px; color:var(--ink-soft); margin-bottom:12px}

/* detail */
.detail{padding:8px 0 50px}
.back{display:inline-flex; gap:6px; align-items:center; font-size:14px; text-decoration:none; color:var(--ink-soft); margin:18px 0 8px}
.detail-head{padding:18px 0 16px; border-bottom:1px solid var(--border); margin-bottom:18px}
.detail-head .uni{font-size:14px; color:var(--ink-soft); font-weight:700}
.detail-head h1{margin:2px 0 4px; font-size:clamp(26px,5vw,38px); font-weight:900; letter-spacing:-.03em; line-height:1.15}
.detail-head .full{color:var(--ink-faint); font-size:14px}
.detail-head .badges{margin-top:12px}
.actions{display:flex; flex-wrap:wrap; gap:8px; margin-top:14px}
.btn{display:inline-flex; align-items:center; gap:6px; padding:8px 14px; border-radius:10px; font-size:14px; font-weight:700; text-decoration:none; border:1px solid var(--border); background:var(--surface); color:var(--ink)}
.btn.primary{background:var(--accent); border-color:var(--accent); color:var(--accent-ink)}
.layout{display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:18px; align-items:start}
@media (max-width:860px){ .layout{grid-template-columns:minmax(0,1fr)} }
.panel{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:16px 18px; margin-bottom:14px}
.panel h2{margin:0 0 10px; font-size:16px; font-weight:900; display:flex; gap:8px; align-items:center; flex-wrap:wrap}
.panel h2 .badge{font-weight:700}
.panel h3{font-size:14px; margin:14px 0 6px}
.panel ul{margin:0; padding-left:18px}
.panel li{margin:3px 0}
.panel .src{font-size:12px; color:var(--ink-faint); margin-top:8px}
.kv{display:grid; grid-template-columns:auto 1fr; gap:6px 14px; font-size:14px; margin:0}
.kv dt{color:var(--ink-faint)}
.kv dd{margin:0; font-weight:700}
.sched{width:100%; border-collapse:collapse; font-size:13px}
.sched-wrap{overflow-x:auto}
.sched th,.sched td{padding:7px 8px; border-bottom:1px solid var(--border); text-align:left; white-space:nowrap; font-variant-numeric:tabular-nums}
.sched th{font-size:12px; color:var(--ink-faint); font-weight:700}
.sched td.label{font-weight:700; white-space:normal; min-width:90px}
.sched td.upcoming{color:var(--must); font-weight:700}
.doc-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:10px}
.doc-block{background:var(--surface-2); border-radius:10px; padding:10px 12px; font-size:13.5px}
.doc-block h3{margin:0 0 4px; font-size:13px}
.doc-block ul{padding-left:16px}
details.essay{border:1px solid var(--border); border-radius:10px; padding:10px 12px; margin:8px 0; background:var(--surface)}
details.essay summary{cursor:pointer; font-weight:700; display:flex; gap:8px; align-items:center; flex-wrap:wrap}
details.essay blockquote{margin:10px 0 0; padding:10px 12px; border-left:3px solid var(--accent); background:var(--surface-2); border-radius:0 8px 8px 0; font-size:13.5px; white-space:pre-line}
details.essay ol{margin:10px 0 0; padding-left:20px; font-size:13.5px}
.copy{font:inherit; font-size:12px; padding:2px 8px; border-radius:6px; border:1px solid var(--border); background:var(--surface); color:var(--ink-soft); cursor:pointer; margin-left:auto}
.muted{color:var(--ink-faint); font-size:13px}

.site-footer{border-top:1px solid var(--border); padding:22px 0 34px; color:var(--ink-soft); font-size:13px}
.site-footer p{margin:4px 0}
.site-footer .fine{color:var(--ink-faint); font-size:12px}

@media (max-width:520px){
  .filter-label{width:100%}
  .grid{grid-template-columns:1fr}
  .brand-name{font-size:16px}
}

/* 한국 고교 졸업자 지원 불가 등: 회색·클릭 불가 */
.card.disabled{opacity:.5; filter:grayscale(1); cursor:not-allowed; box-shadow:none}
.card.disabled:hover{transform:none; border-color:var(--border)}
.compare tr.disabled{opacity:.5; filter:grayscale(1)}
.compare tr.disabled:hover{background:none}
.ineligible-note{font-size:12.5px; font-weight:700; color:var(--ink-soft)}
.stats{width:100%; border-collapse:collapse; font-size:13px}
.stats th,.stats td{padding:7px 8px; border-bottom:1px solid var(--border); text-align:left; vertical-align:top}
.stats th{font-size:12px; color:var(--ink-faint); font-weight:700; white-space:nowrap}
.stats td.label{font-weight:700; white-space:nowrap}

/* 한눈에 보기: 필요서류 카드 */
details.brief{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); margin-bottom:18px; overflow:hidden}
details.brief[open] > summary{border-bottom:2px solid var(--accent)}
details.brief > summary{list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:12px; padding:18px 22px}
details.brief > summary::-webkit-details-marker{display:none}
.brief-title{font-size:20px; font-weight:900; letter-spacing:-.02em}
.brief-sub{font-size:13.5px; color:var(--ink-faint); margin-top:2px}
.chev{color:var(--ink-faint); transition:transform .15s}
details.brief:not([open]) .chev{transform:rotate(-90deg)}
.brief-body{padding:18px 22px 22px}
.key-facts{display:flex; flex-wrap:wrap; gap:6px; margin-bottom:16px}
.key-fact{font-size:13px; font-weight:700; padding:4px 10px; border-radius:999px; background:var(--accent-soft); color:var(--ink)}
.brief-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px 24px; margin-bottom:16px}
.brief-block h4{margin:0 0 6px; font-size:13px; font-weight:700; color:var(--ink-faint); letter-spacing:.02em}
.brief-block ul{list-style:none; margin:0; padding:0}
.brief-block li{position:relative; padding-left:20px; margin:5px 0; font-size:14.5px; line-height:1.55}
.brief-block li::before{content:"—"; position:absolute; left:0; color:var(--ink-faint)}
.code-chip{display:inline-block; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:12.5px; font-weight:700; padding:1px 7px; border-radius:6px; background:var(--info-soft); color:var(--info)}
.essay-block{background:var(--surface-2); border-radius:12px; padding:16px 18px; margin-top:12px}
.essay-block h4{margin:0 0 8px; font-size:13.5px; color:var(--ink-faint); font-weight:700}
.essay-block .wc{color:var(--info); font-weight:700}
.essay-block blockquote{margin:0; padding:2px 0 2px 14px; border-left:3px solid var(--ink-soft); font-style:italic; font-size:14.5px; color:var(--ink-soft); white-space:pre-line}
.essay-block ol{margin:10px 0 0; padding-left:22px; font-size:14.5px}
.essay-block li{margin:4px 0}
.brief .src{margin-top:12px; font-size:12px; color:var(--ink-faint)}
@media (max-width:520px){ .brief-title{font-size:17px} details.brief > summary,.brief-body{padding-left:16px; padding-right:16px} }
/* 일정 표: 긴 설명이 들어간 칸은 줄바꿈, 전형명 칸은 충분히 넓게 */
.sched td{max-width:240px; white-space:normal; vertical-align:top}
.sched td.label{min-width:160px}
.kv dd.long{font-weight:400; font-size:13px; color:var(--ink-soft)}
.sched td.date .d{white-space:nowrap; display:block}
.sched td.date{white-space:nowrap}
.sched td.date small,.sched td.note{white-space:normal; font-size:11.5px; color:var(--ink-faint); font-weight:400; display:block; min-width:110px}
.sched td.date:has(small){white-space:normal}

/* Comparison selection stays reachable at the right edge of a wide table. */
.compare .compare-select{position:sticky; right:0; min-width:64px; text-align:center; background:var(--surface); border-left:1px solid var(--border); z-index:1}
.compare thead .compare-select{background:var(--surface-2); z-index:2; cursor:default}
.compare-select input{width:20px; height:20px; margin:2px; cursor:pointer; accent-color:var(--accent)}
.compare-select input:focus-visible{outline:3px solid var(--accent); outline-offset:3px}
.compare-tools{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:16px 0}
.compare-tools small{width:100%; color:var(--ink-soft)}
.compare-tools .btn:disabled{opacity:.45; cursor:not-allowed}
#compare-count{font-weight:700}
#compare-downloads:not(:empty){padding:14px; margin-bottom:16px; background:var(--surface-2); border-radius:12px}
#compare-downloads .btn{margin:4px}
