.unicorn-trick-button { background: transparent; color: var(--pink); border-color: var(--pink); }
#unicorn-act { color: var(--purple); font: 750 .875rem/1.5 var(--body); max-width: 24rem; }
.unicorn-runner { max-width: min(calc(100vw - 24px),max(140px,calc(100svh - 200px))); }
.unicorn-bubble { left: 0; top: auto; bottom: calc(100% + .25rem); width: 100%; max-width: min(100%,calc(100vw - 24px)); font-size: .875rem; line-height: 1.35; }
.unicorn-layer.is-ridden .unicorn-bubble { left: 0; top: auto; }
.unicorn-expression { display: none; width: 100%; height: 100%; background-image: url('assets/unicorn-expressions.4e225ca98b29.webp'); background-repeat: no-repeat; transform: scaleX(var(--unicorn-facing,1)); background-position: var(--expression-position); background-size: var(--expression-size); clip-path: var(--expression-clip); }
.unicorn-layer.is-expressive:not(.is-ridden) .unicorn-sprite { display: none; }
.unicorn-layer.is-expressive:not(.is-ridden) .unicorn-expression { display: block; }
.unicorn-layer[data-unicorn-mood=brake] .unicorn-bubble { background: var(--pink); }
.unicorn-layer[data-unicorn-mood=sleep] .unicorn-bubble,.unicorn-layer[data-unicorn-mood=drama] .unicorn-bubble { background: var(--purple); }
.unicorn-layer[data-unicorn-mood=dance] .unicorn-bubble,.unicorn-layer[data-unicorn-mood=pet] .unicorn-bubble { background: var(--lime); }
.unicorn-layer[data-unicorn-mood=sleep] .unicorn-catch,.unicorn-layer[data-unicorn-mood=drama] .unicorn-catch,.unicorn-layer[data-unicorn-mood=pose] .unicorn-catch,.unicorn-layer[data-unicorn-mood=moonwalk] .unicorn-catch,.unicorn-layer[data-unicorn-mood=brake] .unicorn-catch { animation: none; }
.unicorn-layer:not([data-unicorn-mood=run]) .unicorn-sprite,.unicorn-layer:not([data-unicorn-mood=run]) .unicorn-rider-sprite { animation-play-state: paused; }
.unicorn-layer[data-unicorn-mood=dance] .unicorn-catch { animation: unicorn-dance .6s ease-in-out infinite; }
.unicorn-layer.is-engaged .unicorn-catch,.unicorn-layer.is-engaged .unicorn-sprite,.unicorn-layer.is-engaged .unicorn-rider-sprite { animation-play-state: paused; }
.unicorn-layer.is-caught .unicorn-catch { animation: none; cursor: grab; }
.unicorn-layer.is-caught .unicorn-catch:active { cursor: grabbing; }
.unicorn-interaction-hint { position: absolute; left: 4%; right: 4%; bottom: -1rem; padding: .35rem .5rem; color: var(--paper); background: var(--ink); font: 800 .75rem/1.3 var(--body); text-align: center; border: 1px solid var(--pink); pointer-events: none; }
.unicorn-layer.is-caught .unicorn-interaction-hint { background: var(--lime); color: var(--ink); }
.unicorn-layer.is-peeking .unicorn-catch { animation: none; }
.unicorn-layer.is-peeking .unicorn-sprite { animation-play-state: paused; }
.unicorn-layer.is-peeking .unicorn-expression[data-unicorn-pose="2"] { transform: translateY(-28%) scaleX(var(--unicorn-facing,1)); }
.unicorn-layer.is-peeking .unicorn-expression[data-unicorn-pose="5"] { transform: translateY(-6%) scaleX(var(--unicorn-facing,1)); }
.unicorn-layer.is-peeking .unicorn-runner::after { display: none; }
.unicorn-layer.is-peeking .unicorn-interaction-hint { clip-path: inset(50%); width: 1px; height: 1px; overflow: hidden; }
.unicorn-layer.is-peeking .unicorn-bubble { font-size: .75rem; padding: .6rem .7rem; opacity: 0; }
.unicorn-layer.is-peeking[data-unicorn-phase="1"] .unicorn-bubble { opacity: 1; }
@keyframes unicorn-dance { 0%,100% { transform: rotate(-3deg); } 50% { transform: translateY(-8px) rotate(3deg); } }
@media(prefers-reduced-motion:reduce) { .unicorn-layer .unicorn-catch,.unicorn-layer .unicorn-sprite,.unicorn-layer .unicorn-rider-sprite { animation:none; } }
