.rate-remove{position:absolute;right:9px;top:8px;width:25px;height:25px;border:0;border-radius:8px;background:transparent;color:var(--muted);font-size:20px;line-height:1;cursor:pointer}.rate-remove:hover{background:var(--inner);color:var(--danger)}.rate-card .rate-top{padding-right:25px}.bank-quote-hint{margin-top:8px;color:var(--muted);font-size:12px}.cbr-benchmark{margin-top:13px;color:var(--text);font-size:13px;font-weight:700;line-height:1.5}.rates-empty{grid-column:1/-1;padding:24px;text-align:center;border:1px dashed var(--border);border-radius:14px;color:var(--muted);font-size:13px}
:root{--bg:#070c0e;--surface:#0b1719;--surface2:#102326;--inner:#132528;--border:#1d363a;--text:#f8fafc;--muted:#a9b7c8;--subtle:#74869a;--mint:#00ccb4;--cyan:#5ce1e6;--gold:#e6c875;--danger:#ef8a8a;--shadow:0 20px 45px rgba(0,0,0,.22);--radius:18px;color-scheme:dark;font-family:Inter,system-ui,sans-serif}
[data-theme="light"]{--bg:#f3f7f7;--surface:#fff;--surface2:#f8fbfb;--inner:#eaf3f2;--border:#bfd2cf;--text:#081719;--muted:#35545a;--subtle:#526d72;--mint:#007f72;--cyan:#007f8b;--gold:#80620b;--danger:#b33434;--shadow:0 18px 45px rgba(20,66,63,.1);color-scheme:light}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 90% -10%,color-mix(in srgb,var(--mint) 13%,transparent),transparent 32rem),var(--bg);color:var(--text);min-height:100vh;transition:.25s}.site-header{position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:blur(14px);border-bottom:1px solid var(--border)}.header-inner{max-width:1180px;margin:auto;padding:13px 24px;display:flex;align-items:center;justify-content:space-between}.header-actions{display:flex;align-items:center;gap:14px}.brand{display:flex;align-items:center;gap:11px;color:inherit;text-decoration:none}.brand-mark{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,#00ccb4,#5ce1e6);color:#070c0e;display:grid;place-items:center;font-size:15px;font-weight:900}.brand strong{display:block;font-size:16px}.brand small{display:block;color:var(--mint);font-size:11px;font-weight:700;margin-top:3px}.header-label{font-size:13px;color:var(--muted);font-weight:600}.theme-toggle,.ghost-button{border:1px solid var(--border);background:var(--inner);color:var(--text);border-radius:10px;padding:9px 12px;font:700 12px Inter;cursor:pointer}.ghost-button{border-color:var(--mint);color:var(--mint)}
.shell{max-width:1180px;margin:auto;padding:52px 24px 32px}.intro{display:flex;justify-content:space-between;gap:32px;align-items:end;margin-bottom:28px}.eyebrow,.section-kicker{display:block;color:var(--mint);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.09em}.intro h1{font-size:clamp(32px,5vw,58px);max-width:760px;line-height:1.02;letter-spacing:-.045em;margin:15px 0 12px;font-weight:900}.intro p{font-size:16px;color:var(--muted);line-height:1.6;margin:0;max-width:650px}.date-control,label{font-size:13px;color:var(--muted);font-weight:600}.date-control{min-width:210px}input,select{display:block;width:100%;margin-top:8px;padding:13px 14px;border:1px solid var(--border);border-radius:12px;background:var(--inner);color:var(--text);font:600 15px Inter;outline:none}input:focus,select:focus{border-color:var(--mint);box-shadow:0 0 0 3px color-mix(in srgb,var(--mint) 16%,transparent)}.notice{border:1px solid var(--border);background:color-mix(in srgb,var(--mint) 10%,transparent);color:var(--text);padding:11px 14px;border-radius:12px;font-size:13px;margin-bottom:22px}.notice.error{border-color:var(--danger);color:var(--danger)}
.section-block,.converter-card,.chart-card,.bank-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}.section-block,.converter-card{margin-bottom:18px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:20px}.section-heading.compact{margin-bottom:22px}.section-heading h2,.bank-card h2{font-size:22px;margin:8px 0 0}.currency-picker{display:block;padding:14px;margin:-4px 0 18px;border:1px solid var(--border);border-radius:14px;background:var(--bg)}.currency-picker[hidden]{display:none}.currency-search{margin:0 0 12px;background:var(--surface)}.currency-options{display:flex;flex-wrap:wrap;gap:8px;max-height:190px;overflow:auto}.currency-options label{display:flex;align-items:center;gap:7px;background:var(--inner);padding:9px 11px;border:1px solid transparent;border-radius:9px;cursor:pointer}.currency-options label:hover{border-color:var(--mint)}.currency-options input{width:auto;margin:0;accent-color:var(--mint)}.currency-options span{font-size:12px;font-weight:500}.empty-search{color:var(--muted);font-size:13px;padding:8px 2px}
.rate-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.rate-card{padding:17px;border:1px solid var(--border);background:var(--surface2);border-radius:14px;position:relative;overflow:hidden}.rate-card:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--mint)}.rate-top{display:flex;justify-content:space-between}.rate-code{font-weight:900;font-size:14px}.rate-name{font-size:11px;color:var(--subtle);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rate-number{font-weight:900;font-size:23px;margin-top:14px}.rate-nominal{font-size:11px;color:var(--muted);margin-top:4px}.move{font-size:12px;font-weight:800}.move.up{color:var(--danger)}.move.down{color:var(--mint)}
.converter-card{border-color:color-mix(in srgb,var(--mint) 32%,var(--border))}.converter-grid{display:grid;grid-template-columns:1.2fr 1fr 44px 1fr;gap:12px;align-items:end}.swap-button{height:47px;border:1px solid var(--border);border-radius:12px;background:var(--inner);color:var(--cyan);font-size:22px;cursor:pointer}.result-row{display:flex;justify-content:space-between;align-items:end;gap:20px;border-top:1px solid var(--border);margin-top:24px;padding-top:22px}.result-row span,.bank-result span{display:block;color:var(--muted);font-size:12px;margin-bottom:7px}.result-row strong{font-size:clamp(28px,4vw,44px);color:var(--mint)}.formula{font-size:12px;color:var(--subtle);text-align:right;max-width:420px}
.insights-grid{display:grid;grid-template-columns:1.65fr .85fr;gap:18px}.chart-controls{display:flex;gap:8px}.chart-controls select{margin:0;width:auto;padding:9px 32px 9px 11px;font-size:12px}.chart-summary{min-height:24px;font-size:13px;color:var(--muted)}.chart-summary strong{color:var(--text)}.chart{height:250px;margin-top:12px}.chart svg{width:100%;height:100%;overflow:visible}.grid-line{stroke:var(--border)}.axis-label{fill:var(--subtle);font:10px Inter}.line{fill:none;stroke:url(#line-gradient);stroke-width:3}.area{fill:url(#area-gradient)}.point{fill:var(--mint);stroke:var(--surface);stroke-width:3}.gold{color:var(--gold)}
.bank-card{border-top:3px solid var(--gold)}.bank-help{color:var(--muted);font-size:13px;line-height:1.55;margin:10px 0 18px}.bank-result{margin-top:20px;padding:16px;border-radius:13px;background:var(--inner);border:1px solid var(--border)}.bank-result strong{font-size:27px;color:var(--gold)}.bank-comparison{font-size:12px;line-height:1.5;color:var(--muted);margin-top:12px}.bank-comparison.good{color:var(--mint)}.bank-comparison.bad{color:var(--danger)}.muted{color:var(--muted);font-size:12px}footer{display:flex;justify-content:space-between;gap:20px;padding:25px 4px 0;color:var(--subtle);font-size:11px}footer a{color:var(--muted)}button:focus-visible{outline:3px solid var(--mint);outline-offset:2px}
@media(max-width:850px){.rate-grid{grid-template-columns:repeat(2,1fr)}.insights-grid{grid-template-columns:1fr}.converter-grid{grid-template-columns:1fr 1fr}.swap-button{display:none}}@media(max-width:600px){.shell{padding:34px 16px}.header-inner{padding:12px 16px}.header-label{display:none}.theme-toggle{font-size:0}.theme-toggle:first-letter{font-size:15px}.intro{align-items:stretch;flex-direction:column}.rate-grid{grid-template-columns:1fr}.section-block,.converter-card,.chart-card,.bank-card{padding:18px}.converter-grid{grid-template-columns:1fr}.result-row{align-items:flex-start;flex-direction:column}.formula{text-align:left}.chart-controls{flex-direction:column}.chart{height:210px}footer{flex-direction:column}.intro h1{font-size:36px}}