:root{--bg:#f6f7fb;--surface:#fff;--ink:#131b2e;--muted:#5f6b85;--line:#e2e5f1;--line2:#c6cbdd;--blue:#1e40af;--blue-deep:#00288e;--blue-soft:#e6eaff;--green:#059669;--green-deep:#006c4a;--green-soft:#dcfce9;--amber:#d97706;--amber-soft:#fef3c7;--red:#dc2626;--red-soft:#fee2e2;--radius:12px;--shadow:0 1px 3px #0f172a0d,0 1px 2px #0f172a0d}
*{box-sizing:border-box}body{margin:0;font-family:"Plus Jakarta Sans",system-ui,sans-serif;background:var(--bg);color:var(--ink);font-size:14px;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}
.wrap{width:min(1180px,calc(100% - 32px));margin-inline:auto}.wrap.wide{width:min(1400px,calc(100% - 32px))}
.top{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}.top-inner{height:62px;display:flex;align-items:center;gap:18px}
.brand{display:flex;align-items:center;gap:9px;font-size:17px;font-weight:600;color:var(--blue-deep)}.brand b{font-weight:800}.brand-mark{width:32px;height:32px;border-radius:9px;background:var(--blue-deep);color:#fff;display:grid;place-items:center;font-weight:800}
.nav{display:flex;gap:2px;margin-left:8px;overflow:auto}.nav a{display:flex;align-items:center;gap:5px;padding:8px 10px;border-radius:8px;font-size:12px;font-weight:600;color:#394156;white-space:nowrap}.nav a:hover{background:#f1f2fa}.nav a.active{background:var(--blue-deep);color:#fff}.nav .material-symbols-outlined{font-size:18px}
.who{margin-left:auto;display:flex;align-items:center;gap:10px;font-size:12px;color:var(--muted)}
.btn{min-height:40px;border:0;border-radius:8px;padding:0 16px;display:inline-flex;align-items:center;justify-content:center;gap:7px;font-size:13px;font-weight:700;cursor:pointer;background:var(--blue-soft);color:var(--blue-deep)}.btn:hover{filter:brightness(.97)}.btn:disabled{opacity:.5;cursor:not-allowed}
.btn-primary{background:var(--blue);color:#fff}.btn-green{background:var(--green-deep);color:#fff}.btn-ghost{background:transparent;border:1px solid var(--line2);color:var(--ink)}.btn-danger{background:var(--red-soft);color:#a31919}.btn-sm{min-height:32px;padding:0 10px;font-size:12px}.btn-lg{min-height:50px;font-size:15px}
main{padding:26px 0 40px}.foot{padding:20px 0 40px;font-size:12px;color:var(--muted)}
h1{font-size:26px;letter-spacing:-.03em;color:var(--blue-deep);margin:0 0 4px}h2{font-size:16px;margin:0 0 10px}.lead{color:var(--muted);margin:0 0 20px;line-height:1.6}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px}
.grid{display:grid;gap:16px}.grid-2{grid-template-columns:minmax(0,1fr) minmax(0,1.6fr)}.grid-3{grid-template-columns:repeat(3,1fr)}@media(max-width:900px){.grid-2,.grid-3{grid-template-columns:1fr}}
.field{display:grid;gap:6px;margin-bottom:12px}.field label{font-size:12px;font-weight:700}.field input,.field select,.field textarea{height:42px;border:1px solid var(--line2);border-radius:8px;padding:0 12px;background:#fff;outline:0;width:100%}.field textarea{height:auto;padding:10px}.field input:focus,.field select:focus{border-color:var(--blue);box-shadow:0 0 0 3px #93c5fd55}.help{font-size:12px;color:var(--muted);line-height:1.5}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.flash{padding:12px 14px;border-radius:10px;margin-bottom:16px;font-weight:600;background:var(--green-soft);color:#065f46;border:1px solid #a7f3d0}.flash.err{background:var(--red-soft);color:#991b1b;border-color:#fecaca}.flash.warn{background:var(--amber-soft);color:#92400e;border-color:#fde68a}
table{width:100%;border-collapse:collapse;font-size:13px}th{text-align:left;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:8px 10px;border-bottom:1px solid var(--line)}td{padding:10px;border-bottom:1px solid var(--line);vertical-align:top}tr:last-child td{border-bottom:0}.num{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.tag{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:30px;font-size:11px;font-weight:800;letter-spacing:.03em;white-space:nowrap}.tag-green{background:#d8f7e8;color:#056548}.tag-amber{background:var(--amber-soft);color:#744500}.tag-blue{background:var(--blue-soft);color:var(--blue-deep)}.tag-neutral{background:#edf0f6;color:#606b81}.tag-red{background:var(--red-soft);color:#a31919}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}
.stat{display:grid;gap:4px}.stat b{font-size:26px;letter-spacing:-.03em;color:var(--blue-deep)}.stat span{font-size:12px;color:var(--muted)}
.verify-box{display:grid;gap:12px}.verify-box input.big{height:64px;font-size:34px;letter-spacing:.3em;text-align:center;font-weight:800;font-variant-numeric:tabular-nums}
.result{border-radius:10px;padding:14px;border:1px solid var(--line);display:none}.result.ok{display:block;background:var(--green-soft);border-color:#a8e5ca}.result.bad{display:block;background:var(--red-soft);border-color:#fecaca}.result.warn{display:block;background:var(--amber-soft);border-color:#fde68a}.result h3{margin:0 0 6px;font-size:15px}.result dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-size:13px}.result dt{color:var(--muted)}
.login{max-width:420px;margin:50px auto}.hero{padding:60px 0 30px;text-align:center}.hero h1{font-size:40px}.hero p{font-size:16px;color:var(--muted);max-width:640px;margin:10px auto 24px;line-height:1.6}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:30px 0}@media(max-width:800px){.steps{grid-template-columns:1fr 1fr}}.steps .card b{display:block;margin:6px 0}.steps .n{width:28px;height:28px;border-radius:50%;background:var(--blue-deep);color:#fff;display:grid;place-items:center;font-weight:800;font-size:13px}
pre{background:#0f172a;color:#e2e8f0;padding:14px;border-radius:10px;overflow:auto;font-size:12.5px;line-height:1.55}code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.docs h2{margin-top:30px;padding-top:14px;border-top:1px solid var(--line)}.docs h3{margin:18px 0 6px}.docs p,.docs li{line-height:1.65}.docs table td code{background:#eef0ff;padding:1px 5px;border-radius:4px}
.copy{cursor:pointer}.muted{color:var(--muted)}.small{font-size:12px}.right{margin-left:auto}
.live-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#59c29a;margin-right:6px;animation:pulse 1.6s infinite}@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
