@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{--bg-color:#0d1311;--panel-bg:#151d1a;--border-color:#23332d;--text-primary:#f8f9fa;--text-secondary:#a0aec0;--brand-color:#26a17b;--brand-hover:#1e8263;--brand-glow:#26a17b66;--error-color:#f56565;--success-bg:#26a17b1a;--success-border:#26a17b4d;--ai-bg:#4299e11a;--ai-border:#4299e14d}body{background-color:var(--bg-color);color:var(--text-primary);-webkit-font-smoothing:antialiased;margin:0;font-family:Inter,system-ui,-apple-system,sans-serif;line-height:1.5}*{box-sizing:border-box}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-color)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#34483f}.app-container{flex-direction:column;max-width:800px;min-height:100vh;margin:0 auto;padding:40px 20px;display:flex}.app-header{justify-content:space-between;align-items:center;margin-bottom:32px;display:flex}.title-group h1{background:linear-gradient(90deg,#fff,#a0aec0);-webkit-text-fill-color:transparent;letter-spacing:-.5px;-webkit-background-clip:text;background-clip:text;margin:0 0 8px;font-size:28px;font-weight:700}.title-group p{color:var(--text-secondary);margin:0;font-size:15px}.btn-api-key{background:var(--panel-bg);border:1px solid var(--brand-color);color:var(--brand-color);cursor:pointer;border-radius:10px;justify-content:center;align-items:center;height:100%;padding:0 16px;transition:all .2s;display:flex}.btn-api-key:hover,.btn-api-key.active{box-shadow:0 0 10px var(--brand-glow);background:#26a17b1a}.settings-panel{background:var(--panel-bg);border:1px solid var(--brand-color);border-radius:12px;margin-top:16px;padding:16px;animation:.2s ease-out slideDown;box-shadow:0 4px 20px #0000004d}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.api-key-input{background:var(--bg-color);border:1px solid var(--border-color);width:100%;color:var(--text-primary);border-radius:8px;padding:14px 16px;font-family:inherit;font-size:14px;transition:border-color .2s}.api-key-input:focus{border-color:var(--brand-color);outline:none}.api-key-label{color:var(--text-secondary);margin-bottom:8px;font-size:13px;font-weight:500;display:block}.input-card{background:var(--panel-bg);border:1px solid var(--border-color);border-radius:12px;margin-bottom:24px;padding:0;transition:border-color .2s,box-shadow .2s;position:relative;overflow:hidden}.input-card:focus-within{border-color:var(--brand-color);box-shadow:0 0 0 3px #26a17b26}.input-header{background:var(--bg-color);border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.input-title{color:var(--text-primary);align-items:center;gap:8px;margin:0;font-size:15px;font-weight:600;display:flex}.prompt-textarea{width:100%;color:var(--text-primary);resize:vertical;background:0 0;border:none;min-height:180px;padding:20px;font-family:inherit;font-size:16px;line-height:1.5;box-shadow:inset 0 2px 4px #0000000d}.prompt-textarea::-webkit-scrollbar{width:12px}.prompt-textarea::-webkit-scrollbar-track{background:0 0;margin:12px 0}.prompt-textarea::-webkit-scrollbar-thumb{border:3px solid var(--panel-bg);background-color:#a0aec033;border-radius:10px}.prompt-textarea::-webkit-scrollbar-thumb:hover{background-color:#a0aec080}.prompt-textarea:focus{outline:none}.icon-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:6px 8px;transition:all .2s;display:flex}.icon-btn:hover{color:var(--text-primary);background:#ffffff14}.icon-btn.clear:hover{color:#fca5a5;background:#ef444426}.action-buttons{flex-wrap:wrap;gap:16px;display:flex}.btn-secondary{background:var(--panel-bg);color:var(--text-primary);border:1px solid var(--border-color);cursor:pointer;border-radius:10px;flex:1;min-width:200px;padding:14px 24px;font-size:15px;font-weight:500;transition:all .2s}.btn-secondary:hover:not(:disabled){background:#1a2420;border-color:#34483f}.btn-primary{background:var(--brand-color);color:#fff;cursor:pointer;min-width:250px;box-shadow:0 4px 14px var(--brand-glow);border:none;border-radius:10px;flex:2;justify-content:center;align-items:center;gap:8px;padding:14px 24px;font-size:16px;font-weight:600;transition:all .2s;display:flex}.btn-primary:hover:not(:disabled){background:var(--brand-hover);transform:translateY(-1px);box-shadow:0 6px 20px #26a17b99}.btn-primary:active:not(:disabled){box-shadow:0 2px 8px var(--brand-glow);transform:translateY(1px)}.btn-primary:disabled,.btn-secondary:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;transform:none}.error-message{color:var(--error-color);background:#f565651a;border:1px solid #f5656533;border-radius:8px;align-items:center;gap:8px;margin-top:24px;padding:12px 16px;font-size:14px;display:flex}.result-section{margin-top:40px;animation:.4s ease-out fadeIn}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.result-card{background:var(--panel-bg);border:1px solid var(--success-border);border-radius:12px;margin-bottom:24px;padding:0;position:relative;overflow:hidden}.result-card.is-ai{border-color:var(--ai-border)}.result-header{background:var(--success-bg);border-bottom:1px solid var(--success-border);justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.result-card.is-ai .result-header{background:var(--ai-bg);border-bottom-color:var(--ai-border)}.result-title{color:var(--text-primary);align-items:center;gap:8px;margin:0;font-size:15px;font-weight:600;display:flex}.result-content{white-space:pre-wrap;color:var(--text-primary);margin:0;padding:20px;font-family:inherit;font-size:15px;line-height:1.6}.changes-card{background:var(--bg-color);border:1px dashed var(--border-color);border-radius:12px;margin-bottom:24px;padding:20px}.changes-card h3{color:var(--text-secondary);margin:0 0 12px;font-size:15px;font-weight:500}.changes-card ul{color:var(--text-primary);margin:0;padding-left:20px;font-size:14px}.changes-card li{margin-bottom:6px}.stats-grid{grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:24px;display:grid}.stat-box{background:var(--panel-bg);border:1px solid var(--border-color);border-radius:12px;flex-direction:column;align-items:flex-start;padding:20px;display:flex}.stat-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px;font-size:13px;font-weight:600}.stat-value{color:var(--text-primary);font-size:24px;font-weight:700}.stat-value.highlight{color:var(--brand-color)}.stat-sub{color:var(--text-secondary);margin-top:2px;font-size:13px;font-weight:500}.stat-sub small{opacity:.7;font-size:11px}.cost-card{background:linear-gradient(135deg, var(--panel-bg), #1a2621);border:1px solid var(--brand-color);border-radius:12px;padding:20px}.cost-card h3{color:var(--brand-color);align-items:center;gap:8px;margin:0 0 12px;font-size:16px;display:flex}.cost-details{color:var(--text-primary);font-size:15px;line-height:1.6}.cost-details strong{color:#fff}.roi-positive{color:var(--brand-color);align-items:center;gap:6px;margin-top:12px;font-weight:500;display:flex}.roi-negative{color:var(--error-color);margin-top:12px;font-weight:500}@media (width<=640px){.stats-grid{grid-template-columns:1fr;gap:12px}.action-buttons{flex-direction:column}.app-header{flex-direction:column;align-items:flex-start;gap:16px}.settings-toggle{align-self:flex-end}}
