:root{--color-bg:#121212;--color-surface:#181818;--color-surface-raised:#1f1f1f;--color-surface-card:#252525;--color-surface-hover:#272727;--color-text:#fff;--color-text-muted:#b3b3b3;--color-text-subdued:#7c7c7c;--color-text-on-accent:#000;--color-surface-light:#eee;--color-text-on-light:#181818;--color-accent:#1ed760;--color-accent-hover:#3be477;--color-accent-active:#1db954;--color-success:var(--color-accent);--color-danger:#f3727f;--color-warning:#ffa42b;--color-info:#539df5;--color-border:#4d4d4d;--color-border-strong:#7c7c7c;--color-overlay:#000000b3;--radius-xs:2px;--radius-sm:4px;--radius-md:6px;--radius-lg:8px;--radius-pill:500px;--radius-full:9999px;--radius-circle:50%;--shadow-elevated:#0000004d 0 8px 8px;--shadow-dialog:#00000080 0 8px 24px;--shadow-inset-border:var(--color-bg) 0 1px 0, var(--color-border-strong) 0 0 0 1px inset;--shadow-inset-border-focus:var(--color-text) 0 0 0 1px inset;--spacing-2:2px;--spacing-4:4px;--spacing-8:8px;--spacing-12:12px;--spacing-16:16px;--spacing-20:20px;--spacing-24:24px;--spacing-32:32px;--spacing-40:40px;--spacing-48:48px;--spacing-56:56px;--font-family:"SpotifyMixUI", "Circular Std", "Helvetica Neue", Helvetica, Arial, "Hiragino Sans", Meiryo, sans-serif;--font-size-micro:.625rem;--font-size-small:.75rem;--font-size-caption:.875rem;--font-size-body:1rem;--font-size-heading:1.125rem;--font-size-title:1.5rem;--font-size-display:2rem;--font-weight-normal:400;--font-weight-semibold:600;--font-weight-bold:700;--line-height-tight:1.3;--line-height-normal:1.5;--letter-spacing-button:1.4px;--letter-spacing-button-sm:1px;--letter-spacing-label:.08em;--transition-fast:.15s ease;--layout-max-width:1440px}:root,[data-bs-theme=dark]{--bs-body-bg:var(--color-bg);--bs-body-color:var(--color-text);--bs-body-font-family:var(--font-family);--bs-border-color:var(--color-surface-raised);--bs-secondary-color:var(--color-text-muted);--bs-link-color:var(--color-text);--bs-link-hover-color:var(--color-accent)}*,:before,:after{box-sizing:border-box}[hidden]{display:none!important}html{background-color:var(--color-bg);min-height:100%}body{background-color:var(--color-bg);min-height:100vh;color:var(--color-text);font-family:var(--font-family);font-size:var(--font-size-body);font-weight:var(--font-weight-normal);line-height:var(--line-height-normal);margin:0}h1,h2,h3,h4,h5,h6{color:var(--color-text);font-weight:var(--font-weight-bold);line-height:var(--line-height-tight);margin:0}h1{font-size:var(--font-size-display)}h2{font-size:var(--font-size-title)}h3,h4,h5,h6{font-size:var(--font-size-heading)}p{margin:0}a{color:var(--color-text);transition:color var(--transition-fast);text-decoration:none}a:hover{color:var(--color-accent)}button,input,select,textarea{font-family:inherit;font-size:inherit}:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}hr{border:0;border-top:1px solid var(--color-surface-raised);margin:var(--spacing-24) 0}pre{padding:var(--spacing-16);border-radius:var(--radius-md);background-color:var(--color-surface);color:var(--color-text);margin:0;overflow-x:auto}.app-shell{background-color:var(--color-bg);min-height:100vh;color:var(--color-text)}.app-navbar{z-index:100;background-color:var(--color-bg);box-shadow:var(--color-surface-raised) 0 1px 0;position:sticky;top:0}.app-navbar-inner{justify-content:space-between;align-items:center;gap:var(--spacing-16);width:min(var(--layout-max-width), 100%);padding:var(--spacing-12) var(--spacing-24);margin:0 auto;display:flex}.app-navbar-brand{color:var(--color-text);font-size:var(--font-size-heading);font-weight:var(--font-weight-bold)}.app-main{width:min(var(--layout-max-width), 100%);padding:var(--spacing-24) var(--spacing-16);margin:0 auto}.app-main-narrow{max-width:900px}.page-header{gap:var(--spacing-16);margin-bottom:var(--spacing-24);flex-direction:column;display:flex}.page-title{font-size:var(--font-size-display);font-weight:var(--font-weight-bold)}.page-subtitle{margin-top:var(--spacing-4);color:var(--color-text-muted);font-size:var(--font-size-caption)}.toolbar{align-items:center;gap:var(--spacing-12);margin-bottom:var(--spacing-24);flex-wrap:wrap;display:flex}.toolbar>*{flex:100%}.card-grid{gap:var(--spacing-16);grid-template-columns:repeat(auto-fill,minmax(280px,1fr));display:grid}.center-screen{min-height:calc(100vh - 64px);padding:var(--spacing-24) var(--spacing-16);justify-content:center;align-items:center;display:flex}@media (width>=768px){.app-main{padding:var(--spacing-32) var(--spacing-24)}.page-header{flex-direction:row;justify-content:space-between;align-items:center}.toolbar>*{flex:0 auto}.toolbar>.app-input-search{flex:250px}.toolbar>select.app-input{width:auto;min-width:180px}}.page-header-centered{text-align:center;justify-content:center}.app-button{justify-content:center;align-items:center;gap:var(--spacing-8);padding:var(--spacing-8) var(--spacing-24);border-radius:var(--radius-full);background-color:var(--color-surface-raised);color:var(--color-text);font-size:var(--font-size-caption);font-weight:var(--font-weight-bold);letter-spacing:var(--letter-spacing-button);text-transform:uppercase;white-space:nowrap;cursor:pointer;transition:background-color var(--transition-fast), color var(--transition-fast);border:0;line-height:1;display:inline-flex}.app-button:hover{background-color:var(--color-surface-hover);color:var(--color-text)}.app-button:disabled{opacity:.5;cursor:not-allowed}.app-button-primary{background-color:var(--color-accent);color:var(--color-text-on-accent)}.app-button-primary:hover{background-color:var(--color-accent-hover);color:var(--color-text-on-accent)}.app-button-primary:active{background-color:var(--color-accent-active)}.app-button-light{background-color:var(--color-surface-light);color:var(--color-text-on-light)}.app-button-light:hover{background-color:var(--color-text);color:var(--color-text-on-light)}.app-button-outline{box-shadow:var(--color-border-strong) 0 0 0 1px inset;background-color:#0000}.app-button-outline:hover,.app-button-outline.is-active{box-shadow:var(--color-text) 0 0 0 1px inset;background-color:#0000}.app-button-outline.is-active{color:var(--color-accent);box-shadow:var(--color-accent) 0 0 0 1px inset}.app-button-danger{color:var(--color-danger);box-shadow:var(--color-danger) 0 0 0 1px inset;background-color:#0000}.app-button-danger:hover{background-color:var(--color-danger);color:var(--color-text-on-accent)}.app-button-success{color:var(--color-accent);box-shadow:var(--color-accent) 0 0 0 1px inset;background-color:#0000}.app-button-success:hover{background-color:var(--color-accent);color:var(--color-text-on-accent)}.app-button-sm{padding:var(--spacing-8) var(--spacing-16);font-size:var(--font-size-small);letter-spacing:var(--letter-spacing-button-sm)}.app-button-block{width:100%;display:flex}.app-label{margin-bottom:var(--spacing-8);color:var(--color-text-muted);font-size:var(--font-size-small);font-weight:var(--font-weight-bold);letter-spacing:var(--letter-spacing-label);text-transform:uppercase;display:block}.app-input{width:100%;min-height:44px;padding:var(--spacing-8) var(--spacing-12);border-radius:var(--radius-sm);background-color:var(--color-surface-raised);box-shadow:var(--shadow-inset-border);color:var(--color-text);font-size:var(--font-size-body);transition:box-shadow var(--transition-fast);border:0;display:block}.app-input::placeholder{color:var(--color-text-subdued)}.app-input:focus{box-shadow:var(--shadow-inset-border-focus);outline:none}.app-input:disabled{color:var(--color-text-subdued);cursor:not-allowed}.app-input-search{padding-inline:var(--spacing-24);border-radius:var(--radius-pill)}textarea.app-input{resize:vertical;min-height:88px}select.app-input option{background-color:var(--color-surface-raised);color:var(--color-text)}.input-row{gap:var(--spacing-8);display:flex}.app-card{border-radius:var(--radius-lg);background-color:var(--color-surface)}.app-card-body{padding:var(--spacing-16)}.panel{padding:var(--spacing-16);border-radius:var(--radius-lg);background-color:var(--color-surface-raised);transition:background-color var(--transition-fast)}.panel-interactive:hover{background-color:var(--color-surface-hover)}.panel-accent{box-shadow:var(--color-accent) 3px 0 0 inset}@media (width>=768px){.app-card-body{padding:var(--spacing-24)}}.app-badge{padding:var(--spacing-4) var(--spacing-8);border-radius:var(--radius-full);background-color:var(--color-surface-hover);color:var(--color-text);font-size:var(--font-size-micro);font-weight:var(--font-weight-semibold);letter-spacing:var(--letter-spacing-label);line-height:var(--line-height-normal);text-transform:uppercase;display:inline-block}.app-badge-accent{background-color:var(--color-accent);color:var(--color-text-on-accent)}.app-badge-success,.app-badge-warning,.app-badge-info,.app-badge-danger{background-color:#0000}.app-badge-success{color:var(--color-success);box-shadow:var(--color-success) 0 0 0 1px inset}.app-badge-warning{color:var(--color-warning);box-shadow:var(--color-warning) 0 0 0 1px inset}.app-badge-info{color:var(--color-info);box-shadow:var(--color-info) 0 0 0 1px inset}.app-badge-danger{color:var(--color-danger);box-shadow:var(--color-danger) 0 0 0 1px inset}.app-badge-muted{color:var(--color-text-muted);box-shadow:var(--color-border) 0 0 0 1px inset;background-color:#0000}.app-badge-block{padding:var(--spacing-8);text-align:center;display:block}.app-alert{margin-bottom:var(--spacing-16);padding:var(--spacing-12) var(--spacing-16);border-radius:var(--radius-md);background-color:var(--color-surface-raised);color:var(--color-text);font-size:var(--font-size-caption);box-shadow:var(--color-danger) 3px 0 0 inset}.app-alert-success{box-shadow:var(--color-accent) 3px 0 0 inset}.app-table{border-collapse:collapse;width:100%}.app-table th{padding:var(--spacing-12) var(--spacing-16);color:var(--color-text-muted);font-size:var(--font-size-small);font-weight:var(--font-weight-bold);letter-spacing:var(--letter-spacing-label);text-align:left;text-transform:uppercase;white-space:nowrap;box-shadow:var(--color-surface-raised) 0 -1px 0 inset}.app-table td{padding:var(--spacing-12) var(--spacing-16);vertical-align:middle;box-shadow:var(--color-surface) 0 -1px 0 inset}.app-table tbody tr{transition:background-color var(--transition-fast)}.app-table tbody tr:hover{background-color:var(--color-surface-raised)}.table-scroll{overflow-x:auto}.text-end{text-align:right!important}.empty-state{padding:var(--spacing-48) var(--spacing-20);color:var(--color-text-muted);text-align:center;grid-column:1/-1}.empty-state-icon{margin-bottom:var(--spacing-16);font-size:3rem}.loading-spinner{width:20px;height:20px;margin-right:var(--spacing-12);border:3px solid var(--color-surface-raised);border-top-color:var(--color-accent);border-radius:var(--radius-circle);vertical-align:middle;animation:.8s linear infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.text-muted{color:var(--color-text-muted)!important}.text-positive{color:var(--color-success)}.text-negative{color:var(--color-danger)}.stat-grid{gap:var(--spacing-12);padding:var(--spacing-12);border-radius:var(--radius-md);background-color:var(--color-bg);grid-template-columns:1fr 1fr;display:grid}.stat{gap:var(--spacing-4);flex-direction:column;display:flex}.stat-label{color:var(--color-text-muted);font-size:var(--font-size-micro);letter-spacing:var(--letter-spacing-label);text-transform:uppercase}.stat-value{font-size:var(--font-size-body);font-weight:var(--font-weight-bold)}.metric-list{flex-direction:column;display:flex}.metric-row{justify-content:space-between;align-items:center;gap:var(--spacing-16);padding:var(--spacing-12) 0;box-shadow:var(--color-surface-raised) 0 -1px 0 inset;display:flex}.metric-row:last-child{box-shadow:none}.metric-label{color:var(--color-text-muted);font-size:var(--font-size-caption)}.metric-value{font-weight:var(--font-weight-bold)}.modal-content{border-radius:var(--radius-lg);background-color:var(--color-surface);box-shadow:var(--shadow-dialog);color:var(--color-text);border:0}.modal-header,.modal-footer{border-color:var(--color-surface-raised)}.modal-title{font-size:var(--font-size-title);font-weight:var(--font-weight-bold)}.modal-backdrop{--bs-backdrop-bg:#000}.btn-close{filter:invert()grayscale()}
