/* ══════════════════════════════════════════════════════════════════════
   FOREX AI — Auto Trader + connected PropPass presentation layer
   ══════════════════════════════════════════════════════════════════════ */
#tab-autotrade{background:var(--bg);min-height:100vh;overflow-x:hidden}
/* Auto Trading redesign (2026-09): dense, sharp-edged terminal look
   matching the pipnex reference exactly, in both of Davin's own themes
   (gold/teal accent, not pipnex's purple) and on both mobile and desktop.
   Corners are small (6-10px, not the 15-20px "pill" look from the previous
   pass), borders are 1px hairlines, controls are compact (34-36px), and
   type is small/tight-tracked like a real trading terminal rather than a
   generic mobile app screen. */
#at-redesign-shell{flex-shrink:0;background:var(--bg2);border-bottom:1px solid var(--border)}
/* .at-redesign-head / .at-brand-mark / .at-head-copy / .at-session-state /
   .at-control-card / .at-live-row retired (this pass): that was a full
   branded header (logo, title, description, state badge) + a separate
   control card + the Start Session button pulled out of its normal
   floating position — five stacked blocks eating vertical space above
   the chart on every load, on top of the ".at-kpis/.at-ai-strip" issue
   already fixed once before (see comment below). Reported again as "the
   control center should be somewhere else, let the chart take up the
   screen like Live Chart does."
   Replaced with ONE thin row (.at-thin-header) matching the standalone
   Live Chart tab's own header exactly — see css/style.css .lc-header:
   a single flex row, ~10px/14px/8px padding, flex-shrink:0. Mode, pair,
   timeframe, live price, and the execution-gate reading all live in
   that one row; the sub-tab buttons are a second thin icon-only row
   (.at-thin-tabs) rather than a padded button grid. */
.at-thin-header{display:flex;align-items:center;gap:6px;padding:8px 10px;flex-shrink:0}
.at-thin-mode{display:flex;align-items:center;gap:3px;background:var(--accent-bg,var(--bg));border:1px solid rgba(240,180,41,.4);color:var(--gold);font-size:11px;font-weight:700;padding:6px 8px;border-radius:8px;white-space:nowrap;font-family:inherit;flex-shrink:0}
.at-thin-select{background:var(--bg);border:1px solid var(--border);color:var(--text);font-size:11px;font-weight:600;padding:6px 6px;border-radius:8px;min-width:0;flex:1;font-family:inherit}
.at-thin-tf{flex:0 0 62px}
.at-thin-price{font-size:12px;font-weight:800;color:var(--text);white-space:nowrap;flex-shrink:0}
.at-thin-gate{flex-shrink:0;padding:3px 7px;border-radius:6px;font-size:9px;font-weight:800;letter-spacing:.4px;border:1px solid var(--border);color:var(--text2);background:var(--bg)}
.at-thin-gate.at-gate-execute{color:#22c55e;border-color:rgba(34,197,94,.35);background:rgba(34,197,94,.08)}
.at-thin-gate.at-gate-watch{color:var(--gold);border-color:rgba(240,180,41,.35);background:rgba(240,180,41,.08)}
.at-thin-gate.at-gate-blocked{color:var(--red,#ef4444);border-color:rgba(239,68,68,.35);background:rgba(239,68,68,.08)}
.at-thin-gate.at-gate-neutral{color:var(--text2);border-color:var(--border);background:var(--bg)}
.at-thin-lock{font-size:11px;flex-shrink:0}
/* .at-kpis / .at-ai-strip retired (2026-09): the KPI grid + AI thesis strip
   they styled duplicated content that already exists properly inside
   #saViewAnalysis (SETUP HEALTH score, TRADE THESIS regime/plan grid — see
   index.html) and, because it was mounted unconditionally above the chart,
   squeezed the Chart subtab's chart into a short strip. Replaced by the
   single .at-thin-gate chip in the thin header (see above) for the one
   thing that block added which didn't already exist elsewhere. */
.at-thin-tabs{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--border);flex-shrink:0}
.at-thin-tabs button{border:0;border-right:1px solid var(--border);background:transparent;color:var(--text2);padding:7px 4px;font-size:15px;line-height:1;font-family:inherit}
.at-thin-tabs button:last-child{border-right:0}
.at-thin-tabs button.on{background:rgba(240,180,41,.14);color:var(--gold)}
/* Start Session deliberately keeps its ORIGINAL floating position
   (position:absolute;bottom:0 — see index.html's base .sa-bottom-bar
   rule) instead of being pulled into document flow here, so it never
   consumes space the chart could use. No .at-redesign-startbar override
   needed this pass. */
/* Desktop (>=768px): reference-style two-column layout — controls/tabs in
   a fixed-width left rail, chart/analysis content filling the rest, so the
   chart isn't stretched full-bleed across a wide viewport. */
@media(min-width:768px){
  #tab-autotrade.active{flex-direction:row!important}
  #at-redesign-shell{width:300px;flex-shrink:0;border-right:1px solid var(--border);height:100vh;overflow-y:auto;flex-direction:column}
  #at-redesign-shell ~ .sa-subview{flex:1}
  .at-thin-header{flex-wrap:wrap}
}
/* Hide old duplicated command layer and old header/subtabs. The functional views remain. */
#at-pro-command{display:none!important}.sa-header{display:none!important}.sa-subtabs{display:none!important}
#saViewChart,#saViewAnalysis,#saViewSessions{margin-top:10px}.sa-chart-container{border-radius:15px;overflow:hidden;border:1px solid var(--border);background:#08090c}.sa-narration-bar{border-radius:12px;margin-top:8px;border:1px solid rgba(0,212,170,.18);background:rgba(0,212,170,.045);min-height:48px}.sa-narration-text{font-size:12px;line-height:1.45}.sa-scroll{padding-bottom:14px}.sa-card{border-radius:14px!important;border-color:var(--border)!important;background:var(--bg2)!important;box-shadow:none!important}.sa-card-header{min-height:40px}.sa-bottom-bar{z-index:auto}
@media(max-width:370px){.at-thin-header{padding:6px 8px;gap:4px}.at-thin-mode{padding:6px 6px;font-size:10px}.at-thin-price{font-size:11px}}

/* Connected PropPass reference-style surface */
.pp-ref-shell{min-height:100vh;background:radial-gradient(circle at 50% -10%,rgba(139,92,246,.11),transparent 32%),#0b0b11;padding:0 14px 104px;color:#eee}.pp-ref-top{height:58px;display:flex;align-items:center;gap:11px;border-bottom:1px solid rgba(255,255,255,.07);margin:0 -14px;padding:0 16px;background:#0b0b11;position:sticky;top:0;z-index:4}.pp-ref-top>button{border:0;background:transparent;color:#b8b8c4;font-size:32px;line-height:1;padding:0}.pp-ref-brand{font-size:20px;color:#fff}.pp-ref-brand:first-letter{color:#8b5cf6}.pp-ref-brand em{color:#9b72ff;font-style:normal}.pp-ref-online{margin-left:auto;font-size:9px;font-weight:800;color:#22c55e;display:flex;gap:5px;align-items:center}.pp-ref-online i,.pp-ref-live-dot,.pp-ref-green-dot{width:7px;height:7px;border-radius:50%;display:inline-block;background:#22c55e}.pp-ref-hero{padding:18px 0 13px}.pp-ref-hero small{font-size:9px;letter-spacing:1.4px;color:#9b72ff;font-weight:800}.pp-ref-hero h1{font-size:27px;margin:3px 0}.pp-ref-hero p{font-size:12px;color:#9c9ca8;margin:0;line-height:1.45}.pp-ref-hero-actions{display:flex;gap:7px;margin-top:12px}.pp-ref-hero-actions button{height:38px;border:1px solid rgba(139,92,246,.3);background:#15151d;color:#ddd;border-radius:10px;padding:0 12px;font-weight:700}.pp-ref-hero-actions button:last-child{margin-left:auto;background:#8b5cf6;color:#fff;border-color:#8b5cf6}.pp-ref-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;padding:4px;background:#191920;border-radius:20px;border:1px solid rgba(255,255,255,.06);margin-bottom:10px}.pp-ref-tabs button{border:0;background:transparent;color:#8f8f9b;padding:9px 3px;border-radius:15px;font-size:10px;font-weight:700;white-space:nowrap;overflow:hidden}.pp-ref-tabs button.on{background:#0e0e14;color:#fff;box-shadow:0 1px 4px rgba(0,0,0,.4)}.pp-ref-page{display:grid;gap:10px}.pp-ref-card{background:linear-gradient(145deg,#15151d,#121219);border:1px solid rgba(255,255,255,.065);border-radius:16px;padding:14px;box-shadow:0 10px 30px rgba(0,0,0,.13)}.pp-ref-account-card{display:flex;align-items:center;gap:10px}.pp-ref-account-icon{width:42px;height:42px;border-radius:12px;background:#211b38;color:#a276ff;display:grid;place-items:center;font-size:19px}.pp-ref-account-main{min-width:0;flex:1}.pp-ref-account-name{font-size:14px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pp-ref-account-id{color:#777783;margin-left:4px;font-weight:500}.pp-ref-account-name b{font-size:9px;border:1px solid #353542;padding:3px 6px;border-radius:10px;margin-left:4px;color:#bbb}.pp-ref-account-meta{font-size:10px;color:#9b9ba6;margin-top:5px;display:flex;align-items:center;gap:5px}.pp-ref-danger-link{border:0;background:transparent;color:#ff6a73;font-weight:700;font-size:11px}.pp-ref-challenge-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.pp-ref-challenge-title{display:flex;gap:10px}.pp-ref-challenge-icon{width:38px;height:38px;border-radius:11px;background:#211b38;color:#a276ff;display:grid;place-items:center}.pp-ref-challenge-title strong{font-size:16px}.pp-ref-challenge-title div div{margin-top:4px;color:#aaa;font-size:10px}.pp-ref-challenge-title em{font-style:normal;border:1px solid rgba(139,92,246,.35);color:#a276ff;border-radius:10px;padding:2px 6px;margin-left:4px}.pp-ref-status-pill{border:1px solid rgba(245,158,11,.4);color:#f59e0b;background:rgba(245,158,11,.06);padding:7px 10px;border-radius:20px;font-size:9px;font-weight:800;white-space:nowrap}.pp-ref-metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.pp-ref-metric{background:#1a1a22;border-radius:12px;padding:11px;min-width:0}.pp-ref-metric label,.pp-ref-small label{display:block;color:#9898a4;font-size:9px;letter-spacing:1.1px;font-weight:700}.pp-ref-metric strong{display:block;font-size:19px;margin-top:5px}.pp-ref-metric span{display:block;color:#9b9ba6;font-size:10px;margin-top:3px}.pp-ref-metric .up,.up{color:#10b981}.pp-ref-metric .down,.down{color:#ef4f58}.pp-ref-progress{height:5px;background:#292932;border-radius:5px;overflow:hidden;margin-top:9px}.pp-ref-progress i{display:block;height:100%;background:#8b5cf6;border-radius:inherit}.pp-ref-challenge-foot{display:flex;gap:9px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.055);margin-top:11px;padding-top:10px;color:#9696a1;font-size:9px}.pp-ref-challenge-foot b{color:#a276ff}.pp-ref-grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.pp-ref-dd{min-height:180px;text-align:center}.pp-ref-card-title{font-size:11px;letter-spacing:1px;color:#aaa;font-weight:800}.pp-ref-dd .pp-ref-card-title{text-align:left}.pp-ref-gauge{width:126px;height:63px;margin:18px auto 4px;border-radius:126px 126px 0 0;border:9px solid #24242d;border-bottom:0;position:relative;overflow:hidden}.pp-ref-gauge:before{content:"";position:absolute;left:-9px;top:-9px;width:126px;height:63px;border-radius:126px 126px 0 0;border:9px solid transparent;border-top-color:#10b981;border-right-color:#10b981;transform:rotate(calc(-135deg + (var(--gauge-p) * 2.7)));transform-origin:63px 63px}.pp-ref-gauge span{position:absolute;left:0;right:0;bottom:2px;font-size:17px;font-weight:800;color:#10b981}.pp-ref-dd-of{font-size:10px;color:#a0a0aa}.pp-ref-safe{display:inline-block;margin-top:9px;padding:5px 14px;border-radius:20px;background:rgba(16,185,129,.10);color:#10b981;font-size:9px}.pp-ref-safe.warning{color:#f59e0b;background:rgba(245,158,11,.1)}.pp-ref-safe.danger{color:#ef4f58;background:rgba(239,79,88,.1)}.pp-ref-small{min-height:93px}.pp-ref-small strong{display:block;font-size:22px;margin-top:10px}.pp-ref-small span{display:block;color:#9b9ba6;font-size:10px;margin-top:3px}.pp-ref-checks{margin-top:0}.pp-ref-rule-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:10px}.pp-ref-rule-grid>div{background:#1a1a22;border-radius:10px;padding:9px}.pp-ref-rule-grid b,.pp-ref-rule-grid span{display:block}.pp-ref-rule-grid b{font-size:9px;color:#9d9da8}.pp-ref-rule-grid span{font-size:10px;margin-top:5px;font-weight:700}.pp-ref-progress-page h3,.pp-ref-auto-card h3{margin:0;font-size:20px}.pp-ref-progress-page p,.pp-ref-auto-card p{color:#9d9da8;font-size:12px;line-height:1.5}.pp-ref-big-progress{margin-top:18px}.pp-ref-big-progress>div:first-child{display:flex;justify-content:space-between;color:#aaa;font-size:11px}.pp-ref-big-progress b{color:#fff}.pp-ref-progress-stats{margin-top:12px}.pp-ref-auto-status{display:flex;align-items:center;gap:7px;color:#aaa;font-size:11px;margin:14px 0}.pp-ref-auto-status span{width:8px;height:8px;border-radius:50%;background:#777}.pp-ref-auto-status.live{color:#10b981}.pp-ref-auto-status.live span{background:#10b981;box-shadow:0 0 10px rgba(16,185,129,.6)}.pp-ref-primary{width:100%;height:46px;border:0;border-radius:12px;background:#8b5cf6;color:#fff;font-weight:800}.pp-ref-history-row{display:flex;justify-content:space-between;align-items:center;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.06)}.pp-ref-history-row:last-child{border-bottom:0}.pp-ref-history-row b{font-size:12px}.pp-ref-history-row small{display:block;color:#8f8f9a;font-size:9px;margin-top:3px}.pp-ref-empty{text-align:center;color:#888;padding:35px 0;font-size:12px}.pp-ref-bottom{position:fixed;left:14px;right:14px;bottom:12px;height:64px;background:rgba(20,20,28,.96);border:1px solid rgba(255,255,255,.09);border-radius:30px;display:grid;grid-template-columns:repeat(5,1fr);align-items:center;z-index:20;box-shadow:0 12px 40px rgba(0,0,0,.45);backdrop-filter:blur(12px)}.pp-ref-bottom button{height:100%;border:0;background:transparent;color:#a2a2ad;font-size:18px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}.pp-ref-bottom button span{font-size:9px}.pp-ref-bottom button.active{color:#a276ff}.pp-ref-bottom button.active:first-line{font-size:22px}
@media(max-width:370px){.pp-ref-shell{padding-left:9px;padding-right:9px}.pp-ref-top{margin-left:-9px;margin-right:-9px;padding-left:11px;padding-right:11px}.pp-ref-grid2{gap:7px}.pp-ref-card{padding:11px}.pp-ref-metric strong{font-size:17px}.pp-ref-bottom{left:9px;right:9px}}
/* Legacy override block removed (2026-09): it forced #tab-autotrade into a
   scrollable document (display:block, chart fixed at 360px) instead of the
   reference's fixed-viewport layout (header+controls, then chart fills all
   remaining height, content lives in separate tabs rather than one long
   scroll). index.html's own #tab-autotrade.active{display:flex;...
   height:100vh} plus .sa-chart-container{flex:1} already implement the
   reference layout correctly — this block was overriding that with
   !important. Removed per explicit request to match the pipnex reference
   exactly. If short-screen devices show narration/analysis covering the
   chart again, that's this trade-off resurfacing — re-add a scoped fix
   (e.g. a min-height on .sa-chart-container rather than reverting to
   block layout) rather than restoring this whole block. */