@import"https://fonts.googleapis.com/css2?family=Alexandria:wght@300;400;500;600;700;800&display=swap";*{box-sizing:border-box;margin:0;padding:0}:root{font-family:Alexandria,Segoe UI,Roboto,Helvetica,Arial,sans-serif}[hidden]{display:none!important}.auth-container{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1rem;background:linear-gradient(135deg,#f4edff,#e8d9ff)}.auth-card{background:var(--color-surface, rgba(255, 255, 255, .9));border:1px solid var(--color-border, rgba(171, 0, 246, .2));border-radius:24px;padding:2rem;width:100%;max-width:380px;box-shadow:var(--shadow-soft, 0 20px 50px rgba(73, 21, 116, .15))}.auth-logo{display:block;max-width:180px;height:auto;margin:0 auto .5rem}.auth-title{font-size:1.75rem;text-align:center;margin-bottom:.25rem;color:var(--color-text, #1e1335)}.auth-subtitle{text-align:center;color:var(--color-muted, #5a4a7a);margin-bottom:1.5rem;font-size:.85rem}.auth-tabs{display:flex;gap:0;margin-bottom:1.5rem;background:#ab00f614;border-radius:12px;padding:4px}.auth-tab{flex:1;padding:.6rem 1rem;border:none;background:transparent;border-radius:10px;font-size:.9rem;font-weight:500;color:var(--color-muted, #5a4a7a);cursor:pointer;transition:all .2s ease}.auth-tab:hover{color:var(--color-primary, #ab00f6)}.auth-tab.active{background:#fff;color:var(--color-primary, #ab00f6);box-shadow:0 2px 8px #ab00f626}.auth-form{display:flex;flex-direction:column;gap:1rem}.auth-form[hidden]{display:none}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-group label{font-size:.8rem;font-weight:500;color:var(--color-muted, #5a4a7a);margin-bottom:0}.form-group input{padding:.7rem .9rem;border:1px solid var(--color-border, rgba(171, 0, 246, .2));border-radius:10px;background:#fff;color:var(--color-text, #1e1335);font-size:.95rem;transition:border-color .2s,box-shadow .2s}.form-group input::placeholder{color:#b3a0c9}.form-group input:focus{outline:none;border-color:var(--color-primary, #ab00f6);box-shadow:0 0 0 3px #ab00f61f}.btn{padding:.7rem 1.25rem;border:none;border-radius:12px;font-size:.95rem;font-weight:600;cursor:pointer;transition:transform .15s,box-shadow .15s}.btn-primary{background:var(--color-primary, #ab00f6);color:#fff;box-shadow:0 4px 16px #ab00f64d}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 6px 20px #ab00f666}.btn-primary:active{transform:translateY(0)}.error-message{background:#ff64641a;border:1px solid rgba(255,100,100,.3);color:#d32f2f;padding:.6rem .8rem;border-radius:8px;font-size:.85rem;text-align:center}.auth-links{text-align:center;margin-top:.75rem}.auth-links a{color:var(--color-primary, #ab00f6);text-decoration:none;font-size:.85rem}.auth-links a:hover{text-decoration:underline}.auth-info{margin-top:1rem}.auth-info .info-text{font-size:.8rem;color:var(--color-muted, #5a4a7a);text-align:center;line-height:1.5}.dashboard-container{max-width:900px;margin:0 auto;padding:2rem;min-height:100vh}.dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;padding-bottom:1rem;border-bottom:1px solid var(--color-border, rgba(171, 0, 246, .15))}.dashboard-header h1{font-size:1.5rem;color:var(--color-text, #1e1335)}.header-logo{height:70px;width:auto}.user-info{display:flex;align-items:center;gap:1rem}.user-name{color:var(--color-muted, #5a4a7a);font-size:.9rem}.btn-logout{background:#ab00f614;color:var(--color-primary, #ab00f6);padding:.5rem 1rem;border-radius:10px;font-size:.85rem;border:1px solid var(--color-border, rgba(171, 0, 246, .2))}.btn-logout:hover{background:#ab00f626}.section-title{font-size:1.1rem;font-weight:600;margin-bottom:1rem;color:var(--color-text, #1e1335)}.party-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem}.party-card{background:var(--color-surface, rgba(255, 255, 255, .9));border:1px solid var(--color-border, rgba(171, 0, 246, .15));border-radius:16px;padding:1.25rem;transition:transform .2s,box-shadow .2s}.party-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-soft, 0 12px 32px rgba(73, 21, 116, .12))}.party-card h3{margin-bottom:.25rem;color:var(--color-text, #1e1335);font-size:1rem}.party-meta{color:var(--color-muted, #5a4a7a);font-size:.85rem;margin-bottom:.15rem}.party-slug{color:var(--color-muted, #5a4a7a);font-size:.8rem;font-family:monospace}.party-status{display:inline-block;padding:.2rem .6rem;border-radius:6px;font-size:.7rem;font-weight:600;text-transform:uppercase;margin:.5rem 0}.party-status.active{background:#4caf5026;color:#2e7d32}.party-status.inactive{background:#ffc10726;color:#f57c00}.party-status.ended{background:#9e9e9e26;color:#757575}.party-actions{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.75rem}.btn-small{padding:.4rem .75rem;font-size:.8rem;border-radius:8px}.btn-secondary{background:#ab00f614;color:var(--color-primary, #ab00f6);border:1px solid var(--color-border, rgba(171, 0, 246, .15))}.btn-secondary:hover{background:#ab00f626}.btn-danger{background:#f443361a;color:#d32f2f;border:1px solid rgba(244,67,54,.2)}.btn-danger:hover{background:#f443362e}.spotify-status{display:flex;align-items:center;gap:.75rem;padding:.9rem 1.1rem;background:#4caf501a;border:1px solid rgba(76,175,80,.2);border-radius:12px;margin-bottom:1.5rem;color:var(--color-text, #1e1335);font-size:.9rem}.spotify-status.disconnected{background:#ff98001a;border-color:#ff980040}.spotify-icon{font-size:1.25rem}.create-party-form{background:var(--color-surface, rgba(255, 255, 255, .9));border:1px solid var(--color-border, rgba(171, 0, 246, .15));border-radius:16px;padding:1.25rem;margin-bottom:1.5rem}.create-party-form h2{font-size:1rem;margin-bottom:1rem;color:var(--color-text, #1e1335)}.form-row{display:flex;gap:.75rem;align-items:flex-end;flex-wrap:wrap;margin-bottom:1rem}.form-row:last-child{margin-bottom:0}.form-row .form-group{flex:1;min-width:150px}.form-row .form-group.form-group-full{flex:100%;min-width:100%}.form-row .btn{flex-shrink:0}.form-group small{color:var(--color-muted, #5a4a7a);font-size:.7rem}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-overlay[hidden]{display:none}.modal{background:#1a1a2e;border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:2rem;max-width:500px;width:90%}.modal h2{margin-bottom:1rem}.modal-actions{display:flex;gap:1rem;justify-content:flex-end;margin-top:1.5rem}.setup-wizard{max-width:700px;margin:0 auto;padding:2rem}.wizard-header{text-align:center;margin-bottom:2rem}.wizard-header h2{font-size:1.75rem;color:var(--color-accent, #ab00f6);margin-bottom:.5rem}.wizard-subtitle{color:var(--color-muted, #5a4a7a)}.wizard-progress{display:flex;justify-content:space-between;margin-bottom:2rem;padding:0 1rem}.progress-step{display:flex;flex-direction:column;align-items:center;gap:.5rem;flex:1;position:relative}.progress-step:after{content:"";position:absolute;top:16px;left:50%;width:100%;height:2px;background:var(--color-border, #ddd);z-index:-1}.progress-step:last-child:after{display:none}.step-number{width:32px;height:32px;border-radius:50%;background:var(--color-surface, #fff);border:2px solid var(--color-border, #ddd);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.875rem;color:var(--color-muted, #888);transition:all .3s ease}.progress-step.active .step-number,.progress-step.completed .step-number{background:var(--color-accent, #ab00f6);border-color:var(--color-accent, #ab00f6);color:#fff}.progress-step.completed .step-number:after{content:"✓"}.step-label{font-size:.75rem;color:var(--color-muted, #888);text-align:center}.progress-step.active .step-label{color:var(--color-accent, #ab00f6);font-weight:600}.wizard-step{display:none;background:var(--color-surface, rgba(255, 255, 255, .95));border:1px solid var(--color-border, rgba(171, 0, 246, .2));border-radius:16px;padding:2rem;margin-bottom:1rem}.wizard-step.active{display:block}.step-content{margin-bottom:2rem}.step-icon{font-size:3rem;text-align:center;margin-bottom:1rem}.step-icon .spotify-logo-icon{width:64px;height:64px}.step-content h3{font-size:1.25rem;color:var(--color-text, #1e1335);margin-bottom:.75rem}.step-content p{color:var(--color-muted, #5a4a7a);margin-bottom:1rem;line-height:1.6}.info-box,.warning-box,.success-box{padding:1rem;border-radius:8px;margin:1rem 0;font-size:.9rem}.info-box{background:#ab00f61a;border-left:4px solid var(--color-accent, #ab00f6);color:var(--color-text, #1e1335)}.warning-box{background:#ffc10726;border-left:4px solid #ffc107;color:#856404}.success-box{background:#28a74526;border-left:4px solid #28a745;color:#155724;display:flex;align-items:center;gap:.75rem}.success-icon{font-size:1.5rem}.instruction-list{padding-left:1.5rem;margin:1rem 0;color:var(--color-text, #1e1335)}.instruction-list li{margin-bottom:.75rem;line-height:1.5}.form-example{background:var(--color-surface-alt, #f8f5ff);border:1px solid var(--color-border, rgba(171, 0, 246, .2));border-radius:12px;padding:1.5rem;margin:1rem 0}.form-field-example{margin-bottom:1rem}.form-field-example:last-child{margin-bottom:0}.form-field-example label{display:block;font-weight:600;font-size:.8rem;color:var(--color-muted, #5a4a7a);margin-bottom:.25rem}.example-value{background:#fff;border:1px solid var(--color-border, #ddd);border-radius:6px;padding:.75rem;font-family:monospace;font-size:.85rem;color:var(--color-text, #1e1335)}.example-value.copyable{cursor:pointer;position:relative;transition:background .2s}.example-value.copyable:hover{background:#ab00f60d}.copy-hint{display:block;font-size:.7rem;color:var(--color-accent, #ab00f6);margin-top:.25rem;font-family:system-ui}.example-note{font-size:.75rem;color:#856404;margin-top:.25rem}.credentials-form{margin-top:1.5rem}.credentials-form .form-group{margin-bottom:1.25rem}.credentials-form label{display:block;font-weight:600;margin-bottom:.5rem;color:var(--color-text, #1e1335)}.credentials-form input{width:100%;padding:.875rem 1rem;border:1px solid var(--color-border, rgba(171, 0, 246, .3));border-radius:8px;font-size:1rem;font-family:monospace;background:var(--color-input-bg, rgba(255, 255, 255, .9));transition:border-color .2s,box-shadow .2s}.credentials-form input:focus{outline:none;border-color:var(--color-accent, #ab00f6);box-shadow:0 0 0 3px #ab00f626}.input-with-toggle{position:relative;display:flex}.input-with-toggle input{padding-right:3rem}.toggle-visibility{position:absolute;right:.75rem;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;font-size:1.2rem;opacity:.6}.toggle-visibility:hover{opacity:1}.form-hint{display:block;font-size:.75rem;color:var(--color-muted, #888);margin-top:.25rem}.step-actions{display:flex;justify-content:space-between;gap:1rem;padding-top:1rem;border-top:1px solid var(--color-border, rgba(171, 0, 246, .1))}.step-actions .btn-secondary:only-child{margin-right:auto}.step-actions .btn-primary:only-child{margin-left:auto}.btn-large{padding:1rem 2rem;font-size:1rem;display:inline-flex;align-items:center;gap:.5rem}.btn-icon{font-size:1.25rem}.connection-status{text-align:center;padding:2rem}.status-checking{display:flex;align-items:center;justify-content:center;gap:.75rem;color:var(--color-muted, #888)}.spinner{width:20px;height:20px;border:2px solid var(--color-border, #ddd);border-top-color:var(--color-accent, #ab00f6);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.connection-action{text-align:center;padding:1rem 0}.button-group{display:flex;gap:1rem;justify-content:center;align-items:center;margin-top:1rem;flex-wrap:wrap}.button-group .btn-primary,.button-group a.btn-primary{display:inline-block;text-decoration:none;text-align:center;background:var(--color-primary, #ab00f6);color:#fff;padding:.75rem 1.5rem;border:none;border-radius:8px;font-weight:600;font-size:.95rem;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 16px #ab00f64d}.button-group .btn-primary:hover,.button-group a.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #ab00f666}.btn-danger{background:linear-gradient(135deg,#dc3545,#c82333);color:#fff;padding:.75rem 1.5rem;border:none;border-radius:8px;font-weight:600;font-size:.95rem;cursor:pointer;transition:transform .2s,box-shadow .2s}.btn-danger:hover{transform:translateY(-2px);box-shadow:0 4px 12px #dc354566}@media (max-width: 600px){.wizard-progress{padding:0}.step-label{display:none}.setup-wizard{padding:1rem}.wizard-step{padding:1.5rem}}.pattern-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.pattern-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem}.pattern-card{background:var(--color-surface, #1e1e2e);border:1px solid var(--color-border, #333);border-radius:12px;padding:1rem;position:relative}.pattern-card[data-system=true]{border-color:#ab00f6}.pattern-card-name{font-size:1rem;font-weight:600;margin-bottom:.25rem}.pattern-card-meta{font-size:.8rem;color:#888;margin-bottom:.5rem}.pattern-card-badge{display:inline-block;font-size:.7rem;padding:.1rem .4rem;border-radius:3px;background:#ab00f633;color:#d580ff;margin-left:.5rem}.pattern-card-actions{display:flex;gap:.5rem;margin-top:.5rem}.pattern-modal{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000}.pattern-modal[hidden]{display:none}.pattern-modal-dialog{background:var(--color-surface, #1e1e2e);border:1px solid var(--color-border, #333);border-radius:12px;width:90%;max-width:600px;max-height:80vh;overflow-y:auto;padding:1.5rem}.pattern-modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.pattern-modal-close{background:none;border:none;color:#888;font-size:1.5rem;cursor:pointer}.pattern-items-list{display:flex;flex-direction:column;gap:.35rem;margin:1rem 0}.pattern-item-row{display:flex;align-items:center;gap:.5rem;padding:.5rem .6rem;background:#ffffff08;border-radius:6px;cursor:default}.pattern-item-handle{cursor:grab;color:#666;font-size:1.1rem;-webkit-user-select:none;user-select:none}.pattern-item-icon{font-size:1.1rem}.pattern-item-label{flex:1;font-size:.9rem}.pattern-item-remove{background:none;border:none;color:#e74c3c;cursor:pointer;font-size:1.1rem}.pattern-item-ghost{opacity:.4}.pattern-card-sequence{font-size:1.1rem;letter-spacing:2px;margin-bottom:.4rem}.pattern-add-group{display:flex;gap:.4rem;align-items:center}.pattern-add-group select{background:#2a2a3a;color:#fff;border:1px solid #444;border-radius:4px;padding:.3rem .5rem;font-size:.85rem}.pattern-editor-actions{display:flex;align-items:center;justify-content:space-between;margin-top:1rem}.party-pattern-row{display:flex;align-items:center;gap:.5rem;margin-top:.75rem;padding-top:.75rem;border-top:1px solid rgba(255,255,255,.1);font-size:.85rem}.party-pattern-row label{color:#aaa;white-space:nowrap}.party-pattern-select{flex:1;padding:.25rem .5rem;border-radius:4px;border:1px solid #555;background:#1a1a1a;color:#eee;font-size:.8rem}.party-pattern-status{font-size:.75rem;color:#888}.party-pattern-status.warn{color:#f0ad4e}.party-pattern-status.ok{color:#5cb85c}.party-readiness-badge{font-size:.75rem;font-weight:600;margin:.25rem 0}.party-readiness-badge.ready{color:#5cb85c}.party-readiness-badge.pending{color:#f0ad4e}.party-readiness-badge.failed{color:#d9534f}.party-readiness-badge.no-plan{color:#888}.party-readiness-badge.clickable{cursor:pointer;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:2px}.party-readiness-badge.clickable:hover{opacity:.8}.readiness-detail-panel{margin:.5rem 0 .25rem;padding:.5rem .75rem;background:#00000026;border-radius:6px;font-size:.75rem;max-height:260px;overflow-y:auto}.readiness-detail-panel h4{margin:0 0 .35rem;font-size:.78rem;color:#ccc;font-weight:600}.readiness-detail-panel h4:not(:first-child){margin-top:.6rem}.readiness-detail-list{list-style:none;padding:0;margin:0}.readiness-detail-list li{display:flex;align-items:center;gap:.4rem;padding:.15rem 0;color:#bbb;line-height:1.3}.readiness-detail-list li .status-icon{flex-shrink:0;width:16px;text-align:center}.readiness-detail-list li .item-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.readiness-detail-list li.resolved .status-icon{color:#5cb85c}.readiness-detail-list li.pending .status-icon{color:#f0ad4e}.readiness-detail-list li.failed .status-icon{color:#d9534f}.readiness-detail-list li.generating .status-icon{color:#5bc0de}
