/* The home owns its visual system; product pages keep their existing styles. */
:root {
  color-scheme:dark;
  --bg:#090a0e;
  --panel:#17141f;
  --text:#f5f3ed;
  --muted:#a4a1b0;
  --line:#ffffff16;
  --accent:#b5a5ff;
  --orange:#ff9b5e;
  --ease:cubic-bezier(.2,.8,.2,1);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  background:var(--bg);
  color:var(--text);
}

* {
  box-sizing:border-box;
}

html {
  scroll-behavior:smooth;
  scroll-padding-top:105px;
}

body {
  margin:0;
  overflow-x:clip;
}

button,a,summary {
  -webkit-tap-highlight-color:transparent;
}

button,input {
  font:inherit;
}

button,a {
  touch-action:manipulation;
}

button,summary {
  cursor:pointer;
}

button {
  color:inherit;
}

a {
  color:inherit;
  text-decoration:none;
}

img {
  max-width:100%;
  height:auto;
  display:block;
}

h1,h2,h3,h4,p {
  margin:0;
}

button {
  border:0;
}

button:focus-visible,a:focus-visible,summary:focus-visible {
  outline:3px solid #c8b9ff;
  outline-offset:6px;
}

::selection {
  background:#b5a5ff;
  color:#0c1019;
}

[hidden] {
  display:none!important;
}

.lab-wrap {
  width:min(1200px,calc(100% - 96px));
  margin-inline:auto;
}

.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
  border:0;
}

.skip-link {
  position:fixed;
  top:8px;
  left:10px;
  transform:translateY(-150%);
  z-index:20;
  background:var(--text);
  color:var(--bg);
  padding:12px 20px;
  border-radius:10px;
}

.skip-link:focus {
  transform:none;
}

.lab-header {
  position:sticky;
  top:0;
  z-index:10;
  background:#090a0eea;
  backdrop-filter:blur(18px);
  border-bottom:1px solid var(--line);
}

.header-inner {
  display:flex;
  align-items:center;
  gap:25px;
  min-height:78px;
}

.lab-brand {
  display:flex;
  align-items:center;
  gap:10px;
  font-size:20px;
  font-weight:750;
  letter-spacing:-.9px;
  white-space:nowrap;
}

.brand-suffix {
  font-weight:400;
  color:var(--muted);
}

.brand-period {
  color:var(--accent);
}

.header-nav {
  display:flex;
  gap:26px;
  margin-left:auto;
  font-size:13px;
  color:#c4c8d1;
}

.header-nav a {
  padding:12px 0;
  transition:color .2s;
}

.header-nav a:hover {
  color:var(--accent);
}

.header-cta {
  font-size:12px;
  padding:13px 18px;
  background:var(--accent);
  color:var(--bg);
  border-radius:30px;
  font-weight:700;
  white-space:nowrap;
}

.lab-languages {
  position:relative;
  font-size:12px;
  color:var(--muted);
}

.lab-languages summary {
  list-style:none;
  padding:12px 0;
  white-space:nowrap;
}

.lab-languages summary::-webkit-details-marker {
  display:none;
}

.lab-languages nav {
  position:absolute;
  right:0;
  top:42px;
  display:grid;
  min-width:170px;
  padding:8px;
  background:#202637;
  border:1px solid var(--line);
  box-shadow:0 16px 40px #0005;
  border-radius:12px;
}

.lab-languages nav a {
  padding:11px 14px;
  border-radius:6px;
}

.lab-languages a:hover,.lab-languages a[aria-current] {
  background:#ffffff0c;
  color:var(--text);
}


/* Local Toc Toc interaction. */
.demo-copy {
  display:flex;
  align-items:start;
  flex-direction:column;
}

.lab-pill {
  display:inline-block;
  color:var(--orange);
  font:10px ui-monospace,monospace;
  margin-top:15px;
}

h3 {
  font-size:30px;
  line-height:1.12;
  letter-spacing:-1px;
}

.demo-copy h3 {
  margin-top:23px;
  max-width:300px;
}

.demo-copy>p {
  font-size:14px;
  line-height:1.8;
  color:var(--muted);
  margin-top:16px;
}

.demo-steps {
  padding:0;
  list-style:none;
  margin:27px 0;
}

.demo-steps li {
  display:flex;
  gap:13px;
  align-items:center;
  padding:12px 0;
  color:#8a91a2;
  font-size:12px;
  border-bottom:1px solid var(--line);
  transition:color .25s;
}

.demo-steps li>span {
  font:10px ui-monospace,monospace;
  display:grid;
  place-items:center;
  width:24px;
  height:24px;
  border:1px solid #ffffff15;
  border-radius:50%;
}

.demo-steps .is-active {
  color:#ffd7b9;
}

.demo-steps .is-active>span {
  background:#ff9b5e;
  color:#20140e;
  border-color:transparent;
}

.demo-interactive {
  align-self:center;
  min-width:0;
}

.demo-window {
  height:335px;
  background:#181c2a;
  border:1px solid #ffffff20;
  border-radius:14px;
  overflow:hidden;
  position:relative;
  box-shadow:0 20px 60px #0003;
}

.demo-window>.window-bar {
  position:relative;
  z-index:2;
}

.demo-desktop {
  height:calc(100% - 35px);
  background:radial-gradient(ellipse at 0% 100%,#50365277,transparent 65%),#1c2435;
  display:grid;
  place-items:center;
  padding:22px;
}

.focus-paper {
  width:75%;
  padding:23px;
  background:#f1efe9;
  color:#313441;
  box-shadow:0 12px 25px #0004;
  border-radius:7px;
  transform:rotate(-3deg);
}

.focus-paper>.lab-kicker {
  color:#717685;
  font-size:9px;
  letter-spacing:1px;
}

.focus-paper strong {
  display:block;
  margin:10px 0 20px;
  font-size:20px;
  letter-spacing:-.5px;
}

.skeleton-line {
  width:95%;
  height:4px;
  background:#c8c9c8;
  border-radius:6px;
  margin:7px 0;
}

.skeleton-line.short {
  width:55%;
  margin-bottom:15px;
}

.focus-task {
  font-size:10px;
  margin:10px 0;
  color:#636874;
}

.focus-cursor {
  width:2px;
  height:13px;
  background:#7565ad;
}

.desktop-note {
  font-size:9px;
  color:#a7b1c9;
  margin-top:15px;
}

.meeting-overlay {
  position:absolute;
  inset:35px 0 0;
  display:grid;
  place-items:center;
  background:linear-gradient(120deg,#1c366bcc,#593522cc);
  backdrop-filter:blur(12px);
  z-index:3;
  animation:stage-enter .3s both;
}

.meeting-card {
  width:80%;
  max-width:370px;
  background:#222228;
  border:1px solid #ffffff1c;
  border-radius:12px;
  padding:22px;
  box-shadow:0 20px 50px #0004;
}

.meeting-meta {
  font-size:10px;
  color:#b4b5c0;
  display:flex;
  gap:7px;
  align-items:center;
}

.meeting-meta .status-dot {
  color:#8eacf6;
}

.meeting-card h4 {
  font-size:20px;
  margin:13px 0 18px;
  letter-spacing:-.5px;
}

.count-label {
  font-size:10px;
  color:#aaa9b3;
  display:block;
}

.demo-count {
  font:400 49px/1.25 Arial,sans-serif;
  letter-spacing:-2px;
  color:#ff9b5e;
  font-variant-numeric:tabular-nums;
  display:block;
  margin:3px 0 14px;
}

.join-button {
  width:100%;
  background:#ff9b5e;
  color:#27170c;
  padding:12px;
  border-radius:8px;
  font-size:12px;
  font-weight:700;
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.join-button:hover {
  background:#ffb789;
}

.demo-toolbar {
  margin-top:22px;
  display:flex;
  align-items:center;
  gap:20px;
  flex-wrap:wrap;
}

.demo-toolbar .lab-button {
  background:var(--orange);
  font-size:12px;
  padding:14px 20px;
  gap:12px;
}

.demo-toolbar>span {
  font-size:10px;
  line-height:1.6;
  color:var(--muted);
  max-width:170px;
}

.demo-success {
  position:absolute;
  inset:35px 0 0;
  background:#1b2628;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  text-align:center;
  padding:25px;
  z-index:3;
}

.success-check {
  font-size:36px;
  color:#add9b9;
  margin-bottom:16px;
}

.demo-success h4 {
  font-size:24px;
}

.demo-success p {
  font-size:12px;
  color:#a2bdb4;
  margin-top:12px;
  line-height:1.6;
}

.is-knocking {
  animation:knock .72s ease-in-out;
}

.demo-window.is-expired .demo-count {
  color:#f6caaa;
}


/* Continuous scenes: screenshots float in the page instead of nested cards. */
main { overflow:clip; }
.lab-hero { position:relative; isolation:isolate; display:grid; grid-template-columns:1.05fr 1fr; align-items:center; gap:36px; min-height:calc(100svh - 78px); padding-block:100px 120px; }
.hero-copy { position:relative; z-index:2; min-width:0; }
.lab-kicker { display:flex; align-items:center; gap:10px; color:var(--accent); font:500 10px/1.6 ui-monospace,SFMono-Regular,monospace; letter-spacing:2px; text-transform:uppercase; }
.status-dot { width:6px; height:6px; border-radius:50%; background:currentColor; box-shadow:0 0 14px currentColor; display:inline-block; flex:none; }
h1 { font-size:clamp(70px,8.8vw,132px); font-weight:850; line-height:.97; letter-spacing:-.065em; margin:30px 0; }
h1>span { color:var(--accent); display:inline-block; text-shadow:0 0 70px #b5a5ff16; }
.hero-description { max-width:395px; color:var(--muted); font-size:17px; line-height:1.8; }
.lab-actions { display:flex; align-items:center; gap:26px; flex-wrap:wrap; margin-top:32px; }
.lab-button { display:inline-flex; align-items:center; justify-content:center; gap:24px; padding:17px 24px; min-height:48px; border-radius:40px; background:var(--accent); color:#16121e; font-size:13px; font-weight:750; transition:transform .25s var(--ease),box-shadow .25s; }
.lab-button:hover { transform:translateY(-3px); box-shadow:0 10px 40px #b5a5ff30; }
.lab-text-link { display:inline-flex; align-items:center; gap:13px; min-height:44px; color:var(--text); font-size:13px; font-weight:600; }
.lab-text-link:hover { color:var(--accent); }


.magic-trail { position:absolute; width:145%; max-width:none; height:115%; left:-25%; top:-8%; z-index:-1; pointer-events:none; overflow:visible; transform:translateY(var(--hero-drift,0px)); }
.magic-trail path { stroke:var(--accent); stroke-linecap:round; }.trail-soft { stroke-width:32; opacity:.08; filter:blur(12px); }.trail-main { stroke-width:2; opacity:.46; stroke-dasharray:1; animation:trace-in 1.8s var(--ease) both; }.trail-fine { stroke-width:1; opacity:.15; }
.hero-lab { --stage-color:var(--orange); position:relative; min-width:0; perspective:1400px; transform:translateY(calc(var(--hero-drift,0px) * -.35)); }
.hero-lab[data-product=pauta] { --stage-color:#dacbaa; }.hero-lab[data-product=sundust] { --stage-color:#9ab7f2; }.hero-lab[data-product=poof] { --stage-color:#c5a3ef; }
.hero-lab::before { content:""; position:absolute; inset:-25% -35%; background:radial-gradient(ellipse,color-mix(in srgb,var(--stage-color),transparent 90%),transparent 66%); pointer-events:none; }
.hero-stage { position:relative; transform:rotate(-5deg) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)); transition:transform .6s var(--ease); }
.stage-label { display:flex; justify-content:space-between; margin-bottom:20px; font:9px ui-monospace,monospace; letter-spacing:1.7px; text-transform:uppercase; color:var(--muted); }.stage-label>span:first-child { display:flex; align-items:center; gap:9px; color:var(--stage-color); }
.stage-panel { animation:stage-enter .6s var(--ease) both; }
.hero-monitor,.space-preview { overflow:hidden; border:1px solid #ffffff24; border-radius:14px; box-shadow:0 30px 85px #0009; background:#17151e; }
.hero-monitor>img,.space-preview>img { width:100%; aspect-ratio:1.6; object-fit:contain; }
.stage-caption { display:flex; align-items:center; gap:14px; margin-top:25px; }
.stage-caption>img { flex:none; width:62px; height:62px; border-radius:22%; object-fit:contain; box-shadow:0 12px 24px #0004; }.stage-caption strong { font-size:23px; letter-spacing:-.6px; }.stage-caption p { color:var(--muted); font-size:11px; line-height:1.5; margin-top:5px; }
.stage-caption>a { display:grid; place-items:center; flex:none; margin-left:auto; width:44px; height:44px; border-radius:50%; background:#ffffff0a; font-size:24px; }.stage-caption>a:hover { background:var(--stage-color); color:var(--bg); }
.stage-tag { display:block; margin:10px 0 0 76px; color:var(--stage-color); font:10px/1.6 ui-monospace,monospace; }
.hero-spark { position:absolute; z-index:2; color:var(--accent); pointer-events:none; }.spark-one { top:-95px; left:30px; font-size:76px; transform:rotate(15deg); }.spark-two { bottom:28%; right:-24px; font-size:33px; color:var(--orange); }
.product-tabs { display:flex; align-items:center; justify-content:center; gap:14px; position:relative; margin-top:52px; }
.product-tabs button { min-width:62px; min-height:68px; display:flex; align-items:center; gap:7px; flex-direction:column; padding:8px; border-radius:16px; color:var(--muted); background:transparent; font-size:10px; transition:transform .3s,background .3s; }
.product-tabs img { width:38px; height:38px; border-radius:23%; }.product-tabs button[aria-selected=true] { background:#ffffff0b; color:var(--text); transform:translateY(-6px); }.product-tabs button:hover { transform:translateY(-6px); }
.lab-ribbon { border-block:1px solid var(--line); }.lab-ribbon>.lab-wrap { display:flex; justify-content:space-between; align-items:center; min-height:90px; gap:24px; font-size:11px; color:var(--muted); }.lab-ribbon span[aria-hidden] { color:var(--accent); font-size:22px; }
h2 { font-size:clamp(42px,6vw,84px); line-height:1.04; font-weight:780; letter-spacing:-.055em; text-wrap:balance; }
h3 { font-size:30px; line-height:1.14; letter-spacing:-1px; }
.story-heading { padding-top:130px; max-width:900px; }.story-heading h2 { margin:25px 0; }.story-heading h2>span { color:var(--muted); }.story-heading>p:last-child { color:var(--muted); font-size:14px; line-height:1.7; }
.story-layout { position:relative; display:grid; grid-template-columns:1.1fr 1fr; gap:90px; margin-top:50px; }
.story-visual { position:sticky; top:100px; height:calc(100svh - 155px); min-height:440px; max-height:750px; align-self:start; }
.story-trail { position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; }.story-trail path { stroke:var(--accent); stroke-width:1; opacity:.28; stroke-dasharray:1; stroke-dashoffset:var(--story-trace,.8); }
.story-frame { position:absolute; inset:40px 0 65px; display:grid; place-items:center; opacity:0; transform:translateY(40px) rotate(3deg) scale(.94); transition:opacity .65s var(--ease),transform .9s var(--ease); pointer-events:none; }
.story-frame::before { content:""; position:absolute; inset:0 -15%; z-index:-1; background:radial-gradient(ellipse,color-mix(in srgb,var(--scene-color),transparent 90%),transparent 65%); }.story-frame.is-current { opacity:1; transform:translateY(0) rotate(-3deg) scale(1); }
.story-screen { position:absolute; inset:0; width:100%; height:100%; max-width:100%; max-height:100%; object-fit:contain; border-radius:17px; filter:drop-shadow(0 24px 32px #0006); }.story-icon { position:absolute; right:4%; bottom:8%; width:90px; height:90px; border-radius:23%; transform:rotate(13deg); box-shadow:0 15px 45px #0007; }.story-watermark { position:absolute; left:0; bottom:-24px; color:var(--scene-color); font-size:11px; letter-spacing:3px; text-transform:uppercase; }
.story-indicator { position:absolute; bottom:12px; left:0; right:0; display:flex; align-items:center; gap:20px; color:#777585; font:10px ui-monospace,monospace; }.story-indicator span { width:100%; height:1px; background:#ffffff18; position:relative; }.story-indicator span::before { content:""; position:absolute; inset:0; background:var(--accent); transform-origin:left; transform:scaleX(var(--story-progress,.12)); }
.story-chapter { display:flex; flex-direction:column; justify-content:center; align-items:flex-start; min-height:85svh; padding:95px 0; }.story-chapter .lab-kicker { color:var(--scene-color); }.story-chapter h3 { font-size:clamp(38px,4.1vw,60px); line-height:1.06; letter-spacing:-.05em; max-width:490px; margin:25px 0; }.story-description { max-width:390px; color:var(--muted); font-size:16px; line-height:1.85; }.story-status { color:var(--scene-color); font:10px/1.7 ui-monospace,monospace; margin:25px 0 10px; }.story-mobile-screen { display:none; }
.lab-play,.lab-catalog,.lab-worlds { padding-block:130px 35px; }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:65px; margin-bottom:65px; }.section-heading h2 { max-width:740px; margin-top:22px; }.section-heading>p { color:var(--muted); font-size:14px; line-height:1.8; max-width:300px; min-width:210px; }
.demo-layout { display:grid; grid-template-columns:.8fr 1.3fr; gap:90px; padding-block:40px 70px; position:relative; }.demo-layout::before { content:""; position:absolute; inset:0 -20%; z-index:-1; background:radial-gradient(ellipse at 80% 50%,#c97e3d0e,transparent 65%); }
.window-bar { display:flex; justify-content:space-between; align-items:center; padding:11px 14px; background:#1d2431; color:#aab1c1; font-size:10px; }.window-dots { color:#7b8191; letter-spacing:3px; font-size:8px; }
.catalog-filters { display:flex; flex-wrap:wrap; gap:12px; }.catalog-filters button { padding:12px 17px; min-height:44px; border-radius:30px; background:transparent; color:var(--muted); font-size:12px; border:1px solid var(--line); }.catalog-filters button[aria-pressed=true] { background:var(--text); color:var(--bg); }
.catalog-search { display:flex; align-items:center; gap:25px; margin:25px 0 32px; font-size:12px; color:var(--muted); }.catalog-search input { width:min(440px,100%); min-height:48px; background:transparent; border:0; border-bottom:1px solid #ffffff35; color:var(--text); padding:14px 0; border-radius:0; font-size:14px; }.catalog-search input:focus-visible { outline:2px solid var(--accent); outline-offset:5px; }
.catalog-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:70px; }
.product-card { display:flex; align-items:center; gap:22px; min-width:0; padding:30px 0; border-top:1px solid var(--line); position:relative; }
.catalog-icon { width:72px; height:72px; border-radius:23%; flex:none; transition:transform .45s var(--ease); filter:drop-shadow(0 10px 18px #0003); }.product-card:hover .catalog-icon { transform:translateY(-5px) rotate(-7deg) scale(1.06); }.product-card-copy { min-width:0; }.product-category { color:#9c99ab; font:9px/1.7 ui-monospace,monospace; text-transform:uppercase; letter-spacing:1px; }.product-card h3 { font-size:23px; letter-spacing:-.6px; margin:6px 0; }.product-card p { color:var(--muted); font-size:12px; line-height:1.65; }.product-arrow { font-size:24px; color:var(--product-color); margin-left:auto; transition:transform .3s; }.product-card:hover .product-arrow { transform:translate(4px,-4px); }
.worlds-grid { display:grid; gap:70px; }.world-card { position:relative; display:grid; grid-template-columns:1.3fr 1fr; align-items:center; gap:65px; padding-block:35px; }.world-image { min-width:0; }.world-image img { width:100%; max-height:480px; object-fit:contain; border-radius:14px; transition:transform .8s var(--ease); }.world-card:hover img { transform:rotate(-2deg) scale(1.025); }.world-copy h3 { font-size:clamp(35px,4vw,55px); letter-spacing:-.045em; margin:25px 0; }.world-copy>span:last-child { font-size:13px; }.world-paper { grid-template-columns:1fr 1.3fr; }.world-paper .world-image { order:2; }.world-paper .lab-kicker { color:var(--orange); }
.lab-studio { padding-block:150px; display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:90px; }.studio-photo { position:relative; transform:rotate(-3deg); }.studio-photo img { width:100%; aspect-ratio:1.1; object-fit:cover; object-position:50% 30%; border-radius:12px; filter:saturate(.7); }.studio-photo>span { position:absolute; bottom:22px; left:22px; background:#090a0edb; padding:10px 15px; font:10px ui-monospace,monospace; letter-spacing:2px; }.lab-studio h2 { margin:25px 0; }.lab-studio p:not(.lab-kicker) { font-size:15px; line-height:1.85; color:var(--muted); }.lab-studio .lab-text-link { margin-top:25px; }
.lab-outro { padding:100px 0 120px; text-align:center; position:relative; }.lab-outro::before { content:""; position:absolute; inset:0 -20%; z-index:-1; background:radial-gradient(ellipse at 50% 100%,#8e67f022,transparent 68%); }.lab-outro>span { display:block; font-size:70px; color:var(--accent); margin-bottom:35px; }.lab-outro h2 { max-width:950px; margin:0 auto 40px; }
.lab-footer { border-top:1px solid var(--line); padding-block:40px; display:flex; justify-content:space-between; align-items:center; gap:30px; }.lab-footer p,.lab-footer nav { font-size:10px; color:var(--muted); line-height:1.9; }.lab-footer nav { display:flex; gap:20px; flex-wrap:wrap; }
.motion-ready [data-reveal] { opacity:0; transform:translateY(30px); transition:opacity .8s var(--ease),transform .8s var(--ease); }.motion-ready [data-reveal].is-visible { opacity:1; transform:none; }
@keyframes trace-in { from { stroke-dashoffset:1; } to { stroke-dashoffset:0; } }
@keyframes stage-enter { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:none; } }
@keyframes knock { 0%,42%,100%{transform:translateX(0)} 8%,54%{transform:translateX(-5px)} 18%,64%{transform:translateX(5px)} 28%,74%{transform:translateX(-2px)} }
@media(min-width:1550px) { .lab-wrap { width:min(1440px,calc(100% - 160px)); }.lab-hero { gap:80px; }.hero-monitor>img,.space-preview>img { aspect-ratio:1.55; } }
@media(max-width:1100px) { .lab-wrap { width:calc(100% - 64px); }.brand-suffix { display:none; }.header-inner { gap:22px; }.lab-hero { gap:20px; padding-block:110px; }h1 { font-size:clamp(60px,8.7vw,100px); }.stage-caption p { font-size:10px; }.story-layout { gap:50px; }.demo-layout { gap:45px; }.catalog-grid { column-gap:35px; }.world-card,.lab-studio { gap:45px; } }
@media(max-width:800px) { .lab-wrap { width:calc(100% - 40px); }.header-inner { min-height:72px; gap:18px; }.header-nav { gap:16px; }.header-cta { display:none; }.lab-languages { margin-left:auto; }.lab-hero { grid-template-columns:1fr; padding-block:65px 75px; gap:100px; }.hero-copy { max-width:620px; }h1 { font-size:clamp(68px,12vw,100px); max-width:650px; }.hero-description { max-width:480px; }.hero-lab { width:90%; max-width:550px; margin:auto; }.hero-spark.spark-one { top:-70px; font-size:56px; left:auto; right:10%; }.spark-two { right:-18px; }.magic-trail { width:200%; left:-60%; top:10%; height:95%; }.lab-ribbon>.lab-wrap { gap:18px; font-size:10px; min-height:90px; }.lab-ribbon span[aria-hidden] { font-size:15px; }.story-heading { padding-top:95px; }.story-layout { grid-template-columns:1fr; margin-top:0; }.story-visual { display:none; }.story-chapter { min-height:0; padding:75px 0 25px; }.story-chapter h3 { max-width:600px; font-size:clamp(36px,7.6vw,58px); }.story-description { max-width:550px; }.story-mobile-screen { display:block; margin:45px auto 10px; max-height:520px; max-width:95%; width:auto; border-radius:16px; filter:drop-shadow(0 15px 25px #0005); }.lab-play,.lab-catalog,.lab-worlds { padding-top:100px; }.section-heading { display:block; margin-bottom:35px; }.section-heading>p { margin-top:25px; max-width:500px; }.demo-layout { grid-template-columns:1fr; gap:40px; padding-block:15px; }.demo-copy h3 { max-width:530px; }.demo-window { height:360px; }.demo-steps { display:flex; flex-wrap:wrap; gap:25px; }.catalog-grid { column-gap:28px; }.product-card { gap:14px; }.catalog-icon { width:55px; height:55px; }.product-card h3 { font-size:21px; }.product-arrow { font-size:19px; }.world-card { gap:30px; }.world-copy h3 { font-size:36px; }.lab-studio { gap:35px; padding-block:110px; }.lab-footer { flex-wrap:wrap; }.lab-footer nav { width:100%; } }
@media(max-width:540px) { .lab-wrap { width:calc(100% - 40px); }.lab-brand { font-size:18px; gap:7px; }.lab-brand img { width:26px; height:26px; }.header-inner { flex-wrap:wrap; gap:0 20px; padding-block:12px; }.header-nav { order:3; width:100%; justify-content:center; gap:35px; margin-top:8px; font-size:12px; }.header-nav a { padding:7px; }.lab-languages { font-size:11px; }h1 { font-size:clamp(55px,14.6vw,79px); letter-spacing:-.065em; }h2 { font-size:clamp(37px,9.9vw,54px); }.lab-hero { padding-block:55px 65px; gap:90px; }.hero-description { font-size:15px; }.lab-actions { gap:18px; }.lab-button { font-size:12px; padding:16px 21px; }.lab-text-link { font-size:12px; }.lab-kicker { font-size:9px; letter-spacing:1.5px; }.hero-lab { width:96%; }.hero-stage { transform:rotate(-3deg); }.hero-monitor,.space-preview { border-radius:9px; }.stage-caption>img { width:49px; height:49px; }.stage-caption strong { font-size:21px; }.stage-tag { margin-left:63px; }.stage-label { font-size:8px; }.product-tabs { gap:8px; margin-top:35px; }.product-tabs button { min-width:54px; }.product-tabs img { width:35px; height:35px; }.spark-two { display:none; }.lab-ribbon>.lab-wrap { display:grid; grid-template-columns:1fr; text-align:center; gap:12px; padding-block:24px; }.lab-ribbon span[aria-hidden] { display:none; }.story-heading { padding-top:85px; }.story-heading>p:last-child { font-size:13px; }.story-chapter { padding-top:65px; }.story-description { font-size:15px; }.story-mobile-screen { max-height:460px; }.demo-steps { display:block; width:100%; }.demo-window { height:320px; }.focus-paper { width:92%; padding:20px; }.focus-paper strong { font-size:18px; }.meeting-card { width:88%; padding:18px; }.meeting-card h4 { font-size:18px; }.demo-count { font-size:42px; }.demo-toolbar { gap:13px; }.demo-toolbar>span { max-width:none; }.catalog-filters { gap:7px; }.catalog-filters button { font-size:11px; padding:11px 14px; }.catalog-search { align-items:start; flex-direction:column; gap:7px; }.catalog-search input { width:100%; }.catalog-grid { grid-template-columns:1fr; }.product-card { gap:20px; padding-block:25px; }.catalog-icon { width:64px; height:64px; }.product-card h3 { font-size:24px; }.product-arrow { font-size:24px; }.world-card,.world-paper { grid-template-columns:1fr; gap:30px; }.world-paper .world-image { order:0; }.world-copy h3 { font-size:38px; }.worlds-grid { gap:45px; }.lab-studio { grid-template-columns:1fr; gap:50px; }.studio-photo { width:94%; margin:auto; }.lab-outro { padding:45px 0 85px; }.lab-outro>span { font-size:55px; }.lab-outro h2 { font-size:42px; }.lab-footer { gap:22px; } }
html:lang(ja) h1,html:lang(ko) h1,html:lang(zh-Hans) h1 { font-size:clamp(48px,6.8vw,100px); letter-spacing:-.04em; line-height:1.16; }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }*,*::before,*::after { animation:none!important; transition:none!important; }.hero-stage,.hero-lab,.magic-trail,.product-card:hover .catalog-icon,.world-card:hover img { transform:none!important; }.motion-ready [data-reveal] { opacity:1; transform:none; }.story-frame { transform:none; }.is-knocking { outline:2px solid var(--orange); } }

/* Without JavaScript, every chapter keeps its own visible capture. */
body:not(.motion-ready) .story-layout{display:block}
body:not(.motion-ready) .story-visual{display:none}
body:not(.motion-ready) .story-chapter{min-height:0;padding-block:65px}
body:not(.motion-ready) .story-mobile-screen{display:block;max-height:480px;margin:35px auto 0;object-fit:contain}
