:root{color-scheme:light;--paper: #FBFAF7;--surface: #FFFFFF;--sunk: #F4F2EC;--rule: #E3DFD5;--rule-firm: #CFC9BC;--ink: #1C1E24;--ink-soft: #43464F;--muted: #6B6E7A;--accent: #0E68D6;--accent-hover: #0B57B4;--accent-soft: #EAF2FD;--accent-line: #B9D5F7;--ok: #1B6B4C;--err: #9B2C2C;--err-soft: #FBECEC;--sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;--s-1: 4px;--s-2: 8px;--s-3: 12px;--s-4: 16px;--s-5: 24px;--s-6: 32px;--s-7: 48px;--s-8: 72px;--radius: 12px}@media(prefers-color-scheme:dark){:root{color-scheme:dark;--paper: #14161C;--surface: #1B1E26;--sunk: #232733;--rule: #2E3340;--rule-firm: #3C4252;--ink: #EDEEF2;--ink-soft: #C3C6D0;--muted: #8A8F9E;--accent: #6BB6FF;--accent-hover: #8AC6FF;--accent-soft: #16253A;--accent-line: #2B4463;--err: #E08585;--err-soft: #2A1A1A}}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.6 var(--sans)}.wrap{max-width:880px;margin:0 auto;padding:0 var(--s-5)}h1,h2,h3{line-height:1.25;letter-spacing:-.02em;margin:0 0 var(--s-3)}h1{font-size:clamp(28px,4vw,40px)}h2{font-size:clamp(20px,2.6vw,26px);margin-top:var(--s-7)}h3{font-size:17px;margin-top:var(--s-5)}p{margin:0 0 var(--s-4)}a{color:var(--accent)}.lede{font-size:18px;color:var(--ink-soft);max-width:60ch}.note{color:var(--muted);font-size:14px}.site-head,.site-foot{border-bottom:1px solid var(--rule);padding:var(--s-4) 0}.site-foot{border-bottom:0;border-top:1px solid var(--rule);margin-top:var(--s-8);padding:var(--s-6) 0}.head-row{display:flex;align-items:center;gap:var(--s-4)}.head-row nav{margin-left:auto;display:flex;gap:var(--s-4);flex-wrap:wrap}.head-row nav a{color:var(--ink-soft);text-decoration:none;font-size:14.5px}.head-row nav a:hover{color:var(--accent)}.brand{display:flex;align-items:center;gap:var(--s-2);font-weight:700;text-decoration:none;color:var(--ink)}.brand span i{color:var(--accent);font-style:normal}.tool{background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius);padding:var(--s-5);margin:var(--s-5) 0 var(--s-6)}.drop{border:2px dashed var(--rule-firm);border-radius:var(--radius);padding:var(--s-7) var(--s-4);text-align:center;cursor:pointer;background:var(--sunk);transition:border-color .15s,background .15s}.drop:hover,.drop.over{border-color:var(--accent);background:var(--accent-soft)}.drop strong{display:block;font-size:18px;margin-bottom:var(--s-1)}.btn{font:inherit;font-weight:600;font-size:15px;padding:11px 18px;border-radius:9px;cursor:pointer;border:1px solid var(--rule-firm);background:var(--surface);color:var(--ink);text-decoration:none;display:inline-flex;align-items:center;gap:var(--s-2)}.btn:hover{border-color:var(--accent)}.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}.btn:disabled{opacity:.5;cursor:not-allowed}.row{display:flex;gap:var(--s-2);flex-wrap:wrap;align-items:center}.status{color:var(--muted);font-size:14.5px;min-height:1.5em}.status.error{color:var(--err)}.output{width:100%;min-height:320px;font:13.5px/1.6 var(--mono);padding:var(--s-3);border:1px solid var(--rule);border-radius:9px;background:var(--sunk);color:var(--ink);resize:vertical;white-space:pre;overflow:auto}.cards{display:grid;gap:var(--s-2);margin:var(--s-4) 0}.card{border:1px solid var(--rule);border-radius:9px;padding:var(--s-3);background:var(--sunk)}.card .q{font-weight:600}.card .a{color:var(--ink-soft);font-size:14.5px}.pill{display:inline-block;padding:3px 9px;border-radius:999px;background:var(--accent-soft);color:var(--accent);border:1px solid var(--accent-line);font-size:12.5px;font-weight:600}#cta{border:1px solid var(--accent-line);background:var(--accent-soft);border-radius:var(--radius);padding:var(--s-5);margin:var(--s-6) 0}#cta h2{margin-top:0}.demo{border:1px solid var(--rule);border-radius:var(--radius);overflow:hidden;background:var(--surface);margin:var(--s-5) 0}.demo-bar{display:flex;align-items:center;gap:var(--s-2);padding:var(--s-2) var(--s-3);background:var(--sunk);border-bottom:1px solid var(--rule)}.demo-dot{width:10px;height:10px;border-radius:50%;background:var(--rule-firm)}.demo-url{margin-left:var(--s-2);font:12.5px var(--mono);color:var(--muted);background:var(--surface);border:1px solid var(--rule);border-radius:6px;padding:3px 10px;flex:1}.demo-body{padding:var(--s-5);position:relative;min-height:220px}.demo-question{font-size:15px;max-width:46ch}.demo-choices{list-style:none;padding:0;margin:var(--s-3) 0 0}.demo-choices li{padding:5px 0;color:var(--ink-soft);font-size:14.5px}.demo-box{position:absolute;border:2px solid var(--accent);border-radius:6px;background:#0e68d612;animation:box-in .5s ease-out .3s both}@keyframes box-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}.demo-panel{position:absolute;right:var(--s-4);bottom:var(--s-4);width:min(300px,70%);background:var(--surface);border:1px solid var(--rule);border-radius:10px;padding:var(--s-3);box-shadow:0 10px 30px #1c1e2429;animation:panel-in .45s ease-out 1s both}@keyframes panel-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.demo-panel .label{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}.demo-answer{margin-top:var(--s-2);font-weight:600;overflow:hidden;white-space:nowrap;border-right:2px solid var(--accent);width:0;animation:type 1.6s steps(24,end) 1.4s both,caret .7s step-end 1.4s 4}@keyframes type{to{width:100%}}@keyframes caret{50%{border-color:transparent}}@media(prefers-reduced-motion:reduce){.demo-box,.demo-panel,.demo-answer{animation:none;width:auto;border-right:0}}.faq dt{font-weight:600;margin-top:var(--s-4)}.faq dd{margin:var(--s-1) 0 0;color:var(--ink-soft)}.tool-links{display:grid;gap:var(--s-3);grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}.tool-links a{display:block;padding:var(--s-4);border:1px solid var(--rule);border-radius:var(--radius);text-decoration:none;background:var(--surface)}.tool-links a:hover{border-color:var(--accent)}.tool-links strong{display:block;color:var(--ink);margin-bottom:var(--s-1)}.tool-links span{color:var(--muted);font-size:14px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}