/* RiskGuard: desktop-first risk-control dashboard. Status is always written as text. */
:root {
  --bg: #061321; --sidebar: #071727; --panel: #0a1a2c; --panel-2: #0d2138;
  --field: #102640; --field-hover: #132d4a; --text: #e8f1fc; --muted: #91a5c0;
  --faint: #57708e; --border: #1b3552; --border-strong: #274866; --accent: #21d9a0;
  --blue: #2e9bff; --purple: #8a6cff; --safe: #20d89c; --safe-bg: #063b37;
  --warn: #ffc44e; --warn-bg: #3a2a0c; --lock: #ff5b70; --lock-bg: #401827;
  --buy: #25d99d; --sell: #ff4c66; --radius: 8px; --mono: "Cascadia Mono", Consolas, monospace;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: var(--bg); color: var(--text); font: 14px/1.45 Inter, "Segoe UI", system-ui, sans-serif; }
button, input, select { font: inherit; }
button { -webkit-tap-highlight-color: transparent; }
[hidden] { display: none !important; }
h1, h2, p { margin-top: 0; }
h1 { margin-bottom: 0; font-size: 24px; letter-spacing: -.03em; }
h2 { margin: 0; color: #f2f7ff; font-size: 15px; letter-spacing: -.01em; }
.muted { color: var(--muted); }.small { font-size: 12px; }.pos { color: var(--safe); }.neg { color: var(--lock); }.error-text { color: var(--lock); min-height: 1.2em; }

/* --- app frame --- */
.app-shell { min-height: 100vh; display: grid; grid-template-columns: 198px minmax(0, 1fr); background: radial-gradient(circle at 75% -30%, #0b3150 0, transparent 34%), var(--bg); }
.sidebar { position: fixed; z-index: 4; inset: 0 auto 0 0; width: 198px; display: flex; flex-direction: column; background: linear-gradient(160deg, #071829 0%, #061423 100%); border-right: 1px solid var(--border); }
.workspace { grid-column: 2; min-width: 0; }
.brand { min-height: 77px; display: flex; align-items: center; gap: 10px; padding: 13px 18px; border-bottom: 1px solid var(--border); text-decoration: none; color: #f5f9ff; font-size: 18px; font-weight: 750; letter-spacing: -.04em; }
.brand small { display: block; margin-top: 1px; color: var(--muted); font-size: 9px; font-weight: 500; letter-spacing: 0; white-space: nowrap; }
.brand-mark { width: 32px; height: 39px; display: grid; place-items: center; color: var(--blue); flex: 0 0 auto; }.brand-mark svg { width: 31px; fill: currentColor; }.brand-mark path:last-child { fill: none; stroke: #eaf5ff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.side-nav { padding: 13px 9px; display: grid; gap: 4px; }.nav-item { height: 36px; display: flex; align-items: center; gap: 12px; padding: 0 11px; color: #b2c5df; border: 0; border-radius: 5px; background: transparent; cursor: pointer; text-align: left; font-size: 12px; transition: .18s ease; }.nav-item > span { width: 16px; color: #9eb8da; font-size: 18px; text-align: center; line-height: 1; }.nav-item:hover { color: #fff; background: #0d2741; }.nav-item.is-active { position: relative; background: linear-gradient(90deg, #12395e, #0d2b4a); color: #fff; font-weight: 650; }.nav-item.is-active::before { content: ""; position: absolute; left: -9px; height: 100%; width: 3px; background: var(--accent); box-shadow: 0 0 12px var(--accent); }.nav-item.is-active > span { color: #d6ebff; }
.status-banner { margin: auto 10px 12px; min-height: 91px; display: flex; align-items: flex-start; gap: 10px; padding: 12px; background: linear-gradient(135deg, #063c39, #082d32); border: 1px solid #087a68; border-radius: 7px; }.status-icon { display: grid; place-items: center; width: 29px; height: 29px; background: #08705f; color: #caffef; border-radius: 8px; font-size: 18px; }.status-label { color: #7ed7c5; font-size: 10px; text-transform: uppercase; letter-spacing: .06em; }.status-banner strong { display: block; margin-top: 2px; color: var(--safe); font-family: var(--mono); font-size: 14px; }.status-detail { max-width: 128px; margin-top: 4px; color: #adcccf; font-size: 9px; line-height: 1.4; }.status-WARNING { border-color: #9c7419; background: linear-gradient(135deg, #37280c, #25200f); }.status-WARNING strong { color: var(--warn); }.status-LOCKED { border-color: #a7354c; background: linear-gradient(135deg, #391522, #25121c); }.status-LOCKED strong { color: var(--lock); }.sidebar-version { padding: 13px 18px; color: var(--faint); border-top: 1px solid var(--border); font-size: 9px; }.sidebar-version span { padding: 0 5px; }

.workspace-header { min-height: 77px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 12px 22px; background: rgba(5, 18, 32, .74); border-bottom: 1px solid var(--border); }.eyebrow, .card-kicker { margin: 0 0 3px; color: #6c89a8; font-weight: 700; font-size: 9px; letter-spacing: .09em; }.header-tools { display: flex; align-items: center; justify-content: flex-end; gap: 15px; }.system-online { display: inline-flex; align-items: center; gap: 7px; color: #b7c9dc; font-size: 10px; white-space: nowrap; }.system-online i { width: 8px; height: 8px; border-radius: 99px; background: var(--safe); box-shadow: 0 0 9px var(--safe); }.account-picker { position: relative; display: grid; gap: 1px; font-size: 9px; color: var(--muted); }.account-picker select { min-width: 162px; max-width: 230px; padding: 5px 26px 5px 8px; border: 1px solid var(--border-strong); border-radius: 5px; outline: none; background: var(--field); color: var(--text); font-size: 11px; }.user-name { color: #b8c8da; font-size: 10px; }.icon-button { display: grid; place-items: center; width: 31px; height: 31px; border: 1px solid #315170; border-radius: 50%; background: #12345b; color: #e5f0ff; cursor: pointer; font-size: 18px; }

.dashboard-content { width: min(1500px, 100%); margin: 0 auto; padding: 16px 22px 25px; display: grid; gap: 14px; }.card { min-width: 0; padding: 14px; background: linear-gradient(140deg, rgba(11, 30, 50, .96), rgba(7, 24, 41, .98)); border: 1px solid var(--border); border-radius: 7px; box-shadow: inset 0 1px rgba(255,255,255,.012), 0 8px 20px rgba(0,0,0,.1); }.card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 11px; }.period-pill { padding: 4px 8px; border: 1px solid var(--border); border-radius: 4px; color: #a9bed5; font-size: 10px; }.btn { padding: 8px 11px; border: 1px solid var(--border-strong); border-radius: 5px; background: var(--field); color: var(--text); font-weight: 650; font-size: 12px; cursor: pointer; transition: filter .15s, transform .15s; }.btn:hover { filter: brightness(1.13); }.btn:active { transform: translateY(1px); }.btn:disabled { opacity: .5; cursor: not-allowed; }.btn-primary { border-color: #159b78; background: var(--safe); color: #03241e; }.btn-ghost { background: transparent; }.btn-outline { color: #b4cff2; background: #0d233a; }.btn-danger { border-color: #ac364c; background: #351523; color: #ff91a1; }.btn-small { padding: 4px 7px; font-size: 11px; }.wide { width: 100%; }
.account-connect-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 15px; }.account-connect-card { min-width: 0; display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: start; gap: 8px 10px; padding: 13px; border: 1px solid var(--border); border-radius: 6px; background: rgba(7, 22, 38, .56); }.account-connect-real { border-color: #167961; background: linear-gradient(145deg, rgba(7, 52, 48, .6), rgba(7, 22, 38, .65)); }.account-connect-icon { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 8px; background: #123554; color: #9bcaff; font-size: 19px; }.account-connect-real .account-connect-icon { background: #0b5d4c; color: #caffef; }.account-connect-card h3, .managed-account h3 { margin: 0; color: #e7f1fc; font-size: 13px; }.account-connect-card p { margin: 4px 0 0; color: var(--muted); font-size: 10px; }.account-connect-card button { grid-column: 1 / -1; justify-self: start; }.managed-accounts { display: grid; gap: 8px; }.managed-account { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 11px 12px; border: 1px solid var(--border); border-radius: 5px; background: rgba(7, 22, 38, .42); }.managed-account-main { min-width: 0; }.managed-account-main h3 { margin-top: 5px; }.managed-account-main p { margin: 3px 0 0; color: var(--muted); font-size: 10px; }.managed-account-main .managed-account-status { color: #72d8b8; }.account-type-badge { display: inline-block; padding: 2px 7px; border: 1px solid #315170; border-radius: 99px; color: #a9c9ed; font-size: 9px; }.account-type-badge.mt5 { border-color: #167961; color: #8ce2c6; }.account-type-badge.sim { border-color: #315170; }

.managed-account-actions { display: flex; justify-content: flex-end; align-items: center; flex-wrap: wrap; gap: 6px; }
.managed-account-main .managed-account-status.is-disconnected { color: #f0bf6e; }

/* --- metrics --- */
.kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 13px; }.kpi { position: relative; min-height: 108px; display: grid; grid-template-columns: 37px minmax(0, 1fr); gap: 10px; padding: 13px 12px; overflow: hidden; border: 1px solid var(--border); border-radius: 7px; background: linear-gradient(130deg, #0b2036, #07182a); }.kpi::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .22; background: radial-gradient(circle at 94% 7%, var(--glow), transparent 39%); }.kpi-balance { --glow: #18d99d; border-color: #147c69; }.kpi-pnl { --glow: #2e9bff; border-color: #24699b; }.kpi-drawdown { --glow: #ff4d70; border-color: #87344e; }.kpi-risk { --glow: #ffc449; border-color: #806329; }.kpi-trades { --glow: #7965ff; border-color: #4a3ba4; }.kpi-icon { position: relative; z-index: 1; display: grid; place-items: center; width: 35px; height: 35px; color: var(--glow); background: color-mix(in srgb, var(--glow) 14%, transparent); border-radius: 11px; font-size: 22px; }.kpi-title { position: relative; z-index: 1; color: #c3d0df; font-size: 11px; }.kpi-value { position: relative; z-index: 1; margin-top: 3px; color: #f6fbff; font-family: var(--mono); font-size: clamp(15px, 1.45vw, 21px); font-weight: 750; letter-spacing: -.06em; white-space: nowrap; }.kpi-sub { position: relative; z-index: 1; margin-top: 5px; color: #9eb1c7; font-size: 10px; }.meter { position: absolute; z-index: 1; right: 12px; bottom: 10px; left: 59px; height: 3px; overflow: hidden; background: rgba(147, 174, 205, .12); border-radius: 4px; }.meter-fill { width: 0; height: 100%; background: var(--glow); box-shadow: 0 0 7px var(--glow); transition: width .3s ease; }.level-WARNING .meter-fill { background: var(--warn); }.level-LOCKED .meter-fill { background: var(--lock); }.level-WARNING .kpi-value { color: var(--warn); }.level-LOCKED .kpi-value { color: var(--lock); }

/* --- account, risk and order ticket --- */
.dashboard-grid { display: grid; grid-template-columns: minmax(390px, 1.66fr) minmax(230px, 1fr); gap: 14px; }.account-overview { position: relative; }.chart-legend { position: absolute; top: 17px; right: 14px; display: flex; gap: 12px; color: #a9bdcf; font-size: 10px; }.chart-legend i { display: inline-block; width: 8px; height: 3px; margin: 0 4px 2px 0; vertical-align: middle; border-radius: 3px; }.legend-balance { background: var(--blue); }.legend-equity { background: var(--safe); }.account-chart { height: 165px; margin-top: 3px; }.account-chart svg { display: block; width: 100%; height: 143px; overflow: visible; }.chart-grid { fill: none; stroke: #1a3651; stroke-width: .7; stroke-dasharray: 2 2; }.chart-area { fill: url(#equityFill); }.chart-balance, .chart-equity { fill: none; stroke-width: 2.3; stroke-linecap: round; stroke-linejoin: round; }.chart-balance { stroke: var(--blue); }.chart-equity { stroke: var(--safe); }.chart-axis { display: flex; justify-content: space-between; padding: 1px 5px 0; color: #7188a3; font-family: var(--mono); font-size: 9px; }.account-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 9px 0 0; }.account-facts div { min-width: 0; padding: 7px 8px; border: 1px solid rgba(40, 70, 101, .65); border-radius: 4px; background: rgba(7,22,38,.42); }.account-facts dt { overflow: hidden; color: #8197b1; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }.account-facts dd { margin: 2px 0 0; overflow: hidden; color: #dce8f4; font-family: var(--mono); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }.account-day { margin: 7px 0 0; color: #748ba6; font-size: 9px; }
.risk-summary { display: flex; flex-direction: column; }.risk-ring-wrap { display: grid; place-items: center; flex: 1; min-height: 172px; }.risk-ring { --risk: 0%; position: relative; width: 146px; height: 146px; display: grid; place-items: center; border-radius: 50%; background: conic-gradient(var(--safe) 0 var(--risk), var(--blue) var(--risk) 69%, #7893b8 69% 100%); box-shadow: 0 0 23px rgba(34,216,159,.14); }.risk-ring::before { content: ""; position: absolute; width: 117px; height: 117px; border: 1px solid #203c5b; border-radius: 50%; background: #0a1d31; }.risk-ring > div { position: relative; z-index: 1; display: grid; text-align: center; }.risk-ring strong { color: #fff; font-family: var(--mono); font-size: 19px; }.risk-ring span { margin-top: 3px; color: #9db2ca; font-size: 9px; }.risk-breakdown { display: grid; gap: 8px; margin-top: 4px; }.risk-breakdown div, .risk-totals div { display: flex; align-items: center; justify-content: space-between; gap: 5px; color: #a9bed2; font-size: 10px; }.risk-breakdown b, .risk-totals dd { color: #e5eff8; font-family: var(--mono); font-weight: 600; }.risk-dot { display: inline-block; width: 8px; height: 8px; margin-right: 6px; border-radius: 99px; }.risk-dot-open { background: var(--safe); }.risk-dot-room { background: #a4c7c8; }.risk-totals { display: grid; gap: 7px; margin: 14px 0 0; padding-top: 11px; border-top: 1px solid var(--border); }.risk-totals dt, .risk-totals dd { margin: 0; }
.trading-panel { padding-bottom: 12px; }.accounts-fieldset { margin: 0 0 9px; padding: 5px 8px 7px; border: 1px solid var(--border); border-radius: 5px; }.accounts-fieldset legend { padding: 0 4px; color: #8da8c5; font-size: 9px; }.target-accounts { display: flex; flex-wrap: wrap; gap: 4px 9px; }.target-accounts label { display: inline-flex; align-items: center; gap: 4px; color: #c1d0df; font-size: 10px; }.target-accounts input { accent-color: var(--safe); }.trade-mode { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; color: #9bb0c6; font-size: 10px; }.trade-mode select { width: 108px; }.trade-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }.trade-fields label, .settings-grid label { display: grid; gap: 4px; color: #9cb2ca; font-size: 10px; }.req { color: var(--lock); font-size: 9px; }input, select { min-width: 0; border: 1px solid #284562; border-radius: 5px; outline: none; background: var(--field); color: #e3eef9; padding: 6px 7px; font-size: 11px; transition: border .15s, background .15s; }input:hover, select:hover { background: var(--field-hover); }input:focus, select:focus { border-color: var(--blue); box-shadow: 0 0 0 2px rgba(46,155,255,.15); }.price-line { margin: 8px 0; color: #7791ac; font-family: var(--mono); font-size: 9px; }.estimate { margin: 8px 0; padding: 8px; border: 1px solid #1b3955; border-radius: 5px; background: #081a2d; }.estimate-head { margin-bottom: 6px; color: #87a0ba; font-size: 9px; text-transform: uppercase; letter-spacing: .05em; }.estimate-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }.estimate-grid div { display: grid; min-width: 0; }.estimate-grid span { color: #768da8; font-size: 9px; }.estimate-grid b { overflow: hidden; color: #dceafa; font-family: var(--mono); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }.check-line { margin-top: 6px; color: #d1dce9; font-size: 10px; }.check-line ul { margin: 3px 0 0 15px; padding: 0; }.trade-buttons { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }.btn-buy, .btn-sell { padding: 8px; color: #03251f; border: 0; font-size: 12px; text-transform: uppercase; }.btn-buy { background: linear-gradient(90deg, #1bd99a, #36e3ae); }.btn-sell { background: linear-gradient(90deg, #e93f58, #ff6177); color: #300710; }

.trade-fields .trade-target-field { grid-column: 1 / -1; }
.trade-target-preview { display: block; min-width: 0; overflow: hidden; padding: 6px 7px; border: 1px solid #1b3955; border-radius: 5px; background: #081a2d; color: #dceafa; font-family: var(--mono); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.position-actions { display: flex; align-items: center; gap: 5px; }
.position-actions .btn { flex: 0 0 auto; padding: 5px 7px; }

/* --- rules, tables, activity --- */
.rule-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; }.rule { min-height: 75px; display: grid; align-content: start; gap: 5px; padding: 9px; border: 1px solid #1b3855; border-radius: 5px; background: rgba(5,19,33,.25); }.rule span { color: #a7bbcf; font-size: 10px; }.rule b { color: #eff7ff; font-family: var(--mono); font-size: 14px; }.rule small { color: #7590aa; font-size: 9px; }.rule-lock { border-color: #0e6158; background: linear-gradient(145deg, #073436, #062a30); }.rule-lock b { color: var(--safe); }.positions-card .card-head { margin-bottom: 8px; }.table-wrap { overflow-x: auto; scrollbar-color: #294b6c #08182a; }table { width: 100%; border-collapse: collapse; font-size: 11px; }th, td { padding: 7px 8px; border-bottom: 1px solid rgba(34,61,88,.7); text-align: left; white-space: nowrap; }th { color: #829ab6; background: rgba(18,43,70,.42); font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .035em; }td { color: #bdd0e2; }tbody tr:hover { background: rgba(34,80,118,.16); }td.num { font-family: var(--mono); text-align: right; }.small-table { font-size: 10px; }.wrap { white-space: normal; }.wrap-box { min-width: 190px; max-width: 350px; }.empty { padding: 17px; color: var(--muted); text-align: center; }.tag { display: inline-block; padding: 1px 6px; border-radius: 99px; border: 1px solid currentColor; font-size: 9px; font-weight: 700; }.tag-BLOCKED, .tag-FAILED, .tag-LOSS { color: var(--lock); }.tag-OPEN, .tag-PENDING { color: var(--blue); }.tag-CLOSED, .tag-CANCELLED, .tag-BREAKEVEN { color: var(--muted); }.tag-WIN { color: var(--safe); }.ev-danger { color: var(--lock); font-weight: 700; }
.activity-layout { display: grid; grid-template-columns: minmax(0, 1fr) 266px; gap: 14px; }.activity-card { min-height: 260px; }.tabs { display: flex; gap: 4px; margin: -2px -2px 12px; border-bottom: 1px solid var(--border); }.tab { padding: 8px 11px; border: 0; border-bottom: 2px solid transparent; background: none; color: #91a6c0; cursor: pointer; font-size: 11px; }.tab:hover { color: #e5f1fc; }.tab.active { border-bottom-color: var(--safe); color: #e8f8f3; font-weight: 700; }.journal-all { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 8px; color: #9bb1c8; font-size: 10px; }.notice { margin-bottom: 12px; padding: 10px; border: 1px solid #1e4262; border-radius: 5px; background: #0b233a; color: #b9cbe0; font-size: 11px; }.notice-warn { border-color: #95701d; background: #382a0e; }.settings-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; margin-bottom: 12px; }.settings-grid .check { display: flex; align-items: center; gap: 7px; color: #bdd0e3; }.help { color: #7188a1; font-size: 9px; }.sim-buttons, .sim-set { display: flex; flex-wrap: wrap; gap: 4px; }.sim-set input { width: 105px; }
.daily-tracker { align-self: start; }.daily-tracker .card-head b { color: #e3f0fe; font-family: var(--mono); font-size: 11px; }.tracker-bar { height: 8px; overflow: hidden; border-radius: 9px; background: #1b344e; }.tracker-bar span { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #ffab3f, #ff4f68); box-shadow: 0 0 8px rgba(255,79,104,.6); transition: width .3s ease; }.tracker-list { display: grid; gap: 8px; margin: 15px 0; }.tracker-list div { display: flex; justify-content: space-between; gap: 8px; color: #a5b9ce; font-size: 10px; }.tracker-list dt, .tracker-list dd { margin: 0; }.tracker-list dd { color: #e2edf8; font-family: var(--mono); }.tracker-note { display: flex; gap: 9px; padding: 9px; border: 1px solid #127e68; border-radius: 5px; background: #063735; }.tracker-note span { display: grid; place-items: center; width: 23px; height: 23px; border-radius: 5px; background: #0c7261; color: #d7fff5; }.tracker-note p { margin: 0; color: #bce2da; font-size: 9px; line-height: 1.35; }
.workspace-footer { display: flex; justify-content: space-between; padding: 10px 22px; color: #607992; border-top: 1px solid var(--border); font-size: 9px; }.workspace-footer i { padding: 0 4px; }

/* --- modal, toast and login --- */
dialog { width: min(560px, calc(100vw - 28px)); padding: 18px; border: 1px solid var(--border-strong); border-radius: 8px; background: var(--panel); color: var(--text); box-shadow: 0 20px 70px #000; }dialog::backdrop { background: rgba(0,0,0,.65); backdrop-filter: blur(2px); }.dialog-buttons { display: flex; justify-content: flex-end; gap: 8px; margin-top: 14px; }.result-block { margin: 10px 0; padding: 10px; border: 1px solid var(--border); border-radius: 6px; }.result-block.passed { border-color: #11876c; background: #07362f; }.result-block.blocked { border-color: #a4384d; background: #3b1622; }.result-title { margin-bottom: 4px; font-weight: 750; }.result-block ul { margin: 5px 0 0 17px; padding: 0; }.mt5-dialog { width: min(640px, calc(100vw - 28px)); }.mt5-dialog form { display: grid; gap: 10px; }.mt5-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }.mt5-form-grid label { display: grid; gap: 4px; color: #a8bdd0; font-size: 11px; }.mt5-form-grid label > span { color: #7089a6; font-size: 9px; }.mt5-terminal-field { grid-column: span 2; }.mt5-execution { display: flex; align-items: flex-start; gap: 7px; padding: 9px; border: 1px solid #167961; border-radius: 5px; background: #07332f; color: #bde3db; font-size: 11px; }.mt5-execution input { margin-top: 2px; accent-color: var(--safe); }.toast { position: fixed; z-index: 20; bottom: 20px; left: 50%; max-width: calc(100vw - 30px); padding: 10px 15px; border: 1px solid #2b5577; border-radius: 6px; background: #102941; color: #e8f3ff; box-shadow: 0 8px 25px rgba(0,0,0,.4); transform: translateX(-50%); font-size: 12px; }.login-page { display: grid; min-height: 100vh; place-items: center; padding: 16px; background: radial-gradient(circle at 30% 0%, #0d3e5c, transparent 42%), var(--bg); }.login-card { width: min(390px, 100%); display: grid; gap: 14px; padding: 28px; border: 1px solid var(--border-strong); border-radius: 10px; background: var(--panel); box-shadow: 0 20px 60px rgba(0,0,0,.35); }.login-card form { display: grid; gap: 12px; }.login-card label { display: grid; gap: 4px; color: #a5bad0; font-size: 11px; }.badge { display: inline-block; padding: 4px 8px; border-radius: 4px; font-size: 10px; }.badge-sim { border: 1px solid #88702d; background: #30270e; color: #f3cc65; }

@media (max-width: 1220px) { .chart-trading-layout { grid-template-columns: minmax(0, 1fr); }.dashboard-grid { grid-template-columns: minmax(360px, 1.5fr) minmax(250px, 1fr); }.kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }.rule-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 930px) { .app-shell { grid-template-columns: 1fr; }.sidebar { position: static; width: auto; min-height: 0; display: grid; grid-template-columns: auto 1fr; }.workspace { grid-column: 1; }.brand { grid-row: span 2; min-height: 112px; }.side-nav { grid-template-columns: repeat(4, minmax(0, 1fr)); padding: 8px; }.nav-item { justify-content: center; padding: 0 5px; }.nav-item > span { display: none; }.status-banner { display: none; }.sidebar-version { display: none; }.dashboard-grid { grid-template-columns: 1fr; }.trading-panel { grid-column: auto; }.account-facts { grid-template-columns: repeat(4, minmax(0, 1fr)); }.activity-layout { grid-template-columns: 1fr; }.daily-tracker { display: none; } }
@media (max-width: 660px) { .workspace-header { align-items: flex-start; flex-direction: column; padding: 13px 15px; }.header-tools { width: 100%; justify-content: flex-start; flex-wrap: wrap; gap: 8px; }.user-name { display: none; }.dashboard-content { padding: 12px; }.kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }.kpi { min-height: 96px; }.kpi:last-child { grid-column: span 2; }.side-nav { overflow-x: auto; grid-template-columns: repeat(8, max-content); }.nav-item { font-size: 10px; }.brand { min-height: 57px; grid-row: auto; }.brand small { display: none; }.sidebar { display: block; }.account-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }.rule-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.workspace-footer { padding: 10px 14px; }.workspace-footer span:last-child { display: none; }.tabs { overflow-x: auto; }.tab { white-space: nowrap; }.system-online { display: none; } }
@media (max-width: 930px) { .account-connect-grid { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .managed-account { align-items: flex-start; flex-direction: column; }.managed-account-actions { justify-content: flex-start; } }

/* --- Trading Journal: analytics, calendar, reports and trade details --- */
.journal-panel { display: grid; gap: 14px; }
.card-inset, .journal-card { min-width: 0; padding: 13px; border: 1px solid #1b3552; border-radius: 7px; background: linear-gradient(145deg, rgba(9, 27, 46, .92), rgba(6, 20, 35, .96)); }
.journal-controls-head, .journal-card-head, .journal-calendar-head, .journal-export-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.journal-controls-head { margin-bottom: 12px; }.journal-controls-head h2 { font-size: 15px; }
.journal-filter-grid { display: grid; grid-template-columns: repeat(7, minmax(100px, 1fr)); gap: 8px; }
.journal-filter-grid label { display: grid; align-content: end; gap: 4px; min-width: 0; color: #8ea5bd; font-size: 9px; }
.journal-filter-grid input, .journal-filter-grid select { width: 100%; min-width: 0; height: 32px; padding: 5px 7px; border: 1px solid #244260; border-radius: 4px; background: #0b2035; color: #e5effa; font-size: 10px; }
.journal-export-row { margin-top: 11px; padding-top: 10px; border-top: 1px solid #192f47; }.journal-export-row > div { display: flex; flex-wrap: wrap; gap: 5px; }
.journal-currency-note { margin: -5px 1px 0; color: #a9c2d9; font-size: 10px; }
.journal-stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(145px, 1fr)); gap: 8px; }
.journal-stat { display: grid; gap: 5px; min-height: 81px; padding: 10px; border: 1px solid #1b3b58; border-radius: 6px; background: linear-gradient(135deg, #0b2239, #091a2c); }
.journal-stat > span { color: #8ea6bf; font-size: 9px; }.journal-stat strong { color: #edf6ff; font: 700 16px/1.2 var(--mono); overflow-wrap: anywhere; }.journal-stat small { color: #67819b; font-size: 8px; }
.journal-stat strong.pos { color: var(--safe); }.journal-stat strong.neg { color: var(--lock); }.journal-stat-blocked { border-color: #5b3548; }.journal-stat-blocked strong { color: #ff8694; }
.journal-chart-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }.journal-card-head { margin-bottom: 6px; }.journal-card-head h3, .journal-calendar-head h3, .journal-trades-card h3 { margin: 0; color: #e7f1fc; font-size: 13px; }
.journal-chart { min-height: 190px; width: 100%; overflow: hidden; }.journal-chart svg { display: block; width: 100%; height: 190px; }.journal-chart-empty { display: grid; min-height: 190px; place-items: center; color: #7189a4; font-size: 10px; }
.journal-svg-grid { stroke: rgba(77, 108, 139, .28); stroke-width: 1; stroke-dasharray: 3 5; }.journal-svg-label { fill: #748da7; font: 8px var(--mono); }.journal-equity-line { fill: none; stroke: #31d6a2; stroke-width: 2.3; stroke-linecap: round; stroke-linejoin: round; }.journal-equity-point { fill: #c0ffe8; stroke: #0b6e58; stroke-width: 2; }.journal-bar-positive { fill: #20c997; }.journal-bar-negative { fill: #ed6374; }
.journal-calendar-card { display: grid; gap: 11px; }.journal-calendar-head { margin-bottom: 0; }.journal-calendar-nav { display: flex; gap: 5px; }.journal-calendar-nav button { min-width: 31px; }
.journal-calendar-layout { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(210px, .8fr); gap: 12px; }
.journal-calendar-weekdays, .journal-calendar-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.journal-calendar-weekdays span { padding: 4px 2px; color: #728ba5; text-align: center; font: 600 8px var(--mono); text-transform: uppercase; }
.journal-day-cell { position: relative; display: flex; min-width: 0; min-height: 70px; flex-direction: column; align-items: flex-start; gap: 5px; padding: 7px; border: 1px solid #1a3550; border-radius: 5px; background: #081a2c; color: #d9e6f4; cursor: pointer; text-align: left; }
.journal-day-cell:hover { border-color: #3d7096; background: #0b243b; }.journal-day-cell.is-selected { border-color: #19a17c; background: linear-gradient(145deg, #0b3935, #0a2335); box-shadow: inset 0 0 0 1px rgba(32,216,156,.13); }
.journal-day-cell.is-outside { opacity: .42; }.journal-day-cell.is-today::after { position: absolute; top: 7px; right: 7px; width: 5px; height: 5px; border-radius: 50%; background: #37b2ff; content: ""; }
.journal-day-number { font: 600 10px var(--mono); }.journal-day-count { color: #8199b2; font-size: 8px; }.journal-day-pnl { max-width: 100%; overflow: hidden; color: #86dfbf; font: 600 8px var(--mono); text-overflow: ellipsis; white-space: nowrap; }.journal-day-pnl.neg { color: #ff8997; }
.journal-day-panel { align-self: stretch; display: flex; min-height: 0; flex-direction: column; padding: 12px; border: 1px solid #1b3552; border-radius: 6px; background: rgba(5, 18, 31, .55); }.journal-day-panel h4 { margin: 0 0 12px; color: #ecf5ff; font-size: 12px; }
.journal-day-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }.journal-day-metrics div { display: grid; gap: 3px; padding: 8px; border: 1px solid #1a3550; border-radius: 4px; background: #0a1e31; }.journal-day-metrics span { color: #7790aa; font-size: 8px; }.journal-day-metrics b { color: #e7f1fc; font: 600 11px var(--mono); }.journal-day-metrics b.pos { color: var(--safe); }.journal-day-metrics b.neg { color: var(--lock); }
.journal-day-trades { display: grid; flex: 1 1 auto; min-height: 0; max-height: 280px; gap: 5px; align-content: start; margin-top: 10px; overflow-y: auto; overscroll-behavior: contain; padding-right: 4px; scrollbar-color: #315674 #07192a; scrollbar-width: thin; }.journal-day-trades::-webkit-scrollbar { width: 6px; }.journal-day-trades::-webkit-scrollbar-track { border-radius: 4px; background: #07192a; }.journal-day-trades::-webkit-scrollbar-thumb { border-radius: 4px; background: #315674; }.journal-day-trade { display: grid; grid-template-columns: 1fr auto; gap: 2px 8px; padding: 7px; border-left: 2px solid #2b95da; border-radius: 3px; background: #0a2035; color: #dce9f7; cursor: pointer; text-align: left; }.journal-day-trade:hover { background: #102b44; }.journal-day-trade strong { font-size: 9px; }.journal-day-trade span { color: #8299b0; font: 8px var(--mono); }.journal-day-trade small { grid-column: 1 / -1; color: #8198b0; font-size: 8px; }
.journal-trades-card { padding: 13px; }.journal-table { min-width: 830px; }.journal-table td { vertical-align: middle; }.journal-table .journal-open-details { padding: 4px 7px; font-size: 9px; }
.journal-table-sub, .journal-block-reason { display: block; max-width: 250px; margin-top: 3px; overflow: hidden; color: #7189a3; font-size: 8px; text-overflow: ellipsis; }.journal-block-reason { color: #ff8797; white-space: normal; }
.journal-side-buy { color: #73e0b9; }.journal-side-sell { color: #ff8595; }
.journal-detail-dialog { width: min(920px, calc(100vw - 28px)); max-height: min(90vh, 900px); overflow-y: auto; }.journal-detail-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 14px; }.journal-detail-overview { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 12px; }.journal-detail-overview h3 { margin: 0 auto 0 0; color: #edf6ff; font-size: 17px; }.journal-detail-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; }.journal-detail-field { min-width: 0; padding: 9px; border: 1px solid #1b3552; border-radius: 5px; background: #081a2c; }.journal-detail-field span { display: block; margin-bottom: 4px; color: #728ba5; font-size: 8px; text-transform: uppercase; letter-spacing: .05em; }.journal-detail-field strong { display: block; color: #e5effa; font: 600 11px/1.35 var(--mono); overflow-wrap: anywhere; }.journal-detail-section { margin-top: 12px; padding: 11px; border: 1px solid #1b3552; border-radius: 5px; background: rgba(6, 19, 33, .55); }.journal-detail-section h4 { margin: 0 0 8px; color: #afc4db; font-size: 10px; text-transform: uppercase; letter-spacing: .06em; }.journal-detail-copy { margin: 0; color: #d2e1ef; font-size: 11px; white-space: pre-wrap; overflow-wrap: anywhere; }.journal-detail-edit { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }.journal-detail-edit label { display: grid; gap: 4px; color: #829bb4; font-size: 9px; }.journal-detail-edit input, .journal-detail-edit textarea { width: 100%; padding: 7px; border: 1px solid #244260; border-radius: 4px; outline: none; background: #0b2035; color: #e5effa; font-size: 10px; }.journal-detail-edit textarea { min-height: 74px; resize: vertical; }.journal-detail-edit .journal-notes-field { grid-column: 1 / -1; }.journal-detail-actions { display: flex; justify-content: flex-end; gap: 7px; margin-top: 9px; }.journal-screenshot-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }.journal-screenshot { overflow: hidden; border: 1px solid #1d3c59; border-radius: 5px; background: #061421; }.journal-screenshot img { display: block; width: 100%; max-height: 310px; object-fit: contain; }.journal-screenshot figcaption { padding: 6px 8px; color: #8da5bc; font-size: 9px; }.journal-risk-checks { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 5px; }.journal-risk-check { padding: 6px 8px; border: 1px solid #1b3552; border-radius: 4px; color: #b1c5d8; font-size: 9px; }.journal-risk-check.is-failed { border-color: #703244; color: #ff9aa6; }
@media (max-width: 1150px) { .journal-filter-grid { grid-template-columns: repeat(4, minmax(120px, 1fr)); }.journal-stat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) { .journal-chart-grid, .journal-calendar-layout { grid-template-columns: 1fr; }.journal-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.journal-calendar-layout { gap: 9px; }.journal-day-panel { order: -1; }.journal-day-trades { flex: 0 1 auto; max-height: 220px; }.journal-day-cell { min-height: 58px; padding: 5px; }.journal-detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.journal-screenshot-grid { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .journal-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.journal-filter-grid { grid-template-columns: 1fr 1fr; }.journal-export-row { align-items: flex-start; flex-direction: column; }.journal-export-row > div { width: 100%; }.journal-export-row button { flex: 1; padding-inline: 5px; font-size: 9px; }.journal-detail-edit { grid-template-columns: 1fr; }.journal-detail-edit .journal-notes-field { grid-column: auto; }.journal-day-cell { min-height: 52px; }.journal-day-pnl { display: none; } }

/* --- independent MT5 trading chart --- */
.account-overview .chart-legend, .account-overview .account-chart { display: none; }
.account-chart-note { margin: 2px 0 12px; color: #8098b2; font-size: 10px; }
.chart-trading-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 350px); align-items: start; gap: 14px; }
.chart-trading-layout > .trading-panel { grid-column: auto; min-width: 0; }
.trading-side-panel { display: grid; gap: 14px; min-width: 0; }
.trading-chart-card { padding: 14px 15px 11px; }
.chart-card-head { align-items: center; margin-bottom: 12px; }
.chart-live-readout { display: grid; justify-items: end; gap: 1px; font-family: var(--mono); }
.chart-live-readout b { color: #eff8ff; font-size: 17px; }
.chart-live-readout small { color: #839ab3; font-size: 9px; }

.trade-management-panel { padding-bottom: 11px; }
.management-scope { color: #80a1bf; font-size: 9px; }
.management-intro, .management-note { margin: -2px 0 10px; color: #8199b2; font-size: 9px; line-height: 1.5; }
.management-note { margin: 9px 0; color: #778da5; }
.management-rule { display: grid; grid-template-columns: minmax(0, 1fr) 92px; align-items: center; gap: 8px; padding: 8px 0; border-top: 1px solid rgba(35, 61, 87, .72); }
.management-toggle { display: flex; align-items: flex-start; gap: 7px; min-width: 0; color: #dce9f5; cursor: pointer; }
.management-toggle input { margin: 2px 0 0; accent-color: var(--safe); }
.management-toggle span { display: grid; gap: 3px; min-width: 0; }
.management-toggle b { font-size: 10px; }
.management-toggle small { color: #839bb4; font-size: 8px; line-height: 1.4; }
.management-value { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 3px 5px; color: #8fa8c1; font-size: 8px; }
.management-value input { width: 100%; min-width: 0; height: 29px; padding: 4px 5px; font: 10px var(--mono); }
.management-value span { grid-column: 1 / -1; color: #6e87a0; font-size: 7px; }
.management-status { min-height: 12px; margin: 7px 0 0; color: #91a8be; font-size: 9px; }
.management-status.is-error { color: #ff8896; }
.management-status.is-success { color: #30dca7; }
.management-timeline { display: grid; gap: 6px; }
.management-event { display: grid; gap: 3px; padding: 7px 8px; border: 1px solid #1c3a55; border-radius: 4px; background: #091c30; }
.management-event strong { color: #bce7d9; font-size: 9px; }
.management-event small { color: #859bb2; font-size: 8px; }
.trade-management-page { grid-template-columns: minmax(0, 900px); justify-content: center; align-content: start; }
.trade-management-intro h2 { margin: 3px 0 6px; color: #e8f3ff; font-size: 17px; }
.trade-management-intro p:last-child { max-width: 680px; margin-bottom: 0; line-height: 1.6; }
.trade-management-page .trade-management-panel { width: 100%; }
.trade-management-page .management-rule { grid-template-columns: minmax(0, 1fr) minmax(150px, 220px); padding: 12px 2px; }
@media (max-width: 660px) { .trade-management-page .management-rule { grid-template-columns: minmax(0, 1fr) 100px; } }
.chart-connection { display: inline-flex; align-items: center; gap: 6px; color: #91a5c0; font-family: inherit; font-size: 9px; }
.chart-connection::before { width: 7px; height: 7px; border-radius: 50%; background: #6c7d90; content: ""; }
.chart-connection.is-live { color: var(--safe); }
.chart-connection.is-live::before { background: var(--safe); box-shadow: 0 0 8px var(--safe); }
.chart-connection.is-error { color: var(--warn); }
.chart-connection.is-error::before { background: var(--warn); }
.chart-toolbar { display: flex; align-items: end; flex-wrap: wrap; gap: 9px; margin-bottom: 9px; }
.chart-toolbar > label { display: grid; gap: 3px; min-width: 132px; color: #829ab5; font-size: 9px; }
.chart-toolbar select { height: 30px; min-width: 132px; padding: 4px 24px 4px 7px; font-size: 10px; }
.timeframe-control { display: flex; flex-wrap: wrap; gap: 3px; margin-left: auto; }
.timeframe-button { min-width: 36px; height: 29px; padding: 0 7px; border: 1px solid #203d59; border-radius: 4px; background: #0a1d30; color: #91a8c1; cursor: pointer; font-family: var(--mono); font-size: 9px; }
.timeframe-button:hover { border-color: #37658d; color: #e4f2ff; }
.timeframe-button.is-active { border-color: #167d68; background: #0a3935; color: #83ebc8; box-shadow: inset 0 -2px var(--safe); }
.chart-info-row { display: flex; justify-content: space-between; gap: 12px; min-height: 19px; color: #6f87a2; font-family: var(--mono); font-size: 9px; }
.chart-workspace { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 9px; align-items: stretch; min-width: 0; }
.chart-toolbox { display: flex; flex-direction: column; align-items: stretch; gap: 5px; }
.chart-tool { min-height: 42px; display: grid; align-content: center; justify-items: center; gap: 1px; padding: 3px 1px; border: 1px solid #1d3a57; border-radius: 5px; background: #091c2e; color: #8ca6c1; cursor: pointer; }
.chart-tool > span { height: 17px; color: #c0d4e8; font-size: 15px; line-height: 17px; }
.chart-tool > small { color: #7189a3; font-size: 7px; line-height: 10px; }
.chart-tool:hover { border-color: #3c6688; background: #0d2740; }
.chart-tool.is-active { border-color: #16856d; background: #0a3534; box-shadow: inset 2px 0 var(--safe); }
.chart-tool.is-active > span, .chart-tool.is-active > small { color: #8de8c9; }
.chart-tool-clear > span { color: #d9949e; }
.chart-tool-separator { height: 1px; margin: 2px 3px; background: #1b3550; }
.chart-plot-slot { position: relative; min-width: 0; height: clamp(340px, 39vw, 490px); }
.trading-chart-canvas-wrap { position: relative; width: 100%; height: 100%; overflow: hidden; border: 1px solid #1a3550; border-radius: 5px; background: linear-gradient(180deg, #071827, #061522); }
#trading-chart-canvas { display: block; width: 100%; height: 100%; outline: none; touch-action: none; cursor: crosshair; }
#trading-chart-canvas.is-pan-tool { cursor: crosshair; }
#trading-chart-canvas.is-drawing { cursor: crosshair; }
#trading-chart-canvas.is-dragging { cursor: grabbing; }
#trading-chart-canvas.is-price-scale, #trading-chart-canvas.is-scaling { cursor: ns-resize; }
.chart-legend-row { display: flex; flex-wrap: wrap; gap: 8px 17px; padding: 9px 2px 1px; color: #829ab4; font-size: 9px; }
.chart-legend-row span { display: inline-flex; align-items: center; gap: 5px; }
.chart-legend-row i { display: inline-block; width: 14px; height: 2px; border-radius: 3px; background: #7d90a5; }
.chart-legend-row .legend-candle-up { width: 7px; height: 10px; border-radius: 1px; background: var(--safe); }
.chart-legend-row .legend-candle-down { width: 7px; height: 10px; border-radius: 1px; background: #ef6371; }
.chart-legend-row .legend-trade-buy { background: #20d89c; }
.chart-legend-row .legend-trade-sell { background: #ff6577; }
.chart-legend-row .legend-stop { background: #ff6577; }
.chart-legend-row .legend-target { background: #26d5a0; }
.chart-message { min-height: 16px; margin: 3px 2px 0; color: #839ab3; font-size: 10px; }
.chart-message.is-error { color: #f0be67; }
.chart-message.is-live { color: #74d8b7; }
.chart-message.is-history { color: #f0be67; }
@media (max-width: 930px) { .timeframe-control { margin-left: 0; }.chart-workspace { grid-template-columns: 36px minmax(0, 1fr); }.chart-plot-slot { height: 390px; } }
@media (max-width: 660px) { .trading-chart-card { padding: 11px; }.chart-card-head { align-items: flex-start; }.chart-live-readout b { font-size: 14px; }.chart-toolbar { align-items: stretch; }.chart-toolbar > label, .chart-toolbar select { min-width: 0; flex: 1 1 130px; }.timeframe-control { flex: 1 1 100%; justify-content: space-between; }.timeframe-button { min-width: 32px; flex: 1 1 0; padding: 0 3px; }.chart-info-row span:last-child { display: none; }.chart-workspace { grid-template-columns: 31px minmax(0, 1fr); gap: 6px; }.chart-tool { min-height: 37px; }.chart-tool > span { font-size: 13px; }.chart-tool > small { font-size: 6px; }.chart-plot-slot { height: 340px; }.chart-legend-row { gap: 7px 11px; } }
.estimate-costs { grid-column: 1 / -1; }
.analysis-page { align-content: start; }
.analysis-chart-hint { margin: 14px 0 7px; color: #829ab5; font-size: 10px; }
.analysis-chart-slot { min-width: 0; margin-bottom: 14px; }
.analysis-chart-slot > .trading-chart-card { margin: 0; }
.analysis-page .analysis-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
.analysis-page label { display: grid; align-content: start; gap: 6px; color: #a9bfd6; font-size: 11px; }
.analysis-page input, .analysis-page select { width: 100%; min-height: 36px; padding: 7px 9px; border: 1px solid var(--border-strong); border-radius: 5px; background: var(--field); color: var(--text); font: inherit; }
.analysis-page select[multiple] { min-height: 114px; }
.analysis-page input[type="file"] { padding: 5px; }
.analysis-page .help { color: #7891ac; font-size: 10px; line-height: 1.45; }
.analysis-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.analysis-result { min-width: 0; }
.analysis-summary-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 8px; margin: 10px 0 14px; }
.analysis-summary-item { min-width: 0; padding: 10px; border: 1px solid var(--border); border-radius: 5px; background: #081b2d; }
.analysis-summary-item span { display: block; color: #7991aa; font-size: 9px; text-transform: uppercase; }
.analysis-summary-item b { display: block; margin-top: 5px; overflow-wrap: anywhere; color: #e4effb; font-family: var(--mono); font-size: 12px; }
.analysis-signal-table { width: 100%; border-collapse: collapse; font-size: 10px; }
.analysis-signal-table th, .analysis-signal-table td { padding: 8px; border-bottom: 1px solid var(--border); text-align: left; vertical-align: top; }
.analysis-signal-table th { color: #8098b2; font-weight: 600; }
.analysis-trade-win td { background: rgba(34, 160, 107, .12); }
.analysis-trade-win td:nth-last-child(-n+2) { color: #78dfa8; font-weight: 700; }
.analysis-trade-loss td { background: rgba(190, 55, 76, .13); }
.analysis-trade-loss td:nth-last-child(-n+2) { color: #ff91a0; font-weight: 700; }
.analysis-downloads { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 10px 0; }
.analysis-downloads .muted { flex: 1 1 100%; }
.analysis-reasons { margin: 4px 0; padding-left: 16px; color: #b3c6da; line-height: 1.6; }
.analysis-window { margin-top: 13px; padding: 11px; border: 1px solid var(--border); border-radius: 5px; }
.analysis-window h3 { margin: 0 0 9px; color: #cfe1f4; font-size: 12px; }
.analysis-chart-signals-card { margin-top: 12px; }
.analysis-chart-signals { max-height: 340px; overflow: auto; }
.analysis-chart-signals .analysis-signal-table { min-width: 680px; }
.analysis-side-buy { color: #78dfa8; }
.analysis-side-sell { color: #ff91a0; }
.analysis-strategy-detail { margin-top: 10px; border-top: 1px solid var(--border); padding-top: 9px; color: #b3c6da; font-size: 11px; }
.analysis-strategy-detail summary { cursor: pointer; color: #7bc7ff; }
.analysis-equity-chart { display: block; width: 100%; height: 130px; margin: 8px 0; border: 1px solid var(--border); border-radius: 4px; background: #081b2d; }
.analysis-ledger { max-height: 300px; overflow: auto; }
.analysis-fingerprint { color: #7f9bb8; font-family: var(--mono); font-size: 9px; }
.analysis-run-link { padding: 0; border: 0; background: transparent; color: #7bc7ff; cursor: pointer; text-align: left; font: inherit; }
.analysis-run-link:hover { text-decoration: underline; }
.analysis-page .empty { color: #8198b2; font-size: 11px; }
.analysis-page #analysis-status.is-error { color: #ff9aa8; }
@media (max-width: 660px) { .analysis-page .analysis-form-grid { grid-template-columns: 1fr; }.analysis-actions > button { width: 100%; }.analysis-signal-table { min-width: 680px; } }

/* --- mobile trading workspace --- */
.workspace-title { display: flex; align-items: center; gap: 10px; min-width: 0; }
.mobile-menu-toggle, .mobile-nav-backdrop, .mobile-bottom-nav, .mobile-shortcuts, .mobile-account-status { display: none; }
.positions-card { scroll-margin-top: 76px; }
#trading-chart-card, #order-ticket, #dashboard, #accounts-page, #analysis-page,
#trade-management-page, .activity-card { scroll-margin-top: 76px; }

@media (max-width: 660px) {
  html { scroll-padding-top: 66px; }
  body { min-width: 320px; }
  body.mobile-menu-open { overflow: hidden; }
  .app-shell { display: block; min-height: 100dvh; }
  .workspace { min-width: 0; padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
  .workspace-header {
    position: sticky; z-index: 20; top: 0; min-height: 58px; flex-direction: row;
    align-items: center; gap: 6px; padding: 7px 10px;
    border-bottom-color: #203d5c; background: rgba(5, 18, 32, .96); backdrop-filter: blur(12px);
  }
  .workspace-title { gap: 8px; }
  .workspace-title > div { min-width: 0; }
  .mobile-menu-toggle {
    width: 34px; height: 36px; flex: 0 0 auto; display: grid; place-items: center;
    padding: 0; border: 1px solid transparent; border-radius: 6px;
    background: transparent; color: #dceafb; font-size: 19px;
  }
  .mobile-menu-toggle:active { background: #102b46; }
  .workspace-header .eyebrow { display: none; }
  .workspace-header h1 { overflow: hidden; font-size: 17px; text-overflow: ellipsis; white-space: nowrap; }
  .header-tools { width: auto; flex: 0 0 auto; flex-wrap: nowrap; gap: 5px; }
  .system-online, .user-name { display: none; }
  .account-picker { display: block; }
  .account-picker > span { display: none; }
  .account-picker select { width: min(32vw, 124px); min-width: 0; max-width: 124px; height: 36px; padding: 4px 20px 4px 6px; font-size: 10px; }
  #logout-btn { width: 34px; height: 34px; flex: 0 0 auto; }

  .sidebar {
    position: fixed; z-index: 40; inset: 0 auto 0 0; width: min(84vw, 310px); min-height: 100dvh;
    display: flex; flex-direction: column; overflow-y: auto; border-right: 1px solid #284864;
    background: linear-gradient(160deg, #071829, #061423); box-shadow: 18px 0 40px rgba(0,0,0,.38);
    transform: translateX(-105%); transition: transform .22s ease;
  }
  body.mobile-menu-open .sidebar { transform: translateX(0); }
  .brand { min-height: 70px; grid-row: auto; padding: 12px 16px; }
  .brand small { display: block; }
  .side-nav { display: grid; grid-template-columns: 1fr; gap: 4px; overflow: auto; padding: 11px 10px; }
  .nav-item { justify-content: flex-start; height: 43px; padding: 0 11px; font-size: 12px; }
  .nav-item > span { display: inline-block; width: 19px; }
  .nav-item.is-active::before { left: -10px; }
  .status-banner { display: flex; margin: auto 10px 10px; }
  .sidebar-version { display: block; padding: 11px 16px; }
  .mobile-nav-backdrop:not([hidden]) {
    position: fixed; z-index: 35; inset: 0; display: block; width: 100%; height: 100%;
    border: 0; border-radius: 0; background: rgba(0, 7, 15, .66); backdrop-filter: blur(2px);
  }
  .mobile-bottom-nav {
    position: fixed; z-index: 30; inset: auto 0 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 2px; padding: 5px 5px calc(5px + env(safe-area-inset-bottom));
    border-top: 1px solid #1d3854; background: rgba(5, 17, 30, .97); backdrop-filter: blur(14px);
  }
  .mobile-nav-item {
    min-width: 0; min-height: 49px; display: grid; align-content: center; justify-items: center; gap: 1px;
    padding: 3px 1px; border: 0; border-radius: 6px; background: transparent; color: #849bb4; cursor: pointer;
  }
  .mobile-nav-item > span { font-size: 18px; line-height: 20px; }
  .mobile-nav-item > small { font-size: 8px; line-height: 12px; }
  .mobile-nav-item.is-active { background: linear-gradient(180deg, rgba(22, 73, 119, .36), rgba(10, 42, 70, .18)); color: #45aaff; }
  .mobile-nav-item.is-active > span { color: #47adff; }

  .dashboard-content { width: 100%; gap: 10px; padding: 10px 10px 18px; }
  #dashboard > .mobile-account-status { order: 0; display: flex; }
  .mobile-account-status {
    min-height: 38px; align-items: center; gap: 7px; padding: 7px 10px;
    border: 1px solid #176d60; border-radius: 7px; background: linear-gradient(100deg, #0a302f, #0a2030);
    color: #b9d9d6; font-size: 9px;
  }
  .mobile-status-dot { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: var(--safe); box-shadow: 0 0 8px var(--safe); }
  .mobile-account-status strong { margin-left: auto; color: var(--safe); font: 700 9px var(--mono); }
  .mobile-account-status.status-WARNING { border-color: #9c7419; background: linear-gradient(100deg, #37280c, #25200f); }
  .mobile-account-status.status-WARNING strong, .mobile-account-status.status-WARNING .mobile-status-dot { color: var(--warn); background-color: var(--warn); }
  .mobile-account-status.status-LOCKED { border-color: #a7354c; background: linear-gradient(100deg, #391522, #25121c); }
  .mobile-account-status.status-LOCKED strong, .mobile-account-status.status-LOCKED .mobile-status-dot { color: var(--lock); background-color: var(--lock); }
  #dashboard > .kpis { order: 1; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  #dashboard > .mobile-shortcuts { order: 2; }
  #dashboard > .positions-card { order: 3; }
  #dashboard > .chart-trading-layout { order: 4; }
  #dashboard > .dashboard-grid { order: 5; }
  #dashboard > .risk-rules-card { order: 6; }
  #dashboard > .activity-layout { order: 7; }
  .mobile-shortcuts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
  .mobile-shortcuts button {
    min-width: 0; min-height: 56px; display: grid; align-content: center; justify-items: center; gap: 2px;
    padding: 6px 3px; border: 1px solid #244867; border-radius: 7px;
    background: linear-gradient(145deg, #123a60, #0a2540); color: #e7f3ff; font-size: 9px; font-weight: 650;
  }
  .mobile-shortcuts button:first-child { border-color: #197c6b; background: linear-gradient(145deg, #0c514b, #0a2d39); }
  .mobile-shortcuts button > span { color: #66bbff; font-size: 17px; line-height: 19px; }
  .mobile-shortcuts button:first-child > span { color: #53e0b3; }
  .kpi { min-height: 91px; grid-template-columns: 27px minmax(0, 1fr); gap: 7px; padding: 10px 8px; border-radius: 7px; }
  .kpi:last-child { grid-column: 1 / -1; }
  .kpi-icon { width: 27px; height: 27px; border-radius: 8px; font-size: 17px; }
  .kpi-title { font-size: 9px; }
  .kpi-value { font-size: clamp(14px, 4.2vw, 18px); }
  .kpi-sub { margin-top: 3px; font-size: 8px; }
  .meter { right: 9px; bottom: 7px; left: 42px; }
  .card { padding: 11px; border-radius: 8px; }
  .card-head { gap: 7px; margin-bottom: 9px; }
  .card-head h2 { font-size: 14px; }
  .workspace-footer { display: none; }
  .dashboard-grid { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .account-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rule-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
  .rule { min-height: 69px; padding: 8px; }
  .activity-layout { grid-template-columns: minmax(0, 1fr); }
  .daily-tracker { display: block; }
  .positions-card .card-head { align-items: flex-start; flex-direction: column; }
  .positions-card .card-head > div { min-width: 0; }
  #emergency-btn { min-height: 38px; }
  .positions-card .table-wrap { overflow: visible; }
  .positions-card table, .positions-card tbody { display: block; width: 100%; }
  .positions-card thead { display: none; }
  .positions-card tbody { display: grid; gap: 8px; }
  .positions-card tbody tr {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0;
    padding: 5px; border: 1px solid #1c3a57; border-radius: 7px;
    background: linear-gradient(145deg, #0b2035, #081a2b);
  }
  .positions-card tbody td {
    min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: 2px;
    overflow-wrap: anywhere; padding: 6px 7px; border-bottom: 1px solid rgba(34,61,88,.5);
    text-align: left; white-space: normal; font-size: 10px;
  }
  .positions-card tbody td::before {
    color: #718ba6; content: attr(data-label); font: 600 7px/1.2 var(--mono);
    letter-spacing: .04em; text-transform: uppercase;
  }
  .positions-card tbody td:nth-child(3), .positions-card tbody td:last-child { grid-column: 1 / -1; }
  .positions-card tbody td:nth-child(3) { color: #eff7ff; font-size: 12px; font-weight: 700; }
  .positions-card tbody td:nth-child(9) { font-size: 12px; font-weight: 700; }
  .positions-card tbody td:nth-child(9).pos { color: var(--safe); }
  .positions-card tbody td:nth-child(9).neg { color: var(--lock); }
  .positions-card tbody td:last-child { border-bottom: 0; }
  .positions-card tbody td:last-child::before, .positions-card tbody td[colspan]::before { display: none; }
  .positions-card tbody td[colspan] { grid-column: 1 / -1; align-items: center; padding: 16px 8px; }
  .positions-card .position-actions { width: 100%; gap: 7px; }
  .positions-card .position-actions .btn { min-height: 36px; flex: 1 1 0; padding: 5px; }
  .positions-card tbody td:last-child > .btn { min-height: 36px; }

  .chart-trading-layout { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .trading-chart-card { padding: 10px; }
  .chart-card-head { align-items: flex-start; flex-direction: row; }
  .chart-card-head h2 { max-width: 180px; }
  .chart-live-readout { min-width: 90px; }
  .chart-live-readout b { font-size: 14px; }
  .chart-toolbar { align-items: end; gap: 7px; }
  .chart-toolbar > label { min-width: 0; flex: 1 1 calc(50% - 4px); font-size: 8px; }
  .chart-toolbar select { width: 100%; min-width: 0; height: 36px; font-size: 11px; }
  .timeframe-control { flex: 1 1 100%; gap: 3px; }
  .timeframe-button { min-width: 0; height: 34px; flex: 1 1 0; padding: 0 3px; font-size: 9px; }
  #chart-reset { min-height: 34px; }
  .chart-info-row { display: block; min-height: 28px; overflow: hidden; font-size: 8px; line-height: 1.35; }
  .chart-info-row span:first-child { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .chart-info-row span:last-child { display: none; }
  .chart-workspace { display: grid; grid-template-columns: minmax(0, 1fr); gap: 7px; }
  .chart-toolbox { grid-row: 2; flex-direction: row; gap: 4px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: thin; }
  .chart-tool { min-width: 40px; min-height: 38px; flex: 0 0 auto; padding: 2px; }
  .chart-tool > span { font-size: 13px; }
  .chart-tool > small { font-size: 6px; }
  .chart-tool-separator { width: 1px; height: 27px; flex: 0 0 1px; margin: 5px 2px; }
  .chart-plot-slot { grid-row: 1; height: clamp(290px, 54svh, 420px); }
  .chart-legend-row { display: none; }
  .chart-message { font-size: 9px; line-height: 1.35; }
  .trading-panel { padding-bottom: 11px; }
  .trade-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  .trade-fields label { min-width: 0; font-size: 9px; }
  .trade-fields input, .trade-fields select, .trade-mode select { min-height: 40px; font-size: 15px; }
  .target-accounts { gap: 7px 11px; }
  .target-accounts label { min-height: 30px; font-size: 9px; }
  .estimate-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .estimate-grid span { font-size: 8px; }
  .estimate-grid b { font-size: 10px; }
  .trade-buttons .btn { min-height: 44px; font-size: 12px; }

  .account-connect-grid { grid-template-columns: minmax(0, 1fr); }
  .managed-account { align-items: flex-start; flex-direction: column; }
  .managed-account-actions { justify-content: flex-start; }
  .trade-management-page .management-rule { grid-template-columns: minmax(0, 1fr) 94px; gap: 7px; padding: 10px 0; }
  .management-toggle b { font-size: 10px; }
  .management-toggle small { font-size: 8px; }
  .management-value { grid-template-columns: minmax(0, 1fr) auto; font-size: 8px; }
  .management-value input { height: 36px; font-size: 14px; }
  .analysis-page .analysis-form-grid { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .analysis-page label { font-size: 10px; }
  .analysis-page input, .analysis-page select { min-height: 40px; font-size: 15px; }
  .analysis-page select[multiple] { min-height: 130px; }
  .analysis-actions > button { min-height: 42px; width: 100%; }
  .analysis-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .analysis-signal-table, .analysis-chart-signals .analysis-signal-table { min-width: 680px; }
  .tabs { gap: 2px; margin-right: -5px; margin-left: -5px; }
  .tab { min-height: 40px; padding: 7px 9px; font-size: 10px; }
  .journal-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .journal-filter-grid label { min-width: 0; }
  .journal-filter-grid input, .journal-filter-grid select, .settings-grid input, .settings-grid select { min-height: 40px; font-size: 14px; }
  .journal-export-row { align-items: flex-start; flex-direction: column; gap: 8px; }
  .journal-export-row > div { width: 100%; display: flex; flex-wrap: wrap; gap: 5px; }
  .journal-calendar-layout { grid-template-columns: minmax(0, 1fr); }
  .journal-day-panel { order: -1; }
  .journal-day-cell { min-height: 54px; padding: 5px; }
  .journal-day-pnl { display: none; }
  dialog { max-height: 92dvh; overflow-y: auto; padding: 14px; }
  .dialog-buttons { flex-wrap: wrap; }
}

@media (max-width: 390px) {
  .workspace-header { padding-right: 7px; padding-left: 7px; }
  .workspace-title { gap: 5px; }
  .workspace-header h1 { font-size: 15px; }
  .account-picker select { width: 29vw; }
  .kpi { grid-template-columns: 23px minmax(0, 1fr); gap: 5px; padding: 9px 6px; }
  .kpi-icon { width: 23px; height: 23px; font-size: 15px; }
  .chart-live-readout { min-width: 78px; }
  .chart-live-readout b { font-size: 12px; }
  .trade-fields { gap: 7px; }
  .mobile-shortcuts { gap: 5px; }
}

@media (max-width: 660px) {
  .sidebar .nav-item[data-nav="settings"],
  .risk-rules-card [data-nav="settings"],
  .tabs .tab[data-tab="settings"],
  #tab-settings { display: none !important; }
}