:root {
  --navy:#153f57;
  --navy-deep:#0e2e41;
  --teal:#16837a;
  --teal-dark:#0f6963;
  --ink:#172b3a;
  --muted:#617381;
  --line:#d8e2e8;
  --line-strong:#b9cbd5;
  --surface:#ffffff;
  --surface-soft:#f4f8fa;
  --surface-teal:#edf8f6;
  --warn:#fff8e8;
  --danger:#a63232;
  --danger-soft:#fff1f1;
  --shadow:0 18px 54px rgba(20,55,74,.10);
  --radius:18px;
}

* { box-sizing:border-box; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
html { scroll-behavior:smooth; }
body {
  margin:0;
  min-width:320px;
  background:
    radial-gradient(circle at 10% 0%, rgba(22,131,122,.08), transparent 28rem),
    linear-gradient(180deg,#f7fafb 0,#edf3f6 100%);
  color:var(--ink);
  font-family:"Pretendard","Noto Sans KR","Malgun Gothic","Apple SD Gothic Neo",sans-serif;
  font-size:16px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}

.skip-link { position:fixed; left:16px; top:-80px; z-index:100; padding:10px 16px; border-radius:8px; background:var(--navy-deep); color:#fff; }
.skip-link:focus { top:12px; }

.site-header { position:sticky; top:0; z-index:20; border-bottom:1px solid rgba(185,203,213,.8); background:rgba(255,255,255,.92); backdrop-filter:blur(14px); }
.header-inner { width:min(1120px,calc(100% - 40px)); min-height:76px; margin:auto; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:flex; align-items:center; gap:12px; color:var(--ink); text-decoration:none; }
.brand-mark { display:grid; place-items:center; width:42px; height:42px; border-radius:12px; background:linear-gradient(145deg,var(--navy),var(--teal)); color:#fff; font-weight:800; letter-spacing:-.04em; box-shadow:0 8px 18px rgba(21,63,87,.22); }
.brand-copy { display:flex; flex-direction:column; line-height:1.28; }
.brand-copy strong { font-size:.98rem; }
.brand-copy small { color:var(--muted); font-size:.78rem; }
.target-chip { display:flex; align-items:center; gap:10px; max-width:45%; padding:8px 13px; border:1px solid #cde2df; border-radius:999px; background:var(--surface-teal); font-size:.86rem; white-space:nowrap; overflow:hidden; }
.target-chip span { color:var(--muted); }
.target-chip strong { overflow:hidden; text-overflow:ellipsis; }

.progress-area { width:min(1120px,calc(100% - 40px)); margin:0 auto; padding:0 0 11px; }
.progress-copy { display:flex; justify-content:space-between; margin-bottom:6px; color:var(--muted); font-size:.8rem; }
.progress-copy strong { color:var(--teal-dark); }
.progress-track { height:5px; overflow:hidden; border-radius:999px; background:#e6eef2; }
.progress-track span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--teal),#42a69d); transition:width .35s ease; }

.survey-shell { width:min(1040px,calc(100% - 40px)); min-height:calc(100vh - 180px); margin:36px auto 72px; outline:none; }
.card { position:relative; overflow:hidden; padding:clamp(28px,5vw,58px); border:1px solid rgba(185,203,213,.8); border-radius:var(--radius); background:var(--surface); box-shadow:var(--shadow); }
.card::before { content:""; position:absolute; inset:0 0 auto; height:4px; background:linear-gradient(90deg,var(--navy),var(--teal)); }

h1,h2,h3 { color:var(--navy-deep); line-height:1.42; letter-spacing:-.025em; }
h1 { margin:0 0 18px; font-size:clamp(1.45rem,3vw,2rem); }
h2 { margin:34px 0 14px; font-size:clamp(1.12rem,2vw,1.35rem); }
p { margin:10px 0; }
ul,ol { padding-left:1.45rem; }
li + li { margin-top:6px; }
strong { font-weight:750; }
code { padding:.1em .38em; border-radius:5px; background:#eaf1f4; color:var(--navy-deep); font-family:inherit; font-weight:700; }

.intro { max-width:820px; margin:auto; }
.intro h1 { margin-bottom:4px; }
.intro h2 { margin:0 0 24px; color:var(--teal-dark); }
.plain-list { margin:26px 0; padding:20px 24px; border:1px solid var(--line); border-radius:14px; background:var(--surface-soft); list-style:none; }
.plain-list li { display:grid; grid-template-columns:minmax(90px,auto) 1fr; }
.institution-banner { display:flex; justify-content:space-between; gap:16px; margin:22px 0; padding:16px 20px; border:1px solid #bcded9; border-radius:12px; background:linear-gradient(135deg,#edf9f7,#f7fbfb); color:var(--teal-dark); }

.question-header { display:flex; gap:18px; align-items:flex-start; margin-bottom:28px; padding-bottom:24px; border-bottom:1px solid var(--line); }
.question-header h1 { margin-bottom:8px; }
.question-number { flex:none; padding:5px 11px; border-radius:9px; background:var(--navy); color:#fff; font-size:1rem; font-weight:800; white-space:nowrap; }

.notice,.prior-response,.final-confirm { margin:26px 0; padding:22px 24px; border-radius:14px; }
.notice { border-left:4px solid #dcaa39; background:var(--warn); }
.notice h2 { margin-top:0; }
.prior-response { border:1px solid #bcded9; background:var(--surface-teal); }
.prior-response h2 { margin:0 0 8px; font-size:1.12rem; }
.prior-response p { margin:6px 0; }
.final-confirm { border:1px solid #d8c58d; background:var(--warn); text-align:center; }

.table-wrap { margin:22px 0; overflow-x:auto; border:1px solid var(--line); border-radius:14px; }
table { width:100%; border-collapse:separate; border-spacing:0; background:#fff; }
th,td { padding:15px 16px; border:0; border-bottom:1px solid var(--line); text-align:center; vertical-align:middle; }
tr:last-child > * { border-bottom:0; }
thead th { background:var(--navy); color:#fff; font-size:.92rem; font-weight:700; }
th[scope=row],tbody th { min-width:260px; background:#f8fafb; color:var(--ink); text-align:left; font-weight:650; }
tbody tr { transition:background .16s ease,box-shadow .16s ease; }
tbody tr.is-selected { background:#eef9f7; box-shadow:inset 4px 0 var(--teal); }
tbody tr:hover { background:#f7fbfc; }
.response-example-table tbody td { text-align:left; }
.choice-table { table-layout:fixed; }
.choice-table th:first-child { width:auto; }
.choice-table th:nth-child(2),.choice-table th:nth-child(3),.choice-table th:nth-child(4),
.choice-table .choice-cell { width:104px; }
.choice-table .choice-cell { padding:0; }
.choice-table .choice-cell label { display:grid; place-items:center; width:100%; min-height:66px; padding:15px; cursor:pointer; }
.choice-table .choice-cell:hover { background:#e8f6f3; }
.choice-table .choice-cell:has(input:checked) { background:#dff3ef; box-shadow:inset 0 0 0 2px rgba(22,131,122,.24); }
.choice-table .choice-cell:focus-within { position:relative; z-index:1; outline:3px solid rgba(22,131,122,.25); outline-offset:-3px; }
.choice-table .choice-cell input:focus { outline:none; }
.other-entry-table { table-layout:fixed; }
.other-entry-table thead th:first-child { width:32%; }
.other-entry-table tbody th { min-width:0; padding-left:24px; }
.other-entry-table td { padding:12px 14px; background:#fff; }
.other-entry-table .wide-input { display:block; width:100%; max-width:none; min-height:48px; padding:11px 14px; border:1px solid #b8c8d0; border-radius:9px; background:#fbfdfe; box-shadow:inset 0 1px 2px rgba(20,55,74,.04); }
.other-entry-table .wide-input:hover { border-color:#8eabb8; background:#fff; }
.other-entry-table .wide-input:focus { border-color:var(--teal); background:#fff; box-shadow:0 0 0 4px rgba(22,131,122,.12); }

fieldset { min-width:0; }
.staff-block { margin:24px 0; padding:22px; border:1px solid var(--line); border-radius:14px; background:#fbfcfd; }
.staff-block legend { padding:0 10px; color:var(--navy-deep); font-size:1.02rem; font-weight:800; }
.staff-total-row { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:18px; padding:14px 16px; border:1px solid #cbdde4; border-radius:11px; background:#f3f8fa; }
.staff-total-row label { display:grid; grid-template-columns:auto 76px 20px; align-items:center; gap:7px; font-weight:750; }
.staff-total-row input[type=number] { width:76px; }
.character-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; margin:28px 0 14px; }
.character-heading h2 { margin:0; }
.remaining-count { margin:0; padding:6px 11px; border:1px solid #efc7c7; border-radius:999px; background:#fff0f0; color:#a63232; font-size:.86rem; font-weight:800; }
.remaining-count.is-complete { background:#dff3ee; color:var(--teal-dark); }
.remaining-count.is-over { border-color:#d88d8d; background:#f9dddd; color:#8f2020; }
.character-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-bottom:18px; }
.character-grid label { display:grid; grid-template-columns:minmax(0,1fr) 76px 20px; align-items:center; gap:8px; min-height:66px; padding:11px 12px; border:1px solid var(--line); border-radius:10px; background:#fff; }
.character-grid input[type=number] { width:76px; justify-self:end; }
.reason-list label { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:12px 14px; border:1px solid var(--line); border-radius:10px; background:#fff; }
.character-grid label.has-value { border-color:#8dcac3; background:var(--surface-teal); box-shadow:inset 3px 0 var(--teal); }
.character-etc-row { display:grid; grid-template-columns:170px minmax(0,1fr); align-items:center; gap:14px; margin-top:18px; padding-top:18px; border-top:1px solid var(--line); color:var(--navy-deep); font-weight:700; }
.character-etc-row[hidden] { display:none; }
.character-etc-row .wide-input { width:100%; max-width:none; min-height:48px; padding:11px 14px; border:1px solid #b8c8d0; border-radius:9px; background:#fbfdfe; box-shadow:inset 0 1px 2px rgba(20,55,74,.04); }
.character-etc-row .wide-input:hover { border-color:#8eabb8; background:#fff; }
.character-etc-row .wide-input:focus { border-color:var(--teal); background:#fff; box-shadow:0 0 0 4px rgba(22,131,122,.12); }
.reason-list { display:grid; gap:10px; margin:22px 0; }
.reason-list label { justify-content:flex-start; cursor:pointer; transition:border-color .15s ease,background .15s ease; }
.reason-list label:has(input:checked) { border-color:var(--teal); background:var(--surface-teal); }
.person-row { display:flex; flex-wrap:wrap; align-items:center; gap:12px 22px; padding:16px 0; border-bottom:1px solid var(--line); }
.person-row:last-child { border-bottom:0; }
.person-row strong { min-width:72px; color:var(--navy); }
.person-row label { display:inline-flex; align-items:center; gap:7px; }
.assignment-person { margin:18px 0 28px; }
.assignment-person:last-child { margin-bottom:0; }
.assignment-person h2 { margin:0 0 12px; font-size:1rem; }
.assignment-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.program-assignment { padding:14px; border:1px solid var(--line); border-radius:12px; background:#f6f8f9; transition:border-color .15s ease,background .15s ease,box-shadow .15s ease; }
.program-assignment.is-active { border-color:#8dcac3; background:var(--surface-teal); box-shadow:inset 3px 0 var(--teal); }
.program-choice { display:flex; align-items:center; gap:9px; cursor:pointer; }
.time-range { display:grid; grid-template-columns:1fr auto 1fr; align-items:end; gap:8px; margin-top:13px; }
.time-range[hidden] { display:none; }
.time-range label { display:grid; gap:4px; color:var(--muted); font-size:.78rem; font-weight:700; }
.time-range input[type=time] { width:100%; min-width:0; }
.time-range input:disabled { background:#e9eef0; }

input,select,button { font:inherit; }
input[type=text],input[type=number],input[type=time],select { min-height:44px; padding:9px 11px; border:1px solid var(--line-strong); border-radius:9px; background:#fff; color:var(--ink); transition:border-color .15s ease,box-shadow .15s ease; }
input[type=number] { width:84px; text-align:right; }
input[type=time] { min-width:132px; }
input[type=radio],input[type=checkbox] { width:19px; height:19px; margin:0; accent-color:var(--teal); cursor:pointer; }
input:focus,select:focus,button:focus-visible,a:focus-visible { outline:3px solid rgba(22,131,122,.2); outline-offset:2px; border-color:var(--teal); }
input:disabled { cursor:not-allowed; opacity:.5; }
.wide-input { width:min(620px,100%); }
.detail-input { width:min(240px,100%); margin-left:8px; }

.confirm { display:block; margin-top:18px; padding:18px 20px; border:1px solid #dbc479; border-radius:12px; background:var(--warn); }
.confirm-dialog { width:min(560px,calc(100% - 32px)); padding:30px; border:0; border-radius:18px; background:#fff; color:var(--ink); box-shadow:0 28px 90px rgba(8,32,45,.3); }
.confirm-dialog::backdrop { background:rgba(8,30,42,.58); backdrop-filter:blur(3px); }
.confirm-dialog .dialog-mark { display:grid; place-items:center; width:44px; height:44px; margin-bottom:16px; border-radius:50%; background:#fff0e2; color:#a75b18; font-size:1.35rem; font-weight:900; }
.confirm-dialog h2 { margin:0 0 16px; }
.confirm-dialog [data-large-count-message] { padding:14px 16px; border:1px solid #efd4ad; border-radius:11px; background:#fff8ed; }
.confirm-dialog [data-large-count-message] p { margin:5px 0; }
.confirm-dialog > p { color:var(--muted); }
.dialog-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:24px; padding-top:18px; border-top:1px solid var(--line); }
.messages { margin:0 0 18px; padding:16px 20px; border:1px solid #e0a9a9; border-radius:12px; background:var(--danger-soft); color:var(--danger); box-shadow:0 8px 24px rgba(166,50,50,.08); }
.messages strong { display:block; margin-bottom:4px; }
.messages p { margin:3px 0; }

.actions { position:relative; display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:36px; padding-top:24px; border-top:1px solid var(--line); }
.primary,.secondary { display:inline-flex; align-items:center; justify-content:center; min-width:124px; min-height:48px; padding:11px 24px; border:1px solid transparent; border-radius:10px; font-weight:750; text-align:center; text-decoration:none; cursor:pointer; transition:transform .15s ease,box-shadow .15s ease,background .15s ease; }
.primary { margin-left:auto; background:linear-gradient(135deg,var(--navy),#236b83); color:#fff; box-shadow:0 8px 18px rgba(21,63,87,.2); }
.primary:hover { transform:translateY(-1px); box-shadow:0 11px 24px rgba(21,63,87,.26); }
.primary:disabled { transform:none; cursor:wait; opacity:.65; }
.secondary { border-color:var(--line); background:#f2f6f8; color:var(--ink); }
.secondary:hover { background:#e8f0f3; }
.complete { max-width:700px; margin:8vh auto 0; padding-top:76px; padding-bottom:76px; text-align:center; }
.complete h1::before { content:"✓"; display:grid; place-items:center; width:56px; height:56px; margin:0 auto 20px; border-radius:50%; background:var(--surface-teal); color:var(--teal); font-size:1.7rem; }
.site-footer { padding:0 20px 30px; color:#71828e; font-size:.8rem; text-align:center; }

@media (max-width:760px) {
  body { font-size:15px; }
  .header-inner,.progress-area,.survey-shell { width:min(100% - 24px,1040px); }
  .header-inner { min-height:68px; }
  .brand-copy small { display:none; }
  .target-chip { max-width:48%; padding:7px 10px; }
  .target-chip span { display:none; }
  .survey-shell { margin-top:18px; margin-bottom:42px; }
  .card { padding:24px 18px; border-radius:14px; }
  .question-header { gap:10px; }
  .question-number { padding:4px 8px; }
  .character-grid { grid-template-columns:1fr; }
  .character-grid label { grid-template-columns:minmax(0,1fr) 72px 18px; min-height:58px; }
  .character-grid input[type=number] { width:72px; }
  .character-etc-row { grid-template-columns:1fr; gap:7px; }
  .table-wrap { margin-left:-4px; margin-right:-4px; }
  th,td { padding:12px 10px; }
  th[scope=row],tbody th { min-width:210px; }
  .choice-table .choice-cell label { min-height:58px; padding:12px 8px; }
  .choice-table th:nth-child(2),.choice-table th:nth-child(3),.choice-table th:nth-child(4),
  .choice-table .choice-cell { width:72px; min-width:72px; }
  .other-entry-table thead th:first-child { width:27%; }
  .other-entry-table tbody th { min-width:92px; padding-left:14px; }
  .other-entry-table td { padding:9px; }
  .response-example-table { table-layout:fixed; }
  .response-example-table thead th:first-child,
  .response-example-table tbody th { width:30%; min-width:0; }
  .response-example-table thead th:nth-child(2),
  .response-example-table tbody td { width:70%; }
  .staff-block { padding:18px 14px; }
  .staff-total-row { align-items:flex-start; flex-direction:column; }
  .character-heading { align-items:flex-start; }
  .person-row { align-items:flex-start; flex-direction:column; gap:9px; }
  .person-row label { width:100%; justify-content:space-between; }
  .assignment-grid { grid-template-columns:1fr; }
  .actions { position:sticky; bottom:0; z-index:10; margin:28px -18px -24px; padding:14px 18px; border-top:1px solid var(--line); background:rgba(255,255,255,.95); backdrop-filter:blur(10px); }
  .primary,.secondary { min-width:0; flex:1; }
  .confirm-dialog { padding:24px 20px; }
}

@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; }
}