/* ============================================================================
   Loopi Blanc — modo claro monocromático.
   Não é o modo escuro invertido: é outra pele. Sem cor, sem gradientes, sem
   neon. Preto, branco, e vidro em excesso. Tudo sai das primitivas declaradas
   em app/upgrade.css — este ficheiro só as redefine e trata dos casos em que
   o escuro assumia luz própria (glow, aurora, gradientes de marca).
   ========================================================================= */

[data-theme="light"]{
  /* --- primitivas --- */
  --lp-fg:16,16,18;           /* texto: quase-preto */
  --lp-w:16,16,18;            /* preenchimentos translúcidos passam a lavagens */
  --lp-ln:16,16,18;           /* hairlines a preto */
  --lp-br:16,16,18;           /* o acento é preto */
  --lp-br2:16,16,18;
  --lp-scrim:255,255,255;     /* véus e barras fixas a branco */
  --lp-sunk:16,16,18;
  --lp-warn:16,16,18;--lp-bad:16,16,18;--lp-info:16,16,18;
  --lp-s0:#E9E9E7;
  --lp-s1:#F3F3F1;
  --lp-s2:#FAFAF9;
  --lp-s3:#FFFFFF;
  --lp-s4:#101012;
  --lp-s4b:255,255,255;       /* painéis flutuantes: vidro branco */
  --lp-br-solid:#101012;
  --lp-br-lit:#101012;
  --lp-br-soft:#5A5A60;
  --lp-on-br:#FFFFFF;
  --lp-fg-solid:#101012;
  --lp-knob:#FFFFFF;
  --lp-bad-solid:#101012;--lp-bad-fg:#5A5A60;--lp-warn-fg:#5A5A60;--lp-info-fg:#5A5A60;
  /* os degraus sobem: sobre #F3F3F1 nenhuma opacidade abaixo de ~.66 chega
     aos 4,5:1, por muito escura que seja a tinta */
  --lp-t1:rgba(16,16,18,.92);
  --lp-t2:rgba(16,16,18,.84);
  --lp-t3:rgba(16,16,18,.78);
  --lp-t4:rgba(16,16,18,.72);
  --lp-t5:rgba(16,16,18,.66);

  /* --- superfícies compostas: planas, nunca degradês --- */
  --lp-hair:rgba(16,16,18,.11);
  --lp-hair-lit:rgba(16,16,18,.22);
  /* peles claras: vidro sobre papel, poço em tinta a 4,5% — nunca preto */
  --lp-skin-card:linear-gradient(180deg,rgba(255,255,255,.88),rgba(255,255,255,.62));
  --lp-skin-glass:linear-gradient(180deg,rgba(255,255,255,.8),rgba(255,255,255,.52));
  --lp-skin-sunk:rgba(16,16,18,.045);
  --lp-skin-brand:linear-gradient(180deg,rgba(16,16,18,.055),rgba(16,16,18,.014));
  --lp-skin-bevel:inset 0 1px 0 rgba(255,255,255,.9);
  --lp-skin-bevel-hi:inset 0 1px 0 rgba(255,255,255,.95);
  --lp-skin-bevel-sunk:inset 0 1px 0 rgba(16,16,18,.05);
  --lp-skin-bevel-br:inset 0 1px 0 rgba(255,255,255,.9);
  --lp-skin-drop:0 22px 44px -34px rgba(16,16,18,.2);
  --lp-skin-drop-hi:0 30px 60px -40px rgba(16,16,18,.24);
  --lp-fill:rgba(255,255,255,.62);
  --lp-fill-hi:rgba(255,255,255,.82);
  --lp-rule:rgba(16,16,18,.16);
  --lp-mark:rgba(16,16,18,.34);

  /* --- tokens do design system --- */
  --green-100:#101012;--green-200:#3A3A40;--green-300:#26262B;
  --green-400:#101012;--green-500:#101012;--green-600:#000;
  --acid-400:#101012;
  --text-strong:#0B0B0D;
  --text-body:rgba(16,16,18,.82);
  --text-muted:rgba(16,16,18,.74);
  --text-faint:rgba(16,16,18,.7);
  --text-link:#101012;--text-link-hover:#5A5A60;
  --surface-card:rgba(255,255,255,.62);
  --surface-glass:rgba(255,255,255,.55);
  --surface-sunken:rgba(16,16,18,.04);
  --surface-brand-soft:rgba(16,16,18,.06);
  --border-hairline:rgba(16,16,18,.11);
  --border-glass:rgba(16,16,18,.14);
  --border-strong:rgba(16,16,18,.24);
  --border-brand:rgba(16,16,18,.4);
  --border-brand-soft:rgba(16,16,18,.18);
  --text-on-brand:#FFFFFF;
  --ink-1000:#F3F3F1;--ink-950:#F3F3F1;--ink-900:#FAFAF9;--ink-850:#FFFFFF;
  --surface-canvas:#F3F3F1;--surface-canvas-alt:#FAFAF9;
  --status-success:#101012;--status-warning:#101012;--status-danger:#101012;--status-info:#101012;
  --chrome-100:#0B0B0D;--chrome-200:#2A2A2F;--chrome-300:#55555A;

  /* gradientes → chapas planas */
  --grad-brand:#101012;
  --grad-canvas:#F3F3F1;
  --grad-glass:rgba(255,255,255,.62);
  --grad-metal:#101012;
  --grad-scrim-b:rgba(243,243,241,.9);
  --grad-scrim-t:rgba(243,243,241,.9);

  /* gradientes do DS que ainda carregam verde */
  --grad-brand-soft:rgba(16,16,18,.06);
  --grad-liquid:#3A3A40;
  --grad-halo:rgba(16,16,18,.06);
  --grad-hairline:rgba(16,16,18,.16);
  --grad-chrome-text:#0B0B0D;
  --wire-grid:linear-gradient(rgba(16,16,18,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(16,16,18,.05) 1px,transparent 1px);
  --surface-brand:#101012;--surface-inverse:#101012;--focus-ring:#101012;
  --status-positive:#101012;

  /* nada brilha no claro */
  --glow-xs:none;--glow-sm:none;--glow-md:none;--glow-lg:none;--glow-xl:none;
  --glow-text:none;--glow-ring:0 0 0 3px rgba(16,16,18,.12);
  --bevel-top:inset 0 1px 0 rgba(255,255,255,.9);
  --bevel-brand:inset 0 1px 0 rgba(255,255,255,.24);
  --elev-card:0 1px 2px rgba(16,16,18,.04),0 12px 30px -20px rgba(16,16,18,.18);
  --shadow-xs:0 1px 2px rgba(16,16,18,.05);
  --shadow-sm:0 2px 8px -4px rgba(16,16,18,.12);
  --shadow-md:0 12px 30px -18px rgba(16,16,18,.22);
  --shadow-lg:0 20px 44px -22px rgba(16,16,18,.24);
  --shadow-xl:0 28px 64px -28px rgba(16,16,18,.26);
  --blur-glass:blur(22px) saturate(120%);
}

[data-theme="light"] body{background:var(--lp-s1);color:var(--text-body)}
[data-theme="light"] ::selection{background:rgba(16,16,18,.14);color:#0B0B0D}
[data-theme="light"] :focus-visible{outline-color:#101012}
[data-theme="light"] ::-webkit-scrollbar-thumb{background:rgba(16,16,18,.16)}
[data-theme="light"] ::-webkit-scrollbar-thumb:hover{background:rgba(16,16,18,.3)}

/* --- vidro em excesso: toda a superfície de conteúdo é fosca --------------- */
[data-theme="light"] .lp-tile,
[data-theme="light"] .lp-glow-in,
[data-theme="light"] .lp-rwcard,
[data-theme="light"] .lp-pjcard,
[data-theme="light"] .lp-igcard,
[data-theme="light"] .lp-step,
[data-theme="light"] .lp-admcard,
[data-theme="light"] .lp-admstat,
[data-theme="light"] .lp-admkpi{
  background:rgba(255,255,255,.6);
  backdrop-filter:blur(26px) saturate(115%);
  -webkit-backdrop-filter:blur(26px) saturate(115%);
  border-color:rgba(16,16,18,.1);
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 14px 34px -26px rgba(16,16,18,.34)
}
[data-theme="light"] .lp-tile:hover,
[data-theme="light"] .lp-glow:hover .lp-glow-in,
[data-theme="light"] .lp-rwcard:hover,
[data-theme="light"] .lp-pjcard:hover,
[data-theme="light"] .lp-igcard:hover{background:rgba(255,255,255,.86);border-color:rgba(16,16,18,.2)}

[data-theme="light"] .lp-header .lp-bar,
[data-theme="light"] .lp-header.frosted .lp-bar{
  background:rgba(255,255,255,.6);
  backdrop-filter:blur(28px) saturate(120%);
  -webkit-backdrop-filter:blur(28px) saturate(120%);
  border-color:rgba(16,16,18,.1);
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 18px 40px -30px rgba(16,16,18,.4)
}
/* modais e popups do design system (Dialog, Tooltip) escrevem o fundo escuro
   em style inline — no claro passam a vidro branco */
[data-theme="light"] [style*="var(--lp-s4b)"],
[data-theme="light"] [role="dialog"],
[data-theme="light"] .lp-wapanel,
[data-theme="light"] .lp-teaser,
[data-theme="light"] .lp-mega,
[data-theme="light"] .lp-sheet,
[data-theme="light"] .lp-ask,
[data-theme="light"] .lp-orb-pop,
[data-theme="light"] .lp-toolpop,
[data-theme="light"] .lp-consent,
[data-theme="light"] .lp-dtip,
[data-theme="light"] .lp-admtip,
[data-theme="light"] .lp-admbctip,
[data-theme="light"] .lp-admdrawer{
  background:rgba(255,255,255,.86)!important;
  backdrop-filter:blur(30px) saturate(120%);
  -webkit-backdrop-filter:blur(30px) saturate(120%);
  border-color:rgba(16,16,18,.12);
  color:var(--text-body)
}
[data-theme="light"] .lp-scrim,[data-theme="light"] .lp-admburgerscrim{background:rgba(243,243,241,.6);backdrop-filter:blur(6px)}
[data-theme="light"] .lp-foot,[data-theme="light"] .lp-admside,[data-theme="light"] .lp-admtop{background:rgba(255,255,255,.55);backdrop-filter:blur(26px)}
[data-theme="light"] .lp-announce>div{background:#101012;border-bottom:0}
[data-theme="light"] .lp-announce span,[data-theme="light"] .lp-announce a{color:#F3F3F1}

/* --- gradientes de secção → chapas planas --------------------------------- */
/* As bandas de secção chamam-se .lp-band / .lp-lift / .lp-deep — os selectores
   .lp-section.band|deep|lift nunca casaram, e o campo "elevado" continuava a
   montar o seu radial a partir de --lp-s4, que no claro é quase-preto: era a
   chapa escura sob texto escuro nos Resultados e nos depoimentos. */
[data-theme="light"] .lp-band{background:var(--lp-s2)}
[data-theme="light"] .lp-deep{background:var(--lp-s0)}
[data-theme="light"] .lp-lift{background:radial-gradient(120% 120% at 50% -10%,#FFF 0%,var(--lp-s2) 46%,var(--lp-s1) 100%)}
/* no campo claro o vidro branco a 55% desaparece: as superfícies internas
   passam à pele de cartão, com hairline visível */
[data-theme="light"] .lp-lift .lp-ledger>*,
[data-theme="light"] .lp-lift .lp-step,
[data-theme="light"] .lp-lift .lp-tile{background:var(--lp-skin-card);border-color:rgba(16,16,18,.12)}
[data-theme="light"] .lp-lift .lp-ledger>*:hover,
[data-theme="light"] .lp-lift .lp-step.lit,
[data-theme="light"] .lp-lift .lp-tile:hover,
[data-theme="light"] .lp-lift a:hover .lp-tile{background:rgba(255,255,255,.96);border-color:rgba(16,16,18,.22)}
[data-theme="light"] .lp-lift>.lp-flow{display:none}
[data-theme="light"] .lp-lift>.lp-mesh{opacity:.22}
[data-theme="light"] .lp-band>.lp-wash,
[data-theme="light"] .lp-hero::after,
[data-theme="light"] .lp-scan,
[data-theme="light"] .lp-halo{display:none}
[data-theme="light"] .lp-canvas::after,[data-theme="light"] .lp-tile::after{opacity:.02}

/* aurora: chapa clara, e os blobs internos (nós sem classe, com gradientes
   inline) são dessaturados a partir do contentor */
[data-theme="light"] .lp-aura{background:var(--lp-s1)!important}
[data-theme="light"] .lp-aura.liquid{background:var(--lp-s0)!important}
/* Os blobs de aurora e o corpo líquido não pintam no claro. Estavam apenas
   escondidos atrás de filter+opacity — e um filtro sobre um blob saturado é
   frágil (blend modes, compositores diferentes, capturas): bastava um contexto
   que não o honrasse para a chapa verde reaparecer sob texto escuro. No claro
   a luz ambiente não tem papel: a chapa é lisa. */
/* Regra de ouro: esconder só camadas sem conteúdo. O .lp-aura dentro de
   .lp-deep É o invólucro do CTA/herói (AuroraBackdrop envolve os filhos), por
   isso nele troca-se a pintura, nunca o display. */
/* Critério: :empty distingue a camada decorativa do invólucro de conteúdo — os
   blobs são spans/divs vazios (a qualquer profundidade), o .lp-aura dentro de
   .lp-deep é o invólucro do CTA/herói e leva os filhos todos. Esconder por
   posição no DOM apagava a secção; esconder por vacuidade não pode. */
[data-theme="light"] .lp-aura [style*="radial-gradient"]:empty,
[data-theme="light"] .lp-aura [style*="conic-gradient"]:empty,
[data-theme="light"] .lp-orbwrap::before,
[data-theme="light"] .lp-liquid{display:none!important}
/* invólucros: troca-se a pintura, o conteúdo fica */
[data-theme="light"] .lp-deep>div[style*="radial-gradient"],
[data-theme="light"] .lp-aura[style*="radial-gradient"],
[data-theme="light"] .lp-aura div[style*="radial-gradient"]:not(:empty){background:var(--lp-s0)!important}
/* Resultados: no claro o painel e as linhas caíam no mesmo tom do campo e o
   bloco lia-se como um rectângulo cinzento. Passa a cartão de vidro sobre
   papel, com as linhas um degrau abaixo e hairlines que se vêem. */
[data-theme="light"] .lp-res{background:rgba(16,16,18,.12);box-shadow:var(--lp-skin-drop)}
[data-theme="light"] .lp-resmain{background:linear-gradient(160deg,#FFF,var(--lp-s2) 62%)}
[data-theme="light"] .lp-reslist{background:rgba(16,16,18,.12)}
[data-theme="light"] .lp-resrow{background:rgba(255,255,255,.86)}
[data-theme="light"] .lp-resrow:hover{background:#FFF}
[data-theme="light"] .lp-resrow.on{background:linear-gradient(90deg,rgba(16,16,18,.07),#FFF 82%)}
[data-theme="light"] .lp-resbar{background:rgba(16,16,18,.12)}
[data-theme="light"] .lp-rwq{color:var(--lp-t5)}
[data-theme="light"] .lp-wire,[data-theme="light"] .lp-grid-bg{opacity:.05;filter:grayscale(1)}
/* LiquidOrb do DS desenha um corpo cónico verde por baixo do vidro */
[data-theme="light"] .lp-mcard-orb,
[data-theme="light"] .lp-orb,
[data-theme="light"] .lp-heroorb{filter:grayscale(1) contrast(.9) opacity(.42)}

/* --- acções: preto sólido, hover inverte ---------------------------------- */
[data-theme="light"] .lp-chip.on,
[data-theme="light"] .lp-pjtab.on,
[data-theme="light"] .lp-admchip.on,
[data-theme="light"] .lp-admtabs button.on,
[data-theme="light"] .lp-admcald button.on{background:#101012;color:#FFF;border-color:#101012}
[data-theme="light"] .lp-linkarrow,[data-theme="light"] .lp-kicker{color:#101012}
[data-theme="light"] .lp-planrule,
[data-theme="light"] .lp-progress,
[data-theme="light"] .lp-admbcbar,
[data-theme="light"] .lp-admsplitbar i,
[data-theme="light"] .lp-resbar i,
[data-theme="light"] .lp-admbartrack i{background:#101012;box-shadow:none}
[data-theme="light"] .lp-igcta{background:#101012;color:#FFF}
[data-theme="light"] .lp-igcta:hover{background:#3A3A40;color:#FFF}
[data-theme="light"] .lp-pjlive,[data-theme="light"] .lp-admdot.ok,[data-theme="light"] .lp-footstatus i{background:#101012;box-shadow:0 0 0 3px rgba(16,16,18,.1)}
[data-theme="light"] .lp-footstatus{background:rgba(16,16,18,.05);border-color:rgba(16,16,18,.12);color:#101012}

/* a moldura de luz vira uma hairline que escurece — não gira, não brilha */
[data-theme="light"] .lp-glow{background:rgba(16,16,18,.1)}
[data-theme="light"] .lp-glow.on{background:rgba(16,16,18,.4)}
[data-theme="light"] .lp-glow::before,[data-theme="light"] .lp-igframe::before{display:none}
[data-theme="light"] .lp-glow:hover{background:rgba(16,16,18,.34)}
[data-theme="light"] .lp-igframe{background:rgba(16,16,18,.1)}

/* ChromeText escreve o degradê em style inline (background-clip:text) — no
   claro passa a tinta preta chapada, que é o único acento permitido */
[data-theme="light"] .lp-word>span[style*="linear-gradient"],
[data-theme="light"] h1 span[style*="background-clip"],
[data-theme="light"] h2 span[style*="linear-gradient"],
[data-theme="light"] .lp-footask span[style*="linear-gradient"]{
  background:none!important;-webkit-text-fill-color:#0B0B0D!important;color:#0B0B0D!important;animation:none!important
}

/* Os componentes do design system escrevem cor em style inline (blobs da
   aurora, tom "brand" do GlassPanel, pontos de estado, sweeps, WirePlane).
   Não são editáveis a partir daqui, por isso são dessaturados no sítio —
   no claro tudo é monocromático, logo não se perde informação. */
[data-theme="light"] [style*="0,244,155"],
[data-theme="light"] [style*="0, 244, 155"],
[data-theme="light"] [style*="20,255,169"],
[data-theme="light"] [style*="20, 255, 169"],
[data-theme="light"] [style*="255,194,75"],
[data-theme="light"] [style*="255,92,114"],
[data-theme="light"] [style*="#00F49B"],
[data-theme="light"] [style*="#14FFA9"],
[data-theme="light"] [style*="var(--grad-liquid)"]{filter:grayscale(1)}

/* --- imagens: tudo monocromático, logótipo incluído ----------------------- */
/* O alvo é o ficheiro, não o contentor: enumerar ancestrais deixava de fora
   qualquer logótipo colocado noutro sítio (era o caso da consola de IA). */
[data-theme="light"] img[src*="logo-loopi"],
[data-theme="light"] .lp-cbadge img{filter:grayscale(1) invert(1) contrast(1.15)}
[data-theme="light"] .lp-pjlogo img,
[data-theme="light"] .lp-admtileimg img,
[data-theme="light"] .lp-orb-pop img{filter:grayscale(1) contrast(1.05)}
/* a chapa do herói: os selectores anteriores não existiam no DOM, e o segundo
   plano traz blur+saturate autorado inline — daí a re-declaração explícita */
[data-theme="light"] .lp-hero-img,
[data-theme="light"] .lp-hero-img2{filter:grayscale(1) invert(1) opacity(.5)!important}
[data-theme="light"] .lp-hero-img2{filter:grayscale(1) invert(1) blur(12px) opacity(.35)!important}

/* --- formulários --------------------------------------------------------- */
[data-theme="light"] input,[data-theme="light"] select,[data-theme="light"] textarea{
  background:rgba(255,255,255,.7);border-color:rgba(16,16,18,.14);color:#0B0B0D;backdrop-filter:blur(10px)
}
[data-theme="light"] input::placeholder,[data-theme="light"] textarea::placeholder{color:rgba(16,16,18,.42)}

/* --- consola de administração -------------------------------------------- */
[data-theme="light"] .lp-adm{background:var(--lp-s1)}
[data-theme="light"] .lp-admnav.on{background:rgba(16,16,18,.07);box-shadow:none}
[data-theme="light"] .lp-admbctrack,[data-theme="light"] .lp-admsplitbar,[data-theme="light"] .lp-admbartrack{background:rgba(16,16,18,.08)}
[data-theme="light"] .lp-loginbrand{background:#101012;border-right:0}
[data-theme="light"] .lp-loginbrand *{color:#F3F3F1}
[data-theme="light"] .lp-loginglow{display:none}
[data-theme="light"] .lp-loginform,[data-theme="light"] .lp-loginsep span{background:var(--lp-s1)}

[data-theme="light"] .lp-wabtn{background:#101012;color:#FFF;border-color:rgba(16,16,18,.2);box-shadow:0 14px 34px -18px rgba(16,16,18,.5)}

/* --- botão de tema -------------------------------------------------------- */
.lp-themebtn{display:grid;place-items:center;width:44px;height:44px;flex:0 0 auto;border-radius:50%;border:1px solid var(--lp-hair);background:transparent;color:var(--text-muted);cursor:pointer;transition:color var(--t-hover),border-color var(--t-hover),background var(--t-hover)}
.lp-themebtn:hover{color:var(--text-strong);border-color:var(--lp-hair-lit)}