
:root{--bg:#F1F4F7;--ink:#0F1F2E;--mute:#566676;--line:#D5DDE5;--acc:#0B7A5C;--accd:#085C45;--tint:#E3F3EC;--rm:#FBE3E1;--rmi:#8C2B22;--ch:#FFF0B8}
*{box-sizing:border-box}[hidden]{display:none!important}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.6 "Source Sans 3",system-ui,sans-serif}
h1,h2,.logo{font-family:"Bricolage Grotesque",system-ui,sans-serif;letter-spacing:-.025em;line-height:1.06;margin:0}
a{color:var(--acc)}.wrap{max-width:1000px;margin:0 auto;padding:0 22px}
.top{background:#fff;border-bottom:1px solid var(--line)}.nav{padding-top:14px;padding-bottom:14px}
.logo{display:flex;align-items:center;gap:9px;font-size:1.45rem;font-weight:800;color:var(--ink);text-decoration:none}.logo svg{width:30px;height:30px}
.grid{background-color:#fff;background-image:linear-gradient(#E6ECF1 1px,transparent 1px),linear-gradient(90deg,#E6ECF1 1px,transparent 1px);background-size:40px 40px;background-position:-1px -1px;border-bottom:1px solid var(--line)}
.hero{padding:48px 0 42px}h1{font-size:clamp(2.3rem,5.4vw,4rem);font-weight:800;max-width:15em}
.sub{font-size:1.2rem;color:var(--mute);max-width:34em;margin:16px 0 0}
.btn,button{font:600 1rem "Source Sans 3",sans-serif;border-radius:9px;padding:10px 18px;cursor:pointer;border:1px solid var(--acc);background:var(--acc);color:#fff}
button:hover{background:var(--accd)}button.alt{background:#fff;color:var(--acc)}button.alt:hover{background:var(--tint)}
button.chip{padding:5px 12px;font-size:.92rem;border-radius:999px}
:focus-visible{outline:3px solid #7fd1b6;outline-offset:2px}
.step{display:flex;align-items:center;gap:12px;font-size:1.45rem;font-weight:800;margin:32px 0 14px}
.step span{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--acc);color:#fff;font-size:1rem}
.card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:20px;margin-bottom:16px}
textarea{width:100%;min-height:110px;border:1px solid var(--line);border-radius:10px;padding:12px;font:16px/1.45 ui-monospace,Menlo,Consolas,monospace;resize:vertical;color:var(--ink)}
.row{display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;margin-top:14px}.row label{display:flex;gap:8px;align-items:center}
select{font:inherit;padding:4px 8px;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--ink)}
.meta{color:var(--mute);font-size:.95rem}.ex{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:12px}
.out{display:flex;gap:12px;align-items:flex-start;justify-content:space-between}
pre{margin:8px 0 0;white-space:pre-wrap;word-break:break-word;font:16px/1.45 ui-monospace,Menlo,Consolas,monospace;background:var(--tint);border-radius:9px;padding:12px 14px;flex:1}
h2.sec{font-size:1.2rem;font-weight:800;margin-bottom:10px}
ul.l{list-style:none;margin:0;padding:0}ul.l li{padding:9px 12px;border-radius:8px;border-left:4px solid var(--line);background:#F7F9FA;margin-bottom:8px}
li.error{border-color:#C0392B;background:var(--rm)}li.warn{border-color:#D9A400;background:var(--ch)}li.ok{border-color:var(--acc);background:var(--tint)}
code{font:14.5px ui-monospace,Menlo,Consolas,monospace;background:#EAEFF3;border-radius:5px;padding:1px 5px}
.note{font-size:.93rem;color:var(--mute);margin:0}
.why{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;padding:36px 0 6px}.why>div{border-top:3px solid var(--acc);padding-top:14px}
.why h2{font-size:1.3rem;margin-bottom:6px}.why p{margin:0;color:var(--mute)}
footer{background:#fff;border-top:1px solid var(--line);margin-top:44px;padding:24px 0 34px;color:var(--mute);font-size:.95rem}
@media(max-width:760px){.why{grid-template-columns:1fr}.out{flex-direction:column}}
.nav{display:flex;align-items:center;justify-content:space-between}nav a{margin-left:20px;color:var(--ink);text-decoration:none;font-weight:600}nav a:hover{color:var(--acc)}
.prose{max-width:780px}.prose h2{font-size:1.5rem;font-weight:800;margin:38px 0 12px}.prose p{margin:0 0 14px}.prose ul{padding-left:22px}.prose li{margin-bottom:6px}
table.t{width:100%;border-collapse:collapse;background:#fff;font:inherit}table.t th,table.t td{padding:10px 12px;border:1px solid var(--line);text-align:left;white-space:normal;font-family:inherit;vertical-align:top}table.t th{position:static;background:#E9EEF2}
details{background:#fff;border:1px solid var(--line);border-radius:10px;padding:13px 18px;margin-bottom:10px}summary{cursor:pointer;font-weight:600}details p{margin:10px 0 0;color:var(--mute)}
.cta{background:var(--tint);border:1px solid #BFE3D3;border-radius:12px;padding:24px;margin:34px 0;text-align:center}.cta p{font:800 1.4rem "Bricolage Grotesque",sans-serif;margin:0 0 12px}.cta a{display:inline-block;text-decoration:none}
.rel{display:flex;flex-wrap:wrap;gap:10px;padding:0!important;list-style:none}.rel a{display:block;background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 15px;text-decoration:none;font-weight:600}.rel a:hover{background:var(--tint)}
footer a{margin-right:16px;font-weight:600;text-decoration:none}
