#ui{--pink:#ff5ad9;--purple:#b26bff;--turquoise:#4fe0ff;--yellow:#ffd84f;--night:#1b1230;--font:ui-rounded, "SF Pro Rounded", "Nunito", "Varela Round", system-ui, sans-serif;pointer-events:none;font-family:var(--font);-webkit-tap-highlight-color:transparent;position:fixed;inset:0;overflow:hidden}#ui button{pointer-events:auto}.song-board{box-sizing:border-box;transform-origin:0 0;color:#f3eaff;flex-direction:column;padding:28px 40px 40px;display:flex;position:absolute;top:0;left:0}.song-board__logo{flex:none}.song-board__list{flex-direction:column;gap:16px;margin:0;padding:0;list-style:none;display:flex}.wish{background:linear-gradient(90deg,#b26bff24,#4fe0ff0f);border-radius:22px;align-items:center;gap:18px;height:124px;padding:0 10px 0 20px;display:flex;box-shadow:inset 0 0 0 3px #b26bff59}.wish:first-child{box-shadow:inset 0 0 0 4px #ff5ad9bf,0 0 26px #ff5ad959}.song-board--intro .wish{animation:wish-in var(--wish-length) cubic-bezier(.22, 1, .36, 1) both;animation-delay:calc(var(--wishes-start) + var(--index) * var(--wish-gap))}@keyframes wish-in{0%{opacity:0;transform:translateY(36px)scale(.96)}to{opacity:1;transform:none}}.wish__number{text-align:center;width:40px;color:var(--turquoise);text-shadow:0 0 14px #4fe0ff99;flex:none;font-size:54px;font-weight:800}.wish__text{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.wish__band,.wish__song{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.wish__band{color:var(--yellow);font-size:44px;font-weight:800}.wish__song{font-size:40px;font-weight:600}.cover{object-fit:cover;border-radius:12px;flex:none;width:104px;height:104px;box-shadow:0 0 0 3px #ffffff1f}.cover--placeholder{background:linear-gradient(135deg, var(--cover-from), var(--cover-to));place-items:center;display:grid}.cover--placeholder svg{fill:#ffffffd9;width:55%;height:55%}.dino-picture{object-fit:contain;flex:none;width:108px;height:108px}.dino-picture--placeholder{box-sizing:border-box;border:4px solid var(--dino-color);background:radial-gradient(circle, color-mix(in srgb, var(--dino-color) 35%, transparent), transparent 75%);border-radius:50%}.dino-picture--placeholder svg{width:100%;height:100%;fill:var(--dino-color);display:block}.dino-picture__eye{fill:var(--night)}.round-button{box-sizing:border-box;border:4px solid var(--ring);background:radial-gradient(circle, #2a1c4f, var(--night));color:#fff;box-shadow:0 0 16px color-mix(in srgb, var(--ring) 70%, transparent), inset 0 0 12px color-mix(in srgb, var(--ring) 45%, transparent);cursor:pointer;border-radius:50%;place-items:center;padding:0;transition:transform .12s ease-out;display:grid;position:absolute}.round-button:active{transform:scale(.92)}.round-button:focus-visible{outline-offset:4px;outline:4px solid #fff}.round-button svg{fill:none;stroke:currentColor;stroke-width:3px;stroke-linecap:round;width:58%;height:58%;filter:drop-shadow(0 0 3px var(--ring))}.round-button--plus{--ring:var(--turquoise);translate:-50% -50%}.round-button--nest{translate:-15% -85%}.round-button--menu,.round-button--close{--ring:var(--pink);width:68px;height:68px}.round-button--menu{left:calc(env(safe-area-inset-left) + 16px);top:calc(env(safe-area-inset-top) + 16px)}.round-button--close{right:16px;top:calc(env(safe-area-inset-top) + 16px)}.menu__backdrop{opacity:0;background:#0a05198c;transition:opacity .25s;position:absolute;inset:0}.menu__panel{width:min(420px,85vw);padding-left:env(safe-area-inset-left);box-sizing:border-box;background:linear-gradient(160deg, #2a1c4f, var(--night));border-right:4px solid var(--purple);transition:translate .28s;position:absolute;top:0;bottom:0;left:0;translate:-105%;box-shadow:0 0 30px #b26bff80}.menu--open .menu__backdrop{opacity:1;pointer-events:auto}.menu--open .menu__panel{pointer-events:auto;translate:0}@media (prefers-reduced-motion:reduce){.song-board--intro .wish{animation-name:wish-fade-in}.menu__backdrop,.menu__panel,.round-button{transition:none}}@keyframes wish-fade-in{0%{opacity:0}}
