:root{--font-family:"Outfit", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:24px;--transition-fast:.15s ease;--transition-normal:.25s ease;--transition-slow:.4s cubic-bezier(.16, 1, .3, 1)}[data-theme=light],:root{--bg-main:#f3f4f6;--bg-surface:#fff;--bg-surface-hover:#f9fafb;--bg-elevated:#fff;--text-primary:#111827;--text-secondary:#4b5563;--text-tertiary:#9ca3af;--border-subtle:#e5e7eb;--border-strong:#d1d5db;--accent-color:#3b82f6;--accent-hover:#2563eb;--accent-bg:#eff6ff;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #0000000d, 0 2px 4px -1px #00000008;--shadow-lg:0 10px 15px -3px #0000000d, 0 4px 6px -2px #00000006;--status-ready-bg:#f3f4f6;--status-ready-text:#4b5563;--status-prog-bg:#eff6ff;--status-prog-text:#2563eb;--status-done-bg:#f0fdf4;--status-done-text:#16a34a;--danger-color:#ef4444}[data-theme=dark]{--bg-main:#09090b;--bg-surface:#121214;--bg-surface-hover:#1f1f22;--bg-elevated:#18181b;--text-primary:#fafafa;--text-secondary:#a1a1aa;--text-tertiary:#71717a;--border-subtle:#27272a;--border-strong:#3f3f46;--accent-color:#e4e4e7;--accent-hover:#fff;--accent-bg:#27272a;--shadow-sm:0 1px 2px #000c;--shadow-md:0 4px 12px #000c;--shadow-lg:0 12px 32px #000000e6;--status-ready-bg:#27272a;--status-ready-text:#a1a1aa;--status-prog-bg:#3b82f626;--status-prog-text:#60a5fa;--status-done-bg:#22c55e26;--status-done-text:#4ade80;--danger-color:#f87171}[data-theme=ocean]{--bg-main:#0f172a;--bg-surface:#1e293b;--bg-surface-hover:#334155;--bg-elevated:#1e293b;--text-primary:#f8fafc;--text-secondary:#94a3b8;--text-tertiary:#64748b;--border-subtle:#334155;--border-strong:#475569;--accent-color:#38bdf8;--accent-hover:#7dd3fc;--accent-bg:#38bdf81a;--status-ready-bg:#334155;--status-ready-text:#94a3b8;--status-prog-bg:#38bdf826;--status-prog-text:#38bdf8;--status-done-bg:#34d39926;--status-done-text:#34d399;--danger-color:#f87171}[data-theme=sunset]{--bg-main:#2a0f18;--bg-surface:#3e1625;--bg-surface-hover:#581c34;--bg-elevated:#3e1625;--text-primary:#fff1f2;--text-secondary:#fecdd3;--text-tertiary:#fda4af;--border-subtle:#581c34;--border-strong:#831843;--accent-color:#fb923c;--accent-hover:#fdba74;--accent-bg:#fb923c26;--status-ready-bg:#581c34;--status-ready-text:#fecdd3;--status-prog-bg:#fb923c26;--status-prog-text:#fb923c;--status-done-bg:#34d39926;--status-done-text:#34d399;--danger-color:#f87171}*{box-sizing:border-box;font-family:var(--font-family);margin:0;padding:0}body{background-color:var(--bg-main);color:var(--text-primary);-webkit-font-smoothing:antialiased;min-height:100vh;transition:background-color .3s,color .3s;overflow-x:hidden}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:10px}::-webkit-scrollbar-thumb:hover{background:var(--text-tertiary)}h1,h2,h3,h4,h5,h6{letter-spacing:-.01em;font-weight:700;line-height:1.2}.highlight{color:var(--accent-color)}.code{background:var(--bg-surface-hover);border:1px solid var(--border-subtle);color:var(--text-primary);border-radius:4px;padding:.2rem .4rem;font-family:JetBrains Mono,monospace;font-size:.9em}#app,.layout-wrapper{flex-direction:column;min-height:100vh;display:flex}.global-header{z-index:50;background-color:var(--bg-surface);border-bottom:1px solid var(--border-subtle);box-shadow:var(--shadow-sm);justify-content:space-between;align-items:center;height:64px;padding:0 2rem;transition:background-color .3s;display:flex;position:sticky;top:0}.header-left{align-items:center;gap:3rem;display:flex}.logo-text{letter-spacing:-.5px;align-items:center;gap:8px;font-weight:800;display:flex}.header-nav{gap:.5rem;display:flex}.nav-btn{color:var(--text-secondary);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition-fast);background:0 0;border:none;align-items:center;gap:8px;padding:8px 16px;font-size:.95rem;font-weight:600;display:flex}.nav-btn svg{stroke-width:2.5px;width:18px;height:18px}.nav-btn:hover{color:var(--text-primary);background:var(--bg-surface-hover)}.nav-btn.active{color:var(--accent-color);background:var(--accent-bg)}.header-right{align-items:center;gap:1rem;display:flex}.user-profile-badge{background:var(--bg-surface-hover);border:1px solid var(--border-subtle);cursor:pointer;transition:var(--transition-fast);color:var(--text-primary);border-radius:20px;align-items:center;gap:8px;padding:6px 16px;font-weight:600;display:flex}.user-profile-badge:hover{border-color:var(--border-strong)}.user-avatar svg{width:16px;height:16px}.user-id-text{font-size:.9rem}.layout-main{flex:1;width:100%;max-width:1200px;margin:0 auto;padding:3rem 2rem}.flat-panel{background:var(--bg-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:var(--transition-normal);padding:2rem}.badge{background:var(--bg-surface-hover);color:var(--text-secondary);border:1px solid var(--border-subtle);border-radius:6px;padding:4px 10px;font-size:.8rem;font-weight:600}.status-badge{white-space:nowrap;border-radius:20px;justify-content:center;align-items:center;padding:6px 12px;font-size:.75rem;font-weight:700;display:inline-flex}.status-ready{background:var(--status-ready-bg);color:var(--status-ready-text)}.status-progress{background:var(--status-prog-bg);color:var(--status-prog-text)}.status-done{background:var(--status-done-bg);color:var(--status-done-text)}.btn{border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition-fast);border:1px solid #0000;justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-size:.95rem;font-weight:600;display:inline-flex}.btn svg{stroke-width:2.5px;width:18px;height:18px}.btn:active{transform:scale(.98)}.btn.small{padding:6px 12px;font-size:.85rem}.btn.small svg{width:14px;height:14px}.primary-btn{background:var(--text-primary);color:var(--bg-surface);border:none}.primary-btn:hover{opacity:.9;box-shadow:var(--shadow-md)}.secondary-btn{background:var(--bg-surface);color:var(--text-primary);border:1px solid var(--border-strong);box-shadow:var(--shadow-sm)}.secondary-btn:hover{background:var(--bg-surface-hover)}.outline-btn{border:1px solid var(--border-strong);color:var(--text-primary);background:0 0}.outline-btn:hover{background:var(--bg-surface-hover)}.danger-btn{border:1px solid var(--danger-color);color:var(--danger-color);background:0 0}.danger-btn:hover{background:var(--danger-color);color:#fff}.icon-btn{color:var(--text-secondary);cursor:pointer;border-radius:var(--radius-sm);transition:var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;padding:8px;display:inline-flex}.icon-btn svg{stroke-width:2px;width:20px;height:20px}.icon-btn:hover{color:var(--text-primary);background:var(--bg-surface-hover)}.icon-btn.danger:hover{color:var(--danger-color);background:#ef44441a}.input-group{margin-bottom:1.5rem}.input-group label{color:var(--text-secondary);margin-bottom:.5rem;font-size:.9rem;font-weight:600;display:block}input[type=text],input[type=password],input[type=number],input[type=date],select{background:var(--bg-surface);border:1px solid var(--border-strong);border-radius:var(--radius-sm);width:100%;color:var(--text-primary);transition:var(--transition-fast);box-shadow:var(--shadow-sm);padding:12px 16px;font-family:inherit;font-size:1rem}input:focus,select:focus{border-color:var(--accent-color);box-shadow:0 0 0 3px var(--accent-bg);outline:none}.auth-panel{text-align:center;width:100%;max-width:400px;margin:4rem auto}.auth-panel .logo-text{justify-content:center;margin-bottom:.5rem;font-size:2.5rem}.auth-panel .subtitle{color:var(--text-secondary);margin-bottom:2.5rem}.tabs{border-bottom:1px solid var(--border-subtle);margin-bottom:2rem;display:flex}.tab-btn{color:var(--text-secondary);cursor:pointer;transition:var(--transition-fast);background:0 0;border:none;flex:1;padding:12px 0;font-size:1rem;font-weight:600;position:relative}.tab-btn.active{color:var(--text-primary)}.tab-btn.active:after{content:"";background:var(--text-primary);width:100%;height:2px;position:absolute;bottom:-1px;left:0}.page-header{margin-bottom:3rem}.page-title{color:var(--text-primary);margin-bottom:.5rem;font-size:2rem}.page-subtitle{color:var(--text-secondary);font-size:1.1rem}.bands-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem;display:grid}.band-card{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);cursor:pointer;transition:var(--transition-fast);text-align:center;box-shadow:var(--shadow-sm);flex-direction:column;align-items:center;padding:2rem;display:flex}.band-card:hover{border-color:var(--border-strong);box-shadow:var(--shadow-md);transform:translateY(-2px)}.band-card.dashed-card{border:2px dashed var(--border-strong);min-height:220px;box-shadow:none;background:0 0;justify-content:center}.band-card.dashed-card:hover{background:var(--bg-surface);border-color:var(--text-primary)}.dashed-card-icon svg{width:32px;height:32px;color:var(--text-secondary);margin-bottom:1rem}.band-card.dashed-card:hover .dashed-card-icon svg{color:var(--text-primary)}.band-logo{border-radius:var(--radius-lg);object-fit:cover;border:1px solid var(--border-subtle);width:80px;height:80px;margin-bottom:1.2rem}.band-card h4{margin-bottom:.5rem;font-size:1.2rem}.settings-content{max-width:800px}.settings-section{margin-bottom:2rem}.section-title{border-bottom:1px solid var(--border-subtle);margin-bottom:1.5rem;padding-bottom:.5rem;font-size:1.2rem}.theme-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1rem;display:grid}.theme-card{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-md);cursor:pointer;transition:var(--transition-fast);box-shadow:var(--shadow-sm);padding:1.2rem}.theme-card:hover{border-color:var(--border-strong)}.theme-card.active{border-color:var(--accent-color);background:var(--accent-bg)}.theme-card-header{align-items:center;gap:10px;margin-bottom:.5rem;display:flex}.theme-card-header input{cursor:pointer;width:auto;box-shadow:none;margin:0}.theme-name{font-weight:700}.theme-desc{color:var(--text-secondary);font-size:.85rem;line-height:1.4}.band-header-section{justify-content:space-between;align-items:center;gap:2rem;margin-bottom:2.5rem;display:flex}.band-header-info{align-items:center;gap:2rem;display:flex}.band-logo-large{border-radius:var(--radius-lg);object-fit:cover;border:1px solid var(--border-subtle);width:100px;height:100px;box-shadow:var(--shadow-sm)}.horizontal-tabs{border-bottom:1px solid var(--border-subtle);gap:2rem;margin-bottom:2rem;display:flex}.h-tab-btn{color:var(--text-secondary);cursor:pointer;transition:var(--transition-fast);background:0 0;border:none;align-items:center;gap:8px;padding:0 0 12px;font-size:1rem;font-weight:600;display:flex;position:relative}.h-tab-btn svg{width:18px;height:18px}.h-tab-btn:hover,.h-tab-btn.active{color:var(--text-primary)}.h-tab-btn.active:after{content:"";background:var(--text-primary);width:100%;height:2px;position:absolute;bottom:-1px;left:0}.data-list{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);list-style:none;overflow:hidden}.data-list-item{border-bottom:1px solid var(--border-subtle);justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.5rem;display:flex}.data-list-item:last-child{border-bottom:none}.data-list-item:hover{background:var(--bg-surface-hover)}.table-responsive{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);overflow-x:auto}.data-table{border-collapse:collapse;text-align:left;width:100%;min-width:800px;font-size:.95rem}.data-table th,.data-table td{border-bottom:1px solid var(--border-subtle);vertical-align:middle;padding:1rem}.data-table th{background:var(--bg-surface-hover);color:var(--text-secondary);white-space:nowrap;font-size:.85rem;font-weight:600}.data-table td{color:var(--text-primary)}.data-table tbody tr:hover{background:var(--bg-surface-hover)}.data-table tbody tr:last-child td{border-bottom:none}.hover-cell{transition:background-color .2s,box-shadow .2s}.hover-cell:hover{background-color:var(--accent-bg);box-shadow:inset 0 0 0 1px var(--accent-color)}.member-chip{background:var(--bg-main);border:1px solid var(--border-subtle);white-space:nowrap;border-radius:4px;margin:2px;padding:2px 8px;font-size:.8rem;display:inline-block}.session-stats-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:1rem;display:grid}.session-stat-card{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-md);text-align:center;box-shadow:var(--shadow-sm);padding:1.5rem}.session-stat-icon{color:var(--text-secondary);justify-content:center;margin-bottom:.5rem;display:flex}.session-stat-icon svg{width:28px;height:28px}.session-stat-count{color:var(--text-primary);margin:.5rem 0;font-size:2rem;font-weight:800}.modal{z-index:100;background:#00000080;justify-content:center;align-items:center;padding:1rem;animation:.2s fadeIn;display:flex;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-content{background:var(--bg-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);width:100%;max-width:500px;box-shadow:var(--shadow-lg);padding:2.5rem;animation:.3s cubic-bezier(.16,1,.3,1) slideUp;position:relative}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.close-btn{color:var(--text-tertiary);cursor:pointer;border-radius:var(--radius-sm);transition:var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;padding:.5rem;display:flex;position:absolute;top:1.5rem;right:1.5rem}.close-btn svg{width:24px;height:24px}.close-btn:hover{color:var(--text-primary);background:var(--bg-surface-hover)}.empty-state{text-align:center;color:var(--text-tertiary);padding:4rem 1rem}.empty-state-icon{color:var(--border-strong);justify-content:center;margin-bottom:1rem;display:flex}.empty-state-icon svg{stroke-width:1.5px;width:48px;height:48px}.inline-checkboxes{flex-wrap:wrap;gap:1rem;display:flex}.inline-checkboxes label{cursor:pointer;align-items:center;gap:8px;font-weight:500;display:flex}.inline-checkboxes input[type=checkbox]{width:18px;height:18px;accent-color:var(--text-primary)}
