
/* SSS InvestLabs — híbrido: densidade de terminal + painéis de vidro calmos + grade bento.
   Dourado = marca (Silveira); ciano = dado; verde/coral = alta/queda. Escuro por padrão, claro se o sistema pedir. */
:root{--bg:#06080c;--bg2:#0b0f16;--panel:#0e131c;--panel2:#141b27;--fg:#e9edf3;--muted:#8792a5;--line:#1b2433;--line2:#263247;
 --up:#34e0a1;--down:#ff6b7a;--acc:#2ad4ff;--acc2:#1f5fff;--gold:#e9b949;--gold2:#ffd98a;--chip:#151d2a;--warn:#f5a524;
 --glow:0 0 0 1px rgba(233,185,73,.08),0 18px 40px rgba(0,0,0,.35);
 --sans:"IBM Plex Sans",system-ui,sans-serif;--mono:"IBM Plex Mono",ui-monospace,Consolas,monospace;--disp:"Unbounded","IBM Plex Sans",sans-serif;color-scheme:dark}
@media (prefers-color-scheme:light){:root{--bg:#f3f1ec;--bg2:#ebe8e1;--panel:#fffdf9;--panel2:#f7f4ee;--fg:#14171d;--muted:#5e6573;--line:#e2ddd2;--line2:#d4cdbf;
 --up:#0b9a63;--down:#d43a4c;--acc:#0b7fc9;--acc2:#1f5fff;--gold:#a87b14;--gold2:#7d5a0b;--chip:#efebe3;--glow:0 1px 0 rgba(0,0,0,.03),0 10px 30px rgba(60,40,0,.08);color-scheme:light}}
*{box-sizing:border-box} html,body{margin:0}
body{background:radial-gradient(900px 420px at 0% -8%,rgba(31,95,255,.14),transparent 60%),radial-gradient(900px 500px at 100% 0%,rgba(42,212,255,.08),transparent 60%),var(--bg);color:var(--fg);font:14px/1.5 var(--sans);font-variant-numeric:tabular-nums}
.w{max-width:1440px;margin:auto;padding:16px max(16px,env(safe-area-inset-right)) 32px max(16px,env(safe-area-inset-left));display:flex;flex-direction:column;gap:14px}
h1{margin:0;font-size:18px;font-weight:700;letter-spacing:.01em} h2{font-size:14px;font-weight:600;margin:0 0 10px;letter-spacing:.01em}
.sub{color:var(--muted);font-size:12px} .pad{font-size:12px;color:var(--muted);margin-bottom:8px;max-width:110ch}
td.n,th.n,.n{text-align:right;font-family:var(--mono)}
/* ---------- topo fixo ---------- */
.topo{position:sticky;top:0;z-index:8;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.marca{display:flex;align-items:center;gap:12px;padding:7px max(16px,env(safe-area-inset-left));max-width:1440px;margin:auto;flex-wrap:wrap}
.logo{width:40px;height:40px;display:block}
h1.wm{font:800 19px/1 "Exo 2",var(--sans);letter-spacing:.01em} h1.wm em{font-style:normal;color:var(--acc)}
.slogan{font:500 11px "Exo 2",var(--sans);letter-spacing:.18em;color:var(--muted);text-transform:uppercase}
.assina{font:500 10px "Exo 2",var(--sans);letter-spacing:.2em;color:var(--gold);text-transform:uppercase}
.banner{height:190px;border-radius:16px;background:#050a14 url(/marca/capa.jpg) center 45%/cover no-repeat;border:1px solid var(--line);box-shadow:var(--glow);margin-bottom:14px}
@media (max-width:700px){.banner{height:90px}}
.vivo{display:inline-flex;align-items:center;gap:6px;font:600 11px var(--mono);letter-spacing:.08em;color:var(--up);border:1px solid color-mix(in srgb,var(--up) 40%,transparent);padding:2px 8px;border-radius:999px}
.vivo i{width:7px;height:7px;border-radius:50%;background:var(--up);box-shadow:0 0 0 0 var(--up);animation:pulso 1.6s infinite}
@keyframes pulso{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--up) 70%,transparent)}100%{box-shadow:0 0 0 8px transparent}}
#status{margin-left:auto;font-family:var(--mono);font-size:11px}
/* ---------- letreiro ---------- */
.faixa{display:flex;align-items:stretch;border-top:1px solid var(--line);overflow:hidden;height:26px}
.faixa .rot{flex:none;display:flex;align-items:center;padding:0 12px;font:600 10px var(--mono);letter-spacing:.12em;color:#06121c;min-width:150px;justify-content:center}
.f1 .rot{background:var(--acc)} .f2 .rot{background:var(--acc2);color:#fff} .f3 .rot{background:linear-gradient(90deg,var(--acc2),var(--acc));color:#fff}
.trilho{flex:1;overflow:hidden;position:relative;mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
.corre{display:inline-flex;white-space:nowrap;height:100%;align-items:center;will-change:transform;animation:corre linear infinite}
.f1 .corre{animation-duration:var(--d1,45s)} .f2 .corre{animation-duration:var(--d2,80s)} .f3 .corre{animation-duration:var(--d3,130s)}
.faixa:hover .corre{animation-play-state:paused}
@keyframes corre{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.tk{display:inline-flex;align-items:center;gap:6px;padding:0 16px;font:12px var(--mono);border-right:1px solid var(--line);cursor:default}
.tk b{font-family:var(--sans);font-weight:600} .tk .t{color:var(--muted);font-size:11px} .tk[data-par]{cursor:pointer}
@media (prefers-reduced-motion:reduce){.corre{animation:none}.trilho{overflow-x:auto}}
/* ---------- abas ---------- */
.tabs{display:flex;gap:4px;overflow-x:auto;padding:5px max(16px,env(safe-area-inset-left));max-width:1440px;margin:auto;border-top:1px solid var(--line);scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
@media (max-height:700px){.marca .sub:not(#status){display:none} .faixa{height:22px} .tk{font-size:11px}}
.tab{flex:none;border:1px solid transparent;background:transparent;color:var(--muted);border-radius:8px;padding:5px 11px;cursor:pointer;font:500 13px var(--sans)}
.tab:hover{color:var(--fg);background:var(--panel2)} .tab.on{background:var(--panel2);border-color:var(--line2);color:var(--fg);box-shadow:inset 0 -2px 0 var(--acc)}
.tab:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
/* ---------- cartões e tabelas ---------- */
.card{position:relative;background:linear-gradient(180deg,color-mix(in srgb,var(--panel) 92%,transparent),color-mix(in srgb,var(--bg2) 92%,transparent));
 border:1px solid var(--line);border-radius:16px;padding:16px;min-width:0;box-shadow:var(--glow);backdrop-filter:blur(6px)}
.card::before{content:"";position:absolute;inset:0;border-radius:16px;padding:1px;pointer-events:none;
 background:linear-gradient(135deg,rgba(31,95,255,.35),transparent 35%,transparent 65%,rgba(42,212,255,.25));
 -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
table{width:100%;border-collapse:collapse}
td,th{padding:6px 8px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}
th{color:var(--muted);font-weight:500;font-size:11px;letter-spacing:.04em;text-transform:uppercase;position:sticky;top:var(--topo-h,0px);background:var(--panel);z-index:2;box-shadow:0 1px 0 var(--line)}
.scroll th{top:0}
tbody tr:hover td,table tr:hover td{background:color-mix(in srgb,var(--acc) 6%,transparent)}
th.sort{cursor:pointer} th.sort:hover{color:var(--fg)} th.ativo{color:var(--acc)}
.up{color:var(--up)} .down{color:var(--down)} .scroll{overflow:auto;max-height:560px;border-radius:8px}
.scroll.livre{overflow:visible;max-height:none}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:14px}
.chip{display:inline-block;background:var(--chip);border:1px solid var(--line);border-radius:6px;padding:0 6px;margin-right:3px;font:11px var(--mono)}
.amp td,.amp th{text-align:center;font-family:var(--mono)} .amp td:first-child{text-align:left;font-family:var(--sans)}
.barra{height:6px;border-radius:3px;background:color-mix(in srgb,var(--down) 75%,transparent);overflow:hidden}
.barra>i{display:block;height:100%;background:var(--up)}
.ctl{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.ctl .tab{border-color:var(--line)}
input[type=search],input[type=number],input[type=date],input:not([type]),select{font:13px var(--sans);padding:6px 9px;border:1px solid var(--line);border-radius:8px;background:var(--bg2);color:var(--fg)}
.aviso{color:var(--muted);font-size:12px;border-top:1px solid var(--line);padding-top:10px}
.mosaico{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:8px;margin-top:8px}
.ms{border-radius:10px;padding:8px;display:flex;flex-direction:column;gap:1px;color:#fff;font-size:12px;text-shadow:0 1px 1px rgba(0,0,0,.35);cursor:pointer;transition:transform .15s}
.ms:hover{transform:translateY(-2px)} .ms span,.ms small{font-family:var(--mono)}
.maisinfo{margin-top:4px;align-self:flex-start;border:1px solid rgba(255,255,255,.7);background:rgba(0,0,0,.2);color:#fff;border-radius:6px;font:11px var(--sans);padding:1px 7px;cursor:pointer}
.ms b{font-size:13px} .ms .msp{font-weight:600} .ms small{opacity:.85}
.parlink{color:inherit;text-decoration:underline dotted;text-underline-offset:3px;cursor:pointer}
#modal{position:fixed;inset:0;background:rgba(3,6,12,.6);backdrop-filter:blur(3px);display:flex;align-items:flex-start;justify-content:center;overflow:auto;padding:24px 12px;z-index:20}
#modal[hidden]{display:none} .mbox{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px;max-width:1040px;width:100%;position:relative;box-shadow:0 20px 60px rgba(0,0,0,.45)}
#fechar{position:absolute;right:12px;top:12px;border-color:var(--line)}
.kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin:10px 0}
.kv div{background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:9px 10px;font-family:var(--mono)} .kv span{display:block;color:var(--muted);font:11px var(--sans);margin-bottom:2px}
.graf{position:relative;height:340px;margin-top:8px} .graf.baixo{height:260px}
.ii{display:inline-grid;place-items:center;width:14px;height:14px;margin-left:4px;border-radius:50%;border:1px solid var(--muted);color:var(--muted);font:600 9px var(--sans);cursor:help;vertical-align:1px;text-transform:none;letter-spacing:0}
.ii:hover{border-color:var(--acc);color:var(--acc)}
#dica{position:fixed;z-index:30;max-width:340px;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:10px 12px;box-shadow:0 12px 30px rgba(0,0,0,.4);font:12.5px/1.45 var(--sans);color:var(--fg);pointer-events:none;text-transform:none;letter-spacing:0;white-space:normal}
#dica b{display:block;margin-bottom:4px;color:var(--acc)} #dica .uso{display:block;margin-top:6px;color:var(--muted)}
/* ---------- Visão geral (bento) ---------- */
.bento{display:grid;grid-template-columns:repeat(12,1fr);gap:14px}
.bento>.card{grid-column:span 4} .bento>.w8{grid-column:span 8} .bento>.w6{grid-column:span 6} .bento>.w3{grid-column:span 3} .bento>.w12{grid-column:span 12}
@media (max-width:1100px){.bento>.card,.bento>.w8,.bento>.w6,.bento>.w3{grid-column:span 6}}
@media (max-width:700px){.bento>.card,.bento>.w8,.bento>.w6,.bento>.w3{grid-column:span 12}}
.eb{font:600 10px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.big{font:500 34px/1.05 var(--disp);letter-spacing:-.01em} .mid{font:500 22px/1.1 var(--disp)}
.linha{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:5px 0;border-bottom:1px dashed var(--line);font-family:var(--mono);font-size:13px}
.linha:last-child{border-bottom:0} .linha b{font-family:var(--sans);font-weight:600}
.spark{height:70px;margin-top:8px}
.termo{margin-top:10px} .termo-escala{position:relative;height:10px;border-radius:5px;background:linear-gradient(90deg,#3b82f6,#64748b 50%,#f97316);margin:6px 0 8px}
.termo-escala i{position:absolute;top:-3px;width:1px;height:16px;background:var(--muted)} .termo-escala b{position:absolute;top:-5px;width:4px;height:20px;margin-left:-2px;border-radius:2px;background:var(--fg);box-shadow:0 0 0 2px var(--bg)}
.termo-txt{font-size:13px} .hm{display:inline-block;font:700 11px var(--mono);letter-spacing:.12em;padding:2px 8px;border-radius:6px;margin-right:6px;color:#fff}
.hm-frio{background:#3b82f6} .hm-morno{background:#64748b} .hm-quente{background:#f97316}
.usd{color:var(--muted);font-size:.9em}
@media (prefers-reduced-motion:no-preference){.pisca-up{animation:pisca-up 1.1s ease-in-out infinite}.pisca-down{animation:pisca-down 1.1s ease-in-out infinite}}
@keyframes pisca-up{0%,100%{background:transparent}50%{background:color-mix(in srgb,var(--up) 35%,transparent)}}
@keyframes pisca-down{0%,100%{background:transparent}50%{background:color-mix(in srgb,var(--down) 35%,transparent)}}
.amp-n{cursor:pointer;text-decoration:underline dotted;text-underline-offset:3px} .amp-n:hover{filter:brightness(1.3)}
#ampmodal{position:fixed;inset:0;background:rgba(3,6,12,.6);backdrop-filter:blur(3px);display:flex;align-items:flex-start;justify-content:center;overflow:auto;padding:24px 12px;z-index:21}
#ampmodal[hidden]{display:none} #ampfechar{position:absolute;right:12px;top:12px;border-color:var(--line)}
.pag{display:flex;gap:6px;align-items:center;justify-content:flex-end;margin-top:10px}
.leitura{margin-top:8px;padding:8px 10px;border-radius:10px;background:var(--bg2);border:1px dashed var(--line2);color:var(--muted);font-size:13px}
.dst-at{box-shadow:var(--glow),inset 3px 0 0 var(--warn)}
tr.sel td{background:color-mix(in srgb,var(--acc) 12%,transparent)}
.explica{margin:0 0 12px;border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--panel) 70%,transparent)}
.explica summary{cursor:pointer;padding:9px 14px;font:600 13px var(--sans);color:var(--acc);list-style:none} .explica summary::-webkit-details-marker{display:none}
.explica summary::before{content:"ⓘ  "} .explica[open] summary{border-bottom:1px solid var(--line)}
.explica .corpo{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:12px;padding:12px 14px;font-size:13px}
.explica .corpo b{display:block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:3px}
.grupo{display:inline-flex;gap:4px;margin-right:6px}
.vf{display:inline-block;border-radius:6px;padding:0 6px;font:12px var(--mono);color:#fff}
.vf-alta{background:#1f9d55} .vf-media{background:#d98500} .vf-baixa{background:#d64545}

.explica .saiba{margin-left:10px;font-weight:500;font-size:12px;color:var(--acc)}

tr.clicavel{cursor:pointer}

/* conta e fundador */
.tab.conta{margin-left:8px;border-color:var(--acc);color:var(--acc)} .fund{color:var(--gold);font-weight:600}
#conta-modal{position:fixed;inset:0;background:rgba(3,6,12,.6);backdrop-filter:blur(3px);display:flex;align-items:flex-start;justify-content:center;overflow:auto;padding:40px 12px;z-index:25}
#conta-modal[hidden]{display:none} #conta-fechar{position:absolute;right:12px;top:12px;border-color:var(--line)}
.fund-box{border:1px solid var(--gold);border-radius:10px;padding:10px 12px;background:color-mix(in srgb,var(--gold) 8%,transparent)}
.termos{display:block;margin:12px 0;font-size:13px} .termos input{margin-right:6px}
#conta-corpo input[type=email],#conta-corpo input[type=password]{flex:1;min-width:180px}

.beneficios{margin:8px 0 4px;padding-left:18px;font-size:13.5px} .beneficios li{margin:3px 0}
