.app-header{z-index:10;border-bottom:1px solid var(--color-border);background-color:var(--color-header);-webkit-backdrop-filter:blur(.75rem);backdrop-filter:blur(.75rem);box-shadow:var(--shadow-header);position:sticky;top:0}.app-header__inner{justify-content:space-between;align-items:center;gap:var(--space-lg);min-height:4.5rem;padding-block:var(--space-sm);display:flex}.app-brand{align-items:center;gap:var(--space-sm);color:var(--color-text);letter-spacing:-.01em;flex-shrink:0;font-weight:700;display:inline-flex}.app-brand:hover{color:var(--color-accent);text-decoration:none}.app-brand__mark{object-fit:contain;flex-shrink:0;width:auto;height:2rem}.app-nav{align-items:center;gap:var(--space-xs);display:flex}.app-nav__link{padding:.625rem var(--space-md);color:var(--color-text-muted);font-size:var(--font-size-sm);white-space:nowrap;border-radius:999px;font-weight:600}.app-nav__link:hover{background-color:var(--color-surface);color:var(--color-text);text-decoration:none}.app-nav__link--active{background-color:var(--color-accent);color:var(--color-accent-contrast)}.app-nav__link--active:hover{background-color:var(--color-accent-hover);color:var(--color-accent-contrast)}button.app-nav__link{cursor:pointer;background:0 0;border:none}button.app-nav__link:disabled{opacity:.7;cursor:not-allowed}.app-header__error{padding-bottom:var(--space-md);color:var(--color-danger);font-size:var(--font-size-sm);text-align:center;font-weight:600}.app-footer{border-top:1px solid var(--color-border);background-color:var(--color-surface-soft)}.app-footer__inner{justify-content:space-between;align-items:center;gap:var(--space-md);padding-block:var(--space-lg);display:flex}.app-footer__identity{gap:var(--space-xs);display:grid}.app-footer__brand,.app-footer__credit,.app-footer__attribution{font-size:var(--font-size-sm)}@media (width<=640px){.app-header{position:static}.app-header__inner{align-items:stretch;gap:var(--space-sm);padding-block:var(--space-md);flex-direction:column}.app-brand{justify-content:center}.app-nav{grid-template-columns:repeat(3,minmax(0,1fr));width:100%;display:grid}.app-nav__link{padding-inline:var(--space-sm);text-align:center}.app-footer__inner{flex-direction:column;align-items:flex-start}}.home-page{align-content:center;min-height:min(34rem,65vh);display:grid}.home-page__content{max-width:42rem}.home-page__eyebrow{margin-bottom:var(--space-sm);color:var(--color-secondary-strong);font-size:var(--font-size-sm);letter-spacing:.08em;text-transform:uppercase;font-weight:700}.home-page__title{margin-bottom:var(--space-md);letter-spacing:-.04em;font-size:clamp(2.25rem,7vw,4.5rem)}.home-page__description{max-width:36rem;font-size:var(--font-size-lg)}.home-page__links{gap:var(--space-sm);margin-top:var(--space-xl);flex-wrap:wrap;display:flex}.home-page__link{min-height:2.75rem;padding:var(--space-sm) var(--space-lg);border:1px solid var(--color-accent);background-color:var(--color-accent);color:var(--color-accent-contrast);border-radius:999px;justify-content:center;align-items:center;font-weight:600;display:inline-flex}.home-page__link:hover{border-color:var(--color-accent-hover);background-color:var(--color-accent-hover);color:var(--color-accent-contrast);text-decoration:none}@media (width<=480px){.home-page__links{flex-direction:column}.home-page__link{width:100%}}.login-page{min-height:min(38rem,70vh);padding-block:var(--space-xl);justify-content:center;align-items:center;display:flex}.login-card{width:100%;max-width:28rem;padding:var(--space-2xl);border:1px solid var(--color-border);border-radius:var(--radius-lg);background-color:var(--color-surface);box-shadow:var(--shadow-card)}.login-card__brand{margin-bottom:var(--space-sm);font-size:var(--font-size-sm);letter-spacing:.04em;text-transform:uppercase;color:var(--color-secondary);font-weight:600}.login-card__title{margin-bottom:var(--space-md);font-size:var(--font-size-2xl);color:var(--color-text)}.login-card__description{margin-bottom:var(--space-xl);color:var(--color-text-muted)}.login-card__privacy{margin-top:var(--space-lg);font-size:var(--font-size-sm);color:var(--color-text-muted)}.login-card__error{margin-bottom:var(--space-md);padding:var(--space-md);border:1px solid var(--color-danger);border-radius:var(--radius-md);background-color:var(--color-danger-surface);color:var(--color-danger);font-size:var(--font-size-sm)}.login-button{width:100%;min-height:3rem;padding:var(--space-sm) var(--space-lg);background-color:var(--color-accent);color:var(--color-accent-contrast);font-size:var(--font-size-base);cursor:pointer;border:none;border-radius:999px;justify-content:center;align-items:center;font-weight:700;transition:background-color .15s,opacity .15s;display:inline-flex}.login-button:hover:not(:disabled){background-color:var(--color-accent-hover)}.login-button:focus-visible{outline:3px solid var(--color-secondary);outline-offset:3px}.login-button:disabled{opacity:.7;cursor:not-allowed}@media (width<=480px){.login-page{min-height:auto;padding-block:var(--space-md);align-items:flex-start}.login-card{padding:var(--space-lg)}.login-card__title{font-size:var(--font-size-xl)}}.dashboard-page{width:100%;max-width:64rem;margin-inline:auto}.search-form{gap:var(--space-md);margin-bottom:var(--space-xl);padding:var(--space-lg);border:1px solid var(--color-border);border-radius:var(--radius-lg);background-color:var(--color-surface);box-shadow:var(--shadow-card);display:grid}.search-form__field{gap:var(--space-xs);flex-direction:column;min-width:0;display:flex}.search-form__label{font-size:var(--font-size-sm);color:var(--color-secondary);font-weight:700}.search-form__input,.search-form__select{width:100%;min-height:2.75rem;padding:var(--space-sm) var(--space-md);border:1px solid var(--color-border);border-radius:var(--radius-md);background-color:var(--color-surface-soft);color:var(--color-text);font:inherit}.search-form__input:focus-visible,.search-form__select:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.search-form__button{min-height:2.75rem;padding:var(--space-sm) var(--space-lg);border:1px solid var(--color-accent);border-radius:var(--radius-md);background-color:var(--color-accent);color:var(--color-accent-contrast);font:inherit;cursor:pointer;font-weight:700}.search-form__button:hover:not(:disabled){border-color:var(--color-accent-hover);background-color:var(--color-accent-hover)}.search-form__button:disabled{opacity:.7;cursor:not-allowed}.dashboard-card__image--placeholder{text-decoration:none;display:block}@media (width>=640px){.search-form{grid-template-columns:minmax(0,1fr) 10rem auto;align-items:end}}.dashboard-page--profile{max-width:var(--container-max-width)}.dashboard-page__title{margin-bottom:var(--space-xl);font-size:clamp(var(--font-size-xl), 5vw, var(--font-size-2xl));letter-spacing:-.025em}.dashboard-list{gap:var(--space-md);padding:0;list-style:none;display:grid}.dashboard-card{align-items:center;gap:var(--space-lg);padding:var(--space-lg);border:1px solid var(--color-border);border-radius:var(--radius-lg);background-color:var(--color-surface);box-shadow:var(--shadow-card);display:flex}.dashboard-card__image{border-radius:var(--radius-md);object-fit:cover;background-color:var(--color-border);flex-shrink:0;width:4.5rem;height:4.5rem}.dashboard-card__image--round{border-radius:50%}.dashboard-card__image--profile{width:8rem;height:8rem}.dashboard-card__content{gap:var(--space-xs);overflow-wrap:anywhere;flex-direction:column;min-width:0;display:flex}.dashboard-card__title{font-size:var(--font-size-lg);color:var(--color-text)}.dashboard-card__meta{font-size:var(--font-size-sm);color:var(--color-secondary)}.dashboard-card__link{min-height:2.75rem;margin-top:var(--space-xs);font-size:var(--font-size-sm);color:var(--color-secondary);align-self:flex-start;align-items:center;font-weight:600;display:inline-flex}.dashboard-card__link--spotify{color:var(--color-spotify)}.dashboard-profile{align-items:flex-start;gap:var(--space-lg);max-width:36rem;padding:var(--space-xl);border:1px solid var(--color-border);border-radius:var(--radius-lg);background-color:var(--color-surface);box-shadow:var(--shadow-card);flex-direction:column;display:flex}.dashboard-empty{padding:var(--space-xl);border:1px dashed var(--color-border);border-radius:var(--radius-lg);background-color:var(--color-surface);text-align:center;color:var(--color-text-muted)}.dashboard-empty--compact{padding:var(--space-lg);box-shadow:none}.dashboard-previews{gap:var(--space-xl);margin-top:var(--space-xl);display:grid}.dashboard-preview{min-width:0;padding:var(--space-xl);border:1px solid var(--color-border);border-radius:var(--radius-lg);background-color:var(--color-surface-soft);box-shadow:var(--shadow-card)}.dashboard-preview__header{justify-content:space-between;align-items:center;gap:var(--space-md);margin-bottom:var(--space-lg);display:flex}.dashboard-preview__eyebrow{margin-bottom:var(--space-xs);color:var(--color-secondary);font-size:var(--font-size-sm);letter-spacing:.08em;text-transform:uppercase;font-weight:700}.dashboard-preview__title{font-size:var(--font-size-xl);color:var(--color-text)}.dashboard-preview__link{min-height:2.75rem;padding:var(--space-sm) var(--space-md);border:1px solid var(--color-accent);background-color:var(--color-accent);color:var(--color-accent-contrast);font-size:var(--font-size-sm);border-radius:999px;flex-shrink:0;justify-content:center;align-items:center;font-weight:700;display:inline-flex}.dashboard-preview__link:hover{border-color:var(--color-accent-hover);background-color:var(--color-accent-hover);color:var(--color-accent-contrast);text-decoration:none}.dashboard-preview__list{gap:var(--space-sm);padding:0;list-style:none;display:grid}.dashboard-preview-card{align-items:center;gap:var(--space-md);min-width:0;padding:var(--space-sm);border:1px solid var(--color-border);border-radius:var(--radius-md);background-color:var(--color-surface);display:flex}.dashboard-preview-card__image{border-radius:var(--radius-md);background-color:var(--color-border);object-fit:cover;flex-shrink:0;width:3.25rem;height:3.25rem}.dashboard-preview-card__image--round{border-radius:50%}.dashboard-preview-card__content{min-width:0}.dashboard-preview-card__title{color:var(--color-text);font-size:var(--font-size-base);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.dashboard-preview-card__meta{color:var(--color-secondary);font-size:var(--font-size-sm);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.dashboard-preview .auth-status{min-height:8rem;padding:var(--space-lg);box-shadow:none}@media (width>=640px){.dashboard-profile{flex-direction:row;align-items:center}}@media (width>=900px){.dashboard-list,.dashboard-previews{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=480px){.dashboard-card{align-items:flex-start;gap:var(--space-md);padding:var(--space-md)}.dashboard-card__image{width:3.75rem;height:3.75rem}.dashboard-card__image--profile{width:6rem;height:6rem}.dashboard-profile{padding:var(--space-lg);text-align:center;align-items:center}.dashboard-profile .dashboard-card__content{align-items:center}.dashboard-preview{padding:var(--space-lg)}.dashboard-preview__header{align-items:flex-start}.dashboard-preview__title{font-size:var(--font-size-lg)}}*,:before,:after{box-sizing:border-box}*{margin:0}:root{--color-background:#ad96b2;--color-surface:#fff;--color-surface-soft:#f7f3f7;--color-text:#1f1224;--color-text-muted:#3f2c43;--color-border:#dfd1df;--color-accent:#740068;--color-accent-hover:#5b0052;--color-accent-contrast:#fff;--color-secondary:#006b83;--color-secondary-strong:#003844;--color-danger:#8f1838;--color-danger-surface:#fae8ed;--color-danger-border:#d7a9b6;--color-spotify:#116c43;--color-header:#fffffff0;--font-sans:"Segoe UI", system-ui, -apple-system, sans-serif;--font-size-base:1rem;--font-size-sm:.875rem;--font-size-lg:1.25rem;--font-size-xl:1.75rem;--font-size-2xl:2.25rem;--line-height-base:1.5;--space-xs:.25rem;--space-sm:.5rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:2rem;--space-2xl:3rem;--container-max-width:72rem;--radius-md:.5rem;--radius-lg:.75rem;--shadow-card:0 1rem 2.5rem #3718382e;--shadow-header:0 .25rem 1rem #37183814}html{font-size:100%}body{min-height:100vh;font-family:var(--font-sans);font-size:var(--font-size-base);line-height:var(--line-height-base);color:var(--color-text);background-color:var(--color-background);-webkit-font-smoothing:antialiased;overflow-x:hidden}img,picture,video,canvas,svg{max-width:100%;display:block}input,button,textarea,select{font:inherit}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.2}h1{font-size:var(--font-size-2xl)}h2{font-size:var(--font-size-xl)}p{color:var(--color-text-muted)}a{color:var(--color-accent);text-decoration:none}a:hover{text-decoration:underline}button,a{-webkit-tap-highlight-color:transparent}:focus-visible{outline:2px solid var(--color-accent);outline-offset:3px}#root{min-height:100vh}.container{width:100%;max-width:var(--container-max-width);padding-inline:clamp(var(--space-md), 4vw, var(--space-xl));margin-inline:auto}.app-layout{flex-direction:column;min-height:100vh;display:flex}.app-layout__main{padding-block:clamp(var(--space-xl), 6vw, var(--space-2xl));flex:1}.auth-status{align-items:center;gap:var(--space-md);min-height:7rem;padding:var(--space-xl);border:1px solid var(--color-border);border-radius:var(--radius-lg);background-color:var(--color-surface);box-shadow:var(--shadow-card);grid-template-columns:auto minmax(0,1fr);display:grid}.auth-status__message{color:var(--color-text-muted)}.auth-status__indicator{border:2px solid var(--color-border);border-top-color:var(--color-accent);border-radius:50%;width:1.5rem;height:1.5rem;animation:.8s linear infinite auth-status-spin}.auth-status__icon{background-color:var(--color-danger-surface);width:1.75rem;height:1.75rem;color:var(--color-danger);border-radius:50%;place-items:center;font-weight:700;display:inline-grid}.auth-status--error{border-color:var(--color-danger-border)}.auth-status__button{padding:var(--space-sm) var(--space-md);border:1px solid var(--color-border);border-radius:var(--radius-md);background-color:var(--color-accent);color:var(--color-accent-contrast);cursor:pointer;grid-column:2;justify-self:start}.auth-status__button:hover{border-color:var(--color-accent-hover);background-color:var(--color-accent-hover);color:var(--color-accent-contrast)}@keyframes auth-status-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.auth-status__indicator{border-color:var(--color-accent);animation:none}}@media (width<=480px){.auth-status{padding:var(--space-lg)}}