:root {
  color:#17322d;
  background:#f5f2e9;
  font-family:Inter,Pretendard,"Noto Sans KR",system-ui,sans-serif;
  font-synthesis:none;
}
* { box-sizing:border-box; }
[hidden] { display:none!important; }
body { margin:0;min-width:320px; }
button,input,select { font:inherit; }
button,select,input[type="file"],summary { cursor:pointer; }
button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,a:focus-visible { outline:3px solid #c86b3c;outline-offset:3px; }

.skip-link { position:fixed;left:1rem;top:-5rem;z-index:20;padding:.75rem 1rem;background:#fff;color:#17322d;border-radius:.5rem; }
.skip-link:focus { top:1rem; }
.site-header { display:flex;align-items:center;justify-content:space-between;max-width:1120px;margin:0 auto;padding:1rem 1.25rem; }
.brand { display:inline-flex;align-items:center;gap:.65rem;color:inherit;text-decoration:none;font-weight:800;letter-spacing:-.02em; }
.brand-mark { display:grid;place-items:center;width:2rem;height:2rem;border-radius:.65rem;color:#fff;background:#24564c; }
.language-label { display:flex;align-items:center;gap:.55rem;font-size:.86rem; }
.language-label select { border:1px solid #b9c4bd;border-radius:.6rem;padding:.45rem .6rem;background:#fff;color:inherit; }

main { width:min(920px,calc(100% - 2rem));margin:0 auto 4rem; }
.hero { padding:4.4rem 0 2.2rem;text-align:center; }
.eyebrow { margin:0 0 .65rem;color:#7e4f34;font-size:.78rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase; }
h1 { max-width:820px;margin:0 auto;font-family:Georgia,"Noto Serif KR",serif;font-size:clamp(2.35rem,6vw,4.9rem);line-height:1.03;letter-spacing:-.05em; }
.lead { max-width:690px;margin:1.2rem auto;color:#52635e;font-size:clamp(1rem,2vw,1.15rem);line-height:1.65; }
.privacy-proof { display:inline-flex;gap:.55rem;align-items:center;margin:.2rem auto 1.2rem;padding:.6rem .85rem;border:1px solid #b8d2c8;border-radius:999px;background:#e9f4ef;color:#285a4d;font-size:.85rem;font-weight:700; }

.stepper { display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.45rem;margin:0 0 1rem;padding:0;list-style:none; }
.stepper li { display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:.45rem;min-width:0;padding:.7rem;border:1px solid #d8d2c5;border-radius:.75rem;background:rgba(255,255,255,.58);color:#66736e; }
.stepper li span { display:grid;place-items:center;width:1.55rem;height:1.55rem;border-radius:50%;background:#dedbd2;font-size:.75rem;font-weight:800; }
.stepper li strong { overflow:hidden;font-size:.76rem;text-overflow:ellipsis;white-space:nowrap; }
.stepper li[aria-current="step"] { border-color:#8aac9f;background:#edf5f1;color:#17322d; }
.stepper li[aria-current="step"] span,.stepper li[data-complete="true"] span { background:#24564c;color:#fff; }

.panel { padding:clamp(1.25rem,4vw,2rem);border:1px solid #d8d2c5;border-radius:1.25rem;background:rgba(255,255,255,.86);box-shadow:0 12px 42px rgba(41,54,48,.06); }
.step-heading { display:flex;gap:1rem;align-items:flex-start; }
.step-heading > span { display:grid;flex:0 0 auto;place-items:center;width:2rem;height:2rem;border-radius:50%;background:#24564c;color:#fff;font-weight:800; }
.step-heading h2,.result h2 { margin:0;font-size:clamp(1.35rem,4vw,1.9rem);letter-spacing:-.025em; }
.step-heading p,.result-lead { margin:.35rem 0 0;color:#68766f;line-height:1.55; }
.file-picker { display:grid;gap:.35rem;margin-top:1.4rem;padding:1.15rem;border:1px dashed #7b9b90;border-radius:.9rem;background:#f5faf7; }
.file-picker span { color:#65756f;font-size:.83rem; }
.file-picker input { width:100%;min-width:0;margin-top:.45rem;max-width:100%; }
.file-picker-optional { background:#faf9f5;border-color:#aea99e; }
.file-info { margin-top:1rem;padding:.85rem 1rem;border-radius:.65rem;background:#edf3ef;color:#39564e;font-size:.9rem; }
.profile-note,.guided-note { margin:.8rem 0 0;color:#5e6c66;font-size:.84rem;line-height:1.5; }
.file-info strong { display:block;margin-bottom:.25rem; }
.header-list { display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.45rem; }
.header-list code { padding:.2rem .45rem;border-radius:.35rem;background:#fff;color:#354e47; }
.help-details,.result-preview,.technical,.error-technical { margin-top:1rem; }
.help-details summary,.result-preview summary,.technical summary,.error-technical summary { font-weight:800; }
.help-details p,.technical p { color:#5e6c66;line-height:1.55; }

.mapping-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem;margin-top:1.25rem; }
.mapping-card { display:grid;gap:.45rem;min-width:0;padding:1rem;border:1px solid #d7ddd8;border-radius:.8rem;background:#fafcfb; }
.mapping-card label { display:grid;gap:.35rem;color:#435750;font-size:.9rem;font-weight:750; }
.mapping-card select,.rule-other input { width:100%;min-height:2.7rem;padding:.55rem .7rem;border:1px solid #b9c4bd;border-radius:.55rem;background:#fff;color:#17322d; }
.mapping-example { margin:0;color:#68766f;font-size:.78rem;line-height:1.45;overflow-wrap:anywhere; }
.mapping-suggestion { color:#285a4d;font-size:.75rem;font-weight:750; }
.choice-box { display:flex;flex-wrap:wrap;gap:1rem;margin:1.2rem 0 0;padding:1rem;border:1px solid #d8d2c5;border-radius:.8rem; }
.choice-box legend { padding:0 .35rem;font-weight:800; }
.choice-box label { display:flex;align-items:center;gap:.35rem; }

.rule-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:1.2rem; }
.rule-grid fieldset { min-width:0;padding:1rem;border:1px solid #d8d2c5;border-radius:.85rem; }
.rule-grid legend { padding:0 .4rem;font-weight:800; }
.rule-choices { display:grid;gap:.55rem; }
.rule-choices label { display:flex;align-items:flex-start;gap:.45rem;line-height:1.4; }
.rule-other { display:grid;gap:.35rem;margin-top:.9rem;color:#52635e;font-size:.82rem; }
.step-actions { display:flex;justify-content:space-between;gap:.65rem;margin-top:1.4rem;border-top:1px solid #e2ddd3;padding-top:1rem; }

.button { display:inline-flex;align-items:center;justify-content:center;min-height:2.8rem;margin:1.1rem .45rem 0 0;padding:.7rem 1.05rem;border:0;border-radius:.7rem;font-weight:800;text-decoration:none; }
.step-actions .button { margin:0; }
.button-primary { color:#fff;background:#24564c;box-shadow:0 8px 20px rgba(36,86,76,.18); }
.button-primary:hover { background:#193f37; }
.button-secondary { color:#24564c;background:#e7f0ec; }
.button-quiet { color:#5b6762;background:#efede7; }
.status { min-height:1.4rem;margin:1rem 0 0;color:#285a4d;font-weight:700; }
.status[data-error="true"] { color:#9a3e27; }
.error-technical code { display:block;overflow-wrap:anywhere;padding:.75rem;border-radius:.5rem;background:#fff;color:#7c3928; }

.result { border-color:#98b9ad;background:#fafffc; }
.result-caution { margin:.85rem 0 0;padding:.75rem .85rem;border-left:3px solid #b96d3e;background:#fff4eb;color:#68432f;line-height:1.55; }
.summary-grid { display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.7rem;margin-top:1.2rem; }
.summary-card { min-width:0;padding:1rem;border-radius:.75rem;background:#edf5f1; }
.summary-card strong { display:block;font-size:1.55rem; }
.summary-card span { display:block;color:#52635e;font-size:.8rem;line-height:1.4; }
.download-row { display:flex;flex-wrap:wrap;margin-top:.45rem; }
.download-note { margin:.65rem 0;color:#68766f;font-size:.84rem; }
.result-columns { display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1rem; }
.result-columns > section { min-width:0; }
.result-columns h3 { font-size:1rem; }
.table-wrap { max-height:23rem;overflow:auto;border:1px solid #d2dfd9;border-radius:.65rem;background:#fff; }
table { width:100%;border-collapse:collapse;font-size:.78rem;white-space:nowrap; }
th,td { max-width:15rem;padding:.5rem .6rem;overflow:hidden;border-bottom:1px solid #e4e8e5;text-align:left;text-overflow:ellipsis; }
th { position:sticky;top:0;background:#eaf2ee; }
.technical-downloads { display:flex;flex-wrap:wrap;gap:.55rem;margin:.8rem 0; }
.technical-downloads a { color:#24564c;font-weight:750; }
.technical pre { overflow:auto;padding:1rem;border-radius:.6rem;background:#152622;color:#d9ede5;font-size:.75rem; }
footer { display:flex;justify-content:space-between;max-width:920px;margin:0 auto;padding:1.5rem 1rem 3rem;color:#6c756f;font-size:.78rem; }

html[data-embedded="true"] .site-header,html[data-embedded="true"] footer { display:none; }
html[data-embedded="true"] .hero { padding:1.4rem 0 1rem; }
html[data-embedded="true"] .hero .eyebrow,html[data-embedded="true"] .hero h1 { position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0); }
html[data-embedded="true"] main { margin-top:0; }

@media (max-width:760px) {
  .stepper { grid-template-columns:repeat(5,1fr); }
  .stepper li { display:grid;place-items:center;padding:.55rem .25rem; }
  .stepper li strong { position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0); }
  .mapping-grid,.rule-grid,.result-columns { grid-template-columns:1fr; }
  .summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:520px) {
  .site-header { align-items:flex-start; }
  .language-label > span { position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0); }
  .hero { padding-top:2.7rem; }
  h1 { font-size:clamp(2rem,12vw,3.4rem); }
  .button,.download-row .button { width:100%;margin-right:0; }
  .step-actions { flex-direction:column-reverse; }
  .step-actions .button { width:100%; }
  .summary-grid { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; } }