.theater{flex-direction:column;gap:14px;display:flex}.theater-nav{scrollbar-width:none;gap:4px;padding-bottom:2px;display:flex;overflow-x:auto}.theater-nav::-webkit-scrollbar{display:none}.chapter{text-align:left;min-width:108px;color:var(--fg-muted);font:inherit;cursor:pointer;white-space:nowrap;background:0 0;border:none;border-radius:9px 9px 0 0;flex:1 1 0;align-items:baseline;gap:7px;padding:10px 12px 13px;transition:background .16s,color .16s;display:flex;position:relative}.chapter:hover,.chapter.active{background:var(--surface-2);color:var(--fg)}.ch-n{font-family:var(--mono);color:var(--fg-dim);font-variant-numeric:tabular-nums;font-size:11px}.chapter.active .ch-n{color:var(--accent)}.ch-body b{color:inherit;letter-spacing:.2px;font-size:13.5px;font-weight:560}.ch-body small{display:none}.ch-bar{background:var(--border-soft);border-radius:2px;height:2px;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.chapter.active .ch-bar{background:color-mix(in srgb, var(--accent) 26%, transparent)}.chapter.active .ch-bar i{background:var(--accent);transform-origin:0;width:100%;height:100%;animation:1.2s linear forwards ch-fill;display:block}@keyframes ch-fill{0%{transform:scaleX(0)}to{transform:scaleX(1)}}.theater-blurb{min-height:22px;color:var(--fg-dim);margin:0;font-size:13.5px;line-height:1.6}.theater-stage{height:var(--stage-h,560px);background:radial-gradient(120% 100% at 70% 0%, color-mix(in srgb, var(--accent) 10%, transparent), transparent 62%), var(--surface-2);border:1px solid var(--border);border-radius:14px;padding:26px;position:relative;overflow:hidden}.ide{transform-origin:0;background:#1f1f1f;border:1px solid #ffffff17;border-radius:10px;flex-direction:column;height:100%;margin-right:0;transition:margin-right .55s cubic-bezier(.16,1,.3,1),transform .55s cubic-bezier(.16,1,.3,1);display:flex;overflow:hidden;box-shadow:0 24px 60px -20px #0000008c,0 2px 8px #0000004d}.ide.with-phone{margin-right:80px;transform:perspective(1500px)rotateY(12deg)scale(.96)}.ide-bar{background:#181818;border-bottom:1px solid #ffffff12;flex:none;align-items:center;gap:7px;height:34px;padding:0 12px;display:flex}.ide-bar .dot{border-radius:50%;flex:none;width:11px;height:11px}.ide-bar .dot.r{background:#ff5f57}.ide-bar .dot.y{background:#febc2e}.ide-bar .dot.g{background:#28c840}.ide-title{text-align:center;color:#ccc9;flex:1;margin-right:44px;font-size:11.5px;transition:opacity .2s}.ide-body{flex:1;grid-template-columns:152px 1fr 420px;min-height:0;display:grid}.ide-files{color:#cccccc9e;background:#181818;border-right:1px solid #ffffff0f;min-width:0;padding:10px 0;font-size:11.5px;overflow:hidden}.ft-head{letter-spacing:.1em;text-transform:uppercase;color:#cccccc6b;padding:2px 12px 10px;font-size:10.5px;font-weight:700}.ft-row{white-space:nowrap;text-overflow:ellipsis;padding:3px 12px;overflow:hidden}.ft-row.sub{padding-left:26px}.ft-row.active{color:#ccc;background:#ffffff12}.ft-empty,.ed-empty,.ide.no-project .ft-head,.ide.no-project .ft-row,.ide.no-project .tabbar,.ide.no-project pre.code{display:none}.ide.no-project .ft-empty{color:#cccccc57;padding:2px 12px;display:block}.ide.no-project .ed-empty{text-align:center;color:#cccccc47;max-width:260px;margin:auto;padding:0 20px;font-size:11.5px;line-height:1.7;display:block}.ide-editor{background:#1f1f1f;flex-direction:column;min-width:0;display:flex;position:relative}.tabbar{background:#181818;border-bottom:1px solid #ffffff0f;flex:none;display:flex}.tabbar .tab{color:#cccccc73;border-right:1px solid #ffffff0f;padding:7px 14px;font-size:11.5px}.tabbar .tab.active{color:#ccc;box-shadow:inset 0 1px 0 var(--accent);background:#1f1f1f}pre.code{font-family:var(--mono);color:#ccc;white-space:pre;tab-size:2;flex:1;margin:0;padding:12px 14px;font-size:10.5px;line-height:1.7;overflow:hidden}pre.code .ln{color:#cccccc42;-webkit-user-select:none;user-select:none;width:22px;margin-right:12px;display:inline-block}pre.code .k{color:#c586c0}pre.code .s{color:#ce9178}pre.code .f{color:#dcdcaa}pre.code .c{color:#6a9955}pre.code .n{color:#569cd6}pre.code .a{color:#9cdcfe}.caret{vertical-align:-2px;background:#ccc;width:1.5px;height:13px;animation:1s step-end infinite caret;display:inline-block}@keyframes caret{50%{opacity:0}}.save-flash{pointer-events:none;background:var(--accent);opacity:0;position:absolute;inset:0}.save-flash.on{animation:.5s saveflash}@keyframes saveflash{0%{opacity:0}22%{opacity:.12}to{opacity:0}}.ide-panel{background:#1f1f1f;border-left:1px solid #ffffff14;min-width:0}.wb-host{height:100%}.wb-frame{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;border:0;width:100%;height:100%;display:block}.ide-status{color:#cccccc9e;background:#181818;border-top:1px solid #ffffff0f;flex:none;align-items:center;gap:7px;height:24px;padding:0 12px;font-size:10.5px;display:flex}.st-dot{background:#3fb950;border-radius:50%;width:6px;height:6px;position:relative}.st-dot:after{content:"";background:#3fb95073;border-radius:50%;animation:2.4s ease-in-out infinite st-breathe;position:absolute;inset:0}@keyframes st-breathe{0%,to{opacity:.5;transform:scale(1)}50%{opacity:0;transform:scale(2.4)}}.phone{aspect-ratio:1/2;background:#0d0d0f;border:1px solid #ffffff29;border-radius:28px;width:auto;height:min(520px,100% - 48px);padding:9px;animation:.5s cubic-bezier(.16,1,.3,1) phone-in;position:absolute;bottom:24px;right:64px;overflow:hidden;box-shadow:0 40px 80px -20px #000000bf,0 4px 14px #0006}.phone[hidden]{display:none}@keyframes phone-in{0%{opacity:0;transform:translateY(28px)scale(.96)}}.phone:before{content:"";z-index:2;background:#ffffff29;border-radius:3px;width:46px;height:5px;position:absolute;top:12px;left:50%;transform:translate(-50%)}.phone-screen{color:#16181d;background:#fbfbfd;border-radius:20px;height:100%;font-size:11px;overflow:hidden}.phone-screen.swap{animation:.42s cubic-bezier(.16,1,.3,1) screen-swap}@keyframes screen-swap{0%{opacity:0;transform:scale(.97)}}.ps-loader,.ps-install{color:#fff;background:#101114;flex-direction:column;justify-content:center;align-items:center;gap:6px;height:100%;display:flex}.ps-logo,.ps-ico{background:linear-gradient(140deg, var(--accent), #7aa7e8);border-radius:14px;width:54px;height:54px}.ps-t{font-size:13.5px;font-weight:600}.ps-s{opacity:.6;font-size:11px}.ps-btn{background:var(--accent);color:#fff;border-radius:999px;margin-top:10px;padding:6px 24px;font-size:11.5px;animation:.3s cubic-bezier(.16,1,.3,1) .15s both ai-msg}.ps-app{background:#fbfbfd;height:100%}.ps-bar{color:#fff;background:var(--accent);padding:30px 14px 12px;font-size:13.5px;font-weight:600}.ps-bar2{background:linear-gradient(120deg, var(--accent), #4f8fd8)}.ps-row{border-bottom:1px solid #eceef2;align-items:center;gap:8px;padding:11px 14px;font-size:11.5px;display:flex}.ps-row b{color:#6b7280;margin-left:auto;font-size:10px;font-weight:500}.ps-row.ps-new{animation:.4s cubic-bezier(.16,1,.3,1) both row-in}.ps-row.ps-new:nth-child(2){animation-delay:60ms}.ps-row.ps-new:nth-child(3){animation-delay:.12s}.ps-row.ps-new:nth-child(4){animation-delay:.18s}@keyframes row-in{0%{opacity:0;transform:translate(8px)}}.ps-i{background:#e3e7ee;border-radius:5px;flex:none;width:16px;height:16px}.ps-i.ok{background:#3fb950}.phone-scan{pointer-events:none;opacity:0;border-radius:20px;position:absolute;inset:9px;overflow:hidden}.phone-scan:before{content:"";background:linear-gradient(#0000,#3fb9508c,#0000);height:12%;position:absolute;top:0;left:0;right:0;transform:translateY(-100%)}.phone-scan.on{opacity:1}.phone-scan.on:before{animation:1.2s cubic-bezier(.4,0,.6,1) pscan}@keyframes pscan{0%{transform:translateY(-100%)}to{transform:translateY(833%)}}.cursor{pointer-events:none;opacity:0;z-index:20;filter:drop-shadow(0 2px 4px #0006);background:url(/cursor.svg) 50%/contain no-repeat;width:16px;height:16px;margin:-3px 0 0 -3px;transition:transform .52s cubic-bezier(.33,1,.68,1),opacity .2s;position:absolute;top:0;left:0}.cursor.on{opacity:1}.cursor.tap:after{content:"";border:1.5px solid var(--accent);border-radius:50%;width:12px;height:12px;animation:.45s cubic-bezier(.16,1,.3,1) tap;position:absolute;top:1px;left:1px}@keyframes tap{0%{opacity:.9;transform:scale(.3)}to{opacity:0;transform:scale(3.2)}}@media (width<=1180px){.chapter{flex:none;min-width:0;padding:9px 12px}.ide-files{display:none}.ide-body{grid-template-columns:1fr 380px}.ide.with-phone{margin-right:72px}}@media (width<=860px){.theater-stage{aspect-ratio:3/3.2;height:auto;padding:14px}.ide-body{grid-template-columns:1fr}.ide-editor{display:none}.ide-panel{border-left:none}.ide.with-phone{margin-right:40px}.phone{border-radius:20px;height:min(280px,100% - 32px);padding:6px;bottom:16px;right:14px}.phone-screen{border-radius:14px}.phone-scan{border-radius:14px;inset:6px}.theater-blurb{font-size:12.5px}}@media (prefers-reduced-motion:reduce){.cursor,.phone,.ai,.ai-msg,.ai-tool,.ps-row.ps-new,.phone-screen.swap,.phone-scan.on:before,.st-dot:after{animation:none!important}.cursor,.ide{transition:none}.chapter.active .ch-bar i{animation:none;transform:scaleY(1)}.caret{animation:none}}