/* ============================================================
   AEESTG · Painel — UI v2.1 "clean" com tema claro/escuro
   O tema é controlado por html[data-theme] (js/theme.js).
   Todos os seletores usados pelo JS mantêm os mesmos nomes.
   Backup da UI v1 (dark original): ui-backup-v1/
   ============================================================ */

/* ===== Tokens: tema claro (default) ===== */
:root{
  /* superfícies */
  --bg:#f4f6f9;
  --card:#ffffff;
  --well:#f8fafc;
  --well-hover:#eef1f6;
  --border:#e6e9f0;
  --border-strong:#d3d9e3;
  --border-hover:#b9c1cf;

  /* sidebar (clara: funde-se com a UI) */
  --sb-bg:#fbfcfe;
  --sb-border:#e6e9f0;
  --sb-text:#5f6a78;
  --sb-text-hover:#111827;
  --sb-hover-bg:#eef1f6;
  --sb-active-bg:rgba(16,185,129,.12);
  --sb-active-text:#065f46;
  --sb-muted:#8b94a1;
  --sb-logo:#111827;

  /* topbar */
  --topbar-bg:rgba(255,255,255,.82);

  /* texto */
  --text:#111827;
  --text-2:#374151;
  --muted:#6b7280;

  /* marca (séries dos gráficos) */
  --brand:#10b981;
  --brand-2:#06b6d4;

  /* ações */
  --accent:#047857;
  --accent-hover:#065f46;
  --accent-fg:#ffffff;
  --danger:#dc2626;

  /* gráficos (lidos pelo analytics.js) */
  --chart-tick:#5b6472;
  --chart-grid:rgba(15,23,42,.08);
  --chart-border:#ffffff;

  /* pré-visualização (acompanha o fundo do editor TinyMCE) */
  --preview-bg:#ffffff;
  --preview-text:#111827;

  /* scrollbar */
  --scroll:#c6cdd8;

  /* foco */
  --ring:0 0 0 3px rgba(16,185,129,.22);
  --ring-border:#10b981;

  /* forma & sombra */
  --radius-sm:8px;
  --radius-md:10px;
  --radius-lg:14px;
  --shadow-1:0 1px 2px rgba(16,24,40,.05), 0 1px 3px rgba(16,24,40,.08);
  --shadow-pop:0 24px 60px rgba(16,24,40,.22);

  /* tipografia */
  --font:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --font-display:'Sora','Inter',system-ui,sans-serif;
}

/* ===== Tokens: tema escuro ===== */
html[data-theme="dark"]{
  color-scheme:dark;

  --bg:#0e1116;
  --card:#151a22;
  --well:#1a202b;
  --well-hover:#222a37;
  --border:#242b38;
  --border-strong:#31394a;
  --border-hover:#3e4757;

  --sb-bg:#10141b;
  --sb-border:#232937;
  --sb-text:#9aa4b2;
  --sb-text-hover:#eef1f5;
  --sb-hover-bg:rgba(255,255,255,.05);
  --sb-active-bg:rgba(16,185,129,.15);
  --sb-active-text:#b9f4de;
  --sb-muted:#77808d;
  --sb-logo:#eef1f5;

  --topbar-bg:rgba(16,19,26,.8);

  --text:#e8ecf2;
  --text-2:#c5cdd8;
  --muted:#8d97a5;

  --accent:#10b981;
  --accent-hover:#34d399;
  --accent-fg:#04251b;
  --danger:#f87171;

  --chart-tick:#97a1af;
  --chart-grid:rgba(255,255,255,.07);
  --chart-border:#151a22;

  --preview-bg:#12161d;
  --preview-text:#d9dfe7;

  --scroll:#39404e;

  --shadow-1:0 1px 2px rgba(0,0,0,.35), 0 6px 20px rgba(0,0,0,.25);
  --shadow-pop:0 24px 60px rgba(0,0,0,.55);
}

/* Antes do JS definir data-theme, segue a preferência do sistema (evita flash) */
@media (prefers-color-scheme:dark){
  html:not([data-theme]){
    color-scheme:dark;
    --bg:#0e1116; --card:#151a22; --well:#1a202b; --well-hover:#222a37;
    --border:#242b38; --border-strong:#31394a; --border-hover:#3e4757;
    --sb-bg:#10141b; --sb-border:#232937; --sb-text:#9aa4b2; --sb-text-hover:#eef1f5;
    --sb-hover-bg:rgba(255,255,255,.05); --sb-active-bg:rgba(16,185,129,.15);
    --sb-active-text:#b9f4de; --sb-muted:#77808d; --sb-logo:#eef1f5;
    --topbar-bg:rgba(16,19,26,.8);
    --text:#e8ecf2; --text-2:#c5cdd8; --muted:#8d97a5;
    --accent:#10b981; --accent-hover:#34d399; --accent-fg:#04251b; --danger:#f87171;
    --chart-tick:#97a1af; --chart-grid:rgba(255,255,255,.07); --chart-border:#151a22;
    --preview-bg:#12161d; --preview-text:#d9dfe7;
    --scroll:#39404e;
    --shadow-1:0 1px 2px rgba(0,0,0,.35), 0 6px 20px rgba(0,0,0,.25);
    --shadow-pop:0 24px 60px rgba(0,0,0,.55);
  }
}

/* ===== Base ===== */
*{box-sizing:border-box}
html,body{height:100%}

*{scrollbar-width:thin;scrollbar-color:var(--scroll) transparent}
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-thumb{background:var(--scroll);border-radius:999px;border:2px solid transparent;background-clip:content-box}
*::-webkit-scrollbar-track{background:transparent}

body{
  margin:0;font-family:var(--font);color:var(--text);
  font-size:14px;line-height:1.55;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  background:
    radial-gradient(900px 420px at 85% -10%, rgba(6,182,212,.07), transparent 60%),
    radial-gradient(700px 380px at 0% 0%, rgba(16,185,129,.06), transparent 55%),
    var(--bg);
}
body.locked{overflow:hidden}
body.locked .app{pointer-events:none;user-select:none;filter:saturate(.9)}

.skip-link{position:absolute;left:-9999px;top:0;z-index:100;background:var(--card);border:1px solid var(--border-strong);padding:8px 12px;border-radius:var(--radius-sm);color:var(--text)}
.skip-link:focus{left:8px;top:8px}

/* ===== Layout ===== */
.app{display:grid;grid-template-columns:256px 1fr;min-height:100vh}
/* impede "grid blowout": conteúdo largo (tabelas/gráficos) não pode esticar os tracks */
.app > main{min-width:0}
.grid > *,.two-col > *{min-width:0}

/* ===== Sidebar ===== */
aside{
  background:var(--sb-bg);
  border-right:1px solid var(--sb-border);
  padding:20px 14px;position:sticky;top:0;height:100vh;
  display:flex;flex-direction:column;
}
.logo{display:flex;align-items:center;gap:12px;margin:2px 8px 24px;font-weight:700;letter-spacing:.2px;color:var(--sb-logo)}
.logo .small{color:var(--sb-muted)}
.logo-badge{
  width:38px;height:38px;border-radius:11px;flex-shrink:0;
  background:linear-gradient(135deg,var(--brand),var(--brand-2));
  display:grid;place-items:center;font-weight:800;color:#04120f;
  font-family:var(--font-display);
  box-shadow:0 6px 16px rgba(16,185,129,.35);
}
nav{display:flex;flex-direction:column;gap:3px}
nav a{
  position:relative;display:flex;gap:10px;align-items:center;
  padding:10px 12px;border-radius:9px;
  color:var(--sb-text);text-decoration:none;font-weight:500;font-size:13.5px;
  transition:background .14s ease,color .14s ease;
}
nav a:hover{background:var(--sb-hover-bg);color:var(--sb-text-hover)}
nav a.active{background:var(--sb-active-bg);color:var(--sb-active-text);font-weight:600}
nav a.active::before{
  content:"";position:absolute;left:-14px;top:20%;bottom:20%;width:3px;border-radius:0 3px 3px 0;
  background:linear-gradient(180deg,var(--brand),var(--brand-2));
}
nav a:focus-visible{outline:none;box-shadow:var(--ring)}

aside .divider{background:var(--sb-border)}
aside .small{color:var(--sb-muted);font-size:12px;line-height:1.5}
#theme-toggle{width:100%}

.small{color:var(--muted);font-size:12px}

/* ===== Topbar ===== */
header.topbar{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:14px 28px;border-bottom:1px solid var(--border);
  background:var(--topbar-bg);
  backdrop-filter:blur(10px) saturate(140%);
  -webkit-backdrop-filter:blur(10px) saturate(140%);
  position:sticky;top:0;z-index:5;
}
header.topbar strong{font-family:var(--font-display);font-size:15px;letter-spacing:.2px}
#sessao-badge{
  display:inline-flex;align-items:center;gap:6px;
  padding:4px 12px;border-radius:999px;
  background:var(--well);border:1px solid var(--border);
  font-size:12px;color:var(--muted);font-weight:500;
}

/* ===== Containers ===== */
.container{padding:26px 28px;animation:rise .22s ease both}
@keyframes rise{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

.grid{display:grid;gap:18px}
.grid.cols-2{grid-template-columns:1fr 1fr}
.grid.cols-3{grid-template-columns:repeat(3,1fr)}

/* ===== Cartões ===== */
.card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:20px;
  box-shadow:var(--shadow-1);
}
.card h3{
  margin:0 0 12px;font-size:12px;font-weight:600;
  letter-spacing:.7px;text-transform:uppercase;color:var(--muted);
}
.card > .row > strong{
  font-family:var(--font-display);
  font-size:28px;font-weight:700;letter-spacing:-.3px;color:var(--text);
  font-variant-numeric:tabular-nums;
}

.divider{height:1px;background:var(--border);margin:16px 0;border:0}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.hidden{display:none !important}

/* ===== Botões ===== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  border:1px solid var(--border-strong);
  padding:8px 14px;border-radius:9px;min-height:38px;
  background:var(--card);color:var(--text-2);
  cursor:pointer;text-decoration:none;font-weight:600;font-size:13.5px;font-family:var(--font);
  transition:background .14s ease,border-color .14s ease,transform .06s ease,box-shadow .14s ease,color .14s ease;
  box-shadow:0 1px 2px rgba(16,24,40,.05);
}
.btn:hover{background:var(--well);border-color:var(--border-hover);color:var(--text)}
.btn:active{transform:translateY(1px)}
.btn:focus-visible{outline:none;border-color:var(--ring-border);box-shadow:var(--ring)}
.btn.primary{
  background:var(--accent);border-color:var(--accent);color:var(--accent-fg);font-weight:600;
  box-shadow:0 1px 2px rgba(4,120,87,.35), inset 0 1px 0 rgba(255,255,255,.12);
}
.btn.primary:hover{background:var(--accent-hover);border-color:var(--accent-hover);color:var(--accent-fg)}
.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}
.btn.sm{padding:4px 10px;font-size:12.5px;min-height:29px;border-radius:7px}
.btn.danger{border-color:#f3c1c1;color:var(--danger)}
.btn.danger:hover{background:#fef2f2;border-color:#e79a9a;color:#b91c1c}
html[data-theme="dark"] .btn.danger{border-color:rgba(248,113,113,.35);color:#fca5a5}
html[data-theme="dark"] .btn.danger:hover{background:rgba(239,68,68,.12);border-color:rgba(248,113,113,.55);color:#fecaca}

/* ===== Formulários ===== */
.field{margin-bottom:14px}
.field label{display:block;font-size:12.5px;font-weight:600;color:var(--text-2);margin-bottom:6px}
.field input[type="text"],
.field input[type="password"],
.field input[type="datetime-local"],
.field input[type="file"],
.field textarea,
.field select{
  width:100%;padding:10px 12px;border-radius:var(--radius-md);
  border:1px solid var(--border-strong);background:var(--card);color:var(--text);
  font-family:var(--font);font-size:14px;outline:none;
  transition:border-color .14s ease,box-shadow .14s ease;
  box-shadow:0 1px 2px rgba(16,24,40,.04);
}
.field input:hover,.field textarea:hover,.field select:hover{border-color:var(--border-hover)}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--ring-border);box-shadow:var(--ring)}
.field input::placeholder,.field textarea::placeholder{color:#9aa3b1}
.field select:not([multiple]){
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%236b7280' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;
  padding-right:34px;
}
html[data-theme="dark"] .field select:not([multiple]){
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%238d97a5' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
}
.field select[multiple] option{padding:7px 10px;border-radius:6px;margin:1px 2px}
.field select[multiple] option:checked{
  background:linear-gradient(0deg,rgba(16,185,129,.18),rgba(16,185,129,.18));color:var(--accent);font-weight:600;
}
html[data-theme="dark"] .field select[multiple] option:checked{color:#8fe7b4}
.field input[type="file"]{padding:8px 12px;cursor:pointer}
.field input[type="file"]::file-selector-button{
  margin-right:12px;padding:6px 12px;border-radius:7px;border:1px solid var(--border-strong);
  background:var(--well);color:var(--text-2);font-family:var(--font);font-weight:600;font-size:12.5px;cursor:pointer;
  transition:background .14s ease,border-color .14s ease;
}
.field input[type="file"]::file-selector-button:hover{background:var(--well-hover);border-color:var(--border-hover)}

.two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.counter{float:right;font-variant-numeric:tabular-nums;font-weight:500}
.counter.count-over{color:var(--danger);font-weight:700}

#login-error{color:var(--danger)}

/* ===== Tabelas ===== */
.table{width:100%;border-collapse:collapse;font-size:13.5px;font-variant-numeric:tabular-nums}
.table thead th{
  text-align:left;font-size:11px;font-weight:600;letter-spacing:.7px;text-transform:uppercase;
  color:var(--muted);padding:8px 10px;border-bottom:1px solid var(--border-strong);white-space:nowrap;
}
.table tbody td{padding:10px;border-bottom:1px solid var(--border);color:var(--text-2);vertical-align:middle}
.table tbody tr:last-child td{border-bottom:0}
.table tbody tr{transition:background .12s ease}
.table tbody tr:hover{background:var(--well)}
.table.small{font-size:12.5px}

/* ===== Gestão de artigos ===== */
.posts-toolbar{margin-bottom:10px}
.posts-toolbar input[type="text"]{
  flex:1;min-width:200px;padding:9px 12px;border-radius:var(--radius-md);
  border:1px solid var(--border-strong);background:var(--card);color:var(--text);
  font-family:var(--font);font-size:14px;outline:none;
  transition:border-color .14s ease,box-shadow .14s ease;
}
.posts-toolbar input[type="text"]:focus{border-color:var(--ring-border);box-shadow:var(--ring)}
.posts-toolbar select{
  padding:9px 34px 9px 12px;border-radius:var(--radius-md);
  border:1px solid var(--border-strong);background-color:var(--card);color:var(--text);
  font-family:var(--font);font-size:13.5px;outline:none;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%236b7280' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;
  transition:border-color .14s ease,box-shadow .14s ease;
}
html[data-theme="dark"] .posts-toolbar select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%238d97a5' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
}
.posts-toolbar select:focus{border-color:var(--ring-border);box-shadow:var(--ring)}
.posts-actions{display:flex;gap:6px;flex-wrap:wrap}
#tbl-posts tbody td:first-child{color:var(--text);font-weight:600;max-width:340px}

/* badges de estado */
.badge-status{
  display:inline-block;padding:3px 10px;border-radius:999px;
  font-size:11.5px;font-weight:600;letter-spacing:.2px;border:1px solid transparent;white-space:nowrap;
}
.badge-status.st-publish{background:#ecfdf5;color:#047857;border-color:#a7f3d0}
.badge-status.st-draft{background:#f3f4f6;color:#4b5563;border-color:#d1d5db}
.badge-status.st-future{background:#ecfeff;color:#0e7490;border-color:#a5f3fc}
.badge-status.st-pending{background:#fffbeb;color:#b45309;border-color:#fde68a}
.badge-status.st-private{background:#faf5ff;color:#7e22ce;border-color:#e9d5ff}
html[data-theme="dark"] .badge-status.st-publish{background:rgba(34,197,94,.14);color:#7ee2ab;border-color:rgba(34,197,94,.3)}
html[data-theme="dark"] .badge-status.st-draft{background:rgba(148,163,184,.14);color:#c2cbd6;border-color:rgba(148,163,184,.3)}
html[data-theme="dark"] .badge-status.st-future{background:rgba(6,182,212,.14);color:#93e7f7;border-color:rgba(6,182,212,.3)}
html[data-theme="dark"] .badge-status.st-pending{background:rgba(245,158,11,.14);color:#f5cd76;border-color:rgba(245,158,11,.32)}
html[data-theme="dark"] .badge-status.st-private{background:rgba(168,85,247,.14);color:#d5b3f5;border-color:rgba(168,85,247,.32)}

/* ===== Kit de partilha ===== */
#share-kit input[readonly],
#share-kit textarea[readonly]{background:var(--well);cursor:copy}

/* ===== Biblioteca de media ===== */
.media-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;
  margin-top:4px;
}
.media-item{
  background:var(--card);border:1px solid var(--border);border-radius:var(--radius-md);
  padding:8px;display:flex;flex-direction:column;gap:6px;
  transition:border-color .14s ease,box-shadow .14s ease,transform .06s ease;
}
.media-item:hover{border-color:var(--border-hover)}
.media-thumb{
  width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:7px;display:block;
  background:var(--well);
}
.media-name{
  font-size:12.5px;font-weight:600;color:var(--text);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.media-meta{font-variant-numeric:tabular-nums}
.media-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:2px}
.media-item.clickable{cursor:pointer}
.media-item.clickable:hover{border-color:var(--ring-border);box-shadow:var(--ring)}
.media-item.clickable:focus-visible{outline:none;border-color:var(--ring-border);box-shadow:var(--ring)}
.media-item.clickable:active{transform:scale(.985)}

.modal.wide{
  width:min(860px,94vw);
  max-height:88vh;overflow:auto;
}

/* ===== Banners ===== */
.banner{
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  background:#ecfeff;border:1px solid #a5f3fc;color:#155e75;
  padding:12px 16px;border-radius:var(--radius-md);margin-bottom:16px;font-size:13.5px;
  animation:rise .2s ease both;
  overflow-wrap:anywhere;
}
.banner.edit{background:#fffbeb;border-color:#fde68a;color:#92400e}
.banner.ok{background:#ecfdf5;border-color:#a7f3d0;color:#065f46}
html[data-theme="dark"] .banner{background:rgba(6,182,212,.1);border-color:rgba(6,182,212,.28);color:#9fe6f3}
html[data-theme="dark"] .banner.edit{background:rgba(245,158,11,.1);border-color:rgba(245,158,11,.3);color:#f3cd7c}
html[data-theme="dark"] .banner.ok{background:rgba(34,197,94,.1);border-color:rgba(34,197,94,.28);color:#8fe7b4}

/* ===== Pré-visualização (segue o tema, como o editor) ===== */
.preview{
  border:1px dashed var(--border-strong);border-radius:12px;padding:22px;
  background:var(--preview-bg);color:var(--preview-text);overflow-x:hidden;
}
.preview h1{margin:0 0 8px;font-size:26px;line-height:1.25;letter-spacing:-.3px;font-family:var(--font-display)}
.preview .meta{color:var(--muted);font-size:13px;margin-bottom:12px}
.preview img{max-width:100%;border-radius:10px;display:block;margin:10px 0 16px}
.preview,.preview *{overflow-wrap:anywhere;word-break:break-word}
.preview table{table-layout:fixed}
.preview td,.preview th{word-break:break-word}

/* ===== Modal de login ===== */
.modal-backdrop{
  position:fixed;inset:0;z-index:50;display:none;align-items:center;justify-content:center;
  background:rgba(10,13,18,.6);
  backdrop-filter:blur(8px) saturate(110%);
  -webkit-backdrop-filter:blur(8px) saturate(110%);
  opacity:0;transition:opacity .2s ease;
}
.modal-backdrop.show{display:flex;opacity:1}
.modal{
  width:min(520px,92vw);max-width:calc(100vw - 16px);position:relative;border-radius:16px;padding:26px 26px 22px;
  background:var(--card);border:1px solid var(--border);
  box-shadow:var(--shadow-pop);
  transform:translateY(6px) scale(.985);opacity:0;overflow:hidden;
  transition:transform .2s cubic-bezier(.2,.7,.2,1),opacity .2s ease;
}
.modal.show{transform:none;opacity:1}
.modal::before{
  content:"";position:absolute;left:0;right:0;top:0;height:3px;
  background:linear-gradient(90deg,var(--brand),var(--brand-2));
}
.modal header{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.modal h3{margin:0;font-family:var(--font-display);font-size:19px;letter-spacing:-.2px;display:flex;align-items:center;gap:10px}
.modal h3 .badge{display:inline-block;font-size:19px;line-height:1}

.input-with-toggle{position:relative}
.input-with-toggle input{padding-right:92px}
.input-with-toggle .toggle-inside{
  position:absolute;right:8px;top:50%;transform:translateY(-5%);
  height:28px;padding:0 10px;display:inline-flex;align-items:center;
  font-size:12px;line-height:1;font-family:var(--font);font-weight:600;color:var(--muted);cursor:pointer;
  background:var(--well);border:1px solid var(--border-strong);border-radius:7px;
  transition:background .14s ease,border-color .14s ease,color .14s ease,transform .05s ease;
}
.input-with-toggle .toggle-inside:hover{background:var(--well-hover);color:var(--text-2)}
.input-with-toggle .toggle-inside:active{transform:translateY(-5%) scale(.98)}
.input-with-toggle .toggle-inside:focus-visible{outline:none;border-color:var(--ring-border);box-shadow:var(--ring)}

.badge-copy{
  display:inline-flex;align-items:center;gap:8px;padding:5px 10px;border-radius:999px;
  font-size:13px;background:#ecfdf5;color:#047857;border:1px solid #a7f3d0;
  opacity:0;transform:translateY(6px);transition:opacity .18s ease,transform .18s ease;
  pointer-events:none;white-space:nowrap;margin-left:4px;
}
.badge-copy.show{opacity:1;transform:none}
html[data-theme="dark"] .badge-copy{background:rgba(34,197,94,.12);color:#8fe7b4;border-color:rgba(34,197,94,.25)}

/* ===== Sessão ===== */
#sessao-details .grid{display:grid;grid-template-columns:220px 1fr;gap:8px 14px}
#sessao-details .label{color:var(--muted)}
#sessao-details .val{color:var(--text)}
#sessao-details pre{
  margin:10px 0 0;padding:14px;border-radius:var(--radius-md);
  background:#0f1219;color:#c9e3ff;overflow:auto;border:0;max-height:260px;font-size:12.5px;
}
.badge-warn{
  display:inline-block;padding:2px 8px;border-radius:999px;font-size:12px;
  border:1px solid #fecaca;background:#fef2f2;color:var(--danger);
}
html[data-theme="dark"] .badge-warn{border-color:rgba(239,68,68,.3);background:rgba(239,68,68,.12);color:#fca5a5}

/* ===== Analytics ===== */
.chart-wrap{position:relative;height:260px;max-height:260px}
.chart-wrap.trend{height:220px;max-height:220px}
.chart-wrap.pages{height:220px;max-height:220px}
.chart-wrap.source{height:240px;max-height:240px}
.chart-wrap > canvas{width:100% !important;height:100% !important;display:block}

#analytics table th,
#analytics table td{text-align:left !important}

#anx-meta{display:flex;justify-content:flex-end;align-items:center;margin:8px 0 -2px}
#anx-last{color:var(--muted);font-size:12px}

/* ===== Responsividade ===== */
@media (max-width:1100px){
  .app{grid-template-columns:1fr}
  aside{position:static;height:auto}
  nav{flex-direction:row;flex-wrap:wrap}
  nav a{padding:8px 12px}
  nav a.active::before{display:none}
  #theme-toggle{width:auto}
  .grid.cols-2,.grid.cols-3{grid-template-columns:1fr}
}
@media (max-width:800px){
  .two-col{grid-template-columns:1fr}
}
@media (max-width:720px){
  .container{padding:14px}
  header.topbar{padding:12px 14px;flex-wrap:wrap}
  .card{padding:16px}
  .table{display:block;overflow-x:auto}
  .posts-toolbar input[type="text"]{min-width:140px}
  #sessao-details .grid{grid-template-columns:1fr}

  /* inputs a 16px evitam o auto-zoom do iOS ao focar */
  .field input,.field select,.field textarea,
  .posts-toolbar input[type="text"],.posts-toolbar select{font-size:16px}

  #sessao-badge{max-width:46vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .modal{padding:18px 14px 16px}
  .modal.wide{max-height:92vh}
  .media-grid{grid-template-columns:repeat(auto-fill,minmax(124px,1fr));gap:10px}
  .banner{font-size:13px}
  .posts-actions .btn{flex:0 0 auto}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important}
}