.header{position:sticky;top:0;z-index:1000;background-color:#000;color:#fff;padding:12px 24px;border-bottom:1px solid #333}.nav{display:flex;justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto}.nav-left{display:flex;align-items:center}.home-link{display:flex;align-items:center;color:#fff;text-decoration:none}.nav-right{display:flex;align-items:center;gap:24px}.nav-link,.dropdown-button{color:#fff;background:none;border:none;font-weight:500;font-size:1rem;text-decoration:none;cursor:pointer;display:flex;align-items:center;transition:color .2s ease}.nav-link:hover,.dropdown-button:hover{color:#bbb}.nav-link.active{border-bottom:2px solid white;padding-bottom:2px}.dropdown{position:relative}.dropdown-menu{position:absolute;right:0;top:120%;background-color:#111;border:1px solid #333;border-radius:6px;padding:10px 16px;color:#fff;font-size:.9rem;min-width:180px;text-align:center;box-shadow:0 0 10px #ffffff1a;animation:fadeIn .2s ease}.dropdown-menu p{margin:0;line-height:1.4}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}:root{--columns: 8;--rows: 2;--gap: 8px}.grid-container{display:grid;grid-template-columns:repeat(var(--columns),1fr);grid-template-rows:repeat(var(--rows),1fr);gap:var(--gap);height:100vh;padding:var(--gap);box-sizing:border-box}.grid-item{position:relative;overflow:hidden;cursor:pointer;background-color:#000;display:flex;align-items:left;justify-content:left;transition:opacity .5s ease-in-out}.grid-item img{max-height:100%;max-width:100%;object-fit:contain;display:block;transition:transform .3s ease}.overlay{position:absolute;top:0;left:0;height:100%;width:100%;background-color:#0000;color:#fff;display:flex;flex-direction:left;justify-content:left;align-items:left;opacity:0;transition:background-color .3s ease,opacity .3s ease;padding:8px;text-align:left}.grid-item:hover .overlay{background-color:#0009;opacity:1}.movie-info h3,.movie-info p{margin:0;font-size:.8rem;text-align:left}.fade-out{opacity:0}body{font-family:sans-serif;color:#fff;background:#000;margin:0;padding:20px;text-align:center}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;max-width:800px;margin:0 auto}.grid-item{position:relative;width:100%;overflow:hidden}.image-container{position:relative;cursor:pointer;transition:opacity .5s ease}.image-container img{width:100%;display:block;transition:transform .3s ease,filter .3s ease}.image-container:hover img{filter:brightness(50%);transform:scale(1.03)}.overlay{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;pointer-events:none;opacity:0;transition:opacity .3s ease}.image-container:hover .overlay{opacity:1}.overlay .text{color:#fff;font-size:1rem;font-weight:700;text-align:center;padding:10px;background:#0009;border-radius:6px}.fade-out{opacity:0;transition:opacity .5s ease}.placeholder{width:100%;padding-bottom:100%;background-color:#ccc;opacity:.4}.header{display:flex}.left-buttons,.right-buttons{flex:1}html,body,#root{height:100%;margin:0;padding:0}#content{flex:1;display:flex;flex-direction:column}body{display:flex;flex-direction:column;min-height:100vh}