@font-face {font-family:"42 Dotsans";src:url("assets/fonts/42dotSans-Regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face {font-family:"42 Dotsans";src:url("assets/fonts/42dotSans-Medium.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face {font-family:"42 Dotsans";src:url("assets/fonts/42dotSans-Bold.woff2") format("woff2");font-weight:700;font-display:swap}
@font-face {font-family:Merriweather;src:url("assets/fonts/Merriweather_48pt-Regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face {font-family:Merriweather;src:url("assets/fonts/Merriweather_48pt-Italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
:root {
 --ink:#232720; --cream:#f8f8f0; --sage:#e9ecdf; --lime:#b6e400; --stone:#41483b;
 --muted:#565c50; --line:#d2d6c7; --white:#fffefa; --olive:#606c50;
 --serif:Merriweather,Georgia,serif; --sans:"42 Dotsans",Arial,sans-serif; --mono:ui-monospace,SFMono-Regular,Consolas,monospace;
 font-family:var(--sans); color:var(--ink);background:var(--cream);scroll-behavior:smooth;font-synthesis:none;
}
* {box-sizing:border-box}
body,h1,h2,h3,p,ol {margin:0}
body {-webkit-font-smoothing:antialiased;font-size:16px;line-height:1.5}
button,textarea {font:inherit}
button,a {color:inherit;-webkit-tap-highlight-color:transparent}
button {cursor:pointer;border:none}
a {text-decoration:none}
[hidden] {display:none!important}
h1,h2 {font:400 48px/1.08 var(--serif);letter-spacing:-.046em}
h3 {font:500 22px/1.2 var(--sans);letter-spacing:-.04em}
h1 em,h2 em {font-weight:400}
.shell {width:min(1240px,calc(100% - clamp(48px,10vw,154px)));margin-inline:auto}
section[id] {scroll-margin:32px}
a:focus-visible,button:focus-visible,textarea:focus-visible,pre:focus-visible {outline:3px solid currentColor;outline-offset:4px}
.copy-button:focus-visible {outline:3px solid var(--ink);box-shadow:0 0 0 5px var(--cream)}
.sr-only,.skip-link:not(:focus) {position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip-link:focus {position:fixed;z-index:20;top:8px;left:8px;background:var(--cream);padding:12px}
/* A quiet masthead leaves one bright action in the hero. */
.masthead {position:relative;z-index:5;background:var(--cream)}
.bar {position:relative;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:78px;border-bottom:1px solid var(--line)}
.identity {display:flex;align-items:center;gap:20px;min-height:44px}
.wordmark {font:700 clamp(24px,2vw,32px)/1 var(--sans);letter-spacing:-.077em;white-space:nowrap}
.product-name {font-size:13px;letter-spacing:-.015em;padding-left:18px;border-left:1px solid #bfc5b6}
.bar nav {display:flex;align-items:center;gap:4px}
.bar nav a,.menu-button {display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:8px 15px;border-radius:32px;font:500 14px/1.4 var(--sans)}
.bar nav a:hover,.menu-button:hover {background:var(--sage)}
.bar nav a[href="#prompts"] {border:1px solid #c7ceba;margin-left:5px}
.menu-button {display:none;background:transparent;border:1px solid var(--line)}
.hero {background:var(--cream)}
.hero-inner {display:grid;grid-template-columns:minmax(0,1.33fr) minmax(0,.9fr);align-items:center;gap:clamp(48px,6.5vw,110px);padding-block:clamp(62px,6.5vw,104px)}
.hero-copy {min-width:0}
.eyebrow,.sample-top,.sample-details dt {font:500 11px/1.5 var(--mono);letter-spacing:.075em;text-transform:uppercase;color:var(--muted)}
.eyebrow {margin-bottom:23px}
h1 {font-size:clamp(52px,5.75vw,87px);line-height:1.06;letter-spacing:-.061em;text-wrap:balance}
h1 em {display:block;color:var(--olive)}
.subhead {font-size:clamp(17px,1.31vw,20px);line-height:1.52;color:var(--muted);max-width:540px;margin-top:24px;text-wrap:pretty}
.subhead a {text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.hero-actions {margin-top:26px;display:flex;flex-wrap:wrap;align-items:center;gap:7px 24px}
.sample-stack {position:relative;isolation:isolate;margin:8px 10px 13px 0;max-width:470px;width:calc(100% - 10px);justify-self:end}
.sample-stack::before,.sample-stack::after {content:"";position:absolute;inset:0;z-index:-1;border-radius:10px;border:1px solid #d2d7c7;background:#edf0e3;pointer-events:none}
.sample-stack::before {transform:translate(6px,8px) rotate(2deg)}
.sample-stack::after {transform:translate(2px,5px) rotate(-1.2deg);background:#f4f5eb}
.sample-sheet {padding:clamp(22px,2.2vw,36px);border:1px solid #cdd3c2;border-radius:10px;background:var(--white);box-shadow:0 9px 27px #414a3010}
.sample-top,.sample-bottom {display:flex;justify-content:space-between;align-items:center;gap:12px}
.sample-top {padding-bottom:14px;border-bottom:1px solid var(--line)}
.sample-count {letter-spacing:.03em;color:var(--olive)}
.sample-title {font-size:clamp(28px,2.4vw,38px);line-height:1.15;letter-spacing:-.05em;min-height:2.3em;display:flex;align-items:end;margin:12px 0 10px}
.sample-hook {font-size:clamp(16px,1.2vw,19px);line-height:1.48;color:var(--muted);min-height:3em}
.sample-details {display:grid;grid-template-columns:.9fr 1.1fr;gap:12px;margin:25px 0 18px}
.sample-details dt {font-size:10px;letter-spacing:.055em;margin-bottom:3px}
.sample-details dd {margin:0;font-size:14px;line-height:1.4}
.sample-bottom {border-top:1px solid var(--line);padding-top:13px}
.sample-browse {font-size:13px;color:var(--muted)}
.sample-controls {display:flex;gap:7px}
.sample-controls button {background:var(--cream);border:1px solid var(--line);border-radius:50%;width:44px;min-height:44px;font:20px/1 var(--sans)}
.sample-controls button:hover {background:var(--sage);border-color:#a9b29b}
.copy-button,.closing-link {display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:12px 21px;background:var(--lime);color:var(--ink);border-radius:32px;font:500 15px/1.35 var(--sans);white-space:nowrap;transition:background .18s,color .18s}
.copy-button:hover {background:#ccf244}
.copy-button[data-copied]::before {content:"✓";font-weight:700}
.copy-button[data-copied] {background:var(--sage)}
.text-link,.under-link {display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:500;font-size:14px}
.text-link:hover,.under-link:hover,.toggle:hover {text-decoration:underline;text-underline-offset:4px}
.benefits {background:var(--sage)}
.benefits,.prompt-section {padding-block:clamp(44px,5.2vw,82px)}
.ruled-heading {display:flex;align-items:center;gap:22px;margin-bottom:27px}
.ruled-heading>span {height:1px;background:var(--line);flex:1}
h2 {font-size:clamp(38px,3.6vw,60px);line-height:1.08}
.features {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(18px,2.6vw,40px)}
.features article {display:flex;flex-direction:column;align-items:flex-start;border-top:1px solid #b9c1af;padding:20px 0 0}
.features p,.prompt-description,.section-note,.closing p,.tip p {line-height:1.53;color:var(--muted)}
.features p {margin-top:10px}
.feature-command {order:-1;margin-bottom:12px}
code,.feature-command code {display:inline-block;background:#e0e3d6;padding:2px 6px;border-radius:4px;font:.87em/1.5 var(--mono)}
.feature-command code {color:#48513e;background:#dce2ce;border:0;border-radius:5px;padding:2px 7px;font-size:12px}
.chapter {padding-block:clamp(52px,6vw,96px);border-top:1px solid var(--line)}
.split {display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(40px,7vw,120px)}
.under-link {margin-top:13px;text-decoration:underline;text-underline-offset:4px}
.steps {list-style:none;padding:0}
.steps li {display:grid;grid-template-columns:34px 1fr;gap:18px;align-items:start;padding:16px 0;border-top:1px solid var(--line)}
.steps li:first-child {border:0;padding-top:0}
.step-index {display:grid;place-items:center;border-radius:50%;border:1px solid #a8ad9d;font-size:14px;width:32px;height:32px}
.steps p {font-size:18px;line-height:1.48}
strong {font-weight:700}
.tip {background:var(--sage);border-radius:12px;padding:17px 20px;margin-top:12px}
.tip p {font-size:15px}
.commands {width:100%;border-collapse:collapse;table-layout:fixed;font-size:16px;line-height:1.45}
.commands th,.commands td {text-align:left;vertical-align:top;font-weight:400;padding:14px 0;border-bottom:1px solid var(--line)}
.commands th:first-child {width:37%;padding-right:13px}
.commands thead th {font-size:14px;font-weight:700;padding-top:0}
.prompt-section {background:var(--sage)}
.free-note,.speaker {font:500 13px/1.45 var(--sans);color:var(--muted)}
.prompt-card {background:var(--white);padding:clamp(20px,2.4vw,38px);border:1px solid var(--line);border-radius:12px}
.prompt-choices {display:flex;flex-wrap:wrap;gap:6px 14px;margin:0 0 22px}
.prompt-choices a {display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:8px 14px;border:1px solid #b8c0ad;border-radius:24px;font:500 14px/1.4 var(--sans)}
.prompt-choices a:hover {background:var(--white)}
.prompt-choices span {color:var(--olive)}
.prompt-card {scroll-margin-block-start:20px}
.prompt-card+.prompt-card {margin-top:16px}
.prompt-header,.prompt-actions {display:flex;justify-content:space-between;align-items:flex-start;gap:18px}
.prompt-card h3 {font:400 clamp(28px,2.4vw,40px)/1.15 var(--serif);letter-spacing:-.045em}
.prompt-description {margin-top:10px;max-width:68ch}
.prompt-usage {margin-top:8px;max-width:77ch;font-size:15px;line-height:1.5;color:var(--stone)}
.prompt-box {width:100%;margin:22px 0 6px;display:block;height:calc(12 * 1.6em + 34px);overflow:auto;overscroll-behavior:contain;white-space:pre-wrap;overflow-wrap:anywhere;padding:16px 18px;background:#e7e9de;border:1px solid var(--line);border-radius:8px;font:14px/1.6 var(--mono);color:var(--stone)}
.prompt-box.expanded {height:auto}
.prompt-actions {align-items:center}
.toggle {background:none;min-height:44px;padding:8px 0;font:500 15px var(--sans)}
.toggle::after {content:" +";margin-left:6px}
.toggle[aria-expanded=true]::after {content:" −"}
.manual {margin-top:15px;font-weight:700}
.manual-field {min-height:10em;resize:vertical;font-size:16px}
.coming {border:1px dashed #aeb3a3;background:var(--cream)}
.prompt-status {margin:0 0 10px;color:var(--muted);font:500 12px/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.choice-status {padding-left:9px;border-left:1px solid #b8c0ad;color:var(--muted);font-size:12px}
.section-note {margin-top:12px}
.chat {padding:clamp(16px,2.4vw,34px);border-radius:16px;background:var(--sage)}
.turn {display:flex;flex-direction:column;align-items:flex-start}
.user-turn {align-items:flex-end;margin-bottom:13px}
.speaker {margin:0 4px 5px}
.user-bubble {padding:9px 18px;background:#d5dcc8;color:var(--ink);border-radius:16px 16px 3px 16px;font-family:var(--mono)}
.reply-bubble {width:100%;background:var(--cream);border-radius:3px 16px 16px 16px;padding:4px 20px}
.ideas {padding:0;list-style:none;counter-reset:idea}
.ideas li {position:relative;counter-increment:idea;padding:17px 0 17px 25px}
.ideas li+li {border-top:1px solid var(--line)}
.ideas li::before {content:counter(idea) ".";position:absolute;left:0;top:19px;font:13px var(--mono);color:var(--muted)}
.ideas li>div {display:flex;gap:4px 10px;flex-wrap:wrap;align-items:baseline}
.ideas h3 {font:700 16px/1.45 var(--sans);letter-spacing:-.02em}
.ideas span {font-size:12px;color:var(--muted)}
.ideas p {font-size:15px;line-height:1.5;margin-top:4px;color:var(--muted)}
.closing,footer {background:var(--sage);color:var(--ink)}
.closing-inner,.footer-inner {display:flex;align-items:center;justify-content:space-between;gap:24px}
.closing-inner {padding-block:clamp(54px,6vw,90px)}
.closing p {color:var(--muted);margin-top:16px;max-width:530px}
.closing-link {background:var(--white);border:1px solid #bac3ae;color:var(--ink)}
.closing-link:hover {background:var(--sage)}
.footer-inner {border-top:1px solid var(--line);padding-block:25px}
.footer-inner small {color:var(--muted);font-size:13px}
.sticky-copy {display:none}
.fade-in {animation:entry .24s ease-out}
@keyframes entry {from{opacity:.78}to{opacity:1}}
@media (max-width:960px){
 .hero-inner {grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:30px}
 .sample-sheet {padding:20px}
 .features {grid-template-columns:repeat(2,minmax(0,1fr))}

}
@media (max-width:760px){
 .shell {width:calc(100% - 40px)}

 .bar {min-height:64px;gap:8px}
 .identity {gap:12px}
 .wordmark {font-size:24px}
 .product-name {font-size:12px;padding-left:10px}
 .menu-button {display:inline-flex;min-height:44px;padding:8px 16px}
 .bar nav {display:none;position:absolute;z-index:5;top:calc(100% + 4px);left:0;right:0;background:var(--sage);border-radius:14px;padding:8px;box-shadow:0 5px 15px #1a1a1720}
 .bar nav.open {display:grid;grid-template-columns:1fr 1fr;gap:3px}
 .hero-inner {grid-template-columns:1fr;gap:34px;padding-block:36px 40px}
 .eyebrow {font-size:10.5px;margin-bottom:16px}
 h1 {font-size:clamp(52px,8.2vw,68px);line-height:1.05}
 .subhead {font-size:16.5px;margin-top:18px}
 .sample-stack {justify-self:center;max-width:510px;margin:0 7px 5px 0}
 .sample-sheet {padding:20px 22px}
 .sample-title {min-height:0;margin:16px 0 8px;font-size:27px}
 .sample-hook {min-height:0;font-size:16px}
 .sample-details {margin:16px 0}
 .hero-actions {margin-top:18px;gap:4px 15px}
 .hero-actions .copy-button {padding:12px 18px}
 .text-link {font-size:13px}
 .ruled-heading {gap:14px;margin-bottom:20px}
 .features {gap:24px 20px}
 .features article {padding:14px 0 0}
 .features p {font-size:15px}
 .features h3 {font-size:20px}
 .chapter {padding-block:42px}
 .split {display:block}
 .split>h2,.split>div:first-child {margin-bottom:23px}
 .under-link {margin-top:5px}
 .steps p {font-size:17px}
 .steps li {gap:13px}
 .prompt-header {gap:12px}
 .prompt-header .copy-button {padding:10px 14px;font-size:14px}
 .prompt-box {font-size:13px}
 .closing-inner {align-items:flex-start;flex-direction:column}
 .footer-inner {align-items:flex-start;flex-wrap:wrap;padding-bottom:calc(87px + env(safe-area-inset-bottom))}
 .sticky-copy:not([hidden]) {display:flex;position:fixed;z-index:6;inset:auto 0 0;justify-content:center;padding:8px 18px calc(8px + env(safe-area-inset-bottom));background:var(--sage);border-top:1px solid var(--line)}
 .sticky-copy button {width:100%;max-width:510px}
 html {scroll-padding-bottom:80px}
}
@media (max-width:460px){
 h1 {font-size:clamp(42px,11.5vw,56px)}
 .features h3 {font-size:18px}
 .features p {font-size:15px}
 .feature-command {margin-bottom:9px}
 .commands {font-size:15px}
 .prompt-header {display:grid;grid-template-columns:minmax(0,1fr) auto}
 .prompt-header h3 {font-size:26px}
 .prompt-description {font-size:16px}
 .prompt-choices {gap:6px}
}
@media (max-width:355px){
 .shell {width:calc(100% - 32px)}

 .identity {gap:8px}
 .wordmark {font-size:21px}
 .product-name {font-size:11px;padding-left:8px}
 .menu-button {padding:8px 12px;font-size:13px}
 .features {grid-template-columns:1fr}
 .features article {min-height:0}
 .text-link {font-size:12px}
}
@media (prefers-reduced-motion:reduce){
 :root {scroll-behavior:auto}
 *,*::before,*::after {animation:none!important;transition:none!important}
}

#setup,#example {border-top:0}
.auth-page {min-height:100vh;display:grid;place-items:center;padding:24px;background:var(--cream)}
.auth-card {width:min(440px,100%);padding:clamp(24px,4vw,40px);border:1px solid #cdd3c2;border-radius:10px;background:var(--white);box-shadow:0 9px 27px #414a3010;display:grid;gap:14px}
.auth-title {font:400 32px/1.15 var(--serif);letter-spacing:-.04em}
.auth-note {color:var(--muted)}
.auth-form {display:grid;gap:14px;margin-top:6px}
.auth-form label {display:grid;gap:6px;font:500 14px/1.4 var(--sans)}
.auth-form input {font:inherit;font-weight:400;font-size:16px;min-height:46px;padding:10px 14px;border:1px solid var(--line);border-radius:8px;background:var(--cream);color:var(--ink)}
.auth-form input:focus-visible {outline:3px solid var(--ink);outline-offset:1px}
.auth-error {color:#8a2b1d;font-size:14px}
.auth-link {background:none;padding:0;justify-self:start;text-decoration:underline}
.auth-signout {text-align:center;padding:0 0 24px;background:var(--cream)}
.auth-tagline{margin:.25rem 0 1rem;color:#565c50;font-family:Merriweather,Georgia,serif;font-style:italic}