/* Profit News — base do painel. Tokens do design system "Profit News" (bg, bg-2, ink, news) + derivados.
 * Direção editorial: um jornal do mercado que roda a noite toda. Títulos em serifa de jornal (Newsreader),
 * interface em IBM Plex Sans, horários e números em IBM Plex Mono. Âmbar é a marca e o estado "volatilidade";
 * verde e vermelho, discretos, só para direção (alta/queda). Tema escuro, o padrão da família. */
:root {
  --bg: #060A0F;            /* design system: bg */
  --bg-2: #090C11;          /* design system: bg-2 */
  --layer-1: #0D1117;
  --layer-2: #121821;
  --layer-3: #1A212D;
  --hair: rgba(244, 240, 248, .07);
  --line: rgba(244, 240, 248, .13);
  --ink: #F4F0F8;           /* design system: ink */
  --text-2: #ABA7B8;
  --text-3: #8F8B9D;
  --news: #FFB020;          /* design system: news (âmbar) */
  --news-ink: #1A1100;      /* texto sobre âmbar */
  --news-soft: rgba(255, 176, 32, .13);
  --alta: #4CC38A;
  --baixa: #F2727F;
  --r-sm: 4px; --r-md: 6px; --r-lg: 10px;
  --ease: cubic-bezier(.2, .8, .2, 1);
  --dur: .18s;
  --ring: 0 0 0 3px rgba(255, 176, 32, .4);
  --font: 'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --serif: 'Newsreader', 'Iowan Old Style', Georgia, 'Times New Roman', serif;
  --mono: 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --wordmark: 'Nunito Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --aviso-h: 40px;
}
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--bg); color: var(--ink); font-family: var(--font); font-size: 15px; line-height: 1.5; -webkit-font-smoothing: antialiased; }
body { padding-bottom: calc(var(--aviso-h) + env(safe-area-inset-bottom)); }
:focus-visible { outline: 2px solid var(--news); outline-offset: 2px; border-radius: 4px; }
a { color: var(--news); }
button { font: inherit; cursor: pointer; color: inherit; }
[hidden] { display: none !important; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.sr-focus:focus { position: fixed; left: 12px; top: 12px; width: auto; height: auto; clip: auto; z-index: 99; background: var(--news); color: var(--news-ink); padding: 8px 12px; border-radius: var(--r-sm); }
.spacer { flex: 1; }
.hint { color: var(--text-2); font-size: 13.5px; margin: 12px 0 0; }

/* --- marca: símbolo plano + wordmark (Nunito Sans 800, "Profit" ink + "News" âmbar, sem espaço) --- */
.marca { display: inline-flex; align-items: center; gap: 9px; text-decoration: none; color: var(--ink); }
.wm { font-family: var(--wordmark); font-weight: 800; font-size: 21px; letter-spacing: -.03em; line-height: 1; color: var(--ink); }
.wm b { color: var(--news); font-weight: 800; }
.wm-sm { font-size: 18px; }

/* --- botões --- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 18px; border-radius: var(--r-md); border: 1px solid transparent; font-weight: 600; text-decoration: none; transition: background var(--dur) var(--ease), border-color var(--dur) var(--ease), transform var(--dur) var(--ease); }
.btn:active { transform: translateY(1px); }
.btn-primary { background: var(--news); color: var(--news-ink); }
.btn-primary:hover { background: #FFBE47; }
.btn-primary:disabled { opacity: .55; cursor: default; }
.btn-ghost { background: transparent; border-color: var(--line); color: var(--ink); }
.btn-ghost:hover { background: var(--layer-2); }
.btn-sm { min-height: 36px; padding: 0 12px; font-size: 14px; }
.link-btn { background: none; border: 0; padding: 0; color: var(--news); text-decoration: underline; text-underline-offset: 3px; }

/* --- abertura --- */
.splash { position: fixed; inset: 0; display: grid; place-items: center; background: var(--bg); z-index: 50; }
.splash img { animation: respira 1.6s var(--ease) infinite alternate; }
@keyframes respira { from { opacity: .55; transform: scale(.96); } to { opacity: 1; transform: scale(1); } }

/* --- login, sem acesso --- */
.auth { min-height: calc(100vh - var(--aviso-h)); display: grid; place-items: center; padding: 24px 16px; }
.auth-card { width: 100%; max-width: 400px; background: var(--layer-1); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 28px 24px; }
.auth-card .marca { margin-bottom: 18px; }
.auth-card h1 { font-family: var(--serif); font-weight: 600; font-size: 28px; line-height: 1.15; margin: 0 0 8px; letter-spacing: -.01em; }
.auth-card .lead { color: var(--text-2); margin: 0 0 18px; }
.auth-card label { display: block; font-size: 13.5px; font-weight: 500; color: var(--text-2); margin: 14px 0 6px; }
.auth-card input[type=email], .auth-card input[type=password], .auth-card input[type=text], .lk-form input[type=text], .lk-form input[type=password] {
  width: 100%; min-height: 46px; padding: 0 14px; background: var(--bg-2); color: var(--ink); border: 1px solid var(--line); border-radius: var(--r-md); font: inherit; }
.auth-card input:focus, .lk-form input:focus { outline: none; border-color: var(--news); box-shadow: var(--ring); }
.auth-card .btn-primary { width: 100%; margin-top: 20px; }
.auth-alt { margin: 16px 0 0; font-size: 14px; }
.msg { margin-top: 14px; padding: 10px 12px; border-radius: var(--r-sm); background: rgba(242, 114, 127, .12); color: #FFC2C8; font-size: 14px; }
.msg.ok { background: var(--news-soft); color: var(--ink); }
.venda-mini .btn-primary { width: 100%; margin-top: 4px; }

/* --- cabeçalho do feed --- */
.top { position: sticky; top: 0; z-index: 20; background: rgba(6, 10, 15, .92); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-bottom: 1px solid var(--hair); }
.top-in { position: relative; max-width: 760px; margin: 0 auto; padding: 10px 16px; display: flex; align-items: center; gap: 12px; }
.vivo { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--text-2); padding: 3px 9px; border-radius: 999px; border: 1px solid var(--line); }
.vivo i { width: 7px; height: 7px; border-radius: 50%; background: var(--text-3); }
.vivo[data-estado=on] i, .vivo[data-estado=poll] i { background: var(--news); box-shadow: 0 0 0 0 rgba(255, 176, 32, .6); }
.vivo[data-estado=on] { color: var(--ink); }
.vivo.is-pisca i { animation: pulso 1.2s var(--ease) 3; }
@keyframes pulso { 0% { box-shadow: 0 0 0 0 rgba(255, 176, 32, .65); } 100% { box-shadow: 0 0 0 9px rgba(255, 176, 32, 0); } }
.conta-btn { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--line); background: var(--layer-1); display: grid; place-items: center; }
.conta-btn svg { width: 20px; height: 20px; }
.conta-menu { position: absolute; right: 16px; top: 56px; width: min(300px, calc(100vw - 32px)); background: var(--layer-2); border: 1px solid var(--line); border-radius: var(--r-md); padding: 14px; display: grid; gap: 10px; box-shadow: 0 18px 44px -18px rgba(0, 0, 0, .8); }
.conta-email { margin: 0; font-size: 13.5px; color: var(--text-2); overflow-wrap: anywhere; }
.lk-cfg-line { margin: 0 0 8px; font-size: 14px; }

/* --- aviso de risco: fixo no rodapé de todas as telas --- */
.aviso-risco { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; min-height: var(--aviso-h); padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); background: var(--bg-2); border-top: 1px solid var(--hair); color: var(--text-2); font-size: 12.5px; line-height: 1.4; text-align: center; }

/* --- vínculo com a corretora --- */
.lk-gate { position: fixed; inset: 0; z-index: 40; background: rgba(6, 10, 15, .94); overflow-y: auto; padding: 24px 16px calc(var(--aviso-h) + 24px); display: grid; place-items: start center; }
body.lk-open { overflow: hidden; }
.lk-card { width: 100%; max-width: 760px; background: var(--layer-1); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 24px; }
.lk-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.lk-marcas { display: inline-flex; align-items: center; gap: 12px; }
.lk-sep { width: 1px; height: 22px; background: var(--line); }
.lk-hz { height: 18px; width: auto; }
.lk-chip { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--news); background: var(--news-soft); padding: 4px 10px; border-radius: 999px; }
.lk-chip i { width: 6px; height: 6px; border-radius: 50%; background: var(--news); }
.lk-card h1 { font-family: var(--serif); font-weight: 600; font-size: 28px; line-height: 1.15; margin: 0 0 8px; }
.lk-lead, .lk-reauth { color: var(--text-2); margin: 0 0 18px; }
.lk-reauth { color: var(--ink); background: var(--news-soft); padding: 10px 12px; border-radius: var(--r-sm); }
.lk-cols { display: grid; gap: 20px; }
@media (min-width: 720px) { .lk-cols { grid-template-columns: 1fr 1fr; } }
.lk-steps ol { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 12px; }
.lk-steps li { display: flex; gap: 10px; color: var(--text-2); font-size: 14.5px; }
.lk-n { flex: none; width: 24px; height: 24px; border-radius: 50%; background: var(--layer-3); color: var(--ink); display: grid; place-items: center; font-size: 13px; font-weight: 600; }
.lk-create { font-weight: 600; }
.lk-form label { display: block; font-size: 13.5px; font-weight: 500; color: var(--text-2); margin: 0 0 6px; }
.lk-form input + label, .lk-pass + label { margin-top: 14px; }
.lk-pass { position: relative; }
.lk-pass input { padding-right: 84px; }
.lk-show { position: absolute; right: 6px; top: 6px; height: 34px; padding: 0 10px; border: 0; border-radius: var(--r-sm); background: var(--layer-3); font-size: 13px; }
.lk-consent { display: flex !important; gap: 10px; align-items: flex-start; margin: 16px 0 0 !important; color: var(--text-2); font-size: 13.5px; }
.lk-consent input { margin-top: 3px; width: 18px; height: 18px; accent-color: var(--news); flex: none; }
.lk-form .btn-primary { width: 100%; margin-top: 18px; }
.lk-form .link-btn { display: block; margin: 14px auto 0; }