*{box-sizing:border-box;margin:0;padding:0}body{color:#333;background:linear-gradient(135deg,#181818 0% 100%);min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.container{margin:0 auto}header{background:#fff;border-radius:16px;margin-bottom:20px;padding:30px;box-shadow:0 10px 30px #0003}h1{color:#333;margin-bottom:10px;font-size:2.5em}.subtitle{color:#666;font-size:1.1em}.actions{flex-wrap:wrap;gap:15px;margin-top:20px;display:flex}button{cursor:pointer;border:none;border-radius:8px;padding:12px 24px;font-size:1em;font-weight:600;transition:all .3s}button:hover{transform:translateY(-2px);box-shadow:0 5px 15px #0003}.btn-primary{color:#fff;background:#fda7a5}.btn-success{color:#fff;background:#28a745}.btn-danger{color:#fff;background:#dc3545}.btn-secondary{color:#fff;background:#6c757d}.btn-small{padding:8px 16px;font-size:.9em}.grid{grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:20px;margin-bottom:20px;display:grid}.card{background:#fff;border-radius:16px;padding:25px;box-shadow:0 10px 30px #0003}.card-header{border-bottom:2px solid #f0f0f0;justify-content:space-between;align-items:start;margin-bottom:20px;padding-bottom:15px;display:flex}.card-title{font-size:1.5em;font-weight:700}.status-badge{border-radius:20px;padding:6px 12px;font-size:.85em;font-weight:600}.status-online{color:#155724;background:#d4edda}.status-offline{color:#721c24;background:#f8d7da}.status-recording{color:#856404;background:#fff3cd}.info-row{border-bottom:1px solid #f0f0f0;justify-content:space-between;padding:10px 0;display:flex}.info-label{color:#666;font-weight:600}.info-value{color:#333}.gopro-list{margin:15px 0}.gopro-item{background:#f8f9fa;border-radius:8px;margin-bottom:10px;padding:15px}.gopro-name{color:#333;margin-bottom:8px;font-weight:600}.gopro-actions{gap:8px;margin-top:10px;display:flex}.modal{z-index:1000;background:#000000b3;justify-content:center;align-items:center;width:100%;height:100%;display:none;position:fixed;top:0;left:0}.modal.active{display:flex}.modal-content{background:#fff;border-radius:16px;width:90%;max-width:500px;padding:30px}.modal-header{color:#333;margin-bottom:20px;font-size:1.5em}.form-group{margin-bottom:20px}label{color:#555;margin-bottom:8px;font-weight:600;display:block}input{border:2px solid #e0e0e0;border-radius:8px;width:100%;padding:12px;font-size:1em;transition:border .3s}input:focus{border-color:#fda7a5;outline:none}.modal-actions{justify-content:flex-end;gap:10px;display:flex}.empty-state{text-align:center;color:#666;padding:60px 20px}.empty-state-icon{margin-bottom:20px;font-size:4em}.loading{text-align:center;color:#666;padding:20px}.spinner{border:4px solid #667eea4d;border-top-color:#fda7a5;border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}