:root{color-scheme:dark;background:#08090b;color:#ddd;font-family:"Segoe UI",Arial,sans-serif}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{min-height:100svh;background:#07080c}
main{position:relative;width:100%;height:100%;overflow:hidden}button{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button:focus-visible{outline:1px solid #c6a36c;outline-offset:7px}
.wanderer{position:absolute;top:0;left:0;width:clamp(200px,24vw,310px);aspect-ratio:1;will-change:transform}
.stage{position:relative;width:100%;height:100%;isolation:isolate;--direction:0deg}
.keeper{display:block;position:relative;width:100%;height:100%;padding:0;border:0;border-radius:42%;background:none;cursor:pointer;z-index:2}
.keeper-breath{display:block;position:relative;width:100%;height:100%;transform-origin:50% 91%;transform:rotate(var(--lean,0deg));transition:transform 1.2s ease-out}
.keeper img{display:block;width:100%;height:100%;object-fit:contain;filter:brightness(.88) drop-shadow(0 10px 12px #0005);user-select:none;transition:filter .8s}
.eye{position:absolute;width:8%;height:8%;border-radius:50%;background:radial-gradient(ellipse,#ffdd9a80,#efab3838 32%,transparent 70%);opacity:0;transform:translate(-50%,-50%);mix-blend-mode:screen;transition:opacity .8s;pointer-events:none}.eye-left{left:39%;top:30.5%}.eye-right{left:63.3%;top:37.5%}
.key-light{position:absolute;left:50.3%;top:59%;width:20%;height:24%;transform:translate(-50%,-50%);background:radial-gradient(ellipse,#ffce796b,#e9a43b20 30%,transparent 68%);mix-blend-mode:screen;opacity:0;transition:opacity .8s;pointer-events:none}
.stage[data-awake="true"] .eye,.stage[data-awake="true"] .key-light{opacity:1}.stage[data-awake="true"] img{filter:brightness(1.15) drop-shadow(0 12px 18px #c9982d15)}
.reacting .keeper-breath{animation:hello 2.5s ease-in-out}
.stockereum-link{position:fixed;right:27px;bottom:25px;width:56px;height:56px;display:grid;place-items:center;padding:6px;opacity:.9;z-index:5;transition:opacity .3s,filter .3s}.stockereum-link svg{width:42px;height:42px}.stockereum-link:hover{opacity:1;filter:drop-shadow(0 0 9px #f2be5440)}.stockereum-link:focus-visible{outline:1px solid #f2be54;outline-offset:5px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@keyframes breathe{0%,100%{transform:translateY(0) rotate(-.5deg)}50%{transform:translateY(-3px) rotate(.5deg)}}
@keyframes walk{0%,100%{transform:translateY(0) rotate(calc(var(--direction) - 1.5deg))}25%{transform:translateY(-4px) rotate(var(--direction))}50%{transform:translateY(0) rotate(calc(var(--direction) + 1.5deg))}75%{transform:translateY(-4px) rotate(var(--direction))}}
@keyframes look{0%,100%{transform:rotate(0)}22%,35%{transform:rotate(-4deg)}62%,78%{transform:rotate(3deg)}}
@keyframes hello{0%,100%{transform:rotate(var(--lean,0deg)) scale(1)}45%{transform:rotate(-2deg) scale(1.025)}}
@media(max-width:600px){.wanderer{width:min(230px,65vw)}.stockereum-link{right:16px;bottom:16px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

.galaxy{position:fixed;inset:0;background:#07080c;pointer-events:none;z-index:0}main{z-index:2}#starlight{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}.wanderer{will-change:transform}.stage{filter:drop-shadow(0 0 25px #0008)}

.keeper:focus-visible{outline:none}.keeper:focus-visible img{filter:brightness(1.2) drop-shadow(0 0 12px #c6a36c55)}

.rig-canvas{display:none;position:absolute;inset:0;width:100%;height:100%;filter:brightness(.94) drop-shadow(0 3px 9px #0005);transition:filter .8s}.rig-ready .rig-canvas{display:block}.rig-ready .keeper-breath>img,.rig-ready .eye,.rig-ready .key-light{visibility:hidden}.stage[data-awake="true"] .rig-canvas,.keeper:focus-visible .rig-canvas{filter:brightness(1.14) drop-shadow(0 0 12px #c6a36c25)}.wanderer{width:clamp(240px,29vw,380px)}@media(max-width:600px){.wanderer{width:min(260px,72vw)}}