:root{--bg: #0f172a;--bg-2: #1e293b;--bg-3: #0b1222;--fg: #e2e8f0;--muted: #94a3b8;--accent: #38bdf8;--accent-2: #0ea5e9;--danger: #ef4444;--ok: #22c55e;--border: #334155;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--fg);-webkit-font-smoothing:antialiased}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--border);background:var(--bg-2);color:var(--fg);padding:.55rem .9rem;border-radius:.5rem;font-size:.95rem;cursor:pointer;transition:background .15s,border-color .15s;font:inherit}button:hover{background:#2c3e57}button:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--accent-2);border-color:var(--accent-2);color:#0f172a;font-weight:600}.btn-primary:hover{background:var(--accent)}.btn-secondary{background:var(--bg-2)}.btn-danger{background:var(--danger);border-color:var(--danger);color:#fff}.btn-link{background:transparent;border-color:transparent;color:var(--accent);padding:.35rem .5rem}.btn-link:hover{background:#38bdf81a;text-decoration:underline}input,textarea,select{background:var(--bg-3);color:var(--fg);border:1px solid var(--border);border-radius:.5rem;padding:.55rem .7rem;font-size:.95rem;width:100%;font:inherit}input:focus,textarea:focus,select:focus{outline:2px solid var(--accent);outline-offset:-1px}label{display:block;margin:.5rem 0 .25rem;color:var(--muted);font-size:.85rem}label.checkbox{display:flex;align-items:center;gap:.5rem;color:var(--fg)}label.checkbox input{width:auto}.muted{color:var(--muted);font-size:.85rem}.err{background:#ef44441f;color:#fca5a5;border:1px solid rgba(239,68,68,.4);padding:.6rem .8rem;border-radius:.5rem;margin:.5rem 0;font-size:.9rem}.loading{min-height:100vh;display:flex;align-items:center;justify-content:center;color:var(--muted)}.app-shell{display:flex;flex-direction:column;min-height:100vh}.app-header{background:var(--bg-3);border-bottom:1px solid var(--border);padding:.75rem 1rem;display:flex;align-items:center;gap:1rem;position:sticky;top:0;z-index:5}.brand{font-weight:700;font-size:1.05rem}.tab-bar{display:flex;gap:.25rem;flex:1;flex-wrap:wrap}.tab-bar a{padding:.4rem .75rem;border-radius:.45rem;color:var(--fg);font-size:.95rem}.tab-bar a.active,.tab-bar a:hover{background:var(--bg-2);color:var(--accent);text-decoration:none}.user-box{display:flex;align-items:center;gap:.5rem}.user-name{color:var(--muted);font-size:.85rem;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.app-main{flex:1;padding:1rem;max-width:1100px;margin:0 auto;width:100%}.page{display:flex;flex-direction:column;gap:1rem}.page h2{margin:0}.page h3{margin:0 0 .75rem}.row{display:flex;gap:.6rem;align-items:stretch;flex-wrap:wrap}.row>input{flex:1;min-width:180px}.card{background:var(--bg-2);border:1px solid var(--border);border-radius:.75rem;padding:1rem}.auth-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1rem}.auth-card{width:100%;max-width:380px;background:var(--bg-2);border:1px solid var(--border);border-radius:.75rem;padding:1.25rem;display:flex;flex-direction:column;gap:.4rem}.auth-card h1{margin:0 0 .5rem;font-size:1.4rem;text-align:center}.auth-card .btn-primary{margin-top:.75rem}.seg{display:flex;gap:.25rem;margin-bottom:.5rem;background:var(--bg-3);padding:.25rem;border-radius:.5rem}.seg button{flex:1;background:transparent;border:none;color:var(--muted);padding:.5rem;border-radius:.4rem}.seg button.on{background:var(--accent-2);color:#0f172a;font-weight:600}.list{display:grid;gap:.5rem;padding:0;margin:0;list-style:none}.list li.card{padding:.75rem 1rem}.list li.card a{color:var(--fg);display:block}.list li.card a:hover{text-decoration:none;color:var(--accent)}.messages{background:var(--bg-3);border:1px solid var(--border);border-radius:.5rem;padding:.75rem;height:60vh;overflow-y:auto;display:flex;flex-direction:column;gap:.5rem}.msg{padding:.5rem .75rem;background:var(--bg-2);border-radius:.5rem}.msg-meta{font-size:.75rem;margin-bottom:.2rem}.msg-body{white-space:pre-wrap;word-break:break-word}.grid-form{display:grid;gap:.5rem;grid-template-columns:1fr 1fr}.grid-form>.checkbox,.grid-form>button{grid-column:1 / -1}.table-wrap{overflow-x:auto}table.users{width:100%;border-collapse:collapse;font-size:.9rem}table.users th,table.users td{padding:.5rem .6rem;border-bottom:1px solid var(--border);text-align:left}table.users th{color:var(--muted);font-weight:500;font-size:.8rem}table.users tr:hover td{background:var(--bg-3)}.room{position:fixed;top:0;right:0;bottom:0;left:0;background:#000;display:flex;flex-direction:column}.room-bar{display:flex;gap:.75rem;align-items:center;justify-content:space-between;padding:.6rem 1rem;background:#0000008c;color:#fff}.room-status{color:var(--muted);font-size:.9rem}.grid{flex:1;display:grid;gap:.5rem;padding:.5rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));grid-auto-rows:minmax(180px,1fr);align-content:stretch;overflow:auto}.tile{background:#111;border-radius:.5rem;overflow:hidden;position:relative;display:flex;flex-direction:column;min-height:180px}.video-slot{flex:1;position:relative;background:linear-gradient(135deg,#1e293b,#0f172a)}.video-slot .placeholder{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;color:#94a3b8;font-size:1.05rem}.tile-name{position:absolute;bottom:.4rem;left:.5rem;background:#0009;color:#fff;padding:.2rem .55rem;border-radius:.3rem;font-size:.8rem}.badge{color:#fca5a5;font-size:.75rem}.controls{display:flex;gap:.5rem;justify-content:center;padding:.75rem;background:#000000b3;flex-wrap:wrap}.controls button{min-width:130px}@media (max-width: 640px){.app-header{flex-wrap:wrap;gap:.5rem;padding:.6rem}.tab-bar{order:3;flex-basis:100%}.user-box{order:2;margin-left:auto}.app-main{padding:.6rem}.grid-form{grid-template-columns:1fr}.grid{grid-template-columns:1fr;grid-auto-rows:minmax(220px,auto)}.controls button{min-width:0;flex:1}.messages{height:55vh}}