:root{--font:-apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, Roboto, "Helvetica Neue", Arial, sans-serif;--mono:ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;--oi-orange:#e69f00;--now-bg:#e69f001f;--now-bg-soft:#e69f0014;--oi-sky:#56b4e9;--oi-green:#009e73;--oi-yellow:#f0e442;--oi-blue:#0072b2;--oi-vermillion:#d55e00;--oi-purple:#cc79a7;--radius-s:8px;--radius-m:14px;--radius-l:22px;--ease-bounce:cubic-bezier(.34, 1.56, .64, 1);--t-fast:.12s;--t-med:.24s;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}[data-motion=calm]{--t-fast:0s;--t-med:0s}@media (prefers-reduced-motion:reduce){:root{--t-fast:0s;--t-med:0s}}*,:before,:after{box-sizing:border-box}html,body{min-height:100%;margin:0}body{font-family:var(--font);color:var(--fg);background:var(--bg);-webkit-font-smoothing:antialiased;font-size:16px;line-height:1.45;overflow-x:hidden}#root{flex-direction:column;min-height:100vh;display:flex}a{color:var(--link)}h1,h2,h3{margin:0 0 .5em;line-height:1.15}:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:6px}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.skip-link{z-index:100;background:var(--panel-hi);color:var(--fg);border-radius:var(--radius-s);padding:8px 14px;position:absolute;top:-48px;left:8px}.skip-link:focus{top:8px}.page{flex:1;width:100%;max-width:1180px;margin:0 auto;padding:24px 16px 64px}.page-wide{max-width:1400px}.muted{color:var(--fg-muted)}.row{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.stack{flex-direction:column;gap:12px;display:flex}.btn{font:inherit;border:1px solid var(--btn-border);background:var(--btn-bg);min-height:44px;color:var(--btn-fg);box-shadow:var(--btn-shadow);cursor:pointer;transition:transform var(--t-fast) var(--ease-bounce), background var(--t-fast), box-shadow var(--t-fast);border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:0 18px;font-weight:650;text-decoration:none;display:inline-flex}.btn:hover{background:var(--btn-bg-hover)}.btn:active{transform:translateY(1px)scale(.98)}.btn:disabled{opacity:.5;cursor:default}.btn-primary{background:var(--accent);color:var(--accent-fg);box-shadow:var(--accent-shadow);border-color:#0000}.btn-primary:hover{background:var(--accent-hi)}.btn-small{min-height:34px;padding:0 12px;font-size:14px}.btn-ghost{box-shadow:none;background:0 0}input[type=text],input[type=email],textarea,select{font:inherit;color:var(--fg);background:var(--input-bg);border:1px solid var(--btn-border);border-radius:var(--radius-s);min-height:44px;padding:8px 12px}.chip{background:var(--chip-bg);color:var(--chip-fg);white-space:nowrap;border-radius:999px;align-items:center;gap:6px;padding:2px 10px;font-size:13px;font-weight:600;display:inline-flex}.wizard-badge{background:var(--wizard-bg);color:var(--wizard-fg);white-space:nowrap;border-radius:999px;align-items:center;gap:4px;padding:1px 8px;font-size:12px;font-weight:700;display:inline-flex}.panel{background:var(--panel);border-radius:var(--radius-l);box-shadow:var(--panel-shadow);padding:20px}.oled{font-family:var(--mono);background:var(--oled-bg);color:var(--oled-fg);border-radius:var(--radius-m);box-shadow:var(--oled-shadow);text-shadow:0 0 6px var(--oled-glow)}.modal-backdrop{z-index:50;background:#05080ea8;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal{background:var(--panel);border-radius:var(--radius-l);width:min(520px,100%);max-height:calc(100vh - 32px);box-shadow:var(--panel-shadow), 0 30px 80px #00000080;padding:24px;overflow:auto}table{border-collapse:collapse;width:100%}th,td{text-align:left;border-bottom:1px solid var(--line);padding:8px 10px}th{color:var(--fg-muted);font-size:13px;font-weight:600}.site-header{z-index:20;background:var(--header-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);flex-wrap:wrap;align-items:center;gap:18px;padding:10px 16px;display:flex;position:sticky;top:0}.brand{color:var(--fg);letter-spacing:-.01em;align-items:center;gap:8px;font-size:18px;font-weight:800;text-decoration:none;display:flex}.brand-72{color:var(--accent)}.my-play-notice{border:1px solid var(--accent);border-radius:var(--radius-m);background:var(--panel);max-width:1100px;color:var(--fg);flex-wrap:wrap;align-items:center;gap:10px;margin:8px auto 0;padding:8px 12px;display:flex}.my-play-notice>span:nth-child(2){flex:220px}.my-play-dot{background:var(--accent);border-radius:50%;flex:none;width:10px;height:10px}.my-play-notice.playing .my-play-dot{animation:1.2s ease-in-out infinite my-play-pulse}@keyframes my-play-pulse{50%{opacity:.25}}[data-motion=calm] .my-play-notice.playing .my-play-dot{animation:none}.brand-sep{opacity:.35;background:currentColor;align-self:center;width:1px;height:1.15em;margin:0 4px}.brand-tag{letter-spacing:0;color:var(--fg-muted);white-space:nowrap;font-weight:400}.tempo-switch{border:1px solid var(--line);background:var(--input-bg);min-height:32px;color:var(--fg-muted);font-variant-numeric:tabular-nums;letter-spacing:.02em;border-radius:999px;align-items:center;gap:6px;padding:4px 10px;font-size:12px;font-weight:700;text-decoration:none;display:inline-flex}.tempo-switch:hover{color:var(--fg);border-color:var(--accent)}.tempo-pos.on{color:var(--fg)}.tempo-knob{background:var(--chip-bg);border-radius:999px;width:26px;height:14px;position:relative;box-shadow:inset 0 1px 2px #00000059}.tempo-knob:after{content:"";background:var(--accent);border-radius:50%;width:10px;height:10px;transition:transform .16s;position:absolute;top:2px;left:2px}.tempo-switch.slow .tempo-knob:after{transform:translate(12px)}.tempo-unit{font-size:10px}@media (prefers-reduced-motion:reduce){.tempo-knob:after{transition:none}}.main-nav{flex-wrap:wrap;gap:4px;display:flex}.nav-link{color:var(--fg-muted);border-radius:999px;padding:8px 12px;font-weight:600;text-decoration:none}.nav-link:hover,.nav-link[aria-current=page]{color:var(--fg);background:var(--chip-bg)}.header-tools{flex-wrap:wrap;align-items:center;gap:12px;margin-left:auto;display:flex}.segmented{background:var(--input-bg);border:1px solid var(--line);border-radius:999px;padding:3px;display:inline-flex}.segmented button{font:inherit;color:var(--fg-muted);cursor:pointer;background:0 0;border:0;border-radius:999px;min-height:32px;padding:6px 12px;font-size:13px;font-weight:650}.segmented button.on{background:var(--panel-hi);color:var(--fg)}.toggle{color:var(--fg-muted);cursor:pointer;align-items:center;gap:6px;font-size:14px;display:inline-flex}.toggle input{width:18px;height:18px;accent-color:var(--accent)}@media (max-width:640px){.brand-name,.brand-sep,.brand-tag{display:none}.site-header,.header-tools{gap:8px}}.narrow{max-width:680px}.page h2{font-size:18px}.panel+.panel{margin-top:16px}.stack-label{flex-direction:column;gap:6px;font-weight:600;display:flex}.error{color:#ffb4a3}.btn-danger{background:#a33c0a;border-color:#0000}.btn-danger:hover{background:#c14a10}.danger{border:1px solid #d55e0059}.mailbox{flex-direction:column;gap:12px;padding:0;list-style:none;display:flex}.mail-text{white-space:pre-wrap;word-break:break-all;font-family:var(--mono);font-size:13px}.calendar{flex-direction:column;gap:12px;padding:0;list-style:none;display:flex}.cal-day{grid-template-columns:150px 1fr auto;align-items:center;gap:20px;padding:20px 22px;display:grid}.cal-day+.cal-day{margin-top:0}.cal-date{flex-direction:column;display:flex}.cal-body p{margin:0 0 4px}.cal-genre{font-size:14px;font-style:italic}.cal-facts{gap:6px;margin:6px 0 10px;font-size:16px;display:grid}.cal-facts>div{grid-template-columns:110px 1fr;align-items:baseline;gap:10px;display:grid}.cal-facts dt{color:var(--fg-muted);font-size:13px;font-weight:600}.cal-facts dd{margin:0}.capacity{background:var(--input-bg);border-radius:999px;height:8px;margin:6px 0;overflow:hidden}.capacity span{background:linear-gradient(90deg, var(--oi-green), var(--oi-orange));height:100%;display:block}@media (max-width:640px){.cal-day{grid-template-columns:1fr;padding:16px}.cal-facts>div{grid-template-columns:96px 1fr}}.day-list tr.now{background:var(--now-bg)}.profile-loops{padding:0;list-style:none}.admin-tabs{flex-wrap:wrap;margin-bottom:16px}.admin-body{gap:16px}.admin-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;display:grid}.plain-list{margin:0;padding:0;list-style:none}.review-item .row{flex-wrap:wrap;align-items:center}.review-item input[type=text]{flex:220px;min-width:0}.report-item.open{border-left:3px solid var(--accent)}.report-reasons{margin:0;padding-left:18px}.tab-badge{color:var(--accent);font-weight:800}tr.now-row{background:var(--now-bg)}.admin-remove{border-top:1px solid var(--line);padding-top:12px}.admin-pre{white-space:pre-wrap;margin:0}fieldset{border:0;margin:0;padding:0}legend{margin-bottom:6px;font-weight:650}.site-footer{border-top:1px solid var(--line);text-align:center;flex-direction:column;align-items:center;gap:8px;padding:20px 16px 28px;display:flex}.site-footer nav{flex-wrap:wrap;justify-content:center;gap:6px 18px;display:flex}.site-footer a{color:var(--fg-muted);font-size:14px}.how{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-top:28px;display:grid}.how h2{font-size:17px}.how p{color:var(--fg-muted);margin:0}.how .panel+.panel{margin-top:0}.transport-more summary{cursor:pointer;color:var(--fg-muted);padding:6px 0;font-weight:650}.transport-more[open]{flex-direction:column;gap:10px;display:flex}.stats{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;display:grid}.stat{border-radius:var(--radius-m);background:var(--input-bg);border:1px solid var(--line);flex-direction:column;gap:4px;padding:12px;display:flex}.stat.warn{border-color:var(--oi-vermillion)}.stat-label{color:var(--fg-muted);text-transform:uppercase;letter-spacing:.06em;font-size:12px}.stat-value{font-weight:650}.stars{vertical-align:middle;align-items:center;gap:1px;display:inline-flex}.stars-text{font-variant-numeric:tabular-nums;opacity:.8;margin-left:6px;font-size:12px}.stars-none{font-size:12px}.rate-song{flex-wrap:wrap;align-items:center;gap:8px 16px;display:flex}.rate-stars{align-items:center;gap:2px;display:inline-flex}.rate-stars .muted{margin-right:6px;font-size:13px}.rate-star{cursor:pointer;background:0 0;border:0;border-radius:8px;place-items:center;width:36px;height:36px;padding:0;display:inline-grid}.rate-star:hover,.rate-star:focus-visible{background:var(--chip-bg)}.rate-reason{font-size:13px}.fame-page .segmented{margin:8px 0 16px}.fame-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:16px;display:grid}.fame-grid>.panel{margin:0}.fame-list{gap:8px;margin:0;padding:0;list-style:none;display:grid}.fame-list li{grid-template-columns:32px 1fr auto;align-items:center;gap:10px;display:grid}.fame-name{min-width:0;display:grid}.fame-name>a{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.fame-rank{font-variant-numeric:tabular-nums;background:var(--chip-bg);border-radius:50%;place-items:center;width:28px;height:28px;font-weight:700;display:inline-grid}.fame-rank.top1{color:#1a1300;background:#e69f00}.fame-rank.top2{color:#15181e;background:#c9ced8}.fame-rank.top3{color:#1d1006;background:#b9773a}.profile-fame{align-items:center;gap:4px;display:flex}@media (max-width:640px){.fame-list li{grid-template-columns:28px 1fr}.fame-list li .stars,.fame-list li .stars-none{grid-column:2}}.cookie-banner{z-index:50;border:1px solid var(--line);background:var(--panel);max-width:960px;color:var(--fg);border-radius:16px;flex-wrap:wrap;align-items:center;gap:12px 20px;margin:0 auto;padding:16px 18px;display:flex;position:fixed;bottom:16px;left:16px;right:16px;box-shadow:0 12px 40px #00000073}.cookie-text{flex:380px;min-width:0}.cookie-text p{margin:4px 0 0;font-size:14px}.cookie-actions{flex-wrap:wrap;gap:8px;display:flex}.cookie-row{border:1px solid var(--line);border-radius:12px;grid-template-columns:auto 1fr;align-items:start;gap:10px;padding:10px 12px;display:grid}.cookie-row>span{gap:2px;display:grid}.cookie-row.locked{opacity:.8}.cookie-row input{width:18px;height:18px;margin-top:3px}.link-button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0;text-decoration:underline}@media (max-width:640px){.cookie-banner{bottom:8px;left:8px;right:8px}.cookie-actions{width:100%}.cookie-actions .btn{flex:auto}}.legal-placeholder-note{border:2px dashed var(--oi-orange);border-radius:var(--radius-m);margin:12px 0 20px;padding:12px 16px}.profile-page{gap:16px;display:grid}.profile-head{grid-template-columns:auto 1fr;align-items:start;gap:20px;display:grid}.profile-head h1{margin:0}.profile-id{gap:6px;min-width:0;display:grid}.profile-id p{margin:0}.profile-badges{flex-wrap:wrap}.profile-bio{white-space:pre-line;overflow-wrap:anywhere;max-width:60ch}.profile-id a[data-testid=profile-link]{overflow-wrap:anywhere}.fame-chip{font-weight:700;text-decoration:none}.fame-chip.top1{color:#1a1300;background:#e69f00}.fame-chip.top2{color:#15181e;background:#c9ced8}.fame-chip.top3{color:#1d1006;background:#b9773a}.profile-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;display:grid}.stat{justify-items:start;gap:4px;padding:14px 16px;display:grid}.stat-value{font-variant-numeric:tabular-nums;font-size:28px;font-weight:800}.stat-label{text-transform:uppercase;letter-spacing:.05em;opacity:.7;font-size:12px}.profile-songs{grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:12px;margin:0;padding:0;list-style:none;display:grid}.song-card{box-sizing:border-box;gap:8px;height:100%;padding:14px;display:grid}.song-card canvas{max-width:100%;height:auto}.song-title{font-weight:700}.song-meta{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.profile-editor textarea,.profile-editor input{box-sizing:border-box;width:100%}.avatar{border-radius:50%;flex:none}@media (max-width:640px){.profile-head{grid-template-columns:1fr}.profile-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.stat-value{font-size:22px}}.header-user{align-items:center;gap:6px}.header-avatar{border-radius:50%;display:inline-flex}.profile-page .panel+.panel,.profile-page .panel .panel{margin-top:0}.stat .stars{flex-wrap:wrap;row-gap:2px}.site-footer .link-button{color:var(--fg-muted);font-size:14px}.admin-page{gap:16px;display:grid}.admin-page>*{min-width:0}.admin-nav{border-radius:var(--radius-m);background:var(--panel);flex-wrap:wrap;align-items:center;gap:6px;padding:6px;display:flex}.admin-nav-title{opacity:.8;padding:0 10px;font-weight:800}.admin-nav-link{color:var(--fg);border-radius:10px;padding:8px 14px;text-decoration:none}.admin-nav-link.on{background:var(--accent);color:var(--accent-fg);font-weight:700}.admin-page h1,.admin-page>p{margin:0}.table-scroll{overflow-x:auto}.planner-table{border-collapse:collapse;width:100%;font-size:14px}.planner-table th,.planner-table td{text-align:left;vertical-align:top;border-bottom:1px solid var(--line);padding:8px 10px}.planner-table .today-row{background:var(--now-bg-soft)}.planner-alts{display:block}.planner-status,.planner-actions{flex-wrap:wrap;gap:4px;display:flex}.planner-tools{flex-wrap:wrap;align-items:center;gap:12px}.chip-accent{background:var(--accent);color:var(--accent-fg)}.chip-ok{background:#009e7340}.role-fieldset{border:1px solid var(--line);border-radius:var(--radius-m);min-width:0;margin:0;padding:10px 12px}.role-fieldset legend{padding:0 6px;font-weight:700}.day-editor select,.lab-setup select{max-width:100%}.lab-setup{gap:12px;display:grid}.lab-roles{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:12px;display:grid}.lab-roles .role-fieldset{gap:8px;display:grid}.lab-actions{flex-wrap:wrap;align-items:center;gap:8px}.lab-kits{grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:10px;display:grid}.lab-kit{border:1px solid var(--line);border-radius:var(--radius-m);gap:6px;padding:12px;display:grid}.lab-kit.on{border-color:var(--accent)}.lab-kit header{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.lab-kit p{margin:0}.lab-families{gap:8px;display:grid}.lab-family{grid-template-columns:140px 1fr;align-items:center;gap:8px;display:grid}.lab-family .row{flex-wrap:wrap;gap:6px}.lab-family-name{text-transform:uppercase;letter-spacing:.04em;opacity:.7;font-size:12px;font-weight:700}@media (max-width:640px){.lab-family{grid-template-columns:1fr}}.demo-panel{z-index:40;max-width:min(340px,100vw - 32px);position:fixed;bottom:16px;left:16px}.demo-pill{font:inherit;border:1px solid var(--line);background:var(--accent);color:var(--accent-fg);cursor:pointer;border-radius:999px;padding:8px 14px;font-size:13px;font-weight:800;box-shadow:0 6px 20px #00000059}.demo-body{border-radius:var(--radius-m);border:1px solid var(--line);background:var(--panel);gap:10px;margin-top:8px;padding:14px;display:grid;box-shadow:0 12px 40px #00000073}.demo-body p{margin:0}.demo-panel{flex-direction:column-reverse;align-items:flex-start;display:flex}.demo-panel .demo-body{margin:0 0 8px}.like-btn{border:1px solid var(--line);background:var(--card);min-width:32px;height:32px;color:var(--muted,currentColor);font:inherit;cursor:pointer;transition:transform var(--t-fast,.12s) var(--ease-bounce,ease-out), border-color var(--t-fast,.12s);border-radius:999px;justify-content:center;align-items:center;gap:6px;padding:0 6px;font-weight:700;display:inline-flex}.like-btn.with-label{padding:0 12px 0 10px}.like-btn:hover{border-color:var(--like,#ff3b6b);color:var(--like,#ff3b6b);transform:scale(1.08)}.like-btn.liked{border-color:var(--like,#ff3b6b);color:var(--like,#ff3b6b)}.like-btn.liked svg{animation:like-pop .32s var(--ease-bounce,ease-out)}.like-btn:disabled{cursor:progress;opacity:.6}@keyframes like-pop{0%{transform:scale(.6)}60%{transform:scale(1.25)}to{transform:scale(1)}}[data-motion=calm] .like-btn.liked svg{animation:none}.inserts{border-top:1px solid var(--line);flex-wrap:wrap;gap:12px 22px;margin-top:12px;padding-top:12px;display:flex}.insert{align-items:center;gap:10px;display:flex}.insert label{gap:4px;display:grid}.insert-label{text-transform:uppercase;letter-spacing:.08em;opacity:.75;font-size:12px}.preview-bar{z-index:45;font:inherit;border:1px solid var(--line);background:var(--accent);color:var(--accent-fg);cursor:pointer;border-radius:999px;padding:10px 16px;font-weight:800;position:fixed;bottom:16px;right:16px;box-shadow:0 8px 24px #00000059}.countdown-days{align-items:center;gap:14px;margin:12px 0 18px}.countdown-display{gap:6px;margin-bottom:14px;padding:18px 20px;display:grid}.countdown-rank{letter-spacing:.04em;font-size:44px;font-weight:800;line-height:1}.countdown-song{font-size:15px}.countdown-progress{background:#7fffe626;border-radius:2px;height:4px;overflow:hidden}.countdown-progress>span{background:var(--oled-fg);height:100%;box-shadow:0 0 8px var(--oled-glow);display:block}.countdown-controls{gap:10px;margin-bottom:18px}.countdown-list{gap:4px;margin:0;padding:0;list-style:none;display:grid}.countdown-list li{border-radius:var(--radius-s);background:var(--panel);align-items:center;gap:8px;padding-right:10px;display:flex}.countdown-list li.now{outline:2px solid var(--accent)}.countdown-row{min-width:0;color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:none;flex:1;grid-template-columns:52px minmax(0,1fr) auto auto;align-items:center;gap:10px;padding:9px 10px;display:grid}.countdown-num{font-variant-numeric:tabular-nums;font-weight:800}.countdown-title{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.countdown-likes{color:#ff7a9a;font-weight:700}@media (max-width:640px){.countdown-row{grid-template-columns:44px minmax(0,1fr) auto}.countdown-row .muted{display:none}}.mixtape-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin:18px 0;padding:0;list-style:none;display:grid}.mixtape-tile{border-radius:var(--radius-m);min-height:132px;transition:transform var(--t-fast) var(--ease-bounce);gap:4px;padding:14px 16px;text-decoration:none;display:grid;box-shadow:inset 0 1px #ffffff59,0 6px 18px #0000002e}.mixtape-tile:hover,.mixtape-tile:focus-visible{transform:translateY(-2px)}.mixtape-tile.empty{background:var(--panel);color:var(--fg-muted);box-shadow:var(--panel-shadow)}.mixtape-date{font-size:17px;font-weight:800}.mixtape-genre{opacity:.8;font-size:13px}.mixtape-top{text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:14px;display:-webkit-box;overflow:hidden}.mixtape-meta{opacity:.85;margin-top:auto;font-size:12px;font-weight:700}.mixtape-more{text-align:center}.countdown-display .today-vis{height:48px}.cassette{fill:none;width:min(300px,100%);stroke:var(--oled-fg);stroke-width:1.6px;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 3px var(--oled-glow));margin:2px auto 8px;display:block;overflow:visible}.cassette .faint{opacity:.55}.cassette-pack{stroke-dasharray:2 2.5;opacity:.8}.cassette-name,.cassette-side{fill:var(--oled-fg);stroke:none;font-family:var(--mono);letter-spacing:.06em;font-size:10px}.cassette-side{opacity:.6;font-size:8px}.cassette-hub{animation:1.8s linear infinite paused cassette-spin}.cassette.playing .cassette-hub{animation-play-state:running}.cassette-tape{stroke-dasharray:5 4;animation:.9s linear infinite paused cassette-run}.cassette.playing .cassette-tape{animation-play-state:running}@keyframes cassette-spin{to{transform:rotate(360deg)}}@keyframes cassette-run{to{stroke-dashoffset:-18px}}@media (prefers-reduced-motion:reduce){.cassette-hub,.cassette-tape{animation:none}}.tape-list{gap:8px;margin:8px 0 22px;padding:0;list-style:none;display:grid}.tape-row{color:var(--fg);align-items:center;gap:12px;padding:12px 16px;text-decoration:none;display:flex}.tape-row .muted{margin-left:auto}.tape-icon{color:var(--accent);font-size:18px}.tape-create{align-items:flex-end;margin:12px 0 8px}.tape-head{justify-content:space-between;align-items:center}.tape-choices{gap:6px;margin:0;padding:0;list-style:none;display:grid}.tape-choices .btn{text-align:left;justify-content:flex-start;width:100%}.countdown-controls .spacer{flex:1}.tape-page .countdown-list li>.btn{flex:none}:root{--grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.07 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");--brushed:repeating-linear-gradient(90deg, #ffffff03 0px, #ffffff03 1px, #00000003 1px, #00000003 3px)}[data-skin=studio]{--bg:var(--grain), var(--brushed), radial-gradient(1200px 700px at 20% -10%, #3a3b3f 0%, transparent 60%), linear-gradient(180deg, #2a2b2e 0%, #1f2022 100%);--fg:#eceae6;--fg-muted:#a5a39e;--link:#8ccbf2;--focus:#f0e442;--line:#ffffff14;--panel:var(--grain), linear-gradient(180deg, #37383c 0%, #2e2f32 100%);--panel-hi:#404145;--panel-shadow:inset 0 1px 0 #ffffff17, inset 0 -1px 0 #00000059, 0 1px 0 #0006, 0 10px 30px #00000059;--input-bg:#1c1d1f;--btn-bg:linear-gradient(180deg, #47484c 0%, #3a3b3f 100%);--btn-bg-hover:linear-gradient(180deg, #525357 0%, #434448 100%);--btn-border:#ffffff1a;--btn-fg:#eceae6;--btn-shadow:inset 0 1px 0 #ffffff24, 0 3px 0 #18191b, 0 6px 14px #0000004d;--accent:#76b8a3;--accent-hi:#8fcab7;--accent-fg:#0f1f1a;--accent-shadow:inset 0 1px 0 #ffffff59, 0 3px 0 #3f7a67, 0 8px 24px #76b8a34d;--now-bg:#76b8a324;--now-bg-soft:#76b8a317;--chip-bg:#ffffff14;--chip-fg:#dedcd6;--wizard-bg:#cc79a733;--wizard-fg:#f0b6d6;--oled-bg:#07090b;--oled-fg:#7ee8c9;--oled-glow:#7ee8c973;--oled-shadow:inset 0 0 0 2px #0f1318, inset 0 6px 18px #000c, 0 1px 0 #ffffff0f;--card:linear-gradient(180deg, #3b3c40 0%, #323337 100%);--card-now:linear-gradient(180deg, #43392a 0%, #322f2c 100%);--lane-fade:#313235;--header-bg:#1e1f21e0}[data-skin=hifi]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:radial-gradient(1400px 800px at 15% -20%, #fff 0%, transparent 60%), repeating-linear-gradient(90deg, #00000002 0px, #00000002 1px, transparent 1px, transparent 3px), linear-gradient(180deg, #f2f3f5 0%, #e3e6ea 100%);--fg:#1d2127;--fg-muted:#5b6370;--link:#0a64a8;--focus:#0072b2;--line:#141e2d1a;--panel:linear-gradient(180deg, #fff 0%, #f5f6f8 100%);--panel-hi:#fff;--panel-shadow:inset 0 1px 0 #fff, 0 0 0 1px #141e2d0f, 0 1px 2px #141e2d0f, 0 12px 32px #141e2d14;--input-bg:#fff;--btn-bg:linear-gradient(180deg, #fff 0%, #e9ecf0 100%);--btn-bg-hover:linear-gradient(180deg, #fff 0%, #f1f3f6 100%);--btn-border:#141e2d24;--btn-fg:#1d2127;--btn-shadow:inset 0 1px 0 #fff, 0 1px 0 #141e2d1f, 0 4px 10px #141e2d14;--accent:#e07800;--accent-hi:#f08a10;--accent-fg:#1d1100;--accent-shadow:inset 0 1px 0 #ffffff59, 0 1px 0 #a65800, 0 6px 18px #e0780040;--chip-bg:#141e2d0f;--chip-fg:#39414d;--wizard-bg:#cc79a724;--wizard-fg:#8a3a66;--oled-bg:#07090b;--oled-fg:#7ee8c9;--oled-glow:#7ee8c973;--oled-shadow:inset 0 0 0 2px #0f1318, inset 0 6px 18px #000c, 0 1px 0 #ffffffe6;--card:linear-gradient(180deg, #2c3446 0%, #252c3b 100%);--card-now:linear-gradient(180deg, #3a3224 0%, #2b2a2a 100%);--lane-fade:#1c2028;--header-bg:#f8f9fbe6}[data-skin=hifi] .river-lane,[data-skin=hifi] .track-grid,[data-skin=hifi] .lane-scroll,[data-skin=hifi] .pads,[data-skin=hifi] .oled{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--fg:#eef1f7;--fg-muted:#9aa3b5;--line:#ffffff14;--chip-bg:#ffffff14;--chip-fg:#d9deea;--wizard-bg:#cc79a733;--wizard-fg:#f0b6d6;color:var(--fg)}[data-skin=hifi] .river-lane{background:linear-gradient(#20252f 0%,#191d25 100%);box-shadow:inset 0 2px 10px #00000080,0 1px #fff}[data-skin=hifi] .error{color:#b3261e}[data-skin=hifi] .countdown-likes,[data-skin=hifi] .encore-chip{color:#c2185b}[data-skin=hifi] .step,[data-skin=hifi] .lane-cell{border-color:#141e2d1f}[data-skin=hifi] .segmented button.on{color:#fff;background:linear-gradient(#3a3f48 0%,#23272e 100%);box-shadow:inset 0 1px #ffffff1f}[data-skin=zoo]{--bg:radial-gradient(1100px 600px at 80% -10%, #2f5a3c 0%, transparent 60%), linear-gradient(180deg, #17301f 0%, #10231a 100%);--fg:#fbf6e9;--fg-muted:#c9d8c2;--link:#ffd77a;--focus:#f0e442;--line:#fbf6e924;--panel:linear-gradient(180deg, #24432e 0%, #1c3725 100%);--panel-hi:#2f5a3c;--panel-shadow:inset 0 0 0 3px #0c1a11, 0 8px 0 #0b170f, 0 14px 28px #00000059;--input-bg:#102117;--btn-bg:linear-gradient(180deg, #f6e7b8 0%, #e9d394 100%);--btn-bg-hover:linear-gradient(180deg, #fff1c6 0%, #f0dc9f 100%);--btn-border:#0c1a11;--btn-fg:#1d1606;--btn-shadow:0 4px 0 #0c1a11;--accent:#e69f00;--accent-hi:#f5b324;--accent-fg:#1d1606;--accent-shadow:0 4px 0 #0c1a11, 0 8px 22px #e69f0059;--chip-bg:#fbf6e924;--chip-fg:#fbf6e9;--wizard-bg:#cc79a747;--wizard-fg:#ffd3ea;--oled-bg:#0b1a10;--oled-fg:#c8f2a8;--oled-glow:#c8f2a859;--oled-shadow:inset 0 0 0 3px #050d08, 0 4px 0 #050d08;--card:linear-gradient(180deg, #2b4f36 0%, #22402c 100%);--card-now:linear-gradient(180deg, #5a4a14 0%, #3f3510 100%);--header-bg:#10231ae6}[data-skin=zoo] .btn{border-width:3px;font-weight:800}[data-skin=zoo] .btn-ghost{color:var(--fg);border-color:var(--line);box-shadow:none;background:0 0}[data-skin=zoo] .river-card{border:3px solid #0c1a11;border-radius:20px}[data-skin=zoo] .river-list tr.now{background:#e69f002e}[data-skin=zoo] .pad{background:radial-gradient(120% 90% at 50% 15%,#ffffff2e,#0000 60%),linear-gradient(#3f6b4a,#2b4f36);border:3px solid #0c1a11;border-radius:22px}[data-skin=zoo] .lane-fade.left{background:linear-gradient(90deg,#1e3a28 10%,#0000)}[data-skin=zoo] .lane-fade.right{background:linear-gradient(270deg,#1e3a28 0%,#0000)}[data-skin=zoo] .track-grid{background:#13281a}.zoo-stage{border:3px solid #0c1a11;border-radius:22px;margin:0 0 16px;overflow:hidden;box-shadow:0 6px #0b170f}[data-skin=eigenbloom]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:radial-gradient(1100px 700px at 12% -12%, #00788c38 0%, transparent 60%), radial-gradient(900px 600px at 95% 8%, #00aaff1f 0%, transparent 60%), radial-gradient(1200px 800px at 50% 115%, #ffaa3c12 0%, transparent 60%), linear-gradient(180deg, #071015 0%, #04080b 100%);--fg:#e9f6f8;--fg-muted:#98b3ba;--link:#7fe9ff;--focus:#ffe36e;--line:#8cdceb1f;--panel:linear-gradient(180deg, #122a349e 0%, #0a18209e 100%);--panel-hi:#1c3e4cb3;--panel-shadow:inset 0 1px 0 #c8f5ff1f, inset 0 0 0 1px #78dcf01a, 0 12px 36px #00000073;--input-bg:#040c10d9;--btn-bg:linear-gradient(180deg, #224a58d9 0%, #14323ed9 100%);--btn-bg-hover:linear-gradient(180deg, #2a5a6ae6 0%, #1a3e4ce6 100%);--btn-border:#8cdceb33;--btn-fg:#e9f6f8;--btn-shadow:inset 0 1px 0 #ffffff1f, 0 2px 0 #00000073, 0 6px 16px #00000059;--accent:#33e6ff;--accent-hi:#7af0ff;--accent-fg:#04161c;--accent-shadow:inset 0 1px 0 #fff6, 0 2px 0 #0b8ea3, 0 0 22px #33e6ff59;--chip-bg:#8cdceb1a;--chip-fg:#d4eef2;--wizard-bg:#ffb43c29;--wizard-fg:#ffd58a;--oled-bg:#030709;--oled-fg:#8ff3ff;--oled-glow:#78f0ff80;--oled-shadow:inset 0 0 0 1px #50c8e640, inset 0 6px 18px #000000d9, 0 0 18px #00aadc1f;--card:linear-gradient(180deg, #16323ee6 0%, #0e222ce6 100%);--card-now:linear-gradient(180deg, #463412eb 0%, #1e221eeb 100%);--lane-fade:#0a161c;--header-bg:#050c10bd}[data-skin=eigenbloom] .panel,[data-skin=eigenbloom] .site-header,[data-skin=eigenbloom] .modal{-webkit-backdrop-filter:blur(14px)saturate(140%)}[data-skin=eigenbloom] .segmented button.on{color:#04161c;background:linear-gradient(#46e9ff 0%,#18bcd6 100%);box-shadow:0 0 14px #33e6ff66}[data-skin=eigenbloom] .error{color:#ff9478}.eigenbloom-backdrop{z-index:-1;pointer-events:none;background:#030709;position:fixed;inset:0}.eigenbloom-backdrop.failed{display:none}.eigenbloom-backdrop canvas{display:block}[data-skin=eigenbloom]{--glass:#040e136b;--glass-strong:#040e1394;--glass-edge:#96e6f52e;--glass-blur:blur(16px) saturate(150%)}html[data-skin=eigenbloom]{background:var(--bg);background-attachment:fixed}[data-skin=eigenbloom] body{background:0 0}[data-skin=eigenbloom] .glass,[data-skin=eigenbloom] .today.oled,[data-skin=eigenbloom] .river-actions,[data-skin=eigenbloom] .river-lane,[data-skin=eigenbloom] .river-list,[data-skin=eigenbloom] .how-toggle,[data-skin=eigenbloom] .site-footer,[data-skin=eigenbloom] main.page:not(.river-page){background:var(--glass);border:1px solid var(--glass-edge);-webkit-backdrop-filter:var(--glass-blur);border-radius:16px;box-shadow:inset 0 1px #dcfaff14,0 12px 36px #00000059}[data-skin=eigenbloom] .today.oled{background:var(--glass-strong)}[data-skin=eigenbloom] .river-actions{padding:12px 16px}[data-skin=eigenbloom] .river-actions .muted{color:#c9e2e7}[data-skin=eigenbloom] .river-lane{-webkit-mask-image:linear-gradient(90deg,#0000 0,#000 7% 95%,#0000 100%);mask-image:linear-gradient(90deg,#0000 0,#000 7% 95%,#0000 100%)}[data-skin=eigenbloom] .lane-fade{display:none}@media (min-width:700px) and (min-height:700px){[data-skin=eigenbloom] .river-page .river-lane{z-index:5;width:min(1368px,100% - 32px);position:fixed;bottom:12px;left:50%;transform:translate(-50%)}[data-skin=eigenbloom] .river-page:has(.river-lane){padding-bottom:240px}}[data-skin=eigenbloom] .river-card{background:#122c388c;border:1px solid #96e6f533;box-shadow:inset 0 1px #dcfaff1a,0 8px 20px #0000004d}[data-skin=eigenbloom] .river-card.now{border-color:var(--oled-fg);box-shadow:0 0 0 1px var(--oled-glow), 0 0 6px var(--oled-glow), 0 0 14px var(--oled-glow), inset 0 1px 0 #dcfaff1a}[data-skin=eigenbloom] .river-list{padding:8px}[data-skin=eigenbloom] main.page:not(.river-page){width:calc(100% - 32px);margin-top:16px;margin-bottom:16px}[data-skin=eigenbloom] main.page:not(.river-page) .panel{-webkit-backdrop-filter:none;background:#0a1c2473}[data-skin=eigenbloom] .site-footer{border-bottom:0;border-radius:16px 16px 0 0}[data-skin=eigenbloom] .how-toggle{margin:16px auto 0;padding:4px 6px;display:table}.eigenbloom-shapes{margin:16px 0;padding:12px 14px}.eigenbloom-caption{letter-spacing:.06em;text-transform:uppercase;color:#c9e2e7;margin:0 0 10px;font-size:12px}.shape-picker{flex-wrap:wrap;gap:6px;display:flex}.shape-picker button{color:#c6e6ec;cursor:pointer;background:#0c20288c;border:1px solid #8cdceb38;border-radius:10px;flex:none;width:40px;height:40px;padding:6px}.shape-picker button:hover{color:#fff;border-color:#78f0ff99}.shape-picker button[aria-checked=true]{color:#7af0ff;border-color:#33e6ff;box-shadow:0 0 12px #33e6ff73}.shape-picker button:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.shape-picker svg{width:100%;height:100%;display:block}@media (max-width:600px){.shape-picker button{width:36px;height:36px}}html[data-immersive] body{overflow:hidden}html[data-immersive] #root>:not(.eigenbloom-backdrop):not(.immersive-exit){display:none!important}.immersive-exit{top:max(12px, env(safe-area-inset-top));right:max(12px, env(safe-area-inset-right));z-index:10000;-webkit-backdrop-filter:blur(12px);transition:opacity .6s;position:fixed}.immersive-exit.hidden{opacity:0;pointer-events:none}.eigenbloom-shapes-head{justify-content:space-between;align-items:center;margin-bottom:10px}.eigenbloom-shapes-head .eigenbloom-caption{margin:0}.today{flex-wrap:wrap;justify-content:space-between;gap:16px;padding:14px 18px;font-size:14px;display:flex}.today-main{flex-wrap:wrap;align-items:baseline;gap:12px;min-width:0;display:flex}.today-label{text-transform:uppercase;letter-spacing:.12em;opacity:.75;font-size:12px}.today-sound{opacity:.62;transition:opacity 1.4s,text-shadow 1.4s,color 1.4s}.today-sound.used{opacity:1;color:#fff;text-shadow:0 0 6px var(--oled-glow), 0 0 14px var(--oled-glow)}[data-motion=calm] .today-sound{transition:opacity .6s}.today-side{flex-wrap:wrap;gap:18px;display:flex}.river-actions{flex-wrap:wrap;align-items:center;gap:16px;margin:22px 0;display:flex}.join-btn{min-height:56px;padding:0 30px;font-size:18px}.join-btn.playing{background:var(--btn-bg);color:var(--btn-fg);box-shadow:var(--btn-shadow)}.view-switch{margin-left:auto}.river-lane{border-radius:var(--radius-l);background:var(--panel);height:196px;box-shadow:var(--panel-shadow);contain:strict;position:relative;overflow:hidden}.river-track{will-change:transform;position:absolute;inset:0}.river-card{border-radius:var(--radius-m);border:1px solid var(--line);background:var(--card);height:152px;color:var(--fg);text-align:left;font:inherit;cursor:pointer;transition:opacity var(--t-med), transform var(--t-fast) var(--ease-bounce), border-color 1.4s ease, box-shadow 1.4s ease;flex-direction:column;gap:8px;padding:12px;display:flex;position:absolute;top:22px;box-shadow:inset 0 1px #ffffff0f,0 6px 16px #00000040}.river-card:hover{transform:translateY(-2px)}.river-card.now{border-color:var(--oled-fg);box-shadow:0 0 0 1px var(--oled-glow), 0 0 6px var(--oled-glow), 0 0 14px var(--oled-glow), inset 0 0 18px #ffffff0a}.river-card.past{opacity:.45}.card-top{justify-content:space-between;align-items:center;gap:8px;display:flex}.card-author{white-space:nowrap;text-overflow:ellipsis;font-weight:700;overflow:hidden}.card-meta{align-items:center;gap:6px;display:flex}.card-slot{font-family:var(--mono);color:var(--fg-muted);margin-left:auto;font-size:12px}.mini-notes{background:#00000038;border-radius:6px;display:block}.playhead{background:var(--oi-yellow);pointer-events:none;border-radius:3px;width:3px;margin-left:-1.5px;position:absolute;top:8px;bottom:8px;left:50%;box-shadow:0 0 14px #f0e442b3}.lane-fade{pointer-events:none;width:18%;position:absolute;top:0;bottom:0}.lane-fade.left{background:linear-gradient(90deg, var(--lane-fade,#1f2431) 10%, transparent);left:0}.lane-fade.right{background:linear-gradient(270deg, var(--lane-fade,#1f2431) 0%, transparent);width:8%;right:0}.river-list tr.now{background:var(--now-bg)}.now-chip{margin-left:8px}.wizard-share .share-bar{background:var(--input-bg);border-radius:999px;height:10px;margin-top:6px;overflow:hidden}.wizard-share .share-bar span{background:linear-gradient(90deg, var(--oi-purple), var(--oi-sky));height:100%;display:block}.small{font-size:13px}@media (max-width:640px){.river-lane{height:168px}.river-card{height:128px;top:20px}.join-btn{width:100%}.view-switch{margin-left:0}}.river-card.has-like .card-meta{padding-right:34px}.lane-like{z-index:2;position:absolute;top:132px}.lane-like.past{opacity:.6}@media (max-width:640px){.lane-like{top:108px}.river-card.has-like .card-slot{display:none}}.today-vis{flex:1 0 100%;width:100%;height:52px;margin-top:2px;display:block}@media (max-width:640px){.today-vis{height:40px}}.encore-meter{flex-direction:column;flex:1;gap:4px;min-width:0;font-size:12px;font-weight:700;display:flex}.encore-text{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.encore-bar{background:#ffffff1f;border-radius:3px;height:5px;overflow:hidden}.encore-bar>span{height:100%;transition:width var(--t-med,.24s) ease-out;background:#ff3b6b;border-radius:3px;display:block}.encore-meter.full .encore-text,.encore-meter.done{color:#ff7a9a}.encore-chip{color:#ff7a9a;border-color:#ff3b6b99}.river-page{flex-direction:column;display:flex}.how-toggle{flex-wrap:wrap;justify-content:center;gap:8px;margin:auto 0 0;padding-top:28px;display:flex}.how[hidden]{display:none}.lane-tape{font-size:18px;font-weight:800;line-height:1}.river-card.has-like.now .card-meta{padding-right:76px}.river-card{justify-content:space-between}.card-band-space{flex:1}.river-band,.band-notes,.band-break{pointer-events:none;height:74px;position:absolute;top:58px}.river-band{z-index:2;background:linear-gradient(#ffffff09,#ffffff12);border-top:1px solid #ffffff14;border-bottom:1px solid #ffffff14}.band-notes{z-index:3;display:block}.band-notes.past,.band-break.past{opacity:.45}.band-break{z-index:3;background:#009e7314;transition:background .4s}.band-break i{background:#009e73;border-radius:1px;width:2px;height:6px;margin-left:-1px;position:absolute}.band-break.live{background:#ffdc781f}.band-break.live i{animation:.46s ease-out both break-flash;animation-delay:var(--d)}@keyframes break-flash{0%{box-shadow:none;background:#009e73}18%{background:#fffbe0;transform:scaleY(2.2);box-shadow:0 0 8px 3px #ffeca0f2,0 0 22px 6px #00e6b48c}to{background:#f0e442;transform:scaleY(1);box-shadow:0 0 4px #f0e44299}}[data-motion=calm] .band-break.live i{background:#f0e442;animation:none}.playhead{z-index:4}@media (max-width:640px){.river-band,.band-notes,.band-break{height:48px;top:60px}}.river-card.mine{box-shadow:0 0 0 2px var(--accent), 0 6px 18px #00000040}.mine-chip{background:var(--accent);color:#1a1a1a;margin-left:6px;font-weight:700}.support-option h3{margin:0}.support-address{border-radius:var(--radius-s);background:var(--input-bg);font-family:var(--mono);overflow-wrap:anywhere;-webkit-user-select:all;user-select:all;padding:8px 10px;font-size:13px;display:block}.editor-head{flex-wrap:wrap;justify-content:space-between;gap:12px;padding:12px 16px;font-size:13px;display:flex}.muted-oled{opacity:.7}.transport{flex-direction:column;gap:12px;margin:16px 0;padding:14px 16px;display:flex}.btn.rec{color:#ff9a8a}.btn.rec.on{color:#fff;background:#d55e00;box-shadow:0 0 22px #d55e008c}.field{color:var(--fg-muted);align-items:center;gap:8px;font-size:14px;display:inline-flex}.field select{min-height:34px;padding:4px 8px}.mono{font-family:var(--mono)}.editor-main{grid-template-columns:minmax(0,1fr) 340px;align-items:start;gap:16px;display:grid}.track-grid{border-radius:var(--radius-l);height:min(640px,70vh);box-shadow:var(--panel-shadow);background:#1a1f2a;position:relative;overflow:hidden auto}.track-grid:focus-visible{outline-offset:-3px}.track-grid-inner{position:relative}.track-grid canvas{display:block}.grid-playhead{pointer-events:none;position:absolute;inset:0}.lane-tools{z-index:1;gap:4px;display:flex;position:absolute;right:8px}.lane-tools .btn-small{color:#eef1f7;background:#3a4258;border:1px solid #ffffff2e;min-height:22px;padding:0 8px;font-size:12px}.editor-side{flex-direction:column;gap:16px;display:flex}.pads{border-radius:var(--radius-l);box-shadow:var(--panel-shadow);background:linear-gradient(#232938,#1b202b);grid-template-columns:repeat(4,1fr);gap:10px;padding:14px;display:grid}.pad{aspect-ratio:1;cursor:pointer;font:inherit;color:#e9edf6;box-shadow:inset 0 2px 0 #ffffff1a, inset 0 -3px 0 #00000059, 0 4px 0 #141821, 0 0 calc(var(--glow,0) * 28px) var(--pad);transition:transform var(--t-fast) var(--ease-bounce), box-shadow var(--t-fast);touch-action:none;background:radial-gradient(120% 90% at 50% 15%,#ffffff24,#0000 60%),linear-gradient(#3b4458,#2c3344);border:0;border-radius:14px;position:relative;overflow:hidden}.pad:after{content:"";border-radius:inherit;background:var(--pad);opacity:calc(var(--glow,0) * .55);mix-blend-mode:screen;pointer-events:none;position:absolute;inset:0}.pad.hit{box-shadow:inset 0 2px 0 #ffffff1a, 0 1px 0 #141821, 0 0 28px var(--pad);transform:translateY(3px)scale(.96)}.pad-key{font-family:var(--mono);opacity:.6;font-size:11px;position:absolute;top:6px;left:8px}.pad-name{text-align:center;white-space:nowrap;text-overflow:ellipsis;font-size:11px;font-weight:600;position:absolute;bottom:6px;left:6px;right:6px;overflow:hidden}.mix-panel select{width:100%}.knobs{grid-template-columns:repeat(5,1fr);gap:2px;margin-top:12px;display:grid}.knob{cursor:ns-resize;touch-action:none;-webkit-user-select:none;user-select:none;border-radius:10px;flex-direction:column;align-items:center;gap:2px;padding:2px;display:flex}.knob-label{font-size:11px;font-weight:650}.knob-value{font-family:var(--mono);color:var(--fg-muted);font-size:11px}.knob-led{filter:drop-shadow(0 0 3px var(--accent))}@media (max-width:980px){.editor-main{grid-template-columns:1fr}}.submit-panel{margin:16px 0 0}.submit-panel.ok{border:1px solid #009e7380}.rejected{border-left:4px solid var(--oi-vermillion);margin-bottom:12px;padding-left:12px}.notice{color:var(--oi-yellow)}.wizard-panel{border:1px solid #cc79a759;flex-direction:column;gap:10px;margin-bottom:16px;display:flex}.wizard-head h2{margin:0}.editor-below{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:16px;margin-top:16px;display:grid}.editor-below>:only-child{grid-column:1/-1}.editor-below .wizard-panel,.editor-below .submit-panel{margin:0}@media (max-width:980px){.editor-below{grid-template-columns:1fr}}.editor-phone{flex-direction:column;gap:12px;display:flex}.phone-editor{flex-direction:column;gap:10px;padding:12px;display:flex}.phone-sounds,.phone-notes,.phone-bars{gap:6px;padding-bottom:4px;display:flex;overflow-x:auto}.chip-btn{font:inherit;white-space:nowrap;border:1px solid var(--line);background:var(--chip-bg);color:var(--fg);cursor:pointer;border-radius:999px;min-height:36px;padding:6px 12px;font-size:13px;font-weight:600}.chip-btn.on{background:var(--accent);color:var(--accent-fg)}.chip-btn.inst{border-color:#56b4e980}.phone-steps{grid-template-columns:repeat(8,1fr);gap:6px;display:grid}.step{aspect-ratio:1;border:1px solid var(--line);cursor:pointer;background:#2a3141;border-radius:8px}.step.beat{background:#323a4d}.step.on{background:var(--oi-green);box-shadow:0 0 12px #009e7399}@media (max-width:640px){.transport .row{gap:8px}.transport .btn{min-height:40px;padding:0 12px;font-size:14px}.pads{gap:8px;padding:10px}}.sound-picker{gap:8px;display:grid}.sound-title{margin:0;font-size:15px}.sound-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;display:grid}.sound-role{text-transform:uppercase;letter-spacing:.04em;opacity:.75;grid-column:1/-1;font-size:11px;font-weight:700}.sound-picker .chip-btn{text-overflow:ellipsis;min-height:32px;padding:4px 6px;font-size:12px;overflow:hidden}.sound-picker .chip-btn:disabled{opacity:.55;cursor:default}.song-panel{gap:8px;display:grid}.song-row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.song-label{text-transform:uppercase;letter-spacing:.04em;opacity:.75;min-width:64px;font-size:11px;font-weight:700}.pattern-tabs{gap:6px;display:flex}.pattern-tab{font:inherit;border:1px solid var(--line);background:var(--chip-bg);min-width:52px;min-height:36px;color:var(--fg);cursor:pointer;border-radius:10px;align-items:baseline;gap:6px;padding:4px 12px;display:inline-flex}.pattern-tab strong{font-size:16px}.pattern-tab.on{background:var(--accent);color:var(--accent-fg);border-color:#0000}.pattern-count{opacity:.75;font-variant-numeric:tabular-nums;font-size:11px}.sections{flex:420px;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none;display:grid}.section{border:1px dashed var(--line);border-radius:10px;gap:4px;padding:6px;display:grid}.section-bars{opacity:.7;font-variant-numeric:tabular-nums;font-size:11px}.section .segmented button{flex:1;min-width:0;padding-inline:4px}.song-length{font-variant-numeric:tabular-nums;font-size:12px}@media (max-width:640px){.sections{grid-template-columns:repeat(2,minmax(0,1fr))}}.note-lane{--lane-row:34px;flex-direction:column;gap:8px;display:flex}.lane-controls{flex-direction:column;gap:6px;display:flex}.chip-btn.has:not(.on){border-color:#56b4e9b3}.lane-chords{align-items:center;gap:6px;display:inline-flex}.lane-scroll{max-height:calc(var(--lane-row) * 9 + 8px);overscroll-behavior:contain;border-radius:var(--radius-m);border:1px solid var(--line);background:#1c212c;overflow-y:auto}.lane-grid{gap:2px;padding:2px;display:grid}.lane-label{font-family:var(--mono);color:var(--muted,#9aa3b5);justify-content:flex-end;align-items:center;padding-right:6px;font-size:11px;display:flex;position:sticky;left:0}.lane-label.tonic{color:var(--fg);font-weight:700}.lane-cell{cursor:pointer;background:#283041;border:none;border-radius:5px;min-width:0;padding:0}.lane-cell.beat{background:#2f3850}.lane-cell.tonic{background:#333c52}.lane-cell:active{background:#46506a}.lane-note{z-index:1;background:var(--oi-sky);color:#0b1220;font:inherit;text-align:left;white-space:nowrap;cursor:pointer;border:none;border-radius:6px;padding:0 6px;font-size:11px;font-weight:700;overflow:hidden;box-shadow:0 0 10px #56b4e973}.lane-note.continues{opacity:.85;border-top-left-radius:0;border-bottom-left-radius:0}.lane-hint{margin:0}[data-skin=zoo] .lane-note{background:var(--oi-green,#009e73);color:#fff}.wizard-magic{color:#fff;font:inherit;cursor:pointer;text-shadow:0 1px 2px #28005080;transition:transform var(--t-fast) var(--ease-bounce);background:linear-gradient(115deg,#5b2bd1,#a43be0 35%,#e45fb4 65%,#f3b94d) 0 0/240% 240%;border:0;border-radius:999px;align-items:center;gap:10px;margin-left:auto;padding:9px 22px 9px 16px;font-size:17px;font-weight:800;line-height:1.1;animation:7s ease-in-out infinite wizard-shimmer,3s ease-in-out infinite wizard-glow;display:inline-flex;position:relative;box-shadow:inset 0 0 0 1px #ffffff4d,0 0 16px #b84ce68c,0 0 40px #6c34dc59}.wizard-magic:hover{transform:translateY(-1px)scale(1.04)}.wizard-magic:active{transform:scale(.98)}.wizard-magic:focus-visible{outline-offset:3px;outline:3px solid #f3c35b}.wizard-star{filter:drop-shadow(0 0 6px #ffe68ce6);font-size:20px;animation:3s ease-in-out infinite wizard-star}.wizard-label{flex-direction:column;align-items:flex-start;display:flex}.wizard-sub{letter-spacing:.02em;opacity:.85;font-size:11px;font-weight:600}.wizard-sparkles{pointer-events:none;position:absolute;inset:-6px}.wizard-sparkles i{opacity:0;background:radial-gradient(circle,#fff 0 30%,#ffecaacc 45%,#0000 70%);border-radius:50%;width:6px;height:6px;animation:2.6s ease-in-out infinite wizard-twinkle;position:absolute}.wizard-sparkles i:first-child{animation-delay:0s;top:4%;left:6%}.wizard-sparkles i:nth-child(2){animation-delay:.9s;top:-2%;left:44%}.wizard-sparkles i:nth-child(3){animation-delay:1.7s;top:10%;right:8%}.wizard-sparkles i:nth-child(4){animation-delay:.4s;bottom:0;right:22%}.wizard-sparkles i:nth-child(5){animation-delay:1.3s;bottom:-2%;left:28%}.wizard-sparkles i:nth-child(6){animation-delay:2.1s;top:52%;left:-1%}@keyframes wizard-shimmer{0%,to{background-position:0%}50%{background-position:100%}}@keyframes wizard-glow{0%,to{box-shadow:inset 0 0 0 1px #ffffff4d,0 0 14px #b84ce680,0 0 34px #6c34dc4d}50%{box-shadow:inset 0 0 0 1px #ffffff73,0 0 22px #e45fb4bf,0 0 56px #8246f080}}@keyframes wizard-twinkle{0%,to{opacity:0;transform:scale(.4)}45%{opacity:1;transform:scale(1.3)}}@keyframes wizard-star{0%,to{transform:rotate(0)scale(1)}50%{transform:rotate(-12deg)scale(1.12)}}.wizard-panel.wizard-arrived{animation:1.6s ease-out wizard-arrive}@keyframes wizard-arrive{0%{box-shadow:0 0 0 3px #e45fb4e6,0 0 40px #8246f099}to{box-shadow:0 0 #0000}}[data-motion=calm] .wizard-magic,[data-motion=calm] .wizard-star,[data-motion=calm] .wizard-sparkles i,[data-motion=calm] .wizard-panel.wizard-arrived{animation:none}[data-motion=calm] .wizard-sparkles i{opacity:.7}@media (max-width:640px){.wizard-magic{justify-content:center;width:100%;margin-left:0}}.stage-panel{margin-top:12px}.stage-head{align-items:center;gap:6px;margin-bottom:8px}.stage{touch-action:none;-webkit-user-select:none;user-select:none;width:100%;height:auto;display:block}.stage-floor{fill:#05090a;stroke:#78ffe640}.stage-centre{stroke:#78ffe62e;stroke-dasharray:3 4}.stage-hint{fill:#96f0e1bf;font-size:9px}.stage-listener{fill:#96f0e1cc}.stage-dot{cursor:grab;outline:none}.stage-dot circle{fill:#50e6d238;stroke:#6ff3dc;stroke-width:1.5px}.stage-dot text{fill:#c9fff4;pointer-events:none;font-size:9px}.stage-dot.inst-bass circle,.stage-dot.inst-chords circle,.stage-dot.inst-lead circle,.stage-dot.inst-classic circle{fill:#ffc44038;stroke:#ffc440}.stage-dot.inst-atmos circle{fill:#9b8cf238;stroke:#b3a6ff}.stage-dot.selected circle,.stage-dot:focus-visible circle{stroke-width:3px;fill-opacity:.6}.segmented.key-switch{vertical-align:middle;box-shadow:none;background:0 0;border:1px solid #ffffff38;display:inline-flex}.segmented.key-switch button{color:inherit;background:0 0;min-height:0;padding:2px 10px;font-family:inherit;font-size:12px}.segmented.key-switch button.on{color:#fff;box-shadow:none;background:#ffffff29}.legal{line-height:1.6}.legal-nav ul{border-bottom:1px solid var(--line,#7f7f7f4d);flex-wrap:wrap;gap:4px 16px;margin:0 0 20px;padding:0 0 12px;font-size:14px;list-style:none;display:flex}.legal-nav a[aria-current=page]{color:var(--fg);font-weight:700;text-decoration:none}.legal-subtitle{margin-top:-.3em}.legal-draft{border:1px solid var(--accent,#e69f00);border-radius:var(--radius-s,8px);background:var(--chip-bg,transparent);border-left-width:5px;margin:16px 0 8px;padding:10px 14px}.legal-effective{font-size:14px}.legal mark.placeholder{background:var(--accent,#e69f00);color:var(--accent-fg,#1a1205);-webkit-box-decoration-break:clone;box-decoration-break:clone;border-radius:4px;padding:0 4px;font-weight:600}.legal h2{margin-top:1.8em}.legal h3{margin-top:1.4em;font-size:16px}.legal li+li{margin-top:4px}.legal address{margin:0 0 1em;font-style:normal}.legal code{font-family:var(--mono);overflow-wrap:anywhere;font-size:.92em}.legal a{overflow-wrap:anywhere}.legal-dl{margin:0 0 1em}.legal-dl dt{margin-top:10px;font-weight:650}.legal-dl dd{border-left:2px solid var(--line,#7f7f7f4d);margin:2px 0 0;padding-left:14px}.legal-format{border-radius:var(--radius-s,8px);background:var(--input-bg,transparent);border:1px solid var(--line,#7f7f7f4d);font-family:var(--mono);overflow-wrap:anywhere;padding:8px 12px;font-size:14px}.tour{z-index:1000;pointer-events:none;position:fixed;inset:0}.tour-dim,.tour-spotlight{pointer-events:none;position:fixed}.tour-dim{background:#04070e8c;inset:0}.tour-spotlight{border-radius:12px;animation:2.4s ease-in-out infinite tour-ring;box-shadow:0 0 0 9999px #04070e8c,0 0 0 2px #f3c35b,0 0 22px 4px #f3c35b8c}@keyframes tour-ring{0%,to{box-shadow:0 0 0 9999px #04070e8c,0 0 0 2px #f3c35b,0 0 18px 3px #f3c35b73}50%{box-shadow:0 0 0 9999px #04070e8c,0 0 0 3px #ffd77a,0 0 30px 8px #f3c35ba6}}.tour-bubble{background:var(--panel-hi,#404145);width:min(340px,100vw - 24px);color:var(--fg);pointer-events:auto;border:1px solid #f3c35b8c;border-radius:16px;padding:14px 16px 12px;position:fixed;box-shadow:0 18px 50px #00000080,0 0 0 1px #0003}.tour-bubble h2{margin:4px 0 6px;font-size:17px}.tour-bubble p{margin:0 0 10px;font-size:14px;line-height:1.5}.tour-meta{letter-spacing:.06em;text-transform:uppercase;color:var(--fg);justify-content:space-between;font-size:11px;font-weight:700;display:flex}.tour-dots{flex-wrap:wrap;gap:4px;margin-bottom:10px;display:flex}.tour-dots i{background:var(--fg-muted);opacity:.35;border-radius:50%;width:6px;height:6px}.tour-dots i.done{opacity:.7}.tour-dots i.on{opacity:1;background:#f3c35b;transform:scale(1.3)}.tour-actions{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.tour-actions .spacer{flex:1}.tour-skip{font:inherit;color:var(--fg);cursor:pointer;background:0 0;border:0;padding:4px 0;font-size:13px;text-decoration:underline}.tour-arrow{background:var(--panel-hi,#404145);border:1px solid #f3c35b8c;width:14px;height:14px;margin-left:-7px;position:absolute;transform:rotate(45deg)}.tour-bubble.side-below .tour-arrow{border-bottom:0;border-right:0;top:-8px}.tour-bubble.side-above .tour-arrow{border-top:0;border-left:0;bottom:-8px}.tour-menu{position:relative}.tour-menu>summary{cursor:pointer;list-style:none}.tour-menu>summary::-webkit-details-marker{display:none}.tour-menu>summary span{border:1.5px solid;border-radius:50%;place-items:center;width:20px;height:20px;font-size:12px;font-weight:800;display:inline-grid}.tour-menu-list{z-index:30;background:var(--panel-hi,#404145);border-radius:14px;flex-direction:column;gap:4px;width:250px;padding:6px;display:flex;position:absolute;top:calc(100% + 6px);right:0;box-shadow:0 14px 40px #00000073}.tour-menu-list button{color:var(--fg);font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:10px;flex-direction:column;align-items:flex-start;gap:2px;padding:10px 12px;display:flex}.tour-menu-list button:hover,.tour-menu-list button:focus-visible{background:#f3c35b29}.tour-menu-list button span{color:var(--fg);opacity:.85;font-size:13px}.tour-welcome{z-index:40;border:1px solid #f3c35b80;max-width:320px;position:fixed;bottom:16px;left:16px;box-shadow:0 14px 40px #00000073}.tour-welcome p{margin:0 0 10px}.tour-settings{flex-direction:column;gap:10px;margin:0;padding:0;list-style:none;display:flex}.tour-settings li{justify-content:space-between;align-items:center;gap:12px;display:flex}.tour-settings p{margin:2px 0 0}.editor-head-side{flex-basis:100%;justify-content:space-between;align-items:center}.editor-tour-btn{min-height:28px;color:inherit;border-color:#ffffff40}[data-motion=calm] .tour-spotlight{animation:none}@media (max-width:640px){.tour-welcome{max-width:none;right:16px}}
