/* MAIS TUNER 24.30 — "Sua central" redesenhada (música, chat e notícias).
   Fundo do Modo Cinema, fonte NRK Sans, cartões de vidro. No computador abre
   como gaveta à direita; no celular e no app ocupa a tela inteira. */

.timeline-dialog.hub{--hub-ink:#f5f9ff;--hub-muted:rgba(235,244,255,.72);--hub-glass:rgba(255,255,255,.1);--hub-line:rgba(255,255,255,.15);--hub-mint:#5fffc0;
  isolation:isolate;color:var(--hub-ink);background:#0a1f3d;border:1px solid rgba(255,255,255,.12);font-family:"NRK Sans","Reddit Sans",sans-serif}
.timeline-dialog.hub[open]{animation:hubIn .4s cubic-bezier(.22,1,.36,1) both}
@keyframes hubIn{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:none}}
.timeline-dialog.hub::backdrop{background:rgba(2,10,22,.55);backdrop-filter:blur(6px)}
.hub-ambient{position:absolute;inset:0;z-index:-1;pointer-events:none;background:var(--hub-brand,linear-gradient(150deg,#1b4f9c,#3d2a8c))}
.hub-ambient::before{content:'';position:absolute;inset:-50px;background-image:var(--hub-art,none);background-size:cover;background-position:center;filter:blur(46px) saturate(1.7);opacity:.75}
.hub-ambient::after{content:'';position:absolute;inset:0;background:radial-gradient(70% 45% at 0% 0%,rgba(95,255,192,.18),transparent 60%),radial-gradient(70% 50% at 100% 100%,rgba(255,77,140,.2),transparent 60%),
  linear-gradient(180deg,rgba(5,14,32,.45),rgba(5,14,32,.7) 50%,rgba(5,14,32,.86))}

/* topo */
.timeline-dialog.hub .timeline-header{display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:12px;padding:calc(18px + env(safe-area-inset-top)) 18px 14px}
.hub-logo{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;overflow:hidden;padding:8px;box-sizing:border-box;background:var(--brand-tile-bg,#123a69);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),0 10px 20px -12px rgba(0,0,0,.8)}
.hub-logo img{width:100%;height:100%;object-fit:contain}
.timeline-dialog.hub .timeline-eyebrow{color:var(--hub-mint);font-size:10.5px;font-weight:900;letter-spacing:.16em}
.timeline-dialog.hub .timeline-header h2{margin:2px 0 0;font-size:24px;font-weight:850;letter-spacing:-.025em;color:var(--hub-ink)}
.hub-sub{margin:2px 0 0;color:var(--hub-muted);font-size:12.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hub-copy{min-width:0}
.timeline-dialog.hub .hub-close{display:grid;place-items:center;width:40px;height:40px;min-height:0;padding:0;border:1px solid var(--hub-line);border-radius:50%;background:var(--hub-glass);color:var(--hub-ink);cursor:pointer}
.hub-close svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}

/* abas */
.hub-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:0 18px 12px;padding:5px;border-radius:999px;background:rgba(0,0,0,.25);border:1px solid var(--hub-line)}
.hub-tab{position:relative;display:flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:0 10px;border:0;border-radius:999px;background:none;color:var(--hub-muted);
  font:800 13.5px "NRK Sans","Reddit Sans",sans-serif;cursor:pointer;transition:background .25s ease,color .25s ease}
.hub-tab svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hub-tab[aria-pressed="true"]{background:var(--hub-mint);color:#03253b}
.hub-badge{min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:#ff4d5e;color:#fff;font-size:10.5px;font-weight:900;line-height:18px;text-align:center;box-sizing:border-box}
.hub-badge[hidden]{display:none}
.hub-tab .hub-badge{position:absolute;top:2px;right:8px}

/* conteúdo */
.timeline-dialog.hub .timeline-status{margin:0 18px 8px;color:var(--hub-muted);font-size:12.5px;min-height:0}
.timeline-dialog.hub .timeline-status:empty{display:none}
.timeline-dialog.hub .timeline-scroll{flex:1;padding:4px 18px 18px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.25) transparent}
.timeline-dialog.hub .timeline-scroll[hidden],.timeline-dialog.hub .timeline-status[hidden]{display:none!important}
.timeline-dialog.hub .timeline-section-title{margin:6px 2px 12px;color:var(--hub-mint);font-size:11px;font-weight:900;letter-spacing:.16em;text-transform:uppercase}
.timeline-dialog.hub .timeline-music{margin:0 0 18px;padding:0;border:0}
.timeline-dialog.hub .timeline-track{display:grid;grid-template-columns:108px minmax(0,1fr);gap:16px;align-items:center;padding:12px;border-radius:22px;background:var(--hub-glass);border:1px solid var(--hub-line);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.timeline-dialog.hub .timeline-track>img{width:108px;height:108px;border-radius:16px;object-fit:cover;background:rgba(255,255,255,.08);box-shadow:0 14px 28px -16px rgba(0,0,0,.9)}
.timeline-dialog.hub .timeline-track h4{margin:4px 0 2px;font-size:20px;font-weight:850;letter-spacing:-.02em;color:var(--hub-ink)}
.timeline-dialog.hub .timeline-track p{margin:0;color:var(--hub-muted);font-size:14.5px}
.timeline-dialog.hub .timeline-meta{color:var(--hub-muted)}
.timeline-dialog.hub .timeline-clips{margin-top:12px}
.timeline-dialog.hub .timeline-clip{border-radius:16px;background:rgba(0,0,0,.22);border:1px solid var(--hub-line);color:var(--hub-ink)}
.timeline-dialog.hub .timeline-clip:hover{border-color:var(--hub-mint)}
.timeline-dialog.hub .timeline-action{border-radius:999px;background:var(--hub-glass);border:1px solid var(--hub-line);color:var(--hub-ink)}
.timeline-dialog.hub>.timeline-action{margin:0 18px calc(16px + env(safe-area-inset-bottom));min-height:46px;font-weight:800}
.timeline-dialog.hub>.timeline-action[hidden]{display:none!important}
.timeline-dialog.hub .timeline-news-card{margin-left:6px;padding:0 0 18px 20px;border-left:2px solid var(--hub-line)}
.timeline-dialog.hub .timeline-news-card::before{background:var(--hub-mint);box-shadow:0 0 0 4px rgba(95,255,192,.18)}
.timeline-dialog.hub .timeline-news-link{display:block;width:100%;padding:12px;border-radius:18px;background:var(--hub-glass);border:1px solid var(--hub-line);text-align:left;color:var(--hub-ink)}
.timeline-dialog.hub .timeline-news-link img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:12px;margin-bottom:10px}
.timeline-dialog.hub .timeline-news-link h4{margin:4px 0;font-size:16.5px;font-weight:850;line-height:1.25}
.timeline-dialog.hub .timeline-news-link p{margin:4px 0 0;color:var(--hub-muted);font-size:13.5px;line-height:1.45}
.hub-chat{flex:1;min-height:0;display:flex;flex-direction:column;padding:0 4px calc(4px + env(safe-area-inset-bottom))}
.hub-chat[hidden]{display:none!important}
.hub-chat .mtc{flex:1}

/* celular e app: tela cheia */
@media (max-width:760px){
  .timeline-dialog.hub{inset:0!important;width:100%!important;height:100dvh!important;max-height:none!important;border:0;border-radius:0}
  .timeline-dialog.hub[open]{animation:hubUp .42s cubic-bezier(.22,1,.36,1) both}
  @keyframes hubUp{from{opacity:.4;transform:translateY(40px)}to{opacity:1;transform:none}}
}
html.mt-app .timeline-dialog.hub{inset:0!important;width:100%!important;height:100dvh!important;max-height:none!important;border:0;border-radius:0}

/* ================================================================ botão de entrada
   Computador: pílula "✦ Sua central" acima do player, sem cobrir controles.
   Celular e app: a entrada fica dentro da Central e no topo do app. */
.timeline-launcher.hub-launch{display:flex;align-items:center;gap:9px;width:auto;height:48px;padding:0 18px 0 6px;border:1px solid rgba(95,255,192,.45);border-radius:999px;
  left:max(24px,env(safe-area-inset-left));right:auto;bottom:calc(118px + env(safe-area-inset-bottom));
  background:linear-gradient(135deg,rgba(18,58,105,.92),rgba(42,31,107,.92));color:#fff;font:850 14px "NRK Sans","Reddit Sans",sans-serif;
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 16px 34px -18px rgba(0,0,0,.9);transition:transform .25s ease,border-color .2s ease}
.timeline-launcher.hub-launch:hover{transform:translateY(-2px);border-color:#5fffc0}
.timeline-launcher.hub-launch[hidden]{display:none!important}
.hub-launch-ico{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#5fffc0;color:#03253b}
.hub-launch-ico svg{width:19px;height:19px;fill:currentColor}
.timeline-launcher .hub-badge{position:absolute;top:-6px;left:28px}
@media (max-width:760px){.timeline-launcher.hub-launch{display:none!important}}
html.mt-app .timeline-launcher.hub-launch{display:none!important}
html:is(.cinema-active,.mtc-open) .timeline-launcher{display:none!important}
.timeline-dialog.hub .hub-close:focus:not(:focus-visible){outline:none;box-shadow:none;border-color:var(--hub-line)}
.timeline-dialog.hub :focus:not(:focus-visible){outline:none}

/* 24.33: sem capa da música, o logo da rádio aparece inteiro (antes era cortado) */
.timeline-dialog.hub .timeline-track>img.is-logo{object-fit:contain;padding:16px;box-sizing:border-box;background:linear-gradient(145deg,#1b4f9c,#0b2a58)}

/* 24.37: notícias ligadas ao que toca — no topo da aba Agora */
.timeline-related{display:grid;gap:8px;margin:0 0 14px;padding:12px;border-radius:20px;border:1px solid rgba(95,255,192,.35);
  background:linear-gradient(135deg,rgba(95,255,192,.14),rgba(54,202,231,.08));color:inherit}
.timeline-related-kicker{color:#5fffc0;font-size:11px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.timeline-related-link{display:grid!important;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px;width:100%;padding:0!important;border:0!important;background:none!important;color:inherit!important;text-align:left;cursor:pointer;font:inherit}
.timeline-related-link img{width:64px;height:64px;border-radius:14px;object-fit:cover}
.timeline-related-copy{display:flex;flex-direction:column;gap:2px;min-width:0}
.timeline-related-copy small{color:rgba(255,255,255,.66);font-size:12px;font-weight:700}
.timeline-related-copy strong{font-size:15px;font-weight:850;line-height:1.25;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
html[data-site-theme="light"] .timeline-related-copy small{color:rgba(5,19,39,.6)}
html[data-site-theme="light"] .timeline-related-kicker{color:#0f8f6a}