@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Fredoka:wght@500;600;700&display=swap');
:root{--bg:#0d0b0a;--cream:#fff0d4;--orange:#ff8b39;--muted:#999087;--line:#fff0d41a;--mono:ui-monospace,SFMono-Regular,Consolas,monospace}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:35px}body{margin:0;color:var(--cream);background:var(--bg);font-family:'DM Sans',sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{color:inherit;font:inherit;cursor:pointer}button,a,input{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--orange);outline-offset:5px}::selection{background:var(--orange);color:var(--bg)}.wrap{max-width:1280px;padding-left:48px;padding-right:48px;margin:auto}.nav{display:flex;height:100px;align-items:center;justify-content:space-between}.nav-brand{font:bold 27px var(--mono);letter-spacing:-4px;color:var(--orange);text-shadow:0 0 20px #ff7a2a55}.nav>div{display:flex;align-items:center;gap:30px}.mac-label{font:9px var(--mono);letter-spacing:1.6px;color:#8b8176}.github-link{font-size:12px;border-bottom:1px solid #fff0d42a;padding:8px 0}.github-link span{margin-left:12px}.hero{display:grid;grid-template-columns:1.05fr 1fr;align-items:center;min-height:590px;padding-top:30px;padding-bottom:65px;position:relative}.hero-copy{position:relative;z-index:2}.eyebrow{font:8px var(--mono);letter-spacing:1.6px;color:#a99a89;display:block}.hero .eyebrow{margin:0 0 14px}.hero .eyebrow>span{height:5px;width:5px;display:inline-block;vertical-align:2px;margin-right:7px;background:var(--orange);border-radius:50%;box-shadow:0 0 8px #ff8b3955}h1{font-family:'Fredoka',sans-serif;font-size:clamp(112px,12.7vw,178px);font-weight:600;letter-spacing:-9px;line-height:1;margin:0 0 18px;color:var(--cream)}.tagline{font-size:43px;font-weight:500;letter-spacing:-1.8px;line-height:1.13;margin:0 0 22px}.description{font-size:14px;line-height:1.8;color:#a3978a;margin:0 0 26px}.hero-actions{display:flex;align-items:center;gap:29px}.button{display:inline-flex;align-items:center;gap:37px;padding:14px 21px;font-size:12px;font-weight:700;background:var(--orange);color:#211407;border-radius:7px;transition:background .2s,transform .2s}.button:hover{background:#ffa35d;transform:translateY(-2px)}.quiet-link{font-size:11px;color:#c4b6a5}.quiet-link span{margin-left:10px;color:#847769}.mascot-scene{position:relative;isolation:isolate;min-width:0;width:115%;margin-left:-4%;aspect-ratio:1;display:grid;place-items:center;perspective:900px;--rx:0deg;--ry:0deg;--tx:0px;--ty:0px;--gx:50%;--gy:50%}.mascot-glow{position:absolute;inset:0;background:radial-gradient(ellipse at var(--gx) var(--gy),#ff7b2b29 0%,#8f310916 37%,transparent 68%);z-index:-1;pointer-events:none;transition:background .3s}.goat-button{width:100%;display:block;border:0;padding:0;background:none;border-radius:45%;position:relative;cursor:grab;touch-action:pan-y}.goat-button:active{cursor:grabbing}.goat-bounce{display:block}.goat{display:block;width:100%;height:auto;transform:translate3d(var(--tx),var(--ty),0) rotateX(var(--rx)) rotateY(var(--ry));transition:transform .25s ease-out;filter:drop-shadow(0 30px 26px #0009);user-select:none;will-change:transform}.goat-reply{position:absolute;top:15%;right:6%;font:12px var(--mono);color:var(--cream);padding:9px 13px;background:#2c1a10;border:1px solid #9c51264d;border-radius:10px 10px 10px 0;opacity:0;transform:translateY(8px) rotate(6deg);transition:.2s;pointer-events:none}.goat-reply.visible{opacity:1;transform:translateY(0) rotate(6deg)}.goat-bounce.boop{animation:boop .65s ease-in-out}.comparison{padding-top:45px;padding-bottom:80px}.comparison-heading{border-top:1px solid var(--line);padding-top:35px;margin-bottom:24px;display:flex;justify-content:space-between;align-items:flex-end;gap:20px}.comparison-heading .eyebrow{font-size:8px;letter-spacing:1.4px;margin-bottom:12px;color:#897968}h2{font-size:30px;letter-spacing:-1.1px;font-weight:500;line-height:1.2;margin:0}h2 span{color:#9d8e7f}kbd{font:13px var(--mono);border:1px solid #fff0d425;border-bottom-width:3px;border-radius:7px;padding:9px 13px;color:#b4a08c;background:#17120f;white-space:nowrap;margin-bottom:1px}.mobile-break{display:none}.comparison-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;gap:15px}.compare-buttons{display:flex;gap:3px;background:#19130f;border:1px solid #fff0d412;border-radius:7px;padding:4px}.compare-buttons button{background:none;border:0;padding:8px 13px;color:#9e8c78;font-size:10px;border-radius:4px}.compare-buttons button span{margin-left:5px}.compare-buttons button[aria-pressed=true]{background:#f5e6cd;color:#372315}.expand{border:0;background:none;font-size:10px;color:#a78e75;padding:8px 0}.expand span{font-size:13px;margin-left:9px}.comparison-shell{padding:7px;border:1px solid #84613f4d;background:linear-gradient(130deg,#382416,#17100c 50%,#382416);border-radius:18px;box-shadow:0 30px 80px -35px #000,0 0 90px #ff722106}.capture-stage{position:relative;aspect-ratio:2380/1592;overflow:hidden;border-radius:11px;isolation:isolate;background:#1a1b26;--split:50%}.capture-layer{position:absolute;inset:0;pointer-events:none}.capture-layer img{display:block;width:100%;height:100%;max-width:none;user-select:none}.after-layer{clip-path:inset(0 0 0 var(--split))}.capture-stage[data-view=after] .after-layer{clip-path:inset(0)}.capture-stage[data-view=before] .after-layer{clip-path:inset(0 0 0 100%)}.split-line{position:absolute;left:var(--split);top:0;bottom:0;width:2px;background:#ffa050;z-index:3;pointer-events:none;box-shadow:0 0 10px #0006}.split-line>span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border:3px solid #ffa050;border-radius:50%;width:46px;height:46px;display:grid;place-items:center;background:#fff0d4;color:#7a3e14;box-shadow:0 4px 20px #0005;font-size:19px}.capture-stage input{appearance:none;-webkit-appearance:none;position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;z-index:4;cursor:ew-resize;touch-action:pan-y}.capture-stage input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:46px;height:100%;background:transparent}.capture-stage input::-moz-range-thumb{width:46px;height:46px;background:transparent;border:0}.capture-stage:has(input:focus-visible){outline:2px solid var(--orange);outline-offset:3px}.capture-stage:not([data-view=compare]) .split-line,.capture-stage:not([data-view=compare]) input{display:none}.comparison-caption{display:flex;justify-content:space-between;gap:20px;font:9px/1.8 var(--mono);color:#9b8068;margin-top:17px}.comparison-caption>span:last-child{color:#6e5d4e}footer{border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding-top:27px!important;padding-bottom:33px!important;gap:20px}.footer-brand{font-family:'Fredoka',sans-serif;font-size:24px;letter-spacing:-.8px;font-weight:500}.footer-brand>span{font:14px var(--mono);color:var(--orange);margin-left:8px}footer p{font-size:10px;color:#796857;margin:0}footer>a{font-size:10px;color:#b9a188}.skip{position:absolute;top:-100px}.skip:focus{top:10px;left:10px;padding:10px;background:var(--cream);color:var(--bg);z-index:30}dialog{width:96vw;max-width:1700px;height:93vh;max-height:93vh;background:#15100d;color:var(--cream);border:1px solid #755337;border-radius:12px;padding:0;overflow:hidden;box-shadow:0 20px 100px #000a}dialog::backdrop{background:#080504ed;backdrop-filter:blur(9px)}dialog[open]{display:flex;flex-direction:column}.zoom-toolbar{display:flex;align-items:center;justify-content:space-between;padding:15px 18px;gap:15px;border-bottom:1px solid var(--line)}.zoom-toolbar strong{font-size:12px;font-weight:500}.zoom-toolbar>div{display:flex;align-items:center;gap:18px}.zoom-toolbar button,.zoom-toolbar a{font-size:10px;background:none;border:0;padding:7px 0;color:#c7a484}.zoom-scroll{flex:1;min-height:0;overflow:auto;background:#1a1b26}.zoom-scroll img{display:block;width:100%;min-width:1190px;height:auto;max-width:none}.zoom-note{font:9px var(--mono);color:#8b725c;padding:12px 18px;margin:0}.goat-button:focus-visible{outline-offset:-35px}@keyframes boop{0%,100%{transform:rotate(0) scale(1)}20%{transform:rotate(-8deg) scale(.94)}45%{transform:rotate(7deg) scale(1.045)}70%{transform:rotate(-3deg) scale(1.015)}}
@media(min-width:1500px){.hero{min-height:660px}}@media(max-width:1100px){h1{font-size:140px;letter-spacing:-8px}.tagline{font-size:38px}.hero{min-height:540px}.hero .eyebrow{font-size:7px;letter-spacing:1px}.mascot-scene{width:115%;margin-left:-7%}.comparison-heading h2{font-size:27px}.comparison-caption{font-size:8px}}
@media(max-width:800px){.wrap{padding-left:28px;padding-right:28px}.nav{height:85px}.hero{min-height:460px;padding-top:25px;padding-bottom:45px}h1{font-size:112px;letter-spacing:-6px}.tagline{font-size:32px}.description{font-size:12px}.hero-actions{gap:20px}.button{font-size:11px;padding:13px 17px;gap:22px}.quiet-link{font-size:10px}.mascot-scene{width:120%;margin-left:-10%}.hero .eyebrow{max-width:250px;line-height:1.8;font-size:6px}.comparison{padding-top:30px;padding-bottom:55px}.comparison-heading h2{font-size:24px}.comparison-caption>span:last-child{display:none}footer p{font-size:8px}}
@media(max-width:600px){.wrap{padding-left:22px;padding-right:22px}.nav{height:75px}.nav-brand{font-size:23px}.nav>div{gap:20px}.mac-label{font-size:7px;letter-spacing:1.3px}.github-link{font-size:11px}.hero{display:flex;flex-direction:column;padding-top:28px;padding-bottom:0;min-height:0;text-align:center;overflow:clip}.hero-copy{width:100%}.hero .eyebrow{font-size:6px;letter-spacing:1px;margin:0 auto 12px;max-width:none}.hero h1{font-size:clamp(105px,27vw,150px);letter-spacing:-6px;margin-bottom:14px}.tagline{font-size:30px;line-height:1.12;letter-spacing:-1.3px;margin-bottom:15px}.tagline br{display:none}.tagline br:after{content:' '}.tagline{max-width:300px;margin-left:auto;margin-right:auto}.description{font-size:12px;line-height:1.75;margin-bottom:22px}.description br{display:none}.hero-actions{justify-content:center;gap:24px}.button{padding:13px 19px;font-size:11px}.quiet-link{font-size:10px}.mascot-scene{margin:0;width:min(110%,420px);aspect-ratio:1;align-self:center;margin-top:-2px}.goat-button{width:95%}.goat-reply{font-size:10px;top:20%;right:7%;padding:7px 10px}.comparison{padding-top:23px;padding-bottom:40px}.comparison-heading{padding-top:25px;margin-bottom:20px}.comparison-heading .eyebrow{font-size:6px;letter-spacing:1.2px;margin-bottom:11px}.comparison-heading h2{font-size:23px;letter-spacing:-.7px;line-height:1.25}.mobile-break{display:initial}.comparison-heading kbd{font-size:11px;padding:7px 10px;margin-bottom:4px}.comparison-toolbar{margin-bottom:12px;gap:10px}.compare-buttons{padding:3px;gap:1px}.compare-buttons button{font-size:9px;padding:8px 10px}.expand{font-size:9px}.expand span{margin-left:5px;font-size:11px}.comparison-shell{padding:4px;border-radius:9px;margin:0 -6px}.capture-stage{border-radius:5px}.split-line>span{width:32px;height:32px;border-width:2px;font-size:14px}.comparison-caption{font:7px/1.8 var(--mono);margin-top:14px;gap:0}.comparison-caption>span:last-child{display:none}footer{flex-wrap:wrap;padding-top:22px!important;padding-bottom:27px!important;gap:16px}.footer-brand{font-size:23px}footer p{order:3;width:100%;font-size:8px}footer>a{font-size:9px}.zoom-toolbar{padding:10px 12px;gap:10px}.zoom-toolbar strong{font-size:10px}.zoom-toolbar>div{gap:13px}.zoom-toolbar button,.zoom-toolbar a{font-size:9px}.zoom-note{font-size:8px;padding:10px 12px}.goat-button:focus-visible{outline-offset:-15px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.goat{transform:none!important}}
.hero{overflow:clip}
@media(min-width:601px) and (max-width:800px){.mascot-scene{width:110%;margin-left:-10%}}

#goat-viewer{position:absolute;inset:0;cursor:grab;touch-action:pan-y;border-radius:28px;overflow:hidden;opacity:0}#goat-viewer.ready{opacity:1}#goat-viewer:active{cursor:grabbing}#goat-viewer canvas{display:block;width:100%;height:100%}#goat[hidden]{display:none}.mascot-scene{perspective:none}#goat-viewer:focus-visible{outline:2px solid var(--orange);outline-offset:-8px}





/* A shared charcoal-and-amber stage, with a genuinely transparent WebGL layer. */
body{position:relative;isolation:isolate}
body::before{content:"";position:absolute;inset:0 0 auto;height:1100px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 530px 420px at calc(50% + 305px) 390px,#b849142b,transparent 78%),radial-gradient(ellipse 680px 340px at 55% 690px,#c14c0d0c,transparent 80%)}
.mascot-glow{inset:5% -9%;background:radial-gradient(ellipse at 50% 45%,#fb6d1615,transparent 67%)}
.mascot-scene::after{content:"";position:absolute;bottom:17%;left:32%;width:36%;height:4%;border-radius:50%;background:#05030290;filter:blur(13px);z-index:-1;pointer-events:none}
#goat-viewer{mask-image:none;border-radius:0}
h1{text-shadow:0 2px 0 #a36d3c22,0 12px 65px #ed76200d}
.button{position:relative;gap:30px;padding:12px 15px 12px 21px;border:1px solid #f4873985;border-radius:14px;color:#fff0d4;background:linear-gradient(155deg,#32241b,#18120e 65%);box-shadow:inset 0 1px 0 #ffc07738,inset 0 -3px 7px #0008,0 5px 13px #0007,0 0 24px #ff6b1715;text-shadow:0 1px 2px #000;transition:transform .2s,box-shadow .2s,border-color .2s}
.button>span{display:grid;place-items:center;width:27px;height:27px;border-radius:8px;color:#ffa54d;background:#100c09;border:1px solid #ec772e3d;box-shadow:inset 0 1px 4px #0009,0 0 12px #ff6b1710;text-shadow:0 0 8px #ff721ac0;font-size:17px;font-weight:500}
.button:hover{background:linear-gradient(155deg,#3b291c,#1c140f 65%);border-color:#ffa451;box-shadow:inset 0 1px 0 #ffd39955,inset 0 -3px 7px #0008,0 7px 20px #0008,0 0 30px #ff7c292b;transform:translateY(-2px)}
.button:active{transform:translateY(1px);box-shadow:inset 0 2px 8px #0009,0 0 18px #ff7c291f}
.quiet-link{color:#c8ae98}.quiet-link:hover{color:#ffe2bb}.quiet-link span{color:#de8a4d}


.comparison-shell{border-color:#d87a3b50;box-shadow:0 30px 80px -35px #000,0 -12px 85px #ed6c1910,inset 0 1px 0 #ffbc7940}
@media(max-width:800px){body::before{background:radial-gradient(ellipse 390px 330px at 78% 340px,#b8491424,transparent 78%)}.button{gap:20px;padding:10px 12px 10px 17px}}
@media(max-width:600px){body::before{height:1100px;background:radial-gradient(ellipse 330px 350px at 50% 610px,#b8491430,transparent 78%),radial-gradient(ellipse 300px 200px at 50% 290px,#c14c0d0c,transparent 80%)}.button{gap:24px}.mascot-scene::after{filter:blur(10px)}}

#goat-viewer{touch-action:none}

/* Model-first entrance: layout stays in place while its contents are concealed. */
#intro-loader{display:none}
html[data-intro]{overflow:hidden}
html[data-intro] .hero{overflow:visible}
html[data-intro] .nav,html[data-intro] .hero-copy,html[data-intro] .comparison,html[data-intro] footer,html[data-intro] .skip{visibility:hidden}
html[data-intro] .mascot-scene{pointer-events:none;z-index:40;will-change:transform,opacity}
html[data-intro="loading"] .mascot-scene{opacity:0}
html[data-intro="loading"] #intro-loader{display:flex;position:fixed;inset:0;z-index:60;align-items:center;justify-content:center;flex-direction:column;gap:22px;background:#0d0b0a;color:#ff8b39}
.loader-label{font:10px var(--mono);letter-spacing:2px;text-transform:uppercase;color:#a58e7a}
html[data-intro="copy"] .nav,html[data-intro="copy"] .hero-copy,html[data-intro="copy"] .comparison,html[data-intro="copy"] footer{visibility:visible}

.conversation-loader{display:block;width:76px;height:76px;filter:drop-shadow(0 0 22px #ff761630)}
.nav-brand{display:inline-flex;align-items:center;gap:9px;font:500 25px/1 'Fredoka',sans-serif;letter-spacing:-.8px;color:var(--cream);text-shadow:none}
.nav-brand img{display:block;width:44px;height:44px;filter:drop-shadow(0 3px 9px #ff6b1718);transition:transform .25s ease}
.nav-brand:hover img{transform:rotate(-7deg)}
@media(max-width:600px){.nav-brand{font-size:22px;gap:5px}.nav-brand img{width:38px;height:38px}}
@media(prefers-reduced-motion:reduce){.nav-brand img{transition:none}.nav-brand:hover img{transform:none}}

/* A product promise, paired with a molded orange-rubber action. */
.hero h1{font-size:clamp(48px,5.5vw,77px);font-weight:500;letter-spacing:-2.9px;line-height:1.06;margin:0 0 26px}
.hero h1>span{color:#ffac62}
.hero .description{margin-bottom:30px}
.hero .button{gap:25px;padding:9px 10px 9px 25px;min-height:58px;border-radius:999px;border:1px solid #ffc17d;color:#23140c;font-size:14px;font-weight:700;letter-spacing:-.2px;text-shadow:0 1px 0 #ffd69b55;background:linear-gradient(155deg,#ffbe70 0%,#ff923e 38%,#ed6b20 100%);box-shadow:inset 0 2px 2px #ffe1ad80,inset 0 -4px 6px #96360655,0 2px 0 3px #24160e,0 9px 20px #0007,0 0 35px #ff791b20;transition:transform .22s,box-shadow .22s}
.hero .button>span{width:38px;height:38px;border-radius:50%;border:1px solid #713c21;color:#ffac62;background:linear-gradient(145deg,#32251d,#14100d);font-size:23px;box-shadow:inset 0 2px 4px #0009,0 1px 0 #ffd09a90;text-shadow:0 0 10px #ff7b2350;transition:transform .22s}
.hero .button:hover{transform:translateY(-3px);background:linear-gradient(155deg,#ffc984,#ff9b49 38%,#f3792e);box-shadow:inset 0 2px 2px #ffe1ad80,inset 0 -4px 6px #96360655,0 2px 0 3px #322015,0 12px 24px #0008,0 0 42px #ff791b35}
.hero .button:hover>span{transform:rotate(8deg)}
.hero .button:active{transform:translateY(1px) scale(.98);box-shadow:inset 0 2px 7px #96360655,0 1px 0 2px #24160e,0 3px 10px #0006}
@media(max-width:800px){.hero h1{font-size:clamp(40px,5.6vw,58px);letter-spacing:-1.8px}.hero .button{gap:18px;padding-left:21px}}
@media(max-width:600px){.hero h1{font-size:clamp(42px,11.8vw,65px);letter-spacing:-1.9px;line-height:1.08;margin-bottom:22px}.hero .description{margin-bottom:26px}.hero-actions{gap:22px}.hero .button{font-size:13px;min-height:54px;padding:8px 9px 8px 22px;gap:18px}.hero .button>span{width:34px;height:34px}}
@media(prefers-reduced-motion:reduce){.hero .button,.hero .button>span{transition:none}.hero .button:hover,.hero .button:hover>span,.hero .button:active{transform:none}}