:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:16px;line-height:1.55;color:#173247;background:#eef3f6;--paper:#f8fafb;--ink:#173247;--muted:#526a7a;--rule:#bdcbd4;--blue:#1766a8;--amber:#c78117}
*{box-sizing:border-box}body{margin:0}a{color:#124e7f;text-underline-offset:3px}button,select,textarea{font:inherit;color:inherit}button,select,a,summary,textarea{outline-offset:4px}button:focus-visible,select:focus-visible,a:focus-visible,summary:focus-visible,textarea:focus-visible{outline:3px solid var(--amber)}button{border:1px solid var(--rule);background:var(--paper);padding:10px 15px;cursor:pointer;font-weight:600}button:hover{border-color:var(--blue)}button.primary{background:var(--ink);color:#fff;border-color:var(--ink)}header,main{max-width:1280px;margin:auto;padding-inline:32px}header{display:flex;align-items:center;justify-content:space-between;gap:25px;min-height:85px;border-bottom:1px solid var(--rule)}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);font-weight:650}.brand span{display:grid;place-items:center;border:1px solid var(--ink);width:34px;height:34px;font-size:12px;flex-shrink:0}nav{display:flex;gap:23px;align-items:center}nav a{font-size:14px;text-decoration:none}nav button{border:0;padding:7px;background:transparent;font-size:14px}.intro{padding:43px 0 31px}h1{margin:0 0 12px;font-size:clamp(28px,3.8vw,43px);line-height:1.14;letter-spacing:-1.2px;font-weight:650;max-width:30ch}.intro p{margin:0;color:var(--muted);max-width:74ch}.workbench{display:grid;grid-template-columns:295px minmax(0,1fr);gap:34px;align-items:start}h2{font-size:19px;line-height:1.3;margin:0 0 18px;font-weight:650}.choices{padding:22px 0 0}.choices label{display:block;font-size:14px;font-weight:600;margin:23px 0 8px}.choices select{width:100%;background:#fff;border:1px solid #a6b9c6;padding:11px 10px;border-radius:0}.choices h2{margin-bottom:0}.hint{color:var(--muted);font-size:12px;line-height:1.65;margin:9px 0}.choices details{border-top:1px solid var(--rule);padding-top:19px;margin-top:25px}summary{font-size:13px;cursor:pointer;font-weight:600}.choices ul{list-style:none;padding:0;margin:13px 0}.choices li{margin:7px 0;font-size:12px;overflow-wrap:anywhere}.choices li a{text-decoration:none}.output{padding:24px;background:var(--paper);border:1px solid var(--rule);min-width:0;border-top:4px solid var(--blue)}.output-heading{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.output h2{margin-bottom:4px}.actions{display:flex;gap:8px;flex-shrink:0}.actions button{font-size:13px;white-space:nowrap}.source-note{font-size:12px;line-height:1.6;color:var(--muted);margin:12px 0 15px}textarea{width:100%;height:510px;resize:vertical;background:#fff;border:1px solid #bdcbd4;padding:17px;font:12px/1.65 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere;tab-size:2}.status{min-height:20px;margin:10px 0;color:#2e6c55;font-size:13px}.fingerprint{border-top:1px solid var(--rule);padding-top:13px}.fingerprint p{font-size:11px;color:var(--muted);overflow-wrap:anywhere}.use{display:grid;grid-template-columns:1fr 1fr;gap:55px;border-top:1px solid var(--rule);margin-top:38px;padding:27px 0}.use p{font-size:14px;color:var(--muted);max-width:70ch}.use h2{font-size:18px;margin-bottom:12px}.demo-link{font-weight:600}footer{display:flex;justify-content:space-between;gap:35px;padding:18px 0 30px;font-size:12px;color:var(--muted);border-top:1px solid var(--rule)}.sr-only{position:absolute;clip:rect(0,0,0,0);height:1px;width:1px;overflow:hidden}
@media(max-width:1050px){.workbench{grid-template-columns:250px minmax(0,1fr);gap:23px}.output-heading{flex-direction:column}.actions{width:100%}.actions button{flex:1}}
@media(max-width:700px){header,main{padding-inline:19px}header{align-items:flex-start;flex-direction:column;gap:15px;padding-block:19px}nav{width:100%;justify-content:space-between}.brand{font-size:15px}.intro{padding:28px 0 19px}h1{font-size:31px;letter-spacing:-.8px}.intro p{font-size:14px}.workbench{display:flex;flex-direction:column;gap:20px}.choices,.output{width:100%}.choices{padding-top:5px}.choices label{margin-top:17px}.choices details{margin-top:17px;padding-top:13px}.choices details[open] ul{max-height:150px;overflow:auto}.output{padding:19px 16px}textarea{height:380px;font-size:12px}.use{grid-template-columns:1fr;gap:22px;margin-top:27px}footer{flex-direction:column;gap:12px}}