:root{font-family:Arial,'Helvetica Neue','PingFang SC','Microsoft YaHei',sans-serif;color:#202019;background:#d7f545;font-synthesis:none;--ink:#202019;--lime:#d7f545;--pink:#f397c4;--blue:#2741e7;--mono:'SFMono-Regular',Consolas,monospace}

*{box-sizing:border-box}
html{scroll-behavior:auto}
body{margin:0;min-width:280px;overflow-x:clip}
button,a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
button{font:inherit;cursor:pointer}
a{color:inherit;text-decoration:none}
h1,h2,p{margin:0}
button:focus-visible,a:focus-visible{outline:3px solid var(--blue);outline-offset:4px}
main:focus,section:focus{outline:none}
::selection{background:var(--blue);color:#fff}

.skip-link{position:fixed;top:12px;left:12px;z-index:100;padding:12px 16px;background:var(--ink);color:var(--lime);transform:translateY(-170%)}
.skip-link:focus{transform:none}

.site-header{min-height:86px;padding:14px clamp(20px,5vw,76px);display:flex;align-items:center;gap:36px;border-bottom:2px solid var(--ink)}
.wordmark{display:inline-flex;align-items:center;min-height:48px;font-size:34px;font-weight:900;letter-spacing:-.09em;white-space:nowrap;transform:rotate(-3deg)}
.wordmark img{width:38px;height:38px;object-fit:contain;margin:0 4px}
.header-note{margin-left:auto;font:10px/1.45 var(--mono);letter-spacing:.05em}
.site-header nav{display:flex;align-items:center;gap:12px}
.site-header nav a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:9px 14px;font-size:14px;font-weight:700;white-space:nowrap;border:1.5px solid var(--ink);box-shadow:3px 3px 0 var(--ink);transition:transform .18s,box-shadow .18s,background .18s}
.site-header nav a:first-child{border-color:transparent;box-shadow:none}
.site-header nav a:hover,.site-header nav a:focus-visible{background:var(--ink);color:var(--lime)}
.site-header nav a:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}

.hero{padding:24px clamp(20px,5vw,76px) 34px;overflow:hidden}
.hero-top{display:flex;justify-content:space-between;gap:20px;font:11px/1.4 var(--mono);letter-spacing:.02em}
.hero-stage{position:relative;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(350px,.75fr);align-items:center;min-height:560px}
.hero-type{position:relative;z-index:1;align-self:center}
.hero-kicker{font-size:16px;font-weight:700;margin:2px 0 20px}
.hero h1{font-size:clamp(130px,19vw,280px);font-weight:900;line-height:.76;letter-spacing:-.095em}
.hero h1>span{display:block;white-space:nowrap}
.hero h1>span+span{margin-left:4%}
.question{color:var(--blue);-webkit-text-stroke:2px var(--ink);display:inline-block;transform:rotate(12deg)}

.collage{position:relative;z-index:2;height:540px;min-width:0;isolation:isolate}
.collage-image{position:absolute;width:95%;height:88%;left:1%;top:5%;object-fit:cover;opacity:.19;clip-path:polygon(4% 2%,97% 0,100% 91%,8% 100%,0 48%)}
.movable{position:absolute;transform:translate(var(--shift-x,0px),var(--shift-y,0px)) rotate(var(--tilt,0deg));transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.pink-note{z-index:3;right:13%;top:23px;width:240px;min-height:320px;padding:24px;background:var(--pink);box-shadow:8px 9px 0 var(--ink);display:flex;flex-direction:column}
.micro{font:11px/1.4 var(--mono);letter-spacing:.06em}
.pink-note strong{font-size:44px;line-height:1.08;letter-spacing:-.07em;margin:25px 0;white-space:nowrap}
.pink-note-foot{font:12px/1.35 var(--mono)}
.note-cross{position:absolute;right:16px;bottom:-8px;font-size:74px;line-height:1;font-weight:300}
.seed-seal{z-index:4;left:-14%;top:245px;width:164px;height:164px;display:grid;place-items:center}
.seed-seal img{position:absolute;width:100%;height:100%;object-fit:contain}
.seed-seal span{position:relative;font:900 12px/.95 var(--mono);text-align:center;letter-spacing:-.07em;transform:rotate(-8deg)}
.paper-note{z-index:5;right:5%;bottom:18px;width:235px;min-height:152px;padding:24px 18px 10px;background:#eeeae0;box-shadow:4px 6px 0 #20201933}
.paper-note p{font-size:17px;line-height:1.6}
.paper-note b{font-weight:900}
.tape{position:absolute;left:30%;top:-11px;width:96px;height:25px;background:#aaa88cab;transform:rotate(-5deg);clip-path:polygon(0 4%,98% 0,95% 25%,100% 55%,98% 100%,0 96%,3% 65%,0 35%)}
.hand-arrow{display:block;text-align:right;font-size:54px;line-height:.7}
.black-sticker{z-index:6;left:0;bottom:42px;width:90px;height:90px;border-radius:50%;background:var(--ink);color:var(--lime);display:grid;place-content:center;text-align:center;font:11px/1.3 var(--mono);outline:2px dashed var(--ink);outline-offset:5px}
.black-sticker strong{font:900 16px/1.3 Arial,sans-serif}

.hero-bottom{display:flex;align-items:end;justify-content:space-between;gap:24px;position:relative;z-index:7}
.hero-bottom>p{font-size:16px;line-height:1.6;font-weight:600}
.remix-group{display:flex;align-items:center;gap:16px}
.remix-group button{border:2px solid var(--ink);background:var(--ink);color:var(--lime);min-height:52px;padding:9px 17px;display:inline-flex;align-items:center;gap:22px;font-size:16px;font-weight:900;white-space:nowrap;box-shadow:4px 4px 0 var(--blue);transition:transform .18s,box-shadow .18s}
.remix-group button:hover{background:var(--blue);border-color:var(--blue);color:#fff}
.remix-group button:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--blue)}
.remix-group button span{font-size:24px;line-height:1}
.remix-status{min-width:90px;font:700 12px/1.3 var(--mono);white-space:nowrap}

.ticker{position:relative;overflow:hidden;background:var(--ink);color:var(--lime);padding:10px 0;transform:rotate(-1deg);font-size:clamp(25px,3.2vw,47px);font-weight:900;letter-spacing:-.05em;white-space:nowrap;contain:paint}
.ticker-track{display:flex;width:max-content;animation:ticker-slide 24s linear infinite;will-change:transform}
.ticker-track span{display:block;flex:none}
.ticker.is-hidden .ticker-track{animation-play-state:paused}
@keyframes ticker-slide{to{transform:translate3d(-50%,0,0)}}

.manifesto{padding:clamp(72px,8vw,130px) clamp(20px,6vw,90px);display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,90px)}
.manifesto h2{margin-top:26px;font-size:clamp(52px,6.7vw,105px);font-weight:900;line-height:1.12;letter-spacing:-.07em}
.manifesto h2 span{color:var(--blue);white-space:nowrap}
.statements article{display:grid;grid-template-columns:44px 1fr;gap:20px;align-items:start;padding:22px 0;border-bottom:2px solid var(--ink)}
.statements article:first-child{border-top:2px solid var(--ink)}
.statements article>span{font:12px/1.6 var(--mono)}
.statements p{font-size:clamp(20px,2vw,27px);line-height:1.5;font-weight:700;letter-spacing:-.04em}

.about{background:var(--pink);border-block:2px solid var(--ink);padding:76px clamp(20px,6vw,90px);display:flex;justify-content:space-between;align-items:end;gap:30px}
.about h2{font-size:clamp(40px,5vw,70px);letter-spacing:-.06em;margin:24px 0}
.about h2 em{font:italic .72em Georgia,'Songti SC',serif;white-space:nowrap;margin-left:12px}
.about p{max-width:580px;font-size:17px;line-height:1.75}
.about>a{min-height:48px;padding:12px 3px;white-space:nowrap;border-bottom:2px solid;font-size:16px;font-weight:700}
.about>a:hover,.site-footer a:hover{text-decoration:underline;text-underline-offset:5px}
.site-footer{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:32px clamp(20px,6vw,90px) 48px;font:12px/1.4 var(--mono)}
.site-footer a{display:inline-flex;align-items:center;min-height:44px;padding:8px 0;font-weight:700;white-space:nowrap}

@media(max-width:950px){.header-note{display:none}
.site-header{justify-content:space-between}
.hero-stage{grid-template-columns:minmax(0,1.15fr) minmax(290px,.85fr);min-height:490px}
.hero h1{font-size:clamp(115px,18vw,190px)}
.collage{height:460px}
.pink-note{right:4%;width:205px;min-height:285px;padding:19px}
.pink-note strong{font-size:49px}
.seed-seal{width:135px;height:135px;left:-12%;top:205px}
.paper-note{right:0;width:210px;min-height:135px;padding:17px}
.paper-note p{font-size:15px}
.black-sticker{left:-3%;bottom:28px}
.manifesto{grid-template-columns:1fr;gap:30px}
.manifesto h2{font-size:clamp(55px,8vw,85px)}
.statements{max-width:650px}
}

@media(max-width:700px){.site-header{min-height:72px;padding:12px 6%;gap:12px}
.wordmark{font-size:26px;min-height:44px}
.wordmark img{width:31px;height:31px;margin:0 2px}
.site-header nav{gap:6px}
.site-header nav a{font-size:12px;padding:8px;min-height:44px}
.site-header nav a:first-child{display:inline-flex}
.hero{padding:18px 6% 32px}
.hero-top{font-size:10px}
.hero-top span:last-child{display:none}
.hero-stage{display:block;min-height:0}
.hero-type{padding-top:28px}
.hero-kicker{font-size:15px;margin-bottom:12px}
.hero h1{font-size:clamp(100px,31vw,190px);letter-spacing:-.105em;line-height:.79}
.hero h1>span+span{margin-left:0}
.collage{height:285px;margin-top:7px}
.collage-image{left:6%;top:10px;width:90%;height:270px;opacity:.18}
.pink-note{top:4px;right:4%;width:45%;min-height:210px;padding:14px;box-shadow:5px 6px 0 var(--ink)}
.pink-note .micro{font-size:8px}
.pink-note strong{font-size:clamp(28px,8vw,38px);margin:10px 0}
.pink-note-foot{font-size:9px}
.note-cross{font-size:50px;right:9px;bottom:0}
.seed-seal{width:35%;height:auto;aspect-ratio:1;top:75px;left:0}
.seed-seal span{font-size:clamp(9px,2.8vw,12px)}
.paper-note{right:4%;bottom:7px;width:53%;min-height:106px;padding:15px 13px 7px}
.paper-note p{font-size:clamp(13px,3.6vw,16px);line-height:1.45}
.hand-arrow{font-size:36px}
.tape{width:70px;height:19px}
.black-sticker{left:4%;bottom:22px;width:73px;height:73px;font-size:9px}
.black-sticker strong{font-size:13px}
.hero-bottom{align-items:start;flex-direction:column;gap:16px}
.hero-bottom>p{font-size:15px}
.remix-group{width:100%;justify-content:space-between}
.remix-group button{min-height:50px;font-size:15px}
.remix-status{font-size:13px;min-width:0}
.ticker{font-size:29px}
.manifesto{padding:72px 6%;gap:36px}
.manifesto h2{font-size:clamp(52px,12vw,75px)}
.statements article{grid-template-columns:42px 1fr;gap:10px}
.statements p{font-size:21px}
.about{padding:68px 6%;display:block}
.about h2{font-size:42px}
.about h2 em{font-size:.72em;display:block;margin:7px 0 0}
.about p{font-size:16px}
.about>a{display:inline-flex;margin-top:24px}
.site-footer{padding:27px 6% 38px;flex-wrap:wrap;font-size:11px}
.site-footer>span:nth-child(2){order:3;width:100%}
}

@media(max-width:360px){.site-header{gap:4px}
.site-header nav{gap:0}
.site-header nav a{font-size:10px;padding:6px}
.wordmark{font-size:23px}
.wordmark img{width:28px;height:28px}
.hero h1{font-size:30vw}
.collage{height:275px}
.collage-image{height:260px}
.pink-note{min-height:198px}
.pink-note strong{font-size:28px}
.paper-note{width:52%;min-height:104px}
.paper-note p{font-size:12.5px}
.black-sticker{bottom:28px}
.hero-bottom>p{font-size:14px}
.remix-group button{gap:11px;padding:8px 11px}
.remix-status{font-size:12px}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
*,*::before,*::after{animation:none!important;transition:none!important}
}

.ai-usage-peek{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;max-width:510px;min-height:68px;margin-top:26px;padding:10px 14px;border:2px solid var(--ink);background:#eeeae0;box-shadow:5px 5px 0 var(--ink);transition:transform .18s ease,box-shadow .18s ease}
.ai-usage-peek:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--ink)}
.ai-usage-peek-label{font:700 10px/1.25 var(--mono);letter-spacing:.05em;text-transform:uppercase;max-width:116px}
.ai-usage-peek-label small{display:block;margin-top:5px;font:500 10px/1.25 var(--mono);letter-spacing:0}
.ai-usage-peek strong{font:900 clamp(21px,2.4vw,33px)/1 var(--mono);letter-spacing:-.04em;white-space:nowrap}
.ai-usage-peek-arrow{font-size:27px;line-height:1}
@media(max-width:700px){.ai-usage-peek{margin-top:22px;min-height:62px}.ai-usage-peek strong{font-size:clamp(19px,5.5vw,26px)}}
