:root{
  --bg0:#000000; --bg1:#000000;          /* modo escuro: preto de verdade */
  --panel:rgba(255,255,255,.045);
  --panel2:rgba(255,255,255,.075);
  --line:rgba(255,255,255,.09);
  --line2:rgba(255,255,255,.16);
  --txt:#ededed; --dim:#a1a1aa; --dim2:#71717a;
  --acc:#7d5cff; --acc2:#3d7bff;
  --ok:#2fd48f; --warn:#f5b444; --dang:#ff6b7d;
  --r:16px;

  /* superfícies em camadas — o tema claro redefine só estas */
  --sf1:rgba(255,255,255,.025);   /* fundo de painel interno   */
  --sf2:rgba(255,255,255,.05);    /* card, input               */
  --sf3:rgba(255,255,255,.07);    /* chip, hover leve          */
  --sf4:rgba(255,255,255,.10);    /* hover forte, divisória    */
  --sf5:rgba(255,255,255,.18);    /* borda forte, scrollbar    */
  --sh1:rgba(0,0,0,.30);          /* sombra rasa               */
  --sh2:rgba(0,0,0,.60);
  --sh3:rgba(0,0,0,.90);          /* sombra profunda           */
  --pop:#111111;  --pop2:#1f1f1f; /* popover, menu, option     */
  --mdl1:#141414; --mdl2:#0b0b0b; /* gradiente do modal        */

  /* texto de status sobre tint */
  --ok-fg:#5fe3ac; --dang-fg:#ff9aa8; --warn-fg:#f7c76c;
  --acc-fg:#c3b0ff; --acc2-fg:#8fb6ff;

  /* tints de status (fundo dos chips) */
  --ok-bg:rgba(47,212,143,.14);   --ok-bd:rgba(47,212,143,.30);
  --warn-bg:rgba(245,180,68,.14); --warn-bd:rgba(245,180,68,.30);
  --dang-bg:rgba(255,107,125,.14);--dang-bd:rgba(255,107,125,.30);
  --acc-bg:rgba(125,92,255,.15);  --acc-bd:rgba(125,92,255,.35);

  --aurora1:transparent; --aurora2:transparent; --aurora3:transparent;   /* sem brilho roxo no fundo */
  --app-bg:#000000;
  --chrome:#050505;               /* fundo sólido da topbar e da sidebar */
  --doc-bg:#fbfaf7; --doc-fg:#191919;
  color-scheme:dark;
}

/* ============ TEMA CLARO ============ */
:root[data-theme="light"]{
  --bg0:#eef0f6; --bg1:#f7f8fc;
  --panel:rgba(255,255,255,.86);
  --panel2:rgba(255,255,255,1);
  --line:rgba(19,22,40,.10);
  --line2:rgba(19,22,40,.20);
  --txt:#171a2b; --dim:#5a6180; --dim2:#8a90ab;

  --sf1:rgba(19,22,40,.028);
  --sf2:rgba(255,255,255,.92);
  --sf3:rgba(19,22,40,.055);
  --sf4:rgba(19,22,40,.085);
  --sf5:rgba(19,22,40,.18);
  --sh1:rgba(30,38,70,.10);
  --sh2:rgba(30,38,70,.16);
  --sh3:rgba(30,38,70,.20);
  --pop:#ffffff; --pop2:#eceafd;
  --mdl1:#ffffff; --mdl2:#f6f6fd;

  --ok-fg:#0b7a4d; --dang-fg:#c02a3d; --warn-fg:#8c5a06;
  --acc-fg:#5a3fd6; --acc2-fg:#1f57c9;

  --ok-bg:rgba(47,212,143,.16);   --ok-bd:rgba(15,157,99,.34);
  --warn-bg:rgba(245,180,68,.20); --warn-bd:rgba(181,117,6,.32);
  --dang-bg:rgba(255,107,125,.16);--dang-bd:rgba(192,42,61,.30);
  --acc-bg:rgba(125,92,255,.12);  --acc-bd:rgba(125,92,255,.34);

  --aurora1:rgba(125,92,255,.16); --aurora2:rgba(61,123,255,.13); --aurora3:rgba(160,72,255,.10);
  --app-bg:rgba(255,255,255,.72);
  --chrome:#ffffff;
  --doc-bg:#ffffff; --doc-fg:#191919;
  color-scheme:light;
}
*{box-sizing:border-box}
html,body{min-height:100%}   /* height:100% travava a altura do documento e recortava o conteúdo */
body{
  margin:0;color:var(--txt);
  font:14px/1.55 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
  background:var(--bg0);
}
body::before{
  content:"";position:fixed;inset:0;z-index:-1;
  background:
    radial-gradient(900px 620px at 12% -8%, var(--aurora1), transparent 62%),
    radial-gradient(760px 540px at 92% 4%, var(--aurora2), transparent 60%),
    radial-gradient(680px 520px at 78% 96%, var(--aurora3), transparent 62%),
    linear-gradient(180deg,var(--bg1),var(--bg0) 62%);
}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-thumb{background:rgba(255,255,255,.11);border-radius:9px}
::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.2)}
::-webkit-scrollbar-track{background:transparent}
::selection{background:rgba(125,92,255,.4)}

/* o app ocupa a tela inteira — sem moldura, sem cantos arredondados */
/* Quem rola é a PÁGINA, não uma caixa interna. Sem overflow:hidden aqui:
   caixa de altura fixa com filhos flex já cortou o topo do conteúdo duas vezes. */
/* Quem rola é a PÁGINA. Sem altura travada, sem overflow:hidden e sem backdrop-filter aqui:
   filtro no container cria bloco de contenção e quebra o sticky da topbar e da sidebar. */
.app{
  display:flex;align-items:flex-start;min-height:100vh;
  background:var(--app-bg);
}