:root{--paper:#f4f2e9;--ink:#233a32;--muted:#5e6962;--line:#d5d9ce;--green:#166453;--pale:#e7ebe1;--white:#fcfcf8;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}
*{box-sizing:border-box}body{margin:0}a{color:inherit;text-underline-offset:4px}button,select,textarea{font:inherit}button,a,select{touch-action:manipulation}button{cursor:pointer}button:focus-visible,a:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #b3833e;outline-offset:4px}.wrap{width:min(1180px,calc(100% - 72px));margin:0 auto}.site-header{min-height:106px;display:flex;justify-content:space-between;align-items:center;gap:24px;border-bottom:1px solid var(--line)}.wordmark{font-weight:650;font-size:22px;letter-spacing:-.8px;text-decoration:none;display:inline-flex;gap:15px;align-items:center}.mark{font-family:Georgia,serif;font-size:40px;line-height:1}.mark span{color:#ad7b39}.site-header nav{display:flex;gap:30px;font-size:13px}.site-header nav a{text-decoration:none}.hero{padding:72px 0 60px;max-width:900px}.eyebrow{text-transform:uppercase;font-size:10px;letter-spacing:1.8px;font-weight:650;margin:0 0 20px}h1{font-size:clamp(42px,6vw,74px);font-weight:500;line-height:1.08;letter-spacing:-3px;margin:0 0 25px}h1 em{font-family:Georgia,serif;font-weight:400;letter-spacing:-2.5px;color:var(--green)}.intro{font-size:18px;line-height:1.7;color:var(--muted);max-width:710px;margin:0 0 28px}.hero-links{display:flex;flex-wrap:wrap;gap:15px 27px;font-size:13px;margin:30px 0 21px}.quiet{color:var(--muted);font-size:12px!important;line-height:1.75!important}.integration{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:65px;border-top:1px solid var(--ink);padding-top:38px;scroll-margin-top:25px}h2{font-family:Georgia,serif;font-size:36px;font-weight:400;line-height:1.15;letter-spacing:-1px;margin:0 0 24px}.integration p,.reuse p,.reuse li{font-size:14px;line-height:1.85;color:var(--muted)}.integration label{display:block;font-size:12px;font-weight:600;margin:24px 0 10px}.integration select{width:100%;padding:12px;color:var(--ink);border:1px solid var(--line);background:var(--white);border-radius:0;min-height:44px}.code{display:block;width:100%;resize:vertical;min-height:70px;padding:17px;background:var(--ink);color:#edf2e8;border:1px solid var(--ink);border-radius:0;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:11px;line-height:1.75;overflow-wrap:anywhere;white-space:pre-wrap;word-break:break-word}.integration button{font-size:12px;padding:11px 15px;background:transparent;border:1px solid var(--line);color:var(--ink);margin:13px 0 2px;min-height:42px}.integration button:hover{border-color:var(--ink);background:var(--pale)}.preview-panel{align-self:start;padding:20px;background:var(--pale)}.preview-label{display:flex;flex-wrap:wrap;gap:9px;justify-content:space-between;align-items:center;margin:0 0 18px;font-size:10px;color:var(--muted)}.preview-label .eyebrow{margin:0}.preview-panel iframe{display:block;width:100%;border:0;background:var(--paper)}.preview-panel>.quiet{margin:14px 0 0}.secondary{margin-top:65px;padding-top:44px;border-top-color:var(--line)}.template-panel{background:var(--pale);padding:25px}.template-panel label:first-child{margin-top:0}.integration details{border-top:1px solid var(--line);margin-top:23px;font-size:12px;line-height:1.8;color:var(--muted)}summary{padding:14px 0;cursor:pointer}.integration details p{font-size:12px;overflow-wrap:anywhere}.integration details code{font-size:11px}.reuse{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:65px;border-top:1px solid var(--line);margin-top:65px;padding:44px 0 10px}.reuse p:first-child{margin-top:0}.reuse ul{padding-left:20px}.reuse li{padding:0 0 12px}.copy-status{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);background:var(--ink);color:var(--white);padding:13px 20px;font-size:12px;line-height:1.6;max-width:calc(100% - 32px);width:max-content;margin:0;box-shadow:0 3px 12px #233a321c;z-index:2}.copy-status:empty{display:none}.notice{background:var(--pale);padding:20px;font-size:14px;line-height:1.8}footer{display:flex;align-items:center;gap:30px;flex-wrap:wrap;border-top:1px solid var(--line);padding:30px 0 40px;margin-top:40px!important}footer p{font-size:12px;color:var(--muted);margin-right:auto}footer>a:last-child{font-size:12px}
@media(max-width:850px){.wrap{width:calc(100% - 40px)}.site-header{min-height:84px}.site-header nav{gap:18px;font-size:12px}.wordmark{font-size:19px}.hero{padding:48px 0 42px}h1{letter-spacing:-2px}h1 em{letter-spacing:-1.5px}.intro{font-size:16px}.integration,.reuse{grid-template-columns:1fr;gap:30px}.preview-panel{max-width:600px;width:100%}.secondary,.reuse{margin-top:45px;padding-top:33px}.template-panel{padding:22px}.reuse{gap:0}.reuse h2{margin-bottom:18px}footer{gap:18px}footer p{margin:0}}
@media(max-width:440px){.wrap{width:calc(100% - 32px)}.site-header{gap:12px}.site-header nav a:last-child{display:none}.wordmark{gap:10px}h1{font-size:39px}.hero-links{gap:14px 18px;font-size:12px}.preview-panel{padding:12px}.template-panel{padding:17px}.code{font-size:10px;padding:13px}h2{font-size:32px}}
@media(prefers-reduced-motion:no-preference){button,a{transition:background-color .12s,color .12s,border-color .12s}}
