@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";:root{--bg-primary: #ffffff;--bg-secondary: #f8f9fa;--bg-tertiary: #f1f3f5;--text-primary: #1a1a1a;--text-secondary: #495057;--text-tertiary: #6c757d;--border-color: #e9ecef;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 25px rgba(0, 0, 0, .15);--color-success: #10b981;--color-success-light: #d1fae5;--color-success-bg: #ecfdf5;--color-danger: #ef4444;--color-danger-light: #fee2e2;--color-danger-bg: #fef2f2;--color-neutral: #6b7280;--color-neutral-light: #e5e7eb;--color-neutral-bg: #f9fafb;--color-accent: #3b82f6;--color-accent-light: #dbeafe;--spacing-xs: .5rem;--spacing-sm: 1rem;--spacing-md: 1.5rem;--spacing-lg: 2rem;--spacing-xl: 3rem;--radius-sm: .5rem;--radius-md: .75rem;--radius-lg: 1rem;--radius-xl: 1.5rem;--transition-fast: .15s ease;--transition-base: .25s ease;--transition-slow: .35s ease}.dark-mode{--bg-primary: #0f172a;--bg-secondary: #1e293b;--bg-tertiary: #334155;--text-primary: #f1f5f9;--text-secondary: #cbd5e1;--text-tertiary: #94a3b8;--border-color: #334155;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px rgba(0, 0, 0, .4);--shadow-lg: 0 10px 25px rgba(0, 0, 0, .5);--color-success-light: #064e3b;--color-success-bg: #022c22;--color-danger-light: #7f1d1d;--color-danger-bg: #450a0a;--color-neutral-light: #374151;--color-neutral-bg: #1f2937;--color-accent-light: #1e3a8a}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background-color:var(--bg-primary);color:var(--text-primary);line-height:1.6;transition:background-color var(--transition-base),color var(--transition-base);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}.app{min-height:100vh;display:flex;flex-direction:column}.app-header{background-color:#f8f9facc;border-bottom:1px solid var(--border-color);padding:var(--spacing-md) var(--spacing-lg);position:sticky;top:0;z-index:100;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all var(--transition-base)}.dark-mode .app-header{background-color:#1e293bcc}.header-content{max-width:1200px;margin:0 auto;text-align:center;position:relative;padding-right:3.5rem}.app-header h1{font-size:1.5rem;font-weight:600;color:var(--text-primary);margin-bottom:var(--spacing-xs);letter-spacing:-.02em}.header-meta{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--spacing-sm);font-size:.875rem;color:var(--text-secondary)}.meta-item{display:inline-flex;align-items:center}.meta-item:after{content:"•";margin:0 var(--spacing-xs);color:var(--text-tertiary)}.meta-item:last-child:after{display:none}.source-link{color:var(--color-accent);text-decoration:none;font-size:.875rem;transition:opacity var(--transition-fast)}.source-link:hover{opacity:.8;text-decoration:underline}.theme-toggle{position:absolute;top:var(--spacing-md);right:var(--spacing-lg);background:none;border:1px solid var(--border-color);border-radius:var(--radius-md);padding:var(--spacing-xs) var(--spacing-sm);cursor:pointer;transition:all var(--transition-fast);background-color:var(--bg-tertiary);display:flex;align-items:center;justify-content:center;color:var(--text-primary)}.theme-toggle:hover{transform:scale(1.05);box-shadow:var(--shadow-sm)}.theme-toggle svg{width:20px;height:20px}.calculator-section{flex:1;padding:var(--spacing-xl) var(--spacing-lg);max-width:1200px;width:100%;margin:0 auto}.calculator-container{max-width:700px;margin:0 auto}.input-section{margin-bottom:var(--spacing-lg)}.input-wrapper{margin-bottom:var(--spacing-md)}.input-label{display:block;font-size:.875rem;font-weight:500;color:var(--text-secondary);margin-bottom:var(--spacing-xs);text-align:center}.input-group{display:flex;align-items:center;background-color:var(--bg-secondary);border:2px solid var(--border-color);border-radius:var(--radius-lg);padding:var(--spacing-xs) var(--spacing-sm);transition:all var(--transition-base);box-shadow:var(--shadow-sm);width:100%;max-width:100%;overflow:hidden;box-sizing:border-box;min-width:0;position:relative}.input-group:focus-within{border-color:var(--color-accent);box-shadow:var(--shadow-md);background-color:var(--bg-primary)}.currency-symbol{font-size:clamp(1rem,2.5vw,1.5rem);font-weight:600;color:var(--text-secondary);padding:0 var(--spacing-xs);flex-shrink:0}.amount-input{flex:1;border:none;background:none;font-size:clamp(1rem,3.5vw,1.75rem);font-weight:600;color:var(--text-primary);outline:none;text-align:center;letter-spacing:-.02em;padding:var(--spacing-xs) var(--spacing-xs);min-width:0;width:0;flex-basis:0;box-sizing:border-box;overflow:hidden;text-overflow:ellipsis}.amount-input::placeholder{color:var(--text-tertiary);font-weight:400}.currency-select{border:none;background-color:var(--bg-tertiary);border-radius:var(--radius-md);padding:var(--spacing-xs);font-size:clamp(.75rem,2vw,1rem);font-weight:500;color:var(--text-primary);cursor:pointer;outline:none;transition:background-color var(--transition-fast);-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236b7280' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .4rem center;padding-right:1.75rem;flex-shrink:0;min-width:70px;max-width:90px;box-sizing:border-box}.currency-select:hover{background-color:var(--border-color)}.type-selector{display:flex;gap:var(--spacing-sm);justify-content:center}.type-option{flex:1;display:flex;align-items:center;justify-content:center;padding:var(--spacing-sm) var(--spacing-md);border:2px solid var(--border-color);border-radius:var(--radius-md);background-color:var(--bg-secondary);cursor:pointer;transition:all var(--transition-fast);font-size:.875rem;font-weight:500;color:var(--text-secondary)}.type-option input[type=radio]{display:none}.type-option.active{border-color:var(--color-accent);background-color:var(--color-accent);color:#fff;font-weight:600}.dark-mode .type-option.active{background-color:var(--color-accent);color:#fff}.results-section{background-color:var(--bg-secondary);border-radius:var(--radius-xl);padding:var(--spacing-xl);margin-bottom:var(--spacing-lg);border:1px solid var(--border-color);transition:all var(--transition-base);min-height:200px;display:flex;flex-direction:column;justify-content:center;width:100%;max-width:100%;overflow:hidden;box-sizing:border-box}.results-section.has-result{background:linear-gradient(135deg,var(--color-success-bg) 0%,var(--bg-secondary) 100%);border-color:var(--color-success-light)}.dark-mode .results-section.has-result{background:linear-gradient(135deg,var(--color-success-bg) 0%,var(--bg-secondary) 100%)}.result-main{text-align:center;margin-bottom:var(--spacing-lg);width:100%;overflow:hidden}.result-label{font-size:.875rem;font-weight:500;color:var(--text-secondary);margin-bottom:var(--spacing-xs);text-transform:uppercase;letter-spacing:.05em}.result-value{font-size:clamp(1.5rem,5vw,3rem);font-weight:700;line-height:1.2;letter-spacing:-.03em;word-break:break-word;overflow-wrap:break-word;max-width:100%}.result-net{color:var(--color-success)}.result-value-placeholder{font-size:3rem;font-weight:300;color:var(--text-tertiary);line-height:1.2}.result-empty{text-align:center}.result-details{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-md);margin-bottom:var(--spacing-md);padding-top:var(--spacing-md);border-top:1px solid var(--border-color);width:100%;max-width:100%;overflow:hidden}.result-item{display:flex;flex-direction:column;gap:var(--spacing-xs);min-width:0;overflow:hidden}.result-item-label{font-size:.75rem;font-weight:500;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em}.result-item-value{font-size:clamp(.875rem,2.5vw,1.25rem);font-weight:600;word-break:break-word;overflow-wrap:break-word;max-width:100%}.result-gross{color:var(--text-primary)}.result-retention{color:var(--color-danger)}.conversion-info{margin-top:var(--spacing-md);padding-top:var(--spacing-md);border-top:1px solid var(--border-color);display:flex;flex-direction:column;gap:var(--spacing-xs)}.conversion-item{display:flex;justify-content:space-between;font-size:.875rem;color:var(--text-secondary)}.copy-button{margin-top:var(--spacing-md);width:100%;padding:var(--spacing-sm) var(--spacing-md);background-color:var(--bg-primary);border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:.875rem;font-weight:500;color:var(--text-primary);cursor:pointer;transition:all var(--transition-fast);display:flex;align-items:center;justify-content:center;gap:var(--spacing-xs)}.copy-button:hover{background-color:var(--bg-tertiary);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.copy-button svg{width:16px;height:16px;flex-shrink:0}.history-section{margin-top:var(--spacing-lg);padding-top:var(--spacing-lg);border-top:1px solid var(--border-color)}.history-title{font-size:.875rem;font-weight:600;color:var(--text-secondary);margin-bottom:var(--spacing-sm);text-transform:uppercase;letter-spacing:.05em}.history-list{display:flex;flex-direction:column;gap:var(--spacing-xs)}.history-item{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-sm) var(--spacing-md);background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);text-align:left;width:100%}.history-item:hover{background-color:var(--bg-tertiary);transform:translate(4px);border-color:var(--color-accent)}.history-amount{font-weight:600;color:var(--text-primary)}.history-date{font-size:.75rem;color:var(--text-secondary)}.info-section{background-color:var(--bg-secondary);border-top:1px solid var(--border-color);padding:var(--spacing-xl) var(--spacing-lg);margin-top:var(--spacing-xl)}.info-container{max-width:900px;margin:0 auto}.info-section h2{font-size:2rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-lg);text-align:center;letter-spacing:-.02em}.info-content{display:flex;flex-direction:column;gap:var(--spacing-lg)}.info-content h3{font-size:1.25rem;font-weight:600;color:var(--text-primary);margin-top:var(--spacing-md);letter-spacing:-.01em}.info-content p{color:var(--text-secondary);line-height:1.7}.info-content ul,.info-content ol{margin-left:var(--spacing-md);color:var(--text-secondary);line-height:1.8}.info-content li{margin-bottom:var(--spacing-xs)}.rates-table-container{overflow-x:auto;margin:var(--spacing-md) 0}.rates-table{width:100%;border-collapse:collapse;background-color:var(--bg-primary);border-radius:var(--radius-md);overflow:hidden;box-shadow:var(--shadow-sm)}.rates-table th{background-color:var(--bg-tertiary);padding:var(--spacing-sm) var(--spacing-md);text-align:left;font-weight:600;font-size:.875rem;color:var(--text-primary);text-transform:uppercase;letter-spacing:.05em}.rates-table td{padding:var(--spacing-sm) var(--spacing-md);border-top:1px solid var(--border-color);color:var(--text-secondary)}.rates-table tr.current-year{background-color:var(--color-success-bg)}.rates-table tr.current-year td{color:var(--color-success);font-weight:600}.rates-table tr:hover{background-color:var(--bg-secondary)}.disclaimer{margin-top:var(--spacing-xl);padding:var(--spacing-md);background-color:var(--color-danger-bg);border-left:4px solid var(--color-danger);border-radius:var(--radius-md)}.disclaimer p{color:var(--text-primary);font-size:.875rem;margin:0;display:flex;align-items:flex-start;gap:var(--spacing-xs)}.disclaimer p svg{width:16px;height:16px;flex-shrink:0;margin-top:2px;color:var(--color-danger)}.app-footer{background-color:var(--bg-secondary);border-top:1px solid var(--border-color);padding:var(--spacing-md) var(--spacing-lg);text-align:center}.app-footer p{font-size:.875rem;color:var(--text-secondary)}.app-footer a{color:var(--color-accent);text-decoration:none;font-weight:500;transition:opacity var(--transition-fast)}.app-footer a:hover{opacity:.8;text-decoration:underline}@media (max-width: 768px){.app-header{padding:var(--spacing-sm) var(--spacing-md)}.header-content{padding-right:3rem}.app-header h1{font-size:1.25rem;padding-right:0}.header-meta{font-size:.75rem;flex-direction:column;gap:var(--spacing-xs)}.meta-item:after{display:none}.theme-toggle{top:var(--spacing-sm);right:var(--spacing-md);padding:.25rem .5rem;position:absolute}.calculator-section{padding:var(--spacing-md)}.calculator-container{max-width:100%;width:100%}.input-group{width:100%;max-width:100%}.amount-input{font-size:1.5rem;text-align:center}.currency-select{min-width:70px;max-width:90px;font-size:.875rem;padding-right:1.75rem}.currency-symbol{font-size:1.25rem;padding:0 var(--spacing-xs)}.result-value{font-size:2rem}.result-details{grid-template-columns:1fr}.type-selector{flex-direction:column}.info-section{padding:var(--spacing-lg) var(--spacing-md)}.info-section h2{font-size:1.5rem}}@media (max-width: 480px){.header-content{padding-right:2.5rem}.theme-toggle{padding:.2rem .4rem}.theme-toggle svg{width:16px;height:16px}.results-section{padding:var(--spacing-md)}.result-value{font-size:1.75rem}.amount-input{font-size:1.25rem;text-align:center}.currency-select{min-width:60px;max-width:80px;font-size:.75rem;padding-right:1.5rem}.currency-symbol{font-size:1rem;padding:0 .25rem}.input-group{padding:var(--spacing-xs)}}