/* Logo-inspired unicorn, built from closed CSS extrusions. No model download. */
.toyrd-hero-lab { width: 100%; --toy-scale: 1; }
.toy-stage { position: relative; height: 430px; isolation: isolate; border-radius: 12px; background: radial-gradient(ellipse at 50% 46%, #edf4fa, #f8fafc 43%, #fff 73%); }
.toy-lab-heading { position: absolute; inset: 0 0 auto; display: flex; align-items: center; justify-content: space-between; color: #64788d; font: 9px/1.4 monospace; letter-spacing: .06em; }
.toy-motion { min-height: 44px; padding: 5px 0 5px 12px; border: 0; color: #536b82; background: transparent; font: 10px/1.4 "TOYRD Manrope", sans-serif; cursor: pointer; }
.toy-grid { position: absolute; inset: 18% 12% 8%; background-image: linear-gradient(#c5d9eb55 1px, transparent 1px), linear-gradient(90deg, #c5d9eb55 1px, transparent 1px); background-size: 28px 28px; transform: perspective(480px) rotateX(58deg); mask-image: radial-gradient(ellipse, #000 15%, transparent 70%); }
.toy-platform { position: absolute; left: 17%; right: 17%; bottom: 27px; height: 65px; border: 1px solid #bbcddd; border-radius: 50%; background: radial-gradient(ellipse, #55799828, #ecf3fa55 55%, transparent 70%); box-shadow: 0 9px 0 -8px #b8cbdc; }
.toy-platform span { position: absolute; inset: 10px 18%; border: 1px dashed #9eb7ce; border-radius: 50%; }
.toy-assembly { position: absolute; width: 360px; height: 300px; left: 50%; top: 49%; transform: translate(-50%, -50%) scale(var(--toy-scale)); perspective: 1100px; }
.toy-float, .toy-model, .horse-turntable { width: 100%; height: 100%; transform-style: preserve-3d; }
.toy-model { transform: rotateX(-12deg) rotateY(var(--horse-inspect-turn, 0deg)); transition: transform .7s ease; }
.toy-float { animation: toy-hover 6s ease-in-out infinite paused; }
.horse-turntable { transform: rotateY(-28deg); animation: horse-turn 20s linear infinite paused; }
.toyrd-hero-lab[data-running="true"] .toy-float,
.toyrd-hero-lab[data-running="true"] .horse-turntable { animation-play-state: running; }
.horse-part { position: absolute; inset: 0; transform-style: preserve-3d; transform: translateZ(var(--z)); transition: transform .7s cubic-bezier(.2,.7,.2,1); --paint: linear-gradient(125deg, #446681, #173953 40%, #0c263f); --edge: linear-gradient(#6b879c, #21405a); }
.horse-surface { position: absolute; inset: 0; background: var(--paint); }
.horse-surface--back { background: var(--paint); }
.horse-edge { position: absolute; left: 0; top: 0; transform-origin: 0 0; background: var(--edge); }
.horse-horn { --paint: linear-gradient(120deg, #ffd2a1, #ed8b35 60%, #ba662e); --edge: linear-gradient(#ffc17e, #c06b2d); }
.horse-saddle, .horse-leg, .horse-pin, .horse-rocker { --paint: linear-gradient(140deg, #345570, #183852 65%, #0a2137); --edge: linear-gradient(#4b6982, #193951); }
.horse-eye { position: absolute; left: 252px; top: 40px; width: 7px; height: 7px; border-radius: 50%; background: #f4f8fb; box-shadow: 0 0 0 2px #14344c; }
.horse-fastener { position: absolute; width: 6px; height: 6px; border: 1px solid #88a1b3; border-radius: 50%; background: #26465d; }
.horse-fastener::after { content: ""; position: absolute; left: 1px; top: 2px; width: 2px; border-top: 1px solid #abc0ce; }
.horse-fastener--one { left: 123px; top: 141px; }
.horse-fastener--two { left: 212px; top: 139px; }
.toyrd-hero-lab[data-exploded="true"] .horse-part { transform: translate3d(var(--dx), var(--dy), calc(var(--z) + var(--dz))); }
.toy-annotation { position: absolute; right: 0; top: 40%; color: #758b9e; font: 8px/1.4 monospace; opacity: 0; transition: opacity .3s; }
.toy-annotation::before { content: ""; display: block; width: 30px; margin-bottom: 8px; border-top: 1px solid #a8bece; }
.toyrd-hero-lab[data-exploded="true"] .toy-annotation { opacity: 1; }
.toy-interact { position: absolute; inset: 44px 4% 24px; width: 92%; padding: 0; border: 0; border-radius: 20px; background: transparent; cursor: pointer; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }
.toyrd-hero-lab button:focus-visible { outline: 2px dashed #075bd8; outline-offset: 3px; }
.toy-stage-footnote { position: absolute; bottom: 0; left: 0; right: 0; text-align: center; font: 8px/1.5 monospace; letter-spacing: .16em; color: #7c91a4; }
.toy-caption { min-height: 63px; margin-top: 16px; display: grid; align-content: start; gap: 5px; text-align: center; font-size: 11px; color: #617387; }
.toy-caption-title { font-size: 13px; font-weight: 650; color: #294a65; }
.toyrd-hero-lab [hidden] { display: none; }
@keyframes toy-hover { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
@keyframes horse-turn { from { transform: rotateY(-28deg); } to { transform: rotateY(332deg); } }
@media (max-width: 1000px) { .toyrd-hero-lab { --toy-scale: .82; } }
@media (max-width: 680px) { .toyrd-hero-lab { --toy-scale: .70; } .toy-stage { height: 335px; } .toy-annotation { font-size: 6px; top: 25%; } .toy-platform { bottom: 27px; height: 48px; } .toy-caption { min-height: 55px; margin-top: 12px; } }
@media (max-width: 360px) { .toyrd-hero-lab { --toy-scale: .60; } .toy-lab-heading { font-size: 8px; } }
@media (prefers-reduced-motion: reduce) {
  .toyrd-hero-lab *, .toyrd-hero-lab *::after { animation: none !important; transition: none !important; }
}
