*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,system-ui,sans-serif;font-size:.9375rem;line-height:1.5}input,select,button{font:inherit}button{cursor:pointer}table{border-collapse:collapse;width:100%}:root{--bg: #f0f4f8;--surface: #ffffff;--surface-alt: #f8fafc;--border: #dde3ea;--text: #1a2332;--text-muted: #5c6b7a;--accent: #2563eb;--accent-hover: #1d4ed8;--accent-fg: #ffffff;--danger: #dc2626;--success: #16a34a;--band-pa: #f0fdf4;--band-basic: #eff6ff;--band-higher: #fefce8;--band-additional: #fff7ed;--band-ni: #fdf4ff;--band-zero-text: #94a3b8;--band-benefit: #f0f9ff;--bar-net: #22c55e;--bar-tax: #3b82f6;--bar-ni: #a855f7;--bar-pretax: #f59e0b;--bar-posttax: #94a3b8;--bar-benefit: #ef4444;--radius: .5rem;--radius-sm: .325rem;--shadow: 0 1px 4px rgb(0 0 0 / .08);--gap: 1.25rem}[data-theme=dark]{--bg: #0d1117;--surface: #161b22;--surface-alt: #1c2128;--border: #2d333b;--text: #cdd9e5;--text-muted: #768390;--accent: #4493f8;--accent-hover: #6eb0f9;--accent-fg: #0d1117;--band-pa: #0d2115;--band-basic: #0d1e3b;--band-higher: #1f1a04;--band-additional: #1f1005;--band-ni: #1a0d26;--band-benefit: #021a2b;--band-zero-text: #484f58}body{background:var(--bg);color:var(--text);min-height:100vh}#app{max-width:1000px;margin:0 auto;padding:1.5rem 1rem 3rem}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--gap)}header h1{font-size:1.25rem;font-weight:600}header .subtitle{font-size:.8125rem;color:var(--text-muted);margin-top:.1rem}#theme-toggle{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.375rem .625rem;font-size:1rem;color:var(--text);line-height:1;transition:background .15s}#theme-toggle:hover{background:var(--surface-alt)}main{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap)}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem 1.375rem;box-shadow:var(--shadow)}.card h2{font-size:.875rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted);margin-bottom:.875rem}#results-section{grid-column:1 / -1}.input-row{display:flex;gap:.5rem;align-items:stretch;flex-wrap:wrap}input[type=number],input[type=text]{background:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.5rem .75rem;color:var(--text);outline:none;transition:border-color .15s,box-shadow .15s}input[type=number]:focus,input[type=text]:focus{border-color:var(--accent);box-shadow:0 0 0 3px #2563eb26}input[type=number]{width:9rem;font-size:1.0625rem;font-weight:500}.toggle-group{display:flex;border:1px solid var(--border);border-radius:var(--radius-sm);overflow:hidden}.toggle-group button{background:var(--surface-alt);border:none;padding:.5rem .75rem;font-size:.875rem;color:var(--text-muted);border-right:1px solid var(--border);transition:background .12s,color .12s}.toggle-group button:last-child{border-right:none}.toggle-group button.active{background:var(--accent);color:var(--accent-fg);font-weight:500}.toggle-group button:hover:not(.active){background:var(--surface);color:var(--text)}#taxcode-input{width:8rem;font-size:1rem;font-weight:500;letter-spacing:.04em;text-transform:uppercase}.hint{font-size:.8125rem;color:var(--text-muted);margin-top:.5rem;min-height:1.25rem}.hint.warning{color:#b45309}.hint.warning:before{content:"⚠ "}#deductions-list{display:flex;flex-direction:column;gap:.5rem;margin-bottom:.75rem}.drag-handle{cursor:grab;color:var(--text-muted);font-size:1rem;line-height:1;padding:0 .25rem;user-select:none;opacity:.5;transition:opacity .12s}.drag-handle:hover{opacity:1}.drag-handle:active{cursor:grabbing}.row-dragging{opacity:.4}.row-drag-over{outline:2px dashed var(--accent);outline-offset:-2px;border-radius:var(--radius-sm)}.deduction-row{display:grid;grid-template-columns:1.25rem 1fr 3.5rem 6rem 6.5rem 10.5rem 1.75rem;gap:.375rem;align-items:center}.deduction-row[data-mode=percent] .ded-period{display:none}.deduction-row input,.deduction-row select{background:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.375rem .5rem;color:var(--text);font-size:.875rem;outline:none;width:100%}.deduction-row input:focus,.deduction-row select:focus{border-color:var(--accent);box-shadow:0 0 0 2px #2563eb1f}.ded-remove{background:none;border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-muted);font-size:1rem;line-height:1;padding:.25rem;transition:color .12s,border-color .12s;width:1.75rem;height:1.75rem;display:flex;align-items:center;justify-content:center}.ded-remove:hover{color:var(--danger);border-color:var(--danger)}#add-deduction,#add-benefit{background:none;border:1px dashed var(--border);border-radius:var(--radius-sm);padding:.4rem .75rem;font-size:.875rem;color:var(--accent);transition:background .12s}#add-deduction:hover,#add-benefit:hover{background:var(--surface-alt)}#benefits-list{display:flex;flex-direction:column;gap:.5rem;margin-bottom:.75rem}.benefit-row{display:grid;grid-template-columns:1.25rem 1fr 8rem 6.5rem 14rem 1.75rem;gap:.375rem;align-items:center}.benefit-row input,.benefit-row select{background:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.375rem .5rem;color:var(--text);font-size:.875rem;outline:none;width:100%}.benefit-row input:focus,.benefit-row select:focus{border-color:var(--accent);box-shadow:0 0 0 2px #2563eb1f}.ben-remove{background:none;border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-muted);font-size:1rem;line-height:1;padding:.25rem;transition:color .12s,border-color .12s;width:1.75rem;height:1.75rem;display:flex;align-items:center;justify-content:center}.ben-remove:hover{color:var(--danger);border-color:var(--danger)}@media(max-width:540px){.benefit-row{grid-template-columns:1fr 1.75rem;grid-template-rows:auto auto auto}.benefit-row .ben-label{grid-column:1;grid-row:1}.benefit-row .ben-remove{grid-column:2;grid-row:1;align-self:start}.benefit-row .ben-amount{grid-column:1;grid-row:2}.benefit-row .ben-period{grid-column:1;grid-row:3}.benefit-row .ben-type{grid-column:1;grid-row:4}}#summary-bar{display:flex;height:.625rem;border-radius:999px;overflow:hidden;margin-bottom:1rem;background:var(--border)}.bar-seg{transition:width .3s ease;flex-shrink:0}.bar-seg[data-seg=net]{background:var(--bar-net)}.bar-seg[data-seg=tax]{background:var(--bar-tax)}.bar-seg[data-seg=ni]{background:var(--bar-ni)}.bar-seg[data-seg=pretax]{background:var(--bar-pretax)}.bar-seg[data-seg=posttax]{background:var(--bar-posttax)}#summary-labels{display:flex;flex-wrap:wrap;gap:.5rem 1rem;font-size:.8125rem;color:var(--text-muted);margin-bottom:1rem}.sum-label{display:flex;align-items:center;gap:.35rem}.sum-dot{width:.5rem;height:.5rem;border-radius:50%;flex-shrink:0}.results-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;flex-wrap:wrap;gap:.5rem}.results-header h2{margin:0}#copy-btn{background:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.375rem .875rem;font-size:.875rem;color:var(--text);transition:background .12s}#copy-btn:hover{background:var(--surface)}#copy-btn.copied{color:var(--success);border-color:var(--success)}.table-wrap{overflow-x:auto}table{font-size:.875rem}thead th{background:var(--surface-alt);border-bottom:2px solid var(--border);padding:.6rem .75rem;text-align:left;font-size:.8125rem;font-weight:600;color:var(--text-muted);white-space:nowrap}thead th:not(:first-child){text-align:right}tbody tr{border-bottom:1px solid var(--border)}tbody tr:last-child{border-bottom:none}tbody tr[data-band=pa]{background:var(--band-pa)}tbody tr[data-band=basic]{background:var(--band-basic)}tbody tr[data-band=higher]{background:var(--band-higher)}tbody tr[data-band=additional]{background:var(--band-additional)}tbody tr[data-band=ni]{background:var(--band-ni)}tbody tr[data-band=benefit]{background:var(--band-benefit)}tbody tr.zero-row td{color:var(--band-zero-text)}tbody tr.subtotal-row{border-top:2px solid var(--border);border-bottom:2px solid var(--border)}tbody tr.subtotal-row td{font-weight:600}td{padding:.6rem .75rem}td:not(:first-child){text-align:right;font-variant-numeric:tabular-nums}td:first-child{white-space:nowrap}tfoot tr{border-top:2px solid var(--border)}tfoot tr+tr{border-top:1px solid var(--border)}tfoot td{padding:.6rem .75rem;font-variant-numeric:tabular-nums}tfoot td:not(:first-child){text-align:right}tfoot tr.total-row td{font-weight:600}tfoot tr.net-row td{font-weight:700;color:var(--success);font-size:.9375rem}#tax-config-section{grid-column:1 / -1}#tax-config-section summary{cursor:pointer;font-size:.875rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted);list-style:none;display:flex;align-items:center;gap:.5rem;user-select:none}#tax-config-section summary::-webkit-details-marker{display:none}#tax-config-section summary .chevron{font-size:.75rem;transition:transform .2s;display:inline-block}#tax-config-section details[open] summary .chevron{transform:rotate(90deg)}.tax-config-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(16rem,1fr));gap:1rem;margin-top:1rem}.tax-config-group h3{font-size:.8125rem;font-weight:600;color:var(--text-muted);margin-bottom:.5rem}.tax-config-field{display:flex;align-items:center;gap:.5rem;margin-bottom:.375rem}.tax-config-field label{font-size:.8125rem;color:var(--text-muted);flex:1;white-space:nowrap}.tax-config-field input{background:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.3rem .5rem;color:var(--text);font-size:.875rem;outline:none;width:7rem;text-align:right}.tax-config-field input:focus{border-color:var(--accent);box-shadow:0 0 0 2px #2563eb1f}.tax-config-actions{margin-top:.875rem;display:flex;gap:.5rem}#reset-tax-config{background:none;border:1px solid var(--border);border-radius:var(--radius-sm);padding:.375rem .75rem;font-size:.875rem;color:var(--text-muted);transition:color .12s,border-color .12s}#reset-tax-config:hover{color:var(--danger);border-color:var(--danger)}.disclaimer{margin-top:.875rem;font-size:.8125rem;color:var(--text-muted);padding:.5rem .75rem;background:var(--surface-alt);border-radius:var(--radius-sm);border-left:3px solid var(--border)}@media(max-width:720px){main{grid-template-columns:1fr}#results-section{grid-column:1}}@media(max-width:540px){.deduction-row{grid-template-columns:1.25rem 1fr 3.5rem 1.75rem;grid-template-rows:auto auto auto}.deduction-row .drag-handle{grid-column:1;grid-row:1}.deduction-row .ded-label{grid-column:2 / -1;grid-row:1}.deduction-row .ded-mode{grid-column:2;grid-row:2}.deduction-row .ded-amount{grid-column:3;grid-row:2}.deduction-row .ded-period{grid-column:2;grid-row:3}.deduction-row .ded-type{grid-column:3 / span 2;grid-row:3}.deduction-row .ded-remove{grid-column:4;grid-row:2;align-self:start}.benefit-row{grid-template-columns:1.25rem 1fr 1.75rem;grid-template-rows:auto auto auto}.benefit-row .drag-handle{grid-column:1;grid-row:1}.benefit-row .ben-label{grid-column:2;grid-row:1}.benefit-row .ben-remove{grid-column:3;grid-row:1;align-self:start}.benefit-row .ben-amount{grid-column:2;grid-row:2}.benefit-row .ben-period{grid-column:2;grid-row:3}.benefit-row .ben-type{grid-column:2;grid-row:4}}
