.demo-sample-data .demo-badge{display:inline-flex;align-items:center;gap:8px;border:1px solid #b9cba8;background:#eef4e5;color:#31543f;border-radius:999px;padding:6px 9px;font-size:11px;font-weight:700;white-space:nowrap}
.demo-sample-data .demo-badge button{border:0;background:transparent;color:inherit;text-decoration:underline;font:inherit;cursor:pointer;padding:0}
.demo-sample-data .demo-boundary{margin:0 0 14px;padding:10px 13px;border:1px solid #cddabf;border-radius:9px;background:#f1f5e9;color:#49614e;font-size:12px;line-height:1.5}
.demo-sample-data .message-row.unread .row-subject,.demo-sample-data .message-row.unread .row-sender{font-weight:750}
.demo-toast{position:fixed;z-index:50;left:50%;bottom:24px;transform:translateX(-50%);display:flex;align-items:center;gap:14px;max-width:min(92vw,620px);padding:12px 16px;border-radius:10px;background:#193d30;color:#fff;box-shadow:0 10px 35px #193d3040;font-size:12px}
.demo-toast button{border:0;background:transparent;color:#e6f0d5;text-decoration:underline;font:inherit;font-weight:700;cursor:pointer}
.demo-key-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;padding:13px 0;border-bottom:1px solid var(--line)}.demo-key-card code,.demo-key-card p{grid-column:1}.demo-key-card .text-button{grid-column:2;grid-row:1/3}
.demo-notebook-paper{white-space:pre-wrap;overflow-wrap:anywhere;font:13px/1.75 Georgia,serif;color:var(--green);margin:0}.notebook-section-editor{width:100%;min-height:280px;resize:vertical}
.demo-sample-data .row-preview{display:block;min-width:10ch;flex-basis:12ch}
.demo-project-room{height:100%;min-height:420px;display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);border-radius:10px;overflow:hidden}.demo-room-tabs{display:flex;gap:4px;padding:10px;border-bottom:1px solid var(--line);background:var(--soft)}.demo-room-tabs button{padding:8px 10px;border:0;border-radius:7px;background:transparent;color:var(--green)}.demo-room-tabs button[aria-pressed=true]{background:var(--pale);font-weight:700}.demo-room-body{flex:1;min-height:0;overflow:auto;padding:16px}.demo-room-event,.json-receipt,.demo-room-body .snapshot-card{padding:13px;margin:0 0 10px;border:1px solid var(--line);border-radius:9px;background:#fffef9}.demo-room-event p{margin:7px 0 0;line-height:1.6}.json-receipt pre{white-space:pre-wrap;overflow-wrap:anywhere;font:11px/1.55 Consolas,monospace}.demo-room-composer{display:grid;gap:8px;margin-top:18px}.demo-room-composer textarea{width:100%;resize:vertical}.demo-chat-line{padding:10px;border-bottom:1px solid var(--line)}
.demo-snapshot-detail{margin-top:14px;padding:18px;border:1px solid var(--line);border-radius:10px;background:#fffef9}.demo-snapshot-detail h3{margin:7px 0 10px}.demo-snapshot-detail pre{margin:15px 0 0;padding:13px;border-radius:8px;background:var(--soft);white-space:pre-wrap;overflow-wrap:anywhere;font:11px/1.55 Consolas,monospace}
.demo-sample-data #connect-repository,.demo-sample-data #back-to-projects,.demo-sample-data #retry-build-room,.demo-sample-data #local-room-diagnostic{display:none!important}
.demo-sample-data #access-key-tools:before,.demo-sample-data .account-settings-tools:before{content:"DEMO · SAMPLE DATA";display:inline-block;margin-bottom:12px;color:#49614e;font-size:9px;font-weight:800;letter-spacing:.12em}
@media(max-width:700px){.demo-sample-data .topbar{grid-template-columns:auto minmax(0,1fr) auto}.demo-sample-data .demo-badge{font-size:9px;padding:5px 7px}.demo-project-room{min-height:520px}.demo-toast{bottom:12px}}
@media(max-width:640px){.demo-sample-data .app-shell,.demo-sample-data .app-shell.nav-collapsed{display:block!important;min-width:0!important;width:100%!important;overflow-x:hidden!important}.demo-sample-data .app-shell>.topbar{position:sticky!important;top:0!important;z-index:32!important;width:100%!important;min-width:0!important}.demo-sample-data #mail-app>#main{display:flex!important;position:relative!important;inset:auto!important;width:100%!important;min-width:0!important;height:calc(100dvh - 124px)!important;min-height:0!important;margin:0!important;padding:8px!important;box-sizing:border-box!important}.demo-sample-data .workspace-panel{width:100%!important;min-width:0!important}.demo-sample-data .app-shell>aside.sidebar,.demo-sample-data .app-shell.nav-collapsed>aside.sidebar{display:flex!important;position:fixed!important;z-index:42!important;top:124px!important;right:auto!important;bottom:0!important;left:0!important;width:min(82vw,286px)!important;height:calc(100dvh - 124px)!important;max-height:calc(100dvh - 124px)!important;overflow-y:auto!important;overflow-x:hidden!important;margin:0!important;padding:18px 14px!important;background:var(--paper,#fffef9)!important;border-right:1px solid var(--line,#dfe3d7)!important;box-shadow:0 18px 48px #193d3040!important;transform:translateX(-105%)!important;visibility:hidden!important;transition:transform .18s ease,visibility 0s linear .18s!important}.demo-sample-data .app-shell.demo-drawer-open>aside.sidebar{transform:translateX(0)!important;visibility:visible!important;transition-delay:0s!important}.demo-sample-data .app-shell>.demo-drawer-backdrop{display:block!important;position:fixed!important;z-index:41!important;inset:124px 0 0!important;border:0!important;background:#193d3052!important;padding:0!important}.demo-sample-data .app-shell>.demo-drawer-backdrop[hidden]{display:none!important}.demo-sample-data .demo-room-tabs{display:flex;flex-wrap:wrap;overflow:visible}.demo-sample-data .demo-room-tabs button{flex:1 1 8rem;min-width:0;white-space:normal}.demo-sample-data .demo-room-body,.demo-sample-data .demo-snapshot-detail{min-width:0}.demo-sample-data .demo-snapshot-detail pre{max-width:100%;overflow:auto}}
@media(max-width:420px){.demo-sample-data .demo-badge span{display:none}.demo-sample-data .demo-badge button{text-decoration:none}.demo-room-body{padding:10px}}
@media(prefers-reduced-motion:reduce){.demo-toast{scroll-behavior:auto}}
@media(prefers-reduced-motion:reduce){.demo-sample-data .sidebar,.demo-sample-data .nav-collapsed .sidebar{transition:none}}