:root{--bg:#f6f7f9;--card:#fff;--ink:#111;--sub:#666;--line:#e6e8ec;--ok:#1a7f37;--warn:#b7791f;--bad:#c62828;--accent:#2457c5}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 -apple-system,"Apple SD Gothic Neo","Malgun Gothic","Noto Sans KR",system-ui,sans-serif}
.wrap{max-width:560px;margin:0 auto;padding:20px 16px 48px}
h1{font-size:22px;margin:8px 0 4px}.lead{color:var(--sub);margin:0 0 18px;font-size:14px}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px 16px;margin-bottom:14px}
label{display:block;font-size:13px;color:var(--sub);margin-bottom:6px}
input[type=date],input[type=time],input[type=text],input[type=number],select{width:100%;font-size:20px;padding:12px;border:1.5px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);font-family:inherit}
input:focus,select:focus{outline:none;border-color:var(--accent)}
.unit{position:relative}.unit input{padding-right:52px}.unit span{position:absolute;right:14px;top:50%;transform:translateY(-50%);color:var(--sub);font-size:14px}
.row{display:flex;gap:10px}.row>div{flex:1}
.gap{height:12px}
.seg{display:flex;border:1.5px solid var(--line);border-radius:10px;overflow:hidden}
.seg label{flex:1;margin:0;text-align:center;font-size:15px;color:var(--ink);padding:11px 4px;cursor:pointer;background:#fff}
.seg input{position:absolute;opacity:0;width:0;height:0}
.seg input:checked+label{background:var(--accent);color:#fff;font-weight:700}
.chk{display:flex;align-items:center;gap:10px;font-size:15px;color:var(--ink);margin:0;cursor:pointer}
.chk input{width:22px;height:22px;accent-color:var(--accent);margin:0}
.big{font-size:34px;font-weight:800;letter-spacing:-.5px;margin:2px 0}
.tag{display:inline-block;font-size:12px;font-weight:700;padding:3px 9px;border-radius:999px;color:#fff;margin-bottom:6px}
.ok{background:var(--ok)}.warn{background:var(--warn)}.bad{background:var(--bad)}.pre{background:#6b7280}.info{background:var(--accent)}
.badge{display:inline-block;font-size:12px;font-weight:700;padding:3px 9px;border-radius:999px;border:1.5px solid var(--bad);color:var(--bad);margin:0 0 10px}
.why{font-size:14px;color:#333;margin:6px 0 0}
.kv{display:grid;grid-template-columns:1fr auto;gap:6px 12px;font-size:15px;margin-top:8px}.kv b{font-variant-numeric:tabular-nums}
table{width:100%;border-collapse:collapse;font-size:14px;margin-top:8px}th,td{padding:8px 6px;border-bottom:1px solid var(--line);text-align:right}th:first-child,td:first-child{text-align:left}th{color:var(--sub);font-weight:600}
.ttl{font-weight:700;margin-bottom:2px}.sub{font-size:13px;color:var(--sub)}
.src{font-size:12px;color:var(--sub);margin-top:14px;line-height:1.6}.src a{color:var(--accent)}
.home{font-size:13px;color:var(--sub);text-decoration:none}.home:hover{color:var(--accent)}
.hide{display:none}
input[type=number]{-moz-appearance:textfield;appearance:textfield}
input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}