/* CenterDrop News: GTA VI · "Edição Vespertina" v2. Mobile first. */
:root{
  --bg:#0C0916; --surface:#151022; --surface-2:#1D1630; --line:#2E2548;
  --ink:#F4EFFF; --ink-2:#BDB2DC; --ink-3:#9489B8;
  --pink:#FF4D94; --orange:#FF9A3C; --gold:#FFC46B; --violet:#9B6BFF; --cyan:#3DE0D0;
  --ok:#5CF2C0; --warn:#FFC46B; --danger:#FF5E5B;
  --sunset:linear-gradient(90deg,#9B6BFF,#FF4D94 50%,#FF9A3C);

  --f-head:'Bricolage Grotesque','Inter',system-ui,sans-serif;
  --f-ui:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --f-read:'Source Serif 4',Georgia,serif;

  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px; --s8:72px;
  --r1:4px; --r2:8px; --rp:999px;
  --gutter:16px; --maxw:1200px; --readw:68ch; --header-h:56px; --ad-safe:0px;
  --ease:cubic-bezier(.2,.7,.2,1);
}
@media (min-width:768px){ :root{ --gutter:24px; } }
@media (min-width:1100px){ :root{ --gutter:32px; } }

/* ---------- Base ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-padding-top:calc(var(--header-h) + 16px); }
body{ margin:0; background:var(--bg); color:var(--ink); font-family:var(--f-ui); font-size:1rem; line-height:1.55; overflow-x:clip; -webkit-font-smoothing:antialiased; }
@media (prefers-reduced-motion:no-preference){ html{ scroll-behavior:smooth; } }
img,svg{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4,p,ul,ol,dl,dd,figure,blockquote{ margin:0; }
ul,ol{ padding:0; list-style:none; }
button,input{ font:inherit; color:inherit; }
button{ cursor:pointer; background:none; border:0; padding:0; }
:focus-visible{ outline:3px solid var(--cyan); outline-offset:3px; border-radius:var(--r1); }
[hidden]{ display:none !important; }
.sr-only{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.skip-link{ position:absolute; left:var(--gutter); top:-80px; z-index:200; background:var(--pink); color:#1A0B2E; padding:var(--s3) var(--s4); border-radius:var(--r2); font-weight:700; }
.skip-link:focus{ top:var(--s3); }
.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter); }
h1,h2,h3{ overflow-wrap:anywhere; }

/* ---------- Texto utilitário ---------- */
.kicker{ font:700 .6875rem/1.2 var(--f-ui); letter-spacing:.12em; text-transform:uppercase; color:var(--pink); display:inline-block; }
.meta{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--s1) var(--s3); font-size:.8125rem; color:var(--ink-3); }
.meta > * + :not(.badge)::before{ content:"·"; margin-right:var(--s3); color:var(--line); }
.meta time,.meta .reading{ color:var(--ink-2); }
.badge{ display:inline-flex; align-items:center; gap:6px; font:600 .6875rem/1 var(--f-ui); letter-spacing:.04em; text-transform:uppercase; padding:4px 8px; border-radius:var(--rp); border:1px solid currentColor; }
.badge::before{ content:""; width:6px; height:6px; border-radius:50%; background:currentColor; }
.badge--confirmado{ color:var(--ok); }
.badge--rumor{ color:var(--warn); }

.btn{ display:inline-flex; align-items:center; justify-content:center; gap:var(--s2); min-height:44px; padding:0 var(--s5); border-radius:var(--rp); font:600 .9375rem var(--f-ui); background:var(--pink); color:#1A0B2E; border:1px solid var(--pink); transition:filter .2s,transform .2s var(--ease); }
.btn:hover{ filter:brightness(1.1); }
.btn--ghost{ background:transparent; color:var(--ink); border-color:var(--line); }
.btn--ghost:hover{ background:var(--surface-2); border-color:var(--ink-3); filter:none; }
.icon-btn{ width:44px; height:44px; display:inline-grid; place-items:center; border-radius:var(--rp); color:var(--ink-2); }
.icon-btn:hover{ background:var(--surface-2); color:var(--ink); }

/* ---------- Topbar + Header ---------- */
.topbar{ background:var(--surface); border-bottom:1px solid var(--line); font-size:.75rem; color:var(--ink-3); }
.topbar .wrap{ display:flex; justify-content:space-between; gap:var(--s3); min-height:32px; align-items:center; }
.site-header{ position:sticky; top:0; z-index:80; background:rgba(12,9,22,.92); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
.site-header::after{ content:""; position:absolute; left:0; right:0; bottom:-1px; height:2px; background:var(--sunset); opacity:.85; }
.site-header__in{ display:flex; align-items:center; gap:var(--s3); height:var(--header-h); }
.brand{ display:flex; align-items:baseline; gap:6px; font-family:var(--f-head); font-weight:800; font-size:1.25rem; letter-spacing:-.01em; margin-right:auto; }
.brand b{ color:var(--pink); font-family:var(--f-ui); font-size:.6875rem; letter-spacing:.14em; text-transform:uppercase; font-weight:700; }
.nav{ display:none; gap:var(--s5); }
.nav__link{ font:600 .875rem var(--f-ui); color:var(--ink-2); padding:var(--s2) 0; border-bottom:2px solid transparent; }
.nav__link:hover,.nav__link[aria-current="page"]{ color:var(--ink); border-color:var(--pink); }
@media (min-width:900px){ .nav{ display:flex; } .brand{ margin-right:var(--s5); } .site-header__in{ gap:var(--s5); } .site-header__in .auth{ margin-left:auto; } }
.auth{ display:flex; align-items:center; gap:var(--s2); }
.auth .btn{ min-height:36px; padding:0 var(--s4); font-size:.875rem; }
.avatar{ width:32px; height:32px; border-radius:50%; background:var(--sunset); color:#1A0B2E; font:700 .75rem/32px var(--f-ui); text-align:center; flex:none; overflow:hidden; }
.avatar--lg{ width:40px; height:40px; line-height:40px; font-size:.875rem; }
.catbar{ border-bottom:1px solid var(--line); background:var(--bg); }
.catbar .wrap{ display:flex; gap:var(--s5); overflow-x:auto; scrollbar-width:none; }
.catbar .wrap::-webkit-scrollbar{ display:none; }
.catbar .nav__link{ white-space:nowrap; padding:var(--s3) 0; }
@media (min-width:900px){ .catbar{ display:none; } }

/* ---------- Cover (capas geradas) ---------- */
.cover{ --c1:#3A1D8F; --c2:#9B6BFF; --ratio:3/2; position:relative; aspect-ratio:var(--ratio); overflow:hidden; border-radius:var(--r2); color:#fff; isolation:isolate; background:linear-gradient(135deg,var(--c1),var(--c2)); }
.cover::before{ content:""; position:absolute; inset:0; z-index:-1; opacity:.28; background:var(--pat,none); }
.cover::after{ content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(12,9,22,0) 40%,rgba(12,9,22,.55)); }
.cover__icon{ position:absolute; right:8%; bottom:10%; width:42%; height:auto; max-height:70%; aspect-ratio:1; stroke:currentColor; fill:none; stroke-width:1.2; opacity:.28; }
.cover__label{ position:absolute; left:10px; top:8px; font:700 .625rem/1 var(--f-ui); letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.92); text-shadow:0 1px 2px rgba(0,0,0,.4); }
.cover--lead{ --ratio:3/2; border-radius:var(--r2); }
.cover--sm{ --ratio:3/2; width:112px; flex:none; }
.cover--sm .cover__label,.cover--tiny .cover__label{ display:none; }
.cover--tiny{ --ratio:1/1; width:56px; flex:none; border-radius:var(--r1); }
.cover--wide{ --ratio:16/9; border-radius:var(--r2); }
@media (min-width:640px){ .cover--sm{ width:168px; } .cover--wide{ --ratio:21/9; } .cover--lead{ --ratio:16/10; } }
[data-cat="Lançamento"]{ --c1:#FF4D94; --c2:#FF9A3C; --pat:repeating-conic-gradient(from 0deg at 80% 110%,#fff 0 4deg,transparent 4deg 12deg); }
[data-cat="Trailer"]{ --c1:#9B6BFF; --c2:#FF4D94; --pat:repeating-linear-gradient(0deg,#fff 0 1px,transparent 1px 6px); }
[data-cat="Gameplay"]{ --c1:#3A1D8F; --c2:#9B6BFF; --pat:linear-gradient(#fff 1px,transparent 1px) 0 0/22px 22px,linear-gradient(90deg,#fff 1px,transparent 1px) 0 0/22px 22px; }
[data-cat="Plataformas"]{ --c1:#1F2A6B; --c2:#FF4D94; --pat:radial-gradient(#fff 1.2px,transparent 1.6px) 0 0/14px 14px; }
[data-cat="Rockstar"]{ --c1:#7A1F5C; --c2:#FF9A3C; --pat:repeating-linear-gradient(135deg,#fff 0 2px,transparent 2px 14px); }
[data-cat="Mercado"]{ --c1:#B5420F; --c2:#FFC46B; --pat:repeating-linear-gradient(90deg,#fff 0 3px,transparent 3px 16px); }
[data-cat="Vazamento"]{ --c1:#2A1650; --c2:#FF5E5B; --pat:repeating-linear-gradient(45deg,#fff 0 1px,transparent 1px 8px),repeating-linear-gradient(-45deg,#fff 0 1px,transparent 1px 8px); }

/* ---------- Hero (introdução) ---------- */
.hero{ padding-block:var(--s6) var(--s5); border-bottom:1px solid var(--line); }
.hero .wrap{ display:grid; gap:var(--s4); align-items:end; }
@media (min-width:900px){ .hero .wrap{ grid-template-columns:1fr auto; gap:var(--s7); } }
.hero__kicker{ margin-bottom:var(--s2); }
.hero-title{ position:relative; font-family:var(--f-head); font-weight:700; font-optical-sizing:auto; line-height:1.08; letter-spacing:-.015em; font-size:clamp(1.75rem,1.1rem + 2.4vw,2.75rem); padding-bottom:var(--s3); }
.hero-title .w{ display:inline-block; color:var(--ink); }
.hero-title::after{ content:""; position:absolute; left:0; bottom:0; height:3px; width:96px; background:var(--sunset); border-radius:3px; transform-origin:left; }
.hero__dek{ margin-top:var(--s2); color:var(--ink-2); max-width:56ch; }
@media (prefers-reduced-motion:no-preference){
  .hero-title .w{
    opacity:0; transform:translateY(.35em); filter:blur(6px);
    background:linear-gradient(100deg,var(--ink) 40%,#FF4D94 50%,#FF9A3C 55%,var(--ink) 65%) 120% 0/250% 100%;
    -webkit-background-clip:text; background-clip:text;
    animation:rise .7s var(--ease) calc(var(--i,0) * 90ms + 150ms) forwards, sheen 1.1s ease-in-out calc(var(--i,0) * 90ms + 500ms) forwards;
  }
  .hero-title::after{ transform:scaleX(0); animation:grow .9s var(--ease) 1s forwards; }
}
@keyframes rise{ to{ opacity:1; transform:none; filter:none; } }
@keyframes sheen{ 0%{ background-position:120% 0; color:transparent; -webkit-text-fill-color:transparent; } 99%{ -webkit-text-fill-color:transparent; } 100%{ background-position:-20% 0; -webkit-text-fill-color:var(--ink); } }
@keyframes grow{ to{ transform:scaleX(1); } }

/* ---------- Contagem compacta ---------- */
.countdown--compact{ display:inline-flex; flex-wrap:wrap; align-items:baseline; gap:var(--s1) var(--s3); padding:var(--s3) var(--s4); background:var(--surface); border:1px solid var(--line); border-left:3px solid var(--orange); border-radius:var(--r2); font-size:.875rem; color:var(--ink-2); }
.countdown--compact strong{ font-family:var(--f-head); font-size:1.25rem; color:var(--ink); font-variant-numeric:tabular-nums; }
.countdown--compact .countdown__sec{ display:none; }
@media (min-width:900px){ .countdown--compact .countdown__sec{ display:inline; } }
.countdown--compact a{ color:var(--orange); font-weight:600; text-decoration:underline; text-underline-offset:3px; }

/* ---------- Lead grid ---------- */
.lead-grid{ display:grid; gap:var(--s5); padding-block:var(--s6); border-bottom:1px solid var(--line); }
@media (min-width:900px){ .lead-grid{ grid-template-columns:7fr 5fr; gap:var(--s6); } }
.lead{ display:grid; gap:var(--s4); align-content:start; }
.lead .cover{ transition:transform .4s var(--ease); }
.lead__title{ font-family:var(--f-head); font-weight:800; line-height:1.12; letter-spacing:-.01em; font-size:clamp(1.5rem,1rem + 2vw,2.25rem); }
.lead:hover .lead__title,.story:hover .story__title,.story-compact:hover .story-compact__title{ text-decoration:underline; text-decoration-color:var(--pink); text-decoration-thickness:2px; text-underline-offset:4px; }
.lead__dek{ color:var(--ink-2); font-size:1.0625rem; max-width:60ch; }
.lead-side{ display:grid; align-content:start; }
.story-compact{ display:flex; gap:var(--s4); padding-block:var(--s4); border-top:1px solid var(--line); }
.story-compact:first-child{ border-top:0; padding-top:0; }
.story-compact__body{ display:grid; gap:var(--s2); min-width:0; }
.story-compact__title{ font-family:var(--f-head); font-weight:700; line-height:1.2; font-size:1.25rem; }
@media (min-width:900px){ .story-compact .cover--sm{ display:none; } .story-compact__title{ font-size:1.5rem; } }
.story-compact .cover--sm{ order:2; }

/* ---------- Layout 2 colunas ---------- */
.layout{ display:grid; gap:var(--s7); padding-block:var(--s6) var(--s7); }
@media (min-width:1100px){ .layout{ grid-template-columns:minmax(0,1fr) 320px; gap:var(--s7); } }
.rail{ display:grid; gap:var(--s5); align-content:start; }
@media (min-width:1100px){ .rail{ position:sticky; top:calc(var(--header-h) + 16px); max-height:calc(100vh - var(--header-h) - 32px); overflow:auto; scrollbar-width:thin; align-self:start; } }
.box{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r2); padding:var(--s4); }
.box__title{ font:700 .75rem/1 var(--f-ui); letter-spacing:.12em; text-transform:uppercase; color:var(--ink); padding-bottom:var(--s3); margin-bottom:var(--s3); border-bottom:2px solid transparent; border-image:var(--sunset) 1; }
.box--facts dl{ display:grid; gap:var(--s3); }
.box--facts dt{ font-size:.6875rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3); }
.box--facts dd{ font-size:.9375rem; color:var(--ink); }
.mini-list{ counter-reset:n; display:grid; }
.mini{ display:flex; gap:var(--s3); align-items:center; padding-block:var(--s3); border-top:1px solid var(--line); counter-increment:n; }
.mini:first-child{ border-top:0; padding-top:0; }
.mini__body{ min-width:0; }
.mini__title{ font-family:var(--f-head); font-weight:700; font-size:.9375rem; line-height:1.25; }
.mini:hover .mini__title{ text-decoration:underline; text-decoration-color:var(--pink); text-underline-offset:3px; }
.mini .meta{ margin-top:2px; font-size:.75rem; }
.mini-list--rank .mini::before{ content:counter(n); font:800 1.5rem/1 var(--f-head); color:var(--pink); width:1.4ch; flex:none; }

/* ---------- Ferramentas do feed ---------- */
.feed-tools{ display:grid; gap:var(--s3); padding-block:var(--s3); margin-bottom:var(--s4); background:var(--bg); border-bottom:1px solid var(--line); }
@media (min-width:1100px){ .feed-tools{ position:sticky; top:var(--header-h); z-index:20; } }
.chips{ display:flex; gap:var(--s2); overflow-x:auto; scrollbar-width:none; padding-bottom:2px; }
.chips::-webkit-scrollbar{ display:none; }
.chip{ flex:none; min-height:36px; padding:0 var(--s4); border-radius:var(--rp); border:1px solid var(--line); background:transparent; color:var(--ink-2); font:600 .8125rem var(--f-ui); transition:background .2s,border-color .2s,color .2s; }
.chip:hover{ border-color:var(--ink-3); color:var(--ink); }
.chip[aria-pressed="true"]{ background:var(--pink); border-color:var(--pink); color:#1A0B2E; }
.search{ position:relative; }
.search input{ width:100%; min-height:44px; padding:0 var(--s5) 0 40px; border-radius:var(--rp); border:1px solid var(--line); background:var(--surface); font-size:1rem; }
.search input::placeholder{ color:var(--ink-3); }
.search input:focus-visible{ outline-offset:2px; }
.search svg{ position:absolute; left:14px; top:50%; width:18px; height:18px; margin-top:-9px; stroke:var(--ink-3); fill:none; stroke-width:1.8; pointer-events:none; }
.count{ font-size:.8125rem; color:var(--ink-3); }

/* ---------- Lista de matérias (linhas editoriais) ---------- */
.day-head{ font:700 .75rem/1 var(--f-ui); letter-spacing:.12em; text-transform:uppercase; color:var(--ink-3); margin:var(--s5) 0 var(--s2); }
.story{ display:flex; gap:var(--s4); padding-block:var(--s4); border-top:1px solid var(--line); align-items:flex-start; }
.story__body{ display:grid; gap:var(--s2); min-width:0; flex:1; }
.story__title{ font-family:var(--f-head); font-weight:700; line-height:1.18; font-size:1.125rem; letter-spacing:-.005em; }
.story__dek{ display:none; color:var(--ink-2); font-size:.9375rem; max-width:62ch; }
@media (min-width:480px){ .story__dek{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; } }
@media (min-width:640px){ .story__title{ font-size:1.375rem; } .story{ gap:var(--s5); padding-block:var(--s5); } }
.story[hidden]{ display:none; }
.empty{ padding:var(--s7) 0; text-align:center; color:var(--ink-2); display:grid; gap:var(--s4); justify-items:center; border-top:1px solid var(--line); }
.load-more{ display:flex; justify-content:center; padding-top:var(--s5); border-top:1px solid var(--line); }

/* ---------- Anúncios ---------- */
.ad-slot{ margin-block:var(--s6); min-height:250px; display:grid; align-content:start; justify-items:center; gap:6px; }
.ad-slot::before{ content:"Publicidade"; font:600 .625rem/1 var(--f-ui); letter-spacing:.14em; text-transform:uppercase; color:var(--ink-3); }
.ad-slot--inline{ min-height:280px; }
.ad-slot:empty{ display:none; }

/* ---------- Fontes / rodapé ---------- */
.sources{ border-top:1px solid var(--line); padding-block:var(--s6); }
.sources h2{ font:700 .75rem/1 var(--f-ui); letter-spacing:.12em; text-transform:uppercase; color:var(--ink-2); margin-bottom:var(--s4); }
.sources__list{ display:grid; gap:var(--s2); font-size:.9375rem; }
.sources__list a{ color:var(--ink-2); text-decoration:underline; text-decoration-color:var(--pink); text-underline-offset:3px; overflow-wrap:anywhere; }
.sources__list a:hover{ color:var(--ink); }
.site-footer{ background:var(--surface); border-top:1px solid var(--line); padding-block:var(--s6); margin-top:var(--s7); color:var(--ink-3); font-size:.875rem; }
.site-footer__in{ display:grid; gap:var(--s4); }
.footer__disclaimer{ max-width:70ch; }
.site-footer a{ color:var(--ink-2); text-decoration:underline; text-underline-offset:3px; }

/* ---------- Matéria ---------- */
.progress{ position:fixed; top:0; left:0; right:0; height:3px; z-index:120; background:var(--sunset); transform-origin:left; transform:scaleX(var(--p,0)); pointer-events:none; }
.crumbs{ padding-top:var(--s5); font-size:.8125rem; color:var(--ink-3); }
.crumbs ol{ display:flex; flex-wrap:wrap; gap:var(--s1) var(--s2); }
.crumbs li + li::before{ content:"›"; margin-right:var(--s2); }
.crumbs a:hover{ color:var(--ink); text-decoration:underline; }
.post-head{ max-width:820px; padding-block:var(--s5) var(--s5); display:grid; gap:var(--s4); }
.post-title{ font-family:var(--f-head); font-weight:800; line-height:1.1; letter-spacing:-.015em; font-size:clamp(1.875rem,1.3rem + 2.4vw,2.875rem); }
.post-dek{ font-size:1.1875rem; line-height:1.5; color:var(--ink-2); max-width:60ch; }
.byline{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--s3); padding-block:var(--s3); border-block:1px solid var(--line); font-size:.875rem; color:var(--ink-3); }
.byline__who{ display:flex; align-items:center; gap:var(--s3); color:var(--ink); font-weight:600; }
.share{ display:flex; flex-wrap:wrap; gap:var(--s2); align-items:center; }
.share__label{ font-size:.75rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3); margin-right:var(--s1); }
.share__btn{ display:inline-flex; align-items:center; gap:var(--s2); min-height:40px; padding:0 var(--s4); border:1px solid var(--line); border-radius:var(--rp); background:var(--surface); font:600 .8125rem var(--f-ui); color:var(--ink-2); transition:border-color .2s,color .2s; }
.share__btn:hover{ border-color:var(--pink); color:var(--ink); }
.share__btn svg{ width:16px; height:16px; fill:currentColor; }
.share__btn.is-done{ border-color:var(--ok); color:var(--ok); }
.post-cover{ margin-bottom:var(--s6); }
.post-grid{ display:grid; gap:var(--s6); padding-bottom:var(--s7); }
@media (min-width:1100px){ .post-grid{ grid-template-columns:56px minmax(0,var(--readw)) 320px; gap:var(--s6); justify-content:center; }
  .post-grid .share--rail{ position:sticky; top:calc(var(--header-h) + 24px); flex-direction:column; align-self:start; } .post-grid .share--rail .share__btn{ width:44px; height:44px; padding:0; justify-content:center; } .post-grid .share--rail .share__btn span,.post-grid .share--rail .share__label{ display:none; } }
@media (max-width:1099px){ .share--rail{ display:none; } }
@media (min-width:1100px){ .share--top{ display:none; } }
.article-col{ min-width:0; }
.toc{ margin-bottom:var(--s5); background:var(--surface); border:1px solid var(--line); border-radius:var(--r2); }
.toc summary{ cursor:pointer; padding:var(--s3) var(--s4); font:700 .75rem/1 var(--f-ui); letter-spacing:.12em; text-transform:uppercase; list-style:none; display:flex; justify-content:space-between; min-height:44px; align-items:center; }
.toc summary::-webkit-details-marker{ display:none; }
.toc summary::after{ content:"+"; font-size:1.125rem; color:var(--pink); }
.toc[open] summary::after{ content:"−"; }
.toc ol{ padding:0 var(--s4) var(--s4); display:grid; gap:var(--s1); counter-reset:t; }
.toc li{ counter-increment:t; }
.toc a{ display:flex; gap:var(--s3); padding:6px 0; color:var(--ink-2); font-size:.9375rem; border-left:2px solid transparent; padding-left:var(--s3); }
.toc a::before{ content:counter(t,decimal-leading-zero); color:var(--ink-3); font-variant-numeric:tabular-nums; }
.toc a:hover,.toc a.is-active{ color:var(--ink); border-color:var(--pink); }
.prose{ font-family:var(--f-read); font-size:1.125rem; line-height:1.65; color:var(--ink); }
.prose > * + *{ margin-top:1.2em; }
.prose h2{ font-family:var(--f-head); font-weight:800; font-size:1.5rem; line-height:1.2; letter-spacing:-.01em; margin-top:2em; padding-top:var(--s4); position:relative; scroll-margin-top:calc(var(--header-h) + 16px); }
.prose h2::before{ content:""; position:absolute; top:0; left:0; width:48px; height:3px; background:var(--sunset); border-radius:3px; }
.prose h3{ font-family:var(--f-head); font-weight:700; font-size:1.25rem; margin-top:1.6em; }
.prose a{ color:var(--ink); text-decoration:underline; text-decoration-color:var(--pink); text-decoration-thickness:2px; text-underline-offset:3px; }
.prose a:hover{ color:var(--pink); }
.prose ul,.prose ol{ padding-left:1.4em; display:grid; gap:.5em; }
.prose ul{ list-style:disc; } .prose ol{ list-style:decimal; }
.prose li::marker{ color:var(--pink); }
.prose blockquote{ border-left:3px solid var(--pink); padding:var(--s1) 0 var(--s1) var(--s5); font-size:1.25rem; font-style:italic; color:var(--ink-2); }
.prose strong{ font-weight:600; }
.prose > p:first-of-type::first-letter{ font-family:var(--f-head); font-weight:800; float:left; font-size:3.4em; line-height:.85; padding:.06em .1em 0 0; color:var(--pink); }
.also{ border-left:3px solid var(--orange); background:var(--surface); padding:var(--s4); border-radius:0 var(--r2) var(--r2) 0; font-family:var(--f-ui); }
.also__label{ display:block; font:700 .6875rem/1 var(--f-ui); letter-spacing:.12em; text-transform:uppercase; color:var(--orange); margin-bottom:var(--s2); }
.also a{ font-family:var(--f-head); font-weight:700; font-size:1.0625rem; text-decoration:none; }
.also a:hover{ text-decoration:underline; text-decoration-color:var(--orange); }
.post-foot{ margin-top:var(--s6); padding-top:var(--s4); border-top:1px solid var(--line); display:flex; flex-wrap:wrap; justify-content:space-between; gap:var(--s3); font-size:.8125rem; color:var(--ink-3); }
.post-foot a{ text-decoration:underline; text-underline-offset:3px; }
.recommended{ border-top:1px solid var(--line); padding-block:var(--s6); }
.recommended > h2,.section-title{ font-family:var(--f-head); font-weight:800; font-size:1.5rem; margin-bottom:var(--s4); }
@media (min-width:900px){ .recommended .feed-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s5); } .recommended .story{ flex-direction:column; border-top:0; padding:0; } .recommended .cover--sm{ width:100%; } }
.post-nav{ display:grid; gap:var(--s3); padding-block:var(--s5); border-top:1px solid var(--line); }
@media (min-width:640px){ .post-nav{ grid-template-columns:1fr 1fr; } .post-nav a:last-child{ text-align:right; } }
.post-nav a{ display:grid; gap:var(--s1); padding:var(--s3) var(--s4); border:1px solid var(--line); border-radius:var(--r2); }
.post-nav a:hover{ border-color:var(--pink); }
.post-nav small{ font-size:.6875rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-3); }
.post-nav strong{ font-family:var(--f-head); font-size:1rem; line-height:1.25; }

/* ---------- Voltar ao topo ---------- */
.to-top{ position:fixed; right:12px; bottom:calc(12px + var(--ad-safe) + env(safe-area-inset-bottom,0px)); z-index:60; width:44px; height:44px; border-radius:50%; background:var(--surface-2); border:1px solid var(--line); display:grid; place-items:center; opacity:0; transform:translateY(8px); pointer-events:none; transition:opacity .25s,transform .25s var(--ease); }
.to-top.is-on{ opacity:1; transform:none; pointer-events:auto; }
.to-top:hover{ border-color:var(--pink); }
.to-top svg{ width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:2; }

/* ---------- Player flutuante ---------- */
.player{ position:fixed; z-index:60; left:12px; bottom:calc(12px + var(--ad-safe) + env(safe-area-inset-bottom,0px)); max-width:calc(100vw - 24px - 56px); background:var(--surface); border:1px solid var(--line); border-radius:var(--rp); box-shadow:0 8px 28px rgba(0,0,0,.5); font-family:var(--f-ui); color:var(--ink); }
.player__bar{ display:flex; align-items:center; gap:var(--s2); height:48px; padding:0 var(--s2) 0 6px; }
.player__play{ width:36px; height:36px; border-radius:50%; background:var(--pink); color:#1A0B2E; display:grid; place-items:center; flex:none; }
.player__play svg{ width:16px; height:16px; fill:currentColor; }
.player__title{ font:600 .8125rem/1.2 var(--f-ui); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:150px; }
.player__title small{ display:block; font-weight:400; color:var(--ink-3); font-size:.6875rem; }
.player__toggle{ width:44px; height:44px; margin-right:-6px; display:grid; place-items:center; color:var(--ink-2); }
.player__toggle svg{ width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:2; transition:transform .2s; }
.player__panel{ display:none; }
.player.is-open{ border-radius:var(--r2); width:calc(100vw - 24px); max-width:360px; }
.player.is-open .player__panel{ display:block; }
.player.is-open .player__bar{ border-bottom:1px solid var(--line); }
.player.is-open .player__toggle svg{ transform:rotate(180deg); }
.player__video{ width:100%; aspect-ratio:16/9; background:#000; min-height:202px; }
.player__video iframe{ width:100%; height:100%; border:0; }
.player__ctrls{ display:flex; align-items:center; justify-content:center; gap:var(--s2); padding:var(--s2); }
.player__ctrls button{ width:44px; height:44px; border-radius:50%; display:grid; place-items:center; color:var(--ink-2); }
.player__ctrls button:hover{ background:var(--surface-2); color:var(--ink); }
.player__ctrls svg{ width:20px; height:20px; fill:currentColor; }
.player__list{ max-height:176px; overflow:auto; border-top:1px solid var(--line); padding:var(--s1); }
.player__track{ display:flex; align-items:center; gap:var(--s3); width:100%; min-height:44px; padding:0 var(--s3); border-radius:var(--r1); text-align:left; font-size:.8125rem; color:var(--ink-2); }
.player__track:hover{ background:var(--surface-2); color:var(--ink); }
.player__track[aria-current="true"]{ color:var(--ink); box-shadow:inset 3px 0 var(--cyan); background:var(--surface-2); }
.player.is-error .player__title small{ color:var(--danger); }
.eq{ display:none; align-items:flex-end; gap:2px; height:14px; }
.player.is-playing .eq{ display:inline-flex; }
.eq i{ width:3px; height:30%; background:var(--cyan); border-radius:1px; }
@media (prefers-reduced-motion:no-preference){ .player.is-playing .eq i{ animation:eq .9s ease-in-out infinite; } .player.is-playing .eq i:nth-child(2){ animation-delay:.2s; } .player.is-playing .eq i:nth-child(3){ animation-delay:.4s; } }
@keyframes eq{ 0%,100%{ height:25%; } 50%{ height:100%; } }
@media (min-width:900px){ .player{ left:16px; bottom:calc(16px + var(--ad-safe)); max-width:340px; } .player__title{ max-width:200px; } .to-top{ right:16px; bottom:calc(16px + var(--ad-safe)); } }
@media (max-width:899px){ .player.is-open{ max-height:70vh; overflow:auto; } }

/* ---------- FASE 2: login e comentários (ativar removendo [hidden]) ---------- */
.comments{ border-top:1px solid var(--line); padding-block:var(--s6); display:grid; gap:var(--s5); }
.comments__head{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:var(--s4); }
.comments__head h2{ font-family:var(--f-head); font-weight:800; font-size:1.5rem; }
.rating{ display:flex; align-items:center; gap:var(--s2); }
.rating__btn{ display:inline-flex; align-items:center; gap:var(--s2); min-height:40px; padding:0 var(--s4); border:1px solid var(--line); border-radius:var(--rp); font:600 .8125rem var(--f-ui); color:var(--ink-2); }
.rating__btn svg{ width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:1.8; }
.rating__btn[aria-pressed="true"]{ border-color:var(--pink); color:var(--pink); }
.cform{ display:grid; grid-template-columns:auto 1fr; gap:var(--s3); align-items:start; }
.cform textarea{ width:100%; min-height:96px; padding:var(--s3) var(--s4); background:var(--surface); border:1px solid var(--line); border-radius:var(--r2); font:1rem/1.5 var(--f-ui); color:var(--ink); resize:vertical; }
.cform__foot{ grid-column:2; display:flex; justify-content:space-between; align-items:center; gap:var(--s3); font-size:.8125rem; color:var(--ink-3); }
.cform.is-locked textarea{ opacity:.55; }
.clist{ display:grid; }
.comment{ display:grid; grid-template-columns:auto 1fr; gap:var(--s3); padding-block:var(--s4); border-top:1px solid var(--line); }
.comment__head{ display:flex; flex-wrap:wrap; gap:var(--s1) var(--s3); align-items:baseline; font-size:.875rem; }
.comment__head strong{ color:var(--ink); }
.comment__head time{ color:var(--ink-3); font-size:.8125rem; }
.comment__text{ margin-top:var(--s1); color:var(--ink-2); overflow-wrap:anywhere; }
.comment__actions{ display:flex; align-items:center; gap:var(--s4); margin-top:var(--s2); font-size:.8125rem; color:var(--ink-3); }
.comment__actions button:hover{ color:var(--ink); text-decoration:underline; }
.comment--reply{ margin-left:var(--s6); border-left:2px solid var(--line); padding-left:var(--s4); }
.vote{ display:inline-flex; align-items:center; gap:var(--s1); border:1px solid var(--line); border-radius:var(--rp); padding:0 var(--s1); }
.vote button{ width:32px; height:32px; display:grid; place-items:center; border-radius:50%; font-size:.75rem; }
.vote button[aria-pressed="true"]{ color:var(--pink); }
.vote output{ min-width:2ch; text-align:center; font-variant-numeric:tabular-nums; color:var(--ink); }
.comment.is-loading{ opacity:.6; } 
.skeleton{ height:12px; border-radius:6px; background:linear-gradient(90deg,var(--surface),var(--surface-2),var(--surface)); background-size:200% 100%; }
@media (prefers-reduced-motion:no-preference){ .skeleton{ animation:sk 1.4s linear infinite; } }
@keyframes sk{ to{ background-position:-200% 0; } }

/* ---------- FASE 2 (complemento): contas, menus, toasts, comentários ---------- */
:root{ --field-h:48px; --danger-bg:rgba(255,94,91,.10); --ok-bg:rgba(92,242,192,.10); }

/* Páginas de conta */
.acct{ min-height:60vh; padding-block:var(--s6) var(--s7); display:grid; justify-items:center; align-content:start; }
.acct__card{ position:relative; width:100%; max-width:440px; padding:var(--s5); background:var(--surface); border:1px solid var(--line); border-radius:var(--r2); margin-inline:auto; }
.acct__card::before{ content:""; position:absolute; left:-1px; right:-1px; top:-1px; height:3px; background:var(--sunset); border-radius:var(--r2) var(--r2) 0 0; }
.acct__card--wide{ max-width:560px; }
.acct > .acct__card{ width:calc(100% - 0px); }
.acct__title{ font-family:var(--f-head); font-weight:800; font-size:clamp(1.5rem,1.2rem + 1.4vw,2rem); line-height:1.15; letter-spacing:-.01em; margin-top:var(--s2); }
.acct__lead{ margin-top:var(--s2); color:var(--ink-2); }
.acct__alt{ margin-top:var(--s5); padding-top:var(--s4); border-top:1px solid var(--line); text-align:center; font-size:.9375rem; color:var(--ink-2); }
.acct__alt a,.field__hint a,.check a,.form-msg a{ color:var(--ink); text-decoration:underline; text-decoration-color:var(--pink); text-decoration-thickness:2px; text-underline-offset:3px; }
.acct__alt a:hover,.check a:hover{ color:var(--pink); }
.acct__sec{ padding-block:var(--s5); border-top:1px solid var(--line); display:grid; gap:var(--s4); }
.acct__sec:first-of-type{ border-top:0; padding-top:var(--s4); }
.acct__h2{ font-family:var(--f-head); font-weight:800; font-size:1.25rem; line-height:1.2; }

/* Formulário */
.form{ display:grid; gap:var(--s4); margin-top:var(--s5); }
.form .btn{ width:100%; min-height:var(--field-h); }
.form__row{ display:flex; justify-content:flex-end; margin-top:calc(var(--s2) * -1); }
.form__row a{ font-size:.875rem; color:var(--ink-2); text-decoration:underline; text-underline-offset:3px; display:inline-flex; align-items:center; min-height:44px; }
.form__row a:hover{ color:var(--ink); }
.field{ display:grid; gap:6px; }
.field__label{ font:600 .875rem var(--f-ui); color:var(--ink); }
.field__input{ width:100%; min-height:var(--field-h); padding:0 var(--s4); background:var(--surface-2); border:1px solid var(--line); border-radius:var(--r2); font-size:1rem; color:var(--ink); transition:border-color .2s; }
.field__input::placeholder{ color:var(--ink-3); }
.field__input:hover{ border-color:var(--ink-3); }
.field__input:focus-visible{ outline-offset:2px; border-color:var(--cyan); }
.field__input[readonly]{ background:transparent; border-style:dashed; color:var(--ink-2); cursor:not-allowed; }
.field__hint{ font-size:.8125rem; color:var(--ink-3); }
.field__err{ display:flex; gap:6px; align-items:flex-start; font-size:.8125rem; color:var(--danger); }
.field__err::before{ content:"!"; flex:none; width:16px; height:16px; margin-top:1px; border-radius:50%; background:var(--danger); color:#1A0B2E; font:800 .6875rem/16px var(--f-ui); text-align:center; }
.field[data-state="error"] .field__input,.field__input[aria-invalid="true"],.cform textarea[aria-invalid="true"]{ border-color:var(--danger); }
.field[data-state="ok"] .field__input{ border-color:var(--ok); }
.field.is-busy,.btn.is-busy{ pointer-events:none; }
.btn:disabled,.btn[aria-disabled="true"]{ opacity:.5; cursor:not-allowed; filter:none; }
.btn.is-busy{ position:relative; opacity:.85; }
.btn.is-busy::before{ content:""; width:16px; height:16px; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; }
@media (prefers-reduced-motion:no-preference){ .btn.is-busy::before{ animation:spin .7s linear infinite; } }
@keyframes spin{ to{ transform:rotate(360deg); } }

/* Senha: mostrar/ocultar + força */
.pw{ position:relative; }
.pw .field__input{ padding-right:84px; }
.pw__toggle{ position:absolute; right:2px; top:2px; bottom:2px; min-width:76px; padding:0 var(--s3); border-radius:var(--r1); font:600 .8125rem var(--f-ui); color:var(--ink-2); }
.pw__toggle:hover{ color:var(--ink); background:var(--surface); }
.pw__toggle[aria-pressed="true"]{ color:var(--pink); }
.strength{ display:flex; align-items:center; gap:var(--s3); font-size:.8125rem; color:var(--ink-3); }
.strength__bar{ display:flex; gap:4px; flex:0 0 120px; }
.strength__bar i{ flex:1; height:4px; border-radius:2px; background:var(--line); transition:background .2s; }
.strength[data-level="1"] .strength__bar i:nth-child(-n+1){ background:var(--danger); }
.strength[data-level="2"] .strength__bar i:nth-child(-n+2){ background:var(--orange); }
.strength[data-level="3"] .strength__bar i:nth-child(-n+3){ background:var(--gold); }
.strength[data-level="4"] .strength__bar i{ background:var(--ok); }
.strength[data-level="0"] .strength__txt{ visibility:hidden; }

/* Aceite (checkbox) */
.check{ display:grid; grid-template-columns:auto 1fr; gap:var(--s3); align-items:start; font-size:.875rem; color:var(--ink-2); }
.check input{ width:22px; height:22px; margin:11px 0 0 11px; accent-color:var(--pink); }
.check label{ padding-block:11px; }
.check .field__err{ grid-column:2; }

/* Mensagens do formulário */
.form-msg{ margin-top:var(--s4); padding:var(--s3) var(--s4); border-radius:var(--r2); border:1px solid; border-left-width:3px; font-size:.9375rem; }
.form-msg:focus-visible{ outline-offset:2px; }
.form-msg--error{ color:var(--ink); border-color:var(--danger); background:var(--danger-bg); }
.form-msg--ok{ color:var(--ink); border-color:var(--ok); background:var(--ok-bg); }
.form-msg .btn{ margin-top:var(--s3); width:auto; }

/* Foto de perfil */
.avatar img{ width:100%; height:100%; object-fit:cover; }
.avatar--xl{ width:96px; height:96px; line-height:96px; font-size:1.75rem; position:relative; }
.avatar--xl img{ position:absolute; inset:0; }
.avatar--neutral{ background:var(--surface-2); color:var(--ink-3); border:1px solid var(--line); }
.avatar-edit{ display:grid; gap:var(--s4); justify-items:center; text-align:center; }
.avatar-edit__ctrl{ display:grid; gap:var(--s3); justify-items:center; width:100%; }
.avatar-edit__ctrl .btn{ width:100%; max-width:280px; }
.avatar-edit__tag{ position:absolute; left:50%; bottom:-8px; transform:translateX(-50%); padding:2px 8px; border-radius:var(--rp); background:var(--orange); color:#1A0B2E; font:700 .625rem/1.4 var(--f-ui); letter-spacing:.08em; text-transform:uppercase; }
.avatar-edit__confirm{ display:flex; gap:var(--s3); justify-content:center; flex-wrap:wrap; }
.avatar-edit__confirm .btn{ width:auto; }
@media (min-width:560px){
  .avatar-edit{ grid-template-columns:auto 1fr; justify-items:start; text-align:left; align-items:center; gap:var(--s5); }
  .avatar-edit__ctrl{ justify-items:start; grid-auto-flow:row; }
  .avatar-edit__ctrl .btn{ width:auto; }
  .avatar-edit__confirm{ justify-content:flex-start; }
}

/* Botões de perigo */
.btn--danger{ background:var(--danger); border-color:var(--danger); color:#1A0B2E; }
.btn--danger-outline{ background:transparent; border-color:var(--danger); color:var(--danger); }
.btn--danger-outline:hover{ background:var(--danger-bg); filter:none; }
.btn--danger-text{ color:var(--danger); }
.danger-zone{ margin-top:var(--s5); padding:var(--s5); border:1px solid var(--danger); border-radius:var(--r2); background:var(--danger-bg); display:grid; gap:var(--s4); }
.danger-zone .acct__h2{ color:var(--ink); }
.danger-zone p{ color:var(--ink-2); font-size:.9375rem; }
.danger-zone .btn{ justify-self:start; width:auto; }
.confirm{ display:grid; gap:var(--s4); padding:var(--s4); background:var(--bg); border:1px solid var(--line); border-radius:var(--r2); }
.confirm__title{ font-family:var(--f-head); font-weight:800; font-size:1.125rem; }
.confirm__title:focus-visible{ outline-offset:4px; }
.confirm__step{ font:600 .8125rem var(--f-ui); color:var(--ink-2); }
.confirm__step2{ display:grid; gap:var(--s4); }
.confirm__actions{ display:flex; flex-direction:column-reverse; gap:var(--s3); }
.confirm__actions .btn{ width:100%; }
@media (min-width:560px){ .confirm__actions{ flex-direction:row; justify-content:flex-end; } .confirm__actions .btn{ width:auto; } }

/* Menus (conta e comentário) */
.acct-menu,.cmenu{ position:relative; }
.acct-menu__btn{ width:44px; height:44px; display:grid; place-items:center; border-radius:50%; }
.acct-menu__btn:hover .avatar,.acct-menu__btn[aria-expanded="true"] .avatar{ box-shadow:0 0 0 2px var(--pink); }
.auth.is-pending{ min-width:80px; justify-content:flex-end; }
.auth.is-pending::before{ content:""; width:32px; height:32px; border-radius:50%; background:var(--surface-2); }
.menu{ position:absolute; right:0; top:calc(100% + 6px); z-index:90; min-width:200px; max-width:min(260px,calc(100vw - 32px)); padding:var(--s1); background:var(--surface-2); border:1px solid var(--line); border-radius:var(--r2); box-shadow:0 12px 32px rgba(0,0,0,.55); }
.menu.is-up{ top:auto; bottom:calc(100% + 6px); }
.menu__who{ display:grid; padding:var(--s3); border-bottom:1px solid var(--line); margin-bottom:var(--s1); font-size:.875rem; overflow-wrap:anywhere; }
.menu__who small{ color:var(--ink-3); font-size:.75rem; }
.menu a,.menu button{ display:flex; align-items:center; width:100%; min-height:44px; padding:0 var(--s3); border-radius:var(--r1); font:500 .9375rem var(--f-ui); color:var(--ink); text-align:left; }
.menu a:hover,.menu button:hover,.menu [role="menuitem"]:focus-visible{ background:var(--surface); }
.menu .is-danger{ color:var(--danger); }
.menu [aria-disabled="true"],.menu :disabled{ color:var(--ink-3); cursor:default; }
.menu :focus-visible{ outline-offset:-3px; }

/* Toasts */
.toast-region{ position:fixed; z-index:130; left:var(--s4); right:var(--s4); top:calc(var(--header-h) + 12px); display:grid; justify-items:center; pointer-events:none; }
.toast{ pointer-events:auto; display:flex; align-items:center; gap:var(--s3); width:100%; max-width:420px; padding:var(--s2) var(--s2) var(--s2) var(--s4); background:var(--surface-2); border:1px solid var(--line); border-left:3px solid var(--ok); border-radius:var(--r2); box-shadow:0 12px 32px rgba(0,0,0,.55); font-size:.9375rem; color:var(--ink); }
.toast--error{ border-left-color:var(--danger); }
.toast--info{ border-left-color:var(--violet); }
.toast a{ color:var(--pink); text-decoration:underline; text-underline-offset:3px; font-weight:600; }
.toast__txt{ flex:1; min-width:0; overflow-wrap:anywhere; }
.toast__x{ width:44px; height:44px; display:grid; place-items:center; flex:none; color:var(--ink-3); font-size:1.25rem; border-radius:50%; }
.toast__x:hover{ color:var(--ink); background:var(--surface); }
@media (prefers-reduced-motion:no-preference){ .toast{ animation:toast-in .25s var(--ease); } }
@keyframes toast-in{ from{ opacity:0; transform:translateY(-8px); } }
@media (min-width:900px){ .toast-region{ left:auto; right:var(--s5); justify-items:end; } }

/* Comentários: complementos */
.comments__count{ color:var(--ink-3); font-weight:500; font-size:1.125rem; }
.csort{ display:flex; gap:var(--s1); padding:3px; border:1px solid var(--line); border-radius:var(--rp); background:var(--surface); }
.csort__btn{ min-height:38px; padding:0 var(--s4); border-radius:var(--rp); font:600 .8125rem var(--f-ui); color:var(--ink-2); white-space:nowrap; }
.csort__btn:hover{ color:var(--ink); }
.csort__btn[aria-pressed="true"]{ background:var(--pink); color:#1A0B2E; }
.csort__btn:focus-visible{ outline-offset:1px; }
@media (max-width:559px){ .csort{ width:100%; } .csort__btn{ flex:1; min-height:44px; } }
.cform__main{ min-width:0; display:grid; gap:6px; }
.cform textarea:hover{ border-color:var(--ink-3); }
.cform textarea:focus-visible{ outline-offset:2px; border-color:var(--cyan); }
.cform textarea::placeholder{ color:var(--ink-3); }
.cform__foot .is-warn{ color:var(--orange); }
.cform__foot .is-over{ color:var(--danger); }
.cform__foot .btn{ min-height:44px; padding:0 var(--s5); }
@media (max-width:479px){ .cform{ grid-template-columns:1fr; } .cform > .avatar{ display:none; } .cform__foot{ grid-column:1; } }
.cta-login{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--s3) var(--s4); padding:var(--s4); background:var(--surface); border:1px solid var(--line); border-left:3px solid var(--pink); border-radius:0 var(--r2) var(--r2) 0; color:var(--ink-2); }
.cta-login p{ flex:1 1 220px; }
.cta-login strong{ color:var(--ink); }
.cta-login a:not(.btn){ color:var(--ink); text-decoration:underline; text-decoration-color:var(--pink); text-underline-offset:3px; }
.cta-login__alt{ font-size:.875rem; }
.clist{ min-height:120px; }
.clist.is-loading{ min-height:320px; }
.comment__body{ min-width:0; }
.comment__edited{ font-size:.75rem; color:var(--ink-3); }
.badge-mini{ font:700 .625rem/1 var(--f-ui); letter-spacing:.08em; text-transform:uppercase; padding:3px 6px; border-radius:var(--r1); border:1px solid var(--violet); color:var(--violet); }
.comment__actions{ justify-content:space-between; }
.comment.is-new{ background:linear-gradient(90deg,rgba(255,77,148,.10),transparent); }
.vote button:hover{ background:var(--surface-2); color:var(--ink); }
.vote button[aria-pressed="true"]{ background:var(--surface-2); box-shadow:inset 0 0 0 1px currentColor; }
.vote button[aria-pressed="true"]:first-child{ color:var(--pink); }
.vote button[aria-pressed="true"]:last-child{ color:var(--orange); }
@media (pointer:coarse){ .vote button{ width:40px; height:40px; } }
.cmenu__btn{ width:44px; height:44px; display:grid; place-items:center; border-radius:50%; color:var(--ink-3); font-size:1.25rem; line-height:1; margin-right:-10px; }
.cmenu__btn:hover,.cmenu__btn[aria-expanded="true"]{ background:var(--surface-2); color:var(--ink); }
.comment--editing textarea{ width:100%; min-height:96px; padding:var(--s3) var(--s4); background:var(--surface); border:1px solid var(--cyan); border-radius:var(--r2); font:1rem/1.5 var(--f-ui); color:var(--ink); resize:vertical; }
.comment--editing .comment__actions{ justify-content:flex-start; gap:var(--s3); }
.inline-confirm{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--s3); margin-top:var(--s2); padding:var(--s3); background:var(--surface); border:1px solid var(--line); border-radius:var(--r2); font-size:.875rem; color:var(--ink); }
.inline-confirm select{ min-height:44px; padding:0 var(--s3); background:var(--surface-2); border:1px solid var(--line); border-radius:var(--r2); color:var(--ink); font:inherit; }
.inline-confirm .btn{ min-height:44px; padding:0 var(--s4); font-size:.875rem; }
.comment--sk .avatar{ background:var(--surface-2); }
.comment--sk .comment__body{ display:grid; gap:var(--s2); align-content:start; }
.comment--sk .skeleton:nth-child(1){ width:35%; }
.comment--sk .skeleton:nth-child(2){ width:100%; }
.comment--sk .skeleton:nth-child(3){ width:60%; }
.comment--hidden .avatar{ filter:grayscale(1); opacity:.6; }
.comment--hidden .comment__head strong{ color:var(--ink-3); }
.comment__notice{ margin-top:var(--s1); color:var(--ink-3); font-size:.9375rem; font-style:italic; }
.comment__notice button{ margin-left:var(--s2); font-style:normal; font-weight:600; font-size:.8125rem; color:var(--ink-2); text-decoration:underline; text-underline-offset:3px; min-height:44px; }
.comment--removed .comment__text,.comment--deleted .comment__head strong{ font-style:italic; color:var(--ink-3); }
.comment--removed .avatar,.comment--deleted .avatar{ background:var(--surface-2); color:var(--ink-3); border:1px solid var(--line); }
.cstate{ display:grid; justify-items:center; gap:var(--s3); padding:var(--s6) var(--s4); text-align:center; color:var(--ink-2); border-top:1px solid var(--line); }
.cstate svg{ width:32px; height:32px; stroke:var(--ink-3); fill:none; stroke-width:1.6; }
.cstate--error{ color:var(--ink); }
.cstate--error svg{ stroke:var(--danger); }
.clist__more{ display:flex; justify-content:center; padding-top:var(--s4); border-top:1px solid var(--line); }

/* Complementos do dev (fase 2): páginas legais, marcador de dados da empresa, foco e detalhes de layout */
.legal{ max-width:var(--readw); margin-inline:auto; padding-block:var(--s5) var(--s6); line-height:1.65; color:var(--ink-2); }
.legal h1{ font-family:var(--f-head); font-weight:800; line-height:1.1; letter-spacing:-.015em; font-size:clamp(1.875rem,1.3rem + 2.4vw,2.5rem); color:var(--ink); }
.legal h2{ position:relative; margin-top:2em; padding-top:var(--s4); font-family:var(--f-head); font-weight:800; font-size:1.5rem; line-height:1.2; color:var(--ink); scroll-margin-top:calc(var(--header-h) + 16px); }
.legal h2::before{ content:""; position:absolute; top:0; left:0; width:48px; height:3px; background:var(--sunset); border-radius:3px; }
.legal h3{ margin-top:1.6em; font-family:var(--f-head); font-weight:700; font-size:1.125rem; color:var(--ink); }
.legal > * + *{ margin-top:1em; }
.legal > h1 + p{ color:var(--ink-3); }
.legal ul,.legal ol{ padding-left:1.4em; display:grid; gap:.5em; }
.legal ul{ list-style:disc; } .legal ol{ list-style:decimal; }
.legal li::marker{ color:var(--pink); }
.legal strong{ color:var(--ink); font-weight:600; }
.legal a{ color:var(--ink); text-decoration:underline; text-decoration-color:var(--pink); text-decoration-thickness:2px; text-underline-offset:3px; overflow-wrap:anywhere; }
.legal a:hover{ color:var(--pink); }
.legal__table{ overflow-x:auto; border:1px solid var(--line); border-radius:var(--r2); }
.legal__table:focus-visible{ outline-offset:2px; }
.legal table{ width:100%; min-width:520px; border-collapse:collapse; font-size:.9375rem; }
.legal th,.legal td{ padding:var(--s3) var(--s4); text-align:left; vertical-align:top; border-bottom:1px solid var(--line); }
.legal th{ color:var(--ink); background:var(--surface); font-weight:600; }
.legal tr:last-child td{ border-bottom:0; }
.placeholder-empresa{ background:var(--gold); color:#1A0B2E; padding:0 4px; border-radius:var(--r1); font-weight:700; }
.field__input,.cform textarea,.comment--editing textarea,.inline-confirm select{ scroll-margin-top:calc(var(--header-h) + 24px); }
.comment:focus-visible{ outline-offset:2px; }
.comment__head strong{ overflow-wrap:anywhere; }
.comment__actions{ flex-wrap:wrap; }
.comment__text{ white-space:pre-line; }
.avatar-edit__tag{ white-space:nowrap; }
.acct__card .form-msg:first-child{ margin-top:var(--s4); }
.acct__sec .form{ margin-top:0; }

/* ---------- Movimento reduzido ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}

/* ---------- Complementos do dev (não previstos no bloco do designer) ---------- */
.icon-btn svg,.to-top svg{ width:20px; height:20px; stroke:currentColor; fill:none; stroke-width:1.8; }
.nav{ gap:var(--s4); }
@media (min-width:1100px){ .nav{ gap:var(--s5); } }
.topbar a{ color:var(--ink-2); }
.hero__dek{ margin-top:var(--s2); }
.countdown--compact{ align-self:start; }
.countdown--compact .countdown__nums{ display:inline-flex; flex-wrap:wrap; align-items:baseline; gap:var(--s1) var(--s2); }
.countdown--compact .countdown__nums span{ font-size:.8125rem; color:var(--ink-3); }
.lead .meta,.story-compact .meta{ margin-top:var(--s1); }
.lead-side .story-compact:first-child{ padding-top:0; }
.feed-tools + .day-group .day-head{ margin-top:0; }
.search__clear{ position:absolute; right:4px; top:2px; width:40px; height:40px; display:grid; place-items:center; border-radius:50%; color:var(--ink-3); font-size:1.25rem; line-height:1; }
.search__clear:hover{ color:var(--ink); background:var(--surface-2); }
.search input[type="search"]::-webkit-search-cancel-button{ display:none; }
.rail .box .meta{ font-size:.75rem; }
.box--rec .mini-list .mini:last-child{ padding-bottom:0; }
.sources .wrap{ padding-inline:var(--gutter); }
.article-col .sources{ padding-block:var(--s5); margin-top:var(--s5); }
.status-note{ margin-bottom:var(--s5); padding:var(--s3) var(--s4); border-left:3px solid var(--warn); background:var(--surface); border-radius:0 var(--r2) var(--r2) 0; font-size:.9375rem; color:var(--ink-2); }
.byline .meta{ flex:1 1 auto; }
.byline__who{ flex:none; }
.post-nav a[rel="prev"]{ text-align:left; }
.post-nav a[rel="next"]{ text-align:right; }
@media (min-width:640px){ .post-nav a[rel="next"]{ grid-column:2; } }
.recommended .section-title{ margin-bottom:var(--s4); }
.share--rail{ align-items:stretch; }
.share__btn[hidden]{ display:none; }
/* Player: recolhido, o vídeo continua montado fora da tela para não interromper o áudio */
.player.is-loaded:not(.is-open) .player__panel{ display:block; position:fixed; left:-9999px; top:0; width:360px; }
.player__bar > .eq{ margin-right:2px; }
.player__msg{ padding:var(--s2) var(--s4); font-size:.8125rem; color:var(--danger); }
.player__msg a{ color:var(--ink); text-decoration:underline; text-underline-offset:3px; }
.player__track{ flex-wrap:wrap; gap:0 var(--s3); padding-block:var(--s2); }
.player__track span{ display:block; }
.player__track strong{ display:block; font-weight:600; color:inherit; }
.player__track small{ display:block; color:var(--ink-3); font-size:.6875rem; }
.player__list{ margin:0; }
.player.is-loading .player__play{ opacity:.7; }
.player:not(.is-open){ max-width:min(300px,calc(100vw - 24px - 56px)); }
.ad-slot--rail{ margin-block:0; }
.player__hint{ position:absolute; inset:0; display:grid; place-items:center; padding:var(--s4); text-align:center; font-size:.8125rem; color:var(--ink-3); }
.player__video{ position:relative; }
.player.is-loaded .player__hint{ display:none; }
.story__thumb,.story-compact__thumb,.lead__thumb,.mini__thumb{ display:block; flex:none; }
.lead__thumb{ display:block; }
.mini__thumb .cover{ display:block; }
.story-compact__thumb{ order:2; }
@media (min-width:900px){ .story-compact__thumb{ display:none; } }

/* Fase 2: prévia da foto e botão "Mostrar senha" mais largo */
.avatar-edit__prev{ position:relative; }
.pw .field__input{ padding-right:116px; }
.pw__toggle{ min-width:104px; }

/* ---------- PORTAL: tema claro (jornal) e games (escuro) ---------- */
/* O body recebe tema-claro (portal, em alta, contas) ou tema-games (seção Games e Tecnologia). */
.tema-claro{
  --bg:#FFFFFF; --surface:#F6F4F1; --surface-2:#ECE8E3; --line:#E2DDD6;
  --ink:#16130F; --ink-2:#4A443D; --ink-3:#6B635A;
  --pink:#C8102E; --orange:#C2510F; --gold:#A86A12; --violet:#5B3FD1; --cyan:#0B6E78;
  --ok:#137A45; --warn:#9A5800; --danger:#B42318;
  --sunset:linear-gradient(90deg,#C8102E,#E0661A);
  --danger-bg:rgba(180,35,24,.08); --ok-bg:rgba(19,122,69,.08);
}
.tema-claro .site-header{ background:rgba(255,255,255,.94); }
.tema-claro .topbar{ background:var(--ink); color:#E9E4DD; border-bottom:0; }
.tema-claro .btn,.tema-claro .chip[aria-pressed="true"],.tema-claro .skip-link,.tema-claro .csort__btn[aria-pressed="true"],
.tema-claro .btn--danger,.tema-claro .avatar,.tema-claro .field__err::before,.tema-claro .avatar-edit__tag{ color:#fff; }
.tema-claro .btn--ghost{ color:var(--ink); }
.tema-claro .placeholder-empresa{ color:#fff; }
.tema-claro .comment.is-new{ background:linear-gradient(90deg,rgba(200,16,46,.07),transparent); }

/* ---------- Capas com foto ---------- */
.cover--foto{ background:var(--surface-2); }
.cover--foto img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; }
.cover--foto::after{ background:linear-gradient(180deg,rgba(0,0,0,0) 55%,rgba(0,0,0,.38)); }
.cover--card{ --ratio:16/9; }
.cover--card .cover__label{ display:none; }
.lead:hover .cover--foto img,.card:hover .cover--foto img{ transform:scale(1.03); }
.cover--foto img{ transition:transform .5s var(--ease); }
.post-cover .cover--wide{ --ratio:16/9; }
@media (min-width:640px){ .post-cover .cover--wide{ --ratio:2/1; } }
.post-cover__cap{ margin-top:var(--s2); font-size:.8125rem; line-height:1.4; color:var(--ink-3); }
.post-cover__cap a{ text-decoration:underline; text-underline-offset:2px; }

/* ---------- Home do portal: blocos por seção ---------- */
.home-col{ display:grid; gap:var(--s7); min-width:0; align-content:start; }
.secao-bloco__head{ display:flex; justify-content:space-between; align-items:baseline; gap:var(--s3); border-bottom:2px solid var(--ink); padding-bottom:var(--s2); margin-bottom:var(--s5); }
.secao-bloco__head .section-title{ margin:0; }
.secao-bloco__head .section-title a:hover{ color:var(--pink); }
.secao-bloco__mais{ font:600 .875rem var(--f-ui); color:var(--pink); white-space:nowrap; }
.secao-bloco__mais:hover{ text-decoration:underline; }
.cards{ display:grid; gap:var(--s6) var(--s5); }
@media (min-width:640px){ .cards{ grid-template-columns:1fr 1fr; } }
@media (min-width:900px){ .cards{ grid-template-columns:repeat(3,1fr); } }
.card{ display:grid; gap:var(--s2); align-content:start; min-width:0; }
.card__thumb{ display:block; margin-bottom:var(--s1); }
.card__title{ font-family:var(--f-head); font-weight:700; line-height:1.2; font-size:1.1875rem; letter-spacing:-.005em; }
.card:hover .card__title{ text-decoration:underline; text-decoration-color:var(--pink); text-decoration-thickness:2px; text-underline-offset:4px; }
.card__dek{ color:var(--ink-2); font-size:.9375rem; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
/* bloco de games dentro da home clara: faixa escura com as cores da seção */
.secao-bloco--games{
  --bg:#0C0916; --surface:#151022; --surface-2:#1D1630; --line:#2E2548;
  --ink:#F4EFFF; --ink-2:#BDB2DC; --ink-3:#9489B8; --pink:#FF4D94; --orange:#FF9A3C; --ok:#5CF2C0; --warn:#FFC46B;
  background:var(--bg); color:var(--ink); padding:var(--s5) var(--s4) var(--s6); border-radius:var(--r2);
}
@media (min-width:640px){ .secao-bloco--games{ padding:var(--s6); } }
.hero--simples .wrap{ grid-template-columns:1fr; }
.empty-sec{ padding:var(--s6) 0; color:var(--ink-2); border-top:1px solid var(--line); }

/* ---------- Produto (Publicidade) dentro da matéria ---------- */
.produto{ font-family:var(--f-ui); border:1px solid var(--line); border-radius:var(--r2); background:var(--surface); padding:var(--s3) var(--s4) var(--s4); transition:border-color .2s; }
.produto:hover{ border-color:var(--pink); }
.produto__selo{ display:block; font:600 .625rem/1 var(--f-ui); letter-spacing:.14em; text-transform:uppercase; color:var(--ink-3); margin-bottom:var(--s3); }
.produto__in{ display:grid; grid-template-columns:96px 1fr; gap:var(--s4); align-items:center; text-decoration:none !important; color:var(--ink) !important; }
@media (min-width:640px){ .produto__in{ grid-template-columns:150px 1fr; gap:var(--s5); } }
.produto__img{ width:100%; height:auto; aspect-ratio:1; object-fit:cover; border-radius:var(--r1); background:#fff; }
.produto__txt{ display:grid; gap:6px; min-width:0; }
.produto__nome{ font-family:var(--f-head); font-weight:700; font-size:1.125rem; line-height:1.2; }
.produto__chamada{ color:var(--ink-2); font-size:.9375rem; line-height:1.4; }
.produto__preco{ display:block; font-size:.875rem; color:var(--ink-3); }
.produto__preco b{ font-size:1.25rem; color:var(--ink); font-weight:800; }
.produto__btn{ justify-self:start; min-height:40px; margin-top:var(--s1); }
.box__selo{ font:600 .625rem/1 var(--f-ui); letter-spacing:.14em; text-transform:uppercase; color:var(--ink-3); margin:calc(-1 * var(--s2)) 0 var(--s3); }
.mini--produto img{ width:56px; height:56px; flex:none; object-fit:cover; border-radius:var(--r1); background:#fff; }
.mini--produto .produto__preco{ margin-top:2px; font-size:.75rem; }
.mini--produto .produto__preco b{ font-size:.9375rem; }
.card .meta .reading{ display:none; }

/* ==========================================================================
   IDENTIDADE CenterDrop v3 (2026-10-25): creme + marinho, laranja e limão,
   contorno forte com sombra deslocada ("adesivo"). Vale para o portal claro;
   a seção Games mantém o escuro, só herda a fonte e a marca.
   ========================================================================== */
:root{ --r-card:14px; }
.tema-claro{
  --bg:#FFF6E8; --surface:#FFFFFF; --surface-2:#FCE9CF; --line:#EBD9BF;
  --ink:#1B1D3F; --ink-2:#46486B; --ink-3:#6A6680;
  --pink:#D23F0B;            /* laranja de texto (contraste ok no creme) */
  --laranja:#FF6A2B; --limao:#D6F26B; --orange:#B8530A; --cyan:#2C3FD9;
  --sunset:linear-gradient(90deg,#FF6A2B,#FFB13B);
  --borda:2px solid var(--ink); --sombra:4px 4px 0 var(--ink);
}
/* marca: gota + Center<i>Drop</i> */
.brand{ align-items:center; gap:4px; font-weight:800; letter-spacing:-.03em; }
.brand__gota{ width:22px; height:22px; flex:none; margin-right:4px; fill:var(--laranja,#FF4D94); }
.brand__brilho{ fill:none; stroke:#fff; stroke-width:1.6; stroke-linecap:round; opacity:.85; }
.brand i{ font-style:normal; color:var(--laranja,#FF4D94); }
.tema-claro .brand i{ color:var(--pink); }
.brand b{ margin-left:6px; padding:3px 7px 2px; border-radius:var(--rp); background:var(--ink); color:var(--bg); letter-spacing:.12em; }
.tema-games .brand b{ background:var(--pink); color:#1A0B2E; }
.hero-title,.post-title,.lead__title,.card__title,.story__title,.story-compact__title,.section-title,.mini__title{ letter-spacing:-.025em; }

/* cabeçalho e topo */
.tema-claro .topbar{ background:var(--ink); color:#F6E7CF; }
.tema-claro .site-header{ background:rgba(255,246,232,.95); border-bottom:var(--borda); }
.tema-claro .site-header::after{ display:none; }
.tema-claro .nav__link{ color:var(--ink-2); }
.tema-claro .nav__link:hover,.tema-claro .nav__link[aria-current="page"]{ color:var(--ink); border-color:var(--laranja); }
.tema-claro .catbar{ background:var(--bg); border-bottom:var(--borda); }
.tema-claro .progress{ background:var(--laranja); }

/* rótulos de assunto viram etiquetas */
.tema-claro .kicker{ background:var(--limao); color:var(--ink); padding:4px 8px 3px; border-radius:var(--rp); letter-spacing:.08em; justify-self:start; }
.tema-claro .secao-bloco--games .kicker{ background:transparent; color:var(--pink); padding:0; }
.tema-claro .cover__label{ background:var(--ink); color:#fff; padding:4px 8px; border-radius:var(--rp); text-shadow:none; left:10px; top:10px; }

/* imagens e cartões com contorno + sombra */
.tema-claro .cover{ border-radius:var(--r-card); }
.tema-claro .lead .cover,.tema-claro .card .cover{ border:var(--borda); box-shadow:var(--sombra); }
.tema-claro .story .cover,.tema-claro .story-compact .cover,.tema-claro .mini .cover{ border:2px solid var(--ink); border-radius:10px; }
.tema-claro .lead:hover .cover,.tema-claro .card:hover .cover{ transform:translate(-2px,-2px); box-shadow:6px 6px 0 var(--laranja); }
.tema-claro .lead .cover,.tema-claro .card .cover{ transition:transform .25s var(--ease),box-shadow .25s var(--ease); }
.tema-claro .cover--foto img{ transition:none; }
.tema-claro .lead:hover .cover--foto img,.tema-claro .card:hover .cover--foto img{ transform:none; }
.tema-claro .lead:hover .lead__title,.tema-claro .card:hover .card__title,.tema-claro .story:hover .story__title,
.tema-claro .story-compact:hover .story-compact__title,.tema-claro .mini:hover .mini__title{ text-decoration:none; background:linear-gradient(transparent 62%,var(--limao) 62%); }
.tema-claro .lead-grid{ border-bottom:var(--borda); }

/* cabeçalho de seção na home: título como adesivo */
.tema-claro .secao-bloco__head{ border-bottom:var(--borda); }
.tema-claro .secao-bloco--claro .section-title a{ display:inline-block; background:var(--laranja); color:var(--ink); border:var(--borda); box-shadow:3px 3px 0 var(--ink); border-radius:10px; padding:2px 12px 4px; transform:rotate(-1.5deg); }
.tema-claro .secao-bloco--claro .section-title a:hover{ color:var(--ink); background:var(--limao); }
.tema-claro .secao-bloco--games{ border:var(--borda); box-shadow:6px 6px 0 var(--laranja); border-radius:var(--r-card); }
.tema-claro .secao-bloco--games .secao-bloco__head{ border-bottom:1px solid var(--line); }
.tema-claro .secao-bloco__mais{ color:var(--ink); text-decoration:underline; text-decoration-color:var(--laranja); text-decoration-thickness:3px; text-underline-offset:4px; }

/* caixas laterais, botões, filtros */
.tema-claro .box{ background:var(--surface); border:var(--borda); border-radius:var(--r-card); box-shadow:var(--sombra); }
.tema-claro .box__title{ border-image:none; border-bottom:2px dashed var(--ink); }
.tema-claro .btn{ background:var(--ink); border-color:var(--ink); color:#FFF6E8; box-shadow:3px 3px 0 var(--laranja); }
.tema-claro .btn:hover{ filter:none; transform:translate(-1px,-1px); box-shadow:4px 4px 0 var(--laranja); }
.tema-claro .btn--ghost{ background:var(--surface); color:var(--ink); box-shadow:3px 3px 0 var(--ink); }
.tema-claro .chip{ border:2px solid var(--ink); color:var(--ink); background:var(--surface); }
.tema-claro .chip[aria-pressed="true"]{ background:var(--ink); border-color:var(--ink); color:#FFF6E8; }
.tema-claro .search input{ border:2px solid var(--ink); background:var(--surface); }
.tema-claro .share__btn{ border:2px solid var(--ink); color:var(--ink); }
.tema-claro .feed-tools{ background:var(--bg); }

/* matéria */
.tema-claro .post-cover .cover{ border:var(--borda); box-shadow:6px 6px 0 var(--ink); }
.tema-claro .prose > p:first-of-type::first-letter{ color:var(--ink); background:var(--limao); border-radius:8px; padding:.06em .14em .02em; margin-right:.12em; }
.tema-claro .prose a{ text-decoration-color:var(--laranja); }
.tema-claro .also{ background:var(--surface); border:var(--borda); border-left:8px solid var(--laranja); border-radius:var(--r-card); }
.tema-claro .also__label{ color:var(--pink); }
.tema-claro .byline{ border-block:2px dashed var(--line); }
.tema-claro .avatar{ background:var(--laranja); color:var(--ink); }
.tema-claro .post-nav a{ border:var(--borda); border-radius:var(--r-card); background:var(--surface); }
.tema-claro .post-nav a:hover{ box-shadow:var(--sombra); }

/* produto (Publicidade): adesivo limão */
.tema-claro .produto{ background:var(--surface); border:var(--borda); border-radius:var(--r-card); box-shadow:5px 5px 0 var(--laranja); }
.tema-claro .produto:hover{ border-color:var(--ink); box-shadow:7px 7px 0 var(--laranja); }
.tema-claro .produto__img{ border:2px solid var(--ink); border-radius:10px; }
.tema-claro .produto__selo{ display:inline-block; background:var(--surface-2); color:var(--ink-2); padding:4px 8px; border-radius:var(--rp); }

/* rodapé marinho */
.tema-claro .site-footer{ background:var(--ink); color:#CFC9DD; border-top:0; }
.tema-claro .site-footer a{ color:#FFF6E8; text-decoration-color:var(--laranja); }
.tema-claro .site-footer .brand{ color:#FFF6E8; }
.tema-claro .site-footer .brand i{ color:var(--laranja); }
.tema-claro .site-footer .brand b{ background:var(--laranja); color:var(--ink); }
.brand{ gap:0; } .brand__gota{ margin-right:6px; } .brand b{ margin-left:8px; }

/* ---------- SEO: perguntas frequentes e autor ---------- */
.faq{ margin-top:var(--s6); display:grid; gap:var(--s2); }
.faq h2{ font-family:var(--f-head); font-weight:800; font-size:1.5rem; margin-bottom:var(--s2); }
.faq__item{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r2); }
.tema-claro .faq__item{ border:2px solid var(--ink); border-radius:12px; }
.faq__item summary{ cursor:pointer; list-style:none; padding:var(--s3) var(--s4); font:700 1rem/1.35 var(--f-ui); display:flex; justify-content:space-between; gap:var(--s3); min-height:48px; align-items:center; }
.faq__item summary::-webkit-details-marker{ display:none; }
.faq__item summary::after{ content:"+"; font-size:1.25rem; color:var(--pink); flex:none; }
.faq__item[open] summary::after{ content:"−"; }
.faq__item p{ padding:0 var(--s4) var(--s4); color:var(--ink-2); line-height:1.6; }
a.byline__who:hover{ text-decoration:underline; text-underline-offset:3px; }