:root{--buncss-light:initial;--buncss-dark: ;color-scheme:light dark;color:#ffffffde;--primary-color:#3b82f6;--primary-hover:#2563eb;--secondary-color:#64748b;--success-color:#10b981;--warning-color:#f59e0b;--danger-color:#ef4444;--bg-card:#ffffff0d;--bg-input:#ffffff1a;--border-color:#fff3;--text-primary:#fffffff2;--text-secondary:#ffffffb3;background:linear-gradient(135deg,#1e293b 0%,#334155 100%);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,Avenir,Helvetica,Arial,sans-serif;line-height:1.5}@media (prefers-color-scheme:dark){:root{--buncss-light: ;--buncss-dark:initial}}*{box-sizing:border-box}body{position:relative;overflow-x:auto;background:linear-gradient(135deg,#1e293b 0%,#334155 100%);min-height:100vh;margin:0}.app{display:flex;justify-content:center;align-items: flex-start;min-height:100vh;padding:2rem}.calculator-container{background:var(--bg-card);border:1px solid var(--border-color);backdrop-filter:blur(20px);overflow:hidden;border-radius:20px;width:100%;max-width:1200px;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a}.header-with-language{display:flex;justify-content:flex-end;padding:1rem 2rem 0}.language-selector{display:flex;background:#ffffff1a;border-radius:8px;gap:.5rem;padding:.25rem}.lang-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:6px;padding:.5rem 1rem;transition:all .3s;font-size:.9rem;font-weight:500}.lang-btn:hover{color:var(--text-primary);background:#ffffff1a}.lang-btn.active{background:var(--primary-color);color:#fff;box-shadow:0 2px 4px #3b82f64d}.lang-btn.auto-detected{position:relative}.lang-btn.auto-detected:after{content:"●";position:absolute;color:var(--success-color);font-size:.7rem;line-height:1;top:-4px;right:-4px}h1{color:var(--text-primary);text-align:center;-webkit-text-fill-color:transparent;background:linear-gradient(135deg,#3b82f6,#8b5cf6);-webkit-background-clip:text;background-clip:text;margin:0 0 .5rem;padding:1rem 2rem 0;font-size:2.5rem;font-weight:700}.subtitle{text-align:center;color:var(--text-secondary);margin:0 0 2rem;padding:0 2rem;font-size:1.1rem}.input-section{display:flex;border-bottom:1px solid var(--border-color);flex-direction:column;gap:2rem;padding:0 2rem 2rem}.primary-inputs{display:flex;flex-direction:column;gap:1rem}.input-row{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;gap:1.5rem}.primary-input-group{display:flex;background:var(--bg-input);border:1px solid var(--border-color);border-radius:12px;flex-direction:column;gap:.75rem;padding:1rem}.cost-inputs{display:flex;flex-direction:column;gap:1rem}.cost-inputs h3{color:var(--text-primary);margin:0 0 1rem;font-size:1.3rem;font-weight:600}.cost-input-group{display:flex;background:var(--bg-input);border:1px solid var(--border-color);border-radius:12px;flex-direction:column;gap:.75rem;padding:1rem}.cost-header{display:flex;justify-content:space-between;align-items: center}.cost-header label{color:var(--text-primary);font-size:.95rem;font-weight:600}.cost-name-input{border:1px solid var(--border-color);background:var(--bg-input);color:var(--text-primary);border-radius:6px;flex:1;margin-right:.5rem;padding:.5rem;font-weight:600}.cost-name-input:focus{outline:none;border-color:var(--primary-color)}.remove-cost-btn{background:var(--danger-color);color:#fff;cursor:pointer;display:flex;border:none;border-radius:50%;justify-content:center;align-items: center;width:24px;height:24px;transition:all .3s;font-size:.8rem;font-weight:700}.remove-cost-btn:hover{background:#dc2626;transform:scale(1.1)}.cost-controls{display:grid;grid-template-columns:2fr 1fr auto;align-items: center;gap:.75rem}.cost-controls.single-input{grid-template-columns:1fr;gap:0}.input-with-currency{display:flex;border:2px solid var(--border-color);overflow:hidden;background:var(--bg-input);border-radius:8px;transition:all .3s}.input-with-currency:focus-within{border-color:var(--primary-color);box-shadow:0 0 0 3px #3b82f61a}.input-with-currency input{color:var(--text-primary);background:0 0;border:none;flex:1;padding:.75rem;font-size:.95rem}.input-with-currency input:focus{outline:none}.input-with-currency.single-currency,.input-with-currency.single-currency input{border-radius:8px}.currency-selector,.frequency-selector,.month-selector{border:2px solid var(--border-color);background:var(--bg-input);color:var(--text-primary);cursor:pointer;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,0.7)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6,9 12,15 18,9'%3E%3C/polyline%3E%3C/svg%3E");background-position:right .5rem center;background-repeat:no-repeat;background-size:14px;border-radius:8px;padding:.75rem 2rem .75rem .75rem;transition:all .3s;font-size:.9rem}.currency-selector{border:none;border-left:1px solid var(--border-color);background-color:#ffffff0d;background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,0.7)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6,9 12,15 18,9'%3E%3C/polyline%3E%3C/svg%3E");background-position:right .5rem center;background-repeat:no-repeat;background-size:14px;border-radius:0;min-width:70px;padding-right:2rem}.frequency-selector:focus,.month-selector:focus,.currency-selector:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #3b82f61a}.add-cost-section{display:flex;border:2px dashed var(--border-color);text-align:center;border-radius:12px;flex-direction:column;gap:1rem;padding:1rem}.add-cost-btn{background:var(--primary-color);color:#fff;cursor:pointer;border:none;border-radius:8px;padding:1rem 2rem;transition:all .3s;font-size:1rem;font-weight:600}.add-cost-btn:hover{background:var(--primary-hover);transform:translateY(-1px)}.restore-costs{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem}.restore-cost-btn{color:var(--primary-color);border:1px solid var(--primary-color);cursor:pointer;background:#3b82f61a;border-radius:6px;padding:.5rem 1rem;transition:all .3s;font-size:.85rem}.restore-cost-btn:hover{background:var(--primary-color);color:#fff}.frequency-indicator{color:var(--text-secondary);margin-left:.5rem;font-size:.8rem;font-weight:400}.calculation-indicator{color:var(--text-secondary);display:block;margin-top:.25rem;font-size:.75rem;font-weight:400}.input-group{display:flex;flex-direction:column;gap:.5rem}.input-group label{color:var(--text-primary);font-size:.95rem;font-weight:600}.input-group input{border:2px solid var(--border-color);background:var(--bg-input);color:var(--text-primary);backdrop-filter:blur(10px);border-radius:12px;padding:1rem;transition:all .3s;font-size:1rem}.input-group input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #3b82f61a}.checkbox-group{display:flex;grid-column:1/-1;align-items: center;gap:.75rem}.checkbox-group input[type=checkbox]{accent-color:var(--primary-color);cursor:pointer;width:20px;height:20px}.checkbox-group label{color:var(--text-primary);cursor:pointer;user-select:none;font-weight:500}.fixed-costs{border-bottom:1px solid var(--border-color);padding:2rem}.fixed-costs h3{color:var(--text-primary);margin:0 0 1.5rem;font-size:1.5rem;font-weight:600}.costs-grid{display:grid;gap:.75rem}.cost-item{display:flex;background:var(--bg-input);border:1px solid var(--border-color);border-radius:8px;justify-content:space-between;align-items: center;padding:.75rem 1rem}.cost-item.total{border-color:var(--primary-color);background:#3b82f61a;font-weight:600}.cost-item span:first-child{color:var(--text-secondary)}.cost-item span:last-child{color:var(--text-primary);font-weight:600}.summary{border-bottom:1px solid var(--border-color);padding:2rem}.summary-header{display:flex;flex-wrap:wrap;justify-content:space-between;align-items: center;gap:1rem;margin-bottom:1.5rem}.summary h3{color:var(--text-primary);margin:0;font-size:1.5rem;font-weight:600}.export-btn{display:flex;background:var(--primary-color);color:#fff;cursor:pointer;border:none;border-radius:8px;align-items: center;gap:.5rem;padding:.75rem 1.5rem;transition:all .3s;font-size:.9rem;font-weight:600;box-shadow:0 2px 4px #3b82f633}.export-btn:hover:not(:disabled){background:var(--primary-hover);transform:translateY(-1px);box-shadow:0 4px 8px #3b82f64d}.export-btn:disabled{opacity:.7;cursor:not-allowed;transform:none}.export-icon{font-size:1.1rem}.loading-spinner{animation:spin 1s linear infinite;border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:16px;height:16px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem}.summary-item{display:flex;background:linear-gradient(135deg,#3b82f61a,#8b5cf61a);border:1px solid #3b82f64d;border-radius:12px;justify-content:space-between;align-items: center;padding:1.5rem}.summary-item span:first-child{color:var(--text-secondary);font-weight:500}.summary-item .highlight{color:var(--text-primary);font-size:1.2rem;font-weight:700}.monthly-breakdown{padding:2rem}.monthly-breakdown h3{color:var(--text-primary);margin:0 0 1.5rem;font-size:1.5rem;font-weight:600}.table-container{overflow-x:auto;border:1px solid var(--border-color);background:var(--bg-input);border-radius:12px}table{border-collapse:collapse;table-layout:auto;display:table;width:100%}thead{display:table-header-group}tbody{display:table-row-group}tr{display:table-row}th,td{position:relative;display:table-cell!important}th{color:var(--text-primary);text-align:left;border-bottom:1px solid var(--border-color);white-space:nowrap;border-right:1px solid var(--border-color);background:#3b82f61a;padding:1rem;font-size:.95rem;font-weight:600}td{color:var(--text-secondary);vertical-align:top;border-bottom:1px solid #ffffff0d;border-right:1px solid #ffffff0d;padding:1rem;font-size:.95rem}td:last-child,th:last-child{border-right:none}tr:hover{background:#ffffff08}tr:last-child td{border-bottom:none}.net-income{font-weight:600;color:var(--success-color)!important}.tax-breakdown{min-width:200px;color:var(--text-primary)!important}.bracket-breakdown{display:flex;flex-direction:column;gap:.25rem}.bracket-item{display:flex;border-left:3px solid var(--primary-color);background:#3b82f60d;border-radius:4px;justify-content:space-between;align-items: center;padding:.25rem .5rem}.bracket-label{color:var(--text-secondary);font-size:.8rem;font-weight:500}.bracket-tax{color:var(--text-primary);font-size:.8rem;font-weight:600}.total-tax{text-align:center;border:1px solid var(--primary-color);background:#3b82f61a;border-radius:6px;margin-top:.5rem;padding:.5rem}.total-tax strong{color:var(--primary-color);font-size:.9rem}.no-tax{color:var(--text-secondary);font-size:.9rem;font-style:italic}.amount-with-try{display:flex;flex-direction:column;gap:.25rem}.try-caption{color:var(--text-secondary);opacity:.8;font-size:.75rem;font-weight:400;line-height:1.2}.bracket-tax.amount-with-try{text-align:right}.total-tax .amount-with-try{align-items: center}.quarterly-tax{border-left:3px solid var(--primary-color);background:#3b82f60d;border-radius:8px;padding:.75rem}.quarter-label{color:var(--primary-color);text-align:center;margin-bottom:.5rem;font-size:.9rem;font-weight:600}.no-quarterly-tax{text-align:center;color:var(--text-secondary);padding:1rem;font-style:italic}.no-payment{display:block;margin-bottom:.25rem;font-size:.9rem}.quarter-info{opacity:.7;font-size:.75rem}.income-mode-toggle{display:flex;background:var(--bg-input);border:1px solid var(--border-color);border-radius:12px;align-items: center;gap:1rem;margin-bottom:1rem;padding:1rem}.income-mode-label{color:var(--text-primary);font-size:.95rem;font-weight:600}.toggle-buttons{display:flex;background:#ffffff0d;border-radius:8px;gap:.5rem;padding:.25rem}.toggle-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:6px;padding:.5rem 1.5rem;transition:all .3s;font-size:.9rem;font-weight:500}.toggle-btn:hover{color:var(--text-primary);background:#ffffff1a}.toggle-btn.active{background:var(--primary-color);color:#fff;box-shadow:0 2px 4px #3b82f64d}.variable-income-section{display:flex;flex-direction:column;gap:1rem}.variable-income-section .input-row{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.variable-income-inputs{background:var(--bg-input);border:1px solid var(--border-color);border-radius:12px;padding:1rem}.variable-income-header{margin-bottom:1rem}.variable-income-header label{color:var(--text-primary);font-size:1rem;font-weight:600}.variable-income-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem}.monthly-income-item{display:flex;flex-direction:column;gap:.5rem}.month-label{color:var(--text-secondary);font-size:.85rem;font-weight:500}.variable-income-inputs .input-with-currency{display:flex;border:2px solid var(--border-color);overflow:hidden;background:var(--bg-input);border-radius:8px;transition:all .3s}.variable-income-inputs .input-with-currency:focus-within{border-color:var(--primary-color);box-shadow:0 0 0 3px #3b82f61a}.variable-income-inputs .input-with-currency input{color:var(--text-primary);background:0 0;border:none;flex:1;padding:.75rem;font-size:.95rem}.variable-income-inputs .input-with-currency input:focus{outline:none}.currency-display{color:var(--text-primary);border-left:1px solid var(--border-color);background:#3b82f61a;padding:.75rem;font-size:.9rem;font-weight:600}.currency-selector-month{color:var(--text-primary);border:none;border-left:1px solid var(--border-color);cursor:pointer;background:#3b82f61a;min-width:70px;padding:.75rem;transition:all .3s;font-size:.9rem;font-weight:600}.currency-selector-month:hover{background:#3b82f626}.currency-selector-month:focus{outline:none;background:#3b82f633}@media (max-width:768px){.app{padding:1rem}h1{padding:1.5rem 1.5rem 0;font-size:2rem}.subtitle{padding:0 1.5rem}.input-section,.fixed-costs,.summary,.monthly-breakdown{padding:1.5rem}.input-row{grid-template-columns:1fr}.cost-controls{grid-template-columns:1fr;gap:1rem}.cost-controls.single-input{grid-template-columns:1fr;gap:0}.summary-grid{grid-template-columns:1fr}.summary-header{text-align:center;flex-direction:column;align-items:stretch}.export-btn{justify-content:center}.table-container{overflow-x:auto;max-width:100vw;font-size:.9rem}table{display:table;min-width:900px}th,td{display:table-cell;padding:.75rem .5rem}}@media (prefers-reduced-motion){*,:before,:after{animation:none!important}}