*,:before,:after{box-sizing:border-box}body{margin:0}#root{min-height:100svh}:root{--mint:#38faa9;--mint-light:#96f5cd;--black:#000;--gray-light:#dfdfdf;--gray-mid:#c9c9c9;--red-light:#f8afaf;--radius:4px;--border-width:1px;--font-display:"Rubik Mono One", monospace;--font-body:"Rubik", sans-serif}body{font-family:var(--font-body);color:var(--black)}.browse-page,.movie-detail-page{max-width:720px;margin:0 auto}.browse-page{padding-bottom:16px}.browse-header{background:var(--mint-light);border-bottom:var(--border-width) solid var(--black);padding:20px 16px}.browse-header h1{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.05em;margin:0 0 4px;font-size:2rem;font-weight:700}.browse-header p{margin:0}.filters-toggle{border:none;border-bottom:var(--border-width) solid var(--black);cursor:pointer;background:0 0;justify-content:space-between;align-items:center;width:100%;margin-bottom:16px;padding:12px 16px;font-family:inherit;font-size:1rem;display:flex}.filters-toggle.open{border-bottom:var(--border-width) solid var(--gray-light);width:calc(100% - 32px);margin:0 16px 16px;padding:12px 0}.filters-panel{border-bottom:var(--border-width) solid var(--black);flex-direction:column;gap:16px;margin-bottom:16px;padding:0 16px 16px;display:flex}.filters-field{flex-direction:column;gap:4px;display:flex}.filters-field input{border:var(--border-width) solid var(--black);border-radius:var(--radius);padding:10px 12px;font-family:inherit;font-size:1rem}.filters-submit{background:var(--mint);border-radius:var(--radius);cursor:pointer;border:none;padding:12px;font-family:inherit;font-size:1rem;font-weight:700}.stepper-row{gap:24px;display:flex}.stepper{flex:1}.stepper p{margin:0 0 6px}.stepper-control{border:var(--border-width) solid var(--black);border-radius:var(--radius);align-items:center;display:flex;overflow:hidden}.stepper-control span{text-align:center;flex:1;font-weight:700}.stepper-control button{background:var(--mint);cursor:pointer;border:none;width:44px;height:44px;font-family:inherit;font-size:1.2rem;font-weight:700}.stepper-control button:disabled{background:var(--gray-mid);cursor:not-allowed}.genre-multiselect{position:relative}.genre-multiselect>button{border:var(--border-width) solid var(--black);border-radius:var(--radius);cursor:pointer;background:#fff;justify-content:space-between;align-items:center;width:100%;padding:10px 12px;font-family:inherit;font-size:1rem;display:flex}.genre-multiselect-options{border:var(--border-width) solid var(--black);border-radius:var(--radius);background:#fff;max-height:240px;margin:4px 0 0;padding:8px;list-style:none;overflow-y:auto}.genre-multiselect-options li{padding:4px 0}.genre-multiselect-options label{cursor:pointer;align-items:center;gap:8px;display:flex}.browse-page section{padding:0 16px}.browse-page section h2{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.05em;margin:0 0 12px;font-size:1.1rem}.movie-list{flex-direction:column;gap:12px;margin-bottom:24px;display:flex}.movie-card{color:inherit;gap:12px;text-decoration:none;display:flex}.movie-card img{object-fit:cover;border-radius:4px;flex-shrink:0}.movie-card-poster-placeholder{background:var(--gray-light);border-radius:4px;flex-shrink:0;width:80px;height:120px}.movie-card-body{flex-direction:column;height:120px;display:flex}.movie-card-body h3{margin:0 0 4px;font-size:1rem}.movie-card-body p{color:#333;line-clamp:3;-webkit-line-clamp:3;-webkit-box-orient:vertical;margin:0;font-size:.9rem;display:-webkit-box;overflow:hidden}.movie-card-meta{justify-content:space-between;align-items:center;gap:12px;width:100%;margin-top:auto;display:flex}.runtime-badge{border-radius:var(--radius);white-space:nowrap;padding:2px 8px;font-size:.85rem;font-weight:600}.runtime-badge-target{background:var(--mint)}.runtime-badge-over{background:var(--red-light)}.runtime-badge-under{background:var(--gray-light)}.movie-detail-page{padding:16px}.skeleton{background:linear-gradient(90deg, var(--gray-light) 25%, var(--gray-mid) 37%, var(--gray-light) 63%);border-radius:var(--radius);background-size:400% 100%;animation:1.4s infinite skeleton-shimmer}.skeleton-text{height:12px;margin-bottom:8px}.skeleton-title{width:70%;height:16px}.skeleton-meta{width:90px}.skeleton-badge{width:70px}@keyframes skeleton-shimmer{0%{background-position:100%}to{background-position:0}}@media (prefers-reduced-motion:reduce){.skeleton{animation:none}}
