:root { color-scheme:dark; --ember:#ff8529; --accent:#ff8529; }
body { background-color:#111; }
.app-install { border:1px solid #444; color:#eee; background:#222; border-radius:8px; padding:9px 14px; font:500 13px system-ui; cursor:pointer; min-height:40px; }
.app-install[hidden] { display:none; }
.app-install-dialog { max-width:460px; width:calc(100% - 48px); color:#eee; background:#191919; border:1px solid #444; border-radius:16px; padding:28px; font:15px/1.6 system-ui; }
.app-install-dialog::backdrop { background:#000a; }
.app-install-dialog h2 { font-size:22px; margin:0; }
.app-install-dialog button { padding:12px 24px; background:#ff8529; border:0; border-radius:8px; color:#111; cursor:pointer; }
body .nav,body .studio-homebar { background:#111; border-bottom:1px solid #303030; }
body .btn,body .filter { border-radius:9px; clip-path:none; }
body .hero { padding-top:72px; padding-bottom:60px; }
body .hero h1 { font-size:clamp(42px,5.5vw,76px); letter-spacing:-.055em; line-height:1.03; }
body .hero-sub { max-width:490px; font-size:18px; line-height:1.6; }
body .hero-meta { letter-spacing:.04em; font:12px system-ui; color:#a8a29a; }
body .section { padding-top:60px; padding-bottom:60px; }
body .step-card,body .studio-card { background:#191919; border:1px solid #333; border-radius:14px; clip-path:none; box-shadow:none; }
body .section-head { margin-bottom:28px; }
body .section-head .pixel-label,body .hero-badge,body .card-flag,body .step-icon { display:none; }
body .gallery-head { padding-top:44px; padding-bottom:28px; }
body .gallery-head h1 { font-size:clamp(32px,4vw,52px); letter-spacing:-.045em; }
body .gallery-head .pixel-label { display:none; }
body .gallery-head .sub { max-width:600px; }
body .filters { margin-bottom:26px; }
body .filter { min-height:44px; }
body .studio-homebar-product { display:none; }
body .studio-homebar { padding-top:env(safe-area-inset-top,0px); }
body .viewport-toolbar .control-btn { clip-path:none; border-radius:8px; }
body .sidebar-scroll { overscroll-behavior:contain; }
@media(max-width:650px){
 body .hero { padding-top:35px; padding-bottom:24px; gap:20px; }
 body .hero-scene { max-height:290px; }
 body .hero-scene svg { max-height:290px; }
 body .section { padding-top:32px; padding-bottom:32px; }
 body .hero-sub { font-size:16px; }
 .app-install { padding:8px 10px; }
 body .studio-homebar-nav { gap:6px; }
 body .nav-inner { flex-wrap:wrap; gap:10px; }
}
/* Start screen keeps the brief, type and primary action visible; sizing remains available. */
body #creation-card { border-radius:16px; background:#171717; box-shadow:0 20px 70px #0006; }
body .creation-roadmap,body .creation-step-note,body .creation-eyebrow,body .prompt-recipe,body .reference-image-hint { display:none; }
body .creation-subtitle { font-size:14px; max-width:500px; }
body .creation-header { padding-bottom:20px; }
body .creation-title { letter-spacing:-.04em; }
body .creation-size-details { border-top:1px solid #373737; padding:12px 0; margin-top:12px; }
body .creation-size-details > summary { cursor:pointer; min-height:40px; display:flex; align-items:center; color:#cbc4bd; }
body .creation-size-details .voxel-envelope-control { margin-top:10px; }
body .creation-envelope-control .size-helper { font-size:12px; }
body .creation-main .type-tab { border-radius:9px; clip-path:none; }
body .hero { grid-template-columns:1.15fr 1fr; }
body .hero h1 { max-width:570px; font-size:clamp(40px,4.8vw,68px); }
.hero-model-link { display:block; width:100%; }
.hero-model { display:block; width:100%; max-height:440px; object-fit:contain; image-rendering:pixelated; border-radius:22px; }
body .hero-scene { background:none; }
body .card { clip-path:none; border-radius:14px; background:#1b1b1b; border:1px solid #303030; box-shadow:none; }
body .card-actions { grid-template-columns:1fr auto; gap:8px; }
body .card-actions [data-inspect] { background:transparent; color:#bdb9b4; border:1px solid #444; }
body .facts .pill:not(:first-child) { display:none; }
body .pill { font:11px system-ui; letter-spacing:0; text-transform:none; background:transparent; box-shadow:none; padding:0; }
body .scene-caption { font:12px system-ui; letter-spacing:.03em; }
@media(max-width:650px){
 body .hero { grid-template-columns:1fr; }
 body .hero-model { max-height:290px; }
 body .nav-inner { display:flex; flex-wrap:nowrap; }
 body .nav-cta > .btn-ghost { display:none; }
 body .nav-cta > .btn-ember { padding:10px 12px; font-size:12px; }
 body .brand { font-size:18px; gap:8px; }
 body .nav-spacer { display:none; }
 body .nav-cta { margin-left:auto; }
 body .app-install { flex:none; }
}
body { --homebar-h:calc(56px + env(safe-area-inset-top,0px)); }
body[data-native-studio] .native-steps { top:var(--homebar-h); }
body[data-native-studio] #viewport { top:calc(var(--homebar-h) + 52px); }
@media(min-width:801px){ body[data-native-studio]:not([data-native-mode="animate"]) #sidebar { top:calc(var(--homebar-h) + 52px); } }
body[data-native-studio] #sidebar .sidebar-scroll { padding-bottom:env(safe-area-inset-bottom,0px); }

/* A real animated entity replaces the poster once its saved model is ready. */
.hero-model-link { position:relative; aspect-ratio:1; overflow:hidden; border-radius:18px; }
.hero-model-canvas { display:block; width:100%; height:100%; }
.hero-model[hidden] { display:none; }
.hero-motion-toggle { position:absolute; left:18px; bottom:18px; z-index:2; border:1px solid #ffffff30; border-radius:8px; padding:10px 12px; background:#101816e8; color:#eee; font:12px system-ui; min-height:40px; cursor:pointer; }
.hero-motion-toggle:focus-visible,.hero-model-link:focus-visible { outline:2px solid #ff8529; outline-offset:3px; }
body .hero-scene .scene-caption { bottom:22px; right:18px; max-width:48%; text-align:right; }
@media(max-width:650px){ .hero-model-link { width:290px; max-width:100%; margin:auto; } .hero-motion-toggle { left:12px; bottom:12px; font-size:11px; padding:8px; } body .hero-scene .scene-caption { font-size:10px; bottom:20px; right:12px; max-width:44%; } }
@media(max-width:650px){ body .hero-scene { width:290px; max-width:100%; margin-inline:auto; } .hero-model-link { width:100%; } }