@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";:root{--bg:#fafafa;--surface:#fff;--border:#e5e5e5;--border-focus:#a3a3a3;--text:#171717;--text-secondary:#737373;--text-muted:#a3a3a3;--accent:#171717;--accent-hover:#404040;--code-bg:#f5f5f5;--code-border:#e5e5e5;--shadow-sm:0 1px 2px #0000000a;--shadow:0 1px 3px #0000000f, 0 1px 2px #0000000a;--radius:12px;--radius-sm:8px;--transition:.15s cubic-bezier(.4, 0, .2, 1);--toggle-bg:#e5e5e5;--toggle-knob:#fff;--scrollbar-thumb:#d4d4d4}.dark{--bg:#0a0a0a;--surface:#141414;--border:#262626;--border-focus:#525252;--text:#ededed;--text-secondary:#a3a3a3;--text-muted:#525252;--accent:#ededed;--accent-hover:#d4d4d4;--code-bg:#1a1a1a;--code-border:#262626;--shadow-sm:0 1px 2px #0003;--shadow:0 1px 3px #0000004d, 0 1px 2px #0003;--toggle-bg:#404040;--toggle-knob:#ededed;--scrollbar-thumb:#333}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;font-family:Inter,system-ui,-apple-system,sans-serif}.app{max-width:920px;margin:0 auto;padding:3.5rem 1.5rem}header{justify-content:space-between;align-items:flex-start;margin-bottom:2.5rem;display:flex}header-text h1{letter-spacing:-.02em;color:var(--text);font-size:1.5rem;font-weight:600}header-text p{color:var(--text-secondary);margin-top:.375rem;font-size:.875rem;font-weight:400}.theme-toggle{cursor:pointer;color:var(--text-muted);transition:color var(--transition);background:0 0;border:none;flex-shrink:0;align-items:center;gap:.5rem;margin-top:.125rem;padding:0;font-family:inherit;font-size:.75rem;font-weight:500;display:flex}.theme-toggle:hover{color:var(--text-secondary)}.toggle-track{background:var(--toggle-bg);width:36px;height:20px;transition:background var(--transition);border-radius:10px;position:relative}.toggle-knob{background:var(--toggle-knob);width:16px;height:16px;transition:transform var(--transition);border-radius:50%;position:absolute;top:2px;left:2px;box-shadow:0 1px 3px #00000026}.dark .toggle-knob{transform:translate(16px)}.tabs{background:var(--code-bg);border-radius:var(--radius-sm);gap:2px;margin-bottom:2rem;padding:3px;display:inline-flex}.tabs button{color:var(--text-secondary);cursor:pointer;transition:all var(--transition);white-space:nowrap;background:0 0;border:none;border-radius:6px;padding:.5rem 1rem;font-family:inherit;font-size:.8125rem;font-weight:500}.tabs button:hover{color:var(--text)}.tabs button.active{background:var(--surface);color:var(--text);box-shadow:var(--shadow-sm)}.calc-wrapper{grid-template-columns:1fr 1fr;align-items:start;gap:1.5rem;display:grid}.calc-container{background:var(--surface);border-radius:var(--radius);border:1px solid var(--border);box-shadow:var(--shadow-sm);padding:1.75rem}.field{margin-bottom:1.125rem}.field:last-of-type{margin-bottom:0}.field label{color:var(--text);margin-bottom:.375rem;font-size:.8125rem;font-weight:500;display:block}.field input,.field select{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg);width:100%;height:40px;color:var(--text);transition:border-color var(--transition), box-shadow var(--transition);outline:none;padding:0 .75rem;font-family:inherit;font-size:.875rem}.field input:focus,.field select:focus{border-color:var(--accent);box-shadow:0 0 0 3px #8080801a}.field input::placeholder{color:var(--text-muted)}.field input[type=date]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}.dark .field input[type=date]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}.date-cell{white-space:nowrap;font-size:.75rem!important}.field select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' fill='%23a3a3a3' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10l-5 5z'/%3E%3C/svg%3E");background-position:right .75rem center;background-repeat:no-repeat;padding-right:2rem}.field select option{background:var(--surface);color:var(--text)}button[type=submit]{border-radius:var(--radius-sm);background:var(--accent);color:#fff;cursor:pointer;width:100%;height:40px;transition:background var(--transition), transform var(--transition);border:none;margin-top:1.25rem;font-family:inherit;font-size:.8125rem;font-weight:500}button[type=submit]:hover{background:var(--accent-hover)}button[type=submit]:active{transform:scale(.985)}.dark button[type=submit]{background:var(--text);color:var(--bg)}.dark button[type=submit]:hover{background:var(--accent-hover)}.results-panel{background:var(--surface);border-radius:var(--radius);border:1px solid var(--border);box-shadow:var(--shadow-sm);padding:1.75rem}.results{margin-top:0}.result-row{justify-content:space-between;align-items:baseline;padding:.625rem 0;display:flex}.result-row+.result-row{border-top:1px solid var(--code-bg)}.result-row span:first-child{color:var(--text-secondary);font-size:.8125rem;font-weight:400}.result-row span:last-child{font-variant-numeric:tabular-nums;font-size:.875rem;font-weight:600}.result-row.highlight{padding:.75rem 0}.result-row.highlight span:last-child{letter-spacing:-.02em;color:var(--text);font-size:1.5rem;font-weight:700}.result-row:not(.highlight) span:last-child{color:var(--text)}.calc-steps{border-top:1px solid var(--border);margin-top:1.25rem;padding-top:1.25rem}.calc-steps h3{color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:.875rem;font-size:.6875rem;font-weight:600}.calc-steps .formula{color:var(--text-secondary);background:var(--code-bg);border-radius:6px;margin-bottom:.875rem;padding:.625rem .75rem;font-family:SF Mono,Cascadia Code,Consolas,monospace;font-size:.8125rem;line-height:1.5}.step{gap:.5rem;margin-bottom:.375rem;font-size:.75rem;line-height:1.6;display:flex}.step:last-child{margin-bottom:0}.step .label{color:var(--text-muted);white-space:nowrap;font-weight:500}.step .value{color:var(--text-secondary);word-break:break-all;font-family:SF Mono,Cascadia Code,Consolas,monospace;font-size:.75rem}.placeholder-msg{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:.375rem;min-height:220px;display:flex}.placeholder-msg span:first-child{color:var(--text-muted);font-size:.875rem;font-weight:400}.placeholder-msg span:last-child{color:var(--border);font-size:.8125rem}.mortgage-wrapper{flex-direction:column;gap:1.5rem;display:flex}.mortgage-wrapper .calc-wrapper{grid-template-columns:1fr 1fr;align-items:start;gap:1.5rem;display:grid}.amortization-panel{background:var(--surface);border-radius:var(--radius);border:1px solid var(--border);box-shadow:var(--shadow-sm)}.amortization-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:1rem 1.5rem;display:flex}.amortization-header h3{color:var(--text);font-size:.8125rem;font-weight:600}.amortization-actions{align-items:center;gap:.75rem;display:flex}.amortization-count{color:var(--text-muted);font-size:.75rem;font-weight:400}.export-btn{border:1px solid var(--border);background:var(--surface);color:var(--text-secondary);cursor:pointer;transition:all var(--transition);white-space:nowrap;border-radius:6px;padding:.375rem .75rem;font-family:inherit;font-size:.75rem;font-weight:500}.export-btn:hover{color:var(--text);border-color:var(--text-muted)}.amortization-table-wrap{max-height:480px;overflow-y:auto}.amortization-table-wrap::-webkit-scrollbar{width:6px}.amortization-table-wrap::-webkit-scrollbar-track{background:0 0}.amortization-table-wrap::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border-radius:3px}.amortization-table{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%}.amortization-table thead{z-index:1;position:sticky;top:0}.amortization-table th{color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;text-align:right;background:var(--surface);border-bottom:1px solid var(--border);padding:.625rem 1rem;font-size:.6875rem;font-weight:600}.amortization-table th:first-child{text-align:left}.amortization-table td{color:var(--text-secondary);text-align:right;border-bottom:1px solid var(--code-bg);padding:.5rem 1rem;font-size:.8125rem}.amortization-table td:first-child{text-align:left;color:var(--text-muted);font-weight:500}.amortization-table tbody tr:hover{background:var(--code-bg)}.amortization-table tbody tr:last-child td{color:var(--text);border-bottom:none;font-weight:600}footer{border-top:1px solid var(--border);text-align:center;color:var(--text-muted);margin-top:3rem;padding-top:1.5rem;font-size:.8125rem}footer a{color:var(--text-secondary);transition:color var(--transition);font-weight:500;text-decoration:none}footer a:hover{color:var(--text)}.seo-content{border-top:1px solid var(--border);margin-top:3rem;padding-top:2rem}.seo-content h2{color:var(--text);margin-top:1.5rem;margin-bottom:.5rem;font-size:1rem;font-weight:600}.seo-content h2:first-child{margin-top:0}.seo-content p{color:var(--text-secondary);margin-bottom:.75rem;font-size:.875rem;line-height:1.7}@media (width<=720px){.app{padding:2rem 1rem}.calc-wrapper,.mortgage-wrapper .calc-wrapper{grid-template-columns:1fr}.tabs{width:100%}.tabs button{flex:1;padding:.5rem;font-size:.75rem}.calc-container,.results-panel{padding:1.25rem}}
