:root {
      --verde: #1f4a33;
      --verde2: #2e6545;
      --verde-claro: #75997f;
      --verde-escuro: #173724;
      --dourado: #b79a56;
      --fundo: #eef2ec;
      --branco: #fcfcf8;
      --borda: rgba(31,74,51,0.11);
      --texto: #27312b;
      --texto-suave: #5a6660;
      --sombra: 0 2px 12px rgba(20,37,28,0.07), 0 8px 24px rgba(20,37,28,0.05);
      --radius-sm: 8px;
      --radius-md: 12px;
      --radius-lg: 16px;
      --radius-xl: 20px;
      --font-ui: 'Inter', 'Lato', sans-serif;
      --font-serif: 'Cormorant Garamond', serif;
    }
    * { margin:0; padding:0; box-sizing:border-box; }
    body { font-family: var(--font-ui); background:var(--fundo); color:var(--texto); min-height:100vh; font-size:0.9rem; line-height:1.5; }

    /* ── HEADER ── */
    .header {
      position: sticky;
      top: 0;
      z-index: 80;
      background: rgba(252,252,248,0.96);
      color: var(--verde-escuro);
      padding: 0.6rem 1.2rem 0.6rem calc(198px + 1.2rem);
      display: flex;
      align-items: center;
      justify-content: space-between;
      box-shadow: 0 1px 0 rgba(31,74,51,0.09), 0 4px 16px rgba(20,37,28,0.05);
      border-bottom: 1px solid rgba(31,74,51,0.09);
      backdrop-filter: blur(16px);
    }
    .header h1 { font-size: 0.95rem; font-weight: 600; letter-spacing: 0.01em; }
    .header p { display:none; }
    .header-kicker { font-size:0.58rem; letter-spacing:0.12em; text-transform:uppercase; color:var(--dourado); font-weight:700; opacity:0.9; }
    .header-actions { display:flex; align-items:center; justify-content:flex-end; gap:0.45rem; flex-wrap:wrap; }

    /* ── WIDGET NOME DO REPOSITÓRIO (header) ── */
    .header-repo-widget {
      display: flex;
      flex-direction: column;
      gap: 0.12rem;
      min-width: 0;
    }
    .header-repo-label {
      font-size: 0.5rem;
      font-weight: 800;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--texto-suave);
      opacity: 0.75;
    }
    .header-repo-input-row {
      display: flex;
      align-items: center;
      gap: 0.3rem;
    }
    .header-repo-input {
      border: 1px solid rgba(31,74,51,0.16);
      border-radius: 6px;
      background: rgba(31,74,51,0.03);
      padding: 0.22rem 0.46rem;
      font-size: 0.7rem;
      font-family: 'Courier New', 'Consolas', monospace;
      color: var(--verde-escuro);
      font-weight: 600;
      width: 185px;
      transition: border-color 0.15s, background 0.15s;
      outline: none;
    }
    .header-repo-input:focus {
      border-color: rgba(31,74,51,0.35);
      background: rgba(255,255,255,0.9);
    }
    .header-repo-input.repo-ok { border-color: rgba(31,122,60,0.45); }
    .header-repo-input.repo-err { border-color: rgba(180,40,40,0.45); }
    .header-repo-badge {
      font-size: 0.52rem;
      font-weight: 700;
      border-radius: 999px;
      padding: 0.08rem 0.38rem;
      display: none;
      white-space: nowrap;
    }
    .header-repo-badge.ok       { display: inline; background: rgba(31,122,60,0.1);   color: #1f7a3c; }
    .header-repo-badge.err      { display: inline; background: rgba(180,40,40,0.08);  color: #b42828; }
    .header-repo-badge.checking { display: inline; background: rgba(31,74,51,0.06);   color: var(--texto-suave); }
    .header-repo-badge.locked   { display: inline; background: rgba(183,154,86,0.12); color: #8a6e22; }
    .header-repo-input:disabled {
      opacity: 0.6;
      cursor: not-allowed;
      background: rgba(31,74,51,0.04);
    }
    .header-repo-footer {
      display: flex;
      align-items: center;
      gap: 0.4rem;
    }
    .header-repo-url-preview {
      font-size: 0.54rem;
      color: var(--texto-suave);
      font-family: 'Courier New', 'Consolas', monospace;
      opacity: 0.7;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      max-width: 210px;
    }
    .header-repo-sub-badge {
      font-size: 0.5rem;
      font-weight: 700;
      border-radius: 999px;
      padding: 0.08rem 0.38rem;
      white-space: nowrap;
      display: none;
    }
    .header-repo-sub-badge.active   { display: inline; background: rgba(31,122,60,0.1);  color: #1f7a3c; }
    .header-repo-sub-badge.inactive { display: inline; background: rgba(180,40,40,0.08); color: #b42828; }
    @media (max-width: 960px) { .header-repo-widget { display: none; } }
    .contratacoes-sidebar {
      margin-top: auto;
      padding: 0.75rem 0.7rem 0.85rem;
      border-top: 1px solid rgba(255,255,255,0.12);
      display: grid;
      gap: 0.45rem;
    }

    /* ── CAMADA APP COMPACTA / INSPIRAÇÃO LOGOS ── */
    body {
      background: #f4f6f2;
      font-size: 0.86rem;
      letter-spacing: 0;
    }

    .header {
      min-height: 52px;
      padding-top: 0.48rem !important;
      padding-bottom: 0.48rem !important;
      background: rgba(255,255,252,0.97) !important;
    }

    .btn-publicar,
    .btn-gerar-boletim,
    .btn-secundario,
    .btn-aplicar-tema,
    .btn-add-aviso,
    .btn-add-aniv,
    .btn-add-liturgia,
    .btn-duplicar-aviso,
    .btn-programacao-add,
    .auth-provider,
    .auth-secondary-btn,
    .auth-submit-btn {
      min-height: 34px;
      border-radius: 7px !important;
      padding: 0.48rem 0.72rem !important;
      font-size: 0.76rem !important;
      font-weight: 750 !important;
      line-height: 1.15;
      box-shadow: none !important;
      letter-spacing: 0 !important;
    }

    .btn-publicar,
    .auth-submit-btn {
      background: var(--verde) !important;
      color: #fff !important;
      border: 1px solid rgba(31,74,51,0.24) !important;
    }

    .btn-publicar:hover,
    .auth-submit-btn:hover {
      background: var(--verde2) !important;
      transform: none !important;
    }

    .btn-secundario,
    .btn-gerar-boletim,
    .btn-add-aviso,
    .btn-add-aniv,
    .btn-add-liturgia,
    .btn-duplicar-aviso,
    .btn-programacao-add,
    .auth-provider,
    .auth-secondary-btn {
      background: rgba(255,255,255,0.84) !important;
      border: 1px solid rgba(31,74,51,0.13) !important;
      color: var(--verde-escuro) !important;
    }

    .btn-secundario:hover,
    .btn-gerar-boletim:hover,
    .btn-add-aviso:hover,
    .btn-add-aniv:hover,
    .btn-add-liturgia:hover,
    .btn-duplicar-aviso:hover,
    .btn-programacao-add:hover,
    .auth-provider:hover,
    .auth-secondary-btn:hover {
      background: rgba(31,74,51,0.07) !important;
      transform: none !important;
    }

    .btn-remover-aviso,
    .btn-remover-aniv,
    .btn-remover-liturgia,
    .btn-programacao-mini.remover,
    .account-danger-btn {
      color: #9b1c1c !important;
      border-color: rgba(155,28,28,0.18) !important;
      background: rgba(255,248,248,0.9) !important;
    }

    .abas-nav {
      background: #fbfcf8 !important;
      border-right: 1px solid rgba(31,74,51,0.10) !important;
      box-shadow: 3px 0 14px rgba(16,38,26,0.04) !important;
    }

    .studio-sidebar-brand {
      padding-bottom: 0.5rem !important;
      margin-bottom: 0.3rem !important;
      border-bottom: 1px solid rgba(31,74,51,0.08);
    }

    .aba-nav-btn {
      min-height: 34px !important;
      border-radius: 7px !important;
      padding: 0.48rem 0.55rem !important;
      font-size: 0.68rem !important;
      font-weight: 720 !important;
      letter-spacing: 0 !important;
      color: #48544e !important;
    }

    .aba-nav-btn:hover,
    .aba-nav-btn.ativa,
    .aba-nav-btn.submenu-aberto {
      background: rgba(31,74,51,0.075) !important;
      color: var(--verde-escuro) !important;
      border-color: rgba(31,74,51,0.18) !important;
    }

    .nav-submenu {
      padding: 0.2rem 0 0.32rem 0.35rem !important;
    }

    .nav-sub-btn {
      min-height: 30px !important;
      border-radius: 6px !important;
      padding: 0.38rem 0.5rem !important;
      font-size: 0.64rem !important;
      font-weight: 690 !important;
      color: #53605a !important;
      background: transparent !important;
      border: 1px solid transparent !important;
    }

    .nav-sub-btn:hover,
    .nav-sub-btn.ativa {
      background: rgba(31,74,51,0.065) !important;
      border-color: rgba(31,74,51,0.10) !important;
      color: var(--verde-escuro) !important;
    }

    .contratacoes-sidebar {
      padding: 0.55rem 0.45rem 0.6rem !important;
      gap: 0.35rem !important;
    }

    .contratacao-btn {
      min-height: 42px !important;
      border-radius: 7px !important;
      padding: 0.45rem 0.52rem !important;
      box-shadow: none !important;
    }

    .contratacao-btn span {
      font-size: 0.68rem !important;
    }

    .contratacao-btn small {
      font-size: 0.58rem !important;
      line-height: 1.25;
    }

    .painel-shell {
      padding-top: 0.9rem !important;
      padding-inline: 1rem !important;
      max-width: 1240px !important;
    }

    .painel-meta {
      display: grid !important;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 0.55rem !important;
      margin-bottom: 0.75rem !important;
    }

    .meta-card,
    .aba-intro,
    .studio-panel-card,
    .aviso-card,
    .programacao-dia-card,
    .liturgia-item-card,
    .simbolo-item-card,
    .github-publication-item,
    .studio-info-block {
      border-radius: 8px !important;
      border: 1px solid rgba(31,74,51,0.10) !important;
      box-shadow: none !important;
      background: rgba(255,255,252,0.82) !important;
    }

    .meta-card {
      padding: 0.58rem 0.68rem !important;
      gap: 0.18rem !important;
    }

    .meta-card strong,
    .studio-panel-title,
    .studio-info-block strong {
      font-family: var(--font-ui) !important;
      font-size: 0.72rem !important;
      font-weight: 820 !important;
      letter-spacing: 0 !important;
      color: var(--verde-escuro) !important;
    }

    .meta-card span,
    .aba-intro p,
    .studio-info-block p,
    .config-status,
    .dica {
      font-size: 0.7rem !important;
      line-height: 1.42 !important;
      color: #65716b !important;
    }

    .aba-intro {
      padding: 0.72rem 0.85rem !important;
      margin-bottom: 0.75rem !important;
    }

    .aba-intro strong {
      font-family: var(--font-ui) !important;
      font-size: 0.72rem !important;
      font-weight: 850 !important;
      letter-spacing: 0.08em !important;
      text-transform: uppercase;
      color: var(--verde-escuro) !important;
    }

    .secao-titulo {
      margin: 1.05rem 0 0.55rem !important;
      padding: 0 0 0.38rem !important;
      border-bottom: 1px solid rgba(31,74,51,0.10) !important;
      font-family: var(--font-ui) !important;
      font-size: 0.78rem !important;
      font-weight: 850 !important;
      letter-spacing: 0.07em !important;
      text-transform: uppercase !important;
      color: var(--verde-escuro) !important;
    }

    .campo {
      margin-bottom: 0.72rem !important;
    }

    .campo label {
      margin-bottom: 0.28rem !important;
      font-size: 0.68rem !important;
      font-weight: 780 !important;
      letter-spacing: 0.02em !important;
      color: var(--verde-escuro) !important;
    }

    .campo input[type="text"],
    .campo input[type="email"],
    .campo input[type="password"],
    .campo textarea,
    .campo select,
    .profile-popover input,
    .auth-form input {
      min-height: 34px !important;
      border-radius: 7px !important;
      padding: 0.48rem 0.62rem !important;
      font-size: 0.76rem !important;
      background: rgba(255,255,255,0.88) !important;
      border: 1px solid rgba(31,74,51,0.13) !important;
      box-shadow: none !important;
    }

    .campo textarea {
      min-height: 84px !important;
      line-height: 1.5 !important;
    }

    .campo textarea.grande {
      min-height: 140px !important;
    }

    .campo .wysiwyg-field {
      min-height: 140px !important;
      border-radius: 7px !important;
      padding: 0.48rem 0.62rem !important;
      font-size: 0.76rem !important;
      background: rgba(255,255,255,0.88) !important;
      border: 1px solid rgba(31,74,51,0.13) !important;
      line-height: 1.5 !important;
      white-space: pre-wrap;
      word-wrap: break-word;
      overflow-y: auto;
      cursor: text;
    }
    .campo .wysiwyg-field:focus {
      border-color: rgba(31,74,51,0.42) !important;
      box-shadow: 0 0 0 3px rgba(31,74,51,0.07) !important;
      outline: none !important;
    }
    .campo .wysiwyg-field:empty::before {
      content: attr(data-placeholder);
      color: #9ab0a0;
      pointer-events: none;
      font-style: italic;
    }
    .campo .wysiwyg-field strong { font-weight: 700; }
    .campo .wysiwyg-field em { font-style: italic; }
    .campo .wysiwyg-field u { text-decoration: underline; }
    .campo .wysiwyg-field p { margin: 0 0 0.4em; }
    .campo .wysiwyg-field p:last-child { margin-bottom: 0; }

    .campo input:focus,
    .campo textarea:focus,
    .campo select:focus,
    .profile-popover input:focus,
    .auth-form input:focus {
      border-color: rgba(31,74,51,0.42) !important;
      box-shadow: 0 0 0 3px rgba(31,74,51,0.07) !important;
      outline: none !important;
    }

    .publish-warning {
      border-radius: 8px !important;
      padding: 0.66rem 0.82rem !important;
      background: rgba(255,255,252,0.86) !important;
      box-shadow: none !important;
    }

    .pricing-table-wrap {
      border-radius: 7px !important;
    }

    .pricing-table th,
    .pricing-table td {
      padding: 0.55rem 0.62rem !important;
      font-size: 0.7rem !important;
    }

    .profile-popover {
      border-radius: 8px !important;
      box-shadow: 0 14px 34px rgba(16,38,26,0.16) !important;
    }

    @media (max-width: 900px) {
      .painel-meta {
        grid-template-columns: 1fr !important;
      }

      .painel-shell {
        padding-inline: 0.75rem !important;
      }
    }
    .contratacoes-sidebar-title {
      font-size: 0.58rem;
      font-weight: 800;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: rgba(255,255,255,0.58);
      padding: 0 0.2rem;
    }
    .contratacao-btn {
      width: 100%;
      border: 1px solid rgba(255,255,255,0.12);
      border-radius: 8px;
      background: rgba(255,255,255,0.06);
      color: rgba(255,255,255,0.92);
      padding: 0.58rem 0.62rem;
      text-align: left;
      cursor: pointer;
      display: grid;
      gap: 0.08rem;
      transition: background 0.16s ease, border-color 0.16s ease;
    }
    .contratacao-btn:hover {
      background: rgba(255,255,255,0.1);
      border-color: rgba(183,154,86,0.45);
    }
    .contratacao-btn span {
      font-size: 0.72rem;
      font-weight: 800;
    }
    .contratacao-btn small {
      color: rgba(255,255,255,0.58);
      font-size: 0.58rem;
      line-height: 1.3;
    }
    .contratacoes-status {
      min-height: 0.8rem;
      color: rgba(255,255,255,0.68);
      font-size: 0.58rem;
      line-height: 1.35;
      padding: 0 0.2rem;
    }
    .abas-nav.colapsada .contratacoes-sidebar {
      padding-inline: 0.45rem;
    }
    .abas-nav.colapsada .contratacoes-sidebar-title,
    .abas-nav.colapsada .contratacao-btn small,
    .abas-nav.colapsada .contratacoes-status {
      display: none;
    }
    .abas-nav.colapsada .contratacao-btn {
      padding: 0.5rem 0.35rem;
      text-align: center;
    }
    .abas-nav.colapsada .contratacao-btn span {
      font-size: 0.56rem;
    }
    .btn-publicar {
      background: var(--verde);
      color: #fff;
      border: none;
      padding: 0.52rem 1.2rem;
      border-radius: 8px;
      font-size: 0.78rem;
      font-weight: 600;
      cursor: pointer;
      display: flex;
      align-items: center;
      gap: 0.45rem;
      transition: background 0.18s ease, box-shadow 0.18s ease;
      white-space: nowrap;
      letter-spacing: 0.01em;
    }
    .btn-publicar:hover { background: var(--verde2); box-shadow: 0 4px 14px rgba(31,74,51,0.22); }
    .btn-publicar:disabled { opacity: 0.45; cursor: not-allowed; }
    .btn-gerar-boletim {
      background: var(--verde);
      color: #fff;
      border: 0;
      border-radius: 8px;
      padding: 0.52rem 1rem;
      font-size: 0.76rem;
      font-weight: 600;
      letter-spacing: 0.02em;
      cursor: pointer;
      box-shadow: 0 2px 8px rgba(31,74,51,0.16);
      white-space: nowrap;
      transition: background 0.18s ease;
    }
    .btn-gerar-boletim:hover { background: var(--verde2); }
    .profile-trigger {
      width: 34px;
      height: 34px;
      border-radius: 50%;
      border: 1px solid rgba(31,74,51,0.14);
      background: #fff;
      color: var(--verde);
      display: grid;
      place-items: center;
      font-weight: 700;
      cursor: pointer;
      font-size: 0.8rem;
      box-shadow: 0 2px 8px rgba(20,37,28,0.07);
      transition: box-shadow 0.18s ease;
    }
    .profile-trigger:hover { box-shadow: 0 4px 14px rgba(20,37,28,0.12); }
    .profile-popover {
      position: fixed;
      top: 58px;
      right: 0.75rem;
      z-index: 120;
      width: min(300px, calc(100vw - 1.5rem));
      max-height: calc(100vh - 68px);
      overflow-y: auto;
      background: #fff;
      border: 1px solid rgba(31,74,51,0.10);
      border-radius: var(--radius-lg);
      padding: 0.72rem;
      box-shadow: 0 8px 32px rgba(20,37,28,0.14), 0 2px 8px rgba(20,37,28,0.06);
      display: none;
    }
    .profile-popover.aberto { display:block; }
    .profile-popover h3 {
      font-family: var(--font-ui);
      color: var(--verde-escuro);
      font-size: 0.95rem;
      font-weight: 600;
      margin-bottom: 0.45rem;
      padding-right: 2rem;
    }
    .profile-popover p { display:block; font-size:0.76rem; line-height:1.5; color:var(--texto-suave); margin-bottom:0.7rem; }
    .profile-popover .auth-row { display:grid; gap:0.35rem; }
    .profile-popover input {
      width:100%;
      border:1px solid var(--borda);
      border-radius:var(--radius-sm);
      padding:0.48rem 0.62rem;
      font-size:0.78rem;
      font-family: var(--font-ui);
    }
    .profile-trigger img {
      width: 100%;
      height: 100%;
      border-radius: inherit;
      object-fit: cover;
      display: block;
    }
    .profile-customizer {
      display: grid;
      gap: 0.45rem;
      margin-top: 0.55rem;
      padding: 0.55rem;
      border: 1px solid rgba(31,74,51,0.10);
      border-radius: 12px;
      background: rgba(255,255,255,0.62);
    }
    .profile-account-panel {
      display: grid;
      gap: 0.45rem;
      margin-top: 0.55rem;
      padding: 0.55rem;
      border: 1px solid rgba(153,27,27,0.14);
      border-radius: 12px;
      background: rgba(255,250,246,0.84);
    }
    .profile-account-head {
      display: grid;
      gap: 0.22rem;
    }
    .profile-account-panel strong {
      color: var(--verde-escuro);
      font-size: 0.78rem;
    }
    .profile-account-panel p {
      margin: 0;
      color: var(--texto-suave);
      font-size: 0.7rem;
      line-height: 1.35;
    }
    .account-warning-btn {
      border-color: rgba(183,116,0,0.22) !important;
      color: #7a4a00 !important;
      background: #fff8e8 !important;
    }
    .account-danger-btn {
      border-color: rgba(153,27,27,0.22) !important;
      color: #991b1b !important;
      background: #fff4f4 !important;
    }
    .account-warning-btn:disabled,
    .account-danger-btn:disabled {
      opacity: 0.55;
      cursor: not-allowed;
    }
    .profile-session-actions {
      margin-top: 0.45rem;
    }
    .profile-custom-top {
      display: flex;
      align-items: center;
      gap: 0.5rem;
    }
    .profile-custom-compact {
      display: grid;
      grid-template-columns: 42px minmax(0, 1fr);
    }
    .profile-photo-preview {
      width: 42px;
      height: 42px;
      flex: 0 0 auto;
      border-radius: 50%;
      display: grid;
      place-items: center;
      overflow: hidden;
      border: 1px solid rgba(31,74,51,0.12);
      background: rgba(31,74,51,0.06);
      color: var(--verde2);
      font-size: 0.72rem;
      font-weight: 800;
    }
    .profile-photo-preview img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }
    .profile-custom-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 0.35rem;
    }
    .profile-custom-actions-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .auth-provider {
      border:1px solid rgba(31,74,51,0.12);
      background:#f7faf6;
      color:var(--verde);
      border-radius:var(--radius-sm);
      padding:0.45rem 0.55rem;
      font-weight:600;
      font-size:0.74rem;
      cursor:pointer;
      transition: background 0.15s;
    }
    .auth-provider:hover { background:#eef5ea; }
    .auth-gate {
      position: fixed;
      inset: 0;
      z-index: 300;
      display: none;
      align-items: center;
      justify-content: center;
      padding: 1rem;
      background: rgba(238,242,236,0.96);
      backdrop-filter: blur(14px);
    }
    body.auth-locked .auth-gate { display: flex; }
    .auth-card {
      width: min(420px, 100%);
      background: #fff;
      border: 1px solid rgba(31,74,51,0.10);
      border-radius: var(--radius-xl);
      box-shadow: 0 4px 24px rgba(20,37,28,0.10), 0 24px 56px rgba(20,37,28,0.10);
      padding: 1.6rem 1.5rem;
    }
    .auth-card h2 {
      font-family: var(--font-ui);
      color: var(--verde-escuro);
      font-size: 1.25rem;
      font-weight: 600;
      margin-bottom: 0.3rem;
      letter-spacing: -0.01em;
    }
    .auth-card p {
      color: var(--texto-suave);
      font-size: 0.8rem;
      line-height: 1.55;
      margin-bottom: 1rem;
    }
    .auth-tabs {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 0.38rem;
      margin-bottom: 1rem;
      background: #f3f6f3;
      border-radius: var(--radius-sm);
      padding: 0.25rem;
    }
    .auth-tabs button,
    .auth-secondary-btn {
      border: 0;
      border-radius: 6px;
      background: transparent;
      color: var(--texto-suave);
      padding: 0.55rem 0.7rem;
      font-weight: 500;
      font-size: 0.8rem;
      cursor: pointer;
      transition: background 0.15s, color 0.15s;
    }
    .auth-tabs button.ativa {
      background: #fff;
      color: var(--verde-escuro);
      font-weight: 600;
      box-shadow: 0 1px 4px rgba(20,37,28,0.10);
    }
    .auth-form {
      display: grid;
      gap: 0.6rem;
    }
    .auth-form label {
      color: var(--texto-suave);
      font-size: 0.72rem;
      font-weight: 500;
      letter-spacing: 0.01em;
    }
    .auth-form input {
      width: 100%;
      border: 1px solid rgba(31,74,51,0.14);
      border-radius: var(--radius-sm);
      padding: 0.65rem 0.75rem;
      font-size: 0.85rem;
      font-family: var(--font-ui);
      transition: border-color 0.15s, box-shadow 0.15s;
    }
    .auth-form input:focus {
      outline: none;
      border-color: var(--verde-claro);
      box-shadow: 0 0 0 3px rgba(31,74,51,0.08);
    }
    .auth-submit-btn {
      width: 100%;
      border: 0;
      border-radius: var(--radius-sm);
      background: var(--verde);
      color: #fff;
      padding: 0.72rem 1rem;
      font-size: 0.85rem;
      font-weight: 600;
      cursor: pointer;
      box-shadow: 0 2px 10px rgba(31,74,51,0.18);
      transition: background 0.18s, box-shadow 0.18s;
      letter-spacing: 0.01em;
    }
    .auth-submit-btn:hover {
      background: var(--verde2);
      box-shadow: 0 4px 16px rgba(31,74,51,0.24);
    }
    .auth-submit-btn:disabled {
      opacity: 0.6;
      cursor: wait;
    }
    .auth-forgot-btn {
      width: auto;
      justify-self: center;
      margin-top: -0.15rem;
      padding-inline: 0.25rem;
      font-size: 0.78rem;
    }
    body.auth-recovery-mode .auth-tabs,
    body.auth-recovery-mode #auth-forgot-btn {
      display: none;
    }
    .auth-setup {
      margin-top: 0.85rem;
      padding-top: 0.85rem;
      border-top: 1px solid rgba(31,74,51,0.12);
      display: grid;
      gap: 0.55rem;
    }
    .auth-setup:not(.aberto) {
      display: none;
    }
    body:not(.admin-mode):not(.supabase-unconfigured) #auth-admin-toggle {
      display: none;
    }
    .auth-status {
      min-height: 1.2rem;
      color: var(--texto-suave);
      font-size: 0.78rem;
      line-height: 1.45;
    }
    .auth-status.erro { color: #9b2c2c; }
    .auth-status.ok { color: var(--verde); }
    .profile-session {
      display: grid;
      gap: 0.55rem;
      padding: 0.7rem;
      border: 1px solid rgba(31,74,51,0.12);
      border-radius: 12px;
      background: #f8fbf6;
      color: var(--texto-suave);
      font-size: 0.78rem;
      line-height: 1.45;
    }
    .profile-session strong {
      color: #173724;
      overflow-wrap: anywhere;
    }

    /* ── CONFIGURAÇÃO TOKEN ── */
    .config-bar {
      background: rgba(253,246,220,0.85);
      border-bottom: 1px solid rgba(183,154,86,0.22);
      padding: 0.55rem 2rem;
      display: flex;
      align-items: center;
      gap: 1rem;
      font-size: 0.78rem;
      color: #6b4f00;
    }
    .config-bar input {
      flex: 1;
      max-width: 340px;
      padding: 0.38rem 0.75rem;
      border: 1px solid rgba(183,154,86,0.35);
      border-radius: var(--radius-sm);
      font-size: 0.78rem;
      font-family: ui-monospace, monospace;
      background: rgba(255,252,240,0.9);
    }
    .config-bar.ok { background: rgba(236,247,240,0.9); border-color: rgba(31,74,51,0.12); color: var(--verde2); }
    .config-bar.ok input { border-color: rgba(31,74,51,0.14); background: rgba(240,249,244,0.9); }
    .config-bar.config-fechada { display:none; }

    /* ── ABAS ── */
    .abas-nav {
      background: var(--branco);
      border-bottom: 1px solid var(--borda);
      padding: 0 2rem;
      display: flex;
      gap: 0;
    }
    .aba-nav-btn {
      padding: 0.75rem 1.1rem;
      border: none;
      background: none;
      font-size: 0.76rem;
      font-weight: 500;
      color: var(--texto-suave);
      cursor: pointer;
      border-bottom: 2px solid transparent;
      transition: color 0.15s, border-color 0.15s;
      letter-spacing: 0.01em;
      font-family: var(--font-ui);
    }
    .aba-nav-btn:hover { color: var(--verde-escuro); }
    .aba-nav-btn.ativa { color: var(--verde-escuro); border-bottom-color: var(--dourado); font-weight: 600; }

    /* ── CONTEÚDO ── */
    .aba-conteudo { display: none; padding: 2rem; max-width: 860px; margin: 0 auto; }
    .aba-conteudo.ativa { display: block; }

    /* ── GRUPOS DE CAMPO ── */
    .secao-titulo {
      font-size: 0.64rem;
      font-weight: 600;
      letter-spacing: 0.10em;
      text-transform: uppercase;
      color: var(--verde2);
      background: rgba(11,93,59,0.04);
      border-left: 2px solid var(--dourado);
      padding: 0.42rem 0.75rem;
      margin: 1.6rem 0 0.85rem;
      border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
    }
    .secao-titulo:first-child { margin-top: 0; }
    .campo { margin-bottom: 1rem; }
    .campo label {
      display: block;
      font-size: 0.72rem;
      font-weight: 500;
      color: var(--texto-suave);
      margin-bottom: 0.3rem;
      letter-spacing: 0.01em;
    }
    .campo input[type="text"],
    .campo textarea {
      width: 100%;
      padding: 0.58rem 0.82rem;
      border: 1px solid var(--borda);
      border-radius: var(--radius-sm);
      font-size: 0.85rem;
      font-family: var(--font-ui);
      color: var(--texto);
      background: var(--branco);
      transition: border-color 0.15s, box-shadow 0.15s;
      resize: vertical;
    }
    .campo input:focus,
    .campo textarea:focus {
      outline: none;
      border-color: var(--verde-claro);
      box-shadow: 0 0 0 3px rgba(31,74,51,0.08);
    }
    .campo textarea { min-height: 100px; line-height: 1.6; }
    .campo textarea.grande { min-height: 180px; }
    .campo textarea.pequena { min-height: 70px; }
    .campo .dica {
      font-size: 0.7rem;
      color: var(--texto-suave);
      margin-top: 0.28rem;
      line-height: 1.5;
      opacity: 0.85;
    }

    /* ── GERENCIADOR DE AVISOS ── */
    #lista-avisos { margin-bottom: 1rem; }
    .avisos-toolbar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
      margin-bottom: 1rem;
      padding: 0.95rem 1rem;
      background: rgba(31,74,51,0.05);
      border: 1px solid rgba(31,74,51,0.1);
      border-radius: 14px;
    }
    .avisos-toolbar strong {
      display: block;
      font-size: 0.84rem;
      color: var(--verde2);
    }
    .avisos-toolbar span {
      display: block;
      margin-top: 0.2rem;
      font-size: 0.76rem;
      color: var(--texto-suave);
      line-height: 1.5;
    }
    .toolbar-acoes {
      display: flex;
      align-items: center;
      gap: 0.65rem;
      flex-wrap: wrap;
      justify-content: flex-end;
    }
    .aviso-card {
      background: var(--branco);
      border: 1px solid var(--borda);
      border-radius: var(--radius-lg);
      padding: 1rem;
      margin-bottom: 0.85rem;
      box-shadow: var(--sombra);
      transition: box-shadow 0.18s;
    }
    .aviso-card:hover { box-shadow: 0 4px 20px rgba(20,37,28,0.09); }
    .aviso-card-header {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 1rem;
      margin-bottom: 1rem;
    }
    .aviso-card-identidade strong {
      display: block;
      font-size: 0.9rem;
      color: var(--verde2);
      margin-bottom: 0.3rem;
    }
    .aviso-card-identidade span {
      display: block;
      font-size: 0.75rem;
      color: var(--texto-suave);
      line-height: 1.45;
    }
    .aviso-card-topo {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 0.9rem;
      margin-bottom: 0.9rem;
      align-items: end;
    }
    .aviso-card-topo select {
      width: 100%;
      padding: 0.6rem 0.75rem;
      border: 1px solid var(--borda);
      border-radius: 10px;
      font-size: 0.85rem;
      color: var(--texto);
      background: var(--branco);
    }
    .aviso-status {
      display: inline-flex;
      align-items: center;
      gap: 0.55rem;
      padding: 0.55rem 0.8rem;
      border-radius: 999px;
      border: 1px solid rgba(31,74,51,0.12);
      background: rgba(31,74,51,0.05);
      color: var(--verde2);
      font-size: 0.76rem;
      font-weight: 700;
      letter-spacing: 0.06em;
      text-transform: uppercase;
    }
    .aviso-status input {
      width: 1rem;
      height: 1rem;
      accent-color: var(--verde2);
      cursor: pointer;
    }
    .aviso-status.inativo {
      background: rgba(107,114,128,0.08);
      border-color: rgba(107,114,128,0.18);
      color: #667085;
    }
    .aviso-card-acoes {
      display: flex;
      justify-content: flex-end;
      gap: 0.65rem;
      margin-top: 0.8rem;
    }
    .btn-remover-aviso {
      background: transparent;
      color: #c0392b;
      border: 1px solid rgba(220,38,38,0.18);
      border-radius: var(--radius-sm);
      padding: 0.38rem 0.65rem;
      font-size: 0.7rem;
      font-weight: 500;
      cursor: pointer;
      transition: background 0.15s;
      font-family: var(--font-ui);
    }
    .btn-remover-aviso:hover { background: rgba(220,38,38,0.06); }
    .btn-duplicar-aviso {
      background: transparent;
      color: var(--verde2);
      border: 1px solid rgba(31,74,51,0.14);
      border-radius: var(--radius-sm);
      padding: 0.38rem 0.65rem;
      font-size: 0.7rem;
      font-weight: 500;
      cursor: pointer;
      transition: background 0.15s;
      font-family: var(--font-ui);
    }
    .btn-duplicar-aviso:hover { background: rgba(31,74,51,0.05); }
    .btn-add-aviso {
      background: transparent;
      border: 1px dashed rgba(31,74,51,0.28);
      color: var(--verde2);
      border-radius: var(--radius-md);
      padding: 0.8rem;
      width: 100%;
      font-size: 0.78rem;
      font-weight: 500;
      cursor: pointer;
      transition: background 0.15s, border-color 0.15s;
      font-family: var(--font-ui);
    }
    .btn-add-aviso:hover { background: rgba(11,93,59,0.05); border-color: rgba(31,74,51,0.42); }
    .aviso-imagem-preview {
      max-width: 100%;
      max-height: 150px;
      border-radius: 6px;
      margin-top: 0.5rem;
      display: none;
    }
    .aviso-fixo {
      border-color: rgba(11,93,59,0.35) !important;
      background: #f0f9f4;
    }
    .aviso-card.inativo {
      opacity: 0.82;
      border-style: dashed;
      background: #fbfcfb;
    }
    .aviso-card.inativo .campo input,
    .aviso-card.inativo .campo textarea,
    .aviso-card.inativo .aviso-card-topo select {
      background: #f7f8f7;
    }
    .upload-card {
      background: var(--branco);
      border: 1px solid var(--borda);
      border-radius: 12px;
      padding: 0.8rem 0.9rem;
      margin-bottom: 0.8rem;
      box-shadow: none;
    }
    .upload-card strong {
      display: block;
      margin-bottom: 0.35rem;
      color: var(--verde2);
      font-size: 0.84rem;
    }
    .upload-card p {
      font-size: 0.8rem;
      color: var(--texto-suave);
      line-height: 1.6;
      margin-bottom: 0.85rem;
    }
    .arquivo-atual {
      display: inline-flex;
      align-items: center;
      gap: 0.45rem;
      padding: 0.34rem 0.62rem;
      border-radius: 999px;
      background: rgba(31,74,51,0.06);
      border: 1px solid rgba(31,74,51,0.1);
      color: var(--verde2);
      font-size: 0.69rem;
      font-weight: 700;
    }
    .arquivo-info {
      margin-top: 0.7rem;
      font-size: 0.76rem;
      color: var(--texto-suave);
    }
    /* ── ANIVERSARIANTES ── */
    #lista-aniversariantes { margin-bottom: 0.8rem; }
    .aniv-linha {
      display: flex;
      gap: 0.5rem;
      margin-bottom: 0.5rem;
      align-items: center;
    }
    .aniv-linha input[type="text"] {
      padding: 0.45rem 0.7rem;
      border: 1px solid var(--borda);
      border-radius: 6px;
      font-size: 0.88rem;
      font-family: inherit;
      background: var(--branco);
    }
    .aniv-linha input.dia { width: 60px; text-align: center; font-weight: 700; }
    .aniv-linha input.nome { flex: 1; }
    .btn-remover-aniv {
      background: #fee2e2;
      color: #dc2626;
      border: none;
      border-radius: 6px;
      padding: 0.3rem 0.6rem;
      font-size: 0.75rem;
      cursor: pointer;
    }
    .btn-add-aniv {
      background: rgba(11,93,59,0.06);
      border: 1px dashed var(--verde2);
      color: var(--verde2);
      border-radius: 8px;
      padding: 0.6rem;
      width: 100%;
      font-size: 0.82rem;
      font-weight: 700;
      cursor: pointer;
    }
    .programacao-editor {
      display: grid;
      gap: 0.9rem;
      margin: 0.4rem 0 0.9rem;
    }
    .programacao-dia-card {
      background: rgba(255,255,255,0.88);
      border: 1px solid rgba(31,74,51,0.1);
      border-radius: 14px;
      padding: 0.85rem;
      display: grid;
      gap: 0.6rem;
    }
    .programacao-dia-topo {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 0.55rem;
      align-items: center;
    }
    .programacao-dia-input,
    .programacao-hora-input,
    .programacao-titulo-input {
      width: 100%;
      border: 1px solid var(--borda);
      border-radius: 10px;
      background: var(--branco);
      color: var(--texto);
      font: inherit;
      padding: 0.5rem 0.7rem;
    }
    .programacao-dia-input {
      font-weight: 700;
    }
    .programacao-item-row {
      display: grid;
      grid-template-columns: 86px minmax(0, 1fr) auto;
      gap: 0.45rem;
      align-items: center;
    }
    .programacao-item-row + .programacao-item-row {
      margin-top: 0.45rem;
    }
    .btn-programacao-mini,
    .btn-programacao-add {
      border-radius: 999px;
      border: 1px solid rgba(31,74,51,0.14);
      background: rgba(31,74,51,0.05);
      color: var(--verde2);
      font: inherit;
      font-size: 0.72rem;
      font-weight: 700;
      padding: 0.34rem 0.7rem;
      cursor: pointer;
    }
    .btn-programacao-mini.remover {
      color: #b63a30;
      background: rgba(220,38,38,0.05);
      border-color: rgba(220,38,38,0.12);
      width: 28px;
      height: 28px;
      padding: 0;
      display: grid;
      place-items: center;
    }
    .btn-programacao-add {
      justify-self: start;
      border-style: dashed;
      background: transparent;
    }
    .btn-programacao-dia {
      width: 100%;
      justify-content: center;
      padding: 0.6rem 0.8rem;
      border-style: dashed;
      background: rgba(31,74,51,0.03);
    }
    .planejamento-colagem {
      margin-bottom: 1rem;
    }
    .planejamento-colagem .btn-aplicar-tema {
      margin-top: 0.65rem;
    }
    .planejamento-editor {
      display: grid;
      gap: 0.9rem;
    }
    .planejamento-mes-card {
      background: rgba(255,255,255,0.88);
      border: 1px solid rgba(31,74,51,0.1);
      border-radius: 14px;
      padding: 0.85rem;
      display: grid;
      gap: 0.58rem;
    }
    .planejamento-mes-titulo {
      color: var(--verde2);
      font-size: 0.84rem;
      font-weight: 900;
      letter-spacing: 0.06em;
      text-transform: uppercase;
    }
    .planejamento-evento-row {
      display: grid;
      grid-template-columns: 82px minmax(0, 1fr) auto;
      gap: 0.42rem;
      align-items: center;
    }
    .planejamento-data-input,
    .planejamento-titulo-input {
      width: 100%;
      min-width: 0;
      border: 1px solid var(--borda);
      border-radius: 8px;
      background: var(--branco);
      color: var(--texto);
      font: inherit;
      font-size: 0.82rem;
      padding: 0.45rem 0.55rem;
    }
    .planejamento-mes-vazio {
      color: var(--texto-suave);
      font-size: 0.78rem;
      padding: 0.15rem 0;
    }
    .lideranca-editor {
      display: grid;
      gap: 0.9rem;
    }
    .lideranca-editor-card {
      background: rgba(255,255,255,0.88);
      border: 1px solid rgba(31,74,51,0.1);
      border-radius: 14px;
      padding: 0.9rem;
      display: grid;
      gap: 0.75rem;
    }
    .lideranca-editor-card h4 {
      margin: 0;
      color: var(--verde2);
      font-size: 0.9rem;
      letter-spacing: 0.02em;
    }
    .lideranca-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0.65rem;
    }
    .lideranca-row {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(0, 0.82fr) auto;
      gap: 0.42rem;
      align-items: center;
    }
    .lideranca-row + .lideranca-row { margin-top: 0.45rem; }
    .lideranca-pessoa-card {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 0.5rem;
      align-items: start;
      padding: 0.65rem;
      border: 1px solid var(--borda);
      border-radius: 8px;
      background: #fff;
      margin-bottom: 0.55rem;
    }
    .lideranca-input,
    .lideranca-editor textarea {
      width: 100%;
      min-width: 0;
      border: 1px solid var(--borda);
      border-radius: 8px;
      background: var(--branco);
      color: var(--texto);
      font: inherit;
      font-size: 0.82rem;
      padding: 0.45rem 0.55rem;
    }
    .lideranca-editor textarea {
      min-height: 72px;
      resize: vertical;
    }
    .lideranca-subtitulo {
      color: var(--texto-suave);
      font-size: 0.76rem;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: 0.04em;
      margin-top: 0.15rem;
    }
    .lideranca-empty {
      color: var(--texto-suave);
      font-size: 0.78rem;
    }
    @media (max-width: 760px) {
      .lideranca-grid,
      .lideranca-row {
        grid-template-columns: 1fr;
      }
      .lideranca-row .btn-programacao-mini.remover {
        width: 100%;
      }
    }
    .simbolos-editor {
      display: grid;
      gap: 0.95rem;
      margin-top: 0.9rem;
    }
    .simbolo-item-card {
      background: rgba(247, 251, 246, 0.94);
      border: 1px solid rgba(31,74,51,0.11);
      border-radius: 16px;
      padding: 0.95rem;
      display: grid;
      gap: 0.72rem;
      box-shadow: 0 10px 26px rgba(23,55,36,0.06);
    }
    .simbolo-item-topo {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 0.8rem;
    }
    .simbolo-item-topo strong {
      font-size: 0.88rem;
      color: var(--verde2);
      letter-spacing: 0.03em;
    }
    .simbolo-item-grid {
      display: grid;
      gap: 0.72rem;
    }
    .simbolo-item-grid .campo {
      margin-bottom: 0;
    }
    .simbolo-item-grid textarea {
      min-height: 92px;
    }
    .simbolo-item-grid textarea.pequena {
      min-height: 64px;
    }
    .simbolo-video-upload {
      display: flex;
      align-items: center;
      gap: 0.55rem;
      flex-wrap: wrap;
    }
    .simbolo-video-upload .arquivo-atual {
      margin: 0;
    }
    .simbolos-editor-acoes {
      display: flex;
      gap: 0.65rem;
      flex-wrap: wrap;
      margin-top: 0.2rem;
    }
    .simbolos-editor-acoes .btn-programacao-add {
      justify-self: auto;
    }
    .campos-legado-ocultos {
      display: none !important;
    }

    /* ── STATUS ── */
    #status-bar {
      position: fixed;
      bottom: 1.5rem;
      right: 2rem;
      background: var(--verde-escuro);
      color: #fff;
      padding: 0.62rem 1.2rem;
      border-radius: var(--radius-md);
      font-size: 0.78rem;
      font-weight: 500;
      box-shadow: 0 4px 18px rgba(0,0,0,0.18);
      display: none;
      z-index: 2147483000;
      max-width: 320px;
      font-family: var(--font-ui);
      pointer-events: none;
    }
    #status-bar.erro { background: #991b1b; }
    #status-bar.visivel { display: block; animation: slideUp 0.25s ease; }
    @keyframes slideUp { from { transform: translateY(20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }

    .publish-progress-overlay {
      position: fixed;
      inset: 0;
      z-index: 10000;
      display: none;
      align-items: center;
      justify-content: center;
      padding: 1rem;
      background: rgba(12, 28, 19, 0.52);
      backdrop-filter: blur(10px);
    }
    .publish-progress-overlay.aberto {
      display: flex;
    }
    .publish-progress-overlay > #status-bar {
      z-index: 3;
      filter: none !important;
      backdrop-filter: none !important;
      opacity: 1 !important;
    }
    .publish-progress-card {
      width: min(500px, 100%);
      background: #fff;
      border: 1px solid rgba(31,74,51,0.10);
      border-radius: var(--radius-xl);
      box-shadow: 0 8px 32px rgba(0,0,0,0.12), 0 24px 64px rgba(0,0,0,0.10);
      padding: 1.2rem 1.3rem;
      color: var(--texto);
    }
    .publish-progress-head {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 1rem;
      margin-bottom: 0.85rem;
    }
    .publish-progress-head h3 {
      font-family: var(--font-ui);
      color: var(--verde-escuro);
      font-size: 1rem;
      font-weight: 600;
      line-height: 1.2;
      margin: 0;
      letter-spacing: -0.01em;
    }
    .publish-progress-head span {
      color: var(--texto-suave);
      font-size: 0.78rem;
      line-height: 1.45;
    }
    .publish-progress-percent {
      color: var(--verde);
      font-size: 1.25rem;
      font-weight: 900;
      min-width: 54px;
      text-align: right;
    }
    .publish-progress-track {
      width: 100%;
      height: 11px;
      border-radius: 999px;
      background: #e8efe9;
      overflow: hidden;
      margin-bottom: 0.75rem;
    }
    .publish-progress-fill {
      width: 0%;
      height: 100%;
      border-radius: inherit;
      background: linear-gradient(90deg, var(--verde), var(--dourado));
      transition: width 0.35s ease;
    }
    .publish-progress-meta {
      display: flex;
      justify-content: space-between;
      gap: 1rem;
      color: var(--texto-suave);
      font-size: 0.76rem;
      margin-bottom: 0.85rem;
    }
    .publish-progress-steps {
      display: grid;
      gap: 0.5rem;
      margin-bottom: 0.85rem;
    }
    .publish-progress-step {
      display: grid;
      grid-template-columns: 22px 1fr;
      gap: 0.55rem;
      align-items: start;
      color: var(--texto-suave);
      font-size: 0.78rem;
    }
    .publish-progress-step i {
      width: 22px;
      height: 22px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      background: #edf3ee;
      color: var(--verde);
      font-style: normal;
      font-size: 0.7rem;
      font-weight: 900;
    }
    .publish-progress-step.ativa strong,
    .publish-progress-step.done strong {
      color: #173724;
    }
    .publish-progress-step.done i {
      background: var(--verde);
      color: #fff;
    }
    .publish-progress-step.erro i {
      background: #dc2626;
      color: #fff;
    }
    .publish-progress-message {
      padding: 0.75rem;
      border-radius: 12px;
      background: #f7faf7;
      color: var(--texto-suave);
      font-size: 0.8rem;
      line-height: 1.45;
      overflow-wrap: anywhere;
    }
    .publish-progress-message.erro {
      background: #fff1f1;
      color: #9b1c1c;
      border: 1px solid rgba(220,38,38,0.20);
    }
    .publish-progress-actions {
      display: flex;
      justify-content: flex-end;
      flex-wrap: wrap;
      gap: 0.5rem;
      margin-top: 0.85rem;
    }
    .publish-progress-actions button,
    .publish-progress-actions a {
      border: 1px solid var(--studio-border);
      border-radius: 10px;
      background: #f8fbf6;
      color: #173724;
      padding: 0.55rem 0.8rem;
      font-weight: 900;
      cursor: pointer;
      text-decoration: none;
      font-size: 0.76rem;
    }

    /* ── LITURGIA AJUDA ── */
    .liturgia-dica {
      background: #e8f5ee;
      border: 1px solid rgba(11,93,59,0.2);
      border-radius: 8px;
      padding: 0.8rem 1rem;
      margin-bottom: 1rem;
      font-size: 0.78rem;
      color: var(--verde2);
      line-height: 1.6;
    }
    .liturgia-dica strong { display: block; margin-bottom: 0.3rem; }
    .liturgia-editor-lista { display: grid; gap: 1rem; margin-top: 1rem; }
    .liturgia-editor-card {
      background: #fff;
      border: 1px solid var(--borda);
      border-radius: 10px;
      padding: 1rem;
      box-shadow: var(--sombra);
    }
    .liturgia-editor-topo {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 0.75rem;
      align-items: end;
      margin-bottom: 0.8rem;
    }
    .liturgia-editor-topo .campo { margin-bottom: 0; }
    .btn-remover-liturgia {
      border: 1px solid rgba(220,38,38,0.22);
      background: rgba(220,38,38,0.06);
      color: #b91c1c;
      border-radius: 8px;
      padding: 0.62rem 0.85rem;
      font-size: 0.78rem;
      font-weight: 700;
      cursor: pointer;
      white-space: nowrap;
    }
    .btn-add-liturgia {
      background: rgba(11,93,59,0.06);
      border: 1px dashed var(--verde2);
      color: var(--verde2);
      border-radius: 8px;
      padding: 0.7rem 1rem;
      width: 100%;
      font-size: 0.84rem;
      font-weight: 700;
      cursor: pointer;
    }

    /* ── CARD INSTITUCIONAL ── */
    .card-inst {
      background: var(--branco);
      border: 1px solid var(--borda);
      border-radius: 10px;
      padding: 1.2rem;
      margin-bottom: 1rem;
      box-shadow: var(--sombra);
    }
    .update-toggle {
      display: grid;
      grid-template-columns: auto 1fr;
      align-items: start;
      gap: 0.55rem;
      margin: 0 0 0.85rem;
      padding: 0.72rem 0.8rem;
      background: rgba(31,74,51,0.035);
      border: 1px solid rgba(31,74,51,0.12);
      border-radius: 12px;
      color: var(--verde2);
      font-size: 0.8rem;
      line-height: 1.45;
    }
    .update-toggle input {
      width: 0.92rem;
      height: 0.92rem;
      accent-color: var(--verde2);
      flex-shrink: 0;
      margin-top: 0.12rem;
    }
  .card-inst h4 {
      font-size: 0.68rem;
      font-weight: 600;
      color: var(--texto-suave);
      text-transform: uppercase;
      letter-spacing: 0.08em;
      margin-bottom: 0.75rem;
      padding-bottom: 0.45rem;
      border-bottom: 1px solid var(--borda);
    }

    /* Grid dois colunas */
    .grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
    @media (max-width: 600px) {
      .grid2 { grid-template-columns: 1fr; }
      .abas-nav { overflow-x: auto; }
      .liturgia-editor-topo { grid-template-columns: 1fr; }
      .btn-remover-liturgia { width: 100%; }
    }

    /* ── REFINOS VISUAIS ALINHADOS AO BOLETIM ── */
    body {
      font-family: var(--font-ui);
      background:
        linear-gradient(180deg, #f5f8f4 0%, #eef2ec 60%, #e8ede6 100%);
      color: var(--texto);
    }

    h1 {
      font-family: var(--font-ui);
    }
    .card-inst h4 {
      font-family: var(--font-ui);
    }

    .header {
      position: relative;
      margin-left: 198px;
      padding: 0.85rem 2rem;
      background:
        linear-gradient(135deg, rgba(183,154,86,0.06), rgba(183,154,86,0)),
        linear-gradient(160deg, #1a3d2b 0%, #1f4a33 55%, #27553b 100%);
      overflow: hidden;
    }

    .studio-brand {
      position: relative;
      z-index: 1;
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      gap: 0.8rem;
      align-items: center;
    }

    .studio-brand-logo {
      width: 44px;
      height: 44px;
      object-fit: contain;
      border-radius: 12px;
      background: rgba(255,255,255,0.96);
      padding: 0.3rem;
      box-shadow: 0 4px 16px rgba(7,35,23,0.20);
    }

    .studio-brand-wordmark {
      display: flex;
      flex-direction: column;
      min-width: 0;
    }

    .header::after {
      content: '';
      position: absolute;
      inset: auto -6% -60% auto;
      width: 240px;
      height: 240px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(255,255,255,0.08) 0%, rgba(255,255,255,0) 72%);
      pointer-events: none;
    }

    .header-kicker {
      display: inline-flex;
      align-items: center;
      gap: 0.4rem;
      font-size: 0.58rem;
      font-weight: 600;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: rgba(255,255,255,0.72);
      margin-bottom: 0.4rem;
    }

    .header h1 {
      font-size: clamp(1.05rem, 2vw, 1.35rem);
      letter-spacing: -0.01em;
      margin-bottom: 0.1rem;
      line-height: 1.15;
      font-weight: 500;
    }

    .header p {
      font-size: 0.78rem;
      opacity: 0.72;
      margin-top: 0.1rem;
      max-width: 600px;
      line-height: 1.55;
    }

    .header-copy {
      position: relative;
      z-index: 1;
    }

    .header-actions {
      position: relative;
      z-index: 1;
      display: flex;
      gap: 0.55rem;
      align-items: center;
      flex-wrap: wrap;
    }

    .btn-secundario {
      background: rgba(255,255,255,0.10);
      color: rgba(255,255,255,0.90);
      border: 1px solid rgba(255,255,255,0.18);
      padding: 0.5rem 0.9rem;
      border-radius: 8px;
      font-size: 0.75rem;
      font-weight: 500;
      cursor: pointer;
      transition: background 0.18s ease;
    }

    .btn-secundario:hover {
      background: rgba(255,255,255,0.16);
    }

    .config-bar {
      margin-left: 198px;
      background: rgba(255,255,255,0.82);
      backdrop-filter: blur(10px);
      border-bottom: 1px solid rgba(31,74,51,0.09);
      color: var(--verde2);
      display: grid;
      grid-template-columns: repeat(2, minmax(280px, 1fr));
      gap: 0.75rem 1rem;
      align-items: end;
    }

    .config-item {
      display: flex;
      flex-direction: column;
      gap: 0.38rem;
    }

    .config-item label {
      font-size: 0.68rem;
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--verde2);
    }

    .config-bar input {
      min-width: 0;
      max-width: none;
      background: rgba(255,255,255,0.85);
      border-color: rgba(31,74,51,0.15);
      padding: 0.72rem 0.9rem;
      border-radius: 10px;
    }

    .config-status {
      font-size: 0.76rem;
      color: var(--texto-suave);
      line-height: 1.5;
    }

    .config-status.ok {
      color: var(--verde2);
      font-weight: 700;
    }

    .config-status.erro {
      color: #991b1b;
      font-weight: 700;
    }

    #profile-cancel-subscription:disabled {
      cursor: not-allowed;
    }

    #studio-profile-popover {
      max-height: calc(100vh - 68px);
      overflow-y: auto;
    }

    #studio-profile-popover .profile-session {
      padding: 0.55rem 0.65rem;
      gap: 0.28rem;
      border-radius: 12px;
      font-size: 0.72rem;
    }

    #studio-profile-popover .auth-provider {
      min-height: 32px;
    }

    .publish-warning {
      margin: 0.85rem 1.1rem 0 calc(198px + 1.1rem);
      max-width: 1120px;
      padding: 0.8rem 1rem;
      background: rgba(31,74,51,0.04);
      border: 1px solid rgba(31,74,51,0.10);
      border-radius: var(--radius-md);
      color: var(--verde2);
    }

    .publish-warning strong {
      display: block;
      margin-bottom: 0.25rem;
      font-size: 0.68rem;
      font-weight: 600;
      letter-spacing: 0.06em;
      text-transform: uppercase;
    }

    .publish-warning p {
      margin: 0;
      font-size: 0.8rem;
      line-height: 1.6;
      color: var(--texto-suave);
    }

    .pricing-table-wrap {
      margin-top: 0.75rem;
      overflow-x: auto;
      border: 1px solid rgba(31,74,51,0.10);
      border-radius: 8px;
      background: rgba(255,255,252,0.76);
    }

    .pricing-table-wrap.compact {
      margin-top: 0.35rem;
      width: 100%;
    }

    .pricing-table {
      width: 100%;
      min-width: 680px;
      border-collapse: collapse;
      font-size: 0.76rem;
      color: var(--texto);
    }

    .pricing-table th,
    .pricing-table td {
      padding: 0.68rem 0.75rem;
      text-align: left;
      vertical-align: top;
      border-bottom: 1px solid rgba(31,74,51,0.08);
    }

    .pricing-table th {
      background: rgba(31,74,51,0.06);
      color: var(--verde-escuro);
      font-size: 0.66rem;
      font-weight: 800;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      white-space: nowrap;
    }

    .pricing-table td {
      line-height: 1.45;
      color: var(--texto-suave);
    }

    .pricing-table tr:last-child td {
      border-bottom: 0;
    }

    .pricing-table td strong {
      display: block;
      color: var(--verde-escuro);
      font-size: 0.78rem;
    }

    .pricing-price {
      display: block;
      color: var(--verde-escuro);
      font-size: 0.88rem;
      font-weight: 800;
      white-space: nowrap;
    }

    .pricing-table small {
      display: block;
      margin-top: 0.12rem;
      color: var(--texto-suave);
      font-size: 0.66rem;
      line-height: 1.35;
    }

    .abas-nav {
      position: fixed;
      left: 0;
      top: 0;
      bottom: 0;
      z-index: 20;
      width: 198px;
      padding: 0.85rem 0.6rem;
      display: flex;
      flex-direction: column;
      gap: 0.25rem;
      overflow-y: auto;
      background: rgba(250,251,249,0.97);
      backdrop-filter: blur(12px);
      border-right: 1px solid rgba(31,74,51,0.09);
      box-shadow: 4px 0 18px rgba(11,93,59,0.05);
    }

    .aba-nav-btn {
      width: 100%;
      text-align: left;
      border-bottom: 0;
      border-left: 2px solid transparent;
      border-radius: var(--radius-sm);
      padding: 0.58rem 0.7rem;
      font-size: 0.72rem;
      font-weight: 500;
      letter-spacing: 0.01em;
      text-transform: none;
      color: var(--texto-suave);
      transition: background 0.15s, color 0.15s;
      font-family: var(--font-ui);
    }

    .aba-nav-btn:hover {
      background: rgba(31,74,51,0.05);
      color: var(--verde-escuro);
    }

    .aba-nav-btn.ativa {
      background: rgba(31,74,51,0.07);
      border-left-color: var(--dourado);
      color: var(--verde-escuro);
      font-weight: 600;
    }

    .aba-nav-btn.has-submenu {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 0.5rem;
    }

    .submenu-caret {
      width: 18px;
      height: 18px;
      border: 0;
      border-radius: 5px;
      background: rgba(183,154,86,0.14);
      color: var(--dourado);
      font-size: 0.62rem;
      font-weight: 700;
      display: grid;
      place-items: center;
      flex-shrink: 0;
      pointer-events: none;
      transition: transform 0.18s ease;
    }

    .aba-nav-btn.has-submenu.submenu-aberto .submenu-caret {
      transform: rotate(180deg);
    }

    .nav-submenu {
      display: none;
      flex-direction: column;
      gap: 0.15rem;
      margin: -0.1rem 0 0.35rem 0.4rem;
      padding: 0.35rem 0 0.25rem 0.55rem;
      border-left: 1px solid rgba(31,74,51,0.12);
    }

    .nav-submenu.aberto {
      display: flex;
    }

    .nav-sub-btn {
      border: 0;
      background: transparent;
      color: var(--texto-suave);
      text-align: left;
      border-radius: 6px;
      padding: 0.4rem 0.5rem;
      font-size: 0.68rem;
      font-weight: 400;
      letter-spacing: 0.01em;
      text-transform: none;
      cursor: pointer;
      line-height: 1.3;
      font-family: var(--font-ui);
      transition: background 0.12s, color 0.12s;
    }

    .nav-sub-btn:hover,
    .nav-sub-btn.ativa {
      background: rgba(31,74,51,0.06);
      color: var(--verde-escuro);
    }

    .nav-sub-btn.ativa {
      font-weight: 500;
    }

    .studio-mini-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0.55rem;
      margin-bottom: 1rem;
    }

    .studio-mini-card {
      border: 1px solid rgba(31,74,51,0.14);
      background: rgba(255,255,255,0.7);
      border-radius: 10px;
      padding: 0.65rem;
      min-height: 74px;
      text-align: left;
      color: var(--verde-escuro);
      cursor: pointer;
    }

    .studio-mini-card.ativa {
      border-color: var(--verde2);
      box-shadow: inset 0 0 0 1px var(--verde2);
    }

    .studio-mini-card strong {
      display: block;
      font-size: 0.68rem;
      letter-spacing: 0.05em;
      text-transform: uppercase;
      margin-top: 0.35rem;
    }

    .studio-mini-card span {
      display: block;
      font-size: 0.62rem;
      color: var(--texto-suave);
      line-height: 1.35;
      margin-top: 0.2rem;
    }

    .color-menu {
      display: none;
      margin-top: 0.7rem;
      padding: 0.75rem;
      border: 1px solid rgba(31,74,51,0.12);
      border-radius: 12px;
      background: rgba(255,255,255,0.74);
    }

    .color-menu.aberto {
      display: block;
    }

    .color-swatch-list {
      display: flex;
      flex-wrap: wrap;
      gap: 0.45rem;
      margin-bottom: 0.7rem;
    }

    .color-swatch-btn {
      width: 32px;
      height: 32px;
      border: 1px solid rgba(0,0,0,0.12);
      border-radius: 9px;
      cursor: pointer;
      box-shadow: inset 0 0 0 2px rgba(255,255,255,0.42);
    }

    .studio-toggle-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 0.85rem;
      padding: 0.78rem 0.85rem;
      border-radius: 12px;
      background: rgba(31,74,51,0.05);
      border: 1px solid rgba(31,74,51,0.1);
      margin-top: 0.85rem;
    }

    .studio-toggle-row strong {
      display: block;
      font-size: 0.74rem;
      color: var(--verde2);
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }

    .studio-toggle-row span {
      display: block;
      margin-top: 0.18rem;
      font-size: 0.68rem;
      color: var(--texto-suave);
      line-height: 1.35;
    }

    .studio-switch {
      width: 48px;
      height: 26px;
      border-radius: 999px;
      border: 1px solid rgba(31,74,51,0.22);
      background: #fff;
      padding: 2px;
      cursor: pointer;
      flex-shrink: 0;
    }

    .studio-switch::before {
      content: '';
      display: block;
      width: 20px;
      height: 20px;
      border-radius: 50%;
      background: var(--verde2);
      transition: transform 0.18s ease;
    }

    .studio-switch.on {
      background: var(--verde-escuro);
    }

    .studio-switch.on::before {
      transform: translateX(21px);
      background: var(--dourado);
    }

    .studio-sidebar-brand {
      display: flex;
      align-items: center;
      gap: 0.55rem;
      padding: 0.4rem 0.4rem 0.8rem;
      margin-bottom: 0.4rem;
      border-bottom: 1px solid rgba(31,74,51,0.08);
    }

    .studio-sidebar-brand img {
      width: 28px;
      height: 28px;
      object-fit: contain;
      border-radius: 7px;
    }

    .studio-sidebar-brand strong {
      display: block;
      font-family: var(--font-ui);
      font-size: 0.82rem;
      font-weight: 600;
      line-height: 1.1;
      color: var(--verde-escuro);
      letter-spacing: -0.01em;
    }

    .studio-sidebar-brand span {
      display: block;
      margin-top: 0.08rem;
      font-size: 0.52rem;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--dourado);
      opacity: 0.85;
    }

    .studio-mode-panel {
      padding: 0.38rem 0.38rem 0.78rem;
      margin: 0 0 0.58rem;
      border-bottom: 1px solid rgba(31,74,51,0.08);
    }

    .studio-mode-label {
      display: block;
      margin-bottom: 0.38rem;
      color: var(--texto-suave);
      font-size: 0.56rem;
      font-weight: 800;
      letter-spacing: 0.12em;
      line-height: 1.2;
      text-transform: uppercase;
    }

    .studio-mode-switcher {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 0.28rem;
      padding: 0.22rem;
      border: 1px solid rgba(31,74,51,0.12);
      border-radius: 8px;
      background: rgba(31,74,51,0.045);
    }

    .studio-mode-btn {
      min-height: 34px;
      border: 0;
      border-radius: 6px;
      background: transparent;
      color: var(--texto-suave);
      cursor: pointer;
      font-family: var(--font-ui);
      font-size: 0.64rem;
      font-weight: 850;
      letter-spacing: 0.04em;
      line-height: 1.15;
      text-transform: uppercase;
    }

    .studio-mode-btn.ativa {
      background: #fff;
      color: var(--verde-escuro);
      box-shadow: 0 4px 14px rgba(31,74,51,0.16), 0 1px 3px rgba(31,74,51,0.10);
      font-weight: 900;
    }

    /* Modo Editor — identidade visual âmbar */
    body.studio-update-mode .studio-mode-switcher {
      background: rgba(183,154,86,0.07);
      border-color: rgba(183,154,86,0.28);
    }
    body.studio-update-mode .studio-mode-label {
      color: var(--dourado);
    }
    body.studio-update-mode #studio-mode-update-btn.ativa {
      background: linear-gradient(135deg, #c9a84c 0%, #b79a56 100%);
      color: #fff;
      box-shadow: 0 4px 14px rgba(183,154,86,0.32), 0 1px 3px rgba(183,154,86,0.18);
    }

    /* Modo Editor — todos os botões primários ficam dourados */
    body.studio-update-mode .btn-aplicar-tema,
    body.studio-update-mode .btn-publicar,
    body.studio-update-mode .btn-gerar-boletim,
    body.studio-update-mode .btn-duplicar-aviso,
    body.studio-update-mode .btn-add-aviso,
    body.studio-update-mode .btn-add-aniv,
    body.studio-update-mode .btn-programacao-add,
    body.studio-update-mode .btn-add-liturgia,
    body.studio-update-mode .btn-secundario {
      background: linear-gradient(135deg, #c9a84c 0%, #b79a56 100%);
      color: #fff;
      box-shadow: 0 4px 14px rgba(183,154,86,0.28);
      border-color: transparent;
    }
    body.studio-update-mode .btn-aplicar-tema:hover,
    body.studio-update-mode .btn-publicar:hover,
    body.studio-update-mode .btn-gerar-boletim:hover,
    body.studio-update-mode .btn-duplicar-aviso:hover,
    body.studio-update-mode .btn-add-aviso:hover,
    body.studio-update-mode .btn-add-aniv:hover,
    body.studio-update-mode .btn-programacao-add:hover,
    body.studio-update-mode .btn-add-liturgia:hover,
    body.studio-update-mode .btn-secundario:hover {
      background: linear-gradient(135deg, #b79a56 0%, #a08848 100%);
      box-shadow: 0 6px 20px rgba(183,154,86,0.38);
    }
    body.studio-update-mode .studio-mini-card.ativa {
      border-color: var(--dourado);
      box-shadow: inset 0 0 0 1px var(--dourado);
      background: rgba(201,168,76,0.07);
    }
    body.studio-update-mode .secao-toggle.ativa {
      background: linear-gradient(135deg, #c9a84c 0%, #b79a56 100%);
      border-color: transparent;
    }
    body.studio-update-mode .studio-panel-title,
    body.studio-update-mode .secao-titulo,
    body.studio-update-mode .aba-intro strong,
    body.studio-update-mode .painel-meta strong {
      color: var(--dourado) !important;
    }
    body.studio-update-mode .header-repo-input {
      border-color: var(--dourado) !important;
      box-shadow: 0 0 0 2px rgba(183,154,86,0.2) !important;
    }
    body.studio-update-mode .profile-trigger {
      border-color: var(--dourado) !important;
      box-shadow: 0 0 0 2px rgba(183,154,86,0.3) !important;
    }
    body.studio-update-mode .profile-photo-preview {
      border-color: var(--dourado) !important;
      box-shadow: 0 0 0 2px rgba(183,154,86,0.3) !important;
    }

    .studio-mode-help {
      display: block;
      margin-top: 0.42rem;
      color: var(--texto-suave);
      font-size: 0.58rem;
      line-height: 1.35;
    }

    .official-contact-links {
      display: grid;
      gap: 0.5rem;
      margin-top: 0.45rem;
    }

    .official-contact-link {
      display: inline-flex;
      align-items: center;
      gap: 0.5rem;
      color: var(--verde-escuro);
      font-weight: 800;
      text-decoration: none;
      overflow-wrap: anywhere;
    }

    .official-contact-link:hover {
      color: var(--dourado);
    }

    .official-contact-icon {
      display: inline-grid;
      place-items: center;
      width: 26px;
      height: 26px;
      border-radius: 50%;
      background: rgba(31,74,51,0.08);
      color: var(--verde-escuro);
      flex: 0 0 auto;
    }

    .official-contact-icon.whatsapp {
      background: #25D366;
      color: #fff;
    }

    .official-contact-icon svg {
      width: 15px;
      height: 15px;
      fill: currentColor;
    }

    .studio-update-hidden {
      display: none !important;
    }

    body.studio-update-mode .studio-create-only {
      display: none !important;
    }

    body.sidebar-collapsed .studio-mode-panel {
      display: none;
    }

    .painel-shell {
      max-width: 1120px;
      margin: 0 auto 0 198px;
      padding: 1.2rem 1.2rem 5rem;
    }

    body.studio-visual-mode .config-bar,
    body.studio-visual-mode .publish-warning,
    body.studio-visual-mode .painel-meta {
      display: none;
    }

    body.studio-visual-mode .painel-shell {
      max-width: none;
      margin-left: 198px;
      padding: 0;
    }

    body.studio-visual-mode #aba-visual {
      min-height: calc(100vh - 62px);
      margin-top: 0;
      padding: 0;
      background: transparent;
      border: 0;
      border-radius: 0;
      box-shadow: none;
      backdrop-filter: none;
    }

    body.studio-visual-mode .visual-workspace {
      min-height: calc(100vh - 62px);
    }

    body.studio-visual-mode .visual-live-col {
      min-height: calc(100vh - 62px);
    }

    .aba-conteudo {
      max-width: 900px;
      padding: 1.4rem 1.3rem 1.8rem;
      background: rgba(255,255,255,0.78);
      border: 1px solid rgba(11,93,59,0.07);
      border-radius: var(--radius-xl);
      box-shadow: 0 2px 12px rgba(11,93,59,0.05), 0 8px 32px rgba(11,93,59,0.05);
      margin-top: 0.85rem;
      backdrop-filter: blur(8px);
    }

    .aba-intro {
      background: rgba(31,74,51,0.04);
      border: 1px solid rgba(31,74,51,0.09);
      border-radius: var(--radius-md);
      padding: 0.85rem 1rem;
      margin-bottom: 1.2rem;
    }

    .aba-intro strong {
      display: block;
      color: var(--verde2);
      font-size: 0.68rem;
      font-weight: 600;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      margin-bottom: 0.25rem;
    }

    .aba-intro p {
      font-size: 0.78rem;
      color: var(--texto-suave);
      line-height: 1.6;
    }

    .campo input[type="text"],
    .campo textarea,
    .campo select,
    .aniv-linha input[type="text"],
    .aviso-card-header select {
      font-family: 'Lato', sans-serif;
      background: rgba(255,255,255,0.92);
    }

    .secao-titulo {
      font-size: 0.64rem;
      letter-spacing: 0.10em;
      background: rgba(31,74,51,0.04);
      border-left: 2px solid var(--dourado);
      border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
    }

    .aviso-card,
    .card-inst {
      border-radius: var(--radius-lg);
      box-shadow: var(--sombra);
    }

    .painel-meta {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 0.9rem;
      margin: 0.4rem 0 1.4rem;
    }

    .meta-card {
      background: rgba(255,255,255,0.82);
      border: 1px solid rgba(11,93,59,0.08);
      border-radius: var(--radius-md);
      padding: 0.85rem 0.95rem;
      box-shadow: var(--sombra);
    }

    .meta-card strong {
      display: block;
      font-size: 0.62rem;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      font-weight: 600;
      color: var(--verde2);
      margin-bottom: 0.28rem;
    }

    .meta-card span {
      display: block;
      font-size: 0.82rem;
      color: var(--texto);
      line-height: 1.5;
    }

    .dica-compartilhar {
      margin-top: 0.75rem;
      padding: 0.85rem 0.95rem;
      border-radius: 12px;
      background: rgba(31,74,51,0.05);
      border: 1px solid rgba(31,74,51,0.1);
      color: var(--verde2);
      font-size: 0.76rem;
      line-height: 1.55;
    }

    .campo select {
      width: 100%;
      padding: 0.6rem 0.85rem;
      border: 1px solid var(--borda);
      border-radius: 8px;
      font-size: 0.9rem;
      color: var(--texto);
    }

    @media (max-width: 820px) {
      .header {
        margin-left: 0;
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
      }

      .config-bar {
        margin-left: 0;
        grid-template-columns: 1fr;
      }

      .publish-warning {
        margin: 1rem 0.8rem 0;
      }

      .abas-nav {
        position: sticky;
        top: 0;
        bottom: auto;
        width: auto;
        flex-direction: row;
        overflow-x: auto;
        padding: 0.5rem 0.7rem;
      }

      .studio-sidebar-brand {
        display: none;
      }

      .aba-nav-btn {
        width: auto;
        white-space: nowrap;
        border-left: 0;
        border-bottom: 3px solid transparent;
      }

      .painel-meta {
        grid-template-columns: 1fr;
      }

      .painel-shell {
        margin-left: 0;
        padding-inline: 0.8rem;
      }

      body.studio-visual-mode .painel-shell {
        margin-left: 0;
      }

      .aba-conteudo {
        padding: 1.2rem 1rem 1.4rem;
      }
    }

    .abas-nav .contratacoes-sidebar {
      margin-top: auto;
      flex-shrink: 0;
    }
    body.sidebar-collapsed .contratacoes-sidebar {
      padding-inline: 0.45rem;
    }
    body.sidebar-collapsed .contratacoes-sidebar-title,
    body.sidebar-collapsed .contratacao-btn small,
    body.sidebar-collapsed .contratacoes-status {
      display: none;
    }
    body.sidebar-collapsed .contratacao-btn {
      padding: 0.5rem 0.35rem;
      text-align: center;
    }
    body.sidebar-collapsed .contratacao-btn span {
      font-size: 0.56rem;
    }

    /* ── ABA VISUAL ── */
    .visual-subaba-nav {
      display: none;
    }
    .visual-subaba-btn {
      width: 50px;
      min-height: 54px;
      padding: 0.4rem 0.25rem;
      border: none;
      border-radius: 12px;
      background: transparent;
      font-size: 0.54rem;
      font-weight: 700;
      color: var(--texto-suave);
      cursor: pointer;
      letter-spacing: 0.03em;
      text-transform: uppercase;
      transition: all 0.2s;
      line-height: 1.15;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 0.24rem;
    }
    .visual-subaba-btn.ativa {
      background: rgba(31,74,51,0.08);
      color: var(--verde2);
      box-shadow: inset 0 0 0 1px rgba(31,74,51,0.12);
    }
    .nav-submenu-mini {
      display: none;
      margin: 0.2rem 0 0.35rem 0.55rem;
      padding-left: 0.55rem;
      border-left: 1px solid rgba(126, 154, 137, 0.26);
    }
    .nav-submenu-mini.aberto { display: block; }
    .nav-sub-btn.has-child-menu {
      position: relative;
      justify-content: space-between;
    }
    .nav-sub-btn.has-child-menu::after {
      content: '▾';
      margin-left: auto;
      font-size: 0.78rem;
      opacity: 0.8;
    }
    .nav-sub-btn.has-child-menu.aberto::after {
      transform: rotate(180deg);
    }
    .nav-sub-btn-mini {
      min-height: 38px;
      padding: 0.48rem 0.68rem;
      font-size: 0.74rem;
    }
    .visual-subaba-painel { display: none; }
    .visual-subaba-painel.ativa { display: block; }
    #aba-visual {
      max-width: none;
      padding: 0;
      background: #dfe7de;
      border: 0;
      box-shadow: none;
      margin-top: 0;
    }
    #aba-visual .aba-intro {
      display: none;
      margin: 0;
      border-radius: 0;
      border-left: 0;
      border-bottom: 1px solid rgba(31,74,51,0.08);
      background: rgba(255,255,255,0.78);
      padding: 0.9rem 1.1rem;
    }
    .visual-workspace {
      display: block;
      min-height: calc(100vh - 12.5rem);
    }
    .visual-editor-col {
      position: fixed;
      left: 198px;
      top: 92px;
      bottom: 0;
      z-index: 19;
      width: 370px;
      min-width: 0;
      background: rgba(248,250,247,0.92);
      border-right: 1px solid rgba(31,74,51,0.10);
      padding: 0.95rem 1rem 1.4rem;
      max-height: calc(100vh - 92px);
      overflow: hidden;
      box-shadow: 14px 0 34px rgba(11,93,59,0.08);
      backdrop-filter: blur(14px);
    }

    .global-format-toolbar {
      display: flex;
      gap: 0.2rem;
      padding: 0.5rem;
      background: rgba(31,74,51,0.06);
      border: 1px solid rgba(31,74,51,0.1);
      border-radius: var(--radius-sm);
      margin-bottom: 0.75rem;
      flex-shrink: 0;
      flex-wrap: wrap;
    }
    .visual-editor-col.sem-toolbar-formato .global-format-toolbar {
      display: none !important;
    }
    .global-format-btn {
      min-width: 32px;
      height: 28px;
      border: 1px solid rgba(31,74,51,0.15);
      border-radius: 4px;
      background: #fff;
      color: var(--verde2);
      cursor: pointer;
      font-size: 0.8rem;
      font-weight: 700;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      transition: all 0.15s;
      padding: 0 0.4rem;
    }
    .global-format-btn:hover {
      background: rgba(31,74,51,0.08);
      border-color: rgba(31,74,51,0.25);
    }
    .global-format-btn.active {
      background: var(--verde);
      color: #fff;
      border-color: var(--verde);
    }
    .global-format-btn[data-format="bold"] { font-weight: 900; }
    .global-format-btn[data-format="italic"] { font-style: italic; }
    .global-format-btn[data-format="underline"] { text-decoration: underline; }
    .global-format-align-left { text-align: left; }
    .global-format-align-center { text-align: center; }
    .global-format-align-right { text-align: right; }
    .global-format-align-justify { text-align: justify; }
    .global-format-select {
      height: 28px;
      border: 1px solid rgba(31,74,51,0.15);
      border-radius: 4px;
      background: #fff;
      color: var(--verde2);
      font: 700 0.78rem/1 var(--fonte-ui);
      padding: 0 1.75rem 0 0.5rem;
      outline: none;
      cursor: pointer;
    }
    .global-format-select:hover,
    .global-format-select:focus {
      background: rgba(31,74,51,0.08);
      border-color: rgba(31,74,51,0.25);
    }
    .global-format-btn[data-format="clear"] { color: #c0392b; border-color: rgba(192,57,43,0.2); }
    .global-format-btn[data-format="clear"]:hover { background: rgba(192,57,43,0.08); }
    .global-format-separator {
      width: 1px;
      background: rgba(31,74,51,0.15);
      margin: 0 0.2rem;
    }
    .global-format-floating-toolbar {
      position: fixed;
      z-index: 1200;
      display: none;
      margin: 0;
      padding: 0.42rem;
      background: rgba(255,255,255,0.96);
      border-color: rgba(31,74,51,0.18);
      box-shadow: 0 16px 36px rgba(15, 52, 32, 0.18);
      backdrop-filter: blur(12px);
      max-width: min(560px, calc(100vw - 24px));
    }
    .global-format-floating-toolbar.is-visible {
      display: flex;
    }
    .global-format-floating-toolbar .global-format-btn,
    .global-format-floating-toolbar .global-format-select {
      height: 30px;
    }

    .studio-panel-card {
      background: rgba(255,255,255,0.86);
      border: 1px solid rgba(31,74,51,0.09);
      border-radius: var(--radius-md);
      padding: 0.9rem;
      margin-bottom: 0.85rem;
      box-shadow: var(--sombra);
    }

    .studio-panel-title {
      display: flex;
      align-items: center;
      gap: 0.4rem;
      color: var(--texto-suave);
      font-size: 0.62rem;
      font-weight: 600;
      letter-spacing: 0.09em;
      text-transform: uppercase;
      margin-bottom: 0.75rem;
      font-family: var(--font-ui);
    }

    .ensino-studio-abas {
      display: flex;
      gap: 0.45rem;
      margin: 0 0 0.9rem;
      overflow-x: auto;
      padding-bottom: 0.1rem;
    }

    .ensino-studio-abas .aba-btn {
      flex: 1 0 0;
      min-width: max-content;
      justify-content: center;
      padding: 0.72rem 0.85rem;
      font-size: 0.72rem;
      white-space: nowrap;
    }

    .ensino-studio-painel {
      display: none;
    }

    .ensino-studio-painel.ativa {
      display: block;
    }

    .historia-campos-avancados {
      display: none !important;
    }

    .range-row {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr) 48px;
      align-items: center;
      gap: 0.65rem;
      margin: 0.85rem 0 0.2rem;
      color: var(--texto-suave);
      font-size: 0.78rem;
      font-weight: 700;
    }

    .range-row input[type="range"] {
      width: 100%;
      accent-color: var(--verde2);
    }

    .range-value {
      text-align: right;
      font-family: monospace;
      color: var(--verde2);
    }

    .secao-toggle-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0.55rem;
    }

    .secao-toggle {
      min-height: 64px;
      border: 1px solid rgba(31,74,51,0.16);
      border-radius: var(--radius-sm);
      background: rgba(255,255,255,0.72);
      color: var(--verde-escuro);
      font-size: 0.62rem;
      font-weight: 600;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      cursor: pointer;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 0.3rem;
      transition: background 0.15s, border-color 0.15s;
      font-family: var(--font-ui);
    }
    .secao-toggle:hover {
      background: rgba(255,255,255,0.90);
      border-color: rgba(31,74,51,0.24);
    }

    .secao-toggle .secao-icon {
      width: 22px;
      height: 22px;
      display: block;
      background-repeat: no-repeat;
      background-position: center;
      background-size: contain;
      filter: saturate(0.9);
    }
    .secao-toggle .secao-icon.devocional { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23506b5a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v18M8.5 7.5h7M8 12h8M9 16.5h6'/%3E%3Ccircle cx='12' cy='12' r='9' opacity='.08' fill='%23506b5a' stroke='none'/%3E%3C/svg%3E"); }
    .secao-toggle .secao-icon.programacao { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23506b5a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='5' width='16' height='15' rx='2'/%3E%3Cpath d='M8 3v4M16 3v4M4 10h16'/%3E%3C/svg%3E"); }
    .secao-toggle .secao-icon.liturgia { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23506b5a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18V5l8-2v13'/%3E%3Ccircle cx='7' cy='18' r='2'/%3E%3Ccircle cx='15' cy='16' r='2'/%3E%3C/svg%3E"); }
    .secao-toggle .secao-icon.simbolos { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23506b5a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4.5h6a3 3 0 0 1 3 3V20H8a3 3 0 0 0-3 3V4.5z'/%3E%3Cpath d='M19 4.5h-6a3 3 0 0 0-3 3V20h6a3 3 0 0 1 3 3V4.5z'/%3E%3C/svg%3E"); }
    .secao-toggle .secao-icon.aniversariantes { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23506b5a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 11h14l-1.2 8H6.2L5 11z'/%3E%3Cpath d='M12 11V6M9 6c0 1.2 1.1 2 3 2s3-.8 3-2c0-1.1-.9-2-2-2-1 0-1.8.7-2 1.6C10.8 4.7 10 4 9 4c-1.1 0-2 .9-2 2z'/%3E%3Cpath d='M4 11h16'/%3E%3C/svg%3E"); }
    .secao-toggle .secao-icon.dizimos { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23506b5a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cellipse cx='12' cy='8' rx='6' ry='2'/%3E%3Cpath d='M6 8v3c0 1.1 2.7 2 6 2s6-.9 6-2V8'/%3E%3Cpath d='M6 11v3c0 1.1 2.7 2 6 2s6-.9 6-2v-3'/%3E%3C/svg%3E"); }
    .secao-toggle .secao-icon.avisos { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23506b5a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12v-2l11-4v12L4 14v-2z'/%3E%3Cpath d='M15 10h2a3 3 0 0 1 0 6h-2'/%3E%3Cpath d='M7 15l1 4h3'/%3E%3C/svg%3E"); }
    .secao-toggle .secao-icon.ebd { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23506b5a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 4h12v4H6zM6 10h12v10H6z'/%3E%3Cpath d='M10 14h4M10 18h4'/%3E%3C/svg%3E"); }
    .secao-toggle .secao-icon.conheca { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23506b5a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21h18M5 21V9l7-4 7 4v12M9 21v-5h6v5'/%3E%3C/svg%3E"); }
    .secao-toggle .secao-icon.uso-imagem { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23506b5a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h16v11H4z'/%3E%3Cpath d='M8 7l1.5-2h5L16 7'/%3E%3Ccircle cx='12' cy='12.5' r='2.7'/%3E%3C/svg%3E"); }
    }

    .secao-toggle.inativa {
      opacity: 0.42;
      border-style: dashed;
      background: rgba(255,255,255,0.38);
    }

    /* ── Modelo 1: Pílula ── */
    .secao-toggle-grid.modelo-botoes-1 .secao-toggle {
      border-radius: 999px;
      min-height: 54px;
      flex-direction: row;
      gap: 0.55rem;
      padding: 0 1.1rem;
    }

    /* ── Modelo 2: Bloco ── */
    .secao-toggle-grid.modelo-botoes-2 .secao-toggle {
      border-radius: 16px;
      min-height: 90px;
      border-width: 1px;
      background: rgba(255,255,255,0.88);
      gap: 0.55rem;
    }
    .secao-toggle-grid.modelo-botoes-2 .secao-toggle .secao-icon {
      width: 30px;
      height: 30px;
    }

    /* ── Modelo 3: Minimal ── */
    .secao-toggle-grid.modelo-botoes-3 .secao-toggle {
      border-radius: 6px;
      border-color: rgba(31,74,51,0.15);
      border-width: 1px;
      background: transparent;
      min-height: 60px;
      font-size: 0.62rem;
    }

    /* ── Seletor de modelo ── */
    .button-model-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:0.5rem; }
    .button-model-opt {
      display:flex; flex-direction:column; align-items:center; gap:0.4rem;
      padding:0.6rem 0.3rem; border:2px solid rgba(31,74,51,0.2); border-radius:10px;
      background:rgba(255,255,255,0.6); cursor:pointer; font-size:0.59rem;
      font-weight:700; letter-spacing:0.05em; text-transform:uppercase;
      color:var(--verde-escuro); transition:border-color 0.15s, background 0.15s;
    }
    .button-model-opt.ativa { border-color:var(--verde2); background:rgba(46,101,69,0.1); }
    .button-model-preview { display:grid; grid-template-columns:1fr 1fr; gap:2px; width:48px; height:34px; }
    .button-model-preview > div { background:rgba(31,74,51,0.13); border:1px solid rgba(31,74,51,0.25); border-radius:3px; }
    .modelo-prev-1 > div { border-radius:999px; }
    .modelo-prev-2 > div { border-radius:6px; background:rgba(255,255,255,0.9); border:1.5px solid rgba(31,74,51,0.2); }
    .modelo-prev-3 > div { background:transparent; border:1px solid rgba(31,74,51,0.2); border-radius:2px; }

    /* ══ Famílias de ícones ══ */
    .icon-family-1 .secao-toggle .secao-icon {
      filter:drop-shadow(0 0 1px rgba(31,74,51,0.9)) drop-shadow(0 0 0.5px rgba(31,74,51,0.8));
    }
    .icon-family-2 .secao-toggle .secao-icon {
      background-color:rgba(80,107,90,0.11); border-radius:50%; width:36px; height:36px; background-size:20px;
    }
    .icon-family-3 .secao-toggle .secao-icon {
      background-color:rgba(31,74,51,0.13); border-radius:9px; width:34px; height:34px;
      background-size:20px; filter:saturate(1.4) brightness(0.82);
    }
    .icon-family-4 .secao-toggle .secao-icon {
      background-color:var(--verde-escuro); border-radius:9px; width:34px; height:34px; background-size:20px;
    }
    .icon-family-4 .secao-toggle .secao-icon.devocional { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v18M8.5 7.5h7M8 12h8M9 16.5h6'/%3E%3C/svg%3E"); }
    .icon-family-4 .secao-toggle .secao-icon.programacao { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='5' width='16' height='15' rx='2'/%3E%3Cpath d='M8 3v4M16 3v4M4 10h16'/%3E%3C/svg%3E"); }
    .icon-family-4 .secao-toggle .secao-icon.liturgia { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18V5l8-2v13'/%3E%3Ccircle cx='7' cy='18' r='2'/%3E%3Ccircle cx='15' cy='16' r='2'/%3E%3C/svg%3E"); }
    .icon-family-4 .secao-toggle .secao-icon.simbolos { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4.5h6a3 3 0 0 1 3 3V20H8a3 3 0 0 0-3 3V4.5z'/%3E%3Cpath d='M19 4.5h-6a3 3 0 0 0-3 3V20h6a3 3 0 0 1 3 3V4.5z'/%3E%3C/svg%3E"); }
    .icon-family-4 .secao-toggle .secao-icon.aniversariantes { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 11h14l-1.2 8H6.2L5 11z'/%3E%3Cpath d='M12 11V6M9 6c0 1.2 1.1 2 3 2s3-.8 3-2c0-1.1-.9-2-2-2-1 0-1.8.7-2 1.6C10.8 4.7 10 4 9 4c-1.1 0-2 .9-2 2z'/%3E%3Cpath d='M4 11h16'/%3E%3C/svg%3E"); }
    .icon-family-4 .secao-toggle .secao-icon.dizimos { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cellipse cx='12' cy='8' rx='6' ry='2'/%3E%3Cpath d='M6 8v3c0 1.1 2.7 2 6 2s6-.9 6-2V8'/%3E%3Cpath d='M6 11v3c0 1.1 2.7 2 6 2s6-.9 6-2v-3'/%3E%3C/svg%3E"); }
    .icon-family-4 .secao-toggle .secao-icon.avisos { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12v-2l11-4v12L4 14v-2z'/%3E%3Cpath d='M15 10h2a3 3 0 0 1 0 6h-2'/%3E%3Cpath d='M7 15l1 4h3'/%3E%3C/svg%3E"); }
    .icon-family-4 .secao-toggle .secao-icon.ebd { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 4h12v4H6zM6 10h12v10H6z'/%3E%3Cpath d='M10 14h4M10 18h4'/%3E%3C/svg%3E"); }
    .icon-family-4 .secao-toggle .secao-icon.conheca { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21h18M5 21V9l7-4 7 4v12M9 21v-5h6v5'/%3E%3C/svg%3E"); }
    .icon-family-4 .secao-toggle .secao-icon.uso-imagem { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h16v11H4z'/%3E%3Cpath d='M8 7l1.5-2h5L16 7'/%3E%3Ccircle cx='12' cy='12.5' r='2.7'/%3E%3C/svg%3E"); }
    /* Seletor de família */
    .icon-family-grid { display:grid; grid-template-columns:1fr 1fr; gap:0.5rem; }
    .icon-family-opt {
      display:flex; flex-direction:column; gap:0.25rem; padding:0.65rem 0.55rem 0.55rem;
      border:2px solid rgba(31,74,51,0.18); border-radius:12px; background:rgba(255,255,255,0.65);
      cursor:pointer; text-align:left; color:var(--verde-escuro);
      transition:border-color 0.15s, background 0.15s;
    }
    .icon-family-opt.ativa { border-color:var(--verde2); background:rgba(46,101,69,0.08); }
    .icon-family-opt strong { font-size:0.71rem; font-weight:800; letter-spacing:0.03em; display:block; margin-top:0.15rem; }
    .icon-family-opt small { font-size:0.59rem; color:var(--texto-suave); line-height:1.3; }
    .icon-family-preview { display:flex; gap:3px; align-items:center; height:26px; }
    .icon-family-preview span {
      font-size:0.82rem; display:inline-flex; align-items:center; justify-content:center;
      width:24px; height:24px; flex-shrink:0; color:var(--verde-escuro);
    }
    .if-solido span { font-weight:900; text-shadow:0 0 1.5px rgba(31,74,51,0.8),0 0 3px rgba(31,74,51,0.35); }
    .if-soft span { background:rgba(80,107,90,0.11); border-radius:50%; font-size:0.72rem; }
    .if-ilustrado span { background:rgba(31,74,51,0.13); border-radius:5px; font-size:0.72rem; }
    .if-selo span { background:var(--verde-escuro); border-radius:5px; font-size:0.72rem; color:#fff; }

    .social-field {
      display: grid;
      grid-template-columns: 24px minmax(0, 1fr);
      align-items: end;
      gap: 0.65rem;
    }

    .social-field .social-icon {
      padding-bottom: 0.72rem;
      color: var(--verde2);
      font-size: 1rem;
      text-align: center;
    }
    /* ── Social modelo selector ── */
    .social-modelo-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: .45rem;
      margin-top: .35rem;
    }
    .social-modelo-btn {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: .3rem;
      background: rgba(255,255,255,.7);
      border: 2px solid var(--studio-border);
      border-radius: 10px;
      padding: .5rem .4rem .42rem;
      cursor: pointer;
      transition: border-color .18s, background .18s;
      min-width: 0;
      overflow: hidden;
    }
    .social-modelo-btn:hover { border-color: var(--verde2); background: rgba(255,255,255,.95); }
    .social-modelo-btn.active { border-color: var(--verde2); background: rgba(31,74,51,.07); }
    body.studio-dark .social-modelo-btn { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.14); }
    body.studio-dark .social-modelo-btn.active { border-color: var(--verde2); background: rgba(31,74,51,.22); }
    .social-modelo-label { font-size: .6rem; font-weight: 700; letter-spacing: .04em; color: var(--verde2); text-transform: uppercase; white-space: nowrap; }
    .social-modelo-preview {
      display: flex;
      align-items: center;
      gap: 3px;
      flex-shrink: 0;
    }
    .smp-item {
      font-size: .48rem;
      font-weight: 800;
      letter-spacing: .04em;
      border-radius: 999px;
      padding: 2px 5px;
      white-space: nowrap;
    }
    .smp-outline {
      background: transparent !important;
      border: 1.5px solid;
    }
    .smp-minimal {
      background: rgba(31,74,51,.09) !important;
      color: #2d5a3d !important;
      border-radius: 5px !important;
    }
    body.studio-dark .smp-minimal { background: rgba(255,255,255,.1) !important; color: #b6d9c4 !important; }
    .smp-circulo {
      width: 14px;
      height: 14px;
      border-radius: 50%;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: .44rem;
      font-weight: 900;
      flex-shrink: 0;
    }

    .visual-live-col {
      position: relative;
      min-width: 0;
      min-height: calc(100vh - 2rem);
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 1.1rem 1.4rem 2.8rem 350px;
      overflow-x: auto;
      overflow-y: hidden;
      scrollbar-gutter: stable both-edges;
      background:
        radial-gradient(ellipse 48% 34% at 52% 50%, rgba(255,255,255,0.42), transparent 72%),
        #d3dcd1;
    }
    .visual-live-panel {
      width: min(100%, 1120px);
      max-width: 100%;
      margin: auto;
      background: transparent;
      border-radius: 0;
      padding: 0;
      box-shadow: none;
      border: 0;
      display: flex;
      flex: 0 0 auto;
      flex-direction: column;
      align-items: center;
      transform: translateX(var(--preview-pan-x, 0px));
      transition: transform 0.14s ease-out;
    }
    .visual-live-head {
      display: none;
      align-items: center;
      justify-content: space-between;
      gap: 0.75rem;
      padding: 0 0 0.8rem;
      color: var(--verde2);
    }
    .visual-live-head strong {
      display: block;
      font-size: 0.78rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }
    .visual-live-head span {
      display: block;
      margin-top: 0.12rem;
      font-size: 0.68rem;
      color: rgba(31,74,51,0.62);
      line-height: 1.35;
    }
    .visual-live-actions {
      display: flex;
      align-items: center;
      gap: 0.4rem;
      flex-shrink: 0;
    }
    .visual-live-actions button {
      border: 1px solid rgba(31,74,51,0.16);
      background: rgba(255,255,255,0.74);
      color: var(--verde2);
      border-radius: 999px;
      padding: 0.42rem 0.7rem;
      font-size: 0.68rem;
      font-weight: 800;
      cursor: pointer;
    }
    .visual-live-frame-wrap {
      --preview-width: 390px;
      --preview-height: 844px;
      --preview-scale: 0.74;
      position: relative;
      width: min(292px, calc(100vw - 2rem));
      height: min(632px, calc(100vh - 7.5rem));
      min-height: 500px;
      margin: 0 auto;
      padding: 0;
      box-sizing: border-box;
      border: 6px solid #141414;
      border-radius: 31px;
      overflow: hidden;
      background: #fff;
      box-shadow: 0 22px 48px rgba(15,22,17,0.28);
    }
    .visual-live-frame-wrap::after {
      content: '';
      position: absolute;
      inset: 0;
      border-radius: inherit;
      pointer-events: none;
      box-shadow: inset 0 0 0 1px rgba(255,255,255,0.06);
    }
    .visual-live-frame-wrap::before {
      content: '';
      position: absolute;
      z-index: 2;
      top: 10px;
      left: 50%;
      transform: translateX(-50%);
      width: 54px;
      height: 5px;
      border-radius: 999px;
      background: #111;
      opacity: 0.92;
    }
    .visual-live-frame {
      position: absolute;
      top: 0;
      left: 50%;
      width: var(--preview-width);
      height: var(--preview-height);
      margin: 0;
      border: 0;
      background: #fff;
      display: block;
      border-radius: 24px;
      transform: translateX(-50%) scale(var(--preview-scale));
      transform-origin: top center;
    }
    .visual-live-frame-wrap[data-device="phone"] {
      width: min(292px, calc(100vw - 2rem));
      height: min(632px, calc(100vh - 7.5rem));
      border-radius: 31px;
    }
    .visual-live-frame-wrap[data-device="tablet"] {
      width: min(488px, calc(100vw - 3rem));
      height: min(690px, calc(100vh - 7rem));
      border-radius: 28px;
      border-width: 8px;
      background: linear-gradient(180deg, #fff, #f7f7f7);
    }
    .visual-live-frame-wrap[data-device="desktop"] {
      width: min(100%, 980px);
      height: min(620px, calc(100vh - 7rem));
      border-radius: 26px;
      border-width: 6px;
      border-color: rgba(25, 34, 28, 0.9);
      background:
        linear-gradient(180deg, rgba(255,255,255,0.82), rgba(248,247,242,0.96)),
        linear-gradient(180deg, #f8f8f8, #ffffff);
      box-shadow: 0 20px 44px rgba(16,38,26,0.16);
    }
    .visual-live-frame-wrap[data-device="desktop"]::before {
      width: 0;
      height: 0;
      opacity: 0;
    }
    .visual-live-frame-wrap[data-device="desktop"] .visual-live-frame {
      border-radius: 18px;
      box-shadow: 0 14px 34px rgba(18,34,24,0.1);
    }
    .visual-live-status {
      display: none;
      padding: 0.8rem 0.2rem 0;
      min-height: 1.4rem;
      font-size: 0.68rem;
      color: rgba(31,74,51,0.68);
      line-height: 1.45;
      text-align: center;
    }

    /* logo upload */
    .logo-upload-area {
      border: 2px dashed rgba(31,74,51,0.25);
      border-radius: 18px;
      padding: 2rem 1rem;
      text-align: center;
      cursor: pointer;
      transition: all 0.2s;
      background: rgba(255,255,255,0.6);
      margin-bottom: 1.2rem;
      position: relative;
    }
    .logo-upload-area:hover, .logo-upload-area.drag-over {
      border-color: var(--verde2);
      background: rgba(31,74,51,0.04);
    }
    .logo-upload-area strong { display: block; font-size: 0.9rem; color: var(--verde2); margin-bottom: 0.3rem; }
    .logo-preview-img {
      max-height: 100px;
      max-width: 100%;
      margin: 0.8rem auto 0;
      display: none;
      border-radius: 8px;
      filter: drop-shadow(0 4px 12px rgba(0,0,0,0.12));
    }

    /* paleta de cores */
    .paleta-titulo {
      font-size: 0.72rem;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--verde2);
      margin-bottom: 0.8rem;
    }
    .paleta-dica {
      font-size: 0.78rem;
      color: var(--texto-suave);
      margin-bottom: 1rem;
      line-height: 1.55;
      padding: 0.7rem 0.9rem;
      background: rgba(31,74,51,0.05);
      border-radius: 10px;
      border: 1px solid rgba(31,74,51,0.08);
    }
    .paleta-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
      gap: 0.75rem;
      margin-bottom: 1.2rem;
    }
    .cor-chip {
      background: #fff;
      border: 2px solid rgba(31,74,51,0.12);
      border-radius: 14px;
      padding: 0.75rem 0.65rem;
      text-align: center;
      cursor: grab;
      transition: all 0.2s;
      box-shadow: 0 4px 12px rgba(11,93,59,0.06);
      position: relative;
      user-select: none;
    }
    .cor-chip:active { cursor: grabbing; }
    .cor-chip.drag-about { opacity: 0.4; transform: scale(0.96); }
    .cor-chip.drag-over-chip { border-color: var(--verde2); box-shadow: 0 0 0 3px rgba(31,74,51,0.15); }
    .cor-chip.sem-paleta { border-style: dashed; opacity: 0.5; }
    .cor-swatch {
      width: 48px;
      height: 48px;
      border-radius: 12px;
      margin: 0 auto 0.55rem;
      box-shadow: 0 4px 10px rgba(0,0,0,0.15);
      border: 2px solid rgba(255,255,255,0.5);
    }
    .cor-label {
      font-size: 0.65rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      color: var(--verde2);
      margin-bottom: 0.2rem;
      display: block;
    }
    .cor-hex {
      font-size: 0.7rem;
      color: var(--texto-suave);
      font-family: monospace;
    }
    .cor-posicao {
      position: absolute;
      top: -10px;
      left: 50%;
      transform: translateX(-50%);
      background: var(--verde2);
      color: #fff;
      font-size: 0.6rem;
      font-weight: 700;
      letter-spacing: 0.08em;
      padding: 0.15rem 0.5rem;
      border-radius: 999px;
      text-transform: uppercase;
      white-space: nowrap;
    }

    /* preview strip */
    .visual-preview-strip {
      border-radius: 16px;
      overflow: hidden;
      margin-bottom: 1.2rem;
      box-shadow: 0 8px 24px rgba(11,93,59,0.12);
      border: 1px solid rgba(31,74,51,0.08);
    }
    .preview-strip-header {
      padding: 1rem 1.2rem;
      color: #fff;
      font-family: 'Cormorant Garamond', serif;
      font-size: 1.1rem;
      display: flex;
      align-items: center;
      gap: 0.8rem;
    }
    .preview-strip-body {
      padding: 0.9rem 1.2rem;
      display: flex;
      gap: 0.6rem;
      flex-wrap: wrap;
    }
    .preview-chip {
      border-radius: 999px;
      padding: 0.45rem 0.9rem;
      font-size: 0.72rem;
      font-weight: 700;
      color: #fff;
    }
    .preview-card-sample {
      border-radius: 10px;
      padding: 0.6rem 1rem;
      font-size: 0.78rem;
      font-weight: 700;
      border-left: 4px solid;
      background: rgba(255,255,255,0.85);
    }

    /* btn aplicar tema */
    .btn-aplicar-tema {
      width: 100%;
      padding: 0.85rem 1rem;
      background: linear-gradient(135deg, var(--verde), var(--verde2));
      color: #fff;
      border: none;
      border-radius: 14px;
      font-size: 0.88rem;
      font-weight: 700;
      cursor: pointer;
      margin-bottom: 0.5rem;
      transition: all 0.2s;
      box-shadow: 0 8px 20px rgba(11,93,59,0.2);
      letter-spacing: 0.03em;
    }
    .btn-aplicar-tema:hover { transform: translateY(-1px); box-shadow: 0 12px 28px rgba(11,93,59,0.25); }
    .btn-resetar-tema {
      width: 100%;
      padding: 0.6rem 1rem;
      background: transparent;
      color: var(--texto-suave);
      border: 1px solid rgba(31,74,51,0.15);
      border-radius: 10px;
      font-size: 0.78rem;
      cursor: pointer;
      margin-bottom: 1rem;
    }
    .btn-fundo-tema {
      width: 100%;
      padding: 0.65rem 1rem;
      background: linear-gradient(135deg, rgba(31,74,51,0.08), rgba(11,93,59,0.05));
      color: var(--verde-escuro);
      border: 1px solid rgba(31,74,51,0.18);
      border-radius: 10px;
      font-size: 0.82rem;
      font-weight: 700;
      cursor: pointer;
      margin-bottom: 1rem;
      box-shadow: 0 8px 18px rgba(18,42,29,0.06);
    }
    .btn-fundo-tema:hover {
      background: linear-gradient(135deg, rgba(31,74,51,0.12), rgba(11,93,59,0.08));
    }
    #visual-status-tema {
      display: none;
      margin: 0.45rem 0 0.85rem;
      padding: 0.6rem 0.75rem;
      border-left: 4px solid var(--verde2);
      border-radius: 8px;
      background: rgba(31,74,51,0.06);
      color: var(--verde-escuro);
      font-size: 0.82rem;
      line-height: 1.5;
      font-weight: 600;
    }

    @media (max-width: 1050px) {
      .visual-workspace {
        display: block;
      }
      .visual-editor-col {
        position: static;
        width: auto;
        box-shadow: none;
      }
      .visual-live-col {
        position: static;
        min-height: 720px;
        padding: 1rem;
      }
      .visual-live-frame-wrap {
        height: 680px;
        min-height: 560px;
      }
      .visual-editor-col {
        max-height: none;
      }
    }

    /* logos rodapé */
    .logos-linha {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 1rem;
      margin-bottom: 1rem;
    }
    .logo-preview-mini {
      max-height: 50px;
      max-width: 100%;
      display: block;
      margin-top: 0.5rem;
      filter: drop-shadow(0 2px 6px rgba(0,0,0,0.12));
    }
    .cor-fundo-wrap {
      display: flex;
      align-items: center;
      gap: 0.8rem;
      margin-bottom: 1rem;
    }
    .cor-fundo-wrap input[type="color"] {
      width: 48px;
      height: 38px;
      border: 1px solid var(--borda);
      border-radius: 8px;
      padding: 2px;
      cursor: pointer;
      background: none;
    }
    .cor-fundo-preview {
      flex: 1;
      height: 38px;
      border-radius: 8px;
      border: 1px solid var(--borda);
      display: flex;
      align-items: center;
      padding: 0 0.8rem;
      font-size: 0.78rem;
      font-family: monospace;
      color: var(--texto-suave);
      background: var(--branco);
    }

    /* ── Topo compacto Boletim Studio ── */
    .header {
      position: sticky;
      top: 0;
      z-index: 90;
      margin-left: 198px;
      min-height: 54px;
      padding: 0.45rem 0.9rem;
      background: #10261a;
      color: #f7faf3;
      border-bottom: 1px solid rgba(255,255,255,0.08);
      box-shadow: none;
      overflow: visible;
    }
    .header::after { display: none; }
    .studio-brand { gap: 0.7rem; }
    .studio-brand-logo {
      width: 34px;
      height: 34px;
      border-radius: 8px;
      padding: 0.2rem;
      box-shadow: none;
    }
    .header-kicker {
      display: block;
      border: 0;
      background: transparent;
      padding: 0;
      margin: 0;
      font-size: 0.52rem;
      color: rgba(247,250,243,0.62);
      letter-spacing: 0.12em;
    }
    .header h1 {
      font-family: 'Lato', sans-serif;
      font-size: 0.86rem;
      line-height: 1.1;
      margin: 0;
      color: #f7faf3;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }
    .header p { display: none; }
    .header-actions {
      margin-left: auto;
      gap: 0.42rem;
      flex-wrap: nowrap;
    }
    .btn-secundario,
    .btn-publicar,
    .btn-gerar-boletim {
      min-height: 30px;
      padding: 0.42rem 0.75rem;
      border-radius: 999px;
      font-size: 0.68rem;
      font-weight: 800;
      letter-spacing: 0.02em;
      box-shadow: none;
      transform: none;
    }
    .btn-secundario {
      background: rgba(255,255,255,0.08);
      color: rgba(247,250,243,0.92);
      border-color: rgba(255,255,255,0.12);
    }
    .btn-secundario:hover {
      background: rgba(255,255,255,0.14);
      transform: none;
    }
    .btn-gerar-boletim {
      background: rgba(255,255,255,0.09);
      border: 1px solid rgba(255,255,255,0.12);
      color: #f7faf3;
    }
    .btn-publicar {
      background: var(--dourado);
      color: #10261a;
      border: 0;
    }
    .btn-publicar:hover {
      background: #cfb266;
      color: #10261a;
    }
    .profile-trigger {
      width: 32px;
      height: 32px;
      background: rgba(255,255,255,0.10);
      color: #f7faf3;
      border-color: rgba(255,255,255,0.16);
      box-shadow: none;
      font-size: 0.7rem;
    }
    .profile-popover {
      top: 62px;
      border-radius: 10px;
    }
    .profile-close {
      position: absolute;
      top: 0.6rem;
      right: 0.65rem;
      width: 28px;
      height: 28px;
      border-radius: 50%;
      border: 1px solid rgba(31,74,51,0.12);
      background: #f7faf3;
      color: var(--verde);
      cursor: pointer;
      font-weight: 900;
    }
    @media (max-width: 820px) {
      .header {
        margin-left: 0;
        flex-direction: row;
        align-items: center;
      }
      .header-actions {
        overflow-x: auto;
        max-width: 62vw;
      }
      .header-actions::-webkit-scrollbar { display:none; }
    }

    /* ── Tema institucional Boletim Studio v2 ── */
    :root {
      --studio-sidebar-w: 224px;
      --studio-sidebar-collapsed-w: 74px;
      --studio-header-h: 58px;
      --studio-surface: rgba(255, 253, 248, 0.76);
      --studio-surface-strong: #fffdfa;
      --studio-border: rgba(16, 38, 26, 0.12);
      --studio-shadow: 0 18px 40px rgba(16, 38, 26, 0.08);
      --studio-sidebar-bg: #10261a;
      --studio-text-soft: #6f746d;
      --studio-gold: #c5a359;
    }
    body {
      background:
        radial-gradient(circle at top right, rgba(197,163,89,0.12), transparent 24%),
        linear-gradient(180deg, #f7f4ec 0%, #efebdf 100%);
      color: #1d241f;
    }
    body.studio-dark {
      --studio-surface: rgba(16, 20, 18, 0.92);
      --studio-surface-strong: #111714;
      --studio-border: rgba(229, 236, 231, 0.08);
      --studio-shadow: 0 18px 40px rgba(0, 0, 0, 0.34);
      --studio-sidebar-bg: #050706;
      --studio-text-soft: #b9c4bc;
      background:
        radial-gradient(circle at top right, rgba(197,163,89,0.10), transparent 24%),
        linear-gradient(180deg, #080b09 0%, #0d110f 100%);
      color: #f4f8f5;
    }
    .header,
    .config-bar,
    .publish-warning,
    .painel-shell {
      margin-left: var(--studio-sidebar-w);
      transition: margin-left 0.22s ease;
    }
    body.sidebar-collapsed .header,
    body.sidebar-collapsed .config-bar,
    body.sidebar-collapsed .publish-warning,
    body.sidebar-collapsed .painel-shell {
      margin-left: var(--studio-sidebar-collapsed-w);
    }
    .header {
      min-height: var(--studio-header-h);
      padding: 0.55rem 1rem;
      background: rgba(16,38,26,0.96);
      border-bottom: 1px solid rgba(255,255,255,0.06);
      box-shadow: 0 8px 24px rgba(16,38,26,0.12);
      backdrop-filter: blur(14px);
    }
    body.studio-dark .header {
      background: rgba(4,7,6,0.96);
      border-bottom-color: rgba(255,255,255,0.06);
      box-shadow: 0 10px 30px rgba(0,0,0,0.42);
    }
    .studio-topbar-brand {
      display: flex;
      flex-direction: column;
      min-width: 0;
    }
    .header-kicker {
      display: block;
      font-size: 0.56rem;
      font-weight: 800;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      color: rgba(247,250,243,0.56);
      margin: 0 0 0.08rem;
      padding: 0;
      border: 0;
      background: transparent;
    }
    .header h1 {
      font-family: 'Lato', sans-serif;
      font-size: 1rem;
      font-weight: 900;
      line-height: 1.08;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: #f8fbf6;
      margin: 0;
    }
    .header-actions {
      gap: 0.46rem;
      flex-wrap: nowrap;
    }
    .device-switch {
      display: inline-flex;
      align-items: center;
      gap: 0.35rem;
      padding: 0.22rem;
      border-radius: 999px;
      background: rgba(255,255,255,0.08);
      border: 1px solid rgba(255,255,255,0.08);
    }
    body.studio-dark .btn-publicar {
      background: linear-gradient(135deg, #d6b163, #b58a2f);
      color: #09100d;
      border-color: rgba(214,177,99,0.24);
    }
    body.studio-dark .profile-trigger,
    body.studio-dark .device-switch,
    body.studio-dark .device-btn {
      background: rgba(255,255,255,0.05);
      border-color: rgba(255,255,255,0.08);
      color: #f4f8f5;
    }
    body.studio-dark .device-btn.ativa {
      background: rgba(214,177,99,0.18);
      border-color: rgba(214,177,99,0.22);
    }
    .device-btn {
      width: 34px;
      height: 34px;
      border: 0;
      border-radius: 50%;
      background: transparent;
      color: rgba(248,251,246,0.72);
      cursor: pointer;
      display: grid;
      place-items: center;
    }
    .device-btn.ativa {
      background: rgba(255,255,255,0.14);
      color: #f8fbf6;
    }
    .device-ico {
      display: block;
      width: 16px;
      height: 16px;
      background-repeat: no-repeat;
      background-position: center;
      background-size: contain;
      filter: brightness(0) invert(1);
      opacity: 0.92;
    }
    .device-ico.phone { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f4a33' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='7' y='2.5' width='10' height='19' rx='2.2'/%3E%3Cpath d='M10.5 5h3'/%3E%3Ccircle cx='12' cy='18.3' r='0.8' fill='%231f4a33' stroke='none'/%3E%3C/svg%3E"); }
    .device-ico.tablet { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='3' width='14' height='18' rx='2.2'/%3E%3Ccircle cx='12' cy='17.5' r='0.8' fill='%23ffffff' stroke='none'/%3E%3C/svg%3E"); }
    .device-ico.desktop { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='12' rx='1.8'/%3E%3Cpath d='M9 20h6M12 16v4'/%3E%3C/svg%3E"); }
    .publish-menu-wrap {
      position: relative;
    }
    .publish-menu {
      position: absolute;
      top: calc(100% + 0.45rem);
      right: 0;
      min-width: 220px;
      display: none;
      padding: 0.4rem;
      border-radius: 14px;
      background: var(--studio-surface-strong);
      border: 1px solid var(--studio-border);
      box-shadow: 0 24px 48px rgba(16,38,26,0.18);
      z-index: 130;
    }
    .publish-menu.aberto {
      display: grid;
      gap: 0.3rem;
    }
    .publish-menu button {
      min-height: 40px;
      border: 0;
      border-radius: 10px;
      text-align: left;
      padding: 0.7rem 0.85rem;
      background: transparent;
      color: #163323;
      font-size: 0.76rem;
      font-weight: 800;
      cursor: pointer;
    }
    .publish-menu button:hover {
      background: rgba(24,65,42,0.08);
    }
    .btn-secundario,
    .btn-publicar,
    .btn-gerar-boletim {
      min-height: 32px;
      padding: 0.42rem 0.78rem;
      border-radius: 999px;
      font-size: 0.68rem;
      font-weight: 800;
      letter-spacing: 0.02em;
      box-shadow: none;
      transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
    }
    .btn-secundario,
    .btn-gerar-boletim {
      background: rgba(255,255,255,0.08);
      color: rgba(248,251,246,0.92);
      border: 1px solid rgba(255,255,255,0.11);
    }
    .btn-secundario:hover,
    .btn-gerar-boletim:hover {
      background: rgba(255,255,255,0.14);
      transform: none;
    }
    .btn-publicar {
      background: var(--studio-gold);
      color: #10261a;
      border: 0;
    }
    .btn-publicar:hover {
      background: #d2b16a;
      color: #10261a;
    }
    .profile-trigger {
      background: rgba(255,255,255,0.08);
      color: #f8fbf6;
      border-color: rgba(255,255,255,0.12);
    }
    .profile-popover {
      top: 64px;
      background: var(--studio-surface-strong);
      border: 1px solid var(--studio-border);
      border-radius: 16px;
      box-shadow: 0 26px 56px rgba(16,38,26,0.16);
    }
    .profile-popover h3 {
      font-family: var(--font-ui);
      font-size: 0.95rem;
      color: #143120;
    }
    .profile-popover p,
    .dica,
    .dica-compartilhar,
    .arquivo-info,
    .config-status {
      color: var(--studio-text-soft);
    }
    .profile-popover input,
    .campo input[type="text"],
    .campo input[type="email"],
    .campo input[type="password"],
    .campo textarea,
    .campo select,
    .config-bar input {
      background: rgba(255,255,255,0.94);
      border: 1px solid var(--studio-border);
      border-radius: 12px;
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.45);
    }
    .campo input:focus,
    .campo textarea:focus,
    .campo select:focus,
    .profile-popover input:focus,
    .config-bar input:focus {
      outline: none;
      border-color: rgba(24,65,42,0.34);
      box-shadow: 0 0 0 3px rgba(197,163,89,0.14);
    }
    .config-bar {
      padding: 0.9rem 1rem;
      background: rgba(255,253,248,0.82);
      border-bottom: 1px solid var(--studio-border);
      backdrop-filter: blur(12px);
    }
    .publish-warning {
      max-width: none;
      margin: 1rem 1rem 0 calc(var(--studio-sidebar-w) + 1rem);
      padding: 0.95rem 1rem;
      background: rgba(255,253,248,0.76);
      border: 1px solid var(--studio-border);
      border-radius: 16px;
      box-shadow: var(--studio-shadow);
      backdrop-filter: blur(10px);
      transition: margin-left 0.22s ease;
      display: none;
    }
    body.sidebar-collapsed .publish-warning {
      margin-left: calc(var(--studio-sidebar-collapsed-w) + 1rem);
    }
    .abas-nav {
      width: var(--studio-sidebar-w);
      padding: 0.9rem 0.8rem;
      background: linear-gradient(180deg, #10261a 0%, #122b1d 100%);
      border-right: 1px solid rgba(255,255,255,0.06);
      box-shadow: 10px 0 28px rgba(16,38,26,0.10);
      transition: width 0.22s ease, padding 0.22s ease;
    }
    body.sidebar-collapsed .abas-nav {
      width: var(--studio-sidebar-collapsed-w);
      padding-inline: 0.55rem;
    }
    .studio-sidebar-brand {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr) auto;
      gap: 0.7rem;
      align-items: center;
      padding: 0.2rem 0.2rem 1rem;
      margin-bottom: 0.85rem;
      border-bottom: 1px solid rgba(255,255,255,0.08);
    }
    .studio-sidebar-brand img {
      width: 34px;
      height: 34px;
      border-radius: 10px;
      background: rgba(255,255,255,0.96);
      padding: 0.16rem;
    }
    .studio-sidebar-brand-copy strong {
      display: block;
      font-family: 'Lato', sans-serif;
      font-size: 0.84rem;
      font-weight: 900;
      line-height: 1.1;
      color: #f8fbf6;
      letter-spacing: 0.05em;
      text-transform: uppercase;
    }
    .studio-sidebar-brand-copy span {
      display: block;
      margin-top: 0.18rem;
      font-size: 0.56rem;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: rgba(248,251,246,0.52);
    }
    .studio-sidebar-toggle {
      width: 28px;
      height: 28px;
      border-radius: 9px;
      border: 1px solid rgba(255,255,255,0.08);
      background: rgba(255,255,255,0.06);
      color: #f8fbf6;
      cursor: pointer;
      font-size: 0.82rem;
      font-weight: 900;
    }
    body.sidebar-collapsed .studio-sidebar-brand {
      grid-template-columns: 1fr;
      justify-items: center;
      padding-bottom: 0.8rem;
    }
    body.sidebar-collapsed .studio-sidebar-brand-copy,
    body.sidebar-collapsed .submenu-caret,
    body.sidebar-collapsed .nav-submenu {
      display: none !important;
    }
    body.sidebar-collapsed .studio-sidebar-toggle {
      transform: rotate(180deg);
    }
    .aba-nav-btn {
      display: flex;
      align-items: center;
      gap: 0.72rem;
      width: 100%;
      padding: 0.78rem 0.82rem;
      border-radius: 14px;
      background: transparent;
      color: rgba(248,251,246,0.72);
      font-size: 0.72rem;
      font-weight: 800;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }
    .aba-nav-btn:hover,
    .aba-nav-btn.ativa,
    .aba-nav-btn.submenu-aberto {
      background: rgba(255,255,255,0.07);
      color: #f8fbf6;
      border-left-color: transparent;
    }
    .nav-ico {
      width: 20px;
      flex-shrink: 0;
      text-align: center;
      color: var(--studio-gold);
      font-size: 0.98rem;
      background-color: rgba(197,163,89,0.12);
      background-repeat: no-repeat;
      background-position: center;
      background-size: 13px 13px;
    }
    .nav-ico[data-ico="IN"] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c5a359' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10.6 12 3l9 7.6'/%3E%3Cpath d='M5.5 9.8V20h13V9.8'/%3E%3Cpath d='M9.5 20v-5h5v5'/%3E%3C/svg%3E"); }
    .nav-ico[data-ico="SC"] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c5a359' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='4' width='7' height='7' rx='1.4'/%3E%3Crect x='13' y='4' width='7' height='7' rx='1.4'/%3E%3Crect x='4' y='13' width='7' height='7' rx='1.4'/%3E%3Crect x='13' y='13' width='7' height='7' rx='1.4'/%3E%3C/svg%3E"); }
    .nav-ico[data-ico="GH"] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c5a359' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='6' cy='6' r='2.5'/%3E%3Ccircle cx='18' cy='6' r='2.5'/%3E%3Ccircle cx='12' cy='18' r='2.5'/%3E%3Cpath d='M8.2 7.4 10.7 15M15.8 7.4 13.3 15M8.4 6h7.2'/%3E%3C/svg%3E"); }
    .nav-ico[data-ico="CF"] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c5a359' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l1.2 2.6 2.9.5-2.1 2.1.5 3-2.5-1.4-2.5 1.4.5-3-2.1-2.1 2.9-.5L12 3z'/%3E%3Cpath d='M19 12l1 2.2 2.4.4-1.7 1.7.4 2.5-2.1-1.2-2.1 1.2.4-2.5-1.7-1.7 2.4-.4L19 12z' opacity='.9'/%3E%3Cpath d='M5 12l1 2.2 2.4.4-1.7 1.7.4 2.5-2.1-1.2-2.1 1.2.4-2.5-1.7-1.7 2.4-.4L5 12z' opacity='.9'/%3E%3C/svg%3E"); }
    .nav-label {
      flex: 1;
      min-width: 0;
    }
    .submenu-caret {
      width: 20px;
      height: 20px;
      border-radius: 7px;
      background: rgba(255,255,255,0.08);
      color: rgba(248,251,246,0.72);
      font-size: 0.68rem;
      display: grid;
      place-items: center;
    }
    .nav-submenu {
      margin: 0.18rem 0 0.55rem 1rem;
      padding: 0.18rem 0 0.18rem 0.85rem;
      border-left: 1px solid rgba(255,255,255,0.10);
    }
    .nav-sub-btn {
      color: rgba(248,251,246,0.58);
      font-size: 0.62rem;
    }
    .nav-sub-btn:hover,
    .nav-sub-btn.ativa {
      background: rgba(255,255,255,0.08);
      color: #f8fbf6;
    }
    .config-card-note {
      padding: 0.95rem 1rem;
      border-radius: 14px;
      border: 1px solid var(--studio-border);
      background: rgba(255,255,255,0.82);
      color: var(--texto-suave);
      font-size: 0.78rem;
      line-height: 1.6;
      margin-bottom: 0.95rem;
    }
    .github-auto-create-option {
      display: flex;
      align-items: center;
      gap: 0.65rem;
      padding: 0.75rem 0.85rem;
      border: 1px solid var(--studio-border);
      border-radius: 12px;
      background: rgba(255,255,255,0.78);
      color: #173724;
      font-size: 0.78rem;
      font-weight: 800;
      margin-bottom: 0.95rem;
      cursor: pointer;
    }
    .github-auto-create-option input {
      width: 18px;
      height: 18px;
      accent-color: var(--verde);
    }
    .github-publications-panel {
      margin-top: 1rem;
      padding-top: 1rem;
      border-top: 1px solid var(--studio-border);
    }
    .github-publications-title {
      font-size: 0.82rem;
      margin-bottom: 0.75rem;
    }
    .github-publications-list {
      display: grid;
      gap: 0.65rem;
      color: var(--texto-suave);
      font-size: 0.78rem;
    }
    .github-publication-item {
      display: grid;
      gap: 0.55rem;
      padding: 0.8rem;
      border: 1px solid var(--studio-border);
      border-radius: 12px;
      background: rgba(255,255,255,0.84);
    }
    .github-publication-item strong {
      color: #173724;
      font-size: 0.78rem;
      overflow-wrap: anywhere;
    }
    .github-publication-item a {
      color: var(--verde);
      overflow-wrap: anywhere;
      text-decoration: none;
      font-weight: 800;
    }
    .github-publication-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 0.45rem;
    }
    .github-publication-actions button,
    .github-publication-actions a {
      border: 1px solid var(--studio-border);
      border-radius: 9px;
      padding: 0.45rem 0.7rem;
      background: #f8fbf6;
      color: #173724;
      font-size: 0.72rem;
      font-weight: 900;
      cursor: pointer;
      text-decoration: none;
    }
    .advanced-credentials {
      display: none;
      margin-top: 0.85rem;
      padding-top: 0.85rem;
      border-top: 1px solid var(--studio-border);
    }
    .advanced-credentials.aberto {
      display: grid;
      gap: 0.85rem;
    }
    .credentials-summary {
      display: grid;
      gap: 0.4rem;
      padding: 0.8rem;
      border: 1px solid var(--studio-border);
      border-radius: 12px;
      background: rgba(255,255,255,0.84);
      color: var(--texto-suave);
      font-size: 0.78rem;
      line-height: 1.45;
      margin-bottom: 0.8rem;
    }
    .credentials-summary strong {
      color: #173724;
    }
    .advanced-toggle {
      width: 100%;
      border: 1px solid var(--studio-border);
      border-radius: 10px;
      padding: 0.62rem 0.75rem;
      background: #f8fbf6;
      color: #173724;
      font-size: 0.74rem;
      font-weight: 900;
      cursor: pointer;
    }
    .admin-only,
    .advanced-toggle,
    #github-advanced-credentials,
    #internal-admin-settings,
    body:not(.admin-mode) #config-bar {
      display: none !important;
    }
    body.admin-mode .admin-only,
    body.admin-mode .advanced-toggle {
      display: block !important;
    }
    body.admin-mode #github-advanced-credentials.aberto {
      display: grid !important;
    }
    body.admin-mode #internal-admin-settings.aberto {
      display: grid !important;
    }
    .config-option {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
      padding: 0.9rem 1rem;
      border-radius: 14px;
      border: 1px solid var(--studio-border);
      background: rgba(255,255,255,0.82);
      margin-bottom: 0.85rem;
    }
    .config-option strong {
      display: block;
      font-size: 0.78rem;
      font-weight: 900;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: #173724;
      margin-bottom: 0.22rem;
    }
    .config-option span {
      display: block;
      font-size: 0.74rem;
      color: var(--texto-suave);
      line-height: 1.45;
    }
    .studio-select {
      min-width: 180px;
      border-radius: 12px;
      border: 1px solid var(--studio-border);
      background: rgba(255,255,255,0.95);
      color: var(--texto);
      padding: 0.7rem 0.85rem;
      font-size: 0.8rem;
      font-weight: 700;
    }
    body.studio-dark input,
    body.studio-dark textarea,
    body.studio-dark select,
    body.studio-dark .auth-provider,
    body.studio-dark .publish-menu button,
    body.studio-dark .studio-select {
      background: #0c120f !important;
      color: #f4f8f5 !important;
      border-color: rgba(255,255,255,0.10) !important;
    }
    body.studio-dark input::placeholder,
    body.studio-dark textarea::placeholder {
      color: #9aa79e !important;
    }
    body.studio-dark .logo-upload-area strong,
    body.studio-dark .logo-upload-area span,
    body.studio-dark .studio-mini-card strong,
    body.studio-dark .visual-live-head strong,
    body.studio-dark .visual-live-head span,
    body.studio-dark .profile-popover h3,
    body.studio-dark .profile-popover p,
    body.studio-dark .publish-menu button,
    body.studio-dark .studio-sidebar-brand-copy strong,
    body.studio-dark .studio-sidebar-brand-copy span {
      color: #f4f8f5;
    }
    body.studio-dark .studio-mode-panel {
      border-bottom-color: rgba(255,255,255,0.08);
    }
    body.studio-dark .studio-mode-switcher {
      background: rgba(255,255,255,0.045);
      border-color: rgba(255,255,255,0.1);
    }
    body.studio-dark .studio-mode-btn.ativa {
      background: rgba(255,255,255,0.1);
      color: #f4f8f5;
      box-shadow: none;
    }
    body.studio-dark.studio-update-mode .studio-mode-switcher {
      background: rgba(183,154,86,0.1);
      border-color: rgba(183,154,86,0.22);
    }
    body.studio-dark.studio-update-mode .studio-mode-label {
      color: var(--dourado);
    }
    body.studio-dark.studio-update-mode #studio-mode-update-btn.ativa {
      background: linear-gradient(135deg, rgba(201,168,76,0.85) 0%, rgba(183,154,86,0.85) 100%);
      color: #fff;
      box-shadow: 0 4px 14px rgba(183,154,86,0.22);
    }
    body.studio-dark .nav-sub-btn {
      color: rgba(244,248,245,0.78);
    }
    body.studio-dark .studio-mini-card.ativa,
    body.studio-dark .secao-toggle.ativa,
    body.studio-dark .nav-sub-btn.ativa {
      background: rgba(214,177,99,0.12);
      border-color: rgba(214,177,99,0.30);
      box-shadow: inset 0 0 0 1px rgba(214,177,99,0.18);
    }
    body.studio-dark .github-auto-create-option,
    body.studio-dark .github-publication-item,
    body.studio-dark .github-publication-actions button,
    body.studio-dark .github-publication-actions a {
      background: #0c120f;
      color: #f4f8f5;
      border-color: rgba(255,255,255,0.10);
    }
    body.studio-dark .github-publication-item strong,
    body.studio-dark .github-publication-item a {
      color: #f4f8f5;
    }
    body.sidebar-collapsed .aba-nav-btn {
      justify-content: center;
      padding-inline: 0;
    }
    body.sidebar-collapsed .nav-label {
      display: none;
    }
    .painel-shell {
      max-width: none;
      padding: 1rem 1rem 4rem;
    }
    .painel-meta {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 0.8rem;
      margin-bottom: 1rem;
      display: none;
    }
    .meta-card,
    .aba-intro,
    .aba-conteudo,
    .studio-panel-card,
    .visual-editor-col {
      background: var(--studio-surface);
      border: 1px solid var(--studio-border);
      box-shadow: var(--studio-shadow);
      backdrop-filter: blur(12px);
    }
    body.studio-dark .meta-card,
    body.studio-dark .aba-intro,
    body.studio-dark .aba-conteudo,
    body.studio-dark .studio-panel-card,
    body.studio-dark .visual-editor-col,
    body.studio-dark .logo-upload-area,
    body.studio-dark .color-menu,
    body.studio-dark .studio-toggle-row,
    body.studio-dark .cor-fundo-preview,
    body.studio-dark .upload-card,
    body.studio-dark .card-inst,
    body.studio-dark .aviso-card,
    body.studio-dark .liturgia-editor-card,
    body.studio-dark .studio-mini-card,
    body.studio-dark .secao-toggle,
    body.studio-dark .config-card-note,
    body.studio-dark .config-option,
    body.studio-dark .profile-popover,
    body.studio-dark .publish-menu {
      background: rgba(17,23,20,0.92);
      border-color: rgba(255,255,255,0.08);
      box-shadow: var(--studio-shadow);
    }
    body.studio-dark .meta-card strong,
    body.studio-dark .studio-panel-title,
    body.studio-dark .secao-titulo,
    body.studio-dark .campo label,
    body.studio-dark .paleta-titulo,
    body.studio-dark .config-option strong {
      color: #f3f7f4;
    }
    body.studio-dark .meta-card span,
    body.studio-dark .campo .dica,
    body.studio-dark .studio-mini-card span,
    body.studio-dark .visual-live-status,
    body.studio-dark .config-card-note,
    body.studio-dark .config-option span {
      color: #c6d1c9;
    }
    .meta-card {
      border-radius: 16px;
      padding: 1rem;
    }
    .meta-card strong {
      display: block;
      color: #163323;
      font-size: 0.76rem;
      font-weight: 900;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      margin-bottom: 0.38rem;
    }
    .meta-card span {
      display: block;
      font-size: 0.82rem;
      line-height: 1.58;
      color: var(--studio-text-soft);
    }
    .aba-conteudo {
      max-width: none;
      margin-top: 0;
      padding: 1.2rem;
      border-radius: 22px;
    }
    .secao-titulo,
    .studio-panel-title,
    .campo label {
      font-family: 'Lato', sans-serif;
    }
    .secao-titulo {
      font-size: 0.68rem;
      font-weight: 900;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: #18412a;
      background: transparent;
      border-left: 0;
      border-bottom: 1px solid rgba(16,38,26,0.10);
      padding: 0 0 0.5rem;
      margin: 1.45rem 0 0.95rem;
      border-radius: 0;
    }
    .campo label {
      font-size: 0.72rem;
      font-weight: 800;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: #4b5a4f;
      margin-bottom: 0.42rem;
    }
    .studio-panel-card {
      border-radius: 18px;
      padding: 1rem;
    }
    .studio-panel-title {
      font-size: 0.72rem;
      font-weight: 900;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: #173724;
      margin-bottom: 0.9rem;
    }
    .studio-mini-card,
    .secao-toggle,
    .upload-card,
    .card-inst,
    .liturgia-editor-item,
    .aviso-card {
      background: rgba(255,255,255,0.9);
      border: 1px solid var(--studio-border);
      box-shadow: none;
    }
    .studio-mini-card,
    .secao-toggle {
      border-radius: 14px;
    }
    .secao-toggle {
      min-height: 82px;
      color: #173724;
    }
    .secao-toggle.inativa {
      opacity: 0.52;
      background: rgba(255,255,255,0.64);
    }
    .visual-editor-col {
      background: rgba(255,253,248,0.72);
      border-right: 1px solid var(--studio-border);
    }
    .visual-editor-col {
      left: var(--studio-sidebar-w) !important;
      width: 390px !important;
      transition: left 0.22s ease, width 0.22s ease;
    }
    body.sidebar-collapsed .visual-editor-col {
      left: var(--studio-sidebar-collapsed-w) !important;
    }
    .visual-workspace {
      grid-template-columns: minmax(360px, 460px) minmax(0, 1fr);
      border-radius: 24px;
      overflow: hidden;
      border: 1px solid var(--studio-border);
      box-shadow: var(--studio-shadow);
      background: rgba(255,253,248,0.58);
      width: 100%;
    }
    .visual-workspace.editor-hidden .visual-editor-col {
      width: 0 !important;
      min-width: 0 !important;
      padding: 0 !important;
      border-right: 0 !important;
      box-shadow: none !important;
      overflow: hidden !important;
      opacity: 0;
      pointer-events: none;
    }
    body.studio-visual-mode .visual-workspace.editor-hidden .visual-editor-col,
    body.studio-visual-mode.sidebar-collapsed .visual-workspace.editor-hidden .visual-editor-col {
      display: none !important;
      visibility: hidden !important;
      opacity: 0 !important;
      pointer-events: none !important;
    }
    .visual-workspace.editor-hidden .visual-live-col {
      padding: 1.1rem 1.4rem !important;
      justify-content: center !important;
    }
    .visual-live-col {
      background:
        radial-gradient(circle at center, rgba(255,255,255,0.46) 0%, transparent 62%),
        #ece7d8;
      padding-left: 390px;
      justify-content: center;
      transition: padding-left 0.22s ease;
    }
    .studio-panel-card .dica:not(#visual-status-tema),
    .dica-compartilhar,
    .config-card-note,
    .upload-card p,
    .avisos-toolbar span,
    .aviso-card-identidade span,
    .aba-intro p,
    .visual-live-head span {
      display: none !important;
    }
    .aba-intro {
      padding: 0.8rem 1rem;
      margin-bottom: 0.8rem;
    }
    .aba-intro strong {
      margin-bottom: 0;
    }
    body.studio-dark .visual-live-col {
      background:
        radial-gradient(circle at center, rgba(255,255,255,0.05) 0%, transparent 62%),
        #080d0a;
    }
    body.sidebar-collapsed .visual-live-col {
      padding-left: 390px;
    }
    body.sidebar-collapsed .visual-workspace.editor-hidden .visual-live-col {
      padding: 1.1rem 1.4rem !important;
    }
    body.sidebar-collapsed .nav-submenu.aberto {
      display: flex !important;
      position: fixed;
      left: calc(var(--studio-sidebar-collapsed-w) + 8px);
      width: 220px;
      margin: 0;
      padding: 0.45rem;
      border-left: 0;
      border: 1px solid var(--studio-border);
      border-radius: 14px;
      background: rgba(18,43,29,0.98);
      box-shadow: 0 20px 44px rgba(16,38,26,0.24);
      z-index: 110;
    }
    body.sidebar-collapsed .nav-submenu.aberto .nav-sub-btn {
      border-radius: 10px;
      padding: 0.58rem 0.68rem;
    }
    @media (max-width: 1050px) {
      .painel-meta {
        grid-template-columns: 1fr;
      }
      .visual-workspace {
        grid-template-columns: 1fr;
      }
      .visual-live-col {
        padding-left: 1rem;
      }
    }
    @media (max-width: 820px) {
      .header,
      .config-bar,
      .publish-warning,
      .painel-shell {
        margin-left: 0 !important;
      }
      .abas-nav {
        width: 100%;
        height: auto;
        position: sticky;
      }
      .studio-sidebar-toggle {
        display: none;
      }
      .painel-meta {
        grid-template-columns: 1fr;
      }
    }

    /* ── Refinamento fino de UX ── */
    .nav-ico,
    .secao-icon {
      position: relative;
      display: inline-grid;
      place-items: center;
      width: 24px;
      height: 24px;
      border-radius: 8px;
      background: rgba(197,163,89,0.14);
      border: 1px solid rgba(197,163,89,0.22);
      color: var(--studio-gold);
      font-size: 0.56rem;
      font-weight: 900;
      letter-spacing: 0.08em;
      line-height: 1;
    }
    .nav-ico::before,
    .secao-icon::before {
      content: attr(data-ico);
    }
    .nav-ico::before { content: ''; }
    .secao-icon {
      width: 34px;
      height: 34px;
      border-radius: 10px;
      font-size: 0.62rem;
      background: rgba(24,65,42,0.08);
      border-color: rgba(24,65,42,0.12);
      color: #18412a;
    }
    .nav-sub-btn::before {
      content: '';
      display: inline-block;
      width: 6px;
      height: 6px;
      border-radius: 50%;
      margin-right: 0.5rem;
      background: rgba(197,163,89,0.55);
      vertical-align: middle;
    }
    .painel-meta {
      margin-top: 0.1rem;
      align-items: stretch;
    }
    .aba-intro {
      padding: 1.1rem 1.2rem;
      margin-bottom: 1rem;
    }
    .upload-card,
    .card-inst,
    .liturgia-editor-item,
    .aviso-card {
      border-radius: 16px;
    }
    .campo {
      margin-bottom: 1rem;
    }
    .logo-upload-area,
    .color-menu,
    .studio-toggle-row,
    .cor-fundo-preview {
      border-radius: 14px;
      border-color: var(--studio-border);
      background: rgba(255,255,255,0.82);
      box-shadow: none;
    }
    .range-row {
      gap: 0.8rem;
      margin-top: 0.75rem;
      padding: 0.3rem 0;
      font-size: 0.76rem;
    }
    .social-field {
      align-items: center;
      padding: 0.15rem 0;
    }
    .social-field .campo {
      margin-bottom: 0.65rem;
    }
    .studio-mini-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0.65rem;
    }
    .studio-mini-card {
      min-height: 82px;
      padding: 0.8rem;
    }
    .studio-mini-card strong {
      margin-top: 0.15rem;
      font-size: 0.7rem;
    }
    .studio-mini-card span {
      margin-top: 0.3rem;
      font-size: 0.64rem;
      line-height: 1.42;
    }
    .secao-toggle-grid {
      gap: 0.65rem;
    }
    .secao-toggle {
      padding: 0.8rem 0.6rem;
      font-size: 0.7rem;
      letter-spacing: 0.05em;
      line-height: 1.3;
    }
    .visual-editor-col {
      padding-bottom: 1.8rem;
    }
    .visual-subaba-menu {
      gap: 0.45rem;
      padding-right: 0.25rem;
    }
    .visual-subaba-btn {
      border-radius: 12px;
      min-height: 42px;
      font-size: 0.72rem;
      font-weight: 800;
      letter-spacing: 0.05em;
    }
    .visual-subaba-btn.ativa {
      background: #183b28;
      color: #f8fbf6;
      border-color: #183b28;
    }
    .btn-aplicar-tema,
    .btn-add-liturgia,
    .btn-duplicar-aviso,
    .btn-remover-aviso,
    .btn-remover-aniv,
    .btn-remover-liturgia {
      min-height: 32px;
      border-radius: 999px;
      padding: 0.42rem 0.8rem;
      font-size: 0.68rem;
      font-weight: 800;
      letter-spacing: 0.03em;
    }
    .btn-aplicar-tema,
    .btn-duplicar-aviso,
    .btn-add-liturgia {
      background: #183b28;
      color: #f8fbf6;
      border: 1px solid #183b28;
    }
    .btn-remover-aviso,
    .btn-remover-aniv,
    .btn-remover-liturgia {
      background: #fff;
      color: #8a2d24;
      border: 1px solid rgba(138,45,36,0.16);
    }
    #visual-subaba-secao-devocional .devoc-audio-box {
      padding: 0.7rem 0.8rem !important;
      border-radius: 12px !important;
      background: rgba(255,255,255,0.72) !important;
      display: grid !important;
      gap: 0.55rem !important;
      box-shadow: none !important;
    }
    #visual-subaba-secao-devocional .devoc-audio-actions {
      display: flex;
      align-items: center;
      gap: 0.45rem;
      flex-wrap: wrap;
    }
    #visual-subaba-secao-devocional .devoc-audio-box .btn-duplicar-aviso,
    #visual-subaba-secao-devocional .devoc-audio-box .btn-remover-aviso {
      min-height: 28px !important;
      padding: 0.3rem 0.68rem !important;
      font-size: 0.64rem !important;
      font-weight: 700 !important;
      letter-spacing: 0.02em !important;
    }
    #visual-subaba-secao-devocional .devoc-audio-box .btn-duplicar-aviso {
      background: rgba(24,59,40,0.08) !important;
      color: #183b28 !important;
      border: 1px solid rgba(24,59,40,0.12) !important;
    }
    #visual-subaba-secao-devocional .devoc-audio-box .btn-remover-aviso {
      margin-left: 0 !important;
      background: transparent !important;
      color: #8a2d24 !important;
      border: 1px solid rgba(138,45,36,0.14) !important;
    }
    #visual-subaba-secao-devocional .devoc-audio-box .arquivo-atual {
      padding: 0.28rem 0.58rem !important;
      font-size: 0.64rem !important;
      max-width: 100%;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      background: rgba(31,74,51,0.04) !important;
    }
    #visual-subaba-secao-devocional .devoc-rodape-toggle {
      display: inline-flex !important;
      align-items: center !important;
      gap: 0.45rem !important;
      padding: 0.35rem 0.1rem 0.15rem !important;
      background: transparent !important;
      border: 0 !important;
      border-radius: 0 !important;
      font-size: 0.73rem !important;
      color: var(--texto-suave) !important;
      margin: 0.1rem 0 0.45rem !important;
    }
    #visual-subaba-secao-devocional .devoc-rodape-toggle input {
      width: 0.86rem !important;
      height: 0.86rem !important;
      margin-top: 0 !important;
    }
    .toolbar-acoes {
      gap: 0.55rem;
      flex-wrap: wrap;
    }
    .aviso-card-header,
    .aviso-card-topo {
      gap: 0.8rem;
    }
    .aniv-linha {
      gap: 0.55rem;
      margin-bottom: 0.55rem;
    }
    .visual-live-frame-wrap {
      box-shadow: 0 24px 54px rgba(16,38,26,0.18);
    }
    .visual-live-col {
      align-items: center;
    }
    @media (max-width: 1200px) {
      .visual-live-col {
        padding-left: 180px;
      }
    }
    @media (max-width: 1050px) {
      .visual-editor-col {
        border-right: 0;
        border-bottom: 1px solid var(--studio-border);
      }
      .visual-live-col {
        min-height: 760px;
      }
    }
    @media (max-width: 820px) {
      .header-actions {
        max-width: 58vw;
      }
      .btn-secundario,
      .btn-publicar,
      .btn-gerar-boletim {
        padding-inline: 0.72rem;
      }
      .painel-shell {
        padding: 0.8rem 0.8rem 4rem;
      }
      .aba-conteudo {
        padding: 1rem;
        border-radius: 18px;
      }
      .studio-mini-grid,
      .secao-toggle-grid,
      .logos-linha {
        grid-template-columns: 1fr;
      }
      .visual-live-col {
        padding: 1rem;
      }
    }

    /* ── Refinamento visual leve aprovado ─────────────────────────────
       Camada somente CSS: preserva HTML, IDs, eventos e lógica.
    */
    :root {
      --verde: #1f4a33;
      --verde2: #2e6545;
      --verde-claro: #75997f;
      --verde-escuro: #173724;
      --dourado: #b79a56;
      --fundo: #eef2ec;
      --branco: #fcfcf8;
      --borda: rgba(31, 74, 51, 0.12);
      --texto: #27312b;
      --texto-suave: #657267;
      --sombra: 0 14px 32px rgba(31, 74, 51, 0.065);
      --studio-surface: rgba(252, 252, 248, 0.82);
      --studio-surface-strong: #fffefa;
      --studio-border: rgba(31, 74, 51, 0.105);
      --studio-shadow: 0 16px 36px rgba(31, 74, 51, 0.07);
      --studio-sidebar-bg: #edf3ed;
      --studio-text-soft: #657267;
      --studio-gold: #b79a56;
      --studio-radius-sm: 14px;
      --studio-radius-md: 18px;
      --studio-radius-lg: 24px;
      --studio-soft-green: #e8f0e8;
      --studio-soft-gold: #f4ecda;
    }

    body {
      background:
        radial-gradient(circle at 8% 0%, rgba(183, 154, 86, 0.12), transparent 28%),
        radial-gradient(circle at 92% 8%, rgba(117, 153, 127, 0.16), transparent 30%),
        linear-gradient(180deg, #f9faf5 0%, #eff4ee 48%, #e8efe7 100%);
      color: var(--texto);
    }

    .header {
      background: rgba(252, 252, 248, 0.88);
      border-bottom: 1px solid rgba(31, 74, 51, 0.10);
      box-shadow: 0 10px 26px rgba(31, 74, 51, 0.055);
      color: var(--verde-escuro);
    }

    body.studio-dark .header {
      background: rgba(23, 55, 36, 0.92);
      border-bottom-color: rgba(255, 255, 255, 0.08);
    }

    .header-kicker {
      color: rgba(31, 74, 51, 0.52);
    }

    .header h1 {
      color: var(--verde-escuro);
    }

    body.studio-dark .header h1 {
      color: #f8fbf6;
    }

    .abas-nav {
      background:
        linear-gradient(180deg, rgba(252, 252, 248, 0.96) 0%, rgba(237, 243, 237, 0.98) 100%);
      border-right: 1px solid rgba(31, 74, 51, 0.11);
      box-shadow: 10px 0 30px rgba(31, 74, 51, 0.055);
    }

    .studio-sidebar-brand {
      border-bottom-color: rgba(31, 74, 51, 0.10);
    }

    .studio-sidebar-brand img {
      box-shadow: 0 8px 20px rgba(31, 74, 51, 0.08);
    }

    .studio-sidebar-brand-copy strong {
      color: var(--verde-escuro);
    }

    .studio-sidebar-brand-copy span {
      color: rgba(183, 154, 86, 0.82);
    }

    .studio-sidebar-toggle,
    .device-switch,
    .profile-trigger {
      background: rgba(31, 74, 51, 0.055);
      border-color: rgba(31, 74, 51, 0.11);
      color: var(--verde2);
      box-shadow: none;
    }

    .aba-nav-btn {
      color: #526457;
      border: 1px solid transparent;
      border-radius: 18px;
    }

    .aba-nav-btn:hover,
    .aba-nav-btn.ativa,
    .aba-nav-btn.submenu-aberto {
      background: rgba(31, 74, 51, 0.075);
      border-color: rgba(31, 74, 51, 0.08);
      color: var(--verde-escuro);
    }

    .aba-nav-btn.ativa {
      box-shadow: inset 0 0 0 1px rgba(31, 74, 51, 0.055);
    }

    .nav-ico {
      width: 26px;
      height: 26px;
      border-radius: 11px;
      background-color: rgba(183, 154, 86, 0.105);
      border-color: rgba(183, 154, 86, 0.16);
      opacity: 0.82;
      background-size: 14px 14px;
    }

    .aba-nav-btn:hover .nav-ico,
    .aba-nav-btn.ativa .nav-ico,
    .aba-nav-btn.submenu-aberto .nav-ico {
      background-color: rgba(31, 74, 51, 0.09);
      border-color: rgba(31, 74, 51, 0.12);
      opacity: 1;
    }

    .submenu-caret {
      background: rgba(31, 74, 51, 0.055);
      color: rgba(31, 74, 51, 0.62);
      border-radius: 9px;
    }

    .nav-submenu {
      border-left-color: rgba(31, 74, 51, 0.12);
    }

    .nav-sub-btn {
      color: #69766d;
      border-radius: 12px;
    }

    .nav-sub-btn::before {
      background: rgba(183, 154, 86, 0.36);
    }

    .nav-sub-btn:hover,
    .nav-sub-btn.ativa {
      background: rgba(31, 74, 51, 0.06);
      color: var(--verde-escuro);
    }

    body.sidebar-collapsed .nav-submenu.aberto {
      background: rgba(252, 252, 248, 0.98);
      border-color: rgba(31, 74, 51, 0.12);
      box-shadow: 0 18px 42px rgba(31, 74, 51, 0.13);
    }

    .btn-secundario,
    .btn-gerar-boletim,
    .device-btn {
      background: rgba(31, 74, 51, 0.055);
      border-color: rgba(31, 74, 51, 0.11);
      color: var(--verde2);
    }

    .btn-secundario:hover,
    .btn-gerar-boletim:hover,
    .device-btn.ativa,
    .device-btn:hover {
      background: rgba(31, 74, 51, 0.095);
      color: var(--verde-escuro);
    }

    .device-ico {
      filter: none;
      opacity: 0.72;
    }

    .btn-publicar,
    .auth-submit-btn,
    .btn-aplicar-tema,
    .btn-duplicar-aviso,
    .btn-add-liturgia,
    .btn-programacao-add,
    .btn-add-aniv,
    .btn-add-aviso {
      background: linear-gradient(135deg, #28583d, #356d4c);
      color: #fffdfa;
      border: 1px solid rgba(31, 74, 51, 0.12);
      box-shadow: 0 10px 24px rgba(31, 74, 51, 0.11);
    }

    .btn-publicar:hover,
    .auth-submit-btn:hover,
    .btn-aplicar-tema:hover,
    .btn-duplicar-aviso:hover,
    .btn-add-liturgia:hover,
    .btn-programacao-add:hover,
    .btn-add-aniv:hover,
    .btn-add-aviso:hover {
      background: linear-gradient(135deg, #31694a, #3d7655);
      color: #fffdfa;
      box-shadow: 0 12px 28px rgba(31, 74, 51, 0.14);
    }

    .profile-popover,
    .publish-menu,
    .auth-card,
    .meta-card,
    .aba-intro,
    .aba-conteudo,
    .studio-panel-card,
    .visual-editor-col,
    .logo-upload-area,
    .color-menu,
    .studio-toggle-row,
    .cor-fundo-preview,
    .upload-card,
    .card-inst,
    .aviso-card,
    .liturgia-editor-card,
    .programacao-dia-card,
    .planejamento-mes-card,
    .lideranca-editor-card,
    .simbolo-item-card,
    .config-card-note,
    .config-option,
    .github-publication-item,
    .credentials-summary,
    .profile-session {
      background: rgba(255, 254, 250, 0.88);
      border-color: var(--studio-border);
      box-shadow: var(--studio-shadow);
    }

    .auth-card,
    .profile-popover,
    .publish-menu,
    .aba-conteudo,
    .visual-workspace {
      border-radius: var(--studio-radius-lg);
    }

    .meta-card,
    .aba-intro,
    .studio-panel-card,
    .upload-card,
    .card-inst,
    .aviso-card,
    .liturgia-editor-card,
    .programacao-dia-card,
    .planejamento-mes-card,
    .lideranca-editor-card,
    .simbolo-item-card,
    .config-card-note,
    .config-option,
    .github-publication-item,
    .credentials-summary,
    .profile-session {
      border-radius: var(--studio-radius-md);
    }

    .studio-mini-card,
    .secao-toggle {
      border-radius: 18px;
      background: rgba(255, 254, 250, 0.84);
      border-color: rgba(31, 74, 51, 0.10);
    }

    .studio-mini-card.ativa,
    .secao-toggle.ativa,
    .visual-subaba-btn.ativa {
      background: rgba(232, 240, 232, 0.94);
      border-color: rgba(31, 74, 51, 0.18);
      color: var(--verde-escuro);
      box-shadow: inset 0 0 0 1px rgba(31, 74, 51, 0.06);
    }

    .secao-icon {
      border-radius: 14px;
      background: rgba(31, 74, 51, 0.065);
      border-color: rgba(31, 74, 51, 0.10);
      opacity: 0.84;
    }

    .campo input[type="text"],
    .campo input[type="email"],
    .campo input[type="password"],
    .campo input[type="url"],
    .campo textarea,
    .campo select,
    .profile-popover input,
    .auth-form input,
    .config-bar input,
    .studio-select,
    .lideranca-input,
    .planejamento-input {
      background: rgba(255, 255, 252, 0.96);
      border-color: rgba(31, 74, 51, 0.12);
      border-radius: 16px;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.64);
      color: var(--texto);
    }

    .campo input:focus,
    .campo textarea:focus,
    .campo select:focus,
    .profile-popover input:focus,
    .auth-form input:focus,
    .config-bar input:focus,
    .studio-select:focus,
    .lideranca-input:focus,
    .planejamento-input:focus {
      border-color: rgba(46, 101, 69, 0.34);
      box-shadow: 0 0 0 4px rgba(117, 153, 127, 0.15);
    }

    .secao-titulo,
    .studio-panel-title,
    .campo label,
    .meta-card strong,
    .config-option strong {
      color: #294a36;
    }

    .dica,
    .dica-compartilhar,
    .arquivo-info,
    .config-status,
    .studio-mini-card span,
    .visual-live-status,
    .config-card-note,
    .config-option span {
      color: var(--texto-suave);
    }

    .visual-workspace {
      background: rgba(255, 254, 250, 0.58);
      border-color: rgba(31, 74, 51, 0.105);
      box-shadow: 0 18px 42px rgba(31, 74, 51, 0.075);
    }

    .visual-editor-col {
      background: rgba(252, 252, 248, 0.76);
    }

    .visual-live-col {
      background:
        radial-gradient(circle at center, rgba(255, 255, 255, 0.72) 0%, transparent 62%),
        linear-gradient(180deg, #f1f4ec 0%, #e7eee5 100%);
    }

    .visual-live-frame-wrap {
      box-shadow: 0 24px 54px rgba(31, 74, 51, 0.14);
    }

    .visual-subaba-btn {
      background: rgba(255, 254, 250, 0.76);
      border: 1px solid rgba(31, 74, 51, 0.09);
      color: #526457;
    }

    .visual-subaba-btn:hover {
      background: rgba(232, 240, 232, 0.80);
      color: var(--verde-escuro);
    }

    .publish-progress-card {
      border-radius: 24px;
      box-shadow: 0 28px 70px rgba(31, 74, 51, 0.16);
    }

    .publish-progress-fill {
      background: linear-gradient(90deg, #356d4c, #b79a56);
    }

    .auth-gate {
      background:
        radial-gradient(circle at 16% 10%, rgba(183, 154, 86, 0.12), transparent 30%),
        linear-gradient(180deg, rgba(248, 250, 245, 0.96), rgba(232, 239, 231, 0.97));
    }

    body.studio-dark {
      --studio-surface: rgba(20, 31, 25, 0.92);
      --studio-surface-strong: #151f19;
      --studio-border: rgba(232, 239, 231, 0.10);
      --studio-shadow: 0 18px 40px rgba(0, 0, 0, 0.26);
      --studio-text-soft: #c3cec5;
      background:
        radial-gradient(circle at 8% 0%, rgba(183, 154, 86, 0.10), transparent 28%),
        linear-gradient(180deg, #101812 0%, #141e17 100%);
    }

    body.studio-dark .abas-nav {
      background: linear-gradient(180deg, #142319 0%, #101b14 100%);
      border-right-color: rgba(255, 255, 255, 0.08);
    }

    body.studio-dark .aba-nav-btn {
      color: rgba(244, 248, 245, 0.72);
    }

    body.studio-dark .aba-nav-btn:hover,
    body.studio-dark .aba-nav-btn.ativa,
    body.studio-dark .aba-nav-btn.submenu-aberto {
      background: rgba(255, 255, 255, 0.075);
      color: #f8fbf6;
    }

    body.studio-dark .nav-ico {
      background-color: rgba(183, 154, 86, 0.14);
      border-color: rgba(183, 154, 86, 0.18);
    }

    body.studio-dark .btn-secundario,
    body.studio-dark .btn-gerar-boletim,
    body.studio-dark .device-switch,
    body.studio-dark .device-btn,
    body.studio-dark .profile-trigger {
      background: rgba(255, 255, 255, 0.07);
      border-color: rgba(255, 255, 255, 0.10);
      color: #f4f8f5;
    }

    body.studio-dark .profile-popover,
    body.studio-dark .publish-menu,
    body.studio-dark .auth-card,
    body.studio-dark .meta-card,
    body.studio-dark .aba-intro,
    body.studio-dark .aba-conteudo,
    body.studio-dark .studio-panel-card,
    body.studio-dark .visual-editor-col,
    body.studio-dark .logo-upload-area,
    body.studio-dark .color-menu,
    body.studio-dark .studio-toggle-row,
    body.studio-dark .cor-fundo-preview,
    body.studio-dark .upload-card,
    body.studio-dark .card-inst,
    body.studio-dark .aviso-card,
    body.studio-dark .liturgia-editor-card,
    body.studio-dark .programacao-dia-card,
    body.studio-dark .planejamento-mes-card,
    body.studio-dark .lideranca-editor-card,
    body.studio-dark .simbolo-item-card,
    body.studio-dark .studio-mini-card,
    body.studio-dark .secao-toggle,
    body.studio-dark .config-card-note,
    body.studio-dark .config-option,
    body.studio-dark .github-publication-item,
    body.studio-dark .credentials-summary,
    body.studio-dark .profile-session {
      background: rgba(21, 31, 25, 0.92);
      border-color: rgba(255, 255, 255, 0.09);
      box-shadow: var(--studio-shadow);
    }

    body.studio-dark .visual-live-col {
      background:
        radial-gradient(circle at center, rgba(255, 255, 255, 0.055) 0%, transparent 62%),
        linear-gradient(180deg, #111a14 0%, #0f1712 100%);
    }

    body.studio-dark .campo input[type="text"],
    body.studio-dark .campo input[type="email"],
    body.studio-dark .campo input[type="password"],
    body.studio-dark .campo input[type="url"],
    body.studio-dark .campo textarea,
    body.studio-dark .campo select,
    body.studio-dark .profile-popover input,
    body.studio-dark .auth-form input,
    body.studio-dark .config-bar input,
    body.studio-dark .studio-select,
    body.studio-dark .lideranca-input,
    body.studio-dark .planejamento-input {
      background: rgba(12, 18, 15, 0.96) !important;
      border-color: rgba(255, 255, 255, 0.11) !important;
      color: #f4f8f5 !important;
    }

    /* ── Tipografia e iconografia refinadas ───────────────────────────
       Evita texto colado em ícones e dá mais acabamento às seções.
    */
    body {
      text-rendering: geometricPrecision;
      -webkit-font-smoothing: antialiased;
    }

    .abas-nav {
      padding-inline: 0.95rem;
    }

    .aba-nav-btn,
    .aba-nav-btn.has-submenu {
      display: grid;
      grid-template-columns: 30px minmax(0, 1fr) 22px;
      align-items: center;
      column-gap: 0.82rem;
      min-height: 52px;
      padding: 0.72rem 0.68rem;
      font-size: 0.76rem;
      font-weight: 850;
      letter-spacing: 0.045em;
      line-height: 1.25;
      text-transform: uppercase;
    }

    .nav-label {
      display: block;
      min-width: 0;
      padding-top: 0.02rem;
      overflow-wrap: anywhere;
      word-break: normal;
    }

    .nav-ico {
      width: 30px;
      height: 30px;
      border-radius: 13px;
      justify-self: center;
      background-size: 15px 15px;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.70),
        0 7px 16px rgba(31, 74, 51, 0.045);
    }

    .submenu-caret {
      width: 22px;
      height: 22px;
      justify-self: end;
      font-size: 0.62rem;
    }

    .aba-nav-btn.ativa {
      background:
        linear-gradient(90deg, rgba(31, 74, 51, 0.105), rgba(31, 74, 51, 0.055));
    }

    .aba-nav-btn.ativa .nav-label {
      color: #183724;
      font-weight: 900;
    }

    .nav-submenu {
      margin-left: 1.08rem;
      padding-left: 1rem;
    }

    .nav-sub-btn {
      display: grid;
      grid-template-columns: 8px minmax(0, 1fr);
      align-items: center;
      column-gap: 0.55rem;
      min-height: 34px;
      padding: 0.52rem 0.58rem;
      font-size: 0.68rem;
      font-weight: 760;
      letter-spacing: 0.038em;
      line-height: 1.28;
    }

    .nav-sub-btn::before {
      width: 5px;
      height: 5px;
      margin-right: 0;
    }

    .studio-sidebar-brand {
      grid-template-columns: 38px minmax(0, 1fr) 30px;
      gap: 0.72rem;
    }

    .studio-sidebar-brand-copy strong {
      font-size: 0.82rem;
      letter-spacing: 0.045em;
      line-height: 1.12;
    }

    .studio-sidebar-brand-copy span {
      font-size: 0.55rem;
      letter-spacing: 0.11em;
      line-height: 1.25;
    }

    .studio-panel-title,
    .secao-titulo,
    .campo label,
    .meta-card strong,
    .config-option strong {
      letter-spacing: 0.095em;
      line-height: 1.35;
      text-wrap: balance;
    }

    .studio-panel-title {
      display: flex;
      align-items: center;
      gap: 0.58rem;
      min-height: 1.45rem;
      font-size: 0.74rem;
    }

    .campo label {
      font-size: 0.70rem;
      letter-spacing: 0.07em;
    }

    .campo input,
    .campo textarea,
    .campo select,
    .studio-select,
    .auth-form input {
      font-size: 0.86rem;
      line-height: 1.45;
    }

    .campo .dica,
    .config-option span,
    .profile-session,
    .upload-card p {
      line-height: 1.58;
    }

    .secao-toggle-grid {
      gap: 0.72rem;
    }

    .secao-toggle {
      display: grid;
      grid-template-columns: 34px minmax(0, 1fr);
      align-items: center;
      justify-content: stretch;
      justify-items: start;
      gap: 0.48rem;
      min-height: 64px;
      padding: 0.66rem 0.62rem;
      text-align: left;
      font-size: 0.62rem;
      font-weight: 820;
      letter-spacing: 0.025em;
      line-height: 1.22;
      overflow: hidden;
      text-wrap: balance;
    }

    .secao-toggle .secao-icon {
      width: 34px;
      height: 34px;
      display: inline-grid;
      place-items: center;
      border-radius: 14px;
      background-color: rgba(252, 252, 248, 0.84);
      background-size: 16px 16px;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.76),
        0 8px 18px rgba(31, 74, 51, 0.055);
      filter: saturate(0.82) contrast(0.98);
      flex-shrink: 0;
    }

    .secao-toggle[data-section="aniversariantes"],
    .secao-toggle[data-section="uso-imagem"],
    .secao-toggle[data-section="programacao"] {
      font-size: 0.59rem;
      letter-spacing: 0.018em;
    }

    .secao-toggle:hover .secao-icon,
    .secao-toggle.ativa .secao-icon {
      background-color: rgba(232, 240, 232, 0.98);
      border-color: rgba(31, 74, 51, 0.16);
      filter: saturate(0.95) contrast(1);
    }

    .secao-toggle.inativa .secao-icon {
      opacity: 0.62;
      filter: grayscale(0.28) saturate(0.62);
    }

    .visual-subaba-btn {
      display: flex;
      align-items: center;
      gap: 0.55rem;
      padding-inline: 0.82rem;
      line-height: 1.25;
      text-align: left;
    }

    .btn-secundario,
    .btn-publicar,
    .btn-gerar-boletim,
    .auth-provider,
    .auth-secondary-btn,
    .auth-submit-btn,
    .btn-aplicar-tema,
    .btn-add-liturgia,
    .btn-duplicar-aviso,
    .btn-remover-aviso,
    .btn-remover-aniv,
    .btn-remover-liturgia,
    .btn-programacao-mini,
    .btn-programacao-add,
    .btn-add-aniv,
    .btn-add-aviso {
      line-height: 1.2;
      gap: 0.48rem;
    }

    .social-field {
      grid-template-columns: 34px minmax(0, 1fr);
      gap: 0.72rem;
    }

    .social-field .social-icon {
      width: 34px;
      height: 34px;
      display: grid;
      place-items: center;
      align-self: center;
      padding-bottom: 0;
      border-radius: 14px;
      background: rgba(31, 74, 51, 0.06);
      color: var(--verde2);
      font-size: 0.95rem;
    }

    .visual-live-frame .icon-svg,
    .icon-svg {
      flex-shrink: 0;
    }

    body.sidebar-collapsed .aba-nav-btn,
    body.sidebar-collapsed .aba-nav-btn.has-submenu {
      grid-template-columns: 1fr;
      justify-items: center;
      padding-inline: 0;
    }

    body.sidebar-collapsed .nav-ico {
      margin: 0;
    }

    body.studio-dark .nav-ico,
    body.studio-dark .secao-toggle .secao-icon,
    body.studio-dark .social-field .social-icon {
      box-shadow: none;
    }

    body.studio-dark .aba-nav-btn.ativa .nav-label {
      color: #f8fbf6;
    }

    /* Layout responsivo com contenção: preserva a posição das áreas e usa rolagem quando faltar espaço. */
    :root {
      --studio-app-min-w: 1180px;
      --studio-work-min-w: calc(var(--studio-app-min-w) - var(--studio-sidebar-w));
      --studio-work-min-w-collapsed: calc(var(--studio-app-min-w) - var(--studio-sidebar-collapsed-w));
      --studio-editor-w: 390px;
    }

    html {
      min-width: var(--studio-app-min-w);
      min-height: 100%;
      overflow: auto;
    }

    body {
      min-width: var(--studio-app-min-w);
      overflow: auto;
    }

    .header,
    .config-bar,
    .publish-warning,
    .painel-shell {
      min-width: var(--studio-work-min-w);
      margin-left: var(--studio-sidebar-w) !important;
    }

    body.sidebar-collapsed .header,
    body.sidebar-collapsed .config-bar,
    body.sidebar-collapsed .publish-warning,
    body.sidebar-collapsed .painel-shell {
      min-width: var(--studio-work-min-w-collapsed);
      margin-left: var(--studio-sidebar-collapsed-w) !important;
    }

    .header {
      position: sticky;
      top: 0;
      z-index: 80;
    }

    .header-actions {
      max-width: none !important;
      overflow: visible !important;
      flex-wrap: nowrap;
    }

    .abas-nav {
      position: fixed !important;
      inset: 0 auto 0 0 !important;
      width: var(--studio-sidebar-w) !important;
      height: 100vh !important;
      min-width: var(--studio-sidebar-w);
      flex-direction: column !important;
      overflow-x: hidden !important;
      overflow-y: auto !important;
      padding: 0.9rem 0.8rem !important;
    }

    body.sidebar-collapsed .abas-nav {
      width: var(--studio-sidebar-collapsed-w) !important;
      min-width: var(--studio-sidebar-collapsed-w);
      padding-inline: 0.55rem !important;
    }

    .studio-sidebar-brand {
      display: grid !important;
    }

    .studio-sidebar-toggle {
      display: block !important;
    }

    .aba-nav-btn {
      width: 100% !important;
      white-space: normal !important;
      border-bottom: 0 !important;
    }

    .nav-submenu {
      position: fixed !important;
      left: 14px;
      top: 120px;
      z-index: 95;
      width: calc(var(--studio-sidebar-w) - 28px);
      max-height: calc(100vh - 136px);
      margin: 0 !important;
      padding: 0.42rem !important;
      display: none;
      flex-direction: column;
      gap: 0.2rem;
      overflow-x: hidden;
      overflow-y: auto;
      border-left: 0 !important;
      border: 1px solid var(--studio-border);
      border-radius: 16px;
      background: rgba(247, 251, 245, 0.96);
      box-shadow: 0 18px 42px rgba(31, 74, 51, 0.16);
      backdrop-filter: blur(14px);
    }

    .nav-submenu.aberto {
      display: flex !important;
    }

    .nav-submenu::-webkit-scrollbar {
      width: 8px;
    }

    .nav-submenu::-webkit-scrollbar-thumb {
      background: rgba(31, 74, 51, 0.22);
      border-radius: 999px;
    }

    .nav-sub-btn {
      flex-shrink: 0;
      width: 100%;
      color: #526457 !important;
    }

    .nav-sub-btn:hover,
    .nav-sub-btn.ativa {
      background: rgba(31, 74, 51, 0.08) !important;
      color: var(--verde-escuro) !important;
    }

    .nav-submenu-mini {
      flex-shrink: 0;
    }

    body.studio-dark .nav-submenu {
      background: rgba(18, 31, 23, 0.98);
      border-color: rgba(255, 255, 255, 0.10);
    }

    body.studio-dark .nav-sub-btn {
      color: rgba(244, 248, 245, 0.70) !important;
    }

    body.studio-dark .nav-sub-btn:hover,
    body.studio-dark .nav-sub-btn.ativa {
      background: rgba(255, 255, 255, 0.08) !important;
      color: #f8fbf6 !important;
    }

    body.sidebar-collapsed .nav-submenu {
      left: calc(var(--studio-sidebar-collapsed-w) + 8px) !important;
      width: 220px;
    }

    body.sidebar-collapsed .nav-submenu.aberto {
      display: flex !important;
    }

    body.studio-visual-mode {
      min-width: var(--studio-app-min-w) !important;
      overflow: auto !important;
    }

    body.studio-visual-mode .header,
    body.studio-visual-mode .painel-shell {
      width: auto !important;
      min-width: var(--studio-work-min-w) !important;
    }

    body.studio-visual-mode.sidebar-collapsed .header,
    body.studio-visual-mode.sidebar-collapsed .painel-shell {
      min-width: var(--studio-work-min-w-collapsed) !important;
    }

    body.studio-visual-mode .painel-shell {
      height: auto !important;
      overflow: visible !important;
    }

    body.studio-visual-mode .aba-conteudo {
      min-width: var(--studio-work-min-w) !important;
    }

    body.studio-visual-mode .visual-workspace {
      position: relative;
      width: 100% !important;
      min-width: var(--studio-work-min-w) !important;
      min-height: calc(100vh - var(--studio-header-h)) !important;
      overflow: hidden !important;
    }

    body.studio-visual-mode .visual-editor-col {
      left: var(--studio-sidebar-w) !important;
      top: 214px !important;
      width: var(--studio-editor-w) !important;
      min-width: var(--studio-editor-w) !important;
      max-width: var(--studio-editor-w) !important;
      height: calc(100vh - 214px) !important;
      max-height: calc(100vh - 214px) !important;
    }

    body.studio-visual-mode.sidebar-collapsed .visual-editor-col {
      left: var(--studio-sidebar-collapsed-w) !important;
    }

    body.studio-visual-mode .visual-live-col {
      position: relative !important;
      min-width: calc(var(--studio-work-min-w) - var(--studio-editor-w)) !important;
      min-height: calc(100vh - var(--studio-header-h)) !important;
      width: auto !important;
      padding: 1.1rem 1.4rem 1.1rem var(--studio-editor-w) !important;
      align-items: center !important;
      justify-content: center !important;
      overflow: hidden !important;
    }

    body.studio-visual-mode.sidebar-collapsed .visual-live-col {
      padding-left: var(--studio-editor-w) !important;
    }

    body.studio-visual-mode .visual-live-panel {
      margin: auto !important;
      min-width: max-content;
      transform: translateX(var(--preview-pan-x, 0px)) !important;
    }

    body.studio-visual-mode .visual-live-frame-wrap,
    body.studio-visual-mode .visual-live-frame-wrap[data-device="phone"] {
      width: 292px !important;
      min-width: 292px !important;
    }

    .painel-shell {
      max-width: none;
      overflow: visible;
    }

    .aba-conteudo {
      min-width: 860px;
    }

    .visual-workspace {
      min-width: var(--studio-work-min-w);
      overflow: hidden;
    }

    .visual-editor-col {
      left: var(--studio-sidebar-w) !important;
      width: var(--studio-editor-w) !important;
      min-width: var(--studio-editor-w) !important;
    }

    body.sidebar-collapsed .visual-editor-col {
      left: var(--studio-sidebar-collapsed-w) !important;
    }

    .visual-live-col,
    body.sidebar-collapsed .visual-live-col {
      min-width: calc(var(--studio-work-min-w) - var(--studio-editor-w));
      padding-left: var(--studio-editor-w) !important;
    }

    .visual-workspace.editor-hidden .visual-live-col,
    body.sidebar-collapsed .visual-workspace.editor-hidden .visual-live-col {
      min-width: var(--studio-work-min-w);
      padding: 1.1rem 1.4rem !important;
    }

    @media (max-width: 1050px) {
      .visual-workspace {
        grid-template-columns: minmax(360px, 460px) minmax(0, 1fr) !important;
      }

      .visual-editor-col {
        border-right: 1px solid var(--studio-border) !important;
        border-bottom: 0 !important;
      }

      .visual-live-col {
        min-height: calc(100vh - var(--studio-header-h)) !important;
      }
    }

    @media (max-width: 820px) {
      .header,
      .config-bar,
      .publish-warning,
      .painel-shell {
        margin-left: var(--studio-sidebar-w) !important;
        min-width: var(--studio-work-min-w) !important;
      }

      body.sidebar-collapsed .header,
      body.sidebar-collapsed .config-bar,
      body.sidebar-collapsed .publish-warning,
      body.sidebar-collapsed .painel-shell {
        margin-left: var(--studio-sidebar-collapsed-w) !important;
        min-width: var(--studio-work-min-w-collapsed) !important;
      }

      .abas-nav {
        position: fixed !important;
        top: 0 !important;
        bottom: 0 !important;
        width: var(--studio-sidebar-w) !important;
        height: 100vh !important;
        flex-direction: column !important;
      }

      .studio-sidebar-brand {
        display: grid !important;
      }

      .studio-sidebar-toggle {
        display: block !important;
      }

      .aba-nav-btn {
        width: 100% !important;
      }

      .studio-mini-grid,
      .secao-toggle-grid,
      .logos-linha {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      }

      .visual-live-col {
        padding-left: var(--studio-editor-w) !important;
      }
    }

    /* Correção de arquitetura do modo visual: menu, editor e prévia não se espremem. */
    body.studio-visual-mode {
      min-width: var(--studio-app-min-w) !important;
      overflow: hidden !important;
    }

    html.studio-visual-mode,
    html:has(body.studio-visual-mode) {
      overflow: hidden !important;
    }

    body.studio-visual-mode .painel-shell {
      min-width: var(--studio-work-min-w) !important;
      margin-left: var(--studio-sidebar-w) !important;
      padding: 0 !important;
      overflow: visible !important;
    }

    body.studio-visual-mode.sidebar-collapsed .painel-shell {
      min-width: var(--studio-work-min-w-collapsed) !important;
      margin-left: var(--studio-sidebar-collapsed-w) !important;
    }

    body.studio-visual-mode #aba-visual,
    body.studio-visual-mode .visual-workspace {
      min-width: var(--studio-work-min-w) !important;
      width: var(--studio-work-min-w) !important;
      min-height: calc(100vh - var(--studio-header-h)) !important;
      overflow: visible !important;
      border: 0 !important;
      box-shadow: none !important;
      background: transparent !important;
    }

    body.studio-visual-mode.sidebar-collapsed #aba-visual,
    body.studio-visual-mode.sidebar-collapsed .visual-workspace {
      min-width: var(--studio-work-min-w-collapsed) !important;
      width: var(--studio-work-min-w-collapsed) !important;
    }

    body.studio-visual-mode .visual-editor-col {
      position: fixed !important;
      z-index: 120 !important;
      top: var(--studio-header-h) !important;
      bottom: 0 !important;
      left: var(--studio-sidebar-w) !important;
      width: var(--studio-editor-w) !important;
      min-width: var(--studio-editor-w) !important;
      max-width: var(--studio-editor-w) !important;
      height: auto !important;
      max-height: none !important;
      overflow: auto !important;
      opacity: 1 !important;
      visibility: visible !important;
      transform: none !important;
      background: rgba(252, 252, 248, 0.98) !important;
    }

    body.studio-visual-mode.sidebar-collapsed .visual-editor-col {
      left: var(--studio-sidebar-collapsed-w) !important;
    }

    body.studio-visual-mode .visual-live-col {
      position: absolute !important;
      z-index: 1 !important;
      top: 0 !important;
      left: var(--studio-editor-w) !important;
      width: calc(var(--studio-work-min-w) - var(--studio-editor-w)) !important;
      min-width: calc(var(--studio-work-min-w) - var(--studio-editor-w)) !important;
      min-height: calc(100vh - var(--studio-header-h)) !important;
      padding: 1.1rem 1.4rem !important;
      overflow: auto !important;
      display: flex !important;
      align-items: center !important;
      justify-content: center !important;
    }

    body.studio-visual-mode.sidebar-collapsed .visual-live-col {
      width: calc(var(--studio-work-min-w-collapsed) - var(--studio-editor-w)) !important;
      min-width: calc(var(--studio-work-min-w-collapsed) - var(--studio-editor-w)) !important;
    }

    body.studio-visual-mode .visual-live-panel {
      flex: 0 0 auto !important;
      min-width: max-content !important;
      margin: auto !important;
      transform: translateX(var(--preview-pan-x, 0px)) !important;
    }

    body.studio-visual-mode .visual-live-frame-wrap,
    body.studio-visual-mode .visual-live-frame-wrap[data-device="phone"] {
      width: 292px !important;
      min-width: 292px !important;
      height: min(632px, calc(100vh - 7.5rem)) !important;
    }

    /* Paleta flutuante de edição: o editor não ocupa mais espaço da prévia ao vivo. */
    body.studio-visual-mode #aba-visual,
    body.studio-visual-mode .visual-workspace {
      min-width: var(--studio-work-min-w) !important;
      width: var(--studio-work-min-w) !important;
      overflow: visible !important;
    }

    body.studio-visual-mode .visual-editor-col {
      position: fixed !important;
      z-index: 140 !important;
      top: calc(var(--studio-header-h) + 18px) !important;
      left: calc(var(--studio-sidebar-w) + 18px) !important;
      bottom: auto !important;
      width: 390px !important;
      min-width: 390px !important;
      max-width: 390px !important;
      max-height: min(680px, calc(100vh - var(--studio-header-h) - 34px)) !important;
      height: auto !important;
      overflow: auto !important;
      border-radius: 22px !important;
      overflow: hidden auto !important;
      border: 1px solid var(--studio-border) !important;
      box-shadow: 0 28px 70px rgba(16, 38, 26, 0.22) !important;
      background: rgba(252, 252, 248, 0.98) !important;
      backdrop-filter: blur(16px) !important;
    }

    body.studio-visual-mode.sidebar-collapsed .visual-editor-col {
      left: calc(var(--studio-sidebar-collapsed-w) + 18px) !important;
    }

    @media (min-width: 901px) {
      body.studio-visual-mode .visual-live-col,
      body.studio-visual-mode.sidebar-collapsed .visual-live-col {
        padding-left: clamp(470px, 42vw, 560px) !important;
        padding-right: clamp(1.5rem, 8vw, 8rem) !important;
        justify-content: center !important;
      }

      body.studio-visual-mode .visual-live-panel {
        transform: translateX(var(--preview-pan-x, 0px)) translateX(clamp(90px, 11vw, 170px)) !important;
      }

      body.studio-visual-mode .visual-workspace.editor-hidden .visual-live-col,
      body.studio-visual-mode.sidebar-collapsed .visual-workspace.editor-hidden .visual-live-col {
        padding-left: 1.4rem !important;
      }

      body.studio-visual-mode .visual-workspace.editor-hidden .visual-live-panel,
      body.studio-visual-mode.sidebar-collapsed .visual-workspace.editor-hidden .visual-live-panel {
        transform: translateX(var(--preview-pan-x, 0px)) !important;
      }
    }

    body.studio-visual-mode .visual-editor-col.is-dragging {
      cursor: grabbing;
      user-select: none;
      touch-action: none;
      transition: none !important;
    }

    body.studio-visual-mode .visual-editor-col.editor-floating-hidden {
      display: none !important;
    }

    body.studio-visual-mode .visual-editor-col .studio-panel-title {
      cursor: grab;
      user-select: none;
      touch-action: none;
    }

    body.studio-visual-mode .visual-editor-col .studio-panel-title:active {
      cursor: grabbing;
    }

    body.studio-visual-mode .visual-floating-grip {
      position: sticky;
      top: -0.95rem;
      z-index: 6;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 0.75rem;
      min-height: 38px;
      margin: -0.95rem -1rem 0.85rem;
      padding: 0.62rem 0.85rem;
      border-bottom: 1px solid var(--studio-border);
      border-radius: 22px 22px 0 0;
      background: rgba(252, 252, 248, 0.98);
      color: var(--verde-escuro);
      font-size: 0.66rem;
      font-weight: 900;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      cursor: grab;
      user-select: none;
      touch-action: none;
      -webkit-user-select: none;
      -webkit-touch-callout: none;
      box-shadow: 0 8px 18px rgba(16, 38, 26, 0.06);
    }

    .visual-floating-sections {
      min-height: 26px;
      border: 1px solid rgba(31,74,51,0.12);
      border-radius: 999px;
      background: rgba(31,74,51,0.055);
      color: var(--verde-escuro);
      font-size: 0.58rem;
      font-weight: 900;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      padding: 0.2rem 0.55rem;
      cursor: pointer;
    }

    .visual-floating-resize {
      position: absolute;
      right: 8px;
      bottom: 8px;
      z-index: 9;
      width: 24px;
      height: 24px;
      border: 1px solid rgba(31,74,51,0.14);
      border-radius: 9px;
      background:
        linear-gradient(135deg, transparent 48%, rgba(31,74,51,0.26) 49%, rgba(31,74,51,0.26) 54%, transparent 55%),
        linear-gradient(135deg, transparent 62%, rgba(31,74,51,0.18) 63%, rgba(31,74,51,0.18) 68%, transparent 69%),
        rgba(255,255,255,0.92);
      cursor: nwse-resize;
      touch-action: none;
    }

    .mobile-subnav-panel {
      display: none;
    }

    body.studio-visual-mode .visual-floating-grip:active {
      cursor: grabbing;
    }

    .visual-floating-grip-label {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .visual-floating-actions {
      display: inline-flex;
      align-items: center;
      gap: 0.4rem;
      flex-shrink: 0;
    }

    .visual-floating-hint {
      color: var(--studio-text-soft);
      font-size: 0.56rem;
      letter-spacing: 0.1em;
    }

    .visual-floating-close {
      width: 26px;
      height: 26px;
      border: 1px solid rgba(31, 74, 51, 0.12);
      border-radius: 999px;
      background: rgba(255, 255, 255, 0.82);
      color: var(--verde-escuro);
      display: grid;
      place-items: center;
      font-size: 1rem;
      line-height: 1;
      font-weight: 900;
      cursor: pointer;
    }

    .visual-floating-close:hover {
      background: rgba(138, 45, 36, 0.08);
      color: #8a2d24;
      border-color: rgba(138, 45, 36, 0.18);
    }

    @media (hover: none) and (pointer: coarse) {
      body.studio-visual-mode .visual-editor-col {
        width: min(390px, calc(100vw - 18px)) !important;
        min-width: min(390px, calc(100vw - 18px)) !important;
        max-width: calc(100vw - 18px) !important;
        max-height: min(72vh, calc(100vh - 72px)) !important;
      }
      body.studio-visual-mode .visual-floating-grip {
        min-height: 46px;
        padding: 0.78rem 0.9rem;
      }
      .visual-floating-sections {
        display: inline-flex;
        align-items: center;
      }
      .visual-floating-resize {
        width: 34px;
        height: 34px;
        right: 10px;
        bottom: 10px;
      }
      .visual-floating-hint::after {
        content: " / toque";
      }
    }

    /* ── Desktop estreito: meia tela no PC mantém navegação lateral compacta. ── */
    @media (max-width: 900px) and (hover: hover) and (pointer: fine) {
      :root {
        --studio-sidebar-w: 74px;
        --studio-sidebar-collapsed-w: 74px;
        --studio-work-min-w: calc(100vw - var(--studio-sidebar-w));
        --studio-work-min-w-collapsed: calc(100vw - var(--studio-sidebar-w));
        --studio-editor-w: min(320px, calc(100vw - var(--studio-sidebar-w) - 24px));
      }

      html,
      body {
        min-width: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
      }

      .header,
      .config-bar,
      .publish-warning,
      .painel-shell,
      body.sidebar-collapsed .header,
      body.sidebar-collapsed .config-bar,
      body.sidebar-collapsed .publish-warning,
      body.sidebar-collapsed .painel-shell {
        width: calc(100vw - var(--studio-sidebar-w)) !important;
        min-width: 0 !important;
        max-width: calc(100vw - var(--studio-sidebar-w)) !important;
        margin-left: var(--studio-sidebar-w) !important;
      }

      .header {
        min-height: 54px !important;
        padding: 0.42rem 0.55rem !important;
        display: flex !important;
        justify-content: space-between !important;
        overflow: hidden !important;
      }

      .studio-sidebar-brand-copy,
      .submenu-caret,
      .contratacoes-sidebar-title,
      .contratacao-btn small,
      .contratacoes-status {
        display: none !important;
      }

      .header-copy {
        display: flex !important;
        flex: 1 1 180px !important;
        min-width: 0 !important;
        max-width: clamp(130px, 36vw, 260px) !important;
      }

      .header-repo-widget {
        display: grid !important;
        width: 100% !important;
        min-width: 0 !important;
        gap: 0.18rem !important;
      }

      .header-repo-label,
      .header-repo-footer,
      .header-repo-badge {
        display: none !important;
      }

      .header-repo-input-row {
        min-width: 0 !important;
      }

      .header-repo-input {
        width: 100% !important;
        min-width: 0 !important;
        height: 34px !important;
        padding: 0.42rem 0.55rem !important;
        font-size: 0.68rem !important;
      }

      .header-actions {
        flex: 0 1 auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
        justify-content: flex-end !important;
        overflow: visible !important;
        gap: 0.38rem !important;
      }

      .btn-publicar {
        max-width: calc(100vw - var(--studio-sidebar-w) - 74px) !important;
        min-height: 38px !important;
        padding: 0.62rem 0.78rem !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
      }

      .profile-trigger {
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
        min-height: 38px !important;
      }

      .abas-nav {
        width: var(--studio-sidebar-w) !important;
        min-width: var(--studio-sidebar-w) !important;
        padding: 0.62rem 0.45rem !important;
        gap: 0.42rem !important;
      }

      .studio-sidebar-brand {
        display: flex !important;
        justify-content: center !important;
        padding: 0 0 0.62rem !important;
        margin-bottom: 0.34rem !important;
      }

      .studio-sidebar-brand img {
        width: 34px !important;
        height: 34px !important;
      }

      .studio-sidebar-toggle {
        display: none !important;
      }

      .studio-mode-panel {
        display: none !important;
      }

      .contratacoes-sidebar {
        display: grid !important;
        gap: 0.34rem !important;
        margin-top: auto !important;
        padding: 0.46rem 0 0 !important;
        border-top: 1px solid rgba(31,74,51,0.08) !important;
      }

      .contratacao-btn {
        display: grid !important;
        place-items: center !important;
        justify-content: center !important;
        min-height: 34px !important;
        padding: 0 !important;
        border-radius: 10px !important;
      }

      .contratacao-btn span {
        font-size: 0 !important;
      }

      .contratacao-btn span::after {
        font-size: 0.52rem !important;
        font-weight: 900 !important;
        letter-spacing: 0 !important;
        color: var(--verde-escuro);
      }

      .contratacao-btn:nth-of-type(1) span::after {
        content: "Criador";
      }

      .contratacao-btn:nth-of-type(2) span::after {
        content: "Editor";
      }

      .aba-nav-btn,
      .aba-nav-btn.has-submenu {
        width: 100% !important;
        min-height: 50px !important;
        justify-content: center !important;
        padding: 0.5rem 0 !important;
        border-radius: 12px !important;
      }

      .nav-label {
        display: none !important;
      }

      .nav-ico {
        width: 26px !important;
        height: 26px !important;
        margin: 0 !important;
      }

      .nav-submenu,
      .nav-submenu.aberto {
        left: calc(var(--studio-sidebar-w) + 8px) !important;
        width: 220px !important;
      }

      .painel-shell,
      body.studio-visual-mode .painel-shell,
      body.studio-visual-mode.sidebar-collapsed .painel-shell {
        padding-left: 0 !important;
        padding-right: 0 !important;
        overflow: hidden !important;
      }

      body.studio-visual-mode,
      body.studio-visual-mode #aba-visual,
      body.studio-visual-mode .visual-workspace,
      body.studio-visual-mode.sidebar-collapsed #aba-visual,
      body.studio-visual-mode.sidebar-collapsed .visual-workspace {
        min-width: 0 !important;
        width: calc(100vw - var(--studio-sidebar-w)) !important;
        max-width: calc(100vw - var(--studio-sidebar-w)) !important;
      }

      body.studio-visual-mode .visual-live-col,
      body.studio-visual-mode.sidebar-collapsed .visual-live-col,
      .visual-live-col,
      body.sidebar-collapsed .visual-live-col {
        min-width: 0 !important;
        width: calc(100vw - var(--studio-sidebar-w)) !important;
        max-width: calc(100vw - var(--studio-sidebar-w)) !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        overflow: hidden !important;
      }
    }

    /* ── Camada dedicada mobile/tablet ── */
    @media (hover: none) and (pointer: coarse) {
      :root {
        --studio-mobile-nav-h: 74px;
      }

      html,
      body {
        min-width: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
      }

      body {
        padding-bottom: calc(var(--studio-mobile-nav-h) + env(safe-area-inset-bottom, 0px)) !important;
      }

      .header,
      .config-bar,
      .publish-warning,
      .painel-shell,
      body.sidebar-collapsed .header,
      body.sidebar-collapsed .config-bar,
      body.sidebar-collapsed .publish-warning,
      body.sidebar-collapsed .painel-shell {
        width: 100% !important;
        min-width: 0 !important;
        margin-left: 0 !important;
      }

      .header {
        min-height: 54px !important;
        padding: 0.45rem 0.65rem !important;
        gap: 0.5rem !important;
      }

      .header-actions {
        max-width: none !important;
        overflow-x: auto !important;
        flex-wrap: nowrap !important;
        justify-content: flex-end !important;
      }

      .header-actions > * {
        flex: 0 0 auto;
      }

      .btn-publicar,
      .btn-gerar-boletim,
      .btn-secundario,
      .profile-trigger {
        min-height: 40px !important;
      }

      .abas-nav,
      body.sidebar-collapsed .abas-nav {
        position: fixed !important;
        inset: auto 0 0 0 !important;
        z-index: 180 !important;
        width: 100% !important;
        min-width: 0 !important;
        height: calc(var(--studio-mobile-nav-h) + env(safe-area-inset-bottom, 0px)) !important;
        padding: 0.42rem 0.55rem calc(0.42rem + env(safe-area-inset-bottom, 0px)) !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: stretch !important;
        gap: 0.4rem !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        border-top: 1px solid rgba(31,74,51,0.13) !important;
        border-right: 0 !important;
        box-shadow: 0 -14px 34px rgba(16,38,26,0.13) !important;
        background: rgba(252,252,248,0.97) !important;
        backdrop-filter: blur(16px) !important;
        scroll-snap-type: x proximity;
      }

      .abas-nav::-webkit-scrollbar {
        display: none;
      }

      .studio-sidebar-brand {
        display: none !important;
      }

      .studio-sidebar-toggle {
        display: none !important;
      }

      .aba-nav-btn,
      .aba-nav-btn.has-submenu,
      body.sidebar-collapsed .aba-nav-btn,
      body.sidebar-collapsed .aba-nav-btn.has-submenu {
        flex: 0 0 104px !important;
        width: 104px !important;
        min-height: 56px !important;
        padding: 0.44rem 0.5rem !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        place-items: center !important;
        gap: 0.18rem !important;
        border-radius: 16px !important;
        scroll-snap-align: start;
        text-align: center !important;
      }

      .aba-nav-btn .nav-ico {
        width: 24px !important;
        height: 24px !important;
      }

      .aba-nav-btn .nav-label {
        width: 100%;
        text-align: center !important;
        white-space: normal !important;
        font-size: 0.56rem !important;
        line-height: 1.12 !important;
        letter-spacing: 0.04em !important;
      }

      .submenu-caret {
        display: none !important;
      }

      .nav-submenu,
      body.sidebar-collapsed .nav-submenu,
      .nav-submenu.aberto,
      body.sidebar-collapsed .nav-submenu.aberto {
        position: fixed !important;
        left: 0.55rem !important;
        right: 0.55rem !important;
        bottom: calc(var(--studio-mobile-nav-h) + env(safe-area-inset-bottom, 0px) + 0.55rem) !important;
        top: auto !important;
        z-index: 260 !important;
        width: auto !important;
        max-height: min(46vh, 360px) !important;
        margin: 0 !important;
        padding: 0.5rem !important;
        overflow: auto !important;
        border-radius: 18px !important;
        background: rgba(252,252,248,0.98) !important;
        box-shadow: 0 22px 58px rgba(16,38,26,0.22) !important;
      }

      .nav-submenu.mobile-submenu-open {
        display: flex !important;
      }

      .mobile-subnav-panel {
        position: fixed;
        left: 0.55rem;
        right: 0.55rem;
        bottom: calc(var(--studio-mobile-nav-h) + env(safe-area-inset-bottom, 0px) + 0.55rem);
        z-index: 255;
        max-height: min(48vh, 380px);
        overflow: auto;
        padding: 0.55rem;
        border: 1px solid var(--studio-border);
        border-radius: 20px;
        background: rgba(252,252,248,0.99);
        box-shadow: 0 24px 64px rgba(16,38,26,0.24);
        backdrop-filter: blur(16px);
      }

      .mobile-subnav-panel.aberto {
        display: block;
      }

      .mobile-subnav-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
        padding: 0.25rem 0.25rem 0.55rem;
        color: var(--verde-escuro);
        font-size: 0.68rem;
        font-weight: 900;
        letter-spacing: 0.1em;
        text-transform: uppercase;
      }

      .mobile-subnav-close {
        width: 32px;
        height: 32px;
        border-radius: 999px;
        border: 1px solid rgba(31,74,51,0.12);
        background: rgba(31,74,51,0.055);
        color: var(--verde-escuro);
        font-size: 1rem;
        line-height: 1;
      }

      .mobile-subnav-list {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.42rem;
      }

      .mobile-subnav-item {
        width: 100% !important;
        min-height: 44px !important;
        border-radius: 14px !important;
        background: rgba(31,74,51,0.045) !important;
        color: var(--verde-escuro) !important;
        border: 1px solid rgba(31,74,51,0.08) !important;
        padding: 0.72rem 0.78rem !important;
        font-size: 0.68rem !important;
        font-weight: 900 !important;
        letter-spacing: 0.06em !important;
        text-transform: uppercase !important;
        text-align: left !important;
      }

      .mobile-subnav-item.ativa {
        background: rgba(31,74,51,0.13) !important;
        border-color: rgba(31,74,51,0.18) !important;
      }

      .mobile-subnav-section-title {
        grid-column: 1 / -1;
        padding: 0.5rem 0.35rem 0.15rem;
        color: var(--studio-text-soft);
        font-size: 0.58rem;
        font-weight: 900;
        letter-spacing: 0.12em;
        text-transform: uppercase;
      }

      .nav-sub-btn,
      body.sidebar-collapsed .nav-submenu.aberto .nav-sub-btn {
        min-height: 42px !important;
        padding: 0.7rem 0.8rem !important;
        font-size: 0.68rem !important;
      }

      .painel-shell {
        padding: 0.65rem 0.65rem calc(var(--studio-mobile-nav-h) + 1.2rem) !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
      }

      .painel-meta {
        display: none !important;
      }

      .aba-conteudo,
      body.studio-visual-mode .aba-conteudo {
        min-width: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 0.82rem !important;
        border-radius: 18px !important;
      }

      .studio-panel-card,
      .auth-card,
      .meta-card,
      .upload-card,
      .card-inst,
      .aviso-card,
      .liturgia-editor-card,
      .programacao-dia-card,
      .planejamento-mes-card,
      .lideranca-editor-card,
      .simbolo-item-card {
        border-radius: 18px !important;
      }

      .campo input,
      .campo textarea,
      .campo select,
      input,
      textarea,
      select {
        min-height: 44px;
        font-size: 16px !important;
      }

      textarea.grande {
        min-height: 190px;
      }

      button,
      .button-link,
      .btn-aplicar-tema,
      .btn-add-liturgia,
      .btn-duplicar-aviso,
      .btn-remover-aviso,
      .btn-remover-liturgia,
      .btn-add-aviso,
      .btn-add-aniv {
        min-height: 42px !important;
      }

      .grid2,
      .two,
      .logos-linha,
      .studio-mini-grid,
      .secao-toggle-grid,
      .button-model-grid,
      .icon-family-grid,
      .social-modelo-grid {
        grid-template-columns: 1fr !important;
      }

      .toolbar-acoes,
      .avisos-toolbar,
      .editor-item-head,
      .liturgia-editor-topo,
      .programacao-item,
      .aniv-linha,
      .aviso-card-header,
      .aviso-card-topo {
        align-items: stretch !important;
        flex-wrap: wrap !important;
      }

      .toolbar-acoes > *,
      .avisos-toolbar > *,
      .editor-item-head > *,
      .liturgia-editor-topo > *,
      .aviso-card-topo > * {
        max-width: 100%;
      }

      body.studio-visual-mode,
      body.studio-visual-mode.sidebar-collapsed {
        min-width: 0 !important;
        overflow-x: hidden !important;
      }

      body.studio-visual-mode .header,
      body.studio-visual-mode .painel-shell,
      body.studio-visual-mode.sidebar-collapsed .header,
      body.studio-visual-mode.sidebar-collapsed .painel-shell {
        width: 100% !important;
        min-width: 0 !important;
        margin-left: 0 !important;
      }

      body.studio-visual-mode #aba-visual,
      body.studio-visual-mode.sidebar-collapsed #aba-visual,
      body.studio-visual-mode .visual-workspace,
      body.studio-visual-mode.sidebar-collapsed .visual-workspace,
      .visual-workspace {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        min-height: calc(100dvh - var(--studio-mobile-nav-h) - 54px) !important;
        overflow: hidden !important;
      }

      body.studio-visual-mode .visual-live-col,
      body.studio-visual-mode.sidebar-collapsed .visual-live-col,
      .visual-live-col,
      body.sidebar-collapsed .visual-live-col {
        position: relative !important;
        inset: auto !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        min-height: calc(100dvh - var(--studio-mobile-nav-h) - 72px) !important;
        padding: 0.75rem !important;
        overflow: auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
      }

      body.studio-visual-mode .visual-editor-col,
      body.studio-visual-mode.sidebar-collapsed .visual-editor-col,
      .visual-editor-col,
      body.sidebar-collapsed .visual-editor-col {
        position: fixed !important;
        z-index: 170 !important;
        left: 0.55rem !important;
        top: 4.25rem !important;
        width: min(390px, calc(100vw - 1.1rem)) !important;
        min-width: 0 !important;
        max-width: calc(100vw - 1.1rem) !important;
        max-height: min(68dvh, calc(100dvh - var(--studio-mobile-nav-h) - 5.2rem)) !important;
        height: auto !important;
        overflow: hidden auto !important;
      }

      .visual-workspace.editor-hidden .visual-live-col,
      body.sidebar-collapsed .visual-workspace.editor-hidden .visual-live-col {
        min-width: 0 !important;
        padding: 0.75rem !important;
      }

      .visual-live-panel {
        min-width: 0 !important;
        width: 100% !important;
        display: grid;
        place-items: center;
      }

      .visual-live-frame-wrap,
      .visual-live-frame-wrap[data-device="phone"],
      body.studio-visual-mode .visual-live-frame-wrap,
      body.studio-visual-mode .visual-live-frame-wrap[data-device="phone"] {
        width: min(292px, calc(100vw - 2rem)) !important;
        min-width: min(292px, calc(100vw - 2rem)) !important;
        height: min(632px, calc(100dvh - var(--studio-mobile-nav-h) - 6.5rem)) !important;
      }

      .visual-live-frame-wrap[data-device="tablet"] {
        width: min(520px, calc(100vw - 2rem)) !important;
        min-width: min(520px, calc(100vw - 2rem)) !important;
      }

      .visual-live-frame-wrap[data-device="desktop"] {
        width: min(760px, calc(100vw - 2rem)) !important;
        min-width: min(760px, calc(100vw - 2rem)) !important;
      }
    }

    @media (hover: none) and (pointer: coarse) and (orientation: landscape) {
      :root {
        --studio-mobile-nav-h: 62px;
      }

      .header {
        min-height: 48px !important;
        padding-block: 0.35rem !important;
      }

      .aba-nav-btn,
      .aba-nav-btn.has-submenu,
      body.sidebar-collapsed .aba-nav-btn,
      body.sidebar-collapsed .aba-nav-btn.has-submenu {
        flex-basis: 98px !important;
        width: 98px !important;
        min-height: 48px !important;
      }

      .aba-nav-btn .nav-label {
        font-size: 0.52rem !important;
      }

      body.studio-visual-mode .visual-editor-col,
      body.studio-visual-mode.sidebar-collapsed .visual-editor-col,
      .visual-editor-col,
      body.sidebar-collapsed .visual-editor-col {
        top: 3.55rem !important;
        width: min(420px, 48vw) !important;
        max-width: min(420px, 48vw) !important;
        max-height: calc(100dvh - var(--studio-mobile-nav-h) - 4.2rem) !important;
      }

      body.studio-visual-mode .visual-live-col,
      body.studio-visual-mode.sidebar-collapsed .visual-live-col,
      .visual-live-col,
      body.sidebar-collapsed .visual-live-col {
        min-height: calc(100dvh - var(--studio-mobile-nav-h) - 52px) !important;
        align-items: center !important;
      }

      .visual-live-frame-wrap,
      .visual-live-frame-wrap[data-device="phone"],
      body.studio-visual-mode .visual-live-frame-wrap,
      body.studio-visual-mode .visual-live-frame-wrap[data-device="phone"] {
        height: min(520px, calc(100dvh - var(--studio-mobile-nav-h) - 5rem)) !important;
      }
    }

    body.studio-dark .visual-floating-grip {
      background: rgba(17, 23, 20, 0.98);
      color: #f3f7f4;
    }

    body.studio-visual-mode .visual-live-col {
      position: absolute !important;
      z-index: 1 !important;
      inset: 0 auto auto 0 !important;
      width: var(--studio-work-min-w) !important;
      min-width: var(--studio-work-min-w) !important;
      min-height: calc(100vh - var(--studio-header-h)) !important;
      padding: 1.1rem 1.4rem !important;
      overflow: auto !important;
      display: flex !important;
      align-items: center !important;
      justify-content: center !important;
    }

    body.studio-visual-mode.sidebar-collapsed .visual-live-col {
      width: var(--studio-work-min-w-collapsed) !important;
      min-width: var(--studio-work-min-w-collapsed) !important;
      padding: 1.1rem 1.4rem !important;
    }

    body.studio-visual-mode .visual-live-panel {
      margin: auto !important;
      transform: translateX(var(--preview-pan-x, 0px)) !important;
    }

    @media (min-width: 901px) {
      body.studio-visual-mode .visual-live-col,
      body.studio-visual-mode.sidebar-collapsed .visual-live-col {
        padding: 1.1rem 1.4rem 1.1rem clamp(330px, 28vw, 430px) !important;
        justify-content: center !important;
      }

      body.studio-visual-mode .visual-live-panel,
      body.studio-visual-mode.sidebar-collapsed .visual-live-panel {
        margin: auto !important;
        transform: translateX(var(--preview-pan-x, 0px)) !important;
      }

      body.studio-visual-mode .visual-workspace.editor-hidden .visual-live-col,
      body.studio-visual-mode.sidebar-collapsed .visual-workspace.editor-hidden .visual-live-col {
        padding: 1.1rem 1.4rem !important;
      }

      body.studio-visual-mode .visual-workspace.editor-hidden .visual-live-panel,
      body.studio-visual-mode.sidebar-collapsed .visual-workspace.editor-hidden .visual-live-panel {
        transform: translateX(var(--preview-pan-x, 0px)) !important;
      }
    }

    /* ═══════════════════════════════════════════════════
       REFINAMENTO VISUAL FINAL — BOLETIM STUDIO
       Este bloco está no final da cascata e tem prioridade
       sobre todos os outros blocos de CSS anteriores.
    ═══════════════════════════════════════════════════ */

    /* Tipografia base */
    body, button, input, textarea, select, label {
      font-family: 'Inter', 'Lato', sans-serif !important;
    }

    /* Fundo geral */
    body:not(.studio-dark) {
      background: linear-gradient(180deg, #f4f7f3 0%, #edf1eb 60%, #e7ece5 100%) !important;
    }

    /* ── Header compacto e elegante ── */
    .header {
      padding-block: 0.7rem !important;
      min-height: 0 !important;
    }
    .studio-brand-logo {
      width: 38px !important;
      height: 38px !important;
      border-radius: 10px !important;
    }
    .header h1 {
      font-size: 1.1rem !important;
      font-weight: 500 !important;
      letter-spacing: -0.01em !important;
    }
    .header p {
      font-size: 0.76rem !important;
      opacity: 0.68 !important;
    }
    .header-kicker {
      font-size: 0.56rem !important;
      letter-spacing: 0.12em !important;
      font-weight: 600 !important;
    }

    /* ── Botões: remover pílula excessiva ── */
    .btn-publicar,
    .btn-gerar-boletim,
    .btn-secundario {
      border-radius: 8px !important;
      font-weight: 600 !important;
      letter-spacing: 0.01em !important;
    }
    .btn-publicar:not(.studio-dark *) {
      background: var(--verde) !important;
      color: #fff !important;
    }
    .btn-gerar-boletim:not(.studio-dark *) {
      background: var(--verde) !important;
      color: #fff !important;
    }

    /* ── Sidebar vertical refinada ── */
    .abas-nav:not(.studio-dark *) {
      background: rgba(249,251,248,0.97) !important;
      box-shadow: 2px 0 12px rgba(11,93,59,0.05) !important;
      border-right-color: rgba(31,74,51,0.09) !important;
    }
    .aba-nav-btn {
      text-transform: none !important;
      font-weight: 500 !important;
      letter-spacing: 0.01em !important;
      font-size: 0.73rem !important;
      border-radius: 8px !important;
      border-left: 2px solid transparent !important;
      border-bottom: 0 !important;
    }
    .aba-nav-btn.ativa {
      font-weight: 600 !important;
      border-left-color: var(--dourado) !important;
      border-bottom-color: transparent !important;
    }
    .aba-nav-btn .nav-ico {
      width: 22px !important;
      height: 22px !important;
      border-radius: 7px !important;
      font-size: 0.62rem !important;
    }

    /* ── Sidebar brand ── */
    .studio-sidebar-brand strong {
      font-family: 'Inter', 'Lato', sans-serif !important;
      font-size: 0.82rem !important;
      font-weight: 600 !important;
      letter-spacing: -0.01em !important;
      text-transform: none !important;
    }
    .studio-sidebar-brand span {
      font-size: 0.52rem !important;
      letter-spacing: 0.10em !important;
      font-weight: 500 !important;
    }
    .studio-sidebar-brand img {
      width: 28px !important;
      height: 28px !important;
      border-radius: 7px !important;
    }

    /* ── Navegação sub-items ── */
    .nav-sub-btn {
      text-transform: none !important;
      font-weight: 400 !important;
      letter-spacing: 0.005em !important;
      font-size: 0.7rem !important;
      border-radius: 6px !important;
    }
    .nav-sub-btn.ativa {
      font-weight: 500 !important;
    }

    /* ── Contratações no padrão claro do menu lateral ── */
    .contratacoes-sidebar {
      border-top: 1px solid rgba(31,74,51,0.08) !important;
      background: transparent !important;
    }
    .contratacoes-sidebar-title {
      color: var(--dourado) !important;
      opacity: 0.92 !important;
    }
    .contratacao-btn {
      border: 1px solid rgba(31,74,51,0.08) !important;
      background: rgba(252,252,248,0.72) !important;
      color: var(--verde-escuro) !important;
      box-shadow: 0 1px 0 rgba(255,255,255,0.85), 0 8px 20px rgba(20,37,28,0.035) !important;
    }
    .contratacao-btn:hover {
      background: rgba(31,74,51,0.055) !important;
      border-color: rgba(183,154,86,0.32) !important;
    }
    .contratacao-btn span {
      color: var(--verde-escuro) !important;
    }
    .contratacao-btn small,
    .contratacoes-status {
      color: var(--texto-suave) !important;
      opacity: 0.82 !important;
    }

    body.studio-dark .contratacoes-sidebar {
      border-top-color: rgba(255,255,255,0.08) !important;
    }
    body.studio-dark .contratacao-btn {
      border-color: rgba(255,255,255,0.1) !important;
      background: rgba(255,255,255,0.06) !important;
      color: #f4f8f5 !important;
      box-shadow: none !important;
    }
    body.studio-dark .contratacao-btn span {
      color: #f4f8f5 !important;
    }
    body.studio-dark .contratacao-btn small,
    body.studio-dark .contratacoes-status {
      color: rgba(244,248,245,0.68) !important;
    }

    body:not(.studio-dark) .abas-nav .contratacoes-sidebar .contratacoes-sidebar-title {
      color: var(--dourado) !important;
      text-shadow: none !important;
    }
    body:not(.studio-dark) .abas-nav .contratacoes-sidebar .contratacao-btn,
    body:not(.studio-dark) .abas-nav .contratacoes-sidebar .contratacao-btn span,
    body:not(.studio-dark) .abas-nav .contratacoes-sidebar .contratacao-btn small {
      text-shadow: none !important;
    }
    body:not(.studio-dark) .abas-nav .contratacoes-sidebar .contratacao-btn {
      background-color: rgba(252,252,248,0.92) !important;
      background-image: none !important;
      color: var(--verde-escuro) !important;
    }
    body:not(.studio-dark) .abas-nav .contratacoes-sidebar .contratacao-btn span {
      color: var(--verde-escuro) !important;
      opacity: 1 !important;
    }
    body:not(.studio-dark) .abas-nav .contratacoes-sidebar .contratacao-btn small,
    body:not(.studio-dark) .abas-nav .contratacoes-sidebar .contratacoes-status {
      color: #69766d !important;
      opacity: 1 !important;
    }

    /* ── Seção títulos: compactos e discretos ── */
    .secao-titulo {
      font-family: 'Inter', 'Lato', sans-serif !important;
      font-size: 0.62rem !important;
      font-weight: 600 !important;
      letter-spacing: 0.09em !important;
      border-left: 2px solid var(--dourado) !important;
      border-radius: 0 6px 6px 0 !important;
      background: rgba(31,74,51,0.04) !important;
      padding: 0.38rem 0.7rem !important;
      margin-top: 1.4rem !important;
      margin-bottom: 0.8rem !important;
    }

    /* ── Studio panel title ── */
    .studio-panel-title {
      font-family: 'Inter', 'Lato', sans-serif !important;
      font-size: 0.60rem !important;
      font-weight: 600 !important;
      letter-spacing: 0.08em !important;
      color: var(--texto-suave) !important;
      text-transform: uppercase !important;
    }

    /* ── Cards ── */
    .aviso-card,
    .card-inst,
    .auth-card,
    .studio-panel-card,
    .meta-card,
    .upload-card {
      box-shadow: 0 1px 4px rgba(20,37,28,0.06), 0 4px 16px rgba(20,37,28,0.05) !important;
      border-color: rgba(31,74,51,0.09) !important;
    }

    /* ── Auth card ── */
    .auth-card h2 {
      font-family: 'Inter', 'Lato', sans-serif !important;
      font-size: 1.2rem !important;
      font-weight: 600 !important;
      letter-spacing: -0.01em !important;
    }
    .auth-tabs {
      background: #f2f5f2 !important;
      border-radius: 8px !important;
      padding: 0.22rem !important;
    }
    .auth-tabs button {
      border-radius: 6px !important;
      font-weight: 500 !important;
      border: 0 !important;
      background: transparent !important;
    }
    .auth-tabs button.ativa {
      background: #fff !important;
      color: var(--verde-escuro) !important;
      font-weight: 600 !important;
      box-shadow: 0 1px 4px rgba(0,0,0,0.10) !important;
    }
    .auth-submit-btn {
      border-radius: 8px !important;
      font-weight: 600 !important;
      letter-spacing: 0.01em !important;
    }

    /* ── Labels ── */
    .campo label,
    .auth-form label {
      font-weight: 500 !important;
      font-size: 0.72rem !important;
      text-transform: none !important;
      letter-spacing: 0.01em !important;
      color: var(--texto-suave) !important;
    }

    /* ── Inputs refinados ── */
    .campo input,
    .campo textarea,
    .campo select,
    .auth-form input {
      border-radius: 8px !important;
      border-color: rgba(31,74,51,0.13) !important;
    }

    /* ── Aba intro ── */
    .aba-intro {
      background: rgba(31,74,51,0.04) !important;
      border-color: rgba(31,74,51,0.09) !important;
      border-radius: 12px !important;
    }
    .aba-intro strong {
      text-transform: uppercase !important;
      letter-spacing: 0.07em !important;
      font-size: 0.65rem !important;
      font-weight: 600 !important;
      color: var(--verde2) !important;
    }
    .aba-intro p {
      font-size: 0.78rem !important;
    }

    /* ── Botões de ação ── */
    .btn-add-aviso,
    .btn-add-aniv,
    .btn-add-liturgia,
    .btn-programacao-add,
    .btn-programacao-dia {
      border-radius: 8px !important;
      font-weight: 500 !important;
      border-style: dashed !important;
    }
    .btn-remover-aviso,
    .btn-duplicar-aviso,
    .btn-remover-aniv,
    .btn-remover-liturgia,
    .btn-programacao-mini {
      border-radius: 6px !important;
      font-weight: 500 !important;
    }

    /* ── Abas de navegação horizontal (abas-nav modo tablet/mobile) ── */
    @media (max-width: 820px) {
      .aba-nav-btn {
        text-transform: none !important;
        font-weight: 500 !important;
        border-left: 0 !important;
        border-bottom: 2px solid transparent !important;
      }
      .aba-nav-btn.ativa {
        border-bottom-color: var(--dourado) !important;
        border-left: 0 !important;
      }
    }

    /* ── Aviso fixo / status bar ── */
    #status-bar {
      border-radius: 10px !important;
      font-weight: 500 !important;
      z-index: 2147483000 !important;
      pointer-events: none !important;
    }

    /* ── Profile trigger ── */
    .profile-trigger {
      border-radius: 50% !important;
      font-size: 0.76rem !important;
    }

    /* ── Config bar refinada ── */
    .config-bar:not(.studio-dark *) {
      background: rgba(252,248,234,0.88) !important;
      border-bottom-color: rgba(183,154,86,0.18) !important;
    }

    /* ── Refinamento clean / mobile app ── */
    html {
      min-width: 320px;
      overflow-x: auto;
      -webkit-text-size-adjust: 100%;
      touch-action: pan-x pan-y pinch-zoom;
    }

    body {
      background:
        radial-gradient(circle at 18% 0%, rgba(183,154,86,0.10), transparent 30rem),
        linear-gradient(180deg, #f8faf6 0%, #eef4ef 56%, #e8eee7 100%) !important;
      overscroll-behavior: contain;
    }

    .auth-gate {
      overflow: auto !important;
      align-items: flex-start !important;
      padding: clamp(1rem, 4vh, 2.4rem) 1rem !important;
    }

    .auth-card {
      max-height: calc(100dvh - 2rem);
      overflow: auto;
      border-radius: 18px !important;
      background: rgba(255,255,252,0.94) !important;
      box-shadow: 0 18px 48px rgba(16,38,26,0.12) !important;
    }

    .payment-card {
      width: min(430px, calc(100vw - 1.4rem)) !important;
      padding: 1.15rem !important;
    }

    .payment-card .auth-form { gap: 0.48rem !important; }
    .payment-card h2 { margin-bottom: 0.15rem !important; }
    .payment-card p,
    .auth-card > p,
    .profile-popover > p,
    .auth-setup > p,
    .aba-intro p,
    .dica,
    .dica-compartilhar,
    .arquivo-info,
    .config-card-note {
      display: none !important;
    }

    #payment-pix-qr {
      width: min(172px, 58vw) !important;
      padding: 8px !important;
      border-radius: 10px !important;
      margin-bottom: 0.35rem !important;
    }

    #payment-pix-details {
      font-size: 0.72rem !important;
      line-height: 1.35 !important;
      margin: 0.05rem 0 0.15rem !important;
    }

    .auth-secondary-btn,
    .auth-submit-btn,
    .btn-publicar,
    .btn-gerar-boletim,
    .btn-add-aviso,
    .btn-add-aniv,
    .btn-add-liturgia,
    .btn-programacao-add {
      border-radius: 10px !important;
      box-shadow: none !important;
    }

    .aba-conteudo,
    .studio-panel-card,
    .card-inst,
    .aviso-card,
    .liturgia-editor-card,
    .programacao-dia-card,
    .planejamento-mes-card,
    .lideranca-editor-card,
    .simbolo-item-card,
    .meta-card,
    .upload-card,
    .aba-intro {
      background: rgba(255,255,252,0.74) !important;
      border: 1px solid rgba(31,74,51,0.085) !important;
      box-shadow: 0 1px 0 rgba(255,255,255,0.75), 0 10px 28px rgba(16,38,26,0.055) !important;
      backdrop-filter: blur(14px);
    }

    .campo input,
    .campo textarea,
    .campo select,
    .auth-form input,
    .config-bar input,
    .studio-select,
    .lideranca-input,
    .planejamento-input {
      border-radius: 10px !important;
      background: rgba(255,255,255,0.90) !important;
      border-color: rgba(31,74,51,0.11) !important;
    }

    .secao-titulo {
      background: transparent !important;
      border-left-color: rgba(183,154,86,0.65) !important;
      color: #294735 !important;
    }

    @media (hover: none) and (pointer: coarse) {
      html, body {
        overflow-x: auto !important;
        touch-action: pan-x pan-y pinch-zoom !important;
      }

      body {
        min-width: 320px;
      }

      .auth-gate {
        padding: max(0.8rem, env(safe-area-inset-top)) 0.7rem max(0.8rem, env(safe-area-inset-bottom)) !important;
      }

      .auth-card,
      .payment-card {
        max-height: calc(100dvh - 1.4rem) !important;
      }

      .header {
        padding-left: 0.75rem !important;
      }

      .aba-conteudo {
        padding: 1rem 0.75rem !important;
      }

      .studio-main,
      .studio-content,
      main {
        touch-action: pan-x pan-y pinch-zoom !important;
      }
    }

    /* ── Ajustes finos solicitados ── */
    .nav-ico {
      font-size: 0 !important;
      line-height: 0 !important;
      color: transparent !important;
      border: 1px solid rgba(183,154,86,0.18);
      background-color: rgba(183,154,86,0.10) !important;
      background-size: 15px 15px !important;
      background-repeat: no-repeat !important;
      background-position: center !important;
    }

    .nav-ico[data-ico="IN"] {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23b79a56' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4 11 8-7 8 7'/%3E%3Cpath d='M6 10.5V20h12v-9.5'/%3E%3Cpath d='M10 20v-5h4v5'/%3E%3C/svg%3E") !important;
    }

    .nav-ico[data-ico="SC"] {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23b79a56' stroke-width='1.85' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 6h12'/%3E%3Cpath d='M8 12h12'/%3E%3Cpath d='M8 18h12'/%3E%3Cpath d='M4 6h.01'/%3E%3Cpath d='M4 12h.01'/%3E%3Cpath d='M4 18h.01'/%3E%3C/svg%3E") !important;
    }

    .nav-ico[data-ico="GH"] {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23b79a56' stroke-width='1.85' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3v12'/%3E%3Ccircle cx='6' cy='18' r='3'/%3E%3Ccircle cx='18' cy='6' r='3'/%3E%3Cpath d='M9 18h1.5A7.5 7.5 0 0 0 18 10.5V9'/%3E%3C/svg%3E") !important;
    }

    .nav-ico[data-ico="CF"] {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23b79a56' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l2.2 4.5 5 .7-3.6 3.5.9 5-4.5-2.4-4.5 2.4.9-5-3.6-3.5 5-.7L12 3z'/%3E%3C/svg%3E") !important;
    }

    .visual-floating-resize {
      opacity: 0 !important;
      pointer-events: auto !important;
      background: transparent !important;
      border-color: transparent !important;
    }

    body.studio-visual-mode .visual-editor-col,
    body.studio-visual-mode.sidebar-collapsed .visual-editor-col,
    .visual-live-panel,
    .visual-live-frame-wrap,
    body.studio-visual-mode .visual-live-panel,
    body.studio-visual-mode .visual-live-frame-wrap {
      border-radius: 14px !important;
    }

    body.studio-visual-mode .visual-editor-col {
      scrollbar-width: none !important;
      -ms-overflow-style: none !important;
    }

    body.studio-visual-mode .visual-editor-col::-webkit-scrollbar {
      width: 0 !important;
      height: 0 !important;
    }

    body.studio-visual-mode .visual-floating-grip {
      border-radius: 14px 14px 0 0 !important;
    }

    .visual-floating-edge-resize {
      position: absolute !important;
      z-index: 10;
      background: transparent !important;
      border: 0 !important;
      padding: 0 !important;
      margin: 0 !important;
      touch-action: none;
      user-select: none;
      -webkit-user-select: none;
      -webkit-tap-highlight-color: transparent;
    }

    .visual-floating-edge-resize[data-edge="n"] { top: 0; left: 12px; right: 12px; height: 10px; cursor: ns-resize; }
    .visual-floating-edge-resize[data-edge="s"] { bottom: 0; left: 12px; right: 12px; height: 10px; cursor: ns-resize; }
    .visual-floating-edge-resize[data-edge="e"] { top: 12px; right: 0; bottom: 12px; width: 10px; cursor: ew-resize; }
    .visual-floating-edge-resize[data-edge="w"] { top: 12px; left: 0; bottom: 12px; width: 10px; cursor: ew-resize; }
    .visual-floating-edge-resize[data-edge="ne"] { top: 0; right: 0; width: 14px; height: 14px; cursor: nesw-resize; }
    .visual-floating-edge-resize[data-edge="nw"] { top: 0; left: 0; width: 14px; height: 14px; cursor: nwse-resize; }
    .visual-floating-edge-resize[data-edge="se"] { bottom: 0; right: 0; width: 14px; height: 14px; cursor: nwse-resize; }
    .visual-floating-edge-resize[data-edge="sw"] { bottom: 0; left: 0; width: 14px; height: 14px; cursor: nesw-resize; }

    @media (hover: none) and (pointer: coarse) {
      .mobile-subnav-panel {
        left: 0.55rem !important;
        right: auto !important;
        bottom: calc(var(--studio-mobile-nav-h) + env(safe-area-inset-bottom, 0px) + 0.55rem) !important;
        width: min(330px, calc(100vw - 1.1rem)) !important;
        max-height: min(34vh, 270px) !important;
        padding: 0.5rem !important;
        border-radius: 18px !important;
      }

      .mobile-subnav-panel.expandida {
        width: min(390px, calc(100vw - 1.1rem)) !important;
        max-height: min(58vh, 520px) !important;
      }

      .mobile-subnav-head {
        padding: 0.16rem 0.18rem 0.42rem !important;
        font-size: 0.62rem !important;
        letter-spacing: 0.08em !important;
      }

      .mobile-subnav-controls {
        display: inline-flex;
        align-items: center;
        gap: 0.28rem;
      }

      .mobile-subnav-size,
      .mobile-subnav-close {
        width: 30px !important;
        height: 30px !important;
        min-height: 30px !important;
        border-radius: 999px !important;
        border: 1px solid rgba(31,74,51,0.11) !important;
        background: rgba(255,255,255,0.68) !important;
        color: var(--verde-escuro) !important;
        font-size: 0.9rem !important;
        font-weight: 600 !important;
      }

      .mobile-subnav-list {
        grid-template-columns: 1fr !important;
        gap: 0.34rem !important;
      }

      .mobile-subnav-item {
        min-height: 36px !important;
        padding: 0.48rem 0.64rem !important;
        border-radius: 10px !important;
        font-size: 0.64rem !important;
        letter-spacing: 0.035em !important;
        font-weight: 700 !important;
      }

      .mobile-subnav-section-title {
        padding: 0.35rem 0.2rem 0.05rem !important;
        font-size: 0.54rem !important;
      }
    }

    /* ── Gerador administrativo de cupons ── */
    .github-admin-stack {
      display: grid;
      gap: 0.9rem;
    }

    .github-admin-section {
      display: grid;
      gap: 0.75rem;
      padding: 0.9rem;
      border: 1px solid rgba(31,74,51,0.09);
      border-radius: 18px;
      background: rgba(255,255,252,0.78);
      box-shadow: 0 1px 0 rgba(255,255,255,0.72), 0 14px 34px rgba(16,38,26,0.045);
    }

    body.admin-mode .github-admin-section.admin-only {
      display: grid !important;
    }

    .github-admin-section-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 0.75rem;
      padding-bottom: 0.55rem;
      border-bottom: 1px solid rgba(31,74,51,0.07);
    }

    .github-admin-section-title {
      color: var(--verde-escuro);
      font-size: 0.72rem;
      font-weight: 800;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }

    .github-admin-section-kicker {
      flex: 0 0 auto;
      border-radius: 999px;
      padding: 0.28rem 0.52rem;
      background: rgba(31,74,51,0.055);
      color: #355844;
      font-size: 0.58rem;
      font-weight: 800;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }

    .github-admin-fields {
      display: grid;
      gap: 0.68rem;
    }

    .github-admin-fields .config-item {
      margin: 0;
      padding: 0.72rem;
      border: 1px solid rgba(31,74,51,0.08);
      border-radius: 14px;
      background: rgba(255,255,255,0.66);
    }

    .github-admin-fields .config-item label {
      display: block;
      margin-bottom: 0.35rem;
      color: var(--texto-suave);
      font-size: 0.62rem;
      font-weight: 800;
      letter-spacing: 0.07em;
      text-transform: uppercase;
    }

    .github-admin-fields .config-item input {
      width: 100%;
      max-width: none;
    }

    .github-admin-section .credentials-summary {
      margin: 0;
    }

    .studio-info-grid {
      display: grid;
      gap: 0.75rem;
    }

    .studio-info-block {
      display: grid;
      gap: 0.4rem;
      padding: 0.85rem;
      border: 1px solid rgba(31,74,51,0.09);
      border-radius: 14px;
      background: rgba(255,255,252,0.72);
    }

    .studio-info-block strong {
      color: var(--verde-escuro);
      font-size: 0.78rem;
    }

    .studio-info-block p {
      margin: 0;
      color: var(--texto-suave);
      font-size: 0.78rem;
      line-height: 1.55;
    }

    .pricing-info-block {
      gap: 0.55rem;
    }

    .studio-legal-mark {
      position: fixed;
      right: 1rem;
      bottom: 0.75rem;
      z-index: 6;
      color: rgba(31,74,51,0.58);
      font-size: 0.66rem;
      font-weight: 700;
      letter-spacing: 0.02em;
      pointer-events: none;
      white-space: nowrap;
    }

    @media (max-width: 720px) {
      .studio-legal-mark {
        display: none;
      }

      .pricing-table {
        min-width: 0;
      }

      .pricing-table thead {
        display: none;
      }

      .pricing-table,
      .pricing-table tbody,
      .pricing-table tr,
      .pricing-table td {
        display: block;
        width: 100%;
      }

      .pricing-table tr {
        padding: 0.65rem 0.75rem;
        border-bottom: 1px solid rgba(31,74,51,0.09);
      }

      .pricing-table tr:last-child {
        border-bottom: 0;
      }

      .pricing-table td {
        padding: 0.22rem 0;
        border-bottom: 0;
      }

      .pricing-table td::before {
        content: attr(data-label);
        display: block;
        margin-bottom: 0.08rem;
        color: var(--verde-escuro);
        font-size: 0.6rem;
        font-weight: 800;
        letter-spacing: 0.06em;
        text-transform: uppercase;
      }
    }

    .coupon-admin-panel {
      display: grid;
      gap: 0.9rem;
      min-width: 0;
    }

    .coupon-admin-head {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 0.9rem;
      padding-bottom: 0.75rem;
      border-bottom: 1px solid rgba(31,74,51,0.08);
    }

    .coupon-admin-head strong {
      display: block;
      color: var(--verde-escuro);
      font-size: 0.92rem;
      font-weight: 700;
      letter-spacing: -0.01em;
    }

    .coupon-admin-head span {
      display: block;
      margin-top: 0.22rem;
      color: var(--texto-suave);
      font-size: 0.74rem;
      line-height: 1.45;
    }

    .coupon-admin-badge {
      flex: 0 0 auto;
      border-radius: 999px;
      padding: 0.35rem 0.58rem;
      background: rgba(183,154,86,0.13);
      color: #6b5524;
      font-size: 0.58rem;
      font-weight: 800;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }

    .coupon-admin-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0.65rem;
      min-width: 0;
    }

    .coupon-admin-field {
      display: grid;
      gap: 0.28rem;
      min-width: 0;
      padding: 0.62rem;
      border: 1px solid rgba(31,74,51,0.08);
      border-radius: 14px;
      background: rgba(255,255,255,0.72);
    }

    .coupon-admin-field.wide { grid-column: 1 / -1; }
    .coupon-admin-field.full { grid-column: 1 / -1; }

    .coupon-admin-field label {
      color: var(--texto-suave);
      font-size: 0.62rem;
      font-weight: 700;
      letter-spacing: 0.07em;
      text-transform: uppercase;
    }

    .coupon-admin-field input,
    .coupon-admin-field select {
      min-height: 38px !important;
      width: 100% !important;
      min-width: 0 !important;
      border: 0 !important;
      border-radius: 10px !important;
      background: rgba(248,251,246,0.92) !important;
      padding: 0.52rem 0.62rem !important;
      font-size: 0.8rem !important;
      box-shadow: inset 0 0 0 1px rgba(31,74,51,0.08) !important;
    }

    .coupon-admin-code-row,
    .coupon-admin-expiry-row {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 0.45rem;
      align-items: center;
      min-width: 0;
    }

    .coupon-admin-expiry-row {
      grid-template-columns: minmax(0, 1fr) 112px;
    }

    body.studio-visual-mode .visual-editor-col .coupon-admin-grid {
      grid-template-columns: 1fr;
    }

    body.studio-visual-mode .visual-editor-col .coupon-admin-field,
    body.studio-visual-mode .visual-editor-col .coupon-admin-field.wide,
    body.studio-visual-mode .visual-editor-col .coupon-admin-field.full {
      grid-column: 1 / -1;
    }

    body.studio-visual-mode .visual-editor-col .coupon-admin-code-row,
    body.studio-visual-mode .visual-editor-col .coupon-admin-expiry-row {
      grid-template-columns: 1fr;
    }

    body.studio-visual-mode .visual-editor-col .coupon-admin-code-row button,
    body.studio-visual-mode .visual-editor-col .coupon-admin-expiry-row select {
      width: 100%;
    }

    .coupon-admin-actions {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 0.7rem;
      flex-wrap: wrap;
      padding-top: 0.2rem;
    }

    .coupon-admin-actions-main {
      display: flex;
      gap: 0.5rem;
      flex-wrap: wrap;
    }

    #admin-coupon-status {
      margin: 0 !important;
      flex: 1 1 220px;
      min-height: 0;
      font-size: 0.74rem;
    }

    #admin-coupon-list {
      display: grid;
      gap: 0.55rem;
      margin-top: 0.1rem;
    }

    .coupon-admin-list-title {
      margin-top: 0.45rem;
      color: var(--texto-suave);
      font-size: 0.62rem;
      font-weight: 800;
      letter-spacing: 0.09em;
      text-transform: uppercase;
    }

    .coupon-admin-item {
      display: grid;
      gap: 0.45rem;
      padding: 0.72rem 0.78rem;
      border: 1px solid rgba(31,74,51,0.08);
      border-radius: 14px;
      background: rgba(255,255,255,0.72);
      box-shadow: none;
    }

    .coupon-admin-item-top {
      display: flex;
      justify-content: space-between;
      gap: 0.7rem;
      align-items: center;
    }

    .coupon-admin-code {
      color: var(--verde-escuro);
      font-size: 0.9rem;
      font-weight: 800;
      letter-spacing: 0.02em;
    }

    .coupon-admin-desc {
      color: var(--texto-suave);
      font-size: 0.72rem;
      line-height: 1.4;
    }

    .coupon-admin-tags {
      display: flex;
      flex-wrap: wrap;
      gap: 0.35rem;
    }

    .coupon-admin-tag {
      border-radius: 999px;
      padding: 0.26rem 0.48rem;
      background: rgba(31,74,51,0.06);
      color: #294735;
      font-size: 0.62rem;
      font-weight: 700;
    }

    .coupon-admin-delete {
      margin-left: auto;
      flex-shrink: 0;
      width: 26px;
      height: 26px;
      border-radius: 50%;
      border: 1px solid rgba(180,40,40,0.18);
      background: rgba(220,50,50,0.06);
      color: #b42828;
      font-size: 0.78rem;
      font-weight: 700;
      cursor: pointer;
      display: grid;
      place-items: center;
      transition: background 0.15s, border-color 0.15s;
      line-height: 1;
    }
    .coupon-admin-delete:hover {
      background: rgba(220,50,50,0.14);
      border-color: rgba(180,40,40,0.38);
    }

    @media (max-width: 820px) {
      .github-admin-section {
        padding: 0.78rem;
      }
      .github-admin-section-head {
        display: grid;
        justify-content: stretch;
      }
      .github-admin-section-kicker {
        justify-self: start;
      }
      .coupon-admin-grid {
        grid-template-columns: 1fr;
      }
      .coupon-admin-field,
      .coupon-admin-field.wide,
      .coupon-admin-field.full {
        grid-column: 1 / -1;
      }
      .coupon-admin-head {
        display: grid;
      }
      .coupon-admin-actions {
        align-items: stretch;
      }
      .coupon-admin-actions-main,
      .coupon-admin-actions-main button {
        width: 100%;
      }
    }

    /* ── Ajuste final do desktop estreito: vence camadas posteriores sem acionar mobile. ── */
    @media (max-width: 900px) and (hover: hover) and (pointer: fine) {
      html,
      body,
      body.studio-visual-mode,
      body.studio-visual-mode.sidebar-collapsed {
        min-width: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
      }

      .header,
      .config-bar,
      .publish-warning,
      .painel-shell,
      body.sidebar-collapsed .header,
      body.sidebar-collapsed .config-bar,
      body.sidebar-collapsed .publish-warning,
      body.sidebar-collapsed .painel-shell,
      body.studio-visual-mode .header,
      body.studio-visual-mode .painel-shell,
      body.studio-visual-mode.sidebar-collapsed .header,
      body.studio-visual-mode.sidebar-collapsed .painel-shell {
        width: calc(100vw - var(--studio-sidebar-w)) !important;
        min-width: 0 !important;
        max-width: calc(100vw - var(--studio-sidebar-w)) !important;
        margin-left: var(--studio-sidebar-w) !important;
      }

      .header {
        padding-inline: 0.55rem !important;
      }

      .header-actions {
        width: auto !important;
        min-width: 0 !important;
        justify-content: flex-end !important;
        overflow: hidden !important;
      }

      .btn-publicar {
        flex: 0 1 auto !important;
        max-width: calc(100vw - var(--studio-sidebar-w) - 84px) !important;
      }

      .abas-nav,
      body.sidebar-collapsed .abas-nav {
        inset: 0 auto 0 0 !important;
        width: var(--studio-sidebar-w) !important;
        min-width: var(--studio-sidebar-w) !important;
        height: 100vh !important;
        flex-direction: column !important;
      }

      .studio-mode-label,
      .studio-mode-help,
      .nav-label,
      .submenu-caret,
      .studio-mode-panel,
      .contratacoes-sidebar-title,
      .contratacao-btn small,
      .contratacoes-status {
        display: none !important;
      }

      .header-copy,
      .header-repo-widget {
        display: grid !important;
      }

      .header-repo-widget {
        min-width: 0 !important;
      }

      .contratacoes-sidebar {
        display: grid !important;
        margin-top: auto !important;
      }

      .aba-nav-btn,
      .aba-nav-btn.has-submenu,
      body.sidebar-collapsed .aba-nav-btn,
      body.sidebar-collapsed .aba-nav-btn.has-submenu {
        display: grid !important;
        grid-template-columns: 1fr !important;
        place-items: center !important;
        min-height: 50px !important;
        padding: 0.5rem 0 !important;
      }

      .nav-ico {
        width: 26px !important;
        height: 26px !important;
        margin: 0 !important;
      }

      .nav-submenu,
      .nav-submenu.aberto,
      body.sidebar-collapsed .nav-submenu,
      body.sidebar-collapsed .nav-submenu.aberto {
        position: fixed !important;
        left: calc(var(--studio-sidebar-w) + 8px) !important;
        right: auto !important;
        width: 232px !important;
        min-width: 232px !important;
        max-width: calc(100vw - var(--studio-sidebar-w) - 16px) !important;
        margin: 0 !important;
        padding: 0.5rem !important;
        overflow: auto !important;
        border-left: 0 !important;
        border: 1px solid var(--studio-border) !important;
        border-radius: 16px !important;
        background: rgba(247,251,245,0.99) !important;
        box-shadow: 0 22px 58px rgba(16,38,26,0.24) !important;
        z-index: 520 !important;
      }

      .nav-submenu.aberto,
      .nav-submenu.desktop-compact-open,
      body.sidebar-collapsed .nav-submenu.aberto {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
      }

      .nav-submenu .nav-sub-btn {
        min-height: 38px !important;
        padding: 0.62rem 0.7rem !important;
        font-size: 0.68rem !important;
        border-radius: 10px !important;
      }

      .desktop-compact-subnav-panel {
        position: fixed !important;
        left: calc(var(--studio-sidebar-w) + 8px);
        z-index: 900 !important;
        display: none;
        width: min(260px, calc(100vw - var(--studio-sidebar-w) - 18px));
        max-height: min(72vh, 560px);
        overflow: auto;
        padding: 0.55rem;
        border: 1px solid var(--studio-border);
        border-radius: 16px;
        background: rgba(247,251,245,0.99);
        box-shadow: 0 24px 70px rgba(16,38,26,0.28);
        backdrop-filter: blur(16px);
      }

      .desktop-compact-subnav-panel.aberto {
        display: block !important;
      }

      .desktop-compact-subnav-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.7rem;
        padding: 0.12rem 0.12rem 0.5rem;
        color: var(--verde-escuro);
        font-size: 0.66rem;
        font-weight: 900;
        letter-spacing: 0.09em;
        text-transform: uppercase;
      }

      .desktop-compact-subnav-close {
        width: 30px;
        height: 30px;
        min-height: 30px;
        display: grid;
        place-items: center;
        border: 1px solid rgba(31,74,51,0.12);
        border-radius: 999px;
        background: rgba(255,255,255,0.78);
        color: var(--verde-escuro);
        font-size: 0.95rem;
        line-height: 1;
      }

      .desktop-compact-subnav-list {
        display: grid;
        gap: 0.34rem;
      }

      .desktop-compact-subnav-item {
        width: 100%;
        min-height: 38px;
        border: 1px solid rgba(31,74,51,0.08);
        border-radius: 10px;
        background: rgba(31,74,51,0.045);
        color: var(--verde-escuro);
        padding: 0.58rem 0.68rem;
        text-align: left;
        font-size: 0.68rem;
        font-weight: 800;
      }

      .desktop-compact-subnav-item.ativa,
      .desktop-compact-subnav-item:hover {
        background: rgba(31,74,51,0.12);
        border-color: rgba(31,74,51,0.18);
      }

      .desktop-compact-subnav-section-title {
        padding: 0.4rem 0.2rem 0.05rem;
        color: var(--studio-text-soft);
        font-size: 0.55rem;
        font-weight: 900;
        letter-spacing: 0.11em;
        text-transform: uppercase;
      }

      body.studio-visual-mode #aba-visual,
      body.studio-visual-mode.sidebar-collapsed #aba-visual,
      body.studio-visual-mode .visual-workspace,
      body.studio-visual-mode.sidebar-collapsed .visual-workspace,
      .visual-workspace {
        width: calc(100vw - var(--studio-sidebar-w)) !important;
        min-width: 0 !important;
        max-width: calc(100vw - var(--studio-sidebar-w)) !important;
      }

      body.studio-visual-mode .visual-live-col,
      body.studio-visual-mode.sidebar-collapsed .visual-live-col,
      .visual-live-col,
      body.sidebar-collapsed .visual-live-col {
        width: calc(100vw - var(--studio-sidebar-w)) !important;
        min-width: 0 !important;
        max-width: calc(100vw - var(--studio-sidebar-w)) !important;
        padding: 1rem 0.7rem !important;
      }
    }

/* ── CAMADA FINAL: APP MAIS COMPACTO E OPERACIONAL ── */
body {
  background: #f4f6f2 !important;
  font-size: 0.86rem !important;
  letter-spacing: 0 !important;
}

.header {
  min-height: 52px !important;
  padding-top: 0.48rem !important;
  padding-bottom: 0.48rem !important;
  background: rgba(255,255,252,0.97) !important;
}

.btn-publicar,
.btn-gerar-boletim,
.btn-secundario,
.btn-aplicar-tema,
.btn-add-aviso,
.btn-add-aniv,
.btn-add-liturgia,
.btn-duplicar-aviso,
.btn-programacao-add,
.auth-provider,
.auth-secondary-btn,
.auth-submit-btn {
  min-height: 34px !important;
  border-radius: 7px !important;
  padding: 0.48rem 0.72rem !important;
  font-size: 0.76rem !important;
  font-weight: 750 !important;
  line-height: 1.15 !important;
  box-shadow: none !important;
  letter-spacing: 0 !important;
}

.btn-publicar,
.auth-submit-btn {
  background: var(--verde) !important;
  color: #fff !important;
  border: 1px solid rgba(31,74,51,0.24) !important;
}

.btn-publicar:hover,
.auth-submit-btn:hover {
  background: var(--verde2) !important;
  transform: none !important;
}

.btn-secundario,
.btn-gerar-boletim,
.btn-add-aviso,
.btn-add-aniv,
.btn-add-liturgia,
.btn-duplicar-aviso,
.btn-programacao-add,
.auth-provider,
.auth-secondary-btn {
  background: rgba(255,255,255,0.84) !important;
  border: 1px solid rgba(31,74,51,0.13) !important;
  color: var(--verde-escuro) !important;
}

.btn-secundario:hover,
.btn-gerar-boletim:hover,
.btn-add-aviso:hover,
.btn-add-aniv:hover,
.btn-add-liturgia:hover,
.btn-duplicar-aviso:hover,
.btn-programacao-add:hover,
.auth-provider:hover,
.auth-secondary-btn:hover {
  background: rgba(31,74,51,0.07) !important;
  transform: none !important;
}

.btn-remover-aviso,
.btn-remover-aniv,
.btn-remover-liturgia,
.btn-programacao-mini.remover,
.account-danger-btn {
  color: #9b1c1c !important;
  border-color: rgba(155,28,28,0.18) !important;
  background: rgba(255,248,248,0.9) !important;
}

.abas-nav {
  background: #fbfcf8 !important;
  border-right: 1px solid rgba(31,74,51,0.10) !important;
  box-shadow: 3px 0 14px rgba(16,38,26,0.04) !important;
}

.studio-sidebar-brand {
  padding-bottom: 0.5rem !important;
  margin-bottom: 0.3rem !important;
  border-bottom: 1px solid rgba(31,74,51,0.08) !important;
}

.aba-nav-btn {
  min-height: 34px !important;
  border-radius: 7px !important;
  padding: 0.48rem 0.55rem !important;
  font-size: 0.68rem !important;
  font-weight: 720 !important;
  letter-spacing: 0 !important;
  color: #48544e !important;
}

.aba-nav-btn:hover,
.aba-nav-btn.ativa,
.aba-nav-btn.submenu-aberto {
  background: rgba(31,74,51,0.075) !important;
  color: var(--verde-escuro) !important;
  border-color: rgba(31,74,51,0.18) !important;
}

.nav-submenu {
  padding: 0.2rem 0 0.32rem 0.35rem !important;
}

.nav-sub-btn {
  min-height: 30px !important;
  border-radius: 6px !important;
  padding: 0.38rem 0.5rem !important;
  font-size: 0.64rem !important;
  font-weight: 690 !important;
  color: #53605a !important;
  background: transparent !important;
  border: 1px solid transparent !important;
}

.nav-sub-btn:hover,
.nav-sub-btn.ativa {
  background: rgba(31,74,51,0.065) !important;
  border-color: rgba(31,74,51,0.10) !important;
  color: var(--verde-escuro) !important;
}

.contratacoes-sidebar {
  padding: 0.55rem 0.45rem 0.6rem !important;
  gap: 0.35rem !important;
}

.contratacao-btn {
  min-height: 42px !important;
  border-radius: 7px !important;
  padding: 0.45rem 0.52rem !important;
  box-shadow: none !important;
}

.contratacao-btn span {
  font-size: 0.68rem !important;
}

.contratacao-btn small {
  font-size: 0.58rem !important;
  line-height: 1.25 !important;
}

.studio-sidebar-utility {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.35rem;
  margin-top: auto;
  padding: 0.55rem 0.45rem 0;
  border-top: 1px solid rgba(31,74,51,0.08);
}

.studio-sync-indicator,
.studio-cart-toggle {
  min-width: 0;
  height: 38px;
  border: 1px solid rgba(31,74,51,0.1);
  border-radius: 7px;
  background: rgba(252,252,248,0.78);
  color: var(--verde-escuro);
  box-shadow: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.32rem;
  padding: 0 0.45rem;
  font-size: 0.62rem;
  font-weight: 800;
  cursor: pointer;
  transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease;
}

.studio-sync-indicator {
  cursor: pointer;
}

.studio-sync-indicator:hover {
  background: rgba(31,74,51,0.07);
  border-color: rgba(183,154,86,0.36);
}

.studio-sync-indicator svg,
.studio-cart-toggle svg {
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
  fill: currentColor;
}

.studio-cart-toggle:hover,
.studio-cart-toggle.is-open {
  background: rgba(31,74,51,0.07);
  border-color: rgba(183,154,86,0.36);
}

.studio-sync-indicator.is-syncing {
  color: #6f746d;
}

.studio-sync-indicator.is-syncing svg {
  animation: studioSyncSpin 0.9s linear infinite;
}

.visual-live-frame {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.18s ease;
}

.visual-live-frame.is-active {
  z-index: 1;
  opacity: 1;
  pointer-events: auto;
}

.visual-live-frame.is-buffer {
  z-index: 0;
  opacity: 0;
  pointer-events: none;
}

.studio-sync-indicator.is-saved {
  color: #285c3d;
}

.studio-sync-indicator.is-error {
  color: #a33b2f;
}

.contratacoes-sidebar.contratacoes-collapsed {
  display: none !important;
}

.abas-nav .contratacoes-sidebar,
body.sidebar-collapsed .contratacoes-sidebar {
  margin-top: 0 !important;
}

body.studio-dark .studio-sidebar-utility {
  border-top-color: rgba(255,255,255,0.08);
}

body.studio-dark .studio-sync-indicator,
body.studio-dark .studio-cart-toggle {
  border-color: rgba(255,255,255,0.1);
  background: rgba(255,255,255,0.06);
  color: #f4f8f5;
}

body.sidebar-collapsed .studio-sidebar-utility,
.abas-nav.colapsada .studio-sidebar-utility {
  grid-template-columns: 1fr;
  padding-inline: 0.35rem;
}

body.sidebar-collapsed .studio-sync-indicator span,
body.sidebar-collapsed .studio-cart-toggle span,
.abas-nav.colapsada .studio-sync-indicator span,
.abas-nav.colapsada .studio-cart-toggle span {
  display: none;
}

@keyframes studioSyncSpin {
  to { transform: rotate(360deg); }
}

.painel-shell {
  padding-top: 0.9rem !important;
  padding-inline: 1rem !important;
  max-width: 1240px !important;
}

.painel-meta {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0.55rem !important;
  margin-bottom: 0.75rem !important;
}

.meta-card,
.aba-intro,
.studio-panel-card,
.aviso-card,
.programacao-dia-card,
.liturgia-item-card,
.simbolo-item-card,
.github-publication-item,
.studio-info-block {
  border-radius: 8px !important;
  border: 1px solid rgba(31,74,51,0.10) !important;
  box-shadow: none !important;
  background: rgba(255,255,252,0.82) !important;
}

.meta-card {
  padding: 0.58rem 0.68rem !important;
  gap: 0.18rem !important;
}

.meta-card strong,
.studio-panel-title,
.studio-info-block strong {
  font-family: var(--font-ui) !important;
  font-size: 0.72rem !important;
  font-weight: 820 !important;
  letter-spacing: 0 !important;
  color: var(--verde-escuro) !important;
}

.meta-card span,
.aba-intro p,
.studio-info-block p,
.config-status,
.dica {
  font-size: 0.7rem !important;
  line-height: 1.42 !important;
  color: #65716b !important;
}

.aba-intro {
  padding: 0.72rem 0.85rem !important;
  margin-bottom: 0.75rem !important;
}

.aba-intro strong {
  font-family: var(--font-ui) !important;
  font-size: 0.72rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--verde-escuro) !important;
}

.secao-titulo {
  margin: 1.05rem 0 0.55rem !important;
  padding: 0 0 0.38rem !important;
  border-bottom: 1px solid rgba(31,74,51,0.10) !important;
  font-family: var(--font-ui) !important;
  font-size: 0.78rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  color: var(--verde-escuro) !important;
}

.campo {
  margin-bottom: 0.72rem !important;
}

.campo label {
  margin-bottom: 0.28rem !important;
  font-size: 0.68rem !important;
  font-weight: 780 !important;
  letter-spacing: 0.02em !important;
  color: var(--verde-escuro) !important;
}

.campo input[type="text"],
.campo input[type="email"],
.campo input[type="password"],
.campo textarea,
.campo select,
.profile-popover input,
.auth-form input {
  min-height: 34px !important;
  border-radius: 7px !important;
  padding: 0.48rem 0.62rem !important;
  font-size: 0.76rem !important;
  background: rgba(255,255,255,0.88) !important;
  border: 1px solid rgba(31,74,51,0.13) !important;
  box-shadow: none !important;
}

.campo textarea {
  min-height: 84px !important;
  line-height: 1.5 !important;
}

.campo textarea.grande {
  min-height: 140px !important;
}

.campo input:focus,
.campo textarea:focus,
.campo select:focus,
.profile-popover input:focus,
.auth-form input:focus {
  border-color: rgba(31,74,51,0.42) !important;
  box-shadow: 0 0 0 3px rgba(31,74,51,0.07) !important;
  outline: none !important;
}

.publish-warning {
  border-radius: 8px !important;
  padding: 0.66rem 0.82rem !important;
  background: rgba(255,255,252,0.86) !important;
  box-shadow: none !important;
}

.pricing-table-wrap {
  border-radius: 7px !important;
}

.pricing-table th,
.pricing-table td {
  padding: 0.55rem 0.62rem !important;
  font-size: 0.7rem !important;
}

.profile-popover {
  border-radius: 8px !important;
  box-shadow: 0 14px 34px rgba(16,38,26,0.16) !important;
}

@media (max-width: 900px) {
  .painel-meta {
    grid-template-columns: 1fr !important;
  }

  .painel-shell {
    padding-inline: 0.75rem !important;
  }
}

/* ── Meia tela no PC: barra lateral só com ícones no rodapé ── */
@media (max-width: 900px) and (hover: hover) and (pointer: fine) {
  .studio-sidebar-utility,
  body.sidebar-collapsed .studio-sidebar-utility,
  .abas-nav.colapsada .studio-sidebar-utility {
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    gap: 0.34rem !important;
    padding: 0.52rem 0.35rem 0.4rem !important;
  }

  .studio-sync-indicator,
  .studio-cart-toggle,
  body.sidebar-collapsed .studio-sync-indicator,
  body.sidebar-collapsed .studio-cart-toggle,
  .abas-nav.colapsada .studio-sync-indicator,
  .abas-nav.colapsada .studio-cart-toggle {
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    height: 42px !important;
    padding: 0 !important;
    gap: 0 !important;
    border-radius: 10px !important;
    display: grid !important;
    place-items: center !important;
    overflow: hidden !important;
  }

  .studio-sync-indicator span,
  .studio-cart-toggle span,
  body.sidebar-collapsed .studio-sync-indicator span,
  body.sidebar-collapsed .studio-cart-toggle span,
  .abas-nav.colapsada .studio-sync-indicator span,
  .abas-nav.colapsada .studio-cart-toggle span {
    display: none !important;
  }

  .studio-sync-indicator svg,
  .studio-cart-toggle svg {
    width: 19px !important;
    height: 19px !important;
    flex-basis: 19px !important;
  }

  body.studio-visual-mode .visual-live-col,
  body.studio-visual-mode.sidebar-collapsed .visual-live-col,
  .visual-live-col,
  body.sidebar-collapsed .visual-live-col {
    min-height: calc(100vh - 52px) !important;
    padding: 0.72rem 0.6rem 1rem !important;
  }

  .visual-live-frame-wrap[data-device="phone"] {
    --preview-scale: 0.64;
    width: calc(var(--preview-width) * var(--preview-scale)) !important;
    height: calc(var(--preview-height) * var(--preview-scale)) !important;
    min-height: 0 !important;
  }
}

@media (max-width: 900px) and (max-height: 700px) and (hover: hover) and (pointer: fine) {
  .visual-live-frame-wrap[data-device="phone"] {
    --preview-scale: 0.58;
  }
}

@media (max-width: 900px) and (max-height: 620px) and (hover: hover) and (pointer: fine) {
  .visual-live-frame-wrap[data-device="phone"] {
    --preview-scale: 0.54;
  }
}

/* ── Lista flutuante de seções quando a barra lateral está compacta/recolhida ── */
.desktop-compact-subnav-panel {
  position: fixed !important;
  left: calc(var(--studio-sidebar-collapsed-w, 74px) + 8px);
  z-index: 1200 !important;
  display: none;
  width: min(260px, calc(100vw - var(--studio-sidebar-collapsed-w, 74px) - 18px));
  max-height: min(72vh, 560px);
  overflow: auto;
  padding: 0.55rem;
  border: 1px solid var(--studio-border);
  border-radius: 16px;
  background: rgba(247,251,245,0.99);
  box-shadow: 0 24px 70px rgba(16,38,26,0.28);
  backdrop-filter: blur(16px);
}

.desktop-compact-subnav-panel.aberto {
  display: block !important;
}

.desktop-compact-subnav-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.7rem;
  padding: 0.12rem 0.12rem 0.5rem;
  color: var(--verde-escuro);
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.desktop-compact-subnav-close {
  width: 30px;
  height: 30px;
  min-height: 30px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(31,74,51,0.12);
  border-radius: 999px;
  background: rgba(255,255,255,0.78);
  color: var(--verde-escuro);
  font-size: 0.95rem;
  line-height: 1;
  cursor: pointer;
}

.desktop-compact-subnav-list {
  display: grid;
  gap: 0.34rem;
}

.desktop-compact-subnav-item {
  width: 100%;
  min-height: 38px;
  border: 1px solid rgba(31,74,51,0.08);
  border-radius: 10px;
  background: rgba(31,74,51,0.045);
  color: var(--verde-escuro);
  padding: 0.58rem 0.68rem;
  text-align: left;
  font-size: 0.68rem;
  font-weight: 800;
  font-family: var(--font-ui);
  cursor: pointer;
}

.desktop-compact-subnav-item.ativa,
.desktop-compact-subnav-item:hover {
  background: rgba(31,74,51,0.12);
  border-color: rgba(31,74,51,0.18);
}

.desktop-compact-subnav-section-title {
  padding: 0.4rem 0.2rem 0.05rem;
  color: var(--studio-text-soft);
  font-size: 0.55rem;
  font-weight: 900;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}