:root{--color-primary: #2563eb;--color-primary-hover: #1d4ed8;--color-live: #dc2626;--color-success: #16a34a;--shadow-card: 0 1px 3px rgba(0, 0, 0, .1);--shadow-card-hover: 0 4px 6px -1px rgba(0, 0, 0, .1)}.safe-area-bottom{padding-bottom:env(safe-area-inset-bottom)}.custom-scrollbar::-webkit-scrollbar{width:6px}.custom-scrollbar::-webkit-scrollbar-track{background:#f1f5f9}.custom-scrollbar::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}.custom-scrollbar::-webkit-scrollbar-thumb:hover{background:#94a3b8}.stream-card{transition:transform .3s ease,box-shadow .3s ease}.stream-card:hover{transform:translateY(-4px)}.stream-card-thumbnail{position:relative;aspect-ratio:16 / 9;background:#1f2937;border-radius:.75rem;overflow:hidden}.stream-card-thumbnail img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;transition:transform .5s ease}.stream-card:hover .stream-card-thumbnail img{transform:scale(1.05)}.live-badge-pulse{animation:pulse-live 2s ease-in-out infinite}@keyframes pulse-live{0%,to{opacity:1}50%{opacity:.6}}.category-pill{padding:.375rem 1rem;border-radius:9999px;font-size:.9375rem;font-weight:500;white-space:nowrap;transition:all .15s ease}.category-pill-active{background:#000;color:#fff}.category-pill-inactive{background:#fff;color:#374151;border:1px solid #e5e7eb}.category-pill-inactive:hover{background:#f9fafb;border-color:#d1d5db}.sidebar-channel{display:flex;align-items:center;justify-content:space-between;padding:.5rem;border-radius:.5rem;transition:background-color .15s ease}.sidebar-channel:hover{background-color:#f3f4f6}.sidebar-channel-avatar{position:relative;width:2rem;height:2rem;border-radius:9999px;overflow:hidden}.sidebar-channel-online{position:absolute;bottom:0;right:0;width:.625rem;height:.625rem;background:#22c55e;border:2px solid #fff;border-radius:9999px}.bottom-nav{position:fixed;bottom:0;width:100%;background:#fff;border-top:1px solid #e5e7eb;display:flex;justify-content:space-around;padding:.75rem 0;z-index:50;padding-bottom:calc(.75rem + env(safe-area-inset-bottom))}.bottom-nav-item{display:flex;flex-direction:column;align-items:center;gap:.25rem;color:#9ca3af;transition:color .15s ease}.bottom-nav-item:hover{color:#4b5563}.bottom-nav-item.active{color:var(--color-primary)}.bottom-nav-item i{font-size:1.25rem}.bottom-nav-item span{font-size:.8125rem;font-weight:500}.viewer-badge{display:flex;align-items:center;gap:.25rem;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#fff;font-size:.8125rem;padding:.25rem .5rem;border-radius:.25rem}.viewer-badge i{font-size:.8125rem}.bid-badge{display:inline-block;background:#dcfce7;color:#15803d;font-size:.8125rem;font-weight:700;padding:.125rem .375rem;border-radius:.25rem}.notify-btn{display:flex;align-items:center;gap:.25rem;color:var(--color-primary);font-size:.8125rem;font-weight:500}.notify-btn:hover{text-decoration:underline}.empty-state{text-align:center;padding:3rem;background:#fff;border-radius:.75rem;border:1px solid #e5e7eb}.empty-state-icon{font-size:3rem;color:#d1d5db;margin-bottom:.75rem}.empty-state-title{color:#6b7280;font-weight:500}.empty-state-description{color:#9ca3af;font-size:.9375rem;margin-top:.25rem}@media(max-width:1023px){.sidebar-mobile-overlay{position:fixed;inset:0;background:#00000080;z-index:30}.sidebar-mobile{position:fixed;top:0;left:0;width:16rem;height:100%;background:#fff;z-index:40;transform:translate(-100%);transition:transform .3s ease}.sidebar-mobile.open{transform:translate(0)}}@media(max-width:1023px){.main-content{padding-bottom:5rem}}.user-dropdown{position:absolute;right:0;margin-top:.5rem;width:12rem;background:#fff;border-radius:.5rem;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;border:1px solid #e5e7eb;padding:.25rem 0;z-index:50}.user-dropdown-item{display:block;padding:.5rem 1rem;font-size:.9375rem;color:#374151;transition:background-color .15s ease}.user-dropdown-item:hover{background-color:#f3f4f6}.user-dropdown-divider{height:1px;background:#e5e7eb;margin:.25rem 0}
