:root[data-theme=light],:root{--bg-primary:#fff;--bg-secondary:#e8f4f8;--bg-tertiary:#d1e7f0;--bg-card:#fff;--bg-hover:#f0f8fb;--text-primary:#1f2937;--text-secondary:#4b5563;--text-tertiary:#6b7280;--text-inverse:#fff;--header-text:#1f2937;--header-text-muted:#4b5563;--header-dropdown-bg:#0000000d;--header-button-bg:#0000001a;--header-button-text:#1f2937;--border-primary:#e5e7eb;--border-secondary:#d1d5db;--border-focus:#2563eb;--color-primary:#1d4ed8;--color-primary-hover:#1e40af;--color-blue:#1d4ed8;--color-blue-hover:#1e40af;--color-green:#059669;--color-green-hover:#047857;--color-orange:#d97706;--color-orange-hover:#b45309;--color-red:#dc2626;--color-red-hover:#b91c1c;--color-purple:#7c3aed;--color-purple-hover:#6d28d9;--color-gray:#9ca3af;--color-success:#059669;--color-success-bg:#d1fae5;--color-success-text:#065f46;--color-warning:#d97706;--color-warning-bg:#fef3c7;--color-warning-text:#92400e;--color-error:#dc2626;--color-error-bg:#fee2e2;--color-error-text:#991b1b;--color-info:#1d4ed8;--color-info-bg:#dbeafe;--color-info-text:#1e40af;--color-teal:#0d9488;--color-teal-bg:#ccfbf1;--color-teal-text:#115e59;--gradient-header:var(--bg-card);--header-gradient:var(--bg-card);--gradient-blue:linear-gradient(135deg,#3b82f6 0%,#1e40af 100%);--gradient-green:linear-gradient(135deg,#10b981 0%,#059669 100%);--gradient-purple:linear-gradient(135deg,#8b5cf6 0%,#6366f1 100%);--shadow-sm:0 1px 2px #0000000d;--shadow-md:0 4px 6px #0000001a;--shadow-lg:0 10px 15px #0000001a;--chart-blue:#1d4ed8;--chart-green:#059669;--chart-orange:#d97706;--chart-red:#dc2626;--chart-purple:#7c3aed;--chart-teal:#0d9488}:root[data-theme=dark]{--bg-primary:#1a1a1a;--bg-secondary:#0f0f0f;--bg-tertiary:#2d2d2d;--bg-card:#242424;--bg-hover:#333;--text-primary:#e5e5e5;--text-secondary:#b4b4b4;--text-tertiary:#8a8a8a;--text-inverse:#1a1a1a;--header-text:#e5e5e5;--header-text-muted:#e5e5e5b3;--header-dropdown-bg:#ffffff26;--header-button-bg:#ffffff26;--header-button-text:#e5e5e5;--border-primary:#3d3d3d;--border-secondary:#4d4d4d;--border-focus:#60a5fa;--color-primary:#60a5fa;--color-primary-hover:#3b82f6;--color-blue:#60a5fa;--color-blue-hover:#3b82f6;--color-green:#34d399;--color-green-hover:#10b981;--color-orange:#fbbf24;--color-orange-hover:#f59e0b;--color-red:#f87171;--color-red-hover:#ef4444;--color-purple:#a78bfa;--color-purple-hover:#8b5cf6;--color-gray:#9ca3af;--color-success:#34d399;--color-success-bg:#1e4620;--color-success-text:#6ee7b7;--color-warning:#fbbf24;--color-warning-bg:#4a2c0a;--color-warning-text:#fcd34d;--color-error:#f87171;--color-error-bg:#4a1a1a;--color-error-text:#fca5a5;--color-info:#60a5fa;--color-info-bg:#1e3a5f;--color-info-text:#93c5fd;--color-teal:#2dd4bf;--color-teal-bg:#134e4a;--color-teal-text:#5eead4;--gradient-header:linear-gradient(135deg,#2d2d2d 0%,#1a1a1a 100%);--header-gradient:linear-gradient(135deg,#2d2d2d 0%,#1a1a1a 100%);--gradient-blue:linear-gradient(135deg,#2563eb 0%,#1e40af 100%);--gradient-green:linear-gradient(135deg,#059669 0%,#047857 100%);--gradient-purple:linear-gradient(135deg,#7c3aed 0%,#6d28d9 100%);--shadow-sm:0 1px 2px #0000004d;--shadow-md:0 4px 6px #0006;--shadow-lg:0 10px 15px #00000080;--chart-blue:#60a5fa;--chart-green:#34d399;--chart-orange:#fbbf24;--chart-red:#f87171;--chart-purple:#a78bfa;--chart-teal:#2dd4bf}*{transition:background-color .3s,color .3s,border-color .3s}button,input,select,textarea,a{transition:background-color .2s,color .2s,border-color .2s,transform .2s,box-shadow .2s}body{background-color:var(--bg-secondary);color:var(--text-primary)}.card{background-color:var(--bg-card);border:1px solid var(--border-primary);box-shadow:var(--shadow-md)}input,select,textarea{background-color:var(--bg-primary);color:var(--text-primary);border:1px solid var(--border-primary)}input:focus,select:focus,textarea:focus{border-color:var(--border-focus);outline:2px solid var(--border-focus);outline-offset:2px}.google-visualization-tooltip{background-color:var(--bg-card)!important;border:1px solid var(--border-primary)!important;box-shadow:var(--shadow-lg)!important;border-radius:6px!important;padding:8px 12px!important}.google-visualization-tooltip *{color:var(--text-primary)!important;font-family:system-ui,-apple-system,sans-serif!important}.google-visualization-tooltip-item{color:var(--text-primary)!important}.google-visualization-tooltip-item-list{color:var(--text-secondary)!important}button:focus,a:focus{outline:2px solid var(--border-focus);outline-offset:2px}*{outline-width:auto!important}:focus,:focus:not(:focus-visible),:focus-visible{outline-offset:2px!important;outline:3px solid #2563eb!important}button:focus-visible,button:focus{outline-offset:2px!important;outline:3px solid #2563eb!important;box-shadow:0 0 0 3px #2563eb33!important}input:focus-visible,input:focus,select:focus-visible,select:focus,textarea:focus-visible,textarea:focus{outline-offset:1px!important;border-color:#2563eb!important;outline:3px solid #2563eb!important}input[type=checkbox]:focus-visible,input[type=checkbox]:focus,input[type=radio]:focus-visible,input[type=radio]:focus{outline-offset:2px!important;outline:3px solid #2563eb!important;box-shadow:0 0 0 3px #2563eb33!important}input[type=range]:focus-visible,input[type=range]:focus{outline-offset:2px!important;outline:3px solid #2563eb!important}a:focus-visible,a:focus{outline-offset:2px!important;outline:3px solid #2563eb!important;text-decoration:underline!important}.text-primary,.color-primary,[style*="color: #3b82f6"],[style*="color:#3b82f6"]{color:#1d4ed8!important}.chart-primary{color:#1d4ed8!important;fill:#1d4ed8!important;stroke:#1d4ed8!important}.skip-link{color:#fff;z-index:10000;background:#1d4ed8;border-radius:0 0 4px;padding:8px 16px;font-weight:600;text-decoration:none;position:absolute;top:-40px;left:0}.skip-link:focus{top:0;outline-offset:-2px!important;outline:2px solid #fff!important}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.sr-only-focusable:focus{width:auto;height:auto;padding:inherit;margin:inherit;clip:auto;white-space:normal;position:static;overflow:visible}@media (prefers-contrast:high){*{border-color:currentColor!important}button,input,select,textarea{border:2px solid!important}}@keyframes slideInFromRight{0%{opacity:0;transform-origin:0;transform:translate(50%)scaleX(.5)}to{opacity:1;transform-origin:0;transform:translate(0)scaleX(1)}}@keyframes iconColorChange{0%{opacity:.15;filter:brightness()}60%{opacity:1;filter:brightness(1.4)}to{opacity:1;filter:brightness()}}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;font-weight:400;line-height:1.5}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}a{color:var(--color-blue);-webkit-text-decoration:inherit;text-decoration:inherit;font-weight:600}a:hover{color:var(--color-blue-hover)}body{background-color:var(--bg-secondary);width:100%;min-width:320px;min-height:100vh;color:var(--text-primary);margin:0}h1{font-size:3.2em;line-height:1.1}@media (prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}}.optimization-modal-overlay{z-index:1000;background-color:#000000b3;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.optimization-modal{background:#fff;border-radius:12px;width:100%;max-width:700px;max-height:90vh;overflow-y:auto;box-shadow:0 10px 40px #0000004d}.optimization-modal-header{color:#fff;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-bottom:2px solid #e0e0e0;border-radius:12px 12px 0 0;justify-content:space-between;align-items:center;padding:24px;display:flex}.optimization-modal-header h2{align-items:center;gap:12px;margin:0;font-size:1.5rem;display:flex}.close-button{color:#fff;cursor:pointer;background:0 0;border:none;padding:4px 8px;font-size:1.5rem;transition:opacity .2s}.close-button:hover{opacity:.8}.optimization-modal-body{padding:24px}.budget-input-section{flex-direction:column;gap:20px;display:flex}.budget-input-section>p{color:#555;margin:0;line-height:1.5}.input-group{flex-direction:column;gap:8px;display:flex}.input-group label{color:#333;font-weight:600}.input-with-prefix{border:2px solid #ddd;border-radius:8px;align-items:center;transition:border-color .2s;display:flex;overflow:hidden}.input-with-prefix:focus-within{border-color:#667eea}.input-with-prefix .prefix{color:#666;background:#f5f5f5;padding:12px 16px;font-weight:600}.input-with-prefix input{border:none;outline:none;flex:1;padding:12px 16px;font-size:1rem}.error-message{color:#c33;background:#fee;border:1px solid #fcc;border-radius:6px;padding:12px;font-size:.9rem}.current-info{background:#f9f9f9;border-left:4px solid #667eea;border-radius:8px;padding:16px}.current-info p{color:#555;margin:8px 0}.calculate-button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;border-radius:8px;padding:14px 28px;font-size:1rem;font-weight:600;transition:transform .2s,box-shadow .2s}.calculate-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.calculate-button:disabled{opacity:.5;cursor:not-allowed}.comparison-section{flex-direction:column;gap:24px;display:flex}.comparison-grid{grid-template-columns:1fr 1fr;gap:20px;display:grid}.comparison-column{border:2px solid #e0e0e0;border-radius:8px;padding:20px}.comparison-column.optimized{background:#f1f8f4;border-color:#4caf50}.comparison-column h3{color:#333;margin:0 0 16px;font-size:1.1rem}.stat{margin-bottom:12px}.stat .label{color:#666;margin-bottom:4px;font-size:.85rem}.stat .value{color:#333;font-size:1.3rem;font-weight:700}.stat .value.success{color:#4caf50}.savings-highlight{color:#fff;background:linear-gradient(135deg,#4caf50 0%,#45a049 100%);border-radius:8px;align-items:center;gap:16px;padding:20px;font-size:1.1rem;display:flex}.savings-highlight svg{font-size:2rem}.savings-text{flex-direction:column;gap:4px;display:flex}.strategy-info{background:#f9f9f9;border-left:4px solid #667eea;border-radius:8px;padding:16px}.strategy-info h4{color:#333;margin:0 0 12px}.strategy-info p{color:#555;margin:8px 0;line-height:1.5}.strategy-info .note{color:#777;font-size:.9rem;font-style:italic}.modal-actions{justify-content:flex-end;gap:12px;display:flex}.cancel-button,.accept-button{cursor:pointer;border:none;border-radius:8px;padding:12px 24px;font-size:1rem;font-weight:600;transition:transform .2s,box-shadow .2s}.cancel-button{color:#666;background:#f5f5f5}.cancel-button:hover{background:#e0e0e0}.accept-button{color:#fff;background:linear-gradient(135deg,#4caf50 0%,#45a049 100%)}.accept-button:hover{transform:translateY(-2px);box-shadow:0 4px 12px #4caf5066}@media (max-width:768px){.comparison-grid{grid-template-columns:1fr}.modal-actions{flex-direction:column}.cancel-button,.accept-button{width:100%}}*{box-sizing:border-box}:root{--spacing-none:0px;--spacing-xxs:4px;--spacing-xs:8px;--spacing-sm-alt:12px;--spacing-sm:16px;--spacing-md-sm:20px;--spacing-md:24px;--spacing-lg:32px;--spacing-xl:40px;--spacing-xxl:48px;--spacing-xxxl:56px;--spacing-max:64px;--font-size-display-xl:48px;--font-size-display-lg:40px;--font-size-display-md:32px;--font-size-display-sm:28px;--font-size-h1:24px;--font-size-h2:20px;--font-size-h3:18px;--font-size-h4:16px;--font-size-h5:14px;--font-size-h6:13px;--font-size-body-xl:18px;--font-size-body-lg:16px;--font-size-body-md:14px;--font-size-body-sm:13px;--font-size-body-xs:12px;--font-size-body-xxs:11px;--font-size-body-xxxs:10px;--font-weight-thin:100;--font-weight-extra-light:200;--font-weight-light:300;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semi-bold:600;--font-weight-bold:700;--font-weight-extra-bold:800;--font-weight-black:900;--line-height-tight:1.2;--line-height-snug:1.4;--line-height-normal:1.5;--line-height-relaxed:1.6;--line-height-loose:1.8;--line-height-extra-loose:2;--letter-spacing-tighter:-.05em;--letter-spacing-tight:-.025em;--letter-spacing-normal:0;--letter-spacing-wide:.025em;--letter-spacing-wider:.05em;--letter-spacing-widest:.1em}body{color:#1a202c;-webkit-user-select:none;user-select:none;background:#f5f7fa;min-height:100vh;margin:0}input,textarea{-webkit-user-select:text;user-select:text}#root{max-width:100%;margin:0;padding:0}input[type=range]{cursor:pointer;accent-color:#3498db;height:6px}input[type=range]:hover{opacity:.8}input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{appearance:textfield}@keyframes pulse{0%,to{transform:scale(1);box-shadow:0 2px 8px #667eea66}50%{transform:scale(1.05);box-shadow:0 4px 16px #667eea99}}.quick-setup-grid{gap:var(--spacing-sm);grid-template-columns:repeat(5,1fr);display:grid}@keyframes glow-pulse{0%,to{border-color:#f59e0b99;box-shadow:0 0 5px #f59e0b80,0 0 10px #f59e0b4d}50%{border-color:#f59e0b;box-shadow:0 0 10px #f59e0bcc,0 0 20px #f59e0b80,0 0 30px #f59e0b4d}}.glow-input{animation:2s ease-in-out infinite glow-pulse}@media (max-width:768px){.quick-setup-grid{gap:var(--spacing-sm-alt);grid-template-columns:1fr}}@media (min-width:769px){.quick-setup-grid{grid-template-columns:repeat(5,1fr)}}#summary-cards{gap:var(--spacing-xs);flex-wrap:wrap;flex:auto;min-width:0;display:flex}@media (max-width:640px){#summary-cards{gap:var(--spacing-xs);flex-direction:column}#summary-cards>div{flex:auto!important;width:100%!important;min-width:100%!important;height:56px!important}}@media (min-width:641px) and (max-width:900px){#summary-cards{flex-wrap:wrap}#summary-cards>div{flex:1 1 calc(50% - var(--spacing-xs)/2);min-width:calc(50% - var(--spacing-xs)/2)}}@media (min-width:901px){#summary-cards{flex-wrap:nowrap}#summary-cards>div{flex:1 1 0;min-width:80px}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@media (max-width:640px){.header-content{gap:12px!important;padding-left:8px!important;padding-right:8px!important}.header-title-section{width:100%;flex-direction:column!important;align-items:flex-start!important;gap:8px!important}.header-title{white-space:normal!important;font-size:18px!important}#summary-cards{width:100%}.main-content{padding:0 4px 4px!important}.quick-setup-card{border-radius:4px!important;padding:12px!important}input,select,button{min-height:44px}}@media (min-width:641px) and (max-width:1024px){.header-content{padding-left:24px!important}.header-title{font-size:18px!important}.main-content{padding:0 8px 8px!important}}