@import"https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&family=Inter:wght@300;400;500;600&display=swap";:root{--bg: #0a0a0f;--bg-card: #12121a;--bg-card-hover: #1a1a24;--border: #2a2a3a;--border-hover: #3a3a4a;--text: #ffffff;--text-muted: #8a8a9a;--text-dim: #5a5a6a;--primary: #6366f1;--primary-hover: #818cf8;--primary-glow: rgba(99, 102, 241, .3);--accent: #22d3ee;--accent-glow: rgba(34, 211, 238, .2);--success: #10b981;--warning: #f59e0b;--error: #ef4444;--gradient: linear-gradient(135deg, #6366f1 0%, #8b5cf6 50%, #a855f7 100%)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;background:var(--bg);color:var(--text);min-height:100vh}.app-container{min-height:100vh;display:flex;flex-direction:column;position:relative}.bg-gradient{position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse 80% 50% at 50% -20%,rgba(99,102,241,.15),transparent),radial-gradient(ellipse 60% 40% at 80% 100%,rgba(139,92,246,.1),transparent),radial-gradient(ellipse 40% 30% at 10% 80%,rgba(34,211,238,.08),transparent);pointer-events:none;z-index:0}.header{position:fixed;top:0;left:0;right:0;z-index:100;padding:1rem 2rem;background:#0a0a0fd9;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid var(--border)}.header-content{max-width:1400px;margin:0 auto;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem}.logo{display:flex;align-items:center;gap:.75rem;font-family:Space Grotesk,sans-serif;font-weight:700;font-size:1.5rem;color:var(--text);cursor:pointer;text-decoration:none;justify-self:start}.logo-icon{display:flex;align-items:center;justify-content:center}.logo-icon svg{width:32px;height:32px}.logo-text span{background:linear-gradient(135deg,#6366f1,#8b5cf6,#a855f7);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.nav-tabs{display:flex;gap:.5rem;background:var(--bg-card);padding:.375rem;border-radius:12px;border:1px solid var(--border);justify-self:center}.nav-tab{display:flex;align-items:center;gap:.5rem;padding:.625rem 1.25rem;font-family:Space Grotesk,sans-serif;font-size:.9375rem;font-weight:500;color:var(--text-muted);background:transparent;border:none;border-radius:8px;cursor:pointer;transition:all .2s ease}.nav-tab:hover{color:var(--text);background:var(--bg-card-hover)}.nav-tab.active{color:var(--text);background:var(--primary)}.nav-tab svg{width:18px;height:18px}.progress-container{display:flex;align-items:center;gap:1rem;justify-self:end}.header-spacer{justify-self:end;width:160px}.progress-bar{width:160px;height:4px;background:var(--border);border-radius:2px;overflow:hidden}.progress-fill{height:100%;background:var(--gradient);border-radius:2px;transition:width .5s cubic-bezier(.4,0,.2,1)}.progress-text{font-size:.875rem;color:var(--text-muted);font-weight:500;min-width:40px}.main-content{flex:1;display:flex;flex-direction:column;align-items:center;padding:7rem 2rem 4rem;position:relative;z-index:2}.main-content.search-page{justify-content:flex-start;padding-top:8rem}.main-content.wizard-page{justify-content:center}.main-content.builder-page{justify-content:flex-start;padding-top:6rem}.question-container,.search-container,.results-container{width:100%;max-width:1200px;animation:fadeInUp .5s ease-out}.question-container{max-width:900px}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.fade-up-hidden{opacity:0;transform:translateY(30px)}.fade-up-visible{opacity:1;transform:translateY(0);transition:opacity .6s ease-out,transform .6s ease-out}.question-header,.search-header,.results-header{text-align:center;margin-bottom:3rem}.question-step{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:var(--bg-card);border:1px solid var(--border);border-radius:100px;font-size:.875rem;color:var(--text-muted);margin-bottom:1.5rem}.question-step-dot{width:8px;height:8px;background:var(--primary);border-radius:50%;animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.question-title,.search-title,.results-title{font-family:Space Grotesk,sans-serif;font-size:2.5rem;font-weight:700;margin-bottom:.75rem;line-height:1.2}.question-subtitle,.search-subtitle,.results-subtitle{font-size:1.125rem;color:var(--text-muted);max-width:600px;margin:0 auto}.results-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1.25rem;background:linear-gradient(135deg,#6366f133,#8b5cf633);border:1px solid var(--primary);border-radius:100px;font-size:.875rem;font-weight:500;color:var(--primary-hover);margin-bottom:1.5rem}.options-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem;margin-bottom:3rem}.options-grid.budget-grid,.options-grid.maturity-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.option-card{position:relative;padding:1.5rem;background:var(--bg-card);border:1px solid var(--border);border-radius:16px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1)}.option-card:hover{border-color:var(--border-hover);transform:translateY(-4px);box-shadow:0 20px 40px -20px var(--primary-glow)}.option-card.selected{border-color:var(--primary);background:var(--bg-card-hover)}.option-icon{font-size:2rem;margin-bottom:1rem;display:block}.option-label{font-family:Space Grotesk,sans-serif;font-size:1.125rem;font-weight:600;margin-bottom:.5rem;color:var(--text)}.option-description{font-size:.875rem;color:var(--text-muted);line-height:1.5}.option-check{position:absolute;top:1rem;right:1rem;width:24px;height:24px;border:2px solid var(--border);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .3s ease}.option-card.selected .option-check{background:var(--primary);border-color:var(--primary)}.option-check svg{width:14px;height:14px;stroke:var(--text);stroke-width:3;opacity:0;transform:scale(.5);transition:all .3s ease}.option-card.selected .option-check svg{opacity:1;transform:scale(1)}.slider-container{padding:2rem;background:var(--bg-card);border:1px solid var(--border);border-radius:20px;margin-bottom:3rem}.slider-track{position:relative;height:8px;background:var(--border);border-radius:4px;margin-bottom:2rem;cursor:pointer}.slider-fill{position:absolute;top:0;left:0;height:100%;background:var(--gradient);border-radius:4px;transition:width .3s ease}.slider-thumb{position:absolute;top:50%;transform:translate(-50%,-50%);width:28px;height:28px;background:var(--text);border-radius:50%;cursor:grab;box-shadow:0 4px 20px var(--primary-glow);transition:transform .2s ease}.slider-thumb:hover{transform:translate(-50%,-50%) scale(1.1)}.slider-labels{display:flex;justify-content:space-between}.slider-label{text-align:center;flex:1;cursor:pointer;padding:1rem .5rem;border-radius:12px;transition:all .3s ease}.slider-label:hover,.slider-label.active{background:var(--bg-card-hover)}.slider-label-title{font-family:Space Grotesk,sans-serif;font-size:.875rem;font-weight:600;color:var(--text);margin-bottom:.25rem}.slider-label.active .slider-label-title{color:var(--primary)}.slider-label-desc{font-size:.75rem;color:var(--text-dim)}.nav-buttons{display:flex;justify-content:space-between;gap:1rem}.btn{padding:1rem 2rem;font-family:Space Grotesk,sans-serif;font-size:1rem;font-weight:600;border-radius:12px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex;align-items:center;gap:.5rem}.btn-secondary{background:transparent;border:1px solid var(--border);color:var(--text-muted)}.btn-secondary:hover{border-color:var(--border-hover);color:var(--text);background:var(--bg-card)}.btn-primary{background:var(--gradient);border:none;color:var(--text);box-shadow:0 4px 20px var(--primary-glow)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 30px var(--primary-glow)}.btn-primary:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}.btn svg{width:20px;height:20px}.search-bar-container{position:relative;margin-bottom:2rem}.search-bar{width:100%;padding:1.25rem 1.5rem 1.25rem 3.5rem;font-family:Inter,sans-serif;font-size:1.125rem;color:var(--text);background:var(--bg-card);border:1px solid var(--border);border-radius:16px;outline:none;transition:all .3s ease}.search-bar::placeholder{color:var(--text-dim)}.search-bar:focus{border-color:var(--primary);box-shadow:0 0 0 4px var(--primary-glow)}.search-icon{position:absolute;left:1.25rem;top:50%;transform:translateY(-50%);color:var(--text-dim);pointer-events:none}.search-icon svg{width:22px;height:22px}.filters-container{display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:2rem;padding:1.5rem;background:var(--bg-card);border:1px solid var(--border);border-radius:16px}.filter-group{flex:1;min-width:150px}.filter-label{display:block;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--text-dim);margin-bottom:.5rem}.filter-select{width:100%;padding:.75rem 2.5rem .75rem 1rem;font-family:Inter,sans-serif;font-size:.9375rem;color:var(--text);background:var(--bg-card-hover);border:1px solid var(--border);border-radius:10px;cursor:pointer;outline:none;transition:all .2s ease;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238a8a9a' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center}.filter-select:hover{border-color:var(--border-hover)}.filter-select:focus{border-color:var(--primary)}.filter-select option{background:var(--bg-card);color:var(--text)}.results-count{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding:0 .5rem}.results-count-text{font-size:.9375rem;color:var(--text-muted)}.results-count-text strong{color:var(--text);font-weight:600}.clear-filters{font-size:.875rem;color:var(--primary);background:none;border:none;cursor:pointer;font-family:inherit;padding:.5rem 1rem;border-radius:8px;transition:all .2s ease}.clear-filters:hover{background:var(--primary-glow)}.recommendations-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:1.5rem;margin-bottom:3rem}.recommendation-card{background:var(--bg-card);border:1px solid var(--border);border-radius:20px;overflow:hidden;transition:all .3s ease;display:flex;flex-direction:column}.recommendation-card:hover{border-color:var(--border-hover);transform:translateY(-4px);box-shadow:0 20px 40px -20px #00000080}.recommendation-card.featured{border-color:var(--primary)}.recommendation-card.featured:before{content:"";display:block;height:3px;background:var(--gradient)}.card-header{padding:1.5rem;border-bottom:1px solid var(--border)}.card-badge{display:inline-block;padding:.25rem .75rem;background:var(--accent-glow);color:var(--accent);font-size:.75rem;font-weight:600;border-radius:100px;margin-bottom:1rem}.card-top-row{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:.75rem}.card-logo-title{display:flex;align-items:center;gap:1rem}.card-logo{width:48px;height:48px;background:var(--bg-card-hover);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;flex-shrink:0;overflow:hidden}.card-logo img{width:100%;height:100%;object-fit:contain;padding:8px}.card-title{font-family:Space Grotesk,sans-serif;font-size:1.375rem;font-weight:700;margin-bottom:.25rem}.card-category{font-size:.8125rem;color:var(--text-dim)}.card-match{display:flex;align-items:center;gap:.375rem;color:var(--success);font-size:.875rem;font-weight:600;flex-shrink:0}.card-description{color:var(--text-muted);font-size:.9375rem;line-height:1.6}.card-body{padding:1.5rem;flex:1}.card-section{margin-bottom:1.25rem}.card-section:last-child{margin-bottom:0}.card-section-title{font-family:Space Grotesk,sans-serif;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--text-dim);margin-bottom:.5rem}.pricing-row{display:flex;align-items:baseline;gap:.5rem}.price{font-family:Space Grotesk,sans-serif;font-size:1.5rem;font-weight:700}.price-period{color:var(--text-muted);font-size:.875rem}.price-note{color:var(--text-dim);font-size:.75rem;margin-top:.125rem}.features-list{list-style:none}.features-list li{display:flex;align-items:flex-start;gap:.5rem;padding:.25rem 0;font-size:.8125rem;color:var(--text-muted)}.features-list li svg{width:14px;height:14px;color:var(--success);flex-shrink:0;margin-top:2px}.pros-cons{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.pros-list,.cons-list{list-style:none}.pros-list li,.cons-list li{padding:.125rem 0;font-size:.75rem}.pros-list li{color:var(--success)}.cons-list li{color:var(--warning)}.rating-row{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.stars{display:flex;gap:.125rem}.star{width:14px;height:14px;color:var(--warning)}.star.empty{color:var(--border)}.rating-text{font-size:.8125rem;color:var(--text-muted);font-weight:600}.rating-count{color:var(--text-dim);font-size:.75rem}.maturity-badge{display:inline-flex;align-items:center;gap:.25rem;padding:.25rem .5rem;border-radius:6px;font-size:.6875rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.maturity-badge.experimental{background:#a855f733;color:#a855f7}.maturity-badge.growing{background:#22d3ee33;color:#22d3ee}.maturity-badge.stable{background:#10b98133;color:#10b981}.maturity-badge.enterprise{background:#6366f133;color:#818cf8}.card-footer{padding:1.25rem 1.5rem;border-top:1px solid var(--border);background:var(--bg-card-hover);margin-top:auto}.btn-affiliate{width:100%;justify-content:center;background:var(--gradient);border:none;color:var(--text);padding:.875rem 1.5rem;font-family:Space Grotesk,sans-serif;font-size:.9375rem;font-weight:600;border-radius:10px;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;gap:.5rem;text-decoration:none}.btn-affiliate:hover{transform:translateY(-2px);box-shadow:0 8px 30px var(--primary-glow)}.summary-section{background:var(--bg-card);border:1px solid var(--border);border-radius:20px;padding:2rem}.summary-title{font-family:Space Grotesk,sans-serif;font-size:1.25rem;font-weight:600;margin-bottom:1.5rem;display:flex;align-items:center;gap:.75rem}.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1rem}.summary-item{padding:1rem;background:var(--bg-card-hover);border-radius:12px}.summary-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text-dim);margin-bottom:.5rem}.summary-value{font-family:Space Grotesk,sans-serif;font-size:.9375rem;font-weight:600;color:var(--text)}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 2rem}.loading-spinner{width:60px;height:60px;border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1.5rem}@keyframes spin{to{transform:rotate(360deg)}}.loading-text{font-size:1.125rem;color:var(--text-muted)}.empty-state{text-align:center;padding:4rem 2rem}.empty-icon{font-size:4rem;margin-bottom:1.5rem;opacity:.5}.empty-title{font-family:Space Grotesk,sans-serif;font-size:1.5rem;font-weight:600;margin-bottom:.75rem}.empty-text{color:var(--text-muted);font-size:1rem}.builder-container{width:100%;max-width:1400px;animation:fadeInUp .5s ease-out}.builder-title{font-family:Space Grotesk,sans-serif;font-size:2.5rem;font-weight:700;margin-bottom:.5rem}.builder-subtitle{color:var(--text-muted);font-size:1.125rem}.builder-layout{display:grid;grid-template-columns:260px 1fr 280px;gap:1.5rem;min-height:600px}.builder-page{width:100%;max-width:1600px;margin:0 auto}.builder-header{text-align:center;margin-bottom:2rem}.builder-title{font-family:Space Grotesk,sans-serif;font-size:2.5rem;font-weight:700;color:#fff;margin-bottom:.5rem}.builder-subtitle{font-size:1.125rem;color:var(--text-muted)}.tool-picker{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;display:flex;flex-direction:column;max-height:calc(100vh - 180px);overflow:hidden;position:relative}.picker-search-container{padding:1rem;border-bottom:1px solid var(--border);flex-shrink:0}.picker-search{display:flex;align-items:center;gap:.75rem;padding:.625rem .875rem;background:var(--bg);border:1px solid var(--border);border-radius:10px;transition:border-color .2s}.picker-search:focus-within{border-color:var(--primary)}.picker-search svg{width:16px;height:16px;color:var(--text-dim);flex-shrink:0}.picker-search input{flex:1;background:transparent;border:none;font-size:.875rem;color:var(--text);outline:none}.picker-search input::placeholder{color:var(--text-dim)}.picker-search .clear-search{background:none;border:none;padding:0;cursor:pointer;color:var(--text-dim);display:flex;align-items:center}.picker-search .clear-search svg{width:14px;height:14px}.picker-layers{flex:1;overflow-y:auto;padding:.5rem .5rem .5rem .75rem;direction:rtl}.picker-layers>*{direction:ltr}.picker-layers::-webkit-scrollbar{width:6px}.picker-layers::-webkit-scrollbar-track{background:transparent;margin:8px 0}.picker-layers::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}.picker-layers::-webkit-scrollbar-thumb:hover{background:var(--border-hover)}.picker-layers{scrollbar-width:thin;scrollbar-color:var(--border) transparent}.picker-layer{margin-bottom:.25rem}.picker-layer.recommended .picker-layer-header{background:#22d3ee14;border-left-color:var(--accent)}.picker-layer.has-tool .picker-layer-header{background:#6366f114;border-left-color:var(--primary)}.picker-layer-header{display:flex;align-items:center;justify-content:space-between;width:100%;padding:.625rem .75rem;font-size:.8125rem;font-weight:600;color:var(--text-muted);border-left:3px solid var(--border);background:var(--bg-card-hover);border-radius:0 8px 8px 0;cursor:pointer;transition:all .2s ease;border-right:none;border-top:none;border-bottom:none}.picker-layer-header:hover{background:#6366f11a}.picker-layer-info{display:flex;align-items:center;gap:.5rem;flex:1;min-width:0}.picker-layer-icon{font-size:1rem;flex-shrink:0}.picker-layer-name{font-size:.8125rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.picker-layer-count{background:var(--bg);padding:.125rem .5rem;border-radius:100px;font-size:.6875rem;flex-shrink:0}.picker-recommended-badge{color:var(--accent);font-size:.75rem;flex-shrink:0}.picker-layer-header svg{width:16px;height:16px;color:var(--text-dim);flex-shrink:0}.picker-layer-tools{display:flex;flex-direction:column;gap:.25rem;padding:.375rem 0 .375rem .75rem}.picker-no-tools{font-size:.75rem;color:var(--text-dim);text-align:center;padding:.5rem}.picker-tool{display:flex;align-items:center;gap:.75rem;padding:.625rem .75rem;background:transparent;border:1px solid transparent;border-radius:10px;cursor:grab;transition:all .2s ease}.picker-tool:hover{background:var(--bg-card-hover);border-color:var(--border)}.picker-tool.selected{background:var(--primary-glow);border-color:var(--primary)}.picker-tool:active{cursor:grabbing}.picker-tool-logo{font-size:1.25rem;width:28px;text-align:center}.picker-tool-logo-img{width:24px;height:24px;object-fit:contain;border-radius:4px}.picker-tool-info{flex:1;min-width:0}.picker-tool-name{font-size:.8125rem;font-weight:500;color:var(--text);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.picker-tool-price{font-size:.6875rem;color:var(--text-dim)}.picker-tools{flex:1;overflow-y:auto;padding:.5rem .5rem .5rem .75rem;direction:rtl}.picker-tools>*{direction:ltr}.picker-tools::-webkit-scrollbar{width:6px}.picker-tools::-webkit-scrollbar-track{background:transparent;margin:8px 0}.picker-tools::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}.picker-tools::-webkit-scrollbar-thumb:hover{background:var(--border-hover)}.picker-tools{scrollbar-width:thin;scrollbar-color:var(--border) transparent}.picker-section{margin-bottom:.5rem}.picker-section-header{display:flex;align-items:center;gap:.5rem;padding:.75rem;font-size:.8125rem;font-weight:600;color:var(--text-muted);border-left:3px solid;background:var(--bg-card-hover);border-radius:8px;margin-bottom:.25rem;cursor:pointer;transition:all .2s ease}.picker-section-header:hover{background:#6366f11a}.picker-section-icon{font-size:1rem}.picker-section-label{flex:1}.picker-section-count{background:var(--border);padding:.125rem .5rem;border-radius:100px;font-size:.6875rem}.picker-section-chevron{display:flex;align-items:center}.picker-section-chevron svg{width:16px;height:16px}.picker-section-tools{display:flex;flex-direction:column;gap:.25rem;padding:.25rem 0 .25rem .5rem}.stack-builder{display:grid;grid-template-columns:320px 1fr;gap:1.5rem;width:100%;max-width:1400px;margin:0 auto;min-height:calc(100vh - 200px)}.builder-catalog{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;display:flex;flex-direction:column;max-height:calc(100vh - 200px);overflow:hidden}.catalog-header{padding:1rem;border-bottom:1px solid var(--border)}.catalog-header h2{font-size:1rem;font-weight:600;margin-bottom:.75rem;color:var(--text)}.catalog-header .search-box{display:flex;align-items:center;gap:.5rem;background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:.5rem .75rem}.catalog-header .search-box svg{width:16px;height:16px;color:var(--text-dim)}.catalog-header .search-box input{flex:1;background:none;border:none;color:var(--text);font-size:.875rem;outline:none}.catalog-header .clear-search{background:none;border:none;padding:0;cursor:pointer;color:var(--text-dim)}.catalog-header .clear-search svg{width:14px;height:14px}.catalog-layers{flex:1;overflow-y:auto;padding:.5rem}.catalog-layer{margin-bottom:.25rem}.catalog-layer.recommended .layer-header{background:#22d3ee1a}.catalog-layer.has-tool .layer-header{background:#6366f11a}.layer-header{display:flex;align-items:center;justify-content:space-between;width:100%;padding:.625rem .75rem;background:transparent;border:none;border-radius:8px;cursor:pointer;transition:background .2s}.layer-header:hover{background:var(--bg-card-hover)}.layer-info{display:flex;align-items:center;gap:.5rem}.layer-icon{font-size:1rem}.layer-name{font-size:.8125rem;font-weight:500;color:var(--text)}.layer-count{font-size:.6875rem;color:var(--text-dim);background:var(--bg);padding:.125rem .375rem;border-radius:4px}.recommended-badge{font-size:.5625rem;font-weight:600;color:var(--accent);background:#22d3ee26;padding:.125rem .375rem;border-radius:4px;text-transform:uppercase}.layer-header svg{width:16px;height:16px;color:var(--text-dim)}.layer-tools{padding:.25rem .5rem .5rem}.layer-tools .no-tools{font-size:.75rem;color:var(--text-dim);text-align:center;padding:.5rem}.tool-card-mini{display:flex;align-items:center;gap:.5rem;padding:.5rem;background:transparent;border:1px solid transparent;border-radius:8px;cursor:pointer;transition:all .2s}.tool-card-mini:hover{background:var(--bg-card-hover);border-color:var(--border)}.tool-card-mini.selected{background:var(--primary-glow);border-color:var(--primary)}.tool-card-mini .tool-logo{font-size:1.25rem}.tool-card-mini .tool-info{flex:1;min-width:0}.tool-card-mini .tool-name{display:block;font-size:.8125rem;font-weight:500;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tool-card-mini .tool-price{font-size:.6875rem;color:var(--text-dim)}.tool-card-mini .add-btn{background:var(--primary-glow);border:none;border-radius:6px;padding:.25rem;cursor:pointer;opacity:0;transition:opacity .2s}.tool-card-mini:hover .add-btn{opacity:1}.tool-card-mini .add-btn svg{width:14px;height:14px;color:var(--primary)}.builder-canvas{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;padding:1.5rem;display:flex;flex-direction:column;gap:1rem}.canvas-header{display:flex;align-items:center;justify-content:space-between}.canvas-header h2{font-size:1.125rem;font-weight:600;color:var(--text)}.canvas-actions .clear-btn{background:#ef44441a;border:1px solid rgba(239,68,68,.3);color:var(--error);padding:.5rem 1rem;border-radius:8px;font-size:.8125rem;cursor:pointer;transition:all .2s}.canvas-actions .clear-btn:hover{background:#ef444433}.stack-metrics{display:flex;gap:1rem;padding:1rem;background:var(--bg);border-radius:12px}.stack-metrics .metric{flex:1;text-align:center}.stack-metrics .metric-value{display:block;font-size:1.5rem;font-weight:700;color:var(--text)}.stack-metrics .metric-label{font-size:.75rem;color:var(--text-dim)}.compatibility-alerts{display:flex;flex-direction:column;gap:.5rem}.compatibility-alerts .alert{display:flex;align-items:center;gap:.5rem;padding:.625rem .875rem;border-radius:8px;font-size:.8125rem}.compatibility-alerts .alert svg{width:16px;height:16px;flex-shrink:0}.compatibility-alerts .alert.synergy{background:#10b9811a;color:var(--success)}.compatibility-alerts .alert.warning{background:#f59e0b1a;color:var(--warning)}.stack-summary{background:var(--bg);border-radius:12px;padding:1rem}.summary-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem;color:var(--text-muted);font-size:.875rem;font-weight:500}.summary-header svg{width:16px;height:16px}.selected-tools{display:flex;flex-direction:column;gap:.375rem}.selected-tool{display:flex;align-items:center;gap:.5rem;padding:.375rem .5rem;background:var(--bg-card);border-radius:6px;font-size:.8125rem}.selected-tool .tool-layer{font-size:.875rem}.selected-tool .tool-name{flex:1;color:var(--text)}.selected-tool .tool-price{color:var(--text-dim);font-size:.75rem}.stack-visual{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;padding:1.5rem;display:flex;flex-direction:column;align-items:center}.stack-visual-header{width:100%;display:flex;justify-content:flex-end;margin-bottom:1rem}.stack-canvas{width:100%;flex:1;display:flex;align-items:center;justify-content:center}.stack-grid-15{display:grid;grid-template-columns:repeat(5,1fr);gap:.875rem;width:100%}.stack-slot-15{aspect-ratio:1;min-height:110px;background:var(--bg-card-hover);border:2px dashed var(--border);border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;position:relative;overflow:hidden;padding:.75rem .5rem}.stack-slot-15:hover{border-color:var(--border-hover);transform:scale(1.02);box-shadow:0 8px 30px #0000004d}.stack-slot-15.drag-over{border-color:var(--primary);background:var(--primary-glow);border-style:solid}.stack-slot-15.filled{border-style:solid;border-color:var(--layer-color, var(--primary));background:linear-gradient(135deg,#6366f126,#8b5cf61a)}.stack-slot-15.recommended{border-color:var(--accent);animation:recommendPulse 2s ease-in-out infinite}.slot-15-header{display:flex;align-items:center;gap:.375rem;margin-bottom:.5rem;max-width:100%}.slot-15-icon{font-size:.875rem;flex-shrink:0}.slot-15-label{font-size:.6875rem;font-weight:600;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.slot-15-empty{display:flex;flex-direction:column;align-items:center;gap:.25rem;color:var(--text-dim);text-align:center}.slot-15-empty svg{width:18px;height:18px;opacity:.5}.slot-15-empty span{font-size:.625rem;opacity:.7}.slot-15-content{display:flex;flex-direction:column;align-items:center;gap:.375rem;text-align:center;width:100%;padding:0 .25rem}.slot-15-tool-logo{font-size:1.75rem}.slot-15-tool-logo-img{width:36px;height:36px;object-fit:contain;border-radius:6px}.slot-15-tool-name{font-size:.8125rem;font-weight:600;color:var(--text);line-height:1.2;text-align:center;word-break:break-word;max-width:100%}.slot-15-platform-label{font-size:.625rem;color:var(--accent);margin-top:.125rem}.slot-15-remove{position:absolute;top:6px;right:6px;background:#ef444433;border:none;border-radius:6px;padding:4px;cursor:pointer;opacity:0;transition:opacity .2s,background .2s;display:flex;align-items:center;justify-content:center}.slot-15-remove svg{width:12px;height:12px;color:var(--error)}.stack-slot-15:hover .slot-15-remove{opacity:1}.slot-15-remove:hover{background:#ef444466}.stack-slot-15.covered{border-style:solid;border-color:var(--success);background:#10b9811a}.slot-15-covered{display:flex;flex-direction:column;align-items:center;gap:.25rem;text-align:center}.slot-15-covered svg{width:24px;height:24px;color:var(--success)}.slot-15-covered-label{font-size:.8125rem;font-weight:600;color:var(--text)}.slot-15-covered-by{font-size:.625rem;color:var(--success)}.slot-recommended-badge{position:absolute;top:4px;left:4px;right:4px;padding:3px 0;background:var(--accent);color:var(--bg);font-size:8px;font-weight:700;border-radius:3px;text-transform:uppercase;letter-spacing:.3px;z-index:2;text-align:center}.stack-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:.75rem;width:100%;max-width:900px}.stack-slot{aspect-ratio:1.2;min-height:100px;background:var(--bg-card-hover);border:2px dashed var(--border);border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;position:relative;overflow:hidden;padding:.5rem}.stack-slot:hover:not(.covered){border-color:var(--border-hover);transform:scale(1.03);box-shadow:0 8px 30px #0000004d}.stack-slot.drag-target{border-color:var(--primary);background:var(--primary-glow);border-style:solid}.stack-slot.filled{border-style:solid;border-color:var(--layer-color, var(--primary));background:linear-gradient(135deg,#6366f11a,#8b5cf61a)}.stack-slot.recommended{border-color:var(--accent);animation:recommendPulse 2s ease-in-out infinite}@keyframes recommendPulse{0%,to{box-shadow:0 0 #22d3ee66;background:var(--bg-card-hover)}50%{box-shadow:0 0 20px 5px #22d3ee33;background:#22d3ee0d}}.stack-slot.covered{border-style:solid;border-color:var(--success);background:#10b9811a;cursor:default}.slot-covered{display:flex;flex-direction:column;align-items:center;gap:.25rem;text-align:center;padding:.5rem}.slot-covered-icon{font-size:1.25rem;color:var(--success)}.slot-covered-label{font-size:.75rem;font-weight:600;color:var(--text-muted)}.slot-covered-by{font-size:.625rem;color:var(--text-dim)}.slot-empty{display:flex;flex-direction:column;align-items:center;gap:.25rem;color:var(--text-dim);text-align:center;padding:.25rem}.slot-empty svg{width:16px;height:16px;opacity:.5}.slot-empty span{font-size:.625rem;opacity:.7}.slot-header{display:flex;align-items:center;gap:.25rem;margin-bottom:.25rem}.slot-icon{font-size:.875rem}.slot-label{font-size:.625rem;font-weight:600;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:80px}.slot-tool{display:flex;flex-direction:column;align-items:center;gap:.25rem;text-align:center}.slot-tool .tool-logo{font-size:1.5rem}.slot-tool .tool-name{font-size:.75rem;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:90%}.slot-tool .remove-btn{position:absolute;top:4px;right:4px;background:#ef444433;border:none;border-radius:4px;padding:2px;cursor:pointer;opacity:0;transition:opacity .2s}.slot-tool .remove-btn svg{width:12px;height:12px;color:var(--error)}.stack-slot:hover .remove-btn{opacity:1}.slot-empty-icon{font-size:1.75rem}.slot-empty-label{font-size:.8125rem;font-weight:500}.slot-recommended-badge{position:absolute;top:.5rem;right:.5rem;padding:.25rem .5rem;background:var(--accent);color:var(--bg);font-size:.625rem;font-weight:700;border-radius:4px;text-transform:uppercase}.slot-content{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:.75rem;width:100%;text-align:center}.slot-logo{font-size:2rem}.slot-info{display:flex;flex-direction:column;align-items:center;gap:.125rem}.slot-name{font-size:.875rem;font-weight:600;color:var(--text)}.slot-layer{font-size:.6875rem;color:var(--text-dim)}.slot-remove{position:absolute;top:.5rem;right:.5rem;background:#ef444433;border:none;border-radius:6px;padding:.375rem;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s}.stack-slot:hover .slot-remove{opacity:1}.slot-remove svg{width:14px;height:14px;color:var(--error)}.slot-remove:hover{background:#ef44444d}.clear-stack-btn{margin-top:1.5rem;padding:.75rem 1.5rem;background:transparent;border:1px solid var(--border);border-radius:10px;color:var(--text-muted);font-family:Space Grotesk,sans-serif;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s ease}.clear-stack-btn:hover{border-color:var(--error);color:var(--error);background:#ef44441a}.clear-stack-btn-small{margin-top:1rem;padding:.5rem 1rem;background:transparent;border:1px solid var(--border);border-radius:8px;color:var(--text-dim);font-family:Space Grotesk,sans-serif;font-size:.75rem;font-weight:500;cursor:pointer;transition:all .2s ease;align-self:center}.clear-stack-btn-small:hover{border-color:var(--error);color:var(--error);background:#ef44441a}.metrics-panel{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;padding:1.5rem;display:flex;flex-direction:column;gap:1rem;max-height:calc(100vh - 180px);overflow-y:auto}.metrics-panel::-webkit-scrollbar{width:6px}.metrics-panel::-webkit-scrollbar-track{background:transparent}.metrics-panel::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}.metrics-title{font-family:Space Grotesk,sans-serif;font-size:1.25rem;font-weight:600;color:var(--text);margin-bottom:.5rem}.analysis-card{background:var(--bg-card-hover);border-radius:12px;padding:1rem 1.25rem}.analysis-card-header{display:flex;align-items:center;justify-content:space-between}.analysis-card-label{font-size:.9375rem;color:var(--text-muted);font-weight:500}.analysis-card-value{font-family:Space Grotesk,sans-serif;font-size:1.5rem;font-weight:700;color:var(--text)}.analysis-card-value.cost{color:var(--success)}.analysis-card-unit{font-size:.875rem;font-weight:400;color:var(--text-muted)}.analysis-card-note{font-size:.75rem;color:var(--text-dim);margin-top:.25rem}.analysis-bar{height:6px;background:var(--border);border-radius:3px;overflow:hidden;margin-top:.75rem}.analysis-bar-fill{height:100%;background:var(--accent);border-radius:3px;transition:width .5s ease}.analysis-card.consider-adding{background:transparent;border:1px solid var(--border);padding:1rem}.consider-adding-header{display:flex;align-items:center;gap:.5rem;color:var(--text-muted);font-size:.875rem;margin-bottom:.75rem}.consider-adding-header svg{width:16px;height:16px;color:var(--accent)}.consider-adding-list{display:flex;flex-direction:column;gap:.5rem}.consider-adding-item{font-size:.875rem;color:var(--accent);padding:.5rem .75rem;background:#22d3ee14;border-left:2px solid var(--accent);border-radius:0 6px 6px 0}.analysis-empty-state{display:flex;flex-direction:column;align-items:center;text-align:center;padding:2rem 1rem;margin-top:1rem}.empty-state-icon{font-size:3rem;margin-bottom:1rem;opacity:.6}.analysis-empty-state p{font-size:.875rem;color:var(--text-dim);line-height:1.5}.analysis-card-note.covered-note{color:var(--success);margin-top:.375rem}.metric-card{background:var(--bg-card-hover);border-radius:12px;padding:1rem}.metric-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.metric-header svg{width:18px;height:18px;margin-right:.5rem}.metric-label{font-size:.8125rem;color:var(--text-muted);font-weight:500}.metric-value{font-family:Space Grotesk,sans-serif;font-size:1.25rem;font-weight:700;color:var(--text)}.metric-value.budget{color:var(--success)}.metric-unit{font-size:.75rem;font-weight:400;color:var(--text-muted)}.metric-bar{height:6px;background:var(--border);border-radius:3px;overflow:hidden}.metric-bar-fill{height:100%;background:var(--gradient);border-radius:3px;transition:width .5s ease}.metric-note{font-size:.6875rem;color:var(--text-dim);margin-top:.25rem}.metric-note.covered-note{color:var(--success)}.metric-card.synergies .metric-header svg{color:var(--success)}.metric-card.issues .metric-header svg{color:var(--warning)}.metric-card.missing .metric-header svg{color:var(--accent)}.metric-list{display:flex;flex-direction:column;gap:.5rem;margin-top:.75rem}.metric-item{font-size:.75rem;padding:.5rem .75rem;border-radius:8px;background:var(--bg-card)}.metric-item.synergy{color:var(--success);border-left:2px solid var(--success)}.metric-item.warning,.metric-item.redundant{color:var(--warning);border-left:2px solid var(--warning)}.metric-item.tool-item{display:flex;align-items:center;gap:.5rem;color:var(--text);border-left:none}.tool-item-icon{font-size:1rem}.tool-item-name{flex:1;font-weight:500}.tool-item-price{color:var(--text-dim);font-size:.6875rem}.metric-item.info{color:var(--accent);border-left:2px solid var(--accent)}.metrics-empty{text-align:center;padding:2rem 1rem;color:var(--text-dim)}.metrics-empty-icon{font-size:2.5rem;margin-bottom:1rem;opacity:.5}.metrics-empty p{font-size:.875rem;line-height:1.5}@media(max-width:1400px){.stack-grid-15{grid-template-columns:repeat(5,1fr);gap:.625rem}.stack-slot-15{min-height:100px}}@media(max-width:1200px){.builder-layout{grid-template-columns:220px 1fr 240px}.stack-builder{grid-template-columns:280px 1fr}.stack-grid,.stack-grid-15{grid-template-columns:repeat(4,1fr)}}@media(max-width:1000px){.builder-layout{grid-template-columns:1fr;gap:1rem}.tool-picker{max-height:300px;order:1}.stack-visual{order:2;min-height:400px}.metrics-panel{max-height:none;order:3}.stack-builder{grid-template-columns:1fr}.builder-catalog{max-height:300px}.stack-grid{max-width:100%;grid-template-columns:repeat(3,1fr)}.stack-grid-15{grid-template-columns:repeat(3,1fr)}.builder-title{font-size:2rem}}@media(max-width:768px){.header{padding:1rem}.header-content{grid-template-columns:1fr;gap:.75rem}.logo,.nav-tabs,.progress-container,.header-spacer{justify-self:center}.main-content,.main-content.builder-page{padding-top:12rem}.question-title,.search-title,.builder-title{font-size:1.75rem}.options-grid,.recommendations-grid{grid-template-columns:1fr}.filters-container{flex-direction:column}.filter-group{min-width:100%}.pros-cons{grid-template-columns:1fr}.stack-grid,.stack-grid-15{grid-template-columns:repeat(3,1fr)}.stack-slot,.stack-slot-15{min-height:90px}}@media(max-width:480px){.stack-grid,.stack-grid-15{grid-template-columns:repeat(2,1fr);gap:.5rem}.stack-slot{min-height:80px}.stack-slot-15{min-height:85px}.slot-logo{font-size:1.5rem}.slot-name{font-size:.7rem}.slot-15-tool-logo{font-size:1.5rem}.slot-15-tool-name{font-size:.75rem}}.about-container{max-width:900px;margin:0 auto;padding:2rem;animation:fadeInUp .6s ease-out}.about-header{text-align:center;margin-bottom:3rem}.about-title{font-family:Space Grotesk,sans-serif;font-size:2.5rem;font-weight:700;margin-bottom:.75rem;background:var(--gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.about-subtitle{color:var(--text-muted);font-size:1.125rem}.about-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;margin-bottom:3rem}.about-card{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;padding:1.75rem;transition:all .3s ease}.about-card:hover{border-color:var(--border-hover);transform:translateY(-2px)}.about-card-icon{width:48px;height:48px;background:var(--primary-glow);border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:1rem}.about-card-icon svg{width:24px;height:24px;color:var(--primary)}.about-card h3{font-family:Space Grotesk,sans-serif;font-size:1.25rem;font-weight:600;margin-bottom:.75rem;color:var(--text)}.about-card p{color:var(--text-muted);font-size:.9375rem;line-height:1.6}.about-methodology{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;padding:2rem;margin-bottom:2rem}.about-methodology h2{font-family:Space Grotesk,sans-serif;font-size:1.5rem;font-weight:600;margin-bottom:1.5rem;text-align:center}.methodology-steps{display:flex;flex-direction:column;gap:1.25rem}.methodology-step{display:flex;align-items:flex-start;gap:1rem}.step-number{width:32px;height:32px;background:var(--gradient);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.875rem;flex-shrink:0}.methodology-step h4{font-size:1rem;font-weight:600;margin-bottom:.25rem;color:var(--text)}.methodology-step p{color:var(--text-muted);font-size:.875rem;line-height:1.5}.about-cta{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap}.header-right{display:flex;justify-content:flex-end;align-items:center}.about-btn{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:transparent;border:1px solid var(--border);border-radius:10px;color:var(--text-muted);font-size:.875rem;cursor:pointer;transition:all .2s ease}.about-btn svg{width:16px;height:16px}.about-btn:hover{border-color:var(--border-hover);color:var(--text)}.about-btn.active{background:var(--bg-card);border-color:var(--primary);color:var(--text)}@media(max-width:768px){.about-container{padding:1rem}.about-title{font-size:1.75rem}.about-grid{grid-template-columns:1fr}.about-cta{flex-direction:column}.about-cta .btn{width:100%;justify-content:center}}