:root {
  --bg:#f4f6f8; --card:#fff; --text:#20242a; --muted:#69707a;
  --primary:#2457d6; --border:#dde2e8; --danger:#b42318; --success:#027a48;
}
* { box-sizing:border-box; }
body { margin:0; font-family:Arial,"Noto Sans KR",sans-serif; background:var(--bg); color:var(--text); }
a { color:inherit; text-decoration:none; }
.topbar { height:64px; background:#111827; color:white; display:flex; align-items:center; justify-content:space-between; padding:0 28px; }
.brand { font-size:22px; font-weight:800; }
.toplinks { display:flex; gap:18px; align-items:center; font-size:14px; }
.container { width:min(1120px, calc(100% - 28px)); margin:34px auto; min-height:calc(100vh - 160px); }
footer { text-align:center; color:var(--muted); padding:22px; font-size:13px; }
.hero { text-align:center; padding:42px 0 20px; }
.hero h1 { margin:16px 0 12px; font-size:44px; }
.hero > p { color:var(--muted); font-size:18px; }
.pill { display:inline-block; border:1px solid #b8c7f3; background:#eef3ff; color:#244ca5; border-radius:99px; padding:8px 14px; font-size:13px; }
.card { background:var(--card); border:1px solid var(--border); border-radius:16px; padding:24px; box-shadow:0 8px 24px rgba(15,23,42,.05); }
.start-card { width:min(560px,100%); margin:34px auto 0; }
.start-card form { display:flex; gap:10px; }
input, textarea, select { width:100%; border:1px solid var(--border); border-radius:10px; padding:12px; font:inherit; background:white; }
textarea { resize:vertical; line-height:1.6; }
button, .button-link { border:0; border-radius:10px; padding:12px 18px; background:var(--primary); color:white; font-weight:700; cursor:pointer; white-space:nowrap; }
.sub-link { display:inline-block; margin-top:16px; color:var(--primary); font-size:14px; }
.features { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:28px 0; }
.features article { background:white; border:1px solid var(--border); border-radius:14px; padding:22px; }
.features strong,.features span { display:block; }
.features span { color:var(--muted); margin-top:8px; }
.narrow { width:min(540px,100%); margin:70px auto; }
.stack { display:grid; gap:10px; }
.warning { color:var(--danger); font-weight:700; }
.flash { margin-bottom:18px; padding:13px 16px; border-radius:10px; }
.flash.error { background:#fef3f2; color:var(--danger); }
.flash.success { background:#ecfdf3; color:var(--success); }
.status-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:18px; }
.status-row > div { background:#111827; color:white; border-radius:12px; padding:16px; display:flex; justify-content:space-between; gap:12px; }
.status-row span { color:#d1d5db; }
.tool-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.tool-grid h2,.result-card h2 { margin-top:0; }
.full { grid-column:1/-1; text-align:center; }
.large { font-size:17px; padding:15px 34px; }
.two-cols { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:12px; }
.checks { display:grid; grid-template-columns:1fr; gap:9px; max-height:355px; overflow:auto; }
.checks label { display:flex; gap:9px; align-items:flex-start; border-bottom:1px solid #eef0f3; padding-bottom:8px; }
.checks input { width:auto; margin-top:3px; }
.result-card,.group-card { margin-top:20px; }
.result-head { display:flex; justify-content:space-between; gap:18px; align-items:center; }
.result-head p { color:var(--muted); margin-bottom:0; }
.combo-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:18px; }
.combo { display:flex; justify-content:center; gap:6px; padding:11px; background:#f8fafc; border:1px solid var(--border); border-radius:10px; }
.combo span { display:inline-grid; place-items:center; width:33px; height:33px; border-radius:50%; background:#26344f; color:#fff; font-size:13px; }
details summary { cursor:pointer; font-weight:700; }
table { width:100%; border-collapse:collapse; margin-top:18px; }
th,td { padding:10px; border-bottom:1px solid var(--border); text-align:left; }
@media(max-width:760px) {
  .hero h1 { font-size:32px; }
  .start-card form,.result-head { flex-direction:column; }
  .features,.tool-grid,.status-row,.combo-grid { grid-template-columns:1fr; }
  .full { grid-column:auto; }
  .two-cols { grid-template-columns:1fr; }
}