:root{font-family:system-ui,"Yu Gothic",sans-serif;color:#19352c;background:#f3f6f4;line-height:1.7}*{box-sizing:border-box}body{margin:0}header,main,footer{max-width:850px;margin:auto;padding:24px 20px}header{padding-top:40px}.brand{font-size:.8rem;font-weight:700;letter-spacing:.12em}h1{font-size:clamp(1.6rem,4vw,2.3rem);line-height:1.4}h2{font-size:1.3rem;margin:0 0 12px}nav{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:24px}a{color:#176048;text-underline-offset:4px}section{scroll-margin-top:20px;border:1px solid #d8e2dc;border-radius:14px;padding:24px;background:white;margin-bottom:24px}.fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}label{display:flex;flex-direction:column;gap:6px;font-weight:600;min-width:0}input,select,button{font:inherit;min-height:48px;border:1px solid #90a69a;border-radius:7px;padding:9px 12px;width:100%;min-width:0}input:focus-visible,select:focus-visible,button:focus-visible,a:focus-visible{outline:3px solid #c36a1e;outline-offset:3px}button{margin:20px 0;background:#176048;color:white;font-weight:700;cursor:pointer}output{display:block;padding:16px;background:#edf5ee;border-radius:8px;overflow-wrap:anywhere;font-weight:600}output[data-state=error]{background:#fff1ed;color:#8c2b14}.note,footer{font-size:.88rem;color:#4c6157}fieldset{min-width:0;border:1px solid #d8e2dc;border-radius:10px;padding:16px}fieldset label+label{margin-top:14px}legend{font-weight:700}p{overflow-wrap:anywhere}@media(max-width:600px){header,main,footer{padding-left:16px;padding-right:16px}section{padding:18px}.fields{grid-template-columns:1fr}nav a{padding:4px 0}h1{font-size:1.7rem}}
:root{color-scheme:light}.eyebrow{font-size:.8rem;letter-spacing:.1em;color:#52695e}.tool-grid{display:grid;grid-template-columns:1fr;gap:16px}.tool-card{border:1px solid #d8e2dc;border-radius:14px;padding:24px;background:#fff}.open-tool{display:inline-flex;align-items:center;min-height:44px;font-weight:700}nav a{display:inline-flex;align-items:center;min-height:44px}.explanation h2:not(:first-child){margin-top:24px}header .brand{display:inline-flex;align-items:center;min-height:44px}footer a{display:inline-block;min-height:44px;padding:8px 0}
