/* member-portal — ported verbatim from the client-approved static build (member-portal.html).
   Loaded only on this template. Do not restyle without checking the approved demo. */


:root{
  --navy:#101725; --navy-2:#131d2d; --navy-3:#0d1420;
  --brand:#a5231a; --brand-hi:#e02b20; --gold:#af9d80; --gold-hi:#c7a86d;
  --ground:#ffffff; --ground-2:#f4f4f4; --ground-3:#e8ebf2;
  --ink:#101725; --ink-2:#3d4a5f; --ink-3:#78859a;
  --line:#d5dae3; --line-soft:#e8ebf2;
  --ok:#1b7a50; --ok-bg:#ddf0e7; --warn:#8a6410; --warn-bg:#fbeed2;
  --dn:#a5231a; --dn-bg:#f9e1dc;
}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --ground:#0d1420; --ground-2:#131d2d; --ground-3:#1a2637;
  --ink:#e8ebf2; --ink-2:#a8b4c4; --ink-3:#78859a;
  --line:#243044; --line-soft:#1b2637;
  --brand:#e02b20; --brand-hi:#ff6055; --gold:#c7a86d;
  --ok:#4fbe8b; --ok-bg:#102e23; --warn:#d9a441; --warn-bg:#2e2410;
  --dn:#e0574a; --dn-bg:#301711;
}}
:root[data-theme="dark"]{
  --ground:#0d1420; --ground-2:#131d2d; --ground-3:#1a2637;
  --ink:#e8ebf2; --ink-2:#a8b4c4; --ink-3:#78859a;
  --line:#243044; --line-soft:#1b2637;
  --brand:#e02b20; --brand-hi:#ff6055; --gold:#c7a86d;
  --ok:#4fbe8b; --ok-bg:#102e23; --warn:#d9a441; --warn-bg:#2e2410;
  --dn:#e0574a; --dn-bg:#301711;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--ground-2);color:var(--ink);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-size:15px;line-height:1.55;
  -webkit-font-smoothing:antialiased}
.mono{font-family:ui-monospace,"SF Mono","Cascadia Mono",Menlo,Consolas,monospace;font-variant-numeric:tabular-nums}
a{color:inherit}
.wrap{max-width:1400px;margin:0 auto;padding:0 clamp(14px,2.4vw,26px)}

.demobar{background:var(--navy);color:#fff;font-size:13px;padding:9px 16px;text-align:center;
  border-bottom:2px solid var(--brand)}
.demobar a{color:var(--gold-hi);text-decoration:underline}

/* top bar */
.top{background:var(--navy);color:#fff;position:sticky;top:0;z-index:40}
.top-in{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 0}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:16px;text-decoration:none;color:#fff}
.logo .m{width:28px;height:28px;border-radius:5px;background:var(--brand);display:grid;place-items:center;
  font-size:10.5px;font-weight:900}
.tnav{display:flex;gap:4px;flex-wrap:wrap}
.tnav a{padding:7px 13px;border-radius:4px;font-size:14px;text-decoration:none;color:#b9c3d1}
.tnav a:hover{background:rgba(255,255,255,.08);color:#fff}
.tnav a.on{background:var(--brand);color:#fff;font-weight:620}
@media(max-width:980px){.tnav{display:none}}
.me{display:flex;align-items:center;gap:10px;font-size:13.5px;color:#b9c3d1}
.av{width:30px;height:30px;border-radius:50%;background:var(--gold-hi);color:var(--navy);
  display:grid;place-items:center;font-weight:800;font-size:12px}

/* market strip */
.strip{background:var(--navy-2);border-bottom:1px solid rgba(255,255,255,.09);overflow:hidden}
.strip-in{display:flex;gap:26px;padding:9px 0;overflow-x:auto;font-family:ui-monospace,Menlo,Consolas,monospace;
  font-size:12.5px;color:#b9c3d1;scrollbar-width:none}
.strip-in::-webkit-scrollbar{display:none}
.strip b{color:#fff;font-weight:650}
.strip .up{color:#4fbe8b}.strip .dn{color:#ff6055}

.shell{display:grid;grid-template-columns:1fr 336px;gap:18px;padding:20px 0 70px;align-items:start}
@media(max-width:1120px){.shell{grid-template-columns:1fr}}

.card{background:var(--ground);border:1px solid var(--line);border-radius:8px;overflow:hidden;
  box-shadow:0 1px 2px rgba(16,23,37,.04)}
.card + .card{margin-top:18px}
.ch{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:13px 18px;border-bottom:1px solid var(--line);background:var(--ground)}
.ch h2{margin:0;font-size:15px;font-weight:700;letter-spacing:-.012em;display:flex;align-items:center;gap:9px}
.ch .more{font-size:13px;color:var(--brand-hi);text-decoration:none;font-weight:600}
.ch .more:hover{text-decoration:underline}
.cb{padding:18px}
.rule{width:3px;height:15px;border-radius:2px;background:var(--brand);display:inline-block}

/* hero note */
.today{background:var(--navy);color:#fff;border:0}
.today .ch{background:transparent;border-bottom:1px solid rgba(255,255,255,.12);color:#fff}
.today .ch h2{color:#fff}
.today .ch .more{color:var(--gold-hi)}
.live{display:inline-flex;align-items:center;gap:7px;font-size:11px;letter-spacing:.13em;
  text-transform:uppercase;color:#4fbe8b;font-weight:700}
.live i{width:7px;height:7px;border-radius:50%;background:#4fbe8b;animation:bl 2s infinite;font-style:normal}
@keyframes bl{50%{opacity:.3}}
.today h3{margin:0 0 8px;font-size:24px;font-weight:730;letter-spacing:-.022em}
.today .meta{font-size:13px;color:#8f9db0;margin-bottom:16px}
.today p{margin:0 0 12px;color:#c3cdd9;font-size:15.5px;max-width:74ch}
.tk-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.tk{padding:4px 10px;border-radius:3px;background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);font-size:12.5px;
  font-family:ui-monospace,Menlo,Consolas,monospace}
.tk .up{color:#4fbe8b;font-weight:700}.tk .dn{color:#ff6055;font-weight:700}
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:4px;
  font-size:14px;font-weight:650;text-decoration:none;border:1px solid transparent;cursor:pointer;
  font-family:inherit;transition:background .13s ease}
.btn-p{background:var(--brand);color:#fff}.btn-p:hover{background:var(--brand-hi)}
.btn-g{border-color:var(--line);color:var(--ink);background:transparent}
.btn-g:hover{background:var(--ground-2)}
.btn-ghost{border-color:rgba(255,255,255,.3);color:#fff;background:rgba(255,255,255,.06)}
.btn-ghost:hover{background:rgba(255,255,255,.14)}
.btn-sm{padding:6px 12px;font-size:13px}
.btn:focus-visible{outline:2px solid var(--gold-hi);outline-offset:2px}

/* today's queue */
.queue{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1px;background:var(--line)}
.q{background:var(--ground);padding:15px 16px;display:flex;flex-direction:column;gap:6px;
  text-decoration:none;border-top:3px solid transparent;transition:border-color .14s ease}
.q:hover{border-top-color:var(--brand);background:var(--ground-2)}
.q .t{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);font-weight:700}
.q .n{font-size:15px;font-weight:680;letter-spacing:-.012em}
.q .s{font-size:12.5px;color:var(--ink-3)}
.q .badge-new{font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:800;
  color:#fff;background:var(--brand);padding:2px 6px;border-radius:2px;align-self:flex-start}
.q.locked{opacity:.55}
.q.locked .s{color:var(--warn)}

/* trade ideas table */
table{width:100%;border-collapse:collapse;font-size:14px}
th{text-align:left;padding:9px 18px;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-3);font-weight:650;background:var(--ground-2);border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:11px 18px;border-bottom:1px solid var(--line-soft)}
tr:last-child td{border-bottom:0}
tbody tr:hover{background:var(--ground-2)}
.sym{font-family:ui-monospace,Menlo,Consolas,monospace;font-weight:700}
.pill{display:inline-block;padding:2px 8px;border-radius:3px;font-size:10.5px;font-weight:700;
  letter-spacing:.05em;text-transform:uppercase}
.p-long{background:var(--ok-bg);color:var(--ok)}
.p-short{background:var(--dn-bg);color:var(--dn)}
.num{font-family:ui-monospace,Menlo,Consolas,monospace;font-variant-numeric:tabular-nums;white-space:nowrap}
.pos{color:var(--ok);font-weight:650}.neg{color:var(--dn);font-weight:650}

/* sentiment meters */
.meters{display:flex;flex-direction:column;gap:13px}
.meter .mh{display:flex;justify-content:space-between;font-size:13.5px;margin-bottom:5px}
.meter .mv{font-family:ui-monospace,Menlo,Consolas,monospace;font-weight:700}
.track{height:7px;border-radius:4px;background:var(--ground-3);position:relative;overflow:hidden}
.fill{position:absolute;top:0;bottom:0;left:0;border-radius:4px}
.zone{position:absolute;top:-3px;bottom:-3px;width:1px;background:var(--ink-3);opacity:.5}
.mnote{font-size:11.5px;color:var(--ink-3);margin-top:4px}

/* right rail */
.rail .card{margin-bottom:18px}
.acct{display:flex;flex-direction:column;gap:10px;font-size:13.5px}
.arow{display:flex;justify-content:space-between;gap:12px;padding-bottom:9px;border-bottom:1px solid var(--line-soft)}
.arow:last-child{border-bottom:0;padding-bottom:0}
.arow .k{color:var(--ink-3)}
.tag{display:inline-block;padding:3px 8px;border-radius:3px;font-size:11px;font-weight:700;
  letter-spacing:.05em;text-transform:uppercase;background:var(--ok-bg);color:var(--ok)}
.upsell{background:linear-gradient(160deg,var(--navy) 0%,var(--navy-2) 100%);color:#fff;border:0}
.upsell .cb{padding:20px}
.upsell h3{margin:0 0 8px;font-size:17px;font-weight:720;letter-spacing:-.016em}
.upsell p{margin:0 0 15px;font-size:13.5px;color:#b9c3d1}
.upsell .k{font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--gold-hi);
  font-weight:750;margin-bottom:9px}
.links{display:flex;flex-direction:column}
.links a{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:11px 0;
  border-bottom:1px solid var(--line-soft);text-decoration:none;font-size:14px}
.links a:last-child{border-bottom:0}
.links a:hover{color:var(--brand-hi)}
.links .c{font-size:12px;color:var(--ink-3);font-family:ui-monospace,Menlo,Consolas,monospace}
.note-box{border-left:3px solid var(--gold-hi);background:var(--ground-2);padding:12px 15px;
  font-size:13px;color:var(--ink-2);border-radius:0 4px 4px 0}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
