:root{--primary-color-light: #5037E4;--primary-hover-color-light: #402CBF;--background-color-light: #F8F9FA;--surface-color-light: #FFFFFF;--text-primary-light: #212121;--text-secondary-light: #667085;--border-color-light: #D0D5DD;--success-color-light: #10B981;--warning-color-light: #F59E0B;--danger-color-light: #EF4444;--info-color-light: #E83984;--primary-color-dark: #7A67FF;--primary-hover-color-dark: #9180FF;--background-color-dark: #1A1D2D;--surface-color-dark: #2A2F45;--text-primary-dark: #F5F5F5;--text-secondary-dark: #AAB0B9;--border-color-dark: #3D435D;--success-color-dark: #34D399;--warning-color-dark: #FBBF24;--danger-color-dark: #F87171;--info-color-dark: #F06292;--font-family: "Inter", sans-serif}body{--background-color: var(--background-color-light);--surface-color: var(--surface-color-light);--primary-color: var(--primary-color-light);--primary-hover-color: var(--primary-hover-color-light);--text-primary: var(--text-primary-light);--text-secondary: var(--text-secondary-light);--border-color: var(--border-color-light);--success-color: var(--success-color-light);--warning-color: var(--warning-color-light);--danger-color: var(--danger-color-light);--info-color: var(--info-color-light);transition:background-color .3s ease,color .3s ease}body.dark{--background-color: var(--background-color-dark);--surface-color: var(--surface-color-dark);--primary-color: var(--primary-color-dark);--primary-hover-color: var(--primary-hover-color-dark);--text-primary: var(--text-primary-dark);--text-secondary: var(--text-secondary-dark);--border-color: var(--border-color-dark);--success-color: var(--success-color-dark);--warning-color: var(--warning-color-dark);--danger-color: var(--danger-color-dark);--info-color: var(--info-color-dark)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);background-color:var(--background-color);color:var(--text-primary);line-height:1.5;-webkit-font-smoothing:antialiased}.app-container{display:grid;--sidebar-width: 260px;grid-template-columns:var(--sidebar-width) 1fr;height:100vh;width:100vw;overflow:hidden;transition:grid-template-columns .3s cubic-bezier(.4,0,.2,1)}.app-container.sidebar-collapsed{--sidebar-width: 80px}.app-content{display:grid;grid-template-rows:auto 1fr;overflow:hidden;background-color:var(--background-color)}.header{grid-column:1 / -1;display:flex;align-items:center;justify-content:center;padding:1rem 1.5rem;background-color:var(--surface-color);border-bottom:1px solid var(--border-color);gap:1rem;transition:background-color .3s ease,border-color .3s ease}.prompt-input-wrapper{position:relative;width:100%;max-width:600px}.prompt-input{width:100%;padding:.75rem 1rem;padding-right:120px;border:1px solid var(--border-color);border-radius:999px;font-size:1rem;font-family:var(--font-family);background-color:var(--background-color);color:var(--text-primary);transition:box-shadow .2s,border-color .2s,background-color .3s ease,color .3s ease}.prompt-input:focus{outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--primary-color) 20%,transparent);border-color:var(--primary-color)}.generate-button{position:absolute;right:6px;top:50%;transform:translateY(-50%);display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background-color:var(--primary-color);color:#fff;border:none;border-radius:999px;font-size:.9rem;font-weight:600;cursor:pointer;transition:background-color .2s}.generate-button:hover:not(:disabled){background-color:var(--primary-hover-color)}.generate-button:disabled{background-color:var(--text-secondary);cursor:not-allowed;opacity:.7}.generate-button svg{width:1.2rem;height:1.2rem}.search-dropdown{position:absolute;top:calc(100% + 8px);left:0;width:100%;background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:12px;box-shadow:0 8px 16px #0000001a;z-index:1000;overflow:hidden;opacity:0;transform:translateY(-10px);transition:opacity .2s ease-out,transform .2s ease-out;pointer-events:none}.search-dropdown.visible{opacity:1;transform:translateY(0);pointer-events:auto}.dropdown-section{padding:.75rem 1rem}.dropdown-section:not(:last-child){border-bottom:1px solid var(--border-color)}.dropdown-section-header{display:flex;align-items:center;gap:.5rem;font-size:.8rem;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.75rem}.dropdown-section-header svg{width:1rem;height:1rem}.hot-trends-container{display:flex;flex-wrap:wrap;gap:.5rem}.trend-chip{display:flex;align-items:center;gap:.4rem;padding:.35rem .85rem;background-color:var(--background-color);border:1px solid var(--border-color);border-radius:999px;font-size:.85rem;font-weight:500;cursor:pointer;transition:all .2s}.trend-chip:hover{background-color:color-mix(in srgb,var(--primary-color) 10%,transparent);border-color:var(--primary-color);color:var(--primary-color)}.trend-chip svg{width:.9rem;height:.9rem;color:var(--warning-color)}.suggestions-list{list-style:none}.suggestion-item{padding:.6rem .5rem;border-radius:6px;cursor:pointer;display:flex;align-items:center;gap:.75rem;color:var(--text-primary);transition:background-color .2s}.suggestion-item:hover{background-color:var(--background-color)}.suggestion-item svg{width:1rem;height:1rem;color:var(--text-secondary);flex-shrink:0}.no-suggestions{padding:1rem .5rem;color:var(--text-secondary);text-align:center}.sidebar{background-color:var(--surface-color);border-right:1px solid var(--border-color);padding:1.5rem 1rem;display:flex;flex-direction:column;overflow-y:auto;transition:padding .3s cubic-bezier(.4,0,.2,1),background-color .3s ease,border-color .3s ease}.app-container.sidebar-collapsed .sidebar{padding:1.5rem .75rem;align-items:center}.logo{position:relative;display:flex;align-items:center;justify-content:flex-start;height:32px;padding:0 .5rem;margin-bottom:1.5rem;transition:all .2s ease-in-out}.logo-full,.logo-collapsed{height:100%;width:auto;object-fit:contain;transition:opacity .2s ease-in-out}.logo-full{opacity:1}.logo-collapsed{position:absolute;opacity:0;left:50%;top:50%;transform:translate(-50%,-50%);width:32px}.app-container.sidebar-collapsed .logo{justify-content:center;padding:0}.app-container.sidebar-collapsed .logo-full{opacity:0}.app-container.sidebar-collapsed .logo-collapsed{opacity:1}.nav-menu{list-style:none;flex-grow:1}.nav-item{margin-bottom:.25rem}.nav-separator{height:1px;background-color:var(--border-color);margin:.75rem;border:none;transition:margin .3s ease-in-out,background-color .3s ease}.app-container.sidebar-collapsed .nav-separator{margin:.75rem .25rem}.nav-link{display:flex;align-items:center;gap:.75rem;padding:.75rem;text-decoration:none;color:var(--text-secondary);font-weight:500;border-radius:6px;transition:background-color .2s,color .2s;white-space:nowrap;border:1px solid transparent}.app-container.sidebar-collapsed .nav-link{justify-content:center}.nav-text{transition:opacity .2s ease-in-out;white-space:nowrap}.app-container.sidebar-collapsed .nav-text{display:none}.nav-link:hover{background-color:var(--background-color);color:var(--text-primary)}.nav-link.active{background-color:color-mix(in srgb,var(--primary-color) 10%,transparent);color:var(--primary-color);font-weight:600}.nav-link svg{width:1.5rem;height:1.5rem;flex-shrink:0}.sidebar-footer{margin-top:auto;padding-top:1rem;display:flex;flex-direction:column;gap:.25rem}.app-container.sidebar-collapsed .sidebar-footer{width:100%}.main-content{overflow-y:auto;padding:2.5rem;background-color:var(--background-color);transition:background-color .3s ease}.welcome-header h1{font-size:2rem;font-weight:700;margin-bottom:.5rem}.welcome-header p{font-size:1.125rem;color:var(--text-secondary);max-width:65ch}.workspace{margin-top:2.5rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem}.step-card{background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:12px;padding:1.5rem;box-shadow:0 1px 2px #00000005,0 2px 4px #00000005;transition:background-color .3s ease,border-color .3s ease}.step-card-header{display:flex;align-items:center;gap:1rem}.step-number{background-color:var(--primary-color);color:#fff;width:2.5rem;height:2.5rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.125rem;flex-shrink:0}.step-card-header h3{font-size:1.25rem;font-weight:600}.step-card p{margin-top:1rem;color:var(--text-secondary)}.panel-section{width:100%}.panel-section-header{margin-bottom:1.5rem}.panel-section-header h2{font-size:1.5rem;font-weight:700;margin-bottom:.25rem}.panel-section-header p{color:var(--text-secondary);font-size:1rem}.dashboard-panel{display:flex;flex-direction:column;gap:2.5rem}.trends-carousel{display:flex;gap:1.5rem;overflow-x:auto;padding-bottom:1.5rem;margin-bottom:-1.5rem}.trend-card{position:relative;flex-shrink:0;width:280px;background:var(--surface-color);border-radius:12px;border:1px solid var(--border-color);overflow:hidden;box-shadow:0 1px 2px #00000005,0 2px 4px #00000005;transition:transform .2s,box-shadow .2s,background-color .3s ease,border-color .3s ease}.trend-card:hover{transform:translateY(-4px);box-shadow:0 4px 8px #0000000a,0 8px 16px #0000000a}.trend-card-img{width:100%;height:150px;object-fit:cover}.trend-card-content{padding:1rem;display:flex;flex-direction:column;gap:.75rem}.trend-card-content h4{font-size:1rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.trend-score{display:flex;gap:.125rem}.trend-score svg{width:1rem;height:1rem;color:#e5e7eb}.trend-score svg.active{color:#f97316}.trend-card-button{width:100%;padding:.5rem;background-color:var(--primary-color);color:#fff;border:none;border-radius:6px;font-weight:600;cursor:pointer;transition:background-color .2s}.trend-card-button:hover{background-color:var(--primary-hover-color)}.grid-layout-2-1{display:grid;grid-template-columns:2fr 1fr;gap:2.5rem}@media (max-width: 1024px){.grid-layout-2-1{grid-template-columns:1fr}}.niche-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:1rem}.niche-card{display:flex;align-items:center;gap:.75rem;background:var(--surface-color);border:1px solid var(--border-color);padding:.75rem 1rem;border-radius:8px;cursor:pointer;transition:transform .2s,box-shadow .2s,border-color .2s,background-color .3s ease}.niche-card:hover{transform:translateY(-2px);box-shadow:0 2px 4px #00000008;border-color:var(--primary-color)}.niche-card.active{border-color:var(--primary-color);background-color:color-mix(in srgb,var(--primary-color) 10%,transparent);box-shadow:0 0 0 2px color-mix(in srgb,var(--primary-color) 20%,transparent);transform:translateY(-2px)}.niche-card.active .niche-card-name{color:var(--primary-color);font-weight:600}.niche-card-emoji{font-size:1.25rem}.niche-card-name{font-weight:500}.ai-forecast-card{background-color:color-mix(in srgb,var(--primary-color) 8%,var(--surface-color));border:1px solid color-mix(in srgb,var(--primary-color) 20%,transparent);border-radius:12px;padding:1.5rem;display:flex;gap:1rem;height:100%;transition:background-color .3s ease,border-color .3s ease}.ai-forecast-card svg{width:1.5rem;height:1.5rem;color:var(--primary-color);flex-shrink:0;margin-top:.25rem}.ai-forecast-card p{color:var(--text-primary)}.ai-forecast-card a{color:var(--primary-color);font-weight:600;text-decoration:none}.ai-forecast-card a:hover{text-decoration:underline}.table-container{overflow-x:auto;background:var(--surface-color);border:1px solid var(--border-color);border-radius:12px;transition:background-color .3s ease,border-color .3s ease}.keywords-table{width:100%;border-collapse:collapse;text-align:left}.keywords-table th,.keywords-table td{padding:1rem 1.25rem;border-bottom:1px solid var(--border-color);white-space:nowrap}.keywords-table thead{background-color:var(--background-color);transition:background-color .3s ease}.keywords-table th{font-size:.875rem;color:var(--text-secondary);font-weight:600;text-transform:uppercase;letter-spacing:.05em}.keywords-table tbody tr:last-child td{border-bottom:none}.keywords-table tbody tr{cursor:pointer}.keywords-table tbody tr:hover{background-color:var(--background-color)}.tag{display:inline-block;padding:.25rem .75rem;border-radius:999px;font-weight:600;font-size:.8rem;text-transform:capitalize}.tag-high{background-color:color-mix(in srgb,var(--success-color) 15%,transparent);color:var(--success-color)}.tag-very-high{background-color:color-mix(in srgb,var(--success-color) 20%,transparent);color:var(--success-color)}.tag-medium{background-color:color-mix(in srgb,var(--warning-color) 15%,transparent);color:var(--warning-color)}.tag-low{background-color:color-mix(in srgb,#0ea5e9 15%,transparent);color:#0ea5e9}.tag-untapped{background-color:color-mix(in srgb,var(--primary-color) 15%,transparent);color:var(--primary-color)}.tag-danger{background-color:color-mix(in srgb,var(--danger-color) 15%,transparent);color:var(--danger-color)}.sources-section{background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:12px;padding:1.5rem;margin-top:2.5rem;transition:background-color .3s ease,border-color .3s ease}.sources-list{list-style-type:disc;padding-left:1.5rem;color:var(--text-secondary);font-size:.9rem}.sources-list li{margin-bottom:.5rem}.sources-list a{color:var(--primary-color);text-decoration:none}.sources-list a:hover{text-decoration:underline}.upcoming-trends-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.5rem}.upcoming-trend-card{background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:12px;display:flex;gap:1.5rem;padding:1.5rem;transition:transform .2s,box-shadow .2s;cursor:pointer}.upcoming-trend-card:hover{transform:translateY(-4px);box-shadow:0 4px 8px #0000000a,0 8px 16px #0000000a}.upcoming-trend-card-img{width:100px;height:100px;border-radius:8px;object-fit:cover;flex-shrink:0;background-color:var(--background-color)}.upcoming-trend-card-content{display:flex;flex-direction:column;gap:.5rem}.upcoming-trend-card-content h4{font-size:1.125rem;font-weight:600}.upcoming-trend-card-content p{color:var(--text-secondary);font-size:.9rem;line-height:1.6;flex-grow:1}.confidence-meter{display:flex;flex-direction:column;gap:.3rem}.confidence-label{font-size:.75rem;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em}.confidence-bar-bg{width:100%;height:6px;background-color:var(--background-color);border-radius:3px;overflow:hidden}.confidence-bar-fg{height:100%;border-radius:3px;background-color:var(--success-color);transition:width .5s ease-in-out}.confidence-bar-fg.medium{background-color:var(--warning-color)}.confidence-bar-fg.speculative{background-color:var(--info-color)}.ai-prompt-builder-panel{display:flex;flex-direction:column;gap:2.5rem}.prompt-builder-input-section{background-color:var(--surface-color);border-radius:12px;padding:1.5rem;border:1px solid var(--border-color);display:flex;flex-direction:column;gap:1rem}.prompt-builder-input-section label{font-weight:600;font-size:.875rem;color:var(--text-primary)}.prompt-idea-input{width:100%;padding:.75rem 1rem;border:1px solid var(--border-color);background-color:var(--background-color);color:var(--text-primary);border-radius:6px;font-size:1rem;font-family:var(--font-family);transition:box-shadow .2s,border-color .2s}.prompt-idea-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary-color) 20%,transparent)}.style-chips-container{display:flex;flex-wrap:wrap;gap:.75rem}.style-chip{padding:.5rem 1rem;border:1px solid var(--border-color);background-color:var(--surface-color);color:var(--text-secondary);border-radius:999px;font-weight:600;cursor:pointer;transition:all .2s}.style-chip:hover{border-color:var(--primary-color);color:var(--primary-color);background-color:var(--background-color)}.style-chip.active{background-color:var(--primary-color);color:#fff;border-color:var(--primary-color)}body.dark .style-chip.active{color:#fff}.generate-suggestions-btn{display:flex;align-items:center;justify-content:center;gap:.75rem;padding:.875rem;background-color:var(--primary-color);color:#fff;font-size:1rem;font-weight:600;border:none;border-radius:8px;cursor:pointer;transition:background-color .2s;margin-top:1rem}.generate-suggestions-btn:hover:not(:disabled){background-color:var(--primary-hover-color)}.generate-suggestions-btn:disabled{background-color:var(--text-secondary);cursor:not-allowed}.generate-suggestions-btn svg{width:1.25rem;height:1.25rem}.image-upload-area{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}.image-upload-btn{display:flex;align-items:center;gap:.75rem;padding:.875rem;background-color:var(--surface-color);color:var(--text-primary);font-size:1rem;font-weight:600;border:1px solid var(--border-color);border-radius:8px;cursor:pointer;transition:all .2s;flex-grow:1}.image-upload-btn:hover{border-color:var(--primary-color);color:var(--primary-color);background-color:color-mix(in srgb,var(--primary-color) 5%,transparent)}.image-upload-btn svg{width:1.25rem;height:1.25rem}.image-preview-thumbnail{width:80px;height:80px;border-radius:8px;object-fit:cover;border:1px solid var(--border-color);background-color:var(--background-color)}.image-analysis-spinner{width:20px;height:20px;border:3px solid var(--border-color);border-top-color:var(--primary-color);border-radius:50%;animation:spin 1s linear infinite;margin-left:.5rem}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:3rem 1rem;text-align:center;background-color:var(--surface-color);border:1px dashed var(--border-color);border-radius:12px;color:var(--text-secondary)}.loading-spinner{width:2.5rem;height:2.5rem;border:4px solid var(--border-color);border-top-color:var(--primary-color);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.suggestions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.5rem}.prompt-suggestion-card{background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:12px;padding:1.25rem;display:flex;flex-direction:column;justify-content:space-between;gap:1rem;transition:border-color .2s,box-shadow .2s,background-color .3s ease}.prompt-suggestion-card:hover{border-color:color-mix(in srgb,var(--primary-color) 50%,transparent);box-shadow:0 4px 8px #00000005}.prompt-suggestion-content{color:var(--text-secondary);line-height:1.6}.prompt-suggestion-actions{display:flex;gap:.75rem;flex-wrap:wrap}.prompt-suggestion-actions button{flex-grow:1;display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.5rem .75rem;border-radius:6px;border:1px solid var(--border-color);background-color:var(--background-color);color:var(--text-primary);font-weight:600;cursor:pointer;transition:all .2s}.prompt-suggestion-actions button:hover{background-color:var(--border-color);border-color:var(--text-secondary)}.prompt-suggestion-actions button:first-of-type{background-color:color-mix(in srgb,var(--primary-color) 10%,transparent);border-color:color-mix(in srgb,var(--primary-color) 20%,transparent);color:var(--primary-color)}.prompt-suggestion-actions button:first-of-type:hover{background-color:color-mix(in srgb,var(--primary-color) 20%,transparent)}.prompt-suggestion-actions svg{width:1rem;height:1rem}.final-prompt-editor{display:flex;flex-direction:column;gap:1rem}.final-prompt-editor textarea{width:100%;padding:1rem;border-radius:8px;border:1px solid var(--border-color);font-family:var(--font-family);font-size:1rem;line-height:1.6;resize:vertical;background-color:var(--background-color);color:var(--text-primary)}.final-prompt-editor textarea:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary-color) 20%,transparent)}.generate-artwork-btn{display:flex;align-items:center;justify-content:center;gap:.75rem;padding:.875rem;background-color:var(--success-color);color:#fff;font-size:1rem;font-weight:600;border:none;border-radius:8px;cursor:pointer;transition:background-color .2s}.generate-artwork-btn:hover{background-color:#059669}body.dark .generate-artwork-btn{color:var(--text-primary)}.generate-artwork-btn svg{width:1.25rem;height:1.25rem}.artwork-gallery-panel{display:flex;flex-direction:column;gap:2.5rem}.artwork-prompt-bar{background-color:var(--surface-color);border-radius:12px;padding:1rem 1.5rem;border:1px solid var(--border-color);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}.artwork-prompt-text{color:var(--text-secondary);flex-grow:1;line-height:1.6}.artwork-prompt-text strong{color:var(--text-primary)}.artwork-prompt-actions{display:flex;gap:.75rem}.artwork-prompt-actions button{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.6rem 1rem;border-radius:6px;font-weight:600;border:1px solid var(--border-color);cursor:pointer;transition:all .2s}.artwork-prompt-actions button.secondary-btn{background-color:var(--surface-color);color:var(--text-primary)}.artwork-prompt-actions button.secondary-btn:hover{background-color:var(--background-color)}.artwork-prompt-actions button.primary-btn{background-color:var(--primary-color);color:#fff;border-color:var(--primary-color)}body.dark .artwork-prompt-actions button.primary-btn{color:#fff}.artwork-prompt-actions button.primary-btn:hover{background-color:var(--primary-hover-color)}.artwork-prompt-actions svg{width:1rem;height:1rem}.artwork-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem}.artwork-card{position:relative;aspect-ratio:1 / 1;background-color:var(--surface-color);border-radius:12px;border:3px solid transparent;overflow:hidden;cursor:pointer;transition:transform .2s ease-out,box-shadow .2s ease-out,border-color .2s,background-color .3s ease}.artwork-card:hover{transform:translateY(-4px);box-shadow:0 8px 16px #00000014}.artwork-card.selected{border-color:var(--primary-color);box-shadow:0 8px 16px color-mix(in srgb,var(--primary-color) 20%,transparent);transform:scale(1.02)}.artwork-card img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.artwork-card:hover img{transform:scale(1.05)}.artwork-card-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to top,rgba(0,0,0,.6),transparent 50%);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1rem;opacity:0;transition:opacity .2s}.artwork-card:hover .artwork-card-overlay,.artwork-card.selected .artwork-card-overlay{opacity:1}.artwork-card-overlay span{color:#fff;font-weight:600;text-shadow:0 1px 3px rgba(0,0,0,.5);margin-bottom:1rem}.use-mockup-btn{width:auto;display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.5rem;background-color:var(--primary-color);color:#fff;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:background-color .2s,transform .2s;box-shadow:0 4px 12px #0003}.use-mockup-btn:hover{background-color:var(--primary-hover-color);transform:scale(1.05)}.use-mockup-btn svg{width:1.25rem;height:1.25rem}.artwork-card-skeleton{aspect-ratio:1 / 1;background-color:var(--surface-color);border-radius:12px;border:1px solid var(--border-color);padding:1rem}.skeleton-image{width:100%;height:100%;background-color:var(--border-color);border-radius:6px;animation:pulse 1.5s cubic-bezier(.4,0,.6,1) infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.inspire-button{position:absolute;top:8px;right:8px;z-index:5;background-color:color-mix(in srgb,var(--surface-color) 70%,transparent);color:var(--text-primary);border:1px solid var(--border-color);border-radius:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease-in-out;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);box-shadow:0 2px 8px #0000001a;opacity:0}.artwork-card:hover .inspire-button,.trend-card:hover .inspire-button,.artwork-library-item:hover .inspire-button{opacity:1}.inspire-button:hover{background-color:var(--primary-color);color:#fff;transform:scale(1.1);border-color:var(--primary-color)}body.dark .inspire-button:hover{color:#fff}.inspire-button svg{width:1.1rem;height:1.1rem}.main-content .mockup-studio-panel,.main-content .mockup-studio{padding:0;height:100%;width:100%;display:grid;grid-template-columns:auto 1fr 280px;background-color:var(--background-color);color:var(--text-primary);transition:background-color .3s ease}.mockup-studio-left-panel-container{display:grid;--mockup-icon-nav-width: 60px;--mockup-content-panel-width: 280px;grid-template-columns:var(--mockup-icon-nav-width) 0;transition:grid-template-columns .3s cubic-bezier(.4,0,.2,1);overflow:hidden}.mockup-studio.panel-open .mockup-studio-left-panel-container{grid-template-columns:var(--mockup-icon-nav-width) var(--mockup-content-panel-width)}.mockup-studio-icon-nav{grid-column:1;background-color:var(--surface-color);border-right:1px solid var(--border-color);display:flex;flex-direction:column;padding:1rem .5rem;align-items:center;overflow:hidden;transition:background-color .3s ease,border-color .3s ease}.mockup-studio-content-panel{grid-column:2;background-color:var(--surface-color);border-right:1px solid var(--border-color);padding:1rem;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:1rem;transition:background-color .3s ease,border-color .3s ease}.mockup-studio-content-panel::-webkit-scrollbar{width:4px}.mockup-studio-content-panel::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}.mockup-nav-menu{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.25rem;flex-shrink:0;width:100%}.mockup-nav-link{display:flex;align-items:center;justify-content:center;gap:.75rem;padding:.75rem;border-radius:6px;text-decoration:none;color:var(--text-secondary);font-weight:500;white-space:nowrap;transition:all .2s;cursor:pointer}.mockup-nav-link:hover{background-color:var(--background-color);color:var(--text-primary)}.mockup-nav-link.active{background-color:var(--background-color);color:var(--primary-color);font-weight:600}.mockup-nav-link svg{width:1.5rem;height:1.5rem;flex-shrink:0}.mockup-nav-text{display:none}.mockup-studio-content-panel .panel-content-header{display:flex;align-items:center;gap:.75rem;font-size:1.1rem;font-weight:600;color:var(--text-primary);margin-bottom:.5rem;flex-shrink:0}.mockup-studio-content-panel .panel-content-header svg{width:1.25rem;height:1.25rem;color:var(--primary-color)}.feature-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--text-secondary);height:100%;flex-grow:1;padding:1rem;border:2px dashed var(--border-color);border-radius:8px;background-color:var(--background-color)}.feature-placeholder-icon{width:2.5rem;height:2.5rem;margin-bottom:1rem;opacity:.5}.feature-placeholder h4{font-size:1.1rem;font-weight:600;color:var(--text-primary);margin-bottom:.25rem}.feature-placeholder p{font-size:.9rem;max-width:200px}.panel-search-bar{position:relative;margin-bottom:1rem;flex-shrink:0}.panel-search-bar svg{position:absolute;left:.75rem;top:50%;transform:translateY(-50%);width:1rem;height:1rem;color:var(--text-secondary)}.panel-search-bar input{width:100%;padding:.6rem .75rem .6rem 2.25rem;border-radius:6px;border:1px solid var(--border-color);background-color:var(--background-color);color:var(--text-primary);font-size:.9rem}.panel-search-bar input:focus{outline:none;border-color:var(--primary-color)}.artwork-category-filters{display:flex;gap:.5rem;margin-bottom:1rem;flex-wrap:wrap;flex-shrink:0}.artwork-category-filters .chip-btn{padding:.5rem 1rem;border-radius:999px;border:1px solid var(--border-color);background-color:var(--surface-color);color:var(--text-secondary);font-weight:500;cursor:pointer;transition:all .2s ease-in-out}.artwork-category-filters .chip-btn:hover{border-color:var(--primary-color);color:var(--primary-color);background-color:color-mix(in srgb,var(--primary-color) 10%,transparent)}.artwork-category-filters .chip-btn.active{background-color:var(--primary-color);color:#fff;border-color:var(--primary-color)}.artwork-library-scroll-container{flex-grow:1;display:flex;flex-direction:column}.artwork-subcategory-header{font-size:.8rem;font-weight:600;color:var(--text-secondary);margin-top:1.25rem;margin-bottom:.75rem;text-transform:uppercase;letter-spacing:.05em;padding-bottom:.25rem;border-bottom:1px solid var(--border-color)}.artwork-subcategory-header:first-child{margin-top:0}.show-more-btn{width:100%;padding:.6rem;margin-top:.75rem;background-color:var(--background-color);color:var(--text-primary);border:1px solid var(--border-color);border-radius:6px;font-weight:600;cursor:pointer;transition:background-color .2s}.show-more-btn:hover{background-color:color-mix(in srgb,var(--background-color),black 5%)}body.dark .show-more-btn:hover{background-color:color-mix(in srgb,var(--background-color),white 10%)}.artwork-generator-controls{display:flex;flex-direction:column;gap:.75rem;flex-shrink:0}.generation-options-container{display:flex;gap:1rem;background:var(--background-color);padding:.75rem;border-radius:6px}.generation-options-container label{display:flex;align-items:center;gap:.5rem;cursor:pointer;font-weight:500;font-size:.9rem}.mockup-studio-content-panel .style-chips-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(85px,1fr));gap:.5rem}.mockup-studio-content-panel .style-chip{padding:.5rem;border:1px solid var(--border-color);background-color:var(--background-color);color:var(--text-secondary);border-radius:999px;font-weight:500;cursor:pointer;transition:all .2s ease-in-out;font-size:.8rem;text-align:center}.mockup-studio-content-panel .style-chip:hover{border-color:var(--primary-color);color:var(--primary-color);background-color:color-mix(in srgb,var(--primary-color) 10%,transparent)}.mockup-studio-content-panel .style-chip.active{background-color:var(--primary-color);color:#fff;border-color:var(--primary-color)}.artwork-library-prompt{width:100%;resize:none;background:var(--background-color);color:var(--text-primary);border:1px solid var(--border-color);border-radius:4px;padding:.5rem;font-family:var(--font-family);font-size:.875rem}.artwork-library-prompt:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px color-mix(in srgb,var(--primary-color) 30%,transparent)}.artwork-library-generate-btn{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;padding:.75rem;border-radius:8px;font-weight:600;cursor:pointer;background:var(--primary-color);color:#fff;border:none;transition:all .2s ease-in-out;box-shadow:0 2px 4px #0003}.artwork-library-generate-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 8px #0000004d;background-color:var(--primary-hover-color)}.artwork-library-generate-btn:disabled{background:var(--text-secondary);color:#fff;cursor:not-allowed;opacity:.7;transform:none;box-shadow:none}.artwork-library-generate-btn .mini-spinner{width:1rem;height:1rem;border-width:2px}.artwork-library-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.artwork-library-item{position:relative;aspect-ratio:1/1;border-radius:6px;overflow:hidden;border:2px solid transparent;cursor:pointer;transition:border-color .2s;background-color:var(--background-color)}.artwork-library-item img{width:100%;height:100%;object-fit:cover}.artwork-library-item:hover{border-color:color-mix(in srgb,var(--primary-color) 40%,transparent)}.artwork-library-item.selected{border-color:var(--primary-color)}.artwork-library-skeleton{aspect-ratio:1/1;background-color:var(--surface-color);border-radius:6px;animation:pulse 1.5s cubic-bezier(.4,0,.6,1) infinite}.mockup-studio-canvas-area{display:flex;flex-direction:column;overflow:hidden;background-color:var(--background-color)}.canvas-toolbar{display:flex;justify-content:space-between;align-items:center;padding:.5rem 1rem;background-color:var(--surface-color);border-bottom:1px solid var(--border-color);color:var(--text-primary);flex-shrink:0}.toolbar-group-left,.toolbar-group-center,.toolbar-group-right{display:flex;align-items:center;gap:.5rem}.toolbar-group-left .divider{width:1px;height:20px;background-color:var(--border-color);margin:0 .5rem}.file-name{font-weight:500}.tool-button{display:flex;align-items:center;gap:.5rem;background:transparent;border:none;color:var(--text-secondary);padding:.6rem;border-radius:8px;cursor:pointer;transition:all .2s}.tool-button:hover{background-color:var(--background-color);color:var(--text-primary)}.tool-button svg{width:1.1rem;height:1.1rem}.canvas-toolbar .primary-btn{display:flex;align-items:center;gap:.5rem;padding:.6rem 1.2rem;border-radius:8px;font-weight:600;background:var(--primary-color);color:#fff;border:none;cursor:pointer;transition:all .2s ease-in-out;box-shadow:0 2px 4px #0003}.canvas-toolbar .primary-btn:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0000004d;background-color:var(--primary-hover-color)}.canvas-toolbar .primary-btn svg{width:1rem;height:1rem}.canvas-workspace{flex-grow:1;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:1rem}.canvas-zoom-container{transition:transform .2s}.mockup-container{position:relative;-webkit-user-select:none;user-select:none}.product-layer{max-width:100%;max-height:70vh;object-fit:contain;cursor:pointer}.artwork-layer{position:absolute;border:2px dashed transparent;transition:border-color .2s;-webkit-user-select:none;user-select:none}.artwork-layer .inspire-button{opacity:1}.artwork-layer.selected{border-color:var(--primary-color)}.artwork-layer:hover{border-color:color-mix(in srgb,var(--primary-color) 50%,transparent)}.artwork-layer .artwork-image{width:100%;height:100%;object-fit:contain;pointer-events:none;transition:mix-blend-mode .3s ease}.text-layer{position:absolute;border:2px solid transparent;cursor:grab;-webkit-user-select:none;user-select:none;white-space:pre-wrap;line-height:1.1;padding:4px}.text-layer.selected{border-color:var(--primary-color)}.gradient-text{-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.text-layer-svg{position:absolute;overflow:visible;pointer-events:none}.text-layer-svg text{font-weight:var(--font-weight);font-style:var(--font-style);font-family:var(--font-family-name);letter-spacing:var(--letter-spacing);fill:var(--fill-color);dominant-baseline:middle;text-anchor:middle}.artwork-layer.removing-background .artwork-image{animation:bg-pulse 2.5s ease-out forwards}.artwork-layer.removing-background:before{content:"";position:absolute;left:0;right:0;height:4px;background:linear-gradient(90deg,transparent,var(--primary-color),transparent);box-shadow:0 0 10px 2px var(--primary-color);border-radius:4px;animation:scan-line 2.5s ease-in-out forwards;z-index:10;opacity:0}@keyframes scan-line{0%{top:-5%;opacity:.8}10%{opacity:1}90%{opacity:1}to{top:105%;opacity:0}}@keyframes bg-pulse{0%,to{filter:saturate(1) brightness(1)}50%{filter:saturate(.2) brightness(1.3)}}.canvas-controls{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background-color:var(--surface-color);border-top:1px solid var(--border-color);color:var(--text-secondary);flex-shrink:0}.canvas-controls input[type=range]{width:120px;-webkit-appearance:none;background:var(--background-color);height:4px;border-radius:2px}.canvas-controls input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;background:var(--text-primary);border-radius:50%;cursor:pointer}.zoom-percentage{font-size:.8rem;width:40px;text-align:center}.mockup-studio-properties{background-color:var(--surface-color);border-left:1px solid var(--border-color);color:var(--text-primary);display:flex;flex-direction:column}.properties-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1rem .5rem;border-bottom:1px solid var(--border-color)}.properties-header h3{font-size:1rem;font-weight:600}.properties-tabs{display:flex;padding:.5rem;gap:.5rem}.prop-tab{flex-grow:1;padding:.75rem .5rem;border:none;background:transparent;color:var(--text-secondary);font-weight:600;border-radius:0;cursor:pointer;transition:all .2s;border-bottom:3px solid transparent}.prop-tab:hover{color:var(--text-primary);background-color:transparent}.prop-tab.active{background-color:transparent;color:var(--primary-color);border-bottom-color:var(--primary-color)}.prop-tab svg{width:1.1rem;height:1.1rem;vertical-align:middle;margin-right:.25rem}.properties-content{padding:1rem;overflow-y:auto;display:flex;flex-direction:column;gap:1.5rem}.properties-content::-webkit-scrollbar{width:4px}.properties-content::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}.property-group{display:flex;flex-direction:column;gap:.5rem}.property-group>label{font-size:.8rem;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.02em;margin-bottom:.25rem}.input-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.input-field-with-label{display:flex;align-items:center;background:var(--background-color);border-radius:4px;border:1px solid var(--border-color)}.input-field-with-label label{padding:0 .5rem;font-size:.8rem;color:var(--text-secondary);text-transform:none}.input-field-with-label input{width:100%;background:transparent;border:none;color:var(--text-primary);padding:.5rem}.input-field-with-label input:focus{outline:none}.property-group input[type=range]{width:100%}.input-with-percent{display:flex;align-items:center;gap:.5rem}.input-with-percent input[type=range]{flex-grow:1}.input-with-percent span{width:40px;text-align:right;font-size:.8rem;color:var(--text-secondary)}.property-select{width:100%;padding:.6rem .8rem;background:var(--background-color);color:var(--text-primary);border:1px solid var(--border-color);border-radius:4px}.color-swatches{display:flex;flex-wrap:wrap;gap:.5rem}.color-swatch{width:2rem;height:2rem;border-radius:50%;border:2px solid var(--surface-color);cursor:pointer;transition:transform .2s,border-color .2s}.color-swatch:hover{transform:scale(1.1)}.color-swatch.active{border-color:var(--primary-color)}.font-style-btns{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.font-style-btns button{display:flex;align-items:center;justify-content:center;padding:.6rem;border:1px solid var(--border-color);background:var(--background-color);border-radius:4px;cursor:pointer;font-size:.9rem;color:var(--text-secondary)}.font-style-btns button.active{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.font-style-btns button:hover:not(.active){border-color:var(--text-secondary)}.property-group textarea{width:100%;padding:.75rem 1rem;border:1px solid var(--border-color);background-color:var(--background-color);color:var(--text-primary);border-radius:6px;font-size:1rem;font-family:var(--font-family);resize:vertical}.text-style-library-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-top:.5rem}.text-style-item{aspect-ratio:16 / 10;background-color:var(--background-color);border:1px solid var(--border-color);border-radius:6px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease-in-out;overflow:hidden;padding:.5rem}.text-style-item:hover{border-color:var(--primary-color);transform:translateY(-2px);box-shadow:0 4px 8px #0000000d}.text-style-item span{font-size:1.25rem;white-space:nowrap;text-align:center;line-height:1.1}.button-group{display:flex;flex-direction:column;gap:.75rem}.secondary-full-btn,.primary-full-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem;border-radius:8px;font-weight:600;cursor:pointer;transition:all .2s ease-in-out}.secondary-full-btn{background:var(--background-color);color:var(--text-secondary);border:1px solid var(--border-color)}.secondary-full-btn:hover{background:color-mix(in srgb,var(--background-color),black 5%);color:var(--text-primary);border-color:var(--primary-color);transform:translateY(-1px)}.primary-full-btn{background:var(--primary-color);color:#fff;border:none;box-shadow:0 2px 4px #0003}.primary-full-btn:hover:not([disabled]){transform:translateY(-2px);box-shadow:0 4px 8px #0000004d;background-color:var(--primary-hover-color)}.primary-full-btn[disabled]{background:var(--text-secondary);color:#fff;cursor:not-allowed;opacity:.7;transform:none;box-shadow:none}.primary-full-btn svg,.secondary-full-btn svg{width:1.1rem;height:1.1rem}.primary-full-btn .mini-spinner{border-color:#fff6;border-top-color:#fff}.secondary-full-btn .mini-spinner{border-color:var(--border-color);border-top-color:var(--primary-color)}.brush-tools-group{display:flex;gap:.75rem}.property-group small{font-size:.8rem;color:var(--text-secondary);line-height:1.5;text-transform:none;font-weight:400}.main-content .listing-generator-panel{padding:0;height:100%;display:flex;flex-direction:column;background-color:var(--background-color);gap:1.5rem}.listing-generator-header{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1.5rem;background-color:var(--surface-color);border-bottom:1px solid var(--border-color);flex-shrink:0;gap:1rem}.listing-generator-header .header-content{flex-grow:1}.listing-generator-header h1{font-size:1.5rem;font-weight:700;margin-bottom:.25rem}.listing-generator-header p{color:var(--text-secondary);font-size:1rem}.listing-generator-header .back-btn,.listing-generator-header .secondary-btn{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:6px;font-weight:600;border:1px solid var(--border-color);cursor:pointer;transition:all .2s;background-color:var(--surface-color);color:var(--text-primary)}.listing-generator-header .back-btn:hover,.listing-generator-header .secondary-btn:hover{background-color:var(--background-color)}.listing-generator-header svg{width:1rem;height:1.1rem}.listing-content-layout{display:grid;grid-template-columns:320px 1fr;gap:1.5rem;padding:0 1.5rem 1.5rem;flex-grow:1;overflow:hidden;height:100%}.listing-gallery-column,.listing-details-column{overflow-y:auto;height:100%;padding-right:.5rem}.listing-gallery-column::-webkit-scrollbar,.listing-details-column::-webkit-scrollbar{width:6px}.listing-gallery-column::-webkit-scrollbar-thumb,.listing-details-column::-webkit-scrollbar-thumb{background-color:var(--border-color);border-radius:6px}.main-mockup-container{position:relative;width:100%;aspect-ratio:1/1;border-radius:12px;overflow:hidden;margin-bottom:1rem;background-color:var(--background-color);border:1px solid var(--border-color)}.main-mockup-image{width:100%;height:100%;object-fit:cover}.skeleton-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:1.25rem}.mockup-thumbnails{display:grid;grid-template-columns:repeat(auto-fill,minmax(70px,1fr));gap:.75rem}.thumbnail-container{position:relative;aspect-ratio:1/1;border-radius:8px;overflow:hidden;cursor:pointer;border:2px solid var(--border-color);transition:all .2s}.thumbnail-container:hover{border-color:var(--primary-color)}.thumbnail-container.active{border-color:var(--primary-color);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary-color) 40%,transparent)}.thumbnail-container img{width:100%;height:100%;object-fit:cover}.thumbnail-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s;color:#fff}.thumbnail-container:hover .thumbnail-overlay{opacity:1}.thumbnail-overlay svg{width:1.5rem;height:1.5rem}.add-mockup-btn{background-color:var(--background-color);border-style:dashed;color:var(--text-secondary);display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:.75rem;font-weight:600;gap:.25rem;padding:.5rem;text-align:center}.add-mockup-btn svg{width:1.5rem;height:1.5rem}.listing-details-column{display:flex;flex-direction:column;gap:1.5rem;background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:12px;padding:1.5rem}.listing-form{display:flex;flex-direction:column;gap:1.5rem;flex-grow:1}.form-field{display:flex;flex-direction:column;gap:.5rem}.form-field label{font-weight:600;font-size:.875rem}.input-with-button{display:flex;gap:.5rem;align-items:flex-start;position:relative}.input-with-button input,.input-with-button textarea,.tags-container{flex-grow:1;width:100%;padding:.6rem .8rem;border:1px solid var(--border-color);border-radius:6px;font-size:.9rem;font-family:var(--font-family);transition:box-shadow .2s,border-color .2s;background-color:var(--background-color);color:var(--text-primary)}.input-with-button input[type=text]{padding-right:3rem}.input-with-button>.tool-button{position:absolute;right:.25rem;top:.25rem;height:calc(100% - .5rem);background:transparent}.input-with-button textarea{resize:vertical;line-height:1.6}.input-with-button .loading-spinner{width:1.25rem;height:1.25rem}.tags-container{display:flex;flex-wrap:wrap;gap:.5rem;padding:.5rem;min-height:44px}.tag-item{background-color:var(--primary-color);color:#fff;padding:.25rem .6rem;border-radius:4px;font-size:.85rem;font-weight:500;display:flex;align-items:center;gap:.35rem}.tag-item button{background:none;border:none;color:#fff;opacity:.7;cursor:pointer;display:flex}.tag-item button:hover{opacity:1}.tag-item button svg{width:.8rem;height:.8rem}.input-with-icon{position:relative}.input-with-icon svg{position:absolute;left:.8rem;top:50%;transform:translateY(-50%);width:1rem;height:1rem;color:var(--text-secondary)}.input-with-icon input{padding-left:2.2rem}.listing-actions .primary-btn{width:100%;padding:.875rem}.ask-meryl-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.25rem .75rem;background-color:color-mix(in srgb,var(--primary-color) 10%,transparent);color:var(--primary-color);border:1px solid color-mix(in srgb,var(--primary-color) 20%,transparent);border-radius:999px;font-weight:600;font-size:.8rem;cursor:pointer;transition:all .2s;white-space:nowrap}.ask-meryl-btn:hover{background-color:color-mix(in srgb,var(--primary-color) 20%,transparent);transform:translateY(-1px);box-shadow:0 2px 4px #0000000d}.ask-meryl-btn svg{width:.9rem;height:.9rem}.float-chat-button{position:fixed;bottom:2rem;right:2rem;width:60px;height:60px;border-radius:50%;background-color:var(--primary-color);color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px #0003;transition:transform .2s cubic-bezier(.34,1.56,.64,1),background-color .2s;z-index:999}.float-chat-button:hover{transform:scale(1.1);background-color:var(--primary-hover-color)}.float-chat-button svg{width:2rem;height:2rem;transition:opacity .2s,transform .2s}.float-chat-button .icon-open{opacity:1;transform:rotate(0) scale(1)}.float-chat-button .icon-close{opacity:0;transform:rotate(-90deg) scale(0);position:absolute}.float-chat-button.open .icon-open{opacity:0;transform:rotate(90deg) scale(0)}.float-chat-button.open .icon-close{opacity:1;transform:rotate(0) scale(1)}.chat-widget-container{position:fixed;bottom:6.5rem;right:2rem;width:90vw;max-width:400px;max-height:70vh;z-index:998;transform-origin:bottom right;transition:transform .3s cubic-bezier(.4,0,.2,1),opacity .3s;transform:scale(.95) translateY(10px);opacity:0;pointer-events:none}.chat-widget-container.open{transform:scale(1) translateY(0);opacity:1;pointer-events:auto}.chat-widget{width:100%;height:100%;max-height:inherit;background-color:var(--surface-color);border-radius:16px;border:1px solid var(--border-color);box-shadow:0 8px 24px #00000026;display:flex;flex-direction:column;overflow:hidden}.chat-header{padding:.75rem 1.25rem;border-bottom:1px solid var(--border-color);display:flex;align-items:center;gap:.75rem;flex-shrink:0}.chat-header h3{font-size:1.125rem;font-weight:700;flex-grow:1}.chat-header-avatar{width:32px;height:32px;border-radius:50%;background-color:var(--primary-color);display:flex;align-items:center;justify-content:center;color:#fff}body.dark .chat-header-avatar{color:var(--text-primary)}.chat-header-avatar svg{width:1.25rem;height:1.25rem}.chat-body{flex-grow:1;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:1rem}.chat-body::-webkit-scrollbar{width:6px}.chat-body::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:6px}.chat-message{display:flex;gap:.75rem;max-width:90%}.chat-message.user{margin-left:auto;flex-direction:row-reverse}.message-avatar{width:32px;height:32px;border-radius:50%;background-color:var(--background-color);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:auto}.message-avatar svg{width:1.5rem;height:1.5rem;color:var(--text-secondary)}.message-content{padding:.75rem 1rem;border-radius:12px;line-height:1.6}.chat-message.user .message-content{background-color:var(--primary-color);color:#fff;border-top-right-radius:4px}.chat-message.model .message-content{background-color:var(--background-color);color:var(--text-primary);border-top-left-radius:4px}.message-content.typing{display:flex;gap:.3rem}.message-content.typing span{width:8px;height:8px;background-color:var(--text-secondary);border-radius:50%;animation:typing-bounce 1s infinite}.message-content.typing span:nth-child(2){animation-delay:.2s}.message-content.typing span:nth-child(3){animation-delay:.4s}@keyframes typing-bounce{0%,60%,to{transform:translateY(0)}30%{transform:translateY(-4px)}}.chat-quick-nav{padding:.5rem 0}.chat-quick-nav .dropdown-section-header{margin-bottom:.5rem;padding:0 .5rem}.quick-nav-btn{width:100%;text-align:left;padding:.6rem .75rem;border-radius:6px;cursor:pointer;background-color:var(--background-color);border:1px solid var(--border-color);margin-bottom:.5rem;color:var(--text-primary);font-weight:500;transition:all .2s}.quick-nav-btn:hover{border-color:var(--primary-color);background-color:color-mix(in srgb,var(--primary-color) 5%,transparent)}.chat-input-area{padding:1rem;border-top:1px solid var(--border-color);display:flex;gap:.75rem;flex-shrink:0}.chat-input{flex-grow:1;padding:.75rem 1rem;border-radius:8px;border:1px solid var(--border-color);background-color:var(--background-color);color:var(--text-primary);font-family:var(--font-family);font-size:.9rem;resize:none}.chat-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary-color) 20%,transparent)}.chat-send-btn{width:44px;height:44px;border-radius:8px;background-color:var(--primary-color);color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background-color .2s}.chat-send-btn:hover:not(:disabled){background-color:var(--primary-hover-color)}.chat-send-btn:disabled{background-color:var(--text-secondary);opacity:.7}.chat-send-btn svg{width:1.25rem;height:1.25rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.loading-spinner.mini-spinner{width:1rem;height:1rem;border-width:2px}.academy-panel{display:flex;flex-direction:column;gap:1.5rem}.lesson-card{background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:12px;overflow:hidden;transition:all .3s ease-in-out}.lesson-header{display:flex;align-items:center;gap:1rem;padding:1.25rem;cursor:pointer;width:100%;text-align:left;border:none;background:none;color:var(--text-primary)}.lesson-header:hover{background-color:var(--background-color)}.lesson-icon{flex-shrink:0;width:2.5rem;height:2.5rem;border-radius:50%;display:flex;align-items:center;justify-content:center;background-color:color-mix(in srgb,var(--primary-color) 15%,transparent);color:var(--primary-color)}.lesson-icon svg{width:1.5rem;height:1.5rem}.lesson-title-summary{flex-grow:1}.lesson-title-summary h3{font-size:1.25rem;font-weight:600;margin-bottom:.125rem}.lesson-title-summary p{color:var(--text-secondary);font-size:.9rem}.lesson-chevron{transition:transform .3s ease-in-out}.lesson-header[aria-expanded=true] .lesson-chevron{transform:rotate(180deg)}.lesson-content{max-height:0;overflow:hidden;transition:max-height .4s ease-in-out,padding .4s ease-in-out;padding:0 1.25rem;line-height:1.7}.lesson-content p{margin-bottom:1rem;color:var(--text-secondary)}.lesson-content strong{color:var(--text-primary);font-weight:600}.lesson-content ul{list-style-position:inside;padding-left:.5rem;margin-bottom:1rem;color:var(--text-secondary)}.lesson-content li{margin-bottom:.5rem}@media (max-width: 1200px){.listing-content-layout{grid-template-columns:240px 1fr}}@media (max-width: 900px){.listing-content-layout{grid-template-columns:1fr;padding:0 1rem 1rem;gap:1rem}}@media (max-width: 768px){.app-container{grid-template-columns:1fr;grid-template-rows:auto auto 1fr}.app-container.sidebar-collapsed{--sidebar-width: 0px}.sidebar{grid-row:2;flex-direction:row;align-items:center;overflow-x:auto;padding:.5rem 1rem;border-bottom:1px solid var(--border-color);border-right:none}.logo{padding-bottom:0;margin-right:1rem}.nav-menu{display:flex;flex-direction:row}.sidebar-footer{display:none}.nav-separator{width:1px;height:2rem;align-self:center;margin:0 .5rem}.nav-link{flex-direction:row;gap:.75rem;font-size:.875rem;padding:.75rem}.nav-link svg{width:1.25rem;height:1.25rem}.nav-text,.app-container.sidebar-collapsed .nav-text{display:block}.app-content{grid-column:1;grid-row:3}.main-content{padding:1.5rem}.welcome-header h1{font-size:1.75rem}.panel-section-header h2{font-size:1.25rem}.artwork-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.mockup-studio{grid-template-columns:1fr;grid-template-rows:1fr auto}.mockup-studio-left-panel-container{grid-row:2;grid-template-columns:1fr;border-top:1px solid var(--border-color)}.mockup-studio-icon-nav{padding:.25rem;border-right:none}.mockup-nav-menu{flex-direction:row;width:100%;justify-content:space-around;gap:.25rem}.mockup-nav-link{flex-direction:column;font-size:.75rem;gap:.25rem;padding:.5rem .25rem}.mockup-nav-link svg{width:1.25rem;height:1.25rem}.mockup-nav-text{display:block}.mockup-studio-content-panel{display:none}.mockup-studio-canvas-area{grid-row:1}.mockup-studio-properties{position:fixed;bottom:58px;left:1rem;right:1rem;height:40vh;z-index:100;border:1px solid var(--border-color);border-radius:12px;box-shadow:0 -4px 20px #0000004d;transform:translateY(110%);transition:transform .3s ease-in-out}.mockup-studio-properties.visible{transform:translateY(0)}.canvas-toolbar .toolbar-group-left,.canvas-toolbar .toolbar-group-center{display:none}.listing-generator-header{flex-wrap:wrap;padding-top:1.5rem}.float-chat-button{bottom:1rem;right:1rem;width:50px;height:50px}.chat-widget-container{bottom:5rem;right:1rem;left:1rem;width:auto}}