
.hero{isolation:isolate;display:grid;grid-template-columns:29% 42% 29%;grid-template-rows:1fr auto;align-items:center;min-height:620px;padding:35px 0 22px;gap:0;position:relative}
.hero:before{content:'';position:absolute;z-index:-1;left:-25px;right:-25px;bottom:0;height:45%;background:#cce6df;border-radius:52% 48% 20px 20px / 35% 30% 20px 20px;transform:rotate(-1deg);pointer-events:none}
.intro{grid-column:1;grid-row:1;align-self:center;position:relative;z-index:2;padding-bottom:65px}
.intro .eyebrow{font-size:10px;line-height:1.7;display:block;max-width:245px}
h1{font-size:112px;letter-spacing:-8px;margin:22px 0 16px}.asterisk{font-size:35px;margin-left:6px}.tagline{font-size:24px;letter-spacing:-.7px;max-width:260px;line-height:1.25}.hello{font-size:14px;line-height:1.7;max-width:265px;margin-top:25px}
.creature-space{position:relative;grid-column:2;grid-row:1;top:auto;left:auto;width:100%;height:470px;align-self:end}
.mascot-wrap{width:610px;max-width:none;left:50%;top:-65px;transform:translateX(-50%)}
.speech{top:0;left:12%;max-width:270px;font-size:13px;transform:rotate(-5deg);padding:14px 18px;z-index:3}
.scribble{right:-8px;bottom:105px;font-size:13px;z-index:2}.ground-label{left:50%;bottom:10px;transform:translateX(-50%);white-space:nowrap;font-size:11px}
.status{grid-column:3;grid-row:1;position:relative;z-index:3;width:100%;margin:0 0 15px;align-self:center;padding:25px;justify-self:stretch;background:rgba(255,255,249,.57)}
.status-heading{font-size:10px;gap:6px}.status dl>div{font-size:13px;margin:18px 0}.learning p{font-size:21px;line-height:1.35;min-height:56px}.learning small{line-height:1.6;display:block}
.interactions{grid-column:1/-1;grid-row:2;margin:20px auto 0;align-self:end;justify-content:center;width:max-content;max-width:100%;padding:12px 16px 8px;position:relative;z-index:4;border:1px solid rgba(255,255,255,.8);border-radius:32px;background:rgba(255,255,249,.32);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 12px 28px rgba(52,72,61,.09);gap:10px}
.interactions button{min-width:158px;padding:16px 20px;font-size:12px;box-shadow:none;background:rgba(255,255,249,.25)}.interactions p{margin:2px 0 0;text-align:center;font-size:10px;padding-bottom:2px}.memory{margin-top:25px}
@media(min-width:1001px) and (max-width:1200px){.hero{grid-template-columns:27% 42% 31%;min-height:620px}h1{font-size:95px}.tagline{font-size:21px}.mascot-wrap{width:570px}.speech{left:0;max-width:230px}.status{padding:22px}.scribble{right:0;bottom:90px;font-size:11px}}
@media(max-width:1000px){.hero{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto auto;gap:20px;min-height:0;padding-top:30px}.intro{grid-column:1/-1;grid-row:1;padding-bottom:0;text-align:center}.intro .eyebrow,.tagline,.hello{max-width:none}.intro h1{font-size:105px;margin:14px 0 10px}.intro .eyebrow{font-size:10px}.hello{margin:15px 0 0}.creature-space{grid-column:1;grid-row:2;height:390px;align-self:center}.mascot-wrap{width:490px;top:-38px}.speech{top:0;left:0;max-width:230px;font-size:12px}.scribble{right:0;bottom:75px;font-size:11px}.ground-label{bottom:0;font-size:10px}.status{grid-column:2;grid-row:2;margin:0;padding:22px}.interactions{grid-column:1/-1;grid-row:3;margin:0 auto;gap:8px;width:100%}.interactions button{flex:1;min-width:0;padding:16px 10px;font-size:11px}.hero:before{left:-10px;right:-10px;height:52%;border-radius:45% 45% 20px 20px / 12% 15% 20px 20px}}
@media(max-width:600px){.hero{grid-template-columns:1fr;gap:20px}.intro h1{font-size:96px}.tagline{font-size:22px}.hello{font-size:13px}.intro .eyebrow{font-size:9px;letter-spacing:1px}.creature-space{grid-column:1;grid-row:2;height:365px;width:100%;max-width:400px;justify-self:center}.mascot-wrap{width:460px;top:-40px}.speech{left:13%;max-width:245px;font-size:11px}.scribble{right:0;bottom:78px}.status{grid-column:1;grid-row:3;width:100%;padding:22px}.status dl{display:grid;grid-template-columns:1fr 1fr;gap:10px 22px}.status dl>div{flex-direction:column;gap:7px;margin:5px 0;font-size:12px}.status-heading{font-size:10px}.learning{margin-top:18px;padding-top:16px}.learning p{min-height:0;margin:10px 0;font-size:20px}.interactions{grid-row:4;padding:10px 8px 8px;border-radius:24px}.interactions button{font-size:9px;padding:14px 5px}.interactions p{font-size:9px}.hero:before{height:65%}.reaction{font-size:32px}.memory{margin-top:30px}}

.ground-label{bottom:-8px}.scribble{left:8px;right:auto;bottom:100px;max-width:110px;transform:rotate(-8deg)}.interactions{margin-top:35px}@media(max-width:1000px){.ground-label{bottom:0}.scribble{left:auto;right:0;bottom:65px}.interactions{margin-top:0}}@media(max-width:600px){.creature-space{overflow:clip}.scribble{font-size:10px;max-width:95px}}

.ground-label{display:none}

.status dl>div{gap:12px}.status dd{max-width:67%;overflow-wrap:anywhere;text-align:right;line-height:1.4}.speech{min-height:55px}.scribble{line-height:1.5}@media(max-width:600px){.status dd{max-width:none;text-align:left}.status dl>div{gap:7px}}

.memory-tools{grid-column:2;display:flex;align-items:center;gap:15px;margin-top:10px;flex-wrap:wrap}.memory-tools button{background:rgba(255,255,249,.5);border:1px solid rgba(94,110,99,.3);border-radius:999px;padding:11px 16px;font:11px 'Space Mono',monospace}.memory-tools button:hover{background:#c6e6df}.memory-tools span{font:11px 'Space Mono',monospace;color:var(--muted)}@media(max-width:1000px){.memory-tools{grid-column:1}}
