.watching-dashboard{max-width:1500px;margin:0 auto;padding:1rem}.dashboard-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:2rem;gap:2rem}.title-section h2{margin:0 0 .5rem;font-size:2rem;font-weight:700;color:#ffffff}.title-section .subtitle{margin:0;color:#9a9ea8;font-size:1rem}.tab-navigation{display:flex;gap:.5rem;position:relative;z-index:100}.tab-navigation.sticky{position:sticky;top:0;background:rgba(26,28,37,.95);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:1rem 0;margin:-1rem 0 1rem;border-bottom:1px solid #3a3646;.pagination-controls{flex-direction:column;gap:.75rem;text-align:center;margin:.75rem 0;padding:.75rem 0}.pagination-buttons{gap:.5rem}.pagination-btn,.pagination-button{padding:.4rem .8rem;font-size:.8rem;min-width:70px}}.tab-navigation-inner{display:flex;justify-content:space-between;align-items:center;width:100%}.tab-button,.tab-buttons{display:flex;gap:.5rem}.tab-button{align-items:center;padding:.75rem 1.5rem;background:#2d2b38;color:#ffffff;border:2px solid #3a3646;border-radius:8px;cursor:pointer;transition:all .3s ease;font-weight:500;position:relative}.tab-button:hover{background:#3a3646;border-color:#9146ff}.tab-button.active{background:#9146ff;border-color:#9146ff;color:white}.tab-icon{font-size:1rem}.live-indicator{animation:pulse 2s infinite}@keyframes pulse{0%{opacity:1}50%{opacity:.7}to{opacity:1}}.tab-badge{background:rgba(255,255,255,.2);color:white;padding:.2rem .5rem;border-radius:12px;font-size:.75rem;font-weight:600;min-width:20px;text-align:center}.tab-button.active .tab-badge{background:rgba(255,255,255,.3)}.watching-panel{background:#1a1c25;border-radius:12px;padding:1.5rem;border:1px solid #2d2b38}.watching-panel.empty,.watching-panel.error,.watching-panel.loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;text-align:center}.loading-spinner{width:40px;height:40px;border-radius:50%;border:3px solid rgba(145,70,255,.2);border-top-color:#9146ff;animation:spin 1s linear infinite;margin-bottom:1rem}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.error-content h3{color:#ff6b6b;margin-bottom:.5rem}.error-content p{color:#9a9ea8;margin-bottom:1rem}.retry-button{background:#9146ff;color:white;border:none;padding:.75rem 1.5rem;border-radius:8px;cursor:pointer;font-weight:500;transition:background .3s ease}.retry-button:hover{background:#7c3aed}.empty-content .empty-icon{font-size:3rem;margin-bottom:1rem;display:block}.empty-content h3{color:#ffffff;margin-bottom:.5rem}.empty-content p{color:#9a9ea8;margin-bottom:1.5rem}.summary-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-bottom:2rem}.stat-card{background:#2d2b38;padding:1rem;border-radius:8px;text-align:center;border:1px solid #3a3646}.stat-value{font-size:1.75rem;font-weight:700;color:#9146ff;margin-bottom:.25rem}.stat-label{font-size:.875rem;color:#9a9ea8;text-transform:uppercase;letter-spacing:.5px}.controls-section{justify-content:space-between;margin-bottom:1.5rem}.controls-section,.timeframe-selector{display:flex;align-items:center;gap:1rem}.timeframe-selector label{color:#ffffff;font-weight:500}.timeframe-buttons{display:flex;gap:.5rem}.timeframe-button{padding:.5rem 1rem;background:#2d2b38;color:#ffffff;border:1px solid #3a3646;border-radius:6px;cursor:pointer;transition:all .3s ease;font-size:.875rem}.timeframe-button:hover{background:#3a3646;border-color:#9146ff}.timeframe-button.active{background:#9146ff;border-color:#9146ff}.refresh-button{padding:.5rem 1rem;background:#2d2b38;color:#ffffff;border:1px solid #3a3646;border-radius:6px;cursor:pointer;transition:all .3s ease;font-size:.875rem}.refresh-button:hover{background:#3a3646;border-color:#9146ff}.refresh-info{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding:.75rem 1rem;background:rgba(145,70,255,.1);border-radius:6px;border:1px solid rgba(145,70,255,.2)}.live-indicator{color:#ff6b6b;font-weight:600}.last-updated{color:#9a9ea8;font-size:.875rem}.streams-list h3{color:#ffffff;margin-bottom:1rem;font-size:1.25rem;font-weight:600}.stream-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}@media (max-width:1024px){.stream-cards{grid-template-columns:repeat(2,1fr);gap:.75rem}}@media (max-width:768px){.stream-cards{grid-template-columns:1fr;gap:.5rem}.stream-card{padding:.5rem}}.stream-card{background:#2d2b38;border-radius:8px;padding:.75rem;border:1px solid #3a3646;transition:border-color .3s ease,transform .2s ease;height:-moz-fit-content;height:fit-content}.stream-card:hover{border-color:#9146ff;transform:translateY(-2px)}.stream-card.historical-stream{display:block;padding:.75rem}.stream-rank{display:inline-flex;align-items:center;margin-bottom:.5rem;min-width:auto}.rank-number{background:#9146ff;color:white;padding:.2rem .4rem;border-radius:4px;font-weight:600;font-size:.75rem;margin-right:.5rem}.stream-content{flex:1}.stream-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:.5rem}.streamer-name{color:#ffffff;margin:0 0 .15rem;font-size:.95rem;font-weight:600;line-height:1.2}.category{color:#9146ff;font-size:.8rem;font-weight:500}.viewer-count{display:flex;flex-direction:column;align-items:flex-end;text-align:right}.viewer-count .count{font-size:1.1rem;font-weight:700;color:#9146ff;line-height:1}.viewer-count .label{font-size:.7rem;color:#9a9ea8;text-transform:uppercase}.stream-stats{display:flex;gap:.5rem;margin-bottom:.5rem}.stream-stats .stat{display:flex;flex-direction:column;align-items:center;text-align:center;flex:1}.stream-stats .stat-value{font-size:.95rem;font-weight:600;color:#ffffff;line-height:1}.stream-stats .stat-label{font-size:.7rem;color:#9a9ea8;text-transform:uppercase;letter-spacing:.02em}.stream-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.3rem;margin-bottom:.5rem;padding:.5rem;background:rgba(145,70,255,.05);border-radius:6px}.metric{display:flex;justify-content:space-between;align-items:center}.metric-label{color:#9a9ea8;font-size:.875rem}.metric-value{color:#ffffff;font-weight:500;font-size:.875rem}.viewers-section{margin-bottom:.75rem}.viewers-section h5{color:#ffffff;margin:0 0 .4rem;font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.viewer-list{display:flex;flex-wrap:wrap;gap:.75rem}.viewer-item{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;background:rgba(255,255,255,.05);border-radius:20px;transition:background .3s ease}.viewer-item:hover{background:rgba(255,255,255,.1)}.viewer-avatar{display:flex;align-items:center;justify-content:center;width:24px;height:24px;overflow:hidden}.avatar-image,.viewer-avatar{border-radius:50%}.avatar-placeholder{width:24px;height:24px;background:#9146ff;color:white;display:flex;align-items:center;justify-content:center;border-radius:50%;font-size:.75rem;font-weight:600}.avatar-placeholder.small{width:20px;height:20px;font-size:.6rem}.viewer-info{display:flex;flex-direction:column;min-width:0}.viewer-name{color:#ffffff;font-weight:500;font-size:.875rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.viewer-details,.watch-time{color:#9a9ea8;font-size:.75rem}.anonymous-viewers{display:flex;align-items:center;gap:.5rem;padding:.75rem;background:rgba(255,255,255,.05);border-radius:6px}.anonymous-icon{font-size:1rem}.anonymous-text{color:#9a9ea8;font-size:.875rem}.stream-footer{padding-top:1rem;border-top:1px solid #3a3646;margin-top:1rem}.last-activity{color:#9a9ea8;font-size:.75rem}.recent-viewers h5{color:#ffffff;margin:0 0 .4rem;font-size:.8rem;font-weight:600}.viewer-avatars{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;max-width:100%}.viewer-avatar-container{position:relative;cursor:pointer;transition:transform .2s ease}.viewer-avatar-container:hover{transform:scale(1.1)}.viewer-avatar-image{border-radius:50%;border:2px solid #9146ff;-o-object-fit:cover;object-fit:cover}.viewer-avatar-placeholder{width:28px;height:28px;border-radius:50%;background:#9146ff;color:white;display:flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:600;border:2px solid #9146ff}.viewer-avatar-placeholder.anonymous{background:rgba(145,70,255,.6);border-color:rgba(145,70,255,.8);font-size:.9rem}.viewer-avatar-container.more-viewers .viewer-avatar-placeholder{background:rgba(145,70,255,.3);border-color:#9146ff;font-size:.7rem}.recent-viewers .viewer-item{background:rgba(255,255,255,.03);border-radius:6px;padding:.4rem;width:100%;max-width:280px}.recent-viewers .viewer-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.4rem}@media (max-width:768px){.watching-dashboard{padding:.5rem}.dashboard-header,.tab-navigation-inner{flex-direction:column;gap:1rem}.tab-buttons{width:100%;justify-content:stretch}.tab-button{flex:1;padding:.75rem 1rem}.pagination-controls,.tab-button{justify-content:center}.items-per-page-select{min-width:100px}.pagination{flex-direction:column;gap:1rem}.pagination-numbers{justify-content:center;flex-wrap:wrap}.pagination-info{min-width:auto}.summary-stats{grid-template-columns:repeat(2,1fr)}.controls-section{flex-direction:column;align-items:stretch;gap:1rem}.timeframe-selector{flex-direction:column;gap:.5rem}.timeframe-buttons{justify-content:stretch;flex-wrap:wrap}.timeframe-button{flex:1;text-align:center;min-width:120px}.stream-header{flex-direction:column;gap:1rem}.viewer-count{align-items:flex-start;text-align:left}.stream-card.historical-stream{flex-direction:column}.stream-rank{min-width:auto}.recent-viewers .viewer-list,.stream-metrics{grid-template-columns:1fr}.viewer-avatars{gap:.3rem;max-width:100%;justify-content:flex-start}.viewer-avatar-image,.viewer-avatar-placeholder{width:28px;height:28px}.viewer-avatar-placeholder{font-size:.7rem}.viewer-avatar-placeholder.anonymous{font-size:.8rem}}.pagination-controls{justify-content:space-between;margin:1rem 0;padding:1rem 0;border-top:1px solid #3a3646}.pagination-buttons,.pagination-controls{display:flex;align-items:center;gap:1rem}.page-info{color:#ffffff;font-size:.875rem;font-weight:500}.items-per-page-select{padding:.5rem;background:#2d2b38;color:#ffffff;border:1px solid #3a3646;border-radius:6px;font-size:.875rem;min-width:120px}.items-per-page-select:focus{outline:none;border-color:#9146ff}.pagination{display:flex;align-items:center;justify-content:center;gap:1rem;margin:2rem 0;padding:1rem 0;border-top:1px solid #3a3646}.pagination-btn,.pagination-button{padding:.5rem 1rem;background:#2d2b38;color:#ffffff;border:1px solid #3a3646;border-radius:6px;cursor:pointer;transition:all .3s ease;font-size:.875rem;min-width:80px}.pagination-btn:hover:not(:disabled),.pagination-button:hover:not(:disabled){background:#3a3646;border-color:#9146ff}.pagination-btn:disabled,.pagination-button:disabled{opacity:.5;cursor:not-allowed}.pagination-numbers{display:flex;gap:.5rem}.pagination-number{padding:.5rem .75rem;background:#2d2b38;color:#ffffff;border:1px solid #3a3646;border-radius:6px;cursor:pointer;transition:all .3s ease;font-size:.875rem;min-width:40px;text-align:center}.pagination-number:hover:not(:disabled):not(.dots){background:#3a3646;border-color:#9146ff}.pagination-number.active{background:#9146ff;border-color:#9146ff;color:white}.pagination-number.dots{cursor:default;background:transparent;border:none;color:#9a9ea8}.pagination-info{color:#9a9ea8;font-size:.875rem;text-align:center;min-width:200px}.collapsible-header{display:flex;justify-content:space-between;align-items:center;cursor:pointer;padding:.75rem 1rem;background:rgba(145,70,255,.1);border-radius:6px;margin-bottom:1rem;transition:background .3s ease}.collapsible-header:hover{background:rgba(145,70,255,.15)}.collapsible-toggle{color:#9146ff;font-size:1.2rem;transition:transform .3s ease}.collapsible-toggle.expanded{transform:rotate(180deg)}.collapsible-content{overflow:hidden;transition:max-height .3s ease}