*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:#0e0e10;color:#eee;display:flex;flex-direction:column;min-height:100vh}
header{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;background:#16161b;border-bottom:1px solid #2a2a32}
header h1{font-size:18px;font-weight:600;letter-spacing:.5px}
header h1 a{color:#888;text-decoration:none;margin-right:8px}
header h1 a:hover{color:#eee}
.status{font-size:13px;padding:6px 12px;border-radius:8px;background:#222;color:#bbb}
.status.ok{background:#0f3a1f;color:#7fe49a}
.status.err{background:#3a0f1f;color:#ff7a8c}
.status.warn{background:#3a2a0f;color:#f5c267}
main{flex:1;padding:16px;display:flex;flex-direction:column;gap:16px}
.controls{display:flex;justify-content:center}
button{background:#6366f1;color:white;border:none;padding:14px 28px;font-size:16px;font-weight:600;border-radius:10px;cursor:pointer;transition:.15s}
button:hover{background:#4f52d8}
button:disabled{background:#3a3a44;cursor:not-allowed}
#grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:12px;flex:1}
.tile{position:relative;background:#000;border:1px solid #2a2a32;border-radius:12px;overflow:hidden;aspect-ratio:16/9;min-height:200px}
.tile.self{border-color:#6366f1}
.tile video{width:100%;height:100%;object-fit:contain;background:#000}
.tile .label{position:absolute;left:10px;bottom:10px;background:rgba(0,0,0,.7);padding:4px 10px;border-radius:6px;font-size:12px;letter-spacing:.5px}
.tile.self .label{background:rgba(99,102,241,.9)}
.waiting{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:48px 24px;background:#16161b;border:2px dashed #2a2a32;border-radius:12px;min-height:300px;gap:12px}
.waiting .big{font-size:22px;font-weight:600;color:#7fe49a}
.waiting .sub{font-size:14px;color:#aaa;max-width:560px;line-height:1.5}
.waiting .sub b{color:#eee;font-family:monospace;background:#0e0e10;padding:2px 8px;border-radius:4px}
@media(max-width:600px){#grid{grid-template-columns:1fr}}