#codes-overlay .t-codes-tabs {
  display: grid !important; grid-template-columns: minmax(0, 1fr) auto auto;
  grid-template-areas: "nav session close" "notice notice notice";
  gap: 6px 12px; padding: 8px 14px !important; box-sizing: border-box;
  width: 100%; min-width: 0; align-items: center;
}
#codes-overlay .ts-code-nav {
  grid-area: nav; height: auto !important; min-width: 0;
  overflow-x: auto; align-items: center; overscroll-behavior-x: contain;
}
#codes-overlay .ts-code-nav button { white-space: nowrap; }
#codes-overlay .ts-code-session {
  grid-area: session; min-width: 0; max-width: 48vw; margin-bottom: 0 !important;
  gap: 8px !important; flex-wrap: nowrap;
}
#t-my-stats-widget, #t-codes-save-status { flex-shrink: 0; white-space: nowrap; }
#t-active-reps-container { min-width: 0; overflow-x: auto; max-width: 240px; }
#t-active-reps-list { flex-shrink: 0; }
#t-codes-close {
  grid-area: close; align-self: center; white-space: nowrap; min-height: 32px;
  padding: 6px 12px; background: #ef4444; color: #fff; border: 0;
  border-radius: 5px; font-size: 13px; cursor: pointer;
}
#ts-announcement-bar {
  display: flex; align-items: center; gap: 8px;
  grid-area: notice; min-width: 0; height: 32px; margin-bottom: 0;
  padding: 0 8px 0 11px; box-sizing: border-box;
  border: 1px solid #e2e8f0; border-radius: 9px; background: #f8fafc; color: #64748b;
}
#ts-announcement-bar.has-notices { border-color: #c7d2fe; background: #eef2ff; color: #4338ca; }
/* Keep announcement management available without an empty announcement row. */
#codes-overlay .t-codes-tabs:has(#ts-announcement-bar:not(.has-notices)) {
  grid-template-columns: minmax(0, 1fr) 28px auto auto;
  grid-template-areas: "nav notice session close";
  padding-top: 4px !important; padding-bottom: 4px !important;
}
#ts-announcement-bar:not(.has-notices) {
  height: 28px; padding: 0; border: 0; background: transparent; justify-content: center;
}
#ts-announcement-bar:not(.has-notices) .ts-notice-symbol,
#ts-announcement-bar:not(.has-notices) #ts-notice-read { display: none; }
#ts-announcement-bar .ts-notice-symbol { font-size: 14px; flex-shrink: 0; }
#ts-notice-read { flex: 1; min-width: 0; overflow: hidden; padding: 0; border: 0; background: transparent; color: inherit; text-align: left; cursor: pointer; font-family: inherit; font-weight: 600; font-size: 12px; line-height: 30px; }
#ts-notice-read:disabled { cursor: default; opacity: 1; }
#ts-notice-track { display: flex; width: max-content; white-space: nowrap; }
#ts-notice-track > span { flex-shrink: 0; min-width: var(--notice-width, 200px); box-sizing: border-box; padding-right: 40px; }
#ts-announcement-bar.has-notices #ts-notice-track { animation: ts-notice-scroll var(--notice-duration, 25s) linear infinite; }
#ts-announcement-bar:hover #ts-notice-track,
#ts-announcement-bar:focus-within #ts-notice-track,
#ts-announcement-bar.is-paused #ts-notice-track { animation-play-state: paused; }
#ts-announcement-bar .ts-notice-control { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; flex-shrink: 0; border: 0; border-radius: 6px; background: transparent; color: inherit; cursor: pointer; }
#ts-announcement-bar .ts-notice-control:hover { background: #c7d2fe80; }
#ts-announcement-bar [hidden] { display: none !important; }
#ts-announcement-bar button:focus-visible { outline: 2px solid #818cf8; outline-offset: 1px; }
@keyframes ts-notice-scroll { to { transform: translateX(-50%); } }
.ts-notice-card { padding: 14px; margin: 0 0 10px; border: 1px solid #e2e8f0; border-radius: 10px; text-align: left; background: #f8fafc; }
.ts-notice-card p { white-space: pre-wrap; overflow-wrap: anywhere; margin: 8px 0; color: #334155; font-size: 14px; }
.ts-notice-meta { font-size: 11px; font-weight: 600; color: #6366f1; overflow-wrap: anywhere; }
.ts-notice-actions { display: flex; gap: 8px; margin-top: 12px; }
.ts-notice-actions button { border: 1px solid #c7d2fe; border-radius: 6px; padding: 5px 10px; background: #fff; color: #4338ca; cursor: pointer; }
.ts-notice-actions .ts-notice-delete { color: #be123c; border-color: #fecdd3; }
.ts-notice-editor { text-align: left; font-size: 14px; color: #334155; }
.ts-notice-editor > label { display: block; font-weight: 600; margin: 10px 0; }
.ts-notice-editor textarea { width: 100%; box-sizing: border-box; resize: vertical; min-height: 100px; padding: 12px; border: 1px solid #cbd5e1; border-radius: 8px; font: inherit; }
.ts-notice-editor small { display: block; color: #64748b; font-size: 11px; margin: 5px 0 18px; }
.ts-notice-editor fieldset { border: 0; margin: 0; padding: 0; }
.ts-notice-editor legend { font-weight: 600; margin-bottom: 8px; }
.ts-notice-editor fieldset label { display: block; padding: 6px 0; }
.ts-notice-editor input { accent-color: #4f46e5; }
.ts-notice-campaigns { max-height: 190px; overflow: auto; padding: 8px; margin: 8px 0 16px; border: 1px solid #e2e8f0; border-radius: 8px; }
.ts-notice-campaigns label { display: flex; align-items: baseline; gap: 8px; padding: 6px; }
.ts-notice-editor [hidden] { display: none !important; }
@media (max-width: 1100px) {
  #codes-overlay .t-codes-tabs:has(#ts-announcement-bar:not(.has-notices)) {
    grid-template-columns: minmax(0, 1fr) 28px auto;
    grid-template-areas: "nav notice close" "session session session";
  }
  #codes-overlay .t-codes-tabs {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "nav close" "session session" "notice notice";
  }
  #codes-overlay .ts-code-session { max-width: 100%; overflow-x: auto; }
  #t-active-reps-container { flex: 1; }
}
@media (prefers-reduced-motion: reduce) { #ts-announcement-bar.has-notices #ts-notice-track { animation: none; } }