/* A little toybox inside the otherwise quiet, warm site. */
.brand-mark{transition:transform .3s cubic-bezier(.2,1.5,.5,1)}
.brand:hover .brand-mark{transform:rotate(-12deg)}
.brand:hover .brand-mark i{animation:logo-blink 1.2s ease-in-out infinite}
@keyframes logo-blink{0%,45%,65%,100%{transform:scaleY(1)}55%{transform:scaleY(.15)}}
.hero{position:relative;padding-top:52px;overflow:visible}
.hero .eyebrow{font-size:10px;text-transform:uppercase;letter-spacing:.14em}
.hero h1{font-size:clamp(43px,5.3vw,74px);letter-spacing:-.06em}
.hero h1 span{color:var(--accent)}
.hero-copy>p:not(.eyebrow){max-width:440px}
.hero-pets{position:relative;max-width:770px;min-height:154px;gap:34px;border-bottom:1px solid var(--line);padding-bottom:15px;margin-top:35px}
.hero-pets:before{content:"THEY’RE BETTER IN MOTION";position:absolute;left:-28px;top:25px;font:9px var(--mono);letter-spacing:.05em;color:var(--muted);transform:rotate(-9deg);max-width:115px;text-align:left}
.hero-companion{border:0;padding:0;width:112px;transition:translate .3s cubic-bezier(.2,1.5,.5,1);border-radius:40%}
.hero-companion:hover,.hero-companion:focus-visible{translate:0 -8px}
.hero-companion:hover:before,.hero-companion:focus-visible:before{content:attr(data-name) " ↗";top:-27px;right:50%;transform:translateX(50%);font-size:10px;white-space:nowrap;color:var(--ink);background:var(--surface-hover);border-radius:20px;padding:4px 10px}
.hero-footnote{font-size:11px;margin-top:17px}
.hero-footnote span{font-size:15px}
.hero-actions .primary{border-radius:24px;padding-left:22px;padding-right:22px}
.personality-note{display:inline-flex;align-items:center;gap:9px;font:10px var(--mono);color:var(--muted);border:1px dashed var(--line);border-radius:20px;padding:7px 13px;margin-top:24px}
.gallery-heading h2{font-size:38px}
.pet-card{position:relative;isolation:isolate}
.pet-card-visual{height:215px;overflow:hidden;transition:background .3s,box-shadow .3s}
.pet-card:hover .pet-card-visual,.pet-card:focus-within .pet-card-visual{background:var(--pet-tint,var(--surface-hover));box-shadow:inset 0 0 0 1px #00000005}
:root[data-theme=dark] .pet-card:hover .pet-card-visual,:root[data-theme=dark] .pet-card:focus-within .pet-card-visual{background:var(--surface-hover)}
.gallery-pet{transition:translate .3s cubic-bezier(.2,1.5,.5,1)}
.pet-card:hover .gallery-pet,.pet-card:focus-within .gallery-pet{translate:0 -10px}
.pet-quick-actions{position:absolute;top:176px;left:6px;right:6px;display:flex;align-items:center;justify-content:center;gap:3px;opacity:0;transform:translateY(8px);transition:opacity .2s,transform .2s;pointer-events:none}
.pet-quick-actions button{font-size:9px;padding:6px 8px;min-height:28px;border-radius:20px;background:var(--paper);box-shadow:0 1px 4px #00000008;white-space:nowrap}
.pet-quick-actions button:hover{background:var(--button);color:var(--on-button)}
.pet-card:hover .pet-quick-actions,.pet-card:focus-within .pet-quick-actions{opacity:1;transform:none;pointer-events:auto}
.save-pet{opacity:.65}.save-pet:hover{opacity:1;transform:scale(1.1)}
.pet-card-meta h3{font-size:13px}.pet-card-meta p{font-size:10px}
.pet-card-meta p span{opacity:.7}
.companion-cta{border:1px dashed var(--accent);color:var(--accent);background:var(--surface);width:100%;margin-top:4px}
.pet-launcher{position:fixed;right:24px;bottom:20px;z-index:62;display:flex;gap:10px;align-items:center;background:var(--ink);color:var(--paper);border:1px solid var(--line);border-radius:30px;padding:12px 17px;box-shadow:0 5px 22px #0002;font-size:11px;min-height:44px}
.pet-launcher .live-dot{background:#b7d994;box-shadow:0 0 0 4px #ffffff0d}
.pet-launcher:hover{translate:0 -2px}.pet-launcher[aria-expanded=true]{background:var(--accent);color:var(--paper)}
.roaming-pet{position:fixed;left:0;top:0;width:132px;height:132px;z-index:61;pointer-events:none;will-change:transform}
.pet-handle{pointer-events:auto;touch-action:none;cursor:grab;display:flex;align-items:end;justify-content:center;width:100%;height:100%;padding:0;border-radius:40%;user-select:none;-webkit-user-select:none;position:relative;z-index:2}
.pet-handle:active,.is-dragging .pet-handle{cursor:grabbing}
.pet-body{display:block;transform-origin:50% 85%;will-change:transform}
.playground-pet{width:132px;height:143px;filter:drop-shadow(0 5px 3px #00000012)}
.pet-ground{position:absolute;bottom:-1px;left:30%;right:30%;height:6px;background:var(--ink);opacity:.10;border-radius:50%;transition:opacity .2s,transform .2s}
.is-dragging .pet-ground{opacity:0}.is-dragging .pet-body{rotate:-5deg}
.pet-speech{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%,7px);background:var(--paper);color:var(--ink);font-size:11px;line-height:1.5;box-shadow:0 4px 20px #0000000e;border:1px solid var(--line);border-radius:14px;padding:10px 14px;width:170px;text-align:center;opacity:0;transition:opacity .2s,transform .2s;pointer-events:none}
.pet-speech:after{content:"";position:absolute;bottom:-5px;left:calc(50% - 4px);width:8px;height:8px;background:var(--paper);border-right:1px solid var(--line);border-bottom:1px solid var(--line);transform:rotate(45deg)}
.pet-speech.show{opacity:1;transform:translate(-50%,0)}
.pet-particles{position:absolute;inset:0;pointer-events:none;z-index:3;overflow:visible;color:#d68285}
.pet-particles span{position:absolute;left:50%;top:30%;font-size:19px;animation:pet-pop 1.4s var(--delay) both cubic-bezier(.15,.6,.5,1)}
.pet-particles span:nth-child(3n){color:#c5a558}.pet-particles span:nth-child(3n+1){color:var(--accent)}
@keyframes pet-pop{0%{opacity:0;transform:translate(0,0) scale(.3)}15%{opacity:1}100%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--rotate)) scale(.7)}}
.roaming-pet[data-effect=sleep] .pet-body{opacity:.75;rotate:8deg}
.roaming-pet[data-effect=sleep] .pet-ground{transform:scaleX(1.15)}
.pet-chat{position:fixed;right:24px;bottom:78px;width:360px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 98px);overflow:auto;z-index:63;background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:21px;box-shadow:0 15px 60px #0002;animation:chat-arrive .25s ease-out}
@keyframes chat-arrive{from{opacity:0;transform:translateY(9px) scale(.98)}to{opacity:1;transform:none}}
.pet-chat header{display:flex;align-items:start;gap:10px;margin-bottom:20px}
.pet-chat h2{font-size:22px;line-height:1.2;margin-top:8px;letter-spacing:-.04em}
.pet-chat .eyebrow{font-size:9px}.close-pet-chat{margin-left:auto;flex-shrink:0;font-size:23px;width:28px;height:28px}
.pet-picker-label{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:11px;color:var(--muted);padding:9px 0}
.pet-picker{color:var(--ink);max-width:175px;font-size:12px}
.pet-reply{font-size:12px;min-height:60px;padding:16px 0 10px;line-height:1.7}
.pet-tricks{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:18px}
.pet-tricks button{display:flex;align-items:center;justify-content:space-between;background:var(--surface);border-radius:8px;padding:10px 12px;min-height:40px;font-size:11px;transition:background .2s,translate .2s}
.pet-tricks button:hover{background:var(--surface-hover);translate:0 -2px}.pet-tricks span{color:var(--accent);font-size:15px}
.pet-chat-form{display:flex;border:1px solid var(--line);border-radius:12px;padding:5px;background:var(--surface)}
.pet-chat-form:focus-within{border-color:var(--accent)}
.pet-chat-form input{font-size:12px;width:100%;min-width:0;border:0;background:none;outline:none;padding:6px 8px}
.pet-chat-form button{background:var(--button);color:var(--on-button);border-radius:8px;min-width:35px;min-height:35px;font-size:20px}
.pet-chat-foot{display:flex;gap:12px;align-items:center;margin-top:12px;font-size:8px;line-height:1.6;color:var(--muted)}
.hide-pet{margin-left:auto;font-size:9px;text-decoration:underline;white-space:nowrap;padding:4px 0}
@media(hover:none){.pet-quick-actions{opacity:1;transform:none;pointer-events:auto}}
@media(max-width:740px){.hero h1{font-size:44px}.hero-pets{gap:0;margin-top:32px}.hero-pets:before{display:none}.hero-footnote{font-size:10px}.gallery-heading h2{font-size:30px}.pet-card-visual{height:195px}.pet-quick-actions{top:158px}.pet-quick-actions button{font-size:8px;padding:5px 6px}.pet-launcher{right:16px;bottom:14px;font-size:10px;padding:10px 14px}.pet-chat{right:16px;bottom:70px}.pet-card-meta h3{font-size:12px}}
@media(max-width:360px){.pet-quick-actions button{font-size:7px;padding:4px}.hero h1{font-size:38px}}
@media(prefers-reduced-motion:reduce){.hero-companion,.gallery-pet,.brand-mark,.pet-quick-actions,.pet-card-visual,.pet-speech{transition:none}.hero-companion:hover,.pet-card:hover .gallery-pet{translate:none}.pet-particles span,.pet-chat,.brand:hover .brand-mark i{animation:none}.pet-body{will-change:auto}}

/* Little worlds, built into the original rounded gallery. */
.ap-icon{width:18px;height:18px;display:inline-block;vertical-align:middle;flex-shrink:0;stroke-width:1.65;fill:none}
.has-summary-icon:after{display:none}.has-summary-icon>.ap-icon{margin-left:auto;transition:transform .2s}details[open]>.has-summary-icon>.ap-icon{transform:rotate(45deg)}
[data-icon]{display:inline-flex;vertical-align:middle;font-style:normal}
.text-link,.text-button,.category-tabs button,.gallery-playback button,.codex-runtime-tools button,.codex-runtime-states button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px}
.category-tabs .ap-icon,.codex-runtime-states .ap-icon{width:15px;height:15px}
.gallery-toolbar{gap:12px}.category-tabs{gap:3px}.category-tabs button{padding:8px 10px}
.hero-pets:before{left:-50px}.hero h1{font-weight:550}.hero h1 span{color:#628555}
.hero-footnote .ap-icon{color:var(--accent);width:16px;height:16px}
.pet-card .pet-card-visual,.pet-card:hover .pet-card-visual,.pet-card:focus-within .pet-card-visual{background:var(--world-sky);border-radius:16px;box-shadow:inset 0 0 0 1px #00000004}
.pet-world-scene{position:absolute;inset:0;width:100%;height:100%;stroke:none;fill:none;pointer-events:none;transition:transform .7s cubic-bezier(.2,.8,.3,1);transform-origin:50% 80%}
.pet-world-name{position:absolute;left:11px;top:11px;padding:5px 7px;border-radius:6px;background:color-mix(in srgb,var(--paper) 88%,transparent);font:8px var(--mono);letter-spacing:.015em;color:var(--ink);pointer-events:none;max-width:calc(100% - 55px);z-index:1}
.pet-card:hover .pet-world-scene,.pet-card:focus-within .pet-world-scene{transform:scale(1.025)}
.gallery-pet{position:relative;z-index:1;margin-top:52px;filter:drop-shadow(0 7px 3px #17251912)}
.save-pet{z-index:2;width:36px;height:36px;color:var(--ink);background:var(--paper)}
.save-pet[aria-pressed=true]{color:#a64166}
.save-pet[aria-pressed=true] svg{fill:#f0bdcf}
.pet-card-meta h3{font-size:14px;font-weight:600}.pet-card-meta p{font-size:11px}
.pet-quick-actions{z-index:3;left:5px;right:5px;gap:3px}
.pet-quick-actions .ap-icon{width:11px;height:11px}
.pet-quick-actions button{min-height:32px;padding:6px 7px}
.pet-card-meta .ap-icon{width:16px;height:16px}
.codex-runtime-surface{overflow:hidden;isolation:isolate;background:var(--world-sky)}
.codex-runtime-surface .pet-world-scene{opacity:1}
.codex-runtime-surface .pet-world-name{top:auto;bottom:38px}
.codex-pet-anchor,.codex-surface-label,.codex-look-hint{z-index:1}
.codex-runtime-surface .codex-surface-label,.codex-runtime-surface .codex-look-hint{color:var(--ink);background:color-mix(in srgb,var(--paper) 94%,transparent);border-radius:5px;padding:5px 8px}
.codex-runtime-surface .codex-surface-label{top:12px;left:12px}
.codex-runtime-surface .codex-look-hint{left:50%;right:auto;translate:-50% 0;width:max-content;max-width:calc(100% - 24px);bottom:12px}
.animation-label strong{display:flex;align-items:center;gap:8px}
.animation-label .ap-icon{width:15px;height:15px;color:var(--accent)}
.pet-chat-form button{display:grid;place-items:center;min-width:44px;min-height:44px}
.close-pet-chat{width:40px;height:40px}.pet-tricks .ap-icon{width:17px;height:17px}
.site-header nav a{display:flex;align-items:center;min-height:44px}
:root[data-theme=dark] .hero h1 span{color:#b4c7a3}
:root[data-theme=dark] .pet-card .pet-card-visual,:root[data-theme=dark] .codex-runtime-surface{background:var(--world-darkSky)}
:root[data-theme=dark] .pet-card:hover .pet-card-visual{background:var(--world-darkSky)}
@media(max-width:740px){.category-tabs{gap:0}.category-tabs button{font-size:10px;padding:7px 8px}.category-tabs .ap-icon{width:13px;height:13px}.gallery-toolbar{align-items:start}.pet-world-name{font-size:8px;left:10px;top:11px}.save-pet{right:4px;top:4px}.pet-card-meta h3{font-size:13px}.pet-quick-actions button{padding:6px;font-size:8px}.pet-quick-actions .ap-icon{display:none}}
@media(prefers-reduced-motion:reduce){.pet-world-scene{transition:none}.pet-card:hover .pet-world-scene{transform:none}}
@media(max-width:460px){.hero-actions{flex-wrap:wrap;gap:4px 24px}.hero-actions>*{white-space:nowrap;flex-shrink:0}.hero-actions #random-pet{flex-basis:100%;font-size:10px;min-height:34px}.hero-footnote{font-size:9px}.hero-footnote .ap-icon{width:13px;height:13px}}

/* Native SVG stage illustrations use one CSS-variable palette bridge, so each
   character keeps its own atmosphere in both themes without bitmap requests. */
[data-world]{
  --scene-sky:color-mix(in srgb,var(--world-sky) 65%,#81b8ca);
  --scene-horizon:var(--world-sky);--scene-cloud:#ffffffb3;--scene-light:#fff2bd;
  --scene-far:color-mix(in srgb,var(--world-terrain) 66%,#7caaa9);
  --scene-mid:color-mix(in srgb,var(--world-accent) 48%,var(--world-terrain));
  --scene-near:color-mix(in srgb,var(--world-accent) 65%,#273f39);
  --scene-ground:color-mix(in srgb,var(--world-terrain) 55%,#97ae7d);
  --scene-path:color-mix(in srgb,var(--world-sky) 72%,#a38f72);
  --scene-leaf:color-mix(in srgb,var(--world-accent) 65%,#668e5e);
  --scene-trunk:color-mix(in srgb,var(--world-accent) 48%,#5c5546);
  --scene-wall:color-mix(in srgb,var(--world-sky) 80%,#f2ce93);
  --scene-roof:color-mix(in srgb,var(--world-accent) 68%,#674f53);
  --scene-snow:#f4f8ec;--scene-water:#85b8c7;--scene-window:#607386;
  --scene-flower:#d695aa;--scene-moon:#f5dfad;--scene-planet:#aa9bc9;--scene-crystal:#bb9dda;
}
[data-world=water]{--scene-sky:#96c6d8;--scene-horizon:#e1eff0;--scene-far:#a8c9d5;--scene-mid:#8fb4c6;--scene-ground:#deeff0;--scene-water:#6ba7ba;--scene-light:#f4f5d7}
[data-world=coast]{--scene-sky:#a3ccd7;--scene-horizon:#e0eeeb;--scene-far:#9abcb7;--scene-water:#6caeb8;--scene-ground:#dbc8a4;--scene-light:#fff0c6}
[data-world=desert]{--scene-sky:#e6c79f;--scene-horizon:#f5deba;--scene-light:#fff0c4;--scene-far:#c5a680;--scene-mid:#cfa779;--scene-ground:#e1bd8b;--scene-path:#efcf9b;--scene-near:#a98961}
[data-world=space]{--scene-sky:#293247;--scene-horizon:#697a95;--scene-far:#6a7993;--scene-light:#d0ddff;--scene-near:#303c51;--scene-ground:#58677e;--scene-window:#99b0ca;--scene-planet:color-mix(in srgb,var(--world-terrain) 55%,#9b79bc)}
[data-world=city]{--scene-sky:color-mix(in srgb,var(--world-sky) 50%,#a4b1d6);--scene-horizon:#f6d7be;--scene-far:#b9abc2;--scene-near:color-mix(in srgb,var(--world-accent) 60%,#59627f);--scene-ground:#a49baf;--scene-path:#d8ccd0;--scene-window:#929fb4;--scene-light:#ffe8ae}
[data-world=stage]{--scene-roof:color-mix(in srgb,var(--world-accent) 40%,#29233e);--scene-mid:var(--world-accent);--scene-ground:color-mix(in srgb,var(--world-accent) 40%,#36314d);--scene-path:var(--world-terrain);--scene-window:var(--world-accent);--scene-light:var(--world-sky)}
[data-world=cafe]{--scene-far:#b6c9c3;--scene-ground:#ba8e71;--scene-path:#dec1a1;--scene-trunk:#967359;--scene-light:#fff1c2;--scene-leaf:#748e64}
[data-world=dojo]{--scene-ground:#c6ac8b;--scene-path:#e5ccb0;--scene-far:var(--world-sky);--scene-mid:var(--world-terrain);--scene-near:var(--world-accent);--scene-roof:color-mix(in srgb,var(--world-accent) 60%,#563e3c)}
[data-world=cave]{--scene-sky:#272332;--scene-horizon:#786784;--scene-far:#a99ba8;--scene-mid:#716879;--scene-near:#49424f;--scene-roof:#5b4e62;--scene-ground:#96878d;--scene-crystal:#c4a8dc;--scene-light:#f4dbff}
[data-world=blocks]{--scene-sky:#9bcddc;--scene-horizon:#d6e9ce;--scene-far:#aac49b;--scene-near:#5d8150;--scene-leaf:#7da16a;--scene-trunk:#897758;--scene-ground:#a4906f;--scene-path:#c1af83}
:root[data-theme=dark] [data-world]{--scene-cloud:#d6e0ec30;--scene-sky:var(--world-darkSky);--scene-horizon:color-mix(in srgb,var(--world-darkTerrain) 80%,var(--world-sky));--scene-far:var(--world-darkTerrain);--scene-mid:color-mix(in srgb,var(--world-darkTerrain) 75%,#1b2431);--scene-near:color-mix(in srgb,var(--world-darkSky) 70%,#14202a);--scene-ground:color-mix(in srgb,var(--world-darkTerrain) 85%,var(--world-terrain));--scene-path:color-mix(in srgb,var(--world-darkTerrain) 70%,var(--world-terrain));--scene-wall:color-mix(in srgb,var(--world-darkTerrain) 80%,var(--world-terrain));--scene-roof:var(--world-darkSky);--scene-leaf:var(--world-darkTerrain);--scene-trunk:var(--world-darkSky);--scene-snow:#a1b7c3;--scene-water:#304f67;--scene-window:#60748d;--scene-light:#eadab6}
:root[data-theme=dark] [data-world=cave]{--scene-far:#867591;--scene-mid:#584962;--scene-near:#302739;--scene-ground:#736078;--scene-light:#e6c9ff}
.world-cloud{animation:world-cloud-drift 14s ease-in-out infinite alternate;animation-play-state:paused}
.world-ripples{animation:world-ripple-drift 6s ease-in-out infinite alternate;animation-play-state:paused}
.world-glints{color:var(--scene-light);animation:world-glimmer 5s ease-in-out infinite alternate;animation-play-state:paused}
.world-beams{animation:world-glimmer 6s ease-in-out infinite alternate;animation-play-state:paused}
.pet-card:hover :is(.world-cloud,.world-ripples,.world-glints,.world-beams),.pet-card:focus-within :is(.world-cloud,.world-ripples,.world-glints,.world-beams){animation-play-state:running}
#collection-list[data-paused=true] :is(.world-cloud,.world-ripples,.world-glints,.world-beams){animation-play-state:paused}
@keyframes world-cloud-drift{to{translate:8px 0}}
@keyframes world-ripple-drift{to{translate:5px 0;opacity:.3}}
@keyframes world-glimmer{to{opacity:.5}}
@media(prefers-reduced-motion:reduce){.world-cloud,.world-ripples,.world-glints,.world-beams{animation:none}}
