.orbit[hidden] { display: none; }
.has-orbit { padding-bottom: 0; }
.has-orbit .hero, .has-orbit .cat-guide { display: none; }
.orbit { position: relative; overflow: hidden; min-height: 820px; background: radial-gradient(ellipse at 58% 37%, #fff0b6, #f3d463 65%, #e8c459); isolation: isolate; }
.orbit-heading { position: absolute; z-index: 5; top: 52px; left: 5vw; pointer-events: none; }
.orbit-heading h1 { margin: 0; font-size: clamp(2.4rem,4.5vw,5.1rem); line-height: 1.12; letter-spacing: -.075em; font-weight: 900; }
.orbit-heading > p:last-child { margin-top: 22px; font-size: .85rem; letter-spacing: .1em; }
.orbit-heading .kicker { font-size: .6rem; letter-spacing: .18em; }
.orbit-stage { position: relative; height: 590px; margin-top: 20px; perspective: 1100px; touch-action: pan-y; cursor: grab; user-select: none; outline-offset: -6px; }
.orbit-stage.is-dragging { cursor: grabbing; }
.orbit-floor { position: absolute; width: 760px; height: 760px; left: 50%; top: 48%; margin: -380px; border-radius: 50%; background: radial-gradient(circle, #f2d573 40%, #e6be4e 70%); transform: translateY(128px) rotateX(72deg); border: 1px solid #bf983b; box-shadow: 0 20px 0 #d5ad43, 0 26px 0 #b79136, 0 60px 60px #79551655; }
.orbit-floor__marks { position: absolute; inset: 35px; border: 1px solid #bd963866; border-radius: 50%; background: repeating-conic-gradient(from 0deg, #ad842c55 0deg 1deg, transparent 1deg 15deg); mask-image: radial-gradient(transparent 68%, black 69%); }
.orbit-cards { position: absolute; inset: 0; transform-style: preserve-3d; pointer-events: none; }
.orbit-card { position: absolute; left: 50%; top: 45%; width: 224px; margin: -70px 0 0 -112px; padding: 7px; text-align: left; background: #fffaf0; border: 1px solid #ffffff; border-radius: 5px; box-shadow: 0 14px 26px #64491d35; color: var(--ink); font: inherit; cursor: pointer; transform-origin: center bottom; pointer-events: auto; backface-visibility: hidden; }
.orbit-card img { display: block; width: 100%; aspect-ratio: 16/9; object-fit: cover; pointer-events: none; }
.orbit-card span { display: block; padding: 9px 3px 3px; font-size: .57rem; letter-spacing: .07em; color: var(--blue); }
.orbit-card[data-kind="mv"] span { color: #b42e5a; }
.orbit-card.is-selected { border-color: #171319; box-shadow: 0 20px 35px #64491d45; }
.orbit-cat { position: absolute; top: 330px; left: calc(50% + 108px); width: 240px; height: 180px; z-index: 4; pointer-events: none; }
.orbit-cat__sprite { position: absolute; inset: 0; background: url('assets/cat-walk-sprite.png') 0 0 / 2400px 1080px no-repeat; }
.orbit-cat__shadow { position: absolute; width: 130px; height: 18px; left: 64px; bottom: 22px; border-radius: 50%; background: #65441566; filter: blur(7px); }
.orbit-coordinate { position: absolute; top: 518px; left: calc(50% + 152px); font-size: .5rem; letter-spacing: .16em; opacity: .55; }
.orbit-console { position: relative; z-index: 8; max-width: 650px; padding: 0 24px 42px; margin: 0 auto; text-align: center; }
#orbit-help { font-size: .68rem; letter-spacing: .12em; opacity: .65; }
.orbit-selection { display: grid; grid-template-columns: 44px 1fr 44px; gap: 20px; align-items: center; margin: 24px 0; min-height: 75px; }
.orbit-selection button { width: 44px; height: 44px; border: 1px solid #17131950; border-radius: 50%; background: transparent; cursor: pointer; font-size: 20px; }
.orbit-selection button:hover { background: var(--ink); color: #ffe385; }
.orbit-counter { font-size: .63rem; letter-spacing: .18em; }
.orbit-work-title { font-size: clamp(1.1rem,2vw,1.6rem); line-height: 1.4; margin: 8px 0 0; }
.orbit-actions { display: flex; justify-content: center; align-items: center; gap: 24px; font-size: .7rem; }
.orbit-open { padding: 13px 22px; border-radius: 999px; color: #fff4ce; background: var(--ink); }
.orbit-motion { border: 0; background: transparent; font: inherit; text-decoration: underline; cursor: pointer; }
.orbit.is-reduced .orbit-floor { opacity: .45; }
@media(min-width:1400px) { .orbit-stage { margin-top: 65px; } }
@media(max-width:700px) { .orbit { min-height: 760px; } .orbit-heading { top: 28px; left: 24px; } .orbit-heading h1 { font-size: 2.5rem; } .orbit-heading > p:last-child { margin-top: 12px; font-size: .7rem; } .orbit-heading .kicker { font-size: .48rem; } .orbit-stage { margin-top: 120px; height: 420px; perspective: 850px; } .orbit-floor { width: 520px; height: 520px; margin: -260px; transform: translateY(95px) rotateX(72deg); } .orbit-card { width: 164px; margin-left: -82px; } .orbit-cat { width: 192px; height: 144px; top: 240px; left: calc(50% + 20px); } .orbit-cat__sprite { background-size: 1920px 864px; } .orbit-cat__shadow { width: 95px; left: 53px; bottom: 16px; } .orbit-coordinate { top: 381px; left: calc(50% + 58px); font-size: .4rem; } .orbit-actions { gap: 15px; font-size: .64rem; } .orbit-selection { gap: 10px; } }