.pocket{z-index:38;left:12px;right:12px;bottom:calc(94px + env(safe-area-inset-bottom,0px));animation:.55s cubic-bezier(.2,.9,.25,1.05) pocket-in;position:fixed}@keyframes pocket-in{0%{transform:translateY(130%)rotate(1.5deg)}}@media (min-width:768px){.pocket{left:auto;right:20px;bottom:calc(18px + env(safe-area-inset-bottom,0px));width:min(25rem,100vw - 40px)}}.pk{color:#f6ead6;background:repeating-linear-gradient(177deg,#1e0c0429 0 1px,#0000 1px 6px),repeating-linear-gradient(182deg,#ffd6a80f 0 2px,#0000 2px 11px),radial-gradient(140% 120% at 20% 0,#845232 0%,#5d3820 55%,#45281a 100%);border-radius:16px;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:10px;padding:10px 12px 14px 10px;display:grid;position:relative;box-shadow:0 0 0 1.5px #8f939a,0 0 0 3px #ffffff59,inset 0 1px #ffe2be4d,inset 0 -8px 14px #0000002e,0 16px 34px #2e1a0c61}.pk-rec{appearance:none;cursor:pointer;background:0 0;border:0;border-radius:50%;width:52px;height:52px;padding:0;position:relative}.pk-rec:focus-visible{outline-offset:3px;outline:2px solid #f4b787}.pk-disc{background:repeating-radial-gradient(circle,#0b0a0a 0 1px,#151313 1px 2px,#060505 2px 3px);border-radius:50%;place-items:center;animation:1.8s linear infinite paused pk-spin;display:grid;position:absolute;inset:0;box-shadow:0 0 0 1.5px #b9bcc1,0 3px 6px #00000073}.pocket.playing .pk-disc{animation-play-state:running}.pk-disc img{object-fit:cover;border-radius:50%;width:20px;height:20px}.pk-disc:after{content:"";background:#ddd;border-radius:50%;width:3px;height:3px;position:absolute}.pk-rec:before{content:"";z-index:1;pointer-events:none;background:conic-gradient(from -50deg, transparent 0 4%, #fff6e638 8%, transparent 13% 50%, #fff6e624 55%, transparent 60%);border-radius:50%;position:absolute;inset:0}.pk-icon{z-index:2;opacity:0;place-items:center;transition:opacity .2s;display:grid;position:absolute;inset:0}.pk-icon svg{box-sizing:content-box;color:#2a1d0e;background:#f6ead6eb;border-radius:50%;width:22px;height:22px;padding:5px}.pk-rec:hover .pk-icon,.pk-rec:focus-visible .pk-icon,.pocket:not(.playing) .pk-icon{opacity:1}.pk-text{min-width:0;color:inherit;gap:2px;text-decoration:none;display:grid}.pk-text:focus-visible{outline-offset:2px;border-radius:4px;outline:2px solid #f4b787}.pk-text b{font:700 1.08rem/1.15 var(--font-display);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.pk-text small{font:600 9.5px/1.2 var(--font-sans);letter-spacing:.18em;text-transform:uppercase;color:#f4e2c69e;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.pk-harp{border-radius:4px;grid-auto-flow:column;justify-self:start;gap:3px;margin-top:4px;padding:3px 5px;display:grid;box-shadow:0 1px 2px #0006}.pk-harp.diat{background:linear-gradient(#f2f3f4 0 28%,#d6ac72 28% 72%,#a9adb3 72%)}.pk-harp.chrom{background:linear-gradient(#f2f3f4 0 28%,#2a2624 28% 72%,#a9adb3 72%)}.pk-harp i{background:#120d0a;border-radius:1.5px;width:6px;height:5px;transition:background .3s,box-shadow .3s;display:block}.pk-harp i.on{background:#f7a465;box-shadow:0 0 6px 1px #f7a465d9}.pk-knob{appearance:none;cursor:pointer;color:#2a1d0e;background:radial-gradient(circle at 35% 30%,#fbfbfa,#b9bdc2 60%,#7c8086);border:0;border-radius:50%;place-items:center;width:38px;height:38px;margin:3px;display:grid;box-shadow:0 2px 4px #00000073,inset 0 -2px 3px #00000026}.pk-knob:active{transform:translateY(1px);box-shadow:0 1px 2px #00000073}.pk-knob:focus-visible{outline-offset:2px;outline:2px solid #f4b787}.pk-knob svg{width:15px;height:15px}.pk-groove{background:#00000059;border-radius:2px;height:2px;position:absolute;bottom:6px;left:16px;right:16px;overflow:hidden}.pk-groove i{background:linear-gradient(90deg,#f4b787,#f39a5b);width:0;height:100%;display:block;box-shadow:0 0 6px #f39a5bcc}@keyframes pk-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.pocket{animation:none}.pk-disc{animation-duration:6s}}