:root {
  --ui-font: "Segoe UI", Tahoma, sans-serif;
  --ui-primary: #008cba;
  --ui-text: #222;
  --ui-muted: #596670;
  --ui-border: #dee2e6;
  --ui-surface: #f8fafc;
  --ui-sidebar-open: 300px;
  --ui-sidebar-icons: 88px;
  --ui-topbar-height: 76px;
  --ui-toast-width: 560px;
  --ui-sidebar-width: 0px;
  --bs-border-radius: 0;
  --bs-border-radius-sm: 0;
  --bs-border-radius-lg: 0;
  --bs-border-radius-xl: 0;
  --bs-border-radius-xxl: 0;
  --bs-border-radius-pill: 0;
}

body { margin: 0; color: var(--ui-text); background: var(--ui-surface); font: 1.1rem/1.6 var(--ui-font); }
[hidden] { display: none !important; }
button, input, select, textarea { font: inherit; }
.btn, .card, .form-control, .alert { border-radius: 0; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .65rem; min-height: 42px; }
.btn:focus-visible, a:focus-visible, button:focus-visible, input:focus-visible { outline: 3px solid #0a58ca; outline-offset: 3px; }
.btn:disabled { cursor: wait; }
.bi { flex-shrink: 0; }
.skip-link { position: fixed; top: 8px; left: 8px; z-index: 1200; padding: .6rem 1rem; color: #fff; background: #222; transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }
.eyebrow { margin: 0 0 .65rem; color: var(--ui-muted); font-size: .75rem; font-weight: 700; letter-spacing: .12em; }
.brand-mark { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex: 0 0 44px; color: #fff; background: var(--ui-primary); font-size: 1.45rem; }
.app-shell { min-height: 100dvh; }
.app-shell[data-sidebar-mode="open"] { --ui-sidebar-width: var(--ui-sidebar-open); }
.app-shell[data-sidebar-mode="icons"] { --ui-sidebar-width: var(--ui-sidebar-icons); }
.app-sidebar { position: fixed; inset: 0 auto 0 0; z-index: 1030; display: flex; flex-direction: column; width: var(--ui-sidebar-width); height: 100dvh; overflow: hidden; border-right: 1px solid var(--ui-border); background: var(--ui-surface); }
.sidebar-brand { display: flex; align-items: center; gap: 12px; min-height: 108px; padding: 24px; color: var(--ui-text); text-decoration: none; white-space: nowrap; }
.sidebar-brand .sidebar-copy { display: flex; flex-direction: column; }
.sidebar-brand strong { font-size: 1.2rem; line-height: 1.35; }
.sidebar-brand .sidebar-copy > span { color: var(--ui-muted); font-size: .8rem; }
.sidebar-navigation { display: flex; flex-direction: column; gap: 8px; flex: 1; min-height: 0; overflow-y: auto; padding: 16px 14px; }
.sidebar-link { display: flex; align-items: center; gap: 16px; min-height: 52px; padding: 10px 16px; color: #1f2937; border: 1px solid transparent; font-weight: 600; text-decoration: none; white-space: nowrap; }
.sidebar-link > .bi { width: 24px; font-size: 1.3rem; text-align: center; }
.sidebar-link:hover { color: #111827; background: rgba(15, 23, 42, .05); border-color: rgba(15, 23, 42, .12); }
.sidebar-link.is-active { color: #0a58ca; border-color: rgba(13, 110, 253, .7); background: rgba(13, 110, 253, .12); }
.sidebar-group { min-width: 0; }
.sidebar-group > summary { list-style: none; cursor: pointer; }
.sidebar-group > summary::-webkit-details-marker { display: none; }
.sidebar-group .sidebar-group-chevron { width: auto; margin-left: auto; font-size: .75rem; }
.sidebar-group[open] .sidebar-group-chevron { transform: rotate(180deg); }
.sidebar-submenu { display: flex; flex-direction: column; gap: 4px; margin: 6px 0 0 28px; padding-left: 12px; border-left: 1px solid var(--ui-border); }
.sidebar-group:not([open]) > .sidebar-submenu { display: none; }
.sidebar-sublink { display: block; min-height: 42px; padding: 8px 12px; border: 1px solid transparent; color: #1f2937; font-size: .95rem; text-decoration: none; }
.sidebar-sublink:hover { color: #111827; border-color: rgba(15, 23, 42, .12); background: rgba(15, 23, 42, .05); }
.sidebar-sublink.is-active { color: #0a58ca; border-color: rgba(13, 110, 253, .7); background: rgba(13, 110, 253, .12); }
.sidebar-flyout-layer { position: fixed; inset: 0; z-index: 1045; pointer-events: none; }
.sidebar-submenu.is-floating { position: fixed; width: 260px; max-width: calc(100vw - 24px); max-height: calc(100dvh - 24px); margin: 0; padding: 8px; overflow-y: auto; border: 1px solid var(--ui-border); background: #fff; box-shadow: 0 8px 24px rgba(15, 23, 42, .12); pointer-events: auto; }
.sidebar-account { flex: none; margin: 0 14px; padding: 14px 0; border-top: 1px solid var(--ui-border); }
.sidebar-account .account-menu-toggle { display: flex; justify-content: flex-start; gap: 12px; width: 100%; min-height: 52px; }
.sidebar-account [data-display-name] { flex: 1; text-align: left; }
[data-sidebar-mode="icons"] .sidebar-account { margin-inline: 10px; }
[data-sidebar-mode="icons"] .sidebar-account [data-display-name], [data-sidebar-mode="icons"] .sidebar-account .account-menu-chevron { display: none; }
[data-sidebar-mode="icons"] .sidebar-account .account-menu-toggle { justify-content: center; min-height: 56px; padding-inline: 10px; }
[data-sidebar-mode="icons"] .sidebar-account .account-menu-toggle > .bi-person { font-size: 1.65rem; }
[data-sidebar-mode="icons"] .sidebar-copy { display: none; }
[data-sidebar-mode="icons"] .sidebar-brand { padding-inline: 21px; }
[data-sidebar-mode="icons"] .sidebar-navigation { padding-inline: 10px; }
[data-sidebar-mode="icons"] .sidebar-link { justify-content: center; min-height: 56px; padding-inline: 10px; }
[data-sidebar-mode="icons"] .sidebar-link > .bi { font-size: 1.65rem; }
[data-sidebar-mode="icons"] .sidebar-link > .sidebar-group-chevron { display: none; }
html:not(.js) [data-sidebar-mode="icons"] .app-sidebar, html:not(.js) [data-sidebar-mode="icons"] .sidebar-navigation { overflow: visible; }
html:not(.js) [data-sidebar-mode="icons"] .sidebar-group { position: relative; }
html:not(.js) [data-sidebar-mode="icons"] .sidebar-submenu { position: absolute; top: 0; left: calc(100% + 12px); z-index: 1045; width: 260px; max-width: calc(100vw - 112px); margin: 0; padding: 8px; border: 1px solid var(--ui-border); background: #fff; box-shadow: 0 8px 24px rgba(15, 23, 42, .12); }
.app-workspace { min-width: 0; min-height: 100dvh; margin-left: var(--ui-sidebar-width); }
.app-topbar { position: sticky; top: 0; z-index: 1020; display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: var(--ui-topbar-height); padding: 12px 32px; border-bottom: 1px solid var(--ui-border); background: #fff; }
.topbar-leading { display: flex; align-items: center; gap: 20px; min-width: 0; }
.topbar-title { font-size: .92rem; color: var(--ui-muted); white-space: nowrap; }
/* Account metrics are confined to the authenticated topbar's existing76px height. */
.account-metrics-topbar { height: var(--ui-topbar-height); flex: none; gap: 16px; padding-block: 8px; }
.account-metrics-topbar .topbar-leading { flex: 0 1 auto; max-width: 340px; }
.account-metrics-topbar #sidebar-toggle { flex: none; }
.account-metrics-topbar .sidebar-save-status { min-width: 0; line-height: 1.3; }
.account-metrics { flex: 1; min-width: 0; }
.account-metrics-list { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); margin: 0; }
.account-metric { min-width: 0; padding: 0 18px; border-left: 1px solid var(--ui-border); }
.account-metric dt { display: flex; align-items: center; gap: 8px; color: var(--ui-muted); font-size: .78rem; font-weight: 400; line-height: 18px; white-space: nowrap; }
.account-metric dd { display: flex; align-items: baseline; min-width: 0; margin: 2px 0 0; font-size: 1.08rem; font-weight: 600; line-height: 26px; font-variant-numeric: tabular-nums; }
.account-metric [data-account-metric] { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.account-metric-unit { flex: none; margin-left: 5px; color: var(--ui-muted); font-size: .7rem; font-weight: 400; }
.account-metric [data-trend="positive"] { color: #23613b; }
.account-metric [data-trend="negative"] { color: #b02a16; }
.account-metrics-status { position: relative; display: inline-block; flex: 0 0 8px; width: 8px; height: 8px; background: var(--ui-muted); cursor: help; }
.account-metrics-status:focus-visible { outline: 2px solid #0a58ca; outline-offset: 3px; }
.account-metrics[data-state="ready"] .account-metrics-status { background: #23613b; }
.account-metrics:is([data-state="stale"], [data-state="reconnecting"]) .account-metrics-status { background: #a56a00; }
.account-metrics[data-state="error"] .account-metrics-status { background: #b02a16; }
.account-metrics-status::after { content: attr(data-description); position: absolute; top: 20px; left: 0; z-index: 1; display: none; width: max-content; max-width: min(340px, calc(100vw - 24px)); padding: 8px 12px; border: 1px solid var(--ui-border); background: #fff; color: var(--ui-text); box-shadow: 0 3px 10px rgba(15, 23, 42, .12); font-size: .8rem; line-height: 1.4; white-space: normal; pointer-events: none; }
.account-metrics-status:hover::after, .account-metrics-status:focus-visible::after { display: block; }
@media (max-width: 1199px) {
  .account-metrics { overflow-x: auto; }
  .account-metrics-list { min-width: 760px; }
}
.icon-button { width: 42px; padding: 0; color: #334155; font-size: 1.25rem; }
.account-name { display: inline-flex; align-items: center; gap: 8px; min-width: 0; font-size: .95rem; }
.account-name [data-display-name] { max-width: 28ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.account-menu { position: relative; }
.account-menu-toggle { list-style: none; padding: 8px 12px; border: 1px solid transparent; color: var(--ui-text); cursor: pointer; }
.account-menu-toggle::-webkit-details-marker { display: none; }
.account-menu-toggle:hover, .account-menu[open] .account-menu-toggle { border-color: var(--ui-border); background: var(--ui-surface); }
.account-menu-chevron { margin-left: 8px; font-size: .7rem; }
.account-menu-popup { position: absolute; bottom: calc(100% + 8px); left: 0; z-index: 1040; width: 260px; max-width: calc(100vw - 24px); padding: 8px; border: 1px solid var(--ui-border); background: #fff; box-shadow: 0 8px 24px rgba(15, 23, 42, .12); }
.account-menu-popup.is-floating { position: fixed; inset: auto; max-height: calc(100dvh - 24px); overflow-y: auto; pointer-events: auto; }
html:not(.js) [data-sidebar-mode="icons"] .account-menu-popup { left: calc(100% + 8px); bottom: 0; }
.account-menu-item { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 44px; padding: 10px 12px; border: 0; color: var(--ui-text); background: transparent; font-size: .95rem; text-align: left; text-decoration: none; }
.account-menu-item:hover { color: var(--ui-text); background: var(--ui-surface); }
.account-menu-item[aria-current="page"] { color: #0a58ca; background: rgba(13, 110, 253, .12); font-weight: 600; }
.account-menu-item:focus-visible { outline-offset: -3px; background: var(--ui-surface); }
.sidebar-save-status { display: flex; align-items: center; gap: 4px; color: var(--ui-muted); font-size: .8rem; }
.sidebar-save-status.is-error { color: #a32913; }
.sidebar-save-status .btn { min-height: 0; padding: 2px 8px; font-size: inherit; }
.no-js-navigation { display: flex; flex-wrap: wrap; gap: 20px; padding: 14px 32px; background: #fff; border-bottom: 1px solid var(--ui-border); }
.no-js-navigation form { margin: 0; }
.no-js-navigation form .btn { min-height: 0; padding: 0; font: inherit; }
.js .no-js-navigation, .js .server-messages { display: none; }
.page-content { max-width: 1660px; margin-inline: auto; padding: 36px 32px 48px; }
.page-content:focus, .login-layout:focus { outline: none; }
.page-heading { margin-bottom: 30px; }
.page-heading h1 { margin: 0 0 8px; font-size: 2.15rem; font-weight: 650; letter-spacing: -.025em; }
.page-heading > p:last-child { margin: 0; color: var(--ui-muted); }
.page-heading .eyebrow { margin-bottom: 6px; }
.welcome-panel { display: flex; align-items: center; justify-content: space-between; gap: 40px; padding: 40px; border: 1px solid var(--ui-border); border-left: 4px solid var(--ui-primary); background: #fff; }
.section-label { display: inline-flex; align-items: center; gap: 8px; color: #286740; font-size: .85rem; font-weight: 600; }
.welcome-panel h2 { margin: 14px 0 16px; font-size: 1.85rem; font-weight: 650; letter-spacing: -.02em; }
.welcome-panel p { margin-bottom: 24px; color: var(--ui-muted); }
.welcome-symbol { display: flex; align-items: center; gap: 28px; margin-right: 32px; padding-left: 40px; border-left: 1px solid var(--ui-border); color: var(--ui-muted); font-size: .95rem; }
.welcome-symbol > .bi { color: var(--ui-primary); font-size: 4rem; }
.overview-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-top: 24px; }
.status-card { border-color: var(--ui-border); box-shadow: 0 2px 5px rgba(15, 23, 42, .025); }
.status-card .card-body { position: relative; padding: 28px 32px; }
.state-icon { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; color: var(--ui-muted); background: var(--ui-surface); border: 1px solid var(--ui-border); font-size: 1.5rem; }
.status-label { float: right; padding: 3px 10px; border: 1px solid var(--ui-border); color: var(--ui-muted); background: var(--ui-surface); font-size: .75rem; }
.status-card h2 { margin: 18px 0 10px; font-size: 1.25rem; font-weight: 650; }
.status-card p { max-width: 60ch; margin: 0; color: var(--ui-muted); font-size: .98rem; }
.workspace-note { display: flex; align-items: center; gap: 12px; margin-top: 24px; padding: 18px 2px; color: var(--ui-muted); font-size: .85rem; }
.workspace-note p { margin: 0; }
.workspace-note a { flex-shrink: 0; margin-left: auto; }
.settings-profile { width: min(100%, 900px); }
.settings-card { min-width: 0; border-color: var(--ui-border); box-shadow: 0 2px 5px rgba(15, 23, 42, .025); }
.settings-card .card-header { display: flex; align-items: flex-start; gap: 14px; padding: 24px 28px; background: #fff; border-color: var(--ui-border); }
.settings-card .card-header > .bi { color: var(--ui-primary); font-size: 1.4rem; }
.settings-card h2 { margin: 0 0 4px; font-size: 1.25rem; font-weight: 650; }
.settings-card .card-header p { margin: 0; color: var(--ui-muted); font-size: .9rem; }
.settings-card .card-body { padding: 26px 28px 30px; }
.settings-card .card-footer { display: flex; justify-content: flex-end; padding: 18px 28px; border-color: var(--ui-border); background: var(--ui-surface); }
.exchange-settings-grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(360px, 1fr); gap: 28px; align-items: start; }
.exchange-fields { min-width: 0; margin: 0; border: 0; }
.exchange-mode-group { min-width: 0; margin: 0; padding: 0; border: 0; }
.exchange-mode-group > legend { float: none; width: auto; }
.exchange-modes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.exchange-mode { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; border: 1px solid var(--ui-border); cursor: pointer; }
.exchange-mode .form-check-input { margin-top: 6px; flex: 0 0 auto; }
.exchange-mode strong, .exchange-mode small { display: block; }
.exchange-mode strong { font-size: .95rem; font-weight: 600; }
.exchange-mode small { color: var(--ui-muted); font-size: .8rem; }
.exchange-region-market, .exchange-credentials { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.exchange-fixed-market { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 8px 12px; border: 1px solid var(--ui-border); background: var(--ui-surface); font-size: .95rem; }
.exchange-actions { align-items: center; gap: 16px; }
.exchange-progress { color: var(--ui-muted); font-size: .85rem; }
.exchange-connection-status { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; font-weight: 600; }
.exchange-connection[data-status="connected"] .exchange-connection-status { color: #286740; }
.exchange-connection[data-status="error"] .exchange-connection-status { color: #b02a12; }
.exchange-connection-details { margin: 0; }
.exchange-connection-details > div { padding: 12px 0; border-bottom: 1px solid var(--ui-border); }
.exchange-connection-details > div:first-child { padding-top: 0; }
.exchange-connection-details > div:last-child { padding-bottom: 0; border-bottom: 0; }
.exchange-connection-details dt { color: var(--ui-muted); font-size: .8rem; font-weight: 400; }
.exchange-connection-details dd { margin: 2px 0 0; overflow-wrap: anywhere; font-size: .95rem; }
.exchange-check-body { display: flex; flex-direction: column; gap: 16px; padding: 0 28px 24px; }
.form-fields, .login-form { display: flex; flex-direction: column; gap: 22px; }
.name-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.field-group { min-width: 0; }
.form-label { display: block; margin-bottom: 0; font-size: .95rem; font-weight: 600; }
.form-control { min-height: 44px; line-height: 1.5; }
.form-control[readonly] { background: var(--ui-surface); color: var(--ui-muted); }
.optional-label { color: var(--ui-muted); font-size: .8rem; font-weight: 400; }
.form-text { margin-top: 6px; color: var(--ui-muted); font-size: .8rem; line-height: 1.5; }
.field-errors { display: block; margin: 6px 0 0; padding-left: 20px; color: #b02a12; font-size: .85rem; line-height: 1.5; }
.form-errors { margin: 0; font-size: .9rem; }
.form-errors:focus { outline: 2px solid #b02a12; outline-offset: 3px; }
.password-dialog { display: none; --bs-modal-color: var(--ui-text); --bs-modal-bg: #fff; --bs-modal-border-color: var(--ui-border); --bs-modal-border-width: 1px; --bs-modal-border-radius: 0; --bs-modal-inner-border-radius: 0; --bs-modal-header-padding-x: 28px; --bs-modal-header-padding-y: 24px; --bs-modal-header-border-color: var(--ui-border); --bs-modal-header-border-width: 1px; --bs-modal-title-line-height: 1.5; --bs-modal-footer-border-color: var(--ui-border); --bs-modal-footer-border-width: 1px; }
.js .password-dialog.is-open { position: fixed; inset: 0; z-index: 1080; display: flex; align-items: center; justify-content: center; padding: 24px; background: rgba(15, 23, 42, .45); }
.password-dialog .modal-dialog { width: min(800px, 100%); max-width: 800px; max-height: calc(100dvh - 48px); margin: 0; outline: none; }
.password-dialog .modal-content { max-height: calc(100dvh - 48px); color: var(--ui-text); background: var(--bs-modal-bg); border: 1px solid var(--ui-border); border-radius: 0; box-shadow: 0 16px 48px rgba(15, 23, 42, .2); }
.password-dialog form { display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
.password-dialog .modal-header { align-items: flex-start; justify-content: space-between; gap: 24px; padding: 24px 28px; }
.password-dialog .modal-header p { margin: 6px 0 0; color: var(--ui-muted); font-size: .9rem; }
.password-dialog .btn-close { flex: 0 0 auto; margin: 0; }
.password-dialog .modal-body { min-height: 0; overflow-y: auto; padding: 26px 28px; }
.password-dialog .modal-footer { flex: 0 0 auto; gap: 8px; justify-content: flex-end; padding: 18px 28px; background: var(--ui-surface); }
.password-dialog .modal-footer > * { margin: 0; }
.js .no-js-dialog-close { display: none; }
html:not(.js) .password-dialog:target, html:not(.js) .password-dialog[data-initial-open="true"] { display: block; width: min(800px, calc(100% - 48px)); margin: 32px auto; }
html:not(.js) .password-dialog [data-password-dialog-close] { display: none; }
html:not(.js) .password-dialog .modal-content, html:not(.js) .password-dialog .modal-dialog { max-height: none; }
.statistics-empty { min-height: 490px; border-color: var(--ui-border); }
.statistics-empty .card-body { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 56px 32px; text-align: center; }
.empty-state-icon { display: flex; align-items: center; justify-content: center; width: 92px; height: 92px; margin-bottom: 26px; color: var(--ui-primary); background: var(--ui-surface); border: 1px solid var(--ui-border); font-size: 3rem; }
.statistics-empty h2 { margin-bottom: 14px; font-size: 1.65rem; font-weight: 650; }
.statistics-empty .card-body > p:not(.eyebrow) { margin-bottom: 28px; color: var(--ui-muted); }
.login-layout { display: grid; grid-template-columns: 46% 54%; min-height: 100dvh; background: #fff; }
.login-introduction { display: flex; flex-direction: column; justify-content: space-between; min-width: 0; padding: 56px 72px; border-right: 1px solid var(--ui-border); background: var(--ui-surface); }
.login-brand { display: flex; align-items: center; gap: 14px; font-size: 1.35rem; font-weight: 700; }
.login-introduction-copy { margin-block: 72px; }
.login-introduction h1 { margin: 20px 0 26px; font-size: clamp(2.5rem, 3.15vw, 3.8rem); font-weight: 650; line-height: 1.17; letter-spacing: -.04em; }
.login-introduction-copy > p:last-child { color: var(--ui-muted); font-size: 1.18rem; }
.login-introduction-footer { display: flex; align-items: center; gap: 14px; color: var(--ui-muted); font-size: .8rem; }
.intro-line { width: 36px; height: 2px; background: var(--ui-primary); }
.login-form-side { display: flex; align-items: center; justify-content: center; padding: 64px 48px; }
.login-form-container { width: 100%; max-width: 440px; }
.login-form-container h2 { margin: 0 0 12px; font-size: 2rem; font-weight: 650; letter-spacing: -.025em; }
.login-description { margin-bottom: 32px; font-size: 1rem; }
.login-submit { justify-content: space-between; margin-top: 6px; padding: 12px 18px; }
.login-account-note { margin: 30px 0 0; padding-top: 24px; border-top: 1px solid var(--ui-border); color: var(--ui-muted); font-size: .85rem; }
.page-toasts { position: fixed; top: calc(var(--ui-topbar-height) + 12px); left: calc(var(--ui-sidebar-width) + (100% - var(--ui-sidebar-width)) / 2); z-index: 1090; display: flex; flex-direction: column; gap: 8px; width: min(var(--ui-toast-width), calc(100% - var(--ui-sidebar-width) - 24px)); max-height: calc(100dvh - var(--ui-topbar-height) - 24px); overflow-y: auto; transform: translateX(-50%); pointer-events: none; }
.login-body .page-toasts { top: 20px; }
.app-toast { --toast-accent: #008cba; display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; border: 1px solid var(--ui-border); border-left: 4px solid var(--toast-accent); color: var(--ui-text); background: #fff; box-shadow: 0 4px 16px rgba(15, 23, 42, .12); font-size: .92rem; line-height: 1.5; pointer-events: auto; animation: toast-fade 120ms ease; }
.app-toast[data-type="success"] { --toast-accent: #43ac6a; }
.app-toast[data-type="info"] { --toast-accent: #5bc0de; }
.app-toast[data-type="warning"] { --toast-accent: #e99002; }
.app-toast[data-type="error"] { --toast-accent: #f04124; }
.app-toast > .bi { color: var(--toast-accent); font-size: 1.15rem; }
.app-toast-message { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.app-toast .btn-close { flex: 0 0 auto; margin-top: 3px; padding: 5px; }
@keyframes toast-fade { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; } }

/* Algorithm controls and signal journal: scoped to the Algorithms page. */
.js .algorithms-page { height: 100dvh; overflow: hidden; }
.js .algorithms-page .app-workspace { height: 100dvh; display: flex; flex-direction: column; }
.js .algorithms-page .page-content { flex: 1; min-height: 0; width: 100%; max-width: none; padding: 6px; display: flex; overflow: hidden; }
.algorithms-workspace { min-width: 0; width: 100%; }.js .algorithms-workspace { min-height: 0; flex: 1; display: flex; flex-direction: column; gap: 6px; }
.algorithms-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 10px 14px; flex: none; }.algorithms-heading h1 { margin: 0; font-size: 1.4rem; font-weight: 650; }.algorithms-heading p { margin: 3px 0 0; color: var(--ui-muted); font-size: .85rem; }
.algorithm-service-state { max-width: 45%; text-align: right; font-size: .82rem; color: var(--ui-muted); }.algorithm-service-state strong,.algorithm-service-state span { display: block; }.algorithm-service-state span:empty { display: none; }.algorithm-service-state[data-worker-state="unavailable"] strong { color: #7d5500; }
.algorithms-controls,.signals-journal { min-width: 0; border-color: var(--ui-border); }.algorithms-controls { flex: none; }.js .signals-journal { min-height: 0; flex: 1; display: flex; flex-direction: column; overflow: hidden; }
.algorithms-card-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 14px; border-bottom: 1px solid var(--ui-border); background: var(--ui-surface); flex: none; }.algorithms-card-header h2 { font-size: 1.08rem; font-weight: 650; margin: 0; }.algorithms-card-header p { font-size: .78rem; color: var(--ui-muted); margin: 2px 0 0; }.algorithms-card-header > span { font-size: .8rem; color: var(--ui-muted); }.algorithms-card-header .btn { min-height: 36px; font-size: .85rem; padding: 5px 12px; }
.algorithm-control-row { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(240px,1fr) 144px; gap: 4px 24px; align-items: center; padding: 9px 14px; border-bottom: 1px solid var(--ui-border); min-height: 62px; }.algorithm-control-row:last-child { border-bottom: 0; }.algorithm-copy h3 { font-size: .94rem; font-weight: 600; margin: 0 0 2px; }.algorithm-copy p { font-size: .78rem; line-height: 1.4; color: var(--ui-muted); margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.algorithm-state { min-width: 0; font-size: .78rem; line-height: 1.4; color: var(--ui-muted); }.algorithm-state strong,.algorithm-state span { display: block; }.algorithm-state strong { font-weight: 600; }.algorithm-state span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }.algorithm-state[data-state="ready"] strong { color: #23613b; }.algorithm-state[data-state="warming_up"] strong,.algorithm-state[data-state="unavailable"] strong { color: #7d5500; }
.algorithm-control-row form { margin: 0; }.algorithm-control-row form .btn { width: 100%; min-height: 36px; padding: 5px 10px; font-size: .85rem; }.algorithm-row-error { grid-column: 1 / -1; color: #b02a16; font-size: .8rem; line-height: 1.4; }.algorithm-row-error .btn { min-height: 0; padding: 2px 0; margin-left: 10px; font-size: .8rem; }.algorithm-row-error:focus { outline: 2px solid #b02a16; outline-offset: 2px; }.algorithms-controls-unavailable { margin: 0; padding: 16px; color: #7d5500; font-size: .9rem; }
.signals-read-error { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 0; padding: 8px 14px; font-size: .85rem; flex: none; }.signals-read-error .btn { min-height: 32px; font-size: .8rem; }
.signals-viewport { position: relative; overflow: auto; min-height: 220px; }.js .signals-viewport { flex: 1; min-height: 0; }.signals-table { table-layout: fixed; width: 100%; min-width: 1220px; margin: 0; font-size: .85rem; }.signals-col-date { width: 190px; }.signals-col-symbol { width: 140px; }.signals-col-algorithm { width: 270px; }.signals-col-direction { width: 128px; }.signals-col-price { width: 180px; }.signals-col-status { width: 130px; }
.signals-table > :not(caption) > * > * { padding: 10px 12px; vertical-align: middle; border-right: 1px solid var(--ui-border); }.signals-table > :not(caption) > * > :last-child { border-right: 0; }.signals-table thead { position: sticky; top: 0; z-index: 3; }.signals-table thead th { background: #f2f5f7; box-shadow: inset 0 -1px var(--ui-border); height: 44px; font-weight: 600; font-size: .82rem; }.signals-table tbody tr:hover > * { background: #f8fafc; }.signal-price { font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.signal-reason { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ui-muted); }.signal-reason:focus-visible { outline: 3px solid #0a58ca; outline-offset: -3px; }
.signals-table [data-direction="Buy"] { color: #23613b; }.signals-table [data-direction="Sell"] { color: #b02a16; }.signal-state { font-size: .8rem; }.signal-state[data-state="active"] { color: #23613b; }.signal-state[data-state="expired"],.signal-state[data-state="disabled"] { color: var(--ui-muted); }
.signals-loading { position: sticky; top: var(--signals-header-height,44px); height: 0; margin: 0; z-index: 4; background: #edf8fd; color: var(--ui-primary); text-align: center; font-size: .82rem; }.signals-loading:not([hidden]) { height: 26px; margin-bottom: -26px; }
.signals-empty { height: 190px; text-align: center; color: var(--ui-muted) !important; }.signals-empty i { display: block; font-size: 1.8rem; color: var(--ui-primary); margin-bottom: 8px; }.signals-empty strong,.signals-empty span { display: block; }.signals-empty strong { color: var(--ui-text); font-size: 1rem; margin-bottom: 4px; }.signals-empty .btn { margin-top: 12px; min-height: 34px; font-size: .85rem; }
.signals-footer { padding: 10px 14px; background: var(--ui-surface); border-top: 1px solid var(--ui-border); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 16px; flex: none; font-size: .85rem; }.signals-pagination,.signals-pagination [data-signal-page-window] { display: flex; align-items: center; gap: 4px; }.signals-pagination .btn { min-width: 34px; min-height: 34px; padding: 4px 8px; font-size: .85rem; }.signals-pagination [aria-current="page"] { background: var(--ui-primary); border-color: var(--ui-primary); color: white; }.signals-pagination [aria-disabled="true"] { opacity: .45; pointer-events: none; }.signals-page-size { display: flex; align-items: center; justify-content: flex-end; gap: 8px; white-space: nowrap; }.signals-page-size .form-select { width: 82px; min-height: 34px; font-size: .85rem; padding: 5px 30px 5px 10px; }.js .algorithms-no-js { display: none; }
.algorithm-row-error[data-kind="info"] { color: var(--ui-muted); }
.signals-table thead th { white-space: nowrap; overflow-wrap: normal; word-break: normal; }