.demo-lab-root{background:var(--color-bg);width:100%;min-height:100dvh;color:var(--color-text);font-family:var(--font-body);position:relative}.demo-lab-main{width:100%;height:100dvh;position:relative;overflow:hidden}.demo-lab-loading{height:100dvh;font-family:var(--font-body);color:var(--color-text-secondary);flex-direction:column;justify-content:center;align-items:center;gap:1rem;display:flex}.demo-lab-spinner{border:3px solid var(--color-bg-elevated,#1e293b);border-top-color:var(--color-primary,#3b82f6);border-radius:50%;width:36px;height:36px;animation:.8s linear infinite demo-lab-spin}@keyframes demo-lab-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.demo-lab-spinner{animation:none}}.demo-lab-shell{--color-text:#e8e0d8;--color-text-muted:#b8ada3;--color-bg:#0d1117;--color-bg-card:#ffffff0f;--color-border:#c4956a4d;width:100%;height:100dvh;position:relative}.demo-lab-canvas-frame{z-index:1;flex-direction:column;display:flex;position:absolute;inset:0}.demo-lab-shell--pre-sandbox .demo-lab-canvas-frame{top:calc(64px + env(safe-area-inset-top))}@media (max-width:768px){.demo-lab-shell--pre-sandbox .demo-lab-canvas-frame{top:calc(108px + env(safe-area-inset-top))}.demo-lab-shell--framing .demo-lab-canvas-frame,.demo-lab-shell--resolved .demo-lab-canvas-frame{top:calc(130px + env(safe-area-inset-top))}.demo-lab-shell--framing .demo-lab-canvas-frame{bottom:calc(96px + env(safe-area-inset-bottom))}.demo-lab-shell--resolved .demo-lab-canvas-frame{bottom:calc(14px + env(safe-area-inset-bottom))}html[data-cookie-banner=visible] .demo-lab-shell--resolved .demo-lab-canvas-frame{bottom:calc(140px + env(safe-area-inset-bottom))}.demo-lab-shell--framing .demo-lab-hero-banner,.demo-lab-shell--resolved .demo-lab-hero-banner{display:none}.demo-lab-shell--framing .canvas-story-strip,.demo-lab-shell--resolved .canvas-story-strip{top:calc(12px + env(safe-area-inset-top))}html[data-cookie-banner=visible] .demo-lab-shell--framing .demo-lab-canvas-frame{bottom:calc(222px + env(safe-area-inset-bottom))}}.demo-lab-shell--bar-visible .demo-lab-canvas-frame{display:none}@media (max-width:768px){.demo-lab-shell--mobile-stack .waitlist-bar{display:none}.demo-lab-shell--mobile-stack .post-demo-showcase{top:calc(12px + env(safe-area-inset-top));bottom:calc(14px + env(safe-area-inset-bottom));padding:18px 18px 22px}html[data-cookie-banner=visible] .demo-lab-shell--mobile-stack .post-demo-showcase{bottom:calc(140px + env(safe-area-inset-bottom))}}.demo-lab-flying-layer{pointer-events:none;z-index:5;width:100%;height:100%;position:absolute;top:0;left:0}.demo-lab-home-link{top:calc(16px + env(safe-area-inset-top));z-index:70;color:#e8e0d8;font-family:var(--font-heading,var(--font-body));letter-spacing:.02em;cursor:pointer;background:#0d1117d9;border:1px solid #c4956a4d;border-radius:20px;align-items:center;padding:6px 14px;font-size:14px;font-weight:600;text-decoration:none;transition:background .15s,border-color .15s;display:flex;position:fixed;left:16px;box-shadow:0 6px 18px #0006}.demo-lab-home-link:hover,.demo-lab-home-link:focus-visible{border-color:var(--color-primary,#c4956a);color:var(--color-primary,#c4956a);background:#0d1117f7;outline:none}@media (max-width:768px){.demo-lab-home-link{top:calc(12px + env(safe-area-inset-top));padding:5px 12px;font-size:13px;left:12px}}.demo-lab-close-sandbox,.demo-lab-replay{top:calc(16px + env(safe-area-inset-top));z-index:70;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);width:40px;height:40px;color:var(--color-text,#e8e0d8);font-family:var(--font-body,"Inter", sans-serif);cursor:pointer;background:#0d1117f0;border:1px solid #c4956a66;border-radius:50%;justify-content:center;align-items:center;padding:0;line-height:1;transition:background .15s,transform .15s;display:flex;position:fixed;right:16px;box-shadow:0 6px 18px #0006}.demo-lab-close-sandbox{font-size:24px;font-weight:400}.demo-lab-replay{font-size:20px;font-weight:600}.demo-lab-close-sandbox:hover,.demo-lab-close-sandbox:active,.demo-lab-replay:hover,.demo-lab-replay:active{background:#0d1117f7;transform:scale(1.06)}@media (max-width:768px){.demo-lab-close-sandbox,.demo-lab-replay{top:calc(12px + env(safe-area-inset-top));width:36px;height:36px;right:12px}.demo-lab-close-sandbox{font-size:22px}.demo-lab-replay{font-size:18px}}.demo-lab-spotlight-layer{pointer-events:none;z-index:150;width:100%;height:100%;position:absolute;top:0;left:0}.canvas-story-labels{pointer-events:none;z-index:4;width:100%;height:100%;position:absolute;top:0;left:0}.demo-lab-skip-link{z-index:60;color:var(--color-text-muted,#b8ada3);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);font-family:var(--font-body,"Inter", sans-serif);letter-spacing:.02em;background:#0d1117bf;border:1px solid #c4956a40;border-radius:4px;padding:4px 10px;font-size:11px;font-weight:500;text-decoration:none;transition:background .15s,border-color .15s,color .15s;position:fixed;top:72px;right:16px}.demo-lab-skip-link:hover,.demo-lab-skip-link:focus-visible{border-color:var(--color-primary,#c4956a);color:var(--color-primary,#c4956a);background:#0d1117f2;outline:none}@media (max-width:768px){.demo-lab-skip-link{display:none}}.demo-lab-shell .minimap-container,.demo-lab-shell .canvas-minimap,.demo-lab-shell .main-toolbar,.demo-lab-shell--pre-sandbox .violation-badge{display:none!important}.demo-lab-shell .canvas{background-image:radial-gradient(circle,#966e46a6 2px,#0000 2px);background-size:22px 22px}.demo-lab-shell--intro:before{content:"";-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:65;pointer-events:none;background:#0d11178c;position:fixed;inset:0}.demo-lab-shell .mobile-canvas-toolbar{display:none!important}.demo-lab-shell .seat-guest-circle{position:relative}.demo-lab-shell .seat-guest-circle:before{content:"";position:absolute;inset:-12px}.demo-lab-shell--sandbox .seat-guest-circle{animation:1.5s ease-in-out 3 demoLabDragHint}@keyframes demoLabDragHint{0%,to{box-shadow:0 0 #d4a57400}50%{box-shadow:0 0 18px 2px #d4a57473}}@media (prefers-reduced-motion:reduce){.demo-lab-shell--sandbox .seat-guest-circle{animation:none}}