/* 코사장 매칭 앱. 색·모양은 사이트 v0.15~v0.16·지원서·상담 신청서와 같다(PROMPT 8장).
   글자 크기는 rem이라 브라우저 글자 크기 설정(20·24px)을 따라 커진다. 1단계는 밝은 화면만. */
:root {
  --bg: #f7f8fa;
  --card: #fff;
  --ink: #1c2230;
  --muted: #565e6e;
  --line: #e2e5ea;
  --line-strong: #c9ced6;
  --accent: #2a36d9;
  --accent-soft: #eef0fd;
  --dark: #1a2033;
  --red: #c0322b;
  --green: #1d7a4a;
  --r-card: 6px;
  --r-btn: 4px;
  --r-chip: 3px;
  color-scheme: light;
}
*,
*::before,
*::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, system-ui, 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;
  font-size: 1rem;
  line-height: 1.55;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
a { color: var(--accent); text-underline-offset: 2px; }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.num, td.n, .money, time { font-variant-numeric: tabular-nums; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
[hidden] { display: none !important; }

/* 뼈대 */
.top {
  position: sticky; top: 0; z-index: 20;
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.75rem;
  min-height: 3.25rem; padding: 0.25rem 1rem;
  background: var(--card); border-bottom: 1px solid var(--line);
}
.brand { font-weight: 600; letter-spacing: -0.01em; font-size: 1.0625rem; color: var(--ink); text-decoration: none; display: inline-flex; align-items: center; min-height: 2.75rem; min-width: 2.75rem; }
.who { margin-left: auto; display: flex; align-items: center; justify-content: flex-end; gap: 0 0.5rem; color: var(--muted); font-size: 0.875rem; min-width: 0; }
.who .name { min-width: 0; overflow-wrap: anywhere; text-align: right; }
.who a { display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0 0.25rem; }
.nav { display: flex; gap: 0.25rem; overflow-x: auto; padding: 0.375rem 0.75rem; background: var(--card); border-bottom: 1px solid var(--line); scrollbar-width: thin; }
.nav a { flex: none; padding: 0.5rem 0.75rem; border-radius: var(--r-btn); color: var(--ink); text-decoration: none; font-size: 0.9375rem; white-space: nowrap; min-height: 2.75rem; display: inline-flex; align-items: center; }
.nav a[aria-current='page'] { background: var(--accent-soft); color: var(--accent); font-weight: 500; }
.nav .badge { margin-left: 0.375rem; font-size: 0.8125rem; color: var(--accent); font-weight: 500; }
main { padding: 1rem; max-width: 42rem; margin: 0 auto; }
.wide main { max-width: 90rem; }
@media (min-width: 64em) {
  .wide .shell { display: grid; grid-template-columns: 13rem minmax(0, 1fr); min-height: calc(100vh - 3.25rem); }
  .wide .nav { flex-direction: column; overflow: visible; padding: 0.75rem; border-bottom: 0; border-right: 1px solid var(--line); }
  .wide main { padding: 1.25rem 1.5rem 3rem; margin: 0; max-width: none; }
}

/* 글자 */
h1, .title { font-size: 1.3125rem; font-weight: 600; letter-spacing: -0.01em; line-height: 1.35; margin: 0.25rem 0 0.75rem; }
h2 { font-size: 1.0625rem; font-weight: 500; letter-spacing: -0.01em; margin: 0 0 0.5rem; }
h3 { font-size: 1rem; font-weight: 500; margin: 0 0 0.375rem; }
p { margin: 0 0 0.5rem; }
.muted { color: var(--muted); }
.small { font-size: 0.875rem; }
.sub { color: var(--muted); font-size: 0.9375rem; margin: -0.5rem 0 0.75rem; }
.err { color: var(--red); }
.okc { color: var(--green); }
.back { display: inline-flex; align-items: center; gap: 0.25rem; min-height: 2.75rem; color: var(--muted); text-decoration: none; font-size: 0.9375rem; }
.ico { width: 1.125rem; height: 1.125rem; stroke: currentColor; stroke-width: 1.5; fill: none; stroke-linecap: round; stroke-linejoin: round; flex: none; }

/* 판·줄 */
.panel { background: var(--card); border: 1px solid var(--line); border-radius: var(--r-card); padding: 1rem; margin: 0 0 1rem; }
.panel > h2:first-child { margin-top: 0; }
.panel.now { border-color: var(--accent); }
.panel.now > .label { color: var(--accent); font-weight: 500; font-size: 0.875rem; margin-bottom: 0.25rem; }
.rows { list-style: none; margin: 0; padding: 0; }
.rows > li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.25rem 0.75rem; padding: 0.625rem 0; border-top: 1px solid var(--line); }
.rows > li:first-child { border-top: 0; }
.rows .grow { flex: 1 1 12rem; min-width: 0; }
.rows .end { margin-left: auto; text-align: right; }
.rows > li > a:not(.btn) { display: inline-flex; align-items: center; min-height: 2.75rem; }
.rows > li > a.small { min-width: 2.75rem; justify-content: center; }
a.row { color: inherit; text-decoration: none; display: flex; flex-wrap: wrap; gap: 0.25rem 0.75rem; align-items: baseline; width: 100%; min-height: 2.75rem; }
a.row:hover .grow strong { text-decoration: underline; }
dl.kv { display: grid; grid-template-columns: minmax(6.5rem, max-content) minmax(0, 1fr); gap: 0.375rem 1rem; margin: 0; }
dl.kv dt { color: var(--muted); font-size: 0.9375rem; }
dl.kv dd { margin: 0; min-width: 0; }
.today li a { font-size: 1rem; }
.today .count { font-size: 1.25rem; font-weight: 600; min-width: 2.5rem; text-align: right; }
.today .zero { color: var(--muted); font-weight: 500; }
.split { display: grid; gap: 1rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 72em) {
  .split { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); align-items: start; }
  .split > .side { position: sticky; top: 4.25rem; }
}
.cols2 { display: grid; gap: 0.75rem; }
@media (min-width: 40em) { .cols2 { grid-template-columns: 1fr 1fr; } }

/* 표 */
.tw { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r-card); background: var(--card); margin: 0 0 1rem; }
table { border-collapse: collapse; width: 100%; font-size: 0.9375rem; }
th, td { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
th { font-weight: 500; color: var(--muted); font-size: 0.875rem; white-space: nowrap; background: var(--bg); }
tr:last-child td { border-bottom: 0; }
td.n, th.n { text-align: right; white-space: nowrap; }
td.nw { white-space: nowrap; }
tfoot td { font-weight: 500; background: var(--bg); }

/* 버튼·입력 */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.375rem;
  min-height: 2.75rem; padding: 0.5rem 1rem; border-radius: var(--r-btn);
  border: 1px solid var(--accent); background: var(--accent); color: #fff;
  font-weight: 500; text-decoration: none; cursor: pointer; transition: background-color 120ms, border-color 120ms;
  white-space: nowrap;
}
.btn:hover { background: #222cb8; border-color: #222cb8; }
.btn.ghost { background: var(--card); color: var(--ink); border-color: var(--line-strong); }
.btn.ghost:hover { border-color: var(--ink); }
.btn.danger { background: var(--card); color: var(--red); border-color: var(--red); }
.btn.danger:hover { background: #fdf3f2; }
.btn.link { background: none; border-color: transparent; color: var(--accent); padding: 0.5rem 0.25rem; font-weight: 500; }
.btn.sm { min-height: 2.25rem; padding: 0.25rem 0.75rem; font-size: 0.9375rem; }
@media (pointer: coarse) { .btn.sm { min-height: 2.75rem; } }
.btn[disabled], .btn[aria-disabled='true'] { opacity: 0.55; cursor: not-allowed; }
.btns { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; margin-top: 0.75rem; }
.btns.end { justify-content: flex-end; }
.wrapbtn { white-space: normal; text-align: left; }
label.f { display: block; margin: 0 0 0.875rem; }
label.f > span:first-child, .f > .lab { display: block; font-size: 0.9375rem; font-weight: 500; margin-bottom: 0.25rem; }
.hint { display: block; color: var(--muted); font-size: 0.875rem; margin-top: 0.25rem; }
input[type='text'], input[type='email'], input[type='password'], input[type='number'], input[type='date'], input[type='time'], input[type='month'], input[type='search'], input[type='tel'], input[type='url'], input:not([type]), select, textarea {
  width: 100%; min-height: 2.75rem; padding: 0.5rem 0.75rem;
  border: 1px solid var(--line-strong); border-radius: var(--r-btn); background: var(--card);
}
textarea { min-height: 6rem; resize: vertical; line-height: 1.5; }
textarea.short { min-height: 0; resize: none; }
input::placeholder, textarea::placeholder { color: #6b7280; }
input:focus, select:focus, textarea:focus { border-color: var(--accent); outline: 2px solid var(--accent-soft); outline-offset: 0; }
input[aria-invalid='true'] { border-color: var(--red); }
.inline { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: flex-end; }
.inline > label.f { flex: 1 1 9rem; margin: 0; min-width: 0; }
.chips { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.chip { display: inline-flex; align-items: center; gap: 0.375rem; min-height: 2.75rem; padding: 0.375rem 0.75rem; border: 1px solid var(--line-strong); border-radius: var(--r-chip); background: var(--card); cursor: pointer; font-size: 0.9375rem; }
.chip input { width: 1rem; height: 1rem; margin: 0; accent-color: var(--accent); }
.chip:has(input:checked) { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.chip { max-width: 100%; }
.chip > span { min-width: 0; overflow-wrap: anywhere; }
/* 프로필: 고르는 칸 묶음, 재학증명서, 확인 줄 */
fieldset.choice { border: 0; padding: 0; margin: 0 0 0.875rem; min-width: 0; }
fieldset.choice > legend { padding: 0; font-size: 0.9375rem; font-weight: 500; margin-bottom: 0.375rem; }
.cert { border-top: 1px solid var(--line); margin-top: 1rem; padding-top: 0.75rem; }
.cert h3 { font-size: 1rem; margin: 0 0 0.5rem; }
.cert .tag { margin-right: 0.25rem; }
.rows > li.verify { flex-wrap: wrap; align-items: flex-start; }
.rows > li.verify > .btns { margin: 0; }
.tag { display: inline-block; padding: 0 0.375rem; border: 1px solid var(--line-strong); border-radius: var(--r-chip); font-size: 0.8125rem; line-height: 1.5rem; color: var(--muted); white-space: nowrap; }
.tag.on { border-color: var(--accent); color: var(--accent); }
.tag.bad { border-color: var(--red); color: var(--red); }
.tag.done { border-color: var(--green); color: var(--green); }
.check { display: flex; gap: 0.5rem; align-items: flex-start; min-height: 2.75rem; padding: 0.5rem 0; cursor: pointer; }
.check input { width: 1.125rem; height: 1.125rem; margin: 0.2rem 0 0; accent-color: var(--accent); flex: none; }

/* 단계 줄 */
.steps { margin: 0 0 1rem; }
.steps ol { list-style: none; display: flex; gap: 3px; padding: 0; margin: 0 0 0.375rem; }
.steps li { flex: 1 1 0; height: 0.375rem; background: var(--line); border-radius: 1px; }
.steps li.done { background: #8c93a3; }
.steps li.cur { background: var(--accent); }
.steps .now { font-size: 0.9375rem; }
.steps .now strong { color: var(--accent); }
.steps details summary { cursor: pointer; color: var(--muted); font-size: 0.875rem; min-height: 2.75rem; display: inline-flex; align-items: center; }
.steps details ol { display: block; margin: 0.25rem 0 0; }
.steps details li { height: auto; background: none; display: flex; gap: 0.5rem; padding: 0.125rem 0; font-size: 0.9375rem; color: var(--muted); }
.steps details li.cur { color: var(--accent); font-weight: 500; background: none; }
.steps details li.done { color: var(--ink); background: none; }

/* 진행 기록 */
.thread { list-style: none; padding: 0; margin: 0 0 0.75rem; max-height: 34rem; overflow-y: auto; }
.thread li { padding: 0.5rem 0; border-top: 1px solid var(--line); }
.thread li:first-child { border-top: 0; }
.thread .meta { font-size: 0.8125rem; color: var(--muted); display: flex; gap: 0.5rem; flex-wrap: wrap; }
.thread .sys { color: var(--muted); font-size: 0.9375rem; }
.thread .body { white-space: pre-wrap; }
.thread .flag { color: var(--red); font-weight: 500; }
.notice { border: 1px solid var(--red); color: var(--red); border-radius: var(--r-btn); padding: 0.5rem 0.75rem; font-size: 0.9375rem; margin: 0 0 0.5rem; }

/* 후보 카드·보드 */
.cards { display: grid; gap: 0.75rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 13rem), 1fr)); }
.card { border: 1px solid var(--line); border-radius: var(--r-card); padding: 0.75rem; background: var(--card); }
.card .big { font-weight: 500; }
.board { display: flex; gap: 0.75rem; overflow-x: auto; padding-bottom: 0.5rem; align-items: flex-start; }
.board .col { flex: 0 0 15rem; background: var(--card); border: 1px solid var(--line); border-radius: var(--r-card); }
.board .col h2 { font-size: 0.9375rem; padding: 0.5rem 0.75rem; margin: 0; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; gap: 0.5rem; }
.board .col ul { list-style: none; margin: 0; padding: 0; }
.board .col li { border-top: 1px solid var(--line); }
.board .col li:first-child { border-top: 0; }
.board .col a { display: block; padding: 0.5rem 0.75rem; color: inherit; text-decoration: none; min-height: 2.75rem; }
.board .col a:hover strong { text-decoration: underline; }
.board .empty { padding: 0.5rem 0.75rem; color: var(--muted); font-size: 0.875rem; }
.needs { color: var(--accent); font-size: 0.875rem; font-weight: 500; }
.seg { display: inline-flex; border: 1px solid var(--line-strong); border-radius: var(--r-btn); overflow: hidden; }
.seg button { border: 0; background: var(--card); padding: 0.375rem 0.875rem; min-height: 2.75rem; min-width: 2.75rem; cursor: pointer; }
.seg button[aria-pressed='true'] { background: var(--dark); color: #fff; }
.toolbar { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: flex-end; margin: 0 0 1rem; }
.toolbar > label.f { margin: 0; flex: 1 1 9rem; min-width: 0; }
.toolbar > label.f.search { flex: 2 1 15rem; }
.toolbar .btn { flex: none; }
/* 앱 전환(매칭 앱과 견적 계산기 사이): 브랜드 옆, 모든 화면에서 같은 자리 */
.switch { display: flex; }
.btn.switch { min-height: 2.75rem; padding: 0 0.875rem; font-size: 0.875rem; font-weight: 500; color: var(--accent); background: var(--accent-soft); border: 1px solid transparent; border-radius: 999px; }
.btn.switch::after { content: ''; width: 0.4rem; height: 0.4rem; margin-left: 0.375rem; border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor; transform: rotate(45deg); }
.btn.switch:hover { border-color: var(--accent); }

/* 한 칸씩 입력 */
.stepper .count { color: var(--muted); font-size: 0.875rem; }
.stepper .q { font-size: 1.25rem; font-weight: 500; letter-spacing: -0.01em; margin: 0.25rem 0 0.75rem; }
.stepper .box { min-height: 7rem; }
.doc { border: 1px solid var(--line); border-radius: var(--r-btn); padding: 0.75rem; max-height: 14rem; overflow-y: auto; background: var(--bg); white-space: pre-wrap; font-size: 0.9375rem; }
.sum { font-size: 1.125rem; font-weight: 600; }
.facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 9rem), 1fr)); gap: 0.5rem; margin: 0 0 1rem; }
.facts > div { border: 1px solid var(--line); border-radius: var(--r-card); background: var(--card); padding: 0.625rem 0.75rem; }
.facts .k { color: var(--muted); font-size: 0.875rem; }
.facts .v { font-size: 1.0625rem; font-weight: 500; }
.confirm { border: 1px solid var(--dark); border-radius: var(--r-card); padding: 0.75rem; margin-top: 0.5rem; background: var(--card); }
.empty-line { color: var(--muted); margin: 0.25rem 0 0.75rem; }

/* 알림 줄 */
.toast { position: fixed; left: 50%; bottom: 1rem; transform: translateX(-50%); z-index: 50; display: flex; align-items: center; gap: 0.75rem; max-width: calc(100vw - 2rem); padding: 0.625rem 0.875rem; background: var(--dark); color: #fff; border-radius: var(--r-card); font-size: 0.9375rem; }
.toast button { background: none; border: 1px solid #fff; color: #fff; border-radius: var(--r-btn); padding: 0.25rem 0.625rem; min-height: 2.25rem; cursor: pointer; flex: none; }
.toast.bad { background: var(--red); }

.auth { max-width: 26rem; margin: 2rem auto; }
.offline { background: var(--dark); color: #fff; text-align: center; font-size: 0.875rem; padding: 0.375rem 1rem; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
@media print {
  .top, .nav, .rail, .toast, .btns, form { display: none !important; }
  body { background: #fff; }
}

/* 펼치기 */
details > summary { cursor: pointer; min-height: 2.75rem; display: flex; align-items: center; gap: 0.25rem; }
details > summary::-webkit-details-marker { display: none; }
details > summary::before { content: ''; width: 0.4rem; height: 0.4rem; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(-45deg); margin-right: 0.25rem; flex: none; }
details[open] > summary::before { transform: rotate(45deg); }
details.panel > summary { font-weight: 500; }
details.grow > summary { display: block; min-height: 2.75rem; padding: 0.625rem 0; }
details.grow > summary::before { display: inline-block; vertical-align: middle; }
.body { white-space: pre-wrap; overflow-wrap: anywhere; }
dl.kv dd { overflow-wrap: anywhere; }
.btn[aria-disabled='true'] { opacity: 0.6; pointer-events: none; }

/* 자동으로 채워지는 칸(공개 화면과 역할별 홈이 같이 씀): 소식 줄 목록, AI 모델 순위표 */
/* 0.8.0: 0.4.0 대시보드(그림 머리말·타일·배너·소식 카드)와 AI 순위 페이지 모양은 지웠다. 그림 파일은 design/art/에 있다 */
.wire { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); }
.wire li { display: grid; grid-template-columns: minmax(0, 1fr); padding: 0.125rem 0; border-top: 1px solid var(--line); }
.wire li:first-child { border-top: 0; }
.wire-t { display: flex; align-items: center; min-height: 2.75rem; padding: 0.25rem 0; color: var(--ink); text-decoration: none; font-weight: 500; line-height: 1.4; }
a.wire-t:hover { color: var(--accent); text-decoration: underline; }
.wire-m { color: var(--muted); font-size: 0.8125rem; padding-bottom: 0.375rem; }
.wire-m b { color: var(--ink); font-weight: 500; }
.wire-empty { margin: 0; padding: 0.75rem 0; }
.mv { font-size: 0.8125rem; font-weight: 500; padding: 0 0.5rem; border-radius: 999px; line-height: 1.375rem; white-space: nowrap; }
.mv.up { background: #e4f5ec; color: #1d7a4a; }
.mv.down { background: #fdeaea; color: #b3261e; }
.mv.new { background: #fdf1dc; color: #8a5a00; }
.src { margin: 0; }

/* 공개 화면(0.7.0): 홈·소식·AI 순위. 사진·큰 머리말 없이, 첫 화면에서 소식과 순위가 바로 보이게.
   칸은 위쪽 굵은 선 하나로 나누고(카드 그림자·아이콘 없음), 글씨는 굵기 400~600 안에서. */
main:has(> .pub) { max-width: 72rem; padding: 1rem 1rem 2rem; }
.pub { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
.pintro h1 { margin: 0.25rem 0 0.25rem; font-size: 1.375rem; }
.pintro p { margin: 0; font-size: 0.9375rem; }
.pintro .inl { white-space: nowrap; }
.pgrid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem 2rem; align-items: start; }
@media (min-width: 48em) { .pgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 72em) { .pub > .pgrid { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) minmax(0, 1fr); } }
.pbox { min-width: 0; border-top: 2px solid var(--ink); padding-top: 0.5rem; }
.pbox.list { border-top-width: 1px; border-top-color: var(--line-strong); }
.box-head { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; min-height: 2.75rem; }
.box-head h2, .box-head h3 { margin: 0; font-size: 1.0625rem; font-weight: 600; }
.more-link { display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0 0.25rem; font-size: 0.875rem; color: var(--muted); text-decoration: none; white-space: nowrap; }
.more-link::after { content: '›'; margin-left: 0.25rem; }
.more-link:hover { color: var(--accent); text-decoration: underline; }
.pbox .wire-t { font-weight: 450; }
/* 휴대폰: 홈의 칸마다 5줄까지(나머지는 '전체 보기'에서) */
@media (max-width: 47.99em) { .pgrid .wire li:nth-child(n + 6) { display: none; } }
.wire-b { color: var(--muted); margin: -0.25rem 0 0.25rem; white-space: pre-line; }
.pnums { display: flex; flex-wrap: wrap; gap: 0.75rem 2rem; margin: 0.25rem 0 0; }
.pnums dd { margin: 0; }
.pnums strong { font-size: 1.5rem; font-weight: 600; margin-right: 0.25rem; }
.pick { display: flex; flex-wrap: wrap; gap: 0.25rem 0.5rem; margin-top: -0.75rem; }
.pk { display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0 0.875rem; border: 1px solid var(--line-strong); border-radius: 999px; color: var(--ink); background: var(--card); text-decoration: none; font-size: 0.9375rem; }
.pk[aria-current='page'] { border-color: var(--ink); background: var(--ink); color: #fff; }
.pick + .pick .pk { min-height: 2.75rem; font-size: 0.875rem; border-color: var(--line); }
.pick + .pick .pk[aria-current='page'] { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); }
/* 짧은 순위표(홈) */
.mini-tabs { display: flex; gap: 0.25rem; margin: 0 0 0.25rem; }
.mini-tabs button { min-height: 2.75rem; padding: 0 0.75rem; border: 0; border-bottom: 2px solid transparent; background: none; color: var(--muted); cursor: pointer; font-size: 0.9375rem; }
.mini-tabs button[aria-selected='true'] { color: var(--ink); border-bottom-color: var(--accent); font-weight: 500; }
.mini { list-style: none; margin: 0 0 0.5rem; padding: 0; }
.mini li { display: grid; grid-template-columns: 1.5rem minmax(0, 1fr) auto; gap: 0.625rem; align-items: baseline; padding: 0.5rem 0; border-top: 1px solid var(--line); }
.mini .rk { color: var(--muted); text-align: center; }
.mini .nm { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 0.5rem; min-width: 0; }
.mini .nm strong { font-weight: 500; }
.mini .org { text-transform: capitalize; }
.mini .org.as-is { text-transform: none; }
.mini-panel:focus-visible { outline-offset: 4px; }
/* 바닥글 */
.pfoot { border-top: 1px solid var(--line); padding-top: 0.75rem; }
.pfoot nav { display: flex; flex-wrap: wrap; gap: 0 1rem; }
.flink { display: inline-flex; align-items: center; min-height: 2.75rem; min-width: 2.75rem; color: var(--muted); text-decoration: none; font-size: 0.875rem; }
.flink:hover { color: var(--ink); text-decoration: underline; }
.pfoot p { margin: 0.25rem 0 0; }

/* 메뉴 이름이 한 글자·두 글자여도 누르는 영역 44px */
.nav a { min-width: 2.75rem; justify-content: center; }
@media (min-width: 64em) { .wide .nav a { justify-content: flex-start; } }
/* 소식 관리 */
.postform { padding: 0.5rem 0 0.25rem; }
.postform p.hint { margin: -0.5rem 0 0.875rem; }
.postform .now-img { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; margin: 0 0 0.875rem; }
.postform .now-img img { width: 10rem; max-width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 0.5rem; border: 1px solid var(--line); }
input[type='file'] { max-width: 100%; min-height: 2.75rem; font-size: 0.9375rem; }
.preview { max-width: 68rem; }

/* 소식 대표 사진(0.8.0): 사진이 있는 줄만 오른쪽 작은 사진(4:3, 6rem). 사진이 없는 줄은 빈 칸 없이 글이 넓다.
   lead(공개 홈·소식 페이지 첫 줄)는 넓은 화면에서 큰 사진(16:9), 휴대폰 폭에서는 작은 사진 */
.wire li.has-img { grid-template-columns: minmax(0, 1fr) 6rem; column-gap: 0.75rem; align-items: start; }
.wire li.has-img > :not(.wire-img) { grid-column: 1; }
.wire li.has-img > .wire-img { grid-column: 2; grid-row: 1 / span 3; }
.wire-img { display: block; width: 6rem; height: auto; aspect-ratio: 4 / 3; object-fit: cover; margin: 0.5rem 0; border-radius: var(--r-chip); background: var(--line); }
@media (min-width: 48em) {
  .wire li.lead { grid-template-columns: minmax(0, 1fr); }
  .wire li.lead > .wire-img { grid-column: 1; grid-row: 1; width: 100%; max-width: 32rem; aspect-ratio: 16 / 9; margin: 0.5rem 0 0.25rem; }
}
.mini-more { justify-self: start; padding-left: 0; }
.mini-panel .src { margin-top: 0.25rem; }

/* 홈 첫 칸 '지금 진행 중'(0.8.0) */
.pbox.now { border-top-color: var(--accent); }
.nowlist { list-style: none; margin: 0; padding: 0; }
.nowlist li { border-top: 1px solid var(--line); }
.nowlist li:first-child { border-top: 0; }
.nowrow { display: grid; gap: 0.25rem; padding: 0.625rem 0; min-height: 2.75rem; color: inherit; text-decoration: none; }
.nowrow strong { font-size: 1.0625rem; font-weight: 600; }
.nowrow:hover strong { color: var(--accent); text-decoration: underline; }
.steps { display: flex; gap: 3px; max-width: 28rem; }
.steps i { flex: 1 1 0; height: 0.375rem; border-radius: 999px; background: var(--line); }
.steps i.done { background: #8c93a3; }
.steps i.cur { background: var(--accent); }
a.needs { display: inline-flex; align-items: center; min-height: 2.75rem; }

/* 프로필 레일(0.8.0): 좁은 화면은 메뉴 아래 한 줄 카드(누르면 펼침), 64em(글자 16px이면 1024px) 이상은 왼쪽 18rem 칸이 화면을 따라온다 */
.rail { padding: 0.75rem 1rem 0; }
.rail-in { max-width: 42rem; margin: 0 auto; }
.shell:has(main > .pub) .rail-in { max-width: 72rem; }
.rail-box { background: var(--card); border: 1px solid var(--line); border-radius: var(--r-card); }
.rail-box > summary { gap: 0.625rem; min-height: 3.25rem; padding: 0.5rem 0.875rem; list-style: none; }
.rail-box > summary::before { display: none; }
.rail-box > summary::after { content: ''; flex: none; width: 0.45rem; height: 0.45rem; margin: 0 0.25rem 0 auto; border-right: 1.5px solid var(--muted); border-bottom: 1.5px solid var(--muted); transform: rotate(45deg); }
.rail-box[open] > summary::after { transform: rotate(225deg); }
.ava { display: inline-grid; place-items: center; flex: none; width: 2.25rem; height: 2.25rem; border-radius: 50%; background: var(--accent-soft); color: var(--accent); font-weight: 600; }
.who-n { display: grid; min-width: 0; line-height: 1.35; }
.who-n strong { font-weight: 600; }
.rail-head { display: flex; flex-wrap: wrap; gap: 0.25rem; min-width: 0; }
.rail-box[open] .rail-head { display: none; }
.rail-body { display: grid; gap: 0.625rem; padding: 0 0.875rem 0.875rem; }
.rail-body > p { margin: 0; }
.rail-body > .btn { justify-self: start; }
.badges { display: flex; flex-wrap: wrap; gap: 0.25rem; }
.rail-kv { display: grid; gap: 0.5rem; margin: 0; }
.rail-kv dt { color: var(--muted); font-size: 0.8125rem; }
.rail-kv dd { margin: 0; font-size: 0.9375rem; }
.rail-kv dd .badges { margin-top: 0.25rem; }
.rail-kv a { display: inline-flex; align-items: center; min-height: 2.75rem; min-width: 2.75rem; }
.score { display: grid; gap: 0.25rem; }
.meter { position: relative; display: block; height: 0.375rem; overflow: hidden; border-radius: 999px; background: var(--line); }
.meter::after { content: ''; position: absolute; inset: 0 auto 0 0; width: var(--w, 0%); border-radius: 999px; background: var(--accent); }
.rail-list { list-style: none; margin: 0; padding: 0; }
.rail-list a { display: flex; align-items: center; gap: 0.5rem; min-height: 2.75rem; border-top: 1px solid var(--line); color: var(--ink); text-decoration: none; font-size: 0.9375rem; }
.rail-list li:first-child a { border-top: 0; }
.rail-list a:hover .grow { text-decoration: underline; }
.rail-list .grow { flex: 1 1 auto; min-width: 0; }
.rail-list .num { font-weight: 600; }
.rail-list.sub .num { font-weight: 500; color: var(--muted); }
@media (min-width: 64em) {
  .has-rail .shell { display: grid; grid-template-columns: 18rem minmax(0, 1fr); grid-template-areas: 'nav nav' 'rail main'; align-items: start; }
  .has-rail .nav { grid-area: nav; }
  .has-rail .rail { grid-area: rail; position: sticky; top: 3.25rem; max-height: calc(100vh - 3.25rem); overflow-y: auto; padding: 1rem 0 1rem 1rem; }
  .has-rail .rail-in { max-width: none; }
  .has-rail main { grid-area: main; margin: 0; padding: 1rem 1.5rem 3rem; }
  .has-rail main:has(> .pub) { max-width: 72rem; }
  /* 운영: 왼쪽 칸 위에 레일, 아래에 세로 메뉴 */
  .wide.has-rail .shell { grid-template-columns: 15rem minmax(0, 1fr); grid-template-areas: 'rail main' 'nav main'; grid-template-rows: auto 1fr; align-items: stretch; }
  .wide.has-rail .rail { position: static; max-height: none; padding: 0.75rem 0.75rem 0; background: var(--card); border-right: 1px solid var(--line); }
  .wide.has-rail .rail-box { border-color: var(--line); }
  .wide.has-rail main { padding: 1.25rem 1.5rem 3rem; }
}