@import"https://fonts.googleapis.com/css2?family=PT+Sans:wght@700&family=Montserrat:wght@400;500;700&display=swap";:root{--color-royal-blue: #1f3b9b;--color-navy-blue: #0b1541;--color-bright-blue: #275ce4;--color-sky-blue: #1db8e8;--color-gold: #f4ad00;--color-orange: #f78219;--color-soft-blue: #edfaff;--color-light-gray-blue: #d2d8e9;--color-ice-blue: #d2eff9;--font-heading: "PT Sans", sans-serif;--font-body: "Montserrat", sans-serif;--font-size-h1: 48px;--font-size-h2: 36px;--font-size-h3: 24px;--font-size-h4: 20px;--font-size-h5: 18px;--font-size-h6: 16px;--font-size-large: 20px;--font-size-regular: 18px;--font-size-small: 14px;--spacing-xs: .5rem;--spacing-sm: .75rem;--spacing-md: 1.5rem;--spacing-lg: 2rem;--spacing-xl: 3rem;--border-radius-sm: 4px;--border-radius-md: 6px;--border-radius-lg: 12px;--shadow-sm: 0 2px 4px rgba(0, 0, 0, .1);--shadow-md: 0 4px 6px rgba(0, 0, 0, .1);--shadow-lg: 0 8px 16px rgba(0, 0, 0, .1)}html{font-size:16px;line-height:1.5}body{font-family:var(--font-body);font-size:var(--font-size-regular);line-height:1.4;color:var(--color-navy-blue);background-color:var(--color-soft-blue);margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:700;margin:0 0 var(--spacing-md);line-height:1.2}h1{font-size:var(--font-size-h1);color:var(--color-royal-blue)}h2{font-size:var(--font-size-h2);color:var(--color-navy-blue)}h3{font-size:var(--font-size-h3);color:var(--color-royal-blue)}h4{font-size:var(--font-size-h4);text-transform:uppercase;color:var(--color-navy-blue)}h5{font-size:var(--font-size-h5);text-transform:uppercase;color:var(--color-navy-blue)}h6{font-size:var(--font-size-h6);text-transform:uppercase;color:var(--color-navy-blue)}p{margin:0 0 var(--spacing-md);line-height:1.4}.container{max-width:1200px;margin:0 auto;padding:0 var(--spacing-md)}input,select,textarea{font-family:var(--font-body);font-size:var(--font-size-regular);padding:var(--spacing-sm);border:2px solid var(--color-light-gray-blue);border-radius:var(--border-radius-md);transition:all .2s ease;width:100%;box-sizing:border-box}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--color-bright-blue);box-shadow:0 0 0 2px #275ce41a}button{font-family:var(--font-body);font-weight:700;font-size:var(--font-size-regular);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--border-radius-md);border:none;cursor:pointer;transition:all .2s ease;text-transform:uppercase}button.primary{background-color:var(--color-bright-blue);color:#fff}button.primary:hover{background-color:var(--color-royal-blue);transform:translateY(-1px)}button.secondary{background-color:transparent;border:2px solid var(--color-bright-blue);color:var(--color-bright-blue)}button.secondary:hover{background-color:var(--color-soft-blue);transform:translateY(-1px)}table{width:100%;border-collapse:collapse;margin:var(--spacing-md) 0}th{background-color:var(--color-soft-blue);color:var(--color-navy-blue);font-weight:700;text-align:left;padding:var(--spacing-sm);border-bottom:2px solid var(--color-light-gray-blue)}td{padding:var(--spacing-sm);border-bottom:1px solid var(--color-light-gray-blue)}tr:hover{background-color:var(--color-soft-blue)}@media (max-width: 768px){html{font-size:14px}.container{padding:0 var(--spacing-sm)}h1{font-size:calc(var(--font-size-h1) * .8)}h2{font-size:calc(var(--font-size-h2) * .8)}h3{font-size:calc(var(--font-size-h3) * .8)}}@media (max-width: 480px){html{font-size:12px}h1{font-size:calc(var(--font-size-h1) * .6)}h2{font-size:calc(var(--font-size-h2) * .6)}h3{font-size:calc(var(--font-size-h3) * .6)}}:root{--primary-color: #2196f3;--primary-dark: #1976d2;--primary-light: #bbdefb;--accent-color: #ff4081;--text-color: #333;--text-light: #666;--background-color: #f5f5f5;--card-background: #ffffff;--border-color: #e0e0e0;--shadow-color: rgba(0, 0, 0, .1);--success-color: #4caf50;--error-color: #f44336;--surface-color: #ffffff;--text-secondary: #666;--text-primary: #333;--spacing-md: 1.5rem;--spacing-lg: 2rem;--spacing-xs: .5rem;--spacing-sm: .75rem;--border-radius-lg: 8px;--border-radius-md: 4px;--shadow-md: 0 4px 6px var(--shadow-color);--color-navy-blue: #333;--color-light-gray-blue: #e0e0e0;--color-bright-blue: #2196f3;--color-royal-blue: #1976d2;--color-orange: #ff4081;--font-size-regular: 16px;--font-size-h3: 1.5rem;--font-size-h2: 2rem;--font-size-small: .875rem}body{background-color:var(--background-color);color:var(--text-color);font-family:Roboto,sans-serif;margin:0;padding:0;line-height:1.6}.container{max-width:1200px;margin:2rem auto;padding:0 1rem}h1{text-align:center;color:var(--primary-dark);margin-bottom:2rem;font-weight:300;font-size:2.5rem}.calculator-container{display:flex;flex-direction:column;gap:var(--spacing-md);margin-bottom:var(--spacing-lg)}.calculator-form{width:100%;max-width:600px;margin:0 auto;background-color:#fff;padding:var(--spacing-lg);border-radius:var(--border-radius-lg);box-shadow:var(--shadow-md);transition:all .3s ease;max-height:1000px;opacity:1;overflow:hidden}.calculator-form.collapsed{max-height:0;padding:0;margin:0;opacity:0;pointer-events:none}h2{color:var(--primary-dark);margin-bottom:1.5rem;font-weight:500}.loan-type-selector{margin-bottom:2rem}.preset-buttons{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.5rem}.preset-buttons button{padding:.5rem 1rem;border:1px solid var(--primary-color);background-color:transparent;color:var(--primary-color);border-radius:20px;cursor:pointer;transition:all .2s ease}.preset-buttons button.active,.preset-buttons button:hover{background-color:var(--primary-color);color:#fff}.form-group{margin-bottom:var(--spacing-md)}.form-group label{display:block;font-weight:700;margin-bottom:var(--spacing-xs);color:var(--color-navy-blue);font-size:var(--font-size-regular);text-transform:uppercase}.form-group input{width:100%;font-size:var(--font-size-regular);padding:var(--spacing-sm);border:2px solid var(--color-light-gray-blue);border-radius:var(--border-radius-md);transition:all .2s ease}.form-group input:focus{border-color:var(--color-bright-blue);box-shadow:0 0 0 2px #275ce41a;outline:none}.calculate-button{width:100%;background-color:var(--color-bright-blue);color:#fff;font-weight:700;padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--border-radius-md);border:none;cursor:pointer;transition:all .2s ease;text-transform:uppercase;font-size:var(--font-size-regular)}.calculate-button:hover{background-color:var(--color-royal-blue);transform:translateY(-1px)}.calculate-button:disabled{background-color:var(--color-light-gray-blue);cursor:not-allowed;transform:none}.error-message{background-color:var(--color-orange);color:#fff;padding:var(--spacing-sm);border-radius:var(--border-radius-md);margin:var(--spacing-sm) 0;font-size:var(--font-size-small);font-weight:500}.extra-payments{background-color:var(--color-soft-blue);padding:var(--spacing-md);border-radius:var(--border-radius-md);margin:var(--spacing-md) 0}.extra-payments h3{color:var(--color-royal-blue);margin-bottom:var(--spacing-md);font-size:var(--font-size-h3)}.results{flex:2;min-width:300px;background-color:var(--card-background);padding:2rem;border-radius:8px;box-shadow:0 4px 6px var(--shadow-color)}.results h3{color:var(--primary-dark);margin-bottom:1rem}.results p{margin:.5rem 0}.results strong{color:var(--primary-dark)}.progress-bar{width:100%;height:20px;background-color:var(--border-color);border-radius:10px;overflow:hidden;margin:1rem 0}.progress{height:100%;background-color:var(--primary-color);transition:width .3s ease;text-align:center;color:#fff;font-size:.875rem;line-height:20px}.charts{margin-top:2rem}.chart-container{margin-bottom:2rem;background-color:var(--card-background);padding:1rem;border-radius:4px;box-shadow:0 2px 4px var(--shadow-color)}.comparison-toggle{width:100%;text-align:center;margin:2rem 0}.comparison-toggle button{background-color:var(--accent-color);color:#fff;border:none;padding:.75rem 1.5rem;border-radius:25px;cursor:pointer;font-size:1rem;transition:background-color .2s ease}.comparison-toggle button:hover{background-color:#e91e63}.comparison-results{background-color:var(--card-background);padding:2rem;border-radius:8px;box-shadow:0 4px 6px var(--shadow-color);margin:2rem 0;text-align:center}.savings{display:flex;justify-content:space-around;flex-wrap:wrap;gap:1rem}.savings p{font-size:1.1rem;color:var(--primary-dark)}.schedule-controls{display:flex;justify-content:space-between;align-items:center;margin:2rem 0;flex-wrap:wrap;gap:1rem}.amortization-tabs{display:flex;gap:1rem}.amortization-tabs button,.export-button{padding:.75rem 1.5rem;border:none;border-radius:4px;cursor:pointer;transition:all .2s ease}.amortization-tabs button{background-color:var(--background-color);color:var(--text-color)}.amortization-tabs button.active{background-color:var(--primary-color);color:#fff}.export-button{background-color:var(--success-color);color:#fff}.export-button:hover{background-color:#388e3c}.amortization-schedule{background-color:#fff;padding:var(--spacing-lg);border-radius:var(--border-radius-lg);box-shadow:var(--shadow-md);overflow-x:auto;margin-top:var(--spacing-md)}.amortization-schedule h2{color:var(--color-royal-blue);margin-bottom:var(--spacing-md);font-size:var(--font-size-h2)}table{width:100%;border-collapse:collapse;margin-top:1rem;font-size:.9rem}th,td{padding:.75rem;text-align:right;border-bottom:1px solid var(--border-color)}th{background-color:var(--primary-light);color:var(--primary-dark);font-weight:500;position:sticky;top:0;z-index:1}tr:hover{background-color:var(--background-color)}.savings-info{margin-top:1rem;padding:1rem;background-color:var(--primary-light);border-radius:4px}.payoff-date{color:var(--primary-dark);font-weight:500}.total-saved{color:var(--success-color);font-weight:500}.general-error{background-color:#ffebee;color:var(--error-color);padding:1rem;border-radius:4px;margin:1rem 0;text-align:center}.loading{text-align:center;color:var(--text-light);padding:2rem}.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem;margin:2rem 0;padding:1.5rem;background:var(--surface-color);border-radius:12px;box-shadow:0 2px 4px #0000001a}.summary-item{display:flex;flex-direction:column;align-items:center;text-align:center;padding:1rem;background:var(--background-color);border-radius:8px;transition:transform .2s ease}.summary-item:hover{transform:translateY(-2px)}.summary-label{font-size:.9rem;color:var(--text-secondary);margin-bottom:.5rem;font-weight:500}.summary-value{font-size:1.5rem;font-weight:600;color:var(--text-primary)}.progress-section{margin:2rem 0;padding:1rem;background:var(--surface-color);border-radius:12px;box-shadow:0 2px 4px #0000001a}.progress-bar{height:8px;background:var(--background-color);border-radius:4px;overflow:hidden;margin-bottom:.5rem}.progress{height:100%;background:var(--primary-color);transition:width .3s ease}.progress-text{display:block;text-align:center;font-size:.9rem;color:var(--text-secondary);font-weight:500}.form-toggle{width:100%;text-align:center;margin:var(--spacing-sm) 0}.toggle-button{background-color:var(--color-bright-blue);color:#fff;border:none;padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--border-radius-md);cursor:pointer;font-size:var(--font-size-regular);font-weight:700;transition:all .2s ease;text-transform:uppercase}.toggle-button:hover{background-color:var(--color-royal-blue);transform:translateY(-1px)}.summary-bar{display:flex;justify-content:space-around;align-items:center;background-color:#fff;padding:var(--spacing-md);border-radius:var(--border-radius-lg);box-shadow:var(--shadow-md);margin:var(--spacing-md) 0;flex-wrap:wrap;gap:var(--spacing-md)}.summary-item{flex:1;min-width:200px;text-align:center;padding:var(--spacing-sm)}.summary-label{font-size:var(--font-size-small);color:var(--color-navy-blue);margin-bottom:var(--spacing-xs);font-weight:700;text-transform:uppercase}.summary-value{font-size:var(--font-size-h3);font-weight:700;color:var(--color-royal-blue)}.load-more{display:flex;justify-content:center;margin-top:var(--spacing-lg)}.load-more button{background-color:var(--color-bright-blue);color:#fff;border:none;padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--border-radius-md);cursor:pointer;font-size:var(--font-size-regular);font-weight:700;transition:all .2s ease;text-transform:uppercase}.load-more button:hover{background-color:var(--color-royal-blue);transform:translateY(-1px)}@media (max-width: 768px){.calculator-form{padding:var(--spacing-md)}.summary-bar{flex-direction:column;align-items:stretch}.summary-item{min-width:100%}.amortization-schedule{padding:var(--spacing-md)}th,td{padding:.5rem;font-size:.8rem}}
