/* Shell unificado OPK CRYPTER — layout estilo painel, identidade Matrix */
:root{
  --shell-sidebar:240px;
  --shell-top:0px;
  --opk-scroll-thumb:rgba(0,255,136,.28);
  --opk-scroll-thumb-hover:rgba(0,255,136,.46);
  --opk-scroll-track:rgba(4,8,6,.92);
}
html{color-scheme:dark}

/*
  View Transitions CROSS-DOCUMENT DESLIGADAS.
  Com lateral montada em JS, o VT capturava a página nova SEM #shell-sidebar
  e a barra inteira “sumia” no clique. Prefetch + placeholder CSS bastam.
*/
@view-transition {
  navigation: none;
}
html:not([data-opk-brand-sync="1"]) #shell-sidebar .shell-brand .brand-mark:not(:has(.shell-brand-logo)) svg{opacity:0}
html:not([data-opk-brand-sync="1"]) #shell-sidebar .shell-brand-title,
html:not([data-opk-brand-sync="1"]) #shell-sidebar .shell-brand-tag{opacity:0}
#shell-sidebar .shell-brand .brand-mark .shell-brand-logo{
  opacity:1 !important;visibility:visible !important;
}
/*


  Lateral SEMPRE reservada (mesmo tamanho antes e depois do JS).
  Assim Config/Encrypt não começam “miúdos” e depois esticam.
*/
body[data-page]{
  padding-left:var(--shell-sidebar);
  box-sizing:border-box;
}
/*
  Faixa placeholder até a lateral estar PRONTA (data-opk-ready).
  Se tirar no #shell-sidebar vazio, a barra some um frame → “some na 1ª entrada”.
*/
body[data-page]:not(:has(#shell-sidebar[data-opk-ready="1"]))::before{
  content:"";
  position:fixed;
  left:0;top:0;bottom:0;
  width:var(--shell-sidebar);
  z-index:3;
  background:linear-gradient(180deg,#060a08 0%,#040605 100%);
  border-right:1px solid rgba(0,255,136,.14);
  pointer-events:none;
}
@media (max-width:980px){
  body[data-page]{padding-left:0}
  body[data-page]::before{display:none !important}
}

body[data-page] .layout{
  max-width:none !important;
  width:100%;
  margin-left:0 !important;
  margin-right:0 !important;
  box-sizing:border-box;
}

.shell-layout{
  position:relative;z-index:2;
  display:block;
  min-height:100vh;
  width:100%;
}

#shell-sidebar,
.shell-sidebar{
  width:var(--shell-sidebar);
  position:fixed;left:0;top:0;
  height:100vh;
  height:100dvh;
  display:flex;flex-direction:column;
  background:linear-gradient(180deg,#060a08 0%,#040605 100%);
  border-right:1px solid var(--line);
  overflow:hidden;
  overflow-anchor:none;
  z-index:4;
  /* fixed no body — não depende de .shell-layout existir */
}
#shell-sidebar::-webkit-scrollbar,
.shell-sidebar::-webkit-scrollbar{width:8px;height:8px}
#shell-sidebar::-webkit-scrollbar-button,
.shell-sidebar::-webkit-scrollbar-button{width:0;height:0;display:none}
#shell-sidebar::-webkit-scrollbar-track,
.shell-sidebar::-webkit-scrollbar-track{
  background:var(--opk-scroll-track) !important;
  border-left:1px solid rgba(0,255,136,.06);
}
#shell-sidebar::-webkit-scrollbar-thumb,
.shell-sidebar::-webkit-scrollbar-thumb{
  background:var(--opk-scroll-thumb) !important;
  border-radius:999px;
  border:2px solid var(--opk-scroll-track);
  background-clip:padding-box;
  min-height:40px;
}
#shell-sidebar::-webkit-scrollbar-thumb:hover,
.shell-sidebar::-webkit-scrollbar-thumb:hover{background:var(--opk-scroll-thumb-hover) !important}
#shell-sidebar::-webkit-scrollbar-corner,
.shell-sidebar::-webkit-scrollbar-corner{background:var(--opk-scroll-track)}

/* Scroll da página (barra à direita do conteúdo) */
html,
body[data-page]{
  scrollbar-width:thin;
  scrollbar-color:var(--opk-scroll-thumb) var(--opk-scroll-track);
}
/* Preview celular: iframe não herda scroll verde grosso do painel */
body[data-page] .phone-frame--editor-preview,
body[data-page] .phone-frame--editor-preview iframe,
body[data-page] .preview-live-wrap{
  scrollbar-width:none !important;
  scrollbar-color:transparent transparent !important;
}
body[data-page] .phone-frame--editor-preview::-webkit-scrollbar,
body[data-page] .phone-frame--editor-preview iframe::-webkit-scrollbar,
body[data-page] .preview-live-wrap::-webkit-scrollbar{
  width:0 !important;
  height:0 !important;
  display:none !important;
}
html::-webkit-scrollbar,
body[data-page]::-webkit-scrollbar{width:8px;height:8px}
html::-webkit-scrollbar-button,
body[data-page]::-webkit-scrollbar-button{display:none;width:0;height:0}
html::-webkit-scrollbar-track,
body[data-page]::-webkit-scrollbar-track{background:var(--opk-scroll-track)}
html::-webkit-scrollbar-thumb,
body[data-page]::-webkit-scrollbar-thumb{
  background:var(--opk-scroll-thumb);
  border-radius:999px;
  border:2px solid var(--opk-scroll-track);
  background-clip:padding-box;
}
html::-webkit-scrollbar-thumb:hover,
body[data-page]::-webkit-scrollbar-thumb:hover{background:var(--opk-scroll-thumb-hover)}

/* Scroll tema Matrix — admin (tabela horizontal/vertical), listas, modais */
.table-wrap,
.opk-pick-menu,
.modal-bg,
#modalBody,
.modal-scroll,
.shell-main,
.id-hist-list,
.log-stream,
.job-logs,
pre.log,
.admin-table-wrap{
  scrollbar-width:thin;
  scrollbar-color:rgba(0,255,136,.3) rgba(4,8,6,.75);
}
.table-wrap::-webkit-scrollbar,
.opk-pick-menu::-webkit-scrollbar,
.modal-bg::-webkit-scrollbar,
#modalBody::-webkit-scrollbar,
.modal-scroll::-webkit-scrollbar,
.shell-main::-webkit-scrollbar,
.id-hist-list::-webkit-scrollbar,
.log-stream::-webkit-scrollbar,
.job-logs::-webkit-scrollbar,
pre.log::-webkit-scrollbar,
.admin-table-wrap::-webkit-scrollbar{
  width:7px;
  height:7px;
}
.table-wrap::-webkit-scrollbar-track,
.opk-pick-menu::-webkit-scrollbar-track,
.modal-bg::-webkit-scrollbar-track,
#modalBody::-webkit-scrollbar-track,
.modal-scroll::-webkit-scrollbar-track,
.shell-main::-webkit-scrollbar-track,
.id-hist-list::-webkit-scrollbar-track,
.log-stream::-webkit-scrollbar-track,
.job-logs::-webkit-scrollbar-track,
pre.log::-webkit-scrollbar-track,
.admin-table-wrap::-webkit-scrollbar-track{
  background:rgba(4,8,6,.88);
}
.table-wrap::-webkit-scrollbar-thumb,
.opk-pick-menu::-webkit-scrollbar-thumb,
.modal-bg::-webkit-scrollbar-thumb,
#modalBody::-webkit-scrollbar-thumb,
.modal-scroll::-webkit-scrollbar-thumb,
.shell-main::-webkit-scrollbar-thumb,
.id-hist-list::-webkit-scrollbar-thumb,
.log-stream::-webkit-scrollbar-thumb,
.job-logs::-webkit-scrollbar-thumb,
pre.log::-webkit-scrollbar-thumb,
.admin-table-wrap::-webkit-scrollbar-thumb{
  background:rgba(0,255,136,.24);
  border-radius:999px;
  border:2px solid rgba(4,8,6,.88);
  background-clip:padding-box;
}
.table-wrap::-webkit-scrollbar-thumb:hover,
.opk-pick-menu::-webkit-scrollbar-thumb:hover,
.modal-bg::-webkit-scrollbar-thumb:hover,
#modalBody::-webkit-scrollbar-thumb:hover,
.modal-scroll::-webkit-scrollbar-thumb:hover,
.shell-main::-webkit-scrollbar-thumb:hover,
.id-hist-list::-webkit-scrollbar-thumb:hover,
.log-stream::-webkit-scrollbar-thumb:hover,
.job-logs::-webkit-scrollbar-thumb:hover,
pre.log::-webkit-scrollbar-thumb:hover,
.admin-table-wrap::-webkit-scrollbar-thumb:hover{
  background:rgba(0,255,136,.42);
}
.table-wrap::-webkit-scrollbar-corner,
.opk-pick-menu::-webkit-scrollbar-corner,
.shell-main::-webkit-scrollbar-corner,
.admin-table-wrap::-webkit-scrollbar-corner{
  background:rgba(4,8,6,.88);
}

.shell-brand{
  flex-shrink:0;
  display:flex;align-items:center;gap:11px;
  padding:18px 16px 14px;border-bottom:1px solid var(--line);
  text-decoration:none;color:inherit;
  box-sizing:border-box;width:100%;
}
.shell-brand-text{
  display:flex;flex-direction:column;justify-content:center;
  min-width:0;flex:1;min-height:36px;gap:3px;
}
.shell-brand .brand-mark,
.shell-brand #shellBrandMark{
  width:36px !important;height:36px !important;min-width:36px;min-height:36px;
  border-radius:11px;flex-shrink:0;box-sizing:border-box;
  display:grid !important;place-items:center;overflow:hidden;
  background:linear-gradient(155deg,rgba(0,255,136,.18),rgba(0,200,120,.05));
  border:1px solid var(--line-strong);
  box-shadow:0 0 28px -10px rgba(0,255,136,.65),inset 0 0 14px rgba(0,255,136,.08);
  color:var(--mx);
}
.shell-brand .brand-mark svg,
.shell-brand .brand-ico{
  width:22px !important;height:22px !important;display:block;
}
.shell-brand .brand-mark img,
.shell-brand #shellBrandMark img,
.shell-brand .shell-brand-logo,
#encryptTopBrandMark .shell-brand-logo,
#encryptTopBrandMark img.shell-brand-logo{
  width:100% !important;height:100% !important;object-fit:contain;display:block !important;
  visibility:visible !important;opacity:1 !important;
}
.shell-brand .shell-brand-title,
.shell-brand .brand-title{
  display:block;margin:0;padding:0;
  font-family:var(--mono) !important;font-size:13px !important;font-weight:700 !important;
  letter-spacing:.1em !important;line-height:1.2 !important;
  color:var(--txt) !important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.shell-brand .shell-brand-title span,
.shell-brand .brand-title span{color:var(--mx) !important}
.shell-brand .shell-brand-tag,
.shell-brand .brand-tag{
  display:inline-block !important;width:fit-content;max-width:100%;
  margin:0 !important;padding:2px 8px !important;
  font-family:var(--mono) !important;font-size:9.5px !important;font-weight:500 !important;
  letter-spacing:.08em !important;line-height:1.2 !important;
  color:var(--mx2) !important;background:rgba(0,255,136,.07) !important;
  border:1px solid var(--line) !important;border-radius:999px !important;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  box-sizing:border-box;
}

.shell-nav{
  flex:1;min-height:0;
  padding:12px 8px 16px;
  display:flex;flex-direction:column;gap:14px;
  overflow-y:auto;overflow-x:hidden;
  scroll-behavior:auto;
  scrollbar-width:thin;
  scrollbar-color:rgba(0,255,136,.3) rgba(4,8,6,.75);
}
.shell-nav::-webkit-scrollbar{width:8px;height:8px}
.shell-nav::-webkit-scrollbar-thumb{
  background:var(--opk-scroll-thumb) !important;
  border-radius:999px;border:2px solid var(--opk-scroll-track);
  background-clip:padding-box;
}
.shell-nav-label{
  padding:0 12px;margin-bottom:4px;
  font-size:10.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:#5D7067;font-family:var(--mono);
}
.shell-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:3px}
.shell-nav a{
  position:relative;display:flex;align-items:center;gap:11px;
  width:100%;box-sizing:border-box;
  min-height:38px;height:auto;padding:8px 11px 8px 12px;border-radius:9px;text-decoration:none;
  font-size:13.75px;font-weight:500;color:var(--muted);line-height:1.28;
  border:1px solid transparent;
  transition:background .15s,color .15s,border-color .15s;
}
.shell-nav a span{
  flex:1;min-width:0;
  letter-spacing:.02em;
}
.shell-nav a:hover{background:rgba(0,255,136,.05);color:var(--txt)}
.shell-nav a.active{
  background:var(--mx-dim);color:var(--txt);
  border:1px solid rgba(0,255,136,.14);
}
.shell-nav a.active::before{
  content:"";position:absolute;left:-8px;top:7px;bottom:7px;width:2px;
  border-radius:2px;background:var(--mx);
}
.shell-nav a svg{width:18px;height:18px;flex:none;opacity:.75}
.shell-nav a.active svg{opacity:1;color:var(--mx);stroke:var(--mx)}

.shell-side-foot{
  flex-shrink:0;margin-top:auto;
  padding:12px 14px max(16px, env(safe-area-inset-bottom, 0px));
  border-top:1px solid var(--line);
  display:flex;flex-direction:column;gap:8px;
}
.shell-lic{
  font-family:var(--mono);font-size:10.5px;line-height:1.45;color:var(--muted);
  padding:10px 11px;border-radius:10px;background:rgba(0,0,0,.28);
  border:1px solid var(--line);
}
.shell-lic b{display:block;color:var(--mx);font-size:11px;margin-bottom:3px;letter-spacing:.04em}
.shell-lic .shell-lic-role{
  display:block;margin:1px 0 5px;font-size:10.5px;letter-spacing:.06em;font-weight:600
}
.shell-lic-role--admin,.shell-lic-vital{color:var(--mx)}
.shell-lic-role--client,.shell-lic-timed{color:var(--warn)}
.shell-lic .warn{color:var(--warn)}
.shell-logout{
  width:100%;box-sizing:border-box;
  border:1px solid var(--line);background:transparent;color:var(--muted);
  border-radius:9px;padding:10px 12px;font-family:var(--mono);font-size:11px;cursor:pointer;
  line-height:1.35;
}
.shell-logout:hover{color:#ffb0b7;border-color:rgba(255,92,106,.35)}

.shell-main{
  width:100%;min-width:0;padding:16px 18px 56px;position:relative;
  box-sizing:border-box;
}
.shell-main > .admin-page,
.shell-main .admin-page,
.shell-main > .main,
.shell-main .main{
  max-width:none !important;
  width:100% !important;
  margin:0 !important;
  box-sizing:border-box;
}

/* Encrypt: mantém grid 2 colunas (form + preview) — NÃO forçar display:block */
.shell-main > main.layout,
body[data-page="encrypt"] .shell-main .layout{
  display:grid !important;
  grid-template-columns:minmax(0,1.28fr) minmax(280px,.92fr);
  gap:26px;
  align-items:start;
  max-width:none !important;
  width:100% !important;
  margin:0 !important;
  padding:8px 4px 68px !important;
  box-sizing:border-box;
}
body[data-page="encrypt"] .shell-main .preview-col{
  min-width:0;
  max-width:100%;
}
@media (max-width:1100px){
  .shell-main > main.layout,
  body[data-page="encrypt"] .shell-main .layout{
    grid-template-columns:minmax(0,1fr) minmax(260px,.85fr);
    gap:18px;
  }
}
@media (max-width:980px){
  .shell-main > main.layout,
  body[data-page="encrypt"] .shell-main .layout{
    grid-template-columns:1fr !important;
  }
  body[data-page="encrypt"] .shell-main .preview-col{
    position:relative;
    top:0;
  }
}

/*
  Telas / Pronto / Admin / etc: NUNCA herdar o grid 2 col do Encrypt.
  style.css antigo + .layout compartilhado = conteúdo miúdo + coluna vazia (e “pílula” estranha).
*/
body[data-page]:not([data-page="encrypt"]) .layout,
body[data-page]:not([data-page="encrypt"]) .shell-main .layout,
.shell-main .layout:has(#sidebar-root),
.shell-main .layout:has(> .main),
.shell-main > .layout:not(main){
  display:block !important;
  grid-template-columns:none !important;
  grid-template-rows:none !important;
  gap:0 !important;
  max-width:none !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box;
}
body[data-page]:not([data-page="encrypt"]) .shell-main .main,
.shell-main .layout > .main{
  display:block !important;
  width:100% !important;
  max-width:none !important;
  float:none !important;
}
.shell-main #sidebar-root,
.shell-main .sidebar,
.shell-main .sidebar-backdrop,
.shell-main .topbar{
  display:none !important;
  width:0 !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
  flex:0 0 0 !important;
}
.shell-topbar{
  display:none; /* mobile */
}

/* —— Boot / nav veil: bolinha verde + blur —— */
#opk-boot-veil{
  position:fixed;inset:0;z-index:99999;
  display:grid;place-items:center;
  pointer-events:none;
  opacity:0;visibility:hidden;
  transition:opacity .28s ease, visibility 0s linear .28s;
  background:rgba(2,8,5,.42);
  -webkit-backdrop-filter:blur(14px) saturate(1.25);
  backdrop-filter:blur(14px) saturate(1.25);
}
#opk-boot-veil.on{
  opacity:1;visibility:visible;pointer-events:all;
  transition:opacity .18s ease, visibility 0s;
}
#opk-boot-veil .opk-orb-wrap{
  position:relative;width:88px;height:88px;
  display:grid;place-items:center;
}
#opk-boot-veil .opk-orb-ring{
  position:absolute;inset:-10px;border-radius:50%;
  border:1px solid rgba(0,255,136,.22);
  box-shadow:0 0 40px rgba(0,255,136,.18), inset 0 0 24px rgba(0,255,136,.08);
  animation:opkOrbPulse 1.6s ease-in-out infinite;
}
#opk-boot-veil .opk-orb-ring2{
  position:absolute;inset:-22px;border-radius:50%;
  border:1px dashed rgba(0,255,136,.16);
  animation:opkOrbSpin 8s linear infinite;
}
#opk-boot-veil .opk-orb{
  width:52px;height:52px;border-radius:50%;
  background:
    radial-gradient(circle at 32% 28%, #b8ffe0 0%, #00ff88 38%, #00b86a 72%, #034028 100%);
  box-shadow:
    0 0 0 1px rgba(0,255,136,.55),
    0 0 28px rgba(0,255,136,.75),
    0 0 56px rgba(0,255,136,.35),
    inset 0 -8px 16px rgba(0,40,20,.35),
    inset 0 8px 12px rgba(255,255,255,.35);
  animation:opkOrbBreath 1.35s ease-in-out infinite;
}
#opk-boot-veil .opk-orb::after{
  content:"";position:absolute;inset:10px 12px auto auto;width:12px;height:8px;
  border-radius:50%;background:rgba(255,255,255,.55);filter:blur(1px);
  transform:rotate(-28deg);
}
#opk-boot-veil .opk-orb-label{
  position:absolute;top:calc(100% + 16px);left:50%;transform:translateX(-50%);
  font-family:var(--mono, ui-monospace, monospace);
  font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  color:rgba(0,255,136,.85);white-space:nowrap;
  text-shadow:0 0 12px rgba(0,255,136,.45);
}
@keyframes opkOrbBreath{
  0%,100%{ transform:scale(1); filter:brightness(1); }
  50%{ transform:scale(1.07); filter:brightness(1.15); }
}
@keyframes opkOrbPulse{
  0%,100%{ transform:scale(1); opacity:.85; }
  50%{ transform:scale(1.08); opacity:1; }
}
@keyframes opkOrbSpin{
  to{ transform:rotate(360deg); }
}
@media (prefers-reduced-motion: reduce){
  #opk-boot-veil .opk-orb,
  #opk-boot-veil .opk-orb-ring,
  #opk-boot-veil .opk-orb-ring2{ animation:none; }
}

.shell-page-head{
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
  align-items:flex-end;margin-bottom:18px;
}
.shell-kicker{
  margin:0;font-family:var(--mono);font-size:11px;letter-spacing:.12em;color:var(--mx2);text-transform:uppercase;
}
.shell-title{
  margin:4px 0 0;font-size:20px;font-family:var(--mono);letter-spacing:.04em;font-weight:700;
}
.shell-sub{margin:6px 0 0;color:var(--muted);font-size:12.5px;line-height:1.45;max-width:560px}

/* tiles dashboard */
.shell-metrics{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-bottom:18px;
}
.shell-metric{
  background:linear-gradient(170deg,var(--panel),var(--panel-2));
  border:1px solid var(--line);border-radius:14px;padding:14px 16px;
}
.shell-metric span{font-family:var(--mono);font-size:10.5px;color:var(--muted);letter-spacing:.06em}
.shell-metric b{display:block;margin-top:6px;font-size:22px;font-family:var(--mono);color:var(--mx)}

.shell-tiles{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;
}
.shell-tile{
  display:flex;flex-direction:column;gap:8px;text-decoration:none;color:inherit;
  background:linear-gradient(170deg,var(--panel),var(--panel-2));
  border:1px solid var(--line);border-radius:16px;padding:18px 16px;
  transition:border-color .15s, box-shadow .15s, transform .15s;
}
.shell-tile:hover{
  border-color:var(--line-strong);
  box-shadow:0 0 0 1px rgba(0,255,136,.06),0 20px 40px -28px rgba(0,0,0,.8);
  transform:translateY(-1px);
}
.shell-tile h3{
  margin:0;font-size:14px;font-family:var(--mono);letter-spacing:.04em;display:flex;
  align-items:center;justify-content:space-between;gap:8px;
}
.shell-tile p{margin:0;font-size:12.5px;color:var(--muted);line-height:1.5}
.shell-tile .tile-ic{
  width:36px;height:36px;border-radius:10px;display:grid;place-items:center;
  background:var(--mx-dim);border:1px solid var(--line-2);color:var(--mx);margin-bottom:4px;
}
.shell-tile .tile-ic svg{width:18px;height:18px}
.shell-tile.primary{border-color:var(--line-strong);background:
  radial-gradient(280px 120px at 10% 0%,rgba(0,255,136,.1),transparent 70%),
  linear-gradient(170deg,var(--panel),var(--panel-2));
}

.shell-menu-btn{
  display:none;border:1px solid var(--line);background:var(--panel);color:var(--txt);
  border-radius:10px;padding:8px 10px;cursor:pointer;
}

@media (max-width:980px){
  .shell-sidebar{
    position:fixed;left:0;top:0;z-index:30;
    transform:translateX(-105%);transition:transform .22s ease;
  }
  html.shell-nav-open .shell-sidebar{transform:translateX(0)}
  .shell-backdrop{
    display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:25;
  }
  html.shell-nav-open .shell-backdrop{display:block}
  .shell-topbar{
    display:flex;align-items:center;justify-content:space-between;gap:10px;
    margin:-8px -8px 16px;padding:10px 8px;
  }
  .shell-menu-btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12px}
  .shell-main{padding:14px 14px 48px}
  /* generator layout inside shell */
  .shell-main .layout{padding:0;max-width:none}
  .shell-main .top{display:none}
}

/* Header duplicado some — marca já está na lateral (evita salto) */
.shell-main > .top,
.shell-layout > .shell-main > .top,
body[data-page] > .top{
  display:none !important;
}
/* Antes do shell montar, some o topo antigo pra não "esticar" */
body[data-page] > header.top{
  display:none !important;
}
.shell-main .layout{padding:0;max-width:none}

/* Telegram FAB (canto) */
/* Toasts do painel: ficam acima do FAB Telegram (não cobrem o ícone) */
body[data-page] .toast,
.shell-main .toast,
#toast.toast{
  bottom:76px !important;
  right:22px !important;
  max-width:min(480px,calc(100vw - 32px));
  z-index:55;
}
/* Painel: sem rodapé “servidor seguro” (só login) */
body[data-page] #opk-global-sec-foot{
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
  height:0 !important;
  overflow:hidden !important;
}

.panel-telegram-fab{
  position:fixed;bottom:22px;right:22px;z-index:50;
  width:46px;height:46px;border-radius:14px;display:grid;place-items:center;
  box-sizing:border-box;overflow:visible;
  background:linear-gradient(160deg,#06140c,#040605);
  border:1px solid rgba(0,255,136,.35);color:#00ff88;text-decoration:none;
  box-shadow:0 0 0 1px rgba(0,255,136,.08),0 0 22px -6px rgba(0,255,136,.55),0 12px 28px -16px rgba(0,0,0,.9);
  transition:border-color .15s,background .15s,color .15s;
}
.panel-telegram-fab:hover{
  border-color:rgba(0,255,136,.65);color:#7dffb8;
  background:linear-gradient(160deg,#0a1c12,#051008);
}
.panel-telegram-fab__icon{width:20px;height:20px;display:block;flex-shrink:0}
.panel-telegram-fab--pulse{animation:opkTgPulse 1.6s ease-in-out infinite}
@keyframes opkTgPulse{
  0%,100%{opacity:1;transform:translateY(0) scale(1);box-shadow:0 0 0 1px rgba(0,255,136,.08),0 0 18px -6px rgba(0,255,136,.45),0 12px 28px -16px rgba(0,0,0,.9)}
  50%{opacity:.72;transform:translateY(-2px) scale(1.04);box-shadow:0 0 0 1px rgba(0,255,136,.18),0 0 28px -2px rgba(0,255,136,.85),0 14px 30px -14px rgba(0,0,0,.95)}
}
@media (max-width:640px){
  .panel-telegram-fab{bottom:16px;right:16px;width:42px;height:42px}
}

.shell-announce{
  display:flex;
  align-items:flex-start;
  gap:12px;
  margin:0 0 14px;
  padding:11px 14px;
  border-radius:12px;
  border:1px solid rgba(0,255,136,.28);
  background:
    radial-gradient(520px 120px at 0% 0%,rgba(0,255,136,.12),transparent 70%),
  rgba(4,8,6,.92);
  box-shadow:inset 0 1px 0 rgba(0,255,136,.08);
}
.shell-announce-k{
  flex:0 0 auto;
  font-family:var(--mono,ui-monospace,monospace);
  font-size:10px;
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:#00ff88;
  padding-top:2px;
}
.shell-announce-t{
  flex:1;
  font-size:13px;
  line-height:1.55;
  color:var(--text,#e8f5ee);
  white-space:pre-wrap;
  word-break:break-word;
}

body[data-page] .btn-primary,
body[data-page] a.btn-primary{
  color:#04140c !important;
  font-weight:600;
}
body[data-page] .btn-primary:hover,
body[data-page] a.btn-primary:hover{
  color:#020806 !important;
}

body[data-page="pronto"] .shell-main{
  width:100% !important;
  max-width:none !important;
  box-sizing:border-box;
}
body[data-page="pronto"] .pronto-page{
  width:100% !important;
  max-width:none !important;
}