.piano-loader{--pl-cycle:6.4s;--pl-beat:1.2s;--pl-note-life:calc(var(--pl-beat) * 4);--pl-staff-life:7.2s;--pl-soft:cubic-bezier(0.45,0,0.35,1);--pl-drift:cubic-bezier(0.2,0.6,0.35,1);--pl-note-ink:var(--ink-700);--pl-note-tomato:var(--tomato-500);--pl-note-leaf:var(--leaf-500);--pl-note-cheek:var(--cheek-400);--pl-staff-line:var(--ink-400);--pl-staff-note:var(--ink-600);--pl-floor:color-mix(in oklab,var(--ink-900) 9%,transparent);--pl-outline:var(--ink-900);--pl-body:var(--key-ivory-lit);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;width:100%;color:var(--muted-foreground);opacity:0;animation:pl-appear .6s var(--ease) .16s forwards}.piano-loader[data-layout=region]{min-height:min(62vh,560px);padding:32px 16px}.piano-loader[data-layout=screen]{min-height:100dvh;padding:24px 16px}.piano-loader[data-tone=cream]{background:var(--cream-50)}.piano-loader[data-tone=dark]{--pl-note-ink:var(--cream-100);--pl-note-tomato:var(--tomato-400);--pl-note-leaf:var(--leaf-300);--pl-note-cheek:var(--cheek-300);--pl-staff-line:color-mix(in oklab,var(--cream-50) 32%,transparent);--pl-staff-note:color-mix(in oklab,var(--cream-50) 70%,transparent);--pl-floor:var(--key-drop);--pl-outline:var(--cream-100);--pl-body:color-mix(in oklab,var(--cream-50) 8%,transparent);background:var(--kiosk-bg);color:var(--cream-100)}.pl-art{width:clamp(168px,44vw,216px);height:auto;overflow:visible}.pl-stop-juice-back{stop-color:var(--tomato-200)}.pl-stop-juice-top{stop-color:var(--tomato-300)}.pl-stop-juice-deep{stop-color:var(--tomato-600)}.pl-floor{fill:var(--pl-floor)}.pl-body{fill:var(--pl-body)}.pl-outline{fill:none;stroke:var(--pl-outline);stroke-width:.95;stroke-linecap:round;stroke-linejoin:round}.pl-rise{transform:translateY(192px);animation:pl-rise var(--pl-cycle) var(--pl-soft) infinite}.pl-wave-back-pos{transform:translateY(-2px)}.pl-wave--front{opacity:.88;stroke:var(--tomato-100);stroke-width:.8;stroke-opacity:.7;animation:pl-flow 3.2s linear infinite}.pl-wave--back{opacity:.6;animation:pl-flow-back 4.6s linear infinite}@keyframes pl-rise{0%{transform:translateY(192px);opacity:1}68%,84%{transform:translateY(64px);opacity:1}to{transform:translateY(64px);opacity:0}}@keyframes pl-flow{to{transform:translateX(84px)}}@keyframes pl-flow-back{to{transform:translateX(-84px)}}.pl-float,.pl-sway{transform-box:fill-box;transform-origin:center}.pl-float{opacity:0;animation:pl-float var(--pl-note-life) var(--pl-drift) infinite;animation-delay:calc(var(--i) * var(--pl-beat) * -1)}.pl-float--staff{--pl-lift:-50px;--pl-peak:0.75;animation-duration:var(--pl-staff-life);animation-delay:calc(var(--i) * var(--pl-staff-life) * -.5)}.pl-float--note{--pl-lift:-62px;--pl-peak:1}.pl-sway{animation:pl-sway 1.8s ease-in-out infinite alternate;animation-delay:calc(var(--i) * -.7s)}.pl-float--note[data-tint=ink]{fill:var(--pl-note-ink)}.pl-float--note[data-tint=tomato]{fill:var(--pl-note-tomato)}.pl-float--note[data-tint=leaf]{fill:var(--pl-note-leaf)}.pl-float--note[data-tint=cheek]{fill:var(--pl-note-cheek)}.pl-staff-lines{stroke:var(--pl-staff-line);stroke-width:.7;stroke-linecap:round}.pl-staff-notes{fill:var(--pl-staff-note)}@keyframes pl-float{0%{transform:translateY(8px) scale(.55);opacity:0}16%{opacity:var(--pl-peak)}70%{opacity:calc(var(--pl-peak) * .85)}to{transform:translate(var(--dx),var(--pl-lift)) scale(1);opacity:0}}@keyframes pl-sway{0%{transform:translateX(-2.5px) rotate(-6deg)}to{transform:translateX(2.5px) rotate(6deg)}}@keyframes pl-appear{to{opacity:1}}.pl-caption{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}@media (prefers-reduced-motion:reduce){.piano-loader,.pl-float,.pl-rise,.pl-sway,.pl-wave{animation:none}.piano-loader{opacity:1}.pl-rise{transform:translateY(100px)}.pl-float{opacity:0}.pl-float--still{opacity:.9;transform:translate(calc(var(--dx) * .4),calc(var(--pl-lift) * .8))}.pl-caption{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto;font-size:14px;line-height:20px}}