.eco-landing-page{width:100%;min-height:100vh;background:#fafafa;color:#1a1a1a;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;overflow-x:hidden;line-height:1.5}.landing-header{position:sticky;top:0;z-index:1000;background:#ffffffeb;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid #E8E8E8}.landing-nav-inner{max-width:1240px;margin:0 auto;padding:14px 24px;display:flex;align-items:center;justify-content:space-between;gap:20px}.landing-brand{display:flex;align-items:center;gap:10px}.landing-logo-img{width:32px;height:32px}.landing-brand-text{display:flex;flex-direction:column}.landing-brand-title{font-size:18px;font-weight:800;letter-spacing:-.5px;color:#1a1a1a;line-height:1.1}.landing-brand-badge{font-size:10px;color:#2e7d32;font-weight:600;letter-spacing:.2px}.landing-nav-links{display:flex;align-items:center;gap:32px}.landing-nav-link{font-size:14px;font-weight:500;color:#4b5563;text-decoration:none;transition:color .15s ease,transform .15s ease;letter-spacing:-.1px}.landing-nav-link:hover{color:#2e7d32}.admin-link{display:flex;align-items:center;gap:6px;padding:4px 10px;background:#f1f8e9;border:1px solid #C8E6C9;border-radius:20px;color:#2e7d32;font-weight:600;font-size:12px}.pulse-dot{width:7px;height:7px;background:#2e7d32;border-radius:50%;box-shadow:0 0 0 2px #2e7d3233;animation:pulse-health 2s infinite}@keyframes pulse-health{0%{transform:scale(.95);box-shadow:0 0 #2e7d3280}70%{transform:scale(1);box-shadow:0 0 0 6px #2e7d3200}to{transform:scale(.95);box-shadow:0 0 #2e7d3200}}.landing-nav-actions{display:flex;align-items:center;gap:12px}.user-greeting{font-size:13px;color:#555}.landing-btn-ghost{padding:8px 16px;background:transparent;border:1px solid #D0D0D0;color:#333;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s}.landing-btn-ghost:hover{background:#f5f5f5;border-color:#b0b0b0}.landing-btn-primary{padding:8px 18px;background:#2e7d32;color:#fff;border:none;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s;box-shadow:0 2px 8px #2e7d3240}.landing-btn-primary:hover{background:#1b5e20;transform:translateY(-1px)}.landing-btn-secondary{padding:10px 20px;background:#f1f8e9;border:1px solid #C8E6C9;color:#2e7d32;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s}.landing-btn-secondary:hover{background:#e8f5e9;border-color:#a5d6a7}.landing-hero{position:relative;padding:56px 24px 44px;text-align:center;background:radial-gradient(circle at 50% 10%,#e8f5e9,#fafafa 70%);overflow:hidden}.landing-hero-content{max-width:860px;margin:0 auto;position:relative;z-index:2;text-align:center}.hero-headline{font-size:46px;font-weight:800;line-height:1.18;letter-spacing:-1.2px;color:#111;margin:0 auto 16px;max-width:760px;text-align:center}.hero-gradient-text{background:linear-gradient(135deg,#1b5e20,#2e7d32,#43a047);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.hero-subline{font-size:16px;color:#4b5563;max-width:660px;margin:0 auto 28px;line-height:1.6;text-align:center}.hero-cta-group{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin-bottom:36px}.hero-btn{padding:11px 24px;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s}.hero-btn-primary{background:#2e7d32;color:#fff;border:none;box-shadow:0 4px 14px #2e7d3259}.hero-btn-primary:hover{background:#1b5e20;transform:translateY(-2px);box-shadow:0 6px 20px #2e7d3273}.hero-btn-secondary{background:#fff;border:1px solid #D0D0D0;color:#222;box-shadow:0 2px 6px #0000000a}.hero-btn-secondary:hover{background:#f9f9f9;border-color:#b0b0b0;transform:translateY(-2px)}.hero-btn-outline{background:#f1f8e9;border:1px solid #C8E6C9;color:#2e7d32}.hero-btn-outline:hover{background:#e8f5e9;border-color:#a5d6a7}.hero-metrics-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;max-width:860px;margin:0 auto}.metric-card{background:#fff;border:1px solid #E5E7EB;border-radius:12px;padding:16px 14px;box-shadow:0 2px 12px #00000008;display:flex;flex-direction:column;align-items:center;text-align:center}.metric-number{font-size:28px;font-weight:800;color:#2e7d32;line-height:1.1;margin-bottom:3px}.metric-label{font-size:12px;font-weight:700;color:#1f2937;margin-bottom:2px}.metric-sub{font-size:11px;color:#6b7280}.landing-section{padding:56px 24px;max-width:1160px;margin:0 auto}.section-header{text-align:center;max-width:680px;margin:0 auto 32px}.section-eyebrow{font-size:11px;font-weight:700;letter-spacing:.8px;color:#2e7d32;text-transform:uppercase;margin-bottom:6px;display:block}.section-title{font-size:28px;font-weight:800;letter-spacing:-.6px;color:#1a1a1a;margin:0 0 10px}.section-desc{font-size:14px;color:#4b5563;margin:0;line-height:1.6}.demo-stage-box{background:#fff;border:1px solid #E5E7EB;border-radius:16px;padding:28px 24px;box-shadow:0 4px 20px #00000008;max-width:1040px;margin:0 auto}.flow-pipeline-container{display:flex;align-items:center;justify-content:space-between;gap:8px}.flow-stage-card{flex:1;background:#fff;border:1px solid #E5E5E5;border-radius:12px;padding:16px 14px;position:relative;transition:all .2s}.flow-stage-card:hover{border-color:#2e7d32;box-shadow:0 6px 18px #2e7d3214;transform:translateY(-2px)}.flow-stage-card.highlight{border-color:#2e7d32;background:#f1f8e9}.stage-num{font-size:11px;font-weight:800;color:#2e7d32;margin-bottom:6px}.stage-icon{font-size:22px;margin-bottom:6px}.stage-title{font-size:13px;font-weight:700;color:#1a1a1a;margin:0 0 6px}.stage-text{font-size:11px;color:#666;margin:0;line-height:1.4}.flow-arrow{font-size:18px;color:#bdbdbd;font-weight:700;-webkit-user-select:none;user-select:none}.code-comparison-box{display:grid;grid-template-columns:1fr 1fr;gap:20px}.code-panel{background:#1e1e1e;border-radius:14px;overflow:hidden;border:1px solid #333333}.code-panel.highlight-eco{border:1px solid #2E7D32;box-shadow:0 8px 24px #2e7d3226}.code-panel-header{background:#252526;padding:12px 18px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #333333}.badge-red{font-size:11px;font-weight:700;color:#ef5350}.badge-green{font-size:11px;font-weight:700;color:#81c784}.code-lang{font-size:11px;color:#888}.code-block{margin:0;padding:18px;font-family:Consolas,Fira Code,monospace;font-size:12.5px;line-height:1.6;color:#d4d4d4;overflow-x:auto}.c-comment{color:#6a9955}.c-keyword{color:#c586c0}.c-string{color:#ce9178}.model-tier-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.tier-card{background:#fff;border:1px solid #E5E5E5;border-radius:16px;padding:30px 24px;position:relative;display:flex;flex-direction:column}.tier-card.popular{border:2px solid #2E7D32;box-shadow:0 10px 30px #2e7d321a}.tier-badge-popular{position:absolute;top:-12px;left:50%;transform:translate(-50%);background:#2e7d32;color:#fff;font-size:10px;font-weight:800;padding:3px 12px;border-radius:20px;letter-spacing:.5px}.tier-badge{display:inline-block;font-size:11px;font-weight:800;padding:4px 10px;border-radius:6px;margin-bottom:12px;align-self:flex-start}.tier-badge.fast{background:#e3f2fd;color:#1976d2}.tier-badge.balanced{background:#e8f5e9;color:#2e7d32}.tier-badge.reasoning{background:#f3e5f5;color:#7b1fa2}.tier-name{font-size:20px;font-weight:700;color:#1a1a1a;margin:0 0 8px}.tier-desc{font-size:13px;color:#666;margin:0 0 20px;line-height:1.5}.tier-price{font-size:15px;font-weight:800;color:#2e7d32;margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid #EEEEEE}.tier-models{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px;font-size:13px;color:#444}.calc-container{background:#fff;border:1px solid #E5E5E5;border-radius:20px;padding:40px;display:grid;grid-template-columns:1fr 1fr;gap:40px;box-shadow:0 10px 40px #00000008}.slider-group{margin-top:30px}.slider-label-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.slider-label-row label{font-size:14px;font-weight:600;color:#222}.spend-display{font-size:20px;font-weight:800;color:#2e7d32}.eco-slider{width:100%;height:8px;border-radius:4px;background:#e0e0e0;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;accent-color:#2E7D32}.slider-ticks{display:flex;justify-content:space-between;font-size:11px;color:#888;margin-top:8px}.calc-results-card{background:#f1f8e9;border:1px solid #C8E6C9;border-radius:16px;padding:28px;display:flex;flex-direction:column;justify-content:center}.calc-result-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.calc-res-label{font-size:14px;color:#444;font-weight:500}.calc-res-val{font-size:22px;font-weight:700;color:#1a1a1a}.calc-res-val.green{color:#2e7d32;font-size:28px;font-weight:800}.calc-divider{height:1px;background:#c8e6c9;margin:18px 0}.calc-impact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;text-align:center}.impact-item{display:flex;flex-direction:column}.impact-val{font-size:16px;font-weight:800;color:#2e7d32}.impact-lbl{font-size:11px;color:#666}.admin-preview-card{background:#111827;color:#fff;border-radius:20px;padding:44px;display:grid;grid-template-columns:1.2fr .8fr;gap:36px;align-items:center}.admin-badge{display:inline-block;font-size:11px;font-weight:800;color:#34d399;letter-spacing:.8px;margin-bottom:12px}.admin-preview-content h2{font-size:26px;font-weight:800;margin:0 0 12px}.admin-preview-content p{color:#9ca3af;font-size:14px;margin:0 0 24px;line-height:1.6}.mini-health-card{background:#1f2937;border:1px solid #374151;border-radius:14px;padding:20px;display:flex;flex-direction:column;gap:12px}.health-row{display:flex;align-items:center;gap:10px;font-size:13px;color:#e5e7eb}.health-row span:last-child{margin-left:auto;color:#9ca3af;font-size:12px}.h-dot{width:8px;height:8px;border-radius:50%}.h-dot.green{background:#10b981}.h-dot.blue{background:#3b82f6}.landing-bottom-cta{background:radial-gradient(circle at 50% 50%,#e8f5e9,#fafafa);padding:80px 24px;text-align:center;border-top:1px solid #E8E8E8}.cta-inner{max-width:680px;margin:0 auto}.cta-inner h2{font-size:36px;font-weight:800;letter-spacing:-1px;margin:0 0 16px}.cta-inner p{font-size:16px;color:#666;margin:0 0 32px}.bottom-cta-buttons{display:flex;justify-content:center;gap:16px;flex-wrap:wrap}.landing-footer{background:#fff;border-top:1px solid #EEEEEE;padding:60px 24px 40px}.footer-inner{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1.2fr;gap:40px}.footer-brand{display:flex;align-items:center;gap:8px;font-size:18px;font-weight:800;color:#1a1a1a;margin-bottom:12px}.footer-tagline{font-size:13px;color:#666;margin:0 0 16px;max-width:280px}.footer-copy{font-size:11px;color:#999}.footer-col h4{font-size:12px;font-weight:800;color:#1a1a1a;text-transform:uppercase;letter-spacing:.8px;margin:0 0 16px}.footer-col a,.footer-col span{display:block;font-size:13px;color:#666;text-decoration:none;margin-bottom:10px;transition:color .15s}.footer-col a:hover{color:#2e7d32}@media(max-width:960px){.hero-headline{font-size:38px}.hero-metrics-strip{grid-template-columns:repeat(2,1fr)}.flow-pipeline-container{flex-direction:column}.flow-arrow{transform:rotate(90deg);margin:6px 0}.code-comparison-box,.model-tier-grid,.calc-container,.admin-preview-card{grid-template-columns:1fr}.footer-inner{grid-template-columns:1fr 1fr}.landing-nav-links{display:none}}@media(max-width:600px){.hero-headline{font-size:30px}.hero-metrics-strip,.footer-inner{grid-template-columns:1fr}}.hero-mascot-stage{display:flex;flex-direction:column;align-items:center;gap:12px;position:relative;z-index:2}.hero-mascot-status{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:#1b5e20;background:#ffffffe6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid #C8E6C9;padding:5px 14px;border-radius:24px;box-shadow:0 4px 14px #2e7d3214;transition:all .2s ease}.mascot-state-pill-dot{width:7px;height:7px;background:#2e7d32;border-radius:50%;box-shadow:0 0 0 2px #2e7d3240;animation:pulse-health 2s infinite}.hero-glow-bg{position:absolute;top:-120px;left:50%;transform:translate(-50%);width:800px;height:480px;background:radial-gradient(circle,#4caf501f,#a5d6a70d 50%,#fff0 70%);pointer-events:none;z-index:0}.badge-pill{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:#2e7d32;background:#fff;border:1px solid #C8E6C9;padding:6px 14px;border-radius:20px;box-shadow:0 2px 6px #00000005;transition:all .2s ease}.badge-pill:hover{background:#f1f8e9;border-color:#81c784;transform:translateY(-1px)}.badge-icon{font-size:13px;line-height:1}.badge-text{font-size:11.5px;font-weight:700;letter-spacing:.2px}.problem-cards-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.problem-card{background:#fff9f9;border:1px solid #FFCDD2;border-radius:16px;padding:28px;transition:all .2s ease}.problem-card:hover{border-color:#ef5350;box-shadow:0 8px 24px #c6282814;transform:translateY(-2px)}.solution-banner{background:linear-gradient(135deg,#e8f5e9,#fff);border:1.5px solid #A5D6A7;border-radius:20px;padding:40px;text-align:center;box-shadow:0 8px 32px #2e7d320d}.journey-flow-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.j-card{background:#fff;border:1px solid #E5E5E5;border-radius:16px;padding:24px;transition:all .2s ease}.j-card:hover{border-color:#2e7d32;box-shadow:0 6px 20px #2e7d3212;transform:translateY(-2px)}.mem-pill-card{background:#fafafa;border:1px solid #E5E5E5;border-radius:12px;padding:18px 14px;text-align:center;transition:all .2s ease}.mem-pill-card:hover{border-color:#2e7d32;transform:translateY(-2px)}.mem-pill-card.highlight{border-color:#2e7d32;background:#f1f8e9;box-shadow:0 4px 12px #2e7d321a}.mem-pill-num{font-size:11px;font-weight:800;color:#2e7d32;margin-bottom:4px}.mem-pill-card h4{font-size:14px;font-weight:700;margin:0 0 6px;color:#1a1a1a}.mem-pill-card p{font-size:11px;color:#666;margin:0;line-height:1.4}.mcp-tag{font-size:11px;font-weight:700;color:#69f0ae;background:#1f2922;border:1px solid #2E4733;padding:4px 10px;border-radius:6px;display:inline-block}.surf-card{background:#fff;border:1px solid #E5E5E5;border-radius:16px;padding:30px 24px;transition:all .2s ease}.surf-card:hover{border-color:#2e7d32;box-shadow:0 8px 24px #2e7d3214;transform:translateY(-2px)}.surf-card.highlight{border-color:#2e7d32;background:#f1f8e9}.surf-card h3{font-size:18px;font-weight:700;margin:0 0 8px;color:#1a1a1a}.surf-card p{font-size:13px;color:#666;margin:0;line-height:1.5}.demo-preset-btn{background:#fff;border:1px solid #D0D0D0;color:#444;font-size:11.5px;font-weight:600;padding:6px 12px;border-radius:20px;cursor:pointer;transition:all .15s ease}.demo-preset-btn:hover{background:#f1f8e9;border-color:#2e7d32;color:#2e7d32}.mascot-demo-stage{display:flex;flex-direction:column;align-items:center;margin-top:10px}.mascot-status-pill{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:#1b5e20;background:#fff;border:1px solid #C8E6C9;padding:6px 16px;border-radius:24px;box-shadow:0 2px 10px #2e7d3214}.calc-info{font-size:13px;color:#666;line-height:1.5}.hero-transformation-card{max-width:860px;margin:40px auto 0;background:#fff;border:1.5px solid #E0E0E0;border-radius:20px;box-shadow:0 16px 40px #0000000f,0 2px 10px #2e7d3214;padding:32px;position:relative;overflow:hidden}.hero-pipeline-grid{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px}.pipeline-node{background:#fbfbfb;border:1px solid #E8E8E8;border-radius:14px;padding:20px;text-align:left}.pipeline-node.raw{border-color:#ffcdd2;background:#fff9f9}.pipeline-node.optimized{border-color:#a5d6a7;background:#f1f8e9}.pipeline-node-title{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.8px;margin-bottom:6px}.pipeline-node.raw .pipeline-node-title{color:#c62828}.pipeline-node.optimized .pipeline-node-title{color:#2e7d32}.pipeline-stat{font-size:28px;font-weight:800;color:#111;line-height:1.1;margin-bottom:6px}.pipeline-sub{font-size:12px;color:#666}.pipeline-arrow-hub{display:flex;flex-direction:column;align-items:center;gap:8px;position:relative}.pipeline-badge{background:#2e7d32;color:#fff;font-size:11px;font-weight:800;padding:6px 14px;border-radius:20px;box-shadow:0 4px 12px #2e7d3240;letter-spacing:.3px;white-space:nowrap}.comparison-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:20px}.comparison-col{border-radius:16px;padding:32px;border:1.5px solid}.comparison-col.without{background:#fffdfd;border-color:#ffcdd2}.comparison-col.with{background:#f7fcf7;border-color:#a5d6a7;box-shadow:0 8px 28px #2e7d3214}.comparison-header{display:flex;align-items:center;gap:12px;margin-bottom:20px}.comparison-tag{font-size:11px;font-weight:800;text-transform:uppercase;padding:4px 10px;border-radius:6px;letter-spacing:.5px}.comparison-col.without .comparison-tag{background:#ffebee;color:#c62828}.comparison-col.with .comparison-tag{background:#e8f5e9;color:#2e7d32}.comparison-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:14px}.comparison-item{display:flex;align-items:flex-start;gap:12px;font-size:14px;line-height:1.5;color:#333}.comparison-icon{font-size:16px;flex-shrink:0;margin-top:1px}.layer-diagram-box{background:#fff;border:1.5px solid #E0E0E0;border-radius:20px;padding:40px;box-shadow:0 8px 24px #0000000a;text-align:center;max-width:980px;margin:0 auto}.layer-tier-row{display:flex;justify-content:center;align-items:center;gap:14px;flex-wrap:wrap}.layer-badge{background:#fafafa;border:1px solid #D5D5D5;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:700;color:#222;display:inline-flex;align-items:center;gap:8px}.layer-eco-core{background:linear-gradient(135deg,#e8f5e9,#fff);border:2px solid #2E7D32;border-radius:16px;padding:24px;margin:20px auto;max-width:680px;box-shadow:0 8px 24px #2e7d321f}.engine-stepper-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.stepper-stage-card{background:#fff;border:1px solid #E8E8E8;border-radius:12px;padding:20px;text-align:left;transition:all .2s;position:relative}.stepper-stage-card:hover{border-color:#2e7d32;transform:translateY(-2px);box-shadow:0 6px 16px #2e7d3214}.stepper-num{font-size:11px;font-weight:800;color:#2e7d32;margin-bottom:4px}.stepper-title{font-size:15px;font-weight:700;color:#111;margin:0 0 6px}.stepper-desc{font-size:12.5px;color:#666;line-height:1.5;margin:0}.demo-stage-box{background:#fff;border:1.5px solid #A5D6A7;border-radius:20px;padding:36px;box-shadow:0 12px 32px #2e7d3217;max-width:960px;margin:0 auto}.bar-metric-row{margin-bottom:20px}.bar-metric-labels{display:flex;justify-content:space-between;font-size:13px;font-weight:600;color:#333;margin-bottom:6px}.bar-track{height:14px;background:#eee;border-radius:7px;overflow:hidden;display:flex}.bar-fill-before{background:#ef5350;height:100%}.bar-fill-after{background:#2e7d32;height:100%;border-radius:7px}.persona-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.persona-card{background:#fff;border:1px solid #E5E5E5;border-radius:14px;padding:24px;transition:all .2s;text-align:left}.persona-card:hover{border-color:#2e7d32;box-shadow:0 6px 20px #2e7d3214;transform:translateY(-2px)}.persona-icon{font-size:28px;margin-bottom:12px}.persona-title{font-size:16px;font-weight:700;color:#111;margin:0 0 8px}.persona-text{font-size:13px;color:#666;line-height:1.5;margin:0}.security-pillars-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.security-pillar-card{background:#fff;border:1px solid #E5E5E5;border-radius:14px;padding:24px;text-align:left}.security-pillar-title{font-size:15px;font-weight:700;color:#1b5e20;margin:0 0 6px;display:flex;align-items:center;gap:8px}.security-pillar-text{font-size:13px;color:#555;line-height:1.5;margin:0}@media(max-width:960px){.hero-pipeline-grid,.comparison-grid,.engine-stepper-grid{grid-template-columns:1fr}.persona-grid{grid-template-columns:1fr 1fr}.security-pillars-grid{grid-template-columns:1fr}}@media(max-width:600px){.persona-grid{grid-template-columns:1fr}}:root{--eco-green: #2E7D32;--eco-green-dark: #1B5E20;--eco-green-light: #43A047;--eco-green-surface: #E8F5E9;--eco-green-surface-hover: #C8E6C9;--eco-green-subtle: #F1F8E9;--bg-primary: #FAFAFA;--bg-white: #FFFFFF;--bg-sidebar: #FFFFFF;--bg-panel: #FFFFFF;--border-light: #E8E8E8;--border-subtle: #F0F0F0;--text-primary: #1A1A1A;--text-secondary: #666666;--text-tertiary: #999999;--text-muted: #BDBDBD;--blue: #1976D2;--blue-surface: #E3F2FD;--purple: #7B1FA2;--purple-surface: #F3E5F5;--orange: #E65100;--orange-surface: #FFF3E0;--red: #C62828;--red-surface: #FFEBEE;--amber: #F57F17;--amber-surface: #FFF8E1;--font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-xs: .6875rem;--font-sm: .75rem;--font-base: .8125rem;--font-md: .875rem;--font-lg: 1rem;--font-xl: 1.25rem;--font-2xl: 1.5rem;--font-3xl: 2rem;--font-4xl: 2.75rem;--font-5xl: 3.5rem;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--space-16: 64px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;--radius-2xl: 24px;--radius-full: 50%;--shadow-sm: 0 1px 2px rgba(0,0,0,.04);--shadow-md: 0 2px 8px rgba(0,0,0,.06);--shadow-lg: 0 4px 16px rgba(0,0,0,.08);--shadow-xl: 0 8px 32px rgba(0,0,0,.1);--transition-fast: .15s ease;--transition-base: .2s ease;--transition-slow: .3s ease;--sidebar-width: 260px;--panel-width: 320px;--header-height: 64px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-family);font-size:var(--font-md);color:var(--text-primary);background:var(--bg-primary);line-height:1.5;overflow:hidden;height:100vh}#app{display:flex;height:100vh;width:100vw;overflow:hidden}.sidebar{width:var(--sidebar-width);min-width:var(--sidebar-width);height:100vh;background:var(--bg-sidebar);border-right:1px solid var(--border-light);display:flex;flex-direction:column;padding:var(--space-5);overflow-y:auto;overflow-x:hidden;z-index:10}.sidebar-logo{display:flex;align-items:center;margin-bottom:0;cursor:pointer;text-decoration:none}.sidebar-logo img{width:34px;height:34px}.sidebar-logo h1{font-size:var(--font-xl);font-weight:800;color:var(--text-primary);letter-spacing:-.5px}.sidebar-tagline{display:none!important}.sidebar-new-chat{display:flex;align-items:center;justify-content:center;gap:var(--space-2);width:100%;padding:var(--space-3) var(--space-4);background:var(--eco-green);color:#fff;border:none;border-radius:var(--radius-md);font-size:var(--font-md);font-weight:600;cursor:pointer;transition:all var(--transition-base);margin-bottom:var(--space-6);font-family:var(--font-family)}.sidebar-new-chat:hover{background:var(--eco-green-dark);transform:translateY(-1px);box-shadow:var(--shadow-md)}.sidebar-nav{display:flex;flex-direction:column;gap:var(--space-1);flex:1}.nav-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius-sm);font-size:var(--font-md);font-weight:500;color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);border:none;background:none;width:100%;text-align:left;font-family:var(--font-family)}.nav-item:hover{background:var(--eco-green-surface);color:var(--text-primary)}.nav-item.active{background:var(--eco-green-surface);color:var(--eco-green);font-weight:600}.nav-item svg{width:20px;height:20px;flex-shrink:0}.nav-item.active svg{color:var(--eco-green)}.sidebar-efficiency{margin-top:auto;padding:var(--space-5);background:var(--bg-primary);border-radius:var(--radius-md);border:1px solid var(--border-light)}.sidebar-efficiency-label{display:flex;align-items:center;gap:var(--space-2);font-size:var(--font-sm);color:var(--text-secondary);margin-bottom:var(--space-3);font-weight:500}.sidebar-efficiency-label svg{width:16px;height:16px;color:var(--eco-green)}.sidebar-efficiency-score{display:flex;align-items:baseline;gap:var(--space-2)}.sidebar-efficiency-score .score{font-size:var(--font-4xl);font-weight:700;color:var(--eco-green-dark);line-height:1}.sidebar-efficiency-score .max{font-size:var(--font-lg);color:var(--text-tertiary);font-weight:400}.sidebar-efficiency-change{font-size:var(--font-sm);color:var(--eco-green);font-weight:500;margin-top:var(--space-2)}.sidebar-efficiency-chart{margin-top:var(--space-3);height:40px}.sidebar-efficiency-chart canvas{width:100%;height:100%}.sidebar-workspace{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4);margin-top:var(--space-4);border-radius:var(--radius-md);cursor:pointer;transition:background var(--transition-fast)}.sidebar-workspace:hover{background:var(--bg-primary)}.sidebar-workspace-avatar{width:36px;height:36px;border-radius:var(--radius-sm);background:var(--eco-green);color:#fff;display:flex;align-items:center;justify-content:center;font-size:var(--font-sm);font-weight:700}.sidebar-workspace-info{flex:1}.sidebar-workspace-name{font-size:var(--font-md);font-weight:600;color:var(--text-primary)}.sidebar-workspace-type{font-size:var(--font-xs);color:var(--text-tertiary)}.sidebar-workspace-chevron{color:var(--text-tertiary)}.main-content{flex:1;height:100vh;overflow-y:auto;overflow-x:hidden;background:var(--bg-primary);position:relative}.context-panel{display:none!important;width:0!important;min-width:0!important;height:0!important;padding:0!important;border:none!important;overflow:hidden!important;visibility:hidden!important}.context-panel.hidden{display:none!important}.quick-connect-strip{display:flex;justify-content:space-between;align-items:center;background:linear-gradient(135deg,#f6fbf7,#fff 55%,#f1f8e9);border:1.5px solid #A5D6A7;border-radius:16px;padding:18px 24px;margin-bottom:24px;flex-wrap:wrap;gap:16px;box-shadow:0 4px 20px -2px #2e7d3214,0 2px 6px -1px #00000005;transition:all .25s ease}.quick-connect-strip:hover{box-shadow:0 8px 28px -4px #2e7d321f,0 3px 8px -1px #00000008;border-color:#81c784}.quick-connect-icon-badge{width:46px;height:46px;border-radius:12px;background:linear-gradient(135deg,#2e7d32,#1b5e20);display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0;box-shadow:0 4px 12px #2e7d3247;position:relative;transition:transform .2s ease}.quick-connect-strip:hover .quick-connect-icon-badge{transform:scale(1.04)}.quick-connect-beacon{position:absolute;top:-3px;right:-3px;width:10px;height:10px;background:#00e676;border:2px solid #FFFFFF;border-radius:50%;box-shadow:0 0 8px #00e676;animation:gatewayPulse 2s infinite ease-in-out}@keyframes gatewayPulse{0%{box-shadow:0 0 #00e676b3}70%{box-shadow:0 0 0 6px #00e67600}to{box-shadow:0 0 #00e67600}}.token-chip{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid #C8E6C9;border-radius:8px;padding:4px 10px;box-shadow:0 1px 2px #00000008;transition:border-color .2s ease,box-shadow .2s ease}.token-chip:hover{border-color:#81c784;box-shadow:0 2px 5px #2e7d321a}.token-chip-label{display:inline-flex;align-items:center;gap:4px;font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.4px}.token-chip-code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:12px;font-weight:700;background:transparent;padding:0}.btn-gateway-copy{font-size:12px;padding:8px 14px;background:#fff;border:1.5px solid #81C784;color:#1b5e20;font-weight:700;cursor:pointer;border-radius:9px;display:inline-flex;align-items:center;gap:6px;box-shadow:0 1px 3px #0000000a;transition:all .2s ease}.btn-gateway-copy:hover{background:#f1f8e9;border-color:#2e7d32;transform:translateY(-1px);box-shadow:0 3px 8px #2e7d3226}.btn-gateway-url{font-size:12px;padding:8px 14px;background:#fff;border:1px solid #C8E6C9;color:#374151;font-weight:600;cursor:pointer;border-radius:9px;display:inline-flex;align-items:center;gap:6px;box-shadow:0 1px 3px #0000000a;transition:all .2s ease}.btn-gateway-url:hover{background:#f9fafb;border-color:#a5d6a7;color:#1b5e20;transform:translateY(-1px);box-shadow:0 2px 6px #0000000f}.btn-gateway-setup{font-size:12px;padding:8px 16px;background:linear-gradient(135deg,#2e7d32,#1b5e20);color:#fff;border:none;cursor:pointer;border-radius:9px;font-weight:700;display:inline-flex;align-items:center;gap:6px;box-shadow:0 2px 8px #2e7d3240;transition:all .2s ease}.btn-gateway-setup:hover{box-shadow:0 4px 14px #2e7d3259;transform:translateY(-1px);filter:brightness(1.05)}.dashboard-hub-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5, 20px);margin-bottom:var(--space-6, 24px)}.hub-card{background:var(--bg-white, #ffffff);border:1px solid var(--border-light, #e0e0e0);border-radius:var(--radius-lg, 16px);padding:20px 22px;box-shadow:0 2px 8px #00000008;display:flex;flex-direction:column;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.hub-card:hover{box-shadow:0 6px 16px #2e7d3214;border-color:#a5d6a7}.hub-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--border-subtle, #f0f0f0)}.hub-card-title{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:700;color:var(--text-primary, #111827)}.hub-card-title svg{width:18px;height:18px;color:var(--eco-green, #2E7D32)}.hub-status-badge{font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:6px;background:#f4f6f8;color:var(--text-secondary, #6B7280)}.hub-status-badge.green{background:#e8f5e9;color:#2e7d32}.hub-card-body{flex:1;display:flex;flex-direction:column;justify-content:space-between}@media(max-width:1024px){.dashboard-hub-grid{grid-template-columns:1fr}}.panel-section{padding-bottom:var(--space-6);border-bottom:1px solid var(--border-subtle)}.panel-section:last-child{border-bottom:none}.panel-section-title{display:flex;align-items:center;gap:var(--space-2);font-size:var(--font-md);font-weight:600;color:var(--text-primary);margin-bottom:var(--space-4)}.panel-section-title svg{width:18px;height:18px;color:var(--text-secondary)}.panel-row{display:flex;justify-content:space-between;align-items:center;padding:var(--space-2) 0}.panel-row-label{font-size:var(--font-base);color:var(--text-secondary)}.panel-row-value{font-size:var(--font-base);font-weight:600;color:var(--text-primary)}.panel-row-value.green{color:var(--eco-green)}.panel-row-value.red{color:var(--red)}.panel-badge{display:inline-flex;align-items:center;padding:var(--space-1) var(--space-3);background:var(--eco-green-surface);color:var(--eco-green-dark);border-radius:var(--radius-sm);font-size:var(--font-sm);font-weight:500}.panel-efficiency-bar{width:100%;height:6px;background:var(--border-light);border-radius:3px;overflow:hidden;margin-top:var(--space-2)}.panel-efficiency-bar-fill{height:100%;background:var(--eco-green);border-radius:3px;transition:width var(--transition-slow)}.panel-action{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius-sm);font-size:var(--font-base);color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);border:1px solid var(--border-light);background:var(--bg-white);width:100%;text-align:left;font-family:var(--font-family);font-weight:500;margin-bottom:var(--space-2)}.panel-action:hover{background:var(--eco-green-surface);color:var(--eco-green);border-color:var(--eco-green-surface-hover)}.panel-action svg{width:16px;height:16px;flex-shrink:0}.panel-action:last-child{margin-bottom:0}.top-bar{display:flex;align-items:center;justify-content:space-between;padding:10px var(--space-8);border-bottom:1px solid var(--border-light);background:var(--bg-white);position:sticky;top:0;z-index:5;min-height:52px}.model-selector{display:flex;align-items:center;gap:8px;padding:4px 12px;background:var(--bg-white);border:1px solid var(--border-light);border-radius:12px;cursor:pointer;transition:all var(--transition-fast);font-family:var(--font-family);box-shadow:0 1px 2px #00000005}.model-selector:hover{border-color:var(--eco-green);box-shadow:var(--shadow-sm)}.model-selector-icon{width:24px;height:24px;background:var(--eco-green-surface);border-radius:6px;display:flex;align-items:center;justify-content:center}.model-selector-icon svg{width:14px;height:14px;color:var(--eco-green)}.model-selector-text{display:flex;flex-direction:column}.model-selector-label{font-size:10px;color:var(--text-tertiary);font-weight:500;line-height:1.2}.model-selector-value{font-size:13px;font-weight:600;color:var(--text-primary);line-height:1.2}.model-selector-chevron{color:var(--text-tertiary);margin-left:2px;display:flex;align-items:center}.model-selector-chevron svg{width:14px;height:14px}.top-bar-actions{display:flex;align-items:center;gap:12px}.top-bar-icon-btn{width:32px;height:32px;border-radius:var(--radius-full);background:transparent;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;position:relative;transition:all var(--transition-fast);color:#374151;padding:0}.top-bar-icon-btn:hover{background:var(--eco-green-surface);color:var(--eco-green)}.top-bar-icon-btn svg{width:20px;height:20px}.notification-badge{position:absolute;top:1px;right:2px;width:13px;height:13px;background:var(--eco-green);color:#fff;border-radius:var(--radius-full);font-size:8px;font-weight:700;display:flex;align-items:center;justify-content:center;border:1.5px solid #FFFFFF}.top-bar-avatar{width:30px;height:30px;border-radius:var(--radius-full);background:var(--eco-green-surface);color:var(--eco-green-dark);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;cursor:pointer;border:none;transition:transform var(--transition-fast)}.top-bar-avatar:hover{transform:scale(1.05)}.chat-container{display:flex;flex-direction:column;height:calc(100vh - var(--header-height))}.chat-welcome{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-8);gap:var(--space-6)}.chat-welcome-logo{position:relative;width:140px;height:140px;display:flex;align-items:center;justify-content:center}.chat-welcome-logo-glow{position:absolute;width:180px;height:180px;border-radius:var(--radius-full);background:radial-gradient(circle,rgba(46,125,50,.08) 0%,transparent 70%);animation:pulse-glow 3s ease-in-out infinite}@keyframes pulse-glow{0%,to{transform:scale(1);opacity:.6}50%{transform:scale(1.1);opacity:1}}.chat-welcome-logo img{width:100px;height:100px;position:relative;z-index:1}.chat-welcome-particles{position:absolute;width:200px;height:200px}.particle{position:absolute;width:4px;height:4px;border-radius:var(--radius-full);background:var(--eco-green);opacity:.3;animation:float-particle 4s ease-in-out infinite}.particle:nth-child(1){top:10%;left:20%;animation-delay:0s}.particle:nth-child(2){top:30%;right:15%;animation-delay:.5s}.particle:nth-child(3){bottom:20%;left:30%;animation-delay:1s}.particle:nth-child(4){top:15%;right:30%;animation-delay:1.5s}.particle:nth-child(5){bottom:30%;right:20%;animation-delay:2s}.particle:nth-child(6){top:50%;left:10%;animation-delay:2.5s}@keyframes float-particle{0%,to{transform:translateY(0) scale(1);opacity:.3}50%{transform:translateY(-8px) scale(1.5);opacity:.6}}.chat-welcome-title{font-size:var(--font-3xl);font-weight:800;color:var(--text-primary);letter-spacing:-1px}.chat-welcome-subtitle{font-size:var(--font-lg);color:var(--text-secondary);margin-top:calc(-1 * var(--space-4))}.chat-input-wrapper{padding:0 var(--space-6) var(--space-4);width:100%;max-width:680px;margin:0 auto}.chat-input-box{display:flex;flex-direction:column;background:var(--bg-white);border:1px solid #E5E7EB;border-radius:16px;padding:14px 16px 10px;transition:border-color var(--transition-base),box-shadow var(--transition-base);box-shadow:0 1px 3px #00000005}.chat-input-box:focus-within{border-color:var(--eco-green);box-shadow:0 0 0 3px #2e7d3214}.chat-input-box textarea{width:100%;border:none;outline:none;resize:none;font-family:var(--font-family);font-size:14px;color:var(--text-primary);background:transparent;min-height:24px;max-height:100px;line-height:1.5}.chat-input-box textarea::placeholder{color:#9ca3af;font-size:14px}.chat-input-actions{display:flex;align-items:center;justify-content:space-between;margin-top:8px}.chat-welcome-tools{display:flex;gap:6px}.chat-pill-tool{width:30px;height:30px;border-radius:8px;border:1px solid #E5E7EB;background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#6b7280;transition:all var(--transition-fast);padding:0}.chat-pill-tool:hover{background:var(--eco-green-surface);color:var(--eco-green);border-color:var(--eco-green-surface-hover)}.chat-pill-tool svg{width:15px;height:15px}.chat-icon-tool{background:transparent;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#9ca3af;padding:6px;border-radius:6px;transition:all var(--transition-fast)}.chat-icon-tool:hover{color:#4b5563;background:var(--eco-green-surface)}.chat-icon-tool svg{width:18px;height:18px}.chat-input-right-tools{display:flex;align-items:center;gap:8px}.chat-send-btn{width:32px;height:32px;border-radius:var(--radius-full);background:var(--eco-green-surface);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--eco-green);transition:all var(--transition-base);padding:0;flex-shrink:0}.chat-send-btn svg{width:15px;height:15px}.chat-send-btn:hover,.chat-send-btn.active{background:var(--eco-green);color:#fff}.chat-send-btn.active:hover{background:var(--eco-green-dark)}.chat-quick-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-3);width:100%;max-width:760px;margin:0 auto;padding:0 var(--space-8) var(--space-6)}.chat-quick-action{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4) var(--space-5);background:var(--bg-white);border:1px solid var(--border-light);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);font-family:var(--font-family)}.chat-quick-action:hover{border-color:var(--eco-green-surface-hover);background:var(--eco-green-surface);transform:translateY(-2px);box-shadow:var(--shadow-md)}.chat-quick-action-icon{width:36px;height:36px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;flex-shrink:0}.chat-quick-action-icon.green{background:var(--eco-green-surface);color:var(--eco-green)}.chat-quick-action-icon.blue{background:var(--blue-surface);color:var(--blue)}.chat-quick-action-icon.purple{background:var(--purple-surface);color:var(--purple)}.chat-quick-action-icon.orange{background:var(--orange-surface);color:var(--orange)}.chat-quick-action-text{font-size:var(--font-base);font-weight:500;color:var(--text-primary);line-height:1.3}.chat-footer{text-align:center;padding:var(--space-2) 0 var(--space-5);font-size:var(--font-sm);color:var(--text-tertiary);display:flex;align-items:center;justify-content:center;gap:var(--space-2)}.chat-footer svg{width:14px;height:14px;color:var(--eco-green)}.chat-messages{flex:1;padding:var(--space-6) var(--space-8);overflow-y:auto;display:flex;flex-direction:column;gap:var(--space-6);max-width:820px;margin:0 auto;width:100%}.chat-message{display:flex;gap:var(--space-4);animation:message-in .3s ease-out}@keyframes message-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.chat-message-avatar{width:36px;height:36px;border-radius:var(--radius-full);flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:var(--font-sm);font-weight:600}.chat-message-avatar.user{background:var(--bg-primary);color:var(--text-secondary);border:1px solid var(--border-light)}.chat-message-avatar.ai{background:var(--eco-green-surface);color:var(--eco-green)}.chat-message-content{flex:1;min-width:0}.chat-message-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-3)}.chat-message-name{font-weight:600;font-size:var(--font-md)}.chat-message-time{font-size:var(--font-sm);color:var(--text-tertiary);display:flex;align-items:center;gap:var(--space-1)}.chat-user-bubble{background:var(--eco-green-surface);padding:var(--space-4) var(--space-5);border-radius:var(--radius-lg);border-top-left-radius:var(--space-1);font-size:var(--font-md);line-height:1.6;color:var(--text-primary);display:inline-block}.pipeline-container{background:var(--bg-white);border:1px solid var(--border-light);border-radius:var(--radius-lg);padding:var(--space-5) var(--space-6);margin:var(--space-4) 0}.pipeline-label{font-size:var(--font-base);color:var(--text-secondary);margin-bottom:var(--space-4)}.pipeline-steps{display:flex;align-items:center;gap:0;position:relative}.pipeline-step{display:flex;flex-direction:column;align-items:center;flex:1;position:relative;z-index:1}.pipeline-step-circle{width:44px;height:44px;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;background:var(--border-light);color:var(--text-tertiary);transition:all .5s ease;position:relative}.pipeline-step.completed .pipeline-step-circle{background:var(--eco-green);color:#fff}.pipeline-step.active .pipeline-step-circle{background:var(--eco-green);color:#fff;box-shadow:0 0 0 4px #2e7d3226;animation:step-pulse 1.5s ease-in-out infinite}@keyframes step-pulse{0%,to{box-shadow:0 0 0 4px #2e7d3226}50%{box-shadow:0 0 0 8px #2e7d3214}}.pipeline-step.pending .pipeline-step-circle{background:var(--bg-primary);border:2px solid var(--border-light);color:var(--text-muted)}.pipeline-step-circle svg{width:20px;height:20px}.pipeline-step-label{font-size:var(--font-sm);font-weight:600;color:var(--text-primary);margin-top:var(--space-2);text-align:center}.pipeline-step-sublabel{font-size:var(--font-xs);color:var(--text-tertiary);text-align:center}.pipeline-step.pending .pipeline-step-label{color:var(--text-tertiary)}.pipeline-connector{height:3px;flex:1;background:var(--border-light);position:relative;top:-18px;z-index:0;margin:0 -4px}.pipeline-connector.completed{background:var(--eco-green)}.model-selected-card{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-4) var(--space-5);background:var(--eco-green-surface);border-radius:var(--radius-md);margin:var(--space-3) 0}.model-selected-check{width:28px;height:28px;border-radius:var(--radius-full);background:var(--eco-green);color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0}.model-selected-info{flex:1}.model-selected-name{font-weight:600;color:var(--eco-green-dark)}.model-selected-reason{font-size:var(--font-sm);color:var(--text-secondary);margin-top:2px}.model-selected-badge{padding:var(--space-1) var(--space-3);background:var(--bg-white);border-radius:var(--radius-sm);font-size:var(--font-sm);font-weight:600;color:var(--eco-green)}.ai-response-content{padding:var(--space-4) 0;line-height:1.7;color:var(--text-primary)}.ai-response-content h3{font-size:var(--font-lg);font-weight:700;margin:var(--space-4) 0 var(--space-2)}.ai-response-content p{margin-bottom:var(--space-3)}.risk-item{display:flex;gap:var(--space-3);padding:var(--space-3) 0}.risk-number{width:24px;height:24px;border-radius:var(--radius-full);background:var(--eco-green);color:#fff;display:flex;align-items:center;justify-content:center;font-size:var(--font-xs);font-weight:700;flex-shrink:0;margin-top:2px}.risk-text{font-size:var(--font-md);line-height:1.5}.risk-text strong{color:var(--text-primary)}.chat-message-actions{display:flex;gap:var(--space-3);margin-top:var(--space-4);padding-top:var(--space-3)}.chat-action-btn{width:32px;height:32px;border-radius:var(--radius-sm);border:none;background:none;cursor:pointer;color:var(--text-tertiary);display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast)}.chat-action-btn:hover{background:var(--eco-green-surface);color:var(--eco-green)}.chat-input-bottom{padding:var(--space-4) var(--space-8);border-top:1px solid var(--border-subtle);background:var(--bg-white)}.chat-input-bottom .chat-input-wrapper{padding:0}.dashboard-container{padding:var(--space-8)}.view-title{font-size:var(--font-2xl);font-weight:700;color:var(--text-primary);margin-bottom:var(--space-6);letter-spacing:-.5px}.view-subtitle{font-size:var(--font-md);color:var(--text-secondary);margin-top:calc(-1 * var(--space-4));margin-bottom:var(--space-6)}.metrics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:var(--space-4);margin-bottom:var(--space-6)}.metric-card{background:var(--bg-white);border:1px solid var(--border-light);border-radius:var(--radius-md);padding:var(--space-5);transition:all var(--transition-base)}.metric-card:hover{border-color:var(--eco-green-surface-hover);box-shadow:var(--shadow-sm)}.metric-card.highlight{background:var(--eco-green-surface);border-color:var(--eco-green-surface-hover)}.metric-card-label{font-size:var(--font-sm);color:var(--text-secondary);font-weight:500;text-transform:uppercase;letter-spacing:.5px;margin-bottom:var(--space-2)}.metric-card-value{font-size:var(--font-2xl);font-weight:700;color:var(--text-primary);line-height:1.2}.metric-card.highlight .metric-card-value{color:var(--eco-green-dark)}.metric-card-change{font-size:var(--font-sm);font-weight:500;margin-top:var(--space-1)}.metric-card-change.positive{color:var(--eco-green)}.metric-card-change.negative{color:var(--red)}.metric-card-change.neutral{color:var(--text-tertiary)}.dashboard-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-6)}.dashboard-card{background:var(--bg-white);border:1px solid var(--border-light);border-radius:var(--radius-lg);padding:var(--space-6)}.dashboard-card-title{font-size:var(--font-lg);font-weight:600;color:var(--text-primary);margin-bottom:var(--space-5)}.bar-chart{display:flex;flex-direction:column;gap:var(--space-3)}.bar-chart-row{display:flex;align-items:center;gap:var(--space-3)}.bar-chart-label{width:100px;font-size:var(--font-base);color:var(--text-secondary);flex-shrink:0;text-align:right}.bar-chart-track{flex:1;height:28px;background:var(--bg-primary);border-radius:var(--radius-sm);overflow:hidden;position:relative}.bar-chart-fill{height:100%;border-radius:var(--radius-sm);transition:width .8s ease;display:flex;align-items:center;padding-left:var(--space-3);font-size:var(--font-sm);font-weight:600;color:#fff}.bar-chart-fill.green{background:var(--eco-green)}.bar-chart-fill.green-light{background:var(--eco-green-light)}.bar-chart-fill.blue{background:var(--blue)}.bar-chart-fill.purple{background:var(--purple)}.bar-chart-value{font-size:var(--font-sm);color:var(--text-secondary);margin-left:var(--space-3);white-space:nowrap}.data-table{width:100%;border-collapse:collapse}.data-table th{font-size:var(--font-sm);font-weight:600;color:var(--text-tertiary);text-align:left;padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border-light);text-transform:uppercase;letter-spacing:.5px}.data-table td{padding:var(--space-4);border-bottom:1px solid var(--border-subtle);font-size:var(--font-md)}.data-table tr:last-child td{border-bottom:none}.data-table tr:hover td{background:var(--eco-green-subtle)}.efficiency-badge{display:inline-flex;align-items:center;padding:var(--space-1) var(--space-3);border-radius:var(--radius-sm);font-size:var(--font-sm);font-weight:600}.efficiency-badge.high{background:var(--eco-green-surface);color:var(--eco-green-dark)}.efficiency-badge.medium{background:var(--amber-surface);color:var(--amber)}.efficiency-badge.low{background:var(--red-surface);color:var(--red)}.trend-indicator{font-weight:600}.trend-indicator.up{color:var(--eco-green)}.trend-indicator.down{color:var(--red)}.trend-indicator.flat{color:var(--text-tertiary)}.chart-canvas-container{width:100%;height:200px;margin-top:var(--space-4)}.chart-canvas-container canvas{width:100%;height:100%}.workloads-container{padding:var(--space-8)}.workloads-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(380px,1fr));gap:var(--space-5)}.workload-card{background:var(--bg-white);border:1px solid var(--border-light);border-radius:var(--radius-lg);padding:var(--space-6);transition:all var(--transition-base)}.workload-card:hover{border-color:var(--eco-green-surface-hover);box-shadow:var(--shadow-md);transform:translateY(-2px)}.workload-card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--space-4)}.workload-card-title{font-size:var(--font-lg);font-weight:600;color:var(--text-primary)}.workload-card-status{padding:var(--space-1) var(--space-3);border-radius:var(--radius-sm);font-size:var(--font-xs);font-weight:600;text-transform:uppercase;letter-spacing:.5px}.workload-card-status.active{background:var(--eco-green-surface);color:var(--eco-green)}.workload-card-status.warning{background:var(--amber-surface);color:var(--amber)}.workload-card-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3);margin-bottom:var(--space-5)}.workload-metric{text-align:center;padding:var(--space-3);background:var(--bg-primary);border-radius:var(--radius-sm)}.workload-metric-value{font-size:var(--font-lg);font-weight:700;color:var(--text-primary)}.workload-metric-label{font-size:var(--font-xs);color:var(--text-tertiary);margin-top:2px}.workload-card-footer{display:flex;gap:var(--space-3);padding-top:var(--space-4);border-top:1px solid var(--border-subtle)}.workload-card-detail{display:flex;justify-content:space-between;padding:var(--space-2) 0;font-size:var(--font-base)}.workload-card-detail-label{color:var(--text-secondary)}.workload-card-detail-value{font-weight:600;color:var(--text-primary)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);border-radius:var(--radius-sm);font-size:var(--font-base);font-weight:600;cursor:pointer;transition:all var(--transition-fast);border:1px solid transparent;font-family:var(--font-family);white-space:nowrap}.btn-primary{background:var(--eco-green);color:#fff}.btn-primary:hover{background:var(--eco-green-dark);transform:translateY(-1px)}.btn-secondary{background:var(--bg-white);color:var(--text-secondary);border-color:var(--border-light)}.btn-secondary:hover{background:var(--eco-green-surface);color:var(--eco-green);border-color:var(--eco-green-surface-hover)}.btn-ghost{background:none;color:var(--eco-green);padding:var(--space-2) var(--space-3)}.btn-ghost:hover{background:var(--eco-green-surface)}.optimizer-container{padding:var(--space-8)}.optimizer-layout{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-6)}.optimizer-section{background:var(--bg-white);border:1px solid var(--border-light);border-radius:var(--radius-lg);padding:var(--space-6)}.optimizer-section-title{font-size:var(--font-lg);font-weight:600;color:var(--text-primary);margin-bottom:var(--space-5);display:flex;align-items:center;gap:var(--space-2)}.optimizer-metric-row{display:flex;justify-content:space-between;align-items:center;padding:var(--space-3) 0;border-bottom:1px solid var(--border-subtle)}.optimizer-metric-row:last-child{border-bottom:none}.optimizer-recommendation{background:var(--eco-green-surface);border:1px solid var(--eco-green-surface-hover);border-radius:var(--radius-lg);padding:var(--space-6)}.optimizer-recommendation-title{font-size:var(--font-lg);font-weight:700;color:var(--eco-green-dark);margin-bottom:var(--space-4);display:flex;align-items:center;gap:var(--space-2)}.optimizer-action-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) 0;font-size:var(--font-md);color:var(--text-primary)}.optimizer-action-item svg{width:16px;height:16px;color:var(--eco-green);flex-shrink:0}.optimizer-results{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-3);margin-top:var(--space-5)}.optimizer-result-card{text-align:center;padding:var(--space-4);background:var(--bg-white);border-radius:var(--radius-md)}.optimizer-result-value{font-size:var(--font-xl);font-weight:700;color:var(--eco-green-dark)}.optimizer-result-label{font-size:var(--font-xs);color:var(--text-secondary);margin-top:2px}.models-container{padding:var(--space-8)}.models-table-wrapper{background:var(--bg-white);border:1px solid var(--border-light);border-radius:var(--radius-lg);overflow:hidden;margin-bottom:var(--space-6)}.models-table{width:100%;border-collapse:collapse}.models-table th{font-size:var(--font-sm);font-weight:600;color:var(--text-tertiary);text-align:left;padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--border-light);text-transform:uppercase;letter-spacing:.5px;background:var(--bg-primary)}.models-table td{padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--border-subtle);font-size:var(--font-md)}.models-table tr:last-child td{border-bottom:none}.models-table tr:hover td{background:var(--eco-green-subtle)}.model-name-cell{display:flex;align-items:center;gap:var(--space-3)}.model-provider-dot{width:8px;height:8px;border-radius:var(--radius-full)}.model-score-bar{display:flex;align-items:center;gap:var(--space-2)}.model-score-track{width:60px;height:6px;background:var(--bg-primary);border-radius:3px;overflow:hidden}.model-score-fill{height:100%;border-radius:3px;background:var(--eco-green)}.model-score-value{font-size:var(--font-sm);font-weight:600;min-width:28px}.best-per-task{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4)}.best-per-task-card{background:var(--bg-white);border:1px solid var(--border-light);border-radius:var(--radius-md);padding:var(--space-5);transition:all var(--transition-base)}.best-per-task-card:hover{border-color:var(--eco-green-surface-hover);box-shadow:var(--shadow-sm)}.best-per-task-title{font-size:var(--font-base);color:var(--text-secondary);margin-bottom:var(--space-2)}.best-per-task-model{font-size:var(--font-md);font-weight:600;color:var(--eco-green-dark);display:flex;align-items:center;gap:var(--space-2)}.best-per-task-model svg{width:14px;height:14px}.impact-container{padding:var(--space-8)}.impact-section{margin-bottom:var(--space-8)}.impact-section-title{font-size:var(--font-lg);font-weight:600;color:var(--text-primary);margin-bottom:var(--space-4)}.impact-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4)}.impact-card{background:var(--bg-white);border:1px solid var(--border-light);border-radius:var(--radius-lg);padding:var(--space-6);text-align:center;transition:all var(--transition-base)}.impact-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.impact-card-icon{width:48px;height:48px;border-radius:var(--radius-md);margin:0 auto var(--space-4);display:flex;align-items:center;justify-content:center}.impact-card-icon.green{background:var(--eco-green-surface);color:var(--eco-green)}.impact-card-icon.blue{background:var(--blue-surface);color:var(--blue)}.impact-card-icon.purple{background:var(--purple-surface);color:var(--purple)}.impact-card-icon.orange{background:var(--orange-surface);color:var(--orange)}.impact-card-value{font-size:var(--font-2xl);font-weight:700;color:var(--text-primary)}.impact-card-label{font-size:var(--font-sm);color:var(--text-secondary);margin-top:var(--space-1)}.impact-card-change{font-size:var(--font-sm);font-weight:500;margin-top:var(--space-2)}.proxy-label{display:inline-flex;align-items:center;gap:var(--space-1);font-size:var(--font-xs);color:var(--text-tertiary);background:var(--bg-primary);padding:2px var(--space-2);border-radius:var(--radius-sm);margin-top:var(--space-2)}.settings-container{padding:var(--space-8);max-width:800px}.settings-section{background:var(--bg-white);border:1px solid var(--border-light);border-radius:var(--radius-lg);padding:var(--space-6);margin-bottom:var(--space-5)}.settings-section-title{font-size:var(--font-lg);font-weight:600;color:var(--text-primary);margin-bottom:var(--space-5);padding-bottom:var(--space-4);border-bottom:1px solid var(--border-subtle)}.settings-field{margin-bottom:var(--space-5)}.settings-field:last-child{margin-bottom:0}.settings-label{display:block;font-size:var(--font-md);font-weight:500;color:var(--text-primary);margin-bottom:var(--space-2)}.settings-description{font-size:var(--font-sm);color:var(--text-tertiary);margin-bottom:var(--space-3)}.settings-input{width:100%;padding:var(--space-3) var(--space-4);border:1px solid var(--border-light);border-radius:var(--radius-sm);font-size:var(--font-md);font-family:var(--font-family);color:var(--text-primary);background:var(--bg-white);transition:border-color var(--transition-fast)}.settings-input:focus{outline:none;border-color:var(--eco-green);box-shadow:0 0 0 3px #2e7d3214}.settings-input[type=password]{font-family:monospace;letter-spacing:2px}.settings-toggle{display:flex;align-items:center;justify-content:space-between;padding:var(--space-4) 0;border-bottom:1px solid var(--border-subtle)}.settings-toggle:last-child{border-bottom:none}.toggle-switch{width:44px;height:24px;border-radius:12px;background:var(--border-light);border:none;cursor:pointer;position:relative;transition:background var(--transition-fast);flex-shrink:0}.toggle-switch.on{background:var(--eco-green)}.toggle-switch:after{content:"";position:absolute;width:18px;height:18px;border-radius:var(--radius-full);background:#fff;top:3px;left:3px;transition:transform var(--transition-fast);box-shadow:var(--shadow-sm)}.toggle-switch.on:after{transform:translate(20px)}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-light);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.optimizer-workload-select{display:flex;gap:var(--space-3);margin-bottom:var(--space-6);flex-wrap:wrap}.optimizer-workload-chip{padding:var(--space-2) var(--space-5);border-radius:var(--radius-2xl);border:1px solid var(--border-light);background:var(--bg-white);font-size:var(--font-base);font-weight:500;cursor:pointer;transition:all var(--transition-fast);font-family:var(--font-family);color:var(--text-secondary)}.optimizer-workload-chip:hover{border-color:var(--eco-green);color:var(--eco-green)}.optimizer-workload-chip.active{background:var(--eco-green);color:#fff;border-color:var(--eco-green)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes slide-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-in{animation:slide-up .4s ease-out}.stagger-1{animation-delay:.05s}.stagger-2{animation-delay:.1s}.stagger-3{animation-delay:.15s}.stagger-4{animation-delay:.2s}.stagger-5{animation-delay:.25s}.stagger-6{animation-delay:.3s}.optimizer-section svg,.workload-modal-content svg,.settings-section svg,.api-key-welcome-banner svg,.api-key-prompt-card svg{width:16px;height:16px;flex-shrink:0}.optimizer-section-title svg,.optimizer-recommendation-title svg,.mcp-container h3 svg,.mcp-section-icon svg,.mcp-container svg:not(.eco-mascot-svg):not(.eco-loader-svg),.setup-container svg:not(.eco-mascot-svg):not(.eco-loader-svg){width:20px;height:20px;flex-shrink:0}.btn svg{width:16px;height:16px;flex-shrink:0}.chat-message-time svg{width:14px;height:14px;flex-shrink:0}.impact-card-icon svg{width:24px;height:24px}.settings-section-title svg{width:20px;height:20px;flex-shrink:0;display:inline;vertical-align:text-bottom}svg:not([width]):not([height]):not(.eco-mascot-svg):not(.eco-loader-svg){width:1.25em;height:1.25em;flex-shrink:0}.proxy-label svg{width:14px;height:14px;flex-shrink:0}.impact-footer-note svg{width:14px;height:14px;flex-shrink:0;display:inline-block;vertical-align:middle}.chat-footer svg{width:14px;height:14px;flex-shrink:0}.model-selected-check svg{width:16px;height:16px}.optimizer-action-item svg{width:16px;height:16px;flex-shrink:0}.sidebar-new-chat svg{width:16px;height:16px}.chat-message-actions{display:flex;align-items:center;gap:var(--space-2);margin-top:var(--space-2)}.chat-action-btn{background:transparent;border:none;cursor:pointer;color:var(--text-tertiary);display:flex;align-items:center;justify-content:center;padding:4px;border-radius:var(--radius-sm);transition:all var(--transition-fast)}.chat-action-btn:hover{background:var(--border-light);color:var(--text-primary)}.chat-action-btn svg{width:16px;height:16px}.chat-message-time{font-size:var(--font-xs);color:var(--text-tertiary);margin-top:4px!important}:root{--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-7: 32px;--space-8: 40px;--space-9: 48px;--space-10: 64px;--space-11: 80px;--touch-target: 44px}.nav-badge{background:var(--eco-green);color:#fff;font-size:.7rem;font-weight:700;padding:2px 6px;border-radius:12px;margin-left:auto;line-height:1}#mobile-header,.sidebar-overlay,.mobile-close-btn{display:none}@media(max-width:1024px){.context-panel{display:none!important}.main-content{flex:1;width:100%}.metrics-grid,.dashboard-grid,.best-per-task{grid-template-columns:repeat(2,1fr)!important}.dashboard-card[style*="grid-column: span 2"]{grid-column:span 2!important}.settings-container{padding:var(--space-4)!important}.auth-card{margin:20px auto!important;max-width:95%!important}}@media(max-width:768px){#app{flex-direction:column}#mobile-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-3) var(--space-4);padding-top:calc(var(--space-3) + env(safe-area-inset-top,0px));background:var(--bg-white);border-bottom:1px solid var(--border-light);min-height:60px;z-index:50;flex-shrink:0}.mobile-logo-container{display:flex;align-items:center;gap:var(--space-2)}.mobile-logo-container img{width:28px;height:28px}.mobile-logo-container h1{font-size:var(--font-lg, 1.125rem);font-weight:800;color:var(--text-primary);margin:0}.hamburger-btn{background:none;border:none;font-size:var(--font-2xl, 1.5rem);color:var(--text-primary);cursor:pointer;padding:var(--space-1);display:flex;align-items:center;justify-content:center;min-width:var(--touch-target);min-height:var(--touch-target)}.main-content{height:calc(100vh - 60px);height:calc(100dvh - 60px)}.sidebar{position:fixed;top:0;left:0;height:100vh;height:100dvh;transform:translate(-100%);transition:transform .3s cubic-bezier(.4,0,.2,1);z-index:100;box-shadow:0 0 30px #0003;padding-top:env(safe-area-inset-top,0px)}.mobile-close-btn{display:flex;align-items:center;justify-content:center;background:none;border:none;font-size:var(--font-2xl, 1.5rem);color:var(--text-primary);cursor:pointer;min-width:var(--touch-target);min-height:var(--touch-target);border-radius:var(--radius-sm, 6px)}.mobile-close-btn:hover{background:var(--bg-primary)}.sidebar-overlay{display:block;position:fixed;top:0;left:0;width:100vw;height:100vh;height:100dvh;background:#0006;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .3s ease;z-index:90}#app.sidebar-open .sidebar{transform:translate(0)}#app.sidebar-open .sidebar-overlay{opacity:1;pointer-events:auto}body,html,#app{overflow-x:hidden;width:100vw}.main-content{overflow-x:hidden;overflow-y:auto;padding:var(--space-4)!important;-webkit-overflow-scrolling:touch}.metrics-grid,.dashboard-grid,.best-per-task{grid-template-columns:1fr!important;gap:var(--space-4)!important}.dashboard-card,.dashboard-card[style*="grid-column: span 2"]{grid-column:span 1!important}.models-table-wrapper,.dashboard-card table{display:block;width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.metric-card-value{font-size:1.5rem!important}.dashboard-card-title{font-size:1rem!important}.top-bar{flex-wrap:wrap;gap:var(--space-3);padding-bottom:var(--space-3)!important}.top-bar h2{font-size:1.1rem!important}.top-bar-actions{width:100%;justify-content:flex-end}button,.btn,.nav-link,select,.sidebar .nav-item,a[href]{min-height:var(--touch-target)}.auth-card{margin:16px!important;padding:24px 20px!important;max-width:100%!important;border-radius:14px!important}.auth-container{padding:0!important}.auth-form input,.auth-form .btn-primary,.auth-form button{padding:14px!important;font-size:16px!important}.settings-container{padding:var(--space-4)!important;max-width:100%!important}.settings-section{padding:16px!important;border-radius:12px!important}.settings-mode-card{padding:12px!important}.settings-section>div[style*="grid-template-columns: 1fr 1fr"]{grid-template-columns:1fr!important}#gateway-key-display{font-size:11px!important}.quick-connect-strip{padding:14px 16px!important}.quick-connect-strip>div:last-child{width:100%;justify-content:flex-start}.landing-hero-title{font-size:2rem!important;line-height:1.15!important}.landing-hero-subtitle{font-size:1rem!important}}@media(max-width:480px){.main-content{padding:var(--space-3)!important}.auth-card{margin:8px!important;padding:20px 16px!important;border-radius:12px!important}.auth-header h2{font-size:18px!important}#btn-copy-gateway,#btn-generate-gateway{padding:10px 12px!important;font-size:12px!important}.quick-connect-strip{padding:12px 14px!important}.quick-connect-strip>div:last-child{width:100%;display:flex;flex-direction:column;gap:8px}.btn-gateway-copy,.btn-gateway-url,.btn-gateway-setup{width:100%;justify-content:center}.top-bar h2{font-size:1rem!important}.metric-card{padding:var(--space-3)!important}.metric-card-value{font-size:1.25rem!important}.landing-hero-title{font-size:1.6rem!important}.landing-hero-subtitle{font-size:.9rem!important}.landing-hero-cta{flex-direction:column;gap:var(--space-2)!important}.landing-hero-cta .btn{width:100%}.settings-section [style*=grid-template-columns]{grid-template-columns:1fr!important}.main-content{padding-bottom:calc(var(--space-4) + env(safe-area-inset-bottom,0px))!important}}@media(min-width:1440px){.main-content{padding:var(--space-7) var(--space-10)!important}.metrics-grid,.dashboard-grid{grid-template-columns:repeat(4,1fr)!important}.settings-container{max-width:1000px!important}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.sidebar,.sidebar-overlay{transition:none!important}}@media print{.sidebar,#mobile-header,.sidebar-overlay,.top-bar-actions{display:none!important}.main-content{height:auto!important;overflow:visible!important;padding:0!important}.dashboard-card{break-inside:avoid;page-break-inside:avoid}}.auth-container{display:flex;justify-content:center;align-items:center;min-height:100vh;width:100%;background-color:var(--surface-secondary)}.auth-card{background:var(--surface-primary);padding:3rem;border-radius:var(--radius-lg);box-shadow:0 10px 30px #0000000d;width:100%;max-width:480px;border:1px solid var(--border-color)}.auth-header{text-align:center;margin-bottom:2rem}.auth-header h2{font-size:1.5rem;font-weight:600;color:var(--text-primary);margin-top:1rem}.auth-header p{color:var(--text-secondary);margin-top:.5rem}.auth-steps{display:flex;justify-content:space-between;margin-bottom:2rem;font-size:.85rem;font-weight:500}.auth-steps .step{color:var(--text-secondary);position:relative}.auth-steps .step.active{color:var(--accent-primary)}.auth-steps .step.completed{color:var(--success-color)}.auth-form{display:flex;flex-direction:column;gap:1.5rem}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-group label{font-size:.85rem;font-weight:500;color:var(--text-primary)}.form-group input,.provider-input input{padding:.75rem 1rem;border:1px solid var(--border-color);border-radius:var(--radius-sm);background-color:var(--surface-secondary);color:var(--text-primary);font-size:1rem;transition:all .2s ease}.form-group input:focus,.provider-input input:focus{outline:none;border-color:var(--accent-primary);background-color:var(--surface-primary);box-shadow:0 0 0 3px #2563eb1a}.auth-btn{width:100%;padding:.875rem;font-size:1rem;border-radius:var(--radius-sm);margin-top:.5rem}.auth-footer{text-align:center;font-size:.9rem;color:var(--text-secondary);margin-top:1rem}.auth-footer a{color:var(--accent-primary);text-decoration:none;font-weight:500}.auth-subtext{font-size:.9rem;color:var(--text-secondary);margin-bottom:1.5rem}.provider-input{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.5rem}.provider-input label{font-size:.85rem;font-weight:500}.code-block{background:var(--surface-secondary);padding:1.5rem;border-radius:var(--radius-sm);font-family:monospace;font-size:.9rem;color:var(--text-primary);border:1px solid var(--border-color);margin-bottom:2rem;display:flex;flex-direction:column;gap:.5rem}:root{--eco-brand-green-deep: #1B5E20;--eco-brand-green: #2E7D32;--eco-brand-green-vibrant: #43A047;--eco-brand-green-mint: #A5D6A7;--eco-brand-green-glow: #69F0AE;--eco-brand-core-dark: #121814;--eco-brand-shell-white: #F4FBF6;--eco-brand-shell-gloss: rgba(255, 255, 255, .85)}.eco-logo-animation-wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;animation:ecoLogoFadeIn .8s ease-out forwards}.eco-logo-anim-mark{width:72px;height:72px;transform-origin:center center;animation:ecoLogoExpand 2.2s cubic-bezier(.16,1,.3,1) forwards}.eco-logo-anim-leaf{stroke-dasharray:200;stroke-dashoffset:200;animation:ecoLeafDraw 1.8s cubic-bezier(.25,1,.5,1) .3s forwards}.eco-logo-anim-eyes{opacity:0;transform:scaleY(.2);transform-origin:center;animation:ecoEyesActivate .6s cubic-bezier(.34,1.56,.64,1) 1.2s forwards}.eco-logo-anim-wordmark{opacity:0;transform:translateY(6px);animation:ecoWordmarkFade .8s ease-out 1.5s forwards}@keyframes ecoLogoFadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes ecoLogoExpand{0%{transform:scale(.7) rotate(-10deg);filter:drop-shadow(0 0 0 rgba(46,125,50,0))}50%{transform:scale(1.05) rotate(2deg);filter:drop-shadow(0 10px 25px rgba(46,125,50,.25))}to{transform:scale(1) rotate(0);filter:drop-shadow(0 6px 18px rgba(46,125,50,.15))}}@keyframes ecoLeafDraw{to{stroke-dashoffset:0}}@keyframes ecoEyesActivate{to{opacity:1;transform:scaleY(1)}}@keyframes ecoWordmarkFade{to{opacity:1;transform:translateY(0)}}.eco-mascot{position:relative;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;-webkit-user-select:none;user-select:none;transition:transform .4s cubic-bezier(.16,1,.3,1)}.eco-mascot-svg{width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;overflow:visible}.eco-mascot .m-body{transform-origin:center center;transition:transform .4s ease,filter .3s ease}.eco-mascot .m-leaf{transform-origin:30% 70%;transition:transform .5s cubic-bezier(.34,1.56,.64,1),opacity .3s ease}.eco-mascot .m-eye{transform-origin:center center;transition:transform .25s ease,opacity .25s ease,fill .3s ease}.eco-mascot .m-aura{opacity:0;transform-origin:center center;transition:opacity .4s ease,transform .4s ease}.eco-mascot .m-mcp-tether{opacity:0;stroke-dasharray:60;stroke-dashoffset:60;transition:opacity .3s ease}.eco-mascot.state-idle .m-body{animation:mascotFloat 3.6s ease-in-out infinite}.eco-mascot.state-idle .m-leaf{animation:leafBreathe 3.6s ease-in-out infinite}.eco-mascot.state-idle .m-eye{animation:eyeBlink 5s infinite}.eco-mascot.state-user_input .m-body,.eco-mascot.state-listening .m-body{transform:translateY(-3px) scale(1.03) rotate(2deg)}.eco-mascot.state-user_input .m-eye,.eco-mascot.state-listening .m-eye{transform:scaleY(1.18);fill:var(--eco-brand-green-glow);filter:drop-shadow(0 0 4px var(--eco-brand-green-glow))}.eco-mascot.state-user_input .m-aura,.eco-mascot.state-listening .m-aura{opacity:.4;animation:pulseAura 1.5s ease-in-out infinite}.eco-mascot.state-understanding .m-body{transform:scale(1.02);filter:drop-shadow(0 0 14px rgba(46,125,50,.35))}.eco-mascot.state-understanding .m-eye{animation:eyeFocusScan 1.2s ease-in-out infinite;fill:#81c784}.eco-mascot.state-memory_recall .m-leaf{animation:leafRecallOrbit 2.4s cubic-bezier(.45,0,.55,1) infinite}.eco-mascot.state-memory_recall .m-aura{opacity:.6;animation:auraRotate 3s linear infinite}.eco-mascot.state-thinking .m-body,.eco-mascot.state-planning .m-body{animation:mascotThinkingTilt 2.2s ease-in-out infinite}.eco-mascot.state-thinking .m-leaf,.eco-mascot.state-planning .m-leaf{animation:leafOrbitalFloat 2.2s ease-in-out infinite}.eco-mascot.state-thinking .m-eye,.eco-mascot.state-planning .m-eye{animation:eyeThinkingSweep 1.8s ease-in-out infinite alternate}.eco-mascot.state-mcp_action .m-body{transform:translate(4px) scale(1.04)}.eco-mascot.state-mcp_action .m-leaf{transform:rotate(-18deg) scale(1.15)}.eco-mascot.state-mcp_action .m-mcp-tether{opacity:1;stroke-dashoffset:0;animation:mcpTetherPulse 1.2s ease-out infinite}.eco-mascot.state-mcp_action .m-eye{fill:#64b5f6;filter:drop-shadow(0 0 5px #64B5F6)}.eco-mascot.state-model_selection .m-eye{animation:eyeModelScan .6s ease-in-out infinite alternate;fill:#ffb74d}.eco-mascot.state-model_selection .m-body{transform:scale(.98)}.eco-mascot.state-executing .m-body{transform:translateY(-4px) scale(1.05);animation:mascotExecutingGlide 1.6s ease-in-out infinite alternate;filter:drop-shadow(0 8px 20px rgba(46,125,50,.3))}.eco-mascot.state-executing .m-eye{fill:var(--eco-brand-green-glow);filter:drop-shadow(0 0 6px var(--eco-brand-green-glow))}.eco-mascot.state-success .m-body{animation:mascotSuccessPop 1.2s cubic-bezier(.16,1,.3,1) forwards}.eco-mascot.state-success .m-eye{fill:var(--eco-brand-green-glow);filter:drop-shadow(0 0 8px rgba(105,240,174,.8))}.eco-mascot.state-error .m-body{animation:mascotErrorShake .4s cubic-bezier(.36,.07,.19,.97) forwards}.eco-mascot.state-error .m-eye{fill:#e57373;transform:scaleY(.7)}.eco-mascot.state-learning .m-leaf{animation:leafLearnBloom 1.8s ease-in-out forwards}.eco-mascot.state-learning .m-body{animation:mascotLearnPulse 1.8s ease-in-out forwards}@keyframes mascotFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes leafBreathe{0%,to{transform:rotate(0) scale(1)}50%{transform:rotate(3deg) scale(1.04)}}@keyframes eyeBlink{0%,45%,55%,to{transform:scaleY(1)}50%{transform:scaleY(.08)}}@keyframes pulseAura{0%,to{transform:scale(1);opacity:.3}50%{transform:scale(1.15);opacity:.7}}@keyframes auraRotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes eyeFocusScan{0%,to{transform:translateY(0)}50%{transform:translateY(-1px) scale(1.08)}}@keyframes leafRecallOrbit{0%{transform:rotate(0) scale(1)}50%{transform:rotate(-8deg) scale(1.12)}to{transform:rotate(0) scale(1)}}@keyframes mascotThinkingTilt{0%,to{transform:rotate(0) translateY(0)}50%{transform:rotate(-3deg) translateY(-4px)}}@keyframes leafOrbitalFloat{0%,to{transform:rotate(0)}50%{transform:rotate(7deg) scale(1.06)}}@keyframes eyeThinkingSweep{0%{transform:translate(-1.5px)}to{transform:translate(1.5px)}}@keyframes eyeModelScan{0%{transform:translate(-2.5px)}to{transform:translate(2.5px)}}@keyframes mcpTetherPulse{0%{stroke-dashoffset:60;opacity:1}to{stroke-dashoffset:0;opacity:.2}}@keyframes mascotExecutingGlide{0%{transform:translateY(-2px)}to{transform:translateY(-6px)}}@keyframes mascotSuccessPop{0%{transform:scale(1) translateY(0)}40%{transform:scale(1.1) translateY(-8px);filter:drop-shadow(0 12px 28px rgba(46,125,50,.45))}to{transform:scale(1) translateY(0);filter:drop-shadow(0 4px 12px rgba(46,125,50,.15))}}@keyframes mascotErrorShake{10%,90%{transform:translate(-2px)}20%,80%{transform:translate(3px)}30%,50%,70%{transform:translate(-3px)}40%,60%{transform:translate(3px)}to{transform:translate(0)}}@keyframes leafLearnBloom{0%{transform:scale(1)}50%{transform:scale(.92) rotate(-5deg)}to{transform:scale(1.06) rotate(4deg)}}@keyframes mascotLearnPulse{0%{filter:drop-shadow(0 0 0 rgba(46,125,50,0))}50%{filter:drop-shadow(0 0 20px rgba(105,240,174,.7))}to{filter:drop-shadow(0 4px 12px rgba(46,125,50,.15))}}.eco-loader{display:inline-flex;align-items:center;justify-content:center;position:relative;vertical-align:middle}.eco-loader-svg{width:100%;height:100%;overflow:visible;animation:ecoLoaderOrbit 2s cubic-bezier(.4,0,.2,1) infinite}.eco-loader-ring{stroke-dasharray:90;stroke-dashoffset:45;animation:ecoLoaderDash 1.5s ease-in-out infinite alternate}.eco-loader-core{animation:ecoLoaderCorePulse 1.5s ease-in-out infinite}@keyframes ecoLoaderOrbit{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes ecoLoaderDash{0%{stroke-dashoffset:70}to{stroke-dashoffset:15}}@keyframes ecoLoaderCorePulse{0%,to{opacity:.6;transform:scale(.92)}50%{opacity:1;transform:scale(1.08)}}.eco-loader-16{width:16px;height:16px}.eco-loader-24{width:24px;height:24px}.eco-loader-32{width:32px;height:32px}.eco-loader-48{width:48px;height:48px}.eco-loader-64{width:64px;height:64px}.eco-loader-96{width:96px;height:96px}.eco-loader-large{width:128px;height:128px}.mascot-demo-stage{background:#fff;border:1px solid #E5E5E5;border-radius:20px;padding:32px;display:flex;flex-direction:column;align-items:center;box-shadow:0 10px 40px #0000000a;position:relative;overflow:hidden}.mascot-demo-stage:before{content:"";position:absolute;top:-50%;left:50%;transform:translate(-50%);width:400px;height:400px;background:radial-gradient(circle,rgba(46,125,50,.08) 0%,transparent 70%);pointer-events:none}.mascot-status-pill{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;background:#f1f8e9;border:1px solid #C8E6C9;border-radius:30px;font-size:12px;font-weight:700;color:var(--eco-brand-green);margin-top:14px;letter-spacing:.3px;transition:all .3s ease}.mascot-state-pill-dot{width:7px;height:7px;border-radius:50%;background:var(--eco-brand-green);box-shadow:0 0 6px var(--eco-brand-green)}