.deck{--bg:#fbf1d9;--dots:#2b1f5221;--panel:#e6defb;--panel-high:#f6f2ff;--ink:#2b1f52;--edge:#2b1f52;--text:#2b1f52;--muted:#54467e;--button:#bbaaf2;--on-button:#1e1540;--shine:#ffffff8c;--pressed:#9feaf2;--primary:#f2b33d;--focus:#4a25c8;--brand:#2b1f52;--brand-shadow:#b6a5f0;--cassette:#a495ec;--label:#fff6df;--label-ink:#2b1f52;--segment-a:#c9bcf7;--segment-b:#a9bbf9;--warning:#f2b33d;--tape:#3b2b25;--tape-alt:#45332b;--tape-edge:#17101c;--glass:#1a1524;--bass:#3fb8af;--harmony:#f2b33d;--counter:#efe7d2;--accent:#ee7b30;--lead:#f08cb4;--drums:#ff7a59;--sec-intro:#c9bcf7;--sec-verse:#9fdcd6;--sec-chorus:#f4a9c8;--sec-bridge:#f5b98a;--sec-outro:#e9e0c4;--scrim:#2b1f528c;--sans:"Archivo", system-ui, sans-serif;--marker:"Permanent Marker", "Comic Sans MS", cursive;--arcade:"Bungee", "Archivo", sans-serif}:root[data-theme=dark] .deck{--bg:#1b1530;--dots:#b7a6f017;--panel:#2a2150;--panel-high:#382d66;--ink:#0b0716;--edge:#6c58c4;--text:#f1ecff;--muted:#c5bbe8;--button:#b7a6f0;--shine:#ffffff61;--pressed:#8fe6f0;--focus:#8fe6f0;--brand:#c4f4f8;--brand-shadow:#6c58c4;--cassette:#5b4b95;--label:#efe7d2;--segment-a:#b7a6f0;--segment-b:#8fa4f5;--scrim:#070410b3}.deck *,.deck :before,.deck :after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}.deck{min-height:100vh;color:var(--text);font:400 1rem/1.5 var(--sans);background-color:var(--bg);background-image:radial-gradient(circle, var(--dots) 1.5px, transparent 1.5px);background-size:22px 22px}.deck button,.deck input,.deck select{font:inherit;color:inherit}.deck :focus-visible{outline:3px solid var(--focus);outline-offset:3px}.deck .visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.deck svg.icon{flex:none;width:1.25rem;height:1.25rem}.deck .button{white-space:nowrap;cursor:pointer;min-height:48px;color:var(--on-button);background:var(--button);border:3px solid var(--ink);box-shadow:inset 0 3px 0 var(--shine), 0 4px 0 var(--ink);border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:0 16px;font-weight:800;font-stretch:105%;text-decoration:none;transition:transform 80ms,box-shadow 80ms;display:inline-flex}.deck .button:active,.deck .button[aria-pressed=true]{box-shadow:inset 0 3px 0 #00000024, 0 0 0 var(--ink);transform:translateY(4px)}.deck .button[aria-pressed=true]{background:var(--pressed)}.deck .button.primary{background:var(--primary)}.deck .button.soft{background:var(--panel-high);color:var(--text)}.deck .button.compact{min-height:44px;padding:0 14px}.deck .page{grid-template-columns:minmax(0,1fr);gap:22px;max-width:560px;margin:0 auto;padding:0 16px 56px;display:grid}.deck .topbar{justify-content:space-between;align-items:center;gap:10px;padding-top:14px;display:flex}.deck .wordmark{color:var(--brand);font:400 1.25rem/1 var(--arcade);letter-spacing:.01em;text-shadow:2px 2px 0 var(--brand-shadow);white-space:nowrap;align-items:center;gap:10px;text-decoration:none;display:inline-flex}.deck .wordmark svg{flex:none;width:34px;height:24px}.deck .bar-actions{align-items:center;gap:10px;display:flex}.deck .flip{cursor:pointer;text-align:center;background:var(--panel);border:3px solid var(--ink);width:84px;height:44px;box-shadow:0 4px 0 var(--ink);font:400 1rem/1 var(--arcade);color:var(--muted);border-radius:12px;grid-template-columns:1fr 1fr;align-items:center;padding:0;display:grid;position:relative}.deck .flip:active{box-shadow:0 0 0 var(--ink);transform:translateY(4px)}.deck .flip:before{box-sizing:border-box;content:"";background:var(--button);border:2px solid var(--ink);width:calc(50% - 3px);box-shadow:inset 0 2px 0 var(--shine);border-radius:7px;transition:transform .16s;position:absolute;top:3px;bottom:3px;left:3px}.deck .flip[aria-checked=false]:before{transform:translate(100%)}.deck .flip span{position:relative}.deck .flip[aria-checked=true] .flip-a,.deck .flip[aria-checked=false] .flip-b{color:var(--on-button)}.deck .mood-row{justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px;display:flex}.deck .section-label{margin:0;font-size:1.0625rem;font-weight:800;font-stretch:112%}.deck .moods{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.deck .moods input{opacity:0;width:1px;height:1px;position:absolute}.deck .moods label{cursor:pointer;min-height:76px;color:var(--on-button);background:var(--button);border:3px solid var(--ink);box-shadow:inset 0 3px 0 var(--shine), 0 4px 0 var(--ink);border-radius:12px;align-content:space-between;justify-items:start;gap:6px;padding:9px 10px;font-size:.9375rem;font-weight:800;line-height:1.1;transition:transform 80ms,box-shadow 80ms;display:grid}.deck .moods .mood-icon{width:24px;height:24px}.deck .moods label:active{box-shadow:inset 0 3px 0 #00000024, 0 0 0 var(--ink);transform:translateY(4px)}.deck .moods input:checked+label{background:var(--pressed);box-shadow:inset 0 3px 0 #00000024, 0 0 0 var(--ink);transform:translateY(4px)}.deck .moods input:focus-visible+label{outline:3px solid var(--focus);outline-offset:3px}.deck .cassette{background:var(--cassette);border:3px solid var(--edge);box-shadow:0 6px 0 var(--ink);border-radius:18px;padding:14px 14px 16px;position:relative}.deck .sticker{background:var(--label);color:var(--label-ink);border:3px solid var(--ink);border-radius:10px;gap:8px;padding:12px 14px 14px;display:grid}.deck .sticker-top{justify-content:space-between;align-items:flex-start;gap:8px;display:flex}.deck .track-title{min-width:0;font:400 clamp(1.625rem, 7.5vw, 3rem)/1.05 var(--marker);transform-origin:0;margin:0;transform:rotate(-1.5deg)}.deck .side{white-space:nowrap;font:400 .8125rem/1 var(--arcade);border:2px solid var(--label-ink);border-radius:5px;flex:none;padding:.45em .6em .4em}.deck .seed{font:400 1.125rem/1.2 var(--marker);color:#4a3f55;margin:0}.deck .bands{gap:3px;display:grid}.deck .bands i{border-radius:3px;height:6px;display:block}.deck .deck-window{background:var(--glass);border:3px solid var(--ink);border-radius:44px;justify-content:space-between;align-items:center;gap:8px;max-width:440px;margin:14px auto 0;padding:8px 16px;display:flex}.deck .reel{flex:none;width:54px;height:54px}.deck .playing .reel{animation:3.2s linear infinite reel-spin}@keyframes reel-spin{to{transform:rotate(360deg)}}.deck .lcd{color:#f2b33d;text-align:center;background:#120e18;border:2px solid #3b3252;border-radius:8px;flex:1;place-items:center;min-height:54px;margin:0;padding:2px 6px;display:grid}.deck .lcd strong{font:800 1.75rem/1 var(--sans);font-variant-numeric:tabular-nums;font-stretch:75%}.deck .lcd span{color:#cfc6e6;font-size:.8125rem;line-height:1.1}.deck .screw{background:var(--label);border:2px solid var(--ink);border-radius:50%;width:9px;height:9px;position:absolute;bottom:9px}.deck .screw.left{left:12px}.deck .screw.right{right:12px}.deck .transport{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr) minmax(0,1fr);gap:12px;margin-top:4px;display:grid}.deck .transport .button{flex-direction:column;gap:4px;min-height:68px;padding:0 6px;font-size:.9375rem}.deck .transport .play{flex-direction:row;gap:10px;font-size:1.25rem}.deck .transport .play svg{width:26px;height:26px}.deck .transport .icon-pause,.deck .transport .label-pause{display:none}.deck .transport .play[data-playing=true] .icon-pause,.deck .transport .play[data-playing=true] .label-pause{display:block}.deck .transport .play[data-playing=true] .icon-play,.deck .transport .play[data-playing=true] .label-play{display:none}.deck .panel{background:var(--panel);border:3px solid var(--edge);box-shadow:0 6px 0 var(--ink);border-radius:18px;overflow:hidden}.deck .panel-title{background:var(--button);min-height:44px;color:var(--on-button);border-bottom:3px solid var(--ink);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 12px;padding:6px 14px;display:flex}.deck .panel-title h2{align-items:center;gap:10px;margin:0;font-size:1rem;font-weight:800;font-stretch:112%;display:flex}.deck .panel-title h2:before{content:"";background:var(--panel-high);border:2px solid var(--ink);width:12px;height:12px;box-shadow:18px 0 0 -1px var(--panel-high), 18px 0 0 1px var(--ink);border-radius:50%;margin-right:18px}.deck .panel-body{padding:16px}.deck .warning{color:#2b1f52;background:var(--warning);border:2px solid var(--ink);border-radius:999px;align-items:center;gap:6px;min-height:28px;padding:2px 10px;font-size:.875rem;font-weight:800;display:inline-flex}.deck .warning svg{width:16px;height:16px}.deck .slots{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin:0;padding:0;list-style:none;display:grid}.deck .slot{text-align:left;cursor:pointer;background:var(--panel-high);width:100%;min-height:64px;color:var(--text);border:3px solid var(--ink);box-shadow:inset 0 3px 0 var(--shine), 0 4px 0 var(--ink);border-radius:12px;align-content:center;gap:2px;padding:8px 12px;transition:transform 80ms,box-shadow 80ms;display:grid}.deck .slot:active{box-shadow:0 0 0 var(--ink);transform:translateY(4px)}.deck .slot-role{color:var(--muted);align-items:center;gap:8px;font-size:.875rem;font-weight:700;display:flex}.deck .slot-role i{background:var(--dot);border:2px solid var(--ink);border-radius:50%;flex:none;width:12px;height:12px}.deck .slot-name{align-items:center;gap:6px;font-size:1.0625rem;font-weight:800;font-stretch:100%;line-height:1.15;display:flex}.deck .slot[aria-pressed=false]{border-style:dashed;border-color:var(--muted);box-shadow:none;background:0 0;transform:translateY(4px)}.deck .slot[aria-pressed=false] .slot-name{color:var(--muted)}.deck .slot[aria-pressed=false] .slot-role i{border-color:var(--muted);background:0 0}.deck .keep{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:-6px;display:grid}.deck .keep .button{padding:0 8px}.deck .keep .lock{width:16px;height:16px}.deck .scrim{z-index:10;background:var(--scrim);opacity:0;visibility:hidden;transition:opacity .2s,visibility 0s .2s;position:fixed;inset:0}.deck.drawer-open .scrim{opacity:1;visibility:visible;transition:opacity .2s}.deck .drawer{z-index:11;visibility:hidden;background:var(--panel);border:3px solid var(--edge);border-bottom:0;border-radius:20px 20px 0 0;max-height:88vh;transition:transform .24s,visibility 0s .24s;position:fixed;bottom:0;left:0;right:0;overflow-y:auto;transform:translateY(105%)}.deck.drawer-open .drawer{visibility:visible;transition:transform .24s;transform:none}@media (width>=720px){.deck .drawer{border:0;border-left:3px solid var(--edge);border-radius:0;width:400px;max-height:none;top:0;left:auto;transform:translate(105%)}}.deck .drawer .panel-title{z-index:1;border-radius:0;position:sticky;top:0}.deck .drawer-close{min-width:44px;padding:0}.deck .drawer-body{gap:20px;padding:20px 18px 28px;display:grid}.deck .field{gap:8px;display:grid}.deck .field label,.deck .field-top label{font-weight:800;font-stretch:108%}.deck .field-top{justify-content:space-between;align-items:baseline;display:flex}.deck output{font:800 1.375rem/1 var(--sans);font-variant-numeric:tabular-nums;font-stretch:75%}.deck select{appearance:none;cursor:pointer;width:100%;min-height:48px;color:var(--text);background-color:var(--panel-high);border:3px solid var(--ink);box-shadow:0 4px 0 var(--ink);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1.5 1.5l5.500 5.500 5.500-5.500' fill='none' stroke='%23888' stroke-width='3'/%3E%3C/svg%3E");background-position:right 14px center;background-repeat:no-repeat;border-radius:12px;padding:0 40px 0 14px;font-weight:700}.deck select option{color:#1e1540;background:#fff}.deck .range-ends{color:var(--muted);justify-content:space-between;font-size:.875rem;display:flex}.deck input[type=range]{appearance:none;cursor:pointer;background:0 0;width:100%;height:44px;margin:0}.deck input[type=range]::-webkit-slider-runnable-track{border:3px solid var(--ink);background:linear-gradient(to right, var(--pressed) var(--fill), var(--panel-high) var(--fill));border-radius:7px;height:14px}.deck input[type=range]::-moz-range-track{border:3px solid var(--ink);background:var(--panel-high);border-radius:7px;height:8px}.deck input[type=range]::-moz-range-progress{background:var(--pressed);border-radius:7px;height:8px}.deck input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--button);border:3px solid var(--ink);width:28px;height:34px;box-shadow:inset 0 3px 0 var(--shine), 0 3px 0 var(--ink);border-radius:9px;margin-top:-13px}.deck input[type=range]::-moz-range-thumb{background:var(--button);border:3px solid var(--ink);width:22px;height:28px;box-shadow:inset 0 3px 0 var(--shine), 0 3px 0 var(--ink);border-radius:9px}@media (width<=479px){.deck .wordmark{gap:8px;font-size:1.0625rem}.deck .wordmark svg{width:28px;height:20px}.deck .auth-secondary{display:none}.deck .reel{width:46px;height:46px}.deck .deck-window{padding:8px 12px}.deck .moods label{padding:8px;font-size:.875rem}}@media (width<=400px){.deck .wordmark{gap:6px;font-size:.9375rem}.deck .wordmark svg{width:24px;height:17px}.deck .flip{width:70px}.deck .bar-actions{gap:8px}.deck .bar-actions .button{padding:0 12px}}@media (width<=340px){.deck .page{padding-left:12px;padding-right:12px}.deck .wordmark{gap:5px;font-size:.8125rem}.deck .wordmark svg{width:20px;height:14px}.deck .flip{width:62px}.deck .bar-actions{gap:6px}.deck .bar-actions .button{padding:0 9px}.deck .moods{gap:8px}.deck .moods label{padding:8px 6px;font-size:.8125rem}.deck .transport,.deck .keep{gap:8px}.deck .keep .button{gap:5px;padding:0 4px}}@media (prefers-reduced-motion:reduce){.deck .playing .reel{animation:none}.deck .button,.deck .slot,.deck .moods label,.deck .flip:before,.deck .scrim,.deck .drawer{transition:none}}.deck .score{gap:4px;display:grid}.deck .tape-window{background:var(--tape);border:3px solid var(--edge);box-shadow:0 4px 0 var(--ink);cursor:grab;touch-action:pan-y;border-radius:14px;position:relative;overflow:hidden}.deck .tape-window svg.tape{will-change:transform;display:block;position:absolute;top:0;left:0}.deck .head{background:var(--primary);width:4px;box-shadow:0 0 0 2px var(--ink);pointer-events:none;z-index:2;margin-left:-2px;position:absolute;top:0;bottom:0;left:32%}.deck .head:before{content:"";border:9px solid #0000;border-top:11px solid var(--primary);border-bottom:0;position:absolute;top:0;left:50%;transform:translate(-50%)}.deck .bar-line{stroke:#efe7d233;stroke-width:1.5px}.deck .beat-line{stroke:#efe7d212;stroke-width:1px}.deck .section-edge{stroke:var(--tape-edge);stroke-width:3px}.deck .lane-line{stroke:#efe7d247;stroke-width:2px}.deck .drum-guide{stroke:#efe7d229;stroke-width:1px;stroke-dasharray:2 6}.deck .note{stroke:#120c1a;stroke-width:2px;fill:var(--dot)}.deck .hit{stroke:#120c1a;stroke-width:1.5px;fill:var(--drums)}.deck .shade{fill:#120c1a8c;pointer-events:none}.deck .strip{cursor:pointer;touch-action:pan-y;border-radius:12px;align-items:center;min-height:44px;display:flex;position:relative}.deck .strip-track{border:3px solid var(--ink);border-radius:9px;width:100%;height:36px;display:flex;position:relative;overflow:hidden}.deck .strip-section{color:#1e1540;min-width:0;font:800 .75rem/1 var(--sans);white-space:nowrap;background:var(--sec-color);border-left:3px solid var(--ink);align-items:center;padding-left:5px;font-stretch:80%;display:flex;overflow:hidden}.deck .strip-section:first-child{border-left:0}.deck .strip-section[data-type=intro]{--sec-color:var(--sec-intro)}.deck .strip-section[data-type=verse]{--sec-color:var(--sec-verse)}.deck .strip-section[data-type=chorus]{--sec-color:var(--sec-chorus)}.deck .strip-section[data-type=bridge]{--sec-color:var(--sec-bridge)}.deck .strip-section[data-type=outro]{--sec-color:var(--sec-outro)}.deck .strip-played{pointer-events:none;background:#120c1a4d;width:0;position:absolute;top:0;bottom:0;left:0}.deck .strip-pin{--pin-height:40px;height:var(--pin-height);width:10px;margin:calc(var(--pin-height) / -2) 0 0 -5px;background:var(--primary);border:3px solid var(--ink);pointer-events:none;border-radius:5px;position:absolute;top:50%}@media (width<=479px){.deck .strip-section{padding-left:4px;font-size:.6875rem}}body{margin:0}.deck .page-main,.deck .player{grid-template-columns:minmax(0,1fr);gap:22px;display:grid}.deck .player{gap:18px}.deck .moods .mood{display:grid;position:relative}.deck .transport svg:not(.icon){width:26px;height:26px}.deck .button:disabled{cursor:wait}.deck .wordmark:focus-visible{border-radius:6px}.deck .band-amber{background:#f2b33d}.deck .band-orange{background:#ee7b30}.deck .band-teal{background:#3fb8af}.deck .role-bass{--dot:var(--bass)}.deck .role-harmony{--dot:var(--harmony)}.deck .role-lead{--dot:var(--lead)}.deck .role-counter{--dot:var(--counter)}.deck .role-drums{--dot:var(--accent)}.deck .drawer .panel-title h2{margin:0;font-size:1rem;font-weight:800;font-stretch:112%}.deck .problem{color:#2b1f52;background:var(--warning);border:3px solid var(--ink);border-radius:12px;margin:0;padding:10px 14px;font-weight:700}