/* =========================================================
   TRAUBE — BRAND FIX V5
   ========================================================= */

.brand {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.brand .brand-mark,
.brand .brand-logo-stack {
  display: none !important;
}

.brand .traube-theme-logo {
  position: static !important;
  inset: auto !important;

  display: block !important;

  width: 62px !important;
  height: 62px !important;

  flex: 0 0 62px !important;

  object-fit: contain !important;

  background: transparent !important;

  border: 0 !important;
  border-radius: 0 !important;

  box-shadow: none !important;

  filter: none;

  transition:
    transform .18s ease,
    filter .18s ease;
}

.brand:hover .traube-theme-logo {
  transform: scale(1.05);
}

:root[data-theme="dark"]
.brand .traube-theme-logo {
  filter:
    drop-shadow(
      0 4px 14px
      rgba(96, 165, 250, .22)
    );
}

:root[data-theme="leila-mood"]
.brand .traube-theme-logo {
  filter:
    drop-shadow(
      0 4px 14px
      rgba(220, 55, 125, .22)
    );
}

.brand .brand-copy {
  display: grid !important;
  min-width: 0;
}

.brand .brand-copy strong {
  font-size: 18px !important;
  font-weight: 850 !important;
  line-height: 1.1 !important;
  letter-spacing: -.02em !important;
}

.brand .brand-copy small {
  margin-top: 4px !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  color: var(--muted) !important;
}

/* Caso algum CSS antigo tente exibir imagens extras */
.brand > img:not(.traube-theme-logo):not(#traube-brand-logo) {
  display: none !important;
}

@media (max-width: 700px) {
  .brand .traube-theme-logo {
    width: 54px !important;
    height: 54px !important;
    flex-basis: 54px !important;
  }
}

/* TRAUBE — uppercase + 15% */
.brand .brand-copy strong {
  text-transform: uppercase !important;
  font-size: 20.7px !important; /* 18px + 15% */
}

.auth-brand h1 {
  text-transform: uppercase !important;
  font-size: 32.2px !important; /* 28px + 15% */
}



/* TRAUBE v57 — posição global estável dos controles superiores */
:root{
  --traube-top-controls-top:10px;
  --traube-top-controls-right:max(34px, calc((100vw - 1320px) / 2));
}
@media (min-width:981px){
  body:not([data-page="dashboard"]) .topbar .traube-notifications{
    position:fixed!important;
    top:var(--traube-top-controls-top)!important;
    right:var(--traube-top-controls-right)!important;
    bottom:auto!important;
    left:auto!important;
    margin:0!important;
    transform:none!important;
    translate:none!important;
    z-index:245!important;
    transition:none!important;
    animation:none!important;
    will-change:auto!important;
  }
}


/* TRAUBE v58 — topbar estático e uniforme */
@media (min-width:981px){
  body:not([data-page="dashboard"]) .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    min-height:60px!important;
    height:auto!important;
    margin:0 0 16px!important;
    align-items:flex-start!important;
    overflow:visible!important;
  }
  body:not([data-page="dashboard"]) .topbar .traube-notifications{
    position:fixed!important;
    top:var(--traube-top-controls-top)!important;
    right:var(--traube-top-controls-right)!important;
    bottom:auto!important;
    left:auto!important;
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
    margin:0!important;
    transform:none!important;
    translate:none!important;
    transition:none!important;
    animation:none!important;
    z-index:245!important;
  }
  body:not([data-page="dashboard"]) .traube-pomodoro-toggle{
    min-width:164px!important;
    height:48px!important;
    min-height:48px!important;
    padding:0 14px!important;
    gap:10px!important;
    border-radius:12px!important;
    box-sizing:border-box!important;
  }
  body:not([data-page="dashboard"]) .traube-pomodoro-icon,
  body:not([data-page="dashboard"]) .traube-pomodoro-icon svg{
    width:22px!important;
    height:22px!important;
  }
  body:not([data-page="dashboard"]) .traube-pomodoro-copy strong{
    font-size:13px!important;
  }
  body:not([data-page="dashboard"]) .traube-pomodoro-copy small{
    font-size:11px!important;
  }
  body:not([data-page="dashboard"]) .traube-notification-toggle,
  body:not([data-page="dashboard"]) .traube-profile-toggle{
    width:48px!important;
    height:48px!important;
    min-width:48px!important;
    min-height:48px!important;
    border-radius:12px!important;
    box-sizing:border-box!important;
  }
  body:not([data-page="dashboard"]) .traube-notification-toggle svg,
  body:not([data-page="dashboard"]) #traube-notification-toggle svg{
    width:20px!important;
    height:20px!important;
  }
  body:not([data-page="dashboard"]) .traube-profile-toggle{
    font-size:17px!important;
  }
}
body[data-page="caderno"] .notebook-topbar{
  position:relative!important;
  top:auto!important;
  z-index:auto!important;
  background:transparent!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  margin:0 0 16px!important;
}
body[data-page="caderno"] .notebook-save-status{
  position:absolute!important;
  left:0!important;
  top:64px!important;
  margin:0!important;
  pointer-events:none!important;
}
body[data-page="cronograma"]:not(.schedule-settings-embed) .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
  margin:0 0 16px!important;
}


/* TRAUBE v59 — alinhamento global definitivo dos controles do topo */
@media (min-width:981px){
  body:not([data-page="dashboard"]) .topbar .traube-notifications{
    top:var(--traube-top-controls-top,0px)!important;
    right:var(--traube-top-controls-right,max(34px, calc((100vw - 1320px) / 2)))!important;
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
  }
  body:not([data-page="dashboard"]) .topbar .traube-pomodoro-top,
  body:not([data-page="dashboard"]) .topbar .traube-notification-toggle,
  body:not([data-page="dashboard"]) .topbar .traube-profile-top{
    margin-top:0!important;
    transform:none!important;
    translate:none!important;
    align-self:center!important;
  }
}


/* TRAUBE v60 — controles alinhados à largura real de 1320px da página */
@media (min-width:981px){
  :root{
    --traube-top-controls-right:max(34px, calc((100vw - 1320px) / 2));
  }
  body:not([data-page="dashboard"]) .topbar .traube-notifications{
    right:var(--traube-top-controls-right)!important;
  }
}


/* TRAUBE v61 — restaura altura anterior e mantém deslocamento à esquerda */
@media (min-width:981px){
  :root{
    --traube-top-controls-top:10px;
    --traube-top-controls-right:max(34px, calc((100vw - 1320px) / 2));
  }
  body:not([data-page="dashboard"]) .topbar .traube-notifications{
    top:var(--traube-top-controls-top)!important;
    right:var(--traube-top-controls-right)!important;
  }
}


/* TRAUBE v62 — deslocamento horizontal real dos controles do topo */
@media (min-width:981px){
  :root{
    --traube-top-controls-top:10px;
    --traube-top-controls-right:154px;
  }
  body:not([data-page="dashboard"]) .topbar .traube-notifications{
    top:var(--traube-top-controls-top)!important;
    right:var(--traube-top-controls-right)!important;
  }
}


/* TRAUBE v64 — controles ancorados pela direita na borda real do card de conteúdo */
@media (min-width:981px){
  :root{
    --traube-top-controls-top:10px;
    --traube-top-controls-right:max(34px, calc((100vw - 1320px) / 2));
  }
  body:not([data-page="dashboard"]) .topbar .traube-notifications{
    top:var(--traube-top-controls-top)!important;
    right:var(--traube-top-controls-right)!important;
  }
}


/* =========================================================
   TRAUBE v65 — Timer + Notificações + Perfil integrados ao topo
   Sem modo edição, sem drag e sem bloco flutuante.
   ========================================================= */

/* A antiga alça de edição/arraste nunca aparece. */
.traube-top-controls-drag-handle{
  display:none!important;
}

/* O cabeçalho é o elemento fixado; o bloco pertence a ele. */
.topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
  position:sticky!important;
  top:0!important;
  z-index:240!important;
  display:flex!important;
  align-items:center!important;
  overflow:visible!important;
  background:var(--bg)!important;
}

/* O grupo deixa de ser fixed/floating e volta ao fluxo do cabeçalho. */
.topbar .traube-notifications,
body:not([data-page="dashboard"]) .topbar .traube-notifications,
body[data-page="dashboard"] .topbar .traube-notifications{
  position:static!important;
  inset:auto!important;
  top:auto!important;
  right:auto!important;
  bottom:auto!important;
  left:auto!important;
  margin:0 0 0 auto!important;
  transform:none!important;
  translate:none!important;
  z-index:auto!important;
  transition:none!important;
  animation:none!important;
  will-change:auto!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
}

/* Elimina qualquer efeito residual de posição personalizada antiga. */
.traube-notifications[data-traube-custom-position],
.traube-notifications.traube-top-controls-dragging{
  position:static!important;
  top:auto!important;
  right:auto!important;
  left:auto!important;
  transform:none!important;
  user-select:auto!important;
}

/* Mantém os menus do timer/notificações/perfil sobre o conteúdo quando abertos. */
.traube-pomodoro-top,
.traube-profile-top{
  position:relative!important;
}
.traube-pomodoro-panel,
.traube-profile-menu,
.traube-notification-panel{
  z-index:500!important;
}

/* Desktop: altura real do cabeçalho comporta os controles sem sobreposição. */
@media(min-width:981px){
  body .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body:not([data-page="dashboard"]) .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    min-height:60px!important;
    height:auto!important;
    margin:0 0 16px!important;
    padding:6px 0!important;
  }
}

/* Mobile/PWA: segue integrado ao topo, sem translate ou posição flutuante. */
@media(max-width:980px){
  .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  html.pwa-standalone body .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:sticky!important;
    top:0!important;
    min-height:58px!important;
    padding:5px 0!important;
    background:var(--bg)!important;
  }
  .topbar .traube-notifications,
  html.pwa-standalone body .topbar .traube-notifications{
    position:static!important;
    top:auto!important;
    right:auto!important;
    margin-left:auto!important;
    transform:none!important;
    align-self:center!important;
  }
}


/* =========================================================
   TRAUBE v66 — restaura a posição visual anterior do bloco
   Mantém Timer + Notificações + Perfil travados, sem drag.
   ========================================================= */
@media(min-width:981px){
  :root{
    --traube-top-controls-top:10px;
    --traube-top-controls-right:max(34px, calc((100vw - 1320px) / 2));
  }

  .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
    top:auto!important;
    z-index:240!important;
  }

  .topbar .traube-notifications,
  body:not([data-page="dashboard"]) .topbar .traube-notifications,
  body[data-page="dashboard"] .topbar .traube-notifications{
    position:fixed!important;
    top:var(--traube-top-controls-top)!important;
    right:var(--traube-top-controls-right)!important;
    bottom:auto!important;
    left:auto!important;
    margin:0!important;
    transform:none!important;
    translate:none!important;
    z-index:245!important;
  }
}

.traube-top-controls-drag-handle{
  display:none!important;
}
.traube-notifications{
  cursor:default!important;
}


/* =========================================================
   TRAUBE v67 — controles fixos no topo das páginas
   Timer + notificações + perfil permanecem presos ao cabeçalho.
   ========================================================= */
@media(min-width:981px){
  body .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body:not([data-page="dashboard"]) .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body[data-page="dashboard"] .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:sticky!important;
    top:0!important;
    z-index:240!important;
    background:var(--bg)!important;
  }

  .topbar .traube-notifications,
  body:not([data-page="dashboard"]) .topbar .traube-notifications,
  body[data-page="dashboard"] .topbar .traube-notifications{
    position:static!important;
    inset:auto!important;
    margin-left:auto!important;
    transform:none!important;
    translate:none!important;
    z-index:auto!important;
  }
}

@media(max-width:980px){
  body .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  html.pwa-standalone body .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:sticky!important;
    top:0!important;
    z-index:240!important;
    background:var(--bg)!important;
  }
}


/* =========================================================
   TRAUBE v68 — posição única dos controles, baseada no Cronograma
   Aplica também ao Dashboard.
   ========================================================= */
@media(min-width:981px){
  :root{
    --traube-top-controls-top:10px;
    --traube-top-controls-right:max(34px, calc((100vw - 1320px) / 2));
  }

  body .topbar .traube-notifications,
  body:not([data-page="dashboard"]) .topbar .traube-notifications,
  body[data-page="dashboard"] .topbar .traube-notifications,
  body[data-page="cronograma"]:not(.schedule-settings-embed) .topbar .traube-notifications{
    position:fixed!important;
    top:var(--traube-top-controls-top)!important;
    right:var(--traube-top-controls-right)!important;
    bottom:auto!important;
    left:auto!important;
    margin:0!important;
    transform:none!important;
    translate:none!important;
    z-index:245!important;
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
  }
}

@media(max-width:980px){
  body .topbar .traube-notifications,
  body[data-page="dashboard"] .topbar .traube-notifications,
  body[data-page="cronograma"]:not(.schedule-settings-embed) .topbar .traube-notifications{
    position:static!important;
    inset:auto!important;
    margin-left:auto!important;
    transform:none!important;
    translate:none!important;
  }
}


/* =========================================================
   TRAUBE v67 — POSIÇÃO DO TIMER = RÉGUA DO DASHBOARD
   Alinhamento pela margem de 28px da área útil do Dashboard.
   ========================================================= */
@media(min-width:981px){
  :root{
    --traube-top-controls-top:28px;
    --traube-top-controls-right:28px;
  }

  .topbar .traube-notifications,
  body:not([data-page="dashboard"]) .topbar .traube-notifications,
  body[data-page="dashboard"] .topbar .traube-notifications{
    position:fixed!important;
    top:var(--traube-top-controls-top)!important;
    right:var(--traube-top-controls-right)!important;
    bottom:auto!important;
    left:auto!important;
    margin:0!important;
    transform:none!important;
    translate:none!important;
    z-index:245!important;
  }
}

/* PWA/mobile segue a margem do Dashboard mobile. */
@media(max-width:980px){
  .topbar .traube-notifications,
  html.pwa-standalone body .topbar .traube-notifications{
    right:20px!important;
  }
}


/* =========================================================
   TRAUBE v68 — MESMO VÃO DASHBOARD: TIMER -> CARD DE TÍTULO
   Timer: top 28px / altura 48px
   Gap aprovado: 14px
   Card começa em 90px (28 + 48 + 14)
   ========================================================= */
@media(min-width:981px){
  body:not([data-page="dashboard"]) .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    min-height:48px!important;
    height:48px!important;
    max-height:48px!important;
    margin:0 0 14px!important;
    padding:0!important;
    box-sizing:border-box!important;
  }

  body:not([data-page="dashboard"]) .topbar .traube-notifications{
    top:28px!important;
  }
}


/* =========================================================
   TRAUBE v69 — distância visual Dashboard: controles -> título
   Timer top 28px / altura 48px / respiro 28px
   Card inicia a 104px do topo da área principal.
   ========================================================= */
@media(min-width:981px){
  body:not([data-page="dashboard"]) .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    min-height:48px!important;
    height:48px!important;
    max-height:48px!important;
    margin:0 0 28px!important;
    padding:0!important;
  }
}


/* v70 — regra final de distância desktop */
@media(min-width:981px){
  body:not([data-page="dashboard"]) .page > .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    height:48px!important;
    min-height:48px!important;
    max-height:48px!important;
    margin:0 0 34px!important;
    padding:0!important;
  }
  body:not([data-page="dashboard"]) .page > .topbar + *{
    margin-top:0!important;
  }
}


/* =========================================================
   TRAUBE v71 — REGRA AUTORITATIVA DO TOPO
   Dashboard como referência:
   controles: top 28px / h 48px
   card: 14px abaixo => início em 90px
   ========================================================= */
@media(min-width:981px){
  body:not([data-page="dashboard"]) .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
  }

  body:not([data-page="dashboard"]) .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
    padding-top:62px!important; /* 48px controles + 14px gap */
  }

  body:not([data-page="dashboard"]) .page > .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:absolute!important;
    top:0!important;
    left:0!important;
    right:0!important;
    width:100%!important;
    height:48px!important;
    min-height:48px!important;
    max-height:48px!important;
    margin:0!important;
    padding:0!important;
    background:transparent!important;
    z-index:240!important;
  }

  body:not([data-page="dashboard"]) .topbar .traube-notifications{
    position:fixed!important;
    top:28px!important;
    right:max(34px, calc((100vw - 1320px) / 2))!important;
    bottom:auto!important;
    left:auto!important;
    margin:0!important;
    transform:none!important;
    translate:none!important;
    z-index:245!important;
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
  }

  body:not([data-page="dashboard"]) .page > .topbar + *{
    margin-top:0!important;
  }

  body:not([data-page="dashboard"]) .page > :is(
    .traube-page-spotlight,
    .schedule-top-spotlight,
    .error-cat-spotlight,
    .schedule-stack,
    .error-metrics
  ){
    margin-top:0!important;
  }
}


/* =========================================================
   TRAUBE v72 — topo final conforme referência visual enviada
   Controles no fluxo, acima do card, sem flutuar.
   ========================================================= */
@media(min-width:981px){
  body:not([data-page="dashboard"]) .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    padding-top:0!important;
  }

  body:not([data-page="dashboard"]) .page > .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
    inset:auto!important;
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    height:72px!important;
    min-height:72px!important;
    max-height:72px!important;
    margin:0 0 18px!important;
    padding:0!important;
    background:transparent!important;
    overflow:visible!important;
    z-index:240!important;
  }

  body:not([data-page="dashboard"]) .topbar .page-heading{
    display:none!important;
  }

  body:not([data-page="dashboard"]) .topbar .traube-notifications{
    position:static!important;
    inset:auto!important;
    width:100%!important;
    margin:0!important;
    transform:none!important;
    translate:none!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:18px!important;
    z-index:auto!important;
  }

  body:not([data-page="dashboard"]) .traube-pomodoro-toggle{
    min-width:184px!important;
    width:184px!important;
    height:58px!important;
    padding:0 18px!important;
    gap:12px!important;
    border-radius:16px!important;
  }

  body:not([data-page="dashboard"]) .traube-pomodoro-icon,
  body:not([data-page="dashboard"]) .traube-pomodoro-icon svg{
    width:28px!important;
    height:28px!important;
  }

  body:not([data-page="dashboard"]) .traube-pomodoro-copy strong{
    font-size:16px!important;
    line-height:1.05!important;
  }

  body:not([data-page="dashboard"]) .traube-pomodoro-copy small{
    margin-top:4px!important;
    font-size:13px!important;
    line-height:1!important;
  }

  body:not([data-page="dashboard"]) .traube-notification-toggle,
  body:not([data-page="dashboard"]) .traube-profile-toggle{
    width:58px!important;
    height:58px!important;
    min-width:58px!important;
    min-height:58px!important;
    border-radius:16px!important;
  }

  body:not([data-page="dashboard"]) .traube-notification-toggle svg{
    width:22px!important;
    height:22px!important;
  }

  body:not([data-page="dashboard"]) .traube-profile-toggle{
    font-size:19px!important;
  }

  body:not([data-page="dashboard"]) .page > .topbar + *{
    margin-top:0!important;
  }
}


/* =========================================================
   TRAUBE v73 — ALINHAMENTO VERTICAL GLOBAL PELO DASHBOARD
   Mesma régua vertical do Dashboard no desktop:
   main 18px / topbar 60px / -6px no topo / 10px até o card.
   Mantém tamanhos e alinhamento horizontal já aprovados.
   ========================================================= */
@media(min-width:981px){
  body:not([data-page="dashboard"]) .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    padding-top:18px!important;
  }

  body:not([data-page="dashboard"]) .page > .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
    inset:auto!important;
    height:60px!important;
    min-height:60px!important;
    max-height:60px!important;
    margin:-6px 0 10px!important;
    padding:6px 0!important;
    box-sizing:border-box!important;
  }

  body:not([data-page="dashboard"]) .page > .topbar + *{
    margin-top:0!important;
  }
}


/* v74 — fallback CSS: controles com escala real do Dashboard */
@media(min-width:981px){
  body:not([data-page="dashboard"]) .traube-pomodoro-toggle{
    height:43px!important;
    min-height:43px!important;
    min-width:156px!important;
    width:auto!important;
    padding:0 12px!important;
  }
  body:not([data-page="dashboard"]) .traube-notification-toggle,
  body:not([data-page="dashboard"]) .traube-profile-toggle{
    width:43px!important;
    height:43px!important;
    min-width:43px!important;
    min-height:43px!important;
  }
}


/* v75 — largura do Timer igual à proporção do Dashboard */
@media(min-width:981px){
  body:not([data-page="dashboard"]) .traube-pomodoro-toggle{
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    padding-left:10px!important;
    padding-right:10px!important;
    gap:8px!important;
  }
}


/* =========================================================
   TRAUBE v76 — CRONOGRAMA = RÉGUA EXATA DO DASHBOARD
   Corrige X/Y do Timer + sino + perfil sem alterar dimensões.
   Remove superfícies brancas estruturais para revelar o pattern global.
   ========================================================= */
@media(min-width:981px){
  body[data-page="cronograma"]:not(.schedule-settings-embed) .page > .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
    top:auto!important;
    right:auto!important;
    bottom:auto!important;
    left:auto!important;
    width:100%!important;
    height:60px!important;
    min-height:60px!important;
    max-height:60px!important;
    margin:-6px 0 10px!important;
    padding:0!important;
    box-sizing:border-box!important;
    background:transparent!important;
    overflow:visible!important;
    transform:none!important;
    translate:none!important;
  }

  body[data-page="cronograma"]:not(.schedule-settings-embed) .topbar .traube-notifications{
    position:absolute!important;
    top:6px!important;
    right:0!important;
    bottom:auto!important;
    left:auto!important;
    width:auto!important;
    margin:0!important;
    transform:none!important;
    translate:none!important;
    align-self:auto!important;
    justify-content:flex-end!important;
    animation:none!important;
    transition:none!important;
  }
}

/* O Cronograma não cria uma folha branca sobre o fundo global da TRAUBE. */
body[data-page="cronograma"]:not(.schedule-settings-embed),
body[data-page="cronograma"]:not(.schedule-settings-embed) .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
body[data-page="cronograma"]:not(.schedule-settings-embed) .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
body[data-page="cronograma"]:not(.schedule-settings-embed) .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
  background-color:transparent!important;
  background-image:none!important;
}


/* v77 — Cronograma: pattern global visível acima de qualquer folha branca estrutural */
body[data-page="cronograma"]:not(.schedule-settings-embed){
  background:var(--bg)!important;
}
body[data-page="cronograma"]:not(.schedule-settings-embed) .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
body[data-page="cronograma"]:not(.schedule-settings-embed) .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
body[data-page="cronograma"]:not(.schedule-settings-embed) .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
  background:transparent!important;
}

/* Replica no shell do Cronograma o MESMO pattern global da TRAUBE.
   Necessário porque o app-shell fica acima dos pseudo-elementos do body. */
body[data-page="cronograma"]:not(.schedule-settings-embed) .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before,
body[data-page="cronograma"]:not(.schedule-settings-embed) .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::after{
  content:""!important;
  position:fixed!important;
  inset:-14%!important;
  z-index:-1!important;
  pointer-events:none!important;
  background-image:var(--traube-pattern-image)!important;
  background-repeat:repeat!important;
  background-size:var(--traube-pattern-size) var(--traube-pattern-size)!important;
  transform:rotate(-8deg) scale(1.08)!important;
  transform-origin:center!important;
}
body[data-page="cronograma"]:not(.schedule-settings-embed) .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before{
  background-position:0 0!important;
  opacity:var(--traube-pattern-opacity)!important;
}
body[data-page="cronograma"]:not(.schedule-settings-embed) .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::after{
  background-position:calc(var(--traube-pattern-size) / 2) calc(var(--traube-pattern-size) / 2)!important;
  opacity:var(--traube-pattern-opacity)!important;
}


/* TRAUBE HOSTINGER-LIKE SHELL v1 — 2026-10-04 */
:root{
  --traube-shell-blue:#184888;
  --traube-shell-blue-2:#184888;
  --traube-shell-radius:24px;
  --traube-shell-edge:6px;
  --traube-shell-top:70px;
}

/* Desktop/web: a aplicação inteira vira um shell, com cabeçalho azul cheio
   e apenas um filete azul nas laterais e na base. */
@media (min-width:981px){
  html,body{background:var(--bg)!important}

  body .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
    display:grid!important;
    grid-template-columns:270px minmax(0,1fr)!important;
    gap:0!important;
    width:auto!important;
    min-height:calc(100vh - 20px)!important;
    margin:10px!important;
    padding:var(--traube-shell-top) var(--traube-shell-edge) var(--traube-shell-edge)!important;
    overflow:visible!important;
    border-radius:var(--traube-shell-radius)!important;
    background:linear-gradient(90deg,var(--traube-shell-blue),var(--traube-shell-blue-2))!important;
    box-shadow:0 12px 34px rgba(15,103,238,.18)!important;
  }

  /* faixa superior azul contínua */
  body .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before{
    content:""!important;
    position:absolute!important;
    inset:0 0 auto 0!important;
    height:calc(var(--traube-shell-top) + 8px)!important;
    border-radius:var(--traube-shell-radius) var(--traube-shell-radius) 18px 18px!important;
    background:linear-gradient(90deg,var(--traube-shell-blue),var(--traube-shell-blue-2))!important;
    pointer-events:none!important;
    z-index:0!important;
  }

  /* remove qualquer moldura/pseudo legado */
  body .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::after{content:none!important;display:none!important}

  /* interior branco encaixado */
  body #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
    top:auto!important;
    left:auto!important;
    transform:none!important;
    opacity:1!important;
    pointer-events:auto!important;
    z-index:2!important;
    width:auto!important;
    height:auto!important;
    min-height:calc(100vh - 96px)!important;
    margin:0!important;
    padding:16px 14px 14px!important;
    overflow:hidden!important;
    border:0!important;
    border-right:1px solid var(--border)!important;
    border-radius:18px 0 0 18px!important;
    background:var(--sidebar)!important;
    box-shadow:none!important;
  }

  body .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
    z-index:2!important;
    min-width:0!important;
    margin:0!important;
    padding:18px 24px 30px!important;
    border-radius:0 18px 18px 0!important;
    background:var(--surface)!important;
    overflow:visible!important;
  }

  body .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    max-width:none!important;
    width:100%!important;
    margin:0!important;
  }

  /* A logo passa a morar visualmente dentro da faixa azul superior. */
  body #sidebar.sidebar .sidebar-top{
    position:absolute!important;
    top:calc(-1 * var(--traube-shell-top) + 8px)!important;
    left:10px!important;
    right:10px!important;
    height:54px!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    z-index:6!important;
    background:transparent!important;
    border:0!important;
  }

  body #sidebar.sidebar .brand{
    min-width:0!important;
    gap:9px!important;
    color:#fff!important;
  }
  body #sidebar.sidebar .brand .traube-theme-logo{
    width:46px!important;
    height:46px!important;
    flex:0 0 46px!important;
    filter:brightness(0) invert(1)!important;
  }
  body #sidebar.sidebar .brand .brand-copy strong,
  body #sidebar.sidebar .brand .brand-copy small{
    color:#fff!important;
  }
  body #sidebar.sidebar .brand .brand-copy strong{
    font-size:18px!important;
    line-height:1!important;
  }
  body #sidebar.sidebar .brand .brand-copy small{
    margin-top:3px!important;
    font-size:9px!important;
    opacity:.92!important;
  }

  /* Sem fechar/recolher menu no desktop. */
  body #sidebar.sidebar .sidebar-close,
  body .sidebar-desktop-toggle,
  body .menu-open,
  body #sidebar-backdrop,
  body .sidebar-backdrop{
    display:none!important;
  }
  body.sidebar-hidden .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body.sidebar-collapsed .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    grid-template-columns:270px minmax(0,1fr)!important;
  }
  body.sidebar-hidden #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body.sidebar-collapsed #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    transform:none!important;
    opacity:1!important;
    pointer-events:auto!important;
    width:auto!important;
    padding:16px 14px 14px!important;
  }
  body.sidebar-collapsed #sidebar.sidebar .brand-copy,
  body.sidebar-collapsed #sidebar.sidebar .nav-link > span:not(.nav-icon),
  body.sidebar-collapsed #sidebar.sidebar .nav-group-label .nav-label-text,
  body.sidebar-collapsed #sidebar.sidebar .nav-group-label .nav-group-chevron,
  body.sidebar-collapsed #sidebar.sidebar .nav-submenu,
  body.sidebar-collapsed #sidebar.sidebar .sidebar-footer{
    display:initial!important;
  }

  /* Topbar flutuante dentro da faixa azul */
  body .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body:not([data-page="dashboard"]) .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body[data-page="dashboard"] .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:absolute!important;
    top:calc(-1 * var(--traube-shell-top) + 7px)!important;
    left:0!important;
    right:0!important;
    width:auto!important;
    min-height:56px!important;
    height:56px!important;
    margin:0!important;
    padding:0 14px!important;
    display:flex!important;
    align-items:center!important;
    overflow:visible!important;
    background:transparent!important;
    border:0!important;
    z-index:7!important;
  }

  body .topbar .page-heading{display:none!important}

  body .topbar .traube-notifications,
  body:not([data-page="dashboard"]) .topbar .traube-notifications,
  body[data-page="dashboard"] .topbar .traube-notifications{
    position:static!important;
    inset:auto!important;
    margin:0 0 0 auto!important;
    transform:none!important;
    translate:none!important;
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
    z-index:8!important;
  }

  /* controles da faixa superior: aspecto translúcido como a referência */
  body .topbar .traube-pomodoro-toggle,
  body .topbar .traube-notification-toggle,
  body .topbar .traube-profile-toggle,
  body .topbar [data-global-search-trigger],
  body .topbar .global-search-trigger,
  body .topbar .traube-global-search-trigger{
    border:1px solid rgba(255,255,255,.24)!important;
    background:rgba(255,255,255,.10)!important;
    color:#fff!important;
    box-shadow:none!important;
    backdrop-filter:blur(8px)!important;
    -webkit-backdrop-filter:blur(8px)!important;
  }
  body .topbar .traube-pomodoro-toggle:hover,
  body .topbar .traube-notification-toggle:hover,
  body .topbar .traube-profile-toggle:hover{
    background:rgba(255,255,255,.18)!important;
    border-color:rgba(255,255,255,.38)!important;
    color:#fff!important;
  }
  body .topbar .traube-pomodoro-copy strong,
  body .topbar .traube-pomodoro-copy small,
  body .topbar svg{color:#fff!important}
  body .topbar svg{stroke:currentColor!important}

  /* arredondamento do interior inferior, mantendo só o filete azul externo */
  body #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    box-shadow:0 0 0 1px rgba(15,103,238,.04)!important;
  }
}

/* PWA/mobile preservado: mantém o comportamento móvel existente. */
@media (max-width:980px){
  body .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){margin:0!important}
}



/* TRAUBE HOSTINGER SHELL — EXTERNAL BLUE FILL v3 — 2026-10-04 */
@media (min-width:981px){
  body .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    overflow:hidden!important;
    border-radius:24px!important;
    background:linear-gradient(90deg,#184888,#184888)!important;
  }

  body .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before{
    border-radius:24px 24px 0 0!important;
  }

  /* Restaura a curva branca interna; o azul fica apenas por trás dela. */
  body #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    border-radius:18px 0 0 18px!important;
    overflow:hidden!important;
  }

  body .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    border-radius:0 18px 18px 0!important;
    overflow:hidden!important;
  }
}


/* TRAUBE SHELL — THEME COLORS v4 — 2026-10-04 */
:root,
:root[data-theme="light"]{
  --traube-shell-theme:#184888;
  --traube-shell-theme-2:#123A70;
}
:root[data-theme="dark"]{
  --traube-shell-theme:#142A44;
  --traube-shell-theme-2:#0D1B30;
}
:root[data-theme="leila-mood"]{
  --traube-shell-theme:#CB3F83;
  --traube-shell-theme-2:#A92F6E;
}

@media (min-width:981px){
  body .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    background:linear-gradient(90deg,var(--traube-shell-theme),var(--traube-shell-theme-2))!important;
  }
  body .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before{
    background:linear-gradient(90deg,var(--traube-shell-theme),var(--traube-shell-theme-2))!important;
  }
}


/* TRAUBE SHELL — EXACT COLOR MATCH v5 — 2026-10-04 */
:root,
:root[data-theme="light"]{
  --traube-shell-theme:#184888;
}
:root[data-theme="dark"]{
  --traube-shell-theme:#142A44;
}
:root[data-theme="leila-mood"]{
  --traube-shell-theme:#CB3F83;
}

@media (min-width:981px){
  html,
  body,
  body .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before{
    background:var(--traube-shell-theme)!important;
    background-color:var(--traube-shell-theme)!important;
    background-image:none!important;
  }
}


/* TRAUBE SHELL — SOLID COLOR NO GRADIENT v6 — 2026-10-04 */
:root,
:root[data-theme="light"]{
  --traube-shell-theme:#184888;
}
:root[data-theme="dark"]{
  --traube-shell-theme:#142A44;
}
:root[data-theme="leila-mood"]{
  --traube-shell-theme:#CB3F83;
}
@media (min-width:981px){
  html,
  body,
  body .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before{
    background:var(--traube-shell-theme)!important;
    background-color:var(--traube-shell-theme)!important;
    background-image:none!important;
  }
}


/* TRAUBE TOPBAR — CONTROLS ON SHELL BLUE v7 — 2026-10-04 */
@media (min-width:981px){
  body .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    background:transparent!important;
  }

  body .topbar :is(
    .traube-pomodoro-toggle,
    .traube-notification-toggle,
    .traube-profile-toggle,
    [data-global-search-trigger],
    .global-search-trigger,
    .traube-global-search-trigger
  ){
    background:rgba(255,255,255,.10)!important;
    border-color:rgba(255,255,255,.28)!important;
    color:#fff!important;
    box-shadow:none!important;
  }

  body .topbar :is(
    .traube-pomodoro-toggle,
    .traube-notification-toggle,
    .traube-profile-toggle,
    [data-global-search-trigger],
    .global-search-trigger,
    .traube-global-search-trigger
  ):hover{
    background:rgba(255,255,255,.17)!important;
    border-color:rgba(255,255,255,.40)!important;
    color:#fff!important;
  }
}


/* TRAUBE SHELL — AUTHORITATIVE SAME-COLOR OVERRIDE v10 — 2026-10-04 */
:root,
:root[data-theme="light"]{
  --traube-shell-theme:#184888;
}
:root[data-theme="dark"]{
  --traube-shell-theme:#142A44;
}
:root[data-theme="leila-mood"]{
  --traube-shell-theme:#CB3F83;
}
@media (min-width:981px){
  html,
  body,
  body .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before,
  html:has(body[data-page="dashboard"][data-dashboard-layout]),
  body[data-page="dashboard"][data-dashboard-layout],
  body[data-page="dashboard"][data-dashboard-layout] .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body[data-page="dashboard"][data-dashboard-layout] .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before{
    background:var(--traube-shell-theme)!important;
    background-color:var(--traube-shell-theme)!important;
    background-image:none!important;
  }
}


/* TRAUBE TIMER PANEL — CLEAN LAYOUT v11 — 2026-10-04 */
@media (min-width:981px){
  /* Ajuste visual isolado do painel aberto do Timer/Pomodoro. */
  body .traube-pomodoro-panel{
    width:288px!important;
    padding:16px!important;
    border:1px solid var(--border)!important;
    border-radius:16px!important;
    background:var(--surface)!important;
    color:var(--text)!important;
    box-shadow:0 18px 48px rgba(15,23,42,.18)!important;
    box-sizing:border-box!important;
  }

  body .traube-pomodoro-panel header{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    margin:0 0 12px!important;
    padding:0!important;
  }

  body .traube-pomodoro-panel header strong{
    display:block!important;
    margin:0!important;
    color:var(--text)!important;
    font-size:15px!important;
    font-weight:700!important;
    line-height:1.2!important;
  }

  body .traube-pomodoro-panel header small{
    display:block!important;
    margin-top:3px!important;
    color:var(--muted)!important;
    font-size:11px!important;
    font-weight:500!important;
    line-height:1.2!important;
  }

  body .traube-timer-switch{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:6px!important;
    margin:0 0 14px!important;
    padding:4px!important;
    border:1px solid var(--border)!important;
    border-radius:12px!important;
    background:var(--surface-2)!important;
  }

  body .traube-timer-switch button{
    min-height:34px!important;
    padding:0 10px!important;
    border:0!important;
    border-radius:8px!important;
    background:transparent!important;
    color:var(--muted)!important;
    font-size:13px!important;
    font-weight:600!important;
    line-height:1!important;
  }

  body .traube-timer-switch button[aria-pressed="true"]{
    background:var(--surface)!important;
    color:var(--accent)!important;
    box-shadow:0 1px 4px rgba(15,23,42,.08)!important;
  }

  body .traube-pomodoro-time{
    margin:2px 0 6px!important;
    color:var(--text)!important;
    font-size:36px!important;
    font-weight:750!important;
    line-height:1!important;
    letter-spacing:-.035em!important;
    text-align:center!important;
    white-space:nowrap!important;
  }

  body .traube-stopwatch-note{
    display:block!important;
    margin:0 0 14px!important;
    color:var(--muted)!important;
    font-size:11px!important;
    font-weight:400!important;
    line-height:1.4!important;
    text-align:left!important;
  }

  body .traube-pomodoro-fields{
    display:grid!important;
    gap:8px!important;
    margin:0 0 14px!important;
  }

  body .traube-pomodoro-fields label{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    min-height:38px!important;
    padding:0!important;
    color:var(--text)!important;
    font-size:12px!important;
    font-weight:600!important;
  }

  body .traube-pomodoro-fields label > span:last-child{
    display:flex!important;
    align-items:center!important;
    gap:6px!important;
    color:var(--muted)!important;
    font-weight:500!important;
  }

  body .traube-pomodoro-fields input{
    width:68px!important;
    height:36px!important;
    min-height:36px!important;
    padding:0 8px!important;
    border:1px solid var(--border)!important;
    border-radius:9px!important;
    background:var(--surface-2)!important;
    color:var(--text)!important;
    font-size:14px!important;
    font-weight:650!important;
    line-height:36px!important;
    text-align:center!important;
    box-sizing:border-box!important;
  }

  body .traube-pomodoro-actions,
  body .traube-stopwatch-actions{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:8px!important;
    margin:0!important;
  }

  body .traube-pomodoro-actions button,
  body .traube-stopwatch-actions button{
    min-width:0!important;
    min-height:38px!important;
    padding:0 10px!important;
    border:1px solid var(--border)!important;
    border-radius:9px!important;
    background:var(--surface-2)!important;
    color:var(--text)!important;
    font-size:12px!important;
    font-weight:600!important;
    line-height:1!important;
    white-space:nowrap!important;
    box-sizing:border-box!important;
  }

  body #traube-stopwatch-start,
  body #traube-pomodoro-start{
    border-color:var(--accent)!important;
    background:var(--accent)!important;
    color:#fff!important;
  }

  body #traube-stopwatch-pause:disabled,
  body .traube-pomodoro-actions button:disabled{
    opacity:.48!important;
    cursor:default!important;
  }

  body .traube-pomodoro-modes{
    margin:0 0 12px!important;
  }

  body .traube-pomodoro-status{
    margin-top:9px!important;
    min-height:0!important;
    color:var(--muted)!important;
    font-size:10px!important;
    line-height:1.3!important;
  }
}


/* TRAUBE TOPBAR — SEARCH ICON + ALEX v12 — 2026-10-04 */
@media (min-width:981px){
  body .topbar #traube-global-search.traube-search-icon-only{
    display:grid!important;
    place-items:center!important;
    width:43px!important;
    height:43px!important;
    min-width:43px!important;
    max-width:43px!important;
    min-height:43px!important;
    max-height:43px!important;
    padding:0!important;
    margin:0!important;
    border:1px solid rgba(255,255,255,.28)!important;
    border-radius:12px!important;
    background:rgba(255,255,255,.10)!important;
    color:#fff!important;
    box-shadow:none!important;
    flex:0 0 43px!important;
    box-sizing:border-box!important;
    text-decoration:none!important;
    backdrop-filter:blur(8px)!important;
    -webkit-backdrop-filter:blur(8px)!important;
  }

  body .topbar #traube-global-search.traube-search-icon-only:hover{
    background:rgba(255,255,255,.17)!important;
    border-color:rgba(255,255,255,.40)!important;
  }

  body .topbar #traube-global-search.traube-search-icon-only .traube-command-search-icon{
    display:block!important;
    width:19px!important;
    height:19px!important;
    margin:0!important;
    padding:0!important;
    fill:none!important;
    stroke:currentColor!important;
    stroke-width:2!important;
    stroke-linecap:round!important;
    stroke-linejoin:round!important;
  }

  body .topbar #traube-global-search.traube-search-icon-only > span{
    display:none!important;
  }

  body .topbar .traube-alex-topbar{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    height:43px!important;
    min-height:43px!important;
    width:auto!important;
    min-width:74px!important;
    padding:0 14px!important;
    margin:0!important;
    border:1px solid rgba(255,255,255,.28)!important;
    border-radius:12px!important;
    background:rgba(255,255,255,.10)!important;
    color:#fff!important;
    box-shadow:none!important;
    box-sizing:border-box!important;
    text-decoration:none!important;
    font-size:15px!important;
    font-weight:600!important;
    line-height:1!important;
    white-space:nowrap!important;
    backdrop-filter:blur(8px)!important;
    -webkit-backdrop-filter:blur(8px)!important;
  }

  body .topbar .traube-alex-topbar:hover{
    background:rgba(255,255,255,.17)!important;
    border-color:rgba(255,255,255,.40)!important;
    color:#fff!important;
    text-decoration:none!important;
  }
}


/* TRAUBE GLOBAL HEADER — DASHBOARD SETTINGS EVERYWHERE v68 — 2026-10-04 */
@media (min-width:981px){
  /* Mesma escala de logo aprovada no Dashboard. */
  body #sidebar.sidebar .brand .traube-theme-logo,
  body #sidebar.sidebar #traube-brand-logo{
    width:48.4px!important;
    height:48.4px!important;
    flex:0 0 48.4px!important;
  }

  /* Mesmo conjunto compacto de controles em todas as páginas. */
  body .topbar .traube-notifications{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:10px!important;
    margin-left:auto!important;
  }

  body .topbar .traube-pomodoro-toggle,
  body .topbar .traube-notification-toggle,
  body .topbar .traube-profile-toggle{
    height:43px!important;
    min-height:43px!important;
    box-sizing:border-box!important;
    border:1px solid rgba(255,255,255,.28)!important;
    border-radius:12px!important;
    background:rgba(255,255,255,.10)!important;
    color:#fff!important;
    box-shadow:none!important;
    backdrop-filter:blur(8px)!important;
    -webkit-backdrop-filter:blur(8px)!important;
  }

  body .topbar .traube-notification-toggle,
  body .topbar .traube-profile-toggle{
    width:43px!important;
    min-width:43px!important;
    max-width:43px!important;
    display:grid!important;
    place-items:center!important;
    padding:0!important;
    line-height:1!important;
  }

  body .topbar .traube-pomodoro-toggle:hover,
  body .topbar .traube-notification-toggle:hover,
  body .topbar .traube-profile-toggle:hover,
  body .topbar .traube-alex-topbar:hover{
    background:rgba(255,255,255,.17)!important;
    border-color:rgba(255,255,255,.40)!important;
  }

  /* Alex fica no bloco da direita em todas as páginas. */
  body .topbar .traube-alex-topbar{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    position:static!important;
    inset:auto!important;
    transform:none!important;
    height:43px!important;
    min-height:43px!important;
    min-width:74px!important;
    padding:0 14px!important;
    margin:0!important;
    border:1px solid rgba(255,255,255,.28)!important;
    border-radius:12px!important;
    background:rgba(255,255,255,.10)!important;
    color:#fff!important;
    text-decoration:none!important;
    font-size:15px!important;
    font-weight:600!important;
    line-height:1!important;
    white-space:nowrap!important;
    box-sizing:border-box!important;
    backdrop-filter:blur(8px)!important;
    -webkit-backdrop-filter:blur(8px)!important;
  }

  /* A busca visual foi removida: Ctrl/Cmd + K continua disponível. */
  body .topbar #traube-global-search,
  body .topbar [data-global-search-trigger],
  body .topbar .global-search-trigger,
  body .topbar .traube-global-search-trigger{
    display:none!important;
  }
}


/* TRAUBE GLOBAL MASTER SHELL v69 — 2026-10-04 */
:root,
:root[data-theme="light"]{--traube-master-shell:#184888}
:root[data-theme="dark"]{--traube-master-shell:#142A44}
:root[data-theme="leila-mood"]{--traube-master-shell:#CB3F83}

@media (min-width:981px){
  html,
  body{
    width:100%!important;
    min-height:100%!important;
    margin:0!important;
    background:var(--traube-master-shell)!important;
    overflow:hidden!important;
  }

  body .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
    display:grid!important;
    grid-template-columns:270px minmax(0,1fr)!important;
    grid-template-rows:minmax(0,1fr)!important;
    gap:0!important;
    width:auto!important;
    max-width:none!important;
    height:calc(100dvh - 20px)!important;
    min-height:0!important;
    margin:10px!important;
    padding:64px 6px 6px!important;
    overflow:hidden!important;
    border:0!important;
    border-radius:24px!important;
    outline:0!important;
    background:var(--traube-master-shell)!important;
    background-image:none!important;
    box-shadow:none!important;
    box-sizing:border-box!important;
  }

  body .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    inset:0 0 auto 0!important;
    width:auto!important;
    height:70px!important;
    border:0!important;
    border-radius:24px 24px 0 0!important;
    outline:0!important;
    background:var(--traube-master-shell)!important;
    background-image:none!important;
    box-shadow:none!important;
    pointer-events:none!important;
    z-index:0!important;
  }

  body .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::after{
    content:none!important;
    display:none!important;
  }

  /* Sidebar fixa no shell: apenas o conteúdo principal rola. */
  body #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body #sidebar.sidebar.traube-global-shell-sidebar{
    position:relative!important;
    inset:auto!important;
    display:block!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    height:100%!important;
    min-height:0!important;
    margin:0!important;
    padding:16px 14px 14px!important;
    transform:none!important;
    translate:none!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    overflow:hidden!important;
    border:0!important;
    border-right:1px solid var(--border)!important;
    border-radius:18px 0 0 18px!important;
    outline:0!important;
    background:var(--sidebar)!important;
    background-image:none!important;
    box-shadow:none!important;
    box-sizing:border-box!important;
    z-index:2!important;
  }

  body.sidebar-hidden .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body.sidebar-collapsed .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    grid-template-columns:270px minmax(0,1fr)!important;
  }

  body.sidebar-hidden #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body.sidebar-collapsed #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    transform:none!important;
    translate:none!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }

  body #sidebar.sidebar .sidebar-close,
  body .sidebar-desktop-toggle,
  body .menu-open,
  body #sidebar-backdrop,
  body .sidebar-backdrop{
    display:none!important;
  }

  /* Marca na faixa superior, igual ao Dashboard aprovado. */
  body #sidebar.sidebar .sidebar-top{
    position:absolute!important;
    top:-58px!important;
    left:10px!important;
    right:auto!important;
    width:auto!important;
    height:52px!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    overflow:visible!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    z-index:2147482600!important;
  }

  body #sidebar.sidebar .brand{
    display:flex!important;
    align-items:center!important;
    gap:9px!important;
    color:#fff!important;
    min-width:0!important;
  }

  body #sidebar.sidebar .brand .traube-theme-logo,
  body #sidebar.sidebar #traube-brand-logo{
    display:block!important;
    width:48.4px!important;
    height:48.4px!important;
    min-width:48.4px!important;
    min-height:48.4px!important;
    flex:0 0 48.4px!important;
    opacity:1!important;
    visibility:visible!important;
    filter:brightness(0) invert(1)!important;
    object-fit:contain!important;
  }

  body #sidebar.sidebar .brand .brand-copy,
  body #sidebar.sidebar .brand .brand-copy strong,
  body #sidebar.sidebar .brand .brand-copy small{
    color:#fff!important;
  }

  body #sidebar.sidebar .brand .brand-copy strong{
    font-size:18px!important;
    line-height:1!important;
  }

  body #sidebar.sidebar .brand .brand-copy small{
    margin-top:2px!important;
    font-size:9px!important;
    line-height:1.15!important;
    opacity:.92!important;
  }

  /* Conteúdo principal branco com a mesma moldura interna. */
  body .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
    z-index:2!important;
    width:auto!important;
    max-width:none!important;
    height:100%!important;
    min-height:0!important;
    margin:0!important;
    padding:16px 18px 18px!important;
    transform:none!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    border:0!important;
    border-radius:0 18px 18px 0!important;
    outline:0!important;
    background:var(--surface)!important;
    box-shadow:none!important;
    box-sizing:border-box!important;
  }

  body .main > .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    width:100%!important;
    max-width:1320px!important;
    min-width:0!important;
    min-height:100%!important;
    margin:0 auto!important;
    box-sizing:border-box!important;
  }

  /* Topbar portalizada na faixa azul, igual à do Dashboard. */
  body .app-shell > .topbar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body .app-shell > .topbar.dashboard-shell-topbar,
  body .app-shell > .topbar.traube-global-shell-topbar{
    position:absolute!important;
    top:8px!important;
    left:270px!important;
    right:12px!important;
    bottom:auto!important;
    width:auto!important;
    height:48px!important;
    min-height:48px!important;
    max-height:48px!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:10px!important;
    overflow:visible!important;
    visibility:visible!important;
    opacity:1!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    outline:0!important;
    box-shadow:none!important;
    transform:none!important;
    z-index:2147482700!important;
  }

  body .app-shell > .topbar .page-heading{
    display:none!important;
  }

  body .app-shell > .topbar .traube-notifications{
    position:static!important;
    inset:auto!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:10px!important;
    height:43px!important;
    min-height:43px!important;
    margin:0!important;
    transform:none!important;
    translate:none!important;
    visibility:visible!important;
    opacity:1!important;
    z-index:auto!important;
  }

  body .app-shell > .topbar .traube-alex-topbar{
    order:1!important;
  }
  body .app-shell > .topbar .traube-pomodoro-top{
    order:2!important;
  }
  body .app-shell > .topbar #traube-notification-toggle{
    order:3!important;
  }
  body .app-shell > .topbar .traube-profile-top{
    order:4!important;
  }

  body .app-shell > .topbar .traube-alex-topbar,
  body .app-shell > .topbar .traube-pomodoro-toggle,
  body .app-shell > .topbar .traube-notification-toggle,
  body .app-shell > .topbar .traube-profile-toggle{
    height:43px!important;
    min-height:43px!important;
    margin:0!important;
    border:1px solid rgba(255,255,255,.28)!important;
    border-radius:12px!important;
    background:rgba(255,255,255,.10)!important;
    color:#fff!important;
    box-shadow:none!important;
    box-sizing:border-box!important;
    backdrop-filter:blur(8px)!important;
    -webkit-backdrop-filter:blur(8px)!important;
  }

  body .app-shell > .topbar .traube-alex-topbar{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-width:74px!important;
    padding:0 14px!important;
    text-decoration:none!important;
    font-size:15px!important;
    font-weight:600!important;
    line-height:1!important;
  }

  body .app-shell > .topbar .traube-pomodoro-toggle{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-width:78px!important;
    padding:0 10px!important;
  }

  body .app-shell > .topbar .traube-notification-toggle,
  body .app-shell > .topbar .traube-profile-toggle{
    display:grid!important;
    place-items:center!important;
    width:43px!important;
    min-width:43px!important;
    max-width:43px!important;
    padding:0!important;
    line-height:1!important;
  }

  body .app-shell > .topbar .traube-notification-toggle svg{
    display:block!important;
    width:20px!important;
    height:20px!important;
    margin:0!important;
    transform:none!important;
  }

  body .app-shell > .topbar .traube-profile-toggle{
    font-size:16px!important;
    text-align:center!important;
  }

  body .app-shell > .topbar :is(svg,span,strong,small){
    color:#fff!important;
  }

  body .app-shell > .topbar .traube-alex-topbar:hover,
  body .app-shell > .topbar .traube-pomodoro-toggle:hover,
  body .app-shell > .topbar .traube-notification-toggle:hover,
  body .app-shell > .topbar .traube-profile-toggle:hover{
    background:rgba(255,255,255,.17)!important;
    border-color:rgba(255,255,255,.40)!important;
  }

  /* Busca visual removida em todas as páginas; atalho permanece. */
  body .app-shell > .topbar #traube-global-search,
  body .app-shell > .topbar [data-global-search-trigger],
  body .app-shell > .topbar .global-search-trigger,
  body .app-shell > .topbar .traube-global-search-trigger{
    display:none!important;
  }
}

/* Mobile/PWA continua usando seu layout próprio. */
@media (max-width:980px){
  body .app-shell > .topbar.traube-global-shell-topbar{
    position:sticky!important;
    top:0!important;
  }
}


/* TRAUBE GLOBAL SCROLL — INSET THUMB ONLY v70 — 2026-10-04 */
@media (min-width:981px){
  /* A borda branca externa não rola. O scroll acontece dentro da página,
     recuado da curva direita, igual ao padrão aprovado no Dashboard. */
  body .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    overflow:hidden!important;
    padding-right:6px!important;
  }

  body .main > .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    width:calc(100% - 12px)!important;
    max-width:calc(100% - 12px)!important;
    height:100%!important;
    min-height:0!important;
    margin:0 12px 0 0!important;
    padding-right:2px!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    scrollbar-gutter:auto!important;
    box-sizing:border-box!important;
  }

  /* Somente o thumb: sem trilho, fundo, setas ou canto. */
  body .main > .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    scrollbar-width:thin!important;
    scrollbar-color:color-mix(in srgb,var(--accent) 72%,transparent) transparent!important;
  }

  body .main > .page::-webkit-scrollbar{
    width:7px!important;
    height:7px!important;
    background:transparent!important;
  }

  body .main > .page::-webkit-scrollbar-track,
  body .main > .page::-webkit-scrollbar-track-piece,
  body .main > .page::-webkit-scrollbar-corner{
    background:transparent!important;
    background-color:transparent!important;
    border:0!important;
    outline:0!important;
    box-shadow:none!important;
  }

  body .main > .page::-webkit-scrollbar-thumb{
    background:color-mix(in srgb,var(--accent) 72%,transparent)!important;
    border:0!important;
    border-radius:999px!important;
    box-shadow:none!important;
    min-height:34px!important;
  }

  body .main > .page::-webkit-scrollbar-button,
  body .main > .page::-webkit-scrollbar-button:single-button,
  body .main > .page::-webkit-scrollbar-button:double-button{
    display:none!important;
    width:0!important;
    height:0!important;
    min-width:0!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    background:transparent!important;
    background-image:none!important;
    border:0!important;
    box-shadow:none!important;
  }
}

/* No mobile/PWA, mantém o comportamento nativo para não alterar gestos. */
@media (max-width:980px){
  body .main > .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    scrollbar-width:auto;
  }
}


/* TRAUBE GLOBAL SHELL — APPROVED SIZE + WHITE BRAND v72 — 2026-10-04 */
@media (min-width:981px){
  /* Tamanho aprovado do container: topo 10px, laterais/base 5px. */
  body .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    width:auto!important;
    max-width:none!important;
    height:calc(100dvh - 15px)!important;
    min-height:0!important;
    margin-top:10px!important;
    margin-left:5px!important;
    margin-right:5px!important;
    margin-bottom:5px!important;
    padding:64px 3px 3px!important;
    border-radius:24px!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  /* Mantém a área branca ocupando toda a largura interna disponível. */
  body #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    width:auto!important;
    min-width:0!important;
    height:100%!important;
    margin:0!important;
    border-radius:18px 0 0 18px!important;
    overflow:visible!important;
    background:var(--sidebar)!important;
    background-clip:padding-box!important;
  }

  body .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    width:auto!important;
    max-width:none!important;
    height:100%!important;
    min-height:0!important;
    margin:0!important;
    border-radius:0 18px 18px 0!important;
    background:var(--surface)!important;
    background-clip:padding-box!important;
    box-sizing:border-box!important;
  }

  /* Marca correta na faixa azul: ícone TRAUBE branco + wordmark branco. */
  body #sidebar.sidebar .sidebar-top{
    position:absolute!important;
    top:-58px!important;
    left:10px!important;
    right:auto!important;
    height:52px!important;
    display:flex!important;
    align-items:center!important;
    overflow:visible!important;
    z-index:2147483000!important;
  }

  body #sidebar.sidebar .brand{
    display:flex!important;
    align-items:center!important;
    gap:9px!important;
    color:#fff!important;
    overflow:visible!important;
  }

  body #sidebar.sidebar .brand .traube-theme-logo,
  body #sidebar.sidebar #traube-brand-logo{
    display:block!important;
    width:48.4px!important;
    height:48.4px!important;
    min-width:48.4px!important;
    min-height:48.4px!important;
    flex:0 0 48.4px!important;
    object-fit:contain!important;
    opacity:1!important;
    visibility:visible!important;
    filter:brightness(0) invert(1)!important;
  }

  body #sidebar.sidebar .brand .brand-copy,
  body #sidebar.sidebar .brand .brand-copy strong,
  body #sidebar.sidebar .brand .brand-copy small{
    display:block!important;
    color:#fff!important;
    visibility:visible!important;
    opacity:1!important;
  }

  body #sidebar.sidebar .brand .brand-copy strong{
    font-size:18px!important;
    line-height:1!important;
  }

  body #sidebar.sidebar .brand .brand-copy small{
    margin-top:2px!important;
    font-size:9px!important;
    line-height:1.15!important;
    opacity:.92!important;
  }
}


/* TRAUBE HEADER — WHITE LOGO + ALL-WHITE TIMER v73 — 2026-10-04 */
@media (min-width:981px){
  /* Logo sempre branca na faixa superior. */
  body #sidebar.sidebar .brand .traube-theme-logo,
  body #sidebar.sidebar #traube-brand-logo{
    filter:brightness(0) invert(1)!important;
    opacity:1!important;
  }

  /* Timer inteiro branco: ícone, título e tempo/subtítulo. */
  body .app-shell > .topbar .traube-pomodoro-toggle,
  body .topbar .traube-pomodoro-toggle{
    color:#fff!important;
    border-color:rgba(255,255,255,.28)!important;
    background:rgba(255,255,255,.10)!important;
  }

  body .app-shell > .topbar .traube-pomodoro-toggle *,
  body .topbar .traube-pomodoro-toggle *{
    color:#fff!important;
  }

  body .app-shell > .topbar .traube-pomodoro-copy,
  body .app-shell > .topbar .traube-pomodoro-copy strong,
  body .app-shell > .topbar .traube-pomodoro-copy small,
  body .topbar .traube-pomodoro-copy,
  body .topbar .traube-pomodoro-copy strong,
  body .topbar .traube-pomodoro-copy small{
    color:#fff!important;
    opacity:1!important;
  }

  body .app-shell > .topbar .traube-pomodoro-icon,
  body .app-shell > .topbar .traube-pomodoro-icon svg,
  body .topbar .traube-pomodoro-icon,
  body .topbar .traube-pomodoro-icon svg{
    color:#fff!important;
    stroke:#fff!important;
    fill:none!important;
    opacity:1!important;
  }

  body .app-shell > .topbar .traube-pomodoro-icon svg *,
  body .topbar .traube-pomodoro-icon svg *{
    stroke:#fff!important;
  }

  body .app-shell > .topbar .traube-pomodoro-toggle:hover,
  body .app-shell > .topbar .traube-pomodoro-toggle[aria-expanded="true"],
  body .topbar .traube-pomodoro-toggle:hover,
  body .topbar .traube-pomodoro-toggle[aria-expanded="true"]{
    color:#fff!important;
    background:rgba(255,255,255,.17)!important;
    border-color:rgba(255,255,255,.40)!important;
  }
}


/* TRAUBE GLOBAL SHELL HARD LOCK v75 — 2026-10-04 */
@media (min-width:981px){
  body.traube-global-shell-mounted{
    overflow:hidden!important;
    background:var(--traube-master-shell,#184888)!important;
  }

  body.traube-global-shell-mounted > .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body.traube-global-shell-mounted .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
    display:grid!important;
    grid-template-columns:270px minmax(0,1fr)!important;
    grid-template-rows:minmax(0,1fr)!important;
    width:auto!important;
    max-width:none!important;
    height:calc(100dvh - 15px)!important;
    min-height:0!important;
    margin:10px 5px 5px!important;
    padding:64px 3px 3px!important;
    overflow:hidden!important;
    border:0!important;
    border-radius:24px!important;
    background:var(--traube-master-shell,#184888)!important;
    box-shadow:none!important;
    box-sizing:border-box!important;
  }

  body.traube-global-shell-mounted .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    inset:0 0 auto 0!important;
    height:70px!important;
    border-radius:24px 24px 0 0!important;
    background:var(--traube-master-shell,#184888)!important;
    background-image:none!important;
    transform:none!important;
    opacity:1!important;
    pointer-events:none!important;
    z-index:0!important;
  }

  body.traube-global-shell-mounted .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::after{
    content:none!important;
    display:none!important;
  }

  body.traube-global-shell-mounted #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body.traube-global-shell-mounted.sidebar-hidden #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body.traube-global-shell-mounted.sidebar-collapsed #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    display:block!important;
    position:relative!important;
    inset:auto!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    height:100%!important;
    min-height:0!important;
    margin:0!important;
    padding:16px 14px 14px!important;
    transform:none!important;
    translate:none!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    overflow:visible!important;
    border:0!important;
    border-right:1px solid var(--border)!important;
    border-radius:18px 0 0 18px!important;
    background:var(--sidebar)!important;
    box-shadow:none!important;
    box-sizing:border-box!important;
    z-index:2!important;
  }

  body.traube-global-shell-mounted .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    display:block!important;
    position:relative!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    height:100%!important;
    min-height:0!important;
    margin:0!important;
    padding:16px 6px 18px 18px!important;
    transform:none!important;
    overflow:hidden!important;
    border:0!important;
    border-radius:0 18px 18px 0!important;
    background:var(--surface)!important;
    box-shadow:none!important;
    box-sizing:border-box!important;
    z-index:2!important;
  }

  body.traube-global-shell-mounted .main > .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    display:block!important;
    width:calc(100% - 12px)!important;
    max-width:calc(100% - 12px)!important;
    height:100%!important;
    min-height:0!important;
    margin:0 12px 0 0!important;
    padding-right:2px!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    background:transparent!important;
    box-sizing:border-box!important;
    scrollbar-width:thin!important;
    scrollbar-color:color-mix(in srgb,var(--accent) 72%,transparent) transparent!important;
  }

  body.traube-global-shell-mounted .main > .page::-webkit-scrollbar{
    width:7px!important;
    height:7px!important;
    background:transparent!important;
  }
  body.traube-global-shell-mounted .main > .page::-webkit-scrollbar-track,
  body.traube-global-shell-mounted .main > .page::-webkit-scrollbar-track-piece,
  body.traube-global-shell-mounted .main > .page::-webkit-scrollbar-corner{
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
  }
  body.traube-global-shell-mounted .main > .page::-webkit-scrollbar-thumb{
    background:color-mix(in srgb,var(--accent) 72%,transparent)!important;
    border:0!important;
    border-radius:999px!important;
  }
  body.traube-global-shell-mounted .main > .page::-webkit-scrollbar-button{
    display:none!important;
    width:0!important;
    height:0!important;
  }

  body.traube-global-shell-mounted #sidebar.sidebar .sidebar-top{
    display:flex!important;
    position:absolute!important;
    top:-58px!important;
    left:10px!important;
    right:auto!important;
    width:auto!important;
    height:52px!important;
    margin:0!important;
    padding:0!important;
    align-items:center!important;
    overflow:visible!important;
    z-index:2147483000!important;
  }

  body.traube-global-shell-mounted #sidebar.sidebar .brand .traube-theme-logo,
  body.traube-global-shell-mounted #sidebar.sidebar #traube-brand-logo{
    display:block!important;
    width:48.4px!important;
    height:48.4px!important;
    min-width:48.4px!important;
    min-height:48.4px!important;
    flex:0 0 48.4px!important;
    filter:brightness(0) invert(1)!important;
    opacity:1!important;
    visibility:visible!important;
  }

  body.traube-global-shell-mounted .app-shell > .topbar.traube-global-shell-topbar,
  body.traube-global-shell-mounted .app-shell > .topbar.dashboard-shell-topbar{
    display:flex!important;
    position:absolute!important;
    top:8px!important;
    left:270px!important;
    right:12px!important;
    bottom:auto!important;
    width:auto!important;
    height:48px!important;
    min-height:48px!important;
    max-height:48px!important;
    margin:0!important;
    padding:0!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:10px!important;
    overflow:visible!important;
    visibility:visible!important;
    opacity:1!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    transform:none!important;
    z-index:2147483200!important;
  }

  body.traube-global-shell-mounted .app-shell > .topbar .page-heading{
    display:none!important;
  }

  body.traube-global-shell-mounted .app-shell > .topbar .traube-notifications{
    display:flex!important;
    position:static!important;
    inset:auto!important;
    width:auto!important;
    height:43px!important;
    margin:0!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:10px!important;
    transform:none!important;
    visibility:visible!important;
    opacity:1!important;
  }

  body.traube-global-shell-mounted .app-shell > .topbar .traube-pomodoro-toggle,
  body.traube-global-shell-mounted .app-shell > .topbar .traube-pomodoro-toggle *,
  body.traube-global-shell-mounted .app-shell > .topbar .traube-pomodoro-icon,
  body.traube-global-shell-mounted .app-shell > .topbar .traube-pomodoro-icon svg,
  body.traube-global-shell-mounted .app-shell > .topbar .traube-pomodoro-icon svg *{
    color:#fff!important;
    stroke:#fff!important;
  }
}


/* TRAUBE TIMER — WHITE OUTSIDE, READABLE PANEL v76 — 2026-10-04 */
@media (min-width:981px){
  /* Botão fechado do Timer: absolutamente tudo branco sobre a faixa azul. */
  body .topbar .traube-pomodoro-toggle,
  body .app-shell > .topbar .traube-pomodoro-toggle{
    color:#fff!important;
  }

  body .topbar .traube-pomodoro-toggle .traube-pomodoro-copy,
  body .topbar .traube-pomodoro-toggle .traube-pomodoro-copy strong,
  body .topbar .traube-pomodoro-toggle .traube-pomodoro-copy small,
  body .app-shell > .topbar .traube-pomodoro-toggle .traube-pomodoro-copy,
  body .app-shell > .topbar .traube-pomodoro-toggle .traube-pomodoro-copy strong,
  body .app-shell > .topbar .traube-pomodoro-toggle .traube-pomodoro-copy small{
    color:#fff!important;
    opacity:1!important;
  }

  body .topbar .traube-pomodoro-toggle .traube-pomodoro-icon,
  body .topbar .traube-pomodoro-toggle .traube-pomodoro-icon svg,
  body .topbar .traube-pomodoro-toggle .traube-pomodoro-icon svg *,
  body .app-shell > .topbar .traube-pomodoro-toggle .traube-pomodoro-icon,
  body .app-shell > .topbar .traube-pomodoro-toggle .traube-pomodoro-icon svg,
  body .app-shell > .topbar .traube-pomodoro-toggle .traube-pomodoro-icon svg *{
    color:#fff!important;
    stroke:#fff!important;
    opacity:1!important;
  }

  /* Painel aberto: volta a obedecer as cores do tema e nunca herda branco do topo. */
  body .traube-pomodoro-panel,
  body .traube-pomodoro-panel *{
    color:var(--color-text-primary,var(--text))!important;
  }

  body .traube-pomodoro-panel header strong,
  body .traube-pomodoro-panel .traube-pomodoro-time{
    color:var(--color-text-primary,var(--text))!important;
  }

  body .traube-pomodoro-panel header small,
  body .traube-pomodoro-panel .traube-stopwatch-note,
  body .traube-pomodoro-panel .traube-pomodoro-status,
  body .traube-pomodoro-panel .traube-pomodoro-fields label,
  body .traube-pomodoro-panel .traube-timer-switch button:not([aria-pressed="true"]),
  body .traube-pomodoro-panel .traube-pomodoro-modes button:not([aria-pressed="true"]){
    color:var(--color-text-secondary,var(--muted))!important;
  }

  body .traube-pomodoro-panel .traube-timer-switch button[aria-pressed="true"]{
    color:var(--accent)!important;
  }

  body .traube-pomodoro-panel .traube-pomodoro-modes button[aria-pressed="true"],
  body .traube-pomodoro-panel .traube-pomodoro-save{
    color:#fff!important;
  }

  body .traube-pomodoro-panel input{
    color:var(--text)!important;
    background:var(--surface)!important;
  }

  body .traube-pomodoro-panel button:not(.traube-pomodoro-save):not([aria-pressed="true"]){
    color:var(--text)!important;
  }
}


/* TRAUBE DARK SHELL — STATIC EDGES + INNER LOGO PATTERN v77 — 2026-10-04 */
@media (min-width:981px){
  /* A moldura externa deve ser totalmente estática. */
  body.traube-global-shell-mounted,
  body.traube-global-shell-mounted .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body.traube-global-shell-mounted .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before{
    transform:none!important;
    translate:none!important;
    animation:none!important;
    transition:none!important;
    background-position:0 0!important;
  }

  body.traube-global-shell-mounted::before,
  body.traube-global-shell-mounted::after{
    content:none!important;
    display:none!important;
    animation:none!important;
    transition:none!important;
    transform:none!important;
  }

  :root[data-theme="dark"] body.traube-global-shell-mounted,
  :root[data-theme="dark"] body.traube-global-shell-mounted .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  :root[data-theme="dark"] body.traube-global-shell-mounted .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before{
    background:#142A44!important;
    background-color:#142A44!important;
    background-image:none!important;
    border-color:transparent!important;
    box-shadow:none!important;
  }

  /* O pattern passa a existir SOMENTE dentro do painel principal. */
  body.traube-global-shell-mounted .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
    isolation:isolate!important;
    overflow:hidden!important;
    background:var(--surface)!important;
    background-image:none!important;
  }

  body.traube-global-shell-mounted .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    inset:0!important;
    z-index:0!important;
    pointer-events:none!important;
    background-image:url("../../assets/img/logos/logo-icone-original.png?v=busto20261102")!important;
    background-repeat:repeat!important;
    background-size:132px 132px!important;
    background-position:0 0!important;
    opacity:.018!important;
    transform:none!important;
    animation:none!important;
    transition:none!important;
  }

  :root[data-theme="dark"] body.traube-global-shell-mounted .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before{
    background-image:url("../../assets/img/logos/logo-icone-azul-claro.png?v=busto20261102")!important;
    background-size:132px 132px!important;
    background-position:0 0!important;
    opacity:.038!important;
  }

  :root[data-theme="leila-mood"] body.traube-global-shell-mounted .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before{
    background-image:url("../../assets/img/logos/logo-icone-rosa-escuro.png?v=busto20261102")!important;
    background-size:132px 132px!important;
    background-position:0 0!important;
    opacity:.024!important;
  }

  body.traube-global-shell-mounted .main > .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
    z-index:1!important;
    background:transparent!important;
  }

  /* Nada pode animar a borda/cantos externos no tema escuro. */
  :root[data-theme="dark"] body.traube-global-shell-mounted .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  :root[data-theme="dark"] body.traube-global-shell-mounted #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  :root[data-theme="dark"] body.traube-global-shell-mounted .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    outline:0!important;
    box-shadow:none!important;
    transition:none!important;
    animation:none!important;
  }
}


/* TRAUBE GLOBAL CONTENT PATTERN — EXACT DASHBOARD v78 — 2026-10-04 */
@media (min-width:981px){
  /* Fora do Dashboard, replica EXATAMENTE o pattern aprovado da página inicial. */
  body.traube-global-shell-mounted:not([data-page="dashboard"]) .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
    isolation:isolate!important;
    background-color:var(--surface)!important;
    background-image:
      linear-gradient(
        color-mix(in srgb,var(--surface) 93%,transparent),
        color-mix(in srgb,var(--surface) 93%,transparent)
      ),
      url("../../assets/img/logos/logo-icone-original.png?v=busto20261102"),
      url("../../assets/img/logos/logo-icone-original.png?v=busto20261102")!important;
    background-repeat:no-repeat,repeat,repeat!important;
    background-size:100% 100%,138px 138px,138px 138px!important;
    background-position:0 0,0 0,69px 69px!important;
  }

  :root[data-theme="dark"] body.traube-global-shell-mounted:not([data-page="dashboard"]) .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    background-image:
      linear-gradient(
        color-mix(in srgb,var(--surface) 92%,transparent),
        color-mix(in srgb,var(--surface) 92%,transparent)
      ),
      url("../../assets/img/logos/logo-icone-azul-claro.png?v=busto20261102"),
      url("../../assets/img/logos/logo-icone-azul-claro.png?v=busto20261102")!important;
  }

  :root[data-theme="leila-mood"] body.traube-global-shell-mounted:not([data-page="dashboard"]) .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    background-image:
      linear-gradient(
        color-mix(in srgb,var(--surface) 92.5%,transparent),
        color-mix(in srgb,var(--surface) 92.5%,transparent)
      ),
      url("../../assets/img/logos/logo-icone-rosa-escuro.png?v=busto20261102"),
      url("../../assets/img/logos/logo-icone-rosa-escuro.png?v=busto20261102")!important;
  }

  /* Remove o pattern alternativo que tinha sido colocado via pseudo-elemento. */
  body.traube-global-shell-mounted:not([data-page="dashboard"]) .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before,
  body.traube-global-shell-mounted:not([data-page="dashboard"]) .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::after{
    content:none!important;
    display:none!important;
    background:none!important;
    opacity:0!important;
    transform:none!important;
  }

  /* O conteúdo fica acima do fundo, como no Dashboard. */
  body.traube-global-shell-mounted:not([data-page="dashboard"]) .main > .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
    z-index:1!important;
    background:transparent!important;
  }
}



/* TRAUBE v80 — conteúdo sempre acima da camada de pattern/logos */
@media (min-width:981px){
  body.traube-global-shell-mounted .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
    isolation:isolate!important;
  }

  body.traube-global-shell-mounted .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before,
  body.traube-global-shell-mounted .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::after{
    z-index:0!important;
    pointer-events:none!important;
  }

  body.traube-global-shell-mounted .main > .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
    z-index:10!important;
    isolation:isolate!important;
  }

  body.traube-global-shell-mounted .main > .page > *{
    position:relative;
    z-index:1;
  }
}


/* TRAUBE v81 — corrige a fita inferior global do shell.
   O painel principal agora ocupa a base inteira; a borda azul não corta o último callout. */
@media (min-width:981px){
  body.traube-global-shell-mounted > .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body.traube-global-shell-mounted .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    padding-bottom:0!important;
  }

  body.traube-global-shell-mounted #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body.traube-global-shell-mounted.sidebar-hidden #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body.traube-global-shell-mounted.sidebar-collapsed #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body.traube-global-shell-mounted .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    height:100%!important;
    min-height:0!important;
  }

  body.traube-global-shell-mounted .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    border-radius:0 18px 21px 0!important;
  }

  body.traube-global-shell-mounted #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    border-radius:18px 0 0 21px!important;
  }

  body.traube-global-shell-mounted .main > .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
    z-index:20!important;
    padding-bottom:18px!important;
    scroll-padding-bottom:18px!important;
  }

  body.traube-global-shell-mounted .main > .page > *{
    position:relative;
    z-index:2;
  }
}


/* TRAUBE v82 — correção estrutural da base global.
   A faixa azul inferior deixa de recortar o conteúdo: o painel branco cobre a base
   e a rolagem acontece dentro da página, acima do fundo decorativo. */
@media (min-width:981px){
  body.traube-global-shell-mounted > .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body.traube-global-shell-mounted .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    /* azul só no topo; não existe mais pintura azul na base do shell */
    background:transparent!important;
    padding-bottom:0!important;
    overflow:visible!important;
  }

  body.traube-global-shell-mounted .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before{
    /* mantém apenas a faixa azul superior */
    z-index:0!important;
  }

  body.traube-global-shell-mounted #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body.traube-global-shell-mounted.sidebar-hidden #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body.traube-global-shell-mounted.sidebar-collapsed #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body.traube-global-shell-mounted .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    /* os painéis internos passam a ocupar até a borda inferior real */
    align-self:stretch!important;
    height:auto!important;
    min-height:0!important;
    margin-bottom:0!important;
    z-index:2!important;
  }

  body.traube-global-shell-mounted .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    overflow:hidden!important;
    border-radius:0 18px 24px 0!important;
  }

  body.traube-global-shell-mounted #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    border-radius:18px 0 0 24px!important;
  }

  body.traube-global-shell-mounted .main > .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    height:100%!important;
    max-height:100%!important;
    min-height:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding-bottom:24px!important;
    scroll-padding-bottom:24px!important;
    position:relative!important;
    z-index:20!important;
  }

  /* Nenhum container de página pode ser recortado pela borda inferior do shell. */
  body.traube-global-shell-mounted .main > .page > :last-child{
    margin-bottom:0!important;
  }
}


/* TRAUBE v83 — scrollport global sem faixas superior/inferior.
   O recorte vinha do padding vertical do .main: a .page rolava dentro de uma
   janela menor, deixando uma faixa fixa acima e abaixo. O scrollport agora
   ocupa 100% da altura; o respiro passa para dentro da própria página. */
@media (min-width:981px){
  body.traube-global-shell-mounted .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    padding-top:0!important;
    padding-bottom:0!important;
    border-top:0!important;
    border-bottom:0!important;
    outline:0!important;
    box-shadow:none!important;
  }

  body.traube-global-shell-mounted .main > .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    height:100%!important;
    max-height:100%!important;
    min-height:0!important;
    margin-top:0!important;
    margin-bottom:0!important;
    padding-top:16px!important;
    padding-bottom:18px!important;
    border:0!important;
    border-top:0!important;
    border-bottom:0!important;
    border-radius:0!important;
    outline:0!important;
    box-shadow:none!important;
    clip-path:none!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    box-sizing:border-box!important;
  }

  body.traube-global-shell-mounted .main > .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before,
  body.traube-global-shell-mounted .main > .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::after{
    content:none!important;
    display:none!important;
  }
}


/* TRAUBE v84 — replica no site normal a lógica que resolveu o Dashboard 1.
   A .page deixa de ser uma "janela" recortada; o scroll sobe um nível para .main.
   Assim não existe faixa fixa superior/inferior atravessando os callouts. */
@media (min-width:981px){
  /* Restaura o shell normal: a alteração anterior na base não era a causa. */
  body.traube-global-shell-mounted > .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body.traube-global-shell-mounted .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    background:var(--traube-master-shell,#184888)!important;
    overflow:hidden!important;
  }

  /* Mesmo princípio do Dashboard 1: a camada que contém os cards não os recorta. */
  body.traube-global-shell-mounted .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
    isolation:isolate!important;
    height:100%!important;
    min-height:0!important;
    padding-top:0!important;
    padding-bottom:0!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    border-top:0!important;
    border-bottom:0!important;
    box-shadow:none!important;
    scrollbar-width:thin!important;
    scrollbar-color:color-mix(in srgb,var(--accent) 72%,transparent) transparent!important;
  }

  /* A página vira apenas conteúdo em fluxo normal, sem viewport próprio. */
  body.traube-global-shell-mounted .main > .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    display:block!important;
    width:calc(100% - 12px)!important;
    max-width:calc(100% - 12px)!important;
    height:auto!important;
    max-height:none!important;
    min-height:100%!important;
    margin:0 12px 0 0!important;
    padding-top:16px!important;
    padding-right:2px!important;
    padding-bottom:18px!important;
    overflow:visible!important;
    border:0!important;
    border-radius:0!important;
    outline:0!important;
    box-shadow:none!important;
    clip-path:none!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
    position:relative!important;
    z-index:20!important;
    isolation:isolate!important;
    box-sizing:border-box!important;
  }

  /* Igual ao Dashboard 1: decoração atrás, conteúdo sempre à frente. */
  body.traube-global-shell-mounted .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before,
  body.traube-global-shell-mounted .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::after{
    z-index:0!important;
    pointer-events:none!important;
  }

  body.traube-global-shell-mounted .main > .page > *{
    position:relative;
    z-index:1;
  }

  body.traube-global-shell-mounted .main > .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before,
  body.traube-global-shell-mounted .main > .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::after{
    content:none!important;
    display:none!important;
  }

  body.traube-global-shell-mounted .main::-webkit-scrollbar{
    width:7px!important;
    height:7px!important;
    background:transparent!important;
  }
  body.traube-global-shell-mounted .main::-webkit-scrollbar-track,
  body.traube-global-shell-mounted .main::-webkit-scrollbar-track-piece,
  body.traube-global-shell-mounted .main::-webkit-scrollbar-corner{
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
  }
  body.traube-global-shell-mounted .main::-webkit-scrollbar-thumb{
    background:color-mix(in srgb,var(--accent) 72%,transparent)!important;
    border:0!important;
    border-radius:999px!important;
  }
  body.traube-global-shell-mounted .main::-webkit-scrollbar-button{
    display:none!important;
    width:0!important;
    height:0!important;
  }
}


/* TRAUBE v85 — restaura a moldura aprovada do site.
   O azul é a janela fixa externa; o painel branco fica parado e SOMENTE
   o conteúdo da .page rola por dentro. O pattern pertence ao painel,
   não a uma segunda janela de conteúdo. */
@media (min-width:981px){
  body.traube-global-shell-mounted{
    overflow:hidden!important;
    background:var(--traube-master-shell,#184888)!important;
  }

  body.traube-global-shell-mounted > .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body.traube-global-shell-mounted .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
    display:grid!important;
    grid-template-columns:270px minmax(0,1fr)!important;
    grid-template-rows:minmax(0,1fr)!important;
    width:auto!important;
    max-width:none!important;
    height:calc(100dvh - 15px)!important;
    min-height:0!important;
    margin:10px 5px 5px!important;
    padding:64px 3px 3px!important;
    overflow:hidden!important;
    border:0!important;
    border-radius:24px!important;
    background:var(--traube-master-shell,#184888)!important;
    box-shadow:none!important;
    box-sizing:border-box!important;
  }

  /* filete azul igual dos dois lados e também na base */
  body.traube-global-shell-mounted #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body.traube-global-shell-mounted.sidebar-hidden #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body.traube-global-shell-mounted.sidebar-collapsed #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body.traube-global-shell-mounted .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    height:100%!important;
    min-height:0!important;
    align-self:stretch!important;
    margin:0!important;
  }

  body.traube-global-shell-mounted #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body.traube-global-shell-mounted.sidebar-hidden #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)),
  body.traube-global-shell-mounted.sidebar-collapsed #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    border-radius:18px 0 0 18px!important;
  }

  /* o container branco NÃO rola */
  body.traube-global-shell-mounted .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
    isolation:isolate!important;
    padding:0!important;
    overflow:hidden!important;
    border:0!important;
    border-radius:0 18px 18px 0!important;
    background-color:var(--surface)!important;
    box-shadow:none!important;
    box-sizing:border-box!important;
    z-index:2!important;
  }

  /* somente o conteúdo interno rola; sem criar uma segunda "janela" */
  body.traube-global-shell-mounted .main > .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
    z-index:20!important;
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:100%!important;
    max-height:100%!important;
    min-height:0!important;
    margin:0!important;
    padding:16px 18px 18px!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    outline:0!important;
    box-shadow:none!important;
    clip-path:none!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
    box-sizing:border-box!important;
    overscroll-behavior:contain!important;
    scrollbar-width:thin!important;
    scrollbar-color:color-mix(in srgb,var(--accent) 72%,transparent) transparent!important;
  }

  body.traube-global-shell-mounted .main > .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before,
  body.traube-global-shell-mounted .main > .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::after{
    content:none!important;
    display:none!important;
  }

  body.traube-global-shell-mounted .main > .page::-webkit-scrollbar{
    width:7px!important;
    height:7px!important;
    background:transparent!important;
  }
  body.traube-global-shell-mounted .main > .page::-webkit-scrollbar-track,
  body.traube-global-shell-mounted .main > .page::-webkit-scrollbar-track-piece,
  body.traube-global-shell-mounted .main > .page::-webkit-scrollbar-corner{
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
  }
  body.traube-global-shell-mounted .main > .page::-webkit-scrollbar-thumb{
    background:color-mix(in srgb,var(--accent) 72%,transparent)!important;
    border:0!important;
    border-radius:999px!important;
  }
  body.traube-global-shell-mounted .main > .page::-webkit-scrollbar-button{
    display:none!important;
    width:0!important;
    height:0!important;
  }

  /* v84 colocou o scroll no .main; desativa isso definitivamente. */
  body.traube-global-shell-mounted .main::-webkit-scrollbar{
    width:0!important;
    height:0!important;
    display:none!important;
  }
}


/* TRAUBE SCROLLBAR — NO ARROW BUTTONS HARD LOCK v2026.10.05
   Remove qualquer botão/seta nativa de scrollbar em TODA área rolável. */
html::-webkit-scrollbar-button,
body::-webkit-scrollbar-button,
body *::-webkit-scrollbar-button,
html::-webkit-scrollbar-button:single-button,
body::-webkit-scrollbar-button:single-button,
body *::-webkit-scrollbar-button:single-button,
html::-webkit-scrollbar-button:double-button,
body::-webkit-scrollbar-button:double-button,
body *::-webkit-scrollbar-button:double-button,
html::-webkit-scrollbar-button:vertical,
body::-webkit-scrollbar-button:vertical,
body *::-webkit-scrollbar-button:vertical,
html::-webkit-scrollbar-button:horizontal,
body::-webkit-scrollbar-button:horizontal,
body *::-webkit-scrollbar-button:horizontal,
html::-webkit-scrollbar-button:vertical:decrement,
html::-webkit-scrollbar-button:vertical:increment,
body::-webkit-scrollbar-button:vertical:decrement,
body::-webkit-scrollbar-button:vertical:increment,
body *::-webkit-scrollbar-button:vertical:decrement,
body *::-webkit-scrollbar-button:vertical:increment,
html::-webkit-scrollbar-button:horizontal:decrement,
html::-webkit-scrollbar-button:horizontal:increment,
body::-webkit-scrollbar-button:horizontal:decrement,
body::-webkit-scrollbar-button:horizontal:increment,
body *::-webkit-scrollbar-button:horizontal:decrement,
body *::-webkit-scrollbar-button:horizontal:increment,
html::-webkit-scrollbar-button:start,
html::-webkit-scrollbar-button:end,
body::-webkit-scrollbar-button:start,
body::-webkit-scrollbar-button:end,
body *::-webkit-scrollbar-button:start,
body *::-webkit-scrollbar-button:end{
  -webkit-appearance:none!important;
  appearance:none!important;
  display:none!important;
  width:0!important;
  height:0!important;
  min-width:0!important;
  min-height:0!important;
  max-width:0!important;
  max-height:0!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}


/* TRAUBE v86 — scrollbar embutida no painel branco
   Mantém a barra dentro do callout/painel branco, sem tocar a moldura azul.
   O trilho fica totalmente transparente para não deformar a borda direita. */
@media (min-width:981px){
  body.traube-global-shell-mounted .main > .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    width:calc(100% - 8px)!important;
    max-width:calc(100% - 8px)!important;
    margin:0 8px 0 0!important;
    padding-right:10px!important;
    background:transparent!important;
    border-radius:0!important;
    scrollbar-width:thin!important;
    scrollbar-color:color-mix(in srgb,var(--accent) 72%,transparent) transparent!important;
  }

  body.traube-global-shell-mounted .main > .page::-webkit-scrollbar{
    width:7px!important;
    height:7px!important;
    background:transparent!important;
  }

  body.traube-global-shell-mounted .main > .page::-webkit-scrollbar-track,
  body.traube-global-shell-mounted .main > .page::-webkit-scrollbar-track-piece,
  body.traube-global-shell-mounted .main > .page::-webkit-scrollbar-corner{
    background:transparent!important;
    background-color:transparent!important;
    border:0!important;
    outline:0!important;
    box-shadow:none!important;
  }

  body.traube-global-shell-mounted .main > .page::-webkit-scrollbar-thumb{
    background:color-mix(in srgb,var(--accent) 72%,transparent)!important;
    border:0!important;
    border-radius:999px!important;
    box-shadow:none!important;
  }
}


/* TRAUBE v86 — scrollbar interna ao painel branco
   A barra fica alguns pixels para dentro da borda arredondada, nunca sobre o filete azul.
   Trilho/canto continuam totalmente transparentes. */
@media (min-width:981px){
  body.traube-global-shell-mounted .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    padding-right:6px!important;
    background-color:var(--surface)!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  body.traube-global-shell-mounted .main > .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    width:100%!important;
    max-width:100%!important;
    height:100%!important;
    max-height:100%!important;
    margin:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    box-sizing:border-box!important;
    scrollbar-width:thin!important;
    scrollbar-color:color-mix(in srgb,var(--accent) 72%,transparent) transparent!important;
  }

  body.traube-global-shell-mounted .main > .page::-webkit-scrollbar{
    width:7px!important;
    background:transparent!important;
  }
  body.traube-global-shell-mounted .main > .page::-webkit-scrollbar-track,
  body.traube-global-shell-mounted .main > .page::-webkit-scrollbar-track-piece,
  body.traube-global-shell-mounted .main > .page::-webkit-scrollbar-corner{
    background:transparent!important;
    background-color:transparent!important;
    border:0!important;
    box-shadow:none!important;
  }
  body.traube-global-shell-mounted .main > .page::-webkit-scrollbar-thumb{
    background:color-mix(in srgb,var(--accent) 72%,transparent)!important;
    border:0!important;
    border-radius:999px!important;
  }
}


/* TRAUBE v87 — logo única e compacta em todas as páginas */
body #sidebar.sidebar .brand .traube-theme-logo,
body #sidebar.sidebar .brand #traube-brand-logo,
body #sidebar.sidebar #traube-brand-logo{
  width:46px!important;
  height:46px!important;
  min-width:46px!important;
  min-height:46px!important;
  max-width:46px!important;
  max-height:46px!important;
  flex:0 0 46px!important;
  object-fit:contain!important;
}


/* TRAUBE v88 — rodapé da sidebar: geometria autoritativa */
@media (min-width:981px){
  body #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:sticky!important;
    top:0!important;
    height:100dvh!important;
    max-height:100dvh!important;
    overflow:hidden!important;
  }

  body #sidebar.sidebar .sidebar-footer,
  body #sidebar.sidebar .sidebar-footer-study,
  body #sidebar.sidebar .sidebar-footer-work,
  body[data-page^="trabalho_"] #sidebar.sidebar .sidebar-footer{
    position:absolute!important;
    left:18px!important;
    right:18px!important;
    bottom:8px!important;
    top:auto!important;
    inset-block-end:8px!important;
    width:auto!important;
    height:124px!important;
    min-height:124px!important;
    max-height:124px!important;
    margin:0!important;
    padding:0!important;
    display:block!important;
    align-self:auto!important;
    background:transparent!important;
    transform:none!important;
    translate:none!important;
    z-index:80!important;
    overflow:visible!important;
  }

  body #sidebar.sidebar .traube-mode-footer-switch{
    position:absolute!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    top:auto!important;
    inset:auto 0 0 0!important;
    width:100%!important;
    height:58px!important;
    min-height:58px!important;
    max-height:58px!important;
    margin:0!important;
    transform:none!important;
    translate:none!important;
  }

  body #sidebar.sidebar .streak-mini,
  body[data-page^="trabalho_"] #sidebar.sidebar .work-pcr-button{
    position:absolute!important;
    left:0!important;
    right:0!important;
    bottom:66px!important;
    top:auto!important;
    inset:auto 0 66px 0!important;
    width:100%!important;
    height:58px!important;
    min-height:58px!important;
    max-height:58px!important;
    margin:0!important;
    transform:none!important;
    translate:none!important;
  }

  body #sidebar.sidebar .nav,
  body #sidebar.sidebar .nav-study,
  body #sidebar.sidebar .nav-work,
  body[data-page^="trabalho_"] #sidebar.sidebar .nav{
    padding-bottom:140px!important;
  }
}

@media(max-width:980px){
  html.pwa-standalone body #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:fixed!important;
    top:0!important;
    height:100dvh!important;
    max-height:100dvh!important;
    overflow:hidden!important;
  }

  html.pwa-standalone body #sidebar.sidebar .sidebar-footer,
  html.pwa-standalone body #sidebar.sidebar .sidebar-footer-study,
  html.pwa-standalone body #sidebar.sidebar .sidebar-footer-work,
  html.pwa-standalone body[data-page^="trabalho_"] #sidebar.sidebar .sidebar-footer{
    position:absolute!important;
    left:15px!important;
    right:15px!important;
    bottom:calc(8px + env(safe-area-inset-bottom))!important;
    top:auto!important;
    width:auto!important;
    height:124px!important;
    min-height:124px!important;
    max-height:124px!important;
    margin:0!important;
    padding:0!important;
    display:block!important;
    align-self:auto!important;
    background:transparent!important;
    transform:none!important;
    translate:none!important;
    z-index:80!important;
    overflow:visible!important;
  }

  html.pwa-standalone body #sidebar.sidebar .traube-mode-footer-switch{
    position:absolute!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    top:auto!important;
    width:100%!important;
    height:58px!important;
    min-height:58px!important;
    max-height:58px!important;
    margin:0!important;
  }

  html.pwa-standalone body #sidebar.sidebar .streak-mini,
  html.pwa-standalone body[data-page^="trabalho_"] #sidebar.sidebar .work-pcr-button{
    position:absolute!important;
    left:0!important;
    right:0!important;
    bottom:66px!important;
    top:auto!important;
    width:100%!important;
    height:58px!important;
    min-height:58px!important;
    max-height:58px!important;
    margin:0!important;
  }
}


/* TRAUBE v89 — remove setas/botões das scrollbars em todo o site */
html::-webkit-scrollbar-button,
body::-webkit-scrollbar-button,
body *::-webkit-scrollbar-button,
html::-webkit-scrollbar-button:single-button,
body::-webkit-scrollbar-button:single-button,
body *::-webkit-scrollbar-button:single-button,
html::-webkit-scrollbar-button:double-button,
body::-webkit-scrollbar-button:double-button,
body *::-webkit-scrollbar-button:double-button,
html::-webkit-scrollbar-button:vertical,
body::-webkit-scrollbar-button:vertical,
body *::-webkit-scrollbar-button:vertical,
html::-webkit-scrollbar-button:horizontal,
body::-webkit-scrollbar-button:horizontal,
body *::-webkit-scrollbar-button:horizontal,
html::-webkit-scrollbar-button:vertical:decrement,
html::-webkit-scrollbar-button:vertical:increment,
body::-webkit-scrollbar-button:vertical:decrement,
body::-webkit-scrollbar-button:vertical:increment,
body *::-webkit-scrollbar-button:vertical:decrement,
body *::-webkit-scrollbar-button:vertical:increment,
html::-webkit-scrollbar-button:horizontal:decrement,
html::-webkit-scrollbar-button:horizontal:increment,
body::-webkit-scrollbar-button:horizontal:decrement,
body::-webkit-scrollbar-button:horizontal:increment,
body *::-webkit-scrollbar-button:horizontal:decrement,
body *::-webkit-scrollbar-button:horizontal:increment,
html::-webkit-scrollbar-button:start,
html::-webkit-scrollbar-button:end,
body::-webkit-scrollbar-button:start,
body::-webkit-scrollbar-button:end,
body *::-webkit-scrollbar-button:start,
body *::-webkit-scrollbar-button:end{
  -webkit-appearance:none!important;
  appearance:none!important;
  display:none!important;
  width:0!important;
  height:0!important;
  min-width:0!important;
  min-height:0!important;
  max-width:0!important;
  max-height:0!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}


/* TRAUBE v90 — dashboard sidebar stable + cronograma shell parity — 2026-10-05 */
@media (min-width:981px){
  /* Dashboard: a sidebar deve medir o painel branco real, não 100dvh.
     Isso impede Ofensiva + botão Estudos de descerem quando o chrome global monta. */
  body.traube-global-shell-mounted[data-page="dashboard"][data-dashboard-layout] #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    position:relative!important;
    top:auto!important;
    bottom:auto!important;
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    align-self:stretch!important;
    margin:0!important;
    transform:none!important;
    translate:none!important;
    overflow:hidden!important;
  }

  body.traube-global-shell-mounted[data-page="dashboard"][data-dashboard-layout] #sidebar.sidebar .sidebar-footer,
  body.traube-global-shell-mounted[data-page="dashboard"][data-dashboard-layout] #sidebar.sidebar .sidebar-footer-study{
    position:absolute!important;
    left:18px!important;
    right:18px!important;
    bottom:8px!important;
    top:auto!important;
    inset-block-end:8px!important;
    height:124px!important;
    min-height:124px!important;
    max-height:124px!important;
    margin:0!important;
    transform:none!important;
    translate:none!important;
  }

  /* Cronograma: remove a exceção antiga que deixava a moldura externa transparente/branca.
     Usa exatamente a mesma cor do shell global. */
  body.traube-global-shell-mounted[data-page="cronograma"]:not(.schedule-settings-embed){
    background:var(--traube-shell-theme,#184888)!important;
    background-color:var(--traube-shell-theme,#184888)!important;
    background-image:none!important;
  }

  body.traube-global-shell-mounted[data-page="cronograma"]:not(.schedule-settings-embed) .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    background:var(--traube-shell-theme,#184888)!important;
    background-color:var(--traube-shell-theme,#184888)!important;
    background-image:none!important;
    border:0!important;
    outline:0!important;
    box-shadow:none!important;
  }

  body.traube-global-shell-mounted[data-page="cronograma"]:not(.schedule-settings-embed) .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::before{
    content:""!important;
    display:block!important;
    background:var(--traube-shell-theme,#184888)!important;
    background-color:var(--traube-shell-theme,#184888)!important;
    background-image:none!important;
  }

  body.traube-global-shell-mounted[data-page="cronograma"]:not(.schedule-settings-embed) .app-shell:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *))::after{
    content:none!important;
    display:none!important;
  }

  body.traube-global-shell-mounted[data-page="cronograma"]:not(.schedule-settings-embed) #sidebar.sidebar:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    background:var(--sidebar)!important;
  }

  body.traube-global-shell-mounted[data-page="cronograma"]:not(.schedule-settings-embed) .main:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    background-color:var(--surface)!important;
  }

  body.traube-global-shell-mounted[data-page="cronograma"]:not(.schedule-settings-embed) .main > .page:where(:not(body[data-ui-nav="v2"], body[data-ui-nav="v2"] *)){
    background:transparent!important;
  }
}


/* =========================================================
   TRAUBE v90 — TÍTULOS GLOBAIS IDÊNTICOS AO ESTATÍSTICAS
   Estatísticas é a única régua visual dos cabeçalhos de página.
   ========================================================= */
:root{
  --traube-title-card-h:138px;
  --traube-title-card-py:24px;
  --traube-title-card-px:28px;
  --traube-title-card-radius:15px;
  --traube-title-card-bottom:14px;
  --traube-title-size:32px;
  --traube-title-line:1.08;
  --traube-title-weight:900;
  --traube-title-tracking:-.8px;
  --traube-title-kicker-size:9px;
  --traube-title-sub-size:11px;
  --traube-title-copy-gap:7px;
}

/* Todos os cards de título conhecidos usam exatamente a mesma caixa. */
html body:not(.schedule-settings-embed) :is(
  .traube-page-spotlight,
  .schedule-top-spotlight,
  .error-cat-spotlight,
  .flash-top-spotlight,
  .daily-hero,
  .stats-hero
){
  position:relative!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  height:var(--traube-title-card-h)!important;
  min-height:var(--traube-title-card-h)!important;
  max-height:var(--traube-title-card-h)!important;
  flex:0 0 var(--traube-title-card-h)!important;
  margin:0 0 var(--traube-title-card-bottom) 0!important;
  padding:var(--traube-title-card-py) var(--traube-title-card-px)!important;
  box-sizing:border-box!important;
  border-radius:var(--traube-title-card-radius)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:20px!important;
  overflow:hidden!important;
  align-self:stretch!important;
}

/* Mesma régua interna do copy de Estatísticas. */
html body:not(.schedule-settings-embed) :is(
  .traube-page-spotlight-copy,
  .schedule-top-spotlight-copy,
  .error-cat-spotlight-copy,
  .flash-top-spotlight-copy,
  .daily-hero-copy,
  .stats-hero-copy
){
  position:relative!important;
  z-index:2!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:center!important;
  gap:0!important;
}

/* Título: mesma fonte, peso, tamanho, tracking e line-height. */
html body:not(.schedule-settings-embed) :is(
  .traube-page-spotlight-copy,
  .schedule-top-spotlight-copy,
  .error-cat-spotlight-copy,
  .flash-top-spotlight-copy,
  .daily-hero-copy,
  .stats-hero-copy
) > :is(strong,h1,h2),
  html body .page-heading h1,
  html body .friends-ref-hero-copy > h1{
  margin:0!important;
  padding:0!important;
  font-family:var(--font-ui,Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif)!important;
  font-size:var(--traube-title-size)!important;
  line-height:var(--traube-title-line)!important;
  font-weight:var(--traube-title-weight)!important;
  letter-spacing:var(--traube-title-tracking)!important;
  text-transform:none!important;
}

/* Label/eyebrow: distância e tipografia únicas. */
html body:not(.schedule-settings-embed) :is(
  .traube-page-spotlight-copy,
  .schedule-top-spotlight-copy,
  .error-cat-spotlight-copy,
  .flash-top-spotlight-copy,
  .daily-hero-copy,
  .stats-hero-copy
) > :is(.eyebrow,[class*="label"],[class*="eyebrow"]){
  display:block!important;
  margin:0 0 6px!important;
  padding:0!important;
  font-family:var(--font-ui,Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif)!important;
  font-size:var(--traube-title-kicker-size)!important;
  line-height:1.1!important;
  font-weight:500!important;
  letter-spacing:.09em!important;
}

/* Subtítulo/helper: mesma distância do título em qualquer página. */
html body:not(.schedule-settings-embed) :is(
  .traube-page-spotlight-copy,
  .schedule-top-spotlight-copy,
  .error-cat-spotlight-copy,
  .flash-top-spotlight-copy,
  .daily-hero-copy,
  .stats-hero-copy
) > :is(small,p,[class*="helper"],[class*="subtitle"]){
  display:block!important;
  margin:var(--traube-title-copy-gap) 0 0!important;
  padding:0!important;
  font-family:var(--font-ui,Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif)!important;
  font-size:var(--traube-title-sub-size)!important;
  line-height:1.4!important;
  font-weight:400!important;
  letter-spacing:0!important;
}

/* Amigos: título/subtítulo seguem a mesma régua tipográfica mesmo no hero próprio. */
html body .friends-ref-hero-copy > h2{
  margin:var(--traube-title-copy-gap) 0 0!important;
  font-family:var(--font-ui,Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif)!important;
  font-size:var(--traube-title-sub-size)!important;
  line-height:1.4!important;
  font-weight:400!important;
  letter-spacing:0!important;
}

/* Mobile mantém exatamente a mesma proporção usada em Estatísticas. */
@media(max-width:700px){
  :root{
    --traube-title-card-h:118px;
    --traube-title-card-py:20px;
    --traube-title-card-px:20px;
    --traube-title-size:25px;
    --traube-title-sub-size:10px;
  }
}


/* Apostilas v91 — capa/hero segue o tema; título branco no tema claro */
body[data-page="aprender"] .book-hero{
  background:linear-gradient(135deg,#184888,#2d6ab5)!important;
  border-color:color-mix(in srgb,#184888 82%,var(--border))!important;
  color:#fff!important;
}
body[data-page="aprender"] .book-hero h1{
  color:#fff!important;
}
body[data-page="aprender"] .book-hero :is(.book-badge,p,small,strong,.book-meta-row span){
  color:#fff!important;
}
body[data-page="aprender"] .book-hero .book-meta-row span,
body[data-page="aprender"] .book-hero .book-badge{
  background:rgba(255,255,255,.12)!important;
  border-color:rgba(255,255,255,.18)!important;
}

:root[data-theme="dark"] body[data-page="aprender"] .book-hero{
  background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 28%,var(--surface)),color-mix(in srgb,var(--accent) 12%,var(--surface)))!important;
  border-color:color-mix(in srgb,var(--accent) 35%,var(--border))!important;
  color:var(--text)!important;
}
:root[data-theme="dark"] body[data-page="aprender"] .book-hero h1,
:root[data-theme="dark"] body[data-page="aprender"] .book-hero :is(.book-badge,p,small,strong,.book-meta-row span){
  color:var(--text)!important;
}
:root[data-theme="dark"] body[data-page="aprender"] .book-hero .book-meta-row span,
:root[data-theme="dark"] body[data-page="aprender"] .book-hero .book-badge{
  background:color-mix(in srgb,var(--accent) 12%,var(--surface))!important;
  border-color:color-mix(in srgb,var(--accent) 26%,var(--border))!important;
}

:root[data-theme="leila-mood"] body[data-page="aprender"] .book-hero,
:root[data-theme="pink"] body[data-page="aprender"] .book-hero,
:root[data-theme="rosa"] body[data-page="aprender"] .book-hero{
  background:linear-gradient(135deg,var(--accent),var(--accent-strong))!important;
  border-color:var(--accent)!important;
  color:#fff!important;
}
:root[data-theme="leila-mood"] body[data-page="aprender"] .book-hero h1,
:root[data-theme="pink"] body[data-page="aprender"] .book-hero h1,
:root[data-theme="rosa"] body[data-page="aprender"] .book-hero h1,
:root[data-theme="leila-mood"] body[data-page="aprender"] .book-hero :is(.book-badge,p,small,strong,.book-meta-row span),
:root[data-theme="pink"] body[data-page="aprender"] .book-hero :is(.book-badge,p,small,strong,.book-meta-row span),
:root[data-theme="rosa"] body[data-page="aprender"] .book-hero :is(.book-badge,p,small,strong,.book-meta-row span){
  color:#fff!important;
}


/* TRAUBE apostilas: mobile overflow repair 2026-10-08 */
@media (max-width: 900px) {
  body[data-page="aprender"]:has(.book-page) {
    max-width: 100%;
    overflow-x: clip;
  }
  body[data-page="aprender"] .app-shell:has(.book-page),
  body[data-page="aprender"] .main:has(.book-page),
  body[data-page="aprender"] .page:has(.book-page),
  body[data-page="aprender"] .book-page,
  body[data-page="aprender"] .book-main,
  body[data-page="aprender"] .book-main > *,
  body[data-page="aprender"] .book-section,
  body[data-page="aprender"] .book-hero,
  body[data-page="aprender"] .book-outline {
    box-sizing: border-box;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  body[data-page="aprender"] .book-page {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
  }
  body[data-page="aprender"] .book-main {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
  }
  body[data-page="aprender"] .book-main :is(p, li, h1, h2, h3, h4, a, strong, span, blockquote, pre, code) {
    overflow-wrap: anywhere;
  }
  body[data-page="aprender"] .book-main :is(img, svg, video, iframe, canvas, figure) {
    max-width: 100% !important;
    height: auto;
  }
  body[data-page="aprender"] .book-main :is(.book-grid-2, .book-grid-3, .flow, .axis, .algo-row, .clinical-cards, .cervicite-mindmap) {
    min-width: 0;
    max-width: 100%;
  }
  body[data-page="aprender"] .book-main :is(.book-mini, .flow-step, .axis-card, .algo-key, .algo-val, .book-callout, .book-alert) {
    box-sizing: border-box;
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
  }
  body[data-page="aprender"] .book-section :is(table, .book-table) {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}
@media (max-width: 620px) {
  body[data-page="aprender"] .book-main :is(.book-grid-2, .book-grid-3, .flow, .clinical-cards, .cervicite-mindmap) {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  body[data-page="aprender"] .book-main .algo-row,
  body[data-page="aprender"] .book-main .axis {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  body[data-page="aprender"] .book-section { padding: 18px 15px !important; }
  body[data-page="aprender"] .book-hero { padding: 20px 16px !important; }
  body[data-page="aprender"] .book-hero h1 { font-size: clamp(21px, 6vw, 27px) !important; }
  body[data-page="aprender"] .book-callout { padding: 16px 16px 16px 74px !important; }
  body[data-page="aprender"] .book-callout::before { left: 12px !important; width: 46px !important; height: 46px !important; }
}