*,:before,:after{box-sizing:border-box}:root{--font-sans:"Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--color-ink:#1e1147;--color-ink-muted:#5b5278;--color-ink-soft:#7c7399;--color-bg-1:#e8ecff;--color-bg-2:#fce7f3;--color-bg-3:#fef3c7;--color-surface:#ffffffd1;--color-surface-strong:#fffffff0;--color-surface-border:#6366f124;--color-accent:#6366f1;--color-accent-deep:#4f46e5;--color-magenta:#db2777;--color-cyan:#0891b2;--color-amber:#d97706;--color-danger:#dc2626;--color-danger-bg:#fee2e2a6;--focus-ring:#4338ca;--focus-ring-offset:#fff;--radius-sm:10px;--radius-md:14px;--radius-lg:18px;--shadow-sm:0 2px 8px #1e11470f;--shadow-md:0 8px 24px #6366f11f, 0 4px 12px #db27770f;--shadow-card-hover:0 12px 28px #6366f12e, 0 4px 12px #0891b214}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}body{font-family:var(--font-sans);color:var(--color-ink);background-color:var(--color-bg-1);background-image:radial-gradient(ellipse 120% 80% at 10% -10%, #a78bfa59 0%, transparent 55%), radial-gradient(ellipse 90% 70% at 95% 15%, #f472b647 0%, transparent 50%), radial-gradient(ellipse 80% 60% at 50% 100%, #fbbf2438 0%, transparent 45%), linear-gradient(165deg, var(--color-bg-1) 0%, var(--color-bg-2) 42%, var(--color-bg-3) 100%);-webkit-font-smoothing:antialiased;background-attachment:fixed;min-height:100vh;margin:0;line-height:1.5}#root{min-height:100vh}@media (forced-colors:active){:root{--focus-ring:Highlight}body{background:canvas}}.app-skip-link{z-index:10;font-size:.875rem;font-weight:600;font-family:var(--font-sans);color:#fff;background:linear-gradient(135deg, var(--color-accent) 0%, var(--color-magenta) 55%, var(--color-cyan) 100%);border-radius:var(--radius-sm);box-shadow:var(--shadow-md);clip-path:inset(100%);clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:.5rem .9rem;text-decoration:none;position:absolute;top:.5rem;left:.5rem;overflow:hidden}.app-skip-link:focus,.app-skip-link:focus-visible{clip-path:none;clip:auto;outline:2px solid var(--focus-ring);outline-offset:3px;width:auto;height:auto;margin:0;overflow:visible}.app{box-sizing:border-box;width:100%;min-width:0;max-width:42rem;margin:0 auto;padding:0 .25rem}@media (width>=480px){.app{padding:0 .5rem}}.dev-panel{border-radius:var(--radius-md);background:var(--color-surface-strong);border:1px solid var(--color-surface-border);box-shadow:var(--shadow-sm);max-width:42rem;margin-top:2rem;padding:1.25rem 1rem}.dev-panel-title{background:linear-gradient(90deg, var(--color-accent-deep), var(--color-magenta));color:#0000;-webkit-background-clip:text;background-clip:text;margin:0 0 .5rem;font-size:1rem;font-weight:700}@media (forced-colors:active){.dev-panel-title{background:0 0;-webkit-background-clip:unset;background-clip:unset;color:canvastext}}.dev-panel-help{color:var(--color-ink-muted);margin:0 0 1rem;font-size:.875rem}.dev-panel-help code{color:var(--color-accent-deep);background:#6366f11f;border-radius:6px;padding:.1em .35em;font-size:.8125rem}.dev-panel-buttons{flex-wrap:wrap;gap:.5rem;margin-bottom:1rem;display:flex}.dev-panel-buttons button{font-size:.8125rem;font-family:var(--font-sans);cursor:pointer;border-radius:var(--radius-sm);border:1px solid var(--color-surface-border);color:var(--color-ink);box-shadow:var(--shadow-sm);background:linear-gradient(#fff 0%,#eef2ffe6 100%);padding:.45rem .75rem;font-weight:600}.dev-panel-buttons button:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.dev-panel-buttons button:hover{border-color:#6366f159}.dev-panel-log{border:1px solid var(--color-surface-border);border-radius:var(--radius-sm);white-space:pre-wrap;word-break:break-word;background:linear-gradient(160deg,#eef2fff2 0%,#fce7f380 100%);max-height:14rem;margin:0;padding:.75rem;font-size:.75rem;line-height:1.45;overflow:auto}.shell-root{box-sizing:border-box;width:100%;min-width:0;max-width:100%;padding:1rem .35rem 2.5rem;overflow-x:hidden}.shell-header{border-radius:var(--radius-lg);border:1px solid var(--color-surface-border);box-shadow:var(--shadow-md);background:linear-gradient(135deg,#ffffffeb 0%,#eef2ffe0 38%,#fce7f3b8 100%);margin-bottom:1.35rem;padding:1.15rem 1.1rem 1.25rem;position:relative;overflow:hidden}.shell-header:after{content:"";pointer-events:none;background:linear-gradient(115deg,#0000 40%,#6366f10f 55%,#f472b612 75%,#0000 90%);position:absolute;inset:0}.shell-title{letter-spacing:-.03em;background:linear-gradient(115deg, var(--color-accent-deep) 0%, var(--color-magenta) 48%, var(--color-cyan) 100%);color:#0000;-webkit-background-clip:text;background-clip:text;margin:0 0 .45rem;font-size:clamp(1.4rem,4vw,1.75rem);font-weight:800;line-height:1.15;position:relative}@media (forced-colors:active){.shell-title{background:0 0;-webkit-background-clip:unset;background-clip:unset;color:canvastext}}.shell-lede{color:var(--color-ink-muted);max-width:36rem;margin:0;font-size:.9rem;line-height:1.5;position:relative}.shell-region{border-radius:var(--radius-md);background:var(--color-surface);-webkit-backdrop-filter:blur(14px);border:1px solid var(--color-surface-border);box-shadow:var(--shadow-sm);min-width:0;margin-bottom:1rem;padding:1rem 1rem 1.05rem}.shell-region-detail{background:linear-gradient(165deg,#ffffffe0 0%,#e0f2fe59 55%,#fce7f347 100%);border-color:#0891b238}.shell-region-heading{letter-spacing:.08em;text-transform:uppercase;color:var(--color-accent-deep);margin:0 0 .75rem;font-size:.8125rem;font-weight:700}.shell-state-msg{margin:0;font-size:.9375rem;line-height:1.5}.shell-muted{color:var(--color-ink-muted)}.shell-error{color:var(--color-danger);border-radius:var(--radius-sm);background:var(--color-danger-bg);border:1px solid #dc262633;padding:.65rem .75rem}.shell-recovery-hint{color:var(--color-ink-muted);margin-top:.35rem;font-size:.875rem;font-weight:400;display:block}.shell-root :where(button:not(:disabled),input:not(:disabled)):focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.shell-visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.shell-search-form{flex-direction:column;gap:.65rem;min-width:0;display:flex}.shell-search-field-wrap{flex-direction:column;gap:.25rem;min-width:0;display:flex}.shell-inline-hint{color:var(--color-amber);margin:0;font-size:.8125rem;font-weight:500}.shell-input{box-sizing:border-box;border-radius:var(--radius-sm);appearance:none;background:var(--color-surface-strong);width:100%;max-width:100%;color:var(--color-ink);border:2px solid #6366f138;transition:border-color .18s,box-shadow .18s}.shell-input:hover:not(:disabled){border-color:#6366f159}.shell-input:focus{border-color:var(--color-accent);box-shadow:0 0 0 3px #6366f138}.shell-input[aria-invalid=true]{border-color:#dc26268c}.shell-search-form .shell-input{height:2.75rem;min-height:0;font-size:.9375rem;font-family:var(--font-sans);padding:0 .65rem;line-height:1.25}.shell-search-form .shell-btn-primary{height:2.75rem;min-height:0;font-size:.9375rem;font-family:var(--font-sans);padding:0 1.15rem;font-weight:700;line-height:1.25}#shell-search-heading:focus{outline:2px solid var(--focus-ring);outline-offset:4px;border-radius:4px}.shell-btn-primary,.shell-btn-secondary{box-sizing:border-box;width:100%;max-width:100%;font-size:.9375rem;font-family:var(--font-sans);cursor:pointer;border-radius:var(--radius-sm);padding:.55rem .85rem;font-weight:600;transition:transform .15s,filter .15s,box-shadow .15s}.shell-btn-primary{color:#fff;background:linear-gradient(135deg, var(--color-accent) 0%, #7c3aed 48%, var(--color-magenta) 100%);border:none;box-shadow:0 4px 14px #6366f161,inset 0 1px #fff3}.shell-btn-primary:hover:not(:disabled){filter:brightness(1.06);transform:translateY(-1px);box-shadow:0 6px 20px #6366f16b,inset 0 1px #ffffff38}.shell-btn-primary:active:not(:disabled){transform:translateY(0)}.shell-btn-primary:disabled{opacity:.52;cursor:not-allowed;filter:grayscale(.25);box-shadow:none}.shell-btn-secondary{color:var(--color-accent-deep);box-shadow:var(--shadow-sm);background:linear-gradient(#fff 0%,#f8fafcf2 100%);border:2px solid #6366f159}.shell-btn-secondary:hover{border-color:var(--color-accent);background:#fff}.shell-list{flex-direction:column;gap:.45rem;margin:0;padding:0;list-style:none;display:flex}.shell-list-btn{box-sizing:border-box;text-align:left;width:100%;max-width:100%;min-height:2.75rem;font-size:.9375rem;font-family:var(--font-sans);cursor:pointer;border-radius:var(--radius-sm);background:linear-gradient(145deg,#fffffffa 0%,#eef2ff8c 100%);border:2px solid #6366f124;padding:.5rem .65rem;font-weight:600;transition:border-color .15s,transform .15s,box-shadow .15s}.shell-list-btn:hover{box-shadow:var(--shadow-sm);border-color:#6366f159;transform:translateY(-1px)}.shell-result-row{align-items:center;gap:.65rem;display:flex}.shell-result-thumb{border-radius:var(--radius-sm);object-fit:cover;border:2px solid #6366f126;flex-shrink:0;width:48px;height:48px;box-shadow:0 2px 6px #1e114714}.shell-result-thumb-placeholder{background:linear-gradient(145deg,#a78bfa59 0%,#f472b640 50%,#fbbf2438 100%);border:2px dashed #6366f140;display:block}.shell-result-name{word-break:break-word;min-width:0;color:var(--color-ink);flex:1}.shell-list-btn-selected{border-color:var(--color-accent);background:linear-gradient(145deg,#eef2fffa 0%,#fce7f3a6 100%);box-shadow:0 0 0 2px #6366f140,0 6px 16px #6366f126}.shell-card-grid{grid-template-columns:repeat(auto-fill,minmax(8.5rem,1fr));gap:.75rem;min-width:0;margin:0;padding:0;list-style:none;display:grid}.shell-card-btn{box-sizing:border-box;border-radius:var(--radius-md);cursor:pointer;background:var(--color-surface-strong);text-align:left;width:100%;min-width:0;max-width:100%;min-height:2.75rem;box-shadow:var(--shadow-sm);border:2px solid #6366f11f;flex-direction:column;margin:0;padding:0;transition:transform .18s,border-color .18s,box-shadow .18s;display:flex;overflow:hidden}.shell-card-btn:hover{box-shadow:var(--shadow-card-hover);border-color:#6366f159;transform:translateY(-3px)}.shell-card-cover,.shell-card-cover-placeholder{aspect-ratio:1;background:linear-gradient(145deg,#a78bfa4d 0%,#38bdf833 55%,#fbbf242e 100%);width:100%;display:block}.shell-card-cover-img{aspect-ratio:1;object-fit:cover;vertical-align:middle;width:100%;display:block}.shell-card-btn-selected{border-color:var(--color-magenta);box-shadow:0 0 0 2px #db277747, var(--shadow-card-hover)}.shell-card-meta-na{color:var(--color-ink-soft)}.shell-detail-cover{max-width:100%;margin-bottom:.75rem}.shell-detail-cover-img{object-fit:contain;border-radius:var(--radius-md);width:auto;max-width:100%;height:auto;max-height:240px;box-shadow:var(--shadow-md);border:3px solid #ffffffd9;display:block}.shell-detail-cover-placeholder{aspect-ratio:1;border-radius:var(--radius-md);background:linear-gradient(145deg,#e0f2fea6 0%,#fce7f373 100%);border:2px dashed #6366f147;max-width:240px;max-height:240px}.shell-detail-empty-tracks{margin:0;font-size:.875rem}.shell-card-title{word-break:break-word;color:var(--color-ink);padding:.45rem .5rem 0;font-size:.8125rem;font-weight:700;line-height:1.25;display:block}.shell-card-meta{color:var(--color-ink-muted);padding:.15rem .5rem .5rem;font-size:.75rem;font-weight:500;display:block}.shell-detail-back{margin-bottom:.75rem}.shell-detail-title{letter-spacing:-.02em;word-break:break-word;color:var(--color-ink);margin:0 0 .35rem;font-size:1.125rem;font-weight:800;line-height:1.25}.shell-detail-meta{color:var(--color-ink-muted);margin:0 0 .75rem;font-size:.9rem;font-weight:500}.shell-track-scroll{border-radius:var(--radius-sm);background:#ffffffa6;border:2px solid #0891b22e;min-width:0;max-height:12rem;padding:.45rem .55rem;overflow:hidden auto}.shell-track-list{color:var(--color-ink);margin:0;padding-left:1.35rem;font-size:.875rem;line-height:1.5}.shell-track-list li{word-break:break-word;padding:.2rem 0}.shell-track-list li::marker{color:var(--color-cyan)}@media (width>=480px){.shell-root{padding-left:.5rem;padding-right:.5rem}.shell-search-form{flex-flow:wrap;align-items:center}.shell-input,.shell-btn-primary{min-height:0}.shell-search-field-wrap{flex:14rem;min-width:0}.shell-btn-primary{flex:none;width:auto;min-width:8rem}.shell-btn-secondary{width:auto;max-width:16rem}}@media (prefers-reduced-motion:reduce){.shell-btn-primary:hover:not(:disabled),.shell-list-btn:hover,.shell-card-btn:hover{transform:none}}