:root{--primary-color: #0066FF;--primary-hover: #0052CC;--bg-color: #ffffff;--text-color: #1f2937;--border-color: #e5e7eb;--selected-bg: #e6f0ff;--error-color: #dc2626;--success-color: #16a34a;--card-bg: #ffffff;--header-title-color: #1f2937;--input-bg: #ffffff;--checkbox-border: #d1d5db;--checkbox-checked-bg: #0066FF;--checkbox-checked-border: #0066FF;--section-bg: #f9fafb;--conversion-bg: #ffffff;--conversion-border: #e5e7eb;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px rgba(0, 0, 0, .07);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .1)}[data-theme=dark]{--primary-color: #4ade80;--primary-hover: #22c55e;--bg-color: #1a1d23;--text-color: #e2e8f0;--border-color: #2d3239;--selected-bg: #252930;--error-color: #f87171;--success-color: #4ade80;--card-bg: #252930;--header-title-color: #ffffff;--input-bg: #252930;--checkbox-border: #3f444d;--checkbox-checked-bg: #4ade80;--checkbox-checked-border: #4ade80;--section-bg: #1a1d23;--conversion-bg: #252930;--conversion-border: #2d3239;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px rgba(0, 0, 0, .4);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .5)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.6;color:var(--text-color);background-color:var(--section-bg);padding:1rem;transition:background-color .3s ease,color .3s ease;min-height:100vh}#app{max-width:900px;margin:0 auto;background:var(--bg-color);border-radius:12px;box-shadow:var(--shadow-lg);overflow:hidden}header{background:var(--bg-color);color:var(--header-title-color);padding:2.5rem 2rem;text-align:center;position:relative;border-bottom:1px solid var(--border-color)}header h1{font-size:2.5rem;margin-bottom:0;font-weight:700;letter-spacing:-.5px}[data-theme=dark] header h1{color:var(--primary-color)}.config-toggle{position:absolute;top:2rem;right:2rem;background:transparent;border:none;cursor:pointer;padding:.5rem;border-radius:6px;color:var(--text-color);transition:background-color .2s;width:40px;height:40px;display:flex;align-items:center;justify-content:center}.config-toggle:hover{background-color:var(--selected-bg)}.theme-toggle{background:transparent;border:1px solid var(--border-color);cursor:pointer;padding:.5rem;border-radius:8px;color:var(--text-color);transition:background-color .2s,border-color .2s;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;position:relative}.theme-toggle:hover{background-color:var(--selected-bg);border-color:var(--primary-color)}.theme-toggle svg{position:absolute;width:20px;height:20px}.theme-toggle .sun-icon{display:none}.theme-toggle .moon-icon,[data-theme=dark] .theme-toggle .sun-icon{display:block}[data-theme=dark] .theme-toggle .moon-icon{display:none}.step-number{font-weight:700}main{padding:2rem}section{margin-bottom:2rem}section:last-child{margin-bottom:0}.config-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;opacity:0;pointer-events:none;transition:opacity .2s ease;z-index:10}.config-overlay.open{opacity:1;pointer-events:auto}.config-drawer{position:fixed;top:0;right:0;height:100%;width:min(380px,90vw);background:var(--bg-color);border-left:1px solid var(--border-color);box-shadow:var(--shadow-lg);transform:translate(100%);transition:transform .25s ease;z-index:20;padding:1.5rem;overflow-y:auto}.config-drawer.open{transform:translate(0)}.config-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem}.config-header h2{margin-bottom:0}.config-close{border:1px solid var(--border-color);background:transparent;color:var(--text-color);border-radius:8px;padding:.4rem .6rem;cursor:pointer;transition:background-color .2s,border-color .2s}.config-close:hover{background-color:var(--selected-bg);border-color:var(--primary-color)}.config-section{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 1rem;border:1px solid var(--border-color);border-radius:10px;background:var(--section-bg);margin-bottom:1.5rem}.secondary-btn{padding:.6rem 1rem;border-radius:8px;border:1px solid var(--border-color);background:transparent;color:var(--text-color);font-weight:600;cursor:pointer;transition:background-color .2s,border-color .2s,color .2s}.secondary-btn:hover:not(:disabled){background-color:var(--selected-bg);border-color:var(--primary-color);color:var(--primary-color)}.secondary-btn:disabled{opacity:.6;cursor:not-allowed}h2{font-size:1.25rem;margin-bottom:1rem;color:var(--text-color)}[data-theme=dark] h2{color:var(--primary-color)}h3{font-size:1rem;margin-bottom:.75rem;color:var(--text-color)}[data-theme=dark] h3{color:var(--primary-color)}.currency-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:.75rem;margin-bottom:1rem}@media (max-width: 768px){.currency-list{grid-template-columns:repeat(2,1fr)}}.currency-checkbox{display:flex;align-items:center;gap:.5rem;padding:.875rem 1rem;border:2px solid var(--checkbox-border);border-radius:10px;cursor:pointer;transition:all .2s ease;background-color:var(--bg-color);position:relative;-webkit-user-select:none;user-select:none}.currency-checkbox:hover:not(:has(input:disabled)){background-color:var(--selected-bg);border-color:var(--primary-color);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.currency-checkbox input[type=checkbox]{position:absolute;opacity:0;cursor:pointer;width:100%;height:100%;margin:0;left:0;top:0}.currency-checkbox .checkmark{width:20px;height:20px;border:2px solid var(--checkbox-border);border-radius:6px;background-color:var(--bg-color);transition:all .2s ease;display:flex;align-items:center;justify-content:center;flex-shrink:0}.currency-checkbox .checkmark:after{content:"";display:none;width:5px;height:10px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}.currency-checkbox input[type=checkbox]:checked~.checkmark{background-color:var(--checkbox-checked-bg);border-color:var(--checkbox-checked-border)}.currency-checkbox input[type=checkbox]:checked~.checkmark:after{display:block}.currency-checkbox input[type=checkbox]:checked~.currency-label{font-weight:600;color:var(--primary-color)}.currency-checkbox:has(input[type=checkbox]:checked){background-color:var(--selected-bg);border-color:var(--primary-color)}.currency-checkbox input[type=checkbox]:disabled~.currency-label{opacity:.5;cursor:not-allowed}.currency-checkbox input[type=checkbox]:disabled~.checkmark{opacity:.5}.currency-checkbox .currency-label{color:var(--text-color);font-size:.9375rem;font-weight:500;transition:all .2s ease}.base-selector select{width:100%;padding:.875rem 1rem;font-size:1rem;border:2px solid var(--border-color);border-radius:10px;background-color:var(--input-bg);color:var(--text-color);cursor:pointer;transition:all .2s ease;font-weight:500}.base-selector select:disabled{opacity:.5;cursor:not-allowed}.base-selector select:not(:disabled):hover{border-color:var(--primary-color);box-shadow:var(--shadow-sm)}.base-selector select:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #0066ff1a}[data-theme=dark] .base-selector select:focus{box-shadow:0 0 0 3px #4ade8026}.converter-input{display:flex;gap:1rem;margin-bottom:1.5rem}.amount-field{position:relative;flex:1;min-width:0}@media (max-width: 640px){.converter-input{flex-direction:column}}.amount-field input{width:100%;padding:.875rem 9.5rem .875rem 1rem;font-size:1.125rem;border:2px solid var(--border-color);border-radius:10px;background-color:var(--input-bg);color:var(--text-color);transition:all .2s ease;font-weight:500}.amount-field input:disabled{opacity:.5;cursor:not-allowed}.amount-field input:not(:disabled):hover{border-color:var(--primary-color)}.amount-field input:not(:disabled):focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #0066ff1a}[data-theme=dark] .amount-field input:not(:disabled):focus{box-shadow:0 0 0 3px #4ade8026}.base-currency-display{position:absolute;top:50%;right:.75rem;transform:translateY(-50%);display:none;align-items:center;gap:.35rem;max-width:55%;padding:.2rem .6rem;border-radius:999px;border:1px solid var(--border-color);background-color:var(--section-bg);color:var(--text-color);font-size:.875rem;font-weight:600;line-height:1.2;pointer-events:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}[data-theme=dark] .base-currency-display{background-color:var(--bg-color)}.convert-btn{padding:.875rem 2.5rem;font-size:1rem;font-weight:600;color:#fff;background-color:var(--primary-color);border:none;border-radius:10px;cursor:pointer;transition:all .2s ease;white-space:nowrap}.convert-btn:hover:not(:disabled){background-color:var(--primary-hover);transform:translateY(-2px);box-shadow:var(--shadow-md)}.convert-btn:active:not(:disabled){transform:translateY(0)}.convert-btn:disabled{opacity:.5;cursor:not-allowed}[data-theme=dark] .convert-btn{color:#1a1d23;font-weight:700}.clear-btn{padding:.875rem 1.75rem;font-size:1rem;font-weight:600;color:var(--text-color);background-color:transparent;border:2px solid var(--border-color);border-radius:10px;cursor:pointer;transition:all .2s ease;white-space:nowrap}.clear-btn:hover:not(:disabled){background-color:var(--selected-bg);border-color:var(--primary-color);color:var(--primary-color);transform:translateY(-2px);box-shadow:var(--shadow-sm)}.clear-btn:active:not(:disabled){transform:translateY(0)}.clear-btn:disabled{opacity:.6;cursor:not-allowed}.conversions{margin-top:1.5rem;display:flex;flex-direction:column;gap:.75rem}.conversion-item{display:flex;justify-content:space-between;align-items:center;padding:1.25rem 1.5rem;background-color:var(--conversion-bg);border:1px solid var(--conversion-border);border-radius:12px;transition:all .2s ease;box-shadow:var(--shadow-sm)}.conversion-item:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--primary-color)}.conversion-left{display:flex;align-items:center;gap:.875rem}.flag-icon{font-size:2rem;width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:var(--section-bg);border-radius:50%;flex-shrink:0}[data-theme=dark] .flag-icon{background:var(--bg-color)}.currency-code{font-weight:600;font-size:1.125rem;color:var(--text-color);letter-spacing:.5px}.conversion-right{display:flex;align-items:center;gap:.75rem}.arrow-icon{font-size:1.25rem;color:var(--primary-color);opacity:.6}.converted-amount{font-size:1.375rem;font-weight:700;color:var(--primary-color);letter-spacing:-.5px}.no-conversions{text-align:center;color:#6b7280;padding:2rem;font-style:italic}.rate-info{margin-top:1.5rem;padding:1rem 1.25rem;background-color:var(--section-bg);border-radius:10px;border:1px solid var(--border-color);display:flex;flex-direction:column;gap:.5rem}.rate-info-item{display:flex;justify-content:space-between;align-items:center;font-size:.875rem}.rate-label{color:var(--text-color);opacity:.7;font-weight:500}.rate-value{color:var(--text-color);font-weight:600}.rate-info-note{font-size:.8rem;color:var(--text-color);opacity:.7}@media (max-width: 640px){.rate-info-item{flex-direction:column;align-items:flex-start;gap:.25rem}}.error{background-color:#fef2f2;border:1px solid var(--error-color);color:var(--error-color);padding:1rem;border-radius:8px;margin-top:1rem}[data-theme=dark] .error{background-color:#f871711a}@media (max-width: 640px){body{padding:.5rem}header{padding:1.5rem}header h1{font-size:1.5rem}main{padding:1.5rem}.currency-list{grid-template-columns:1fr}}