*{box-sizing:border-box}html,body{color:#222;background:#fafafa;height:100%;margin:0;font-family:system-ui,sans-serif}body{flex-direction:column;display:flex}header{background:#fff;border-bottom:1px solid #ddd;align-items:center;gap:1rem;padding:.5rem 1rem;display:flex}header h1{margin:0;font-size:1rem;font-weight:600}header h1 a,header h1 a:visited{color:inherit;text-decoration:none}header h1 a:hover{text-decoration:underline}#room{color:#555;font-family:ui-monospace,monospace}#room a,#room a:visited{color:inherit;text-decoration:none}#room a:hover{text-decoration:underline}#status{color:#888;margin-left:auto;font-size:.85rem}main{flex:1;grid-template-columns:1fr 1fr;min-height:0;display:grid}#editor{resize:none;background:#fff;border:0;border-right:1px solid #ddd;outline:none;padding:1rem;font-family:ui-monospace,monospace;font-size:14px}#preview{padding:1rem 1.5rem;line-height:1.55;overflow:auto}#preview pre{background:#f0f0f0;border-radius:4px;padding:.75rem;overflow-x:auto}#preview code{font-family:ui-monospace,monospace;font-size:.9em}#preview h1,#preview h2,#preview h3{margin-top:1.2em}#preview.demo{opacity:.55}