:root{--bg-color:#0f1115;--surface-color:#191c23b3;--surface-border:#ffffff14;--text-primary:#f0f2f5;--text-secondary:#a0a5b1;--accent-scott:#e85d04;--accent-keith:#3f37c9;--accent-star:#ffb703;--accent-hover:#ffffff0d;--glass-blur:12px;--glass-shadow:0 8px 32px 0 #0000005e;--font-main:"Outfit", sans-serif;--spacing-sm:.5rem;--spacing-md:1rem;--spacing-lg:1.5rem;--spacing-xl:2rem;--radius-sm:6px;--radius-md:12px;--radius-lg:20px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-main);background-color:var(--bg-color);color:var(--text-primary);-webkit-font-smoothing:antialiased;background-image:radial-gradient(circle at 15%,#e85d0414 0%,#0000 50%),radial-gradient(circle at 85% 30%,#3f37c914 0%,#0000 50%);background-attachment:fixed;min-height:100vh;line-height:1.5}a{color:inherit;text-decoration:none}.app-container{flex-direction:column;min-height:100vh;display:flex}.header{padding:var(--spacing-xl);text-align:center;border-bottom:1px solid var(--surface-border);-webkit-backdrop-filter:blur(var(--glass-blur));z-index:100;background:#0f1115cc;position:sticky;top:0}.header h1{letter-spacing:-.02em;background:linear-gradient(90deg,#fff,#a0a5b1);-webkit-text-fill-color:transparent;margin-bottom:var(--spacing-sm);-webkit-background-clip:text;font-size:2.5rem;font-weight:700}.header p{color:var(--text-secondary);font-size:1.1rem}.main-content{padding:var(--spacing-xl);gap:var(--spacing-xl);z-index:1;flex-direction:column;width:100%;max-width:1400px;margin:0 auto;display:flex;position:relative}@media (width>=768px){.main-content{flex-direction:row;align-items:flex-start}}.sidebar{background:var(--surface-color);border:1px solid var(--surface-border);border-radius:var(--radius-lg);padding:var(--spacing-lg);-webkit-backdrop-filter:blur(var(--glass-blur));box-shadow:var(--glass-shadow);top:calc(180px + var(--spacing-xl));z-index:90;flex:0 0 300px;position:sticky}.filter-group{margin-bottom:var(--spacing-lg)}.filter-group:last-child{margin-bottom:0}.filter-group h3{text-transform:uppercase;letter-spacing:.05em;color:var(--text-secondary);margin-bottom:var(--spacing-md);font-size:.9rem}.filter-btn{border:1px solid var(--surface-border);color:var(--text-primary);font-family:var(--font-main);cursor:pointer;background:0 0;border-radius:20px;align-items:center;gap:.5rem;margin:0 .5rem .5rem 0;padding:.5rem 1rem;font-size:.9rem;transition:all .2s;display:inline-flex}.filter-btn:hover{background:var(--accent-hover);border-color:#fff3}.filter-btn.active{background:#ffffff1a;border-color:#ffffff4d}.filter-btn.active.scott{border-color:var(--accent-scott);color:var(--accent-scott)}.filter-btn.active.keith{border-color:var(--accent-keith);color:var(--accent-keith)}.search-input{border:1px solid var(--surface-border);border-radius:var(--radius-md);width:100%;color:var(--text-primary);font-family:var(--font-main);background:#0003;padding:.75rem 1rem;font-size:1rem;transition:border-color .2s}.search-input:focus{border-color:#ffffff4d;outline:none}.movies-grid{gap:var(--spacing-lg);flex:1;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));display:grid}.movie-card{background:var(--surface-color);border:1px solid var(--surface-border);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(var(--glass-blur));flex-direction:column;transition:transform .3s cubic-bezier(.175,.885,.32,1.275),box-shadow .3s;display:flex;overflow:hidden}.movie-card:hover{border-color:#ffffff26;transform:translateY(-8px);box-shadow:0 12px 40px #00000080}.poster-container{aspect-ratio:2/3;background:#0003;width:100%;position:relative;overflow:hidden}.poster{object-fit:cover;width:100%;height:100%;transition:transform .5s}.movie-card:hover .poster{transform:scale(1.05)}.poster-placeholder{width:100%;height:100%;color:var(--text-secondary);justify-content:center;align-items:center;display:flex}.card-content{padding:var(--spacing-lg);flex-direction:column;flex:1;display:flex}.card-header{margin-bottom:var(--spacing-sm);justify-content:space-between;align-items:flex-start;display:flex}.movie-title{font-size:1.25rem;font-weight:600;line-height:1.2}.rating{color:var(--accent-star);border-radius:var(--radius-sm);background:#0000004d;align-items:center;gap:.25rem;padding:.25rem .5rem;font-size:.9rem;font-weight:600;display:flex}.movie-meta{color:var(--text-secondary);margin-bottom:var(--spacing-md);font-size:.9rem}.reviewer-badge{margin-bottom:var(--spacing-md);text-transform:uppercase;letter-spacing:.05em;border-radius:20px;padding:.25rem .75rem;font-size:.8rem;font-weight:600;display:inline-block}.reviewer-badge.scott{color:var(--accent-scott);background:#e85d0433}.reviewer-badge.keith{color:#8c85ff;background:#3f37c933}.genres{flex-wrap:wrap;gap:.5rem;margin-top:auto;display:flex}.genre-tag{border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;padding:.25rem .5rem;font-size:.75rem;transition:all .2s}.genre-tag:hover{color:var(--text-primary);background:#ffffff1a;border-color:#ffffff4d}.review-link{margin-top:var(--spacing-md);color:var(--text-primary);align-items:center;gap:.5rem;font-size:.9rem;font-weight:500;transition:opacity .2s;display:inline-flex}.review-link:hover{opacity:.8}.tab-navigation{justify-content:center;gap:var(--spacing-md);margin-top:var(--spacing-xl);display:flex}.tab-btn{border:1px solid var(--surface-border);color:var(--text-secondary);border-radius:var(--radius-lg);font-family:var(--font-main);cursor:pointer;background:#0003;align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-size:1rem;font-weight:500;transition:all .2s;display:inline-flex}.tab-btn:hover{color:var(--text-primary);background:#ffffff0d}.tab-btn.active{color:var(--text-primary);background:#ffffff1a;border-color:#ffffff4d;box-shadow:0 4px 12px #0003}.filter-select{border:1px solid var(--surface-border);border-radius:var(--radius-md);width:100%;color:var(--text-primary);font-family:var(--font-main);appearance:none;cursor:pointer;background:#0003;padding:.75rem 1rem;font-size:.9rem}.filter-select:focus{border-color:#ffffff4d;outline:none}.filter-select option{background:var(--bg-color);color:var(--text-primary)}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.clickable-meta{cursor:pointer;-webkit-text-decoration:underline #0000;text-decoration:underline #0000;transition:color .2s,text-decoration-color .2s}.clickable-meta:hover{color:var(--text-primary);-webkit-text-decoration-color:var(--text-primary);text-decoration-color:var(--text-primary)}
