.demo-bar{justify-content:center;gap:6px 14px;min-height:40px;padding:6px 16px;background:#141614;color:#f4f5f2;font-size:13px;line-height:1.3}.demo-bar,.demo-bar p{display:flex;flex-wrap:wrap;align-items:center}.demo-bar p{gap:4px 8px;margin:0}.demo-bar strong{font-weight:600}.demo-bar-time{color:#c9ccc4;font-variant-numeric:tabular-nums}.demo-dot{width:8px;height:8px;border-radius:50%;background:#2f9e55;box-shadow:0 0 0 3px rgb(47 158 85/25%)}.demo-bar[data-state=visitor] .demo-dot{background:#dc9a0e;box-shadow:0 0 0 3px rgb(220 154 14/25%)}.demo-bar[data-state=owner] .demo-dot{background:#6f8fd6;box-shadow:0 0 0 3px rgb(111 143 214/25%)}.demo-bar[data-state=ended] .demo-dot{background:#9a9e96;box-shadow:none}.demo-actions{display:inline-flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px}.demo-confirm{margin-right:2px}.demo-bar .demo-bar-btn{display:inline-flex;align-items:center;min-height:30px;padding:0 12px;border:1px solid rgb(255 255 255/22%);border-radius:999px;background:transparent;color:inherit;font:inherit;font-size:12.5px;font-weight:500;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color .15s ease,border-color .15s ease}.demo-bar .demo-bar-btn:hover{border-color:rgb(255 255 255/60%)}.demo-bar .demo-bar-btn.solid{border-color:#f4f5f2;background:#f4f5f2;color:#141614}.demo-bar .demo-bar-btn.solid:hover{background:white}.demo-bar .demo-bar-btn:disabled{opacity:.5;cursor:default}.demo-bar .demo-bar-btn:focus-visible{outline:2px solid #f4f5f2;outline-offset:2px}.demo-page{max-width:820px}.demo-page .demo-lede{max-width:60ch;font-size:16px;line-height:1.6}.demo-start{display:grid;justify-items:start;gap:12px;margin-block:28px 40px}.demo-notice{margin-block:28px 0}.demo-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0;padding:0;list-style:none}.demo-points li{display:grid;align-content:start;gap:10px;padding:20px;border-radius:var(--sf-r-card);background:var(--sf-panel)}.demo-points strong{font-size:15px;font-weight:550;color:var(--sf-ink)}.demo-points p{margin:0;color:var(--sf-muted);font-size:14px;line-height:1.55}.demo-credentials,.demo-running{display:grid;justify-items:start;gap:14px;margin-block:28px 40px}.demo-credentials h2,.demo-running h2{margin:0}.demo-credentials dl{display:grid;gap:8px;width:100%;margin:0}.demo-credentials dl>div{display:grid;grid-template-columns:84px minmax(0,1fr) auto;align-items:center;gap:10px;padding:8px 8px 8px 14px;border:1px solid var(--sf-line);border-radius:var(--sf-r-control);background:white}.demo-credentials dt{color:var(--sf-muted);font-size:13px}.demo-credentials dd{margin:0;overflow-wrap:anywhere}.demo-mono{font-family:var(--font-geist-mono),ui-monospace,monospace;font-size:14px}.demo-running-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px}@media (max-width:720px){.demo-points{grid-template-columns:1fr}.demo-credentials dl>div{grid-template-columns:minmax(0,1fr) auto;row-gap:2px}.demo-credentials dd{grid-column:1/-1;grid-row:2}}