:root{
  --community-bg:#020814;--community-bg2:#06111f;--community-panel:rgba(8,22,37,.86);--community-panel2:rgba(11,31,52,.92);--community-card:rgba(10,26,44,.78);--community-gold:#f2c76a;--community-gold2:#c8952e;--community-text:#f7fbff;--community-muted:#9fb0c3;--community-line:rgba(242,199,106,.18);--community-line2:rgba(255,255,255,.09);--community-green:#58d878;--community-red:#ff6868;--community-blue:#4ea5ff;--community-cyan:#65e6ff;--community-radius:20px;--community-shadow:0 20px 70px rgba(0,0,0,.38)
}
html[data-theme="light"]{--community-bg:#f6f8fc;--community-bg2:#eef3f9;--community-panel:rgba(255,255,255,.92);--community-panel2:rgba(247,249,252,.95);--community-card:rgba(255,255,255,.9);--community-text:#09182a;--community-muted:#657386;--community-line:rgba(200,149,46,.24);--community-line2:rgba(9,24,42,.1);--community-shadow:0 18px 50px rgba(8,24,42,.12)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;color:var(--community-text);font-family:Inter,'Noto Sans Thai',Arial,sans-serif;background:radial-gradient(circle at 78% 0,rgba(242,199,106,.14),transparent 30%),radial-gradient(circle at 12% 10%,rgba(78,165,255,.11),transparent 28%),linear-gradient(145deg,var(--community-bg),var(--community-bg2) 58%,#020814);overflow-x:hidden}html[data-theme="light"] body{background:radial-gradient(circle at 78% 0,rgba(242,199,106,.27),transparent 28%),radial-gradient(circle at 12% 10%,rgba(78,165,255,.14),transparent 30%),linear-gradient(145deg,var(--community-bg),var(--community-bg2))}a{color:inherit;text-decoration:none}.community-shell{width:min(1260px,calc(100% - 40px));margin:0 auto}.community-header{position:sticky;top:0;z-index:30;background:rgba(2,8,20,.82);backdrop-filter:blur(18px);border-bottom:1px solid var(--community-line2)}html[data-theme="light"] .community-header{background:rgba(255,255,255,.82)}.community-nav{height:66px;display:flex;align-items:center;gap:18px}.community-brand{display:flex;align-items:center}.community-brand img{width:118px;max-height:52px;object-fit:contain;display:block;filter:drop-shadow(0 10px 24px rgba(242,199,106,.12))}.community-menu{display:flex;gap:6px;margin-left:auto;align-items:center}.community-menu a{font-size:12.5px;font-weight:900;letter-spacing:.01em;padding:10px 12px;border-radius:13px;color:var(--community-muted);white-space:nowrap}.community-menu a:hover,.community-menu a.active{color:var(--community-gold);background:rgba(242,199,106,.08)}.community-actions{display:flex;gap:8px;align-items:center}.community-theme-toggle,.lang-trigger{height:38px;border:1px solid var(--community-line);border-radius:14px;background:rgba(255,255,255,.05);color:var(--community-text);font-weight:900;padding:0 12px;display:flex;align-items:center;gap:8px}.community-hero{position:relative;padding:46px 0 24px;overflow:hidden}.hero-orb{position:absolute;border-radius:999px;filter:blur(10px);opacity:.42;pointer-events:none}.hero-orb-a{width:310px;height:310px;right:-90px;top:-90px;background:radial-gradient(circle,rgba(242,199,106,.33),transparent 70%)}.hero-orb-b{width:260px;height:260px;left:-120px;bottom:0;background:radial-gradient(circle,rgba(78,165,255,.20),transparent 72%)}.hero-grid{display:block}.hero-copy{max-width:900px}.eyebrow{margin:0 0 10px;color:var(--community-gold);font-size:11.5px;font-weight:950;letter-spacing:.16em;text-transform:uppercase}.hero-copy h1{font-size:clamp(34px,4vw,54px);line-height:1.02;margin:0 0 16px;letter-spacing:-.055em;font-weight:950}.hero-lead{max-width:760px;color:var(--community-muted);font-size:16px;line-height:1.82;margin:0 0 20px}.hero-actions{display:flex;gap:11px;flex-wrap:wrap}.btn{border:0;border-radius:15px;padding:12px 17px;font-weight:950;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px}.btn-gold{background:linear-gradient(135deg,var(--community-gold),var(--community-gold2));color:#07101f;box-shadow:0 14px 30px rgba(242,199,106,.22)}.btn-ghost{background:rgba(255,255,255,.05);border:1px solid var(--community-line);color:var(--community-text)}.trust-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:19px}.trust-row span{font-size:11.5px;font-weight:900;color:var(--community-muted);padding:8px 11px;border-radius:999px;border:1px solid var(--community-line2);background:rgba(255,255,255,.04)}
.showcase-panel,.showcase-card,.detail-drawer{background:linear-gradient(180deg,var(--community-panel),rgba(5,15,26,.74));border:1px solid var(--community-line);border-radius:var(--community-radius);box-shadow:var(--community-shadow);position:relative;overflow:hidden}.showcase-card:before,.showcase-panel:before,.detail-drawer:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(242,199,106,.11),transparent 24%,transparent 72%,rgba(78,165,255,.07));pointer-events:none}.showcase-panel{padding:22px;margin:18px auto 70px}.showcase-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:17px}.showcase-head h2{margin:0;font-size:28px;letter-spacing:-.04em}.showcase-head p:not(.eyebrow){margin:7px 0 0;color:var(--community-muted);line-height:1.65}.pro-filter-panel{position:sticky;top:66px;z-index:10;padding:13px;border-radius:20px;background:rgba(3,12,24,.78);border:1px solid var(--community-line2);backdrop-filter:blur(14px);margin-bottom:18px}.filter-row{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.primary-filter-row{margin-bottom:11px}.filter-chip{border:1px solid var(--community-line2);background:rgba(255,255,255,.045);color:var(--community-muted);height:36px;border-radius:999px;padding:0 13px;font-weight:950;cursor:pointer}.filter-chip:hover,.filter-chip.active{border-color:rgba(242,199,106,.42);color:var(--community-gold);background:rgba(242,199,106,.1);box-shadow:0 0 0 4px rgba(242,199,106,.04)}.search-box{height:42px;min-width:min(100%,310px);flex:1;display:flex;align-items:center;gap:8px;border:1px solid var(--community-line2);border-radius:15px;padding:0 13px;background:rgba(255,255,255,.05)}.search-box input{width:100%;border:0;outline:0;background:transparent;color:var(--community-text);font:inherit;font-weight:800}.search-box input::placeholder{color:rgba(159,176,195,.68)}.select-wrap{height:42px;display:flex;align-items:center;gap:8px;border:1px solid var(--community-line2);border-radius:15px;padding:0 10px;background:rgba(255,255,255,.05);color:var(--community-muted);font-size:12px;font-weight:900}.select-wrap select{border:0;outline:0;background:transparent;color:var(--community-text);font-weight:950;min-width:102px}.select-wrap option{color:#09182a}.loading-state,.empty-state{padding:28px;border:1px dashed var(--community-line);border-radius:18px;text-align:center;color:var(--community-muted);font-weight:900}.empty-state strong{display:block;color:var(--community-text);font-size:20px;margin-bottom:8px}.showcase-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(315px,1fr));gap:14px}.showcase-card{padding:15px;min-height:342px;display:flex;flex-direction:column;gap:11px;transition:.2s ease;isolation:isolate}.showcase-card:hover{transform:translateY(-4px);border-color:rgba(242,199,106,.42);box-shadow:0 24px 75px rgba(0,0,0,.46),0 0 0 1px rgba(242,199,106,.08)}.card-top{display:flex;justify-content:space-between;gap:8px;align-items:center}.type-badge,.status-badge,.micro-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border-radius:999px;font-size:10.5px;font-weight:950;letter-spacing:.04em;text-transform:uppercase;border:1px solid var(--community-line2);background:rgba(255,255,255,.05);color:var(--community-muted)}.type-badge{color:var(--community-gold);border-color:rgba(242,199,106,.28)}.status-badge.online{color:var(--community-green);border-color:rgba(88,216,120,.35);background:rgba(88,216,120,.08)}.status-badge.offline{color:var(--community-muted)}.card-title{margin:2px 0 5px;font-size:19px;line-height:1.16;letter-spacing:-.04em}.card-meta{color:var(--community-muted);line-height:1.55;font-size:12.5px;font-weight:750}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.metric{padding:9px;border-radius:14px;border:1px solid var(--community-line2);background:rgba(255,255,255,.045);min-width:0}.metric small{display:block;font-size:9.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--community-muted);font-weight:950;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.metric strong{display:block;margin-top:5px;font-size:14px;font-weight:950;letter-spacing:-.03em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.positive{color:var(--community-green)!important}.negative{color:var(--community-red)!important}.chart-shell{position:relative;border:1px solid var(--community-line2);border-radius:17px;background:radial-gradient(circle at 18% 15%,rgba(242,199,106,.12),transparent 34%),rgba(255,255,255,.035);padding:9px;overflow:hidden}.chart-shell:after{content:"";position:absolute;left:10px;right:10px;top:50%;border-top:1px dashed rgba(255,255,255,.1);pointer-events:none}.chart-caption{display:flex;justify-content:space-between;color:var(--community-muted);font-size:10.5px;font-weight:950;margin-bottom:5px}.spark-svg{width:100%;height:92px;display:block;overflow:visible;color:var(--community-gold)}.spark-line{fill:none;stroke:var(--community-gold);stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 10px rgba(242,199,106,.52))}.spark-balance{fill:none;stroke:rgba(101,230,255,.78);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 8px rgba(101,230,255,.24))}.spark-area{fill:var(--community-gold);opacity:.14}.spark-dot{fill:var(--community-gold);filter:drop-shadow(0 0 10px rgba(242,199,106,.72))}.risk-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}.risk-meter{height:7px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden}.risk-meter i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--community-green),var(--community-gold),var(--community-red));width:20%}.card-actions{margin-top:auto;display:flex;justify-content:space-between;align-items:center;gap:10px}.detail-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.58);z-index:60;backdrop-filter:blur(6px)}.detail-drawer{position:fixed;right:12px;top:12px;bottom:12px;width:min(980px,calc(100vw - 24px));z-index:70;transform:translateX(110%);transition:.25s ease;padding:0;overflow:auto}.detail-drawer.open{transform:translateX(0)}.detail-close{position:sticky;top:12px;margin-left:auto;right:12px;z-index:2;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:14px;border:1px solid var(--community-line);background:rgba(255,255,255,.08);color:var(--community-text);font-size:26px;cursor:pointer}.detail-inner{padding:24px}.detail-hero{display:grid;grid-template-columns:1fr 180px;gap:16px;align-items:start}.detail-title{margin:0;font-size:32px;letter-spacing:-.055em;line-height:1.06}.detail-sub{margin:9px 0 0;color:var(--community-muted);font-weight:800;line-height:1.65}.detail-score{border:1px solid var(--community-line);border-radius:20px;background:rgba(255,255,255,.045);padding:16px;text-align:center}.detail-score strong{display:block;font-size:42px;line-height:1;font-weight:950;color:var(--community-gold)}.detail-score span{color:var(--community-muted);font-weight:900}.detail-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:18px 0}.detail-metrics .metric{padding:12px}.detail-metrics .metric strong{font-size:17px}.detail-chart-grid{display:grid;grid-template-columns:1.4fr .8fr;gap:12px;margin:14px 0}.big-chart,.side-chart,.trade-panel,.info-panel{border:1px solid var(--community-line2);border-radius:20px;background:rgba(255,255,255,.04);padding:15px}.big-chart h3,.side-chart h3,.trade-panel h3,.info-panel h3{margin:0 0 10px;font-size:14px;letter-spacing:.02em}.big-svg{height:230px}.drawdown-bars{display:flex;align-items:flex-start;gap:4px;height:190px;padding-top:16px;border-top:1px dashed rgba(255,255,255,.12)}.drawdown-bars i{flex:1;display:block;border-radius:0 0 8px 8px;background:linear-gradient(180deg,rgba(255,104,104,.95),rgba(200,50,50,.2));min-height:8px;filter:drop-shadow(0 0 8px rgba(255,104,104,.12))}.monthly-bars{height:145px;display:flex;align-items:flex-end;gap:7px}.monthly-bars i{flex:1;min-height:10px;border-radius:10px 10px 3px 3px;background:linear-gradient(180deg,var(--community-gold),rgba(242,199,106,.12));box-shadow:0 0 16px rgba(242,199,106,.08)}.detail-columns{display:grid;grid-template-columns:1fr 1fr;gap:12px}.info-list{display:grid;gap:9px}.info-list div{display:flex;justify-content:space-between;gap:12px;border-bottom:1px dashed var(--community-line2);padding-bottom:8px}.info-list span{color:var(--community-muted);font-weight:850}.info-list strong{font-weight:950;text-align:right}.trade-mini-table{width:100%;border-collapse:collapse;font-size:13px}.trade-mini-table th,.trade-mini-table td{padding:9px;border-bottom:1px solid var(--community-line2);text-align:left}.trade-mini-table th{color:var(--community-muted);font-size:11px;text-transform:uppercase;letter-spacing:.08em}.risk-note{color:var(--community-muted);line-height:1.75;border:1px solid rgba(242,199,106,.18);background:rgba(242,199,106,.06);border-radius:17px;padding:13px;font-weight:750}.pill-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
@media(max-width:1100px){.detail-chart-grid,.detail-hero,.detail-columns{grid-template-columns:1fr}.detail-metrics{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.community-shell{width:min(100% - 24px,1260px)}.community-nav{height:auto;min-height:68px;flex-wrap:wrap;padding:10px 0}.community-brand img{width:104px}.community-menu{order:3;width:100%;overflow:auto;margin-left:0;padding-bottom:4px}.community-actions{margin-left:auto}.theme-text,.lang-current-text{display:none}.community-hero{padding:32px 0 18px}.hero-copy h1{font-size:36px}.hero-lead{font-size:15px}.showcase-head{display:block}.pro-filter-panel{position:relative;top:auto}.search-box{min-width:100%}.select-wrap{width:100%;justify-content:space-between}.metric-grid{grid-template-columns:repeat(2,1fr)}.showcase-grid{grid-template-columns:1fr}.detail-drawer{right:8px;left:8px;top:8px;bottom:8px;width:auto}.detail-inner{padding:17px}.detail-title{font-size:27px}.detail-metrics{grid-template-columns:1fr}.big-svg{height:210px}}

/* =========================================================
   Step 2.4 Hotfix: precise performance cards and safe charts
========================================================= */
.metric strong,.detail-metrics .metric strong{font-variant-numeric:tabular-nums;max-width:100%}
.pro-metrics .metric strong{font-size:13.5px;line-height:1.05}
.showcase-card{min-height:330px}.chart-shell{min-height:126px}.spark-svg{height:86px}.big-chart .spark-svg.big-svg{height:238px}
.monthly-card{overflow:hidden}.monthly-bars-pro{height:178px;display:flex;align-items:flex-end;gap:8px;padding:22px 6px 22px;overflow:hidden;border-top:1px dashed rgba(255,255,255,.10)}
.monthly-bars-pro .month-bar{flex:1;min-width:34px;height:138px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:5px;position:relative;min-width:0}
.monthly-bars-pro .month-bar i{width:100%;max-width:52px;border-radius:10px 10px 4px 4px;display:block;box-shadow:0 0 16px rgba(242,199,106,.12);min-height:8px}
.monthly-bars-pro .month-bar.pos i{background:linear-gradient(180deg,#66f28b,#1d8f48)}
.monthly-bars-pro .month-bar.neg i{background:linear-gradient(180deg,#ff8f8f,#a93131)}
.monthly-bars-pro .month-value{font-size:10px;font-weight:950;white-space:nowrap;line-height:1;color:#f8fbff;text-shadow:0 2px 9px rgba(0,0,0,.55)}
.monthly-bars-pro .month-bar.pos .month-value{color:#7ff2a0}.monthly-bars-pro .month-bar.neg .month-value{color:#ff9a9a}
.monthly-bars-pro .month-bar b{font-size:9.5px;color:var(--community-muted);font-weight:900;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.detail-metrics{grid-template-columns:repeat(4,minmax(0,1fr))}.detail-metrics .metric{min-width:0}.detail-chart-grid{align-items:stretch}.trade-panel{max-height:360px;overflow:auto}.info-list strong{max-width:58%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.drawdown-bars.compact-bars{height:170px;align-items:flex-start;overflow:hidden}.drawdown-bars.compact-bars i{max-height:128px}
@media(max-width:820px){.monthly-bars-pro{gap:5px}.monthly-bars-pro .month-value{font-size:9px}.monthly-bars-pro .month-bar{min-width:26px}.detail-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* =========================================================
   Step 2.5: Safe monthly return chart labels
   Monthly return uses cumulative real deposit as base, so a
   near-zero/lost account will not show fake +2,000% recovery.
========================================================= */
.monthly-bars-pro{
  height:178px;
  align-items:stretch;
  padding:10px 8px 18px;
  overflow:hidden;
}
.monthly-bars-pro .month-bar{
  height:150px;
  padding-top:20px;
  padding-bottom:18px;
  justify-content:flex-end;
  position:relative;
}
.monthly-bars-pro .month-value{
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  max-width:68px;
  overflow:hidden;
  text-overflow:ellipsis;
  text-align:center;
  padding:1px 3px;
  border-radius:999px;
  background:rgba(2,8,20,.38);
}
.monthly-bars-pro .month-bar i{
  margin-bottom:8px;
}
.monthly-bars-pro .month-bar b{
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  text-align:center;
}
.monthly-card .detail-sub,
.monthly-card .monthly-basis-note{
  display:block;
  margin-top:8px;
  color:var(--community-muted);
  font-size:11px;
  font-weight:800;
  line-height:1.45;
}

/* Step 2.7 - real chart binding / no fake fallback */
.chart-empty-pro{
  min-height:86px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:6px;
  border:1px dashed rgba(242,199,106,.24);
  border-radius:14px;
  background:rgba(255,255,255,.035);
  color:var(--community-muted);
  text-align:center;
  padding:12px;
  font-weight:850;
}
.chart-empty-pro strong{color:var(--community-gold);font-size:13px}
.chart-empty-pro span{font-size:11px;line-height:1.45}
.chart-empty-pro.compact{min-height:142px}
.chart-source-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin:-2px 0 8px;
  padding:5px 8px;
  border-radius:999px;
  border:1px solid rgba(101,230,255,.25);
  background:rgba(101,230,255,.06);
  color:#9eefff;
  font-size:10px;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.big-chart .spark-svg.big-svg{height:250px;min-height:250px}
.chart-shell .chart-empty-pro{min-height:86px}

/* VELAEA Step 3.4 auth/session button spacing */
.public-actions .auth-action-btn,
.community-actions .auth-action-btn,
.lab-actions + .lab-profile-mini.auth-action-btn{ flex:0 0 auto; }
@media (max-width: 760px){
  .public-actions .auth-action-btn,
  .community-actions .auth-action-btn{ display:none; }
}

/* Step 3.5 - Community Allocation Donut */
.community-allocation.allocation-widget{display:grid;grid-template-columns:minmax(140px,180px) minmax(0,1fr);gap:13px;align-items:center;min-height:188px}
.community-allocation .allocation-donut{width:min(178px,100%);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;position:relative;margin:auto;box-shadow:inset 0 0 0 1px rgba(255,255,255,.10),0 16px 40px rgba(0,0,0,.24)}
.community-allocation .allocation-donut:after{content:"";position:absolute;inset:20%;border-radius:50%;background:linear-gradient(180deg,var(--community-card),var(--community-bg));box-shadow:inset 0 0 24px rgba(0,0,0,.38)}
.community-allocation .allocation-donut>div{position:relative;z-index:1;text-align:center;display:grid;gap:2px;max-width:74%;overflow:hidden}
.community-allocation .allocation-donut strong{font-size:28px;line-height:1;color:var(--community-gold);font-weight:1000;letter-spacing:-.04em}
.community-allocation .allocation-donut span{font-size:11px;color:var(--community-text);font-weight:950;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.community-allocation .allocation-legend{display:grid;gap:7px;min-width:0}
.community-allocation .allocation-legend div{display:grid;grid-template-columns:11px minmax(0,1fr) auto;align-items:center;gap:8px;padding:7px 9px;border:1px solid var(--community-line2);border-radius:12px;background:rgba(255,255,255,.035)}
.community-allocation .allocation-legend i{width:11px;height:11px;border-radius:50%}
.community-allocation .allocation-legend span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--community-text);font-weight:950;font-size:12px}
.community-allocation .allocation-legend em{font-style:normal;color:var(--community-muted);font-size:10px;margin-left:4px}
.community-allocation .allocation-legend strong{color:var(--community-gold);font-size:12px;font-weight:1000}
.community-allocation .allocation-summary{grid-column:1/-1;display:flex;justify-content:space-between;gap:8px;align-items:center;padding:9px 10px;border-radius:14px;border:1px solid rgba(242,199,106,.16);background:rgba(242,199,106,.06);color:var(--community-muted);font-weight:850;font-size:11px}
.community-allocation .allocation-summary strong{color:var(--community-gold);white-space:nowrap}
@media(max-width:720px){.community-allocation.allocation-widget{grid-template-columns:1fr}.community-allocation .allocation-donut{width:166px}.community-allocation .allocation-summary{align-items:flex-start;flex-direction:column}}


/* Step 3.6 - Professional institutional allocation palette */
.professional-allocation{--alloc-card:rgba(7,18,32,.72);--alloc-line:rgba(214,170,79,.14);--alloc-muted:rgba(159,177,200,.86);--alloc-text:var(--text,#edf4ff);--alloc-gold:#d6aa4f;}
.professional-donut{filter:saturate(.84) contrast(.98);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08), inset 0 0 34px rgba(2,8,20,.48), 0 18px 44px rgba(0,0,0,.22)!important;}
.professional-donut:before{content:"";position:absolute;inset:-1px;border-radius:50%;background:radial-gradient(circle at 42% 32%,rgba(255,255,255,.16),transparent 28%),radial-gradient(circle at 70% 80%,rgba(214,170,79,.10),transparent 30%);pointer-events:none;z-index:0;}
.professional-donut:after{background:linear-gradient(180deg,rgba(8,20,35,.96),rgba(2,8,20,.98))!important;box-shadow:inset 0 0 0 1px rgba(214,170,79,.10), inset 0 12px 28px rgba(0,0,0,.46)!important;}
.professional-donut strong{text-shadow:none!important;letter-spacing:-.035em!important;color:var(--alloc-gold)!important;}
.professional-donut span{letter-spacing:.015em;text-transform:uppercase;color:rgba(237,244,255,.88)!important;}
.professional-legend{gap:7px!important;}
.professional-legend div{border-color:rgba(214,170,79,.10)!important;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.018))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.035);}
.professional-legend i{box-shadow:0 0 0 3px rgba(255,255,255,.035),0 6px 16px rgba(0,0,0,.22)!important;}
.professional-legend .allocation-name{display:grid!important;grid-template-columns:1fr!important;gap:1px!important;min-width:0!important;white-space:normal!important;overflow:hidden!important;}
.professional-legend .allocation-name b{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--alloc-text);font-weight:950;letter-spacing:.01em;}
.professional-legend .allocation-name em{display:block;margin:0!important;color:var(--alloc-muted)!important;font-size:10px!important;line-height:1.15;font-weight:800;text-transform:uppercase;letter-spacing:.06em;}
.professional-legend strong{color:var(--alloc-gold)!important;font-variant-numeric:tabular-nums;}
.professional-summary{border-color:rgba(214,170,79,.16)!important;background:linear-gradient(180deg,rgba(214,170,79,.065),rgba(214,170,79,.025))!important;}
.professional-summary strong{color:var(--alloc-gold)!important;}
html[data-theme="light"] .professional-allocation{--alloc-card:rgba(255,255,255,.84);--alloc-text:#09182a;--alloc-muted:#5e7187;}
html[data-theme="light"] .professional-donut:after{background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(241,246,252,.98))!important;}
html[data-theme="light"] .professional-legend div{background:rgba(255,255,255,.78)!important;border-color:rgba(9,24,42,.10)!important;}

/* Step 3.6 - keep allocation legend readable in community drawer */
.community-allocation.professional-allocation{grid-template-columns:minmax(155px,190px) minmax(138px,1fr)!important;}
.community-allocation.professional-allocation .allocation-donut{width:min(184px,100%)!important;}
@media(max-width:720px){.community-allocation.professional-allocation{grid-template-columns:1fr!important;}.community-allocation.professional-allocation .allocation-donut{width:176px!important;}}

/* Step 3.7 - Allocation donut glow + legend overflow fix */
.professional-allocation{
  --alloc-glow-gold:rgba(242,199,106,.28);
  --alloc-glow-teal:rgba(79,154,149,.18);
  --alloc-glow-blue:rgba(91,127,166,.16);
  overflow:hidden;
}
.professional-donut{
  position:relative!important;
  isolation:isolate;
  overflow:visible!important;
  filter:saturate(.92) contrast(1.04) drop-shadow(0 0 18px rgba(242,199,106,.16))!important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.10),
    inset 0 0 34px rgba(2,8,20,.52),
    0 0 0 1px rgba(242,199,106,.08),
    0 0 34px rgba(242,199,106,.16),
    0 18px 48px rgba(0,0,0,.30)!important;
}
.professional-donut:before{
  content:""!important;
  position:absolute!important;
  inset:-18px!important;
  border-radius:50%!important;
  background:
    radial-gradient(circle at 42% 28%,rgba(255,247,214,.36),transparent 20%),
    radial-gradient(circle at 50% 52%,var(--alloc-glow-gold),transparent 45%),
    radial-gradient(circle at 25% 78%,var(--alloc-glow-teal),transparent 34%),
    radial-gradient(circle at 78% 70%,var(--alloc-glow-blue),transparent 36%)!important;
  filter:blur(13px)!important;
  opacity:.78!important;
  z-index:-1!important;
  pointer-events:none!important;
}
.professional-donut:after{
  z-index:0!important;
  box-shadow:
    inset 0 0 0 1px rgba(242,199,106,.14),
    inset 0 16px 34px rgba(0,0,0,.50),
    0 0 22px rgba(242,199,106,.10)!important;
}
.professional-donut>div{z-index:2!important;}
.professional-donut strong{
  text-shadow:0 0 16px rgba(242,199,106,.26)!important;
}
.professional-legend{
  min-width:0!important;
  max-width:100%!important;
  overflow:hidden!important;
}
.professional-legend div{
  min-width:0!important;
  max-width:100%!important;
  grid-template-columns:11px minmax(0,1fr) minmax(44px,max-content)!important;
  overflow:hidden!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025),0 8px 18px rgba(0,0,0,.16)!important;
}
.professional-legend i{
  box-shadow:0 0 12px currentColor,0 0 18px rgba(242,199,106,.12)!important;
}
.professional-legend .allocation-name{
  min-width:0!important;
  max-width:100%!important;
  overflow:hidden!important;
}
.professional-legend .allocation-name b{
  min-width:0!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.professional-legend .allocation-name em{
  min-width:0!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.professional-legend strong{
  min-width:44px!important;
  text-align:right!important;
  white-space:nowrap!important;
  overflow:visible!important;
  color:#f2c76a!important;
}
.professional-summary{
  overflow:hidden!important;
}
.professional-summary span{
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.professional-summary strong{
  white-space:nowrap!important;
}
@media(max-width:720px){
  .professional-donut{filter:saturate(.92) contrast(1.02) drop-shadow(0 0 12px rgba(242,199,106,.14))!important;}
  .professional-donut:before{inset:-12px!important;filter:blur(10px)!important;opacity:.68!important;}
  .professional-legend div{grid-template-columns:10px minmax(0,1fr) minmax(42px,max-content)!important;padding-left:8px!important;padding-right:8px!important;}
}

/* Step 3.7 - Portfolio detail side allocation proportion fix */
.portfolio-full-card .allocation-card .allocation-widget.professional-allocation{
  grid-template-columns:minmax(126px,160px) minmax(0,1fr)!important;
  gap:10px!important;
  align-items:center!important;
}
.portfolio-full-card .allocation-card .allocation-donut,
.portfolio-full-card .allocation-card .professional-donut{
  width:min(158px,100%)!important;
}
.portfolio-full-card .allocation-card .allocation-legend div{
  padding:7px 8px!important;
  border-radius:13px!important;
}
.portfolio-full-card .allocation-card .allocation-summary,
.portfolio-full-card .allocation-card .professional-summary{
  padding:8px 10px!important;
}
@media(max-width:1180px){
  .portfolio-full-card .allocation-card .allocation-widget.professional-allocation{
    grid-template-columns:1fr!important;
  }
  .portfolio-full-card .allocation-card .allocation-donut,
  .portfolio-full-card .allocation-card .professional-donut{
    width:min(176px,64vw)!important;
  }
}

/* Step 3.8 - Allocation donut premium glow + hard overflow fix */
.professional-allocation{
  overflow:visible!important;
  min-width:0!important;
}
.professional-donut{
  overflow:visible!important;
  transform:translateZ(0);
  filter:saturate(.98) contrast(1.05) drop-shadow(0 0 18px rgba(242,199,106,.18)) drop-shadow(0 0 28px rgba(87,148,157,.12))!important;
}
.professional-donut:before{
  inset:-20px!important;
  opacity:.86!important;
  filter:blur(15px)!important;
}
.professional-donut>div{
  width:62%!important;
  max-width:62%!important;
  min-width:0!important;
  overflow:hidden!important;
  place-items:center!important;
}
.professional-donut strong{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  font-size:clamp(22px,2.55vw,33px)!important;
  line-height:.98!important;
  letter-spacing:-.055em!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:clip!important;
  text-align:center!important;
  text-shadow:0 0 18px rgba(242,199,106,.32),0 0 34px rgba(214,170,79,.16)!important;
}
.professional-donut span{
  width:100%!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  text-align:center!important;
}
.professional-legend{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  overflow:visible!important;
  align-self:stretch!important;
}
.professional-legend div{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  grid-template-columns:12px minmax(0,1fr) minmax(58px,64px)!important;
  gap:8px!important;
  overflow:hidden!important;
  padding:8px 9px!important;
  border-radius:14px!important;
}
.professional-legend .allocation-name{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  min-width:0!important;
  overflow:hidden!important;
}
.professional-legend .allocation-name b,
.professional-legend .allocation-name em{
  min-width:0!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.professional-legend strong{
  min-width:58px!important;
  max-width:64px!important;
  justify-self:end!important;
  text-align:right!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:clip!important;
  font-size:12.5px!important;
  letter-spacing:-.02em!important;
  font-variant-numeric:tabular-nums!important;
}
.professional-summary{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow:hidden!important;
}

/* Portfolio detail right-side allocation card: stack donut above legend so text never clips */
.portfolio-full-card .allocation-card{
  overflow:visible!important;
}
.portfolio-full-card .allocation-card .allocation-widget.professional-allocation,
.portfolio-full-card .allocation-card .professional-allocation{
  display:grid!important;
  grid-template-columns:1fr!important;
  grid-template-areas:"donut" "legend" "summary"!important;
  gap:12px!important;
  align-items:center!important;
  justify-items:center!important;
  height:auto!important;
  overflow:visible!important;
}
.portfolio-full-card .allocation-card .allocation-donut,
.portfolio-full-card .allocation-card .professional-donut{
  grid-area:donut!important;
  width:min(178px,62vw)!important;
  margin:8px auto 4px!important;
}
.portfolio-full-card .allocation-card .allocation-legend,
.portfolio-full-card .allocation-card .professional-legend{
  grid-area:legend!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:8px!important;
  width:100%!important;
}
.portfolio-full-card .allocation-card .allocation-legend div,
.portfolio-full-card .allocation-card .professional-legend div{
  grid-template-columns:12px minmax(0,1fr) minmax(62px,68px)!important;
  padding:8px 10px!important;
}
.portfolio-full-card .allocation-card .allocation-summary,
.portfolio-full-card .allocation-card .professional-summary{
  grid-area:summary!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:10px!important;
  width:100%!important;
}

/* Community drawer / dashboard compact cards keep a balanced two-column layout only when enough space exists */
.community-allocation.professional-allocation,
.mt5-allocation-widget.professional-allocation{
  overflow:visible!important;
}
.community-allocation.professional-allocation .professional-legend div,
.mt5-allocation-widget.professional-allocation .professional-legend div{
  grid-template-columns:12px minmax(0,1fr) minmax(58px,64px)!important;
}

@media(max-width:900px){
  .professional-donut strong{font-size:clamp(21px,7vw,31px)!important;}
  .portfolio-full-card .allocation-card .allocation-widget.professional-allocation,
  .community-allocation.professional-allocation,
  .mt5-allocation-widget.professional-allocation{
    grid-template-columns:1fr!important;
    justify-items:center!important;
  }
  .professional-legend{width:100%!important;}
  .professional-legend div{grid-template-columns:11px minmax(0,1fr) minmax(56px,62px)!important;}
  .professional-legend strong{min-width:56px!important;max-width:62px!important;font-size:12px!important;}
}

/* Step 3.9 - Allocation typography downsize refinement */
.professional-donut>div{
  width:58%!important;
  max-width:58%!important;
}
.professional-donut strong{
  font-size:clamp(20px,2.2vw,30px)!important;
  line-height:1!important;
}
.professional-donut span{
  font-size:11px!important;
  line-height:1.1!important;
  letter-spacing:.02em!important;
}
.professional-legend div{
  grid-template-columns:10px minmax(0,1fr) minmax(50px,56px)!important;
  gap:7px!important;
  padding:7px 8px!important;
}
.professional-legend i{
  width:10px!important;
  height:10px!important;
}
.professional-legend .allocation-name b{
  font-size:11px!important;
  line-height:1.1!important;
}
.professional-legend .allocation-name em{
  font-size:9px!important;
  line-height:1.05!important;
}
.professional-legend strong{
  min-width:50px!important;
  max-width:56px!important;
  font-size:11px!important;
  letter-spacing:-.01em!important;
}
.professional-summary{
  font-size:11px!important;
}
.portfolio-full-card .allocation-card .allocation-donut,
.portfolio-full-card .allocation-card .professional-donut{
  width:min(170px,58vw)!important;
}
.portfolio-full-card .allocation-card .allocation-legend div,
.portfolio-full-card .allocation-card .professional-legend div{
  grid-template-columns:10px minmax(0,1fr) minmax(50px,56px)!important;
  padding:7px 8px!important;
}
@media (max-width: 720px){
  .professional-donut>div{
    width:56%!important;
    max-width:56%!important;
  }
  .professional-donut strong{
    font-size:clamp(18px,6.2vw,26px)!important;
  }
  .professional-donut span{
    font-size:10px!important;
  }
  .professional-legend div{
    grid-template-columns:10px minmax(0,1fr) minmax(46px,52px)!important;
    padding:7px 8px!important;
  }
  .professional-legend strong{
    min-width:46px!important;
    max-width:52px!important;
    font-size:10.5px!important;
  }
  .professional-legend .allocation-name b{
    font-size:10.5px!important;
  }
  .professional-legend .allocation-name em{
    font-size:8.5px!important;
  }
  .portfolio-full-card .allocation-card .allocation-donut,
  .portfolio-full-card .allocation-card .professional-donut{
    width:min(160px,56vw)!important;
  }
}

/* Step 3.15 - Trading Community Light Theme Visual Refinement
   Clean premium light palette. Scoped to ea-community only and only light mode. */
html[data-theme="light"]{
  --community-bg:#f4f7fb;
  --community-bg2:#edf3f9;
  --community-panel:#ffffff;
  --community-panel2:#f8fafc;
  --community-card:#ffffff;
  --community-text:#0f172a;
  --community-muted:#475569;
  --community-line:rgba(184,135,43,.24);
  --community-line2:rgba(15,23,42,.10);
  --community-gold:#b8872b;
  --community-gold2:#d2a344;
  --community-green:#059669;
  --community-red:#dc2626;
  --community-blue:#2563eb;
  --community-cyan:#0e7490;
  --community-shadow:0 18px 46px rgba(15,23,42,.075);
}

/* prevent hidden overlays from dimming the light page */
html[data-theme="light"] .detail-backdrop[hidden],
html[data-theme="light"] .lang-backdrop[hidden],
html[data-theme="light"] [hidden]{
  display:none!important;
}

html[data-theme="light"] body{
  color:var(--community-text)!important;
  background:
    radial-gradient(circle at 78% 0,rgba(184,135,43,.13),transparent 28%),
    radial-gradient(circle at 10% 12%,rgba(37,99,235,.07),transparent 31%),
    linear-gradient(145deg,#f6f8fc 0%,#eef3f9 58%,#f8fafc 100%)!important;
}

/* Header */
html[data-theme="light"] .community-header{
  background:rgba(255,255,255,.88)!important;
  border-bottom:1px solid rgba(15,23,42,.08)!important;
  box-shadow:0 10px 30px rgba(15,23,42,.045)!important;
}
html[data-theme="light"] .community-menu a{
  color:#334155!important;
}
html[data-theme="light"] .community-menu a:hover,
html[data-theme="light"] .community-menu a.active{
  color:#7a520f!important;
  background:#fff7e6!important;
}
html[data-theme="light"] .community-theme-toggle,
html[data-theme="light"] .lang-trigger{
  background:#ffffff!important;
  border-color:rgba(184,135,43,.26)!important;
  color:#0f172a!important;
  box-shadow:0 8px 20px rgba(15,23,42,.055)!important;
}

/* Hero and page copy */
html[data-theme="light"] .community-hero{
  background:linear-gradient(180deg,rgba(255,255,255,.50),rgba(255,255,255,0))!important;
}
html[data-theme="light"] .hero-copy h1,
html[data-theme="light"] .showcase-head h2,
html[data-theme="light"] .card-title,
html[data-theme="light"] .detail-title{
  color:#0f172a!important;
  text-shadow:none!important;
}
html[data-theme="light"] .hero-lead,
html[data-theme="light"] .showcase-head p:not(.eyebrow),
html[data-theme="light"] .card-meta,
html[data-theme="light"] .chart-caption,
html[data-theme="light"] .detail-sub{
  color:#475569!important;
}
html[data-theme="light"] .eyebrow{
  color:#996515!important;
}

/* Panels and public cards */
html[data-theme="light"] .showcase-panel,
html[data-theme="light"] .showcase-card,
html[data-theme="light"] .detail-drawer{
  background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%)!important;
  border-color:rgba(184,135,43,.22)!important;
  box-shadow:0 18px 45px rgba(15,23,42,.075)!important;
}
html[data-theme="light"] .showcase-card{
  background:
    radial-gradient(circle at 100% 0,rgba(184,135,43,.08),transparent 34%),
    linear-gradient(180deg,#ffffff 0%,#f8fafc 100%)!important;
}
html[data-theme="light"] .showcase-card:before,
html[data-theme="light"] .showcase-panel:before,
html[data-theme="light"] .detail-drawer:before{
  opacity:.28!important;
  background:linear-gradient(135deg,rgba(184,135,43,.10),transparent 31%,transparent 72%,rgba(37,99,235,.055))!important;
}
html[data-theme="light"] .showcase-card:hover{
  border-color:rgba(184,135,43,.38)!important;
  box-shadow:0 24px 60px rgba(15,23,42,.105),0 0 0 1px rgba(184,135,43,.05)!important;
}
html[data-theme="light"] .trust-row span{
  background:#ffffff!important;
  color:#475569!important;
  border-color:rgba(15,23,42,.11)!important;
}

/* Filter/search/select */
html[data-theme="light"] .pro-filter-panel{
  background:rgba(255,255,255,.86)!important;
  border-color:rgba(15,23,42,.10)!important;
  box-shadow:0 14px 34px rgba(15,23,42,.065)!important;
}
html[data-theme="light"] .filter-chip{
  background:#ffffff!important;
  border-color:rgba(15,23,42,.11)!important;
  color:#475569!important;
}
html[data-theme="light"] .filter-chip:hover,
html[data-theme="light"] .filter-chip.active{
  color:#7a520f!important;
  border-color:rgba(184,135,43,.42)!important;
  background:#fff7e6!important;
  box-shadow:0 0 0 4px rgba(184,135,43,.07)!important;
}
html[data-theme="light"] .search-box,
html[data-theme="light"] .select-wrap{
  background:#ffffff!important;
  border-color:rgba(15,23,42,.12)!important;
  color:#475569!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85)!important;
}
html[data-theme="light"] .search-box input,
html[data-theme="light"] .select-wrap select{
  color:#0f172a!important;
}
html[data-theme="light"] .search-box input::placeholder{
  color:#64748b!important;
}

/* Badges, status and buttons */
html[data-theme="light"] .type-badge,
html[data-theme="light"] .micro-badge{
  background:#fff7e6!important;
  border-color:#e7c56c!important;
  color:#8a5a00!important;
}
html[data-theme="light"] .status-badge{
  background:#ffffff!important;
  border-color:rgba(15,23,42,.12)!important;
  color:#64748b!important;
}
html[data-theme="light"] .status-badge.online{
  background:#ecfdf3!important;
  border-color:rgba(5,150,105,.28)!important;
  color:#047857!important;
}
html[data-theme="light"] .status-badge.offline{
  background:#f8fafc!important;
  color:#64748b!important;
}
html[data-theme="light"] .btn-gold{
  background:linear-gradient(135deg,#f2c76a,#c8952e)!important;
  color:#1f2937!important;
  box-shadow:0 14px 28px rgba(184,135,43,.22)!important;
}
html[data-theme="light"] .btn-ghost{
  background:#ffffff!important;
  border-color:rgba(15,23,42,.14)!important;
  color:#0f172a!important;
  box-shadow:0 10px 22px rgba(15,23,42,.045)!important;
}

/* Metrics and mini charts */
html[data-theme="light"] .metric{
  background:linear-gradient(180deg,#ffffff,#f8fafc)!important;
  border-color:rgba(15,23,42,.11)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95)!important;
}
html[data-theme="light"] .metric small{
  color:#64748b!important;
}
html[data-theme="light"] .metric strong{
  color:#0f172a!important;
}
html[data-theme="light"] .positive{
  color:#059669!important;
}
html[data-theme="light"] .negative{
  color:#dc2626!important;
}
html[data-theme="light"] .chart-shell{
  background:
    radial-gradient(circle at 18% 12%,rgba(184,135,43,.105),transparent 35%),
    linear-gradient(180deg,#ffffff,#f6f8fc)!important;
  border-color:rgba(15,23,42,.10)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.90)!important;
}
html[data-theme="light"] .chart-shell:after{
  border-top-color:rgba(15,23,42,.10)!important;
}
html[data-theme="light"] .spark-line{
  stroke:#c8952e!important;
  filter:drop-shadow(0 0 7px rgba(200,149,46,.30))!important;
}
html[data-theme="light"] .spark-balance{
  stroke:rgba(14,116,144,.70)!important;
}
html[data-theme="light"] .spark-area{
  fill:#c8952e!important;
  opacity:.14!important;
}
html[data-theme="light"] .risk-meter{
  background:rgba(15,23,42,.08)!important;
}

/* Detail drawer / tables */
html[data-theme="light"] .detail-backdrop:not([hidden]){
  background:rgba(15,23,42,.28)!important;
  backdrop-filter:blur(8px)!important;
}
html[data-theme="light"] .detail-close{
  background:#ffffff!important;
  border-color:rgba(15,23,42,.14)!important;
  color:#0f172a!important;
}
html[data-theme="light"] .big-chart,
html[data-theme="light"] .side-chart,
html[data-theme="light"] .trade-panel,
html[data-theme="light"] .info-panel{
  background:linear-gradient(180deg,#ffffff,#f8fafc)!important;
  border-color:rgba(15,23,42,.11)!important;
  color:#0f172a!important;
}
html[data-theme="light"] .trade-mini-table th{
  color:#64748b!important;
}
html[data-theme="light"] .trade-mini-table td,
html[data-theme="light"] .info-list strong{
  color:#0f172a!important;
}
html[data-theme="light"] .info-list span{
  color:#64748b!important;
}
html[data-theme="light"] .risk-note{
  background:#fff7e6!important;
  border-color:rgba(184,135,43,.22)!important;
  color:#475569!important;
}

/* Empty/loading states */
html[data-theme="light"] .loading-state,
html[data-theme="light"] .empty-state{
  background:#ffffff!important;
  border-color:rgba(184,135,43,.24)!important;
  color:#475569!important;
  box-shadow:0 14px 36px rgba(15,23,42,.06)!important;
}
html[data-theme="light"] .empty-state strong{
  color:#0f172a!important;
}

/* Light mode language sheet in community */
html[data-theme="light"] .lang-panel{
  background:#ffffff!important;
  color:#0f172a!important;
  border-color:rgba(184,135,43,.22)!important;
}
html[data-theme="light"] .lang-panel h2,
html[data-theme="light"] .lang-grid button strong{
  color:#0f172a!important;
}
html[data-theme="light"] .lang-kicker,
html[data-theme="light"] .lang-note,
html[data-theme="light"] .lang-grid button span:last-child{
  color:#475569!important;
}
html[data-theme="light"] .lang-grid button,
html[data-theme="light"] .lang-search-wrap{
  background:#f8fafc!important;
  border-color:rgba(15,23,42,.10)!important;
  color:#0f172a!important;
}
html[data-theme="light"] .lang-grid button.active{
  background:#fff7e6!important;
  border-color:rgba(184,135,43,.36)!important;
}


/* =========================================================
   Step 3.18 - Dark/Light chart glow rebalance
   - Dark mode: stronger luminous depth
   - Light mode: softer glow, paler warm yellow
   ========================================================= */

.chart-shell{
  isolation:isolate;
  background:
    radial-gradient(circle at 18% 16%,rgba(242,199,106,.16),transparent 34%),
    radial-gradient(circle at 74% 82%,rgba(78,165,255,.08),transparent 38%),
    linear-gradient(180deg,rgba(9,24,42,.54),rgba(7,18,34,.42))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    inset 0 -1px 0 rgba(242,199,106,.05),
    0 12px 30px rgba(0,0,0,.18)!important;
}
.chart-shell::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  background:
    radial-gradient(circle at 24% 72%,rgba(242,199,106,.12),transparent 30%),
    radial-gradient(circle at 80% 24%,rgba(242,199,106,.07),transparent 34%);
  opacity:1;
  z-index:0;
}
.chart-shell > *{
  position:relative;
  z-index:1;
}
.spark-line{
  filter:
    drop-shadow(0 0 8px rgba(242,199,106,.36))
    drop-shadow(0 0 18px rgba(242,199,106,.18))!important;
}
.spark-area{
  opacity:.17!important;
}
.spark-dot{
  filter:
    drop-shadow(0 0 10px rgba(242,199,106,.82))
    drop-shadow(0 0 18px rgba(242,199,106,.34))!important;
}

.big-chart,
.side-chart{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 10px 28px rgba(0,0,0,.14)!important;
}

html[data-theme="light"] .chart-shell{
  background:
    radial-gradient(circle at 18% 12%,rgba(214,176,88,.075),transparent 35%),
    radial-gradient(circle at 76% 78%,rgba(232,208,140,.055),transparent 34%),
    linear-gradient(180deg,#ffffff,#f8f7f2)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.96),
    0 10px 24px rgba(15,23,42,.05),
    0 1px 0 rgba(200,149,46,.04)!important;
}
html[data-theme="light"] .chart-shell::before{
  background:
    radial-gradient(circle at 24% 72%,rgba(214,176,88,.055),transparent 30%),
    radial-gradient(circle at 80% 24%,rgba(226,193,112,.04),transparent 34%);
}
html[data-theme="light"] .spark-line{
  stroke:#d3a944!important;
  filter:
    drop-shadow(0 0 4px rgba(211,169,68,.14))
    drop-shadow(0 0 9px rgba(211,169,68,.08))!important;
}
html[data-theme="light"] .spark-area{
  fill:#d3a944!important;
  opacity:.115!important;
}
html[data-theme="light"] .spark-dot{
  fill:#d3a944!important;
  filter:
    drop-shadow(0 0 5px rgba(211,169,68,.14))
    drop-shadow(0 0 10px rgba(211,169,68,.08))!important;
}
html[data-theme="light"] .big-chart,
html[data-theme="light"] .side-chart{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.96),
    0 8px 24px rgba(15,23,42,.045)!important;
}

/* =========================================================
   Step 3.19 - Trading Community Detail Drawer Premium Glow Depth
   Scope: detail drawer only, not showcase cards and not full portfolio page.
   ========================================================= */

.detail-drawer{
  overflow:auto;
  isolation:isolate;
}
.detail-drawer.open{
  box-shadow:
    0 30px 95px rgba(0,0,0,.58),
    0 0 0 1px rgba(242,199,106,.08),
    0 0 80px rgba(242,199,106,.10)!important;
}
.detail-drawer.open::before{
  opacity:.58!important;
  background:
    radial-gradient(circle at 32% 36%,rgba(242,199,106,.13),transparent 28%),
    radial-gradient(circle at 82% 18%,rgba(78,165,255,.11),transparent 30%),
    linear-gradient(135deg,rgba(242,199,106,.07),transparent 34%,rgba(78,165,255,.045))!important;
}
.detail-drawer .big-chart,
.detail-drawer .side-chart,
.detail-drawer .trade-panel,
.detail-drawer .info-panel{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 30% 28%,rgba(242,199,106,.075),transparent 34%),
    linear-gradient(180deg,rgba(12,31,52,.82),rgba(8,22,38,.68))!important;
  border-color:rgba(242,199,106,.16)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    inset 0 -1px 0 rgba(242,199,106,.045),
    0 18px 44px rgba(0,0,0,.22)!important;
}
.detail-drawer .big-chart::before,
.detail-drawer .side-chart::before{
  content:"";
  position:absolute;
  inset:-22%;
  pointer-events:none;
  background:
    radial-gradient(circle at 26% 70%,rgba(242,199,106,.12),transparent 24%),
    radial-gradient(circle at 75% 18%,rgba(78,165,255,.08),transparent 26%);
  filter:blur(10px);
  opacity:.95;
  z-index:0;
}
.detail-drawer .big-chart > *,
.detail-drawer .side-chart > *,
.detail-drawer .trade-panel > *,
.detail-drawer .info-panel > *{
  position:relative;
  z-index:1;
}
.detail-drawer .big-svg{
  filter:drop-shadow(0 12px 26px rgba(242,199,106,.075));
}
.detail-drawer .spark-line{
  stroke:#ffd978!important;
  stroke-width:3.45!important;
  filter:
    drop-shadow(0 0 9px rgba(255,217,120,.46))
    drop-shadow(0 0 21px rgba(242,199,106,.26))
    drop-shadow(0 0 34px rgba(78,165,255,.08))!important;
}
.detail-drawer .spark-area{
  opacity:.20!important;
}
.detail-drawer .spark-dot{
  fill:#ffd978!important;
  filter:
    drop-shadow(0 0 11px rgba(255,217,120,.90))
    drop-shadow(0 0 22px rgba(242,199,106,.42))!important;
}
.detail-drawer .professional-allocation{
  background:
    radial-gradient(circle at 50% 42%,rgba(242,199,106,.16),transparent 43%),
    linear-gradient(180deg,rgba(12,31,52,.72),rgba(8,22,38,.55))!important;
  border-color:rgba(242,199,106,.15)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06)!important;
}
.detail-drawer .professional-donut{
  filter:
    drop-shadow(0 0 18px rgba(242,199,106,.24))
    drop-shadow(0 20px 38px rgba(0,0,0,.24))!important;
}
.detail-drawer .professional-legend div{
  background:rgba(255,255,255,.055)!important;
  border-color:rgba(242,199,106,.12)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    0 10px 24px rgba(0,0,0,.12)!important;
}
.detail-drawer .professional-summary{
  background:rgba(242,199,106,.06)!important;
  border-color:rgba(242,199,106,.16)!important;
}

html[data-theme="light"] .detail-drawer.open{
  background:
    radial-gradient(circle at 30% 4%,rgba(226,193,112,.10),transparent 26%),
    linear-gradient(180deg,#ffffff,#fbfcff 58%,#f7f9fd)!important;
  border-color:rgba(184,135,43,.18)!important;
  box-shadow:
    0 26px 85px rgba(15,23,42,.17),
    0 0 0 1px rgba(184,135,43,.08),
    0 0 58px rgba(226,193,112,.08)!important;
}
html[data-theme="light"] .detail-drawer.open::before{
  opacity:.46!important;
  background:
    radial-gradient(circle at 30% 34%,rgba(226,193,112,.08),transparent 30%),
    radial-gradient(circle at 82% 16%,rgba(37,99,235,.035),transparent 32%),
    linear-gradient(135deg,rgba(226,193,112,.05),transparent 36%,rgba(14,116,144,.025))!important;
}
html[data-theme="light"] .detail-drawer .big-chart,
html[data-theme="light"] .detail-drawer .side-chart,
html[data-theme="light"] .detail-drawer .trade-panel,
html[data-theme="light"] .detail-drawer .info-panel{
  background:
    radial-gradient(circle at 32% 28%,rgba(226,193,112,.055),transparent 34%),
    linear-gradient(180deg,#ffffff,#f9fafc)!important;
  border-color:rgba(15,23,42,.105)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.98),
    0 14px 34px rgba(15,23,42,.075),
    0 0 0 1px rgba(184,135,43,.025)!important;
}
html[data-theme="light"] .detail-drawer .big-chart::before,
html[data-theme="light"] .detail-drawer .side-chart::before{
  background:
    radial-gradient(circle at 28% 74%,rgba(226,193,112,.070),transparent 26%),
    radial-gradient(circle at 76% 20%,rgba(226,193,112,.040),transparent 28%);
  filter:blur(12px);
  opacity:.82;
}
html[data-theme="light"] .detail-drawer .spark-line{
  stroke:#d6aa4f!important;
  stroke-width:3.15!important;
  filter:
    drop-shadow(0 0 5px rgba(214,170,79,.16))
    drop-shadow(0 0 12px rgba(214,170,79,.08))!important;
}
html[data-theme="light"] .detail-drawer .spark-area{
  fill:#d6aa4f!important;
  opacity:.125!important;
}
html[data-theme="light"] .detail-drawer .spark-dot{
  fill:#d6aa4f!important;
  filter:
    drop-shadow(0 0 6px rgba(214,170,79,.20))
    drop-shadow(0 0 13px rgba(214,170,79,.09))!important;
}
html[data-theme="light"] .detail-drawer .professional-allocation{
  background:
    radial-gradient(circle at 50% 44%,rgba(226,193,112,.090),transparent 44%),
    linear-gradient(180deg,#ffffff,#f9fafc)!important;
  border-color:rgba(15,23,42,.10)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.98),
    0 12px 30px rgba(15,23,42,.065)!important;
}
html[data-theme="light"] .detail-drawer .professional-donut{
  filter:
    drop-shadow(0 0 11px rgba(214,170,79,.10))
    drop-shadow(0 16px 26px rgba(15,23,42,.09))!important;
}
html[data-theme="light"] .detail-drawer .professional-legend div{
  background:rgba(255,255,255,.86)!important;
  border-color:rgba(15,23,42,.09)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.98),
    0 9px 20px rgba(15,23,42,.06)!important;
}
html[data-theme="light"] .detail-drawer .professional-summary{
  background:#fff9e8!important;
  border-color:rgba(214,170,79,.18)!important;
}


/* =========================================================
   Step 3.21 - Trading Community Mobile Language Sheet HARD FIX
   Fixes mobile language panel jumping into page flow / hero.
   Scoped to ea-community header only.
   ========================================================= */
@media (max-width: 760px){
  body.language-panel-open{
    overflow:hidden!important;
    touch-action:none!important;
  }
  body.language-panel-open .community-header{
    z-index:2147483000!important;
  }
  .community-language-switcher .lang-backdrop,
  body.language-panel-open .community-language-switcher .lang-backdrop{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    z-index:2147483001!important;
    background:rgba(2,8,20,.62)!important;
    backdrop-filter:blur(8px)!important;
    -webkit-backdrop-filter:blur(8px)!important;
    opacity:0!important;
    pointer-events:none!important;
  }
  .community-language-switcher .lang-backdrop.open,
  body.language-panel-open .community-language-switcher .lang-backdrop.open{
    opacity:1!important;
    pointer-events:auto!important;
  }
  .community-language-switcher .lang-panel,
  body.language-panel-open .community-language-switcher .lang-panel{
    position:fixed!important;
    left:12px!important;
    right:12px!important;
    top:auto!important;
    bottom:calc(12px + env(safe-area-inset-bottom,0px))!important;
    width:auto!important;
    max-width:none!important;
    height:auto!important;
    max-height:min(76dvh,640px)!important;
    margin:0!important;
    padding:14px!important;
    z-index:2147483002!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    border-radius:24px!important;
    transform:translate3d(0,18px,0) scale(.985)!important;
    transform-origin:bottom center!important;
    opacity:0!important;
    pointer-events:none!important;
    box-shadow:0 -18px 70px rgba(0,0,0,.42),0 0 0 1px rgba(242,199,106,.20) inset!important;
  }
  .community-language-switcher .lang-panel.open,
  body.language-panel-open .community-language-switcher .lang-panel.open{
    transform:translate3d(0,0,0) scale(1)!important;
    opacity:1!important;
    pointer-events:auto!important;
  }
  .community-language-switcher .lang-panel::before{
    display:none!important;
  }
  .community-language-switcher .lang-panel-grip{
    display:block!important;
    flex:0 0 auto!important;
    width:46px!important;
    height:4px!important;
    margin:0 auto 12px!important;
    border-radius:999px!important;
    background:rgba(148,163,184,.42)!important;
  }
  .community-language-switcher .lang-panel-header{
    flex:0 0 auto!important;
    align-items:flex-start!important;
    gap:10px!important;
    margin-bottom:10px!important;
  }
  .community-language-switcher .lang-panel-header h2{
    font-size:18px!important;
    line-height:1.15!important;
    margin:0!important;
  }
  .community-language-switcher .lang-panel-header h2 span{
    display:block!important;
    font-size:11px!important;
    margin-top:2px!important;
  }
  .community-language-switcher .lang-close{
    width:38px!important;
    height:38px!important;
    flex:0 0 38px!important;
  }
  .community-language-switcher .lang-search-wrap{
    flex:0 0 auto!important;
    margin-bottom:10px!important;
  }
  .community-language-switcher .lang-search-wrap input{
    height:42px!important;
    font-size:14px!important;
  }
  .community-language-switcher .lang-grid{
    flex:1 1 auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
    padding-right:2px!important;
  }
  .community-language-switcher .lang-option{
    min-height:58px!important;
    padding:9px 10px!important;
  }
  .community-language-switcher .lang-note{
    flex:0 0 auto!important;
    margin:10px 0 0!important;
    font-size:11px!important;
  }
  html[data-theme="light"] .community-language-switcher .lang-backdrop,
  html[data-theme="light"] body.language-panel-open .community-language-switcher .lang-backdrop{
    background:rgba(15,23,42,.30)!important;
    backdrop-filter:blur(8px)!important;
    -webkit-backdrop-filter:blur(8px)!important;
  }
  html[data-theme="light"] .community-language-switcher .lang-panel,
  html[data-theme="light"] body.language-panel-open .community-language-switcher .lang-panel{
    background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,250,252,.96))!important;
    color:#0f172a!important;
    border-color:rgba(184,135,43,.24)!important;
    box-shadow:0 -16px 58px rgba(15,23,42,.18),0 0 0 1px rgba(255,255,255,.88) inset!important;
  }
}

@media (max-width: 380px){
  .community-language-switcher .lang-panel,
  body.language-panel-open .community-language-switcher .lang-panel{
    left:8px!important;
    right:8px!important;
    bottom:calc(8px + env(safe-area-inset-bottom,0px))!important;
    max-height:min(78dvh,620px)!important;
    padding:12px!important;
  }
  .community-language-switcher .lang-option{
    min-height:54px!important;
  }
}

/* =========================================================
   Step 3.22 - Trading Community Mobile Language Panel Match EA Lab
   The Trading Community page uses the same mobile language behavior as EA Lab:
   fixed top overlay below header, not a bottom sheet and not in page flow.
   ========================================================= */
@media (max-width: 760px){
  body.language-panel-open{
    overflow:hidden!important;
    touch-action:none!important;
  }
  body.language-panel-open .community-header,
  .community-header{
    overflow:visible!important;
  }
  .community-nav,
  .community-actions,
  .community-language-switcher{
    overflow:visible!important;
  }
  body.language-panel-open .community-header{
    z-index:900!important;
  }
  .community-language-switcher .lang-backdrop,
  body.language-panel-open .community-language-switcher .lang-backdrop{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    z-index:900!important;
    background:rgba(2,8,20,.56)!important;
    backdrop-filter:blur(2px)!important;
    -webkit-backdrop-filter:blur(2px)!important;
    opacity:0!important;
    pointer-events:none!important;
  }
  .community-language-switcher .lang-backdrop.open,
  body.language-panel-open .community-language-switcher .lang-backdrop.open{
    opacity:1!important;
    pointer-events:auto!important;
  }
  .community-language-switcher .lang-panel,
  body.language-panel-open .community-language-switcher .lang-panel{
    position:fixed!important;
    left:12px!important;
    right:12px!important;
    top:74px!important;
    bottom:auto!important;
    width:auto!important;
    max-width:none!important;
    height:auto!important;
    max-height:calc(100dvh - 88px)!important;
    margin:0!important;
    padding:14px!important;
    z-index:930!important;
    display:block!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    border-radius:22px!important;
    transform:translateY(-8px) scale(.985)!important;
    transform-origin:top center!important;
    opacity:0!important;
    pointer-events:none!important;
    box-shadow:0 24px 70px rgba(0,0,0,.42),0 0 0 1px rgba(242,199,106,.20) inset!important;
  }
  .community-language-switcher .lang-panel.open,
  body.language-panel-open .community-language-switcher .lang-panel.open{
    transform:translateY(0) scale(1)!important;
    opacity:1!important;
    pointer-events:auto!important;
  }
  .community-language-switcher .lang-panel::before{
    display:none!important;
  }
  .community-language-switcher .lang-panel-grip{
    display:block!important;
    width:42px!important;
    height:4px!important;
    margin:0 auto 10px!important;
    border-radius:999px!important;
    background:rgba(148,163,184,.38)!important;
  }
  .community-language-switcher .lang-panel-header{
    align-items:flex-start!important;
    gap:10px!important;
    margin-bottom:10px!important;
  }
  .community-language-switcher .lang-kicker{
    font-size:10px!important;
    margin:0 0 2px!important;
  }
  .community-language-switcher .lang-panel-header h2{
    font-size:18px!important;
    line-height:1.1!important;
    margin:0!important;
  }
  .community-language-switcher .lang-panel-header h2 span{
    display:block!important;
    font-size:11px!important;
    margin-top:2px!important;
  }
  .community-language-switcher .lang-close{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
  }
  .community-language-switcher .lang-search-wrap{
    margin:8px 0 10px!important;
  }
  .community-language-switcher .lang-search-wrap input{
    height:42px!important;
    font-size:13px!important;
  }
  .community-language-switcher .lang-grid{
    grid-template-columns:1fr!important;
    gap:8px!important;
    max-height:calc(100dvh - 255px)!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    padding-right:3px!important;
  }
  .community-language-switcher .lang-option{
    min-height:52px!important;
    padding:8px 10px!important;
    border-radius:16px!important;
  }
  .community-language-switcher .lang-option-flag{
    width:36px!important;
    height:36px!important;
    min-width:36px!important;
  }
  .community-language-switcher .lang-option-text strong{
    font-size:14px!important;
    line-height:1.1!important;
  }
  .community-language-switcher .lang-option-text small{
    font-size:11px!important;
  }
  .community-language-switcher .lang-note{
    display:none!important;
  }

  html[data-theme="light"] .community-language-switcher .lang-backdrop,
  html[data-theme="light"] body.language-panel-open .community-language-switcher .lang-backdrop{
    background:rgba(15,23,42,.26)!important;
    backdrop-filter:blur(3px)!important;
    -webkit-backdrop-filter:blur(3px)!important;
  }
  html[data-theme="light"] .community-language-switcher .lang-panel,
  html[data-theme="light"] body.language-panel-open .community-language-switcher .lang-panel{
    background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,250,252,.96))!important;
    color:#0f172a!important;
    border-color:rgba(184,135,43,.24)!important;
    box-shadow:0 22px 58px rgba(15,23,42,.18),0 0 0 1px rgba(255,255,255,.88) inset!important;
  }
}
@media (max-width: 420px){
  .community-language-switcher .lang-panel,
  body.language-panel-open .community-language-switcher .lang-panel{
    left:10px!important;
    right:10px!important;
    top:70px!important;
    max-height:calc(100dvh - 82px)!important;
    padding:12px!important;
  }
  .community-language-switcher .lang-grid{
    max-height:calc(100dvh - 230px)!important;
  }
}


/* =========================================================
   Step 3.25 - Trading Community mobile header order with auth
   Logo | Theme | Language | Auth, menu on second row.
   ========================================================= */
@media (max-width: 760px){
  .community-nav{
    align-items:center!important;
    gap:8px!important;
  }
  .community-brand{
    order:1!important;
    flex:0 0 auto!important;
  }
  .community-actions{
    order:2!important;
    margin-left:auto!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:7px!important;
    flex:0 0 auto!important;
    min-width:0!important;
  }
  .community-menu{
    order:3!important;
    width:100%!important;
    margin-left:0!important;
    display:flex!important;
    gap:6px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    padding:5px 0 4px!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
  }
  .community-menu::-webkit-scrollbar{display:none!important;}

  .community-theme-toggle,
  .community-language-switcher .lang-trigger{
    width:40px!important;
    min-width:40px!important;
    height:40px!important;
    padding:0!important;
    justify-content:center!important;
  }
  .community-theme-toggle .theme-text,
  .community-language-switcher .lang-current-text,
  .community-language-switcher .lang-chevron{
    display:none!important;
  }
}

@media (max-width: 390px){
  .community-brand img{
    width:92px!important;
  }
  .community-actions{
    gap:6px!important;
  }
  .community-theme-toggle,
  .community-language-switcher .lang-trigger{
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
  }
}

/* VELAEA Risk Type visibility in community modal/card */
.risk-type-badge{
  display:grid;
  gap:3px;
  padding:9px 11px;
  border:1px solid var(--community-line2);
  border-radius:14px;
  background:rgba(242,199,106,.055);
  min-width:0;
}
.risk-type-badge small,
.metric-risk-type em{
  color:var(--community-muted);
  font-weight:900;
  font-size:10.5px;
  line-height:1.35;
}
.risk-type-badge strong{
  color:var(--community-gold);
  font-weight:950;
  font-size:12.5px;
  line-height:1.25;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.detail-metrics .metric.metric-risk-type strong{
  color:var(--community-gold);
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  line-height:1.18;
}
.detail-metrics .metric.metric-risk-type em{
  display:block;
  margin-top:5px;
  font-style:normal;
}

/* Backtest drawer: make Risk Type follow the same visual language as Forward Test metrics */
.risk-type-badge{
  background:rgba(255,255,255,.045)!important;
}
.risk-type-badge strong,
.detail-metrics .metric.metric-risk-type strong{
  color:var(--community-text)!important;
}
.detail-metrics .metric.metric-risk-type{
  background:rgba(255,255,255,.045)!important;
  border-color:var(--community-line2)!important;
}
.detail-metrics .metric em{
  display:block;
  margin-top:5px;
  color:var(--community-muted);
  font-style:normal;
  font-weight:850;
  font-size:10px;
  line-height:1.25;
}

/* Backtest modal full-data layout: same information depth as Dashboard backtest analytics */
@media (min-width: 1101px){
  .detail-drawer .detail-columns{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
.detail-loading-badge{
  color: var(--community-muted)!important;
}
.trade-panel{
  overflow-x:auto;
}
.trade-mini-table th,
.trade-mini-table td{
  white-space:nowrap;
}

/* =========================================================
   VELAEA Community Mobile Professional Card Polish
   Fixes iPhone / narrow viewport overflow for showcase cards,
   action buttons, risk badges and detail drawer content.
   ========================================================= */
.community-shell,
.showcase-panel,
.showcase-grid,
.showcase-card,
.detail-drawer,
.detail-inner,
.detail-metrics,
.detail-chart-grid,
.detail-columns{
  min-width:0!important;
}
.showcase-card,
.metric,
.risk-type-badge,
.card-actions,
.detail-drawer{
  max-width:100%!important;
}
.card-title,
.card-meta,
.metric strong,
.metric small,
.risk-type-badge strong,
.risk-type-badge small{
  min-width:0!important;
}
.card-meta{
  overflow-wrap:anywhere!important;
}
.card-actions{
  flex-wrap:wrap!important;
}
.card-actions .btn,
.card-actions .type-badge,
.card-actions .status-badge,
.card-actions .micro-badge{
  min-width:0!important;
  max-width:100%!important;
}
.card-actions .btn{
  white-space:nowrap!important;
}

@media (max-width: 520px){
  body{
    overflow-x:hidden!important;
  }
  .community-shell{
    width:calc(100% - 20px)!important;
  }
  .showcase-panel{
    padding:10px!important;
    margin:12px auto 42px!important;
    border-radius:18px!important;
  }
  .showcase-head{
    margin-bottom:12px!important;
  }
  .showcase-head h2{
    font-size:22px!important;
    line-height:1.15!important;
  }
  .pro-filter-panel{
    padding:10px!important;
    border-radius:16px!important;
  }
  .filter-row{
    gap:7px!important;
  }
  .filter-chip{
    height:34px!important;
    padding:0 11px!important;
    font-size:11px!important;
  }
  .showcase-grid{
    grid-template-columns:minmax(0,1fr)!important;
    gap:12px!important;
  }
  .showcase-card{
    width:100%!important;
    padding:12px!important;
    gap:10px!important;
    border-radius:18px!important;
    min-height:0!important;
    overflow:hidden!important;
  }
  .card-top{
    align-items:flex-start!important;
    gap:7px!important;
  }
  .type-badge,
  .status-badge,
  .micro-badge{
    font-size:9.5px!important;
    line-height:1.15!important;
    padding:6px 8px!important;
    max-width:100%!important;
  }
  .status-badge{
    flex:0 0 auto!important;
  }
  .card-title{
    font-size:17px!important;
    line-height:1.18!important;
    letter-spacing:-.035em!important;
    margin-bottom:3px!important;
  }
  .card-meta{
    font-size:11.5px!important;
    line-height:1.45!important;
  }
  .metric-grid,
  .metric-grid.pro-metrics{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
  }
  .metric{
    padding:9px!important;
    border-radius:13px!important;
  }
  .metric small{
    font-size:8.8px!important;
    letter-spacing:.06em!important;
  }
  .metric strong{
    font-size:13px!important;
    line-height:1.16!important;
  }
  .chart-shell{
    padding:8px!important;
    border-radius:15px!important;
  }
  .chart-caption{
    font-size:9.5px!important;
    gap:8px!important;
  }
  .spark-svg{
    height:82px!important;
  }
  .risk-row{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
  }
  .risk-row > div{
    min-width:0!important;
  }
  .risk-type-badge{
    width:100%!important;
    padding:9px 10px!important;
    border-radius:14px!important;
  }
  .risk-type-badge strong{
    color:var(--community-text)!important;
    font-size:12px!important;
    line-height:1.22!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
  }
  .card-actions{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    align-items:stretch!important;
    justify-content:stretch!important;
    margin-top:2px!important;
  }
  .card-actions .type-badge{
    grid-column:1 / -1!important;
    width:max-content!important;
    justify-self:start!important;
  }
  .card-actions .btn{
    width:100%!important;
    min-height:42px!important;
    padding:9px 8px!important;
    border-radius:13px!important;
    font-size:11px!important;
    line-height:1.15!important;
    text-align:center!important;
  }
  .card-actions .btn:last-child:nth-child(even){
    grid-column:1 / -1!important;
  }
}

@media (max-width: 380px){
  .community-shell{
    width:calc(100% - 16px)!important;
  }
  .showcase-panel{
    padding:8px!important;
  }
  .showcase-card{
    padding:10px!important;
  }
  .card-actions{
    grid-template-columns:1fr!important;
  }
  .card-actions .type-badge,
  .card-actions .btn{
    grid-column:auto!important;
  }
  .metric-grid,
  .metric-grid.pro-metrics,
  .risk-row{
    gap:6px!important;
  }
}

/* Mobile drawer should feel like a native sheet and never create horizontal scrolling. */
@media (max-width: 760px){
  .detail-drawer{
    left:8px!important;
    right:8px!important;
    top:8px!important;
    bottom:8px!important;
    width:auto!important;
    border-radius:20px!important;
    overflow-x:hidden!important;
  }
  .detail-inner{
    padding:14px!important;
  }
  .detail-hero,
  .detail-chart-grid,
  .detail-columns{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }
  .detail-title{
    font-size:24px!important;
    line-height:1.08!important;
  }
  .detail-sub{
    font-size:12px!important;
    line-height:1.45!important;
  }
  .detail-share-row{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }
  .detail-share-row .btn{
    width:100%!important;
    min-height:42px!important;
    padding:9px 8px!important;
    font-size:11px!important;
  }
  .detail-metrics{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }
  .detail-metrics .metric.metric-risk-type{
    grid-column:1 / -1!important;
  }
  .big-chart,
  .side-chart,
  .trade-panel,
  .info-panel{
    padding:12px!important;
    border-radius:17px!important;
    overflow:hidden!important;
  }
  .trade-panel{
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .trade-mini-table{
    min-width:560px!important;
  }
}

/* VELAEA Community filter polish: dynamic counts + useful select states */
.filter-chip{
  position:relative;
  gap:8px;
}
.filter-chip .filter-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:22px;
  height:20px;
  padding:0 7px;
  border-radius:999px;
  font-size:10px;
  font-weight:950;
  line-height:1;
  color:var(--community-gold);
  background:rgba(242,199,106,.10);
  border:1px solid rgba(242,199,106,.20);
}
.filter-chip.active .filter-count{
  color:#081423;
  background:rgba(255,255,255,.82);
  border-color:rgba(255,255,255,.55);
}
.filter-chip.is-empty:not(.active){
  opacity:.62;
}
.select-wrap.is-disabled{
  opacity:.68;
}
.select-wrap select{
  min-width:132px;
}
.sort-wrap select{
  min-width:170px;
}
@media(max-width:760px){
  .filter-chip .filter-count{min-width:20px;height:18px;font-size:9.5px;padding:0 6px;}
  .select-wrap select,.sort-wrap select{min-width:0;width:100%;}
}


/* VELAEA Community filter clean professional polish
   - no numeric badges on filter chips
   - stronger filled select controls for dark/light themes */
.filter-chip .filter-count,
.filter-chip [class*="count"]{
  display:none !important;
}
.filter-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:0;
  min-width:auto;
}
.select-wrap{
  position:relative;
  overflow:visible;
  background:linear-gradient(180deg,rgba(9,24,42,.98),rgba(4,14,27,.98)) !important;
  border-color:rgba(160,182,210,.24) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 10px 24px rgba(0,0,0,.16);
}
.select-wrap::after{
  content:"";
  width:7px;
  height:7px;
  border-right:2px solid var(--community-gold);
  border-bottom:2px solid var(--community-gold);
  transform:rotate(45deg);
  position:absolute;
  right:14px;
  top:50%;
  margin-top:-6px;
  pointer-events:none;
  opacity:.9;
}
.select-wrap select{
  appearance:none;
  -webkit-appearance:none;
  width:100%;
  min-width:128px;
  padding:0 26px 0 2px;
  background:transparent !important;
  color:#f7fbff !important;
  cursor:pointer;
}
.select-wrap select option{
  background:#071321 !important;
  color:#f3f8ff !important;
  font-weight:850;
}
.select-wrap select option:checked{
  background:#f2c76a !important;
  color:#071321 !important;
}
.select-wrap select:focus{
  outline:none;
}
.select-wrap:focus-within{
  border-color:rgba(242,199,106,.68) !important;
  box-shadow:0 0 0 4px rgba(242,199,106,.10),inset 0 1px 0 rgba(255,255,255,.07);
}
html[data-theme="light"] .select-wrap,
body.light-mode .select-wrap{
  background:linear-gradient(180deg,#ffffff,#f6f9fd) !important;
  border-color:rgba(12,31,52,.16) !important;
  box-shadow:0 10px 25px rgba(12,31,52,.08),inset 0 1px 0 rgba(255,255,255,.9);
}
html[data-theme="light"] .select-wrap select,
body.light-mode .select-wrap select{
  color:#071321 !important;
}
html[data-theme="light"] .select-wrap select option,
body.light-mode .select-wrap select option{
  background:#ffffff !important;
  color:#071321 !important;
}
html[data-theme="light"] .select-wrap select option:checked,
body.light-mode .select-wrap select option:checked{
  background:#f2c76a !important;
  color:#071321 !important;
}
@media(max-width:760px){
  .select-wrap select{min-width:0;}
}


/* VELAEA Community formula-bound filter polish */
.pro-filter-panel{
  overflow:visible!important;
}
.control-row{
  align-items:stretch!important;
}
.select-wrap{
  min-height:44px!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
}
.select-wrap > span{
  flex:0 0 auto!important;
  color:var(--community-muted)!important;
  font-size:11px!important;
  letter-spacing:.04em!important;
  text-transform:uppercase!important;
}
.select-wrap select{
  flex:1 1 auto!important;
  min-width:145px!important;
  font-size:13px!important;
  line-height:1.2!important;
}
.sort-wrap select{
  min-width:190px!important;
}
.filter-chip.is-empty:not(.active){
  opacity:.48!important;
  cursor:not-allowed!important;
}
.filter-chip.active{
  color:#081423!important;
  background:linear-gradient(180deg,#ffe28a,#f2c76a)!important;
  border-color:rgba(255,226,138,.78)!important;
  box-shadow:0 12px 26px rgba(242,199,106,.16),0 0 0 1px rgba(255,255,255,.08) inset!important;
}
.filter-chip.active:hover{
  color:#081423!important;
}
.select-wrap.is-disabled{
  opacity:.58!important;
}
@media(max-width:760px){
  .control-row{display:grid!important;grid-template-columns:1fr!important;gap:9px!important;}
  .select-wrap{width:100%!important;}
  .select-wrap select,.sort-wrap select{min-width:0!important;width:100%!important;}
}


/* =========================================================
   VELAEA Trading Forum (scoped to ea-community.html)
   เพิ่มเฉพาะคลาส forum-* ไม่กระทบหน้าหลักอื่น
========================================================= */
.community-main-tabs{
  align-items:center;
  flex-wrap:wrap;
}
.community-section-tab{
  cursor:pointer;
}
.community-section-tab.active{
  box-shadow:0 18px 38px rgba(242,199,106,.22);
}
.forum-panel{
  margin-top:28px;
  padding-bottom:70px;
}
.forum-hero-card{
  position:relative;
  display:flex;
  justify-content:space-between;
  gap:24px;
  align-items:flex-start;
  padding:28px;
  border-radius:28px;
  border:1px solid rgba(242,199,106,.16);
  background:
    radial-gradient(circle at 88% 8%,rgba(242,199,106,.17),transparent 32%),
    linear-gradient(135deg,rgba(255,255,255,.055),rgba(255,255,255,.025));
  box-shadow:0 24px 70px rgba(0,0,0,.22);
  overflow:hidden;
}
.forum-hero-card:before{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(242,199,106,.34),transparent);
}
.forum-hero-card h2{
  margin:4px 0 12px;
  color:#fff;
  font-size:clamp(28px,4.2vw,52px);
  line-height:1.06;
  letter-spacing:-.055em;
}
.forum-hero-card p:not(.eyebrow){
  margin:0;
  max-width:740px;
  color:#b7c7d8;
  font-size:16px;
  line-height:1.75;
  font-weight:650;
}
.forum-hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:flex-end;
  min-width:240px;
}
.forum-tabs-shell{
  position:relative;
  display:flex;
  align-items:center;
  gap:10px;
  max-width:100%;
  min-width:0;
  margin:18px 0 6px;
}
.forum-tabs-shell::before,
.forum-tabs-shell::after{
  content:"";
  position:absolute;
  top:0;
  bottom:8px;
  width:38px;
  pointer-events:none;
  z-index:2;
}
.forum-tabs-shell::before{
  left:42px;
  background:linear-gradient(90deg,rgba(7,16,28,.96),rgba(7,16,28,0));
}
.forum-tabs-shell::after{
  right:42px;
  background:linear-gradient(270deg,rgba(7,16,28,.96),rgba(7,16,28,0));
}
.forum-tabs{
  display:flex;
  gap:10px;
  flex:1 1 auto;
  min-width:0;
  max-width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:thin;
  scrollbar-color:rgba(242,199,106,.70) rgba(255,255,255,.06);
  padding:4px 2px 10px;
  scroll-behavior:smooth;
  scroll-snap-type:x proximity;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-x;
  cursor:grab;
}
.forum-tabs.is-dragging{
  cursor:grabbing;
  scroll-snap-type:none;
  user-select:none;
}
.forum-tabs::-webkit-scrollbar{height:6px}
.forum-tabs::-webkit-scrollbar-track{background:rgba(255,255,255,.06);border-radius:999px}
.forum-tabs::-webkit-scrollbar-thumb{background:linear-gradient(90deg,#ffe083,#c9972f);border-radius:999px}
.forum-tabs-nav{
  flex:0 0 34px;
  width:34px;
  height:34px;
  border-radius:999px;
  border:1px solid rgba(242,199,106,.34);
  background:rgba(255,255,255,.055);
  color:#ffd66e;
  font-size:24px;
  line-height:1;
  font-weight:900;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow:0 10px 22px rgba(0,0,0,.20);
  transition:transform .18s ease,opacity .18s ease,border-color .18s ease,background .18s ease;
  z-index:3;
}
.forum-tabs-nav:hover:not(:disabled){
  transform:translateY(-1px);
  border-color:rgba(242,199,106,.70);
  background:rgba(242,199,106,.12);
}
.forum-tabs-nav:disabled{
  opacity:.28;
  cursor:not-allowed;
  transform:none;
}
.forum-tab{
  flex:0 0 auto;
  scroll-snap-align:start;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.045);
  color:#c9d7e7;
  padding:10px 14px;
  border-radius:999px;
  font-size:13px;
  font-weight:900;
  white-space:nowrap;
  cursor:pointer;
  transition:transform .18s ease,border-color .18s ease,background .18s ease,color .18s ease;
}
.forum-tab:hover{
  transform:translateY(-1px);
  border-color:rgba(242,199,106,.30);
}
.forum-tab.active{
  color:#1d1306;
  border-color:rgba(242,199,106,.75);
  background:linear-gradient(135deg,#ffe083,#c9972f);
  box-shadow:0 16px 30px rgba(242,199,106,.16);
}
.forum-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) 340px;
  gap:18px;
  align-items:start;
  margin-top:14px;
}
.forum-main,.forum-sidebar{
  min-width:0;
}
.forum-toolbar{
  display:grid;
  grid-template-columns:minmax(0,1fr) 190px;
  gap:10px;
  padding:12px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(2,12,25,.78);
}
.forum-search{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
  padding:0 12px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.24);
}
.forum-search span{
  color:#f2c76a;
  font-weight:950;
}
.forum-search input,.forum-toolbar select,
.forum-compose-card input,.forum-compose-card select,.forum-compose-card textarea{
  width:100%;
  min-width:0;
  border:0;
  outline:0;
  color:#f4f8ff;
  background:transparent;
  font:inherit;
  font-weight:800;
}
.forum-toolbar select,.forum-compose-card select,.forum-compose-card input,.forum-compose-card textarea{
  border:1px solid rgba(255,255,255,.10);
  background:rgba(3,13,25,.76);
  border-radius:16px;
  padding:12px 14px;
}
.forum-compose-card{
  margin-top:14px;
  padding:18px;
  border-radius:24px;
  border:1px solid rgba(242,199,106,.18);
  background:
    radial-gradient(circle at 90% 10%,rgba(242,199,106,.10),transparent 30%),
    rgba(7,20,35,.92);
}
.forum-compose-head,.forum-compose-actions{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
}
.forum-compose-head strong{
  display:block;
  color:#fff;
  font-size:18px;
  font-weight:950;
}
.forum-compose-head span,.forum-compose-actions small{
  display:block;
  color:#9fb0c4;
  font-size:12px;
  line-height:1.55;
  font-weight:750;
}
.forum-icon-btn{
  width:36px;
  height:36px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:12px;
  color:#fff;
  background:rgba(255,255,255,.05);
  cursor:pointer;
  font-size:20px;
  font-weight:900;
}
.forum-compose-grid{
  display:grid;
  grid-template-columns:220px minmax(0,1fr);
  gap:12px;
  margin-top:16px;
}
.forum-compose-card label span{
  display:block;
  color:#f2c76a;
  font-size:11px;
  line-height:1.2;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-weight:950;
  margin-bottom:8px;
}
.forum-compose-body{
  display:block;
  margin-top:12px;
}
.forum-compose-card textarea{
  resize:vertical;
  min-height:120px;
  line-height:1.6;
  font-weight:700;
}
.forum-compose-actions{
  margin-top:14px;
}
.forum-loading,.forum-empty{
  margin-top:14px;
  padding:22px;
  border-radius:22px;
  border:1px dashed rgba(255,255,255,.16);
  color:#9fb0c4;
  background:rgba(255,255,255,.03);
  text-align:center;
  font-weight:850;
}
.forum-category-list{
  display:grid;
  gap:10px;
  margin-top:14px;
}
.forum-category-card{
  display:grid;
  grid-template-columns:54px minmax(0,1fr) auto;
  gap:14px;
  align-items:center;
  padding:16px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(135deg,rgba(255,255,255,.055),rgba(255,255,255,.025));
  cursor:pointer;
  transition:transform .18s ease,border-color .18s ease,background .18s ease;
}
.forum-category-card:hover{
  transform:translateY(-2px);
  border-color:rgba(242,199,106,.24);
  background:linear-gradient(135deg,rgba(242,199,106,.075),rgba(255,255,255,.028));
}
.forum-category-icon{
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  border-radius:18px;
  color:#f2c76a;
  background:rgba(242,199,106,.10);
  border:1px solid rgba(242,199,106,.16);
  font-size:24px;
}
.forum-category-info h3{
  margin:0 0 5px;
  color:#fff;
  font-size:18px;
  font-weight:950;
  letter-spacing:-.025em;
}
.forum-category-info p{
  margin:0;
  color:#9fb0c4;
  font-size:13px;
  line-height:1.5;
  font-weight:700;
}
.forum-category-stats{
  display:grid;
  grid-template-columns:repeat(2,74px);
  gap:8px;
  text-align:center;
}
.forum-category-stats span{
  display:block;
  border-radius:15px;
  padding:8px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.18);
  color:#f2c76a;
  font-weight:950;
  font-size:14px;
}
.forum-category-stats small{
  display:block;
  margin-top:2px;
  color:#9fb0c4;
  font-size:10px;
  font-weight:850;
}
.forum-topic-list{
  display:grid;
  gap:10px;
  margin-top:14px;
}
.forum-topic-card{
  padding:16px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(135deg,rgba(255,255,255,.052),rgba(255,255,255,.022));
  cursor:pointer;
}
.forum-topic-card:hover{
  border-color:rgba(242,199,106,.24);
}
.forum-topic-top{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-start;
}
.forum-topic-title{
  margin:0;
  color:#fff;
  font-size:17px;
  font-weight:950;
  letter-spacing:-.02em;
}
.forum-topic-meta{
  margin-top:7px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  color:#9fb0c4;
  font-size:11px;
  font-weight:800;
}
.forum-topic-excerpt{
  margin:10px 0 0;
  color:#c9d7e7;
  font-size:13px;
  line-height:1.55;
  font-weight:650;
}
.forum-topic-badges{
  display:flex;
  gap:7px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.forum-badge{
  border-radius:999px;
  padding:6px 9px;
  color:#f4d888;
  background:rgba(242,199,106,.09);
  border:1px solid rgba(242,199,106,.16);
  font-size:11px;
  font-weight:950;
}
.forum-topic-foot{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  margin-top:13px;
  padding-top:12px;
  border-top:1px solid rgba(255,255,255,.06);
}
.forum-topic-counts{
  display:flex;
  gap:12px;
  color:#9fb0c4;
  font-size:12px;
  font-weight:850;
}
.forum-topic-actions{
  display:flex;
  gap:8px;
}
.forum-mini-btn{
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.045);
  color:#eaf2ff;
  border-radius:999px;
  padding:8px 10px;
  cursor:pointer;
  font-size:12px;
  font-weight:900;
}
.forum-mini-btn:hover{
  border-color:rgba(242,199,106,.28);
  color:#f2c76a;
}
.forum-side-card{
  padding:16px;
  margin-bottom:12px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(135deg,rgba(255,255,255,.052),rgba(255,255,255,.022));
}
.forum-side-card h3{
  margin:0 0 12px;
  color:#fff;
  font-size:16px;
  font-weight:950;
}
.forum-recent-list{
  display:grid;
  gap:10px;
}
.forum-recent-item{
  display:block;
  color:#dce8f8;
  text-decoration:none;
  border-radius:16px;
  padding:10px;
  background:rgba(0,0,0,.18);
  border:1px solid rgba(255,255,255,.06);
}
.forum-recent-item strong{
  display:block;
  font-size:13px;
  line-height:1.35;
  color:#fff;
}
.forum-recent-item span{
  display:block;
  margin-top:5px;
  color:#9fb0c4;
  font-size:11px;
  font-weight:800;
}
.forum-rules{
  margin:0;
  padding-left:18px;
  color:#c9d7e7;
  font-size:13px;
  line-height:1.65;
  font-weight:700;
}
.forum-account-card p{
  margin:0;
  color:#9fb0c4;
  font-size:13px;
  line-height:1.65;
  font-weight:700;
}
.forum-thread-modal{
  position:fixed;
  inset:0;
  z-index:1100;
  display:grid;
  place-items:center;
  padding:24px;
  background:rgba(0,0,0,.62);
  backdrop-filter:blur(12px);
}
.forum-thread-modal[hidden]{display:none}
.forum-thread-card{
  width:min(980px,100%);
  max-height:min(82vh,860px);
  overflow:auto;
  border-radius:26px;
  border:1px solid rgba(242,199,106,.18);
  background:#06111f;
  box-shadow:0 32px 90px rgba(0,0,0,.46);
}
.forum-thread-head{
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:20px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.forum-thread-head h3{
  margin:0;
  color:#fff;
  font-size:23px;
  line-height:1.25;
}
.forum-thread-body{
  padding:20px;
}
.forum-thread-post,.forum-reply{
  padding:16px;
  border-radius:18px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.07);
}
.forum-thread-post p,.forum-reply p{
  margin:8px 0 0;
  color:#dce8f8;
  line-height:1.7;
  white-space:pre-wrap;
}
.forum-replies{
  display:grid;
  gap:10px;
  margin-top:14px;
}
.forum-reply-form{
  margin-top:14px;
  display:grid;
  gap:10px;
}
.forum-reply-form textarea{
  width:100%;
  min-height:96px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:18px;
  padding:12px;
  background:rgba(0,0,0,.24);
  color:#fff;
  font:inherit;
}
@media(max-width:980px){
  .forum-hero-card{display:block;padding:22px;border-radius:24px}
  .forum-hero-actions{justify-content:flex-start;min-width:0;margin-top:16px}
  .forum-layout{grid-template-columns:1fr}
  .forum-toolbar{grid-template-columns:1fr}
  .forum-compose-grid{grid-template-columns:1fr}
  .forum-category-card{grid-template-columns:44px minmax(0,1fr)}
  .forum-category-icon{width:44px;height:44px;border-radius:15px;font-size:20px}
  .forum-category-stats{grid-column:1/-1;grid-template-columns:repeat(2,minmax(0,1fr))}
  .forum-topic-top,.forum-topic-foot,.forum-compose-actions{display:block}
  .forum-topic-badges,.forum-topic-actions{justify-content:flex-start;margin-top:10px}
  .forum-topic-counts{margin-bottom:10px;flex-wrap:wrap}
  .forum-thread-modal{padding:12px}
  .forum-thread-card{max-height:88vh;border-radius:22px}
}
html[data-theme="light"] .forum-hero-card,
body.light-mode .forum-hero-card,
html[data-theme="light"] .forum-toolbar,
body.light-mode .forum-toolbar,
html[data-theme="light"] .forum-compose-card,
body.light-mode .forum-compose-card,
html[data-theme="light"] .forum-category-card,
body.light-mode .forum-category-card,
html[data-theme="light"] .forum-topic-card,
body.light-mode .forum-topic-card,
html[data-theme="light"] .forum-side-card,
body.light-mode .forum-side-card{
  background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(248,244,235,.92));
  border-color:rgba(201,149,46,.18);
  box-shadow:0 16px 42px rgba(8,24,42,.07);
}
html[data-theme="light"] .forum-hero-card h2,
body.light-mode .forum-hero-card h2,
html[data-theme="light"] .forum-category-info h3,
body.light-mode .forum-category-info h3,
html[data-theme="light"] .forum-topic-title,
body.light-mode .forum-topic-title,
html[data-theme="light"] .forum-side-card h3,
body.light-mode .forum-side-card h3{
  color:#08182b;
}
html[data-theme="light"] .forum-hero-card p:not(.eyebrow),
body.light-mode .forum-hero-card p:not(.eyebrow),
html[data-theme="light"] .forum-category-info p,
body.light-mode .forum-category-info p,
html[data-theme="light"] .forum-topic-excerpt,
body.light-mode .forum-topic-excerpt,
html[data-theme="light"] .forum-rules,
body.light-mode .forum-rules,
html[data-theme="light"] .forum-account-card p,
body.light-mode .forum-account-card p{
  color:#53657a;
}
html[data-theme="light"] .forum-search,
body.light-mode .forum-search,
html[data-theme="light"] .forum-toolbar select,
body.light-mode .forum-toolbar select,
html[data-theme="light"] .forum-compose-card input,
body.light-mode .forum-compose-card input,
html[data-theme="light"] .forum-compose-card select,
body.light-mode .forum-compose-card select,
html[data-theme="light"] .forum-compose-card textarea,
body.light-mode .forum-compose-card textarea{
  background:#fff;
  color:#08182b;
  border-color:rgba(201,149,46,.18);
}

.forum-list-heading{margin:18px 2px 4px;color:#f2c76a;font-size:12px;font-weight:950;letter-spacing:.12em;text-transform:uppercase;}

/* VELAEA Trade Detail Fields */
.trade-panel,.trade-table-wrap{overflow-x:auto;}
.trade-detail-table{min-width:1100px;}

/* History pagination - community detail drawer */
.history-note{margin:0 0 10px;color:var(--muted,#9aa9bc);font-size:.88rem;font-weight:700}
.history-pagination{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:14px;padding-top:12px;border-top:1px solid rgba(255,255,255,.08)}
.history-page-btn{min-width:38px;height:34px;padding:0 12px;border-radius:12px;border:1px solid rgba(242,199,106,.25);background:rgba(255,255,255,.05);color:var(--text,#eef5ff);font-weight:800;cursor:pointer}
.history-page-btn.active{background:linear-gradient(135deg,#f7d774,#c9922e);color:#07111f;border-color:transparent;box-shadow:0 8px 22px rgba(217,168,72,.22)}
.history-page-btn:disabled{opacity:.45;cursor:not-allowed}.history-nav{min-width:82px}.history-ellipsis{color:var(--muted,#9aa9bc);font-weight:900;padding:0 3px}.history-cashflow-row td{background:rgba(242,199,106,.035)}
@media(max-width:600px){.history-pagination{gap:6px}.history-page-btn{min-width:34px;height:32px;padding:0 10px}.history-nav{min-width:68px}}

/* =========================================================
   VELAEA Professional Detail Drawer Patch
   - wider drawer, tabbed sections, safe text wrapping, table scroll
   ========================================================= */
body.detail-open{overflow:hidden;}
.detail-backdrop{background:rgba(0,0,0,.66)!important;backdrop-filter:blur(10px)!important;}
.detail-drawer{
  width:min(1240px,calc(100vw - 32px))!important;
  right:16px!important;top:16px!important;bottom:16px!important;
  border-radius:26px!important;
  overflow:hidden!important;
  display:flex!important;flex-direction:column!important;
  background:linear-gradient(180deg,rgba(7,18,32,.97),rgba(4,12,22,.96))!important;
  box-shadow:0 30px 110px rgba(0,0,0,.58),0 0 0 1px rgba(242,199,106,.12)!important;
}
.detail-close{
  position:absolute!important;top:18px!important;right:18px!important;margin:0!important;
  z-index:10!important;width:46px!important;height:46px!important;
  border-radius:16px!important;background:rgba(255,255,255,.08)!important;
  backdrop-filter:blur(10px);box-shadow:0 12px 26px rgba(0,0,0,.22);
}
#detailContent{height:100%;overflow:auto;scrollbar-width:thin;scrollbar-color:rgba(242,199,106,.55) rgba(255,255,255,.06);}
#detailContent::-webkit-scrollbar{width:10px;height:10px;}
#detailContent::-webkit-scrollbar-thumb{background:rgba(242,199,106,.48);border-radius:999px;}
#detailContent::-webkit-scrollbar-track{background:rgba(255,255,255,.04);}
.professional-detail-inner{padding:28px!important;padding-right:78px!important;min-width:0;}
.professional-detail-hero{grid-template-columns:minmax(0,1fr) 190px!important;align-items:stretch!important;}
.detail-title,.detail-sub-wrap,.pill-row,.professional-share-row{min-width:0;}
.detail-title{max-width:100%;overflow-wrap:anywhere;word-break:break-word;}
.detail-sub-wrap{white-space:normal!important;overflow-wrap:anywhere;word-break:break-word;}
.professional-share-row{justify-content:flex-start!important;flex-wrap:wrap!important;margin:14px 0 16px!important;}
.professional-share-row .btn{white-space:normal!important;line-height:1.25;text-align:center;}
.professional-detail-metrics{grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:10px!important;}
.professional-detail-metrics .metric{overflow:hidden;}
.professional-detail-metrics .metric strong,
.professional-detail-metrics .metric small{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.professional-detail-metrics .metric-risk-type strong,
.professional-detail-metrics .metric-risk-type em{white-space:normal!important;overflow-wrap:anywhere;word-break:break-word;}
.detail-tabs{
  position:sticky;top:0;z-index:6;margin:18px 0 14px;padding:8px;
  display:flex;gap:8px;flex-wrap:wrap;
  border:1px solid rgba(242,199,106,.18);border-radius:18px;
  background:rgba(3,12,23,.88);backdrop-filter:blur(18px);
  box-shadow:0 14px 34px rgba(0,0,0,.16);
}
.detail-tab-btn{
  min-height:40px;padding:0 16px;border-radius:14px;border:1px solid rgba(255,255,255,.09);
  background:rgba(255,255,255,.045);color:var(--community-muted);font-weight:950;cursor:pointer;
  transition:.18s ease;white-space:nowrap;
}
.detail-tab-btn:hover{color:var(--community-gold);border-color:rgba(242,199,106,.38);background:rgba(242,199,106,.08);}
.detail-tab-btn.active{color:#07101f;background:linear-gradient(135deg,var(--community-gold),var(--community-gold2));border-color:rgba(242,199,106,.66);box-shadow:0 10px 26px rgba(242,199,106,.16);}
.detail-tab-content{min-width:0;}
.detail-tab-panel{animation:detailFadeIn .16s ease both;min-width:0;}
.detail-tab-panel[hidden]{display:none!important;}
@keyframes detailFadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.detail-overview-grid{grid-template-columns:minmax(0,1.35fr) minmax(330px,.85fr)!important;gap:14px!important;}
.detail-columns.professional-two-col{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important;}
.big-chart,.side-chart,.trade-panel,.info-panel{min-width:0;}
.trade-panel{max-height:none!important;overflow:visible!important;}
.trade-panel-full{padding:18px!important;}
.panel-title-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;}
.panel-title-row h3{margin:0!important;}
.trade-table-wrap{
  max-width:100%;overflow:auto!important;border:1px solid rgba(255,255,255,.08);border-radius:16px;
  background:rgba(0,0,0,.12);scrollbar-width:thin;scrollbar-color:rgba(242,199,106,.45) rgba(255,255,255,.04);
}
.trade-table-wrap::-webkit-scrollbar{height:10px;width:10px;}
.trade-table-wrap::-webkit-scrollbar-thumb{background:rgba(242,199,106,.45);border-radius:999px;}
.trade-detail-table{min-width:1040px!important;table-layout:auto;}
.trade-detail-table thead th{position:sticky;top:0;z-index:2;background:rgba(7,18,32,.98);backdrop-filter:blur(8px);}
.trade-detail-table th,.trade-detail-table td{white-space:nowrap;vertical-align:middle;}
.trade-detail-table .trade-comment{white-space:normal!important;min-width:220px;max-width:360px;overflow-wrap:anywhere;word-break:break-word;line-height:1.45;}
.history-cashflow-row td{background:rgba(242,199,106,.035);}
.info-list{gap:0!important;}
.info-list .info-row{display:grid!important;grid-template-columns:minmax(125px,.55fr) minmax(0,1fr)!important;align-items:start;gap:14px!important;padding:10px 0!important;min-width:0;}
.info-list .info-row span{min-width:0;color:var(--community-muted);font-weight:900;}
.info-list .info-row strong{max-width:100%!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;text-align:right;overflow-wrap:anywhere;word-break:break-word;line-height:1.45;}
.risk-type-expanded{min-height:100%;display:flex;flex-direction:column;gap:12px;align-items:flex-start;justify-content:flex-start;}
.risk-type-expanded strong{font-size:24px;line-height:1.14;letter-spacing:-.03em;color:var(--community-text);overflow-wrap:anywhere;}
.risk-type-expanded p{margin:0;color:var(--community-muted);line-height:1.7;font-weight:800;overflow-wrap:anywhere;}
.history-pagination{position:relative;z-index:2;}
.history-page-btn{font-weight:950;}
html[data-theme="light"] .detail-drawer{background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(246,249,253,.98))!important;box-shadow:0 30px 100px rgba(8,24,42,.18),0 0 0 1px rgba(200,149,46,.16)!important;}
html[data-theme="light"] .detail-tabs{background:rgba(255,255,255,.88);}
html[data-theme="light"] .trade-detail-table thead th{background:rgba(255,255,255,.98);}
html[data-theme="light"] .trade-table-wrap{background:rgba(9,24,42,.025);border-color:rgba(9,24,42,.09);}
@media(max-width:1200px){
  .professional-detail-metrics{grid-template-columns:repeat(4,minmax(0,1fr))!important;}
  .detail-overview-grid{grid-template-columns:1fr!important;}
}
@media(max-width:900px){
  .detail-drawer{left:10px!important;right:10px!important;top:10px!important;bottom:10px!important;width:auto!important;border-radius:22px!important;}
  .professional-detail-inner{padding:22px!important;padding-top:72px!important;}
  .professional-detail-hero{grid-template-columns:1fr!important;}
  .detail-score{max-width:240px;}
  .professional-detail-metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .detail-columns.professional-two-col{grid-template-columns:1fr!important;}
  .detail-tabs{position:relative;top:auto;overflow-x:auto;flex-wrap:nowrap;padding:7px;}
  .detail-tab-btn{flex:0 0 auto;}
}
@media(max-width:600px){
  .detail-drawer{inset:0!important;border-radius:0!important;width:auto!important;}
  .detail-close{top:12px!important;right:12px!important;}
  .professional-detail-inner{padding:18px!important;padding-top:66px!important;}
  .detail-title{font-size:25px!important;}
  .professional-detail-metrics{grid-template-columns:1fr!important;}
  .detail-tabs{margin-left:-2px;margin-right:-2px;}
  .trade-detail-table{min-width:920px!important;}
  .info-list .info-row{grid-template-columns:1fr!important;gap:4px!important;}
  .info-list .info-row strong{text-align:left!important;}
  .panel-title-row{align-items:flex-start;flex-direction:column;}
}


/* Forum category tabs: professional horizontal scroller */
@media (max-width: 680px){
  .forum-tabs-shell{gap:7px;margin:14px -2px 4px}
  .forum-tabs-shell::before{left:34px;width:24px}
  .forum-tabs-shell::after{right:34px;width:24px}
  .forum-tabs-nav{flex-basis:30px;width:30px;height:30px;font-size:21px}
  .forum-tab{padding:9px 12px;font-size:12px}
}


/* =========================================================
   VELAEA Forum Light Mode Professional Polish
   Scope: ea-community.html only (body.ea-community-page)
   - stronger secondary text contrast
   - clearer topic actions / stats / meta
   - premium white cards and sidebar balance
   ========================================================= */
html[data-theme="light"] body.ea-community-page{
  --forum-light-text:#0b1b2d;
  --forum-light-muted:#4f6379;
  --forum-light-soft:#657b92;
  --forum-light-blue:#285f94;
  --forum-light-gold:#a66f09;
  --forum-light-gold-2:#8a5706;
  --forum-light-line:rgba(166,111,9,.24);
  --forum-light-card:#fffdf8;
  --forum-light-card-2:#f8fbff;
}

html[data-theme="light"] body.ea-community-page .community-header{
  background:rgba(255,255,255,.92)!important;
  border-bottom:1px solid rgba(7,26,47,.08)!important;
  box-shadow:0 10px 30px rgba(7,26,47,.05)!important;
}
html[data-theme="light"] body.ea-community-page .community-menu a{
  color:#33495f!important;
}
html[data-theme="light"] body.ea-community-page .community-menu a:hover,
html[data-theme="light"] body.ea-community-page .community-menu a.active{
  color:#7a4d06!important;
  background:#fff4dc!important;
  box-shadow:inset 0 0 0 1px rgba(166,111,9,.10)!important;
}
html[data-theme="light"] body.ea-community-page .community-auth-btn.auth-action-btn[data-auth-state="logged-in"]{
  background:linear-gradient(135deg,#ffe0a0,#d59b34)!important;
  color:#1d1205!important;
  border-color:rgba(139,87,6,.18)!important;
  box-shadow:0 12px 26px rgba(166,111,9,.18)!important;
  text-shadow:none!important;
}
html[data-theme="light"] body.ea-community-page .community-auth-btn.auth-action-btn[data-auth-state="logged-in"] .auth-text,
html[data-theme="light"] body.ea-community-page .community-auth-btn.auth-action-btn[data-auth-state="logged-in"] #profileName{
  color:#1d1205!important;
}
html[data-theme="light"] body.ea-community-page .community-auth-btn.auth-action-btn[data-auth-state="logged-in"] .auth-dot{
  background:rgba(18,155,97,.16)!important;
  color:#078653!important;
  box-shadow:none!important;
}

html[data-theme="light"] body.ea-community-page .forum-panel{
  color:var(--forum-light-text)!important;
}
html[data-theme="light"] body.ea-community-page .forum-list-heading,
html[data-theme="light"] body.ea-community-page .forum-panel .eyebrow{
  color:var(--forum-light-gold)!important;
  text-shadow:none!important;
  letter-spacing:.13em!important;
}

html[data-theme="light"] body.ea-community-page .forum-hero-card,
html[data-theme="light"] body.ea-community-page .forum-toolbar,
html[data-theme="light"] body.ea-community-page .forum-compose-card,
html[data-theme="light"] body.ea-community-page .forum-category-card,
html[data-theme="light"] body.ea-community-page .forum-topic-card,
html[data-theme="light"] body.ea-community-page .forum-side-card{
  background:
    radial-gradient(circle at 88% 4%,rgba(216,166,66,.16),transparent 34%),
    linear-gradient(135deg,var(--forum-light-card),#ffffff 52%,var(--forum-light-card-2))!important;
  border-color:var(--forum-light-line)!important;
  box-shadow:0 16px 42px rgba(7,26,47,.075)!important;
}
html[data-theme="light"] body.ea-community-page .forum-topic-card:hover,
html[data-theme="light"] body.ea-community-page .forum-category-card:hover,
html[data-theme="light"] body.ea-community-page .forum-recent-item:hover{
  border-color:rgba(166,111,9,.38)!important;
  box-shadow:0 20px 52px rgba(7,26,47,.10),0 0 0 1px rgba(216,166,66,.10)!important;
  transform:translateY(-1px);
}

html[data-theme="light"] body.ea-community-page .forum-hero-card h2,
html[data-theme="light"] body.ea-community-page .forum-category-info h3,
html[data-theme="light"] body.ea-community-page .forum-topic-title,
html[data-theme="light"] body.ea-community-page .forum-side-card h3,
html[data-theme="light"] body.ea-community-page .forum-thread-head h3{
  color:var(--forum-light-text)!important;
  text-shadow:none!important;
}
html[data-theme="light"] body.ea-community-page .forum-hero-card p:not(.eyebrow),
html[data-theme="light"] body.ea-community-page .forum-category-info p,
html[data-theme="light"] body.ea-community-page .forum-topic-excerpt,
html[data-theme="light"] body.ea-community-page .forum-rules,
html[data-theme="light"] body.ea-community-page .forum-account-card p,
html[data-theme="light"] body.ea-community-page .forum-thread-post p,
html[data-theme="light"] body.ea-community-page .forum-reply p{
  color:#22364b!important;
  font-weight:700!important;
}

html[data-theme="light"] body.ea-community-page .forum-topic-meta,
html[data-theme="light"] body.ea-community-page .forum-compose-head span,
html[data-theme="light"] body.ea-community-page .forum-compose-actions small,
html[data-theme="light"] body.ea-community-page .forum-category-stats small,
html[data-theme="light"] body.ea-community-page .forum-recent-item span{
  color:var(--forum-light-muted)!important;
  font-weight:850!important;
}
html[data-theme="light"] body.ea-community-page .forum-topic-meta a,
html[data-theme="light"] body.ea-community-page .forum-recent-item span a{
  color:var(--forum-light-blue)!important;
  font-weight:950!important;
}

html[data-theme="light"] body.ea-community-page .forum-topic-counts{
  color:#536a82!important;
  font-weight:900!important;
}
html[data-theme="light"] body.ea-community-page .forum-topic-counts span,
html[data-theme="light"] body.ea-community-page .forum-topic-counts b,
html[data-theme="light"] body.ea-community-page .forum-topic-counts strong{
  color:#28506f!important;
  font-weight:950!important;
}
html[data-theme="light"] body.ea-community-page .forum-topic-foot{
  border-top-color:rgba(7,26,47,.10)!important;
}

html[data-theme="light"] body.ea-community-page .forum-mini-btn{
  background:linear-gradient(180deg,#ffffff,#fff7e6)!important;
  color:var(--forum-light-gold-2)!important;
  border-color:rgba(166,111,9,.26)!important;
  box-shadow:0 8px 18px rgba(166,111,9,.08)!important;
}
html[data-theme="light"] body.ea-community-page .forum-mini-btn:hover{
  background:linear-gradient(135deg,#ffe7ad,#ffffff)!important;
  color:#5c3a03!important;
  border-color:rgba(166,111,9,.46)!important;
  box-shadow:0 10px 24px rgba(166,111,9,.14)!important;
}

html[data-theme="light"] body.ea-community-page .forum-badge,
html[data-theme="light"] body.ea-community-page .forum-category-icon{
  color:var(--forum-light-gold-2)!important;
  background:#fff4dc!important;
  border-color:rgba(166,111,9,.22)!important;
}
html[data-theme="light"] body.ea-community-page .forum-category-stats span{
  background:linear-gradient(180deg,#ffffff,#f6f9fd)!important;
  border-color:rgba(7,26,47,.10)!important;
  color:#7b520b!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75)!important;
}

html[data-theme="light"] body.ea-community-page .forum-recent-item{
  background:linear-gradient(180deg,#ffffff,#f8fbff)!important;
  border-color:rgba(7,26,47,.10)!important;
  color:var(--forum-light-text)!important;
  box-shadow:0 8px 20px rgba(7,26,47,.045)!important;
}
html[data-theme="light"] body.ea-community-page .forum-recent-item strong{
  color:var(--forum-light-text)!important;
}

html[data-theme="light"] body.ea-community-page .forum-search,
html[data-theme="light"] body.ea-community-page .forum-toolbar select,
html[data-theme="light"] body.ea-community-page .forum-compose-card input,
html[data-theme="light"] body.ea-community-page .forum-compose-card select,
html[data-theme="light"] body.ea-community-page .forum-compose-card textarea{
  background:#ffffff!important;
  color:var(--forum-light-text)!important;
  border-color:rgba(7,26,47,.14)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85)!important;
}
html[data-theme="light"] body.ea-community-page .forum-search input::placeholder,
html[data-theme="light"] body.ea-community-page .forum-compose-card textarea::placeholder{
  color:#7a8ca0!important;
}
html[data-theme="light"] body.ea-community-page .forum-search span{
  color:var(--forum-light-gold)!important;
}

html[data-theme="light"] body.ea-community-page .forum-thread-modal{
  background:rgba(10,24,40,.34)!important;
}
html[data-theme="light"] body.ea-community-page .forum-thread-card{
  background:#ffffff!important;
  border-color:rgba(166,111,9,.20)!important;
  box-shadow:0 28px 80px rgba(7,26,47,.20)!important;
}
html[data-theme="light"] body.ea-community-page .forum-thread-head{
  border-bottom-color:rgba(7,26,47,.10)!important;
}
html[data-theme="light"] body.ea-community-page .forum-thread-post,
html[data-theme="light"] body.ea-community-page .forum-reply{
  background:#f8fbff!important;
  border-color:rgba(7,26,47,.10)!important;
}
html[data-theme="light"] body.ea-community-page .forum-reply-form textarea{
  background:#ffffff!important;
  color:var(--forum-light-text)!important;
  border-color:rgba(7,26,47,.14)!important;
}

html[data-theme="light"] body.ea-community-page .forum-layout{
  align-items:start;
}
@media (min-width:981px){
  html[data-theme="light"] body.ea-community-page .forum-layout{
    grid-template-columns:minmax(0,1fr) minmax(320px,340px)!important;
  }
  html[data-theme="light"] body.ea-community-page .forum-sidebar{
    position:sticky;
    top:84px;
  }
}

/* =========================================================
   Forum category tabs - Light Mode professional fix
   Scope: ea-community.html only
   Fixes: unreadable fade overlay, click/scroll affordance, pale text.
   ========================================================= */
html[data-theme="light"] body.ea-community-page .forum-tabs-shell{
  margin:18px 0 12px!important;
  padding:8px!important;
  border:1px solid rgba(166,111,9,.20)!important;
  border-radius:999px!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.94),rgba(248,251,255,.92)),
    radial-gradient(circle at 80% 50%,rgba(216,166,66,.13),transparent 42%)!important;
  box-shadow:0 16px 40px rgba(7,26,47,.08)!important;
  overflow:hidden!important;
}
html[data-theme="light"] body.ea-community-page .forum-tabs-shell::before,
html[data-theme="light"] body.ea-community-page .forum-tabs-shell::after{
  display:none!important;
}
html[data-theme="light"] body.ea-community-page .forum-tabs{
  gap:9px!important;
  padding:4px 4px 8px!important;
  scrollbar-color:rgba(181,123,22,.78) rgba(7,26,47,.08)!important;
  cursor:grab!important;
}
html[data-theme="light"] body.ea-community-page .forum-tabs::-webkit-scrollbar{height:7px!important}
html[data-theme="light"] body.ea-community-page .forum-tabs::-webkit-scrollbar-track{
  background:rgba(7,26,47,.08)!important;
  border-radius:999px!important;
}
html[data-theme="light"] body.ea-community-page .forum-tabs::-webkit-scrollbar-thumb{
  background:linear-gradient(90deg,#b57b16,#f0c764)!important;
  border-radius:999px!important;
  border:1px solid rgba(255,255,255,.60)!important;
}
html[data-theme="light"] body.ea-community-page .forum-tabs.is-dragging{
  cursor:grabbing!important;
}
html[data-theme="light"] body.ea-community-page .forum-tabs-nav{
  flex:0 0 38px!important;
  width:38px!important;
  height:38px!important;
  background:linear-gradient(180deg,#ffffff,#fff5dc)!important;
  color:#8a5706!important;
  border:1px solid rgba(166,111,9,.30)!important;
  box-shadow:0 10px 24px rgba(166,111,9,.13)!important;
  text-shadow:none!important;
  opacity:1!important;
}
html[data-theme="light"] body.ea-community-page .forum-tabs-nav:hover:not(:disabled){
  background:linear-gradient(135deg,#ffe3a0,#ffffff)!important;
  color:#5c3a03!important;
  border-color:rgba(166,111,9,.48)!important;
  transform:translateY(-1px)!important;
}
html[data-theme="light"] body.ea-community-page .forum-tabs-nav:disabled{
  opacity:.45!important;
  background:#ffffff!important;
  color:#b0bdc9!important;
  border-color:rgba(7,26,47,.10)!important;
  box-shadow:none!important;
}
html[data-theme="light"] body.ea-community-page .forum-tab{
  background:linear-gradient(180deg,#ffffff,#f8fbff)!important;
  color:#33495f!important;
  border:1px solid rgba(7,26,47,.13)!important;
  box-shadow:0 7px 18px rgba(7,26,47,.055)!important;
  text-shadow:none!important;
}
html[data-theme="light"] body.ea-community-page .forum-tab:hover,
html[data-theme="light"] body.ea-community-page .forum-tab:focus-visible{
  color:#7a4d06!important;
  background:linear-gradient(180deg,#fffdf7,#fff2d2)!important;
  border-color:rgba(166,111,9,.36)!important;
  outline:none!important;
  box-shadow:0 10px 24px rgba(166,111,9,.12),0 0 0 3px rgba(242,199,106,.20)!important;
}
html[data-theme="light"] body.ea-community-page .forum-tab.active{
  color:#1d1205!important;
  border-color:rgba(166,111,9,.48)!important;
  background:linear-gradient(135deg,#f2be45,#ffe8a6 62%,#ffffff)!important;
  box-shadow:0 14px 28px rgba(166,111,9,.16),inset 0 1px 0 rgba(255,255,255,.75)!important;
}
html[data-theme="light"] body.ea-community-page .forum-toolbar{
  margin-top:12px!important;
}
@media (max-width:720px){
  html[data-theme="light"] body.ea-community-page .forum-tabs-shell{
    border-radius:22px!important;
    padding:7px!important;
  }
  html[data-theme="light"] body.ea-community-page .forum-tabs-nav{
    flex-basis:34px!important;
    width:34px!important;
    height:34px!important;
  }
  html[data-theme="light"] body.ea-community-page .forum-tab{
    padding:9px 12px!important;
    font-size:12px!important;
  }
}


/* =========================================================
   Global Drawdown Curve style for Community detail charts
   ========================================================= */
.velaea-dd-curve{
  width:100%;
  height:220px;
  min-height:220px;
  display:block;
  overflow:visible;
}
.velaea-dd-grid-y,
.velaea-dd-grid-x{
  stroke:rgba(255,255,255,.08);
  stroke-width:1;
  stroke-dasharray:4 7;
}
.velaea-dd-grid-x{
  stroke:rgba(255,255,255,.045);
}
.velaea-dd-axis{
  fill:var(--community-muted);
  font-size:10px;
  font-weight:900;
  paint-order:stroke;
  stroke:rgba(2,8,20,.82);
  stroke-width:2.8px;
  stroke-linejoin:round;
}
.velaea-dd-tick-dot{
  fill:rgba(242,199,106,.78);
}
.velaea-dd-area{
  fill:rgba(255,104,104,.18);
}
.velaea-dd-line{
  fill:none;
  stroke:#ff6868;
  stroke-width:3.1;
  stroke-linecap:round;
  stroke-linejoin:round;
  filter:drop-shadow(0 0 12px rgba(255,104,104,.30));
}
.velaea-dd-callout{
  stroke:#ff6868;
  stroke-width:1.1;
  stroke-dasharray:4 4;
  opacity:.72;
}
.velaea-dd-max-dot{
  fill:#ff6868;
  stroke:rgba(2,8,20,.72);
  stroke-width:2;
  filter:drop-shadow(0 0 12px rgba(255,104,104,.48));
}
.velaea-dd-max-dot.halo{
  fill:rgba(255,104,104,.16);
  stroke:rgba(255,104,104,.36);
  stroke-width:1;
  filter:none;
}
.velaea-dd-max-label rect{
  fill:rgba(255,104,104,.13);
  stroke:rgba(255,104,104,.46);
  stroke-width:1.1;
  filter:drop-shadow(0 10px 20px rgba(0,0,0,.18));
}
.velaea-dd-max-label text{
  fill:#ff8f8f;
  font-size:11px;
  font-weight:1000;
  paint-order:stroke;
  stroke:rgba(2,8,20,.84);
  stroke-width:3px;
  stroke-linejoin:round;
}
html[data-theme="light"] .velaea-dd-grid-y,
body.light .velaea-dd-grid-y{
  stroke:rgba(8,24,42,.085);
}
html[data-theme="light"] .velaea-dd-grid-x,
body.light .velaea-dd-grid-x{
  stroke:rgba(8,24,42,.045);
}
html[data-theme="light"] .velaea-dd-axis,
body.light .velaea-dd-axis{
  fill:rgba(70,92,119,.74);
  stroke:rgba(255,255,255,.92);
}
html[data-theme="light"] .velaea-dd-max-label rect,
body.light .velaea-dd-max-label rect{
  fill:rgba(255,255,255,.92);
  stroke:rgba(255,104,104,.42);
  filter:drop-shadow(0 10px 20px rgba(255,104,104,.13));
}
html[data-theme="light"] .velaea-dd-max-label text,
body.light .velaea-dd-max-label text{
  fill:#c64242;
  stroke:rgba(255,255,255,.96);
}
html[data-theme="light"] .velaea-dd-max-dot,
body.light .velaea-dd-max-dot{
  stroke:rgba(255,255,255,.95);
}
html[data-theme="light"] .velaea-dd-callout,
body.light .velaea-dd-callout{
  stroke:rgba(214,72,72,.62);
}


/* =========================================================
   Community drawdown date line polish
   ========================================================= */
.velaea-dd-max-label text.value{
  font-size:11px;
  font-weight:1000;
}
.velaea-dd-max-label text.date{
  fill:rgba(255,210,210,.82);
  font-size:10px;
  font-weight:900;
  letter-spacing:.01em;
  paint-order:stroke;
  stroke:rgba(2,8,20,.84);
  stroke-width:2.8px;
  stroke-linejoin:round;
}
html[data-theme="light"] .velaea-dd-max-label text.date,
body.light .velaea-dd-max-label text.date{
  fill:#8f5b5b;
  stroke:rgba(255,255,255,.96);
}


/* =========================================================
   EA Community light-mode mini chart polish
   Scope: public showcase cards only. Keeps dark mode and other pages untouched.
   ========================================================= */
html[data-theme="light"] .showcase-card .chart-shell{
  background:
    radial-gradient(circle at 18% 12%,rgba(200,149,46,.075),transparent 33%),
    linear-gradient(180deg,#ffffff 0%,#fbfcff 52%,#f3f6fb 100%)!important;
  border-color:rgba(15,23,42,.105)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.98),
    0 10px 24px rgba(15,23,42,.045)!important;
}
html[data-theme="light"] .showcase-card .chart-shell::before{
  content:"";
  position:absolute;
  left:10px;
  right:10px;
  top:31px;
  bottom:10px;
  pointer-events:none;
  z-index:0;
  background:
    linear-gradient(to right,rgba(15,23,42,.040) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(15,23,42,.052) 1px,transparent 1px);
  background-size:25% 100%,100% 33.33%;
  mask-image:linear-gradient(90deg,transparent 0%,#000 7%,#000 93%,transparent 100%);
  opacity:.85;
}
html[data-theme="light"] .showcase-card .chart-shell::after{
  border-top-color:rgba(15,23,42,.075)!important;
  opacity:.72;
}
html[data-theme="light"] .showcase-card .chart-caption,
html[data-theme="light"] .showcase-card .spark-svg{
  position:relative;
  z-index:2;
}
html[data-theme="light"] .showcase-card .spark-svg stop:first-child{
  stop-color:#d6a342!important;
  stop-opacity:.18!important;
}
html[data-theme="light"] .showcase-card .spark-svg stop:last-child{
  stop-color:#d6a342!important;
  stop-opacity:0!important;
}
html[data-theme="light"] .showcase-card .spark-area{
  opacity:.12!important;
}
html[data-theme="light"] .showcase-card .spark-line{
  stroke:#b77916!important;
  stroke-width:3.15!important;
  filter:
    drop-shadow(0 0 4px rgba(183,121,22,.20))
    drop-shadow(0 0 10px rgba(214,163,66,.10))!important;
}
html[data-theme="light"] .showcase-card .spark-balance{
  stroke:rgba(61,93,129,.42)!important;
  stroke-width:1.35!important;
  filter:none!important;
  opacity:.82;
}
html[data-theme="light"] .showcase-card .spark-dot{
  fill:#b77916!important;
  stroke:#ffffff!important;
  stroke-width:1.4px!important;
  filter:
    drop-shadow(0 0 5px rgba(183,121,22,.25))
    drop-shadow(0 5px 10px rgba(15,23,42,.10))!important;
}


/* =========================================================
   VELAEA dual star scores: quality + risk safety
   Scoped component for graph/showcase cards only.
   5 stars = best, half star = minimum.
   ========================================================= */
.velaea-star-strip{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin:10px 0 12px;
}
.velaea-star-box{
  min-width:0;
  border:1px solid rgba(255,255,255,.10);
  border-radius:16px;
  padding:9px 10px;
  background:linear-gradient(135deg,rgba(255,255,255,.055),rgba(255,255,255,.025));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
.velaea-star-box .star-title{
  display:block;
  color:var(--muted,#9fb0c9);
  font-size:9.5px;
  font-weight:1000;
  letter-spacing:.06em;
  text-transform:uppercase;
  margin-bottom:3px;
}
.velaea-star-set{
  display:inline-flex;
  align-items:center;
  gap:1px;
  line-height:1;
  white-space:nowrap;
  vertical-align:middle;
}
.velaea-star-set i{
  position:relative;
  display:inline-block;
  width:13px;
  color:rgba(148,163,184,.24);
  font-style:normal;
  font-size:13.5px;
  line-height:1;
  text-shadow:none;
}
.velaea-star-set i.full{
  color:var(--star-color,#f2c76a);
  text-shadow:0 0 12px var(--star-glow,rgba(242,199,106,.38));
}
.velaea-star-set i.half{
  color:rgba(148,163,184,.24);
}
.velaea-star-set i.half:before{
  content:"★";
  position:absolute;
  inset:0 auto 0 0;
  width:50%;
  overflow:hidden;
  color:var(--star-color,#f2c76a);
  text-shadow:0 0 12px var(--star-glow,rgba(242,199,106,.38));
}
.velaea-star-set.quality-stars{
  --star-color:#f2c76a;
  --star-glow:rgba(242,199,106,.42);
}
.velaea-star-set.risk-stars{
  --star-color:#64d7ff;
  --star-glow:rgba(100,215,255,.38);
}
.velaea-star-box b{
  display:inline-block;
  margin-left:6px;
  color:#f8fafc;
  font-size:11px;
  font-weight:1000;
  vertical-align:middle;
}
.velaea-star-box small{
  display:block;
  margin-top:4px;
  color:var(--muted,#9fb0c9);
  font-size:9.5px;
  font-weight:850;
  line-height:1.25;
  white-space:normal;
}
.velaea-star-box.quality{
  border-color:rgba(242,199,106,.20);
}
.velaea-star-box.risk{
  border-color:rgba(100,215,255,.18);
}
html[data-theme="light"] .velaea-star-box,
body.light .velaea-star-box{
  border-color:rgba(15,23,42,.085);
  background:linear-gradient(135deg,rgba(255,255,255,.98),rgba(248,250,252,.86));
  box-shadow:0 10px 24px rgba(15,23,42,.045),inset 0 1px 0 rgba(255,255,255,.96);
}
html[data-theme="light"] .velaea-star-box.quality,
body.light .velaea-star-box.quality{
  border-color:rgba(196,139,29,.20);
}
html[data-theme="light"] .velaea-star-box.risk,
body.light .velaea-star-box.risk{
  border-color:rgba(14,116,144,.18);
}
html[data-theme="light"] .velaea-star-box .star-title,
body.light .velaea-star-box .star-title{
  color:#64748b;
}
html[data-theme="light"] .velaea-star-box b,
body.light .velaea-star-box b{
  color:#0f172a;
}
html[data-theme="light"] .velaea-star-box small,
body.light .velaea-star-box small{
  color:#64748b;
}
html[data-theme="light"] .velaea-star-set i,
body.light .velaea-star-set i{
  color:rgba(148,163,184,.30);
}
@media(max-width:620px){
  .velaea-star-strip{
    grid-template-columns:1fr;
  }
}



.showcase-card .velaea-star-strip,
.detail-tab-panel .velaea-star-strip{
  margin:10px 0 12px;
}
.showcase-card .velaea-star-box{
  border-radius:14px;
  padding:8px 9px;
}



/* =========================================================
   Dual star score readability fix
   - Empty star uses ☆, not filled ★
   - Extreme risk can show 0.5/5 clearly
   ========================================================= */
.velaea-star-set i.empty{
  color:rgba(148,163,184,.34);
  text-shadow:none;
}
html[data-theme="light"] .velaea-star-set i.empty,
body.light .velaea-star-set i.empty{
  color:rgba(100,116,139,.36);
}
.velaea-star-set i.half{
  color:rgba(148,163,184,.22);
}
html[data-theme="light"] .velaea-star-set i.half,
body.light .velaea-star-set i.half{
  color:rgba(100,116,139,.28);
}



/* VELAEA Score Thai explanation dropdown */
.velaea-score-rule{
  margin-top:7px;
  border-top:1px solid rgba(255,255,255,.08);
  padding-top:6px;
}
.velaea-score-rule summary{
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  color:var(--gold,#f2c76a);
  font-size:9.5px;
  font-weight:1000;
  letter-spacing:.02em;
}
.velaea-score-rule summary::-webkit-details-marker{display:none}
.velaea-score-rule summary:after{
  content:"+";
  display:grid;
  place-items:center;
  width:16px;
  height:16px;
  border-radius:999px;
  color:#08111f;
  background:rgba(242,199,106,.88);
  font-size:12px;
  line-height:1;
}
.velaea-score-rule[open] summary:after{content:"−"}
.velaea-score-rule div{
  display:grid;
  gap:4px;
  margin-top:7px;
}
.velaea-score-rule span{
  display:block;
  color:var(--muted,#9fb0c9);
  font-size:9.5px;
  font-weight:780;
  line-height:1.35;
}
html[data-theme="light"] .velaea-score-rule,
body.light .velaea-score-rule{
  border-top-color:rgba(15,23,42,.08);
}
html[data-theme="light"] .velaea-score-rule summary,
body.light .velaea-score-rule summary{
  color:#b7791f;
}
html[data-theme="light"] .velaea-score-rule span,
body.light .velaea-score-rule span{
  color:#64748b;
}



/* Strategy Safety + Drawdown Safety score boxes */
.velaea-star-strip.three-scores{
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.velaea-star-set.dd-stars{
  --star-color:#a78bfa;
  --star-glow:rgba(167,139,250,.40);
}
.velaea-star-box.dd-safety{
  border-color:rgba(167,139,250,.22);
}
.velaea-star-box.strategy-safety{
  border-color:rgba(100,215,255,.20);
}
.velaea-score-rule.dd-rule summary{
  color:#c4b5fd;
}
.velaea-score-rule.dd-rule summary:after{
  background:linear-gradient(135deg,#ddd6fe,#a78bfa);
}
.velaea-score-rule.strategy-rule summary{
  color:#64d7ff;
}
.velaea-score-rule.strategy-rule summary:after{
  background:linear-gradient(135deg,#bfdbfe,#64d7ff);
}
html[data-theme="light"] .velaea-star-box.dd-safety,
body.light .velaea-star-box.dd-safety{
  border-color:rgba(124,58,237,.20);
}
html[data-theme="light"] .velaea-star-box.strategy-safety,
body.light .velaea-star-box.strategy-safety{
  border-color:rgba(14,116,144,.18);
}
html[data-theme="light"] .velaea-score-rule.dd-rule summary,
body.light .velaea-score-rule.dd-rule summary{
  color:#6d28d9;
}
html[data-theme="light"] .velaea-score-rule.strategy-rule summary,
body.light .velaea-score-rule.strategy-rule summary{
  color:#0e7490;
}
@media(max-width:900px){
  .velaea-star-strip.three-scores{
    grid-template-columns:1fr;
  }
}


/* =========================================================
   Verified Backtest stamp across public showcase - 2026-07-04
   Shows only on Backtest cards/details as a compact certification mark.
   ========================================================= */
.velaea-verified-backtest-stamp{
  display:block;
  height:auto;
  object-fit:contain;
  pointer-events:none;
  user-select:none;
  filter:drop-shadow(0 8px 16px rgba(0,0,0,.34)) drop-shadow(0 0 10px rgba(242,199,106,.18));
}
.showcase-chart-shell.has-verified-stamp{
  min-height:148px;
  padding-bottom:34px!important;
}
.showcase-card-stamp{
  position:absolute!important;
  right:10px;
  bottom:8px;
  z-index:3!important;
  width:clamp(88px,31%,122px);
  max-width:42%;
  opacity:.96;
}
.showcase-card:hover .showcase-card-stamp{
  filter:drop-shadow(0 10px 18px rgba(0,0,0,.40)) drop-shadow(0 0 14px rgba(242,199,106,.24));
}
.professional-detail-hero.is-backtest-detail{
  grid-template-columns:minmax(0,1fr) minmax(150px,180px) minmax(110px,150px)!important;
  align-items:center!important;
}
.detail-hero-stamp{
  width:min(148px,100%);
  justify-self:end;
  align-self:center;
  opacity:.98;
}
html[data-theme="light"] .velaea-verified-backtest-stamp{
  filter:drop-shadow(0 8px 14px rgba(15,23,42,.14)) drop-shadow(0 0 8px rgba(200,149,46,.16));
}
@media(max-width:1100px){
  .professional-detail-hero.is-backtest-detail{
    grid-template-columns:minmax(0,1fr) minmax(140px,180px)!important;
  }
  .professional-detail-hero.is-backtest-detail .detail-hero-stamp{
    grid-column:1/-1;
    justify-self:start;
    width:142px;
    margin-top:-4px;
  }
}
@media(max-width:680px){
  .showcase-chart-shell.has-verified-stamp{padding-bottom:30px!important;min-height:142px;}
  .showcase-card-stamp{width:100px;max-width:45%;right:9px;bottom:7px;}
  .professional-detail-hero.is-backtest-detail{grid-template-columns:1fr!important;}
  .professional-detail-hero.is-backtest-detail .detail-hero-stamp{justify-self:start;width:128px;}
}


/* =========================================================
   VELAEA Community Portfolio Ranked List
   Myfxbook-style fast scan, rebuilt in VELAEA premium theme.
   ========================================================= */
.portfolio-list-panel{
  position:relative;
  margin:0 0 18px;
  padding:15px;
  border:1px solid var(--community-line);
  border-radius:22px;
  background:
    radial-gradient(circle at 100% 0,rgba(242,199,106,.12),transparent 30%),
    linear-gradient(180deg,rgba(9,23,39,.88),rgba(4,14,25,.76));
  box-shadow:0 18px 52px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.04);
  overflow:hidden;
}
.portfolio-list-panel:before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg,rgba(242,199,106,.08),transparent 32%,rgba(78,165,255,.05));
  pointer-events:none;
}
html[data-theme="light"] .portfolio-list-panel{
  background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(247,250,255,.92));
  box-shadow:0 18px 44px rgba(8,24,42,.10), inset 0 1px 0 rgba(255,255,255,.78);
}
.portfolio-list-head{
  position:relative;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding:2px 2px 13px;
  border-bottom:1px solid var(--community-line2);
  margin-bottom:12px;
}
.portfolio-list-head h3{
  margin:3px 0 3px;
  font-size:22px;
  line-height:1.1;
  letter-spacing:-.04em;
}
.portfolio-list-head p:not(.eyebrow){
  margin:0;
  color:var(--community-muted);
  font-size:12.5px;
  line-height:1.55;
  font-weight:800;
}
.portfolio-list-eyebrow{
  margin:0;
  font-size:10.5px;
  letter-spacing:.12em;
}
.portfolio-list-counter{
  white-space:nowrap;
  border:1px solid rgba(242,199,106,.25);
  background:rgba(242,199,106,.08);
  color:var(--community-gold);
  border-radius:999px;
  padding:8px 11px;
  font-size:11px;
  font-weight:950;
}
.portfolio-list-table{
  position:relative;
  display:grid;
  gap:8px;
}
.portfolio-list-row{
  display:grid;
  grid-template-columns:54px minmax(190px,1.45fr) minmax(360px,2.15fr) minmax(150px,.8fr) minmax(138px,.82fr) minmax(236px,1.25fr);
  gap:10px;
  align-items:center;
  min-width:0;
  padding:11px;
  border:1px solid var(--community-line2);
  border-radius:18px;
  background:
    radial-gradient(circle at 14% 12%,rgba(242,199,106,.09),transparent 28%),
    rgba(255,255,255,.045);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.portfolio-list-row:hover{
  transform:translateY(-2px);
  border-color:rgba(242,199,106,.34);
  box-shadow:0 16px 36px rgba(0,0,0,.24);
}
html[data-theme="light"] .portfolio-list-row{
  background:rgba(255,255,255,.75);
}
.portfolio-list-rank{
  display:grid;
  place-items:center;
}
.portfolio-list-rank span{
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border-radius:14px;
  background:linear-gradient(135deg,rgba(242,199,106,.98),rgba(200,149,46,.88));
  color:#07111f;
  font-size:12px;
  font-weight:1000;
  box-shadow:0 10px 20px rgba(242,199,106,.16);
}
.portfolio-list-main{min-width:0}
.portfolio-list-title-row{
  display:flex;
  align-items:center;
  gap:7px;
  min-width:0;
  flex-wrap:wrap;
}
.portfolio-list-title-row strong{
  min-width:0;
  max-width:100%;
  color:var(--community-text);
  font-size:15px;
  line-height:1.18;
  font-weight:1000;
  letter-spacing:-.025em;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.portfolio-list-meta{
  display:flex;
  gap:8px 10px;
  flex-wrap:wrap;
  margin-top:6px;
  color:var(--community-muted);
  font-size:10.8px;
  line-height:1.35;
  font-weight:850;
}
.portfolio-list-meta span{
  min-width:0;
}
.portfolio-list-meta a{
  color:var(--community-gold);
}
.portfolio-list-metrics{
  display:grid;
  grid-template-columns:repeat(5,minmax(58px,1fr));
  gap:7px;
  min-width:0;
}
.portfolio-list-metrics div{
  min-width:0;
  padding:8px 9px;
  border:1px solid var(--community-line2);
  border-radius:13px;
  background:rgba(255,255,255,.04);
}
.portfolio-list-metrics small{
  display:block;
  color:var(--community-muted);
  font-size:9px;
  font-weight:950;
  letter-spacing:.07em;
  text-transform:uppercase;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.portfolio-list-metrics b{
  display:block;
  margin-top:4px;
  color:var(--community-text);
  font-size:13px;
  line-height:1.05;
  font-weight:1000;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.portfolio-list-spark{
  position:relative;
  min-height:76px;
  border:1px solid var(--community-line2);
  border-radius:15px;
  background:rgba(2,8,20,.38);
  padding:7px;
  overflow:hidden;
}
html[data-theme="light"] .portfolio-list-spark{
  background:rgba(8,24,42,.04);
}
.portfolio-list-spark .spark-svg{
  height:62px;
}
.portfolio-list-spark .velaea-verified-backtest-stamp.portfolio-list-stamp{
  position:absolute;
  right:8px;
  bottom:6px;
  width:76px;
  max-width:42%;
  opacity:.96;
  filter:drop-shadow(0 4px 8px rgba(0,0,0,.28));
}
.portfolio-list-risk{
  min-width:0;
  padding:9px 10px;
  border:1px solid var(--community-line2);
  border-radius:14px;
  background:rgba(255,255,255,.04);
}
.portfolio-list-risk small{
  display:block;
  color:var(--community-muted);
  font-size:9px;
  font-weight:950;
  letter-spacing:.07em;
  text-transform:uppercase;
}
.portfolio-list-risk strong{
  display:block;
  margin-top:4px;
  color:var(--community-text);
  font-size:12.5px;
  line-height:1.15;
  font-weight:1000;
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}
.portfolio-list-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:7px;
  flex-wrap:wrap;
}
.portfolio-list-actions .btn{
  min-height:34px;
  padding:8px 11px;
  border-radius:12px;
  font-size:11px;
}
.portfolio-list-pagination{
  position:relative;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
  margin-top:13px;
  padding-top:12px;
  border-top:1px solid var(--community-line2);
}
.portfolio-list-page{
  min-width:35px;
  height:34px;
  border-radius:12px;
  border:1px solid rgba(242,199,106,.24);
  background:rgba(255,255,255,.05);
  color:var(--community-text);
  font-weight:950;
  cursor:pointer;
}
.portfolio-list-page.active{
  background:linear-gradient(135deg,var(--community-gold),var(--community-gold2));
  color:#07111f;
  border-color:transparent;
  box-shadow:0 8px 20px rgba(242,199,106,.17);
}
.portfolio-list-page:disabled{
  opacity:.42;
  cursor:not-allowed;
}
.portfolio-list-nav{min-width:42px}
.portfolio-list-ellipsis{
  color:var(--community-muted);
  font-weight:950;
  padding:0 2px;
}
.portfolio-list-empty{
  padding:18px;
  text-align:center;
  color:var(--community-muted);
  border:1px dashed var(--community-line);
  border-radius:16px;
  font-weight:900;
}

@media(max-width:1220px){
  .portfolio-list-row{
    grid-template-columns:46px minmax(180px,1.1fr) minmax(280px,1.6fr) minmax(130px,.75fr);
  }
  .portfolio-list-spark{
    grid-column:2 / span 2;
  }
  .portfolio-list-actions{
    grid-column:4;
    grid-row:1 / span 2;
    align-self:stretch;
    align-content:center;
  }
}
@media(max-width:860px){
  .portfolio-list-head{
    display:grid;
  }
  .portfolio-list-counter{
    width:max-content;
  }
  .portfolio-list-row{
    grid-template-columns:42px 1fr;
    gap:9px;
    padding:10px;
  }
  .portfolio-list-main,
  .portfolio-list-metrics,
  .portfolio-list-spark,
  .portfolio-list-risk,
  .portfolio-list-actions{
    grid-column:1 / -1;
  }
  .portfolio-list-metrics{
    grid-template-columns:repeat(2,1fr);
  }
  .portfolio-list-spark .spark-svg{
    height:86px;
  }
  .portfolio-list-actions{
    justify-content:flex-start;
  }
}
@media(max-width:560px){
  .portfolio-list-panel{
    padding:12px;
    border-radius:18px;
  }
  .portfolio-list-head h3{
    font-size:19px;
  }
  .portfolio-list-row{
    border-radius:16px;
  }
  .portfolio-list-title-row strong{
    white-space:normal;
  }
  .portfolio-list-metrics{
    grid-template-columns:1fr 1fr;
  }
  .portfolio-list-actions .btn{
    flex:1 1 120px;
  }
}


/* =========================================================
   Portfolio Ranked List polish: compact 3-score stars + cleaner actions
   ========================================================= */
.portfolio-list-row{
  grid-template-columns:50px minmax(200px,1.15fr) minmax(300px,1.35fr) minmax(190px,.92fr) minmax(128px,.7fr) minmax(132px,.68fr) minmax(96px,.45fr)!important;
}
.portfolio-list-metrics{
  grid-template-columns:repeat(4,minmax(58px,1fr))!important;
}
.portfolio-list-stars{
  min-width:0;
  display:grid;
  gap:5px;
  padding:8px 9px;
  border:1px solid var(--community-line2);
  border-radius:14px;
  background:
    radial-gradient(circle at 0 0,rgba(242,199,106,.09),transparent 36%),
    rgba(255,255,255,.035);
}
.portfolio-list-star-row{
  min-width:0;
  display:grid;
  grid-template-columns:56px minmax(58px,1fr) 30px;
  align-items:center;
  gap:6px;
  line-height:1;
}
.portfolio-list-star-label{
  min-width:0;
  color:var(--community-muted);
  font-size:8.6px;
  font-weight:1000;
  letter-spacing:.055em;
  text-transform:uppercase;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.portfolio-list-stars .velaea-star-set{
  display:inline-flex;
  align-items:center;
  gap:1px;
  min-width:0;
  white-space:nowrap;
}
.portfolio-list-stars .velaea-star-set i{
  font-style:normal;
  font-size:10px;
  line-height:1;
  letter-spacing:-.05em;
  filter:drop-shadow(0 0 4px rgba(242,199,106,.18));
}
.portfolio-list-stars .velaea-star-set i.empty{
  opacity:.35;
  color:rgba(159,176,195,.52)!important;
  filter:none;
}
.portfolio-list-stars .quality-stars i.full,
.portfolio-list-stars .quality-stars i.half{
  color:#f2c76a!important;
}
.portfolio-list-stars .risk-stars i.full,
.portfolio-list-stars .risk-stars i.half{
  color:#65e6ff!important;
}
.portfolio-list-stars .dd-stars i.full,
.portfolio-list-stars .dd-stars i.half{
  color:#a98cff!important;
}
.portfolio-list-star-row b{
  color:var(--community-text);
  font-size:9.6px;
  font-weight:1000;
  text-align:right;
  white-space:nowrap;
}
.portfolio-list-actions{
  justify-content:center!important;
}
.portfolio-list-actions .btn{
  width:100%;
  min-width:86px;
  white-space:nowrap;
}
.portfolio-list-risk strong{
  -webkit-line-clamp:3;
}
.portfolio-list-spark .velaea-verified-backtest-stamp.portfolio-list-stamp{
  width:70px;
  max-width:45%;
}
@media(max-width:1320px){
  .portfolio-list-row{
    grid-template-columns:46px minmax(190px,1fr) minmax(270px,1.3fr) minmax(180px,.95fr) minmax(120px,.72fr) minmax(124px,.72fr) minmax(92px,.45fr)!important;
  }
}
@media(max-width:1220px){
  .portfolio-list-row{
    grid-template-columns:46px minmax(180px,1.1fr) minmax(280px,1.6fr) minmax(180px,.9fr)!important;
  }
  .portfolio-list-stars,
  .portfolio-list-spark{
    grid-column:2 / span 2;
  }
  .portfolio-list-risk{
    grid-column:2 / span 1;
  }
  .portfolio-list-actions{
    grid-column:4;
    grid-row:auto!important;
    align-self:center;
  }
}
@media(max-width:860px){
  .portfolio-list-stars{
    grid-column:1 / -1;
  }
  .portfolio-list-star-row{
    grid-template-columns:72px 1fr 34px;
  }
  .portfolio-list-stars .velaea-star-set i{
    font-size:12px;
  }
}
@media(max-width:560px){
  .portfolio-list-metrics{
    grid-template-columns:1fr 1fr!important;
  }
  .portfolio-list-stars{
    padding:9px;
  }
  .portfolio-list-actions .btn{
    width:100%;
  }
}


/* =========================================================
   EA Community number overflow polish
   Keep all Gain / DD / Net Profit / Equity / Trades visible.
   ========================================================= */
.portfolio-list-row{
  grid-template-columns:48px minmax(210px,1.08fr) minmax(390px,1.58fr) minmax(178px,.78fr) minmax(132px,.58fr) minmax(128px,.58fr) minmax(96px,.42fr)!important;
}
.portfolio-list-metrics{
  grid-template-columns:repeat(4,minmax(78px,1fr))!important;
  gap:7px!important;
}
.portfolio-list-metrics div{
  padding:8px 8px!important;
  overflow:visible!important;
}
.portfolio-list-metrics small{
  font-size:8.8px!important;
  letter-spacing:.055em!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
.portfolio-list-metrics b{
  font-variant-numeric:tabular-nums;
  font-size:clamp(10.5px,.64vw,12.4px)!important;
  letter-spacing:-.035em!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:nowrap!important;
  max-width:none!important;
}
.portfolio-list-stars{
  padding:7px 8px!important;
}
.portfolio-list-star-row{
  grid-template-columns:54px minmax(66px,1fr) 30px!important;
  gap:5px!important;
}
.portfolio-list-star-label{
  font-size:8.2px!important;
}
.portfolio-list-stars .velaea-star-set i{
  font-size:9.6px!important;
}
.portfolio-list-star-row b{
  font-size:9.2px!important;
}
.portfolio-list-spark{
  min-height:70px!important;
}
.portfolio-list-spark .spark-svg{
  height:58px!important;
}
.portfolio-list-risk{
  padding:8px 9px!important;
}
.portfolio-list-risk strong{
  font-size:12px!important;
}
.portfolio-list-actions .btn{
  min-height:32px!important;
  padding:8px 10px!important;
  font-size:10.5px!important;
}

/* Card view metric values below the list */
.showcase-card .metric-grid.pro-metrics{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:8px!important;
}
.showcase-card .metric{
  padding:8px 9px!important;
  overflow:visible!important;
}
.showcase-card .metric small{
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
  font-size:9px!important;
}
.showcase-card .metric strong{
  font-variant-numeric:tabular-nums;
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
  max-width:none!important;
  font-size:clamp(12.5px,1.05vw,14.5px)!important;
  letter-spacing:-.04em!important;
}

/* badges and risk text should not collide with numbers */
.showcase-card .risk-type-badge strong,
.risk-type-badge strong{
  overflow-wrap:anywhere;
  word-break:normal;
}
.micro-badge{
  max-width:100%;
  white-space:normal!important;
  line-height:1.25!important;
}

@media(max-width:1420px){
  .portfolio-list-row{
    grid-template-columns:46px minmax(190px,1fr) minmax(360px,1.45fr) minmax(170px,.78fr) minmax(126px,.6fr) minmax(120px,.58fr) minmax(90px,.42fr)!important;
  }
  .portfolio-list-metrics{
    grid-template-columns:repeat(4,minmax(72px,1fr))!important;
  }
  .portfolio-list-metrics b{
    font-size:11px!important;
  }
}
@media(max-width:1240px){
  .portfolio-list-row{
    grid-template-columns:46px minmax(190px,1fr) minmax(330px,1.45fr) minmax(170px,.85fr)!important;
  }
  .portfolio-list-stars,
  .portfolio-list-spark{
    grid-column:2 / span 2;
  }
  .portfolio-list-risk{
    grid-column:2 / span 1;
  }
  .portfolio-list-actions{
    grid-column:4;
  }
  .portfolio-list-metrics b{
    font-size:11.6px!important;
  }
}
@media(max-width:860px){
  .portfolio-list-row{
    grid-template-columns:42px 1fr!important;
  }
  .portfolio-list-metrics{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .portfolio-list-metrics b{
    font-size:12px!important;
  }
  .portfolio-list-stars .velaea-star-set i{
    font-size:11px!important;
  }
  .showcase-card .metric strong{
    font-size:13px!important;
  }
}
@media(max-width:560px){
  .portfolio-list-metrics{
    grid-template-columns:1fr 1fr!important;
  }
  .portfolio-list-metrics b{
    font-size:11.5px!important;
  }
  .showcase-card .metric-grid.pro-metrics{
    grid-template-columns:1fr 1fr!important;
  }
}


/* =========================================================
   Portfolio Ranked List responsive fit polish
   Prevent right-side clipping and keep key numbers visible.
   ========================================================= */
.portfolio-list-panel{
  max-width:100%;
  overflow:hidden!important;
}
.portfolio-list-table{
  max-width:100%;
  overflow:visible!important;
}
.portfolio-list-row{
  width:100%;
  max-width:100%;
  min-width:0!important;
  box-sizing:border-box!important;
  grid-template-columns:
    40px
    minmax(155px,1.05fr)
    minmax(310px,1.42fr)
    minmax(154px,.72fr)
    minmax(104px,.52fr)
    minmax(106px,.52fr)
    minmax(76px,.36fr)!important;
  gap:8px!important;
  padding:10px 9px!important;
  overflow:hidden!important;
}
.portfolio-list-row > *{
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}
.portfolio-list-rank span{
  width:34px!important;
  height:34px!important;
  border-radius:12px!important;
  font-size:11px!important;
}
.portfolio-list-main{
  overflow:hidden!important;
}
.portfolio-list-title-row{
  gap:5px!important;
}
.portfolio-list-title-row strong{
  font-size:14px!important;
  line-height:1.12!important;
  max-width:100%!important;
}
.portfolio-list-title-row .type-badge,
.portfolio-list-title-row .status-badge{
  padding:5px 8px!important;
  font-size:9.5px!important;
}
.portfolio-list-meta{
  gap:5px 7px!important;
  font-size:10.1px!important;
  line-height:1.25!important;
}
.portfolio-list-metrics{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:5px!important;
}
.portfolio-list-metrics div{
  padding:7px 6px!important;
  border-radius:11px!important;
}
.portfolio-list-metrics small{
  font-size:7.8px!important;
  line-height:1!important;
  letter-spacing:.045em!important;
}
.portfolio-list-metrics b{
  display:block!important;
  font-size:clamp(9.8px,.58vw,11.3px)!important;
  line-height:1.06!important;
  letter-spacing:-.045em!important;
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
.portfolio-list-stars{
  gap:4px!important;
  padding:7px 7px!important;
  border-radius:12px!important;
}
.portfolio-list-star-row{
  grid-template-columns:48px minmax(54px,1fr) 28px!important;
  gap:4px!important;
}
.portfolio-list-star-label{
  font-size:7.7px!important;
  line-height:1!important;
}
.portfolio-list-stars .velaea-star-set{
  gap:0!important;
}
.portfolio-list-stars .velaea-star-set i{
  font-size:8.7px!important;
  letter-spacing:-.08em!important;
}
.portfolio-list-star-row b{
  font-size:8.6px!important;
}
.portfolio-list-spark{
  min-height:62px!important;
  padding:6px!important;
  border-radius:12px!important;
}
.portfolio-list-spark .spark-svg{
  height:50px!important;
}
.portfolio-list-spark .velaea-verified-backtest-stamp.portfolio-list-stamp{
  width:56px!important;
  right:6px!important;
  bottom:5px!important;
}
.portfolio-list-risk{
  padding:7px 8px!important;
  border-radius:12px!important;
}
.portfolio-list-risk small{
  font-size:7.8px!important;
}
.portfolio-list-risk strong{
  font-size:10.6px!important;
  line-height:1.08!important;
  -webkit-line-clamp:3!important;
}
.portfolio-list-actions{
  justify-content:stretch!important;
  align-items:center!important;
}
.portfolio-list-actions .btn{
  width:100%!important;
  min-width:0!important;
  min-height:30px!important;
  padding:7px 6px!important;
  border-radius:11px!important;
  font-size:9.8px!important;
  white-space:nowrap!important;
}

/* Medium desktop: convert to a clean 2-row layout before clipping happens */
@media(max-width:1280px){
  .portfolio-list-row{
    grid-template-columns:40px minmax(0,1.2fr) minmax(300px,1.55fr) minmax(150px,.78fr) minmax(110px,.6fr) minmax(88px,.42fr)!important;
  }
  .portfolio-list-main{
    grid-column:2 / span 1!important;
  }
  .portfolio-list-metrics{
    grid-column:3 / span 1!important;
  }
  .portfolio-list-stars{
    grid-column:4 / span 1!important;
  }
  .portfolio-list-spark{
    grid-column:5 / span 1!important;
  }
  .portfolio-list-risk{
    grid-column:2 / span 3!important;
    grid-row:2!important;
  }
  .portfolio-list-actions{
    grid-column:6!important;
    grid-row:1 / span 2!important;
    align-self:center!important;
  }
}

/* Narrow desktop/tablet: stack into balanced cards, no horizontal overflow */
@media(max-width:1080px){
  .portfolio-list-row{
    grid-template-columns:38px 1fr minmax(250px,1.15fr) 92px!important;
    gap:8px!important;
  }
  .portfolio-list-rank{
    grid-row:1!important;
  }
  .portfolio-list-main{
    grid-column:2 / span 1!important;
    grid-row:1!important;
  }
  .portfolio-list-actions{
    grid-column:4!important;
    grid-row:1!important;
  }
  .portfolio-list-metrics{
    grid-column:1 / span 4!important;
    grid-row:2!important;
  }
  .portfolio-list-stars{
    grid-column:1 / span 2!important;
    grid-row:3!important;
  }
  .portfolio-list-spark{
    grid-column:3 / span 1!important;
    grid-row:3!important;
  }
  .portfolio-list-risk{
    grid-column:4!important;
    grid-row:3!important;
  }
  .portfolio-list-metrics b{
    font-size:12px!important;
  }
}

/* Mobile: card stack with every number visible */
@media(max-width:760px){
  .portfolio-list-row{
    grid-template-columns:38px 1fr!important;
    padding:10px!important;
  }
  .portfolio-list-rank{
    grid-column:1!important;
    grid-row:1!important;
  }
  .portfolio-list-main{
    grid-column:2!important;
    grid-row:1!important;
  }
  .portfolio-list-metrics,
  .portfolio-list-stars,
  .portfolio-list-spark,
  .portfolio-list-risk,
  .portfolio-list-actions{
    grid-column:1 / -1!important;
    grid-row:auto!important;
  }
  .portfolio-list-metrics{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .portfolio-list-metrics b{
    font-size:12px!important;
  }
  .portfolio-list-spark .spark-svg{
    height:78px!important;
  }
  .portfolio-list-actions .btn{
    min-height:36px!important;
    font-size:11px!important;
  }
}

@media(max-width:420px){
  .portfolio-list-panel{
    padding:10px!important;
  }
  .portfolio-list-metrics{
    grid-template-columns:1fr 1fr!important;
  }
  .portfolio-list-title-row .type-badge,
  .portfolio-list-title-row .status-badge{
    font-size:8.8px!important;
    padding:4px 7px!important;
  }
}


/* =========================================================
   Mobile-only Portfolio Ranked List: single-row horizontal slider
   Requested: mobile list rows must stay like desktop rows; if not fit, slide horizontally.
   Scope: only Portfolio Ranked List panel.
   ========================================================= */
@media(max-width:860px){
  .portfolio-list-panel{
    overflow:hidden!important;
  }

  .portfolio-list-panel .portfolio-list-head{
    display:flex!important;
    align-items:flex-start!important;
    justify-content:space-between!important;
    gap:10px!important;
  }

  .portfolio-list-panel .portfolio-list-counter{
    flex:0 0 auto!important;
    width:max-content!important;
  }

  .portfolio-list-scroll-hint{
    display:flex!important;
  }

  .portfolio-list-table{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    padding:0 0 10px!important;
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity;
    scrollbar-width:thin;
    scrollbar-color:rgba(242,199,106,.60) rgba(255,255,255,.06);
  }

  .portfolio-list-table::-webkit-scrollbar{
    height:8px;
  }

  .portfolio-list-table::-webkit-scrollbar-track{
    background:rgba(255,255,255,.06);
    border-radius:999px;
  }

  .portfolio-list-table::-webkit-scrollbar-thumb{
    background:linear-gradient(90deg,var(--community-gold),var(--community-gold2));
    border-radius:999px;
  }

  .portfolio-list-row{
    display:grid!important;
    grid-template-columns:38px 185px 318px 166px 118px 128px 74px!important;
    width:1065px!important;
    min-width:1065px!important;
    max-width:none!important;
    gap:8px!important;
    align-items:center!important;
    margin-bottom:9px!important;
    padding:10px 9px!important;
    overflow:hidden!important;
    scroll-snap-align:start;
  }

  .portfolio-list-row:last-child{
    margin-bottom:0!important;
  }

  .portfolio-list-row > *{
    min-width:0!important;
    max-width:100%!important;
    grid-row:auto!important;
  }

  .portfolio-list-rank{grid-column:1!important}
  .portfolio-list-main{grid-column:2!important}
  .portfolio-list-metrics{grid-column:3!important}
  .portfolio-list-stars{grid-column:4!important}
  .portfolio-list-spark{grid-column:5!important}
  .portfolio-list-risk{grid-column:6!important}
  .portfolio-list-actions{grid-column:7!important}

  .portfolio-list-metrics{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:5px!important;
  }

  .portfolio-list-stars{
    display:grid!important;
    gap:4px!important;
  }

  .portfolio-list-spark .spark-svg{
    height:50px!important;
  }

  .portfolio-list-actions{
    align-self:center!important;
    justify-content:stretch!important;
  }

  .portfolio-list-actions .btn{
    width:100%!important;
    min-width:0!important;
    padding-left:6px!important;
    padding-right:6px!important;
  }
}

@media(max-width:560px){
  .portfolio-list-panel{
    padding:11px!important;
    border-radius:18px!important;
  }

  .portfolio-list-panel .portfolio-list-head{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
  }

  .portfolio-list-panel .portfolio-list-counter{
    width:max-content!important;
  }

  .portfolio-list-table{
    margin-left:-2px!important;
    margin-right:-2px!important;
    padding-left:2px!important;
    padding-right:2px!important;
  }

  .portfolio-list-row{
    grid-template-columns:36px 176px 306px 162px 112px 122px 70px!important;
    width:1016px!important;
    min-width:1016px!important;
  }

  .portfolio-list-title-row strong{
    white-space:nowrap!important;
  }

  .portfolio-list-meta{
    flex-wrap:wrap!important;
    font-size:9.7px!important;
  }

  .portfolio-list-rank span{
    width:32px!important;
    height:32px!important;
    font-size:10.5px!important;
  }
}

/* helper text under Portfolio Ranked List header */
.portfolio-list-scroll-hint{
  position:relative;
  display:none;
  align-items:center;
  gap:8px;
  margin:-4px 0 10px;
  color:var(--community-muted);
  font-size:10.5px;
  font-weight:900;
}
.portfolio-list-scroll-hint:before{
  content:"↔";
  display:grid;
  place-items:center;
  width:22px;
  height:22px;
  border-radius:999px;
  color:#07111f;
  background:linear-gradient(135deg,var(--community-gold),var(--community-gold2));
  font-weight:1000;
}


/* =========================================================
   Mobile horizontal list fix: keep row identity visible and start from left
   Scope: only Portfolio Ranked List.
   ========================================================= */
@media(max-width:860px){
  .portfolio-list-table{
    direction:ltr!important;
    scroll-padding-left:0!important;
    overscroll-behavior-x:contain;
  }

  .portfolio-list-row{
    position:relative!important;
    isolation:isolate;
  }

  /* Keep rank + portfolio name visible while sliding horizontally */
  .portfolio-list-row .portfolio-list-rank{
    position:sticky!important;
    left:0!important;
    z-index:7!important;
    align-self:stretch!important;
    display:grid!important;
    place-items:center!important;
    background:
      linear-gradient(90deg,rgba(8,20,34,.98),rgba(8,20,34,.92))!important;
    border-radius:12px 0 0 12px!important;
    box-shadow:12px 0 18px rgba(0,0,0,.18)!important;
  }

  .portfolio-list-row .portfolio-list-main{
    position:sticky!important;
    left:38px!important;
    z-index:6!important;
    align-self:stretch!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    padding:0 8px!important;
    background:
      linear-gradient(90deg,rgba(8,20,34,.98),rgba(8,20,34,.88) 82%,rgba(8,20,34,0))!important;
    box-shadow:10px 0 16px rgba(0,0,0,.12)!important;
  }

  html[data-theme="light"] .portfolio-list-row .portfolio-list-rank{
    background:linear-gradient(90deg,rgba(245,249,255,.98),rgba(245,249,255,.92))!important;
  }

  html[data-theme="light"] .portfolio-list-row .portfolio-list-main{
    background:linear-gradient(90deg,rgba(245,249,255,.98),rgba(245,249,255,.88) 82%,rgba(245,249,255,0))!important;
  }

  .portfolio-list-row .portfolio-list-title-row strong{
    max-width:168px!important;
  }

  .portfolio-list-row .portfolio-list-meta{
    max-width:170px!important;
  }

  .portfolio-list-row .portfolio-list-meta span{
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    max-width:100%!important;
  }

  .portfolio-list-table:after{
    content:"";
    position:sticky;
    right:0;
    bottom:0;
    display:block;
    width:42px;
    height:1px;
    margin-top:-1px;
    background:linear-gradient(90deg,transparent,rgba(2,8,20,.92));
    pointer-events:none;
  }
}

@media(max-width:560px){
  .portfolio-list-row .portfolio-list-main{
    left:36px!important;
  }

  .portfolio-list-row .portfolio-list-title-row strong{
    max-width:158px!important;
  }

  .portfolio-list-row .portfolio-list-meta{
    max-width:160px!important;
  }
}


/* =========================================================
   Mobile horizontal Portfolio Ranked List PRO FIX
   - No sticky columns; start from true left
   - One-row horizontal table feel
   - Softer professional rank badge
   Scope: only .portfolio-list-panel on mobile.
   ========================================================= */
@media(max-width:860px){
  .portfolio-list-panel{
    overflow:hidden!important;
  }

  .portfolio-list-panel .portfolio-list-head{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
    padding-bottom:12px!important;
  }

  .portfolio-list-panel .portfolio-list-counter{
    width:max-content!important;
    max-width:100%!important;
    justify-self:start!important;
    border-color:rgba(242,199,106,.24)!important;
    background:rgba(242,199,106,.07)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.05)!important;
  }

  .portfolio-list-scroll-hint{
    display:flex!important;
    margin:0 0 9px!important;
    padding:8px 10px!important;
    border:1px dashed rgba(242,199,106,.20)!important;
    border-radius:13px!important;
    background:rgba(255,255,255,.035)!important;
  }

  .portfolio-list-table{
    display:flex!important;
    flex-direction:column!important;
    gap:9px!important;
    width:100%!important;
    max-width:100%!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    padding:0 0 10px!important;
    direction:ltr!important;
    scroll-snap-type:x proximity;
    scroll-padding-left:0!important;
    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:thin;
    scrollbar-color:rgba(242,199,106,.58) rgba(255,255,255,.06);
  }

  .portfolio-list-table::-webkit-scrollbar{
    height:8px;
  }

  .portfolio-list-table::-webkit-scrollbar-track{
    background:rgba(255,255,255,.06);
    border-radius:999px;
  }

  .portfolio-list-table::-webkit-scrollbar-thumb{
    background:linear-gradient(90deg,rgba(242,199,106,.82),rgba(201,151,48,.82));
    border-radius:999px;
  }

  .portfolio-list-row{
    position:relative!important;
    display:grid!important;
    grid-template-columns:42px 202px 318px 166px 118px 130px 74px!important;
    width:1088px!important;
    min-width:1088px!important;
    max-width:none!important;
    gap:8px!important;
    align-items:center!important;
    margin:0!important;
    padding:10px!important;
    overflow:hidden!important;
    scroll-snap-align:start;
    border-radius:17px!important;
  }

  .portfolio-list-row + .portfolio-list-row{
    margin-top:0!important;
  }

  .portfolio-list-row > *{
    position:relative!important;
    left:auto!important;
    right:auto!important;
    z-index:auto!important;
    min-width:0!important;
    max-width:100%!important;
    grid-row:auto!important;
    box-shadow:none!important;
  }

  .portfolio-list-rank{
    grid-column:1!important;
    display:grid!important;
    place-items:center!important;
    align-self:center!important;
    background:transparent!important;
  }

  .portfolio-list-rank span{
    width:32px!important;
    height:32px!important;
    border-radius:11px!important;
    border:1px solid rgba(242,199,106,.38)!important;
    color:#f6d585!important;
    background:
      radial-gradient(circle at 30% 20%,rgba(242,199,106,.22),transparent 42%),
      linear-gradient(135deg,rgba(242,199,106,.13),rgba(255,255,255,.045))!important;
    box-shadow:0 8px 18px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.07)!important;
    font-size:10.5px!important;
    font-weight:1000!important;
  }

  html[data-theme="light"] .portfolio-list-rank span{
    color:#7b5611!important;
    background:linear-gradient(135deg,rgba(242,199,106,.32),rgba(255,255,255,.82))!important;
    box-shadow:0 8px 18px rgba(129,92,24,.10), inset 0 1px 0 rgba(255,255,255,.75)!important;
  }

  .portfolio-list-main{
    grid-column:2!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    align-self:stretch!important;
    padding:0!important;
    background:transparent!important;
  }

  .portfolio-list-title-row{
    gap:5px!important;
    flex-wrap:wrap!important;
  }

  .portfolio-list-title-row strong{
    display:block!important;
    flex:1 1 100%!important;
    max-width:190px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    font-size:13.6px!important;
    line-height:1.12!important;
  }

  .portfolio-list-title-row .type-badge,
  .portfolio-list-title-row .status-badge{
    padding:4px 7px!important;
    border-radius:999px!important;
    font-size:8.7px!important;
    line-height:1!important;
  }

  .portfolio-list-meta{
    max-width:198px!important;
    gap:4px 7px!important;
    margin-top:5px!important;
    font-size:9.5px!important;
    line-height:1.24!important;
  }

  .portfolio-list-meta span{
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    max-width:100%!important;
  }

  .portfolio-list-metrics{
    grid-column:3!important;
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:5px!important;
    align-self:center!important;
  }

  .portfolio-list-metrics div{
    padding:7px 6px!important;
    border-radius:11px!important;
  }

  .portfolio-list-metrics small{
    font-size:7.7px!important;
    line-height:1!important;
    letter-spacing:.045em!important;
  }

  .portfolio-list-metrics b{
    font-size:10.8px!important;
    line-height:1.05!important;
    letter-spacing:-.045em!important;
    white-space:nowrap!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }

  .portfolio-list-stars{
    grid-column:4!important;
    display:grid!important;
    gap:4px!important;
    padding:7px 8px!important;
    align-self:center!important;
  }

  .portfolio-list-star-row{
    grid-template-columns:50px minmax(58px,1fr) 28px!important;
    gap:4px!important;
  }

  .portfolio-list-star-label{
    font-size:7.7px!important;
  }

  .portfolio-list-stars .velaea-star-set i{
    font-size:8.8px!important;
    letter-spacing:-.08em!important;
  }

  .portfolio-list-star-row b{
    font-size:8.5px!important;
  }

  .portfolio-list-spark{
    grid-column:5!important;
    min-height:62px!important;
    padding:6px!important;
    border-radius:12px!important;
    align-self:center!important;
  }

  .portfolio-list-spark .spark-svg{
    height:50px!important;
  }

  .portfolio-list-spark .velaea-verified-backtest-stamp.portfolio-list-stamp{
    width:56px!important;
    right:6px!important;
    bottom:5px!important;
  }

  .portfolio-list-risk{
    grid-column:6!important;
    align-self:center!important;
    padding:7px 8px!important;
    border-radius:12px!important;
  }

  .portfolio-list-risk small{
    font-size:7.8px!important;
  }

  .portfolio-list-risk strong{
    font-size:10.6px!important;
    line-height:1.1!important;
    -webkit-line-clamp:3!important;
  }

  .portfolio-list-actions{
    grid-column:7!important;
    align-self:center!important;
    justify-content:stretch!important;
  }

  .portfolio-list-actions .btn{
    width:100%!important;
    min-width:0!important;
    min-height:30px!important;
    padding:7px 6px!important;
    border-radius:11px!important;
    font-size:9.8px!important;
  }
}

@media(max-width:560px){
  .portfolio-list-panel{
    padding:11px!important;
    border-radius:18px!important;
  }

  .portfolio-list-table{
    margin-left:0!important;
    margin-right:0!important;
  }

  .portfolio-list-row{
    grid-template-columns:40px 190px 306px 162px 112px 124px 70px!important;
    width:1040px!important;
    min-width:1040px!important;
    padding:9px!important;
  }

  .portfolio-list-title-row strong{
    max-width:180px!important;
  }

  .portfolio-list-meta{
    max-width:186px!important;
    font-size:9.2px!important;
  }

  .portfolio-list-rank span{
    width:30px!important;
    height:30px!important;
    font-size:10px!important;
  }
}


/* =========================================================
   Portfolio Ranked List rankless polish
   Remove left # rank badge and rebalance columns professionally.
   ========================================================= */
.portfolio-list-row.is-rankless{
  grid-template-columns:
    minmax(230px,1.16fr)
    minmax(390px,1.55fr)
    minmax(178px,.78fr)
    minmax(132px,.58fr)
    minmax(128px,.58fr)
    minmax(96px,.42fr)!important;
  padding-left:16px!important;
}
.portfolio-list-row.is-rankless .portfolio-list-rank{
  display:none!important;
}
.portfolio-list-row.is-rankless .portfolio-list-main{
  grid-column:auto!important;
}
.portfolio-list-row.is-rankless .portfolio-list-title-row strong{
  max-width:100%!important;
  font-size:15px!important;
}
.portfolio-list-row.is-rankless .portfolio-list-meta{
  max-width:100%!important;
}
.portfolio-list-row.is-rankless .portfolio-list-actions .btn{
  border-radius:13px!important;
}

/* Desktop-medium rebalance */
@media(max-width:1420px){
  .portfolio-list-row.is-rankless{
    grid-template-columns:
      minmax(210px,1.05fr)
      minmax(360px,1.45fr)
      minmax(170px,.78fr)
      minmax(126px,.60fr)
      minmax(120px,.58fr)
      minmax(90px,.42fr)!important;
  }
}

@media(max-width:1280px){
  .portfolio-list-row.is-rankless{
    grid-template-columns:
      minmax(205px,1fr)
      minmax(330px,1.38fr)
      minmax(166px,.8fr)
      minmax(120px,.62fr)
      minmax(170px,.9fr)
      minmax(88px,.44fr)!important;
  }
  .portfolio-list-row.is-rankless .portfolio-list-main{
    grid-column:1!important;
    grid-row:1!important;
  }
  .portfolio-list-row.is-rankless .portfolio-list-metrics{
    grid-column:2!important;
    grid-row:1!important;
  }
  .portfolio-list-row.is-rankless .portfolio-list-stars{
    grid-column:3!important;
    grid-row:1!important;
  }
  .portfolio-list-row.is-rankless .portfolio-list-spark{
    grid-column:4!important;
    grid-row:1!important;
  }
  .portfolio-list-row.is-rankless .portfolio-list-risk{
    grid-column:5!important;
    grid-row:1!important;
  }
  .portfolio-list-row.is-rankless .portfolio-list-actions{
    grid-column:6!important;
    grid-row:1!important;
  }
}

/* Tablet/mobile: keep horizontal row but without rank column */
@media(max-width:860px){
  .portfolio-list-row.is-rankless{
    grid-template-columns:210px 318px 166px 118px 130px 74px!important;
    width:1048px!important;
    min-width:1048px!important;
    padding-left:12px!important;
  }
  .portfolio-list-row.is-rankless .portfolio-list-main{
    grid-column:1!important;
    grid-row:auto!important;
  }
  .portfolio-list-row.is-rankless .portfolio-list-metrics{
    grid-column:2!important;
    grid-row:auto!important;
  }
  .portfolio-list-row.is-rankless .portfolio-list-stars{
    grid-column:3!important;
    grid-row:auto!important;
  }
  .portfolio-list-row.is-rankless .portfolio-list-spark{
    grid-column:4!important;
    grid-row:auto!important;
  }
  .portfolio-list-row.is-rankless .portfolio-list-risk{
    grid-column:5!important;
    grid-row:auto!important;
  }
  .portfolio-list-row.is-rankless .portfolio-list-actions{
    grid-column:6!important;
    grid-row:auto!important;
  }
  .portfolio-list-row.is-rankless .portfolio-list-title-row strong{
    max-width:198px!important;
  }
  .portfolio-list-row.is-rankless .portfolio-list-meta{
    max-width:204px!important;
  }
}

@media(max-width:560px){
  .portfolio-list-row.is-rankless{
    grid-template-columns:200px 306px 162px 112px 124px 70px!important;
    width:998px!important;
    min-width:998px!important;
    padding:9px 10px!important;
  }
  .portfolio-list-row.is-rankless .portfolio-list-title-row strong{
    max-width:190px!important;
  }
  .portfolio-list-row.is-rankless .portfolio-list-meta{
    max-width:194px!important;
  }
}


/* =========================================================
   Portfolio Ranked List: remove Risk Type column + Thai detail button
   Scope: only list rows. Card View below is untouched.
   ========================================================= */
.portfolio-list-row.is-rankless{
  grid-template-columns:
    minmax(250px,1.22fr)
    minmax(420px,1.68fr)
    minmax(182px,.78fr)
    minmax(150px,.62fr)
    minmax(118px,.48fr)!important;
}
.portfolio-list-row.is-rankless .portfolio-list-risk{
  display:none!important;
}
.portfolio-list-row.is-rankless .portfolio-list-actions .btn{
  width:100%!important;
  min-width:112px!important;
  padding-left:12px!important;
  padding-right:12px!important;
  font-size:11.5px!important;
  white-space:nowrap!important;
}
.portfolio-list-row.is-rankless .portfolio-list-spark{
  min-height:70px!important;
}
.portfolio-list-row.is-rankless .portfolio-list-spark .spark-svg{
  height:58px!important;
}

/* Rebalance medium desktop after removing Risk column */
@media(max-width:1420px){
  .portfolio-list-row.is-rankless{
    grid-template-columns:
      minmax(230px,1.15fr)
      minmax(390px,1.55fr)
      minmax(176px,.76fr)
      minmax(142px,.62fr)
      minmax(112px,.48fr)!important;
  }
}

@media(max-width:1280px){
  .portfolio-list-row.is-rankless{
    grid-template-columns:
      minmax(220px,1.05fr)
      minmax(370px,1.5fr)
      minmax(172px,.78fr)
      minmax(138px,.62fr)
      minmax(108px,.48fr)!important;
  }
  .portfolio-list-row.is-rankless .portfolio-list-main{grid-column:1!important;grid-row:1!important;}
  .portfolio-list-row.is-rankless .portfolio-list-metrics{grid-column:2!important;grid-row:1!important;}
  .portfolio-list-row.is-rankless .portfolio-list-stars{grid-column:3!important;grid-row:1!important;}
  .portfolio-list-row.is-rankless .portfolio-list-spark{grid-column:4!important;grid-row:1!important;}
  .portfolio-list-row.is-rankless .portfolio-list-actions{grid-column:5!important;grid-row:1!important;}
}

/* Mobile horizontal slider, still one row; Risk column removed */
@media(max-width:860px){
  .portfolio-list-row.is-rankless{
    grid-template-columns:210px 318px 166px 118px 104px!important;
    width:948px!important;
    min-width:948px!important;
  }
  .portfolio-list-row.is-rankless .portfolio-list-main{grid-column:1!important;grid-row:auto!important;}
  .portfolio-list-row.is-rankless .portfolio-list-metrics{grid-column:2!important;grid-row:auto!important;}
  .portfolio-list-row.is-rankless .portfolio-list-stars{grid-column:3!important;grid-row:auto!important;}
  .portfolio-list-row.is-rankless .portfolio-list-spark{grid-column:4!important;grid-row:auto!important;}
  .portfolio-list-row.is-rankless .portfolio-list-actions{grid-column:5!important;grid-row:auto!important;}
  .portfolio-list-row.is-rankless .portfolio-list-actions .btn{
    min-width:0!important;
    font-size:10.2px!important;
    padding-left:7px!important;
    padding-right:7px!important;
  }
}

@media(max-width:560px){
  .portfolio-list-row.is-rankless{
    grid-template-columns:200px 306px 162px 112px 102px!important;
    width:914px!important;
    min-width:914px!important;
  }
  .portfolio-list-row.is-rankless .portfolio-list-actions .btn{
    font-size:9.8px!important;
  }
}


/* =========================================================
   Mobile Portfolio Ranked List visual tighten
   - Remove heavy black shadow/fade
   - Move left text closer to edge
   - Make detail button smaller and prevent overflow
   Scope: mobile only, .portfolio-list-panel only.
   ========================================================= */
@media(max-width:860px){
  .portfolio-list-panel{
    padding-left:10px!important;
    padding-right:10px!important;
    background:
      radial-gradient(circle at 100% 0,rgba(242,199,106,.09),transparent 28%),
      linear-gradient(180deg,rgba(9,23,39,.86),rgba(5,15,27,.76))!important;
  }

  .portfolio-list-table{
    padding-left:0!important;
    padding-right:0!important;
  }

  .portfolio-list-row.is-rankless{
    grid-template-columns:190px 302px 156px 108px 84px!important;
    width:884px!important;
    min-width:884px!important;
    padding:8px 8px!important;
    gap:7px!important;
    background:
      linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025))!important;
    box-shadow:none!important;
    border-color:rgba(139,164,189,.18)!important;
  }

  .portfolio-list-row.is-rankless:hover{
    transform:none!important;
    box-shadow:none!important;
  }

  .portfolio-list-row.is-rankless:before,
  .portfolio-list-row.is-rankless:after,
  .portfolio-list-table:after{
    display:none!important;
    content:none!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-main{
    padding-left:0!important;
    margin-left:-2px!important;
    background:transparent!important;
    box-shadow:none!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-title-row{
    gap:4px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-title-row strong{
    max-width:184px!important;
    font-size:13.2px!important;
    line-height:1.1!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-title-row .type-badge,
  .portfolio-list-row.is-rankless .portfolio-list-title-row .status-badge{
    padding:3px 6px!important;
    font-size:8.3px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-meta{
    max-width:184px!important;
    margin-top:4px!important;
    font-size:8.9px!important;
    line-height:1.2!important;
    gap:3px 6px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-metrics{
    gap:4px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-metrics div{
    padding:6px 5px!important;
    border-radius:10px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-metrics small{
    font-size:7.3px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-metrics b{
    font-size:10.2px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-stars{
    padding:6px 7px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-star-row{
    grid-template-columns:47px minmax(52px,1fr) 26px!important;
    gap:3px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-star-label{
    font-size:7.2px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-stars .velaea-star-set i{
    font-size:8.3px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-star-row b{
    font-size:8.1px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-spark{
    min-height:56px!important;
    padding:5px!important;
    border-radius:10px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-spark .spark-svg{
    height:44px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-spark .velaea-verified-backtest-stamp.portfolio-list-stamp{
    width:50px!important;
    right:5px!important;
    bottom:4px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-actions{
    align-self:center!important;
    justify-content:center!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-actions .btn{
    width:auto!important;
    min-width:68px!important;
    max-width:78px!important;
    min-height:28px!important;
    padding:6px 8px!important;
    border-radius:10px!important;
    font-size:9px!important;
    line-height:1!important;
    white-space:nowrap!important;
    box-shadow:0 8px 18px rgba(242,199,106,.12)!important;
  }

  html[data-theme="light"] .portfolio-list-row.is-rankless{
    background:linear-gradient(180deg,rgba(255,255,255,.86),rgba(247,250,255,.70))!important;
    border-color:rgba(14,37,63,.12)!important;
  }
}

@media(max-width:560px){
  .portfolio-list-panel{
    padding-left:9px!important;
    padding-right:9px!important;
  }

  .portfolio-list-row.is-rankless{
    grid-template-columns:182px 292px 152px 104px 80px!important;
    width:850px!important;
    min-width:850px!important;
    padding:8px 7px!important;
    gap:6px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-main{
    margin-left:-3px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-title-row strong{
    max-width:176px!important;
    font-size:12.8px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-meta{
    max-width:176px!important;
    font-size:8.6px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-actions .btn{
    min-width:64px!important;
    max-width:74px!important;
    padding:6px 7px!important;
    font-size:8.8px!important;
  }
}


/* =========================================================
   Mobile Portfolio Ranked List text-overlap fix
   Fix badge / meta text colliding with Gain + Max DD columns.
   Scope: mobile only, .portfolio-list-panel only.
   ========================================================= */
@media(max-width:860px){
  .portfolio-list-row.is-rankless{
    grid-template-columns:214px 306px 156px 106px 82px!important;
    width:894px!important;
    min-width:894px!important;
    column-gap:10px!important;
    row-gap:0!important;
    align-items:center!important;
  }

  .portfolio-list-row.is-rankless > *{
    position:relative!important;
    left:auto!important;
    right:auto!important;
    transform:none!important;
    z-index:auto!important;
    min-width:0!important;
    overflow:hidden!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-main{
    grid-column:1!important;
    grid-row:1!important;
    width:100%!important;
    max-width:214px!important;
    margin-left:0!important;
    padding-right:8px!important;
    overflow:hidden!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-title-row{
    display:flex!important;
    align-items:center!important;
    gap:4px!important;
    flex-wrap:wrap!important;
    max-width:100%!important;
    overflow:hidden!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-title-row strong{
    flex:0 0 100%!important;
    max-width:198px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-title-row .type-badge,
  .portfolio-list-row.is-rankless .portfolio-list-title-row .status-badge{
    flex:0 1 auto!important;
    max-width:94px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-meta{
    display:flex!important;
    flex-wrap:wrap!important;
    max-width:198px!important;
    overflow:hidden!important;
    padding-right:4px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-meta span{
    max-width:92px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-metrics{
    grid-column:2!important;
    grid-row:1!important;
    width:100%!important;
    max-width:306px!important;
    min-width:0!important;
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    column-gap:5px!important;
    overflow:visible!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-metrics div{
    min-width:0!important;
    overflow:hidden!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-metrics b{
    display:block!important;
    max-width:100%!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:clip!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-stars{grid-column:3!important;grid-row:1!important;}
  .portfolio-list-row.is-rankless .portfolio-list-spark{grid-column:4!important;grid-row:1!important;}
  .portfolio-list-row.is-rankless .portfolio-list-actions{grid-column:5!important;grid-row:1!important;}
}

@media(max-width:560px){
  .portfolio-list-row.is-rankless{
    grid-template-columns:206px 296px 150px 102px 78px!important;
    width:862px!important;
    min-width:862px!important;
    column-gap:8px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-main{
    max-width:206px!important;
    padding-right:7px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-title-row strong{
    max-width:190px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-title-row .type-badge,
  .portfolio-list-row.is-rankless .portfolio-list-title-row .status-badge{
    max-width:90px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-meta{
    max-width:190px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-meta span{
    max-width:88px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-metrics{
    max-width:296px!important;
  }
}


/* =========================================================
   Mobile Portfolio Ranked List detail button overflow fix
   Keep "ดูรายละเอียด" inside the row/card edge.
   Scope: mobile only, Portfolio Ranked List only.
   ========================================================= */
@media(max-width:860px){
  .portfolio-list-table{
    padding-right:10px!important;
    scroll-padding-right:10px!important;
  }

  .portfolio-list-row.is-rankless{
    grid-template-columns:214px 306px 156px 106px 72px!important;
    width:884px!important;
    min-width:884px!important;
    padding-right:12px!important;
    overflow:hidden!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-actions{
    width:72px!important;
    max-width:72px!important;
    overflow:hidden!important;
    justify-self:end!important;
    display:flex!important;
    justify-content:center!important;
    align-items:center!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-actions .portfolio-list-detail-btn{
    width:58px!important;
    min-width:58px!important;
    max-width:58px!important;
    min-height:32px!important;
    height:32px!important;
    padding:4px 5px!important;
    border-radius:10px!important;
    font-size:8px!important;
    line-height:1.05!important;
    letter-spacing:-.02em!important;
    white-space:normal!important;
    overflow:hidden!important;
    text-align:center!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    word-break:keep-all!important;
    box-sizing:border-box!important;
  }
}

@media(max-width:560px){
  .portfolio-list-table{
    padding-right:12px!important;
    scroll-padding-right:12px!important;
  }

  .portfolio-list-row.is-rankless{
    grid-template-columns:206px 296px 150px 102px 68px!important;
    width:846px!important;
    min-width:846px!important;
    padding-right:11px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-actions{
    width:68px!important;
    max-width:68px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-actions .portfolio-list-detail-btn{
    width:55px!important;
    min-width:55px!important;
    max-width:55px!important;
    min-height:31px!important;
    height:31px!important;
    padding:4px 4px!important;
    font-size:7.8px!important;
  }
}


/* =========================================================
   Mobile Portfolio Ranked List title-link mode
   - Hide detail button on mobile only
   - Open full page by tapping portfolio title
   - Professional mobile treatment for clickable title
   Scope: only Portfolio Ranked List mobile (.is-rankless)
   ========================================================= */
.portfolio-list-title-link{
  color:inherit;
  text-decoration:none;
  display:block;
  min-width:0;
}
.portfolio-list-title-link:hover,
.portfolio-list-title-link:focus-visible{
  text-decoration:none;
}
.portfolio-list-title-link strong{
  color:inherit;
}

@media(max-width:860px){
  .portfolio-list-row.is-rankless{
    grid-template-columns:214px 306px 156px 106px!important;
    width:802px!important;
    min-width:802px!important;
    padding-right:10px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-main{
    max-width:214px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-title-row{
    gap:4px!important;
    align-items:flex-start!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-title-link{
    flex:0 0 100%!important;
    max-width:198px!important;
    display:flex!important;
    align-items:center!important;
    gap:7px!important;
    min-width:0!important;
    padding:1px 0!important;
    color:#f5d78d!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-title-link strong{
    flex:1 1 auto!important;
    max-width:none!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    color:inherit!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-title-link::after{
    content:"↗";
    flex:0 0 auto;
    width:18px;
    height:18px;
    display:grid;
    place-items:center;
    border-radius:999px;
    font-size:10px;
    font-weight:1000;
    color:#1a1407;
    background:linear-gradient(135deg,rgba(242,199,106,.98),rgba(212,164,69,.98));
    box-shadow:0 6px 14px rgba(242,199,106,.16);
  }

  .portfolio-list-row.is-rankless .portfolio-list-title-link:active{
    transform:translateY(1px);
    opacity:.96;
  }

  html[data-theme="light"] .portfolio-list-row.is-rankless .portfolio-list-title-link{
    color:#8a6117!important;
  }

  html[data-theme="light"] .portfolio-list-row.is-rankless .portfolio-list-title-link::after{
    color:#ffffff;
    background:linear-gradient(135deg,#c9942b,#a67314);
    box-shadow:0 6px 14px rgba(166,115,20,.18);
  }

  .portfolio-list-row.is-rankless .portfolio-list-meta{
    max-width:198px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-metrics{grid-column:2!important;grid-row:1!important;max-width:306px!important;}
  .portfolio-list-row.is-rankless .portfolio-list-stars{grid-column:3!important;grid-row:1!important;}
  .portfolio-list-row.is-rankless .portfolio-list-spark{grid-column:4!important;grid-row:1!important;}

  .portfolio-list-row.is-rankless .portfolio-list-actions,
  .portfolio-list-row.is-rankless .portfolio-list-actions .btn,
  .portfolio-list-row.is-rankless .portfolio-list-detail-btn{
    display:none!important;
    width:0!important;
    min-width:0!important;
    max-width:0!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
  }
}

@media(max-width:560px){
  .portfolio-list-row.is-rankless{
    grid-template-columns:206px 296px 150px 102px!important;
    width:778px!important;
    min-width:778px!important;
    padding-right:9px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-main{
    max-width:206px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-title-link{
    max-width:190px!important;
    gap:6px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-title-link::after{
    width:17px;
    height:17px;
    font-size:9px;
  }

  .portfolio-list-row.is-rankless .portfolio-list-meta{
    max-width:190px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-metrics{max-width:296px!important;}
}


/* =========================================================
   VELAEA Hotfix 20260705: Mobile portfolio graph spacing
   แก้กล่องกราฟขวาสุดในลิสต์พอร์ตมือถือไม่ให้ล้น/ชิด/โดนตัด
   Scope: ea-community.html > Portfolio Ranked List mobile only
   ========================================================= */
@media(max-width:860px){
  .portfolio-list-panel{
    overflow:hidden!important;
  }

  .portfolio-list-table{
    overflow-x:auto!important;
    overflow-y:hidden!important;
    padding-right:18px!important;
    padding-bottom:12px!important;
    scroll-padding-right:18px!important;
    -webkit-overflow-scrolling:touch!important;
  }

  .portfolio-list-row.is-rankless{
    grid-template-columns:214px 306px 156px 138px!important;
    column-gap:15px!important;
    width:891px!important;
    min-width:891px!important;
    max-width:none!important;
    padding:10px 20px 10px 12px!important;
    align-items:center!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-main{grid-column:1!important;grid-row:1!important;}
  .portfolio-list-row.is-rankless .portfolio-list-metrics{grid-column:2!important;grid-row:1!important;}
  .portfolio-list-row.is-rankless .portfolio-list-stars{grid-column:3!important;grid-row:1!important;}
  .portfolio-list-row.is-rankless .portfolio-list-spark{grid-column:4!important;grid-row:1!important;}

  .portfolio-list-row.is-rankless .portfolio-list-spark{
    width:120px!important;
    min-width:120px!important;
    max-width:120px!important;
    justify-self:start!important;
    margin-left:2px!important;
    margin-right:0!important;
    padding:6px!important;
    min-height:58px!important;
    border-radius:12px!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-spark .spark-svg{
    width:100%!important;
    max-width:100%!important;
    height:46px!important;
    display:block!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-spark .velaea-verified-backtest-stamp.portfolio-list-stamp{
    width:54px!important;
    max-width:48%!important;
    right:6px!important;
    bottom:5px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-actions,
  .portfolio-list-row.is-rankless .portfolio-list-detail-btn{
    display:none!important;
  }
}

@media(max-width:560px){
  .portfolio-list-table{
    padding-right:20px!important;
    scroll-padding-right:20px!important;
  }

  .portfolio-list-row.is-rankless{
    grid-template-columns:206px 296px 150px 132px!important;
    column-gap:14px!important;
    width:856px!important;
    min-width:856px!important;
    padding:10px 22px 10px 10px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-main{
    max-width:206px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-title-link{
    max-width:190px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-meta{
    max-width:190px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-metrics{
    max-width:296px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-spark{
    width:116px!important;
    min-width:116px!important;
    max-width:116px!important;
    min-height:58px!important;
    padding:6px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-spark .spark-svg{
    height:46px!important;
  }
}

@media(max-width:430px){
  .portfolio-list-row.is-rankless{
    grid-template-columns:198px 286px 146px 128px!important;
    column-gap:12px!important;
    width:824px!important;
    min-width:824px!important;
    padding-right:22px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-main{
    max-width:198px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-title-link,
  .portfolio-list-row.is-rankless .portfolio-list-meta{
    max-width:184px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-metrics{
    max-width:286px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-spark{
    width:112px!important;
    min-width:112px!important;
    max-width:112px!important;
  }
}



/* =========================================================
   VELAEA Hotfix 20260705: Mobile full-page detail button
   - Re-adds a premium "ดูรายละเอียด" button on the far right of the graph
   - The button is an anchor generated by ea-community.js and opens the full page
   - Mobile only: Portfolio Ranked List / horizontal row layout
   ========================================================= */
@media(max-width:860px){
  .portfolio-list-table{
    padding-right:22px!important;
    scroll-padding-right:22px!important;
  }

  .portfolio-list-row.is-rankless{
    grid-template-columns:214px 306px 156px 132px 88px!important;
    column-gap:14px!important;
    width:986px!important;
    min-width:986px!important;
    padding:10px 22px 10px 12px!important;
    align-items:center!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-main{grid-column:1!important;grid-row:1!important;}
  .portfolio-list-row.is-rankless .portfolio-list-metrics{grid-column:2!important;grid-row:1!important;max-width:306px!important;}
  .portfolio-list-row.is-rankless .portfolio-list-stars{grid-column:3!important;grid-row:1!important;}
  .portfolio-list-row.is-rankless .portfolio-list-spark{grid-column:4!important;grid-row:1!important;}

  .portfolio-list-row.is-rankless .portfolio-list-actions{
    grid-column:5!important;
    grid-row:1!important;
    display:flex!important;
    width:88px!important;
    min-width:88px!important;
    max-width:88px!important;
    justify-self:end!important;
    align-self:center!important;
    justify-content:center!important;
    align-items:center!important;
    padding:0!important;
    margin:0!important;
    overflow:visible!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-actions .btn,
  .portfolio-list-row.is-rankless .portfolio-list-actions .portfolio-list-detail-btn,
  .portfolio-list-row.is-rankless .portfolio-list-detail-btn{
    display:flex!important;
    width:78px!important;
    min-width:78px!important;
    max-width:78px!important;
    min-height:42px!important;
    height:42px!important;
    padding:7px 8px!important;
    border-radius:14px!important;
    border:1px solid rgba(255,229,158,.72)!important;
    background:linear-gradient(135deg,#ffdc7a 0%,#d7a43f 52%,#9d6815 100%)!important;
    color:#121006!important;
    box-shadow:0 12px 24px rgba(242,199,106,.20), inset 0 1px 0 rgba(255,255,255,.48)!important;
    font-size:9px!important;
    font-weight:1000!important;
    line-height:1.05!important;
    letter-spacing:-.015em!important;
    white-space:normal!important;
    text-align:center!important;
    text-decoration:none!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
    align-items:center!important;
    justify-content:center!important;
    flex-direction:column!important;
    gap:2px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-actions .portfolio-list-detail-btn::after{
    content:"↗";
    display:grid;
    place-items:center;
    width:16px;
    height:16px;
    border-radius:999px;
    background:rgba(5,10,18,.18);
    color:#111006;
    font-size:9px;
    line-height:1;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);
  }

  .portfolio-list-row.is-rankless .portfolio-list-actions .portfolio-list-detail-btn:active{
    transform:translateY(1px)!important;
    filter:brightness(.98)!important;
  }

  html[data-theme="light"] .portfolio-list-row.is-rankless .portfolio-list-actions .portfolio-list-detail-btn{
    border-color:rgba(178,123,22,.36)!important;
    box-shadow:0 10px 22px rgba(166,115,20,.18), inset 0 1px 0 rgba(255,255,255,.62)!important;
  }
}

@media(max-width:560px){
  .portfolio-list-table{
    padding-right:22px!important;
    scroll-padding-right:22px!important;
  }

  .portfolio-list-row.is-rankless{
    grid-template-columns:206px 296px 150px 126px 84px!important;
    column-gap:13px!important;
    width:950px!important;
    min-width:950px!important;
    padding:10px 22px 10px 10px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-main{max-width:206px!important;}
  .portfolio-list-row.is-rankless .portfolio-list-title-link{max-width:190px!important;}
  .portfolio-list-row.is-rankless .portfolio-list-meta{max-width:190px!important;}
  .portfolio-list-row.is-rankless .portfolio-list-metrics{max-width:296px!important;}

  .portfolio-list-row.is-rankless .portfolio-list-spark{
    width:116px!important;
    min-width:116px!important;
    max-width:116px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-actions{
    width:84px!important;
    min-width:84px!important;
    max-width:84px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-actions .btn,
  .portfolio-list-row.is-rankless .portfolio-list-actions .portfolio-list-detail-btn,
  .portfolio-list-row.is-rankless .portfolio-list-detail-btn{
    width:74px!important;
    min-width:74px!important;
    max-width:74px!important;
    min-height:40px!important;
    height:40px!important;
    padding:6px 7px!important;
    border-radius:13px!important;
    font-size:8.6px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-actions .portfolio-list-detail-btn::after{
    width:15px;
    height:15px;
    font-size:8px;
  }
}

@media(max-width:430px){
  .portfolio-list-row.is-rankless{
    grid-template-columns:198px 286px 146px 122px 82px!important;
    column-gap:12px!important;
    width:914px!important;
    min-width:914px!important;
    padding-right:22px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-main{max-width:198px!important;}

  .portfolio-list-row.is-rankless .portfolio-list-title-link,
  .portfolio-list-row.is-rankless .portfolio-list-meta{
    max-width:184px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-metrics{max-width:286px!important;}

  .portfolio-list-row.is-rankless .portfolio-list-spark{
    width:112px!important;
    min-width:112px!important;
    max-width:112px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-actions{
    width:82px!important;
    min-width:82px!important;
    max-width:82px!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-actions .btn,
  .portfolio-list-row.is-rankless .portfolio-list-actions .portfolio-list-detail-btn,
  .portfolio-list-row.is-rankless .portfolio-list-detail-btn{
    width:72px!important;
    min-width:72px!important;
    max-width:72px!important;
    min-height:40px!important;
    height:40px!important;
    font-size:8.4px!important;
  }
}

/* =========================================================
   VELAEA Hotfix 20260705: Clean mobile detail button
   - Remove the arrow badge from the mobile detail button
   - Make the button flatter, quieter, and more professional
   ========================================================= */
@media(max-width:860px){
  .portfolio-list-row.is-rankless .portfolio-list-actions .portfolio-list-detail-btn::after{
    content:none!important;
    display:none!important;
  }

  .portfolio-list-row.is-rankless .portfolio-list-actions .btn,
  .portfolio-list-row.is-rankless .portfolio-list-actions .portfolio-list-detail-btn,
  .portfolio-list-row.is-rankless .portfolio-list-detail-btn{
    flex-direction:row!important;
    gap:0!important;
    min-height:36px!important;
    height:36px!important;
    padding:0 8px!important;
    border-radius:12px!important;
    border:1px solid rgba(242,199,106,.58)!important;
    background:linear-gradient(180deg,#f4cf77 0%,#d0a044 100%)!important;
    color:#151007!important;
    box-shadow:0 8px 18px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.34)!important;
    font-size:9.2px!important;
    font-weight:950!important;
    line-height:1!important;
    letter-spacing:0!important;
    white-space:nowrap!important;
    text-transform:none!important;
  }

  html[data-theme="light"] .portfolio-list-row.is-rankless .portfolio-list-actions .portfolio-list-detail-btn{
    border-color:rgba(170,119,31,.42)!important;
    background:linear-gradient(180deg,#f7d98f 0%,#d5a84f 100%)!important;
    box-shadow:0 7px 16px rgba(166,115,20,.14), inset 0 1px 0 rgba(255,255,255,.55)!important;
  }
}

@media(max-width:560px){
  .portfolio-list-row.is-rankless .portfolio-list-actions .btn,
  .portfolio-list-row.is-rankless .portfolio-list-actions .portfolio-list-detail-btn,
  .portfolio-list-row.is-rankless .portfolio-list-detail-btn{
    min-height:35px!important;
    height:35px!important;
    padding:0 7px!important;
    border-radius:11px!important;
    font-size:8.9px!important;
  }
}

@media(max-width:430px){
  .portfolio-list-row.is-rankless .portfolio-list-actions .btn,
  .portfolio-list-row.is-rankless .portfolio-list-actions .portfolio-list-detail-btn,
  .portfolio-list-row.is-rankless .portfolio-list-detail-btn{
    min-height:34px!important;
    height:34px!important;
    padding:0 6px!important;
    border-radius:11px!important;
    font-size:8.6px!important;
  }
}


/* ===== Contest Arena ===== */
.btn-contest-link{
  position:relative;
  overflow:hidden;
}

.contest-arena{
  display:grid;
  gap:22px;
  margin-top:18px;
  margin-bottom:18px;
}

.contest-hero-card,
.contest-lineup-panel,
.contest-rules-card,
.contest-reward-card{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(242,199,106,.16);
  border-radius:30px;
  background:
    radial-gradient(circle at 0% 0%, rgba(242,199,106,.14), transparent 30%),
    radial-gradient(circle at 100% 0%, rgba(38,106,255,.12), transparent 30%),
    linear-gradient(135deg, rgba(9,24,44,.94), rgba(5,14,27,.96));
  box-shadow:0 26px 60px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.05);
}

.contest-hero-card::before,
.contest-lineup-panel::before,
.contest-rules-card::before,
.contest-reward-card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(120deg, rgba(255,255,255,.06), transparent 28%, transparent 72%, rgba(242,199,106,.05));
}

.contest-hero-card{
  display:grid;
  grid-template-columns:minmax(0, 1.2fr) minmax(320px, .8fr);
  gap:22px;
  padding:34px;
}

.contest-hero-copy,
.contest-spotlight-card,
.contest-lineup-panel > *,
.contest-rules-card > *,
.contest-reward-card > *{
  position:relative;
  z-index:1;
}

.contest-eyebrow{
  margin-bottom:10px;
}

.contest-hero-copy h2{
  margin:0;
  color:#fff;
  font-size:clamp(34px, 4vw, 58px);
  line-height:.96;
  letter-spacing:-.04em;
}

.contest-lead{
  margin:16px 0 0;
  max-width:760px;
  color:#b7c7da;
  font-size:15px;
  line-height:1.82;
}

.contest-stat-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:14px;
  margin-top:22px;
}

.contest-stat-card{
  padding:16px 18px;
  border-radius:20px;
  border:1px solid rgba(242,199,106,.14);
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
}

.contest-stat-label{
  display:block;
  margin-bottom:8px;
  color:#f2c76a;
  font-size:11px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.contest-stat-card strong{
  display:block;
  color:#fff;
  font-size:28px;
  line-height:1;
}

.contest-stat-card small{
  display:block;
  margin-top:8px;
  color:#91a6be;
  font-size:12px;
}

.contest-hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:24px;
}

.contest-spotlight-card{
  align-self:stretch;
  padding:22px;
  border-radius:26px;
  border:1px solid rgba(242,199,106,.18);
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
}

.contest-spotlight-top,
.contest-entry-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}

.contest-badge,
.contest-chip,
.contest-sponsor{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:32px;
  padding:6px 12px;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
}

.contest-badge.live{background:rgba(34,197,94,.14); color:#6df1a4; border:1px solid rgba(34,197,94,.28);}
.contest-badge.active{background:rgba(59,130,246,.14); color:#84b6ff; border:1px solid rgba(59,130,246,.28);}
.contest-badge.upcoming{background:rgba(242,199,106,.12); color:#f3d58b; border:1px solid rgba(242,199,106,.24);}
.contest-chip,
.contest-sponsor{background:rgba(255,255,255,.06); color:#d7e3ef; border:1px solid rgba(255,255,255,.08);}

.contest-spotlight-card h3,
.contest-lineup-panel h3,
.contest-rules-card h3,
.contest-reward-card h3{
  margin:14px 0 0;
  color:#fff;
  font-size:30px;
  line-height:1.05;
}

.contest-spotlight-card p,
.contest-section-head p,
.contest-entry-card p{color:#aabdd2; line-height:1.72;}

.contest-spotlight-metrics,
.contest-meta-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:12px;
  margin-top:18px;
}

.contest-spotlight-metrics div,
.contest-meta-grid div{
  padding:12px 14px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(5,12,24,.34);
}

.contest-spotlight-metrics span,
.contest-meta-grid span{
  display:block;
  color:#88a1bb;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.contest-spotlight-metrics strong,
.contest-meta-grid strong{
  display:block;
  margin-top:6px;
  color:#fff;
  font-size:15px;
}

.contest-progress-block{margin-top:18px;}
.contest-progress-head{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; color:#dfe9f2; font-size:13px; font-weight:800;}
.contest-progress-track{height:12px; border-radius:999px; background:rgba(255,255,255,.08); overflow:hidden;}
.contest-progress-track i{display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg, #f2c76a, #3ddc97); box-shadow:0 0 20px rgba(242,199,106,.25);} 
.contest-progress-block small{display:block; margin-top:10px; color:#8da3b8;}

.contest-lineup-panel,
.contest-rules-card,
.contest-reward-card{padding:28px;}

.contest-section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  margin-bottom:18px;
}
.contest-section-head.compact{margin-bottom:16px;}
.contest-head-note{
  padding:10px 14px;
  border-radius:999px;
  border:1px solid rgba(242,199,106,.18);
  background:rgba(242,199,106,.08);
  color:#f3d58b;
  font-size:12px;
  font-weight:800;
}

.contest-card-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:16px;
}

.contest-entry-card{
  display:flex;
  flex-direction:column;
  gap:12px;
  padding:22px;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025));
}

.contest-entry-card.featured{
  background:linear-gradient(180deg, rgba(242,199,106,.12), rgba(255,255,255,.04));
  border-color:rgba(242,199,106,.22);
}

.contest-entry-card h4{
  margin:0;
  color:#fff;
  font-size:24px;
  line-height:1.1;
}

.contest-entry-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:auto;
}

.contest-bottom-grid{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:18px;
}

.contest-rules-list{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:12px;
}

.contest-rules-list li{
  display:grid;
  gap:5px;
  padding:16px 18px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
}

.contest-rules-list strong{color:#fff; font-size:15px;}
.contest-rules-list span{color:#9eb3c8; line-height:1.66; font-size:13px;}

.contest-prize-tier{
  display:grid;
  gap:12px;
}

.contest-prize-tier .tier{
  padding:18px 18px;
  border-radius:20px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025));
}

.contest-prize-tier .tier span{display:block; color:#f2c76a; font-size:11px; font-weight:900; letter-spacing:.14em; text-transform:uppercase;}
.contest-prize-tier .tier strong{display:block; margin-top:8px; color:#fff; font-size:28px; line-height:1;}
.contest-prize-tier .tier small{display:block; margin-top:8px; color:#98afc6;}
.contest-prize-tier .tier.first{border-color:rgba(242,199,106,.24); background:linear-gradient(180deg, rgba(242,199,106,.12), rgba(255,255,255,.04));}
.contest-prize-tier .tier.second{border-color:rgba(131,154,255,.18);}
.contest-prize-tier .tier.third{border-color:rgba(61,220,151,.18);}

@media (max-width: 1180px){
  .contest-hero-card,
  .contest-bottom-grid,
  .contest-card-grid{grid-template-columns:1fr;}
}

@media (max-width: 860px){
  .contest-hero-card,
  .contest-lineup-panel,
  .contest-rules-card,
  .contest-reward-card{padding:22px; border-radius:24px;}
  .contest-section-head{align-items:flex-start; flex-direction:column;}
  .contest-stat-grid,
  .contest-spotlight-metrics,
  .contest-meta-grid{grid-template-columns:1fr 1fr;}
}

@media (max-width: 640px){
  .contest-arena{gap:18px; margin-top:14px;}
  .contest-hero-card,
  .contest-lineup-panel,
  .contest-rules-card,
  .contest-reward-card{padding:18px; border-radius:22px;}
  .contest-hero-copy h2{font-size:34px;}
  .contest-lead{font-size:14px; line-height:1.72;}
  .contest-stat-grid,
  .contest-spotlight-metrics,
  .contest-meta-grid,
  .contest-bottom-grid{grid-template-columns:1fr;}
  .contest-card-grid{grid-template-columns:1fr; gap:14px;}
  .contest-spotlight-card h3,
  .contest-lineup-panel h3,
  .contest-rules-card h3,
  .contest-reward-card h3{font-size:24px;}
  .contest-entry-card h4{font-size:21px;}
  .contest-head-note{font-size:11px;}
  .contest-hero-actions,
  .contest-entry-actions{flex-direction:column;}
  .contest-hero-actions .btn,
  .contest-entry-actions .btn{width:100%; justify-content:center;}
}

/* Contest section should appear only after clicking the Contest menu tab. */
.contest-arena[hidden]{
  display:none!important;
}

/* Contest waiting state: no active competition yet. */
.contest-waiting-card{
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0, 1.08fr) minmax(320px, .92fr);
  gap:24px;
  padding:36px;
  border:1px solid rgba(242,199,106,.16);
  border-radius:30px;
  background:
    radial-gradient(circle at 0% 0%, rgba(242,199,106,.15), transparent 30%),
    radial-gradient(circle at 100% 0%, rgba(78,165,255,.12), transparent 32%),
    linear-gradient(135deg, rgba(9,24,44,.95), rgba(4,13,26,.98));
  box-shadow:0 28px 68px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.055);
}

.contest-waiting-card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(120deg, rgba(255,255,255,.06), transparent 32%, rgba(242,199,106,.055)),
    radial-gradient(circle at 60% 120%, rgba(242,199,106,.10), transparent 38%);
}

.contest-waiting-copy,
.contest-waiting-side{
  position:relative;
  z-index:1;
}

.contest-status-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:7px 13px;
  border-radius:999px;
  font-size:12px;
  font-weight:950;
  letter-spacing:.10em;
  text-transform:uppercase;
}

.contest-status-badge.is-waiting{
  color:#ffe4a8;
  border:1px solid rgba(242,199,106,.28);
  background:linear-gradient(135deg, rgba(242,199,106,.18), rgba(255,255,255,.045));
  box-shadow:0 14px 30px rgba(242,199,106,.12), inset 0 1px 0 rgba(255,255,255,.08);
}

.contest-waiting-copy h2{
  margin:14px 0 0;
  color:#fff;
  font-size:clamp(34px, 4vw, 58px);
  line-height:.98;
  letter-spacing:-.045em;
}

.contest-waiting-copy .contest-lead strong{
  color:#f2c76a;
  font-weight:1000;
}

.contest-waiting-progress{
  margin-top:24px;
  padding:18px;
  border-radius:22px;
  border:1px solid rgba(242,199,106,.14);
  background:linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.022));
}

.contest-progress-track.is-empty{
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.07);
}

.contest-progress-track.is-empty i{
  min-width:0;
  background:linear-gradient(90deg, #f2c76a, #3ddc97);
}

.contest-waiting-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:22px;
}

.contest-waiting-side{
  display:grid;
  gap:18px;
  align-content:center;
}

.contest-waiting-orb{
  width:min(280px, 100%);
  aspect-ratio:1;
  margin:0 auto;
  border-radius:999px;
  display:grid;
  place-items:center;
  align-content:center;
  text-align:center;
  border:1px solid rgba(242,199,106,.22);
  background:
    radial-gradient(circle, rgba(5,15,28,.96) 0 46%, transparent 47%),
    conic-gradient(from 220deg, rgba(242,199,106,.08), rgba(242,199,106,.76), rgba(78,165,255,.18), rgba(242,199,106,.08));
  box-shadow:inset 0 0 32px rgba(242,199,106,.08), 0 24px 54px rgba(0,0,0,.22);
}

.contest-waiting-orb span{
  display:block;
  color:#f2c76a;
  font-size:52px;
  line-height:1;
  font-weight:1000;
  letter-spacing:-.05em;
}

.contest-waiting-orb small{
  display:block;
  margin-top:8px;
  color:#9fb5cb;
  font-size:11px;
  font-weight:950;
  letter-spacing:.16em;
}

.contest-ready-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:12px;
}

.contest-ready-grid article{
  padding:15px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.045);
}

.contest-ready-grid span{
  display:block;
  color:#8ca6c2;
  font-size:11px;
  font-weight:900;
  letter-spacing:.10em;
  text-transform:uppercase;
}

.contest-ready-grid strong{
  display:block;
  margin-top:6px;
  color:#fff;
  font-size:16px;
  line-height:1.18;
}

.contest-ready-grid small{
  display:block;
  margin-top:6px;
  color:#95a9bd;
  line-height:1.45;
}

@media (max-width: 1180px){
  .contest-waiting-card{
    grid-template-columns:1fr;
  }
  .contest-waiting-side{
    align-content:stretch;
  }
}

@media (max-width: 640px){
  .contest-waiting-card{
    padding:18px;
    border-radius:22px;
    gap:18px;
  }
  .contest-waiting-copy h2{
    font-size:34px;
  }
  .contest-waiting-actions{
    flex-direction:column;
  }
  .contest-waiting-actions .btn{
    width:100%;
    justify-content:center;
  }
  .contest-waiting-orb{
    width:min(220px, 100%);
  }
  .contest-waiting-orb span{
    font-size:42px;
  }
  .contest-ready-grid{
    grid-template-columns:1fr;
  }
}

.contest-progress-head b{
  color:#f2c76a;
  font-weight:1000;
  margin-left:6px;
}

.contest-ready-grid article:nth-child(2){
  border-color:rgba(242,199,106,.18);
  background:linear-gradient(180deg, rgba(242,199,106,.08), rgba(255,255,255,.035));
}

#contestMemberOrbCount{
  font-variant-numeric:tabular-nums;
}

@media (max-width:640px){
  .contest-progress-head{
    align-items:flex-start;
    flex-direction:column;
  }
}

/* Contest professional philosophy copy */
.contest-philosophy-card{
  margin-top:22px;
  padding:18px;
  border-radius:22px;
  border:1px solid rgba(242,199,106,.16);
  background:
    linear-gradient(135deg, rgba(242,199,106,.10), rgba(255,255,255,.035)),
    rgba(255,255,255,.035);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055);
}

.contest-philosophy-head{
  display:grid;
  gap:6px;
  margin-bottom:12px;
}

.contest-philosophy-head span{
  color:#f2c76a;
  font-size:11px;
  font-weight:1000;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.contest-philosophy-head strong{
  color:#fff;
  font-size:22px;
  line-height:1.18;
  letter-spacing:-.02em;
}

.contest-philosophy-card p{
  margin:0;
  color:#b6c7d8;
  line-height:1.78;
}

.contest-philosophy-card p strong{
  color:#f2c76a;
}

.contest-philosophy-list{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin:15px 0 0;
}

.contest-philosophy-list span{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:7px 11px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.09);
  background:rgba(7,17,31,.48);
  color:#eaf2fb;
  font-size:12px;
  font-weight:900;
}

.contest-philosophy-card small{
  display:block;
  margin-top:13px;
  color:#91a7bd;
  line-height:1.68;
}

@media (max-width:640px){
  .contest-philosophy-card{
    padding:15px;
    border-radius:18px;
  }
  .contest-philosophy-head strong{
    font-size:19px;
  }
  .contest-philosophy-list{
    gap:8px;
  }
  .contest-philosophy-list span{
    width:100%;
    justify-content:center;
  }
}

/* Mobile QA: closed detail drawer must not create invisible horizontal overflow. */
.detail-drawer[aria-hidden="true"]:not(.open){
  visibility:hidden!important;
  pointer-events:none!important;
}

.detail-drawer.open[aria-hidden="false"]{
  visibility:visible!important;
}

/* Tablet QA: dashboard-style community topbar wraps before it can overflow. */
@media (max-width:900px){
  .community-shell{
    width:min(100% - 24px,1260px);
  }

  .community-nav{
    height:auto;
    min-height:68px;
    flex-wrap:wrap;
    gap:10px;
    padding:10px 0;
  }

  .community-brand img{
    width:104px;
  }

  .community-menu{
    order:3;
    width:100%;
    margin-left:0;
    overflow-x:auto;
    padding-bottom:5px;
    scrollbar-width:none;
  }

  .community-menu::-webkit-scrollbar{
    display:none;
  }

  .community-actions{
    margin-left:auto;
    max-width:calc(100vw - 150px);
    overflow-x:auto;
    scrollbar-width:none;
  }

  .community-actions::-webkit-scrollbar{
    display:none;
  }

  .theme-text,
  .lang-current-text,
  .community-profile-role{
    display:none!important;
  }
}


/* VELAEA patch: remove legacy community hero trust chips */
.ea-community-page .community-hero .trust-row{display:none!important;}