.jukebox-side{right:max(16px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));z-index:24;pointer-events:none;width:290px;max-width:calc(100vw - 24px);position:fixed}.jukebox-side[hidden],.jukebox-player[hidden]{display:none}.jukebox-player{pointer-events:auto;background:var(--wood);border:3px solid var(--wood-edge);overscroll-behavior:contain;max-height:calc(100dvh - 100px);padding:16px;animation:.2s steps(4,end) jukebox-open;overflow-y:auto;box-shadow:inset 3px 3px #554932,inset -3px -3px #29251f}.jukebox-top{justify-content:space-between;align-items:center;gap:12px;display:flex}.jukebox-top h2{font-size:29px;line-height:1.15}.jukebox-top p{color:var(--ink);margin-top:6px;font-size:10px;line-height:1.8}.jukebox-top .icon-button{flex-shrink:0}.jukebox-machine-area{justify-content:center;align-items:center;gap:4px;margin-top:12px;display:flex}.jukebox-machine{isolation:isolate;background:0 0;flex:0 0 192px;width:192px;height:170px;padding:0;display:block;position:relative;overflow:visible}.jukebox-machine:hover{background:#554932}.jukebox-machine:focus-visible{outline-offset:2px}.jukebox-block{z-index:2;width:168px;height:168px;position:absolute;bottom:0;left:12px}.jukebox-record{z-index:3;transform-origin:50%;pointer-events:none;width:64px;height:64px;position:absolute;top:0;left:64px;transform:rotate(-18deg)}.jukebox-record-ready{transform:translateY(-24px)rotate(-18deg)}.jukebox-record-inserting{animation:.3s steps(5,end) .18s both jukebox-insert}.jukebox-record-ejecting{z-index:5;animation:.22s steps(4,end) both jukebox-eject}.jukebox-play-symbol{z-index:6;background:var(--surface);border:2px solid var(--edge);width:36px;height:36px;color:var(--cyan);place-items:center;display:grid;position:absolute;bottom:8px;right:4px}.jukebox-play-symbol .pixel-icon{width:24px}.jukebox-volume{min-height:150px;color:var(--ink);text-align:center;flex-direction:column;flex:0 0 42px;align-items:center;gap:4px;padding:4px 0;font-size:10px;line-height:1;display:flex}.jukebox-volume span{writing-mode:vertical-rl;transform:rotate(180deg)}.jukebox-volume input{appearance:none;writing-mode:vertical-lr;cursor:pointer;direction:rtl;background:0 0;width:44px;height:104px;margin:0}.jukebox-volume input::-webkit-slider-runnable-track{border:1px solid var(--wood-edge);background:#232923;width:8px;height:104px}.jukebox-volume input::-webkit-slider-thumb{appearance:none;background:var(--cyan);border:2px solid #254855;width:24px;height:12px;margin-left:-9px;box-shadow:inset 2px 2px #bdebf4}.jukebox-volume input::-moz-range-track{border:1px solid var(--wood-edge);background:#232923;width:6px;height:104px}.jukebox-volume input::-moz-range-thumb{background:var(--cyan);border:2px solid #254855;border-radius:0;width:20px;height:8px}.jukebox-volume output{font-variant-numeric:tabular-nums;min-width:40px;color:var(--cyan)}.jukebox-track{font-family:var(--pixel);text-align:center;margin-top:6px;font-size:26px;line-height:1.2}.jukebox-hint{color:var(--ink);text-align:center;margin-top:7px;font-size:11px}.jukebox-records{gap:8px;margin-top:18px;display:flex}.jukebox-records button{border:2px solid var(--wood-edge);min-width:0;min-height:48px;font-family:var(--pixel);background:#292820;flex:1;justify-content:center;align-items:center;gap:8px;padding:8px 6px;font-size:17px;line-height:1.25;display:flex}.jukebox-records button[aria-pressed=true]{border-color:var(--cyan);color:var(--cyan);background:var(--cyan-dark)}.jukebox-records button:hover{background:var(--surface)}.jukebox-records .pixel-art{flex-shrink:0;width:24px;height:24px}.jukebox-actions{gap:8px;margin-top:10px;display:flex}.jukebox-actions .text-button{flex:1;justify-content:center;min-height:44px;display:flex}.jukebox-actions .pixel-icon{width:20px}.jukebox-status{text-align:center;min-height:2em;color:var(--ink);margin-top:2px;font-size:10px;line-height:1.8}.jukebox-toggle{pointer-events:auto;background:var(--wood);min-height:52px;color:var(--ink);border:2px solid var(--wood-edge);font-family:var(--pixel);align-items:center;gap:8px;margin:10px 0 0 auto;padding:6px 12px;font-size:18px;display:flex;box-shadow:0 3px #101b1f}.jukebox-toggle:hover{border-color:var(--cyan)}.jukebox-toggle>.pixel-art{width:36px;height:36px}.jukebox-signal{background:var(--edge);width:6px;height:6px}.jukebox-side[data-playing=true] .jukebox-signal{background:var(--cyan)}@keyframes jukebox-open{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:none}}@keyframes jukebox-insert{0%{clip-path:inset(0);transform:translateY(-38px)rotate(-18deg)}70%{clip-path:inset(0 0 24px);transform:translateY(12px)rotate(-18deg)}to{clip-path:inset(0 0 56px);transform:translateY(26px)rotate(-18deg)}}@keyframes jukebox-eject{0%{clip-path:inset(0 0 56px);transform:translateY(26px)rotate(-18deg)}45%{clip-path:inset(0);transform:translateY(-15px)rotate(-18deg)}to{opacity:0;transform:translateY(-44px)rotate(-18deg)}}@media (max-width:767px){.jukebox-side{right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom))}.jukebox-player{padding:14px}.jukebox-toggle{min-height:48px;padding:4px 10px;font-size:16px}.jukebox-toggle>.pixel-art{width:32px;height:32px}}@media (prefers-reduced-motion:reduce){.jukebox-player{animation:none}.jukebox-record-inserting{clip-path:inset(0 0 56px);animation:none;transform:translateY(26px)rotate(-18deg)}.jukebox-record-ejecting{animation:10ms step-end both jukebox-eject-reduced}}@keyframes jukebox-eject-reduced{to{opacity:0}}
.RetroBubble-module__VNelFG__balloon{background:var(--bubble-bg-color);color:var(--ink);border:4px solid;border-image:var(--bubble-border-image) 3 / 3 / 2 stretch;font-family:var(--pixel);margin:8px 8px 24px;padding:10px 16px;font-size:17px;line-height:1.4;display:inline-block;position:relative}.RetroBubble-module__VNelFG__balloon:before,.RetroBubble-module__VNelFG__balloon:after{content:"";position:absolute;left:2rem}.RetroBubble-module__VNelFG__balloon:before{background:var(--bubble-bg-color);border-right:4px solid var(--bubble-border-color);border-left:4px solid var(--bubble-border-color);width:26px;height:10px;bottom:-14px}.RetroBubble-module__VNelFG__balloon:after{background:var(--bubble-bg-color);width:18px;height:4px;box-shadow:-4px 0 var(--bubble-border-color), 4px 0 var(--bubble-border-color), -4px 4px var(--bubble-bg-color), 0 4px var(--bubble-border-color), -8px 4px var(--bubble-border-color), -4px 8px var(--bubble-border-color), -8px 8px var(--bubble-border-color);bottom:-18px}