@font-face{font-family:Fredoka;src:url('./assets/fonts/fredoka.ttf') format('truetype');font-weight:300 700;font-display:swap}
@font-face{font-family:'DM Sans';src:url('./assets/fonts/dmsans.ttf') format('truetype');font-weight:100 1000;font-display:swap}
:root{color-scheme:light;--canvas:#DDEEDD;--ink:#254C3D;--quiet:#556B59;--paper:#FFFDF5;--card:#F5D77B;--panel:#C5DFBD;--action:#315742;--action-ink:#FFFDF5;--rule:#A8BEA4;--sprite:url('./assets/brand/pip-good-states.png')}
html[data-mood=evil]{color-scheme:dark;--canvas:#352237;--ink:#FFE3CE;--quiet:#D6B4C4;--paper:#513348;--card:#F5A08D;--panel:#69415A;--action:#F5A08D;--action-ink:#392438;--rule:#916379;--sprite:url('./assets/brand/evil-states.png')}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--canvas);color:var(--ink);font:400 17px/1.6 'DM Sans',system-ui,sans-serif;-webkit-text-size-adjust:100%}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit;text-underline-offset:5px}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--ink);outline-offset:5px}.wrap{width:min(1200px,calc(100% - 96px));margin-inline:auto}.icon-defs{position:absolute;width:0;height:0;overflow:hidden}.skip-link{position:absolute;z-index:50;top:-100px;left:20px;padding:12px 20px;background:var(--action);color:var(--action-ink);border-radius:12px}.skip-link:focus{top:16px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.header{display:flex;align-items:center;gap:40px;min-height:116px}.brand{display:inline-flex;align-items:center;flex-shrink:0}.brand img{display:block;height:auto}.logo-evil{display:none!important}html[data-mood=evil] .logo-good{display:none}html[data-mood=evil] .logo-evil{display:block!important}.header nav{display:flex;justify-content:center;flex:1;gap:30px}.header nav a{font-size:15px;font-weight:600;padding:12px 0;text-decoration:none}.header nav a:hover,.text-link:hover{text-decoration:underline}.launch-note{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:9px 17px;border:1px solid var(--rule);border-radius:100px;font-size:14px;font-weight:600;white-space:nowrap}
h1,h2,h3{font-family:Fredoka,ui-rounded,sans-serif;font-weight:500;line-height:1.04;letter-spacing:-.025em;margin:0}h1{font-size:clamp(68px,7.9vw,110px)}h2{font-size:clamp(38px,4.4vw,58px)}h3{font-size:25px;letter-spacing:-.012em;line-height:1.2}p{margin:0}svg{width:26px;height:26px;flex-shrink:0}.hero{display:grid;grid-template-columns:1.12fr 1fr;gap:50px;align-items:center;padding:58px 0 100px}.hero-intro{font-size:21px;line-height:1.55;max-width:37ch;margin-top:28px}.hero-actions{display:flex;align-items:center;gap:30px;margin-top:34px}.button{display:inline-flex;gap:24px;align-items:center;border:0;background:var(--action);color:var(--action-ink);min-height:58px;padding:15px 25px;border-radius:100px;font-weight:700}.button:hover{filter:brightness(.94)}.text-link{font-weight:700;text-decoration:none;min-height:44px;display:inline-flex;align-items:center}.hero-footnote{font-size:14px;color:var(--quiet);margin-top:23px}.pocket-stage{display:flex;flex-direction:column;align-items:center;position:relative}.mood-switch{display:flex;align-items:center;gap:6px;background:var(--paper);border-radius:100px;padding:6px;margin-bottom:27px}.mood-switch button{border:0;border-radius:100px;padding:10px 16px;background:transparent;color:var(--quiet);display:flex;align-items:center;gap:10px;min-height:48px;font-weight:700}.mood-switch button[aria-pressed=true]{background:var(--action);color:var(--action-ink);padding-inline:21px}.mood-switch button[aria-pressed=false] span{display:none}.mood-switch svg{width:27px;height:27px}.stack{width:min(100%,342px);height:425px;position:relative;perspective:1400px}.back-paper{position:absolute;inset:0;border-radius:32px;box-shadow:0 1px 0 #254c3d1a}.back-one{background:#BDCEE0;transform:rotate(-7deg) translate(-9px,4px)}.back-two{background:#D7C8E7;transform:rotate(6deg) translate(9px,7px)}html[data-mood=evil] .back-one{background:#A781A5}html[data-mood=evil] .back-two{background:#BD7F8F}.demo-card{position:relative;width:100%;height:100%;border:0;background:transparent;border-radius:32px;padding:0;transform-style:preserve-3d;transition:transform .65s cubic-bezier(.2,.7,.3,1);text-align:left;color:#254C3D;box-shadow:0 24px 42px #254c3d1c}.demo-card.is-flipped{transform:rotateY(180deg)}html[data-mood=evil] .demo-card{color:#392438;box-shadow:0 24px 42px #140c191f}.card-face{position:absolute;inset:0;display:flex;flex-direction:column;padding:29px 28px 25px;border-radius:32px;background:var(--card);backface-visibility:hidden;-webkit-backface-visibility:hidden;border:1px solid #254c3d1f;overflow:hidden}.card-face::after{content:'';position:absolute;inset:11px;border:1px solid #254c3d24;border-radius:23px;pointer-events:none}.card-back{transform:rotateY(180deg)}.card-top{display:flex;justify-content:space-between;gap:12px;font-size:12px;font-weight:700;line-height:1.4}.expression{font-family:Fredoka,ui-rounded,sans-serif;font-size:65px;line-height:1.08;font-weight:500;letter-spacing:-.025em;margin-top:35px}.meaning{font-size:16px;line-height:1.5;max-width:22ch;margin-top:13px}.pip{width:150px;aspect-ratio:1;background-image:var(--sprite);background-size:300% 200%;background-position:0 0;background-repeat:no-repeat;flex-shrink:0}.card-front .pip{position:absolute;width:139px;right:8px;bottom:48px}.card-bottom{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:700;margin-top:auto;min-height:43px;padding:10px 12px;background:#254c3d12;border-radius:13px}.card-bottom svg{width:20px;height:20px}.example{font-family:Fredoka,ui-rounded,sans-serif;font-size:35px;line-height:1.14;margin:25px 0 23px}.context-label{font-size:12px;font-weight:700;margin:0 0 4px}.context{font-size:14px;line-height:1.45;margin-bottom:14px}.demo-caption{text-align:center;font-size:13px;line-height:1.6;color:var(--quiet);margin-top:28px}
.how-section{background:var(--paper);padding:88px 0}.how-layout{display:grid;grid-template-columns:1fr 1fr;gap:120px}.section-intro{font-size:18px;margin-top:24px;max-width:36ch;color:var(--quiet)}.how-story>div{display:flex;gap:22px;padding:22px 0}.how-story>div:first-child{padding-top:0}.how-story>div+div{border-top:1px solid var(--rule)}.how-story svg{margin-top:3px;width:29px;height:29px}.how-story p{font-size:16px;line-height:1.55;color:var(--quiet);margin-top:9px;max-width:39ch}.screens-section{padding:98px 0 90px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:60px;margin-bottom:45px}.section-heading p{max-width:36ch;color:var(--quiet);font-size:18px}.screens{display:flex;gap:40px;justify-content:center}.screens figure{margin:0;flex:1;min-width:0;max-width:295px}.screens img{width:100%;height:auto;display:block;border-radius:32px;box-shadow:0 12px 25px #254c3d14}.screens figcaption{font-size:16px;font-weight:600;line-height:1.45;text-align:center;padding-top:20px}.capture-note{font-size:13px;color:var(--quiet);text-align:center;margin-top:24px}.languages-section{padding:66px 0;background:var(--panel)}.languages-layout{display:grid;grid-template-columns:1fr 1.2fr;gap:75px}.languages-layout p{font-size:18px;max-width:45ch;margin-bottom:25px}.languages{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0}.languages li{font-size:14px;min-height:38px;display:flex;align-items:center;padding:6px 13px;border:1px solid var(--rule);border-radius:100px}.questions-section{display:grid;grid-template-columns:1fr 1.3fr;gap:80px;padding:90px 0}.questions-heading .pip{margin-top:24px;width:178px;background-position:0 100%}.questions-list details{border-bottom:1px solid var(--rule)}.questions-list details:first-child{border-top:1px solid var(--rule)}summary{cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 0;min-height:66px;font-size:18px;font-weight:600;list-style:none}summary::-webkit-details-marker{display:none}summary::after{content:'+';font-size:26px;font-weight:400;flex-shrink:0}details[open] summary::after{content:'−'}.questions-list p{font-size:16px;line-height:1.65;color:var(--quiet);padding:0 35px 24px 0;max-width:65ch}.closing{padding:70px 0 80px;text-align:center;border-top:1px solid var(--rule)}.closing p{color:var(--quiet);margin-bottom:16px}.closing h2{font-size:clamp(46px,5.7vw,74px);margin-bottom:27px}.footer{display:flex;align-items:center;gap:30px;min-height:105px;border-top:1px solid var(--rule)}.footer p{flex:1;font-size:14px;color:var(--quiet)}.footer>a:last-child{font-size:14px;font-weight:600;min-height:44px;display:flex;align-items:center}
@media(min-width:1500px){.hero{padding-top:80px;padding-bottom:125px}}
@media(max-width:1000px){.wrap{width:calc(100% - 64px)}.header{gap:20px}.header nav{gap:20px}.header>.launch-note{display:none}.hero{gap:30px}.hero-intro{font-size:19px}.stack{width:300px;height:410px}.card-face{padding:28px 25px 24px}.expression{font-size:59px}.how-layout{gap:60px}.section-heading{gap:35px}.screens{gap:25px}.screens img{border-radius:25px}.languages-layout{gap:45px}.questions-section{gap:50px}}
@media(max-width:720px){.wrap{width:calc(100% - 40px)}.header{min-height:90px;justify-content:space-between;gap:14px}.header .brand img{width:130px}.header nav{flex:0;gap:18px}.header nav a{font-size:13px;white-space:nowrap}.header nav a:first-child{display:none}.hero{grid-template-columns:1fr;gap:40px;padding:30px 0 62px}.hero h1{font-size:clamp(65px,12vw,88px)}.hero-intro{max-width:35ch;margin-top:22px;font-size:18px}.hero-actions{gap:24px;margin-top:25px}.button{min-height:54px;padding:13px 22px;gap:20px}.hero-footnote{margin-top:18px;font-size:13px}.pocket-stage{margin-top:3px}.stack{width:300px;height:410px}.mood-switch{margin-bottom:24px}.demo-caption{margin-top:27px}.how-section{padding:56px 0}.how-layout{grid-template-columns:1fr;gap:33px}.section-intro{margin-top:18px}.how-story>div{padding:19px 0}.screens-section{padding:58px 0}.section-heading{display:block;margin-bottom:32px}.section-heading p{margin-top:20px}.screens{overflow-x:auto;justify-content:flex-start;gap:18px;scroll-snap-type:x mandatory;padding:5px 0 20px}.screens figure{flex:0 0 74%;max-width:280px;scroll-snap-align:center}.screens figcaption{font-size:14px}.screens img{border-radius:26px}.capture-note{text-align:left;margin-top:14px}.languages-section{padding:46px 0}.languages-layout{grid-template-columns:1fr;gap:24px}.languages-layout p{font-size:17px}.questions-section{grid-template-columns:1fr;gap:24px;padding:55px 0}.questions-heading{display:flex;align-items:center;justify-content:space-between}.questions-heading .pip{margin:0;width:112px}.questions-list summary{font-size:16px;padding:19px 0}.closing{padding:48px 0 55px}.footer{gap:18px;flex-wrap:wrap;padding:22px 0;min-height:100px}.footer p{font-size:12px}.footer .brand img{width:104px}.footer>a:last-child{font-size:13px}}
@media(max-width:360px){.stack{width:272px;height:410px}.card-face{padding:27px 23px 23px}.expression{font-size:55px}.meaning{font-size:15px;max-width:21ch}.card-front .pip{width:128px}.example{font-size:31px}.context{font-size:13px}.header nav{gap:12px}.wrap{width:calc(100% - 32px)}.hero-actions{gap:19px}.hero h1{font-size:62px}.hero-intro{font-size:17px}.card-top{font-size:11px}.footer p{flex-basis:40%;text-align:right}.footer>a:last-child{margin-left:auto}.questions-heading .pip{width:94px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}body,.demo-card{transition:none}}
@media(max-width:360px){.back-one{transform:rotate(-3deg) translate(-5px,4px)}.back-two{transform:rotate(3deg) translate(5px,7px)}}

.footer nav{display:flex;align-items:center;gap:20px;flex-wrap:wrap}.footer nav a{display:inline-flex;align-items:center;min-height:44px;font-size:14px;font-weight:600}@media(max-width:720px){.footer nav{width:100%;justify-content:space-between;gap:16px}}
