/* Embeddable chart (embed.html): fills the iframe. */
:root { --bg: #ffffff; --panel-2: #f5f7fb; --border: #e3e7ef; --text: #0f172a; --muted: #5b6478; --accent: #4561f5; --up: #089981; --down: #f23645; color-scheme: light; }
:root[data-theme="dark"] { --bg: #131722; --panel-2: #181d2a; --border: #232838; --text: #e6e9f0; --muted: #8a93a6; --accent: #6d85ff; color-scheme: dark; }
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { height: 100%; margin: 0; }
body { background: var(--bg); color: var(--text); font: 13px/1.4 ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; -webkit-font-smoothing: antialiased; overflow: hidden; }
.e-wrap { display: flex; flex-direction: column; height: 100%; }
.e-head { display: flex; align-items: center; gap: 10px; min-height: 38px; padding: 4px 10px; border-bottom: 1px solid var(--border); white-space: nowrap; overflow: hidden; }
.e-head b { font-size: 14px; }
.e-provider, .e-status { color: var(--muted); font-size: 12px; }
.e-status { color: var(--up); }
.e-price { font-variant-numeric: tabular-nums; font-weight: 600; }
.e-price .up { color: var(--up); } .e-price .down { color: var(--down); }
.e-price span { font-weight: 500; font-size: 12px; margin-left: 2px; }
.e-tfs { display: flex; gap: 2px; }
.e-tfs button { height: 24px; padding: 0 7px; border: 0; border-radius: 5px; background: none; color: var(--muted); font: 500 12px inherit; font-family: inherit; cursor: pointer; }
.e-tfs button:hover { color: var(--text); background: var(--panel-2); }
.e-tfs button.active { color: var(--accent); background: var(--panel-2); }
.e-brand { margin-left: auto; display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-size: 12px; font-weight: 600; text-decoration: none; }
.e-brand:hover { color: var(--text); }
.e-chart { position: relative; flex: 1; min-height: 0; }
.e-error { position: absolute; inset: 0; display: grid; place-content: center; gap: 6px; padding: 20px; text-align: center; color: var(--muted); background: var(--bg); }
.e-error a { color: var(--accent); }
@media (max-width: 460px) { .e-provider, .e-brand span { display: none; } }