/* Six aligned poses. This layer never intercepts clicks or adds overflow. */
.amber-roam-layer{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:91;contain:strict}
.amber-roam-actor{position:absolute;will-change:transform}
.amber-roam-facing,.amber-roam-sprite{display:block;width:100%;height:100%}
.amber-roam-sprite{position:relative;overflow:hidden;transform-origin:50% 100%;animation:amber-footsteps .64s steps(1,end) infinite}
.amber-roam-sprite>.amber-roam-sheet{position:absolute;inset:0 auto auto 0;display:block;width:300%;height:200%;max-width:none;object-fit:fill;animation:amber-walk-frames .64s steps(1,end) infinite;pointer-events:none}
@keyframes amber-walk-frames{0%{transform:translate(0,0)}16.666%{transform:translate(-33.333333%,0)}33.333%{transform:translate(-66.666667%,0)}50%{transform:translate(0,-50%)}66.666%{transform:translate(-33.333333%,-50%)}83.333%,100%{transform:translate(-66.666667%,-50%)}}
.amber-roaming>img{visibility:hidden}
.amber-companion-panel .amber-companion-greeting{color:#ffe0ad;border-left:2px solid #e9bc7a;padding:7px 10px;background:#d9ac6710;border-radius:0 6px 6px 0;font-size:12px}
/* Normalize pose height and foot placement without resampling the sprite. */
@keyframes amber-footsteps{
 0%{background-position:0 0;transform:translateY(-.05%) scale(.981)}
 16.666%{background-position:50% 0;transform:translateY(.90%) scale(1.034)}
 33.333%{background-position:100% 0;transform:translateY(.76%) scale(.994)}
 50%{background-position:0 100%;transform:translateY(3.93%) scale(1.003)}
 66.666%{background-position:50% 100%;transform:translateY(3.43%) scale(1.053)}
 83.333%,100%{background-position:100% 100%;transform:translateY(3.47%) scale(1.014)}
}
.amber-motion-off .amber-roam-layer,.amber-page-hidden .amber-roam-layer{display:none}
.amber-motion-off .amber-roaming>img{visibility:visible}
@media(prefers-reduced-motion:reduce){.amber-roam-layer{display:none}.amber-roaming>img{visibility:visible}}

.tools-command-hero{display:grid;grid-template-columns:1.25fr 1fr;align-items:center;gap:20px;isolation:isolate;position:relative;overflow:hidden;min-height:295px;padding:32px 36px;margin-bottom:24px;border:1px solid #42627e;border-radius:25px;background:radial-gradient(ellipse at 85% 70%,#664c804d,transparent 56%),linear-gradient(110deg,#0e263bed,#0d1a30ee)}
.tools-command-hero:before{content:'';position:absolute;inset:0;z-index:-1;background-image:linear-gradient(#4987a31a 1px,transparent 1px),linear-gradient(90deg,#4987a31a 1px,transparent 1px);background-size:38px 38px;mask-image:linear-gradient(90deg,transparent,#000)}
.tools-command-copy h1{font-size:clamp(27px,3vw,39px);line-height:1.12;letter-spacing:-.04em;color:#e7f6ff;font-weight:680;margin:15px 0}.tools-command-copy>p{max-width:420px;color:#aec4d8;font-size:14px;line-height:1.7}
.tools-command-pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}.tools-command-pills span{font-size:10px;letter-spacing:.03em;color:#d1e8fa;background:#18344b;border:1px solid #38586c;border-radius:20px;padding:7px 11px}.tools-command-pills span:last-child{color:#f1d09d;background:#393145;border-color:#68546e}
.tools-command-scene{position:relative;min-height:235px;width:100%;max-width:340px;justify-self:center;display:grid;place-items:center}.tools-command-scene:before{content:'';position:absolute;inset:19px 22px;border:1px solid #8ce7f459;border-radius:50%;transform:rotate(-24deg);box-shadow:0 0 40px #69ccf114,inset 0 0 40px #a276ff14}.tools-command-scene:after{content:'';position:absolute;bottom:10px;width:210px;height:27px;border:1px solid #8cbff67a;border-radius:50%;background:#7895ff0d;box-shadow:0 10px 0 -9px #ffd18c}
.tools-command-scene img{position:relative;width:205px;height:205px;object-fit:contain;z-index:1}.tools-module{position:absolute;z-index:2;display:grid;place-items:center;gap:3px;padding:9px 11px;min-width:60px;border:1px solid #587089;border-radius:13px;background:#102338eb;color:#9be9f5;font-size:17px;box-shadow:0 8px 20px #0004}.tools-module small{font:9px ui-monospace,monospace;letter-spacing:.08em}.tools-module.qr{left:0;top:40px}.tools-module.convert{right:0;top:16px;color:#e4b7ff}.tools-module.focus{right:-6px;bottom:23px;color:#ffce86}
.tab-banner.amber-tools-intro{background:linear-gradient(110deg,#10263b,#161f35);border-color:#375b77}.tab-banner.amber-tools-intro img{object-fit:contain;background:none;border:0;width:82px;height:82px}.tab-banner.amber-tools-intro .tb-text{line-height:1.6}.tab-banner.amber-tools-intro strong{color:#d9f3ff}
@media(max-width:760px){.tools-command-hero{padding:26px 24px;grid-template-columns:1fr;gap:14px}.tools-command-scene{min-height:190px;max-width:300px}.tools-command-scene img{width:175px;height:175px}.tools-module{min-width:56px;padding:8px}.tools-command-copy h1{font-size:31px}.tools-command-pills{margin-top:15px}.tools-command-scene:after{width:175px;bottom:0}}

/* Expressions share the original pose and dimensions; no layout shift. */
.amber-hero-character>.amber-smile-face{position:absolute;inset:0;width:100%;height:100%}
.amber-hero-character>.amber-smile-face,.amber-companion-trigger>.amber-smile-face{visibility:hidden}
.amber-smiling>img:not(.amber-smile-face){visibility:hidden}
.amber-smiling>.amber-smile-face{visibility:visible}
.amber-roaming>img{visibility:hidden!important}
.amber-play{border:1px solid #647389;border-radius:24px;background:#152b40;color:#c7f1ff;font:600 11px system-ui;padding:10px 16px;min-height:40px;cursor:pointer;box-shadow:inset 0 1px #a6eaff14;touch-action:manipulation}
.amber-play:hover{background:#234458;border-color:#91e4ef}.amber-play:focus-visible{outline:2px solid #9af0fa;outline-offset:4px}
.amber-hero-play{position:absolute;left:24px;bottom:17px;z-index:5}.amber-dock-play{width:100%;margin:14px 0 0}
.amber-hopping>img{animation:amber-happy-hop 1.15s ease-in-out!important;transform-origin:50% 90%}
@keyframes amber-happy-hop{0%,100%{transform:translateY(0) scale(1)}15%{transform:translateY(3%) scale(1.04,.94)}37%{transform:translateY(-15%) rotate(-5deg) scale(.98,1.02)}55%{transform:translateY(-13%) rotate(4deg)}76%{transform:translateY(0) scale(1.04,.95)}88%{transform:translateY(-3%) scale(1)}}
@media(max-width:760px){.amber-hero-play{left:18px;bottom:10px;padding:9px 13px;font-size:10px}.future-orbit .amber-character-label{display:none}}
@media(prefers-reduced-motion:reduce){.amber-hopping>img{animation:none!important}}
.amber-motion-off .amber-hopping>img{animation:none!important}
