.login-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:200}.login-form{background:#1a1a1a;border:1px solid #333;border-radius:8px;padding:1.5rem;width:calc(100% - 2rem);max-width:320px}@media(min-width:400px){.login-form{padding:2rem}}.login-form h2{margin-bottom:1.5rem;font-size:1.1rem;font-weight:600}.login-form label{display:block;margin-bottom:.25rem;font-size:.85rem;color:#aaa}.login-form input{width:100%;padding:.5rem;margin-bottom:1rem;background:#222;border:1px solid #444;border-radius:4px;color:#eee;font-size:.9rem}.login-form input:focus{outline:none;border-color:#666}.login-error{color:#ef4444;font-size:.85rem;margin-bottom:1rem}.login-actions{display:flex;gap:.5rem;justify-content:flex-end}.login-actions button{padding:.5rem 1rem;border-radius:4px;font-size:.85rem;cursor:pointer}.login-submit{background:#2563eb;color:#fff;border:none}.login-submit:hover{background:#1d4ed8}.login-cancel{background:none;border:1px solid #444;color:#aaa}.login-cancel:hover{color:#eee}.camera-card{background:#1a1a1a;border-radius:8px;overflow:hidden;cursor:pointer;transition:transform .15s}.camera-card video{aspect-ratio:16/9;object-fit:contain;background:#000}.camera-card:hover{transform:scale(1.02)}.camera-card-info{padding:.5rem .75rem;display:flex;align-items:center;gap:.5rem}.camera-card-name{font-size:.9rem;font-weight:500}.status-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.status-dot.live{background:#22c55e}.status-dot.offline{background:#666}.camera-card-offline{aspect-ratio:16/9;background:#222;display:flex;align-items:center;justify-content:center;color:#666;font-size:.85rem}.camera-fullscreen-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000e6;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:100;cursor:pointer}.camera-expanded-video{max-width:95vw;max-height:85vh;background:#000}.camera-expanded-video video{max-width:95vw;max-height:85vh}.camera-expanded-video:fullscreen{display:flex;align-items:center;justify-content:center;background:#000}.camera-expanded-video:fullscreen video{max-width:100vw;max-height:100vh;width:100%;height:100%;object-fit:contain}.camera-expanded-bar{display:flex;align-items:center;gap:1rem;margin-top:.75rem}.camera-fullscreen-name{color:#eee;font-size:1rem}.fullscreen-btn{background:#ffffff26;border:1px solid rgba(255,255,255,.3);color:#eee;padding:.35rem .75rem;border-radius:4px;font-size:.8rem;cursor:pointer}.fullscreen-btn:hover{background:#ffffff40}.close-btn{position:absolute;top:1rem;right:1rem;background:#ffffff26;border:1px solid rgba(255,255,255,.3);color:#eee;width:2.25rem;height:2.25rem;border-radius:50%;font-size:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center}.close-btn:hover{background:#ffffff4d}.viewer-page{padding:1rem}@media(min-width:600px){.viewer-page{padding:1.5rem}}.camera-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(400px,100%),1fr));gap:1rem}.no-cameras{color:#666;text-align:center;padding:4rem 1rem;font-size:1rem}.admin-page{padding:1rem;max-width:900px;margin:0 auto}@media(min-width:600px){.admin-page{padding:1.5rem}}.admin-page h2{font-size:1.2rem;margin-bottom:1rem}.admin-section{background:#1a1a1a;border:1px solid #333;border-radius:8px;padding:1.5rem;margin-bottom:1.5rem}.admin-section h3{font-size:1rem;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:1px solid #333}.admin-form{display:grid;grid-template-columns:1fr;gap:.75rem}@media(min-width:500px){.admin-form{grid-template-columns:1fr 1fr}}.admin-form label{font-size:.85rem;color:#aaa;margin-bottom:.15rem}.admin-form .full-width{grid-column:1 / -1}.admin-form input,.admin-form select{width:100%;padding:.5rem;background:#222;border:1px solid #444;border-radius:4px;color:#eee;font-size:.9rem}.admin-form input:focus,.admin-form select:focus{outline:none;border-color:#666}.admin-btn{padding:.5rem 1rem;border-radius:4px;font-size:.85rem;cursor:pointer;border:none}.admin-btn-primary{background:#2563eb;color:#fff}.admin-btn-primary:hover{background:#1d4ed8}.admin-btn-secondary{background:#333;color:#eee;border:1px solid #555}.admin-btn-secondary:hover{background:#444}.admin-btn-danger{background:#dc2626;color:#fff}.admin-btn-danger:hover{background:#b91c1c}.admin-message{font-size:.85rem;margin-top:.5rem}.admin-message.success{color:#22c55e}.admin-message.error{color:#ef4444}.camera-list{display:flex;flex-direction:column;gap:.75rem}.camera-list-item{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem;padding:.75rem;background:#222;border-radius:6px}.camera-list-info{display:flex;align-items:center;gap:.75rem}.camera-list-actions{display:flex;gap:.5rem}.camera-list-item .status-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.camera-list-item .status-dot.live{background:#22c55e}.camera-list-item .status-dot.offline{background:#666}.badge{font-size:.7rem;padding:.15rem .4rem;border-radius:3px;text-transform:uppercase}.badge-public{background:#1e3a2f;color:#22c55e}.badge-private{background:#3b1c1c;color:#ef4444}.stats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.75rem;margin-bottom:1rem}.stat-card{background:#222;border-radius:6px;padding:1rem;display:flex;flex-direction:column;align-items:center;gap:.25rem}.stat-value{font-size:1.5rem;font-weight:700}.stat-label{font-size:.75rem;color:#888;text-transform:uppercase}.camera-stats-list{display:flex;flex-direction:column;gap:.5rem}.camera-stats-item{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem;padding:.6rem .75rem;background:#222;border-radius:6px}.camera-stats-name{display:flex;align-items:center;gap:.5rem;font-size:.9rem}.camera-stats-values{display:flex;gap:.5rem;flex-wrap:wrap}.stat-pill{font-size:.75rem;color:#aaa;background:#1a1a1a;padding:.2rem .5rem;border-radius:3px}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#111;color:#eee}.header{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;background:#1a1a1a;border-bottom:1px solid #333}@media(min-width:600px){.header{padding:.75rem 1.5rem}}.header-title{color:#eee;text-decoration:none;font-size:1.1rem;font-weight:600}.header-nav{display:flex;gap:1rem;align-items:center}.header-nav a{color:#aaa;text-decoration:none;font-size:.85rem}.header-nav a:hover{color:#eee}.header-link-btn{background:none;border:none;color:#aaa;cursor:pointer;font-size:.85rem}.header-link-btn:hover{color:#eee}
