.single-streamer .layout > .rail { align-self: start; }
@media (min-width: 1025px) {
  .single-streamer .layout > .rail[data-scroll-sticky] { position: sticky; top: var(--rail-top, 88px); }
}
.tn-reactions {
  --reaction-accent: #b18cff;
  --reaction-selected: rgba(145, 70, 255, .12);
  position: static; padding: 22px 20px 20px;
  background: var(--card); border: 1px solid var(--line); border-radius: 16px;
}
.tn-reactions-eyebrow { display: flex; align-items: center; gap: 8px; margin: 0 0 18px; color: #c6b1ef; font-size: 10px; font-weight: 700; letter-spacing: .075em; line-height: 1.4; text-transform: uppercase; }
.tn-reactions-eyebrow svg { flex: none; color: var(--reaction-accent); }
.tn-reactions-title { margin: 0 0 7px; font-family: Manrope, Inter, sans-serif; font-size: 20px; font-weight: 800; line-height: 1.3; letter-spacing: -.025em; overflow-wrap: anywhere; color: var(--text); }
.tn-reactions-question { margin: 0 0 24px; color: var(--muted); font-size: 13px; line-height: 1.5; }
.tn-reactions-options { display: grid; grid-template-columns: repeat(5, minmax(0, 72px)); gap: 6px; }
.tn-reactions-options button { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; width: 100%; aspect-ratio: 1 / 1; min-width: 0; min-height: 0; padding: 4px 2px; box-sizing: border-box; border: 1px solid var(--line); border-radius: 11px; background: var(--card2); color: var(--text); font: inherit; cursor: pointer; transition: background .15s, border-color .15s, box-shadow .15s; }
.tn-reactions-options .tn-reaction-emoji { font-family: 'Apple Color Emoji', 'Segoe UI Emoji', 'Noto Color Emoji', sans-serif; font-size: 20px; line-height: 1; }
.tn-reactions-options [data-count] { max-width: 100%; font-size: 12px; line-height: 1.2; font-weight: 600; font-variant-numeric: tabular-nums; }
.tn-reactions-options [data-count] { position: relative; min-width: 18px; min-height: 14.4px; text-align: center; }
.tn-reactions-options [data-count][data-masked="true"] { color: transparent; user-select: none; }
.tn-reactions-options [data-count][data-masked="true"]::after { content: ''; position: absolute; left: 50%; top: 50%; width: 24px; height: 12px; transform: translate(-50%, -50%); background: radial-gradient(ellipse 3px 5px at 5px 6px, var(--muted) 65%, transparent 100%), radial-gradient(ellipse 3px 5px at 12px 6px, var(--muted) 65%, transparent 100%), radial-gradient(ellipse 3px 5px at 19px 6px, var(--muted) 65%, transparent 100%); opacity: .45; filter: blur(3.2px); pointer-events: none; }
.tn-reactions-options button:hover:not(:disabled) { border-color: var(--reaction-accent); background: var(--soft); }
.tn-reactions-options button[aria-pressed="true"] { border-color: var(--reaction-accent); background: var(--reaction-selected); box-shadow: inset 0 0 0 1px var(--reaction-accent); }
.tn-reaction-check { position: absolute; top: -6px; right: -3px; display: none; align-items: center; justify-content: center; width: 16px; height: 16px; border-radius: 50%; background: var(--accent); color: #fff; box-shadow: 0 0 0 3px var(--card); }
[aria-pressed="true"] > .tn-reaction-check { display: flex; }
.tn-reactions-options button:focus-visible { outline: 2px solid var(--reaction-accent); outline-offset: 4px; }
.tn-reactions-options button:disabled { cursor: wait; opacity: .65; }
.tn-reactions-footer { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--line); }
.tn-reactions-status { display: flex; align-items: flex-start; gap: 7px; margin: 0; color: var(--text); font-size: 13px; font-weight: 600; line-height: 1.5; }
.tn-reactions-saved { display: none; flex: none; margin-top: 2px; color: var(--reaction-accent); }
.tn-reactions[data-vote-state="voted"] .tn-reactions-saved { display: block; }
.tn-reactions-hint { margin: 5px 0 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
.tn-reactions[data-vote-state="error"] .tn-reactions-status { color: var(--down); }
.tn-reactions-retry { margin: 10px 0 0; padding: 4px 0; border: 0; background: transparent; color: var(--link); font: inherit; font-size: 12px; cursor: pointer; }
[data-theme="light"] .tn-reactions { --reaction-accent: #8a42e6; --reaction-selected: #f0e7ff; }
[data-theme="light"] .tn-reactions-eyebrow { color: #7542ad; }
@media (max-width: 1024px) {
  .tn-reactions { position: static; order: 7; }
  .tn-reactions-options { gap: 10px; }
  .tn-reactions-options .tn-reaction-emoji { font-size: 24px; }
  .tn-reactions-eyebrow { font-size: 11px; }
  .tn-reactions-hint { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) { .tn-reactions-options button { transition: none; } }

