body{font-family:Poppins,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0;padding:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}#root{min-height:100vh}:root{--dreamland-pink:#d4508f;--dreamland-pink-light:#e875aa;--dreamland-pink-lighter:#f5c5d9;--dreamland-pink-bg:#fff5f9;--dreamland-pink-vivid:#e94b93;--dreamland-white:#fff;--dreamland-text:#2d2d2d;--dreamland-text-light:#64748b;--dreamland-text-lighter:#94a3b8;--shadow-xs:0 1px 2px 0 #00000008;--shadow-sm:0 2px 8px -1px #00000012,0 1px 4px 0 #0000000a;--shadow-md:0 4px 16px -2px #0000001a,0 2px 6px -1px #0000000d;--shadow-lg:0 10px 28px -4px #0000001f,0 4px 12px -2px #0000000f;--shadow-xl:0 20px 48px -8px #00000026,0 8px 20px -4px #00000014;--shadow-pink-sm:0 2px 12px #d4508f1f,0 1px 4px #d4508f0f;--shadow-pink-md:0 4px 20px #d4508f29,0 2px 8px #d4508f14;--shadow-pink-lg:0 8px 32px #d4508f33,0 4px 12px #d4508f1a}*{-webkit-tap-highlight-color:transparent;box-sizing:border-box;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;overscroll-behavior:none;touch-action:pan-y}.App{animation:gradient-shift 20s ease infinite;background:linear-gradient(135deg,#fff5f9,#fff5f9 25%,#ffe5f0 50%,#fff5f9 75%,#fff5f9);background:linear-gradient(135deg,#fff5f9 0,var(--dreamland-pink-bg) 25%,#ffe5f0 50%,var(--dreamland-pink-bg) 75%,#fff5f9 100%);background-size:400% 400%;color:#2d2d2d;color:var(--dreamland-text);min-height:100vh;overflow-x:hidden;padding-bottom:env(safe-area-inset-bottom);position:relative}@keyframes gradient-shift{0%,to{background-position:0 50%}50%{background-position:100% 50%}}.app-header{backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);background:#fffffffa;border-bottom:1px solid #d4508f1f;box-shadow:0 2px 12px -2px #d4508f14,0 1px 4px 0 #0000000a;gap:.75rem;padding:calc(1rem + env(safe-area-inset-top)) 1rem 1.25rem;position:-webkit-sticky;position:sticky;top:0;transition:all .3s cubic-bezier(.4,0,.2,1);z-index:100}.app-header,.header-content{display:flex;flex-direction:column}.header-content{align-items:center;gap:0;width:100%}.logo-container{align-items:center;display:flex;justify-content:center}.logo-image{filter:drop-shadow(0 3px 12px rgba(212,80,143,.35));height:100px;object-fit:contain;transition:all .3s cubic-bezier(.4,0,.2,1);width:auto}.logo-image:hover{filter:drop-shadow(0 4px 16px rgba(212,80,143,.45));transform:translateY(-1px)}.title-container{align-items:center;display:flex;justify-content:center}.app-title{display:none}.app-subtitle{color:#d4508f;color:var(--dreamland-pink);font-size:.875rem;font-weight:700;letter-spacing:.12em;line-height:1.5;margin-top:.5rem;max-width:100%;opacity:.95;text-align:center;text-shadow:0 1px 3px #d4508f26;text-transform:uppercase;white-space:normal}.header-controls{gap:.5rem;width:100%}.folder-btn,.header-controls,.refresh-btn{align-items:center;display:flex;justify-content:center}.folder-btn,.refresh-btn{background:linear-gradient(135deg,#fff,#fffafd);border:1px solid #d4508f26;border-radius:8px;box-shadow:0 2px 4px 0 #d4508f0f,0 1px 2px 0 #0000000a;color:#d4508f;color:var(--dreamland-pink);cursor:pointer;flex:1 1;font-size:.75rem;font-weight:600;gap:.375rem;max-width:180px;min-height:38px;overflow:hidden;padding:.5rem .875rem;position:relative;transition:all .2s cubic-bezier(.4,0,.2,1);white-space:nowrap}.folder-btn:hover,.refresh-btn:hover{border-color:#d4508f4d;box-shadow:0 4px 8px 0 #d4508f1f,0 2px 4px 0 #0000000f;transform:translateY(-1px)}.folder-btn:active,.refresh-btn:active{background:linear-gradient(135deg,#d4508f,#e94b93);background:linear-gradient(135deg,var(--dreamland-pink) 0,var(--dreamland-pink-vivid) 100%);border-color:#d4508f;border-color:var(--dreamland-pink);box-shadow:0 1px 3px 0 #d4508f4d;color:#fff;transform:scale(.98) translateY(0)}.folder-info{display:none}.main-controls-row{grid-gap:1rem;align-items:stretch;display:grid;gap:1rem;grid-template-columns:1fr auto;margin:.875rem 1.25rem}.background-section,.performances-section{background:linear-gradient(135deg,#fff,#fffcfe);border:1px solid #d4508f1f;border-radius:16px;box-shadow:0 4px 12px -2px #d4508f14,0 2px 6px 0 #0000000d,inset 0 0 0 1px #ffffff80;margin:.875rem 1.25rem;padding:1.25rem 1.5rem;position:relative;transition:all .6s cubic-bezier(.4,0,.2,1)}.background-section.split-layout{margin:0}.performance-counter-card{align-items:center;background:linear-gradient(135deg,#d4508f1a,#ffb6c10f);border:1px solid #d4508f2e;border-radius:16px;box-shadow:0 4px 12px -2px #d4508f2e,0 2px 6px 0 #d4508f1a,inset 0 0 0 1px #fff9;display:flex;flex-direction:column;gap:.5rem;justify-content:center;min-width:180px;overflow:hidden;padding:1.25rem 1.75rem;position:relative;transition:all .4s cubic-bezier(.4,0,.2,1)}.performance-counter-card:before{background:radial-gradient(circle at 50% 0,#d4508f0f 0,#0000 60%);bottom:0;content:"";left:0;opacity:0;pointer-events:none;position:absolute;right:0;top:0;transition:opacity .4s ease}.performance-counter-card:hover{border-color:#d4508f40;box-shadow:0 6px 20px -2px #d4508f40,0 4px 10px 0 #d4508f26,inset 0 0 0 1px #ffffffb3;transform:translateY(-2px)}.performance-counter-card:hover:before{opacity:1}.counter-label{font-size:.75rem;font-weight:700;letter-spacing:.05em;opacity:.9;text-transform:uppercase}.counter-label,.counter-value{color:#d4508f;color:var(--dreamland-pink)}.counter-value{font-size:2.5rem;font-weight:900;letter-spacing:-.02em;line-height:1;position:relative;text-shadow:0 3px 6px #d4508f40,0 1px 2px #d4508f26;z-index:1}.counter-sublabel{color:#64748b;color:var(--dreamland-text-light);font-size:.6875rem;font-weight:600;opacity:.8}.background-section.is-playing{animation:edge-glow 2s ease-in-out infinite;border:1px solid #d4508f66}@keyframes edge-glow{0%,to{border-color:#d4508f66;box-shadow:0 0 0 1px #d4508f33,0 0 0 2px #d4508f26,0 0 0 3px #d4508f1a,0 2px 8px -2px #0000000f}50%{border-color:#d4508f99;box-shadow:0 0 0 1px #d4508f4d,0 0 0 3px #d4508f33,0 0 0 5px #d4508f1f,0 2px 8px -2px #0000000f}}.section-header{align-items:center;border-bottom:none;display:flex;gap:.75rem;justify-content:space-between;margin-bottom:1rem;padding-bottom:0}.section-title{color:#d4508f;color:var(--dreamland-pink);font-size:.9375rem;font-weight:800;letter-spacing:.04em;margin-bottom:0;opacity:1;text-shadow:0 1px 2px #d4508f1a;text-transform:uppercase}.section-subtitle{color:#64748b;color:var(--dreamland-text-light);display:none;font-size:.75rem;font-weight:500}.bg-status-badge{border-radius:12px;box-shadow:0 2px 8px #00000014,0 1px 3px #0000000a;font-size:.75rem;font-weight:700;letter-spacing:.06em;overflow:hidden;padding:.375rem .875rem;position:relative;text-transform:uppercase;transition:all .3s cubic-bezier(.4,0,.2,1);white-space:nowrap}.bg-status-badge:before{animation:shimmer 3s infinite;background:linear-gradient(45deg,#0000 30%,#ffffff4d 50%,#0000 70%);content:"";height:200%;left:-50%;pointer-events:none;position:absolute;top:-50%;width:200%}@keyframes shimmer{0%{transform:translateX(-100%) translateY(-100%)}to{transform:translateX(100%) translateY(100%)}}.bg-status-badge.playing{background:linear-gradient(135deg,#ec4899,#db2777);box-shadow:0 3px 12px #ec489966,0 1px 4px #db277733;color:#fff}.bg-status-badge.queued{background:linear-gradient(135deg,#f472b6,#ec4899);box-shadow:0 3px 12px #f472b666,0 1px 4px #ec489933;color:#fff}.bg-status-badge.ready{background:linear-gradient(135deg,#fffffff2,#fffafdd9);border:1px solid #d4508f40;box-shadow:0 2px 8px #d4508f1f,0 1px 3px #0000000a;color:#d4508f;color:var(--dreamland-pink)}.bg-status-badge.idle{background:linear-gradient(135deg,#ffffffb3,#f8f8fa99);border:1px solid #0000001f;color:#64748b;color:var(--dreamland-text-light)}.bg-music-container{grid-gap:1rem;align-items:start;display:grid;gap:1rem;grid-template-columns:1fr auto}.bg-select{grid-column:1/-1;position:relative;z-index:10}.bg-controls{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:auto 1fr}.track-select{appearance:none;-webkit-appearance:none;background:#ffffffe6;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='10' height='6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m1 1 4 4 4-4' stroke='%23d4508f' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-position:right .75rem center;background-repeat:no-repeat;border:1px solid #d4508f1a;border-radius:8px;box-shadow:0 2px 8px -1px #00000012,0 1px 4px 0 #0000000a,inset 0 0 0 1px #ffffff80;box-shadow:var(--shadow-sm),0 0 0 1px #ffffff80 inset;color:#2d2d2d;color:var(--dreamland-text);cursor:pointer;font-size:.875rem;font-weight:600;min-height:40px;outline:none;padding:.625rem 2rem .625rem .75rem;transition:all .2s cubic-bezier(.4,0,.2,1);width:100%}.track-select:focus{border-color:#d4508f;border-color:var(--dreamland-pink);box-shadow:0 0 0 4px #d4508f1f,0 4px 16px -2px #0000001a,0 2px 6px -1px #0000000d;box-shadow:0 0 0 4px #d4508f1f,var(--shadow-md);transform:translateY(-1px)}.track-select option{background:#fff;color:#2d2d2d;color:var(--dreamland-text);font-weight:500;padding:.75rem}.searchable-select{position:relative;width:100%}.select-trigger{align-items:center;background:linear-gradient(135deg,#fffffff2,#fffcfef2);border:1px solid #d4508f1f;border-radius:8px;box-shadow:0 2px 6px #d4508f0f,0 1px 3px #0000000a,inset 0 0 0 1px #fff9;color:#2d2d2d;color:var(--dreamland-text);cursor:pointer;display:flex;font-size:.875rem;font-weight:600;gap:.5rem;justify-content:space-between;min-height:40px;outline:none;padding:.625rem .75rem;text-align:left;transition:all .25s cubic-bezier(.4,0,.2,1);width:100%}.select-trigger:hover:not(:disabled){border-color:#d4508f40;box-shadow:0 4px 12px #d4508f1f,0 2px 6px #0000000f,0 0 0 3px #d4508f0f,inset 0 0 0 1px #ffffffb3;transform:translateY(-1px)}.select-trigger:disabled{cursor:not-allowed;opacity:.5}.select-value{flex:1 1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.select-icon{color:#d4508f;color:var(--dreamland-pink);flex-shrink:0;opacity:.7}.select-dropdown{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:linear-gradient(135deg,#fff,#fffcfe);border:2px solid #d4508f4d;border-radius:14px;box-shadow:0 24px 64px -12px #d4508f73,0 12px 32px -8px #00000026,inset 0 0 0 1px #fffffff2;max-height:400px;overflow:hidden;z-index:12000}.search-input-wrapper{background:linear-gradient(135deg,#fff5fa80,#ffffff80);border-bottom:1px solid #d4508f1a;padding:.75rem;position:relative}.search-icon{color:#d4508f;color:var(--dreamland-pink);left:1.25rem;opacity:.5;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%)}.search-input{background:#fff;border:1px solid #d4508f26;border-radius:6px;color:#2d2d2d;color:var(--dreamland-text);font-size:.875rem;font-weight:500;outline:none;padding:.5rem 2.5rem .5rem 2rem;transition:all .2s ease;width:100%}.search-input:focus{border-color:#d4508f;border-color:var(--dreamland-pink);box-shadow:0 0 0 3px #d4508f1f}.clear-search{align-items:center;background:none;border:none;border-radius:4px;color:#64748b;color:var(--dreamland-text-light);cursor:pointer;display:flex;justify-content:center;padding:.25rem;position:absolute;right:1.25rem;top:50%;transform:translateY(-50%);transition:all .15s ease}.clear-search:hover{background:#d4508f1a;color:#d4508f;color:var(--dreamland-pink)}.select-options{background:#fff;max-height:240px;overflow-y:auto;padding:.5rem}.select-options::-webkit-scrollbar{width:6px}.select-options::-webkit-scrollbar-track{background:#d4508f0d;border-radius:10px}.select-options::-webkit-scrollbar-thumb{background:#d4508f4d;border-radius:10px}.select-options::-webkit-scrollbar-thumb:hover{background:#d4508f80}.select-option{background:#fff;border:none;border-radius:8px;color:#2d2d2d;color:var(--dreamland-text);cursor:pointer;display:block;font-size:.875rem;font-weight:500;margin-bottom:.25rem;padding:.875rem 1rem;text-align:left;touch-action:manipulation;user-select:none;-webkit-user-select:none;width:100%}.select-option:hover{background:linear-gradient(135deg,#fff5facc,#f5c5d933);color:#d4508f;color:var(--dreamland-pink)}.select-option.selected{background:linear-gradient(135deg,#d4508f,#c24480);background:linear-gradient(135deg,var(--dreamland-pink) 0,#c24480 100%);color:#fff;font-weight:700}.no-results{color:#64748b;color:var(--dreamland-text-light);font-size:.875rem;font-weight:500;padding:1.5rem;text-align:center}.perf-volume{margin-bottom:2rem;padding:.25rem .5rem}.bg-controls{background:linear-gradient(135deg,#fff9,#f5c5d91a);border:1px solid #ffffff80;border-radius:10px;box-shadow:0 2px 8px -1px #00000012,0 1px 4px 0 #0000000a,inset 0 1px 0 0 #fffc;box-shadow:var(--shadow-sm),0 1px 0 0 #fffc inset;gap:.75rem;grid-column:1/-1;padding:.75rem .875rem}.bg-controls,.play-btn{align-items:center;display:flex}.play-btn{background:linear-gradient(135deg,#d4508f,#e94b93);background:linear-gradient(135deg,var(--dreamland-pink) 0,var(--dreamland-pink-vivid) 100%);border:none;border-radius:50%;box-shadow:0 3px 12px #d4508f40,0 1px 4px #d4508f26,0 0 0 3px #d4508f14;color:#fff;cursor:pointer;flex-shrink:0;height:40px;justify-content:center;min-width:40px;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1);width:40px}.play-btn:hover:not(:disabled){box-shadow:0 4px 16px #d4508f59,0 2px 6px #d4508f33,0 0 0 4px #d4508f1f;transform:translateY(-1px) scale(1.05)}.play-btn.is-playing{animation:breathing-glow 2.5s ease-in-out infinite}@keyframes breathing-glow{0%,to{box-shadow:0 2px 8px 0 #d4508f4d,0 0 0 3px #d4508f1a;transform:scale(1)}50%{box-shadow:0 4px 16px 0 #d4508f66,0 0 0 5px #d4508f26,0 0 20px 0 #d4508f33;transform:scale(1.05)}}.play-btn:active:not(:disabled){box-shadow:0 2px 12px #d4508f1f,0 1px 4px #d4508f0f,0 0 0 4px #d4508f26;box-shadow:var(--shadow-pink-sm),0 0 0 4px #d4508f26;transform:scale(.92)}.play-btn:disabled{box-shadow:0 2px 8px -1px #00000012,0 1px 4px 0 #0000000a;box-shadow:var(--shadow-sm);cursor:not-allowed;opacity:.5}.volume-control{align-items:center;display:flex;flex:1 1;gap:1rem;min-width:0}.volume-icon{filter:drop-shadow(0 1px 2px rgba(212,80,143,.2));flex-shrink:0;font-size:1.125rem}.volume-slider{appearance:none;-webkit-appearance:none;background:linear-gradient(90deg,#d4508f26,#d4508f33);border:none;border-radius:12px;box-shadow:inset 0 1px 3px #d4508f14,0 0 0 1px #fff9;cursor:pointer;flex:1 1;height:7px;outline:none;position:relative;touch-action:manipulation;transition:all .2s ease}.volume-slider:hover{box-shadow:inset 0 1px 4px #d4508f1f,0 0 0 1px #ffffffb3,0 0 0 3px #d4508f14}.volume-slider::-webkit-slider-runnable-track{border-radius:12px;height:7px}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><text y="75" font-size="75">%F0%9F%8C%B8</text></svg>') 50%/contain no-repeat #0000;border:none;box-shadow:none;cursor:pointer;filter:drop-shadow(0 2px 4px rgba(212,80,143,.3));height:32px;margin-top:-13px;-webkit-transition:all .2s cubic-bezier(.4,0,.2,1);transition:all .2s cubic-bezier(.4,0,.2,1);width:32px}.volume-slider::-webkit-slider-thumb:active{filter:drop-shadow(0 4px 8px rgba(212,80,143,.5));transform:scale(1.15)}.volume-slider::-moz-range-track{background:#d4508f26;border-radius:10px;height:6px}.volume-slider::-moz-range-thumb{background:linear-gradient(135deg,#ffde59,#ffd43b 50%,#ffc61e);border:2px solid #fff;border-radius:50%;border-radius:0;box-shadow:0 4px 12px #ffde5980,0 0 0 3px #ffc41e33,inset 0 2px 4px #ffffff80,inset 0 -2px 4px #ffb4004d;box-shadow:0 2px 8px #d4508f4d;clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);cursor:pointer;height:36px;-moz-transition:all .15s ease;transition:all .15s ease;width:36px}.volume-label{font-feature-settings:"tnum";color:#d4508f;color:var(--dreamland-pink);font-size:.75rem;font-variant-numeric:tabular-nums;font-weight:800;letter-spacing:-.02em;min-width:38px;text-align:right;text-shadow:0 1px 2px #d4508f26;white-space:nowrap}.performance-progress{flex-direction:row;justify-content:center;margin:.625rem 1.25rem}.performance-progress,.progress-badge{align-items:center;display:flex;gap:.625rem}.progress-badge{background:#fff;border:1px solid #d4508f1a;border-radius:14px;box-shadow:0 2px 6px -1px #0000000f;color:#d4508f;color:var(--dreamland-pink);font-size:.875rem;font-weight:700;padding:.5rem 1rem}.progress-badge:before{content:"✨";filter:drop-shadow(0 1px 2px rgba(212,80,143,.3));font-size:1.125rem}.progress-number{color:#d4508f;color:var(--dreamland-pink);font-size:1.5rem;font-weight:900;line-height:1;text-shadow:none}.progress-divider{font-size:1.125rem;font-weight:600;line-height:1;opacity:.6}.progress-total{font-size:1.125rem;font-weight:800;line-height:1;opacity:.85}.progress-label{color:#d4508f;color:var(--dreamland-pink);font-size:.625rem;font-weight:700;letter-spacing:.06em;line-height:1.3;opacity:.7;text-align:center;text-transform:uppercase}.performances-grid{grid-gap:.875rem;display:grid;gap:.875rem;grid-template-columns:1fr}@keyframes card-entrance{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.performances-grid .performance-card{animation:card-entrance .5s cubic-bezier(.4,0,.2,1) backwards}.performances-grid .performance-card:first-child{animation-delay:.05s}.performances-grid .performance-card:nth-child(2){animation-delay:.1s}.performances-grid .performance-card:nth-child(3){animation-delay:.15s}.performances-grid .performance-card:nth-child(4){animation-delay:.2s}.performance-card{grid-gap:.875rem;background:linear-gradient(135deg,#ffffffe6,#fffcfeb3);border:1px solid #d4508f1f;border-radius:14px;box-shadow:0 2px 8px 0 #d4508f0f,0 1px 4px 0 #0000000a,inset 0 0 0 1px #fff6;display:grid;gap:.875rem;grid-template-columns:1fr;grid-template-rows:auto;padding:1rem 1.25rem;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1)}.performance-card:hover{border-color:#d4508f2e;box-shadow:0 4px 14px 0 #d4508f1a,0 2px 6px 0 #0000000f,inset 0 0 0 1px #ffffff80;transform:translateY(-1px)}.performance-card:active{box-shadow:0 1px 4px 0 #d4508f14,inset 0 0 0 1px #ffffff4d;transform:translateY(1px)}.performance-card.active{animation:card-edge-glow 2s ease-in-out infinite;background:linear-gradient(135deg,#fff5fa,#fff)}@keyframes card-edge-glow{0%,to{border-color:#d4508f4d;box-shadow:0 0 0 1px #d4508f26,0 0 0 2px #d4508f1a,0 0 0 3px #d4508f14,0 1px 3px 0 #0000000a}50%{border-color:#d4508f80;box-shadow:0 0 0 1px #d4508f40,0 0 0 3px #d4508f26,0 0 0 5px #d4508f1a,0 1px 3px 0 #0000000a}}.perf-header{flex-wrap:wrap;gap:.75rem}.perf-header,.perf-number{align-items:center;display:flex}.perf-number{color:#d4508f;color:var(--dreamland-pink);flex-shrink:0;font-size:1.25rem;font-weight:900;justify-content:center;letter-spacing:-.02em;min-width:36px;opacity:.85;text-shadow:none}.perf-title{display:none}.perf-status-badge{border-radius:10px;box-shadow:0 2px 8px #00000014,0 1px 3px #0000000a;flex:1 1;font-size:.6875rem;font-weight:700;letter-spacing:.05em;line-height:1.3;overflow:hidden;padding:.375rem .875rem;position:relative;text-align:center;text-transform:uppercase;transition:all .3s cubic-bezier(.4,0,.2,1);white-space:normal}.perf-status-badge:before{animation:shimmer 3s infinite;background:linear-gradient(45deg,#0000 30%,#ffffff40 50%,#0000 70%);content:"";height:200%;left:-50%;pointer-events:none;position:absolute;top:-50%;width:200%}.perf-status-badge.playing{animation:status-pulse 2s ease-in-out infinite;background:linear-gradient(135deg,#ec4899,#db2777);box-shadow:0 3px 12px #ec489966,0 1px 4px #db277733;color:#fff}.perf-status-badge.paused{background:linear-gradient(135deg,#f472b6,#ec4899);box-shadow:0 3px 12px #f472b666,0 1px 4px #ec489933;color:#fff}.perf-status-badge.completed{background:linear-gradient(135deg,#d946ef,#c026d3);box-shadow:0 3px 12px #d946ef66,0 1px 4px #c026d333;color:#fff}.perf-status-badge.ready{background:linear-gradient(135deg,#fffffff2,#fffafdd9);border:1px solid #d4508f40;box-shadow:0 2px 8px #d4508f1f,0 1px 3px #0000000a;color:#d4508f;color:var(--dreamland-pink)}.perf-status-badge.idle{background:linear-gradient(135deg,#ffffffb3,#f8f8fa99);border:1px solid #0000001f;color:#64748b;color:var(--dreamland-text-light);opacity:.85}@keyframes status-pulse{0%,to{box-shadow:0 3px 12px #ec489966,0 1px 4px #db277733}50%{box-shadow:0 4px 18px #ec489999,0 2px 8px #db27774d,0 0 0 3px #ec489933}}.completed-badge{align-items:center;background:linear-gradient(135deg,#d946ef,#c026d3);border-radius:50%;box-shadow:0 2px 6px #d946ef4d,0 0 0 2px #d946ef1f;color:#fff;display:flex;flex-shrink:0;font-size:.625rem;grid-column:5;grid-row:1;height:20px;justify-content:center;min-width:20px;width:20px}.perf-select{min-width:0;position:relative;z-index:10}.perf-volume{flex:1 1;gap:.75rem}.perf-volume,.progress-bar-container{align-items:center;display:flex;min-width:0}.progress-bar-container{gap:.5rem}.time-label{font-feature-settings:"tnum";color:#64748b;color:var(--dreamland-text-light);font-size:.6875rem;font-variant-numeric:tabular-nums;font-weight:600;min-width:36px;text-align:center}.progress-bar{-webkit-appearance:none;background:linear-gradient(90deg,#d4508f26,#d4508f33);border:none;border-radius:12px;box-shadow:inset 0 1px 3px #d4508f14,0 0 0 1px #fff9;cursor:pointer;flex:1 1;height:7px;outline:none;touch-action:manipulation;transition:all .2s ease}.progress-bar:hover{box-shadow:inset 0 1px 4px #d4508f1f,0 0 0 1px #ffffffb3,0 0 0 3px #d4508f14}.progress-bar::-webkit-slider-runnable-track{border-radius:12px;height:7px}.progress-bar::-webkit-slider-thumb{-webkit-appearance:none;background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><text y="75" font-size="75">%F0%9F%8C%B8</text></svg>') 50%/contain no-repeat #0000;border:none;box-shadow:none;cursor:pointer;filter:drop-shadow(0 2px 4px rgba(212,80,143,.3));height:32px;margin-top:-13px;-webkit-transition:all .2s ease;transition:all .2s ease;width:32px}.progress-bar::-webkit-slider-thumb:active{filter:drop-shadow(0 4px 8px rgba(212,80,143,.5));transform:scale(1.15)}.progress-bar::-moz-range-track{background:#d4508f26;border-radius:10px;height:6px}.progress-bar::-moz-range-thumb{background:#d4508f;background:var(--dreamland-pink);border:2px solid #fff;border-radius:0;box-shadow:0 2px 8px #d4508f4d;clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);cursor:pointer;height:32px;-moz-transition:all .15s ease;transition:all .15s ease;width:32px}.perf-controls{align-items:center;display:flex;justify-content:stretch}.start-performance-btn{align-items:center;background:linear-gradient(135deg,#d4508f,#e94b93);background:linear-gradient(135deg,var(--dreamland-pink) 0,var(--dreamland-pink-vivid) 100%);border:2px solid #ffffff40;border-radius:10px;box-shadow:0 4px 16px #d4508f40,0 2px 6px #d4508f26,0 0 0 3px #d4508f14;color:#fff;cursor:pointer;display:flex;font-size:.875rem;font-weight:800;gap:.5rem;justify-content:center;letter-spacing:.06em;min-height:48px;overflow:hidden;padding:.75rem 1.25rem;position:relative;text-transform:uppercase;transition:all .3s cubic-bezier(.4,0,.2,1);white-space:nowrap;width:100%}.start-performance-btn:before{background:#fff3;border-radius:50%;content:"";height:0;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .6s ease,height .6s ease;width:0}.start-performance-btn:hover:not(:disabled):before{height:300px;width:300px}.start-performance-btn:hover:not(:disabled){border-color:#ffffff59;box-shadow:0 6px 24px #d4508f59,0 3px 10px #d4508f33,0 0 0 4px #d4508f1f;transform:translateY(-2px)}.start-performance-btn span{display:inline;font-weight:900;position:relative;z-index:1}.start-performance-btn:active:not(:disabled){box-shadow:0 2px 8px #d4508f33,0 1px 4px #d4508f1f,0 0 0 2px #d4508f1a;transform:scale(.97) translateY(0)}.start-performance-btn:disabled{background:linear-gradient(135deg,#d4508f80,#c2448080);box-shadow:0 2px 8px -1px #00000012,0 1px 4px 0 #0000000a;box-shadow:var(--shadow-sm);cursor:not-allowed;opacity:.5}.pause-btn{align-items:center;background:linear-gradient(135deg,#ec4899,#db2777);border:2px solid #ffffff40;border-radius:10px;box-shadow:0 4px 12px #ec48994d,0 2px 6px #db277733;color:#fff;cursor:pointer;display:flex;font-size:.875rem;font-weight:800;gap:.5rem;justify-content:center;letter-spacing:.05em;min-height:48px;overflow:hidden;padding:.75rem 1.25rem;position:relative;text-transform:uppercase;transition:all .2s cubic-bezier(.4,0,.2,1);white-space:nowrap;width:100%}.pause-btn:before{background:#fff3;border-radius:50%;content:"";height:0;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .6s ease,height .6s ease;width:0}.pause-btn:hover:before{height:300px;width:300px}.pause-btn.is-playing{animation:pause-btn-pulse 2.5s ease-in-out infinite}@keyframes pause-btn-pulse{0%,to{box-shadow:0 4px 12px #ec48994d,0 2px 6px #db277733}50%{box-shadow:0 6px 20px #ec489980,0 3px 10px #db27774d,0 0 24px #ec489940}}.pause-btn span{display:inline;font-weight:900;position:relative;z-index:1}.pause-btn:hover{background:linear-gradient(135deg,#f472b6,#ec4899);box-shadow:0 6px 18px #ec489966,0 3px 10px #db277740;transform:translateY(-2px)}.pause-btn:active{box-shadow:0 2px 8px #ec48994d,0 1px 4px #db277733;transform:scale(.97) translateY(0)}.counter-track-info{border-top:1px solid #d4508f26;display:flex;justify-content:center;margin-top:.75rem;padding-top:.75rem;width:100%}.counter-track-info .file-count{font-size:.75rem;padding:.5rem 1rem}.instructions-section{animation:fadeInUp .6s ease-out .4s both;margin:2rem 1.25rem 1.5rem}.instructions-card{backdrop-filter:blur(24px) saturate(150%);-webkit-backdrop-filter:blur(24px) saturate(150%);background:linear-gradient(135deg,#fffffffa,#fffcfef2);border:1px solid #d4508f26;border-radius:18px;box-shadow:0 6px 24px -4px #d4508f2e,0 3px 12px 0 #0000000f,inset 0 0 0 1px #ffffffb3;overflow:hidden;padding:1.75rem 2rem;position:relative}.instructions-card:before{background:linear-gradient(90deg,#0000,#d4508f4d 20%,#d4508f99 50%,#d4508f4d 80%,#0000);content:"";height:3px;left:0;position:absolute;right:0;top:0}.instructions-header{align-items:center;display:flex;gap:.75rem;justify-content:center;margin-bottom:1.5rem}.instructions-icon{animation:sparkle 2s ease-in-out infinite;filter:drop-shadow(0 2px 4px rgba(212,80,143,.3));font-size:1.5rem}@keyframes sparkle{0%,to{opacity:.8;transform:scale(1)}50%{opacity:1;transform:scale(1.15)}}.instructions-title{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#d4508f,#e94b93);background:linear-gradient(135deg,var(--dreamland-pink) 0,var(--dreamland-pink-vivid) 100%);-webkit-background-clip:text;background-clip:text;font-size:1.25rem;font-weight:800;letter-spacing:.01em;text-shadow:0 1px 2px #d4508f26}.instructions-content{display:flex;flex-direction:column;gap:1rem}.instruction-step{align-items:flex-start;background:linear-gradient(135deg,#d4508f0a,#ffb6c108);border:1px solid #d4508f14;border-radius:12px;display:flex;gap:1rem;padding:.875rem 1.125rem;transition:all .3s cubic-bezier(.4,0,.2,1)}.instruction-step:hover{background:linear-gradient(135deg,#d4508f14,#ffb6c10f);border-color:#d4508f26;box-shadow:0 2px 8px #d4508f1f;transform:translateX(4px)}.step-number{align-items:center;background:linear-gradient(135deg,#d4508f,#e94b93);background:linear-gradient(135deg,var(--dreamland-pink) 0,var(--dreamland-pink-vivid) 100%);border-radius:50%;box-shadow:0 3px 10px #d4508f59,0 1px 4px #d4508f33,inset 0 0 0 3px #ffffffe6;color:#fff;display:inline-flex;flex-shrink:0;font-size:.875rem;font-weight:800;height:2rem;justify-content:center;letter-spacing:-.02em;width:2rem}.instruction-step p{color:#2d2d2d;color:var(--dreamland-text);flex:1 1;font-size:.9375rem;line-height:1.6;margin:0;padding-top:.25rem}.instruction-step strong{color:#d4508f;color:var(--dreamland-pink);font-weight:700}.instructions-footer{align-items:center;border-top:1px solid #d4508f1f;display:flex;gap:.625rem;justify-content:center;margin-top:1.25rem;padding-top:1.25rem}.footer-sparkle{animation:twinkle 1.5s ease-in-out infinite alternate;font-size:1rem}@keyframes twinkle{0%{opacity:.6}to{opacity:1}}.instructions-tip{color:#64748b;color:var(--dreamland-text-light);font-size:.875rem;font-style:italic;font-weight:500;margin:0;text-align:center}.reset-all-btn{align-items:center;background:linear-gradient(135deg,#d4508f14,#ffb6c10f);border:1.5px solid #d4508f33;border-radius:10px;box-shadow:0 2px 8px #d4508f14,0 1px 3px #0000000a;color:#d4508f;color:var(--dreamland-pink);cursor:pointer;display:flex;font-size:.8125rem;font-weight:700;gap:.5rem;justify-content:center;letter-spacing:.06em;overflow:hidden;padding:.875rem 1.5rem;position:relative;text-transform:uppercase;transition:all .3s cubic-bezier(.4,0,.2,1);white-space:nowrap}.reset-all-btn:before{background:#d4508f1f;border-radius:50%;content:"";height:0;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .6s ease,height .6s ease;width:0}.reset-all-btn:hover:before{height:300px;width:300px}.reset-all-btn:hover{background:linear-gradient(135deg,#d4508f1f,#ffb6c11a);border-color:#d4508f59;box-shadow:0 4px 14px #d4508f26,0 2px 6px #0000000f;transform:translateY(-2px)}.reset-all-btn:active{box-shadow:0 1px 4px #d4508f1f;transform:translateY(0) scale(.98)}.reset-all-btn span{position:relative;z-index:1}.file-count{align-items:baseline;background:linear-gradient(135deg,#d4508f1a,#ffb6c114);border:1px solid #d4508f26;border-radius:10px;box-shadow:0 2px 6px #d4508f14,0 1px 3px #0000000a,inset 0 0 0 1px #ffffff80;color:#d4508f;color:var(--dreamland-pink);display:inline-flex;font-size:.875rem;font-weight:700;gap:.375rem;letter-spacing:-.01em;padding:.625rem 1.25rem;position:relative;transition:all .3s ease}.file-count:before{content:"🎵";filter:drop-shadow(0 1px 2px rgba(212,80,143,.2));flex-shrink:0;font-size:1.125rem;line-height:1;opacity:.75}.file-count:after{color:#64748b;color:var(--dreamland-text-light);content:" tracks";font-size:.75rem;font-weight:600;margin-left:.125rem;opacity:.85}.file-count:hover{box-shadow:0 3px 10px #d4508f1f,0 2px 4px #0000000f,inset 0 0 0 1px #fff9;transform:translateY(-1px)}.audio-particles{height:100%;left:0;overflow:visible;pointer-events:none;position:absolute;top:60%;width:100%;z-index:5}.particle{animation:sakura-float 3s cubic-bezier(.25,.46,.45,.94) infinite;filter:drop-shadow(0 2px 6px rgba(212,80,143,.25));opacity:0;position:absolute}@keyframes sakura-float{0%{opacity:0;transform:translateY(0) translateX(0) rotate(0deg)}15%{opacity:.8}85%{opacity:.6}to{opacity:0;transform:translateY(-120px) translateX(20px) rotate(1turn)}}.particle:first-child{animation-delay:0s;animation-duration:3.2s;font-size:1rem;left:15%}.particle:nth-child(2){animation-delay:.4s;animation-duration:2.8s;font-size:1.3rem;left:35%}.particle:nth-child(3){animation-delay:.8s;animation-duration:3.5s;font-size:.9rem;left:55%}.particle:nth-child(4){animation-delay:1.2s;animation-duration:3s;font-size:1.1rem;left:75%}.particle:nth-child(5){animation-delay:1.6s;animation-duration:3.3s;font-size:1.2rem;left:25%}.particle:nth-child(6){animation-delay:2s;animation-duration:2.9s;font-size:1rem;left:45%}.particle:nth-child(7){animation-delay:.6s;animation-duration:3.1s;font-size:1.4rem;left:65%}.particle:nth-child(8){animation-delay:1s;animation-duration:3.4s;font-size:.95rem;left:85%}.sparkle-overlay{animation:sparkle-pulse 2.5s ease-in-out infinite;background:radial-gradient(circle at 30% 40%,#d4508f0f 0,#0000 70%),radial-gradient(circle at 70% 60%,#ffb6c10d 0,#0000 60%);border-radius:14px;height:100%;left:0;opacity:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:4}@keyframes sparkle-pulse{0%,to{opacity:0}50%{opacity:1}}@media (max-width:768px){.app-header{padding:.875rem 1rem 1rem}.logo-image{height:80px}.app-subtitle{font-size:.75rem}.main-controls-row{gap:.75rem;grid-template-columns:1fr;margin:.75rem 1rem}.background-section,.performances-section{margin:.75rem 1rem;padding:1rem 1.25rem}.section-title{font-size:.875rem}.bg-music-container{gap:.875rem}.bg-controls{gap:.75rem}.performance-counter-card{min-width:0;min-width:auto;padding:1rem 1.5rem}.counter-value{font-size:2rem}.performances-grid{gap:.75rem;grid-template-columns:1fr}.performance-card{gap:.75rem;padding:.875rem 1rem}.perf-number{font-size:1.125rem;min-width:32px}.volume-slider{max-width:100%}.instructions-section{margin:1.5rem 1rem 1rem}.instructions-card{padding:1.25rem 1.5rem}.instructions-title{font-size:1.125rem}.instruction-step{gap:.875rem;padding:.75rem 1rem}.step-number{font-size:.8125rem;height:1.75rem;width:1.75rem}.instruction-step p{font-size:.875rem}.instructions-tip{font-size:.8125rem}.file-count{font-size:.75rem;padding:.5rem .875rem}.file-count:before{font-size:1rem}.file-count:after{font-size:.6875rem}}@media (min-width:768px) and (max-width:1024px){.main-controls-row{gap:1rem;margin:1rem 1.5rem}.background-section,.performances-section{margin:1rem 1.5rem;padding:1.25rem 1.5rem}.performance-counter-card{min-width:160px;padding:1.25rem 1.5rem}.counter-value{font-size:2.25rem}.performance-card{gap:.875rem;padding:1.125rem 1.375rem}.performances-grid{gap:1rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}}@media (min-width:1024px){.background-section,.main-controls-row,.performances-section{margin-left:auto;margin-right:auto;max-width:1400px}.performances-grid{gap:1.25rem;grid-template-columns:repeat(2,1fr)}}@media (orientation:portrait) and (max-width:1024px){.main-controls-row,.performances-grid{grid-template-columns:1fr}.folder-btn span,.refresh-btn span{display:none}.folder-btn,.refresh-btn{min-width:38px;padding:.5rem}}.loading-container{align-items:center;display:flex;flex-direction:column;gap:1.5rem;justify-content:center;min-height:300px}.loading-spinner{animation:spin .8s linear infinite;border:3px solid #d4508f33;border-radius:50%;border-top:3px solid var(--dreamland-pink);height:40px;width:40px}@keyframes spin{to{transform:rotate(1turn)}}
/*# sourceMappingURL=main.3040663d.css.map*/