/* Exchange desk: scoped to its page and shared widget. */
.qb-rates-page { background:var(--qb-paper, #f5f6f9); }
/* The legacy footer assets were drawn for a dark background. */
body.qb-theme-home.qb-rates-page .root1-brand-logo { filter:brightness(0); opacity:.8; }
body.qb-theme-home.qb-rates-page .root1-store-name { color:var(--qb-ink); }
body.qb-theme-home.qb-rates-page .root1-footer-bottom { border-color:var(--qb-line); }
body.qb-theme-home.qb-rates-page .qb-cookie-banner__card { color:var(--qb-ink); }
body.qb-theme-home.qb-rates-page .qb-cookie-banner__text { color:var(--qb-muted); }
.qb-fx-shell, .qb-fx-widget { --fx-ink:var(--qb-ink, #172a50); --fx-muted:var(--qb-muted, #66748b); --fx-line:var(--qb-line, #dce2ed); --fx-accent:var(--qb-accent, #123b91); --fx-paper:var(--qb-paper, #f5f6f9); --fx-surface:var(--qb-surface, #fff); --fx-tint:var(--qb-tint, #e8edf8); }
.qb-fx-shell { color:var(--fx-ink); padding:46px 0 28px; font-family:"Segoe UI",Arial,sans-serif; }
.qb-fx-shell *, .qb-fx-widget * { box-sizing:border-box; }
.qb-fx-shell [hidden], .qb-fx-widget [hidden] { display:none !important; }
.qb-fx-shell button, .qb-fx-shell input { font:inherit; }
.qb-fx-shell a:focus-visible, .qb-fx-shell button:focus-visible, .qb-fx-shell input:focus-visible, .qb-fx-shell summary:focus-visible, .qb-fx-plot:focus-visible, .qb-fx-widget a:focus-visible { outline:3px solid #416dcc; outline-offset:4px; }
.qb-fx-page-head { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:30px; }
.qb-fx-eyebrow { display:flex; align-items:center; gap:9px; font-size:10px; letter-spacing:.2em; font-weight:700; margin:0 0 13px; color:var(--fx-accent); }
.qb-fx-eyebrow>span { width:22px; height:2px; background:#416dcc; }
.qb-fx-page-head h1 { font-family:Georgia,"Times New Roman",serif; font-size:clamp(32px,3.5vw,46px); line-height:1.12; letter-spacing:-1.4px; font-weight:400; margin:0 0 12px; color:var(--fx-ink); }
.qb-fx-page-head h1>span { color:#416dcc; }
.qb-fx-intro { margin:0; font-size:14px; line-height:1.6; color:var(--fx-muted); }
.qb-fx-market { display:flex; align-items:center; gap:12px; padding:14px 18px; border:1px solid var(--fx-line); border-radius:5px; background:var(--fx-surface); flex-shrink:0; }
.qb-fx-market svg { width:18px; height:18px; color:var(--fx-accent); }
.qb-fx-market span { display:block; color:var(--fx-muted); font-size:10px; margin-bottom:2px; }
.qb-fx-market strong { font-size:12px; font-weight:600; }
.qb-fx-pairs { display:flex; gap:10px; margin-bottom:20px; flex-wrap:wrap; }
.qb-fx-pair { display:flex; align-items:center; gap:18px; flex:1 1 200px; padding:16px 18px; border:1px solid var(--fx-line); border-radius:5px; color:var(--fx-ink); background:var(--fx-surface); text-decoration:none !important; transition:border-color .15s,background .15s; }
.qb-fx-pair:hover { border-color:#9caaba; color:var(--fx-ink); background:#fafbfd; }
.qb-fx-pair.is-active { border-color:var(--fx-accent); box-shadow:inset 0 -2px var(--fx-accent); }
.qb-fx-pair-code { font-size:12px; font-weight:700; white-space:nowrap; }
.qb-fx-pair-code span { color:var(--fx-muted); margin-left:5px; font-weight:400; }
.qb-fx-pair>strong { margin-left:auto; font-size:18px; font-weight:600; font-variant-numeric:tabular-nums; }
.qb-fx-pair>svg { width:14px; height:14px; color:var(--fx-accent); flex-shrink:0; }
.qb-fx-workspace { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:20px; align-items:start; }
.qb-fx-terminal { min-width:0; border-radius:5px; overflow:hidden; padding:30px 28px 20px; background:radial-gradient(ellipse at 85% 0%,#243f79 0,transparent 55%),#112d70; color:#f6f8fa; box-shadow:none; }
.qb-fx-quote-head { display:flex; justify-content:space-between; gap:16px; margin-bottom:32px; }
.qb-fx-kicker { font-size:10px; text-transform:uppercase; font-weight:600; letter-spacing:.15em; color:#bcb79e; margin-bottom:16px; }
.qb-fx-quote-equation { font-size:15px; font-weight:500; color:#d2dce5; }
.qb-fx-quote-equation>span { margin-left:6px; color:#8196a9; }
.qb-fx-quote-value { font-size:clamp(34px,4vw,54px); line-height:1.2; letter-spacing:-1.6px; font-weight:400; font-variant-numeric:tabular-nums; margin:4px 0 9px; overflow-wrap:anywhere; }
.qb-fx-quote-value>span { font-size:15px; margin-left:10px; letter-spacing:0; color:#b7c7d6; white-space:nowrap; }
.qb-fx-currency-names { font-size:11px; color:#b8c6d4; margin:0; }
.qb-fx-currency-names>span { color:#d4bb83; margin:0 5px; }
.qb-fx-source { font-size:10px; text-align:right; line-height:1.6; color:#d2dce5; padding-top:2px; }
.qb-fx-source>small { display:block; font-size:10px; color:#a4b5c6; margin-top:4px; }
.qb-fx-source-dot { display:inline-block; width:5px; height:5px; border-radius:50%; background:#c5b080; margin-right:4px; }
.qb-fx-periods { display:flex; gap:4px; padding:4px; background:#0d2134; border:1px solid #304458; border-radius:7px; width:max-content; margin:0 0 22px auto; }
.qb-fx-periods button { border:0; border-radius:4px; background:transparent; color:#b8c6d4; min-width:42px; min-height:32px; font-size:11px; cursor:pointer; }
.qb-fx-periods button[aria-pressed="true"] { background:var(--fx-tint); color:#233549; font-weight:700; }
.qb-fx-periods button:hover { color:#fff; background:#30485e; }
.qb-fx-periods button[aria-pressed="true"]:hover { color:#233549; background:var(--fx-tint); }
.qb-fx-chart-heading { display:flex; justify-content:space-between; align-items:start; gap:12px; }
.qb-fx-chart-heading h2 { color:#e7edf2; font-size:14px; font-weight:500; margin:0 0 7px; }
.qb-fx-chart-heading p { color:#a3b4c5; font-size:10px; margin:0; line-height:1.7; }
.qb-fx-chart-heading p span { white-space:nowrap; }
.qb-fx-chart-unit { font-size:10px; color:#a3b4c5; padding-top:4px; }
.qb-fx-plot { position:relative; margin:16px -10px 18px; cursor:crosshair; touch-action:pan-y; }
.qb-fx-graph-body { position:relative; height:240px; }
.qb-fx-plot svg { width:calc(100% - 58px); height:100%; display:block; overflow:visible; }
.qb-fx-y-axis { position:absolute; top:8.7%; bottom:8.7%; right:0; display:flex; flex-direction:column; justify-content:space-between; color:#a3b4c5; font-size:10px; font-variant-numeric:tabular-nums; pointer-events:none; }
.qb-fx-y-axis span { line-height:0; }
.qb-fx-x-axis { display:flex; justify-content:space-between; gap:8px; padding:8px 70px 0 12px; color:#a3b4c5; font-size:10px; font-variant-numeric:tabular-nums; }
.qb-fx-gridline { stroke:#8299ad; stroke-opacity:.18; stroke-dasharray:3 5; }
.qb-fx-axis { font:14px "Segoe UI",Arial,sans-serif; fill:#a3b4c5; font-variant-numeric:tabular-nums; }
.qb-fx-line { stroke:#b6d9ca; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; fill:none; vector-effect:non-scaling-stroke; }
.qb-fx-point { fill:#c8e5d9; }
.qb-fx-crosshair { stroke:#cbb780; stroke-width:1; stroke-dasharray:3 4; }
.qb-fx-active-point { fill:#f2e3bb; stroke:#112d70; stroke-width:2; }
.qb-fx-tooltip { position:absolute; z-index:2; top:4px; left:12px; max-width:calc(100% - 24px); background:#e8edf8; color:#172a50; box-shadow:0 6px 18px #0003; border-radius:5px; padding:9px 12px; font-size:11px; pointer-events:none; font-variant-numeric:tabular-nums; }
.qb-fx-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid #ffffff20; border-bottom:1px solid #ffffff20; padding:20px 0; }
.qb-fx-stats>div { padding:0 16px; border-left:1px solid #ffffff20; }
.qb-fx-stats>div:first-child { padding-left:0; border:0; }
.qb-fx-stats span { display:block; font-size:10px; line-height:1.5; color:#a3b4c5; margin-bottom:7px; }
.qb-fx-stats strong { font-size:18px; font-weight:500; letter-spacing:-.3px; font-variant-numeric:tabular-nums; }
.qb-fx-up { color:#b1dccb; } .qb-fx-down { color:#f0bab4; } .qb-fx-flat { color:#e3dfd4; }
.qb-fx-chart-note { color:#9bafc1; font-size:10px; line-height:1.7; margin:16px 0 0; }
.qb-fx-chart-empty { min-height:210px; display:flex; justify-content:center; align-items:center; flex-direction:column; gap:14px; color:#b8c6d4; font-size:12px; text-align:center; }
.qb-fx-history-table { margin-top:14px; font-size:11px; color:#bdccd9; }
.qb-fx-history-table summary { cursor:pointer; width:max-content; max-width:100%; padding:5px 0; }
.qb-fx-history-table>div { max-height:240px; overflow:auto; margin-top:10px; }
.qb-fx-history-table table { width:100%; font-variant-numeric:tabular-nums; }
.qb-fx-history-table th,.qb-fx-history-table td { padding:8px 4px; border-bottom:1px solid #ffffff15; }
.qb-fx-history-table th:last-child,.qb-fx-history-table td:last-child { text-align:right; }
.qb-fx-side { display:grid; gap:18px; min-width:0; }
.qb-fx-converter,.qb-fx-quick { background:var(--fx-surface); border:1px solid var(--fx-line); padding:24px; border-radius:5px; }
.qb-fx-section-icon { width:32px; height:32px; background:var(--fx-tint); color:var(--fx-accent); border-radius:7px; display:grid; place-items:center; margin-bottom:12px; }
.qb-fx-section-icon svg { width:17px; height:17px; }
.qb-fx-converter h2,.qb-fx-quick h2 { font-size:16px; color:var(--fx-ink); font-weight:600; margin:0 0 22px; }
.qb-fx-converter label { color:var(--fx-muted); font-size:11px; font-weight:500; display:block; margin-bottom:8px; }
.qb-fx-amount-wrap { display:flex; align-items:center; gap:10px; border:1px solid #cbd3df; border-radius:7px; padding:0 12px; height:54px; }
.qb-fx-amount-wrap:focus-within { border-color:var(--fx-accent); box-shadow:0 0 0 2px #123b9126; }
.qb-fx-amount-wrap input { width:100%; min-width:0; color:var(--fx-ink); font-size:22px; border:0; background:transparent; padding:0; font-variant-numeric:tabular-nums; }
.qb-fx-amount-wrap input:focus { outline:0; }
.qb-fx-amount-wrap>span { font-size:11px; font-weight:600; color:var(--fx-muted); }
.qb-fx-currency-direction { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:18px 0; }
.qb-fx-currency-direction>div:last-child { text-align:right; }
.qb-fx-currency-direction span { display:block; font-size:10px; color:var(--fx-muted); margin-bottom:5px; }
.qb-fx-currency-direction strong { font-size:13px; font-weight:600; }
.qb-fx-currency-direction button { display:grid; place-items:center; background:var(--fx-surface); color:#53667b; border:1px solid var(--fx-line); border-radius:50%; width:38px; height:38px; cursor:pointer; }
.qb-fx-currency-direction button:hover { background:var(--fx-tint); color:var(--fx-accent); }
.qb-fx-currency-direction svg { width:16px; height:16px; }
.qb-fx-result { background:var(--fx-paper); border-radius:7px; padding:17px 15px; overflow-wrap:anywhere; }
.qb-fx-result>span { display:block; font-size:10px; color:#68778b; margin-bottom:7px; }
.qb-fx-result output { font-size:29px; line-height:1.25; color:#203955; font-weight:500; letter-spacing:-1px; font-variant-numeric:tabular-nums; }
.qb-fx-result>strong { display:block; font-size:11px; font-weight:500; color:#68778b; margin-top:3px; }
.qb-fx-result.is-invalid output { font-size:13px; letter-spacing:0; color:#a24535; }
.qb-fx-converter-equation { font-size:10px; line-height:1.6; text-align:center; color:#65778a; margin:13px 0 0; }
.qb-fx-disclaimer { font-size:10px; line-height:1.8; color:#768191; border-top:1px solid #e4e8ee; padding-top:16px; margin:17px 0 0; }
.qb-fx-quick { padding:20px 24px; }
.qb-fx-quick h2 { font-size:13px; margin-bottom:16px; }
.qb-fx-quick table { width:100%; font-size:12px; font-variant-numeric:tabular-nums; }
.qb-fx-quick th { color:#7a8696; font-size:10px; font-weight:500; padding-bottom:8px; }
.qb-fx-quick td { padding:9px 0; border-top:1px solid #edf0f4; }
.qb-fx-quick td:last-child,.qb-fx-quick th:last-child { text-align:right; }
.qb-fx-footnote { display:flex; justify-content:space-between; gap:16px; font-size:10px; color:#7a8696; padding-top:20px; }
.qb-fx-unavailable { padding:65px 24px; text-align:center; background:var(--fx-surface); border:1px solid var(--fx-line); border-radius:5px; }
.qb-fx-unavailable h2 { margin:18px 0 12px; font-size:21px; }
.qb-fx-js-only { display:none; }
.qb-fx-ready .qb-fx-periods { display:flex; }
.qb-fx-ready .qb-fx-converter-controls { display:block; }
/* Unique widget classes keep homepage/editorial skin overrides out of this component. */
body .qb-fx-widget { background:var(--fx-surface); border:1px solid var(--fx-line); border-radius:5px; overflow:hidden; margin-bottom:12px; color:var(--fx-ink); font-family:"Segoe UI",Arial,sans-serif; }
.qb-fx-widget-head { display:flex; align-items:center; justify-content:space-between; padding:17px 18px; gap:12px; }
.qb-fx-widget-head h2 { color:var(--fx-ink); font-size:13px; font-weight:600; margin:0; }
.qb-fx-widget-head svg { width:15px; height:15px; color:var(--fx-accent); }
.qb-fx-widget-main { position:relative; padding:20px 20px 0; background:radial-gradient(ellipse at top right,#243f79,transparent 85%),#112d70; color:#f6f8fa; }
.qb-fx-widget-pair { display:flex; align-items:center; justify-content:space-between; font-size:12px; letter-spacing:.04em; color:#e0e7ed; }
.qb-fx-widget-pair>span { font-size:9px; color:#bdccd7; letter-spacing:0; }
.qb-fx-widget-value { font-size:36px; font-weight:400; line-height:1.2; letter-spacing:-1.1px; margin:12px 0 6px; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.qb-fx-widget-value>small { font-size:11px; color:#c2d0dc; letter-spacing:0; margin-left:7px; }
.qb-fx-widget-date { display:block; font-size:9px; color:#b4c3d0; line-height:1.6; padding-bottom:8px; }
.qb-fx-widget-spark { height:68px; width:100%; display:block; margin-top:4px; }
.qb-fx-widget-range { display:flex; justify-content:space-between; align-items:center; gap:12px; font-size:10px; color:#b7c9d8; padding:10px 0 15px; }
.qb-fx-widget-range strong { font-weight:500; }
.qb-fx-widget-rows { padding:4px 18px; }
body .qb-fx-widget-row { display:flex; justify-content:space-between; align-items:center; gap:10px; color:var(--fx-ink); padding:14px 0; border-bottom:1px solid #edf0f4; font-size:12px; text-decoration:none; }
.qb-fx-widget-row:last-child { border:0; }
.qb-fx-widget-row span small { display:block; font-size:9px; color:#7a8696; margin-top:3px; }
.qb-fx-widget-row strong { font-weight:600; font-variant-numeric:tabular-nums; }
.qb-fx-widget-quick { display:flex; align-items:center; justify-content:space-between; gap:12px; background:var(--fx-paper); padding:13px 18px; font-size:10px; color:#758298; }
.qb-fx-widget-quick strong { font-size:12px; color:#253e58; font-weight:500; font-variant-numeric:tabular-nums; }
body .qb-fx-widget-link { display:flex; align-items:center; justify-content:space-between; color:#4c6080; padding:15px 18px; font-size:11px; font-weight:600; text-decoration:none; }
.qb-fx-widget-link svg { width:14px; height:14px; color:var(--fx-accent); }
body .qb-fx-widget-link:hover,body .qb-fx-widget-row:hover { color:var(--fx-accent); }
.qb-fx-widget-empty { color:#748197; padding:10px 18px 20px; font-size:12px; }
@media(min-width:1200px) { .qb-fx-workspace { grid-template-columns:minmax(0,1fr) 330px; } .qb-fx-terminal { padding:34px 32px 22px; } }
@media(max-width:991px) { .qb-fx-workspace { grid-template-columns:minmax(0,1fr); } .qb-fx-side { grid-template-columns:1fr 1fr; align-items:start; } .qb-fx-shell { padding:30px 0; } }
@media(max-width:575px) { .qb-fx-page-head { align-items:start; flex-direction:column; gap:18px; margin-bottom:22px; } .qb-fx-market { padding:10px 13px; } .qb-fx-market>div { display:flex; gap:8px; align-items:center; } .qb-fx-market span { margin:0; } .qb-fx-intro { font-size:13px; } .qb-fx-pairs { gap:8px; } .qb-fx-pair { padding:13px; flex-basis:100%; } .qb-fx-pair>strong { font-size:17px; } .qb-fx-terminal { padding:22px 17px 18px; border-radius:9px; } .qb-fx-quote-head { flex-direction:column; gap:16px; margin-bottom:20px; } .qb-fx-source { text-align:left; } .qb-fx-source>small { display:inline; margin-left:6px; } .qb-fx-quote-value { font-size:43px; } .qb-fx-periods { margin-bottom:18px; } .qb-fx-chart-heading p span { display:block; } .qb-fx-plot { margin:16px -8px 18px; } .qb-fx-plot svg { min-height:170px; } .qb-fx-axis { font-size:20px; } .qb-fx-stats>div { padding:0 10px; } .qb-fx-stats strong { font-size:16px; } .qb-fx-stats span { font-size:9px; min-height:27px; } .qb-fx-side { grid-template-columns:1fr; } .qb-fx-converter,.qb-fx-quick { padding:22px; } .qb-fx-footnote { font-size:9px; } }
@media(prefers-reduced-motion:reduce) { .qb-fx-shell * { transition:none !important; } }
@media(max-width:575px) { .qb-fx-graph-body { height:180px; } .qb-fx-plot svg { min-height:0; width:calc(100% - 50px); } .qb-fx-y-axis,.qb-fx-x-axis { font-size:9px; } .qb-fx-x-axis { padding-right:55px; padding-left:5px; } }