:root{--color-bg:#000;--color-text-primary:#fff;--color-text-secondary:#e4e2e6;--color-text-disabled:#767676;--color-destructive:#e81919;--color-destructive-bg:#fddede;--color-destructive-pressed:#ff6464;--color-border:#8f9099;--color-fill-active:#1b1b1f;--color-fill-pressed:#333743;--color-icon-muted:#c5c6d0;--radius-pill:100px;--radius-card:12px;--font-family:"SF Pro Display", "SF Pro Text", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-title:700 24px/1.3 var(--font-family);--font-subtitle:510 18px/1.3 var(--font-family);--font-button:400 16px/1.3 var(--font-family);--font-row:400 14px/1.4 var(--font-family);--font-row-strong:510 14px/1.4 var(--font-family)}*{box-sizing:border-box}html,body,#root{height:100%}html{-webkit-text-size-adjust:100%}body{background:var(--color-bg);color:var(--color-text-primary);font:var(--font-row);margin:0}h1{font:var(--font-title);margin:0}h2{font:var(--font-subtitle);margin:0}a{color:inherit}input,select{font:var(--font-row);color:var(--color-text-primary);background:var(--color-fill-active);border:1px solid var(--color-border);border-radius:8px;padding:10px 14px;font-size:16px}input::placeholder{color:var(--color-text-disabled)}input:disabled{color:var(--color-text-disabled);border-color:var(--color-border);cursor:not-allowed}select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Cpath d='M4.5 7l4.5 4.5L13.5 7' stroke='%23e4e2e6' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;background-size:18px;padding-right:34px}input[type=checkbox]{all:revert;accent-color:var(--color-fill-pressed)}button{font:var(--font-button);cursor:pointer}.pill{border-radius:var(--radius-pill);border:1px solid var(--color-border);color:var(--color-text-primary);font:var(--font-button);background:0 0;align-items:center;gap:6px;padding:8px 18px;text-decoration:none;transition:background .15s,border-color .15s;display:inline-flex}.pill--active,.pill:active,.pill--pressed{background:var(--color-fill-pressed)}.pill--primary{background:var(--color-fill-pressed);border-color:var(--color-fill-pressed)}.pill--primary:hover{background:var(--color-fill-active);border-color:var(--color-border)}.pill--destructive{color:var(--color-destructive);border-color:var(--color-destructive)}.pill--destructive:hover{background:var(--color-destructive-bg);color:#000}.pill--block{justify-content:center;width:100%;display:flex}.pill--text{background:0 0;border-color:#0000;padding:8px 4px}.pill--text:hover{background:0 0}.pill--destructive.pill--text:hover{color:var(--color-destructive-pressed)}.pill:disabled{color:var(--color-text-disabled);border-color:var(--color-text-disabled);cursor:not-allowed}.band-layout{flex-direction:column;min-height:100%;display:flex}.band-content{flex:1;width:100%;max-width:900px;margin:0 auto;padding:24px}.brand-header{align-items:center;gap:16px;display:flex}.brand-header--clickable{cursor:pointer}.brand-header__logo{object-fit:contain;flex-shrink:0;width:64px;height:64px}.brand-header__text{overflow-wrap:anywhere;flex-direction:column;gap:4px;min-width:0;display:flex}.brand-header__name{font:var(--font-title)}.brand-header__subtitle{font:var(--font-subtitle)}.brand-header__logo--placeholder{border:1px solid var(--color-border);border-radius:var(--radius-card);font:var(--font-title);color:var(--color-text-primary);justify-content:center;align-items:center;display:flex}.auth-page{justify-content:center;align-items:center;min-height:100%;padding:24px;display:flex}.auth-card{background:var(--color-fill-active);border:1px solid var(--color-border);border-radius:var(--radius-card);flex-direction:column;gap:16px;width:100%;max-width:360px;padding:32px;display:flex}.auth-card h1{text-align:center}.auth-card label{font:var(--font-row);color:var(--color-text-secondary);flex-direction:column;gap:6px;display:flex}.auth-card>button{justify-content:center;margin-top:8px}.auth-card__actions{flex-direction:column;gap:8px;margin-top:8px;display:flex}.auth-card__actions button{justify-content:center}.auth-error{color:var(--color-destructive);font:var(--font-row);margin:0}.auth-note{color:var(--color-text-disabled);font:var(--font-row);text-align:center;margin:0}.confirm-dialog__backdrop{z-index:100;background:#0009;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.confirm-dialog{background:var(--color-fill-active);border:1px solid var(--color-border);border-radius:var(--radius-card);flex-direction:column;gap:20px;width:100%;max-width:360px;padding:20px;display:flex}.confirm-dialog p{font:var(--font-row);color:var(--color-text-primary);margin:0}.confirm-dialog__actions{justify-content:flex-end;gap:10px;display:flex}.sort-control{justify-content:space-between;align-items:center;gap:16px;display:flex;position:relative}.sort-control__label{color:var(--color-text-disabled)}.sort-control__label-prefix{font:400 13px/1.4 var(--font-family)}.sort-control__label-value{font:600 13px/1.4 var(--font-family)}.sort-control__toggle{color:var(--color-text-primary);background:0 0;border:none;justify-content:center;align-items:center;padding:4px;display:inline-flex}.sort-control__toggle--open{color:var(--color-text-secondary)}.sort-control__panel{background:var(--color-fill-active);border:1px solid var(--color-border);border-radius:var(--radius-card);z-index:20;flex-direction:column;gap:2px;min-width:200px;padding:6px;display:flex;position:absolute;top:calc(100% + 8px);right:0}.sort-control__item{text-align:left;width:100%;font:var(--font-row);color:var(--color-text-primary);background:0 0;border:none;border-radius:8px;padding:10px 12px;display:block}.sort-control__item-value{font-weight:600}.sort-control__item:hover{background:var(--color-fill-pressed)}.sort-control__item--active{background:var(--color-fill-active)}.customer-main{flex-direction:column;gap:32px;max-width:900px;margin:0 auto;padding:24px;display:flex}.customer-topbar{justify-content:space-between;align-items:flex-start;gap:16px;display:flex}.customer-track-list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.customer-track-row{padding:0}.customer-track-row__link{border-radius:8px;padding:6px 4px;text-decoration:none;display:block}.customer-track-row__link:hover{background:var(--color-fill-active)}.customer-track-row__artist,.customer-track-row__sep{font:var(--font-row);color:var(--color-text-secondary)}.customer-track-row__title{font:var(--font-row-strong);color:var(--color-text-primary)}.back-button{color:var(--color-icon-muted);background:0 0;border:none;justify-content:center;align-items:center;padding:4px;display:inline-flex}.track-view{flex-direction:column;gap:48px;display:flex}.track-view__header{align-items:center;gap:24px;display:flex}.track-view__info{flex-direction:column;gap:6px;display:flex}.track-view__meta{font:var(--font-row);color:var(--color-text-secondary);margin:0}.track-view__title{margin:0}.track-view__artist{font:var(--font-row);color:var(--color-text-secondary);margin:0}.track-view>.hidden-toggle{margin-top:24px;margin-bottom:-24px}.track-view__meta--dates{color:var(--color-text-disabled)}.track-view__info--copy{cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}.copy-tip{color:var(--color-text-disabled);font:var(--font-row);white-space:nowrap;pointer-events:none;z-index:20;margin:0;position:fixed;transform:translate(-50%,calc(-100% - 14px))}.menu-page__items{flex-direction:column;display:flex}.menu-page__item{text-align:left;width:100%;font:var(--font-row-strong);color:var(--color-text-primary);background:0 0;border:none;border-radius:8px;align-items:center;gap:16px;padding:16px 4px;text-decoration:none;display:flex}.menu-page__item:hover{background:var(--color-fill-active)}.menu-page__item-icon{flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;display:flex}.menu-page__item-label{flex:1}.menu-page__item-chevron{color:var(--color-icon-muted);flex-shrink:0;display:flex}.inline-form{flex-wrap:wrap;gap:10px;display:flex}.inline-form input{flex:1;min-width:160px}.row-list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.row-list__item{border:1px solid var(--color-border);border-radius:var(--radius-card);font:var(--font-row);justify-content:space-between;align-items:center;padding:14px 18px;display:flex}.row-list__primary{font:var(--font-row-strong);overflow-wrap:anywhere;min-width:0}.row-list__secondary{color:var(--color-text-secondary)}.row-list__actions{gap:8px;display:flex}.badge{color:var(--color-text-disabled);font:var(--font-row);border:1px solid var(--color-text-disabled);border-radius:var(--radius-pill);margin-left:10px;padding:2px 10px}.users-row{border:none;padding:10px 4px}.users-row__info{flex-direction:column;align-items:flex-start;gap:6px;display:flex}.users-row__info .badge{margin-left:0}.chip-grid{flex-wrap:wrap;gap:10px;margin:16px 0;display:flex}.form-grid{flex-direction:column;gap:16px;max-width:480px;display:flex}.form-grid--spaced{margin-top:16px}.form-grid label,.form-grid .form-field{color:var(--color-text-secondary);flex-direction:column;gap:6px;display:flex}.form-row{gap:16px;display:flex}.form-row>label{flex:1}.form-actions{gap:10px;margin-top:8px;display:flex}.inline-form .input-clear-wrap{flex:1;min-width:160px}.hidden-toggle{color:var(--color-text-secondary);font:var(--font-row);align-items:center;gap:10px;display:flex}.hidden-toggle--inactive,.hidden-toggle--inactive .stop-row__toggle{color:var(--color-text-disabled)}.created-user-card{border:1px solid var(--color-border);border-radius:var(--radius-card);margin-top:24px;padding:16px 18px}.created-user-card code{background:var(--color-fill-pressed);border-radius:6px;margin-top:6px;padding:6px 10px;font-size:14px;display:inline-block}.chip-label{color:inherit;font:inherit;background:0 0;border:none;padding:0}.chip-remove{color:inherit;background:0 0;border:none;margin:-8px -8px -8px -6px;padding:8px;font-size:16px;line-height:1}.chip-remove:hover{color:var(--color-destructive)}.users-row__bands{text-align:left;font:var(--font-row);color:var(--color-text-secondary);background:0 0;border:none;padding:0}.users-row__bands:hover{color:var(--color-text-primary)}.users-row__actions{gap:8px;display:flex}.profile-bands,.add-user__title{margin-top:16px}.users-row__role{border-radius:100px;padding:4px 30px 4px 10px}.users-row__others{font-size:13px}.existing-users__notice{color:var(--color-text-secondary);margin:0}.band-main{flex-direction:column;gap:32px;display:flex}.track-list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.track-row{align-items:baseline;gap:12px;padding:6px 4px;display:flex}.track-row__link{border-radius:8px;flex:1;align-items:baseline;gap:12px;margin:-6px -4px;padding:6px 4px;text-decoration:none;display:flex}.track-row__link:hover{background:var(--color-fill-active)}.track-row__tempo{font:var(--font-row);color:var(--color-text-secondary);min-width:28px}.track-row__title{font:var(--font-row-strong);color:var(--color-text-primary)}.track-row__tonality,.track-row__artist{font:var(--font-row);color:var(--color-text-secondary)}.band-row{align-items:center;gap:16px;display:flex}.band-row__link{min-width:0;color:inherit;flex:1;align-items:center;gap:16px;text-decoration:none;display:flex}.band-row__logo{object-fit:contain;border-radius:8px;flex-shrink:0;width:48px;height:48px}.band-row__logo--placeholder{border:1px solid var(--color-border);font:var(--font-subtitle);justify-content:center;align-items:center;display:flex}.band-row__info{flex-direction:column;align-items:flex-start;gap:6px;display:flex}.band-edit__logo-preview{object-fit:contain;border-radius:var(--radius-card);border:1px solid var(--color-border);width:96px;height:96px}.band-edit__logo-row{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.band-edit__hint{font:var(--font-row);color:var(--color-text-disabled);margin:0}.fields-control{position:relative}.fields-control__toggle{color:var(--color-text-primary);background:0 0;border:none;justify-content:center;align-items:center;padding:4px;display:inline-flex}.fields-control__toggle--open{color:var(--color-text-secondary)}.fields-control__panel{background:var(--color-fill-active);border:1px solid var(--color-border);border-radius:var(--radius-card);z-index:20;flex-direction:column;gap:2px;min-width:180px;padding:6px;display:flex;position:absolute;top:calc(100% + 8px);right:0}.fields-control__item{font:var(--font-row);color:var(--color-text-primary);cursor:pointer;border-radius:8px;align-items:center;gap:10px;padding:10px 12px;display:flex}.fields-control__item:hover{background:var(--color-fill-pressed)}.track-controls{align-items:center;gap:4px;display:flex}.track-controls>.sort-control{flex:1;min-width:0}.stop-row{align-items:center;gap:10px}.stop-row__toggle{color:var(--color-text-secondary);background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:inline-flex}.stop-row--hidden .stop-row__toggle,.stop-row--hidden .track-row__tempo,.stop-row--hidden .track-row__title,.stop-row--hidden .track-row__tonality{color:var(--color-text-disabled)}.input-clear-wrap{position:relative}.input-clear-wrap input{width:100%;padding-right:36px}.input-clear{color:var(--color-text-disabled);background:0 0;border:none;padding:4px;font-size:18px;line-height:1;position:absolute;top:50%;right:8px;transform:translateY(-50%)}.input-clear:hover{color:var(--color-text-primary)}.artist-suggest{flex:1;min-width:160px;position:relative}.artist-suggest__panel{background:var(--color-fill-active);border:1px solid var(--color-border);border-radius:var(--radius-card);z-index:20;flex-direction:column;gap:2px;max-height:240px;padding:6px;display:flex;position:absolute;top:calc(100% + 4px);left:0;right:0;overflow-y:auto}.artist-suggest__item{text-align:left;width:100%;font:var(--font-row);color:var(--color-text-primary);background:0 0;border:none;border-radius:8px;padding:10px 12px;display:block}.artist-suggest__item--active{background:var(--color-fill-pressed)}@media (hover:hover){.artist-suggest__item:hover{background:var(--color-fill-pressed)}}.artist-suggest__item:active{background:var(--color-fill-pressed)}.stats-list{flex-direction:column;gap:18px;margin:0;padding:0;list-style:none;display:flex}.stats-row{font:var(--font-row);justify-content:space-between;align-items:baseline;gap:16px;display:flex}.stats-row__label{color:var(--color-border);overflow-wrap:anywhere}.stats-row__count{font:var(--font-row-strong);color:var(--color-text-primary)}.existing-suggest__name{color:var(--color-text-secondary)}.existing-suggest__bands{color:var(--color-text-disabled);margin-top:2px;font-size:12px;display:block}.existing-suggest__none{color:var(--color-text-disabled);font:var(--font-row);padding:12px}
