/* STRATREX · Interface 1.6 | 2026-11-04
   Authorial finishing: true-to-brand gold, iconography, mobile hierarchy.
   Layout-only: no change to data fetches, calculations, account state or 50/50 semantics. */
:root{--stx-gold:#e0b75d;--stx-bright:#f5dc99;--stx-gold-edge:#6b4c24;--stx-coal:#0d0c0a}
.stratrex-strategy-dock{display:flex;align-items:center;justify-content:space-between;gap:22px;margin:0 0 30px;padding:14px 18px 14px 19px;border:1px solid #3b3020;border-left:2px solid #ba8f41;border-radius:9px;background:linear-gradient(101deg,#15120f,#10100f 70%);box-shadow:inset 0 1px 0 #dab7620d}
.stratrex-strategy-caption{display:grid;gap:5px;min-width:0}
.stratrex-strategy-caption>span{font-size:9px;line-height:1.4;letter-spacing:2px;color:#c6a260;font-weight:750}
.stratrex-strategy-caption>strong{font-size:12px;line-height:1.35;letter-spacing:.1px;color:#c5bdad;font-weight:500}
.stratrex-strategy-dock .strategy-toggle{flex-shrink:0;background:linear-gradient(145deg,#292118,#17140f);border-color:#80633b;box-shadow:inset 0 1px 0 #d8b0611b;min-height:39px;padding:9px 13px;color:#f0d08d}
.stratrex-strategy-dock .strategy-toggle.off{background:#171717;border-color:#45403a;color:#c4b9a6}
.stratrex-strategy-dock .strategy-toggle:focus-visible{outline:2px solid #f3c974}
.nav-icon{display:grid;place-items:center;width:26px}
.nav-icon svg{width:21px;height:21px;filter:drop-shadow(0 0 3px #b88d3330)}
.nav-item.selected .nav-icon svg{color:#f7d98d}
.stratrex-hero-symbol{width:45px;height:45px;background:linear-gradient(145deg,#3c3021,#211b11)!important;border:1px solid #826031!important;border-radius:10px!important;display:grid;place-items:center;color:#f3c96d!important;box-shadow:inset 0 1px #f5d98c2d,0 0 20px #be8c2920;font-size:0}
.stratrex-hero-symbol svg{width:25px;height:25px;filter:drop-shadow(0 0 3px #e0b45558)}
.metric.small-metric{position:relative;padding-right:42px}
.stratrex-small-symbol{position:absolute;right:14px;top:15px;display:grid;place-items:center;width:26px;height:26px;color:#c7a055!important;background:#3c321c50;border:1px solid #564524;border-radius:7px}
.stratrex-small-symbol svg{width:16px;height:16px}
.wallet-head>span:has(svg){display:grid;place-items:center;flex-shrink:0;width:35px;height:35px;border:1px solid #76582c!important;background:#302718!important;color:#e7be68!important}
.wallet-head>span svg{width:21px;height:21px}
.platform-icon{font-size:0!important;line-height:0;background:#0b0a08 url("/assets/stratrex-king-mini.svg") center/78% no-repeat!important;border:1px solid #8b6a35!important;box-shadow:inset 0 0 8px #9f7b2a2b,0 0 12px #b28b3920;border-radius:9px!important}
.platform-title{gap:13px}
.platform-card:hover .platform-icon{border-color:#d1a452!important;box-shadow:inset 0 0 8px #9f7b2a4f,0 0 15px #b28b3940}
@media(min-width:781px){.stratrex-strategy-dock{margin-top:-8px}.stratrex-topbar-wordmark{display:none}}
@media(max-width:780px){
 .topbar{display:flex!important;align-items:center!important;justify-content:space-between!important;min-height:78px!important;height:78px!important;padding:8px 14px 7px 15px!important;gap:10px;background:#080808!important}
 .topbar-left{display:flex!important;align-items:center!important;flex:1 1 auto;min-width:0;gap:0!important;white-space:nowrap}
 .topbar-left .online-dot,.stratrex-topbar-label{display:none!important}
 .stratrex-topbar-wordmark{display:block!important;width:min(60vw,260px)!important;max-width:100%!important;height:56px!important;object-fit:contain!important;object-position:left center!important;mix-blend-mode:screen}
 .topbar-right{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:10px!important;flex:0 0 auto!important;width:auto!important}
 .topbar .user-badge{display:none!important}
 .account-quick{width:38px!important;height:38px!important;flex:0 0 38px!important;border:1px solid #84642e!important;box-shadow:0 0 0 1px #caad5430}
 .icon-button{display:grid!important;place-items:center;height:38px;width:38px;padding:0!important;border-radius:9px!important;font-size:20px;color:#dfb968!important;background:linear-gradient(130deg,#211b12,#13110d)!important;border:1px solid #5c4929!important}
 .content{padding-top:18px!important;padding-bottom:calc(108px + env(safe-area-inset-bottom))!important}
 .stratrex-strategy-dock{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;margin:0 0 23px;padding:12px 12px 12px 14px;border-radius:9px;border-left:2px solid #d1a24f;min-height:62px}
 .stratrex-strategy-caption>span{font-size:9px;letter-spacing:1.35px}
 .stratrex-strategy-caption>strong{display:none}
 .stratrex-strategy-dock .strategy-toggle{padding:8px 9px;gap:8px;font-size:10px;min-height:36px;max-width:225px;white-space:normal;text-align:left}
 .stratrex-strategy-dock .strategy-toggle span{max-width:145px;line-height:1.2}
 .stratrex-strategy-dock .strategy-toggle i{flex-shrink:0;width:34px;height:19px}
 .stratrex-strategy-dock .strategy-toggle i:after{width:13px;height:13px;left:18px;top:3px}
 .stratrex-strategy-dock .strategy-toggle.off i:after{left:3px}
 .stratrex-hero-symbol{width:44px;height:44px}
 .metric.small-metric{padding-right:36px}
 .stratrex-small-symbol{right:9px;top:12px;width:23px;height:23px}
 .mobile-nav{height:calc(76px + env(safe-area-inset-bottom))!important;display:flex!important;align-items:stretch;gap:7px;padding:7px 10px calc(8px + env(safe-area-inset-bottom))!important;background:linear-gradient(180deg,#16130f,#080808 40%)!important;border-top:1px solid #68522c!important;box-shadow:0 -8px 28px #0009,0 -1px 12px #b68b2422;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
 .mobile-nav button{position:relative;display:flex!important;flex-direction:column;align-items:center;justify-content:center;min-width:0!important;flex:1 1 0;gap:3px;padding:4px 0 3px;border:1px solid transparent;border-radius:9px;color:#938b7b!important;background:transparent!important;font-size:14px!important;transition:color .18s,border-color .18s,background .18s}
 .mobile-nav button .nav-glyph{height:27px;width:31px;display:grid;place-items:center}
 .mobile-nav button svg{width:24px;height:24px;stroke-width:1.65;transition:filter .18s}
 .mobile-nav button small{font-size:10px!important;letter-spacing:.1px;line-height:1.4;color:inherit;font-weight:560}
 .mobile-nav button.selected{color:#f1cf83!important;background:linear-gradient(180deg,#a8832b24,#38291413)!important;border-color:#66502e77;box-shadow:inset 0 1px #bd9a4930}
 .mobile-nav button.selected:before{content:"";position:absolute;top:-8px;left:calc(50% - 14px);width:28px;height:2px;border-radius:2px;background:linear-gradient(90deg,#94713c,#fbe2a4,#94713c);box-shadow:0 0 13px #d2a448b5}
 .mobile-nav button.selected svg{filter:drop-shadow(0 0 6px #d8ae6380)}
}
@media(max-width:390px){
 .topbar{padding-left:9px!important;padding-right:9px!important;gap:5px}
 .stratrex-topbar-wordmark{width:57vw!important;height:52px!important}
 .topbar-right{gap:6px!important}
 .account-quick,.icon-button{width:35px!important;height:35px!important;flex-basis:35px!important}
 .stratrex-strategy-dock{gap:7px;padding-left:9px;padding-right:9px}
 .stratrex-strategy-dock .strategy-toggle{max-width:203px}
 .stratrex-strategy-caption>span{letter-spacing:.9px}
 .mobile-nav{gap:3px;padding-left:5px!important;padding-right:5px!important}
 .mobile-nav button small{font-size:9.5px!important}
}
@media(prefers-reduced-motion:reduce){.mobile-nav button,.mobile-nav button svg{transition:none!important}}

/* STRATREX / Four-card alignment correction | 2026-11-04
   Structured row alignment prevents short and wrapped titles drifting around
   independently positioned glyphs; numerical content remains unchanged. */
.stats-grid .metric.small-metric{
  display:grid;
  grid-template-columns:minmax(0,1fr) 34px;
  grid-template-rows:minmax(52px,auto) auto minmax(0,1fr);
  column-gap:10px;
  row-gap:8px;
  align-content:start;
  align-items:start;
  min-width:0;
  padding:19px;
}
.stats-grid .small-metric > span:not(.stratrex-small-symbol){
  grid-column:1;
  grid-row:1;
  align-self:center;
  min-width:0;
  line-height:1.42;
  margin:0;
}
.stats-grid .small-metric > .stratrex-small-symbol{
  grid-column:2;
  grid-row:1;
  position:static;
  top:auto;
  right:auto;
  align-self:center;
  justify-self:end;
  flex-shrink:0;
  width:34px;
  height:34px;
  margin:0;
}
.stats-grid .small-metric > .stratrex-small-symbol svg{
  width:19px;
  height:19px;
  display:block;
}
.stats-grid .small-metric > strong{
  grid-column:1/-1;
  grid-row:2;
  align-self:start;
  min-width:0;
  margin:0;
  line-height:1.25;
}
.stats-grid .small-metric > small{
  grid-column:1/-1;
  grid-row:3;
  align-self:start;
  line-height:1.5;
  margin:0;
}
@media(max-width:780px){
  .stats-grid .metric.small-metric{
    grid-template-columns:minmax(0,1fr) 29px;
    grid-template-rows:minmax(68px,auto) auto minmax(0,1fr);
    column-gap:7px;
    row-gap:9px;
    padding:15px 13px;
  }
  .stats-grid .small-metric > .stratrex-small-symbol{
    width:29px;
    height:29px;
  }
  .stats-grid .small-metric > .stratrex-small-symbol svg{
    width:17px;
    height:17px;
  }
}
@media(max-width:370px){
  .stats-grid .metric.small-metric{
    grid-template-columns:minmax(0,1fr) 26px;
    grid-template-rows:minmax(76px,auto) auto minmax(0,1fr);
    column-gap:5px;
    padding:14px 10px;
  }
  .stats-grid .small-metric > .stratrex-small-symbol{
    width:26px;height:26px;
  }
  .stats-grid .small-metric > .stratrex-small-symbol svg{width:16px;height:16px}
}