*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#020617;color:#f1f5f9;min-height:100vh}.container{width:100%;max-width:960px;margin:0 auto;padding:16px;min-height:100vh}@media (min-width: 640px){.container{padding:48px 24px;min-height:auto}}.card{background:#0f172a;border:1px solid #1e293b;border-radius:12px;padding:20px}@media (min-width: 640px){.card{padding:32px}}@media (min-width: 768px){.card-with-sidebar{display:flex;padding:0;overflow:hidden}}.card-sidebar{display:none}@media (min-width: 768px){.card-sidebar{display:flex;flex-direction:column;width:200px;flex-shrink:0;background:#1e293b;border-right:1px solid #334155}.card-sidebar .menu-list{padding:8px 0}}.sidebar-title{padding:20px;font-size:20px;font-weight:700;color:#f1f5f9;border-bottom:1px solid #334155}.card-content{flex:1;min-width:0}@media (min-width: 768px){.card-content{padding:24px}}h1{margin:0 0 16px;font-size:24px;font-weight:700;color:#f1f5f9}@media (min-width: 640px){h1{font-size:28px;margin-bottom:20px}}form{display:grid;gap:16px}label{font-size:14px;color:#cbd5e1;display:block}input{width:100%;padding:12px 14px;border-radius:8px;border:1px solid #334155;background:#020617;color:#f1f5f9;margin-top:6px;font-size:16px}input:focus{outline:none;border-color:#10b981}input::placeholder{color:#64748b}button{margin-top:8px;border:0;border-radius:8px;padding:14px 16px;background:#10b981;color:#fff;font-weight:600;font-size:16px;cursor:pointer;transition:background .15s}button:hover{background:#059669}button:disabled{opacity:.6;cursor:default}.error{margin-top:12px;padding:10px 12px;background:#ef44441a;border:1px solid rgba(239,68,68,.3);border-radius:8px;color:#fca5a5;font-size:14px}.subtle{color:#94a3b8;font-size:14px;margin-bottom:8px}.movie-search{margin-top:20px}.search-input{width:100%;padding:12px 14px;border-radius:8px;border:1px solid #334155;background:#020617;color:#f1f5f9;font-size:16px;margin-top:0}.search-input:focus{outline:none;border-color:#10b981}.search-input::placeholder{color:#64748b}.movie-results{margin-top:20px;display:flex;flex-direction:column;gap:12px}.movie-card{display:flex;gap:12px;padding:12px;background:#1e293b;border-radius:10px;border:1px solid #334155}@media (min-width: 640px){.movie-card{padding:16px;gap:16px}}.movie-poster{width:72px;height:108px;object-fit:cover;border-radius:6px;flex-shrink:0}@media (min-width: 640px){.movie-poster{width:90px;height:135px}}.movie-poster-placeholder{width:72px;height:108px;background:#334155;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:11px;color:#64748b;flex-shrink:0}@media (min-width: 640px){.movie-poster-placeholder{width:90px;height:135px}}.movie-info{flex:1;min-width:0}.movie-title{margin:0 0 4px;font-size:15px;font-weight:600;color:#f1f5f9}@media (min-width: 640px){.movie-title{font-size:17px}}.movie-year{margin:0 0 8px;font-size:13px;color:#94a3b8}.movie-plot{margin:0;font-size:13px;color:#cbd5e1;line-height:1.5}@media (min-width: 640px){.movie-plot{font-size:14px}}.app-header{display:flex;align-items:center;gap:12px;margin-bottom:16px}.app-title{margin:0;font-size:22px}.hamburger{display:flex;flex-direction:column;gap:5px;padding:8px;background:transparent;border:none;cursor:pointer;margin:0}.hamburger span{display:block;width:22px;height:2px;background:#f1f5f9;border-radius:1px}.hamburger:hover span{background:#10b981}@media (min-width: 768px){.hamburger,.app-header{display:none}}.menu-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s;z-index:100}.menu-overlay.open{opacity:1;visibility:visible}@media (min-width: 768px){.menu-overlay{display:none}}.menu-drawer{position:fixed;top:0;left:0;bottom:0;width:260px;background:#0f172a;border-right:1px solid #1e293b;transform:translate(-100%);transition:transform .25s ease;z-index:101;display:flex;flex-direction:column}.menu-drawer.open{transform:translate(0)}@media (min-width: 768px){.menu-drawer{display:none}}.menu-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid #1e293b;font-weight:600;font-size:18px}.menu-list{list-style:none;margin:0;padding:12px 0}.menu-list li button{width:100%;text-align:left;padding:12px 20px;background:transparent;border:none;color:#cbd5e1;font-size:15px;cursor:pointer;transition:background .15s,color .15s;margin:0;border-radius:0}.menu-list li button:hover{background:#1e293b;color:#f1f5f9}.menu-list li button.active{background:#10b9811a;color:#10b981;border-left:3px solid #10b981}.btn-icon{background:transparent;border:none;color:#94a3b8;font-size:20px;cursor:pointer;padding:4px 8px;margin:0;line-height:1;border-radius:4px}.btn-icon:hover{background:#1e293b;color:#f1f5f9}.settings-page{display:flex;flex-direction:column;gap:20px}.settings-card{background:#1e293b;border-radius:10px;padding:16px}.settings-card h2{margin:0 0 12px;font-size:16px;font-weight:600;color:#f1f5f9}.settings-list{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}.settings-item{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;background:#0f172a;border-radius:6px;font-size:14px}.settings-user{padding:10px 12px;background:#0f172a;border-radius:6px}.settings-user-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-size:14px}.settings-user input{padding:8px 10px;font-size:14px;margin-top:0}.settings-add{display:flex;gap:8px}.settings-add input{flex:1;padding:10px 12px;font-size:14px;margin-top:0}.settings-add button{margin-top:0;padding:10px 16px;font-size:14px}.users-table-wrap{overflow-x:auto;margin-bottom:12px}.users-table{width:100%;border-collapse:collapse;font-size:13px}.users-table th,.users-table td{text-align:left;padding:8px 6px;border-bottom:1px solid #334155}.users-table th{color:#94a3b8;font-weight:500;font-size:12px;white-space:nowrap}.users-table td{color:#f1f5f9}.users-table input{padding:6px 8px;font-size:13px;margin:0;width:100px}.btn-small{padding:6px 12px;font-size:13px;margin:0}.shortlist-page{width:100%}.shortlist-heading{font-size:18px;font-weight:600;color:#f1f5f9;margin:24px 0 12px}.btn-add,.btn-remove{margin-top:8px;padding:6px 14px;font-size:13px;border-radius:4px;border:none;cursor:pointer;font-weight:500}.btn-add{background:#10b981;color:#fff}.btn-add:hover{background:#059669}.btn-remove{background:#64748b;color:#fff}.btn-remove:hover{background:#475569}.in-shortlist{display:inline-block;margin-top:8px;font-size:12px;color:#10b981}.toast{position:fixed;top:16px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:8px;font-size:14px;font-weight:500;z-index:200;animation:toast-in .2s ease-out;max-width:calc(100% - 32px)}@keyframes toast-in{0%{opacity:0;transform:translate(-50%) translateY(-8px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.toast-success{background:#065f46;color:#d1fae5;border:1px solid #10b981}.toast-error{background:#7f1d1d;color:#fecaca;border:1px solid #ef4444}.toast-close{background:transparent;border:none;color:inherit;font-size:18px;cursor:pointer;padding:0 4px;margin:0;opacity:.7;line-height:1}.toast-close:hover{opacity:1;background:transparent}.movie-nights-page{width:100%}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.page-header h2{font-size:20px;font-weight:600;color:#f1f5f9;margin:0}.btn-primary{background:#10b981;color:#fff;border:none;padding:8px 16px;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer}.btn-primary:hover{background:#059669}.btn-danger{background:#dc2626;color:#fff;border:none;padding:8px 16px;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer}.btn-danger:hover{background:#b91c1c}.create-night-form{background:#1e293b;padding:16px;border-radius:8px;margin-bottom:16px;display:grid;gap:12px}.create-night-form label{display:flex;flex-direction:column;gap:4px;font-size:14px;color:#94a3b8}.create-night-form select,.create-night-form input[type=number],.create-night-form input[type=date]{padding:10px;border-radius:6px;border:1px solid #334155;background:#0f172a;color:#f1f5f9;font-size:16px}.create-night-form button[type=submit]{margin-top:8px}.nights-list{display:flex;flex-direction:column;gap:12px}.night-card{background:#1e293b;padding:12px 16px;border-radius:8px;display:flex;justify-content:space-between;align-items:center;gap:12px}.night-info{flex:1;min-width:0}.night-date{font-size:16px;font-weight:600;color:#f1f5f9;margin-bottom:4px}.night-details{font-size:13px;color:#94a3b8;display:flex;flex-wrap:wrap;gap:6px;align-items:center}.separator{color:#475569}.status-badge{display:inline-block;padding:2px 8px;border-radius:4px;font-size:11px;font-weight:600;text-transform:uppercase}.bg-yellow-600{background:#ca8a04;color:#fef9c3}.bg-emerald-600{background:#059669;color:#d1fae5}.bg-slate-600{background:#475569;color:#e2e8f0}@media (max-width: 600px){.night-card{flex-direction:column;align-items:stretch}.night-card .btn-danger{align-self:flex-end}}.home-page{width:100%}.upcoming-night h2{font-size:18px;font-weight:600;color:#94a3b8;margin:0 0 12px;text-transform:uppercase;letter-spacing:.5px}.night-banner{background:linear-gradient(135deg,#1e3a5f,#1e293b);border:1px solid #334155;border-radius:12px;padding:20px;margin-bottom:16px}.night-banner-date{font-size:24px;font-weight:700;color:#f1f5f9;margin-bottom:8px}.night-banner-meta{font-size:14px;color:#94a3b8;display:flex;gap:8px;align-items:center}.host-preparing{text-align:center;padding:40px 20px;background:#1e293b;border-radius:8px}.host-controls{background:#1e293b;border-radius:8px;padding:16px}.host-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:16px}.host-header h3{font-size:16px;font-weight:600;color:#f1f5f9;margin:0}.host-actions{display:flex;gap:8px;flex-wrap:wrap}.btn-secondary{background:#334155;color:#f1f5f9;border:none;padding:8px 14px;border-radius:6px;font-size:13px;font-weight:500;cursor:pointer}.btn-secondary:hover{background:#475569}.draft-movies{margin-bottom:16px}.btn-begin-voting{width:100%;background:#10b981;color:#fff;border:none;padding:14px 20px;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;margin-top:16px}.btn-begin-voting:hover{background:#059669}.btn-begin-voting:disabled{background:#64748b;cursor:not-allowed}.add-from-section{margin-top:20px;padding-top:20px;border-top:1px solid #334155}.add-from-section h4{font-size:14px;font-weight:600;color:#94a3b8;margin:0 0 12px}.voting-movies{margin-top:16px}.voting-movies h3{font-size:16px;font-weight:600;color:#f1f5f9;margin:0 0 12px}.pinpad{display:flex;flex-direction:column;align-items:center;gap:16px;max-width:280px;margin:0 auto}.pinpad-label{font-size:14px;color:#cbd5e1;text-align:center}.pinpad-display{display:flex;align-items:center;justify-content:center;gap:12px;min-height:32px;width:100%}.pinpad-dots{display:flex;gap:8px;justify-content:center;min-height:16px}.pinpad-dot{width:12px;height:12px;border-radius:50%;background:#10b981}.pinpad-backspace{background:transparent;border:none;color:#94a3b8;font-size:20px;padding:4px 8px;margin:0;cursor:pointer;line-height:1}.pinpad-backspace:hover{color:#f1f5f9;background:transparent}.pinpad-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;width:100%}.pinpad-digit{aspect-ratio:1;border-radius:50%;background:#1e293b;border:1px solid #334155;color:#f1f5f9;font-size:24px;font-weight:600;cursor:pointer;margin:0;padding:0;display:flex;align-items:center;justify-content:center;transition:background .15s,border-color .15s}.pinpad-digit:hover{background:#334155;border-color:#475569}.pinpad-digit:active{background:#10b981;border-color:#10b981}.pinpad-zero{width:33.33%;margin:0 auto}.pinpad-actions{display:flex;gap:12px;width:100%}.pinpad-clear,.pinpad-ok{flex:1;padding:12px 16px;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;margin:0}.pinpad-clear{background:#334155;border:none;color:#f1f5f9}.pinpad-clear:hover{background:#475569}.pinpad-ok{background:#10b981;border:none;color:#fff}.pinpad-ok:hover{background:#059669}.pinpad-ok:disabled,.pinpad-clear:disabled{opacity:.5;cursor:not-allowed}
