:root{font-family:system-ui,sans-serif;color-scheme:light dark}body{margin:0;padding:1rem}.lobby,.unsupported{max-width:30rem;margin:4rem auto}.lobby form{display:flex;flex-direction:column;gap:.75rem;margin-top:1rem}.lobby input{display:block;width:100%;padding:.5rem;margin-top:.25rem}.room header{display:flex;justify-content:space-between;align-items:center;gap:1rem}.controls{display:flex;gap:.5rem}.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(16rem,1fr));gap:.75rem;margin:1rem 0}.tile{position:relative;aspect-ratio:16 / 9;background:#000;border-radius:.5rem;overflow:hidden}.tile-label{position:absolute;left:.5rem;bottom:.5rem;color:#fff;background:#00000080;padding:.1rem .4rem;border-radius:.25rem;font-size:.85rem;z-index:1}.tile-connecting{display:grid;place-items:center;height:100%;color:#aaa}.roster ul{list-style:none;padding:0}.roster li{display:flex;align-items:center;gap:.5rem;padding:.25rem 0}.error{color:#c00}.hint{color:#888;font-size:.85rem}