.tiger-stage{position:absolute;z-index:2;left:42%;right:1%;top:105px;bottom:76px;min-height:300px;opacity:0;transition:opacity .5s;touch-action:pan-y}
.tiger-stage canvas{width:100%;height:100%;display:block;cursor:default;touch-action:pan-y}
.hero.tiger-loaded .tiger-stage{opacity:1}
.hero.tiger-loaded .hero-status{display:none}
.hero.tiger-loaded .hero-art{background-image:url('assets/grassland-clearing-v8.png');background-position:center 58%;transform:none!important;transition:none;will-change:auto}
.tiger-controls{position:absolute;z-index:4;right:48px;bottom:82px;width:360px;background:#183023b3;border:1px solid #f6e8ad50;border-radius:16px;padding:12px 14px;color:#fff2cf;backdrop-filter:blur(12px)}
.tiger-state{display:flex;align-items:center;flex-wrap:wrap;gap:7px;font-size:11px}
.tiger-state i{width:5px;height:5px;background:#eed994;border-radius:50%}.tiger-state small{font-size:8px;opacity:.65;margin-left:auto}
.tiger-actions{display:flex;gap:5px;margin-top:10px}.tiger-actions button{color:#fff1c7;background:#f6e3a012;border:1px solid #f6e3a030;border-radius:20px;padding:8px 10px;font-size:10px;white-space:nowrap}.tiger-actions button[aria-pressed=true]{background:#eed994;color:#263925}.tiger-actions button:hover{background:#f8e3aa3a}
.hero .scene-note{display:none}.hero .hero-status{font-size:10px;top:130px;right:38px;max-width:210px;padding:10px 14px;pointer-events:none}
@media(max-width:1100px){.tiger-stage{left:40%;right:0;top:130px}.tiger-controls{right:26px;width:335px}.tiger-actions button{padding:7px 9px}}
@media(max-width:760px){.hero{min-height:900px}.tiger-stage{left:0;right:0;top:390px;bottom:100px;min-height:0}.hero.tiger-loaded .hero-art{background-size:auto 570px;background-position:67% 100%}.hero .hero-status{display:none}.tiger-controls{right:20px;left:20px;bottom:65px;width:auto;padding:10px 12px}.tiger-actions{justify-content:space-between}.tiger-actions button{font-size:10px;padding:9px 10px}.hero-bottom{bottom:18px}.hero-main{pointer-events:none}.hero-main button{pointer-events:auto}.hero .nav{pointer-events:auto}.tiger-state small{font-size:7px}.tiger-controls~.wrap{position:relative;pointer-events:none}.tiger-controls~.wrap .nav{pointer-events:auto}}
@media(prefers-reduced-motion:reduce){.tiger-stage{transition:none}}

@media(max-width:760px){.tiger-actions button{min-height:44px}}

/* The character is automatic; keep the foreground free of controls. */
.hero>.wrap{position:relative;pointer-events:none}.hero>.wrap .nav,.hero>.wrap button{pointer-events:auto}