:root{--paper:#f7faff;--ink:#102340;--accent:#315fea;--muted:#526580;--pale:#e9f0ff;--white:#fff}*{box-sizing:border-box}html{scroll-behavior:smooth;scrollbar-gutter:stable}body{margin:0;color:var(--ink);background:var(--paper);font:17px/1.65 'Segoe UI',sans-serif}a{color:var(--accent)}button,input,textarea{font:inherit}button,a{touch-action:manipulation}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--accent);outline-offset:4px}header,main,footer{max-width:1240px;margin:auto;padding:24px 36px}header{display:flex;justify-content:space-between;align-items:center;gap:24px}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;color:var(--ink);font-weight:700;font-size:23px}.brand img{width:38px;height:38px}nav{display:flex;gap:24px;flex-wrap:wrap}nav a{color:var(--muted);text-decoration:none}.hero{padding:50px 0 70px;display:grid;grid-template-columns:1fr 1.05fr;gap:60px;align-items:center}.eyebrow{font-size:13px;letter-spacing:.12em;font-weight:700;color:var(--accent);text-transform:uppercase}h1,h2,h3{font-family:'Segoe UI Variable Display','Segoe UI',sans-serif;line-height:1.08;letter-spacing:-.045em}h1{font-size:clamp(44px,5vw,70px);margin:18px 0 24px}h2{font-size:42px;margin:0 0 24px}h3{font-size:25px;margin:16px 0}p{color:var(--muted)}.cta{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 22px;background:var(--accent);border:0;border-radius:8px;color:white;text-decoration:none;font-weight:600}.secondary{background:var(--pale);color:var(--ink)}.actions{display:flex;gap:12px;flex-wrap:wrap}.note{font-size:13px}.demo{padding:24px;background:var(--white);border:1px solid #cdd9ec;border-radius:18px;box-shadow:0 22px 65px #1d40751a}.demo label{font-size:13px;font-weight:600;display:block;margin-bottom:8px}.demo textarea{width:100%;resize:vertical;min-height:115px;border:1px solid #c1cee1;border-radius:8px;padding:14px;color:var(--ink);background:var(--paper)}.picker{background:#080808;color:white;border-radius:10px;margin-top:18px;padding:16px}.picker h3{font-size:17px;letter-spacing:0;margin:0 0 12px}.picker input{width:100%;background:#181818;color:white;border:1px solid #686868;padding:10px;border-radius:6px}.clip{display:flex;gap:8px;margin:7px 0}.clip .paste{flex:1;text-align:left;background:#202020;color:#fff;border:0;border-radius:5px;padding:11px;font-size:14px}.clip .pin{border:1px solid #606060;background:#181818;color:white;border-radius:5px;min-width:52px;font-size:12px}.clip button{cursor:pointer}.clip button:hover{background:#315fea}.clip .pin[aria-pressed=true]{background:#315fea}.status{min-height:28px;font-size:13px;margin:10px 0 0;color:var(--muted)}.features{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;padding:56px 0;border-top:1px solid #cdd9ec}.features article{border-left:3px solid var(--accent);padding-left:22px}.showcase{padding:64px 0}.showcase img{width:100%;height:auto;border-radius:12px;border:1px solid #cdd9ec}.split{display:grid;grid-template-columns:1fr 1fr;gap:60px;padding:56px 0;border-top:1px solid #cdd9ec}details{border-bottom:1px solid #cdd9ec;padding:18px 0}summary{font-weight:600;cursor:pointer}.closing{background:var(--pale);border-radius:18px;padding:40px;margin:40px 0}.closing h2{font-size:34px}footer{border-top:1px solid #cdd9ec;display:flex;justify-content:space-between;gap:20px;font-size:14px}kbd{font-family:Consolas,monospace;background:var(--pale);padding:2px 5px;border-radius:4px}.skip{position:absolute;left:20px;top:-100px}.skip:focus{top:10px;background:white;z-index:3}@media(max-width:800px){header,main,footer{padding:20px}.hero,.split{grid-template-columns:1fr;gap:28px;padding:30px 0}.features{grid-template-columns:1fr;gap:20px}header{align-items:flex-start}nav{gap:12px;font-size:14px}h2{font-size:32px}footer{flex-direction:column}.demo{padding:16px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.hero>*,.split>*,.clip{min-width:0}.clip .paste{min-width:0;overflow-wrap:anywhere}textarea,input{min-width:0}*{scrollbar-color:#526580 #e9f0ff;scrollbar-width:auto}button:hover,.cta:hover{filter:brightness(.93)}button:active,.cta:active{transform:translateY(1px)}
