/* Original cassette designs: paper labels, moulded shells and exposed tape packs. */
.guided-tools [hidden]{display:none!important}body[data-source=cassette] .record-format-control,body.guided-demo[data-source=cassette] .cartridge-catalogue{display:none}body[data-source=cassette] .tape-face{aspect-ratio:auto;min-height:420px}body[data-source=cassette] .cassette-window[data-stock]{--tape-paper:#e2d5b6;--tape-ink:#322e25;--tape-stripe:#bd4d27;display:block;position:relative;width:84%;aspect-ratio:1.58;margin:28px auto 20px;padding:0;border:5px solid #16181a;border-radius:9px;background:linear-gradient(160deg,#34332d,#121519 65%);box-shadow:inset 0 0 0 1px #77786b,inset 0 8px 14px #ffffff0c,3px 5px 9px #0008;container-type:inline-size;overflow:hidden;color:var(--tape-ink)}body[data-source=cassette] .cassette-window[data-stock=chrome]{--tape-paper:#d7d9d7;--tape-ink:#1f2934;--tape-stripe:#286095;background:linear-gradient(150deg,#2e333c,#090e14 75%)}body[data-source=cassette] .cassette-window[data-stock=metal]{--tape-paper:#c1c8cb;--tape-ink:#20262c;--tape-stripe:#424b50;background:repeating-linear-gradient(90deg,#adc6bf12 0 9px,transparent 10px 14px),linear-gradient(135deg,#788f8b66,#223537aa);border-color:#6c7f7b}.tape-paper{position:absolute;inset:9% 8% auto;height:34%;padding:3% 4%;box-sizing:border-box;background:linear-gradient(100deg,#fff2,transparent 75%),var(--tape-paper);border-radius:3px;box-shadow:inset 0 0 7px #332b1728,0 1px 1px #0008;overflow:hidden}.tape-masthead{display:flex;justify-content:space-between;align-items:center;gap:4px;padding-bottom:3%;border-bottom:4px solid var(--tape-stripe);font:800 3.4cqw/1 system-ui;letter-spacing:.03em}.tape-formula{font:700 2.8cqw/1 system-ui;white-space:nowrap}.tape-writing{display:block;font:italic 4.2cqw/1.25 'Bradley Hand','Segoe Print',Georgia,serif;border-bottom:1px solid #76674e77;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2%}.tape-credit{display:block;font:2.5cqw/1.4 system-ui;letter-spacing:.07em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tape-foot{position:absolute;left:8%;right:8%;bottom:10%;height:12%;background:var(--tape-paper);display:flex;align-items:center;justify-content:space-between;gap:5px;padding:0 4%;border-top:3px solid var(--tape-stripe);font:2.2cqw system-ui;letter-spacing:.03em}.tape-side{font:800 4.3cqw system-ui}.tape-foot small{font:2cqw system-ui}.case-screw{position:absolute;width:3.5%;aspect-ratio:1;border-radius:50%;background:linear-gradient(45deg,transparent 46%,#272d2c 47% 54%,transparent 55%),radial-gradient(circle at 35% 25%,#e3e5dc,#737c7a 55%,#1a2124 70%);box-shadow:0 1px 2px #000b}.case-screw:nth-child(1){top:3%;left:3%}.case-screw:nth-child(2){top:3%;right:3%}.case-screw:nth-child(3){bottom:4%;left:3%}.case-screw:nth-child(4){bottom:4%;right:3%}body[data-source=cassette] .cassette-window[data-stock] .cassette-spools{position:absolute;left:11%;top:46%;width:78%;height:29%;padding:0 4%;margin:0;display:flex;justify-content:space-between;align-items:center;background:linear-gradient(150deg,#151d2299,#0008);border:2px solid #737a6c88;border-radius:12px;box-shadow:inset 0 2px 7px #000a}body[data-source=cassette] .cassette-window[data-stock] .cassette-spools i{--pack:var(--supply,58%);position:relative;flex:0 0 30%;width:30%;height:auto;aspect-ratio:1;border:0;margin:0;border-radius:50%;background:radial-gradient(circle,#0b0f12 0 21%,#583b2d 22% var(--pack),#151b20 calc(var(--pack) + 1%) 67%,#7b8476 68% 69%,#141a1c 70%);animation:spin 2.4s linear infinite paused}body[data-source=cassette] .cassette-window[data-stock] .cassette-spools i:last-child{--pack:var(--takeup,22%);animation-duration:1.8s}.cassette-spools i:after{content:'';position:absolute;inset:32%;border-radius:50%;background:radial-gradient(circle,#14191a 0 30%,transparent 33%),repeating-conic-gradient(#d6d4c7 0deg 24deg,#7a8079 25deg 36deg,#d6d4c7 37deg 60deg);box-shadow:0 0 0 1px #080d11}.tape-bridge{position:absolute;top:77%;left:17%;right:17%;height:2px;background:#493025;box-shadow:0 1px #0006}.tape-head-slot{position:absolute;left:24%;right:24%;bottom:0;height:7%;background:#2b3032;border:2px solid #79817855;clip-path:polygon(10% 0,90% 0,100% 100%,0 100%);display:flex;justify-content:space-around;align-items:center}.tape-head-slot i{width:10%;height:55%;background:#030909;border-radius:1px}body[data-source=cassette].playing[data-cassette-active=A] #cassette-bay-a .cassette-spools i,body[data-source=cassette].playing[data-cassette-active=B] #cassette-bay-b .cassette-spools i{animation-play-state:running}body[data-source=cassette][data-cassette-dual=true] .cassette-window[data-stock]{width:50%;margin:0;border-width:4px}body[data-source=cassette][data-cassette-dual=true] .cassette-bays{align-items:center}.tape-stock-control{display:grid;gap:8px;margin:18px 0;font-size:12px;color:inherit}.tape-stock-control select,.cassette-track-selectors select{min-height:44px;font-size:14px!important}.tape-stock-control small{font-size:11px;line-height:1.7;opacity:.8}.cassette-bay-buttons button{min-height:44px}.cassette-track-selectors{flex-wrap:wrap}.cassette-track-selectors label{min-width:120px}.cassette-track-selectors label select{font-size:14px!important}body[data-source=cassette] #vinyl-unit,body[data-source=cassette] .cd-player,body[data-source=cassette] .jukebox-machine{display:none}body[data-source=cassette] .tape-keys button{min-height:44px}
@media(max-width:600px){body[data-source=cassette] .tape-face{padding:16px 12px;min-height:0;border-width:6px}.tape-stock-control select,.cassette-track-selectors select{font-size:16px!important}body[data-source=cassette] .cassette-window[data-stock]{width:94%;margin-block:22px 16px}body[data-source=cassette][data-cassette-dual=true] .cassette-window[data-stock]{width:50%;border-width:3px}.tape-stock-control small{font-size:12px}}
@media(prefers-reduced-motion:reduce){.cassette-spools i{animation:none!important}}

.tape-sound{margin:18px 0;padding:14px;border:1px solid #67745c;border-radius:5px;display:grid;gap:14px;min-width:0}.tape-sound legend{font:11px system-ui;letter-spacing:.1em}.tape-sound button{min-height:46px}.tape-sound label{display:grid;gap:8px;font-size:14px}.tape-sound input[type=range]{width:100%;min-height:44px;accent-color:#805728}.tape-sound .tape-hiss{display:flex;align-items:center;gap:10px;min-height:44px}.tape-hiss input{width:22px;height:22px}.tape-sound p,.tape-sound small{font-size:12px;line-height:1.6;margin:0}.tape-sound button[aria-pressed=false]{background:#674a26;color:#fff3d9}