*{box-sizing:border-box}
:root{--bg-color:#0d0d0d;--sidebar-bg:#151515;--card-bg:#1a1a1a;--subcard-bg:#222;--accent-color:#cf0000;--text-color:#fff;--text-muted:#999;--border-color:#2a2a2a}
html{max-width:100%;overflow-x:hidden;position:relative}
body{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;background-color:var(--bg-color);color:var(--text-color);margin:0;display:flex;flex-direction:column;min-height:100vh;max-width:100%;position:relative}
header{background-color:var(--sidebar-bg);border-bottom:2px solid var(--accent-color);padding:10px 40px;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:1000}
.logo-container span{display:inline-block;border-radius:8px;background:#FFF;padding:4px}
.logo-container img{height:45px;display:block}
#mobile-filter-btn{display:none;background:var(--accent-color);color:white;border:none;padding:8px 15px;border-radius:5px;cursor:pointer;font-weight:bold}
.wrapper{display:flex;flex:1;max-width:1600px;margin:0 auto;width:100%;gap:30px;padding:30px;box-sizing:border-box}
.sidebar{width:300px;background-color:var(--sidebar-bg);padding:25px;border-radius:12px;height:fit-content;position:sticky;top:100px;border:1px solid var(--border-color);max-height: calc(100vh - 120px);overflow-y:auto}
.sidebar.loading { opacity: 0.5; pointer-events: none; cursor: wait; }
.sidebar.loading input { cursor: wait; }
.filter-section{margin-bottom:35px}
.filter-section h3{font-size:13px;text-transform:uppercase;color:var(--accent-color);margin-bottom:15px;letter-spacing:1px;font-weight:800}
.filter-option{display:flex;align-items:center;margin-bottom:12px;cursor:pointer;font-size:14px;color:var(--text-muted)}
.filter-option:hover{color:#fff}
.filter-option input{margin-right:12px;accent-color:var(--accent-color);width:16px;height:16px}
.search-container{position:relative;display:flex;align-items:center}
.search-container input{width:100%;background:var(--subcard-bg);border:1px solid var(--border-color);padding:10px 35px 10px 12px;border-radius:8px;color:#fff;font-family:inherit;font-size:14px;transition:border-color 0.3s}
.search-container input:focus{outline:none;border-color:var(--accent-color)}
.search-container i{position:absolute;right:12px;color:var(--text-muted);font-size:14px;pointer-events:none}
.range-slider-container{position:relative;width:100%;height:35px;margin-top:10px}
.range-slider-container input[type="range"]{position:absolute;width:100%;pointer-events:none;-webkit-appearance:none;background:none;z-index:2;margin:0}
input[type="range"]::-webkit-slider-thumb{height:20px;width:20px;border-radius:50%;background:var(--accent-color);pointer-events:auto;-webkit-appearance:none;cursor:pointer;border:2px solid #fff}
input[type="range"]::-moz-range-thumb{height:20px;width:20px;border-radius:50%;background:var(--accent-color);pointer-events:auto;cursor:pointer;border:2px solid #fff}
.slider-track{position:absolute;width:100%;height:6px;background:#333;top:50%;transform:translateY(-50%);border-radius:10px;z-index:1;margin-top:-10px}
.range-label{display:flex;justify-content:space-between;font-size:12px;color:var(--text-muted);margin-bottom:5px}
.content{flex:1}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:25px;align-items:start}
.cl{text-decoration:none;color:inherit;display:block;max-width:calc(100vw - 30px)}
.cd{background-color:var(--card-bg);border-radius:15px;overflow:hidden;border:1px solid var(--border-color);transition:all .3s ease}
.cl:hover .cd{transform:translateY(-8px);border-color:#444;box-shadow:0 10px 20px #000}
.th{position:relative;aspect-ratio:16/9;background:#000}
.th img{width:100%;height:100%;object-fit:cover;}
.vi{padding:15px 18px 8px}
.vi h4{margin:0 0 6px;font-size:17px;font-weight:600;color:#fff;line-height:1.2}
.vi .dt{font-size:12px;color:var(--text-muted);display:flex;align-items:center;gap:6px}
.db{position:absolute;bottom:8px;right:8px;background:rgba(0,0,0,0.85);color:#fff;padding:2px 6px;border-radius:4px;font-size:11px;font-weight:bold;z-index:10}
.sc{background-color:var(--subcard-bg);margin:0 15px 15px;padding:10px 12px;border-radius:8px;border-top:2px solid var(--accent-color)}
.sc h5{margin:0 0 5px;font-size:16px;color:#eee;font-weight:700}
.sc .mt{font-size:11px;margin:6px 0;color:var(--text-muted)}
.tags{display:flex;gap:6px;margin:10px 0;flex-wrap:wrap}
.tag{background:#3a3a3a;font-size:10px;padding:4px 8px;border-radius:4px;color:#eee;text-transform:uppercase;font-weight:600}
.ci{display:flex;gap:15px;margin-top:5px;border-top:1px solid rgba(255,255,255,0.05);padding-top:8px}
.ci i{color:var(--accent-color)}
.mt i{color:var(--accent-color);font-size:10px;margin-right:3px;}
.mc{margin-bottom:5px;min-height:auto}
.il,.io{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:700;color:#fff}
.il i,.io i{font-size:15px;color:var(--accent-color)}
#no-results{display:none;text-align:center;padding:50px;color:var(--text-muted);width:100%;grid-column:1/-1}
#no-results i{font-size:30px;display:block;margin-bottom:15px;color:var(--accent-color)}
footer{background-color:var(--sidebar-bg);padding:40px 20px;text-align:center;border-top:1px solid var(--border-color);margin-top:40px}
footer p{color:var(--text-muted);font-size:14px;margin:0}
footer p + p{margin-top:10px; opacity:0.5; font-size:12px}
@media (max-width:900px){
#mobile-filter-btn{display:block}
.wrapper{padding:15px;flex-direction:column;width:100%;overflow:hidden}
.grid{width:100%;gap:15px}
.sidebar{position:fixed !important;top:0;right:-320px;width:280px;height:100vh;z-index:9999;overflow-y:auto;box-shadow:-5px 0 15px rgba(0,0,0,0.5);transition:right 0.3s ease;border-radius:0;background-color:var(--sidebar-bg);visibility:hidden;max-height:100vh;}
.sidebar.active{right:0;visibility:visible}
.sidebar-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.7);z-index:9998}
.sidebar-overlay.active{display:block}
header{padding:10px 20px}
}

.video-page .wrapper{display:flex;flex-wrap:wrap;gap:30px;align-items:flex-start}
.video-page .content{display:flex;flex-direction:column;flex:3;min-width:0}
.video-page .sidebar{flex:1;min-width:300px;position:sticky;top:100px;order:2;visibility:visible}
.video-page .card{order:1;width:100%;position:relative;position: relative;width: 100%;aspect-ratio: 16 / 9; /* Força a proporção 16:9 */background: #000;padding: 0;overflow: hidden;border-radius: 12px;}
.video-page #links{order:3;width:100%;margin-top:20px}
.video-page .sidebar-box{background:var(--sidebar-bg);padding:20px;border-radius:12px;border:1px solid var(--border-color)}
.video-page .sidebar-box img{width:100%;border-radius:8px;margin-bottom:15px;border:1px solid var(--border-color)}
.video-page .datav{font-size:14px;color:var(--text-muted);margin-bottom:8px;display:block;order:0}
.video-page #video-title{order:0;margin-bottom:20px}
.video-page .inativo{opacity:0.3;filter:grayscale(1)}
.video-page .inativo i{color:var(--text-muted) !important}
.video-page .datav{display:none;margin-bottom:5px;font-size:14px;color:var(--text-muted)}
.video-page #video-title{margin-bottom:20px;font-size:24px;line-height:1.2}
.video-page .card{order:1;position:relative;width:100%;aspect-ratio:16/9;background:#000;padding:0;overflow:hidden;border-radius:12px;border:1px solid var(--border-color)}
.video-page #game-info-sidebar img {width:100%;}
.video-lazy{width:100%;height:100%}
.video-lazy iframe{width:100%;height:100%;position:absolute;top:0;left:0;border:none}
.video-lazy img{width:100%;height:100%;object-fit:cover;opacity:0.5}
.video-page #video-title{margin-bottom:20px;font-size:24px;line-height:1.2;order:0}
.video-page #links{display:none;order:3;width:100%;margin-top:30px}
.video-page .store-widget{border:0;margin-bottom:15px;display:block}
.video-page .steamdb-widget{border:0;border-radius:12px;display:block;}
.video-page #game-info-sidebar img{width:100%;border-radius:8px;margin-bottom:20px;border:1px solid var(--border-color);display:block}
.video-page #game-info-sidebar h3{color:var(--accent-color);font-size:13px;text-transform:uppercase;letter-spacing:1px;font-weight:800;margin-bottom:15px}
.video-page #game-info-sidebar p{margin:10px 0;font-size:15px}
.video-page #game-info-sidebar p i{color:var(--accent-color);width:20px}
.video-page .meta-container{margin-top:20px;border-top:1px solid var(--border-color);padding-top:15px}
.video-page .icon-local,.video-page .icon-online{display:flex;align-items:center;gap:10px;margin-bottom:10px;font-weight:700}
.video-page .icon-local i,.video-page .icon-online i{color:var(--accent-color);width:20px;text-align:center}
.video-page .icon-local.inativo,.video-page .icon-online.inativo{opacity:0.3;filter:grayscale(1)}
.video-page .icon-local.inativo i,.video-page .icon-online.inativo i{color:var(--text-muted)}

@media (max-width:900px){
.video-page .wrapper{display:flex;flex-direction:column}
.video-page .content{display:contents}
.video-page .datav, .video-page #video-title, .video-page .card{width:100%;order:1}
.video-page .datav {margin-bottom:-10px !important;}
.video-page #video-title {font-size: 1.4rem;}
.video-page .sidebar{order:2;width:100%;position:static !important;min-width:unset;margin:20px 0}
.video-page #links{order:3;width:100%;margin-top:10px}
.video-page .datav{margin-bottom:2px}
.video-page #video-title{margin-bottom:12px;font-size:1.4rem}
.video-page #links{margin-top:15px}
}