:root{--space-0: 0;--space-1: .5rem;--space-2: 1rem;--space-3: 1.5rem;--space-4: 2rem;--space-5: 2.5rem;--space-6: 3rem;--space-8: 4rem;--space-10: 5rem;--space-12: 6rem;--container-padding: var(--space-4);--container-padding-mobile: var(--space-3);--section-gap: var(--space-6);--section-gap-mobile: var(--space-4);--component-padding: var(--space-3);--component-padding-mobile: var(--space-2);--component-gap: var(--space-2);--element-gap: var(--space-1);--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-full: 9999px;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--touch-target-min: 44px;--button-height: var(--touch-target-min);--button-height-sm: 36px;--button-height-lg: 52px;--mobile-max: 768px;--tablet-max: 1024px;--desktop-min: 1025px}@media (max-width: 768px){:root{--container-padding: var(--container-padding-mobile);--section-gap: var(--section-gap-mobile);--component-padding: var(--component-padding-mobile)}}.space-1{gap:var(--space-1)}.space-2{gap:var(--space-2)}.space-3{gap:var(--space-3)}.space-4{gap:var(--space-4)}.p-1{padding:var(--space-1)}.p-2{padding:var(--space-2)}.p-3{padding:var(--space-3)}.p-4{padding:var(--space-4)}.m-1{margin:var(--space-1)}.m-2{margin:var(--space-2)}.m-3{margin:var(--space-3)}.m-4{margin:var(--space-4)}.mb-0{margin-bottom:0}.mb-1{margin-bottom:var(--space-1)}.mb-2{margin-bottom:var(--space-2)}.mb-3{margin-bottom:var(--space-3)}.mb-4{margin-bottom:var(--space-4)}.clean-card{background:var(--color-card-background);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--component-padding);box-shadow:var(--shadow-sm)}.clean-button{height:var(--button-height);padding:0 var(--space-3);border-radius:var(--radius-md);border:none;cursor:pointer;font-size:var(--text-base);font-weight:500;transition:all .2s ease;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-1);min-width:var(--touch-target-min)}.clean-button:disabled{opacity:.5;cursor:not-allowed}.clean-section{margin-bottom:var(--section-gap)}.clean-flex-row{display:flex;align-items:center;gap:var(--component-gap)}.clean-flex-col{display:flex;flex-direction:column;gap:var(--component-gap)}.clean-grid{display:grid;gap:var(--component-gap)}@media (max-width: 768px){.clean-button{height:var(--button-height-lg);font-size:var(--text-lg)}.mobile-stack{flex-direction:column}.mobile-full-width{width:100%}}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box;margin:0;padding:0}body{margin:0;padding:0;min-width:320px;min-height:100vh}#root{width:100%;min-height:100vh;margin:0;padding:0}:root{--color-background: #1a1a1a;--color-surface: #2a2a2a;--color-card-background: #2a2a2a;--color-text-primary: #fff;--color-text-secondary: #ccc;--color-text-muted: #999;--color-primary: #4caf50;--color-primary-hover: #45a049;--color-secondary: #666;--color-accent: #4caf50;--color-button-primary: #4caf50;--color-button-primary-hover: #45a049;--color-button-secondary: #666;--color-button-secondary-hover: #777;--color-border: #444;--color-border-hover: #4caf50;--color-divider: #333;--color-success: #4caf50;--color-warning: #ffa500;--color-error: #ff6b6b;--color-shadow: rgba(0, 0, 0, .2);--color-overlay: rgba(0, 0, 0, .5);--color-highlight: #4caf50}.app{min-height:100vh;background:var(--color-background);color:var(--color-text-primary);transition:background-color .3s ease,color .3s ease;display:flex;flex-direction:column}.auth-loading{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-4);background:var(--color-background)}.loading-spinner{width:48px;height:48px;border:3px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;animation:spin 1s linear infinite}.auth-loading p{color:var(--color-text-secondary);font-size:var(--text-base);margin:0}*{box-sizing:border-box}button{font-family:inherit}.themed-surface{background:var(--color-surface);color:var(--color-text-primary)}.themed-card{background:var(--color-card-background);border:1px solid var(--color-border);color:var(--color-text-primary)}.themed-button-primary{background:var(--color-button-primary);color:var(--color-text-primary);border:none;transition:all .2s ease}.themed-button-primary:hover{background:var(--color-button-primary-hover)}.themed-button-secondary{background:var(--color-button-secondary);color:var(--color-text-primary);border:none;transition:all .2s ease}.themed-button-secondary:hover{background:var(--color-button-secondary-hover)}.themed-border{border-color:var(--color-border)}.themed-border:hover{border-color:var(--color-border-hover)}.themed-text-primary{color:var(--color-text-primary)}.themed-text-secondary{color:var(--color-text-secondary)}.themed-text-muted{color:var(--color-text-muted)}.header{background:var(--color-surface);border-bottom:1px solid var(--color-divider);padding:1rem 0;position:sticky;top:0;z-index:10001;transition:all .3s ease;width:100%;box-sizing:border-box}.header-content{max-width:1200px;margin:0 auto;padding:0 1rem;display:flex;justify-content:space-between;align-items:center;height:100%;flex-direction:row;flex-wrap:nowrap;position:relative}.header-left{display:flex;align-items:center;gap:1.5rem;flex:1}.header-meta{display:flex;align-items:center;gap:1rem}.user-season{color:var(--color-primary);font-size:.9rem;padding:.25rem .75rem;background:color-mix(in srgb,var(--color-primary) 10%,transparent);border-radius:4px;border:1px solid color-mix(in srgb,var(--color-primary) 30%,transparent);transition:all .3s ease;display:flex;align-items:center;gap:.4rem}.user-icon{font-size:.85rem}.header h1{margin:0;margin-left:.5rem;font-size:1.5rem;color:var(--color-text-primary);transition:color .3s ease;flex:1}.title-desktop{display:inline}.title-mobile{display:none}.title-primary{color:var(--color-primary)}.title-secondary{color:var(--color-secondary)}.nav-menu-container{position:relative;display:flex;align-items:center}.nav-menu-btn{background:var(--color-surface);color:var(--color-text-primary);border:1px solid var(--color-border);padding:.5rem;border-radius:6px;cursor:pointer;transition:all .2s ease;width:40px;height:40px;display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent;box-shadow:0 1px 3px var(--color-shadow)}.nav-menu-btn:hover{background:var(--color-card-background);border-color:var(--color-border-hover);transform:translateY(-1px);box-shadow:0 2px 6px var(--color-shadow)}.nav-menu-btn:active{transform:translateY(0);box-shadow:0 1px 2px var(--color-shadow)}.nav-icon{width:24px;height:24px;color:var(--color-text-primary)}.user-account-container{position:relative;margin-right:.5rem}.user-account-btn{display:flex;align-items:center;justify-content:center;position:relative;width:40px;height:40px;padding:0;background:transparent;border:1px solid var(--color-border);border-radius:50%;cursor:pointer;transition:all .2s ease}.user-account-btn:hover{background:var(--color-surface);border-color:var(--color-primary)}.account-btn-icon{width:24px;height:24px;color:var(--color-text-secondary);transition:color .2s ease}.user-account-btn:hover .account-btn-icon{color:var(--color-primary)}.auth-indicator{position:absolute;top:-2px;right:-2px;width:10px;height:10px;background:#4caf50;border:2px solid var(--color-background);border-radius:50%}.nav-dropdown{position:absolute;top:calc(100% + .5rem);left:0;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:12px;box-shadow:0 8px 24px var(--color-shadow);min-width:280px;z-index:10002;overflow:hidden;animation:slideDown .2s ease-out}.nav-item{display:flex;align-items:center;gap:.75rem;width:100%;padding:.875rem 1rem;background:transparent;border:none;color:var(--color-text-primary);font-size:.95rem;font-weight:500;cursor:pointer;transition:all .2s ease;text-align:left;border-radius:8px;margin:2px 4px;position:relative}.nav-item:hover{background:var(--color-surface);transform:translate(4px);box-shadow:0 2px 8px #0000001a}.nav-item:active{transform:translate(2px);background:var(--color-border)}.nav-item:hover .nav-item-icon{color:var(--color-primary);transform:scale(1.1)}.nav-item:hover .nav-item-detail{background:var(--color-primary);color:#fff;transform:scale(1.05)}.nav-item:focus{outline:2px solid var(--color-primary);outline-offset:2px}.nav-item.active{background:color-mix(in srgb,var(--color-primary) 15%,transparent);color:var(--color-primary);position:relative}.nav-item.active:before{content:"";position:absolute;left:0;top:20%;bottom:20%;width:3px;background:var(--color-primary);border-radius:0 2px 2px 0}.nav-item.active:hover{background:color-mix(in srgb,var(--color-primary) 20%,transparent)}.nav-item-icon{width:20px;height:20px;flex-shrink:0;transition:all .2s ease}.nav-item-detail{margin-left:auto;font-size:.85rem;color:var(--color-text-secondary);padding:2px 6px;background:var(--color-surface);border-radius:4px;transition:all .2s ease}.nav-divider{height:1px;background:var(--color-border);margin:.25rem 0}@media (max-width: 768px){.header{padding:.75rem 0;width:100%}.header-content{padding:0 1rem!important;display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:space-between!important;min-height:44px;gap:.5rem;width:100%;max-width:100%;margin:0;box-sizing:border-box;flex-wrap:nowrap!important}.header-content h1{font-size:1.2rem;margin:0;flex-shrink:0;min-width:fit-content;display:inline-block}.header-content .profile-switcher{flex-shrink:1;min-width:0;overflow:hidden;display:inline-block}.header-content .nav-menu-container{flex-shrink:0;display:inline-block}.title-desktop{display:none}.title-mobile{display:inline}.user-season{font-size:.75rem;padding:.15rem .5rem;white-space:nowrap}.nav-menu-container{flex-shrink:0;position:relative;z-index:10}.nav-menu-btn{padding:.5rem;border-radius:6px;width:44px;height:44px;position:static;transform:none;display:flex;align-items:center;justify-content:center}.nav-menu-btn:active{transform:scale(.95);box-shadow:0 1px 2px var(--color-shadow);transition:all .1s ease}.nav-icon{width:24px;height:24px}}@media (max-width: 480px){.header{padding:.4rem 0}.header-content{padding:0 .75rem}.header-left{gap:.5rem}.header h1{font-size:1.1rem}.user-season{font-size:.7rem;padding:.1rem .4rem}.nav-menu-btn{padding:.3rem;width:32px;height:32px}.nav-icon{width:18px;height:18px}}.profile-switcher-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:999}.profile-switcher-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);width:360px;max-width:90vw;max-height:80vh;z-index:1000;animation:slideUp .3s ease-out}.profile-switcher-modal-header{padding:24px;border-bottom:1px solid var(--color-border);display:flex;justify-content:space-between;align-items:center}.profile-switcher-modal-header h2{margin:0;font-size:18px;font-weight:600;color:var(--color-text-primary)}.modal-close-btn{background:none;border:none;color:var(--color-text-secondary);cursor:pointer;padding:8px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;width:32px;height:32px;transition:all .2s ease}.modal-close-btn:hover{color:var(--color-text-primary);background:var(--color-border)}.profile-switcher-modal-content{padding:0 24px 24px}.profile-list{margin-bottom:24px}.profile-item{display:flex;align-items:center;justify-content:flex-start;padding:16px 0;background:none;border:none;border-bottom:1px solid var(--color-border);cursor:pointer;width:100%;text-align:left;transition:all .2s ease;border-radius:var(--radius-md)}.profile-item:last-child{border-bottom:none}.profile-item:hover{background:color-mix(in srgb,var(--color-border) 30%,transparent);margin:0 -24px;padding-left:24px;padding-right:24px}.profile-item.active{color:var(--color-success);font-weight:500}.profile-name{font-size:16px;color:var(--color-text-primary);font-weight:400}.profile-item.active .profile-name{color:var(--color-success);font-weight:500}.profile-season{font-size:14px;color:var(--color-text-secondary);margin-top:4px}.active-indicator{font-size:11px;color:var(--color-success);font-weight:500;padding:2px 6px;background:color-mix(in srgb,var(--color-success) 8%,var(--color-surface));border-radius:var(--radius-sm);border:1px solid color-mix(in srgb,var(--color-success) 15%,transparent);white-space:nowrap}.profile-modal-actions{display:flex;gap:12px;padding-top:24px;border-top:1px solid var(--color-border)}.action-btn{flex:1;padding:12px 16px;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);color:var(--color-text-primary);font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.action-btn:hover{background:var(--color-secondary);border-color:var(--color-text-secondary)}.create-btn{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.create-btn:hover{background:var(--color-primary-hover);border-color:var(--color-primary-hover)}.profile-info{display:flex;flex-direction:column;gap:4px;flex:1}.profile-header{display:flex;align-items:center;justify-content:space-between;gap:12px}@keyframes slideUp{0%{opacity:0;transform:translate(-50%,-50%) translateY(20px)}to{opacity:1;transform:translate(-50%,-50%) translateY(0)}}@media (max-width: 480px){.profile-switcher-modal{width:95vw;max-height:85vh}.profile-switcher-modal-header{padding:20px}.profile-switcher-modal-content{padding:0 20px 20px}.profile-item{padding:12px 0}.profile-item:hover{margin:0 -20px;padding-left:20px;padding-right:20px}.profile-modal-actions{flex-direction:column;gap:8px}.action-btn{padding:14px 16px}}.user-account-dropdown{position:absolute;top:100%;right:0;margin-top:8px;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:12px;box-shadow:0 4px 12px #0000001a;min-width:280px;z-index:1000;overflow:hidden}.account-header{display:flex;align-items:center;gap:12px;padding:16px;border-bottom:1px solid var(--color-border);background:var(--color-surface)}.account-icon{width:48px;height:48px;color:var(--color-text-secondary)}.user-avatar{width:48px;height:48px;border-radius:50%;object-fit:cover;border:2px solid var(--color-border)}.user-info{flex:1}.user-info h3{margin:0;font-size:16px;font-weight:600;color:var(--color-text-primary)}.user-info p{margin:4px 0 0;font-size:14px;color:var(--color-text-secondary)}.account-content{padding:16px}.account-content>p{margin:0 0 16px;font-size:14px;line-height:1.5;color:var(--color-text-secondary)}.login-section{display:flex;justify-content:center;padding:16px 0}.account-stats{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}.stat-item{display:flex;flex-direction:column;gap:4px;padding:12px;background:var(--color-surface);border-radius:8px;border:1px solid var(--color-border)}.stat-label{font-size:12px;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.5px}.stat-value{font-size:20px;font-weight:600;color:var(--color-text-primary)}.account-actions{display:flex;flex-direction:column;gap:8px}.sign-out-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:10px 16px;background:transparent;color:var(--color-text-primary);border:1px solid var(--color-border);border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.sign-out-btn:hover{background:var(--color-surface);border-color:#ea4335;color:#ea4335}.sign-out-btn .icon{width:18px;height:18px}.loading-state{display:flex;align-items:center;justify-content:center;gap:12px;padding:32px;color:var(--color-text-secondary)}.account-section{padding:12px}.user-row{display:flex;justify-content:space-between;align-items:center;gap:12px}.user-details{display:flex;align-items:center;gap:12px;flex:1}.sign-out-btn.compact{padding:6px 12px;width:auto;font-size:13px}.sign-out-btn.compact .icon{width:16px;height:16px}.account-divider{height:1px;background:var(--color-border);margin:0}.theme-option{display:flex;align-items:center;gap:12px;width:100%;padding:10px 12px;background:transparent;border:none;color:var(--color-text-primary);font-size:14px;font-weight:500;cursor:pointer;transition:all .2s;text-align:left;border-radius:8px}.theme-option:hover{background:var(--color-surface)}.option-icon{width:20px;height:20px;color:var(--color-text-secondary)}.spinner{width:24px;height:24px;border:2px solid var(--color-border);border-top:2px solid var(--color-primary);border-radius:50%;animation:spin 1s linear infinite}.google-auth-container{display:flex;justify-content:center;align-items:center}.google-btn{display:flex;align-items:center;justify-content:center;gap:12px;padding:12px 24px;border:1px solid var(--color-border);border-radius:8px;background-color:var(--color-card-background);color:var(--color-text-primary);font-size:16px;font-weight:500;cursor:pointer;transition:all .3s ease;min-width:220px;height:48px}.google-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #0000001a;border-color:var(--color-primary)}.google-btn:active:not(:disabled){transform:translateY(0)}.google-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.google-signin-btn{background-color:#fff;color:#3c4043;border:1px solid #dadce0;font-weight:500}.google-signin-btn:hover:not(:disabled){background-color:#f8f9fa;border-color:#dadce0;box-shadow:0 1px 3px #3c40434d}.google-signout-btn{background-color:#fff;border:1px solid #dadce0;color:#3c4043;font-weight:500}.google-signout-btn:hover:not(:disabled){background-color:#f8f9fa;border-color:#dadce0;box-shadow:0 1px 3px #3c40434d}.google-icon{width:20px;height:20px;flex-shrink:0}.google-spinner{width:20px;height:20px;border:2px solid transparent;border-top:2px solid currentColor;border-radius:50%;animation:spin 1s linear infinite}@media (max-width: 768px){.google-btn{min-width:200px;padding:10px 20px;font-size:14px}.google-icon{width:18px;height:18px}}.main-content{max-width:1200px;margin:0 auto;padding:2rem 1rem}.mode-selector{display:flex;justify-content:center;gap:0;margin-bottom:2rem;background:var(--color-surface);border-radius:8px;padding:.25rem;width:fit-content;margin-left:auto;margin-right:auto;border:1px solid var(--color-border);transition:all .3s ease}.mode-btn{background:none;border:none;color:var(--color-text-secondary);padding:.75rem 1.5rem;border-radius:6px;cursor:pointer;font-size:1rem;transition:all .2s;font-weight:500}.mode-btn:hover{background:var(--color-card-background);color:var(--color-text-primary)}.mode-btn.active{background:var(--color-primary);color:var(--color-text-primary);font-weight:700}.content-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem;min-height:70vh}.content-grid:has(.knowledge-base){grid-template-columns:1fr}.content-grid:has(.color-workspace){grid-template-columns:1fr}@media (max-width: 768px){.main-content{padding:1rem .75rem}.content-grid{grid-template-columns:1fr;gap:1rem}.mode-selector{width:100%;margin-bottom:1rem;border-radius:10px;padding:.4rem}.mode-btn{flex:1;padding:.75rem;font-size:.9rem;border-radius:6px;min-height:44px;-webkit-tap-highlight-color:transparent}.mode-btn:active{transform:scale(.98);transition:transform .1s ease}}@media (max-width: 480px){.main-content{padding:.75rem .5rem}.mode-selector{margin-bottom:.75rem;padding:.25rem}.mode-btn{padding:.65rem .5rem;font-size:.85rem}.content-grid{gap:.75rem}}.image-section{display:flex;flex-direction:column;gap:24px;max-height:none;height:auto}.ai-scan-section{display:flex;justify-content:center;align-items:center;gap:8px;padding:1px;margin-bottom:1px}.ai-scan-button{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px;background:var(--color-primary);color:#fff;border:none;border-radius:var(--radius-lg);font-size:16px;font-weight:600;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 12px #0000001a}.ai-scan-button:hover:not(:disabled){background:var(--color-primary-hover);transform:translateY(-2px);box-shadow:0 8px 16px #00000026}.ai-scan-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.ai-scan-icon{width:16px;height:16px}.help-icon-button{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:transparent;border:1px solid var(--color-border);border-radius:50%;cursor:pointer;color:var(--color-text-secondary);transition:all .2s ease}.help-icon-button:hover{background:var(--color-surface);color:var(--color-primary);border-color:var(--color-primary)}.help-icon-button svg{width:18px;height:18px}.image-upload{border:2px dashed var(--color-border);border-radius:8px;padding:3rem 2rem;text-align:center;cursor:pointer;transition:all .3s ease;background:var(--color-card-background);min-height:300px;display:flex;align-items:center;justify-content:center}.image-upload:hover{border-color:var(--color-border-hover);background:var(--color-surface)}.image-upload.drag-over{border-color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 5%,var(--color-card-background))}.upload-content{pointer-events:none}.upload-icon{font-size:3rem;margin-bottom:1rem}.image-upload h3{margin:0 0 .5rem;color:var(--color-text-primary);font-size:1.5rem}.image-upload p{margin:.5rem 0;color:var(--color-text-secondary)}.supported-formats{font-size:.875rem;color:var(--color-text-muted)!important}.mobile-upload-buttons{display:flex;flex-direction:column;gap:1rem;margin:1.5rem 0 1rem;pointer-events:all}.upload-action-btn{background:var(--color-primary);color:#fff;border:none;padding:1rem 1.5rem;border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s ease;min-height:44px;display:flex;align-items:center;justify-content:center;gap:.5rem;-webkit-tap-highlight-color:transparent}.upload-action-btn:hover{background:color-mix(in srgb,var(--color-primary) 90%,black);transform:translateY(-1px)}.upload-action-btn:active{transform:translateY(0);background:color-mix(in srgb,var(--color-primary) 85%,black)}.upload-action-btn:disabled{opacity:.6;cursor:not-allowed;transform:none!important}.camera-btn{background:linear-gradient(135deg,#6366f1,#8b5cf6)}.camera-btn:hover:not(:disabled){background:linear-gradient(135deg,#5856eb,#7c3aed)}.upload-btn,.paste-btn{background:var(--color-button-secondary);color:var(--color-text-primary);border:1px solid var(--color-border)}.upload-btn:hover,.paste-btn:hover{background:var(--color-button-secondary-hover);border-color:var(--color-border-hover)}.image-upload.processing{border-color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 3%,var(--color-card-background));cursor:not-allowed}.processing .upload-icon{animation:spin 2s linear infinite}.progress-bar{width:100%;height:4px;background:var(--color-border);border-radius:2px;margin:1rem 0;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,var(--color-primary),var(--color-primary-dark));transition:width .3s ease;border-radius:2px}.image-upload-container{width:100%}.upload-error{margin-top:1rem;padding:.75rem 1rem;border-radius:6px;border-left:4px solid;background:var(--color-surface);display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;animation:slideDown .3s ease}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.error-size{border-left-color:#f59e0b;background:color-mix(in srgb,#f59e0b 8%,var(--color-surface))}.error-format{border-left-color:#ef4444;background:color-mix(in srgb,#ef4444 8%,var(--color-surface))}.error-processing{border-left-color:#8b5cf6;background:color-mix(in srgb,#8b5cf6 8%,var(--color-surface))}.error-camera,.error-network{border-left-color:#06b6d4;background:color-mix(in srgb,#06b6d4 8%,var(--color-surface))}.error-message{flex:1;font-size:.9rem;line-height:1.4}.error-message strong{color:var(--color-text-primary);display:block;margin-bottom:.25rem}.error-details{color:var(--color-text-secondary);font-size:.85rem}.error-dismiss{background:none;border:none;color:var(--color-text-muted);font-size:1.2rem;cursor:pointer;padding:0;line-height:1;width:20px;height:20px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .2s ease}.error-dismiss:hover{background:var(--color-border);color:var(--color-text-primary)}.upload-tips{margin-top:1rem;text-align:center}.upload-tips p{font-size:.85rem;color:var(--color-text-muted);margin:0}@media (max-width: 768px){.image-upload{padding:2rem 1rem;min-height:250px;border-radius:12px;border-width:3px;cursor:pointer;-webkit-tap-highlight-color:transparent}.upload-icon{font-size:2.5rem;margin-bottom:.75rem}.image-upload h3{font-size:1.3rem}.image-upload p{font-size:.9rem;line-height:1.4}.supported-formats{font-size:.8rem}.image-upload:active{transform:scale(.98);transition:transform .1s ease}}.image-viewer,.analyze-image-viewer,.profile-image-viewer{background:var(--color-card-background);border:1px solid var(--color-border);border-radius:8px;display:flex;flex-direction:column;position:relative}.top-controls{background:var(--color-surface);border-bottom:1px solid var(--color-border);padding:.75rem 1rem;display:flex;justify-content:space-between;align-items:center;gap:1rem}.top-controls-left{display:flex;gap:1rem;align-items:center}.category-cards{background:var(--color-surface);border-bottom:1px solid var(--color-border);padding:1rem}.category-instruction{color:var(--color-text-secondary);font-size:.9rem;font-weight:500;margin-bottom:.75rem;text-align:center}.category-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.75rem}.category-card{background:var(--color-card-background);border:2px solid var(--color-border);border-radius:8px;padding:.75rem;cursor:pointer;transition:all .2s ease;display:flex;flex-direction:column;align-items:center;text-align:center;gap:.5rem;position:relative;min-height:80px;justify-content:center}.category-card:hover{border-color:var(--color-primary);transform:translateY(-1px);box-shadow:0 2px 8px var(--color-shadow)}.category-card.active{border-color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 10%,var(--color-card-background));box-shadow:0 0 0 1px var(--color-primary)}.category-card.has-color{border-color:var(--color-success)}.category-card.placed{border-color:var(--color-success);background:color-mix(in srgb,var(--color-success) 5%,var(--color-card-background))}.color-indicator{position:absolute;top:.5rem;right:.5rem;width:16px;height:16px;border-radius:50%;border:2px solid white;box-shadow:0 1px 3px #0003}.category-name{font-size:.85rem;font-weight:500;color:var(--color-text-primary)}.category-status{font-size:.75rem;color:var(--color-text-muted);font-weight:400}.category-dropdown-container{display:flex;align-items:center;gap:.5rem;flex-wrap:nowrap}.category-dropdown-container label{color:var(--color-text-secondary);font-size:.9rem;font-weight:500}.category-dropdown{background:var(--color-card-background);color:var(--color-text-primary);border:1px solid var(--color-border);border-radius:6px;padding:.5rem 2.5rem .5rem 1rem;font-size:.95rem;cursor:pointer;min-width:140px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right .7rem center;background-size:1.2em}.category-dropdown:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 2px color-mix(in srgb,var(--color-primary) 20%,transparent)}.category-description{color:var(--color-text-muted);font-size:.8rem;font-style:italic;flex:1;word-wrap:break-word;overflow-wrap:break-word}.selected-color-display{display:flex;align-items:center;gap:.75rem;padding:.5rem 1rem;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:6px;height:44px;max-width:200px;overflow:hidden}.color-preview{width:32px;height:32px;border-radius:4px;border:2px solid var(--color-border);box-shadow:0 2px 4px var(--color-shadow);flex-shrink:0}.selected-color-display .color-preview{width:32px!important;height:32px!important;flex-shrink:0;min-width:32px;max-width:32px;min-height:32px;max-height:32px}.color-value{font-family:monospace;font-size:.95rem;color:var(--color-text-primary);font-weight:500;min-width:80px}.no-color{color:var(--color-text-muted);font-size:.9rem;font-style:italic}.progress-indicator{color:var(--color-primary);font-size:.9rem;font-weight:600;padding:.5rem 1rem;background:color-mix(in srgb,var(--color-primary) 10%,transparent);border-radius:6px;border:1px solid color-mix(in srgb,var(--color-primary) 20%,transparent)}.bottom-toolbar{display:none!important}.bottom-toolbar .zoom-controls{justify-self:start;display:flex;align-items:center;gap:.5rem}.bottom-toolbar .selected-color-display{justify-self:center;display:flex;align-items:center;justify-content:center;gap:.75rem;min-width:0}.bottom-toolbar .lock-controls{justify-self:end}.lock-controls{display:flex;align-items:center}.lock-btn{background:var(--color-card-background);border:2px solid var(--color-border);border-radius:6px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease}.lock-icon{width:20px;height:20px}.lock-btn.locked{border-color:var(--color-error);background:color-mix(in srgb,var(--color-error) 10%,var(--color-card-background))}.lock-btn.unlocked{border-color:var(--color-success);background:color-mix(in srgb,var(--color-success) 10%,var(--color-card-background))}.lock-btn:hover{transform:scale(1.05)}.lock-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.reset-zoom-btn{font-size:1.2rem!important}.toggle-btn,.reset-photo-btn{background:var(--color-surface);color:var(--color-text-primary);border:1px solid var(--color-border);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);cursor:pointer;transition:all .2s ease;font-size:var(--text-sm);box-shadow:var(--shadow-sm)}.toggle-btn:hover,.reset-photo-btn:hover{background:var(--color-card-background);border-color:var(--color-border-hover);transform:translateY(-1px);box-shadow:var(--shadow-md)}.ai-detect-btn{background:var(--color-primary);color:#fff;border:1px solid var(--color-primary);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);cursor:pointer;transition:all .2s ease;font-size:var(--text-sm);font-weight:600;display:inline-flex;align-items:center;gap:var(--space-1);white-space:nowrap;box-shadow:var(--shadow-md)}.ai-detect-btn:hover:not(:disabled){background:var(--color-primary-hover);border-color:var(--color-primary-hover);transform:translateY(-2px);box-shadow:var(--shadow-lg)}.ai-detect-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.ai-icon{width:18px;height:18px}.viewer-controls-bar{background:var(--color-surface);border-bottom:1px solid var(--color-border);padding:.75rem 1rem;display:flex;justify-content:space-between;align-items:center;gap:1rem}.zoom-controls{display:flex;align-items:center;gap:.5rem;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:6px;padding:.25rem;height:44px}.zoom-btn{background:transparent;color:var(--color-text-primary);border:none;width:36px;height:36px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;font-weight:700;cursor:pointer;border-radius:4px;transition:all .2s;-webkit-tap-highlight-color:transparent}.zoom-btn:hover:not(:disabled){background:var(--color-surface)}.zoom-btn:active:not(:disabled){transform:scale(.9)}.zoom-btn:disabled{opacity:.3;cursor:not-allowed}.zoom-value{color:var(--color-text-primary);font-size:.9rem;font-weight:500;min-width:50px;text-align:center}.view-controls{display:flex;gap:.5rem;flex-wrap:wrap}.toggle-btn,.reset-photo-btn{background:var(--color-surface);color:var(--color-text-primary);border:1px solid var(--color-border);padding:var(--space-1) var(--space-2);border-radius:var(--radius-md);font-size:var(--text-sm);cursor:pointer;transition:all .2s;-webkit-tap-highlight-color:transparent;box-shadow:var(--shadow-sm)}.toggle-btn:hover,.reset-photo-btn:hover{background:var(--color-card-background);border-color:var(--color-border-hover);box-shadow:var(--shadow-md)}.toggle-btn:active,.reset-photo-btn:active{transform:scale(.95)}.instructions{background:color-mix(in srgb,var(--color-primary) 5%,var(--color-surface));padding:.5rem;text-align:center;border-bottom:1px solid var(--color-border)}.instructions p{margin:0;color:var(--color-text-secondary);font-size:.85rem}.image-container{position:relative;display:flex;justify-content:center;align-items:center;min-height:400px;max-height:600px;height:500px;background:var(--color-surface);overflow:hidden;-webkit-user-select:none;user-select:none;touch-action:none;padding-top:60px;margin-bottom:2rem}.image-container.dragging{cursor:grabbing!important}.uploaded-image,.image-container .uploaded-image,.image-wrapper .uploaded-image{width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:cover!important;object-position:center;transition:transform .1s ease;transform-origin:center;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;touch-action:none}.category-crosshair{position:absolute;width:10px;height:10px;pointer-events:none;transform:translate(-50%,-50%);z-index:10}.category-crosshair.clickable{pointer-events:auto;cursor:pointer}.category-crosshair:before,.category-crosshair:after{content:"";position:absolute;background:#fff;box-shadow:0 0 0 1px #000c;transition:all .3s ease}.category-crosshair:before{width:10px;height:1px;top:50%;left:0;transform:translateY(-50%)}.category-crosshair:after{width:1px;height:10px;left:50%;top:0;transform:translate(-50%)}.category-crosshair.skin:before,.category-crosshair.skin:after{background:#ff6b6b;box-shadow:0 0 0 1px #000c}.category-crosshair.lip:before,.category-crosshair.lip:after{background:#ff8e53;box-shadow:0 0 0 1px #000c}.category-crosshair.darkEye:before,.category-crosshair.darkEye:after{background:#4ecdc4;box-shadow:0 0 0 1px #000c}.category-crosshair.lightEye:before,.category-crosshair.lightEye:after{background:#45b7d1;box-shadow:0 0 0 1px #000c}.category-crosshair.hair:before,.category-crosshair.hair:after{background:#96ceb4;box-shadow:0 0 0 1px #000c}.category-crosshair.active{transform:translate(-50%,-50%) scale(1.5)}.category-crosshair.active:before,.category-crosshair.active:after{box-shadow:0 0 0 2px #000000e6,0 0 6px currentColor}.crosshair-label{position:absolute;top:-30px;left:50%;transform:translate(-50%);background:#000c;color:#fff;padding:.25rem .5rem;border-radius:4px;font-size:.7rem;font-weight:500;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .2s ease}.category-crosshair:hover .crosshair-label,.category-crosshair.active .crosshair-label,.crosshair-label.show{opacity:1}.crosshair-label.hide{opacity:0}.category-crosshair.clickable:hover:before,.category-crosshair.clickable:hover:after{transform:scale(1.1);box-shadow:0 0 0 2px #fffc,0 0 8px currentColor}.category-crosshair.skin .crosshair-label{background:#ff6b6be6}.category-crosshair.lip .crosshair-label{background:#ff8e53e6}.category-crosshair.darkEye .crosshair-label{background:#4ecdc4e6}.category-crosshair.lightEye .crosshair-label{background:#45b7d1e6}.category-crosshair.hair .crosshair-label{background:#96ceb4e6}@media (max-width: 768px){.top-controls{padding:.75rem;flex-direction:row;justify-content:space-between;align-items:center;gap:.75rem}.category-selector{padding:.75rem}.bottom-toolbar{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.25rem;padding:.5rem;min-height:60px}.bottom-toolbar .zoom-controls{justify-self:start}.bottom-toolbar .selected-color-display{justify-self:center}.bottom-toolbar .lock-controls{justify-self:end}.category-dropdown-container{flex-direction:column;align-items:stretch;gap:.5rem}.category-dropdown{width:100%;padding:.75rem 2.5rem .75rem 1rem;min-height:44px;font-size:1rem}.selected-color-display{justify-content:center;padding:.75rem}.selected-color-display .color-preview{width:40px!important;height:40px!important;flex-shrink:0;min-width:40px;max-width:40px;min-height:40px;max-height:40px}.color-value{font-size:1rem}.progress-indicator{text-align:center;width:100%}.bottom-controls{margin-top:.5rem;padding-top:.5rem;padding-left:.5rem;padding-right:.5rem}.viewer-controls-bar{padding:.5rem;flex-wrap:nowrap;gap:.5rem}.zoom-controls{flex:0 0 auto;gap:.25rem;padding:.25rem}.zoom-btn{width:40px;height:40px;font-size:1.5rem}.zoom-value{font-size:.9rem;min-width:50px}.view-controls{flex:1;justify-content:flex-end;gap:.25rem}.toggle-btn,.reset-photo-btn{padding:.5rem .75rem;min-height:40px;font-size:.85rem;white-space:nowrap}.instructions{padding:.75rem}.instructions p{font-size:.9rem}.image-container{min-height:400px;max-height:600px;height:500px}.category-crosshair{width:12px;height:12px}.category-crosshair:before{width:12px;height:1px}.category-crosshair:after{width:1px;height:12px}.crosshair-label{font-size:.8rem;padding:.3rem .6rem;top:-35px}}@media (max-width: 480px){.top-controls{padding:.5rem;gap:.5rem}.toggle-btn,.reset-photo-btn{padding:.5rem .75rem;font-size:.8rem;min-height:36px;white-space:nowrap}.category-selector{padding:.5rem}.category-dropdown{font-size:.9rem;padding:.5rem}.category-description{display:block;margin-top:.25rem}.bottom-toolbar{gap:.25rem;padding:.5rem;grid-template-columns:auto minmax(0,1fr) auto;align-items:center}.image-container{min-height:400px;max-height:600px;height:500px}.zoom-controls{gap:.25rem;padding:.25rem;height:40px}.zoom-btn{width:32px;height:32px;font-size:1.1rem}.zoom-value{font-size:.8rem;min-width:45px}.selected-color-display{gap:.4rem;padding:.25rem .5rem;max-width:120px;font-size:.75rem;min-width:0;overflow:hidden}.color-value{font-size:.7rem;min-width:60px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.color-preview{width:28px;height:28px}.lock-btn{width:36px;height:36px}.lock-icon{width:16px;height:16px}}.image-wrapper{position:relative;flex:1;margin:0 1rem 1rem;border-radius:12px;overflow:hidden;background:var(--color-surface);box-shadow:0 4px 12px #0000001a;min-height:400px;max-height:600px;height:500px}.top-toolbar-sticky{position:absolute;top:0;left:0;right:0;z-index:9998;background:color-mix(in srgb,var(--color-surface) 95%,transparent);border-bottom:1px solid color-mix(in srgb,var(--color-border) 50%,transparent);box-shadow:0 2px 12px color-mix(in srgb,var(--color-shadow) 20%,transparent);border-top-left-radius:12px;border-top-right-radius:12px}.toolbar-controls{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;gap:.75rem;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;width:100%;box-sizing:border-box}.toolbar-controls::-webkit-scrollbar{display:none}.toolbar-left,.toolbar-right{display:flex;align-items:center;gap:.5rem;flex-shrink:0}.toolbar-btn{background:var(--color-surface);color:var(--color-text-primary);border:1px solid var(--color-border);padding:.5rem;border-radius:var(--radius-md);cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;width:44px;height:44px;flex-shrink:0;-webkit-tap-highlight-color:transparent;box-shadow:var(--shadow-md)}.toolbar-btn:hover{background:var(--color-card-background);border-color:var(--color-border-hover);transform:translateY(-1px);box-shadow:var(--shadow-lg)}.toolbar-btn:active{transform:scale(.95)}.toolbar-btn:disabled{opacity:.5;cursor:not-allowed}.toolbar-btn:disabled:hover{background:var(--color-surface);border-color:var(--color-border);transform:none;box-shadow:var(--shadow-md)}.toolbar-btn.ai-btn{background:var(--color-primary);color:#fff;border-color:var(--color-primary);font-weight:600;position:relative;box-shadow:var(--shadow-md)}.toolbar-btn.ai-btn:hover{background:var(--color-primary-hover);border-color:var(--color-primary-hover);transform:translateY(-2px);box-shadow:var(--shadow-lg)}.toolbar-btn.ai-btn:active{transform:scale(.95);box-shadow:var(--shadow-md)}.toolbar-btn.ai-btn:disabled{background:color-mix(in srgb,var(--color-primary) 50%,var(--color-surface));color:color-mix(in srgb,white 60%,var(--color-text-secondary));border-color:color-mix(in srgb,var(--color-primary) 30%,var(--color-border))}.toolbar-btn.ai-btn:disabled:hover{background:color-mix(in srgb,var(--color-primary) 50%,var(--color-surface));border-color:color-mix(in srgb,var(--color-primary) 30%,var(--color-border));transform:none;box-shadow:var(--shadow-sm)}.toolbar-icon{width:20px;height:20px}.toolbar-btn.lock-btn{width:44px!important;height:44px!important;min-width:44px!important;flex-shrink:0!important}.toolbar-btn.lock-btn.locked{background:var(--color-primary);color:#fff;border-color:var(--color-primary);box-shadow:var(--shadow-md)}.toolbar-btn.lock-btn.locked:hover{background:var(--color-primary-hover);border-color:var(--color-primary-hover);box-shadow:var(--shadow-lg)}.toolbar-btn.lock-btn.unlocked{background:var(--color-surface);color:var(--color-text-primary);border-color:var(--color-border)}.toolbar-btn.lock-btn.unlocked:hover{background:var(--color-card-background);border-color:var(--color-border-hover)}.zoom-controls-compact{display:flex;align-items:center;gap:.5rem;background:color-mix(in srgb,var(--color-card-background) 85%,transparent);border:1px solid color-mix(in srgb,var(--color-border) 60%,transparent);border-radius:8px;padding:.25rem;flex-shrink:0;height:44px;box-sizing:border-box}.zoom-controls-compact .toolbar-btn{background:transparent;min-width:32px;height:32px;padding:.25rem}.zoom-controls-compact .toolbar-btn:hover{background:var(--color-button-secondary)}.zoom-controls-compact .zoom-value{font-size:.875rem;font-weight:600;min-width:50px;text-align:center;color:var(--color-text-primary);padding:0 .25rem}.selected-color-compact{display:flex;align-items:center;justify-content:flex-start;gap:.375rem;background:color-mix(in srgb,var(--color-card-background) 85%,transparent);border:1px solid color-mix(in srgb,var(--color-border) 60%,transparent);border-radius:8px;padding:.375rem .5rem;flex:1;min-width:100px;max-width:120px;box-sizing:border-box;height:44px}.selected-color-compact .color-preview{width:24px!important;height:24px!important;border-radius:4px;border:1px solid var(--color-border);min-height:24px!important;max-height:24px!important;min-width:24px!important;max-width:24px!important;flex-shrink:0;margin:0!important}.selected-color-compact .color-value{font-family:monospace;font-size:.875rem;font-weight:600;color:var(--color-text-primary)}.selected-color-compact .no-color{font-size:.875rem;color:var(--color-text-secondary);font-style:italic}.context-menu-wrapper{position:relative;flex-shrink:0;z-index:9998}.context-menu-dropdown{position:fixed;background:var(--color-surface);border:1px solid var(--color-border);border-radius:8px;box-shadow:0 8px 24px color-mix(in srgb,var(--color-shadow) 25%,transparent);z-index:10000;min-width:160px;overflow:hidden}@media (max-width: 480px){.context-menu-dropdown{right:1.25rem;max-width:calc(100vw - 2.5rem)}}.dropdown-item{width:100%;background:none;border:none;padding:.75rem 1rem;text-align:left;cursor:pointer;color:var(--color-text-primary);font-size:.875rem;transition:background-color .2s;display:flex;align-items:center;gap:.5rem}.dropdown-item:hover{background:var(--color-button-secondary)}.dropdown-item:disabled{opacity:.5;cursor:not-allowed}.dropdown-item:disabled:hover{background:none}.dropdown-icon{width:16px;height:16px}.ai-scan-item{color:var(--color-accent)}.ai-scan-item:hover{background:color-mix(in srgb,var(--color-accent) 10%,var(--color-surface))}.help-item{justify-content:center;padding:.5rem}.color-magnifier{position:absolute;z-index:400;pointer-events:none;display:flex;flex-direction:column;align-items:center;gap:.5rem;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.magnifier-color-preview{display:flex;align-items:center;gap:.5rem;background:#000000d9;padding:.375rem .75rem;border-radius:8px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.2)}.magnifier-color-swatch{width:32px;height:32px;border-radius:6px;border:2px solid white;box-shadow:0 2px 8px #0000004d}.magnifier-color-value{color:#fff;font-family:monospace;font-size:.875rem;font-weight:600;text-shadow:0 1px 2px rgba(0,0,0,.8)}.magnifier-lens{width:96px;height:96px;border-radius:50%;background:#ffffffe6;border:3px solid rgba(0,0,0,.8);box-shadow:0 4px 16px #0000004d;position:relative;overflow:hidden}.magnifier-crosshair{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:10px;height:10px}.magnifier-crosshair:before,.magnifier-crosshair:after{content:"";position:absolute;background:#f00c;box-shadow:0 0 0 1px #fffc}.magnifier-crosshair:before{width:10px;height:1px;top:50%;left:0;transform:translateY(-50%)}.magnifier-crosshair:after{width:1px;height:10px;left:50%;top:0;transform:translate(-50%)}@media (max-width: 768px){.toolbar-controls{padding:.5rem;gap:.75rem}.toolbar-btn{min-width:36px;height:36px;padding:.375rem}.toolbar-btn.lock-btn{width:36px!important;height:36px!important;min-width:36px!important}.toolbar-icon{width:18px;height:18px}.zoom-controls-compact .toolbar-btn{min-width:28px;height:28px}.zoom-controls-compact .zoom-value{font-size:.8rem;min-width:40px}.selected-color-compact{min-width:100px;padding:.375rem}.selected-color-compact .color-value,.selected-color-compact .no-color{font-size:.8rem}.context-menu-dropdown{min-width:140px}.dropdown-item{padding:.625rem .75rem;font-size:.8rem}}.toolbar-btn.menu-btn{position:relative;z-index:9999}.category-emoji{font-size:18px;line-height:1}.ai-badge{position:absolute;top:-6px;right:-6px;background:var(--color-accent);color:#fff;font-size:.7rem;font-weight:600;padding:2px 6px;border-radius:10px;min-width:16px;height:16px;display:flex;align-items:center;justify-content:center;border:2px solid var(--color-surface);box-shadow:0 2px 4px #0003}.context-menu-dropdown.category-selector{min-width:240px;max-width:280px;padding:.5rem;z-index:10001}.category-item{width:100%;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:8px;padding:.75rem;margin-bottom:.5rem;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:.75rem;text-align:left}.category-item:last-child{margin-bottom:0}.category-item:hover{border-color:var(--color-primary);transform:translateY(-1px);box-shadow:0 2px 8px var(--color-shadow)}.category-item.selected{border-color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 10%,var(--color-card-background));box-shadow:0 0 0 1px var(--color-primary)}.category-color-swatch{width:24px;height:24px;border-radius:8px;overflow:hidden;flex-shrink:0;display:flex;align-items:center;justify-content:center;border:1px solid var(--color-border)}.category-color-swatch .color-swatch{width:100%;height:100%;border:none;margin:0}.category-color-swatch .empty-swatch{color:var(--color-text-secondary);font-size:1rem;font-weight:700;line-height:1}.category-name{flex:1;font-size:.875rem;font-weight:500;color:var(--color-text-primary)}.category-indicators{display:flex;align-items:center;gap:.375rem;flex-shrink:0}.ai-icon,.user-icon{width:14px;height:14px;opacity:.7}.ai-icon{color:var(--color-accent)}.user-icon{color:var(--color-success)}.active-emoji{font-size:14px;line-height:1}@media (max-width: 768px){.context-menu-dropdown.category-selector{min-width:200px;max-width:240px;padding:.375rem}.category-item{padding:.625rem;gap:.625rem;margin-bottom:.375rem}.category-color-swatch{width:20px;height:20px}.category-name{font-size:.8rem}.ai-icon,.user-icon{width:12px;height:12px}.active-emoji{font-size:12px}.category-emoji{font-size:16px}.ai-badge{font-size:.7rem;padding:2px 5px;min-width:16px;height:16px}}.analyze-image-viewer{background:var(--color-card-background);border:1px solid var(--color-border);border-radius:8px;overflow:hidden;display:flex;flex-direction:column;position:relative}.color-hex-text{font-family:monospace;font-size:.875rem;font-weight:600;color:var(--color-text-primary)}.zoom-text{font-size:1rem;font-weight:600;line-height:1}.crosshair{position:absolute;width:16px;height:16px;pointer-events:none;transform:translate(-50%,-50%);z-index:10}.crosshair:before,.crosshair:after{content:"";position:absolute;background:#fff;box-shadow:0 0 0 1px #000c}.crosshair:before{width:16px;height:2px;top:50%;left:0;transform:translateY(-50%)}.crosshair:after{width:2px;height:16px;left:50%;top:0;transform:translate(-50%)}.magnifier{position:absolute;z-index:300;pointer-events:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.magnifier-lens{width:96px;height:96px;border-radius:50%;border:3px solid rgba(0,0,0,.8);box-shadow:0 4px 16px #0000004d;overflow:hidden;position:relative}.magnifier-image{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:50%}.profile-setup-help-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:10000;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:fadeIn .3s ease}.profile-setup-help-modal{background:var(--color-card-background);border-radius:16px;border:1px solid var(--color-border);box-shadow:0 25px 50px -12px #00000040;max-width:700px;width:90vw;max-height:85vh;overflow:hidden;display:flex;flex-direction:column;position:relative;animation:slideUp .4s ease}.profile-setup-help-modal-header{display:flex;align-items:center;justify-content:space-between;padding:1.5rem 2rem;border-bottom:1px solid var(--color-border);background:var(--color-surface)}.profile-setup-help-modal-title-section{display:flex;align-items:center;gap:.75rem}.profile-setup-help-modal-icon{width:28px;height:28px;color:var(--color-primary)}.profile-setup-help-modal-header h2{margin:0;color:var(--color-text-primary);font-size:1.5rem;font-weight:700}.profile-setup-help-modal-close{background:transparent;border:none;padding:.5rem;border-radius:8px;cursor:pointer;color:var(--color-text-secondary);transition:all .2s ease}.profile-setup-help-modal-close:hover{background:var(--color-border);color:var(--color-text-primary)}.profile-setup-help-modal-close svg{width:20px;height:20px}.profile-setup-help-modal-content{flex:1;overflow-y:auto;padding:2rem}.help-section{margin-bottom:2rem}.help-section h3{color:var(--color-text-primary);font-size:1.1rem;font-weight:600;margin:0 0 1rem;display:flex;align-items:center;gap:.5rem}.help-section ul{margin:0;padding:0 0 0 1.5rem;list-style:none}.help-section li{color:var(--color-text-secondary);line-height:1.6;margin-bottom:.75rem;position:relative}.help-section li:before{content:"•";color:var(--color-primary);position:absolute;left:-1rem;font-weight:700;font-size:1.2em}.help-section li:last-child{margin-bottom:0}.help-section strong{color:var(--color-text-primary);font-weight:600}.profile-setup-help-modal-footer{padding:1.5rem 2rem;border-top:1px solid var(--color-border);background:var(--color-surface);display:flex;justify-content:center}.profile-setup-help-modal-button{background:var(--color-primary);color:#fff;border:none;padding:.75rem 2rem;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease;min-width:120px}.profile-setup-help-modal-button:hover{background:var(--color-primary-dark, #6d28d9);transform:translateY(-1px)}@media (max-width: 768px){.profile-setup-help-modal{width:95vw;max-height:90vh}.profile-setup-help-modal-header{padding:1.25rem 1.5rem}.profile-setup-help-modal-header h2{font-size:1.25rem}.profile-setup-help-modal-content{padding:1.5rem}.help-section h3{font-size:1rem}.profile-setup-help-modal-footer{padding:1.25rem 1.5rem}.profile-setup-help-modal-button{width:100%}}@media (max-width: 480px){.profile-setup-help-modal-header,.profile-setup-help-modal-content{padding:1rem}.help-section{margin-bottom:1.5rem}.profile-setup-help-modal-footer{padding:1rem}}.analysis-section{background:var(--color-card-background);border:1px solid var(--color-border);border-radius:8px;padding:2rem;height:fit-content}.analysis-placeholder{text-align:center;color:var(--color-text-secondary)}.analysis-placeholder h3{margin:0 0 1rem;color:var(--color-text-primary);font-size:1.5rem}.analysis-section h3{margin:0 0 1.5rem;color:var(--color-text-primary);font-size:1.5rem}.analysis-trigger{text-align:center}.selected-color-preview{display:flex;align-items:center;justify-content:center;gap:1rem;margin:1.5rem 0}.color-swatch{width:50px;height:50px;border-radius:8px;border:2px solid var(--color-border)}.color-hex{font-family:monospace;font-size:1.1rem;color:var(--color-text-primary);font-weight:700}.run-analysis-btn{background:linear-gradient(135deg,var(--color-button-primary),var(--color-button-primary-hover));color:var(--color-text-primary);border:none;padding:1rem 2rem;border-radius:8px;font-size:1rem;font-weight:700;cursor:pointer;transition:all .3s ease;margin-top:1rem}.run-analysis-btn:hover:not(:disabled){background:linear-gradient(135deg,var(--color-button-primary-hover),var(--color-button-primary));transform:translateY(-2px);box-shadow:0 4px 8px var(--color-shadow)}.run-analysis-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.analysis-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1rem;gap:1rem}.header-with-color{flex:1}.header-with-color h3{margin:0 0 .75rem}.header-with-color .selected-color-preview{justify-content:flex-start;margin:0}.analysis-header h3{margin:0}.reanalyze-btn{background:var(--color-button-secondary);color:var(--color-text-primary);border:none;padding:.5rem 1rem;border-radius:4px;cursor:pointer;font-size:.875rem}.reanalyze-btn:hover{background:var(--color-button-secondary-hover)}.analysis-content{display:flex;flex-direction:column;gap:.75rem}.collapsible-section{background:var(--color-surface);border:1px solid var(--color-border);border-radius:6px;overflow:hidden}.section-header{width:100%;display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;background:none;border:none;cursor:pointer;transition:background-color .2s ease;text-align:left}.section-header:hover{background:var(--color-hover)}.section-header h4{margin:0;color:var(--color-text-primary);font-size:1.1rem;font-weight:600}.chevron-icon{width:20px;height:20px;color:var(--color-text-secondary);transition:transform .2s ease;flex-shrink:0}.section-content{padding:.75rem 1rem;border-top:1px solid var(--color-border)}.season-match,.color-relationships,.season-recommendations{background:none;border:none;border-radius:0;padding:0}.season-match p,.color-relationships p,.season-recommendations p{margin:0 0 1rem;color:var(--color-text-secondary)}.season-result{margin-bottom:1.5rem;padding:1rem;background:var(--color-surface);border-radius:6px;position:relative}.user-season-result{border:2px solid var(--color-primary);background:linear-gradient(135deg,var(--color-surface),color-mix(in srgb,var(--color-primary) 5%,var(--color-surface)))}.your-season-badge{color:var(--color-primary);font-size:.75rem;font-weight:400;text-transform:uppercase;letter-spacing:.5px}.season-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.season-name{font-weight:700;color:var(--color-text-primary);font-size:1rem}.compatibility-score{font-weight:700;color:var(--color-primary);font-size:1rem}.compatibility-bar{width:100%;height:8px;background:var(--color-border);border-radius:4px;overflow:hidden;margin-bottom:.75rem}.compatibility-fill{height:100%;background:linear-gradient(90deg,var(--color-primary),var(--color-primary-hover));transition:width .3s ease}.reasons{margin:0;padding-left:1.2rem;color:var(--color-text-secondary);font-size:.875rem}.reasons li{margin-bottom:.25rem}.color-palette{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:1rem;margin-top:1rem}.color-square{width:50px;height:50px;border-radius:8px;border:2px solid var(--color-border);box-shadow:0 2px 4px var(--color-shadow)}.color-code{font-family:monospace;font-size:.75rem;color:var(--color-text-secondary);text-align:center}.sister-season-colors h6,.avoid-colors h6{margin:1rem 0 .5rem;color:var(--color-text-primary);font-size:.9rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.avoid-colors h6{color:var(--color-error)}.avoid-colors{margin-top:1.5rem;padding-top:1rem;border-top:1px solid var(--color-border)}.color-palette.avoid{opacity:.8}.color-item.avoid .color-square{border-color:var(--color-error);opacity:.7;position:relative}.color-item.avoid .color-square:after{content:"✕";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:var(--color-error);font-weight:700;font-size:1.2rem;text-shadow:0 0 3px rgba(255,255,255,.8)}.color-item.avoid .color-code{color:var(--color-error)}.color-section{margin-bottom:1.5rem}.color-section h5{margin:0 0 .75rem;color:var(--color-text-secondary);font-size:.9rem;font-weight:400;text-transform:uppercase;letter-spacing:.5px}.color-description{margin:0 0 1rem;color:var(--color-text-muted);font-size:.875rem;font-style:italic}.sister-season-header h5{margin:0;color:var(--color-text-primary);font-size:1rem;font-weight:600}.analysis-section .sister-season-colors{margin-top:.75rem;display:block;background:none;border:none;padding:0;border-radius:0;gap:0}.color-item.small{gap:.25rem}.color-item.small .color-square{width:40px;height:40px}.color-item.small .color-code{font-size:.7rem}@media (max-width: 768px){.analysis-section{padding:1rem}.analysis-header{flex-direction:column;align-items:stretch;gap:1rem;margin-bottom:1rem}.header-with-color .selected-color-preview{justify-content:center;margin:1rem 0}.reanalyze-btn{padding:.75rem 1rem;min-height:44px;border-radius:6px;-webkit-tap-highlight-color:transparent}.reanalyze-btn:active{transform:scale(.95);transition:transform .1s ease}.run-analysis-btn{padding:1rem 1.5rem;min-height:44px;border-radius:8px;font-size:.95rem;-webkit-tap-highlight-color:transparent}.run-analysis-btn:active{transform:scale(.98);transition:transform .1s ease}.section-header,.section-content{padding:.5rem .75rem}.color-palette{grid-template-columns:repeat(auto-fill,minmax(70px,1fr));gap:.5rem}.sister-season-colors .color-grid-preview{grid-template-columns:repeat(auto-fill,minmax(14px,14px));gap:.2rem;padding:.4rem}.sister-season-colors .color-chip-preview{width:14px;height:14px}.color-item.small .color-square{width:35px;height:35px}.color-item.small .color-code{font-size:.65rem}.sister-season{padding:.75rem;margin-bottom:1rem}.season-title{flex-direction:column;align-items:flex-start;gap:.5rem}.borrowing-level{align-self:flex-start}.compatibility-bar{height:10px;border-radius:5px}.season-result{padding:.75rem;margin-bottom:1rem}.analysis-content{gap:.5rem}}@media (max-width: 480px){.analysis-section{padding:.75rem;border-radius:6px}.analysis-trigger,.analysis-placeholder{text-align:center}.analysis-trigger h3,.analysis-placeholder h3{font-size:1.2rem}.run-analysis-btn{padding:1rem;font-size:.9rem}.color-palette{grid-template-columns:repeat(auto-fill,minmax(60px,1fr));gap:.4rem}.color-square{width:40px;height:40px}.color-item.small .color-square{width:30px;height:30px}.color-code{font-size:.65rem}.color-item.small .color-code{font-size:.6rem}.sister-season{padding:.75rem}.sister-season h5{font-size:1rem}.borrowing-level{font-size:.7rem;padding:.2rem .6rem}}.season-palette-preview{background:color-mix(in srgb,var(--color-success) 5%,var(--color-surface));border:1px solid var(--color-success);border-radius:8px;padding:16px;margin-top:16px;margin-bottom:16px;transition:all .2s ease}.season-palette-preview.clickable{cursor:pointer}.season-palette-preview.clickable:hover{border-color:var(--color-success);background:color-mix(in srgb,var(--color-success) 10%,var(--color-surface));transform:translateY(-2px);box-shadow:0 4px 8px var(--color-shadow)}.palette-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.palette-header-right{display:flex;align-items:center;gap:8px}.palette-header h5{margin:0;color:var(--color-success);font-size:16px;font-weight:600}.color-count{color:var(--color-text-secondary);font-size:14px}.edit-season-btn{padding:4px;border:none;background:none;color:var(--color-text-secondary);cursor:pointer;border-radius:4px;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.edit-season-btn:hover{background:var(--color-border);color:var(--color-text)}.edit-icon{width:16px;height:16px}.color-grid-preview{display:grid;grid-template-columns:repeat(auto-fill,minmax(16px,16px));gap:4px;margin-bottom:12px;padding:8px;background:var(--color-card-background);border-radius:8px;border:1px solid var(--color-border);position:relative}.color-chip-preview{width:16px;height:16px;border-radius:2px;border:1px solid rgba(0,0,0,.1);cursor:pointer;transition:transform .2s ease}.color-chip-preview:hover{transform:scale(1.3);z-index:1;box-shadow:0 2px 4px var(--color-shadow)}.more-colors-indicator{display:flex;align-items:center;justify-content:center;width:16px;height:16px;background:var(--color-text-secondary);color:#fff;border-radius:2px;font-size:10px;font-weight:700}.palette-characteristics{color:var(--color-text-secondary);font-size:13px;text-align:center;text-transform:uppercase;letter-spacing:.8px}@media (max-width: 768px){.palette-header{flex-direction:column;align-items:flex-start;gap:4px}.color-grid-preview{grid-template-columns:repeat(auto-fill,minmax(12px,12px));gap:3px;padding:6px}.color-chip-preview{width:12px;height:12px}.more-colors-indicator{width:12px;height:12px;font-size:9px}}.personal-color-selector{background:var(--color-card-background);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--container-padding);height:fit-content;box-shadow:var(--shadow-sm);position:relative;z-index:10;margin-top:1rem}.selector-header{margin-bottom:16px;text-align:center}.header-content{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-2)}.center-button-section{display:flex;flex-direction:column;align-items:center;gap:var(--space-1);width:100%}.button-help-text{margin:0;color:var(--color-text-muted);font-size:var(--text-sm);text-align:center}.selector-header h3{margin:0 0 var(--space-1) 0;color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:600}.selector-header p{margin:0 0 var(--space-2) 0;color:var(--color-text-secondary);font-size:var(--text-base)}.auth-warning{margin-bottom:var(--section-gap);background:color-mix(in srgb,#f59e0b 10%,transparent);border:1px solid color-mix(in srgb,#f59e0b 30%,transparent);border-radius:var(--radius-md);padding:var(--space-3)}.auth-warning-content{display:flex;align-items:flex-start;gap:var(--space-2)}.auth-warning-icon{font-size:var(--text-lg);flex-shrink:0}.auth-warning-text strong{color:var(--color-text-primary);font-weight:600;display:block;margin-bottom:var(--space-1)}.auth-warning-text p{margin:0;color:var(--color-text-secondary);font-size:var(--text-sm)}.get-season-btn{background:linear-gradient(135deg,var(--color-primary),#8b5cf6);color:#fff;border:none;padding:0 var(--space-4);border-radius:var(--radius-md);cursor:pointer;transition:all .2s ease;font-size:var(--text-base);font-weight:600;display:flex;align-items:center;justify-content:center;gap:var(--space-1);box-shadow:var(--shadow-md);margin-top:var(--space-1);white-space:nowrap;height:var(--button-height-lg);min-width:200px}.get-season-btn:hover:not(:disabled){background:linear-gradient(135deg,var(--color-primary-hover),#7c3aed);transform:translateY(-1px);box-shadow:0 4px 8px #8b5cf64d}.get-season-btn.disabled,.get-season-btn:disabled{background:var(--color-button-secondary);color:var(--color-text-muted);cursor:not-allowed;box-shadow:none}.get-season-btn.disabled:hover,.get-season-btn:disabled:hover{transform:none;box-shadow:none}.get-season-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.get-season-btn .btn-icon{width:16px;height:16px}.selector-header .progress-bar-container{margin-top:.5rem}.selector-header .progress-bar{width:100%;height:8px;background:var(--color-surface);border-radius:4px;overflow:hidden;border:1px solid var(--color-border)}.reset-btn{background:var(--color-error);color:#fff;border:none;width:40px;height:40px;border-radius:8px;font-size:1.2rem;cursor:pointer;transition:all .2s ease;flex-shrink:0;display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent}.reset-btn:hover{background:color-mix(in srgb,var(--color-error) 90%,black);transform:translateY(-1px);box-shadow:0 2px 4px var(--color-shadow)}.color-categories{display:flex;flex-direction:column;gap:1rem;margin-bottom:2rem}.color-category{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:var(--color-surface);border:2px solid var(--color-border);border-radius:8px;transition:all .2s}.color-category.completed{border-color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 5%,var(--color-surface))}.category-info{flex:1}.category-info h4{margin:0 0 .25rem;color:var(--color-text-primary);font-size:1rem}.category-info p{margin:0;color:var(--color-text-muted);font-size:.85rem}.color-result{display:flex;align-items:center;min-width:120px;justify-content:flex-end}.selected-color{display:flex;align-items:center;gap:.75rem}.color-swatch{width:40px;height:40px;border-radius:8px;border:2px solid var(--color-border);box-shadow:0 2px 4px var(--color-shadow)}.color-hex{font-family:monospace;font-size:.85rem;color:var(--color-text-primary);min-width:60px}.not-selected{color:var(--color-text-muted);font-size:.85rem;font-style:italic}.context-menu-wrapper{position:relative}.context-menu-trigger{background:transparent;border:none;width:40px;height:40px;border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease}.context-menu-trigger:hover{background:var(--color-surface)}.menu-icon{width:24px;height:24px;color:var(--color-text-secondary)}.context-menu{position:absolute;top:100%;right:0;margin-top:.5rem;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:8px;box-shadow:0 4px 12px var(--color-shadow);min-width:180px;z-index:100}.menu-item{display:block;width:100%;text-align:left;padding:.75rem 1rem;background:none;border:none;color:var(--color-text-primary);font-size:.9rem;cursor:pointer;transition:background .2s ease}.menu-item:first-child{border-radius:8px 8px 0 0}.menu-item:last-child{border-radius:0 0 8px 8px}.season-not-set-message{text-align:center;padding:var(--space-4);background:var(--color-card-background);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);margin-bottom:var(--space-4)}.season-not-set-header{display:flex;justify-content:center;align-items:center;gap:var(--space-2);margin-bottom:var(--space-1)}.season-not-set-message h4.season-not-set{margin:0;color:var(--color-text-muted);font-style:italic;font-size:var(--text-lg);font-weight:600}.season-not-set-message p{margin:0;color:var(--color-text-secondary);font-size:var(--text-base)}.active-category{border-color:var(--color-primary);box-shadow:0 0 0 2px color-mix(in srgb,var(--color-primary) 20%,transparent)}.progress-section{margin-bottom:2rem;text-align:center}.progress-bar{width:100%;height:8px;background:var(--color-border);border-radius:4px;overflow:hidden;margin-bottom:.75rem}.progress-fill{height:100%;background:linear-gradient(90deg,var(--color-primary),var(--color-primary-hover));transition:width .3s ease}.progress-text{color:var(--color-text-secondary);font-size:.9rem}.actions-section{display:flex;gap:1rem;justify-content:center;margin-bottom:2rem}.ask-ai-btn,.show-prompt-btn{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;border-radius:8px;cursor:pointer;font-size:.95rem;font-weight:500;transition:all .2s ease;border:none}.ask-ai-btn{background:var(--color-primary);color:#fff;border:1px solid var(--color-primary);font-weight:500;box-shadow:0 2px 8px #0000001a;position:relative;overflow:hidden;background-image:linear-gradient(135deg,var(--color-primary),var(--color-primary-hover))}.ask-ai-btn{text-shadow:0 1px 2px rgba(0,0,0,.1)}.ask-ai-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s ease}.ask-ai-btn:hover:before{left:100%}.ask-ai-btn:hover:not(:disabled){background:linear-gradient(135deg,var(--color-primary-hover),var(--color-primary));color:#fff;transform:translateY(-2px);box-shadow:0 6px 20px #00000026;border-color:var(--color-primary-hover)}.ask-ai-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.show-prompt-btn{background:var(--color-button-secondary);color:var(--color-text-primary);border:1px solid var(--color-border)}.show-prompt-btn:hover{background:var(--color-button-secondary-hover);transform:translateY(-1px);border-color:var(--color-primary)}.ask-ai-btn .btn-icon{filter:drop-shadow(0 0 2px rgba(0,0,0,.3));color:#fff}.analyze-btn,.save-btn{padding:1rem 2rem;border:none;border-radius:8px;font-size:1rem;font-weight:700;cursor:pointer;transition:all .3s ease}.analyze-btn{background:linear-gradient(135deg,var(--color-button-primary),var(--color-button-primary-hover));color:var(--color-text-primary)}.analyze-btn:hover:not(:disabled){background:linear-gradient(135deg,var(--color-button-primary-hover),var(--color-button-primary));transform:translateY(-2px);box-shadow:0 4px 8px var(--color-shadow)}.analyze-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.save-btn{background:var(--color-button-secondary);color:var(--color-text-primary)}.save-btn:hover{background:var(--color-button-secondary-hover);transform:translateY(-1px)}.save-btn.saved{background:var(--color-success);color:#fff}.save-btn.saved:hover{background:color-mix(in srgb,var(--color-success) 90%,black)}.analysis-result{background:color-mix(in srgb,var(--color-primary) 5%,var(--color-surface));border:1px solid var(--color-primary);border-radius:8px;padding:2rem;text-align:center;margin-top:1rem;animation:slideUp .3s ease-out}.analysis-result h4{margin:0 0 .75rem;color:var(--color-primary);font-size:1.1rem}.analysis-result p{margin:0;color:var(--color-text-primary);font-size:1rem}.analysis-error{background:color-mix(in srgb,var(--color-error) 5%,var(--color-surface));border:1px solid var(--color-error);border-radius:8px;padding:1.5rem;text-align:center;margin-bottom:1rem}.analysis-error h4{margin:0 0 .75rem;color:var(--color-error);font-size:1.1rem}.analysis-error p{margin:0 0 1rem;color:var(--color-text-primary)}.analysis-error button{background:var(--color-error);color:#fff;border:none;padding:.5rem 1rem;border-radius:4px;cursor:pointer}.analysis-error button:hover:not(:disabled){opacity:.9}.confidence-section{margin:1.5rem 0;background:var(--color-surface);padding:1.25rem;border-radius:8px;border:1px solid var(--color-border)}.confidence-label{color:var(--color-text-primary);font-size:1.1rem;font-weight:600;margin-bottom:.75rem;text-align:center}.confidence-bar-container{width:100%}.confidence-bar-bg{width:100%;height:16px;background:var(--color-border);border-radius:8px;overflow:hidden;position:relative}.confidence-fill{height:100%;background:linear-gradient(90deg,var(--color-success),var(--color-primary));border-radius:8px;transition:width .3s ease-out;position:relative;box-shadow:inset 0 1px 2px #ffffff4d}@keyframes shimmer{0%{background-position:0 0}to{background-position:24px 0}}.season-option-result{margin:1.5rem 0;padding:1rem;border:1px solid var(--color-border);border-radius:8px;background:var(--color-surface)}.season-option-result h5{margin:0 0 .5rem;color:var(--color-primary);font-size:1.1rem}.option-reasoning{margin:.5rem 0;font-size:.9rem;color:var(--color-text-secondary)}.needed-colors{margin-top:1rem}.needed-colors strong{display:block;margin-bottom:.5rem;color:var(--color-text-primary)}.needed-colors ul{margin:0;padding-left:1.5rem}.needed-colors li{margin:.25rem 0;font-size:.9rem}.alternative-season{margin:1rem 0;padding:1rem;border:1px solid var(--color-border);border-radius:6px;background:var(--color-card-background)}.alternative-season h5{margin:0 0 .5rem;color:var(--color-secondary)}.alternative-season p{margin:0 0 1rem;color:var(--color-text-secondary);line-height:1.5}.alternative-colors h6{margin:1rem 0 .5rem;color:var(--color-text-primary);font-size:.9rem;font-weight:600}.alternative-color-swatch{width:36px;height:36px;border-radius:6px;border:2px solid var(--color-border);cursor:pointer;transition:all .2s ease;box-shadow:0 2px 4px #0000001a}.alternative-color-swatch:hover{transform:translateY(-2px);box-shadow:0 4px 8px #00000026;border-color:var(--color-primary)}.ai-disclaimer{margin-top:2rem;padding:1rem;border-top:1px solid var(--color-border);background:color-mix(in srgb,var(--color-warning) 5%,transparent);border-radius:6px;text-align:center}.ai-disclaimer small{color:var(--color-text-muted);font-size:.8rem;line-height:1.4}.ai-disclaimer strong{color:var(--color-warning)}.season-selection{margin:1rem 0}.season-option-selectable{margin:1rem 0;padding:1.25rem;border:2px solid var(--color-border);border-radius:8px;background:var(--color-surface);cursor:pointer;transition:all .2s ease;position:relative;z-index:10;pointer-events:auto}.season-option-selectable:hover{border-color:var(--color-primary);background:var(--color-card-background);background:color-mix(in srgb,var(--color-primary) 5%,var(--color-surface));transform:scale(1.02)}.season-option-selectable.selected{border-color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 10%,var(--color-surface))}.season-header-selectable{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}.season-header-selectable h5{margin:0;color:var(--color-primary);font-size:1.1rem}.season-header-selectable input[type=radio]{margin:0}.save-season-btn:disabled{opacity:.5;cursor:not-allowed;background:var(--color-secondary)}.analysis-result .reasoning,.analysis-result .recommendations{text-align:left;margin:1.5rem 0}.analysis-result .reasoning h5,.analysis-result .recommendations h5{margin:0 0 .75rem;color:var(--color-text-primary);font-size:1.1rem;font-weight:600}.analysis-result .reasoning p{line-height:1.5;color:var(--color-text-secondary)}.analysis-result .recommendations ul{margin:0;padding-left:1.5rem;color:var(--color-text-secondary)}.analysis-result .recommendations li{margin-bottom:.5rem;line-height:1.4}.analyze-btn.secondary{background:var(--color-button-secondary);color:var(--color-text-primary);margin-top:1rem;padding:.75rem 1.5rem;font-size:.9rem}.analyze-btn.secondary:hover:not(:disabled){background:var(--color-button-secondary-hover)}.error-message{color:var(--color-error)!important}.analysis-details{display:flex;flex-direction:column;gap:1.5rem}.top-season{text-align:center}.top-season h5{margin:0 0 1rem;color:#4caf50;font-size:1.3rem;font-weight:700}.confidence-bar{width:100%;height:12px;background:#444;border-radius:6px;overflow:hidden;margin-bottom:.5rem}.confidence-fill{height:100%;background:linear-gradient(90deg,#4caf50,#45a049);transition:width .5s ease}.confidence-text{color:#4caf50;font-weight:700;font-size:.9rem}.season-rankings h6,.overall-analysis h6{margin:0 0 1rem;color:#fff;font-size:1.1rem;text-transform:uppercase;letter-spacing:.5px}.season-ranking{background:#2a2a2a;border-radius:6px;padding:1rem;margin-bottom:.75rem}.ranking-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.rank-number{background:#4caf50;color:#fff;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:700}.season-name{font-weight:700;color:#fff;flex:1;margin-left:.75rem}.season-score{color:#4caf50;font-weight:700}.season-reasons{display:flex;flex-wrap:wrap;gap:.5rem}.reason{background:#1a1a1a;color:#ccc;padding:.25rem .5rem;border-radius:12px;font-size:.8rem;border:1px solid #444}.overall-analysis ul{margin:0;padding-left:1.2rem;color:#ccc}.contrasting-colors{margin-bottom:1.5rem}.contrast-description{color:#ccc;font-size:.9rem;margin-bottom:1rem;font-style:italic}.contrast-color-palette{display:grid;grid-template-columns:repeat(auto-fit,minmax(80px,1fr));gap:1rem;margin-bottom:1.5rem}.contrast-color-item{display:flex;flex-direction:column;align-items:center;gap:.5rem}.contrast-color-square{width:50px;height:50px;border-radius:8px;border:2px solid #333;box-shadow:0 2px 4px #0003}.contrast-color-code{font-family:monospace;font-size:.7rem;color:#ccc;text-align:center}.overall-analysis li{margin-bottom:.5rem;line-height:1.4}.modal-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;z-index:99999;display:flex;align-items:center;justify-content:center;padding:1rem}.analysis-modal,.prompt-modal,.season-selector-modal{background:var(--color-card-background);border-radius:12px;box-shadow:0 8px 32px var(--color-shadow);z-index:99999;position:relative;width:90vw;max-width:600px;max-height:90vh;overflow-y:auto;border:1px solid var(--color-border)}.modal-header h3{margin:0;color:var(--color-text-primary);font-size:1.25rem;font-weight:600}.modal-close{background:transparent;border:none;font-size:1.75rem;color:var(--color-text-secondary);cursor:pointer;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s ease}.modal-close:hover{background:var(--color-surface);color:var(--color-text-primary)}.modal-content{padding:1.5rem;margin-left:2rem}.analysis-modal .modal-content h4{margin:0 0 1.25rem;font-size:1.25rem}.analysis-modal .confidence-section{margin:1rem 0}.analysis-modal .reasoning,.analysis-modal .recommendations{margin:1.25rem 0}.analysis-modal .recommendations ul{margin:0;padding:0;list-style:none}.analysis-modal .recommendations li{padding:.5rem 0 .5rem 1.5rem;position:relative;line-height:1.5;color:var(--color-text-secondary)}.analysis-modal .recommendations li:before{content:"•";position:absolute;left:0;color:var(--color-primary);font-weight:700;font-size:1.2rem}.hex-highlight{display:inline-flex;align-items:center;gap:.25rem;padding:.1rem .3rem;background:#0000000d;border-radius:4px;font-weight:600;font-family:monospace}.hex-color{display:inline-block;width:12px;height:12px;border-radius:2px;border:1px solid rgba(0,0,0,.2);flex-shrink:0}.reasoning-text{line-height:1.6;color:var(--color-text-secondary)}.colors-used-summary{margin:1.5rem 0 1rem;padding:1rem;background:var(--color-surface);border-radius:8px;border:1px solid var(--color-border)}.colors-used-summary h5{margin:0 0 .75rem;color:var(--color-text-primary);font-size:1rem;font-weight:600}.colors-used-summary .category-selector{display:flex;flex-direction:column;gap:.5rem}.colors-used-summary .category-item{cursor:default;border:1px solid var(--color-border)}.colors-used-summary .category-item:hover{background:var(--color-card-background)}.modal-actions{display:flex;justify-content:flex-end;gap:1rem;padding:1.25rem 1.5rem;margin-top:1.5rem;border-top:1px solid var(--color-border);background:var(--color-surface)}.cancel-btn,.save-season-btn,.close-btn,.copy-prompt-btn{padding:.75rem 1.5rem;border-radius:6px;cursor:pointer;font-size:.9rem;font-weight:500;transition:all .2s ease}.cancel-btn,.close-btn{background:var(--color-button-secondary);color:var(--color-text-primary);border:1px solid var(--color-border)}.cancel-btn:hover,.close-btn:hover{background:var(--color-button-secondary-hover)}.save-season-btn,.copy-prompt-btn{background:var(--color-primary)!important;color:#fff!important;border:none}.save-season-btn:hover:not(:disabled),.copy-prompt-btn:hover{background:var(--color-primary-hover)!important;transform:translateY(-1px)}.copy-prompt-btn{display:flex;align-items:center;gap:.5rem}.prompt-content{background:var(--color-surface);border:1px solid var(--color-border);border-radius:8px;padding:1.5rem;margin-bottom:1.5rem;max-height:400px;overflow-y:auto}.prompt-content pre{margin:0;white-space:pre-wrap;word-wrap:break-word;font-family:Monaco,Menlo,monospace;font-size:.85rem;line-height:1.5;color:var(--color-text-primary)}.prompt-instructions{background:color-mix(in srgb,var(--color-primary) 5%,var(--color-surface));border:1px solid var(--color-primary);border-radius:8px;padding:1.25rem}.prompt-instructions h5{margin:0 0 1rem;color:var(--color-primary);font-size:1rem}.prompt-instructions ol{margin:0;padding-left:1.5rem;color:var(--color-text-primary)}.prompt-instructions li{margin-bottom:.5rem;line-height:1.4}.season-selector-description{margin:0 0 1.5rem;color:var(--color-text-secondary);font-size:.95rem}.seasons-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1rem;max-height:500px;overflow-y:auto;padding:.5rem}.season-option{background:var(--color-surface);border:2px solid var(--color-border);border-radius:8px;padding:1rem;cursor:pointer;transition:all .2s ease}.season-option:hover{border-color:var(--color-primary);transform:translateY(-2px);box-shadow:0 4px 12px var(--color-shadow)}.season-option.selected{border-color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 10%,var(--color-surface))}.season-option-header{margin-bottom:.75rem}.season-option-header h5{margin:0 0 .5rem;color:var(--color-text-primary);font-size:1rem;font-weight:600}.season-option-characteristics{display:flex;flex-wrap:wrap;gap:.25rem}.char-tag{background:var(--color-card-background);padding:.2rem .5rem;border-radius:4px;font-size:.7rem;color:var(--color-text-secondary)}.season-option-colors{display:grid;grid-template-columns:repeat(12,1fr);gap:2px;margin-bottom:.75rem;border-radius:4px;overflow:hidden}.season-option-color{aspect-ratio:1;width:100%}.season-option-description{margin:0;color:var(--color-text-secondary);font-size:.8rem;line-height:1.3}.ai-analysis-results{background:var(--color-surface);border:1px solid var(--color-border);border-radius:12px;padding:1.5rem}.analysis-result-header{margin-bottom:1.5rem}.analysis-result-header h3{margin:0;color:var(--color-text-primary);font-size:1.1rem;font-weight:600}.saved-analysis-content h4{margin:0 0 1rem;color:var(--color-primary);font-size:1.25rem;font-weight:600}.saved-analysis-content .confidence-section,.saved-analysis-content .reasoning,.saved-analysis-content .recommendations,.saved-analysis-content .sister-seasons{margin-bottom:1.5rem}.saved-analysis-content h5{margin:0 0 .75rem;color:var(--color-text-primary);font-size:1rem;font-weight:600}.saved-analysis-content p{margin:0;color:var(--color-text-primary);line-height:1.5}.saved-analysis-content ul{margin:0;padding-left:1.5rem}.saved-analysis-content li{margin-bottom:.5rem;color:var(--color-text-primary);line-height:1.4}.analyzing-modal{background:var(--color-card-background);border:1px solid var(--color-border);border-radius:12px;padding:2.5rem;max-width:500px;width:90vw;text-align:center;box-shadow:0 20px 40px #00000026;z-index:99999;position:relative}.analyzing-content{display:flex;flex-direction:column;align-items:center;gap:1.5rem}.analyzing-spinner{display:flex;justify-content:center;margin-bottom:1rem}.spinner{width:60px;height:60px;border:4px solid var(--color-surface);border-left:4px solid var(--color-primary);border-radius:50%;animation:spin 1s linear infinite}.analyzing-modal h3{margin:0;color:var(--color-text-primary);font-size:1.5rem;font-weight:600}.analyzing-modal p{margin:0;color:var(--color-text-secondary);font-size:1rem;line-height:1.5}.analyzing-steps{display:flex;flex-direction:column;gap:.75rem;margin-top:1rem}.step{display:flex;align-items:center;gap:.75rem;padding:.5rem 1rem;background:var(--color-surface);border-radius:6px;color:var(--color-text-secondary);font-size:.9rem;border:1px solid var(--color-border)}.step.active{background:color-mix(in srgb,var(--color-primary) 10%,transparent);color:var(--color-primary);border-color:var(--color-primary)}@media (max-width: 768px){.analysis-modal,.prompt-modal,.season-selector-modal{width:95vw;max-width:95vw}.modal-content{margin-left:0;padding:1rem}.header-content{flex-direction:column;align-items:center;gap:1rem}.color-category{flex-direction:column;align-items:flex-start;gap:1rem}.color-result{justify-content:flex-start;min-width:auto}.actions-section{flex-direction:column;align-items:stretch}.ranking-header{flex-direction:column;align-items:flex-start;gap:.5rem}.season-name{margin-left:0}}.collapsible-section{margin-bottom:var(--space-2)}.section-header{display:flex;justify-content:space-between;align-items:center;padding:var(--space-3);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:all .2s ease;-webkit-user-select:none;user-select:none;min-height:var(--touch-target-min)}.section-header:hover{background:var(--color-card-background);border-color:var(--color-primary)}.section-header h3{margin:0;color:var(--color-text-primary);font-size:var(--text-lg);font-weight:600}.chevron{font-size:1rem;color:var(--color-text-secondary);transition:transform .3s ease;transform-origin:center}.chevron.expanded{transform:rotate(180deg)}.collapsible-content{margin-top:.5rem;padding:1rem;background:var(--color-card-background);border:1px solid var(--color-border);border-top:none;border-radius:0 0 8px 8px}.empty-analysis-state{text-align:center;padding:2rem;color:var(--color-text-secondary);font-style:italic}.ai-point-summary{margin-top:1.5rem;padding:1rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:8px}.ai-point-summary h5{margin:0 0 1rem;color:var(--color-text-primary);font-size:1rem;font-weight:600}.overall-confidence-section{margin-bottom:1rem;padding:.75rem;background:var(--color-card-background);border-radius:6px;border:1px solid var(--color-border)}.confidence-header{margin-bottom:.5rem}.confidence-label{font-size:.9rem;color:var(--color-text-primary);font-weight:600}.confidence-fill.high-confidence{background:linear-gradient(90deg,var(--color-success),#4caf50)}.confidence-fill.medium-confidence{background:linear-gradient(90deg,#ff9800,#ffc107)}.confidence-fill.low-confidence{background:linear-gradient(90deg,var(--color-error),#f44336)}.analysis-feedback{margin-bottom:1rem;padding:1rem;border-radius:6px;border:1px solid}.analysis-feedback.success{background:color-mix(in srgb,var(--color-success) 10%,transparent);border-color:var(--color-success)}.analysis-feedback.good{background:color-mix(in srgb,var(--color-primary) 10%,transparent);border-color:var(--color-primary)}.analysis-feedback.warning{background:color-mix(in srgb,#ff9800 10%,transparent);border-color:#ff9800}.analysis-feedback.poor{background:color-mix(in srgb,var(--color-error) 10%,transparent);border-color:var(--color-error)}.feedback-content{display:flex;flex-direction:column;gap:.75rem}.feedback-message{margin:0;color:var(--color-text-primary);font-size:.9rem;line-height:1.4}.feedback-improvement{margin:0;color:var(--color-text-secondary);font-size:.85rem;line-height:1.4}.point-confidences{display:flex;flex-direction:column;gap:.5rem}.point-confidence-item{display:flex;align-items:center;justify-content:space-between;padding:.75rem;background:var(--color-card-background);border-radius:6px;border:1px solid var(--color-border)}.point-info{display:flex;flex-direction:column;gap:.25rem;flex:1}.point-name{font-size:.9rem;color:var(--color-text-primary);font-weight:500}.point-note{font-size:.8rem;color:var(--color-text-secondary);font-style:italic}.point-confidence-display{display:flex;align-items:center}.point-confidence{font-size:.85rem;font-weight:600;padding:.25rem .5rem;border-radius:4px;background:var(--color-surface);border:1px solid var(--color-border)}.point-confidence.high-confidence{color:var(--color-success);border-color:var(--color-success)}.point-confidence.medium-confidence{color:#ff9800;border-color:#ff9800}.point-confidence.low-confidence{color:var(--color-error);border-color:var(--color-error)}.ai-indicator{display:flex;align-items:center;gap:.5rem}.ai-confidence{font-size:.7rem;font-weight:600;padding:.15rem .4rem;border-radius:3px;background:var(--color-surface);border:1px solid}.ai-confidence.high-confidence{color:var(--color-success);border-color:var(--color-success);background:color-mix(in srgb,var(--color-success) 10%,var(--color-surface))}.ai-confidence.medium-confidence{color:#ff9800;border-color:#ff9800;background:color-mix(in srgb,#ff9800 10%,var(--color-surface))}.ai-confidence.low-confidence{color:var(--color-error);border-color:var(--color-error);background:color-mix(in srgb,var(--color-error) 10%,var(--color-surface))}.next-step-message{margin:1.5rem 0;padding:1.5rem;background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 8%,transparent),color-mix(in srgb,var(--color-primary) 4%,transparent));border:1px solid color-mix(in srgb,var(--color-primary) 20%,transparent);border-radius:12px;text-align:center;animation:slideInUp .5s ease-out}.next-step-content h4{margin:0 0 .75rem;color:var(--color-text-primary);font-size:1.1rem;font-weight:600}.next-step-content p{margin:0 0 1.25rem;color:var(--color-text-secondary);line-height:1.6}.continue-to-wardrobe-btn{background:linear-gradient(135deg,var(--color-primary),#8b5cf6);color:#fff;border:none;padding:.75rem 1.5rem;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease;display:inline-flex;align-items:center;gap:.5rem}.continue-to-wardrobe-btn:hover{transform:translateY(-2px);box-shadow:0 8px 16px #8b5cf64d}@media (max-width: 768px){.next-step-message{margin:1rem 0;padding:1.25rem}.continue-to-wardrobe-btn{width:100%;justify-content:center}}.analysis-details{margin-top:1.5rem;padding-top:1rem;border-top:1px solid var(--card-border)}.analysis-breakdown{display:flex;flex-direction:column;gap:1rem}.analysis-item{background:var(--bg-secondary);padding:.75rem;border-radius:8px;border:1px solid var(--card-border)}.analysis-item strong{color:var(--color-primary);display:block;margin-bottom:.25rem}.analysis-item ul{margin:.5rem 0 0;padding-left:1.5rem}.analysis-item li{margin-bottom:.25rem;line-height:1.4}.alternative-season{margin-top:1.5rem;padding:1rem;background:var(--bg-secondary);border-radius:12px;border:1px solid var(--card-border)}.alternative-season h5{color:var(--color-primary);margin-bottom:.75rem}.alternative-season h6{color:var(--text-primary);margin:1rem 0 .5rem;font-size:.9rem}.alternative-color-palette{display:flex;gap:.5rem;flex-wrap:wrap}.alternative-color-swatch{width:32px;height:32px;border-radius:6px;border:2px solid var(--card-border);cursor:pointer;transition:transform .2s ease}.alternative-color-swatch:hover{transform:scale(1.1);box-shadow:0 2px 8px #0000001a}.individual-ai-colors{margin-top:1.5rem;padding:1rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:8px}.individual-ai-colors h6{margin:0 0 .75rem;color:var(--color-text-primary);font-size:1rem;font-weight:600}.ai-colors-grid{display:flex;flex-direction:column;gap:.5rem}.ai-color-item{display:flex;align-items:center;gap:.75rem;padding:.75rem;background:var(--color-card-background);border:2px solid var(--color-border);border-radius:8px;transition:all .2s ease;min-height:60px}.ai-color-item:hover{background:var(--color-card-background);border-color:var(--color-primary);transform:translateY(-1px);box-shadow:0 4px 8px #0000001a}.ai-color-swatch{width:32px;height:32px;border-radius:50%;border:2px solid var(--color-border);flex-shrink:0;box-shadow:0 2px 4px #0000001a}.ai-color-info{display:flex;flex-direction:column;gap:.25rem;flex:1}.ai-color-label{font-weight:600;color:var(--color-text-primary);font-size:.9rem}.ai-color-hex{font-family:monospace;font-size:.8rem;color:var(--color-text-secondary);background:var(--color-card-background);padding:.15rem .4rem;border-radius:4px;border:1px solid var(--color-border);display:inline-block;width:fit-content}.ai-color-indicators{display:flex;align-items:center;gap:.5rem;flex-shrink:0}.ai-color-confidence{font-weight:600;font-size:.7rem;padding:.15rem .4rem;border-radius:3px;border:1px solid}.ai-color-confidence.high-confidence{color:var(--color-success);border-color:var(--color-success);background:color-mix(in srgb,var(--color-success) 10%,var(--color-surface))}.ai-color-confidence.medium-confidence{color:#ff9800;border-color:#ff9800;background:color-mix(in srgb,#ff9800 10%,var(--color-surface))}.ai-color-confidence.low-confidence{color:var(--color-error);border-color:var(--color-error);background:color-mix(in srgb,var(--color-error) 10%,var(--color-surface))}.category-item{display:flex;align-items:center;gap:.75rem;padding:.75rem;background:var(--color-surface);border:2px solid var(--color-border);border-radius:8px;transition:all .2s ease;cursor:pointer;min-height:60px}.category-item:hover{background:var(--color-card-background);border-color:var(--color-primary);transform:translateY(-1px);box-shadow:0 4px 8px #0000001a}.category-item.selected{border-color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 10%,var(--color-surface))}.category-item.has-color{border-color:var(--color-success)}.category-info{display:flex;flex-direction:column;gap:.25rem;flex:1}.category-name{font-weight:600;color:var(--color-text-primary);font-size:.9rem}.category-hex{font-family:monospace;font-size:.8rem;color:var(--color-text-secondary);background:var(--color-card-background);padding:.15rem .4rem;border-radius:4px;border:1px solid var(--color-border);display:inline-block;width:fit-content}.category-indicators{display:flex;align-items:center;gap:.5rem;flex-shrink:0}.ai-icon,.user-icon{width:16px;height:16px}.ai-icon{color:var(--color-primary)}.user-icon{color:var(--color-text-secondary)}.active-emoji{font-size:1.2rem;margin-left:.5rem}.season-colors-modal{background:var(--color-card-background);border-radius:12px;box-shadow:0 8px 32px var(--color-shadow);max-width:900px;width:100%;max-height:90vh;overflow-y:auto;border:1px solid var(--color-border)}.season-colors-modal .modal-header{display:flex;justify-content:space-between;align-items:flex-start;padding:2rem;border-bottom:1px solid var(--color-border);background:linear-gradient(135deg,var(--color-surface),color-mix(in srgb,var(--color-success) 5%,var(--color-surface)))}.season-colors-modal .modal-header h3{margin:0 0 .5rem;color:var(--color-text-primary);font-size:1.5rem;font-weight:600}.season-description{margin:0 0 .75rem;color:var(--color-text-secondary);font-size:1rem;line-height:1.4}.season-characteristics{display:flex;flex-wrap:wrap;gap:.5rem}.characteristic-tag{background:var(--color-primary);color:#fff;padding:.25rem .75rem;border-radius:12px;font-size:.8rem;font-weight:500;text-transform:uppercase;letter-spacing:.5px}.color-categories-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;padding:2rem}.color-category-section{background:var(--color-surface);border:1px solid var(--color-border);border-radius:8px;padding:1.5rem}.category-title{margin:0 0 1rem;color:var(--color-primary);font-size:1.1rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;text-align:center}.color-swatches-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(80px,1fr));gap:1rem}.color-swatch-item{display:flex;flex-direction:column;align-items:center;gap:.5rem}.color-swatch-large{width:60px;height:60px;border-radius:8px;border:2px solid var(--color-border);box-shadow:0 2px 8px var(--color-shadow);cursor:pointer;transition:all .2s ease}.color-swatch-large:hover{transform:scale(1.1);border-color:var(--color-primary);box-shadow:0 4px 12px var(--color-shadow)}.color-code{font-family:Monaco,Menlo,monospace;font-size:.75rem;color:var(--color-text-secondary);text-align:center;word-break:break-all}.sister-seasons-section{background:color-mix(in srgb,var(--color-primary) 5%,var(--color-surface));border:1px solid color-mix(in srgb,var(--color-primary) 20%,transparent);border-radius:8px;padding:1.5rem;margin:0 2rem 2rem}.sister-seasons-section h4{margin:0 0 .75rem;color:var(--color-primary);font-size:1.1rem;font-weight:600}.sister-seasons-text{margin:0 0 1.5rem;color:var(--color-text-secondary);font-size:.95rem;line-height:1.4}.sister-seasons-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem}.sister-season-card{background:var(--color-card-background);border:1px solid var(--color-border);border-radius:8px;padding:1.5rem;transition:all .2s ease}.sister-season-card:hover{border-color:var(--color-primary);box-shadow:0 2px 8px var(--color-shadow)}.sister-season-card h5{margin:0 0 .75rem;color:var(--color-text-primary);font-size:1.2rem;font-weight:600}.sister-season-description{margin:0 0 1rem;color:var(--color-text-secondary);font-size:.9rem;line-height:1.4}.sister-season-characteristics{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem}.sister-characteristic-tag{background:color-mix(in srgb,var(--color-primary) 15%,var(--color-surface));color:var(--color-primary);padding:.25rem .75rem;border-radius:12px;font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.5px;border:1px solid color-mix(in srgb,var(--color-primary) 30%,transparent)}.sister-season-colors{display:grid;grid-template-columns:repeat(auto-fill,minmax(20px,20px));gap:.25rem;padding:.75rem;background:var(--color-surface);border-radius:6px;border:1px solid var(--color-border)}.sister-color-swatch{width:20px;height:20px;border-radius:3px;border:1px solid rgba(0,0,0,.1);cursor:pointer;transition:all .2s ease}.sister-color-swatch:hover{transform:scale(1.2);z-index:1;box-shadow:0 2px 6px var(--color-shadow)}.season-colors-modal .modal-actions{display:flex;justify-content:center;padding:1.5rem 2rem;border-top:1px solid var(--color-border);background:var(--color-surface)}.season-colors-modal .close-btn{padding:.75rem 2rem;background:var(--color-primary);color:#fff;border:none;border-radius:8px;cursor:pointer;font-size:1rem;font-weight:500;transition:all .2s ease}.season-colors-modal .close-btn:hover{background:var(--color-primary-hover);transform:translateY(-1px)}@media (max-width: 768px){.season-colors-modal{margin:1rem;max-height:95vh}.season-colors-modal .modal-header{padding:1.5rem;flex-direction:column;align-items:stretch;gap:1rem}.season-colors-modal .modal-close{position:absolute;top:1rem;right:1rem}.color-categories-grid{grid-template-columns:1fr;gap:1.5rem;padding:1.5rem}.color-swatches-grid{grid-template-columns:repeat(auto-fit,minmax(70px,1fr));gap:.75rem}.color-swatch-large{width:50px;height:50px}.sister-seasons-section{margin:0 1.5rem 1.5rem;padding:1rem}.season-colors-modal .modal-actions{padding:1rem 1.5rem}.sister-seasons-grid{grid-template-columns:1fr}.sister-season-card{padding:1.25rem}.sister-season-colors{grid-template-columns:repeat(auto-fill,minmax(18px,18px));gap:.2rem;padding:.6rem}.sister-color-swatch{width:18px;height:18px}}@media (max-width: 480px){.characteristic-tag{font-size:.75rem;padding:.2rem .6rem}.color-swatches-grid{grid-template-columns:repeat(3,1fr)}.color-swatch-large{width:45px;height:45px}.color-code{font-size:.65rem}}.season-recommendations{background:var(--color-surface);border:1px solid var(--color-border);border-radius:6px;padding:1rem}.season-recommendations h4{margin:0 0 .5rem;color:var(--color-text-primary);font-size:1.1rem}.borrowing-description{margin-bottom:1.5rem;color:var(--color-text-secondary);font-size:.95rem;line-height:1.4}.sister-season .borrowing-description{margin:.5rem 0;color:var(--color-text-secondary);font-size:.9rem;font-style:italic}.sister-season{margin-bottom:1.5rem;padding:1rem;background:var(--color-surface);border-radius:8px;border-left:4px solid var(--color-primary);box-shadow:0 2px 4px var(--color-shadow)}.sister-season.safe{border-left-color:var(--color-success)}.sister-season.careful{border-left-color:var(--color-warning)}.sister-season-header{display:flex;flex-direction:column;gap:.25rem;margin-bottom:1rem}.sister-season h5{margin:0;color:var(--color-text-primary);font-size:1.1rem;font-weight:600}.season-title{display:flex;align-items:center;gap:1rem;margin-bottom:.5rem}.borrowing-level{padding:.25rem .75rem;border-radius:12px;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.borrowing-level.safe{background:color-mix(in srgb,var(--color-success) 15%,var(--color-surface));color:var(--color-success)}.borrowing-level.careful{background:color-mix(in srgb,var(--color-warning) 15%,var(--color-surface));color:var(--color-warning)}.characteristics{margin:1rem 0}.shared-traits{color:var(--color-text-muted);font-size:.8rem;font-style:italic}.shared-traits strong{color:var(--color-text-primary)}.sister-season-colors{margin-top:.75rem;display:block;background:none;border:none;padding:0;border-radius:0;gap:0}.sister-season-colors h6{margin:1rem 0 .5rem;color:var(--color-text-primary);font-size:.9rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.sister-colors-container{display:flex;flex-wrap:wrap;gap:.25rem;margin:.5rem 0;padding:.5rem;background:var(--color-card-background);border-radius:6px;border:1px solid var(--color-border)}.sister-color-chip{width:16px;height:16px;border-radius:2px;border:1px solid rgba(0,0,0,.1);cursor:pointer;flex-shrink:0}@media (max-width: 768px){.season-recommendations,.sister-season{padding:.75rem;margin-bottom:1rem}.season-title{flex-direction:column;align-items:flex-start;gap:.5rem}.borrowing-level{align-self:flex-start}.sister-colors-container{grid-template-columns:repeat(auto-fill,minmax(14px,14px));gap:.2rem;padding:.4rem}.sister-color-chip{width:14px;height:14px}}@media (max-width: 480px){.sister-season{padding:.75rem}.sister-season h5{font-size:1rem}.borrowing-level{font-size:.7rem;padding:.2rem .6rem}}.knowledge-base{background:var(--color-card-background);border:1px solid var(--color-border);border-radius:8px;padding:2rem;height:fit-content;transition:all .3s ease}.knowledge-header{margin-bottom:1.5rem;text-align:center}.knowledge-title-section{display:flex;align-items:center;justify-content:center;gap:1rem;margin-bottom:.5rem}.header-buttons{display:flex;align-items:center;gap:.75rem}.spectrum-visualizer-btn{padding:6px 12px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;gap:6px}.spectrum-visualizer-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.spectrum-visualizer-btn:active{transform:translateY(0)}.knowledge-header h3{margin:0;color:var(--color-text-primary);font-size:1.5rem}.knowledge-header p{margin:0 0 .75rem;color:var(--color-text-secondary);font-size:.9rem}.user-season-indicator{color:var(--color-primary)!important;font-weight:700!important;margin-top:.5rem!important}.season-type-header{color:var(--color-primary)!important;margin-bottom:1rem!important;text-align:center!important}.season-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem;margin-bottom:2rem}.season-card{background:var(--color-surface);border:2px solid var(--color-border);border-radius:8px;padding:1.5rem;cursor:pointer;transition:all .2s;display:flex;flex-direction:column}.season-card:hover{border-color:var(--color-primary);transform:translateY(-2px);box-shadow:0 4px 8px var(--color-shadow)}.season-card.selected{border-color:var(--color-primary);background:var(--color-card-background)}.season-info{margin-bottom:1rem;flex:1;display:flex;flex-direction:column}.season-info h4{margin:0 0 .5rem;color:var(--color-text-primary);font-size:1.2rem}.season-type{color:var(--color-primary);font-size:.9rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;margin-bottom:.5rem}.season-characteristics{color:var(--color-text-muted);font-size:.85rem;margin-bottom:.5rem;flex:1;min-height:2.4rem;display:flex;align-items:flex-start}.color-preview{display:grid;grid-template-columns:repeat(auto-fill,minmax(14px,14px));gap:.2rem;margin-top:.5rem;padding:.5rem;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:6px;min-height:60px;max-height:100px;overflow-y:auto;width:100%;box-sizing:border-box}.color-chip{width:14px;height:14px;border-radius:2px;border:1px solid rgba(0,0,0,.1);flex-shrink:0;cursor:pointer;transition:all .2s ease;display:block}.color-chip:hover{transform:scale(1.2);z-index:1;box-shadow:0 2px 4px var(--color-shadow)}.season-details{background:var(--color-surface);border:1px solid var(--color-primary);border-radius:8px;padding:2rem;margin-top:2rem}.details-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.details-header h4{margin:0;color:var(--color-primary);font-size:1.5rem}.close-details-btn{background:var(--color-button-secondary);border:none;color:var(--color-text-primary);padding:.5rem 1rem;border-radius:4px;cursor:pointer;font-size:.9rem}.close-details-btn:hover{background:var(--color-button-secondary-hover)}.season-description{color:var(--color-text-secondary);margin-bottom:2rem;font-size:1rem;line-height:1.5}.color-categories{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem}.color-category{margin-bottom:1.5rem}.color-category h5{margin:0 0 1rem;color:var(--color-text-primary);font-size:1.1rem;text-transform:uppercase;letter-spacing:.5px}.color-palette{display:grid;grid-template-columns:repeat(auto-fit,minmax(80px,1fr));gap:.75rem}.color-item{display:flex;flex-direction:column;align-items:center;gap:.5rem}.color-square{width:60px;height:60px;border-radius:8px;border:2px solid var(--color-border);box-shadow:0 2px 4px var(--color-shadow);cursor:pointer;transition:all .2s}.color-square:hover{transform:scale(1.1);border-color:var(--color-primary)}.color-name{font-family:monospace;font-size:.75rem;color:var(--color-text-secondary);text-align:center;word-break:break-all}.back-btn{background:linear-gradient(135deg,var(--color-button-primary),var(--color-button-primary-hover));color:var(--color-text-primary);border:none;padding:.75rem 1.5rem;border-radius:6px;cursor:pointer;font-size:1rem;margin-bottom:2rem;transition:all .2s}.back-btn:hover{background:linear-gradient(135deg,var(--color-button-primary-hover),var(--color-button-primary));transform:translateY(-1px)}.detailed-season-header{display:flex;align-items:center;gap:.75rem;margin-bottom:1.5rem;padding-bottom:.75rem;border-bottom:1px solid var(--color-border)}.back-arrow-btn{background:none;border:none;color:var(--color-primary);font-size:1.5rem;font-weight:700;cursor:pointer;padding:.5rem;border-radius:4px;transition:all .2s ease;display:flex;align-items:center;justify-content:center;width:40px;height:40px}.back-arrow-btn:hover{background:color-mix(in srgb,var(--color-primary) 10%,transparent);transform:scale(1.1)}.detailed-season-header h3{margin:0;color:var(--color-text-primary);font-size:1.6rem;flex:1}.detailed-season-content{display:flex;flex-direction:column;gap:1.5rem}.detail-section{background:var(--color-surface);border:1px solid var(--color-border);border-radius:8px;padding:1.25rem}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;row-gap:1rem}.detail-item{display:flex;flex-direction:column;gap:.3rem}.detail-item.detail-description{grid-column:1 / -1;margin-top:.5rem}.detail-label{font-weight:700;color:var(--color-primary);font-size:.85rem;text-transform:uppercase;letter-spacing:.5px}.detail-value{color:var(--color-text-primary);font-size:.95rem;line-height:1.3}.expandable-section{background:var(--color-surface);border:1px solid var(--color-border);border-radius:8px;overflow:hidden}.section-header{width:100%;background:none;border:none;padding:1.25rem 1.5rem;cursor:pointer;transition:all .2s ease;display:flex;justify-content:space-between;align-items:center;text-align:left}.section-header:hover{background:color-mix(in srgb,var(--color-primary) 5%,transparent)}.section-header h4{margin:0;color:var(--color-text-primary);font-size:1.2rem}.expand-icon{color:var(--color-primary);font-size:1rem;transition:transform .2s ease}.section-content{padding:1rem 1.5rem 1.5rem;border-top:1px solid var(--color-border)}.horizontal-color-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(20px,20px));gap:.4rem;margin-bottom:1.5rem;padding:1rem;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:6px;max-height:120px;overflow-y:auto}.horizontal-color-chip{width:20px;height:20px;border-radius:3px;border:1px solid rgba(0,0,0,.1);cursor:pointer;transition:all .2s ease;display:block}.horizontal-color-chip:hover{transform:scale(1.3);z-index:1;box-shadow:0 2px 6px var(--color-shadow)}.color-categories-detailed{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem}.color-category-detailed{margin-bottom:1rem}.color-category-detailed h5{margin:0 0 .75rem;color:var(--color-primary);font-size:1rem;text-transform:uppercase;letter-spacing:.5px}.color-category-chips{display:grid;grid-template-columns:repeat(auto-fill,minmax(16px,16px));gap:.3rem;padding:.75rem;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:6px}.category-color-chip{width:16px;height:16px;border-radius:2px;border:1px solid rgba(0,0,0,.1);cursor:pointer;transition:all .2s ease}.category-color-chip:hover{transform:scale(1.4);z-index:1;box-shadow:0 2px 4px var(--color-shadow)}.sister-seasons-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem}.sister-season-card{background:var(--color-card-background);border:1px solid var(--color-border);border-radius:8px;padding:1.25rem}.sister-season-card h5{margin:0 0 .5rem;color:var(--color-text-primary);font-size:1.1rem}.sister-season-characteristics{color:var(--color-text-secondary);font-size:.9rem;margin:0 0 1rem;line-height:1.4}.sister-season-preview{display:grid;grid-template-columns:repeat(8,1fr);gap:.25rem}.sister-season-color-chip{width:18px;height:18px;border-radius:2px;border:1px solid rgba(0,0,0,.1)}.coming-soon-content{text-align:center;padding:1.5rem 0}.coming-soon-content p{color:var(--color-text-secondary);margin:0 0 1.5rem;font-style:italic}.avoid-colors-preview{display:grid;grid-template-columns:repeat(auto-fill,minmax(18px,18px));gap:.3rem;justify-content:center;max-width:200px;margin:0 auto}.avoid-color-chip{width:18px;height:18px;border-radius:2px;border:2px solid var(--color-warning);opacity:.7}@media (max-width: 768px){.season-grid{grid-template-columns:1fr}.season-card{padding:1rem;min-height:auto;height:auto;overflow:visible;display:flex;flex-direction:column}.season-info{margin-bottom:.75rem}.color-categories{grid-template-columns:1fr}.color-palette{grid-template-columns:repeat(auto-fit,minmax(60px,1fr))}.color-square{width:50px;height:50px}.detailed-season-header{flex-direction:row;align-items:center;gap:.5rem;margin-bottom:1.25rem}.detailed-season-header h3{font-size:1.4rem}.detail-grid{grid-template-columns:1fr;gap:.75rem;row-gap:1rem}.detail-section{padding:1rem}.horizontal-color-grid{grid-template-columns:repeat(auto-fill,minmax(18px,18px));gap:.3rem;padding:.75rem}.horizontal-color-chip{width:18px;height:18px}.color-categories-detailed{grid-template-columns:1fr}.color-category-chips{grid-template-columns:repeat(auto-fill,minmax(16px,16px));max-height:none;overflow-y:visible}.sister-seasons-grid{grid-template-columns:1fr}.section-header{padding:1rem 1.25rem}.section-content{padding:.75rem 1.25rem 1.25rem}}.help-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--color-overlay);display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.help-modal{background:var(--color-card-background);border-radius:12px;border:1px solid var(--color-border);box-shadow:0 20px 40px var(--color-shadow);max-width:600px;width:100%;max-height:80vh;display:flex;flex-direction:column;animation:helpModalSlideIn .3s ease-out}@keyframes helpModalSlideIn{0%{opacity:0;transform:translateY(-20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.help-modal-header{display:flex;align-items:center;justify-content:space-between;padding:1.5rem 1.5rem 1rem;border-bottom:1px solid var(--color-border);flex-shrink:0}.help-modal-title-section{display:flex;align-items:center;gap:.75rem}.help-modal-icon{width:28px;height:28px;color:var(--color-primary);flex-shrink:0}.help-modal h2{color:var(--color-text-primary);font-size:1.4rem;font-weight:600;margin:0;line-height:1.3}.help-modal-close{background:transparent;border:none;color:var(--color-text-secondary);cursor:pointer;padding:.5rem;border-radius:6px;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.help-modal-close:hover{background:var(--color-surface);color:var(--color-text-primary);transform:scale(1.05)}.help-modal-close svg{width:24px;height:24px}.help-modal-content{flex:1;overflow-y:auto;padding:1rem 1.5rem}.help-section{margin-bottom:1.5rem}.help-section:last-child{margin-bottom:0}.help-section h3{color:var(--color-primary);font-size:1.1rem;font-weight:600;margin:0 0 .75rem;display:flex;align-items:center;gap:.5rem}.help-section h3:before{content:"";width:4px;height:16px;background:var(--color-primary);border-radius:2px}.help-section ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.5rem}.help-section li{color:var(--color-text-primary);font-size:.95rem;line-height:1.5;padding-left:1.5rem;position:relative}.help-section li:before{content:"•";color:var(--color-primary);font-size:1.2rem;position:absolute;left:0;top:0}.help-section li strong,.help-section li b{color:var(--color-primary);font-weight:600}.help-modal-footer{padding:1rem 1.5rem 1.5rem;border-top:1px solid var(--color-border);display:flex;justify-content:center;flex-shrink:0}.help-modal-button{background:var(--color-primary);color:#fff;border:none;padding:.75rem 2rem;border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s ease;min-width:120px}.help-modal-button:hover{background:var(--color-primary-hover);transform:translateY(-1px);box-shadow:0 4px 12px color-mix(in srgb,var(--color-primary) 30%,transparent)}.help-modal-button:active{transform:translateY(0)}@media (max-width: 768px){.help-modal-overlay{padding:.5rem}.help-modal{max-height:90vh;border-radius:8px}.help-modal-header{padding:1rem 1rem .75rem}.help-modal h2{font-size:1.25rem}.help-modal-icon{width:24px;height:24px}.help-modal-content{padding:.75rem 1rem}.help-section{margin-bottom:1.25rem}.help-section h3{font-size:1.05rem}.help-section li{font-size:.9rem}.help-modal-footer{padding:.75rem 1rem 1rem}}@media (max-width: 480px){.help-modal-header{flex-direction:column;align-items:flex-start;gap:.5rem}.help-modal-title-section{width:100%}.help-modal-close{position:absolute;top:1rem;right:1rem}}.help-button{display:flex;align-items:center;gap:.5rem;border:none;border-radius:6px;cursor:pointer;transition:all .2s ease;font-weight:500;text-decoration:none;-webkit-tap-highlight-color:transparent}.help-button:focus{outline:none;box-shadow:0 0 0 2px color-mix(in srgb,var(--color-primary) 30%,transparent)}.help-button.small{padding:.4rem .6rem;font-size:.8rem;gap:.3rem}.help-button.small svg{width:16px;height:16px}.help-button.medium{padding:.5rem .75rem;font-size:.9rem;gap:.5rem}.help-button.medium svg{width:18px;height:18px}.help-button.large{padding:.75rem 1rem;font-size:1rem;gap:.5rem}.help-button.large svg{width:20px;height:20px}.help-button.inline{background:var(--color-button-secondary);color:var(--color-text-primary);border:1px solid var(--color-border)}.help-button.inline:hover{background:var(--color-button-secondary-hover);border-color:var(--color-primary);transform:translateY(-1px)}.help-button.floating{background:var(--color-primary);color:#fff;box-shadow:0 4px 12px color-mix(in srgb,var(--color-primary) 30%,transparent);position:fixed;bottom:2rem;right:2rem;z-index:100;border-radius:50%;padding:1rem;width:56px;height:56px;justify-content:center}.help-button.floating span{display:none}.help-button.floating svg{width:24px;height:24px}.help-button.floating:hover{background:var(--color-primary-hover);transform:translateY(-2px) scale(1.05);box-shadow:0 6px 16px color-mix(in srgb,var(--color-primary) 40%,transparent)}.help-button.subtle{background:transparent;color:var(--color-text-secondary);border:1px solid transparent;padding:.4rem}.help-button.subtle span{display:none}.help-button.subtle:hover{background:var(--color-surface);color:var(--color-primary);border-color:var(--color-border)}@media (max-width: 768px){.help-button.floating{bottom:1.5rem;right:1.5rem;width:48px;height:48px;padding:.8rem}.help-button.floating svg{width:20px;height:20px}.help-button.inline{padding:.5rem .65rem;font-size:.85rem}.help-button.medium svg{width:16px;height:16px}}@media (max-width: 480px){.help-button.floating{bottom:1rem;right:1rem;width:44px;height:44px;padding:.7rem}.help-button.floating svg{width:18px;height:18px}}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:2000}.modal-content{background-color:var(--color-card-background);border-radius:12px;border:1px solid var(--color-border);box-shadow:0 8px 32px #0003;max-height:90vh;overflow:hidden;position:relative}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid var(--color-border);background-color:var(--color-surface)}.modal-header h2{margin:0;color:var(--color-text-primary);font-size:1.5rem;font-weight:600}.close-btn{background:transparent;border:none;color:var(--color-text-secondary);cursor:pointer;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:6px;transition:all .2s}.close-btn:hover{background-color:var(--color-surface);color:var(--color-text-primary)}.close-btn .icon{width:20px;height:20px}.spectrum-modal{width:90%;max-width:1200px;height:80vh;display:flex;flex-direction:column;padding:24px;background-color:var(--color-card-background)!important}.spectrum-controls{display:flex;align-items:center;gap:16px;padding:16px;background-color:var(--color-surface);border-radius:8px;margin-bottom:16px}.spectrum-controls label{font-weight:600;color:var(--color-text-primary)}.season-select{padding:8px 12px;border:1px solid var(--color-border);border-radius:6px;background-color:var(--color-card-background);color:var(--color-text-primary);font-size:14px;cursor:pointer;transition:border-color .2s}.season-select:hover{border-color:var(--color-primary)}.season-select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #6c5ce71a}.spectrum-container{flex:1;position:relative;border-radius:12px;overflow:hidden;border:2px solid var(--color-border);box-shadow:0 4px 12px #0000001a;margin:24px 0;padding:8px;background-color:var(--color-surface)}.spectrum-canvas{width:100%;height:100%;display:block;cursor:crosshair;border-radius:8px;border:1px solid var(--color-border)}.color-point{position:absolute;width:16px;height:16px;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;transition:transform .2s,box-shadow .2s;z-index:10}.color-point.hovered{transform:translate(-50%,-50%) scale(1.3);z-index:20}.color-tooltip{position:fixed;display:flex;align-items:center;gap:8px;background-color:var(--color-card-background);border:1px solid var(--color-border);border-radius:6px;padding:8px 12px;box-shadow:0 4px 12px #00000026;z-index:1000;pointer-events:none}.tooltip-color{width:24px;height:24px;border-radius:4px;border:2px solid var(--color-border)}.tooltip-info{display:flex;flex-direction:column;gap:2px}.tooltip-name{font-size:12px;font-weight:600;color:var(--color-text-primary);white-space:nowrap}.tooltip-hex{font-size:11px;font-family:Courier New,monospace;color:var(--color-text-secondary)}.spectrum-info{display:flex;justify-content:space-between;padding:12px 16px;background-color:var(--color-surface);border-radius:8px;font-size:13px;color:var(--color-text-secondary)}.spectrum-info p{margin:0}.season-info{font-weight:600;color:var(--color-primary)}@media (prefers-color-scheme: dark){.color-point{box-shadow:0 2px 6px #00000080}.color-point.hovered{box-shadow:0 0 12px #ffffff4d}}.color-workspace{padding:1.5rem;width:100%;height:auto;background:var(--color-card-background);border-radius:12px;border:1px solid var(--color-border);display:flex;flex-direction:column}.workspace-header{text-align:center;margin-bottom:1.5rem}.workspace-header h2{margin:0 0 .5rem;color:var(--color-text-primary);font-size:2rem;font-weight:700}.workspace-header p{margin:0;color:var(--color-text-secondary);font-size:1.1rem}.workspace-content{display:grid;grid-template-columns:.8fr 1fr;gap:1.5rem;height:60vh;min-height:500px;overflow:hidden}.color-inventory{background:var(--color-surface);border:1px solid var(--color-border);border-radius:8px;padding:1.25rem;height:100%;display:flex;flex-direction:column;overflow:hidden}.color-inventory h3{margin:0 0 1rem;color:var(--color-text-primary);font-size:1.25rem;font-weight:600}.source-selector{margin-bottom:1rem;flex-shrink:0}.custom-dropdown{position:relative;width:100%}.dropdown-trigger{width:100%;padding:.75rem 1rem;border:1px solid var(--color-border);border-radius:6px;background:var(--color-card-background);color:var(--color-text-primary);font-size:.95rem;cursor:pointer;display:flex;align-items:center;justify-content:space-between;text-align:left;transition:all .2s ease}.dropdown-trigger:hover{border-color:var(--color-primary)}.dropdown-trigger:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 2px color-mix(in srgb,var(--color-primary) 20%,transparent)}.dropdown-text{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dropdown-icon{width:20px;height:20px;color:var(--color-text-muted);transition:transform .2s ease;flex-shrink:0;margin-left:.5rem}.dropdown-icon.open{transform:rotate(180deg)}.dropdown-menu{position:absolute;top:100%;left:0;right:0;z-index:50;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:6px;box-shadow:0 4px 16px var(--color-shadow);margin-top:.25rem;max-height:320px;overflow:hidden}.search-container{position:relative;padding:.75rem;border-bottom:1px solid var(--color-border)}.search-icon{position:absolute;left:1.25rem;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--color-text-muted)}.search-input{width:100%;padding:.5rem .5rem .5rem 2.25rem;border:1px solid var(--color-border);border-radius:4px;background:var(--color-surface);color:var(--color-text-primary);font-size:.9rem}.search-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 2px color-mix(in srgb,var(--color-primary) 15%,transparent)}.dropdown-options{max-height:240px;overflow-y:auto}.dropdown-option{width:100%;padding:.75rem 1rem;border:none;background:transparent;color:var(--color-text-primary);font-size:.9rem;text-align:left;cursor:pointer;transition:background-color .15s ease;display:flex;align-items:center;justify-content:space-between}.dropdown-option:hover{background:var(--color-surface)}.dropdown-option-checkbox{width:100%;padding:.75rem 1rem;background:transparent;color:var(--color-text-primary);font-size:.9rem;cursor:pointer;transition:background-color .15s ease;display:flex;align-items:center;gap:.75rem}.dropdown-option-checkbox:hover{background:var(--color-surface)}.dropdown-option-checkbox.selected{background:color-mix(in srgb,var(--color-primary) 10%,transparent)}.option-checkbox{width:16px;height:16px;accent-color:var(--color-primary);cursor:pointer}.dropdown-option-checkbox .option-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dropdown-option-checkbox .option-count{color:var(--color-text-muted);font-size:.8rem;flex-shrink:0}.option-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.option-count{color:var(--color-text-muted);font-size:.8rem;flex-shrink:0;margin-left:.5rem}.dropdown-divider{height:1px;background:var(--color-border);margin:.5rem 0}.no-results{padding:2rem 1rem;text-align:center;color:var(--color-text-secondary)}.no-results-icon{font-size:2rem;margin-bottom:.75rem}.no-results h4{margin:0 0 .5rem;color:var(--color-text-primary);font-size:1rem;font-weight:600}.no-results p{margin:0;color:var(--color-text-secondary);font-size:.9rem;line-height:1.4}.source-dropdown{width:100%;padding:.75rem 1rem;border:1px solid var(--color-border);border-radius:6px;background:var(--color-card-background);color:var(--color-text-primary);font-size:.95rem;cursor:pointer}.source-dropdown:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 2px color-mix(in srgb,var(--color-primary) 20%,transparent)}.sources-container{flex:1;overflow-y:auto;padding-right:.5rem;display:flex;flex-direction:column;gap:1.5rem;min-height:0}.source-colors{animation:fadeIn .3s ease-in-out}.source-info{margin-bottom:1rem;padding-bottom:1rem;border-bottom:1px solid var(--color-border)}.source-info h4{margin:0 0 .5rem;color:var(--color-text-primary);font-size:1.1rem;font-weight:600}.source-season{color:var(--color-text-muted);font-size:.9rem;font-style:italic}.color-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.color-item{display:flex;flex-direction:column;align-items:center;padding:.5rem;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:6px;cursor:pointer;transition:all .2s ease}.color-item:hover{transform:translateY(-2px);box-shadow:0 4px 12px var(--color-shadow);border-color:var(--color-primary)}.color-swatch{width:50px;height:50px;border-radius:8px;border:2px solid var(--color-border);margin-bottom:.5rem;box-shadow:0 2px 4px #0000001a}.color-name{font-size:.8rem;font-weight:500;color:var(--color-text-primary);text-align:center;margin-bottom:.25rem}.color-hex{font-size:.75rem;color:var(--color-text-muted);font-family:monospace}.working-colors{background:var(--color-surface);border:1px solid var(--color-border);border-radius:8px;padding:1.25rem;height:100%;display:flex;flex-direction:column;overflow:hidden}.working-colors-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;flex-shrink:0}.working-colors h3{margin:0;color:var(--color-text-primary);font-size:1.25rem;font-weight:600}.total-weight{background:var(--color-surface);padding:.5rem .75rem;border-radius:20px;border:1px solid var(--color-border);font-size:.85rem;font-weight:500;color:var(--color-text-primary)}.clear-all-icon-btn{background:transparent;border:1px solid var(--color-border);border-radius:6px;padding:.5rem;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.clear-all-icon-btn:hover{background:var(--color-error);border-color:var(--color-error);color:#fff;transform:scale(1.05)}.clear-icon{width:18px;height:18px;color:currentColor}.total-weight-inline{margin-left:1rem;font-size:.9rem;font-weight:400;color:var(--color-text-secondary)}.empty-workspace{text-align:center;padding:3rem 1rem;color:var(--color-text-muted);font-style:italic}.working-color-list{display:flex;flex-direction:column;gap:.75rem;flex:1;overflow-y:auto;padding-right:.5rem;min-height:0}.working-color-item{position:relative;display:flex;align-items:center;gap:.75rem;padding:1rem;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:6px;transition:all .2s ease}.working-color-item:hover{box-shadow:0 2px 8px var(--color-shadow)}.working-color-swatch{width:40px;height:40px;border-radius:6px;border:2px solid var(--color-border);flex-shrink:0}.working-color-info{flex:1;min-width:0}.working-color-name{margin:0 0 .25rem;color:var(--color-text-primary);font-size:.95rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.working-color-hex{margin:0 0 .25rem;color:var(--color-text-secondary);font-family:monospace;font-size:.8rem}.working-color-source{margin:0;color:var(--color-text-muted);font-size:.75rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-style:italic}.working-color-weight{margin-right:.5rem;min-width:140px}.lock-btn{background:transparent;border:1px solid var(--color-border);border-radius:4px;width:20px;height:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.lock-btn.locked{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.lock-btn.unlocked{background:var(--color-surface);color:var(--color-text-muted)}.lock-btn:hover{transform:scale(1.1);border-color:var(--color-primary)}.lock-btn.locked:hover{background:var(--color-primary-hover)}.lock-btn.unlocked:hover{background:var(--color-border);color:var(--color-text-primary)}.lock-bottom-right{position:absolute;bottom:.5rem;right:.5rem;z-index:2}.lock-icon{width:10px;height:10px}.weight-controls{display:flex;flex-direction:column;gap:.25rem}.weight-label{font-size:.75rem;color:var(--color-text-secondary);font-weight:500}.weight-slider{width:100%;height:4px;background:var(--color-border);border-radius:2px;outline:none;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.weight-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;background:var(--color-primary);border-radius:50%;cursor:pointer;border:2px solid var(--color-card-background);box-shadow:0 1px 3px #0003}.weight-slider::-moz-range-thumb{width:16px;height:16px;background:var(--color-primary);border-radius:50%;cursor:pointer;border:2px solid var(--color-card-background);box-shadow:0 1px 3px #0003}.weight-slider:hover::-webkit-slider-thumb{transform:scale(1.1);transition:transform .15s ease}.weight-slider:hover::-moz-range-thumb{transform:scale(1.1);transition:transform .15s ease}.working-color-priority{margin-right:.5rem}.priority-dropdown{padding:.5rem;border:1px solid var(--color-border);border-radius:4px;background:var(--color-surface);color:var(--color-text-primary);font-size:.8rem;cursor:pointer}.priority-dropdown:focus{outline:none;border-color:var(--color-primary)}.remove-color-btn{background:var(--color-error);color:#fff;border:none;border-radius:50%;width:20px;height:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;transition:all .2s ease;flex-shrink:0}.remove-color-btn:hover{background:color-mix(in srgb,var(--color-error) 90%,black);transform:scale(1.1)}.remove-top-right{position:absolute;top:.5rem;right:.5rem;z-index:2}.workspace-actions{display:flex;gap:1rem;margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--color-border);flex-shrink:0}.clear-workspace-btn,.generate-pattern-btn{flex:1;padding:.75rem 1rem;border:none;border-radius:6px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .2s ease}.clear-workspace-btn{background:var(--color-button-secondary);color:var(--color-text-primary);border:1px solid var(--color-border)}.clear-workspace-btn:hover{background:var(--color-button-secondary-hover)}.generate-pattern-btn{background:var(--color-primary);color:#fff}.generate-pattern-btn:hover:not(:disabled){background:var(--color-primary-hover);transform:translateY(-1px)}.generate-pattern-btn:disabled{background:var(--color-border);color:var(--color-text-muted);cursor:not-allowed}.pattern-canvas-section{margin-top:1.5rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:8px;padding:1.25rem;animation:fadeIn .3s ease-in-out}.canvas-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.canvas-header h3{margin:0;color:var(--color-text-primary);font-size:1.25rem;font-weight:600}.canvas-controls{display:flex;gap:.75rem}.pattern-dropdown{position:relative}.pattern-dropdown-trigger{background:var(--color-button-secondary);color:var(--color-text-primary);border:1px solid var(--color-border);border-radius:6px;padding:.5rem 1rem;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:.5rem}.pattern-dropdown-trigger:hover{background:var(--color-button-secondary-hover);border-color:var(--color-primary)}.pattern-dropdown-trigger .dropdown-icon{width:16px;height:16px;transition:transform .2s ease}.pattern-dropdown-trigger .dropdown-icon.open{transform:rotate(180deg)}.pattern-dropdown-menu{position:absolute;top:100%;right:0;z-index:50;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:6px;box-shadow:0 4px 16px var(--color-shadow);margin-top:.25rem;min-width:250px;max-height:350px;overflow-y:auto;overflow-x:hidden}.pattern-option{width:100%;padding:.75rem 1rem;border:none;background:transparent;color:var(--color-text-primary);text-align:left;cursor:pointer;transition:background-color .15s ease;display:flex;flex-direction:column;gap:.25rem}.pattern-option:hover{background:var(--color-surface)}.pattern-name{font-size:.95rem;font-weight:500}.pattern-description{font-size:.8rem;color:var(--color-text-muted)}.refresh-pattern-btn{background:var(--color-button-secondary);color:var(--color-text-primary);border:1px solid var(--color-border);border-radius:6px;padding:.5rem 1rem;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .2s ease}.refresh-pattern-btn:hover{background:var(--color-button-secondary-hover);transform:translateY(-1px)}.pattern-canvas{width:100%;height:300px;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:6px;display:flex;align-items:center;justify-content:center;overflow:hidden}.canvas-placeholder{text-align:center;color:var(--color-text-muted);font-style:italic}.canvas-placeholder p{margin:.25rem 0;font-size:.9rem}.pattern-canvas-element{width:100%;height:100%;display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){.color-workspace{padding:1rem;height:auto}.workspace-header{margin-bottom:1rem}.workspace-header h2{font-size:1.5rem}.workspace-header p{font-size:1rem}.workspace-content{grid-template-columns:1fr;gap:1.5rem;height:auto;min-height:auto}.color-inventory{height:auto;min-height:400px;max-height:60vh}.working-colors{height:auto;min-height:auto;max-height:none;position:static}.working-color-list{overflow-y:visible;max-height:none}.color-grid{grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:.75rem}.color-item{padding:.25rem}.color-swatch{width:40px;height:40px}.color-name{font-size:.7rem}.color-hex{font-size:.65rem}.working-color-item{flex-direction:column;align-items:flex-start;gap:.5rem;padding:.75rem}.working-color-weight{width:100%;margin-right:0;min-width:auto}.workspace-actions{flex-direction:column;gap:.75rem}.canvas-header{flex-direction:column;gap:1rem;align-items:flex-start}.canvas-controls{width:100%;flex-direction:column;gap:.75rem}.pattern-dropdown{width:100%}.pattern-dropdown-trigger{width:100%;justify-content:space-between}.pattern-dropdown-menu{left:0;right:0;min-width:auto}.refresh-pattern-btn{width:100%;justify-content:center}.pattern-canvas{height:250px}.dropdown-menu{position:fixed;top:auto;left:1rem;right:1rem;width:auto;max-height:60vh;z-index:1000}.pattern-dropdown-menu{position:absolute;top:100%;left:0;right:0;width:100%;max-height:300px;overflow-y:auto;z-index:1001;margin-top:.25rem;box-shadow:0 4px 20px #00000026}.pattern-option{padding:1rem}.dropdown-trigger:focus,.pattern-dropdown-trigger:focus{position:relative;z-index:1001}}@media (max-width: 480px){.color-workspace{padding:.75rem}.workspace-header h2{font-size:1.3rem}.workspace-header p{font-size:.9rem}.color-inventory{padding:1rem;min-height:350px;max-height:50vh}.working-colors{padding:1rem;height:auto;min-height:auto;max-height:none}.color-grid{grid-template-columns:repeat(auto-fill,minmax(70px,1fr));gap:.5rem}.color-swatch,.working-color-swatch{width:35px;height:35px}.pattern-canvas{height:200px}}.ai-loading-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:10000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.ai-loading-modal{background:var(--color-surface);border:1px solid var(--color-border);border-radius:16px;padding:40px;max-width:400px;width:90%;text-align:center;box-shadow:0 20px 40px var(--color-shadow);animation:slideUp .3s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.loading-content h2{margin:20px 0 10px;color:var(--color-text-primary);font-size:1.5rem;font-weight:600}.loading-content p{color:var(--color-text-secondary);margin:0 0 30px;line-height:1.5}.loading-icon{margin-bottom:20px}.sparkles-icon{width:48px;height:48px;color:var(--color-primary)}.rotating{animation:spin 2s linear infinite}.loading-steps{display:flex;flex-direction:column;gap:12px;margin:20px 0 30px;text-align:left}.step{display:flex;align-items:center;gap:12px;color:var(--color-text-secondary);font-size:14px;transition:color .3s ease}.step.active{color:var(--color-primary)}.step-dot{width:8px;height:8px;border-radius:50%;background:var(--color-border);transition:all .3s ease}.step.active .step-dot{background:var(--color-primary);animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.2);opacity:.7}}.loading-bar{width:100%;height:4px;background:var(--color-secondary);border-radius:2px;overflow:hidden;margin:20px 0}.loading-progress{height:100%;background:linear-gradient(90deg,var(--color-primary),var(--color-primary-dark));border-radius:2px;width:0%;animation:loadingProgress 3s ease-in-out infinite}@keyframes loadingProgress{0%{width:0%}50%{width:70%}to{width:100%}}.loading-note{font-size:12px;color:var(--color-text-secondary);margin:10px 0 0;font-style:italic}@media (max-width: 480px){.ai-loading-modal{padding:30px 20px;margin:20px}.loading-content h2{font-size:1.3rem}.sparkles-icon{width:40px;height:40px}}.ai-confidence-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:99999;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.ai-confidence-modal{background:var(--color-card-background);border-radius:12px;border:1px solid var(--color-border);box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;width:90vw;max-width:600px;max-height:80vh;overflow:hidden;display:flex;flex-direction:column;z-index:99999;position:relative}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-2);border-bottom:1px solid var(--color-border);background:var(--color-surface)}.header-content{flex:1}.modal-header h2{margin:0 0 .5rem;color:var(--color-text-primary);font-size:1.5rem;font-weight:700}.overall-confidence{display:flex;align-items:center;gap:.5rem;font-size:.9rem;font-weight:600;padding:.5rem .75rem;border-radius:6px;width:fit-content}.overall-confidence.high-confidence{background:color-mix(in srgb,#10b981 10%,transparent);color:#059669}.overall-confidence.medium-confidence{background:color-mix(in srgb,#f59e0b 10%,transparent);color:#d97706}.overall-confidence.low-confidence{background:color-mix(in srgb,#ef4444 10%,transparent);color:#dc2626}.confidence-icon{width:16px;height:16px}.close-button{background:transparent;border:none;padding:.5rem;border-radius:6px;cursor:pointer;color:var(--color-text-secondary);transition:all .2s ease}.close-button:hover{background:var(--color-border);color:var(--color-text-primary)}.modal-content{flex:1;overflow-y:auto;padding:var(--space-2);padding-bottom:6rem;margin-left:2rem}.points-analysis h3,.warnings-section h3,.instructions h3{margin:0 0 1rem;color:var(--color-text-primary);font-size:1.1rem;font-weight:600}.points-grid{display:flex;flex-direction:column;gap:.75rem;margin-bottom:2rem}.point-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:8px;padding:1rem;transition:all .2s ease;display:flex;align-items:center;gap:1rem}.point-card.high-confidence{border-left:4px solid #10b981}.point-card.medium-confidence{border-left:4px solid #f59e0b}.point-card.low-confidence{border-left:4px solid #ef4444}.color-swatch-large{width:48px;height:48px;border-radius:8px;border:2px solid var(--color-border);box-shadow:0 2px 4px #0000001a;flex-shrink:0}.point-details{display:flex;flex-direction:column;gap:.25rem;flex:1}.point-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.25rem}.point-label{font-weight:600;color:var(--color-text-primary);font-size:.95rem}.point-confidence{display:flex;align-items:center;gap:.25rem;font-size:.85rem;font-weight:500}.point-confidence .confidence-icon{width:14px;height:14px}.point-card.high-confidence .point-confidence{color:#059669}.point-card.medium-confidence .point-confidence{color:#d97706}.point-card.low-confidence .point-confidence{color:#dc2626}.color-info{display:flex;flex-direction:column;gap:.2rem}.hex-value{font-family:monospace;font-weight:600;font-size:.85rem;color:var(--color-text-primary);background:var(--color-card-background);padding:.15rem .4rem;border-radius:4px;border:1px solid var(--color-border);display:inline-block;width:fit-content}.point-note{font-size:.8rem;color:var(--color-text-muted);font-style:italic;line-height:1.3}.warnings-section{margin-bottom:2rem;padding:1rem;background:color-mix(in srgb,#f59e0b 5%,transparent);border:1px solid color-mix(in srgb,#f59e0b 20%,transparent);border-radius:8px}.warnings-list{margin:0;padding:0;list-style:none}.warning-item{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem;color:#d97706;font-size:.9rem}.warning-item:last-child{margin-bottom:0}.warning-icon{width:16px;height:16px;flex-shrink:0}.analysis-feedback{margin-bottom:2rem;padding:1rem;border-radius:8px;border:1px solid}.analysis-feedback.success{background:color-mix(in srgb,#10b981 5%,transparent);border-color:color-mix(in srgb,#10b981 20%,transparent)}.analysis-feedback.good{background:color-mix(in srgb,#3b82f6 5%,transparent);border-color:color-mix(in srgb,#3b82f6 20%,transparent)}.analysis-feedback.warning{background:color-mix(in srgb,#f59e0b 5%,transparent);border-color:color-mix(in srgb,#f59e0b 20%,transparent)}.analysis-feedback.poor{background:color-mix(in srgb,#ef4444 5%,transparent);border-color:color-mix(in srgb,#ef4444 20%,transparent)}.analysis-feedback h3{margin:0 0 .75rem;color:var(--color-text-primary);font-size:1rem}.feedback-content{display:flex;flex-direction:column;gap:.5rem}.feedback-message{margin:0;font-size:.9rem;line-height:1.4;color:var(--color-text-primary)}.feedback-improvement{margin:0;font-size:.85rem;line-height:1.4;color:var(--color-text-muted)}.feedback-improvement strong{color:var(--color-text-primary)}.instructions{margin-bottom:1rem}.instruction-grid{display:grid;gap:1rem}.instruction-item{display:flex;align-items:flex-start;gap:.75rem;padding:.75rem;background:var(--color-surface);border-radius:8px;border:1px solid var(--color-border)}.instruction-icon{font-size:1.2rem;flex-shrink:0;margin-top:.1rem}.instruction-text{font-size:.9rem;color:var(--color-text-secondary)}.instruction-text strong{color:var(--color-text-primary);font-weight:600}.modal-actions{position:sticky;bottom:0;display:flex;gap:1rem;padding:var(--space-2);border-top:1px solid var(--color-border);background:var(--color-surface);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 -4px 6px -1px #0000001a;z-index:10}.secondary-button,.primary-button{flex:1;padding:.75rem 1rem;border-radius:8px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .2s ease;border:none}.secondary-button{background:var(--color-button-secondary);color:var(--color-text-primary);border:1px solid var(--color-border)}.secondary-button:hover{background:var(--color-button-secondary-hover);transform:translateY(-1px)}.primary-button{background:var(--color-primary)!important;color:#fff!important;display:flex;align-items:center;justify-content:center;gap:.5rem}.primary-button:hover{background:var(--color-primary-hover)!important;transform:translateY(-1px)}@media (max-width: 768px){.ai-confidence-modal{width:95vw;max-height:90vh}.ai-confidence-modal-overlay{background:#000000bf;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.modal-header{padding:var(--space-2)}.modal-header h2{font-size:1.3rem}.modal-content{padding:var(--space-2);padding-bottom:6rem}.overall-confidence{font-size:.8rem;padding:.4rem .6rem}.points-grid{gap:.5rem}.point-card{padding:.75rem}.instruction-grid{gap:.75rem}.instruction-item{padding:.5rem}.modal-actions{padding:var(--space-2);flex-direction:column;gap:.75rem}.secondary-button,.primary-button{padding:1rem 1.5rem;font-size:1rem;font-weight:600}.primary-button{background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-hover) 100%);box-shadow:0 4px 14px #4caf5066;order:-1}.secondary-button{background:var(--color-surface);border:2px solid var(--color-border)}}@media (max-width: 480px){.ai-confidence-modal{width:98vw;max-height:95vh}.modal-header{padding:var(--space-2)}.modal-content{padding:var(--space-2);padding-bottom:6rem;margin-left:0}.modal-actions{padding:var(--space-2)}}.settings-modal-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--color-overlay);display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem}.settings-modal{background:var(--color-surface);border:1px solid var(--color-border);border-radius:12px;max-width:800px;width:100%;max-height:85vh;display:flex;flex-direction:column;box-shadow:0 10px 40px var(--color-shadow)}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem;border-bottom:1px solid var(--color-divider)}.modal-header h2{margin:0;color:var(--color-text-primary);font-size:1.5rem}.close-btn{background:none;border:none;color:var(--color-text-secondary);font-size:1.5rem;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.modal-content{flex:1;overflow-y:auto;padding:1.5rem}.settings-menu{display:flex;flex-direction:column;gap:0;padding:0}.menu-item{background:none;border:none;padding:1.25rem 1.5rem;display:flex;align-items:center;gap:1rem;cursor:pointer;transition:all .2s ease;border-bottom:1px solid var(--color-border);text-align:left;width:100%}.menu-item:hover{background:var(--color-surface)}.menu-item:active{background:var(--color-card-background);transform:scale(.99)}.menu-item-icon{font-size:1.5rem;width:32px;height:32px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.menu-item-content{flex:1;display:flex;flex-direction:column;gap:.25rem}.menu-item-content h3{margin:0;font-size:1.1rem;color:var(--color-text-primary);font-weight:600}.menu-item-content p{margin:0;font-size:.9rem;color:var(--color-text-secondary)}.menu-item-arrow{font-size:1.2rem;color:var(--color-text-muted);flex-shrink:0}.coming-soon{font-size:.75rem;color:var(--color-primary);font-weight:500;background:color-mix(in srgb,var(--color-primary) 10%,transparent);padding:.2rem .5rem;border-radius:3px;margin-top:.25rem;align-self:flex-start}.back-btn{background:none;border:none;color:var(--color-primary);font-size:1.5rem;padding:.5rem;cursor:pointer;border-radius:4px;transition:all .2s ease;display:flex;align-items:center;justify-content:center;width:40px;height:40px}.back-btn:hover{background:color-mix(in srgb,var(--color-primary) 10%,transparent)}.placeholder-content{padding:1.5rem;text-align:center;max-width:400px;margin:0 auto}.placeholder-icon{font-size:3rem;margin-bottom:1rem}.placeholder-content h3{margin:0 0 1rem;color:var(--color-text-primary);font-size:1.3rem}.placeholder-content p{margin:0 0 1.5rem;color:var(--color-text-secondary);line-height:1.5}.placeholder-content ul{text-align:left;margin:0;padding-left:1.5rem;color:var(--color-text-secondary)}.placeholder-content li{margin-bottom:.5rem;line-height:1.4}.done-btn{background:var(--color-primary);color:#fff;border:none;padding:.75rem 2rem;border-radius:6px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease}.done-btn:hover{background:color-mix(in srgb,var(--color-primary) 90%,black);transform:translateY(-1px)}.setting-group{margin-bottom:2rem}.setting-group h3{margin:0 0 .5rem;color:var(--color-text-primary);font-size:1.2rem}.setting-description{color:var(--color-text-secondary);margin:0 0 1.5rem;font-size:.9rem}.season-selector{display:flex;flex-direction:column;gap:1.5rem}.season-group h4{margin:0 0 .75rem;color:var(--color-primary);font-size:1rem;text-transform:uppercase;letter-spacing:1px}.season-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.75rem}.season-option{display:block;cursor:pointer}.season-option input[type=radio]{position:absolute;opacity:0}.season-label{display:flex;flex-direction:column;padding:1rem;background:var(--color-card-background);border:2px solid var(--color-border);border-radius:8px;transition:all .2s;gap:.5rem}.season-option input[type=radio]:checked+.season-label{border-color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 5%,var(--color-card-background))}.season-option:hover .season-label{border-color:var(--color-border-hover)}.season-name{font-weight:700;color:var(--color-text-primary);font-size:.95rem}.season-traits{color:var(--color-text-muted);font-size:.75rem}.season-colors{display:flex;gap:.25rem;margin-top:.5rem}.season-color-chip{width:20px;height:20px;border-radius:4px;border:1px solid var(--color-border)}.clear-season-btn{margin-top:1rem;background:var(--color-button-secondary);color:var(--color-text-primary);border:none;padding:.5rem 1rem;border-radius:4px;cursor:pointer;font-size:.875rem}.clear-season-btn:hover{background:var(--color-button-secondary-hover)}.theme-settings{display:flex;flex-direction:column;gap:2rem}.theme-option-group h4,.theme-mode-group h4{margin:0 0 1rem;color:var(--color-primary);font-size:1rem;text-transform:uppercase;letter-spacing:1px}.theme-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.75rem;margin-bottom:1rem}.theme-option{display:block;cursor:pointer}.theme-option input[type=radio]{position:absolute;opacity:0}.theme-option input[type=radio]:disabled+.theme-label{opacity:.5;cursor:not-allowed}.theme-label{display:flex;align-items:center;padding:.75rem 1rem;background:var(--color-card-background);border:2px solid var(--color-border);border-radius:6px;transition:all .2s;color:var(--color-text-primary);font-size:.9rem}.theme-option input[type=radio]:checked+.theme-label{border-color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 10%,var(--color-card-background))}.theme-option:hover .theme-label:not(.theme-option input[type=radio]:disabled+.theme-label){border-color:var(--color-border-hover)}.theme-mode-group{margin-top:1rem}.mode-options{display:flex;gap:1rem;justify-content:flex-start}.mode-options .mode-btn{background:var(--color-card-background);border:2px solid var(--color-border);color:var(--color-text-primary);padding:.75rem 1.5rem;border-radius:6px;cursor:pointer;font-size:.9rem;transition:all .2s;display:flex;align-items:center;gap:.5rem}.mode-options .mode-btn:hover{border-color:var(--color-border-hover)}.mode-options .mode-btn.active{border-color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 10%,var(--color-card-background))}.personal-colors-display{margin-top:2rem;padding-top:2rem;border-top:1px solid var(--color-divider)}.personal-colors-display h4{margin:0 0 1rem;color:var(--color-primary);font-size:1rem;text-transform:uppercase;letter-spacing:1px}.saved-colors-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.75rem;margin-bottom:1.5rem}.saved-color-item{display:flex;align-items:center;gap:.75rem;padding:.75rem;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:6px}.saved-color-swatch{width:40px;height:40px;border-radius:6px;border:1px solid var(--color-border);flex-shrink:0}.saved-color-info{flex:1;display:flex;flex-direction:column;gap:.25rem}.saved-color-label{color:var(--color-text-primary);font-size:.9rem;font-weight:500}.saved-color-hex{color:var(--color-text-muted);font-family:monospace;font-size:.8rem}.clear-colors-btn{background:var(--color-warning);color:var(--color-text-primary);border:none;padding:.5rem 1rem;border-radius:4px;cursor:pointer;font-size:.875rem}.clear-colors-btn:hover{background:color-mix(in srgb,var(--color-warning) 85%,black)}.modal-footer{display:flex;justify-content:flex-end;gap:1rem;padding:1.5rem;border-top:1px solid var(--color-divider)}.cancel-btn,.save-btn{padding:.75rem 1.5rem;border:none;border-radius:6px;font-size:1rem;cursor:pointer;transition:all .2s}.cancel-btn{background:var(--color-button-secondary);color:var(--color-text-primary)}.cancel-btn:hover{background:var(--color-button-secondary-hover)}.save-btn{background:linear-gradient(135deg,var(--color-button-primary),var(--color-button-primary-hover));color:var(--color-text-primary);font-weight:700}.save-btn:hover{background:linear-gradient(135deg,var(--color-button-primary-hover),var(--color-button-primary));transform:translateY(-1px);box-shadow:0 4px 8px var(--color-shadow)}@media (max-width: 640px){.season-options,.saved-colors-grid{grid-template-columns:1fr}.modal-content{padding:0}.menu-item{padding:1rem 1.5rem}.menu-item-icon{font-size:1.3rem;width:28px;height:28px}.menu-item-content h3{font-size:1rem}.menu-item-content p{font-size:.85rem}.placeholder-content{padding:1rem}.placeholder-content h3{font-size:1.2rem}.placeholder-content ul{padding-left:1rem}.theme-settings{padding:0 1.5rem}}.profile-manager{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--color-background);z-index:1000;display:flex;flex-direction:column;overflow:hidden}.profile-manager-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem;border-bottom:1px solid var(--color-border);background:var(--color-surface)}.profile-manager-header .header-left{display:flex;align-items:center;gap:1rem}.profile-manager-header h2{margin:0;color:var(--color-text-primary);font-size:1.5rem}.close-btn{background:transparent;border:none;font-size:2rem;color:var(--color-text-secondary);cursor:pointer;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:6px;transition:all .2s}.close-btn:hover{background:var(--color-card-background);color:var(--color-text-primary)}.profile-manager-content{flex:1;overflow-y:auto;padding:1.5rem}.profile-actions{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;flex-wrap:wrap;gap:1rem}.create-profile-btn{background:var(--color-primary);color:#fff;border:none;padding:.75rem 1.5rem;border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s}.create-profile-btn:hover{background:var(--color-primary-hover);transform:translateY(-1px);box-shadow:0 4px 8px var(--color-shadow)}.profile-controls{display:flex;flex-direction:column;gap:1rem;margin-bottom:1.5rem}.profile-actions{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}.storage-info{display:flex;flex-direction:column;gap:.5rem;min-width:200px}.search-and-sort{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;padding:1rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:8px}.search-bar{flex:1;min-width:200px}.search-input{width:100%;padding:.5rem .75rem;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:6px;color:var(--color-text-primary);font-size:.9rem;transition:all .2s}.search-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 2px color-mix(in srgb,var(--color-primary) 20%,transparent)}.sort-controls{display:flex;align-items:center;gap:.5rem;color:var(--color-text-secondary);font-size:.9rem}.sort-select{padding:.5rem;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:6px;color:var(--color-text-primary);font-size:.9rem;cursor:pointer}.sort-direction-btn{background:var(--color-card-background);border:1px solid var(--color-border);border-radius:4px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:.9rem;color:var(--color-text-secondary);transition:all .2s}.sort-direction-btn:hover{background:var(--color-surface);border-color:var(--color-primary);color:var(--color-text-primary)}.bulk-actions{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;background:color-mix(in srgb,var(--color-primary) 10%,var(--color-surface));border:1px solid color-mix(in srgb,var(--color-primary) 30%,transparent);border-radius:8px;gap:1rem}.selection-info{color:var(--color-text-primary);font-weight:500;font-size:.9rem}.bulk-buttons{display:flex;gap:.5rem}.bulk-btn{padding:.5rem 1rem;border-radius:6px;font-size:.85rem;font-weight:500;cursor:pointer;transition:all .2s;border:1px solid transparent}.bulk-btn.clear-btn{background:var(--color-card-background);color:var(--color-text-primary);border-color:var(--color-border)}.bulk-btn.clear-btn:hover{background:var(--color-surface);border-color:var(--color-text-secondary)}.bulk-btn.delete-btn{background:color-mix(in srgb,red 15%,var(--color-surface));color:red;border-color:color-mix(in srgb,red 40%,transparent)}.bulk-btn.delete-btn:hover{background:color-mix(in srgb,red 25%,var(--color-surface));border-color:red}.bulk-btn.delete-btn:disabled{opacity:.5;cursor:not-allowed}.list-controls{display:flex;justify-content:space-between;align-items:center;gap:1rem}.select-all-btn{padding:.5rem 1rem;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:6px;color:var(--color-text-primary);font-size:.85rem;cursor:pointer;transition:all .2s}.select-all-btn:hover{background:var(--color-surface);border-color:var(--color-primary)}.select-all-btn:disabled{opacity:.5;cursor:not-allowed}.profile-count{color:var(--color-text-secondary);font-size:.9rem}.profile-card.selected{border-color:var(--color-primary);box-shadow:0 0 0 2px color-mix(in srgb,var(--color-primary) 30%,transparent)}.profile-checkbox{position:absolute;top:.5rem;left:.5rem;z-index:10;background:#ffffffe6;border-radius:4px;padding:4px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.profile-checkbox input{width:18px;height:18px;cursor:pointer;accent-color:var(--color-primary)}.warning-message{padding:1rem;background:color-mix(in srgb,orange 10%,var(--color-surface));border:1px solid color-mix(in srgb,orange 30%,transparent);border-radius:8px;margin-bottom:1rem}.warning-message p{margin:.5rem 0;color:var(--color-text-primary)}.delete-consequences{margin-top:1rem}.delete-consequences h4{margin:0 0 .75rem;color:var(--color-text-primary);font-size:1rem}.delete-consequences ul{margin:0;padding-left:1.25rem;color:var(--color-text-secondary)}.delete-consequences li{margin:.25rem 0;font-size:.9rem}.danger-btn{background:red!important;color:#fff!important;border:none!important}.danger-btn:hover{background:#8b0000!important}.storage-text{color:var(--color-text-secondary);font-size:.9rem;text-align:right}.storage-bar{height:6px;background:var(--color-surface);border-radius:3px;overflow:hidden}.storage-fill{height:100%;background:linear-gradient(90deg,var(--color-primary),var(--color-primary-light));transition:width .3s ease}.profiles-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem}.profile-card{background:var(--color-card-background);border:1px solid var(--color-border);border-radius:12px;overflow:hidden;transition:all .2s}.profile-card:hover{box-shadow:0 4px 12px var(--color-shadow);transform:translateY(-2px)}.profile-card.active{border-color:var(--color-primary);box-shadow:0 0 0 2px color-mix(in srgb,var(--color-primary) 20%,transparent)}.profile-thumbnail{position:relative;width:100%;height:150px;background:var(--color-surface);display:flex;align-items:center;justify-content:center;overflow:hidden}.profile-thumbnail img{width:100%;height:100%;object-fit:cover}.no-image{color:var(--color-text-muted);font-size:.9rem;text-align:center;padding:1rem}.default-badge,.active-badge{position:absolute;top:.5rem;padding:.25rem .75rem;border-radius:12px;font-size:.75rem;font-weight:600;text-transform:uppercase}.default-badge{left:.5rem;background:var(--color-surface);color:var(--color-text-secondary);border:1px solid var(--color-border)}.active-badge{right:.5rem;background:var(--color-primary);color:#fff}.profile-info{padding:1rem}.profile-info h3{margin:0 0 .5rem;color:var(--color-text-primary);font-size:1.1rem}.profile-description{color:var(--color-text-secondary);font-size:.9rem;margin:0 0 .75rem;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.profile-meta{display:flex;gap:1rem;font-size:.85rem}.profile-type{color:var(--color-primary);font-weight:500;text-transform:capitalize}.profile-points{color:var(--color-text-muted)}.profile-actions{display:flex;gap:.5rem;padding:0 1rem 1rem}.profile-actions button{flex:1;padding:.5rem;border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text-primary);border-radius:6px;font-size:.85rem;cursor:pointer;transition:all .2s}.profile-actions button:hover{background:var(--color-card-background);border-color:var(--color-primary)}.set-active-btn{background:var(--color-primary)!important;color:#fff!important;border-color:var(--color-primary)!important}.set-active-btn:hover{background:var(--color-primary-hover)!important}.edit-btn{background:var(--color-card-background)!important;color:var(--color-text-primary)!important;border-color:var(--color-border)!important}.edit-btn:hover{background:var(--color-surface)!important;border-color:var(--color-text-secondary)!important}.delete-btn:hover{background:color-mix(in srgb,red 10%,var(--color-surface))!important;border-color:red!important;color:red!important}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:2000;padding:1rem}.modal{background:var(--color-background);border-radius:12px;max-width:500px;width:100%;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 10px 40px #0000004d}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem;border-bottom:1px solid var(--color-border)}.modal-header h3{margin:0;color:var(--color-text-primary);font-size:1.25rem}.modal-content{padding:1.5rem;overflow-y:auto;flex:1}.form-group label{display:block;margin-bottom:.5rem;color:var(--color-text-secondary);font-size:.9rem;font-weight:500}.form-group input,.form-group textarea{width:100%;padding:.75rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:6px;color:var(--color-text-primary);font-size:1rem;transition:all .2s}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 2px color-mix(in srgb,var(--color-primary) 20%,transparent)}.form-group textarea{resize:vertical;font-family:inherit}.profile-type-options{display:flex;flex-direction:column;gap:.75rem}.profile-type-option{display:flex;align-items:center;padding:1rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:8px;cursor:pointer;transition:all .2s}.profile-type-option:hover{border-color:var(--color-primary);background:var(--color-card-background)}.profile-type-option:has(input:checked){border-color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 10%,var(--color-surface))}.profile-type-option input{margin-right:1rem;width:18px;height:18px;cursor:pointer}.option-content{display:flex;flex-direction:column;gap:.25rem}.option-title{color:var(--color-text-primary);font-weight:500}.option-description{color:var(--color-text-muted);font-size:.85rem}.template-preview{padding:1rem;background:var(--color-surface);border-radius:8px;margin-top:1rem}.template-preview label{display:block;margin-bottom:.75rem;color:var(--color-text-secondary);font-size:.9rem;font-weight:500}.template-points{display:flex;flex-wrap:wrap;gap:.5rem}.template-point{display:flex;align-items:center;gap:.5rem;padding:.25rem .75rem;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:12px;font-size:.85rem}.point-color{width:16px;height:16px;border-radius:4px;border:1px solid var(--color-border)}.point-name{color:var(--color-text-primary)}.copy-options{display:flex;flex-direction:column;gap:.75rem}.checkbox-option{display:flex;align-items:center;gap:.75rem;padding:.75rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:6px;cursor:pointer;transition:all .2s}.checkbox-option:hover{border-color:var(--color-primary);background:var(--color-card-background)}.checkbox-option:has(input:checked){border-color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 10%,var(--color-surface))}.checkbox-option input{width:18px;height:18px;cursor:pointer}.checkbox-option span{color:var(--color-text-primary)}.copy-summary{padding:1rem;background:color-mix(in srgb,var(--color-primary) 5%,var(--color-surface));border:1px solid color-mix(in srgb,var(--color-primary) 20%,transparent);border-radius:8px;margin-top:1rem}.copy-summary p{margin:0;color:var(--color-text-secondary);font-size:.9rem}.google-login-section{margin:24px 0;padding:20px;background-color:var(--color-surface);border-radius:8px;border:1px solid var(--color-border)}.divider{text-align:center;margin-bottom:16px;position:relative}.divider:before{content:"";position:absolute;top:50%;left:0;right:0;height:1px;background-color:var(--color-border)}.divider span{background-color:var(--color-surface);padding:0 16px;color:var(--color-text-secondary);font-size:14px;font-weight:500}.google-login-content{text-align:center}.google-login-content h4{margin:0 0 8px;color:var(--color-text-primary);font-size:16px;font-weight:600}.google-login-content p{margin:0 0 16px;color:var(--color-text-secondary);font-size:14px}.modal-footer{display:flex;gap:1rem;padding:1.5rem;border-top:1px solid var(--color-border);background:var(--color-surface)}.modal-footer button{flex:1;padding:.75rem;border-radius:6px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s}.cancel-btn{background:var(--color-card-background);color:var(--color-text-primary);border:1px solid var(--color-border)}.cancel-btn:hover{background:var(--color-surface);border-color:var(--color-text-secondary)}.primary-btn{background:var(--color-primary);color:#fff;border:none}.primary-btn:hover{background:var(--color-primary-hover)}.profile-info{background:var(--color-surface);border:1px solid var(--color-border);border-radius:8px;padding:1rem;margin-top:1rem}.profile-info p{margin:.5rem 0;color:var(--color-text-secondary);font-size:.9rem}.profile-info strong{color:var(--color-text-primary)}@media (max-width: 480px){.profile-manager-header{padding:1rem}.profile-manager-header h2{font-size:1.1rem}.profile-actions{flex-direction:column;gap:.5rem;padding:1rem}.profile-actions button{width:100%;font-size:.85rem;min-height:40px}.create-profile-btn{padding:.875rem 1.25rem;font-size:.95rem}.profiles-grid{gap:1rem}.profile-thumbnail{height:140px}.profile-info{padding:1rem}}@media (max-width: 768px){.profile-manager-header{padding:1rem 1.5rem}.profile-manager-header h2{font-size:1.25rem}.profile-manager-content{padding:1rem}.profiles-header{margin-bottom:1.5rem;text-align:center}.profiles-grid{grid-template-columns:1fr;gap:1.25rem}.profile-card{border-radius:16px;overflow:hidden;background:var(--color-card-background);border:1px solid var(--color-border);transition:all .3s ease}.profile-card:hover{transform:translateY(-2px);box-shadow:0 8px 20px var(--color-shadow)}.profile-card.active{border-color:var(--color-primary);box-shadow:0 0 0 2px color-mix(in srgb,var(--color-primary) 25%,transparent)}.profile-thumbnail{width:100%;height:160px;position:relative;background:var(--color-surface);display:flex;align-items:center;justify-content:center}.profile-thumbnail img{width:100%;height:100%;object-fit:cover}.profile-icon{font-size:2.5rem;opacity:.6}.no-image{display:flex;align-items:center;justify-content:center;width:100%;height:100%;color:var(--color-text-muted);font-size:.9rem;background:var(--color-surface)}.profile-info{padding:1.25rem}.profile-info h3{margin:0 0 .75rem;color:var(--color-text-primary);font-size:1.1rem;font-weight:600}.profile-info p{margin:0 0 .5rem;color:var(--color-text-secondary);font-size:.9rem;line-height:1.4}.profile-info .profile-meta{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:.75rem;font-size:.85rem}.profile-meta-item{color:var(--color-text-secondary);background:var(--color-surface);padding:.25rem .5rem;border-radius:4px;font-weight:500}.profile-actions{padding:1rem 1.25rem 1.25rem;border-top:1px solid var(--color-border);background:var(--color-surface);display:flex;gap:.75rem;justify-content:stretch}.profile-actions button{flex:1;padding:.75rem;border-radius:8px;font-size:.9rem;font-weight:500;min-height:44px;transition:all .2s ease}.set-active-btn{background:var(--color-primary);color:#fff;border:none}.set-active-btn:hover{background:var(--color-primary-hover);transform:translateY(-1px)}.set-active-btn.active{background:var(--color-success)}.edit-btn,.duplicate-btn{background:var(--color-button-secondary);color:var(--color-text-primary);border:1px solid var(--color-border)}.edit-btn:hover,.duplicate-btn:hover{background:var(--color-button-secondary-hover);border-color:var(--color-primary);transform:translateY(-1px)}.create-profile-btn{background:var(--color-primary);color:#fff;border:none;padding:1rem 1.5rem;border-radius:12px;font-size:1rem;font-weight:600;width:100%;min-height:48px;margin-bottom:1rem;transition:all .2s ease;cursor:pointer}.create-profile-btn:hover{background:var(--color-primary-hover);transform:translateY(-2px);box-shadow:0 6px 16px var(--color-shadow)}.storage-info{text-align:center;margin-bottom:1.5rem}.storage-text{font-size:.9rem;color:var(--color-text-secondary);margin-bottom:.5rem}.storage-bar{height:4px;background:var(--color-surface);border-radius:2px;overflow:hidden;border:1px solid var(--color-border)}.storage-fill{height:100%;background:linear-gradient(90deg,var(--color-primary),var(--color-primary-light));transition:width .3s ease}.modal{margin:1rem;max-height:calc(100vh - 2rem);border-radius:16px}.close-btn{min-width:44px;min-height:44px}.profiles-stats{font-size:.9rem;margin:1rem 0 1.5rem;text-align:center;color:var(--color-text-secondary)}}.profile-manage-page{min-height:100vh;background:var(--color-background);padding:0}.page-header{display:flex;align-items:center;justify-content:space-between;padding:1rem;background:var(--color-surface);border-bottom:1px solid var(--color-border);position:sticky;top:0;z-index:10}.header-actions{display:flex;align-items:center;gap:1rem}.profile-count{font-size:.875rem;color:var(--color-text-secondary);font-weight:500}.create-button{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border:none;border-radius:var(--radius-lg);background:var(--color-surface);color:var(--color-text-primary);cursor:pointer;transition:all .2s ease}.page-header h1{font-size:1.25rem;font-weight:600;color:var(--color-text-primary);margin:0}.profiles-list{padding:1rem;display:flex;flex-direction:column;gap:1rem;overflow:visible}.profile-card{display:flex;align-items:flex-start;gap:1rem;padding:1rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);cursor:pointer;position:relative;overflow:visible;transition:none!important;transform:none!important}.profile-card:hover{transform:none!important;box-shadow:none!important;border-color:var(--color-border)!important;background:var(--color-surface)!important}.profile-card.active{border-color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 5%,var(--color-surface))}.profile-image-container{position:relative;flex-shrink:0;overflow:visible}.profile-image{width:60px;height:60px;border-radius:var(--radius-lg);object-fit:cover;border:2px solid var(--color-border)}.profile-image-placeholder{width:60px;height:60px;border-radius:var(--radius-lg);background:var(--color-secondary);border:2px solid var(--color-border);display:flex;align-items:center;justify-content:center;font-weight:600;font-size:1.25rem;color:var(--color-text-secondary)}.active-badge{background:var(--color-success);border-radius:50%;width:20px;height:20px;color:#fff;box-shadow:0 2px 4px #0003;display:flex;align-items:center;justify-content:center;flex-shrink:0;position:absolute;right:0;bottom:0}.profile-info{flex:1;min-width:0;position:relative;overflow:visible;margin-top:0!important;align-self:flex-start}.profile-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.profile-title{flex:1;min-width:0}.profile-name{font-size:1rem;font-weight:600;color:var(--color-text-primary);margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.2;display:flex;align-items:center;gap:.5rem}.action-menu-button{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;background:transparent;color:var(--color-text-secondary);border-radius:var(--radius-md);cursor:pointer;transition:all .2s ease}.season-name{font-size:.75rem;font-weight:500;color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 10%,transparent);padding:.125rem .375rem;border-radius:var(--radius-sm);line-height:1.2;flex-shrink:0;display:inline-block;width:fit-content}.color-swatches-container{display:flex;align-items:center;justify-content:space-between;position:relative}.color-swatches{display:flex;align-items:center;gap:.25rem}.color-swatch{width:20px;height:20px;border-radius:var(--radius-sm);border:1px solid var(--color-border);flex-shrink:0}.color-swatch.filled{border:1px solid var(--color-border)}.color-swatch.empty{background:var(--color-secondary);border:1px dashed var(--color-border)}.more-colors{font-size:.75rem;color:var(--color-text-secondary);font-weight:500;padding-left:.5rem}.action-menu{position:fixed;background:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f,0 0 0 1px #0000000d;z-index:1000;min-width:200px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:.5rem}.action-item{display:flex;align-items:center;gap:.75rem;width:100%;padding:.75rem;border:none;background:transparent;color:var(--color-text-primary);font-size:.875rem;font-weight:500;cursor:pointer;transition:all .15s ease;text-align:left;border-radius:var(--radius-md);position:relative}.action-item.delete{color:var(--color-danger)}.action-item svg{width:18px;height:18px;flex-shrink:0}.action-menu-overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:999}.empty-state{text-align:center;padding:3rem 1rem;color:var(--color-text-secondary)}.empty-icon{margin:0 auto 1.5rem;color:var(--color-text-muted)}.empty-state h3{font-size:1.25rem;color:var(--color-text-primary);margin-bottom:.5rem}.empty-state p{margin-bottom:2rem;color:var(--color-text-secondary)}.create-first-button{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:var(--color-primary);color:#fff;border:none;border-radius:var(--radius-lg);font-weight:500;cursor:pointer;transition:all .2s ease}@media (min-width: 768px){.profiles-list{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.page-header{padding:1.5rem}}@media (min-width: 1024px){.profiles-list{grid-template-columns:repeat(3,1fr)}.profile-manage-page{max-width:1200px;margin:0 auto}}.profile-manage-page{--color-success: var(--color-success, #4caf50);--color-danger: var(--color-warning, #ff4444);--color-warning: var(--color-warning, #ffa500);--color-primary-dark: var(--color-primary-hover, #45a049);--color-accent: var(--color-accent, #4caf50)}.landing-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:10000;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:fadeIn .3s ease}.landing-modal{background:var(--color-card-background);border-radius:16px;border:1px solid var(--color-border);box-shadow:0 25px 50px -12px #00000040;max-width:650px;width:90vw;max-height:85vh;overflow:hidden;display:flex;flex-direction:column;position:relative;animation:slideUp .4s ease}.landing-modal-close{position:absolute;top:1rem;right:1rem;background:transparent;border:none;padding:.5rem;border-radius:8px;cursor:pointer;color:var(--color-text-secondary);transition:all .2s ease;z-index:10}.landing-modal-close:hover{background:var(--color-border);color:var(--color-text-primary)}.landing-modal-close .close-icon{width:24px;height:24px}.landing-modal-header{padding:2rem 2rem 1rem;text-align:center;border-bottom:1px solid var(--color-border);background:var(--color-surface);position:relative}.landing-modal-header h1{margin:0;font-size:2rem;font-weight:700;color:var(--color-text-primary);background:linear-gradient(135deg,var(--color-primary),#8b5cf6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.beta-badge{position:absolute;top:1.5rem;right:4rem;background:linear-gradient(135deg,#f59e0b,#ef4444);color:#fff;padding:.25rem .75rem;border-radius:20px;font-size:.75rem;font-weight:600;letter-spacing:.05em}.landing-modal-content{flex:1;overflow-y:auto;padding:2rem}.development-notice{background:color-mix(in srgb,#f59e0b 10%,transparent);border:1px solid color-mix(in srgb,#f59e0b 30%,transparent);border-radius:12px;padding:1.25rem;margin-bottom:2rem}.development-notice h3{margin:0 0 .75rem;color:#d97706;font-size:1.1rem;font-weight:600;display:flex;align-items:center;gap:.5rem}.development-notice p{margin:0;color:var(--color-text-secondary);line-height:1.6}.app-purpose{margin-bottom:2rem}.app-purpose h3{margin:0 0 1rem;color:var(--color-text-primary);font-size:1.25rem;font-weight:600}.app-purpose p{color:var(--color-text-secondary);line-height:1.7;margin-bottom:1.25rem}.app-purpose h4{margin:1.5rem 0 .75rem;color:var(--color-text-primary);font-size:1rem;font-weight:600}.getting-started-steps{margin:0 0 1.5rem;padding:0 0 0 1.25rem;color:var(--color-text-secondary);counter-reset:step-counter}.getting-started-steps li{padding:.75rem 0;line-height:1.6;position:relative;counter-increment:step-counter}.getting-started-steps li:before{content:counter(step-counter);position:absolute;left:-1.25rem;top:.75rem;width:1.5rem;height:1.5rem;background:var(--color-primary);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:600}.app-purpose ul{margin:0;padding:0;list-style:none}.app-purpose li{padding:.5rem 0;color:var(--color-text-secondary);display:flex;align-items:flex-start;gap:.75rem;line-height:1.5}.feedback-section{background:color-mix(in srgb,var(--color-primary) 5%,transparent);border:1px solid color-mix(in srgb,var(--color-primary) 20%,transparent);border-radius:12px;padding:1.5rem;text-align:center}.feedback-section h3{margin:0 0 .75rem;color:var(--color-text-primary);font-size:1.1rem;font-weight:600}.feedback-section p{margin:0 0 1rem;color:var(--color-text-secondary);line-height:1.6}.feedback-email{display:inline-block;color:var(--color-primary);font-weight:600;font-size:1.1rem;text-decoration:none;padding:.75rem 1.5rem;background:var(--color-card-background);border:2px solid var(--color-primary);border-radius:8px;transition:all .2s ease}.feedback-email:hover{background:var(--color-primary);color:#fff;transform:translateY(-2px);box-shadow:0 4px 12px #8b5cf64d}.landing-modal-footer{padding:1.5rem 2rem;border-top:1px solid var(--color-border);background:var(--color-surface);display:flex;justify-content:space-between;align-items:center;gap:1rem}.get-started-btn{background:linear-gradient(135deg,var(--color-primary),#8b5cf6);color:#fff;border:none;padding:.875rem 2rem;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease;min-width:140px}.get-started-btn:hover{transform:translateY(-2px);box-shadow:0 8px 16px #8b5cf64d}.dont-show-again{display:flex;align-items:center;gap:.5rem;color:var(--color-text-secondary);font-size:.9rem;cursor:pointer}.dont-show-again input[type=checkbox]{cursor:pointer}@media (max-width: 768px){.landing-modal{width:95vw;max-height:90vh}.landing-modal-header{padding:1.5rem 1rem 1rem}.landing-modal-header h1{font-size:1.5rem}.beta-badge{position:static;display:inline-block;margin-top:.5rem}.landing-modal-content{padding:1.5rem}.app-purpose h3{font-size:1.1rem}.feedback-email{font-size:1rem;padding:.625rem 1.25rem}.landing-modal-footer{flex-direction:column;padding:1.25rem}.get-started-btn{width:100%}.dont-show-again{width:100%;justify-content:center}}@media (max-width: 480px){.landing-modal-content,.development-notice,.feedback-section{padding:1rem}.landing-modal-header h1{font-size:1.25rem}}.app-footer{background:var(--color-surface);border-top:1px solid var(--color-border);padding:1.5rem 2rem;margin-top:auto}.footer-content{max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1.5rem}.footer-section{display:flex;align-items:center;gap:.75rem}.footer-brand{font-size:1.1rem;font-weight:600;color:var(--color-text-primary);background:linear-gradient(135deg,var(--color-primary),#8b5cf6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.footer-beta{background:linear-gradient(135deg,#f59e0b,#ef4444);color:#fff;padding:.15rem .5rem;border-radius:12px;font-size:.65rem;font-weight:600;letter-spacing:.05em}.footer-text{color:var(--color-text-secondary);font-size:.9rem}.footer-email{color:var(--color-primary);text-decoration:none;font-weight:500;transition:all .2s ease;padding:.25rem .5rem;border-radius:4px}.footer-email:hover{background:color-mix(in srgb,var(--color-primary) 10%,transparent);text-decoration:underline}.footer-copyright{color:var(--color-text-muted);font-size:.85rem}@media (max-width: 768px){.app-footer{padding:1.25rem 1rem}.footer-content{flex-direction:column;text-align:center;gap:1rem}.footer-section{width:100%;justify-content:center}.footer-text{font-size:.85rem}.footer-email{font-size:.9rem}}@media (max-width: 480px){.app-footer{padding:1rem}.footer-brand{font-size:1rem}.footer-section{flex-direction:column;gap:.5rem}.footer-section:first-child{flex-direction:row}}.catalog-container{display:flex;flex-direction:column;height:100%;background:var(--color-background)}.catalog-header-bar{background:var(--color-card-background);border-bottom:1px solid var(--color-border);padding:1rem}.header-row{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}.catalog-title-section{display:flex;align-items:center;gap:1rem}.catalog-title{font-size:1.5rem;font-weight:600;color:var(--color-text-primary);margin:0}.catalogue-dropdown-container{position:relative}.catalogue-dropdown-button{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:var(--color-background);border:1px solid var(--color-border);border-radius:8px;color:var(--color-text-primary);font-size:.9rem;cursor:pointer;transition:all .2s}.catalogue-dropdown-button:hover{background:var(--color-card-background);border-color:var(--color-primary)}.dropdown-icon{width:16px;height:16px;color:var(--color-text-secondary)}.catalogue-dropdown-menu{position:absolute;top:calc(100% + 4px);left:0;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:8px;box-shadow:0 4px 12px var(--color-shadow);z-index:1000;min-width:150px;overflow:hidden}.catalogue-dropdown-menu button{display:block;width:100%;padding:.75rem 1rem;background:none;border:none;text-align:left;color:var(--color-text-primary);cursor:pointer;transition:background .2s}.catalogue-dropdown-menu button:hover{background:var(--color-background)}.catalogue-dropdown-menu button.active{background:var(--color-primary-light);color:var(--color-primary);font-weight:500}.dropdown-divider{height:1px;background:var(--color-border);margin:.25rem 0}.header-actions{display:flex;gap:.5rem;flex-wrap:wrap}.header-btn{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:var(--color-background);border:1px solid var(--color-border);border-radius:8px;color:var(--color-text-primary);font-size:.9rem;cursor:pointer;transition:all .2s}.header-btn:hover:not(:disabled){background:var(--color-card-background);border-color:var(--color-primary)}.header-btn:disabled{opacity:.5;cursor:not-allowed}.header-btn.primary{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.header-btn.primary:hover:not(:disabled){background:var(--color-primary-dark);border-color:var(--color-primary-dark)}.header-btn.danger{color:var(--color-error);border-color:var(--color-error)}.header-btn.danger:hover:not(:disabled){background:var(--color-error-light)}.btn-icon{width:18px;height:18px}.catalog-content{flex:1;overflow-y:auto;padding:1.5rem}.catalog-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;height:400px;color:var(--color-text-secondary)}.loading-spinner{width:48px;height:48px;border:3px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem}@keyframes spin{to{transform:rotate(360deg)}}.catalog-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:400px;color:var(--color-text-secondary);cursor:pointer;border:2px dashed var(--color-border);border-radius:12px;transition:all .2s}.catalog-empty:hover{border-color:var(--color-primary);background:var(--color-card-background)}.empty-icon{width:64px;height:64px;margin-bottom:1rem;color:var(--color-text-tertiary)}.empty-hint{font-size:.9rem;color:var(--color-text-tertiary);margin-top:.5rem}.catalog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem}.catalog-item{position:relative;aspect-ratio:3/4;background:var(--color-card-background);border:2px solid var(--color-border);border-radius:8px;overflow:hidden;cursor:pointer;transition:all .2s}.catalog-item:hover{transform:translateY(-2px);box-shadow:0 4px 12px var(--color-shadow)}.catalog-item.selected{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.catalog-item.radar-item{border-color:#ffc107;border-width:3px}.catalog-item.radar-item.selected{border-color:#ffc107;box-shadow:0 0 0 3px #ffc10733}.catalog-item img{width:100%;height:100%;object-fit:cover}.item-checkbox{position:absolute;top:8px;left:8px;width:24px;height:24px;background:var(--color-primary);border-radius:4px;display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 2px 4px var(--color-shadow);z-index:10}.item-checkbox svg{width:16px;height:16px}.item-badge{position:absolute;top:8px;right:8px;width:28px;height:28px;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 4px var(--color-shadow)}.item-badge.analyzed{background:var(--color-success-light);border-color:var(--color-success);color:var(--color-success)}.item-badge svg{width:16px;height:16px}.item-quantity{position:absolute;bottom:8px;right:8px;background:var(--color-primary);color:#fff;padding:2px 8px;border-radius:12px;font-size:.75rem;font-weight:600}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:9999}.modal-content{background:var(--color-card-background);border:1px solid var(--color-border);border-radius:12px;padding:2rem;max-width:400px;width:90%;position:relative;box-shadow:0 8px 32px var(--color-shadow)}.modal-content h3{margin-top:0;margin-bottom:1.5rem;color:var(--color-text-primary);font-size:1.25rem;font-weight:600}.move-options{display:flex;flex-direction:column;gap:.75rem;margin-bottom:2rem}.move-options button{padding:1rem 1.25rem;background:var(--color-surface);border:2px solid var(--color-border);border-radius:10px;text-align:left;cursor:pointer;color:var(--color-text-primary);font-size:1rem;font-weight:500;transition:all .2s ease;position:relative}.move-options button:hover{border-color:var(--color-primary);background:var(--color-card-background);transform:translateY(-1px);box-shadow:0 2px 8px var(--color-shadow)}.move-options button.active{background:var(--color-primary);border-color:var(--color-primary);color:#fff;font-weight:600;box-shadow:0 4px 12px #3b82f64d}.move-options button.active:hover{background:var(--color-primary-dark);border-color:var(--color-primary-dark);color:#fff}.modal-actions{display:flex;justify-content:flex-end;gap:.75rem;padding-top:1rem;border-top:1px solid var(--color-border)}.modal-actions button{padding:.75rem 2rem;border:2px solid var(--color-border);border-radius:8px;background:var(--color-surface);color:var(--color-text-primary);font-weight:500;font-size:.95rem;cursor:pointer;transition:all .2s ease}.modal-actions button:hover{background:var(--color-card-background);border-color:var(--color-primary);transform:translateY(-1px)}.modal-actions button.primary{background:var(--color-primary);color:#fff;border-color:var(--color-primary);font-weight:600}.modal-actions button.primary:hover{background:var(--color-primary-dark);border-color:var(--color-primary-dark);transform:translateY(-1px);box-shadow:0 4px 12px #3b82f64d}.item-info-modal{max-width:800px;width:95%;max-height:90vh;overflow-y:auto}.item-info-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:1px solid var(--color-border)}.item-info-header h3{margin:0;color:var(--color-text-primary);font-size:1.25rem;font-weight:600}.modal-close-btn{background:none;border:none;cursor:pointer;padding:.5rem;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background .2s}.modal-close-btn:hover{background:var(--color-background)}.modal-close-btn svg{width:24px;height:24px;color:var(--color-text-secondary)}.item-info-body{display:flex;gap:1.5rem}.item-info-image{flex:0 0 300px;position:relative}.item-info-image img{width:100%;height:auto;border-radius:8px;box-shadow:0 4px 12px var(--color-shadow)}.item-info-details{flex:1;display:flex;flex-direction:column;gap:1rem}.info-row{display:flex;flex-direction:column;gap:.25rem}.info-row strong{color:var(--color-text-secondary);font-size:.875rem;font-weight:500;text-transform:uppercase;letter-spacing:.5px}.info-row span{color:var(--color-text-primary);font-size:1rem}.status-yes{color:var(--color-success)!important;font-weight:500}.status-no{color:var(--color-text-tertiary)!important}.color-swatches{display:flex;gap:.5rem;flex-wrap:wrap}.color-swatch{width:32px;height:32px;border-radius:50%;border:2px solid var(--color-border);cursor:pointer;transition:transform .2s}.color-swatch:hover{transform:scale(1.1)}@media (max-width: 768px){.header-row{flex-direction:column;align-items:stretch}.catalog-title-section,.header-actions{justify-content:space-between}.header-btn span{display:none}.catalog-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}.item-info-body{flex-direction:column}.item-info-image{flex:none}.item-info-modal{max-height:95vh}}.filter-dropdown-container{position:relative;z-index:400}.filter-dropdown{position:absolute;top:100%;right:0;z-index:500;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);min-width:280px;max-width:350px;max-height:75vh;overflow-y:auto;animation:dropdownSlideIn .2s ease-out;margin-top:8px}@keyframes dropdownSlideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.filter-dropdown-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid var(--color-border);background:var(--color-surface);border-radius:var(--radius-lg) var(--radius-lg) 0 0}.filter-dropdown-title{font-weight:600;font-size:var(--text-base);color:var(--color-text-primary)}.clear-all-btn{background:var(--color-error);color:#fff;border:none;padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:500;cursor:pointer;transition:all .2s ease}.clear-all-btn:hover{background:#dc2626;transform:translateY(-1px)}.filter-sections{padding:0}.filter-section{border-bottom:1px solid var(--color-border)}.filter-section:first-child{border-top:none}.filter-section:last-child{border-bottom:none}.filter-section-header{display:flex;justify-content:space-between;align-items:center;padding:12px 20px;cursor:pointer;transition:all .2s ease;background:transparent;border:none;width:100%;text-align:left}.filter-section-header:hover{background:color-mix(in srgb,var(--color-border) 20%,transparent)}.filter-section-title{font-weight:600;font-size:14px;color:var(--color-text-primary)}.filter-section-controls{display:flex;align-items:center;gap:var(--space-2)}.filter-count{background:var(--color-primary);color:#fff;border-radius:var(--radius-full);min-width:20px;height:20px;display:flex;align-items:center;justify-content:center;font-size:var(--text-xs);font-weight:600}.expand-icon{font-size:var(--text-xs);color:var(--color-text-secondary);transition:transform .2s ease}.expand-icon.expanded{transform:rotate(180deg)}.filter-section-content{padding:0 20px 16px;animation:sectionSlideDown .2s ease-out}@keyframes sectionSlideDown{0%{opacity:0;max-height:0}to{opacity:1;max-height:300px}}.filter-checkbox-group{display:flex;flex-direction:column;gap:0;max-height:200px;overflow-y:auto}.filter-checkbox-item{display:flex;flex-direction:row;align-items:center;gap:8px;padding:8px 12px;cursor:pointer;transition:all .2s ease;font-size:13px;border-radius:0;border-bottom:1px solid var(--color-border);width:100%;min-height:36px}.filter-checkbox-item:hover{background:color-mix(in srgb,var(--color-border) 15%,transparent)}.filter-checkbox-item:last-child{border-bottom:none}.filter-checkbox-item.select-all{font-weight:600;border-bottom:2px solid var(--color-border);margin-bottom:4px;background:var(--color-surface);padding:10px 12px}.filter-checkbox-item input[type=checkbox]{margin:0;cursor:pointer;flex-shrink:0}.filter-checkbox-item.color-item{display:flex!important;flex-direction:row!important;align-items:center;gap:10px;justify-content:flex-start;width:100%}.color-swatch{width:18px;height:18px;border-radius:3px;border:1px solid var(--color-border);box-shadow:inset 0 1px 2px #0000001a;flex-shrink:0;display:inline-block}.color-hex-only{flex:1;font-size:var(--text-sm);color:var(--color-text-primary);font-family:monospace;font-weight:500;text-transform:uppercase;display:inline-block}.filter-count-badge{background:var(--color-primary);color:#fff;border-radius:var(--radius-full);min-width:18px;height:18px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;margin-left:4px}@media (max-width: 768px){.filter-dropdown{position:fixed;top:0;left:0;right:0;bottom:0;max-width:none;max-height:none;border-radius:0;z-index:1050}.filter-dropdown-header{border-radius:0;padding:var(--space-4)}.filter-sections{padding:var(--space-3)}.filter-section-header{padding:16px 20px}.filter-checkbox-item{padding:12px 16px;font-size:14px;min-height:44px}.color-swatch{width:20px;height:20px}}.ai-analysis-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000c;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;z-index:2000;padding:var(--space-4);animation:overlayFadeIn .3s ease-out;overflow:hidden}body.modal-open{overflow:hidden}@keyframes overlayFadeIn{0%{opacity:0}to{opacity:1}}.ai-analysis-container{background:var(--color-card-background);border-radius:var(--radius-xl);max-width:420px;width:100%;max-height:90vh;box-shadow:0 25px 50px #0006;position:relative;animation:containerSlideIn .5s ease-out;display:flex;flex-direction:column;overflow:hidden}@keyframes containerSlideIn{0%{opacity:0;transform:translateY(50px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.analysis-header{padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--color-border);background:var(--color-surface);border-radius:var(--radius-xl) var(--radius-xl) 0 0;position:sticky;top:0;z-index:10;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.header-content{display:flex;justify-content:space-between;align-items:center}.header-left{display:flex;align-items:center;gap:var(--space-4);flex:1}.item-counter{font-size:var(--text-base);color:var(--color-text-primary);font-weight:500;min-width:50px;text-align:center}.navigation-controls{display:flex;align-items:center;gap:var(--space-2)}.nav-btn{background:var(--color-surface);border:1px solid var(--color-border);color:var(--color-text-secondary);cursor:pointer;padding:0;border-radius:var(--radius-md);transition:all .2s ease;display:flex;align-items:center;justify-content:center;width:36px;height:36px}.nav-btn:hover:not(:disabled){background:var(--color-primary);color:#fff;border-color:var(--color-primary);transform:translateY(-1px)}.nav-btn:disabled{opacity:.3;cursor:not-allowed;background:var(--color-surface)}.nav-btn svg{width:20px;height:20px}.quantity-controls-modal{display:flex;align-items:center;gap:var(--space-2)}.quantity-btn-modal{width:32px;height:32px;border-radius:var(--radius-md);border:1px solid var(--color-border);background:var(--color-card-background);color:var(--color-text-primary);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;font-size:var(--text-base);font-weight:600}.quantity-btn-modal:hover:not(:disabled){background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.quantity-btn-modal:disabled{opacity:.5;cursor:not-allowed}.quantity-display-modal{min-width:40px;text-align:center;font-size:var(--text-base);font-weight:600;color:var(--color-text-primary)}.modal-title{margin:0;font-size:var(--text-xl);font-weight:600;color:var(--color-text-primary)}.close-btn{background:var(--color-surface);border:1px solid var(--color-border);color:var(--color-text-secondary);cursor:pointer;padding:0;border-radius:var(--radius-md);transition:all .2s ease;display:flex;align-items:center;justify-content:center;width:36px;height:36px}.close-btn:hover{background:var(--color-error);color:#fff;border-color:var(--color-error);transform:translateY(-1px)}.close-btn svg{width:20px;height:20px}.analysis-content{flex:1;padding:var(--space-2);overflow-y:auto;padding-bottom:80px}.main-layout{display:flex;justify-content:center;width:100%}.image-section{display:flex;flex-direction:column;gap:var(--space-2);width:100%}.image-section img{width:100%;min-height:100px;max-height:450px;object-fit:cover;border-radius:var(--radius-lg);border:1px solid var(--color-border)}.summary-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-2);display:flex;flex-direction:column;gap:var(--space-1)}.summary-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2)}.summary-item,.summary-section{display:flex;flex-direction:column;gap:var(--space-1)}.summary-label{font-size:var(--text-sm);font-weight:600;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em}.summary-value{font-size:var(--text-base);font-weight:500;color:var(--color-text-primary);text-transform:capitalize}.color-palette-summary{display:flex;gap:var(--space-2);flex-wrap:wrap}.color-item-summary{display:flex;flex-direction:column;align-items:center;gap:var(--space-1)}.color-dot-summary{width:24px;height:24px;border-radius:50%;border:2px solid white;box-shadow:0 2px 4px #0000001a;cursor:pointer;transition:transform .2s ease}.color-dot-summary:hover{transform:scale(1.1)}.color-percentage{font-size:var(--text-xs);font-weight:500;color:var(--color-text-secondary)}.tag-list-summary{display:flex;gap:var(--space-1);flex-wrap:wrap}.tag-summary{padding:var(--space-1) var(--space-2);background:var(--color-card-background);color:var(--color-text-primary);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:500;text-transform:capitalize;white-space:nowrap;margin-right:var(--space-1);margin-bottom:var(--space-1)}.summary-divider{height:1px;background:var(--color-border);margin:var(--space-1) 0}.tips-list-summary{display:flex;flex-direction:column;gap:var(--space-1)}.tip-item-summary{display:flex;align-items:flex-start;gap:var(--space-1);padding:var(--space-1);font-size:var(--text-xs);color:var(--color-text-secondary);line-height:1.2}.tip-item-summary .tip-icon{font-size:var(--text-xs);flex-shrink:0;margin-top:1px}.analysis-actions{display:flex;justify-content:flex-end;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-top:1px solid var(--color-border);background:var(--color-surface);border-radius:0 0 var(--radius-xl) var(--radius-xl);position:sticky;bottom:0;z-index:10;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 -4px 12px #0000001a}.reject-btn,.accept-btn{display:flex;align-items:center;gap:var(--space-1);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:500;cursor:pointer;transition:all .2s ease;border:1px solid}.reject-btn{background:var(--color-card-background);color:var(--color-text-secondary);border-color:var(--color-border)}.reject-btn:hover{background:var(--color-surface);color:var(--color-text-primary);border-color:var(--color-border)}.accept-btn{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.accept-btn:hover{background:var(--color-primary-hover);border-color:var(--color-primary-hover)}.btn-icon{width:16px;height:16px}.animate-in{animation:slideInUp .4s ease-out}@keyframes slideInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){.ai-analysis-container{max-width:100%;max-height:95vh;margin:var(--space-2)}.analysis-header{padding:var(--space-2) var(--space-3)}.header-content{flex-wrap:wrap;gap:var(--space-2)}.header-left{flex:1;gap:var(--space-2)}.modal-title{font-size:var(--text-lg)}.item-counter{font-size:var(--text-sm);min-width:40px}.navigation-controls{gap:var(--space-1)}.nav-btn{width:32px;height:32px}.nav-btn svg{width:18px;height:18px}.close-btn{width:32px;height:32px}.close-btn svg{width:18px;height:18px}.analysis-content{padding:var(--space-2);padding-bottom:75px}.image-section{max-width:100%}.image-section img{min-height:100px;max-height:300px}.summary-card{padding:var(--space-2)}.summary-row{grid-template-columns:1fr;gap:var(--space-1)}.color-palette-summary{justify-content:center;gap:var(--space-1)}.color-dot-summary{width:20px;height:20px}.color-percentage{font-size:var(--text-xs)}.tag-list-summary{justify-content:center}.tag-summary{font-size:var(--text-xs);padding:var(--space-1)}.quantity-controls-modal{gap:var(--space-1)}.quantity-btn-modal{width:28px;height:28px;font-size:var(--text-sm)}.quantity-display-modal{min-width:32px;font-size:var(--text-sm)}.tips-list-summary{gap:var(--space-1)}.tip-item-summary{font-size:var(--text-xs);line-height:1.3}.analysis-actions{padding:var(--space-2) var(--space-3);flex-direction:column-reverse;gap:var(--space-2)}.reject-btn,.accept-btn{justify-content:center;padding:var(--space-3) var(--space-4);font-size:var(--text-base);width:100%}}@media (max-width: 480px){.ai-analysis-overlay{padding:var(--space-1)}.ai-analysis-container{margin:var(--space-1);max-height:98vh}.analysis-header{padding:var(--space-2)}.header-content{flex-direction:column;align-items:stretch;gap:var(--space-2)}.header-left{order:1}.modal-title{font-size:var(--text-base);text-align:center}.item-counter{text-align:center;margin-top:var(--space-1)}.analysis-content{padding:var(--space-2);padding-bottom:70px}.image-section img{min-height:100px;max-height:250px}.summary-card{padding:var(--space-2)}.summary-section{gap:var(--space-1)}.summary-label{font-size:var(--text-xs)}.summary-value{font-size:var(--text-sm)}.color-dot-summary{width:18px;height:18px}.quantity-btn-modal{width:24px;height:24px;font-size:var(--text-xs)}.quantity-display-modal{min-width:28px;font-size:var(--text-xs)}.analysis-actions{padding:var(--space-2)}.reject-btn,.accept-btn{padding:var(--space-2) var(--space-3);font-size:var(--text-sm)}}.clothing-analysis-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.clothing-analysis-modal{background:var(--color-card-background);border-radius:var(--radius-lg);padding:var(--space-8);max-width:480px;width:90%;text-align:center;box-shadow:0 20px 50px #0000004d;animation:slideUp .4s ease}.loading-content{display:flex;flex-direction:column;align-items:center;gap:var(--space-4)}.loading-icon{width:80px;height:80px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--color-primary),#8b5cf6);border-radius:50%;margin-bottom:var(--space-2)}.sparkles-icon{width:40px;height:40px;color:#fff}.rotating{animation:rotate 2s linear infinite}.loading-content h2{margin:0;color:var(--color-text-primary);font-size:var(--text-2xl);font-weight:600}.loading-content p{margin:0;color:var(--color-text-secondary);font-size:var(--text-base);line-height:1.5}.loading-steps{display:flex;flex-direction:column;gap:var(--space-3);width:100%;max-width:300px}.step{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2);border-radius:var(--radius-md);transition:all .3s ease}.step.active{background:var(--color-surface);transform:translate(4px)}.step-dot{width:12px;height:12px;border-radius:50%;background:var(--color-border);transition:all .3s ease;flex-shrink:0}.step.active .step-dot{background:var(--color-primary);box-shadow:0 0 0 3px rgba(var(--color-primary-rgb),.2);animation:pulse-dot 1.5s ease-in-out infinite}.step span{color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:500;transition:color .3s ease}.step.active span{color:var(--color-text-primary);font-weight:600}.loading-bar{width:100%;height:6px;background:var(--color-surface);border-radius:3px;overflow:hidden;margin:var(--space-2) 0}.loading-progress{height:100%;background:linear-gradient(90deg,var(--color-primary),#8b5cf6,var(--color-primary));background-size:200% 100%;border-radius:3px;animation:loadingProgress 2s ease-in-out infinite}.loading-note{font-size:var(--text-sm)!important;color:var(--color-text-muted)!important;font-style:italic}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pulse-dot{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.2);opacity:.8}}@keyframes loadingProgress{0%{background-position:-200% 0;width:0%}50%{width:80%}to{background-position:200% 0;width:100%}}@media (max-width: 640px){.clothing-analysis-modal{padding:var(--space-6);max-width:95%}.loading-content h2{font-size:var(--text-xl)}.loading-icon{width:60px;height:60px}.sparkles-icon{width:30px;height:30px}.loading-steps{max-width:250px}}.add-to-collection-modal{max-width:500px;width:95%}.item-name{padding:.75rem 1rem;background:var(--color-surface);border-radius:8px;margin-bottom:1.5rem}.item-name p{margin:0;font-size:.95rem;color:var(--color-text-secondary)}.error-message{padding:.75rem 1rem;background:#ef44441a;border:1px solid rgba(239,68,68,.2);border-radius:8px;margin-bottom:1rem}.error-message p{margin:0;color:var(--color-error);font-size:.9rem}.collections-list{min-height:200px}.loading-state,.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;text-align:center}.empty-icon{width:48px;height:48px;color:var(--color-text-muted);margin-bottom:1rem}.empty-state small{color:var(--color-text-muted);margin-top:.5rem}.collections-grid{display:grid;gap:.75rem}.collection-option{display:flex;align-items:center;gap:1rem;padding:1rem;border:1px solid var(--color-border);border-radius:12px;background:var(--color-surface);cursor:pointer;transition:all .2s ease;text-align:left;width:100%}.collection-option:hover:not(:disabled){background:var(--color-card-background);border-color:var(--color-primary);transform:translateY(-1px);box-shadow:0 4px 12px #0000001a}.collection-option:disabled{opacity:.6;cursor:not-allowed}.collection-icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:var(--color-primary);color:#fff;border-radius:8px;flex-shrink:0}.collection-icon svg{width:20px;height:20px}.collection-info{flex:1;min-width:0}.collection-info h3{margin:0 0 .25rem;font-size:1rem;font-weight:600;color:var(--color-text-primary)}.collection-info p{margin:0;font-size:.85rem;color:var(--color-text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.submitting-indicator{font-size:.85rem;color:var(--color-primary);font-weight:500}@media (max-width: 768px){.add-to-collection-modal{width:100%;max-width:none;height:100vh;max-height:none;border-radius:0;margin:0}.modal-content{border-radius:0;height:100vh;display:flex;flex-direction:column}.collections-list{flex:1;overflow-y:auto}.modal-actions{position:sticky;bottom:0;background:var(--color-card-background);padding:1rem;margin:0 -2rem -2rem;border-top:1px solid var(--color-border)}}.create-collection-modal{max-width:500px;width:95%}.create-collection-form{display:flex;flex-direction:column;gap:1.5rem}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-label{font-size:.95rem;font-weight:600;color:var(--color-text-primary)}.required{color:var(--color-error);margin-left:.25rem}.optional{color:var(--color-text-muted);font-weight:400;font-size:.85rem;margin-left:.5rem}.form-input,.form-select,.form-textarea{padding:.75rem 1rem;border:1px solid var(--color-border);border-radius:8px;background:var(--color-surface);color:var(--color-text-primary);font-size:.95rem;transition:all .2s ease}.form-input:focus,.form-select:focus,.form-textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #3b82f61a;background:var(--color-card-background)}.form-input::placeholder,.form-textarea::placeholder{color:var(--color-text-muted)}.form-textarea{resize:vertical;min-height:80px;font-family:inherit;line-height:1.5}.form-select{cursor:pointer;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");background-position:right .75rem center;background-repeat:no-repeat;background-size:1.5em 1.5em;padding-right:2.5rem;-webkit-appearance:none;-moz-appearance:none;appearance:none}.modal-actions{display:flex;justify-content:flex-end;gap:.75rem;padding-top:1rem;margin-top:.5rem;border-top:1px solid var(--color-border)}.btn-primary,.btn-secondary{padding:.75rem 1.5rem;border-radius:8px;font-weight:600;font-size:.95rem;cursor:pointer;transition:all .2s ease;border:2px solid transparent}.btn-primary{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.btn-primary:hover:not(:disabled){background:var(--color-primary-hover);border-color:var(--color-primary-hover);transform:translateY(-1px);box-shadow:0 4px 12px #3b82f64d}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary:hover:not(:disabled){background:var(--color-card-background);border-color:var(--color-primary)}.btn-secondary:disabled{opacity:.5;cursor:not-allowed}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:2000;animation:fadeIn .2s ease}.modal-content{background:var(--color-card-background);border-radius:16px;padding:2rem;box-shadow:0 20px 60px #0000004d;animation:slideUp .3s ease;max-height:90vh;overflow-y:auto}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.modal-header h2{margin:0;font-size:1.5rem;font-weight:600;color:var(--color-text-primary)}.close-button{background:none;border:none;cursor:pointer;padding:.5rem;color:var(--color-text-secondary);border-radius:50%;transition:all .2s ease}.close-button:hover{background:var(--color-surface);color:var(--color-text-primary)}.close-icon{width:20px;height:20px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}@media (max-width: 768px){.create-collection-modal{width:100%;max-width:none;height:100vh;max-height:none;border-radius:0;margin:0}.modal-content{border-radius:0;height:100vh;display:flex;flex-direction:column}.create-collection-form{flex:1;overflow-y:auto}.modal-actions{position:sticky;bottom:0;background:var(--color-card-background);padding:1rem;margin:0 -2rem -2rem;border-top:1px solid var(--color-border)}}.edit-collection-modal{max-width:500px;width:90vw}.edit-collection-modal .modal-header{display:flex;align-items:center;justify-content:space-between;padding-bottom:1rem;border-bottom:1px solid var(--color-border);margin-bottom:1.5rem}.edit-collection-modal .modal-header h2{margin:0;font-size:1.5rem;font-weight:600;color:var(--color-text-primary)}.close-button{background:none;border:none;padding:.5rem;cursor:pointer;border-radius:6px;transition:background-color .2s ease;display:flex;align-items:center;justify-content:center}.close-button:hover{background:var(--color-surface)}.close-icon{width:20px;height:20px;color:var(--color-text-secondary)}.error-message{background:#fee2e2;border:1px solid #fecaca;border-radius:8px;padding:.75rem 1rem;margin-bottom:1rem}.error-message p{margin:0;color:#dc2626;font-size:.9rem}.form-group{margin-bottom:1.5rem}.form-group label{display:block;margin-bottom:.5rem;font-weight:500;color:var(--color-text-primary);font-size:.9rem}.form-group input,.form-group textarea{width:100%;padding:.75rem;border:1px solid var(--color-border);border-radius:8px;font-size:1rem;font-family:inherit;background:var(--color-background);color:var(--color-text-primary);transition:border-color .2s ease,box-shadow .2s ease;resize:vertical;min-height:auto}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #3b82f61a}.form-group input:disabled,.form-group textarea:disabled{background:var(--color-surface);color:var(--color-text-muted);cursor:not-allowed}.form-group textarea{min-height:80px}.modal-actions{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding-top:1.5rem;border-top:1px solid var(--color-border)}.action-group{display:flex;gap:.75rem}.btn-primary,.btn-secondary,.btn-danger,.btn-danger-outline{padding:.75rem 1.5rem;border-radius:8px;font-weight:500;font-size:.9rem;cursor:pointer;transition:all .2s ease;border:1px solid transparent;display:inline-flex;align-items:center;justify-content:center;min-width:120px}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover:not(:disabled){background:var(--color-primary-hover);transform:translateY(-1px);box-shadow:0 4px 12px #3b82f64d}.btn-primary:disabled{background:var(--color-text-muted);cursor:not-allowed;transform:none;box-shadow:none}.btn-secondary{background:var(--color-surface);color:var(--color-text-primary);border-color:var(--color-border)}.btn-secondary:hover:not(:disabled){background:var(--color-background);border-color:var(--color-text-muted)}.btn-secondary:disabled{background:var(--color-surface);color:var(--color-text-muted);cursor:not-allowed}.btn-danger{background:#dc2626;color:#fff}.btn-danger:hover:not(:disabled){background:#b91c1c;transform:translateY(-1px);box-shadow:0 4px 12px #dc26264d}.btn-danger:disabled{background:var(--color-text-muted);cursor:not-allowed;transform:none;box-shadow:none}.btn-danger-outline{background:transparent;color:#dc2626;border-color:#dc2626}.btn-danger-outline:hover:not(:disabled){background:#fee2e2;border-color:#b91c1c;color:#b91c1c}.btn-danger-outline:disabled{color:var(--color-text-muted);border-color:var(--color-text-muted);cursor:not-allowed}.delete-confirmation{text-align:center;padding:1rem 0}.delete-confirmation p{margin:0 0 1rem;color:var(--color-text-primary);line-height:1.5}.delete-warning{color:#dc2626!important;font-size:.9rem!important;background:#fee2e2;padding:.75rem;border-radius:6px;border:1px solid #fecaca}.delete-confirmation .modal-actions{justify-content:center;border-top:none;padding-top:1.5rem}@media (max-width: 600px){.edit-collection-modal{width:95vw;margin:1rem}.modal-actions{flex-direction:column;gap:.75rem}.action-group{width:100%;justify-content:stretch}.btn-danger-outline{order:1;width:100%}.delete-confirmation .modal-actions{flex-direction:row;justify-content:center}.btn-primary,.btn-secondary,.btn-danger,.btn-danger-outline{flex:1;min-width:auto}}.collections-page{height:100vh;display:flex;flex-direction:column;background:var(--color-background);color:var(--color-text-primary);overflow-y:auto;padding:2rem}.collections-header{display:flex;flex-direction:column;gap:1rem;margin-bottom:2rem;max-width:800px}.collections-header h1{margin:0;font-size:2.5rem;font-weight:700;color:var(--color-text-primary)}.collections-header p{margin:0;font-size:1.1rem;color:var(--color-text-secondary);line-height:1.5}.create-collection-btn{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:var(--color-primary);color:#fff;border:none;border-radius:12px;font-weight:600;cursor:pointer;transition:all .2s ease;align-self:flex-start;box-shadow:0 4px 12px #3b82f64d}.create-collection-btn:hover{background:var(--color-primary-hover);transform:translateY(-1px);box-shadow:0 6px 16px #3b82f666}.btn-icon{width:20px;height:20px}.collections-loading,.collections-error{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;text-align:center;color:var(--color-text-secondary)}.loading-icon{width:48px;height:48px;color:var(--color-primary);margin-bottom:1rem;animation:spin 2s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.retry-button{margin-top:1rem;padding:.5rem 1rem;background:var(--color-primary);color:#fff;border:none;border-radius:6px;cursor:pointer;transition:background .2s ease}.retry-button:hover{background:var(--color-primary-hover)}.collections-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;text-align:center;padding:4rem 2rem}.empty-icon{width:96px;height:96px;color:var(--color-text-muted);margin-bottom:1.5rem;opacity:.5}.collections-empty h2{margin:0 0 .5rem;font-size:1.8rem;font-weight:600;color:var(--color-text-primary)}.collections-empty p{margin:0 0 2rem;font-size:1.1rem;color:var(--color-text-secondary);line-height:1.5}.create-first-collection-btn{display:flex;align-items:center;gap:.5rem;padding:1rem 2rem;background:var(--color-primary);color:#fff;border:none;border-radius:12px;font-weight:600;font-size:1.1rem;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 12px #3b82f64d}.create-first-collection-btn:hover{background:var(--color-primary-hover);transform:translateY(-1px);box-shadow:0 6px 16px #3b82f666}.collections-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.5rem;padding:0}.collection-card{background:var(--color-card-background);border:1px solid var(--color-border);border-radius:16px;padding:1.5rem;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 8px var(--color-shadow);position:relative;overflow:hidden}.collection-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px var(--color-shadow);border-color:var(--color-primary)}.collection-card-header{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem;position:relative}.collection-icon{width:24px;height:24px;color:var(--color-primary);flex-shrink:0}.collection-name{margin:0;font-size:1.3rem;font-weight:600;color:var(--color-text-primary);line-height:1.3;flex:1}.collection-edit-btn{background:none;border:none;padding:.5rem;cursor:pointer;border-radius:6px;transition:all .2s ease;opacity:0;color:var(--color-text-muted)}.collection-card:hover .collection-edit-btn{opacity:1}.collection-edit-btn:hover{background:var(--color-surface);color:var(--color-primary)}.edit-icon{width:18px;height:18px}.collection-description{margin:0 0 1.5rem;font-size:.95rem;color:var(--color-text-secondary);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.collection-stats{display:flex;gap:1.5rem;margin-bottom:1rem}.stat-item{display:flex;flex-direction:column;align-items:center;gap:.25rem}.stat-number{font-size:1.5rem;font-weight:700;color:var(--color-primary);line-height:1}.stat-label{font-size:.85rem;color:var(--color-text-secondary);text-transform:uppercase;font-weight:500;letter-spacing:.5px}.collection-card-footer{display:flex;justify-content:space-between;align-items:center;padding-top:1rem;border-top:1px solid var(--color-border);margin-top:auto}.collection-type{font-size:.8rem;color:var(--color-text-muted);text-transform:capitalize;background:var(--color-surface);padding:.25rem .5rem;border-radius:6px;font-weight:500}.view-icon{width:18px;height:18px;color:var(--color-text-muted);opacity:.6;transition:opacity .2s ease}.collection-card:hover .view-icon{opacity:1}.collection-detail{flex:1;display:flex;flex-direction:column;gap:2rem}.collection-detail-header{display:flex;flex-direction:column;gap:1rem}.collection-title-section{display:flex;align-items:center;justify-content:space-between;gap:1rem}.edit-collection-btn{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:var(--color-surface);color:var(--color-text-primary);border:1px solid var(--color-border);border-radius:8px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .2s ease}.edit-collection-btn:hover{background:var(--color-background);border-color:var(--color-primary);color:var(--color-primary)}.back-button{background:none;border:none;color:var(--color-primary);font-size:.95rem;cursor:pointer;transition:color .2s ease;align-self:flex-start;padding:.5rem 0}.back-button:hover{color:var(--color-primary-hover);text-decoration:underline}.collection-detail h1{margin:0;font-size:2.2rem;font-weight:700;color:var(--color-text-primary)}.collection-detail .collection-description{margin:0;font-size:1.1rem;color:var(--color-text-secondary);line-height:1.5}.collection-detail .collection-stats{display:flex;gap:3rem;padding:1.5rem;background:var(--color-surface);border-radius:12px;border:1px solid var(--color-border);align-self:flex-start}.collection-detail .stat-item{gap:.5rem}.collection-detail .stat-number{font-size:2rem}.collection-detail .stat-label{font-size:.9rem}.collection-content{flex:1;display:flex;flex-direction:column;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:16px;overflow:hidden}.content-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;padding:4rem 2rem;text-align:center}.placeholder-icon{width:64px;height:64px;color:var(--color-text-muted);margin-bottom:1rem;opacity:.5}.content-placeholder p{margin:0 0 .5rem;font-size:1.1rem;color:var(--color-text-secondary)}.content-placeholder small{font-size:.9rem;color:var(--color-text-muted)}.collection-items{flex:1;padding:2rem}.collection-items h2{margin:0 0 1.5rem;font-size:1.6rem;font-weight:600;color:var(--color-text-primary)}.items-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem}.collection-item-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:12px;overflow:hidden;transition:all .2s ease;box-shadow:0 2px 8px #0000000f}.collection-item-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px #0000001f;border-color:var(--color-primary)}.item-image{width:100%;height:200px;overflow:hidden;position:relative;background:var(--color-background)}.item-image img{width:100%;height:100%;object-fit:cover;display:block}.item-info{padding:1rem;display:flex;flex-direction:column;gap:.5rem}.item-info h3{margin:0;font-size:1.1rem;font-weight:600;color:var(--color-text-primary);line-height:1.3}.item-description{margin:0;font-size:.9rem;color:var(--color-text-secondary);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.item-brand{margin:0;font-size:.85rem;color:var(--color-text-muted);font-weight:500}.item-meta{display:flex;align-items:center;justify-content:space-between;margin-top:.5rem;padding-top:.75rem;border-top:1px solid var(--color-border)}.item-type{font-size:.8rem;color:var(--color-text-muted);text-transform:capitalize;background:var(--color-background);padding:.25rem .5rem;border-radius:6px;font-weight:500}.item-colors{display:flex;gap:.25rem}.color-dot{width:18px;height:18px;border-radius:50%;border:2px solid var(--color-surface);box-shadow:0 1px 3px #0003;cursor:pointer;transition:transform .2s ease}.color-dot:hover{transform:scale(1.1)}@media (max-width: 768px){.collections-page{padding:1rem}.collections-grid{grid-template-columns:1fr;gap:1rem}.collections-header h1{font-size:2rem}.collection-stats{gap:1rem}.collection-detail .collection-stats{gap:2rem}.collection-items{padding:1rem}.items-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1rem}.item-image{height:160px}}.login-container{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--color-background);padding:var(--space-4)}.login-card{background:var(--color-card-background);border-radius:var(--radius-xl);box-shadow:0 20px 40px var(--color-shadow);max-width:480px;width:100%;overflow:hidden;border:1px solid var(--color-border)}.login-header{padding:var(--space-8) var(--space-6) var(--space-4);text-align:center;background:var(--color-surface);border-bottom:1px solid var(--color-border)}.login-title{margin:0;font-size:var(--text-4xl);font-weight:700;color:var(--color-text-primary);letter-spacing:-.02em}.login-subtitle{margin:var(--space-2) 0 0;font-size:var(--text-lg);color:var(--color-text-secondary)}.login-content{padding:var(--space-6)}.login-illustration{display:flex;justify-content:center;margin-bottom:var(--space-6)}.color-wheel{width:120px;height:120px;border-radius:50%;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;overflow:hidden;transform:rotate(45deg);box-shadow:0 8px 24px #0000001a}.season-segment{width:100%;height:100%;transition:transform .3s ease}.season-segment.spring{background:linear-gradient(135deg,#ffe4e1,#ffb6c1)}.season-segment.summer{background:linear-gradient(135deg,#e6e6fa,#b0e0e6)}.season-segment.autumn{background:linear-gradient(135deg,#deb887,peru)}.season-segment.winter{background:linear-gradient(135deg,#789,#4682b4)}.login-description{text-align:center;margin-bottom:var(--space-6)}.login-description p{margin:0;color:var(--color-text-secondary);font-size:var(--text-base);line-height:1.6}.login-actions{display:flex;flex-direction:column;align-items:center;gap:var(--space-4)}.login-terms{margin:0;font-size:var(--text-xs);color:var(--color-text-muted);text-align:center;max-width:280px}@media (max-width: 640px){.login-container{padding:var(--space-2)}.login-card{max-width:100%}.login-header{padding:var(--space-6) var(--space-4) var(--space-3)}.login-title{font-size:var(--text-3xl)}.login-content{padding:var(--space-4)}.color-wheel{width:100px;height:100px}}.error-toast-container{position:fixed;top:80px;right:20px;z-index:9999;display:flex;flex-direction:column;gap:.75rem;max-width:400px;pointer-events:none}.error-toast{background:var(--color-card-background);border:1px solid var(--color-border);border-radius:8px;box-shadow:0 10px 25px #0000001a;pointer-events:all;transform:translate(100%);opacity:0;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.error-toast.visible{transform:translate(0);opacity:1}.error-toast.exiting{transform:translate(100%);opacity:0;transition:all .15s ease-in}.toast-content{padding:1rem;display:flex;align-items:flex-start;gap:.75rem;position:relative}.toast-icon{font-size:1.2rem;flex-shrink:0;margin-top:.1rem}.toast-text{flex:1;min-width:0}.toast-title{font-weight:600;color:var(--color-text-primary);font-size:.95rem;line-height:1.3;margin-bottom:.25rem}.toast-message{color:var(--color-text-secondary);font-size:.85rem;line-height:1.4;word-wrap:break-word}.toast-action{background:none;border:1px solid var(--color-primary);color:var(--color-primary);padding:.4rem .8rem;border-radius:4px;font-size:.8rem;font-weight:500;cursor:pointer;transition:all .2s ease;margin-right:.5rem;flex-shrink:0}.toast-action:hover{background:var(--color-primary);color:#fff}.toast-dismiss{background:none;border:none;color:var(--color-text-muted);font-size:1.3rem;cursor:pointer;padding:0;line-height:1;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .2s ease;flex-shrink:0;margin-top:-.1rem}.toast-dismiss:hover{background:var(--color-border);color:var(--color-text-primary)}.toast-progress{position:absolute;bottom:0;left:0;height:3px;background:var(--color-primary);animation:progressShrink linear;transform-origin:left}@keyframes progressShrink{0%{width:100%}to{width:0%}}.toast-error{border-left:4px solid #ef4444}.toast-error .toast-progress{background:#ef4444}.toast-warning{border-left:4px solid #f59e0b}.toast-warning .toast-progress{background:#f59e0b}.toast-success{border-left:4px solid #10b981}.toast-success .toast-progress{background:#10b981}.toast-info{border-left:4px solid #3b82f6}.toast-info .toast-progress{background:#3b82f6}@media (max-width: 768px){.error-toast-container{top:70px;right:10px;left:10px;max-width:none}.error-toast{margin:0}.toast-content{padding:.85rem}.toast-title{font-size:.9rem}.toast-message{font-size:.8rem}.toast-action{padding:.35rem .7rem;font-size:.75rem}}@media (prefers-color-scheme: dark){.error-toast{box-shadow:0 10px 25px #0000004d}}@media (prefers-reduced-motion: reduce){.error-toast{transition:opacity .2s ease;transform:none!important}.error-toast.visible{opacity:1}.error-toast.exiting{opacity:0}.toast-progress{animation:none;display:none}}.profile-error-boundary{display:flex;align-items:center;justify-content:center;min-height:300px;padding:2rem;background:var(--color-card-background);border:1px solid var(--color-border);border-radius:12px;margin:1rem 0}.error-content{text-align:center;max-width:500px;width:100%}.error-icon{font-size:3rem;margin-bottom:1rem;opacity:.8}.error-title{color:var(--color-text-primary);font-size:1.5rem;font-weight:600;margin:0 0 1rem}.error-message{color:var(--color-text-secondary);font-size:1rem;line-height:1.5;margin:0 0 1.5rem}.error-guidance{background:color-mix(in srgb,var(--color-primary) 8%,var(--color-surface));border:1px solid color-mix(in srgb,var(--color-primary) 20%,transparent);border-radius:8px;padding:1rem;margin:1rem 0;text-align:left}.error-guidance p{margin:0;font-size:.9rem;line-height:1.4;color:var(--color-text-primary)}.error-actions{display:flex;flex-direction:column;gap:.75rem;margin:1.5rem 0;align-items:center}.error-btn{padding:.75rem 1.5rem;border-radius:8px;font-size:.95rem;font-weight:500;cursor:pointer;transition:all .2s ease;border:none;min-width:140px;display:flex;align-items:center;justify-content:center;gap:.5rem}.retry-btn{background:var(--color-primary);color:#fff}.retry-btn:hover{background:color-mix(in srgb,var(--color-primary) 90%,black);transform:translateY(-1px)}.reset-btn{background:var(--color-button-secondary);color:var(--color-text-primary);border:1px solid var(--color-border)}.reset-btn:hover{background:var(--color-button-secondary-hover);border-color:var(--color-border-hover)}.reload-btn{background:linear-gradient(135deg,#f59e0b,#f97316);color:#fff}.reload-btn:hover{background:linear-gradient(135deg,#d97706,#ea580c);transform:translateY(-1px)}.error-details{margin:1.5rem 0;text-align:left;background:var(--color-surface);border:1px solid var(--color-border);border-radius:6px;overflow:hidden}.error-details summary{padding:.75rem 1rem;background:var(--color-border);cursor:pointer;font-weight:500;color:var(--color-text-secondary);-webkit-user-select:none;user-select:none}.error-details summary:hover{background:var(--color-border-hover)}.error-stack{padding:1rem}.error-stack p{margin:0 0 .5rem;font-size:.9rem;color:var(--color-text-primary)}.error-trace,.component-stack pre{background:var(--color-card-background);border:1px solid var(--color-border);border-radius:4px;padding:.75rem;margin:.5rem 0;font-size:.8rem;line-height:1.4;overflow-x:auto;white-space:pre-wrap;word-break:break-word}.error-trace code,.component-stack code{color:var(--color-text-muted);font-family:SF Mono,Monaco,Inconsolata,Roboto Mono,monospace}.component-stack{margin-top:1rem}.error-support{margin-top:2rem;padding-top:1rem;border-top:1px solid var(--color-border)}.support-text{font-size:.9rem;color:var(--color-text-muted);margin:0}.support-link{color:var(--color-primary);text-decoration:none;font-weight:500;margin-left:.5rem}.support-link:hover{text-decoration:underline}@media (max-width: 768px){.profile-error-boundary{padding:1rem;min-height:250px}.error-content{max-width:100%}.error-icon{font-size:2.5rem}.error-title{font-size:1.3rem}.error-message{font-size:.95rem}.error-actions{flex-direction:column;gap:.5rem}.error-btn{width:100%;max-width:280px}.error-guidance{padding:.75rem}.error-guidance p{font-size:.85rem}}.profile-error-boundary{animation:errorFadeIn .3s ease-out}@keyframes errorFadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}