:root{--bg-color:#050505;--glass-bg:#14141499;--glass-border:#ffffff1a;--accent-color:#3b82f6;--accent-glow:#3b82f666;--text-main:#f8fafc;--text-dim:#94a3b8;--card-bg:#0f172a;--font-main:"Outfit", sans-serif;--transition-smooth:all .3s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-main);font-family:var(--font-main);-webkit-font-smoothing:antialiased;overflow-x:hidden}.glass{background:var(--glass-bg);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);border-radius:16px}.glow-btn{background:var(--accent-color);color:#fff;cursor:pointer;transition:var(--transition-smooth);border:none;border-radius:8px;padding:10px 20px;font-weight:600;box-shadow:0 0 #3b82f600}.glow-btn:hover{box-shadow:0 0 20px var(--accent-glow);transform:translateY(-2px)}.app-container{width:100vw;height:100vh;display:flex}.sidebar{border-right:1px solid var(--glass-border);flex-direction:column;gap:20px;width:280px;height:100%;padding:24px;display:flex}.main-content{flex:1;padding:32px;overflow-y:auto}.media-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:20px;display:grid}.media-card{aspect-ratio:1;cursor:pointer;transition:var(--transition-smooth);border-radius:12px;position:relative;overflow:hidden}.media-card:hover{transform:scale(1.05);box-shadow:0 10px 30px #00000080}.media-card img,.media-card video{object-fit:cover;width:100%;height:100%;transition:transform .3s}.media-card:hover img{transform:scale(1.05)}.lightbox-overlay{animation:.3s ease-out fadeIn}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.hover-opacity:hover{opacity:.7}.category-item{cursor:pointer;transition:var(--transition-smooth);color:var(--text-dim);border-radius:8px;align-items:center;gap:12px;padding:12px 16px;display:flex}.category-item:hover,.category-item.active{background:var(--glass-border);color:var(--text-main)}@media (width<=768px){.app-container{flex-direction:column}.sidebar{z-index:1001;width:280px;transition:left .3s;position:fixed;top:0;left:-280px;box-shadow:10px 0 30px #00000080}.sidebar.open{left:0}.main-content{padding:80px 16px 16px}.media-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}.sidebar-overlay{z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000080;position:fixed;inset:0}.mobile-nav-toggle{z-index:1002;padding:10px;position:fixed;top:16px;left:16px;display:flex!important}h2{font-size:1.5rem!important}}.mobile-nav-toggle{display:none}
