.sp-reader__header{border-bottom:1px solid var(--sp-border);align-items:center;gap:24px;padding:10px 24px;display:flex}.sp-reader__brand{letter-spacing:-.04em;color:var(--sp-text);font-size:20px;font-weight:750;text-decoration:none}.sp-reader__title{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;margin:0;font-size:14px;font-weight:500;overflow:hidden}.sp-reader__controls{align-items:center;gap:16px;display:flex}.sp-reader__controls label{color:var(--sp-muted);align-items:center;gap:8px;font-size:12px;display:flex}.sp-reader__controls select{border:1px solid var(--sp-border);border-radius:var(--sp-control-radius);background:var(--sp-surface);max-width:220px;min-height:36px;color:var(--sp-text);font:inherit;padding:5px 9px}.sp-reader__header{font:var(--sp-ui-font,14px/1.4 system-ui, sans-serif);flex-shrink:0}.sp-reader__header :is(a,select,button):focus-visible{outline:2px solid var(--sp-accent);outline-offset:3px}@media (width<=700px){.sp-reader__header{flex-wrap:wrap;gap:8px 16px;padding:8px 12px}.sp-reader__controls{gap:12px;width:100%}.sp-reader__controls label{flex-direction:column;flex:1;align-items:stretch;gap:4px;min-width:0}.sp-reader__controls label:last-child{flex:1.7}.sp-reader__controls select{flex:1;min-width:0;max-width:100%;min-height:44px}}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{background:var(--sp-page);color:var(--sp-text);margin:0;font:16px/1.65 system-ui,sans-serif}a{color:inherit;text-underline-offset:5px;text-decoration-thickness:1px}button,input{font:inherit}button,.button{border:1px solid var(--sp-border);background:var(--sp-surface);min-height:44px;color:var(--sp-text);cursor:pointer;justify-content:center;align-items:center;gap:22px;padding:10px 18px;text-decoration:none;display:inline-flex}button:disabled{cursor:wait;opacity:.6}.primary{background:var(--sp-paper,var(--sp-accent));border-color:var(--sp-paper,var(--sp-accent));color:var(--sp-paper-ink,var(--sp-page))}.primary:hover{filter:brightness(1.12)}a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid var(--sp-accent);outline-offset:5px}.skip-link{background:var(--sp-paper,var(--sp-accent));color:var(--sp-paper-ink,var(--sp-page));z-index:10;padding:10px 18px;position:fixed;top:-80px;left:16px}.skip-link:focus{top:12px}.site-header,.site-footer{justify-content:space-between;align-items:center;gap:24px;max-width:1180px;margin:auto;padding:24px 36px;display:flex}.site-header{border-bottom:1px solid var(--sp-border)}.wordmark{letter-spacing:-1px;align-items:center;gap:10px;font:700 25px/1 Georgia,serif;text-decoration:none;display:inline-flex}.brand-mark{background:var(--sp-paper,var(--sp-accent));width:34px;height:34px;color:var(--sp-paper-ink,var(--sp-page));place-items:center;font-style:italic;display:grid}.site-header nav{align-items:center;gap:30px;font:12px/1.5 ui-monospace,monospace;display:flex}.site-header nav a{text-decoration:none}.site-header nav a:hover{color:var(--sp-accent)}.nav-account{border:1px solid var(--sp-border);padding:9px 12px}main{margin:auto;padding:44px 36px 32px}main[data-sp-panels]{max-width:1180px!important}.hero{grid-template-columns:1.13fr 1fr;align-items:center;gap:64px;display:grid}.hero .eyebrow{margin:0 0 24px}.eyebrow,.small-label{text-transform:uppercase;letter-spacing:.12em;color:var(--sp-accent);font:700 11px/1.6 ui-monospace,monospace}.hero h1{margin:0 0 28px;font-size:clamp(42px,5vw,70px);line-height:1.05}.lede{max-width:490px;color:var(--sp-muted);font-size:18px}.hero-actions{flex-wrap:wrap;align-items:center;gap:25px;margin-top:30px;display:flex}.text-link{font-size:13px}.hero-note{color:var(--sp-muted);margin-top:24px;font:11px/1.7 ui-monospace,monospace}.page-stack{padding:12px 22px 20px 0;position:relative}.page-stack:before,.page-stack:after{content:"";border:1px solid var(--sp-border);background:var(--sp-page);z-index:0;position:absolute;inset:20px 13px 10px 9px;transform:rotate(3deg)}.page-stack:after{transform:rotate(-3deg)}.sample-page{z-index:1;border:2px solid var(--sp-text);background:var(--sp-surface);box-shadow:5px 5px 0 var(--sp-page);padding:22px;position:relative}.sample-top,.sample-bottom{letter-spacing:.05em;justify-content:space-between;gap:10px;font:9px/1.5 ui-monospace,monospace;display:flex}.sample-top{border-bottom:1px solid var(--sp-border);padding-bottom:16px}.sample-top span:first-child{color:var(--sp-accent)}.sample-kicker{color:var(--sp-muted);margin:24px 0 8px;font:11px/1.6 ui-monospace,monospace}.sample-page h2{margin:0 0 22px;font-size:26px;line-height:1.2}.sample-diagram{background-image:var(--sp-dots);border:1px solid var(--sp-border);background-size:5px 5px;flex-direction:column;align-items:center;gap:7px;padding:20px 12px;display:flex}.sample-diagram span{background:var(--sp-surface);border:1px solid var(--sp-border);text-align:center;padding:9px 12px;font:11px/1.5 ui-monospace,monospace}.sample-diagram .filled{background:var(--sp-paper,var(--sp-accent));color:var(--sp-paper-ink,var(--sp-page));border-color:var(--sp-paper,var(--sp-accent))}.sample-diagram i{color:var(--sp-muted);font-style:normal}.sample-bottom{color:var(--sp-muted);padding-top:18px}.margin-label{writing-mode:vertical-rl;color:var(--sp-muted);letter-spacing:.15em;font:9px/1 ui-monospace,monospace;position:absolute;top:35px;right:0}.format-strip{color:var(--sp-muted);text-transform:uppercase;letter-spacing:.08em;flex-wrap:wrap;justify-content:space-between;gap:16px;padding:22px 0;font:11px/1.5 ui-monospace,monospace;display:flex}.format-strip span:before{content:"+";color:var(--sp-accent);margin-right:10px}h2{margin:16px 0 28px;font-size:clamp(26px,3vw,36px);line-height:1.15}.steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;display:grid}.card{padding:24px}.number{margin-bottom:24px;display:block}.card h3{margin:0 0 14px;font-size:21px;line-height:1.2}.card p,.principles p{color:var(--sp-muted);margin:0;font-size:14px}.split{grid-template-columns:1fr 1fr;gap:60px;display:grid}.split>div>p{color:var(--sp-muted)}.split>div>.button{margin-top:12px}.principles article+article{border-top:1px solid var(--sp-border);margin-top:22px;padding-top:20px}.principles h3{margin:0 0 8px;font-size:20px}.connection-card{border:1px solid var(--sp-border);background-image:var(--sp-dots);background-size:5px 5px;padding:24px}.connection-card code{overflow-wrap:anywhere;margin:15px 0;font:13px/1.7 ui-monospace,monospace;display:block}.connection-card p{font-size:12px}.connection-card #copy-status{min-height:1.6em;color:var(--sp-accent)}.prompt-example{border-top:1px solid var(--sp-border);margin-top:24px;padding-top:20px}.prompt-example p{color:var(--sp-text);font-size:14px}.muted{color:var(--sp-muted)}.guest-link{margin-top:22px;font-size:13px;display:block}.site-footer{border-top:1px solid var(--sp-border);margin-top:12px;padding-bottom:32px}.site-footer p{color:var(--sp-muted);font-size:12px}.mode-controls{gap:5px;display:flex}.mode-controls button{min-height:36px;padding:6px 10px;font-size:10px}.mode-controls [aria-pressed=true]{border-color:var(--sp-paper,var(--sp-accent));color:var(--sp-accent)}.account-main{max-width:1000px}.account-heading{margin-bottom:40px}.account-heading h1{margin:18px 0;font:italic 700 clamp(36px,5vw,60px)/1.1 Georgia,serif}.account-heading #identity{color:var(--sp-muted);overflow-wrap:anywhere;font:12px/1.8 ui-monospace,monospace}.account-grid{grid-template-columns:1.4fr 1fr;align-items:start;gap:24px;display:grid}.account-grid .card{border:1px solid var(--sp-border);background:var(--sp-surface)}fieldset{border:1px solid var(--sp-border);margin:22px 0;padding:16px}legend{padding:0 8px;font-size:13px}fieldset label{align-items:center;gap:10px;margin:9px 0;font-size:14px;display:flex}input[type=checkbox]{accent-color:var(--sp-accent);width:17px;height:17px}input:not([type=checkbox]){background:var(--sp-page);width:100%;min-width:0;color:var(--sp-text);border:1px solid var(--sp-border);margin-top:8px;padding:10px;display:block}label{font-size:13px}.card form p{margin:20px 0}.token-output{white-space:pre-wrap;overflow-wrap:anywhere;max-width:100%;padding:0;font:12px/1.8 ui-monospace,monospace}.token-output:not(:empty){border-left:3px solid var(--sp-paper,var(--sp-accent));background:var(--sp-surface);margin-top:28px;padding:18px}.account-help{color:var(--sp-muted);font-size:13px}@media (width<=850px){.hero{grid-template-columns:1fr 1fr;gap:30px}.hero h1{font-size:clamp(40px,6.2vw,60px)!important}.hero-actions{gap:16px}.steps{gap:12px}.card{padding:18px}.split{gap:30px}.site-header nav{gap:18px}.sample-page{padding:16px}.sample-page h2{font-size:22px}.account-grid{grid-template-columns:1fr}}@media (width<=620px){.site-header,.site-footer{padding:20px}.site-header{align-items:start}.site-header nav>a:not(.nav-account){display:none}.wordmark{font-size:22px}main{padding:28px 20px}.hero{grid-template-columns:1fr;gap:30px}.hero h1{font-size:58px!important}.hero .lede{font-size:16px}.page-stack{width:100%;max-width:410px;margin:0 auto}.steps,.split{grid-template-columns:1fr;gap:22px}.format-strip{grid-template-columns:1fr 1fr;gap:16px;font-size:9px;display:grid}.site-footer{flex-wrap:wrap}.site-footer p{display:none}.connection-card{padding:18px}.account-heading h1{font-size:38px}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}.sp-reader__title nav{justify-content:flex-end;align-items:center;gap:24px;display:flex}.sp-reader__title nav a{text-decoration:none}.sp-reader__title button{min-height:36px;padding:5px 12px}.sp-reader__status{color:var(--sp-muted);font-size:12px}.sp-reader__status:empty{display:none}@media (width<=700px){.sp-reader__title nav{gap:14px}}.language-nav{font:14px var(--sp-ui-font,system-ui);justify-content:flex-end;gap:16px;padding:8px 24px;display:flex}.language-nav [aria-current=page]{font-weight:800;text-decoration-thickness:2px}.instructions{max-width:820px;margin:48px auto;padding:0 24px}.instructions h2{margin-top:2em}.instructions code{overflow-wrap:anywhere}textarea{box-sizing:border-box;resize:vertical;background:var(--sp-surface);width:100%;color:var(--sp-text);border:1px solid var(--sp-border);padding:12px;font:14px/1.5 monospace}[hidden]{display:none!important}#anonymous-create label{margin-top:20px;display:block}#anonymous-create input{box-sizing:border-box;width:100%;display:block}#anonymous-create button{max-width:100%}@media (width<=700px){.sp-reader__title nav{white-space:normal;flex-wrap:wrap}.sp-reader__title{white-space:normal}.hero h1{overflow-wrap:anywhere}.hero-actions{align-items:stretch}.button{white-space:normal;text-align:center}.site-footer{flex-wrap:wrap}}