body { padding-top: var(--tn-bar-height, 54px) !important; }
.tn-bar { position: fixed; inset: 0 0 auto; z-index: 400; display: flex; align-items: center; gap: 14px; padding: 10px 20px; background: var(--bg2, #100d22); color: var(--ink, #f4f0ff); border-bottom: 1px solid var(--line, #332954); font: 11px 'Google Sans', system-ui, sans-serif; }
.tn-status { font-size: 10px; font-weight: 700; letter-spacing: .12em; color: #ffbd4d; white-space: nowrap; }
.tn-bar-copy { flex: 1; color: var(--ink3, #b9b0cd); }
.tn-bar a { color: var(--ink2, #d7d0e8); white-space: nowrap; }
.tn-bar .tn-link { padding: 9px 13px; border-radius: 8px; color: white; font-weight: 700; background: #6c5cff; }
@media (max-width: 640px) {
  .tn-bar { padding: 8px 12px; gap: 12px; flex-wrap: wrap; }
  .tn-bar-copy { order: 5; flex-basis: 100%; font-size: 10px; }
  .tn-bar .tn-status { margin-right: auto; }
  .tn-bar a { font-size: 10px; }
}