/* Hub interno JurIA - estilos compartilhados.
   Extraido do index.html em 17/09/2026, quando o hub virou cinco paginas.
   Editar aqui reflete em todas. */
*, *::before, *::after { box-sizing: border-box; }
    html, body { margin: 0; padding: 0; }
    body {
      background: #0B1A2A;
      font-family: 'Inter', -apple-system, system-ui, sans-serif;
      color: #E6EEF5;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      font-feature-settings: "cv11", "ss01", "ss03";
    }
    a { color: inherit; text-decoration: none; }
    button { font-family: inherit; }
    ::selection { background: rgba(20,180,200,0.35); color: #F7F9FA; }
    @keyframes fadeUp { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
    @keyframes pulseSoft { 0%,100% { opacity: 0.6; } 50% { opacity: 1; } }
    @keyframes shimmer { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } }
    .anim-fade { animation: fadeUp 500ms ease both; }
    .pulse-dot { animation: pulseSoft 2s ease-in-out infinite; }
    /* Subtle scroll for sticky nav backdrop */
    .grain {
      background-image: radial-gradient(circle at 1px 1px, rgba(127,219,229,0.04) 1px, transparent 0);
      background-size: 28px 28px;
    }
  

    .hv1:hover { background:rgba(127,219,229,0.06);color:#F7F9FA }
    .hv2:hover { background:#EBB45C }
    .hv3:hover { background:rgba(127,219,229,0.08);color:#F7F9FA }
    .hv4:hover { border-color:rgba(127,219,229,0.22);transform:translateY(-2px) }
    .hv5:hover { background:rgba(127,219,229,0.05) }
    .hv6:hover { background:rgba(20,180,200,0.18) }
  

    /* ---- seletor de janela ---- */
    .win-btn { padding:7px 13px; border-radius:8px; background:transparent; border:0;
      color:#7A8FA5; font-size:12.5px; font-weight:600; cursor:pointer; white-space:nowrap;
      transition:background 160ms ease, color 160ms ease; }
    .win-btn:hover { color:#E6EEF5; }
    .win-btn[aria-selected="true"] { background:rgba(20,180,200,0.16); color:#F7F9FA; }
    /* ---- tabelas ---- */
    .tbl-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; }
    table.dt { width:100%; min-width:820px; border-collapse:collapse; font-size:12.5px; }
    table.dt th { text-align:right; padding:9px 10px; font-size:10px; letter-spacing:0.7px;
      text-transform:uppercase; color:#7A8FA5; font-weight:700; white-space:nowrap;
      border-bottom:1px solid rgba(127,219,229,0.12); }
    table.dt th:first-child, table.dt td:first-child { text-align:left; }
    table.dt td { padding:11px 10px; text-align:right; color:#B6C8DA; white-space:nowrap;
      border-bottom:1px solid rgba(127,219,229,0.05); }
    table.dt tbody tr:last-child td { border-bottom:0; }
    table.dt tbody tr:hover td { background:rgba(127,219,229,0.03); }
    table.dt td.num { color:#E6EEF5; font-variant-numeric:tabular-nums; }
    table.dt td.strong { color:#F7F9FA; font-weight:700; font-variant-numeric:tabular-nums; }
    .pill { display:inline-block; font-size:9.5px; font-weight:700; letter-spacing:0.5px;
      text-transform:uppercase; padding:2px 7px; border-radius:99px; }
    .pill-on { color:#4ADE80; background:rgba(74,222,128,0.12); }
    .pill-off { color:#7A8FA5; background:rgba(122,143,165,0.12); }
    .pill-wait { color:#F0A63C; background:rgba(240,166,60,0.13); }
    .utm { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:11px; color:#7FDBE5; }
    /* ---- barras da serie diaria ---- */
    .bar-col { flex:1; display:flex; flex-direction:column; align-items:center; gap:6px; min-width:0; }
    .bar-col .bar { width:100%; max-width:34px; border-radius:5px 5px 0 0;
      background:linear-gradient(180deg,#14B4C8,rgba(20,180,200,0.35)); transition:opacity 160ms ease; }
    .bar-col:hover .bar { opacity:0.75; }
  

    @media (max-width: 860px) {
      .r-pad { padding-left: 18px !important; padding-right: 18px !important; }
      .r-hero { grid-template-columns: 1fr !important; gap: 22px !important; }
      .r-h1 { font-size: 34px !important; }
      .r-head { flex-direction: column !important; align-items: flex-start !important; gap: 12px !important; }
      .r-legend { flex-wrap: wrap !important; }
      .r-g21 { grid-template-columns: 1fr !important; }
      .r-g2 { grid-template-columns: 1fr !important; gap: 22px !important; }
      .r-g3 { grid-template-columns: 1fr !important; }
      .r-g4 { grid-template-columns: repeat(2, 1fr) !important; }
      .r-topbar { flex-wrap: wrap !important; justify-content: space-between !important; row-gap: 12px !important; }
      .r-nav { margin-left: 0 !important; order: 3; flex-basis: 100% !important; justify-content: center; }
      .r-fases { grid-template-columns: 1fr !important; }
    }
    @media (max-width: 520px) {
      .r-pad { padding-left: 14px !important; padding-right: 14px !important; }
      .r-g4 { grid-template-columns: 1fr !important; }
      .r-h1 { font-size: 27px !important; }
      .r-foot { flex-direction: column !important; align-items: flex-start !important; gap: 10px !important; }
    }
