:root{color-scheme:dark;--bg:#17191b;--panel:#202225;--ink:#efeee9;--muted:#94958e;--orange:#e9a24b;--line:#373a3b;--shell:#e3b831;--shell-dark:#b89024;--shell-ink:#272923;--accent:#cd3e30;font-family:Arial,'Helvetica Neue','Apple SD Gothic Neo','Malgun Gothic',sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink)}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}button:disabled{cursor:default;opacity:.35}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--orange);outline-offset:4px}button{border:0;background:none}a{color:inherit;text-decoration:none}svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}[hidden]{display:none!important}.symbol-sheet{position:absolute;width:0;height:0;overflow:hidden}.topbar{max-width:1480px;margin:auto;height:103px;padding:0 48px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:13px;font-size:26px;font-weight:900;letter-spacing:-1.5px}.brand small{display:block;font-family:monospace;font-size:8px;font-weight:400;letter-spacing:2.5px;margin-top:5px;color:var(--muted)}.brand-mark{width:41px;height:41px;background:var(--orange);color:#17191b;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:29px;border-radius:5px;position:relative}.brand-mark span{position:absolute;right:3px;top:0;font-size:17px}.top-actions{display:flex;gap:26px;align-items:center}.local-tag{font:9px monospace;letter-spacing:1.8px;color:#b3b5ad}.local-tag i,.device-dot{display:inline-block;width:6px;height:6px;background:#a4bb89;border-radius:50%;margin-right:8px}.icon-button{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--line);border-radius:50%;flex-shrink:0}.icon-button:hover{background:#ffffff10}.icon-button span{font:15px monospace}.icon-button.light{background:#eeede7;color:#222;border-color:#eeede7}.workspace{max-width:1480px;margin:auto;display:grid;grid-template-columns:340px minmax(0,1fr);min-height:calc(100dvh - 103px)}.library-panel{padding:37px 27px 25px 48px;border-right:1px solid var(--line);display:flex;flex-direction:column;min-width:0}.eyebrow{font:9px monospace;letter-spacing:2px;color:var(--muted)}.section-heading{display:flex;justify-content:space-between;align-items:center}.section-heading h1{font-size:24px;letter-spacing:-1px;margin:10px 0 25px;font-weight:700}.section-heading h1 span{font:11px monospace;color:var(--orange);margin-left:10px;vertical-align:top;display:inline-block;padding-top:4px}.create-single{display:flex;align-items:center;gap:12px;background:#2b2d2d;border:1px solid #484940;padding:16px 13px;border-radius:5px;text-align:left;width:100%}.create-single>svg:first-child{color:var(--orange);width:20px}.create-single>svg:last-child{margin-left:auto;width:16px;color:var(--muted)}.create-single span{font-size:12px;font-weight:600}.create-single small{display:block;font-size:9px;font-weight:400;margin-top:6px;color:var(--muted)}.library-toolbar{display:flex;justify-content:space-between;align-items:center;margin:27px 0 18px}.mini-tabs{display:flex;gap:13px}.mini-tabs button{padding:0 0 6px;color:var(--muted);font-size:11px}.mini-tabs button.active{border-bottom:1px solid var(--orange);color:var(--ink)}#library-caption{font:7px monospace;letter-spacing:1px;color:#777b74}.track-list{display:grid;grid-template-columns:1fr 1fr;gap:19px 12px;align-content:start}.track-card{min-width:0;position:relative}.track-open{display:block;padding:0;width:100%;text-align:left}.track-cover{aspect-ratio:1;position:relative;border-radius:3px;overflow:hidden;border:1px solid #ffffff1a;background:#323735}.track-card.selected .track-cover{outline:2px solid var(--orange);outline-offset:3px}.track-info{display:flex;align-items:center;gap:4px;margin-top:10px}.track-info>div{min-width:0;flex:1}.track-info strong,.track-info small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.track-info strong{font-size:11px;font-weight:500}.track-info small{font-size:9px;color:var(--muted);margin-top:5px}.track-menu{width:23px;height:26px;color:var(--muted);font-size:19px}.track-menu-panel{position:absolute;right:0;top:calc(100% - 6px);z-index:5;background:#303235;border:1px solid #555;border-radius:6px;min-width:125px;padding:5px;box-shadow:0 5px 20px #0008}.track-menu-panel button{display:block;width:100%;text-align:left;font-size:11px;padding:9px;border-radius:3px}.track-menu-panel button:hover{background:#ffffff10}.track-menu-panel .danger{color:#f39d8e}.empty-library{text-align:center;padding:56px 0 65px}.empty-tape{width:91px;height:58px;border:1px solid #66695b;border-radius:7px;margin:0 auto 25px;position:relative;display:flex;align-items:center;justify-content:center;gap:15px;background:repeating-linear-gradient(0deg,transparent 0px,transparent 3px,#ffffff04 4px)}.empty-tape:after{content:'';position:absolute;bottom:4px;width:46px;height:8px;border:1px solid #54574c;border-radius:3px}.empty-tape i{width:19px;height:19px;border:4px solid #767a65;border-radius:50%}.empty-library h2{font-size:14px;font-weight:500;letter-spacing:-.5px}.empty-library p{color:var(--muted);font-size:11px;line-height:1.9;margin:12px 0 18px}.text-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;font-size:11px;padding:3px 0}.text-button:hover{color:var(--orange)}.text-button span{font-size:16px;color:var(--orange)}.empty-library .text-button{color:var(--orange)}.library-bottom{display:flex;align-items:center;margin-top:auto;padding-top:30px;gap:1px}.library-bottom p{font-size:9px;line-height:1.8;color:#a2a49a;flex:1}.library-bottom p span{color:#72766c}.library-bottom .icon-button{width:27px;height:27px;border:0}.library-bottom svg{width:16px}.player-panel{padding:37px 55px 20px;min-width:0;display:flex;flex-direction:column}.player-heading{display:flex;justify-content:space-between;align-items:flex-start}.player-heading h2{font-size:27px;letter-spacing:-1.5px;font-weight:400;margin:12px 0 29px}.edition{font:8px/1.7 monospace;letter-spacing:1px;color:var(--muted);text-align:right;padding-top:4px}.mobile-break{display:none}.player-options{display:flex;justify-content:space-between;align-items:center;max-width:610px;width:100%;margin:0 auto 20px}.mode-switch{display:flex;gap:21px}.mode-switch button{font:9px monospace;letter-spacing:1.2px;color:#8c9087;padding:5px 0}.mode-switch button.active{color:var(--orange)}.skin-trigger{font-size:10px;color:#b5b6ac}.skin-trigger svg{width:15px;height:15px}.deck-stage{display:flex;justify-content:center;padding:2px 12px 13px;perspective:900px}.deck{width:100%;max-width:520px;aspect-ratio:1.21;background:linear-gradient(125deg,#ffffff22,transparent 40%,#0002),var(--shell);color:var(--shell-ink);position:relative;border:5px solid #101112;border-radius:22px;box-shadow:0 2px 0 1px #8b8d7f,0 10px 0 #0b0c0d,0 18px 3px #0004,0 27px 35px #0005,inset 0 0 0 2px #ffffff5c;overflow:hidden;display:flex;flex-direction:column;padding:27px 28px 21px;isolation:isolate}.deck:after{content:'';position:absolute;inset:0;border-radius:15px;box-shadow:inset 2px 2px 9px #fff3,inset -4px -6px 12px #0002;pointer-events:none;z-index:10}.shell-texture{position:absolute;inset:0;opacity:.09;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath filter='url(%23n)' opacity='.7' d='M0 0h180v180H0z'/%3E%3C/svg%3E");z-index:-1;pointer-events:none}.deck.custom-skin{background-image:linear-gradient(#0001,#0001),var(--custom-image);background-size:cover;background-position:center}.deck-name{display:flex;align-items:center;justify-content:space-between;font-size:17px;font-weight:900;letter-spacing:-.8px;padding-right:3px;position:relative;z-index:1}.deck-model{font:7px/1.5 monospace;letter-spacing:1px;text-align:right}.deck-body{display:flex;gap:22px;flex:1;align-items:center;padding-top:19px;position:relative}.cassette-door{position:relative;background:#13171a;border-radius:13px;border:3px solid #353837;box-shadow:inset 0 0 12px #000,0 2px 0 #ffffff35;width:100%;aspect-ratio:1.18;display:flex;align-items:center;justify-content:center;overflow:hidden}.cassette-door.drag-over{outline:3px dashed var(--orange);outline-offset:3px}.glass{position:absolute;inset:0;background:linear-gradient(125deg,#ffffff22,transparent 37%,#0001 58%,#ffffff06);box-shadow:inset 0 0 0 1px #ffffff2a;border-radius:10px;pointer-events:none;z-index:3}.cassette{width:92%;aspect-ratio:1.58;border-radius:9px;position:relative;border:1px solid #a499a175;background:linear-gradient(125deg,#ffffff15,#0002),#4f3c50;box-shadow:0 5px 7px #000b;color:#ece5df;padding:10px 12px 0;display:flex;flex-direction:column;transition:opacity .25s,transform .35s}.tape-header{display:flex;justify-content:space-between;align-items:center}.tape-header b{font:600 12px monospace}.tape-header>span{font:5px monospace;letter-spacing:.5px}.tape-label{margin-top:6px;border-top:1px solid #ffffff30;padding:5px 0 3px}.tape-label>span{display:block;font:600 9px monospace;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.tape-label small{display:block;font:4.5px monospace;margin-top:2px;letter-spacing:1px;white-space:nowrap;overflow:hidden}.tape-window{display:flex;align-items:center;justify-content:center;background:#17191b99;border-radius:5px;padding:3px 8px;margin-top:4px;border:1px solid #0005;flex:1;max-height:49px}.reel{width:42px;height:42px;border-radius:50%;position:relative;display:grid;place-items:center}.tape-roll{position:absolute;width:94%;height:94%;background:repeating-radial-gradient(circle,#39271e 0 1px,#30221d 1.4px 2px);border-radius:50%;transform:scale(var(--roll,.9))}.right-reel .tape-roll{--roll:.6}.reel-hub{position:relative;width:25px;height:25px;border-radius:50%;background:repeating-conic-gradient(#7a8280 0deg 15deg,#192123 15deg 60deg);border:5px solid #192123;animation:spin 2.5s linear infinite;animation-play-state:paused}.reel-hub:after{content:'';position:absolute;inset:5px;background:#111;border-radius:50%}.playing .reel-hub{animation-play-state:running}.tape-bridge{height:12px;width:32px;background:linear-gradient(#38231a 0 38%,#282b2d 39% 60%,#38231a 61%);margin:0 7px}.tape-bottom{font:4px monospace;letter-spacing:1px;text-align:center;margin-top:6px}.tape-trapezoid{height:10px;background:#1a1b2066;margin:6px 25px 0;clip-path:polygon(10% 0,90% 0,100% 100%,0 100%)}.tape-screw{position:absolute;font:7px monospace;color:#c0c6bf88}.ts1{left:4px;top:2px}.ts2{right:4px;top:2px}.ts3{left:4px;bottom:2px}.ts4{right:4px;bottom:2px}.door-empty{position:absolute;inset:0;z-index:4;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#101719cc;gap:14px}.door-empty>span{font:7px monospace;letter-spacing:2px;color:#b3b6a5}.door-empty button{font-size:11px;color:#d9dcd0;border:1px solid #9b9f784a;border-radius:4px;padding:9px;display:flex;gap:9px;align-items:center}.door-empty button svg{width:15px;height:15px}.deck.empty .cassette{opacity:.18;transform:translateY(-8px)}.transport{width:48px;flex-shrink:0;align-self:stretch;border-radius:24px;background:linear-gradient(90deg,#101314,#2b2d2e,#111);border:1px solid #ffffff25;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:13px 5px 9px;gap:10px;box-shadow:inset 2px 0 4px #0008}.power-led{width:6px;height:6px;border-radius:50%;background:#222;box-shadow:inset 0 1px 2px #000;margin-bottom:2px}.playing .power-led{background:#b3e09e;box-shadow:0 0 6px #b3e09e80}.transport-key{width:34px;min-height:38px;flex:1;max-height:45px;display:grid;place-items:center;position:relative;color:#e9e9e0;background:linear-gradient(#454846,#242728);border-radius:6px;border:1px solid #ffffff20;box-shadow:0 3px 1px #000c,inset 0 1px 0 #ffffff25;padding:4px}.transport-key:active:not(:disabled){transform:translateY(2px);box-shadow:0 1px 1px #0008}.transport-key svg{width:20px;height:20px}.transport-key span{position:absolute;bottom:0;right:2px;font:5px monospace;color:#d9d9c88c}.play-key{background:linear-gradient(#f15a40,#b02524);border-color:#ff9e6829}.transport-caption{font:4px/1.5 monospace;letter-spacing:.5px;text-align:center;color:#818581;margin-top:2px}.deck-footer{display:flex;align-items:center;justify-content:space-between;padding-top:14px}.deck-wordmark{font-size:31px;line-height:.75;font-weight:900;letter-spacing:-2.5px;color:var(--accent)}.deck-wordmark>span{display:block;color:transparent;-webkit-text-stroke:.8px var(--shell-ink);letter-spacing:-1.7px;margin-left:21px;margin-top:2px;font-size:28px}.stereo-mark{font-size:21px;letter-spacing:-2px;text-align:center}.stereo-mark small{display:block;font:4.5px monospace;letter-spacing:1px;margin-top:5px}.screw{position:absolute;width:6px;height:6px;background:linear-gradient(135deg,#999,#333);border-radius:50%;box-shadow:0 0 0 1px #0005}.screw:after{content:'';position:absolute;top:2.7px;left:1px;width:4px;height:.6px;background:#252628;transform:rotate(-35deg)}.s1{top:10px;left:10px}.s2{top:10px;right:10px}.s3{bottom:10px;left:10px}.s4{bottom:10px;right:10px}.silver-band,.clear-mechanism{display:none}[data-skin=midnight]{--shell:#23346d;--shell-dark:#172348;--shell-ink:#dfded9;--accent:#edaa45}[data-skin=clearWhite]{--shell:#d7d9cf;--shell-dark:#a5b1a7;--shell-ink:#303630;--accent:#b99d51}[data-skin=silverBlue]{--shell:#2d5790;--shell-dark:#15365d;--shell-ink:#eeeee4;--accent:#ffaf29}[data-skin=creamOrange]{--shell:#dfcfac;--shell-dark:#aa9877;--shell-ink:#3e3932;--accent:#ba4a26}[data-skin=blackGold]{--shell:#292c29;--shell-dark:#151614;--shell-ink:#d8c59a;--accent:#baa06c}[data-skin=silverBlue] .silver-band{display:block;position:absolute;inset:0 0 auto;height:19%;background:linear-gradient(#e6e5df,#bcbebc);z-index:-1}[data-skin=silverBlue] .deck-name{color:#253348}[data-skin=clearWhite] .clear-mechanism{display:flex;position:absolute;inset:30px 15px;gap:15px;opacity:.4;z-index:-1;align-items:center;transform:rotate(-8deg)}.clear-mechanism span{width:40px;height:80%;background:repeating-linear-gradient(0deg,#737e78 0 3px,transparent 3px 8px);border-radius:6px}.clear-mechanism i{width:110px;height:110px;border:15px solid #75847d;border-radius:50%}.deck.custom-skin .silver-band,.deck.custom-skin .clear-mechanism{display:none}
.now-playing{max-width:546px;width:100%;margin:25px auto 0}.now-title{display:flex;gap:12px;align-items:center;min-width:0}.status-label{font:7px monospace;letter-spacing:1px;color:var(--orange);white-space:nowrap}#now-title{font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.audio-badge{font:6px monospace;letter-spacing:1px;border:1px solid var(--line);border-radius:2px;padding:4px;color:var(--muted);white-space:nowrap}input[type=range]{appearance:none;-webkit-appearance:none;width:100%;height:3px;background:linear-gradient(to right,var(--orange) 0 var(--progress,0%),#43473e var(--progress,0%) 100%);border-radius:3px;cursor:pointer;padding:0}input[type=range]::-webkit-slider-thumb{appearance:none;width:8px;height:8px;border:0;border-radius:50%;background:var(--orange)}input[type=range]::-moz-range-thumb{width:8px;height:8px;border:0;border-radius:50%;background:var(--orange)}#seek{margin:20px 0 11px;display:block}.time-row{display:flex;align-items:center;justify-content:space-between;font:9px monospace;color:#a4a69c}.volume-control{display:flex;align-items:center;gap:7px}.volume-control svg{width:12px;height:12px}.volume-control input{width:57px;height:2px;background:#43473e}.volume-control input::-webkit-slider-thumb{width:5px;height:5px;background:#a4a69c}.under-player{max-width:546px;width:100%;margin:22px auto 0;display:flex;justify-content:space-between;align-items:center}.under-player>span{font:7px monospace;letter-spacing:1px;color:#777d70}.under-player button{font-size:10px;color:#aaafa1}.player-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:38px;color:#686f63;font:7px monospace;letter-spacing:.7px}.player-bottom button{font-size:9px;color:#868e7d}.footer-divider{margin:0 12px}.single-stage{width:100%;max-width:440px;margin:auto}.single-art{max-width:330px;margin:auto;aspect-ratio:1;border-radius:7px;box-shadow:0 15px 25px #0005;overflow:hidden}.single-info{display:flex;justify-content:space-between;align-items:center;margin:25px 0 14px}.single-info h3{font-size:20px;font-weight:600;letter-spacing:-.5px;margin:8px 0}.single-info p{color:var(--muted);font-size:12px;margin:0}.single-controls{display:flex;align-items:center;justify-content:center;gap:30px}.single-controls>.icon-button{border:0}.single-play{width:52px;height:52px;border-radius:50%;background:var(--ink);color:#222;display:grid;place-items:center}.jacket{width:100%;height:100%;position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(135deg,var(--jacket-a,#aebc9e),var(--jacket-b,#30403f));color:#fff}.jacket img{width:100%;height:100%;object-fit:cover;display:block}.jacket .jacket-art{position:absolute;inset:0;z-index:-1}.jacket[data-art=orbit] .jacket-art:before{content:'';position:absolute;width:82%;height:82%;border:20px solid #ffffff1c;border-radius:50%;left:38%;top:-8%}.jacket[data-art=orbit] .jacket-art:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 40%,#0008)}.jacket[data-art=stripe] .jacket-art{background:repeating-linear-gradient(135deg,#ffffff24 0 3%,transparent 3% 11%);transform:scale(1.5) rotate(-10deg)}.jacket[data-art=type] .jacket-art:before{content:'RAW';font:bold 10em/.8 Arial;letter-spacing:-.1em;color:#ffffff14;position:absolute;top:12%;left:-15%;transform:rotate(-90deg)}.jacket-copy{position:absolute;inset:8%;display:flex;flex-direction:column;justify-content:flex-end;min-width:0}.jacket-copy>span{font:5px monospace;letter-spacing:2px;margin-bottom:auto}.jacket-copy strong{font-size:clamp(10px,2vw,35px);line-height:1.1;letter-spacing:-.04em;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.jacket-copy small{font:7px monospace;letter-spacing:.6px;margin-top:7px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.single-art .jacket-copy>span,.editor-preview .jacket-copy>span{font-size:8px}.single-art .jacket-copy strong,.editor-preview .jacket-copy strong{font-size:35px}.single-art .jacket-copy small,.editor-preview .jacket-copy small{font-size:11px}.track-cover.tape-thumb{aspect-ratio:1.58;display:flex;align-items:center;background:#594b57}.mini-tape{width:100%;height:100%;position:relative;background:linear-gradient(#ffffff13,#0005);padding:11% 13%}.mini-tape>span{display:block;font:7px monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mini-tape>div{display:flex;justify-content:space-between;background:#10121388;padding:7% 13%;margin-top:5%;border-radius:3px}.mini-tape i{width:18px;height:18px;border:5px dashed #89877e;border-radius:50%;background:#111}.mobile-nav{display:none}.modal{background:#222526;color:var(--ink);border:1px solid #53584b;border-radius:12px;padding:28px;max-width:680px;width:calc(100% - 32px);max-height:90dvh;overflow:auto;box-shadow:0 30px 100px #0008}.modal::backdrop{background:#080c0ce6;backdrop-filter:blur(6px)}.modal-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.modal-heading h2{font-size:23px;font-weight:500;letter-spacing:-1px;margin:9px 0 0}.modal-heading .icon-button{border:0}.skin-modal{max-width:560px}.skin-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.skin-option{text-align:left;padding:6px;border:1px solid transparent;border-radius:6px}.skin-option.selected{border-color:var(--orange)}.skin-preview{aspect-ratio:1.2;background:linear-gradient(135deg,#ffffff22,transparent),var(--shell);border:3px solid #101415;border-radius:10px;position:relative;padding:15% 22% 18% 10%;box-shadow:0 3px 0 #0005}.skin-preview:before{content:'◉ ━ ◉';display:flex;align-items:center;justify-content:center;background:#252b29;color:#99998b;width:100%;height:70%;border-radius:5px;font-size:15px}.skin-preview:after{content:'RAWDECK';display:block;font:700 9px Arial;letter-spacing:-.4px;color:var(--shell-ink);margin-top:8%}.skin-option>span{display:flex;justify-content:space-between;font-size:10px;margin:10px 1px 3px}.skin-option>span i{color:var(--orange);font-style:normal}.custom-skins-header{display:flex;align-items:center;justify-content:space-between;margin-top:25px;border-top:1px solid var(--line);padding-top:17px}.custom-skins-header h3{font-size:14px;font-weight:500;margin:0}.custom-skins-header button{color:var(--orange)}.hint{font-size:10px;line-height:1.8;color:var(--muted);font-weight:400}.custom-skin-list{display:grid;gap:10px}.custom-skin{display:flex;align-items:center;gap:12px;padding:7px;border:1px solid var(--line);border-radius:5px}.custom-skin.selected{border-color:var(--orange)}.custom-skin>button:first-child{display:flex;align-items:center;gap:12px;text-align:left;flex:1;font-size:12px;min-width:0}.custom-skin img{width:40px;height:44px;object-fit:cover;border-radius:3px}.custom-skin button span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.custom-skin .icon-button{border:0}.custom-skin .icon-button svg{width:15px;height:15px}.editor-layout{display:grid;grid-template-columns:1fr 1fr;gap:25px}.editor-preview{aspect-ratio:1;border-radius:5px;overflow:hidden}.editor-preview .jacket-copy strong{font-size:28px}.cover-actions{display:flex;justify-content:space-between;align-items:center;margin-top:14px;gap:10px}.primary-button,.secondary-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 14px;border-radius:4px;font-size:11px}.primary-button{background:var(--orange);color:#20241f;font-weight:700}.primary-button span{margin-left:18px}.secondary-button{border:1px solid #555c4b;background:#ffffff06}.secondary-button svg{width:15px;height:15px}.editor-fields{display:flex;flex-direction:column;gap:14px}.editor-fields label:not(.file-select){display:flex;flex-direction:column;gap:7px;font-size:10px;color:#c0c5b7}.editor-fields input[type=text],.editor-fields select{color:var(--ink);background:#191d1b;border:1px solid #4a5143;border-radius:4px;width:100%;padding:10px;font-size:12px}.file-select{position:relative;border:1px dashed #737d60;display:flex;align-items:center;gap:8px;padding:12px;color:var(--orange);font-size:10px;border-radius:4px;overflow:hidden;cursor:pointer}.file-select span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-select svg{width:17px;height:17px}.file-select input{position:absolute;inset:0;opacity:0;width:100%;cursor:pointer}fieldset{border:0;padding:0;margin:0}legend{font-size:10px;color:#c0c5b7;padding:0;margin-bottom:8px}.jacket-styles{display:flex;gap:6px}.jacket-styles button{font:8px monospace;padding:8px;flex:1;border:1px solid var(--line);border-radius:3px}.jacket-styles button.active{color:var(--orange);border-color:var(--orange)}.modal-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}.help-modal{max-width:480px}.help-content ol{padding-left:19px}.help-content li{padding:5px 0 12px;font-size:13px}.help-content li p{color:#a6ad9e;font-size:11px;line-height:1.9;margin:6px 0 0}.help-note{font-size:11px;color:#bec8b1;background:#333c2c;padding:16px;line-height:1.9;border-radius:4px}.backup-actions{display:flex;gap:10px;margin-top:18px}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,15px);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;background:#e8e9dd;color:#242b20;padding:13px 20px;border-radius:6px;font-size:12px;box-shadow:0 8px 25px #0004;z-index:100;max-width:90vw;line-height:1.6}.toast.visible{opacity:1;transform:translate(-50%,0)}@keyframes spin{to{transform:rotate(360deg)}}
@media(min-width:1400px){.player-panel{padding-left:85px;padding-right:85px}.deck{max-width:540px}.deck-stage{padding-top:12px}.workspace{grid-template-columns:365px minmax(0,1fr)}.now-playing{margin-top:33px}.player-heading{margin-bottom:10px}}
@media(max-width:1050px){.topbar{padding:0 28px}.workspace{grid-template-columns:290px minmax(0,1fr)}.library-panel{padding:30px 22px 20px 28px}.player-panel{padding:30px 30px 20px}.player-heading h2{font-size:23px}.edition{display:none}.deck{padding:23px 22px 18px;border-radius:18px}.deck-body{gap:13px}.transport{width:40px;gap:8px;padding:10px 3px 7px}.transport-key{width:29px;min-height:32px}.deck-wordmark{font-size:25px}.deck-wordmark>span{font-size:22px}.tape-window{max-height:37px}.reel{width:32px;height:32px}.reel-hub{width:22px;height:22px}.tape-label>span{font-size:7px}.tape-label small{font-size:4px}.tape-bottom{font-size:3px}.tape-trapezoid{height:6px;margin-top:3px}.cassette{padding:8px 9px 0}.deck-footer{padding-top:10px}.under-player>span{display:none}.now-title{gap:8px}.status-label{font-size:6px}.audio-badge{display:none}.player-bottom>span{font-size:6px}.player-bottom{gap:10px}.footer-divider{margin:0 5px}}
@media(max-width:720px){.topbar{height:77px;padding:env(safe-area-inset-top,0px) 23px 0}.brand{font-size:23px}.brand-mark{width:34px;height:34px;font-size:25px}.brand small{font-size:6px;letter-spacing:2px}.top-actions{gap:15px}.local-tag{font-size:6px;letter-spacing:1px}.local-tag i{width:4px;height:4px;margin-right:4px}.top-actions .icon-button{width:28px;height:28px}.workspace{display:block;min-height:calc(100dvh - 77px);padding-bottom:calc(72px + env(safe-area-inset-bottom,0px))}.library-panel{display:none;padding:28px 23px;border:0;min-height:calc(100dvh - 155px)}body[data-mobile-view=library] .library-panel{display:flex}body[data-mobile-view=library] .player-panel{display:none}.player-panel{padding:24px 23px 20px}.player-heading h2{font-size:23px;line-height:1.4;margin:9px 0 22px}.player-heading .eyebrow{font-size:7px;letter-spacing:1.5px}.edition{display:block;font-size:6px}.mobile-break{display:none}.player-options{margin-bottom:20px}.mode-switch{gap:18px}.mode-switch button{font-size:8px;letter-spacing:1px}.deck-stage{padding:0 0 12px}.deck{padding:26px 25px 21px;max-width:440px;aspect-ratio:1.12;border-radius:20px}.deck-body{gap:18px;padding-top:17px}.deck-name{font-size:15px}.deck-model{font-size:6px}.transport{width:43px;padding:10px 3px 7px;gap:8px}.transport-key{width:31px;min-height:35px;max-height:40px}.deck-wordmark{font-size:28px}.deck-wordmark>span{font-size:24px}.tape-window{max-height:40px}.reel{width:33px;height:33px}.reel-hub{width:24px;height:24px}.tape-label>span{font-size:7px}.now-playing{margin-top:24px}.now-title{gap:8px}.status-label{font-size:6px;letter-spacing:.5px}#now-title{font-size:10px}.under-player{margin-top:14px}.under-player>span{display:block;font-size:5px;letter-spacing:.6px}.player-bottom{padding-top:29px}.player-bottom>span{font-size:5px;letter-spacing:.5px}.player-bottom button{font-size:8px}.mobile-nav{display:flex;position:fixed;bottom:0;inset-inline:0;height:calc(62px + env(safe-area-inset-bottom,0px));padding:7px 20px calc(7px + env(safe-area-inset-bottom,0px));background:#1d201ef2;backdrop-filter:blur(18px);border-top:1px solid var(--line);z-index:15;justify-content:space-around}.mobile-nav button{display:flex;flex-direction:column;gap:5px;align-items:center;justify-content:center;font-size:9px;color:#959c8e;min-width:70px;position:relative}.mobile-nav button.active{color:var(--orange)}.mobile-nav svg{width:18px;height:18px}.mobile-nav #mobile-count{position:absolute;top:2px;right:10px;font:7px monospace;background:#39482e;color:#cbd8b9;padding:1px 4px;border-radius:4px}.track-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 18px}.track-info strong{font-size:13px}.track-info small{font-size:10px}.jacket-copy strong{font-size:22px}.jacket-copy>span{font-size:6px}.jacket-copy small{font-size:8px}.empty-library{padding:65px 0}.library-bottom{margin-top:35px}.skin-grid{gap:10px}.modal{padding:23px 19px;max-height:calc(100dvh - 42px)}.modal-heading h2{font-size:21px}.modal-heading .eyebrow{font-size:7px}.skin-option{padding:3px}.skin-preview:after{font-size:7px}.skin-preview:before{font-size:12px}.skin-option>span{font-size:9px}.editor-layout{grid-template-columns:1fr}.editor-preview{max-width:250px;margin:auto}.cover-actions{max-width:280px;margin:15px auto 0}.cover-actions+.hint{text-align:center}.editor-fields{gap:16px}.editor-fields input[type=text],.editor-fields select{font-size:16px}.file-select{font-size:12px}.editor-preview .jacket-copy strong{font-size:30px}.modal-bottom{gap:10px}.modal-bottom button{font-size:10px;padding:11px}.modal-bottom .primary-button span{margin-left:6px}.toast{bottom:90px}.single-art{max-width:280px}.single-info{margin-top:20px}.single-info h3{font-size:20px}.single-controls{gap:30px}}
@media(max-width:359px){.topbar{padding-inline:17px}.player-panel{padding-inline:17px}.player-heading h2{font-size:21px}.deck{padding:22px 19px 18px}.deck-body{gap:10px}.deck-model{font-size:5px}.transport{width:36px}.transport-key{width:26px;min-height:29px}.cassette{padding:7px}.tape-window{padding:2px 5px}.reel{width:26px;height:26px}.reel-hub{width:21px;height:21px;border-width:4px}.tape-bridge{width:23px;margin-inline:4px}.stereo-mark{font-size:17px}.tape-bottom{font-size:2.5px}.door-empty button{font-size:10px}.local-tag{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
/* Let the shell include its printed footer at every viewport width. */
.deck{aspect-ratio:auto}.deck-name,.deck-footer{flex-shrink:0}
.track-open{touch-action:pan-y}.touch-tape-ghost{position:fixed;width:110px;height:110px;pointer-events:none;z-index:90;opacity:.9;transform:rotate(-7deg);border-radius:6px;overflow:hidden;box-shadow:0 12px 25px #0008}
/* A wide phone or unfolded screen keeps the collection and deck side by side. */
@media(orientation:landscape) and (min-width:600px) and (max-height:600px){
  .topbar{height:45px;padding:0 20px}.brand{font-size:17px}.brand-mark{width:26px;height:26px;font-size:20px}.brand small{font-size:5px;margin-top:3px}.top-actions .icon-button{width:24px;height:24px}.local-tag{font-size:6px}.workspace{display:grid;grid-template-columns:minmax(230px,40%) minmax(0,1fr);height:calc(100dvh - 45px);min-height:0;padding:0;overflow:hidden}.library-panel,body[data-mobile-view=library] .library-panel{display:flex;border-right:1px solid var(--line);padding:15px 20px;min-height:0;overflow:auto}.player-panel,body[data-mobile-view=library] .player-panel{display:flex;padding:12px 20px 9px;min-height:0;overflow:hidden}.player-heading,.player-bottom,.under-player,.mobile-nav{display:none}.section-heading h1{font-size:18px;margin:7px 0 13px}.section-heading .eyebrow{font-size:6px}.section-heading .icon-button{width:27px;height:27px}.create-single{padding:10px;font-size:10px}.create-single small{font-size:8px}.create-single>svg{width:15px}.library-toolbar{margin:16px 0 12px}.track-list{gap:13px 12px;grid-template-columns:repeat(2,minmax(0,1fr))}.track-info{margin-top:7px}.track-info strong{font-size:10px}.track-info small{font-size:8px}.library-bottom{padding-top:13px;margin-top:auto}.library-bottom p{font-size:7px}.empty-library{padding:26px 0}.empty-tape{margin-bottom:12px;width:70px;height:45px}.empty-library h2{font-size:11px}.empty-library p{font-size:9px}.player-options{margin-bottom:9px;flex-shrink:0}.mode-switch button{font-size:7px}.skin-trigger{font-size:9px}.deck-stage{flex:1;min-height:0;padding:0 0 6px;align-items:stretch}.deck{max-width:420px;height:100%;padding:13px 18px 12px;border-radius:16px;border-width:4px}.deck-name{font-size:12px;height:15px}.deck-model{font-size:4px}.deck-body{min-height:0;flex:1;gap:12px;padding-top:8px}.cassette-door{aspect-ratio:auto;height:100%;min-width:0;border-radius:9px}.transport{width:33px;gap:4px;padding:7px 3px 5px}.transport-key{width:25px;min-height:21px;max-height:33px;padding:2px;border-radius:4px}.transport-key svg{width:15px;height:15px}.transport-caption{font-size:3px}.power-led{width:4px;height:4px;margin-bottom:0}.deck-footer{height:38px;padding-top:9px;min-height:38px}.deck-wordmark{font-size:18px;letter-spacing:-1px}.deck-wordmark>span{font-size:17px;margin-left:15px;letter-spacing:-.8px}.stereo-mark{font-size:15px}.stereo-mark small{font-size:3px}.cassette{max-width:300px;width:90%;max-height:90%;padding:6px 9px 0}.tape-header b{font-size:9px}.tape-header>span{font-size:4px}.tape-label{padding:3px 0 2px;margin-top:3px}.tape-label>span{font-size:6px}.tape-label small{font-size:3px}.tape-window{min-height:23px;max-height:36px;padding:2px 6px;margin-top:3px}.reel{height:28px;width:28px}.reel-hub{height:20px;width:20px;border-width:4px}.reel-hub:after{inset:4px}.tape-bridge{width:25px;height:8px;margin:0 6px}.tape-bottom{font-size:3px;margin-top:3px}.tape-trapezoid{height:6px;margin-top:3px}.now-playing{margin-top:8px;flex-shrink:0}.status-label{font-size:5px}#now-title{font-size:9px}#seek{margin:10px 0 7px}.time-row{font-size:8px}.volume-control{display:none}.single-stage{display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;justify-content:space-around;flex:1;min-height:0;gap:6px;margin:0 auto}.single-art{height:calc(100% - 50px);max-height:200px;width:auto;max-width:50%;margin:0;aspect-ratio:1}.single-info{flex:1;min-width:100px;margin:0 0 0 10px}.single-info h3{font-size:16px;line-height:1.4}.single-info p{font-size:10px}.single-info .eyebrow{font-size:5px}.single-info>.icon-button{width:25px;height:25px;border:0}.single-controls{width:100%;gap:25px}.single-play{width:34px;height:34px}.single-controls .icon-button{width:25px;height:25px}.single-controls svg{width:16px;height:16px}.toast{bottom:15px}.jacket-copy strong{font-size:19px}.jacket-copy>span{font-size:5px}.jacket-copy small{font-size:6px}.single-art .jacket-copy strong{font-size:25px}
}
@media(horizontal-viewport-segments:2){.workspace{grid-template-columns:env(viewport-segment-width 0 0) env(viewport-segment-width 1 0);column-gap:calc(env(viewport-segment-left 1 0) - env(viewport-segment-right 0 0))}.topbar{max-width:none}.library-panel{padding-right:25px}.player-panel{padding-left:25px}}

/* Folded cover: only the physical player remains visible. */
.unfold-button,.cover-now{display:none}.fold-toggle{display:flex;align-items:center;gap:7px;font-size:10px;color:#c9cbbf;border:1px solid #6a705c;padding:8px 12px;border-radius:5px}.fold-toggle svg{width:13px;height:13px}.insert-guide{font-size:10px;line-height:1.7;color:#9a9f8e;margin:0 0 18px}
body[data-device-view=outer]{overflow:hidden;background:#0a0d0d}
body[data-device-view=outer] .topbar,body[data-device-view=outer] .library-panel,body[data-device-view=outer] .player-heading,body[data-device-view=outer] .player-options,body[data-device-view=outer] .now-playing,body[data-device-view=outer] .under-player,body[data-device-view=outer] .player-bottom,body[data-device-view=outer] .mobile-nav,body[data-device-view=outer] .single-stage{display:none!important}
body[data-device-view=outer] .workspace{display:block;width:min(440px,100%);height:100dvh;min-height:0;margin:0 auto;padding:0;overflow:hidden}
body[data-device-view=outer] .player-panel{display:block!important;padding:0;height:100%;overflow:hidden}
body[data-device-view=outer] .deck-stage{display:flex!important;height:100%;width:100%;padding:0;align-items:stretch}
body[data-device-view=outer] .deck{max-width:none;width:100%;height:100%;padding:28px 27px 25px;border-radius:24px;border-width:5px;box-shadow:inset 0 0 0 2px #ffffff5c}
body[data-device-view=outer] .deck-name{font-size:20px;letter-spacing:-1px;flex:0 0 26px;align-items:center}
body[data-device-view=outer] .deck-model{display:none}
body[data-device-view=outer] .unfold-button{position:absolute;right:21px;top:26px;display:flex;align-items:center;gap:5px;font-size:10px;z-index:12;color:var(--shell-ink);border:1px solid currentColor;border-radius:4px;padding:6px 8px}
body[data-device-view=outer] .unfold-button svg{width:12px;height:12px}
body[data-device-view=outer] .deck-body{position:static;flex:0 0 34%;height:34%;min-height:0;padding:0;margin-top:7vh;display:block}
body[data-device-view=outer] .cassette-door{height:100%;width:calc(100% - 62px);aspect-ratio:auto;border-radius:13px;min-width:0;perspective:600px}
body[data-device-view=outer] .cassette{width:92%;max-height:90%;padding:10px 10px 0;justify-content:space-between}
body[data-device-view=outer] .transport{position:absolute;top:94px;bottom:32px;right:18px;width:49px;gap:17px;padding:17px 6px;z-index:3;border-radius:25px}
body[data-device-view=outer] .transport-key{width:34px;min-height:43px;max-height:67px;border-radius:8px}
body[data-device-view=outer] .transport-key svg{width:23px;height:23px}
body[data-device-view=outer] .transport-key span{font-size:6px;right:4px;bottom:4px}
body[data-device-view=outer] .power-led{width:6px;height:6px;margin:0 0 7px}
body[data-device-view=outer] .transport-caption{font-size:4px;margin-top:auto;margin-bottom:5px}
body[data-device-view=outer] .deck-footer{margin-top:auto;margin-bottom:105px;padding-right:58px;display:block;flex-shrink:0}
body[data-device-view=outer] .deck-wordmark{font-size:62px;line-height:.8;letter-spacing:-4px}
body[data-device-view=outer] .deck-wordmark>span{font-size:47px;letter-spacing:-3px;margin-left:25px;margin-top:4px;-webkit-text-stroke:1px var(--shell-ink)}
body[data-device-view=outer] .stereo-mark{display:block;width:max-content;font-size:21px;margin-top:24px}
body[data-device-view=outer] .stereo-mark small{font-size:6px;letter-spacing:.8px}
body[data-device-view=outer] .cover-now{display:block;position:absolute;bottom:28px;left:29px;right:89px;z-index:4;color:var(--shell-ink);border-top:1px solid currentColor;padding-top:12px;opacity:.85}
.cover-now-title{display:block;font-size:11px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:8px}.cover-now>div{display:flex;align-items:center;gap:6px;font:7px monospace;letter-spacing:.7px}#cover-time{margin-left:auto}.cover-status-light{width:5px;height:5px;background:#202c22;border-radius:50%}.playing .cover-status-light{background:#45b465;box-shadow:0 0 6px #349f41}

/* Opened interior: album sleeves on the left, an open cassette door on the right. */
body[data-device-view=inner]{overflow:hidden}
body[data-device-view=inner] .topbar{height:62px;padding:0 28px;border:0}
body[data-device-view=inner] .brand{font-size:20px}.brand .brand-mark{flex-shrink:0}
body[data-device-view=inner] .brand-mark{width:30px;height:30px;font-size:22px}
body[data-device-view=inner] .brand small{font-size:6px}
body[data-device-view=inner] .workspace{position:relative;display:grid;grid-template-columns:42% minmax(0,1fr);height:calc(100dvh - 74px);min-height:0;padding:0;margin:0 auto 12px;border:5px solid #0a0c0d;border-radius:24px;overflow:hidden;box-shadow:0 1px 0 #6c7160}
body[data-device-view=inner] .workspace:before{content:'';position:absolute;left:calc(42% - 5px);top:0;bottom:0;width:10px;z-index:8;background:linear-gradient(90deg,#151b16,#555b42,#090e0b,#353b2a,#151b16);pointer-events:none}
body[data-device-view=inner] .library-panel{display:flex!important;min-height:0;overflow-y:auto;padding:27px 26px;background:linear-gradient(110deg,#dfc04d,#c7aa36);color:#2d3228;border-right:0}
body[data-device-view=inner] .library-panel .eyebrow,body[data-device-view=inner] .library-panel #library-caption{color:#5c602e}
body[data-device-view=inner] .section-heading h1{font-size:25px;margin:10px 0 22px}
body[data-device-view=inner] .section-heading h1 span{color:#66582a}
body[data-device-view=inner] .icon-button.light{background:#2a3323;color:#e6dfc4;border-color:#2a3323}
body[data-device-view=inner] .create-single{background:#fff2cb44;border-color:#83703566}
body[data-device-view=inner] .create-single>svg:first-child,body[data-device-view=inner] .create-single>svg:last-child{color:#65572e}
body[data-device-view=inner] .create-single small{color:#69632d}
body[data-device-view=inner] .library-toolbar{margin:24px 0 8px}
body[data-device-view=inner] .mini-tabs button{color:#777133}
body[data-device-view=inner] .mini-tabs button.active{color:#2d3228;border-color:#2d3228}
body[data-device-view=inner] .insert-guide{color:#6b632b}
body[data-device-view=inner] .track-list{gap:25px 18px;perspective:900px}
body[data-device-view=inner] .track-open{transition:transform .22s;position:relative}
body[data-device-view=inner] .track-open:hover{transform:translateY(-5px) rotate(-2deg)}
body[data-device-view=inner] .track-cover{border-radius:2px;border:4px solid #ecddaf;box-shadow:3px 4px 0 #ae8a2a,7px 10px 12px #5b4d2840;overflow:hidden}
body[data-device-view=inner] .track-card.selected .track-cover{outline:2px solid #34422c}
body[data-device-view=inner] .track-info small,body[data-device-view=inner] .track-menu{color:#69622b}
body[data-device-view=inner] .track-menu-panel{background:#eee0b4;color:#303829;border-color:#857743}
body[data-device-view=inner] .track-menu-panel .danger{color:#ac3228}
body[data-device-view=inner] .library-bottom p{color:#5a602c}
body[data-device-view=inner] .library-bottom p span{color:#7b7438}
body[data-device-view=inner] .library-bottom .device-dot{background:#445e37}
body[data-device-view=inner] .empty-library p{color:#6c682e}
body[data-device-view=inner] .empty-library .text-button{color:#303e27}
body[data-device-view=inner] .player-panel{display:flex!important;min-height:0;padding:22px 30px 18px;background:#15191a;overflow:hidden}
body[data-device-view=inner] .player-heading,body[data-device-view=inner] .player-bottom,body[data-device-view=inner] .mobile-nav{display:none!important}
body[data-device-view=inner] .player-options{margin-bottom:16px;flex-shrink:0}
body[data-device-view=inner] .deck-stage{flex:1;min-height:0;padding:0 3px 9px;align-items:stretch}
body[data-device-view=inner] .deck{height:100%;max-width:520px;padding:21px 23px 19px;min-height:0}
body[data-device-view=inner] .deck-body{min-height:0;padding-top:13px;flex:1}
body[data-device-view=inner] .cassette-door{height:100%;aspect-ratio:auto;min-width:0;perspective:700px;overflow:visible}
body[data-device-view=inner] .cassette{max-height:85%;justify-content:space-between}
body[data-device-view=inner] .transport{gap:9px;width:43px;padding:12px 4px}
body[data-device-view=inner] .transport-key{width:31px;min-height:28px;max-height:65px}
body[data-device-view=inner] .deck-footer{flex:0 0 64px;padding-top:15px}
body[data-device-view=inner] .glass{transition:transform .45s cubic-bezier(.2,.6,.2,1),opacity .45s;transform-origin:left center;z-index:6;background:linear-gradient(125deg,#ffffff36,transparent 38%,#ffffff08);border:2px solid #7e908077;box-shadow:inset 0 0 0 4px #0003}
body[data-device-view=inner].door-open .glass{transform:perspective(500px) rotateY(-65deg) translateX(-10px);opacity:.75}
body[data-device-view=inner].door-open .cassette-door{box-shadow:inset 0 0 18px #000,0 0 12px #d2b95433}
body[data-device-view=inner] .now-playing{flex-shrink:0;margin-top:15px}
body[data-device-view=inner] .under-player{display:flex;margin-top:13px;gap:12px;flex-shrink:0}
body[data-device-view=inner] .under-player>span{display:block;font-size:8px;letter-spacing:0;line-height:1.5;color:#b6bba4;text-align:right}
body[data-device-view=inner] .single-stage{flex:1;min-height:0;overflow:auto}
.insertion-ghost{position:fixed!important;z-index:95;pointer-events:none;margin:0!important;max-height:none!important;aspect-ratio:auto!important;box-shadow:0 20px 30px #0008}
.inserting .track-card.selected .track-open{transform:rotate(-4deg) translateY(-8px)}
@media(max-height:600px){
 body[data-device-view=inner] .topbar{height:43px;padding-inline:20px}body[data-device-view=inner] .brand{font-size:17px}body[data-device-view=inner] .brand small{display:none}body[data-device-view=inner] .top-actions{gap:12px}body[data-device-view=inner] .top-actions>.local-tag{display:none}body[data-device-view=inner] .fold-toggle{font-size:9px;padding:6px 9px}body[data-device-view=inner] .workspace{height:calc(100dvh - 49px);margin-bottom:6px;border-radius:18px;border-width:4px}body[data-device-view=inner] .library-panel{padding:14px 19px}body[data-device-view=inner] .section-heading h1{font-size:20px;margin:7px 0 12px}body[data-device-view=inner] .library-toolbar{margin-top:14px}body[data-device-view=inner] .insert-guide{font-size:8px;margin-bottom:12px}body[data-device-view=inner] .player-panel{padding:12px 17px 9px}body[data-device-view=inner] .player-options{margin-bottom:8px}body[data-device-view=inner] .deck{padding:12px 15px 10px;border-radius:15px}body[data-device-view=inner] .deck-name{font-size:11px;height:14px}body[data-device-view=inner] .deck-body{padding-top:7px;gap:11px}body[data-device-view=inner] .deck-footer{flex-basis:35px;padding-top:8px}body[data-device-view=inner] .transport{width:31px;gap:4px;padding:6px 2px}body[data-device-view=inner] .transport-key{width:24px;min-height:21px;max-height:31px;border-radius:4px}body[data-device-view=inner] .transport-key svg{width:15px;height:15px}body[data-device-view=inner] .transport-caption{font-size:3px}body[data-device-view=inner] .now-playing{margin-top:7px}body[data-device-view=inner] #seek{margin:9px 0 6px}body[data-device-view=inner] .under-player{margin-top:5px}body[data-device-view=inner] .under-player button{font-size:8px}body[data-device-view=inner] .under-player>span{font-size:7px}body[data-device-view=outer] .deck-body{margin-top:3vh;flex-basis:40%;height:40%}body[data-device-view=outer] .deck-footer{margin-bottom:60px}body[data-device-view=outer] .deck-wordmark{font-size:38px}body[data-device-view=outer] .deck-wordmark>span{font-size:30px}body[data-device-view=outer] .stereo-mark{display:none}body[data-device-view=outer] .transport{top:75px;gap:7px;bottom:20px}body[data-device-view=outer] .transport-key{min-height:28px;max-height:40px}body[data-device-view=outer] .cover-now{bottom:18px;padding-top:8px}
}
@media(max-width:619px){body[data-device-view=inner] .workspace{grid-template-columns:45% minmax(0,1fr)}body[data-device-view=inner] .workspace:before{left:calc(45% - 4px);width:8px}body[data-device-view=inner] .topbar{padding:0 13px;height:52px}body[data-device-view=inner] .brand{font-size:15px;gap:6px}body[data-device-view=inner] .brand small,body[data-device-view=inner] .local-tag{display:none}body[data-device-view=inner] .top-actions{gap:8px}body[data-device-view=inner] .top-actions .icon-button{width:23px;height:23px}body[data-device-view=inner] .fold-toggle{font-size:8px;padding:6px}body[data-device-view=inner] .fold-toggle svg{display:none}body[data-device-view=inner] .workspace{height:calc(100dvh - 58px);margin-bottom:6px;border-radius:15px;border-width:3px}body[data-device-view=inner] .library-panel{padding:17px 10px}body[data-device-view=inner] .section-heading h1{font-size:17px;margin:7px 0 16px}body[data-device-view=inner] .section-heading .eyebrow{font-size:5px;letter-spacing:1px}body[data-device-view=inner] .section-heading .icon-button{width:24px;height:24px}body[data-device-view=inner] .section-heading h1 span{margin-left:4px;font-size:8px}body[data-device-view=inner] .create-single{padding:9px 7px;gap:6px}body[data-device-view=inner] .create-single span{font-size:9px}body[data-device-view=inner] .create-single small,body[data-device-view=inner] .create-single>svg:last-child{display:none}body[data-device-view=inner] .create-single>svg:first-child{width:14px}body[data-device-view=inner] #library-caption{display:none}body[data-device-view=inner] .track-list{grid-template-columns:1fr;gap:18px}body[data-device-view=inner] .track-info strong{font-size:10px}body[data-device-view=inner] .track-info small{font-size:8px}body[data-device-view=inner] .library-bottom{display:none}body[data-device-view=inner] .player-panel{padding:17px 8px 12px}body[data-device-view=inner] .mode-switch{gap:7px}body[data-device-view=inner] .mode-switch button{font-size:5px;letter-spacing:0}body[data-device-view=inner] .skin-trigger{font-size:7px;gap:3px}body[data-device-view=inner] .skin-trigger svg{width:11px}body[data-device-view=inner] .deck{padding:13px 8px 10px;border-width:3px;border-radius:13px}body[data-device-view=inner] .deck-name{font-size:10px}body[data-device-view=inner] .deck-model{display:none}body[data-device-view=inner] .deck-body{gap:5px}body[data-device-view=inner] .transport{width:24px;gap:10px;padding:9px 2px}body[data-device-view=inner] .transport-key{width:18px;min-height:28px;max-height:55px;border-radius:4px}body[data-device-view=inner] .transport-key svg{width:12px}body[data-device-view=inner] .transport-key span{font-size:3px}body[data-device-view=inner] .transport-caption{display:none}body[data-device-view=inner] .deck-wordmark{font-size:17px;letter-spacing:-1px}body[data-device-view=inner] .deck-wordmark>span{font-size:15px;margin-left:10px;letter-spacing:-1px}body[data-device-view=inner] .stereo-mark{display:none}body[data-device-view=inner] .cassette{padding:6px 4px 0;border-radius:4px}body[data-device-view=inner] .tape-header b{font-size:6px}body[data-device-view=inner] .tape-header>span{font-size:2px}body[data-device-view=inner] .tape-label>span{font-size:4px}body[data-device-view=inner] .tape-label small{font-size:2px}body[data-device-view=inner] .tape-window{padding:2px;min-height:17px}body[data-device-view=inner] .reel{width:17px;height:17px}body[data-device-view=inner] .reel-hub{width:13px;height:13px;border-width:2px}body[data-device-view=inner] .reel-hub:after{inset:3px}body[data-device-view=inner] .tape-bridge{width:13px;height:5px;margin:0 3px}body[data-device-view=inner] .tape-bottom{font-size:2px;letter-spacing:0}body[data-device-view=inner] .tape-trapezoid{height:4px;margin-inline:12px}body[data-device-view=inner] .tape-screw{font-size:4px}body[data-device-view=inner] .now-title{display:block}body[data-device-view=inner] #now-title{display:block;margin-top:4px;font-size:8px}body[data-device-view=inner] .under-player{display:block}body[data-device-view=inner] .under-player>span{text-align:left;margin-top:5px;font-size:7px}body[data-device-view=inner] .door-empty button{padding:5px;font-size:7px;gap:3px}body[data-device-view=inner] .door-empty>span{font-size:4px;letter-spacing:0}body[data-device-view=inner] .door-empty svg{display:none}body[data-device-view=inner] .single-stage{overflow:auto}body[data-device-view=inner] .single-info h3{font-size:14px}}

/* Reference interior: a large sleeve carousel and the exposed, vertical tape bay. */
body[data-device-view=inner] .topbar{position:fixed;top:14px;right:17px;left:auto;width:auto;height:auto;padding:0;z-index:12;background:none}
body[data-device-view=inner] .topbar .brand,body[data-device-view=inner] .topbar .local-tag,body[data-device-view=inner] #help-button{display:none}
body[data-device-view=inner] .fold-toggle{font:8px monospace;border-color:#ffffff30;background:#202527ba;padding:7px 8px}
body[data-device-view=inner] .workspace{height:100dvh;margin:0;max-width:none;border-radius:22px;grid-template-columns:49% minmax(0,1fr)}
body[data-device-view=inner] .workspace:before{left:calc(49% - 5px);background:linear-gradient(90deg,#e0ba2d,#f7d84c,#4a3d1b,#1a1d22)}
body[data-device-view=inner] .library-panel{padding:25px 23px 16px;background:linear-gradient(105deg,#edcc3a,#e2bc23);overflow:hidden;position:relative}
body[data-device-view=inner] .library-panel:before,body[data-device-view=inner] .library-panel:after{content:'';position:absolute;right:-1px;width:10px;height:13%;background:linear-gradient(90deg,#ffdf50,#b99118);border:1px solid #d2b92d;border-radius:3px 0 0 3px;box-shadow:-2px 1px 2px #8b681e44;z-index:4}
body[data-device-view=inner] .library-panel:before{top:26%}body[data-device-view=inner] .library-panel:after{top:64%}
body[data-device-view=inner] .section-heading{order:0;flex-shrink:0}body[data-device-view=inner] .section-heading h1{margin:7px 0 9px;font-size:23px}body[data-device-view=inner] .section-heading .eyebrow{font-size:7px}
body[data-device-view=inner] .library-toolbar{order:1;margin:7px 0 0;flex-shrink:0}body[data-device-view=inner] #library-caption{display:none}
body[data-device-view=inner] .insert-guide{order:4;flex-shrink:0;margin:8px 0;font-size:9px}
body[data-device-view=inner] .track-list{order:2;flex:1;min-height:0;display:flex;gap:23px;overflow-x:auto;overflow-y:hidden;align-items:center;scroll-snap-type:x mandatory;padding:15px 13px 15px 4px;scrollbar-width:thin;scrollbar-color:#9c852d44 transparent}
body[data-device-view=inner] .track-card{flex:0 0 var(--album-width,180px);width:var(--album-width,180px);scroll-snap-align:center}
body[data-device-view=inner] .track-cover{aspect-ratio:.7;box-shadow:4px 5px 0 #c3a031,9px 13px 15px #825c2540;border:5px solid #f4e3b4}
body[data-device-view=inner] .track-cover .jacket{height:100%}body[data-device-view=inner] .track-info{margin-top:10px}
body[data-device-view=inner] .track-card .jacket-copy strong{font-size:clamp(16px,2.6vw,34px)}
body[data-device-view=inner] .create-single{order:5;padding:9px 10px;flex-shrink:0;max-width:300px;margin-top:3px;background:#f5de7955}
body[data-device-view=inner] .create-single small{display:none}body[data-device-view=inner] .create-single span{font-size:10px}
body[data-device-view=inner] .library-bottom{order:6;flex-shrink:0;padding-top:4px;margin-top:0}body[data-device-view=inner] .library-bottom p{font-size:7px;line-height:1.6}
body[data-device-view=inner] .empty-library{order:2;flex:1;min-height:0;padding:25px 0}
body[data-device-view=inner] .player-panel{padding:42px 12px 12px 14px;background:repeating-linear-gradient(0deg,#1a1c22 0 2px,#1b1e23 2px 4px)}
body[data-device-view=inner] .player-options{margin:0 6px 9px;max-width:none;flex-shrink:0}body[data-device-view=inner] .mode-switch{gap:10px}body[data-device-view=inner] .mode-switch button{font-size:6px;letter-spacing:.6px}
body[data-device-view=inner] .skin-trigger{font-size:8px}
body[data-device-view=inner] .deck-stage{padding:0;flex:1;min-height:0}
body[data-device-view=inner] .deck{position:relative;max-width:none;padding:10px 7px 10px 10px;border:1px solid #5e6467;border-radius:9px;background:repeating-linear-gradient(90deg,#1d2025 0 3px,#24262b 3px 4px);box-shadow:inset 0 0 15px #0006;color:#ddd}
body[data-device-view=inner] .deck:after{box-shadow:inset 1px 0 0 #ffffff1a;border-radius:7px}
body[data-device-view=inner] .deck-name,body[data-device-view=inner] .deck-footer,body[data-device-view=inner] .deck>.silver-band,body[data-device-view=inner] .deck>.clear-mechanism{display:none}
body[data-device-view=inner] .deck>.shell-texture{opacity:.12}
body[data-device-view=inner] .deck-body{padding:0;gap:9px;width:100%;height:100%;min-height:0;flex:1;align-items:stretch}
body[data-device-view=inner] .cassette-door{height:100%;width:100%;aspect-ratio:auto;border:1px solid #60616a;border-radius:8px;background:linear-gradient(120deg,#282b3490,#090b1166);box-shadow:inset 0 0 16px #0009;overflow:hidden}
body[data-device-view=inner] .glass{border:1px solid #8d8b9888;box-shadow:inset 0 0 0 4px #aaa4c00a;z-index:6;border-radius:7px}
body[data-device-view=inner] .transport{border:0;border-left:1px solid #75777c44;border-radius:0 5px 5px 0;background:linear-gradient(90deg,#1d1f24,#282b31);width:39px;padding:20px 5px;gap:15px;box-shadow:none;align-items:center;justify-content:flex-start}
body[data-device-view=inner] .transport-key{flex:0 0 31px;min-height:31px;max-height:31px;width:28px;border-radius:8px;background:linear-gradient(#4c4e55,#292c33);box-shadow:0 2px 3px #0007;border-color:#7e808622}
body[data-device-view=inner] .play-key{background:linear-gradient(#707077,#383b43)}
body[data-device-view=inner] .transport-caption{margin-top:auto;color:#7d7f86}
body[data-device-view=inner] .deck .screw{width:5px;height:5px;background:#a9aab1;z-index:8}
body[data-device-view=inner] .now-playing{margin:10px 5px 0;width:calc(100% - 10px)}
body[data-device-view=inner] .under-player{margin:7px 5px 0;width:calc(100% - 10px)}
body[data-device-view=inner] .deck .cassette,body[data-device-view=outer] .deck .cassette{width:var(--tape-length,240px);height:var(--tape-height,152px);max-height:none;max-width:none;aspect-ratio:auto;flex:none;transform:rotate(90deg);padding:12px 15px 0;justify-content:space-between;background:linear-gradient(120deg,#b697a533,#18191e33),#513749}
.cassette .tape-header b{font:700 13px monospace}.cassette .tape-header>span{font:6px monospace}.cassette .tape-label{margin:5px 0 0;padding:6px 0 3px}.cassette .tape-label>span{font:700 10px monospace}.cassette .tape-label small{font:5px monospace;letter-spacing:.8px}.cassette .tape-window{max-height:44px;min-height:28px;padding:3px 8px}.cassette .reel{width:39px;height:39px}.cassette .reel-hub{width:26px;height:26px;border-width:5px}.cassette .tape-bridge{width:35px;height:12px;margin:0 9px}.cassette .tape-bottom{font:5px monospace;letter-spacing:.5px;margin-top:5px}.cassette .tape-trapezoid{height:10px;margin:4px 25px 0}.cassette .tape-screw{font-size:7px}
.insertion-ghost{max-width:none!important}
.cover-skin-button{display:none}
body[data-device-view=outer] .cover-skin-button{display:grid;position:absolute;top:26px;right:100px;width:28px;height:28px;color:var(--shell-ink);border:1px solid currentColor;z-index:13;opacity:.8}
body[data-device-view=outer] .cover-skin-button svg{width:15px;height:15px}

/* Each outside skin owns its shape, window, hardware and print layout. */
body[data-device-view=outer] .deck[data-skin=sunshine] .deck-body{height:29%;flex-basis:29%}
body[data-device-view=outer] .deck[data-skin=sunshine] .cassette-door{height:82%;width:calc(100% - 68px);border-radius:13px}
body[data-device-view=outer] .deck[data-skin=sunshine] .deck-footer{margin-bottom:120px}
body[data-device-view=outer] .deck[data-skin=midnight]{border-radius:38px;background:linear-gradient(145deg,#1a286c,#172554 38%,#0e1639);box-shadow:inset 0 0 0 3px #7084b651}
body[data-device-view=outer] .deck[data-skin=midnight] .deck-name{position:absolute;top:auto;bottom:105px;right:21px;writing-mode:vertical-rl;font-size:22px;letter-spacing:2px;opacity:.8}
body[data-device-view=outer] .deck[data-skin=midnight] .deck-body{position:absolute;top:190px;bottom:135px;left:27px;right:69px;width:auto;height:auto;margin:0;display:block}
body[data-device-view=outer] .deck[data-skin=midnight] .cassette-door{width:100%;height:100%;border:2px solid #707eab88;border-radius:10px;background:linear-gradient(130deg,#31427677,#0a1037);box-shadow:inset 0 0 25px #0007,0 0 0 7px #415b8b26}
body[data-device-view=outer] .deck[data-skin=midnight] .transport{top:89px;left:26px;right:26px;bottom:auto;width:auto;height:67px;flex-direction:row;gap:10px;padding:8px;background:transparent;border:0;box-shadow:none}
body[data-device-view=outer] .deck[data-skin=midnight] .transport-key{height:50px;width:auto;min-height:0;max-height:none;flex:1;background:linear-gradient(135deg,#8d8fa766,#363f6c);border:1px solid #9c9fca66;border-radius:15px;box-shadow:inset 0 1px 0 #ffffff35}
body[data-device-view=outer] .deck[data-skin=midnight] .play-key{background:linear-gradient(135deg,#ffd32c,#f28214);color:#fff}
body[data-device-view=outer] .deck[data-skin=midnight] .power-led,body[data-device-view=outer] .deck[data-skin=midnight] .transport-caption{display:none}
body[data-device-view=outer] .deck[data-skin=midnight] .deck-footer{position:absolute;left:29px;bottom:96px;margin:0;padding:0}
body[data-device-view=outer] .deck[data-skin=midnight] .deck-wordmark{font-size:24px;letter-spacing:1px;color:#a8b3da}.deck[data-skin=midnight] .deck-wordmark>span{display:none!important}
body[data-device-view=outer] .deck[data-skin=midnight] .stereo-mark{display:none}
body[data-device-view=outer] .deck[data-skin=clearWhite]{border-radius:44px;border:8px solid #b9c3b1;background:linear-gradient(125deg,#f5f7e1c9,#b8c6b4b3,#e3e8d4e6);box-shadow:inset 0 0 0 3px #ffffffb0,inset 0 0 30px #51726944}
body[data-device-view=outer] .deck[data-skin=clearWhite] .clear-mechanism{display:flex;inset:50px 10px 70px;gap:29px;opacity:.8;transform:rotate(-5deg);z-index:-1;align-items:center}
body[data-device-view=outer] .deck[data-skin=clearWhite] .clear-mechanism>span{width:45px;height:80%;background:repeating-linear-gradient(#899987 0 4px,#b2bdac55 4px 13px);border:2px solid #849280;border-radius:8px}
body[data-device-view=outer] .deck[data-skin=clearWhite] .clear-mechanism>i{position:absolute;width:120px;height:120px;border:17px solid #5e786799;border-radius:50%;left:5px;bottom:20px;box-shadow:0 0 0 6px #aeb8a3,0 0 0 8px #809481}
body[data-device-view=outer] .deck[data-skin=clearWhite] .deck-body{position:absolute;top:200px;bottom:205px;left:33px;right:31px;height:auto;margin:0}
body[data-device-view=outer] .deck[data-skin=clearWhite] .cassette-door{width:100%;height:100%;background:#82988246;border:3px solid #dbe1cb;border-radius:29px;box-shadow:inset 0 0 0 2px #6c887777,inset 0 0 15px #344f3733}
body[data-device-view=outer] .deck[data-skin=clearWhite] .transport{left:32px;right:32px;top:96px;bottom:auto;height:58px;width:auto;flex-direction:row;gap:10px;border:0;border-radius:9px;background:#bec8b188;box-shadow:0 3px 0 #81927f55;padding:6px}
body[data-device-view=outer] .deck[data-skin=clearWhite] .transport-key{width:auto;height:43px;min-height:0;max-height:none;flex:1;border-radius:7px 7px 4px 4px;background:linear-gradient(#4e9984,#23614f);box-shadow:0 5px 0 #245343}
body[data-device-view=outer] .deck[data-skin=clearWhite] .play-key{background:linear-gradient(#536bb6,#283b8c);box-shadow:0 5px 0 #293976}
body[data-device-view=outer] .deck[data-skin=clearWhite] .transport-key:last-of-type{background:linear-gradient(#d57059,#ab3e32);box-shadow:0 5px 0 #8b342a}
body[data-device-view=outer] .deck[data-skin=clearWhite] .power-led,body[data-device-view=outer] .deck[data-skin=clearWhite] .transport-caption{display:none}
body[data-device-view=outer] .deck[data-skin=clearWhite] .deck-footer{position:absolute;left:auto;right:30px;bottom:105px;margin:0;padding:15px;background:#d6ae46bd;transform:rotate(-3deg)}
body[data-device-view=outer] .deck[data-skin=clearWhite] .deck-wordmark{font-size:25px;letter-spacing:-1px;color:#625a31}body[data-device-view=outer] .deck[data-skin=clearWhite] .deck-wordmark>span,body[data-device-view=outer] .deck[data-skin=clearWhite] .stereo-mark{display:none}
body[data-device-view=outer] .deck[data-skin=silverBlue]{border-radius:7px;border:7px solid #354455;background:linear-gradient(110deg,#305e99,#224b80)}
body[data-device-view=outer] .deck[data-skin=silverBlue] .silver-band{display:block;height:24%;background:linear-gradient(110deg,#e5e7dd,#c0c3c0 55%,#e3e2d8);border-bottom:7px solid #28394a}
body[data-device-view=outer] .deck[data-skin=silverBlue] .deck-name{color:#353d44;position:absolute;top:35px;left:30px;font-size:22px;letter-spacing:2px}
body[data-device-view=outer] .deck[data-skin=silverBlue] .deck-body{position:absolute;top:35%;left:40px;right:39px;height:21%;margin:0;display:block}
body[data-device-view=outer] .deck[data-skin=silverBlue] .cassette-door{width:100%;height:100%;border:4px solid #4d5b5e;border-radius:3px;background:#16272b;box-shadow:0 0 0 2px #191d22}
body[data-device-view=outer] .deck[data-skin=silverBlue] .shell-texture:before,body[data-device-view=outer] .deck[data-skin=silverBlue] .shell-texture:after{content:'';position:absolute;top:30%;width:50px;height:120px;border-radius:50%;background:#ee951f;opacity:1}
body[data-device-view=outer] .deck[data-skin=silverBlue] .shell-texture:before{left:-30px}body[data-device-view=outer] .deck[data-skin=silverBlue] .shell-texture:after{right:-30px}
body[data-device-view=outer] .deck[data-skin=silverBlue] .transport{left:30px;right:30px;bottom:150px;top:auto;height:65px;width:auto;flex-direction:row;padding:7px;background:#c6c8c2;border-radius:3px;border:2px solid #808d90;gap:8px}
body[data-device-view=outer] .deck[data-skin=silverBlue] .transport-key{width:auto;flex:1;height:45px;min-height:0;max-height:none;border-radius:2px;background:linear-gradient(#f0efe4,#a0aaa5);color:#283b44;box-shadow:0 3px 1px #6a7776}
body[data-device-view=outer] .deck[data-skin=silverBlue] .play-key{background:linear-gradient(#ffbd4e,#dc7c1c)}
body[data-device-view=outer] .deck[data-skin=silverBlue] .power-led,body[data-device-view=outer] .deck[data-skin=silverBlue] .transport-caption{display:none}
body[data-device-view=outer] .deck[data-skin=silverBlue] .deck-footer{position:absolute;left:31px;bottom:94px;margin:0;padding:0}
body[data-device-view=outer] .deck[data-skin=silverBlue] .deck-wordmark{font-size:30px;letter-spacing:-1px;color:#e6e8dc}body[data-device-view=outer] .deck[data-skin=silverBlue] .deck-wordmark>span,body[data-device-view=outer] .deck[data-skin=silverBlue] .stereo-mark{display:none}
body[data-device-view=outer] .deck[data-skin=creamOrange]{border:11px solid #b7a386;border-radius:47px;background:linear-gradient(140deg,#eee1c2,#cbb895);box-shadow:inset 0 0 0 3px #f7edce,inset 0 0 15px #88724d55}
body[data-device-view=outer] .deck[data-skin=creamOrange] .deck-body{position:absolute;top:115px;left:27px;right:27px;height:27%;margin:0;display:block}
body[data-device-view=outer] .deck[data-skin=creamOrange] .cassette-door{width:100%;height:100%;border:6px solid #ac522d;border-radius:22px;background:#614c3d;box-shadow:0 0 0 3px #8b6d4c}
body[data-device-view=outer] .deck[data-skin=creamOrange] .shell-texture{opacity:1;background:none;inset:auto;left:24px;bottom:250px;width:150px;height:150px;border:5px solid #b79e77;border-radius:50%;background:radial-gradient(circle,#65553c 1px,transparent 1.8px) 0 0/6px 6px,#c6b48f;box-shadow:inset 0 0 0 6px #ceba94}
body[data-device-view=outer] .deck[data-skin=creamOrange] .clear-mechanism{display:block;position:absolute;left:auto;top:auto;right:34px;bottom:292px;width:68px;height:68px;inset-inline-start:auto;border-radius:50%;border:9px solid #b95a31;background:repeating-conic-gradient(#cd8b59 0 5deg,#f2d3a5 5deg 15deg);opacity:1;transform:none;z-index:1;box-shadow:0 4px 2px #71573755;pointer-events:none}
body[data-device-view=outer] .deck[data-skin=creamOrange] .clear-mechanism>*{display:none}
body[data-device-view=outer] .deck[data-skin=creamOrange] .transport{left:29px;right:29px;top:auto;bottom:160px;height:67px;width:auto;flex-direction:row;gap:9px;padding:7px;background:#bca17e;border-radius:11px;border:1px solid #947954;box-shadow:inset 0 2px 6px #6a573d55}
body[data-device-view=outer] .deck[data-skin=creamOrange] .transport-key{flex:1;width:auto;height:44px;min-height:0;max-height:none;border-radius:7px;background:linear-gradient(#e79453,#b75c32);box-shadow:0 4px 0 #89502e;border:1px solid #edb778}
body[data-device-view=outer] .deck[data-skin=creamOrange] .power-led,body[data-device-view=outer] .deck[data-skin=creamOrange] .transport-caption{display:none}
body[data-device-view=outer] .deck[data-skin=creamOrange] .deck-footer{position:absolute;left:33px;bottom:98px;margin:0;padding:0}
body[data-device-view=outer] .deck[data-skin=creamOrange] .deck-wordmark{font-size:27px;letter-spacing:1px;color:#7c492c}body[data-device-view=outer] .deck[data-skin=creamOrange] .deck-wordmark>span,body[data-device-view=outer] .deck[data-skin=creamOrange] .stereo-mark{display:none}
body[data-device-view=outer] .deck[data-skin=blackGold]{border-radius:8px;border:8px double #9b8657;background:repeating-linear-gradient(0deg,#202522 0 1px,#272c28 1px 3px);box-shadow:inset 0 0 0 2px #0d1411}
body[data-device-view=outer] .deck[data-skin=blackGold] .deck-name{font-size:19px;letter-spacing:3px;color:#cfba81}
body[data-device-view=outer] .deck[data-skin=blackGold] .deck-body{position:absolute;top:118px;left:28px;right:28px;height:31%;margin:0;display:block}
body[data-device-view=outer] .deck[data-skin=blackGold] .cassette-door{width:100%;height:100%;border:2px solid #a5915e;border-radius:2px;background:#111914;box-shadow:0 0 0 5px #0d1310}
body[data-device-view=outer] .deck[data-skin=blackGold] .transport{left:28px;right:28px;top:auto;bottom:224px;height:64px;width:auto;flex-direction:row;padding:8px;gap:8px;border:1px solid #817246;border-radius:0;background:#111a14;box-shadow:none}
body[data-device-view=outer] .deck[data-skin=blackGold] .transport-key{flex:1;height:43px;min-height:0;max-height:none;width:auto;border-radius:1px;background:linear-gradient(#b7a67c,#78663d);color:#131e16;border:1px solid #c8b582;box-shadow:0 4px 0 #3a321d}
body[data-device-view=outer] .deck[data-skin=blackGold] .power-led,body[data-device-view=outer] .deck[data-skin=blackGold] .transport-caption{display:none}
body[data-device-view=outer] .deck[data-skin=blackGold] .clear-mechanism{display:flex;position:absolute;inset:auto 29px 137px;gap:13px;height:60px;opacity:1;transform:none;z-index:1}
body[data-device-view=outer] .deck[data-skin=blackGold] .clear-mechanism>span{flex:1;width:auto;height:60px;border:4px solid #0e1611;border-radius:1px;background:repeating-linear-gradient(90deg,#766b401f 0 1px,transparent 1px 14px),linear-gradient(#eee4c5,#d4c393);position:relative;overflow:hidden}
body[data-device-view=outer] .deck[data-skin=blackGold] .clear-mechanism>span:before{content:'VU';position:absolute;bottom:6px;right:9px;color:#544b2c;font:8px monospace}
body[data-device-view=outer] .deck[data-skin=blackGold] .clear-mechanism>span:after{content:'';position:absolute;left:48%;bottom:-7px;width:2px;height:43px;background:#a43f25;transform:rotate(-24deg);transform-origin:bottom;animation:meter 1.4s ease-in-out infinite alternate;animation-play-state:paused}
body[data-device-view=outer].playing .deck[data-skin=blackGold] .clear-mechanism>span:after{animation-play-state:running}
body[data-device-view=outer] .deck[data-skin=blackGold] .clear-mechanism>i{display:none}
body[data-device-view=outer] .deck[data-skin=blackGold] .deck-footer{position:absolute;left:30px;bottom:99px;margin:0;padding:0}
body[data-device-view=outer] .deck[data-skin=blackGold] .deck-wordmark{font-size:24px;letter-spacing:1px;color:#ae9a64}body[data-device-view=outer] .deck[data-skin=blackGold] .deck-wordmark>span,body[data-device-view=outer] .deck[data-skin=blackGold] .stereo-mark{display:none}
@keyframes meter{0%{transform:rotate(-30deg)}40%{transform:rotate(15deg)}70%{transform:rotate(-8deg)}100%{transform:rotate(28deg)}}

/* Miniatures show the actual hardware arrangement, not six color swatches. */
.skin-preview{aspect-ratio:.85;padding:0;overflow:hidden}.skin-preview:before,.skin-preview:after{display:none}.preview-window{position:absolute;top:17%;left:9%;width:61%;height:35%;border:2px solid #575a50;background:#191e21;display:flex;flex-direction:column;align-items:center;justify-content:space-around;padding:7px;border-radius:6px}.preview-window i{width:9px;height:9px;border:3px dashed #8e8b87;background:#3b2d38;border-radius:50%}.preview-controls{position:absolute;right:7%;top:16%;bottom:7%;width:13%;display:flex;flex-direction:column;gap:5px;padding:5px 3px;background:#202526;border-radius:10px}.preview-controls i{flex:1;max-height:20px;background:#585e58;border-radius:3px}.preview-controls i:first-child{background:#d54832}.preview-brand{position:absolute;left:10%;bottom:20%;font:900 11px Arial;letter-spacing:-.7px;color:var(--shell-ink)}.preview-dial{display:none}.skin-detail{display:block;color:#a7ae9a;font-size:8px;font-weight:400;text-align:left;line-height:1.5;margin:4px 1px}.skin-option>span{font-size:10px}
.skin-option[data-skin=midnight] .skin-preview{border-radius:18px;background:linear-gradient(135deg,#23356c,#101b44)}.skin-option[data-skin=midnight] .preview-controls{left:9%;right:9%;width:auto;top:10%;bottom:auto;height:17%;flex-direction:row;border-radius:3px;background:transparent;padding:0}.skin-option[data-skin=midnight] .preview-controls i{max-height:none;border:1px solid #a3a7ce;background:#505c8f;border-radius:5px}.skin-option[data-skin=midnight] .preview-controls i:first-child{background:#e9ab29}.skin-option[data-skin=midnight] .preview-window{top:34%;left:10%;width:65%;height:54%;border-color:#5c6f9f;border-radius:4px;background:#192443}.skin-option[data-skin=midnight] .preview-brand{writing-mode:vertical-rl;left:auto;right:6%;bottom:12%;font-size:8px;letter-spacing:1px}
.skin-option[data-skin=clearWhite] .skin-preview{background:repeating-linear-gradient(0deg,#c4d1bd 0 6px,#a3b39d 6px 9px);border:5px solid #dbe1cc;border-radius:18px}.skin-option[data-skin=clearWhite] .preview-controls{left:10%;right:10%;width:auto;top:10%;bottom:auto;height:15%;flex-direction:row;background:none;padding:0}.skin-option[data-skin=clearWhite] .preview-controls i{max-height:none;border-radius:2px;background:#39795d}.skin-option[data-skin=clearWhite] .preview-controls i:first-child{background:#445a99}.skin-option[data-skin=clearWhite] .preview-controls i:last-child{background:#bd5c3e}.skin-option[data-skin=clearWhite] .preview-window{top:34%;left:25%;width:64%;height:36%;border:3px solid #d1d9c4;background:#657c6555;border-radius:10px}.skin-option[data-skin=clearWhite] .preview-dial{display:block;position:absolute;bottom:12%;left:9%;width:25%;aspect-ratio:1;border:5px solid #64806b;border-radius:50%;background:#d5dec3}.skin-option[data-skin=clearWhite] .preview-brand{bottom:10%;left:45%;font-size:6px;background:#d4b758;padding:5px}
.skin-option[data-skin=silverBlue] .skin-preview{border-radius:3px;background:linear-gradient(#d2d7cf 0 24%,#2d5790 24%);border-color:#475568}.skin-option[data-skin=silverBlue] .preview-window{top:39%;left:13%;width:74%;height:23%;border-radius:1px;flex-direction:row;padding:2px}.skin-option[data-skin=silverBlue] .preview-controls{left:12%;right:12%;width:auto;top:auto;bottom:13%;height:14%;padding:3px;flex-direction:row;border-radius:1px;background:#adb7b2}.skin-option[data-skin=silverBlue] .preview-controls i{max-height:none;border-radius:1px;background:#d8dfd3}.skin-option[data-skin=silverBlue] .preview-controls i:first-child{background:#ec9e32}.skin-option[data-skin=silverBlue] .preview-brand{top:7%;bottom:auto;font-size:8px;color:#374349}
.skin-option[data-skin=creamOrange] .skin-preview{border-radius:20px;border:5px solid #b8a581;background:#dbcbab}.skin-option[data-skin=creamOrange] .preview-window{left:12%;top:15%;width:76%;height:30%;border:4px solid #b2663b;border-radius:8px;flex-direction:row}.skin-option[data-skin=creamOrange] .preview-controls{left:48%;right:10%;width:auto;top:auto;bottom:17%;height:12%;padding:2px;gap:2px;flex-direction:row;border-radius:3px;background:#ba9b77}.skin-option[data-skin=creamOrange] .preview-controls i{max-height:none;background:#bf723e}.skin-option[data-skin=creamOrange] .preview-dial{display:block;position:absolute;left:10%;bottom:13%;width:31%;aspect-ratio:1;border-radius:50%;border:3px solid #b7a17c;background:radial-gradient(#665a38 1px,transparent 1.5px) 0 0/4px 4px,#c9b994}.skin-option[data-skin=creamOrange] .preview-brand{font-size:6px;left:48%;bottom:34%;color:#7f522e}
.skin-option[data-skin=blackGold] .skin-preview{border-radius:2px;border:4px double #a59160;background:repeating-linear-gradient(#252c25 0 1px,#20251f 1px 3px)}.skin-option[data-skin=blackGold] .preview-window{left:10%;top:13%;width:80%;height:32%;border:1px solid #ac9765;border-radius:0}.skin-option[data-skin=blackGold] .preview-controls{left:10%;right:10%;width:auto;top:52%;bottom:auto;height:13%;padding:2px;gap:3px;flex-direction:row;border-radius:0;background:#141d14}.skin-option[data-skin=blackGold] .preview-controls i{max-height:none;border-radius:0;background:#aa9464}.skin-option[data-skin=blackGold] .preview-dial{display:block;position:absolute;bottom:15%;left:10%;width:80%;height:14%;background:linear-gradient(90deg,#dcc998 0 45%,#151f16 45% 55%,#dcc998 55%);border:2px solid #101a12}.skin-option[data-skin=blackGold] .preview-brand{bottom:5%;font-size:7px;color:#aa9464}
@media(max-height:600px){body[data-device-view=inner] .library-panel{padding:17px 16px 10px}body[data-device-view=inner] .library-bottom{display:none}body[data-device-view=inner] .section-heading h1{font-size:20px}body[data-device-view=inner] .player-panel{padding:39px 9px 9px}body[data-device-view=inner] .deck .cassette{padding:9px 12px 0}body[data-device-view=inner] .transport{width:33px;padding:12px 4px;gap:11px}body[data-device-view=inner] .transport-key{width:25px;flex-basis:27px;min-height:27px;max-height:27px}body[data-device-view=inner] .create-single{padding:6px 8px}body[data-device-view=inner] .insert-guide{font-size:8px;margin:5px 0}}
.cassette{--tape-scale:1}
body[data-device-view=outer]{display:grid;place-items:center;height:100dvh}
body[data-device-view=inner]{display:block;height:auto}
body[data-device-view=outer] .workspace{width:min(440px,calc(100dvh * .66),100vw);height:min(100dvh,calc(100vw / .66),calc(440px / .66));margin:0 auto}
body[data-device-view=outer] .deck[data-skin=sunshine] .deck-body{margin-top:8%}
body[data-device-view=inner] .deck-body{width:calc(100% - 45px)}
body[data-device-view=inner] .transport{position:absolute;top:10px;bottom:10px;right:7px;height:auto}
body[data-device-view=outer] .deck:not([data-skin=sunshine]) .deck-wordmark>span{display:inline!important;font-size:inherit;letter-spacing:inherit;margin:0;color:inherit;-webkit-text-stroke:0}
body[data-device-view=outer] .deck[data-skin=silverBlue] .unfold-button,body[data-device-view=outer] .deck[data-skin=silverBlue] .cover-skin-button{color:#283949}
/* One physical scene: folding changes the casing mask, never the tape geometry. */
body[data-device-view=inner],body[data-device-view=outer]{display:grid;place-items:center;height:100dvh;overflow:hidden}
body[data-device-view=outer] .workspace{width:var(--physical-panel-width,440px);height:var(--physical-device-height,666.67px);margin:0;transform:none}
body[data-device-view=inner] .workspace{width:var(--unfolded-width,888px);height:var(--physical-device-height,666.67px);grid-template-columns:var(--physical-panel-width,440px) var(--physical-panel-width,440px);column-gap:8px;border:0;box-shadow:0 0 0 4px #080c0b,0 0 0 5px #59604d;margin:0;transform:scale(var(--scene-scale,1));transform-origin:center center}
body[data-device-view=inner] .workspace:before{left:var(--physical-panel-width,440px);width:8px}
body[data-device-view=inner] .topbar{top:max(12px,calc((100dvh - var(--physical-device-height,666.67px) * var(--scene-scale,1))/2 + 12px));right:max(14px,calc((100vw - var(--unfolded-width,888px) * var(--scene-scale,1))/2 + 14px))}
body[data-device-view=inner] .player-panel{padding:0;position:relative;width:var(--physical-panel-width,440px);height:var(--physical-device-height,666.67px);overflow:hidden}
body[data-device-view=inner] .player-options{position:absolute;top:16px;left:17px;right:110px;z-index:10;margin:0;gap:9px}
body[data-device-view=inner] .player-options .mode-switch{gap:8px}body[data-device-view=inner] .player-options .mode-switch button{font-size:6px;letter-spacing:.4px}
body[data-device-view=inner] .player-options .skin-trigger{font-size:7px;white-space:nowrap}
body[data-device-view=inner] .player-options{width:auto;right:130px}
body[data-device-view=inner] .deck-stage{position:absolute;inset:0;width:100%;height:100%;padding:0;display:flex}
body[data-device-view=inner] .deck{width:100%;height:100%;padding:0;border:1px solid #6d7076;border-radius:8px}
body[data-device-view=inner] .deck-body{position:absolute;inset:55px 48px 76px 16px;height:auto;width:auto;padding:0;margin:0;display:block;min-height:0}
body[data-device-view=inner] .cassette-door{width:100%;height:100%;position:relative;overflow:hidden}
body[data-device-view=inner] .transport{position:absolute;top:55px;bottom:89px;right:6px;width:34px;height:auto;padding:15px 3px;gap:14px}
body[data-device-view=inner] .transport-key{width:26px;min-height:31px;max-height:31px;flex:0 0 31px}
body[data-device-view=inner] .now-playing{position:absolute;bottom:31px;left:16px;right:48px;width:auto;margin:0;max-width:none;z-index:4}
body[data-device-view=inner] .under-player{position:absolute;bottom:8px;left:16px;right:48px;width:auto;margin:0;z-index:4}
body[data-device-view=inner] .under-player>span{font-size:7px}
body[data-device-view=inner] .deck .cassette,body[data-device-view=outer] .deck .cassette{position:absolute;left:var(--tape-left,50%);top:var(--tape-top,50%);width:var(--tape-length,270px);height:var(--tape-height,171px);margin:0;transform:translate(-50%,-50%) rotate(var(--tape-angle,90deg))}
body[data-device-view=inner][data-mechanism=horizontal] .deck-body{inset:58px 16px 155px}
body[data-device-view=inner][data-mechanism=horizontal] .cassette-door{border-radius:5px;background:linear-gradient(130deg,#111c20,#293136);box-shadow:inset 0 0 15px #0009}
body[data-device-view=inner][data-mechanism=horizontal] .transport{top:auto;bottom:76px;left:16px;right:16px;width:auto;height:53px;flex-direction:row;gap:10px;padding:5px 8px;align-items:center;border:1px solid #9ba7a244;border-radius:3px;background:#121c19}
body[data-device-view=inner][data-mechanism=horizontal] .transport-key{flex:1;width:auto;height:37px;min-height:37px;max-height:37px;border-radius:3px}
body[data-device-view=inner][data-mechanism=horizontal] .power-led,body[data-device-view=inner][data-mechanism=horizontal] .transport-caption{display:none}
body[data-device-view=inner][data-mechanism=horizontal] .now-playing{left:16px;right:16px;bottom:27px}
body[data-device-view=inner][data-mechanism=horizontal] .under-player{right:16px;bottom:5px}
body[data-device-view=inner][data-player-skin=silverBlue] .deck{background:linear-gradient(#9da7a5 0 8%,#223748 8% 13%,#1b2d3c 13%);border-color:#b5c0bc}
body[data-device-view=inner][data-player-skin=silverBlue] .cassette-door{border:3px solid #8d9c9b;box-shadow:inset 0 0 0 5px #1b2830,inset 0 0 18px #000}
body[data-device-view=inner][data-player-skin=silverBlue] .transport{background:#8f9e9e;border-color:#9faeac}
body[data-device-view=inner][data-player-skin=silverBlue] .transport-key{background:linear-gradient(#d9e1da,#8c9b95);color:#1f3239}
body[data-device-view=inner][data-player-skin=silverBlue] .play-key{background:linear-gradient(#f0b044,#ce7a28)}
body[data-device-view=inner][data-player-skin=creamOrange] .deck{background:linear-gradient(130deg,#5e513f,#302b24);border:3px solid #b59a73;border-radius:17px}
body[data-device-view=inner][data-player-skin=creamOrange] .cassette-door{border:5px solid #ab603d;border-radius:11px;background:#302920;box-shadow:inset 0 0 0 3px #d2ae7c55,inset 0 0 20px #000b}
body[data-device-view=inner][data-player-skin=creamOrange] .transport{background:#6b4c32;border-color:#b68b5d;border-radius:8px}
body[data-device-view=inner][data-player-skin=creamOrange] .transport-key{background:linear-gradient(#d89960,#9c542f);border-color:#d9a770}
body[data-device-view=inner][data-player-skin=blackGold] .deck{background:repeating-linear-gradient(#1a231b 0 1px,#20291f 1px 3px);border:3px double #9d8e5e;border-radius:2px}
body[data-device-view=inner][data-player-skin=blackGold] .cassette-door{border:2px solid #b2a174;border-radius:1px;background:#131c15}
body[data-device-view=inner][data-player-skin=blackGold] .transport-key{background:linear-gradient(#bbac85,#7c704d);color:#182018;border-radius:0}
body[data-device-view=inner][data-player-skin=blackGold] .deck>.clear-mechanism{display:flex;position:absolute;inset:auto 18px 139px;gap:14px;transform:none;opacity:1;z-index:3;height:43px;pointer-events:none}
body[data-device-view=inner][data-player-skin=blackGold] .clear-mechanism>span{flex:1;height:43px;width:auto;border:3px solid #111a13;border-radius:0;background:repeating-linear-gradient(90deg,#d0bd88 0 11px,#b7a675 11px 12px);position:relative}
body[data-device-view=inner][data-player-skin=blackGold] .clear-mechanism>span:after{content:'';position:absolute;bottom:0;left:45%;width:2px;height:32px;transform-origin:bottom;background:#a24428;animation:meter 1.4s ease-in-out infinite alternate;animation-play-state:paused}
body[data-device-view=inner][data-player-skin=blackGold].playing .clear-mechanism>span:after{animation-play-state:running}
body[data-device-view=inner][data-player-skin=blackGold] .clear-mechanism>i{display:none}
body[data-device-view=inner][data-player-skin=clearWhite] .deck{background:linear-gradient(125deg,#94a78b88,#5f756788),repeating-linear-gradient(0deg,#486050 0 3px,#809275 3px 5px);border:4px solid #c4d0b7;border-radius:24px}
body[data-device-view=inner][data-player-skin=clearWhite] .cassette-door{background:#223c2b66;border:2px solid #cbd6bb;border-radius:15px}
body[data-device-view=inner][data-player-skin=clearWhite] .transport-key{background:linear-gradient(#b2c4a3,#658b6e);color:#213b2b}
body[data-device-view=inner][data-player-skin=midnight] .deck{background:linear-gradient(135deg,#172540,#111729);border-color:#5e6e8f}
.skin-groups{display:grid;gap:25px}.skin-group+.skin-group{padding-top:21px;border-top:1px solid #4a5141}.skin-group-heading{display:flex;align-items:center;gap:12px;margin:0 6px 15px}.skin-group-heading h3{font-size:15px;font-weight:600;margin:0 0 5px}.skin-group-heading p{font-size:9px;color:#a6ae9b;margin:0}.mount-icon{display:block;width:18px;height:29px;border:1px solid #d3bd7d;border-radius:3px;position:relative;background:#d3bd7d12;flex-shrink:0}.mount-icon:before,.mount-icon:after{content:'';position:absolute;width:5px;height:5px;border:1px solid #d3bd7d;border-radius:50%;left:5px}.mount-icon:before{top:5px}.mount-icon:after{bottom:5px}.mount-icon.horizontal{transform:rotate(90deg);margin-inline:6px}.bay-orientation{display:none;position:absolute;bottom:9px;left:11px;z-index:2;color:#c5c8bb66;font:6px monospace;letter-spacing:1px;pointer-events:none}body[data-device-view=inner] .bay-orientation{display:block}
/* Home-screen launches use the device viewport rather than the desktop mockup frame. */
body[data-installed=true]{background:var(--installed-background,#17191b)}
body[data-installed=true][data-device-view=inner] .workspace{box-shadow:none;border-radius:0}
body[data-installed=true][data-device-view=outer] .unfold-button,body[data-installed=true][data-device-view=outer] .cover-skin-button{top:calc(26px + env(safe-area-inset-top,0px))}
body[data-installed=true][data-device-view=outer] .deck-name{margin-top:env(safe-area-inset-top,0px)}
body[data-installed=true][data-device-view=outer] .deck[data-skin=midnight] .deck-name{margin-top:0}
body[data-installed=true][data-device-view=outer] .deck[data-skin=sunshine] .transport{top:calc(94px + env(safe-area-inset-top,0px))}
body[data-installed=true][data-device-view=outer] .deck[data-skin=midnight] .transport{top:calc(89px + env(safe-area-inset-top,0px))}
body[data-installed=true][data-device-view=outer] .deck[data-skin=clearWhite] .transport{top:calc(96px + env(safe-area-inset-top,0px))}
body[data-installed=true][data-device-view=outer] .deck[data-skin=midnight] .deck-body{top:calc(190px + env(safe-area-inset-top,0px))}
body[data-installed=true][data-device-view=outer] .deck[data-skin=clearWhite] .deck-body{top:calc(200px + env(safe-area-inset-top,0px))}
body[data-installed=true][data-device-view=outer] .deck[data-skin=creamOrange] .deck-body{top:calc(115px + env(safe-area-inset-top,0px))}
body[data-installed=true][data-device-view=outer] .deck[data-skin=blackGold] .deck-body{top:calc(118px + env(safe-area-inset-top,0px))}
body[data-installed=true][data-device-view=outer] .cover-now{bottom:max(28px,env(safe-area-inset-bottom,0px))}
body[data-installed=true][data-device-view=inner] .topbar{top:calc(12px + env(safe-area-inset-top,0px))}
/* Tape artwork is shared by the live deck, insertion animation and editor. */
body[data-device-view] .deck .cassette[data-tape-design],.cassette.insertion-ghost[data-tape-design],.tape-editor-preview .cassette[data-tape-design]{isolation:isolate;background:linear-gradient(125deg,#ffffff1c,#00000020),var(--tape-body-color,#68445e);color:var(--tape-ink-color,#ece5df)}
.tape-artwork{position:absolute;inset:3px;z-index:-1;background-position:center;background-size:cover;border-radius:7px;opacity:.85;pointer-events:none}
.cassette[data-tape-design=stripe] .tape-label{background:var(--tape-ink-color,#ece5df);color:var(--tape-body-color,#68445e);padding-inline:calc(5px * var(--tape-scale,1));border-radius:2px}
.cassette[data-tape-design=minimal] .tape-label{border-top-color:transparent}.cassette[data-tape-design=minimal] .tape-header>span{visibility:hidden}.cassette[data-tape-design=minimal] .tape-trapezoid{opacity:.25}
#cassette{cursor:pointer}.cover-now-title{padding-right:29px}.tape-edit-trigger{position:absolute;top:8px;right:0;display:grid;place-items:center;width:25px;height:25px;padding:4px;color:inherit}.tape-edit-trigger svg{width:14px;height:14px}
.tape-editor-modal{max-width:535px}.tape-editor-preview{width:100%;max-width:440px;aspect-ratio:1.58;margin:0 auto 16px;position:relative}
.tape-editor-preview .cassette{position:relative!important;left:0!important;top:0!important;transform:none!important;max-height:none!important;max-width:100%;margin:auto;cursor:default}
.tape-editor-preview .reel-hub{animation-play-state:paused!important}
.tape-presets{display:grid;grid-template-columns:repeat(6,1fr);gap:7px;margin:18px 0 22px}.tape-preset{padding:5px 2px 7px;border:1px solid #5b625344;border-radius:5px;display:flex;flex-direction:column;align-items:center;gap:7px;font-size:9px}.tape-preset[aria-pressed=true]{border-color:var(--orange)}.tape-preset i{display:block;width:27px;height:19px;background:var(--preset-color);border:1px solid #ffffff30;border-radius:3px}
.tape-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}.tape-fields label{font-size:10px;color:#c0c5b7;display:flex;flex-direction:column;gap:7px;min-width:0}.tape-fields input,.tape-fields select{width:100%;min-width:0;padding:10px;background:#191d1b;color:var(--ink);border:1px solid #4a5143;border-radius:4px;font-size:12px}.tape-fields input[type=color]{height:39px;padding:3px;cursor:pointer}.tape-print-field{grid-column:1/-1}.tape-editor-modal .cover-actions{margin-top:20px}
@media(max-width:720px){.tape-fields input,.tape-fields select{font-size:16px}.tape-presets{gap:5px}.tape-preset{font-size:8px}.tape-preset i{width:24px;height:18px}.tape-editor-modal .cover-actions{max-width:none}}
body[data-device-view=inner] .deck .cassette,body[data-device-view=outer] .deck .cassette{--tape-scale:inherit;padding:calc(12px * var(--tape-scale,1)) calc(15px * var(--tape-scale,1)) 0;background:linear-gradient(125deg,#c6a8bd2a,#1c192a22),#68445e}
.cassette .tape-header b{font-size:calc(13px * var(--tape-scale,1))}.cassette .tape-header>span{font-size:calc(6px * var(--tape-scale,1))}.cassette .tape-label{margin-top:calc(5px * var(--tape-scale,1));padding:calc(6px * var(--tape-scale,1)) 0 calc(3px * var(--tape-scale,1))}.cassette .tape-label>span{font-size:calc(10px * var(--tape-scale,1))}.cassette .tape-label small{font-size:calc(5px * var(--tape-scale,1))}.cassette .tape-window{max-height:calc(50px * var(--tape-scale,1));min-height:calc(30px * var(--tape-scale,1));padding:calc(3px * var(--tape-scale,1)) calc(8px * var(--tape-scale,1))}.cassette .reel{width:calc(42px * var(--tape-scale,1));height:calc(42px * var(--tape-scale,1))}.cassette .reel-hub{width:calc(27px * var(--tape-scale,1));height:calc(27px * var(--tape-scale,1));border-width:calc(5px * var(--tape-scale,1))}.cassette .reel-hub:after{inset:calc(5px * var(--tape-scale,1))}.cassette .tape-bridge{width:calc(35px * var(--tape-scale,1));height:calc(12px * var(--tape-scale,1));margin-inline:calc(9px * var(--tape-scale,1))}.cassette .tape-bottom{font-size:calc(5px * var(--tape-scale,1));margin-top:calc(5px * var(--tape-scale,1))}.cassette .tape-trapezoid{height:calc(10px * var(--tape-scale,1));margin:calc(4px * var(--tape-scale,1)) calc(25px * var(--tape-scale,1)) 0}.cassette .tape-screw{font-size:calc(7px * var(--tape-scale,1))}
