.tn-rooms { padding: clamp(80px, 10vw, 130px) 0; background: radial-gradient(50% 60% at 20% 50%, rgba(255,255,255,.03), transparent 70%), var(--ink-3); }
.tn-rooms-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(30px, 5vw, 80px); align-items: center; }
.tn-rooms-ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.tn-room { position: relative; margin: 0; padding: 26px 22px 20px; border-radius: 20px; background: rgba(6,13,23,.8); border: 1px solid rgba(255,255,255,.10); box-shadow: 0 50px 100px -60px rgba(0,0,0,.95); }
.tn-room .tn-sample { background: var(--ink-3); }
.tn-room-top { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px; }
.tn-team { display: flex; align-items: center; gap: 10px; min-width: 0; }
.tn-team-away { justify-content: flex-end; text-align: right; }
.tn-team small { display: block; color: var(--muted); font: 600 10px/1 var(--f-ui); letter-spacing: .12em; text-transform: uppercase; }
.tn-team b { font: 700 15px/1.2 var(--f-ui); }
.tn-crest { flex: 0 0 auto; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.14); font: 800 12px/1 var(--f-display); color: var(--lime); }
.tn-crest-b { color: #b88cff; }
.tn-room-mid { text-align: center; }
.tn-room-open { display: inline-block; padding: 5px 10px; border-radius: 999px; border: 1px solid rgba(34,197,94,.4); color: #6ee7a0; font: 700 10px/1 var(--f-ui); letter-spacing: .12em; text-transform: uppercase; }
.tn-room-mid small { display: block; margin-top: 6px; color: var(--muted); font: 500 11px/1.3 var(--f-body); }
.tn-room-meta { margin: 14px 0 12px; padding-bottom: 12px; border-bottom: 1px solid rgba(255,255,255,.07); color: var(--text-2); font: 500 13px/1.4 var(--f-body); text-align: center; }
.tn-feed { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.tn-feed li { padding: 11px 13px; border-radius: 12px; background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.06); }
.tn-feed b { font: 700 13px/1.3 var(--f-ui); }
.tn-feed time { float: right; color: var(--muted); font: 500 11px/1.3 var(--f-body); }
.tn-feed p { margin: 4px 0 0; color: var(--text-2); font: 400 14px/1.45 var(--f-body); }
.tn-feed-moment { display: flex; gap: 12px; align-items: center; border-color: rgba(208,250,0,.28) !important; background: rgba(208,250,0,.04) !important; }
.arena-anim .tn-room .tn-feed li { opacity: 0; transform: translateY(14px); }
.arena-anim .tn-room.is-in .tn-feed li { opacity: 1; transform: none; transition: opacity .8s var(--ease-out), transform .8s var(--ease-out); }
.arena-anim .tn-room.is-in .tn-feed li:nth-child(2) { transition-delay: .35s; }
.arena-anim .tn-room.is-in .tn-feed li:nth-child(3) { transition-delay: .7s; }
.arena-anim .tn-room.is-in .tn-feed li:nth-child(4) { transition-delay: 1.05s; }
@media (max-width: 1023px) { .tn-rooms-grid { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .tn-rooms-ctas .btn { width: 100%; justify-content: center; } .tn-crest { width: 34px; height: 34px; font-size: 10px; } .tn-team b { font-size: 13px; } .tn-room-top { grid-template-columns: 1fr 1fr; } .tn-room-mid { grid-column: 1 / -1; grid-row: 2; } }