:root{--infinity-color:#5a4fcf}:root[data-theme=dark]{--bg-gradient-start:#3c006e;--bg-gradient-end:#123c78;--blob-opacity:.12;--blob-blur:90px;--blob-color-a:#78a0dc;--blob-color-b:#3c006e59;--blob-color-c:#483d8bcc;--blob-color-d:#1e90ff;--blob-color-e:indigo;--blob-color-f:#87cefacc;--blob-color-g:#1e90ff99;--blob-color-h:#4b0082cc;--panel-bg:#080a1ca6;--panel-border:#7864dc2e;--panel-blur:12px;--panel-shadow:0 20px 60px #00000059, 0 4px 20px #00000040;--text-primary:#f4f9ff;--text-secondary:#e0e6f5;--text-accent:#4a9eff;--text-muted:#888;--text-accent-soft:#c0b8ff;--btn-bg:linear-gradient(145deg, #1f1c55, #141414);--btn-border:#34084d;--btn-active-bg:linear-gradient(145deg, #003b8b, #0052cc);--btn-active-border:#07f;--btn-active-glow:#005cff99;--btn-hover-border:#788cff66;--btn-text-shadow:0 1px 2px #000000b3;--btn-box-shadow:2px 2px 4px #00000080, inset 0 0 10px #ffffff1a;--select-bg:#0d0b1e;--select-border:#34084d;--select-border-hover:#5a3d8a;--select-border-focus:#7a5daa;--select-focus-glow:#7a5daa66;--status-bg:#14122899;--status-border:#6450c833;--info-bg:#14122866;--info-border:#6450c833;--info-divider:#6450c826;--info-value:#7a9fff;--expand-btn-bg:#0a081eb3;--expand-btn-border:#6450c866;--arrow-bg:#0a081eb3;--arrow-border:#6450c859;--arrow-color:#c0b8ff;--arrow-hover-border:#8c78ffb3;--arrow-hover-color:#e0d8ff;--library-bg:#080618f7;--library-border:#6450c84d;--library-header-border:#6450c833;--library-scrollbar:#6450c84d;--loop-item-bg:#14103099;--loop-item-border:#6450c833;--loop-item-hover-bg:#1e1840b3;--loop-item-hover-border:#7a9fff73;--login-btn-bg:linear-gradient(145deg, #1a1060, #0d0b1e);--login-btn-border:#6450c880;--login-btn-hover-bg:linear-gradient(145deg, #251880, #120e2e);--avatar-bg:#0a081e99;--avatar-border:#6450c859;--dropdown-bg:#0c0a1ef2;--dropdown-border:#6450c859;--dropdown-name-border:#6450c826;--logout-hover-bg:#6450c826;--viz-min-brightness:60}:root[data-theme=light]{--bg-gradient-start:#dce6ff;--bg-gradient-end:#ede8ff;--blob-opacity:.12;--blob-blur:100px;--blob-color-a:#78a0ff40;--blob-color-b:#a078ff33;--blob-color-c:#78a0ff33;--blob-color-d:#648cff4d;--blob-color-e:#8c64ff33;--blob-color-f:#b4c8ff4d;--blob-color-g:#648cff33;--blob-color-h:#8c64ff33;--panel-bg:#ebf0ffb3;--panel-border:#0000002e;--panel-blur:10px;--panel-shadow:0 14px 40px #00000029;--text-primary:#1a1f36;--text-secondary:#3f485f;--text-accent:#2a56f6;--text-muted:#999;--text-accent-soft:#3d4fa0;--btn-bg:linear-gradient(145deg, #fff, #c8d4ee);--btn-border:#0000004d;--btn-active-bg:linear-gradient(145deg, #1f4fff, #3a78ff);--btn-active-border:#1f4fff;--btn-active-glow:#1f4fff99;--btn-hover-border:#5078ff66;--btn-text-shadow:none;--btn-box-shadow:2px 2px 6px #00000047, inset 0 0 8px #fff9;--select-bg:#f4f7ff;--select-border:#0000002e;--select-border-hover:#2a56f666;--select-border-focus:#2a56f68c;--select-focus-glow:#2a56f640;--status-bg:#cdd7ffe0;--status-border:#00000038;--info-bg:#dce4ffb3;--info-border:#0000001f;--info-divider:#0000001a;--info-value:#2a56f6;--expand-btn-bg:#ebf0ffeb;--expand-btn-border:#2a56f659;--arrow-bg:#ebf0ffeb;--arrow-border:#2a56f64d;--arrow-color:#3d4fa0;--arrow-hover-border:#2a56f6a6;--arrow-hover-color:#1f3a99;--library-bg:#f8fafffc;--library-border:#00000024;--library-header-border:#0000001f;--library-scrollbar:#2a56f640;--loop-item-bg:#dce6ffe6;--loop-item-border:#0000001f;--loop-item-hover-bg:#c8d7fffa;--loop-item-hover-border:#1f4fff73;--login-btn-bg:linear-gradient(145deg, #dce6ff, #ccd8ff);--login-btn-border:#2a56f659;--login-btn-hover-bg:linear-gradient(145deg, #c8d6ff, #b8c8ff);--avatar-bg:#d2dcffd9;--avatar-border:#2a56f64d;--dropdown-bg:#e1e8fffc;--dropdown-border:#2a56f640;--dropdown-name-border:#0000001f;--logout-hover-bg:#2a56f61a;--viz-min-brightness:80}*{box-sizing:border-box;margin:0;padding:0}body{background-image:linear-gradient(135deg, var(--bg-gradient-start), var(--bg-gradient-end));flex-direction:column;justify-content:flex-start;align-items:center;min-height:100vh;padding:68px 20px 20px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;display:flex;position:relative;overflow:hidden}#up{background-image:linear-gradient(80deg, var(--blob-color-a), var(--blob-color-b));width:75px;height:75px;filter:blur(var(--blob-blur));opacity:var(--blob-opacity);z-index:0;border-radius:50%;position:fixed;top:0;left:0}#down{background-image:linear-gradient(80deg, var(--blob-color-c), var(--blob-color-d));width:225px;height:225px;filter:blur(var(--blob-blur));opacity:var(--blob-opacity);z-index:0;border-radius:50%;position:fixed;top:0;right:0}#left{background-image:linear-gradient(80deg, var(--blob-color-e), var(--blob-color-f));width:175px;height:75px;filter:blur(var(--blob-blur));opacity:var(--blob-opacity);z-index:0;border-radius:50%;position:fixed;bottom:0;left:0}#right{background-image:linear-gradient(80deg, var(--blob-color-g), var(--blob-color-h));width:175px;height:75px;filter:blur(var(--blob-blur));opacity:var(--blob-opacity);z-index:0;border-radius:50%;position:fixed;bottom:0;right:0}#visualizerCanvas{z-index:-1;pointer-events:none;background:0 0;width:100%;height:100%;position:fixed;top:0;left:0}@keyframes pulse{0%{box-shadow:0 0 #7a9fff33}50%{box-shadow:0 0 12px #7a9fff59}to{box-shadow:0 0 #7a9fff33}}.container{background:var(--panel-bg);-webkit-backdrop-filter:blur(var(--panel-blur));border:1px solid var(--panel-border);box-shadow:var(--panel-shadow);z-index:1;border-radius:20px;width:100%;max-width:380px;padding:28px;position:relative}.top-bar{z-index:20;pointer-events:none;background:linear-gradient(#00000040,#0000);justify-content:space-between;align-items:center;height:60px;padding:0 20px;display:flex;position:fixed;top:0;left:0;right:0}.top-bar>*{pointer-events:auto}.app-title{color:var(--text-primary);text-shadow:.5px .5px 2px #ffffff73;align-items:center;gap:6px;margin:0;padding:0;font-size:2em;font-weight:600;display:flex}.app-title-link{color:inherit;align-items:center;gap:6px;text-decoration:none;transition:opacity .2s;display:flex}.app-title-link:hover{opacity:.82}.app-title .infinity-svg{vertical-align:middle;flex-shrink:0;width:1.5em;height:1.5em;display:inline-block}.app-title .alpha-badge{color:var(--text-muted);font-size:.45em;font-weight:400;position:relative;top:.6em}.section{margin-bottom:20px}label{color:var(--text-primary);text-shadow:.5px .5px 2px #ffffff59;margin-bottom:8px;font-size:.9em;font-weight:600;display:block}select,input[type=checkbox]{border:1px solid var(--select-border);background:var(--select-bg);width:100%;color:var(--text-primary);cursor:pointer;border-radius:10px;padding:12px;font-size:1em;transition:all .3s}input[type=checkbox]{width:auto}select:hover{border-color:var(--select-border-hover)}select:focus{border-color:var(--select-border-focus);box-shadow:0 0 8px var(--select-focus-glow);outline:none}.style-carousel-wrapper{align-items:center;gap:0;margin-bottom:0;margin-left:-28px;margin-right:-28px;display:flex;position:relative}#carouselSection{opacity:1;max-height:200px;margin-bottom:20px;transition:max-height .5s,opacity .4s;overflow:visible}.container.collapsed #carouselSection{opacity:0;max-height:0;overflow:hidden}.style-carousel-track-container{flex:1;position:relative;overflow:hidden}.style-carousel-track{will-change:transform;gap:6px;transition:transform .3s cubic-bezier(.4,0,.2,1);display:flex}.style-carousel-btn{letter-spacing:.3px;text-align:center;white-space:normal;word-break:break-word;overflow-wrap:break-word;cursor:pointer;border-radius:10px;flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;height:64px;padding:8px 4px;font-size:.8em;font-weight:600;line-height:1.3;transition:all .3s;display:flex;overflow:hidden}.style-carousel-btn.active{opacity:1;background:linear-gradient(145deg,#003b8b,#0052cc);border:1px solid #07f;box-shadow:0 0 12px #005cff99,0 0 25px #005cff66,inset 0 0 5px #fff3}.style-carousel-arrow{background:var(--arrow-bg);border:1px solid var(--arrow-border);color:var(--arrow-color);cursor:pointer;width:32px;height:64px;box-shadow:none;opacity:.9;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;padding:0;font-size:12px;transition:all .2s;display:flex}.style-carousel-arrow:hover:not(:disabled){border-color:var(--arrow-hover-border);color:var(--arrow-hover-color);opacity:1}.style-carousel-arrow:disabled{opacity:.2;pointer-events:none;cursor:default}.style-carousel-arrow.arrow-left{margin-right:4px}.style-carousel-arrow.arrow-right{margin-left:4px}.status{background:var(--status-bg);color:var(--text-secondary);border:1px solid var(--status-border);border-radius:10px;flex-direction:column;justify-content:center;align-items:stretch;gap:2px;height:56px;min-height:56px;margin-bottom:20px;padding:8px 15px;font-size:.9em;line-height:1.4;display:flex;position:relative;overflow:hidden}.status.loading{color:#4a9eff;background:#4a9eff1f;border-color:#4a9eff59}.status.playing{color:#7a9fff;background:#7a9fff1f;border-color:#7a9fff59;animation:2s infinite pulse}.status.error{color:#ff5252;background:#ff52521f;border-color:#ff525259}[data-theme=light] .status.loading{color:#1f4fff;background:#2a56f61f;border-color:#2a56f659}[data-theme=light] .status.playing{color:#2a56f6;background:#2a56f61a;border-color:#2a56f64d}[data-theme=light] .status.error{color:#b91c1c;background:#dc26261f;border-color:#dc262659}.status-top-row{justify-content:center;align-items:center;min-height:20px;display:flex}.status-loop-name{color:var(--text-accent-soft);white-space:nowrap;text-overflow:ellipsis;text-align:center;width:100%;font-size:.85em;font-weight:600;transition:text-shadow .4s;overflow:hidden}.status.playing .status-loop-name{text-shadow:0 0 8px #c0b8ffb3,0 0 16px #7a9fff66;color:#d8d0ff}[data-theme=light] .status.playing .status-loop-name{color:#1a2a8a;text-shadow:none}.status-text{color:var(--text-secondary);text-align:center;white-space:nowrap;text-overflow:ellipsis;font-size:.85em;overflow:hidden}.status-rate{color:var(--text-secondary);white-space:nowrap;font-size:.9em}.status-rate strong{color:var(--text-accent-soft);font-size:1.05em;font-weight:700}.controls{justify-content:center;align-items:center;gap:10px;margin-bottom:20px;display:flex}button{background:var(--btn-bg);border:1px solid var(--btn-border);color:var(--text-primary);text-shadow:var(--btn-text-shadow);box-shadow:var(--btn-box-shadow);cursor:pointer;opacity:.75;border-radius:10px;padding:10px 20px;font-size:18px;transition:all .3s;transform:scale(1)}button:hover:not(:disabled){opacity:.9;border:1px solid var(--btn-hover-border)}button:active:not(:disabled){transform:scale(.97);box-shadow:0 0 10px #0ff9}button.active{background:var(--btn-active-bg);box-shadow:0 0 12px var(--btn-active-glow), 0 0 25px var(--btn-active-glow), inset 0 0 5px #fff3;border:1px solid var(--btn-active-border);opacity:1;color:#fff;transform:scale(1)}button.active:active:not(:disabled){transform:scale(.97)}button:disabled{opacity:.3;cursor:not-allowed;transform:none}.size-btn-row{gap:8px;margin-bottom:15px;padding:0 4px;display:flex}.size-btn{letter-spacing:1px;text-transform:uppercase;border-radius:10px;flex:1;padding:10px 0;font-size:.85em;font-weight:600;transition:all .3s}.size-btn:hover:not(:disabled):not(.active){opacity:.9;border:1px solid #788cff66}.size-btn.active{background:var(--btn-active-bg);box-shadow:0 0 12px var(--btn-active-glow), 0 0 25px var(--btn-active-glow), inset 0 0 5px #fff3;border:1px solid var(--btn-active-border);opacity:1;color:#fff}.btn-generate{text-transform:uppercase;letter-spacing:1px;flex:1;justify-content:center;align-items:center;gap:8px;font-weight:600;display:flex}.generate-spinner{border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;flex-shrink:0;width:14px;height:14px;animation:.7s linear infinite spin;display:none}.btn-generate.generating .generate-spinner{display:inline-block}.btn-tempo{letter-spacing:.5px;padding:10px 14px;font-size:.78em;font-weight:700}.info{background:var(--info-bg);border:1px solid var(--info-border);border-radius:10px;padding:15px;display:none}.info.dev-visible{display:block}#infoTrace{white-space:pre;color:var(--text-secondary);-webkit-user-select:text;user-select:text;cursor:text;max-height:60vh;margin:0;font-family:monospace;font-size:.78em;overflow-y:auto}#selectors{opacity:1;max-height:600px;transition:max-height .5s,opacity .4s;overflow:hidden}.container.collapsed #selectors{opacity:0;max-height:0}.expand-btn{background:var(--expand-btn-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--expand-btn-border);width:48px;height:48px;color:var(--text-primary);cursor:pointer;z-index:10;opacity:0;pointer-events:none;border-radius:50%;justify-content:center;align-items:center;font-size:18px;transition:opacity .3s;display:flex;position:fixed;bottom:30px;right:30px}.expand-btn.visible{opacity:1;pointer-events:auto}.auth-area{align-self:center;align-items:center;gap:6px;margin-top:8px;display:flex}#saveBtn{border:1px solid var(--arrow-border);color:var(--text-accent-soft);cursor:pointer;width:40px;height:48px;box-shadow:none;opacity:.85;background:0 0;border-radius:6px;justify-content:center;align-items:center;padding:4px 8px;font-size:26px;transition:all .2s;display:none;position:absolute;top:50%;right:8px;transform:translateY(-50%)}#saveBtn:hover{border-color:var(--arrow-hover-border);color:var(--arrow-hover-color);opacity:1}#saveBtn.saved{color:#c084fc;border-color:#c084fca6}#saveBtn.saving{opacity:.5;cursor:not-allowed}#saveBtn.disabled-saved{opacity:.45;cursor:default;pointer-events:none}#myLoopsBtn{border:1px solid var(--arrow-border);color:var(--text-accent-soft);cursor:pointer;height:40px;box-shadow:none;opacity:.85;background:0 0;border-radius:8px;justify-content:center;align-self:center;align-items:center;padding:0 12px;font-size:20px;transition:all .2s;display:none}#myLoopsBtn:hover{border-color:var(--arrow-hover-border);color:var(--arrow-hover-color);opacity:1}#libraryPanel{background:var(--library-bg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-left:1px solid var(--library-border);z-index:30;flex-direction:column;width:360px;height:100vh;transition:right .35s cubic-bezier(.4,0,.2,1);display:flex;position:fixed;top:0;right:-380px;overflow:hidden}#libraryPanel.open{right:0}.library-header{border-bottom:1px solid var(--library-header-border);flex-shrink:0;justify-content:space-between;align-items:center;padding:20px 20px 16px;display:flex}.library-title{color:var(--text-primary);letter-spacing:.5px;font-size:1em;font-weight:700}#libraryCloseBtn{color:var(--text-muted);cursor:pointer;box-shadow:none;opacity:1;background:0 0;border:none;border-radius:6px;padding:4px 8px;font-size:18px;transition:color .2s}#libraryCloseBtn:hover{color:var(--text-primary)}#libraryList{flex:1;padding:12px 16px;overflow-y:auto}#libraryList::-webkit-scrollbar{width:4px}#libraryList::-webkit-scrollbar-track{background:0 0}#libraryList::-webkit-scrollbar-thumb{background:var(--library-scrollbar);border-radius:2px}.library-empty{text-align:center;color:#666;padding:40px 20px;font-size:.85em;line-height:1.6}.library-loading{text-align:center;color:#666;padding:40px 20px;font-size:.85em}.loop-item{background:var(--loop-item-bg);border:1px solid var(--loop-item-border);cursor:pointer;border-radius:10px;margin-bottom:10px;padding:12px 14px;transition:all .2s;position:relative}.loop-item:hover{border-color:var(--loop-item-hover-border);background:var(--loop-item-hover-bg)}.loop-item.loading{opacity:.6;cursor:wait}.loop-item-header{justify-content:space-between;align-items:center;margin-bottom:6px;display:flex}.loop-item-style{color:var(--text-accent-soft);font-size:.88em;font-weight:700}.loop-item-delete{color:#555;cursor:pointer;box-shadow:none;opacity:1;background:0 0;border:none;border-radius:4px;padding:2px 6px;font-size:13px;line-height:1;transition:color .2s}.loop-item-delete:hover{color:#ff5252}.loop-item-meta{color:var(--info-value);flex-wrap:wrap;gap:10px;font-size:.78em;display:flex}.loop-item-date{color:var(--text-muted);margin-top:4px;font-size:.75em}#libraryOverlay{z-index:29;background:#0006;display:none;position:fixed;inset:0}#libraryOverlay.visible{display:block}#uploadOverlay{z-index:29;background:#0006;display:none;position:fixed;inset:0}#uploadOverlay.visible{display:block}#loginBtn{background:var(--login-btn-bg);border:1px solid var(--login-btn-border);color:var(--text-accent-soft);cursor:pointer;letter-spacing:.4px;opacity:1;white-space:nowrap;border-radius:20px;align-items:center;gap:8px;height:40px;padding:0 18px;font-size:.9em;font-weight:700;transition:all .25s;display:flex}#loginBtn:hover{border-color:var(--arrow-hover-border);color:var(--arrow-hover-color);background:var(--login-btn-hover-bg)}#userAvatar{cursor:pointer;background:var(--avatar-bg);border:1px solid var(--avatar-border);border-radius:50%;justify-content:center;align-self:center;align-items:center;gap:0;width:44px;height:44px;margin-top:0;padding:3px;transition:border-color .2s;display:none;position:relative}#userAvatar:hover{border-color:var(--arrow-hover-border)}#userAvatarImg{object-fit:cover;border-radius:50%;width:38px;height:38px;display:block}#userAvatarName{display:none}#userDropdown{background:var(--dropdown-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--dropdown-border);border-radius:10px;min-width:140px;display:none;position:absolute;top:calc(100% + 8px);right:0;overflow:hidden;box-shadow:0 8px 24px #0006}#userDropdown.visible{display:block}#userDropdownName{color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;border-bottom:1px solid var(--dropdown-name-border);max-width:160px;padding:10px 16px 6px;font-size:.8em;font-weight:600;overflow:hidden}#logoutBtn{width:100%;color:var(--text-accent-soft);text-align:left;cursor:pointer;box-shadow:none;opacity:1;background:0 0;border:none;border-radius:0;padding:12px 16px;font-size:.85em;font-weight:500;transition:background .2s}#logoutBtn:hover{background:var(--logout-hover-bg);color:var(--arrow-hover-color)}.theme-toggle-btn{background:var(--expand-btn-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--expand-btn-border);color:var(--text-primary);cursor:pointer;width:36px;height:36px;box-shadow:none;opacity:.85;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;padding:0;font-size:16px;transition:all .3s;display:flex}.theme-toggle-btn:hover{opacity:1;border-color:var(--arrow-hover-border)}#uploadBtn{border:1px solid var(--arrow-border);color:var(--text-accent-soft);cursor:pointer;height:40px;box-shadow:none;opacity:.85;background:0 0;border-radius:8px;justify-content:center;align-self:center;align-items:center;padding:0 12px;font-size:20px;transition:all .2s;display:none}#uploadBtn:hover{border-color:var(--arrow-hover-border);color:var(--arrow-hover-color);opacity:1}#uploadPanel{background:var(--library-bg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-left:1px solid var(--library-border);z-index:30;flex-direction:column;width:400px;height:100vh;transition:right .35s cubic-bezier(.4,0,.2,1);display:flex;position:fixed;top:0;right:-420px;overflow:hidden}#uploadPanel.open{right:0}.upload-panel-header{border-bottom:1px solid var(--library-header-border);flex-shrink:0;justify-content:space-between;align-items:center;padding:20px 20px 16px;display:flex}.upload-panel-title{color:var(--text-primary);letter-spacing:.5px;font-size:1em;font-weight:700}#uploadPanelCloseBtn{color:var(--text-muted);cursor:pointer;box-shadow:none;opacity:1;background:0 0;border:none;border-radius:6px;padding:4px 8px;font-size:18px;transition:color .2s}#uploadPanelCloseBtn:hover{color:var(--text-primary)}.upload-panel-body{flex-direction:column;flex:1;gap:14px;padding:16px 20px;display:flex;overflow-y:auto}.upload-panel-body::-webkit-scrollbar{width:4px}.upload-panel-body::-webkit-scrollbar-track{background:0 0}.upload-panel-body::-webkit-scrollbar-thumb{background:var(--library-scrollbar);border-radius:2px}.upload-field{flex-direction:column;gap:6px;display:flex}.upload-field label{color:var(--text-secondary);text-shadow:none;margin:0;font-size:.82em;font-weight:600}.upload-field input[type=text],.upload-field input[type=number],.upload-field select{border:1px solid var(--select-border);background:var(--select-bg);width:100%;color:var(--text-primary);cursor:pointer;border-radius:8px;padding:9px 12px;font-size:.9em;transition:all .2s}.upload-field input[type=text]:focus,.upload-field input[type=number]:focus,.upload-field select:focus{border-color:var(--select-border-focus);box-shadow:0 0 6px var(--select-focus-glow);outline:none}.token-pickers{flex-direction:column;gap:10px;display:flex}.token-picker{background:var(--loop-item-bg);border:1px solid var(--loop-item-border);border-radius:8px;flex-direction:column;gap:6px;padding:10px 12px;display:flex}.token-picker-header{justify-content:space-between;align-items:center;gap:8px;display:flex}.token-picker-label{color:var(--text-accent-soft);text-transform:capitalize;font-size:.82em;font-weight:700}.token-picker-add-btn{background:var(--btn-bg);border:1px dashed var(--arrow-border);color:var(--text-accent-soft);cursor:pointer;box-shadow:none;opacity:.9;white-space:nowrap;border-radius:6px;flex-shrink:0;padding:4px 10px;font-size:.75em;font-weight:600;transition:all .2s}.token-picker-add-btn:hover{border-color:var(--arrow-hover-border);color:var(--arrow-hover-color);opacity:1}.token-picker-hint{color:var(--text-muted);font-size:.72em;font-weight:400}.token-picker-file-list{flex-direction:column;gap:4px;display:flex}.token-picker-error{color:#ff5252;font-size:.75em}.upload-file-item{border:1px solid var(--loop-item-border);background:#ffffff0a;border-radius:6px;align-items:center;gap:8px;padding:6px 10px;display:flex}.upload-file-name{color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:.78em;overflow:hidden}.upload-file-size{color:var(--text-muted);white-space:nowrap;flex-shrink:0;font-size:.72em}.upload-file-remove{color:#555;cursor:pointer;box-shadow:none;opacity:1;background:0 0;border:none;border-radius:4px;flex-shrink:0;padding:2px 5px;font-size:12px;line-height:1;transition:color .2s}.upload-file-remove:hover{color:#ff5252}#uploadConfirmBackdrop{-webkit-backdrop-filter:blur(4px);z-index:55;background:#0000008c;justify-content:center;align-items:center;display:none;position:fixed;inset:0}#uploadConfirmBackdrop.visible{display:flex}#uploadConfirmModal{background:var(--panel-bg);-webkit-backdrop-filter:blur(var(--panel-blur));border:1px solid var(--panel-border);box-shadow:var(--panel-shadow);border-radius:16px;flex-direction:column;gap:14px;width:calc(100% - 40px);max-width:340px;padding:24px 22px 20px;display:flex}#uploadConfirmModal h2{color:var(--text-primary);margin:0;font-size:.95em;font-weight:700}#uploadConfirmSummary{color:var(--text-secondary);margin:0;font-size:.82em;line-height:1.7}#uploadConfirmSummary strong{color:var(--text-primary)}.upload-confirm-btn-row{justify-content:flex-end;gap:10px;display:flex}#uploadConfirmCancelBtn{border:1px solid var(--panel-border);color:var(--text-muted);cursor:pointer;box-shadow:none;opacity:1;background:0 0;border-radius:10px;padding:8px 18px;font-size:.85em;font-weight:600;transition:all .2s}#uploadConfirmCancelBtn:hover{color:var(--text-primary);border-color:var(--arrow-hover-border)}#uploadConfirmProceedBtn{background:var(--btn-active-bg);border:1px solid var(--btn-active-border);color:#fff;cursor:pointer;box-shadow:0 0 10px var(--btn-active-glow);opacity:1;border-radius:10px;padding:8px 18px;font-size:.85em;font-weight:700;transition:all .2s}#uploadConfirmProceedBtn:hover{opacity:.9}.upload-error-msg{color:#ff5252;background:#ff52521a;border:1px solid #ff525240;border-radius:6px;padding:8px 12px;font-size:.82em;display:none}.upload-error-msg.visible{display:block}.upload-success-msg{color:#4caf50;background:#4caf501a;border:1px solid #4caf5040;border-radius:6px;padding:8px 12px;font-size:.82em;display:none}.upload-success-msg.visible{display:block}#uploadSubmitBtn{background:var(--btn-active-bg);border:1px solid var(--btn-active-border);color:#fff;cursor:pointer;box-shadow:0 0 10px var(--btn-active-glow);opacity:1;letter-spacing:.5px;border-radius:10px;justify-content:center;align-items:center;gap:8px;width:100%;padding:12px;font-size:.9em;font-weight:700;transition:all .2s;display:flex}#uploadSubmitBtn:disabled{opacity:.35;cursor:not-allowed;box-shadow:none}#uploadSubmitBtn:not(:disabled):hover{opacity:.9}.upload-spinner{border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:16px;height:16px;animation:.7s linear infinite spin;display:none}.upload-spinner.visible{display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}#tosModalBackdrop{-webkit-backdrop-filter:blur(4px);z-index:50;background:#0000008c;justify-content:center;align-items:center;display:none;position:fixed;inset:0}#tosModalBackdrop.visible{display:flex}#tosModal{background:var(--panel-bg);-webkit-backdrop-filter:blur(var(--panel-blur));border:1px solid var(--panel-border);box-shadow:var(--panel-shadow);border-radius:16px;flex-direction:column;gap:16px;width:calc(100% - 40px);max-width:360px;padding:28px 24px 24px;display:flex;position:relative}#tosModal h2{color:var(--text-primary);margin:0;font-size:1em;font-weight:700}#tosModal p{color:var(--text-secondary);margin:0;font-size:.85em;line-height:1.6}.tos-checkbox-row{align-items:center;gap:10px;display:flex}.tos-checkbox-row input[type=checkbox]{cursor:pointer;border-radius:4px;flex-shrink:0;width:18px;height:18px;padding:0}.tos-checkbox-row label{color:var(--text-primary);cursor:pointer;text-shadow:none;margin:0;font-size:.85em;font-weight:600}.tos-btn-row{justify-content:flex-end;gap:10px;display:flex}#tosCancelBtn{border:1px solid var(--panel-border);color:var(--text-muted);cursor:pointer;box-shadow:none;opacity:1;background:0 0;border-radius:10px;padding:8px 18px;font-size:.85em;font-weight:600;transition:all .2s}#tosCancelBtn:hover{color:var(--text-primary);border-color:var(--arrow-hover-border)}#tosAcceptBtn{background:var(--btn-active-bg);border:1px solid var(--btn-active-border);color:#fff;cursor:pointer;box-shadow:0 0 10px var(--btn-active-glow);opacity:1;border-radius:10px;padding:8px 18px;font-size:.85em;font-weight:700;transition:all .2s}#tosAcceptBtn:disabled{opacity:.35;cursor:not-allowed;box-shadow:none}#tosAcceptBtn:not(:disabled):hover{opacity:.9}.sequence-strip{width:100%;height:52px;margin-top:12px;position:relative;overflow:hidden}.seq-track{will-change:transform;flex-direction:row;gap:3px;height:100%;transition:transform .15s;display:flex}.seq-block{flex-direction:column;flex-shrink:0;gap:2px;display:flex}.seq-label{letter-spacing:.3px;text-transform:uppercase;white-space:nowrap;text-overflow:ellipsis;text-align:left;color:var(--seq-label-color,#888);padding:0 2px;font-size:.62em;font-weight:700;line-height:1;overflow:hidden}.seq-bars-row{flex-direction:row;flex:1;gap:2px;display:flex}.seq-bar{border:1px solid #0000;border-radius:3px;flex-shrink:0;transition:background 80ms,border-color 80ms,box-shadow 80ms}.seq-block.seq-verse{--seq-bg:#4a9eff2e;--seq-border:#4a9eff59;--seq-active-bg:#4a9effa6;--seq-active-border:#4a9effe6;--seq-active-glow:#4a9eff80;--seq-label-color:#4a9eff}.seq-block.seq-chorus{--seq-bg:#c084fc2e;--seq-border:#c084fc59;--seq-active-bg:#c084fca6;--seq-active-border:#c084fce6;--seq-active-glow:#c084fc80;--seq-label-color:#c084fc}.seq-block.seq-bridge{--seq-bg:#34d3992e;--seq-border:#34d39959;--seq-active-bg:#34d399a6;--seq-active-border:#34d399e6;--seq-active-glow:#34d39980;--seq-label-color:#34d399}.seq-block.seq-pre{--seq-bg:#fb923c2e;--seq-border:#fb923c59;--seq-active-bg:#fb923ca6;--seq-active-border:#fb923ce6;--seq-active-glow:#fb923c80;--seq-label-color:#fb923c}.seq-block.seq-intro{--seq-bg:#4ade802e;--seq-border:#4ade8059;--seq-active-bg:#4ade80a6;--seq-active-border:#4ade80e6;--seq-active-glow:#4ade8080;--seq-label-color:#4ade80}.seq-block.seq-ending{--seq-bg:#f871712e;--seq-border:#f8717159;--seq-active-bg:#f87171a6;--seq-active-border:#f87171e6;--seq-active-glow:#f8717180;--seq-label-color:#f87171}.seq-block.seq-unknown{--seq-bg:#94a3b82e;--seq-border:#94a3b859;--seq-active-bg:#94a3b8a6;--seq-active-border:#94a3b8e6;--seq-active-glow:#94a3b880;--seq-label-color:#94a3b8}.seq-bar{background:var(--seq-bg,#94a3b82e);border-color:var(--seq-border,#94a3b859)}.seq-bar.active{background:var(--seq-active-bg,#94a3b8a6);border-color:var(--seq-active-border,#94a3b8e6);box-shadow:0 0 6px var(--seq-active-glow,#94a3b880)}[data-theme=light] .seq-block.seq-verse{--seq-bg:#2a56f61f;--seq-border:#2a56f64d;--seq-active-bg:#2a56f68c;--seq-active-border:#2a56f6d9;--seq-active-glow:#2a56f666;--seq-label-color:#2a56f6}[data-theme=light] .seq-block.seq-chorus{--seq-bg:#9333ea1f;--seq-border:#9333ea4d;--seq-active-bg:#9333ea8c;--seq-active-border:#9333ead9;--seq-active-glow:#9333ea66;--seq-label-color:#9333ea}[data-theme=light] .seq-block.seq-bridge{--seq-bg:#0596691f;--seq-border:#0596694d;--seq-active-bg:#0596698c;--seq-active-border:#059669d9;--seq-active-glow:#05966966;--seq-label-color:#059669}[data-theme=light] .seq-block.seq-pre{--seq-bg:#ea580c1f;--seq-border:#ea580c4d;--seq-active-bg:#ea580c8c;--seq-active-border:#ea580cd9;--seq-active-glow:#ea580c66;--seq-label-color:#ea580c}[data-theme=light] .seq-block.seq-intro{--seq-bg:#16a34a1f;--seq-border:#16a34a4d;--seq-active-bg:#16a34a8c;--seq-active-border:#16a34ad9;--seq-active-glow:#16a34a66;--seq-label-color:#16a34a}[data-theme=light] .seq-block.seq-ending{--seq-bg:#dc26261f;--seq-border:#dc26264d;--seq-active-bg:#dc26268c;--seq-active-border:#dc2626d9;--seq-active-glow:#dc262666;--seq-label-color:#dc2626}[data-theme=light] .seq-block.seq-unknown{--seq-bg:#64748b1f;--seq-border:#64748b4d;--seq-active-bg:#64748b8c;--seq-active-border:#64748bd9;--seq-active-glow:#64748b66;--seq-label-color:#64748b}.song-pattern-overview{scrollbar-width:none;flex-flow:row;justify-content:center;gap:4px;margin-bottom:12px;display:flex;overflow-x:auto}.song-pattern-overview::-webkit-scrollbar{display:none}.spo-block{background:#94a3b82e;border:1px solid #94a3b859;border-radius:6px;flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;gap:2px;min-width:36px;padding:5px 8px;display:flex}.spo-label{letter-spacing:.3px;text-transform:uppercase;color:#888;white-space:nowrap;font-size:.58em;font-weight:700;line-height:1}.spo-bars{color:#888;font-size:.82em;font-weight:700;line-height:1}.spo-block.seq-verse{--spo-bg:#4a9eff2e;--spo-border:#4a9eff59;--spo-color:#4a9eff}.spo-block.seq-chorus{--spo-bg:#c084fc2e;--spo-border:#c084fc59;--spo-color:#c084fc}.spo-block.seq-bridge{--spo-bg:#34d3992e;--spo-border:#34d39959;--spo-color:#34d399}.spo-block.seq-pre{--spo-bg:#fb923c2e;--spo-border:#fb923c59;--spo-color:#fb923c}.spo-block.seq-intro{--spo-bg:#4ade802e;--spo-border:#4ade8059;--spo-color:#4ade80}.spo-block.seq-ending{--spo-bg:#f871712e;--spo-border:#f8717159;--spo-color:#f87171}.spo-block.seq-unknown{--spo-bg:#94a3b82e;--spo-border:#94a3b859;--spo-color:#94a3b8}.spo-block.seq-verse,.spo-block.seq-chorus,.spo-block.seq-bridge,.spo-block.seq-pre,.spo-block.seq-intro,.spo-block.seq-ending,.spo-block.seq-unknown{background:var(--spo-bg);border-color:var(--spo-border)}.spo-block.seq-verse .spo-label,.spo-block.seq-verse .spo-bars,.spo-block.seq-chorus .spo-label,.spo-block.seq-chorus .spo-bars,.spo-block.seq-bridge .spo-label,.spo-block.seq-bridge .spo-bars,.spo-block.seq-pre .spo-label,.spo-block.seq-pre .spo-bars,.spo-block.seq-intro .spo-label,.spo-block.seq-intro .spo-bars,.spo-block.seq-ending .spo-label,.spo-block.seq-ending .spo-bars,.spo-block.seq-unknown .spo-label,.spo-block.seq-unknown .spo-bars{color:var(--spo-color)}[data-theme=light] .spo-block.seq-verse{--spo-bg:#2a56f61f;--spo-border:#2a56f64d;--spo-color:#2a56f6}[data-theme=light] .spo-block.seq-chorus{--spo-bg:#9333ea1f;--spo-border:#9333ea4d;--spo-color:#9333ea}[data-theme=light] .spo-block.seq-bridge{--spo-bg:#0596691f;--spo-border:#0596694d;--spo-color:#059669}[data-theme=light] .spo-block.seq-pre{--spo-bg:#ea580c1f;--spo-border:#ea580c4d;--spo-color:#ea580c}[data-theme=light] .spo-block.seq-intro{--spo-bg:#16a34a1f;--spo-border:#16a34a4d;--spo-color:#16a34a}[data-theme=light] .spo-block.seq-ending{--spo-bg:#dc26261f;--spo-border:#dc26264d;--spo-color:#dc2626}[data-theme=light] .spo-block.seq-unknown{--spo-bg:#64748b1f;--spo-border:#64748b4d;--spo-color:#64748b}@media (width<=380px){button{padding:10px 20px;font-size:14px}.controls{gap:5px}h1{font-size:2em}.container{padding:20px}.style-carousel-wrapper{margin-left:-20px;margin-right:-20px}}