cozyclay 1.0.0 → 1.2.0

package/dist/assets/app-DgZvaAE1.css

@@ -0,0 +1 @@
+@font-face{font-family:Inter;font-style:normal;font-weight:400 800;font-display:swap;src:url(../fonts/inter-latin.woff2)format("woff2")}:root{--bg:#1e1e1e;--bg-grad:linear-gradient(145deg, #1e1e1e 0%, #1e1e1e 100%);--panel:#2c2c2c;--card:#383838;--card2:#ffffff0a;--hover:#ffffff0f;--line:#1a1a1a;--line2:#3c3c3c;--track:#3a3a3a;--fg:#d2d2d2;--muted:#9a9a9a;--muted2:#6f6f6f;--accent:#3a7cbf;--accent-2:#2d5c8a;--cyan:#5a9bd4;--accent-soft:#2d5c8a59;--accent-ring:#3a7cbf80;--on-accent:#fff;--grad:linear-gradient(103deg, #2d5c8a 0%, #2d5c8a 100%);--grad-soft:linear-gradient(103deg, #2d5c8a, #3a7cbf);--display:"Inter", "Pretendard", "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;--sans:"Inter", "Pretendard", "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;--mono:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;--radius:2px;--shadow:0 1px 2px #0006;--shadow-md:0 5px 16px #00000080;--shadow-lg:0 14px 34px #0009;--glow:0 0 0 1px #3a7cbf73;--ease:cubic-bezier(.22, .68, .2, 1);--spring:cubic-bezier(.34, 1.4, .5, 1);--fast:.14s;--med:.26s}*{box-sizing:border-box}html,body,#root{height:100%;margin:0;overflow-x:hidden}body{background:var(--bg);color:var(--fg);font-family:var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;letter-spacing:0;font-size:13px;font-weight:450;line-height:1.4}button,input,textarea,select{letter-spacing:inherit;font-family:inherit}::-webkit-scrollbar-thumb{border:3px solid var(--panel);background:#4a4a4a;border-radius:8px}.app{flex-direction:column;width:100%;height:100vh;display:flex;overflow:hidden}.topbar{border-bottom:1px solid var(--line);background:#232323f7;flex:none;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:20px;height:48px;padding:0 16px;display:grid;position:relative}.topbar:after{display:none}.app.render-idle .topbar:after{animation-play-state:paused}.logo{justify-self:start;align-items:center;display:flex}.topbar-actions{grid-column:3;justify-self:end;align-items:center;gap:6px;display:flex}.locale-toggle{border:1px solid var(--line2);height:28px;color:var(--fg);cursor:pointer;background:#2c2c2c;border-radius:2px;align-items:center;padding:0 10px;font-size:10px;font-weight:620;display:inline-flex}.locale-toggle:hover,.locale-toggle:focus-visible{border-color:var(--accent);background:var(--accent-soft);outline:none}.toolbar-balance{min-width:0}.wordmark{font-family:var(--display);color:#d2d2d2;letter-spacing:-.045em;font-size:18px;font-weight:750;line-height:1}.wordmark span{color:#3c91a8}.brandbar{border-top:1px solid var(--line);background:#232323f7;flex:none;align-items:center;height:32px;padding:0 14px;display:flex;position:relative}.brandbar:before{content:"";background:#3a7cbf;width:46px;height:2px;position:absolute;top:-1px;left:14px}.brandbar .wordmark{letter-spacing:-.035em;font-size:14px}.tagline{color:var(--muted);padding-left:17px;font-size:12.5px;position:relative}.tagline:before{content:"";background:var(--line2);width:1px;height:18px;position:absolute;top:50%;left:0;transform:translateY(-50%)}.controls-menu{z-index:20;justify-self:end;position:relative}.controls-menu summary{color:#52616b;letter-spacing:.02em;cursor:pointer;-webkit-user-select:none;user-select:none;background:#2c2c2c;border:1px solid #ffffff3d;border-radius:6px;align-items:center;gap:7px;height:30px;padding:0 10px 0 12px;font-size:10px;font-weight:700;list-style:none;display:flex}.controls-menu summary::-webkit-details-marker{display:none}.controls-menu summary span{transition:transform var(--fast) var(--ease);font-size:12px;line-height:1}.controls-menu[open] summary{color:#d2d2d2;background:#383838;border-color:#3a7cbf}.controls-menu[open] summary span{transform:rotate(180deg)}.controls-popover{background:#2c2c2c;border:1px solid #ffffff3d;border-radius:8px;width:250px;padding:12px;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 12px 30px #00000029}.controls-grid{grid-template-columns:max-content 1fr;align-items:center;gap:8px 12px;display:grid}.controls-grid kbd{color:#d2d2d2;min-width:46px;font:650 9px var(--mono);text-align:center;background:#232323;border:1px solid #ffffff38;border-bottom-width:2px;border-radius:4px;padding:3px 6px}.controls-grid span,.controls-popover p{color:#9a9a9a;font-size:10.5px;line-height:1.35}.controls-popover p{margin:0}.controls-popover p strong{color:#d2d2d2;text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px;font-size:10px;display:block}.main{flex-direction:column;flex:1;min-height:0;display:flex}.workspace{flex:1;min-height:0;display:flex}.viewport{background:var(--bg-grad);flex:1;justify-content:stretch;align-items:stretch;min-width:0;padding:0;display:flex;position:relative;overflow:hidden}.viewport:before{content:"";pointer-events:none;filter:blur(10px);background:radial-gradient(circle at 70% 30%,#3a7cbf1c,#0000 62%);width:55%;height:70%;position:absolute;top:-10%;right:0}.stage{aspect-ratio:auto;width:100%;max-width:100%;height:100%;max-height:100%;box-shadow:var(--shadow-md);animation:stageIn .7s var(--ease) both;border:1px solid #ffffff61;border-radius:0;position:relative;overflow:hidden}.stage canvas{cursor:grab;outline:none;display:block;width:100%!important;height:100%!important}.stage canvas:active{cursor:grabbing}.vp-pane{z-index:5;pointer-events:none;position:absolute}.vp-main{inset:0}.vp-inset{aspect-ratio:1;width:26%;min-width:225px;max-width:350px;animation:rise var(--med) var(--ease) both;border-radius:11px;top:60px;right:15px;overflow:hidden;box-shadow:0 10px 30px #00000073,0 0 0 1px #ffffff1f}.vp-pane.plan{pointer-events:auto}.vp-inset.shot{aspect-ratio:16/9}.vp-inset-tag{border:1px solid var(--line2);color:#cfd2da;letter-spacing:.1em;text-transform:uppercase;pointer-events:auto;cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none;background:#0e0d10d9;border-radius:6px;padding:3px 8px;font-size:9.5px;font-weight:600;position:absolute;top:7px;left:8px}.vp-inset-tag:active{cursor:grabbing}.vp-inset-caret{opacity:.75;cursor:pointer;margin-right:3px;font-size:9px}.vp-inset-caret:hover{opacity:1;color:var(--accent)}.vp-inset-zoom{opacity:.75;margin-left:4px;font-size:9px;font-style:normal}.vp-inset.collapsed{aspect-ratio:auto;align-items:center;min-width:0;min-height:0;padding:4px;display:flex;overflow:visible;box-shadow:0 6px 18px #0000004d;width:auto!important;height:auto!important}.vp-inset.collapsed .vp-inset-tag{position:static}.scene-loading{z-index:4;pointer-events:none;flex-direction:column;align-items:center;gap:8px;padding:0 0 26px;display:flex;position:absolute;inset:auto 0 0}.scene-loading-bar{background:var(--track);border-radius:2px;width:180px;height:2px;overflow:hidden}.scene-loading-bar span{background:var(--accent);height:100%;transition:width .25s var(--ease);display:block}.scene-loading-label{letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-size:11px}.scene-error{z-index:5;text-align:center;background:var(--bg);flex-direction:column;justify-content:center;align-items:center;gap:10px;padding:24px;display:flex;position:absolute;inset:0}.scene-error-title{color:var(--fg);font-size:15px;font-weight:600}.scene-error-hint{color:var(--muted);max-width:320px;font-size:13px}.film-frame{pointer-events:none;z-index:4;position:absolute;inset:16px}.film-frame span{border:1.5px solid #ffffff4d;width:17px;height:17px;position:absolute}.film-frame span:first-child{border-bottom:0;border-right:0;border-top-left-radius:4px;top:0;left:0}.film-frame span:nth-child(2){border-bottom:0;border-left:0;border-top-right-radius:4px;top:0;right:0}.film-frame span:nth-child(3){border-top:0;border-left:0;border-bottom-right-radius:4px;bottom:0;right:0}.film-frame span:nth-child(4){border-top:0;border-right:0;border-bottom-left-radius:4px;bottom:0;left:0}.hud,.caption,.viewmode{-webkit-backdrop-filter:blur(14px)saturate(1.2);background:#0e0e108c;border:1px solid #ffffff1a}.hud{z-index:6;color:#eeeef2;animation:rise var(--med) var(--ease) both;border-radius:9px;align-items:center;gap:7px;padding:6px 12px;font-size:11.5px;font-weight:500;display:flex;position:absolute;top:15px;left:16px}.caption{z-index:6;pointer-events:none;color:#fff;letter-spacing:.12em;animation:riseCenter var(--med) var(--ease) both;border-radius:9px;padding:7px 16px;font-size:11px;font-weight:600;position:absolute;bottom:16px;left:50%;transform:translate(-50%)}.caption.off{color:#ffc9cb;background:#e5484d2e;border-color:#e5484d80}.viewmode{border-radius:7px;justify-self:center;gap:2px;padding:3px;animation:none;display:flex;position:static}.viewmode button{color:#dcdce2;cursor:pointer;height:26px;transition:all .16s var(--ease);background:0 0;border:none;border-radius:5px;padding:0 12px;font-size:10px;font-weight:700}.viewmode button.active{background:var(--grad);color:#fff;box-shadow:0 3px 12px #3346ff66}.puck-label{pointer-events:none;border:1px solid var(--line2);color:#fff;white-space:nowrap;-webkit-user-select:none;user-select:none;font-size:11px;font-weight:600;font-family:var(--sans);background:#0e0d10d9;border-radius:20px;padding:3px 10px;box-shadow:0 2px 8px #0006}.pose-fab{font-family:var(--sans);color:#fff;background:var(--grad);cursor:pointer;white-space:nowrap;box-shadow:var(--glow), 0 4px 14px #0006;transition:transform .14s var(--spring), box-shadow .15s ease;animation:fabPop .28s var(--spring) both;border:none;border-radius:22px;padding:8px 16px;font-size:12.5px;font-weight:600}.pose-fab:hover{transform:translateY(-2px)scale(1.03);box-shadow:0 10px 30px #3346ff80}.pose-fab:active{transform:scale(.96)}.pose-bar{gap:8px;display:flex}.pose-btns{flex-direction:column;gap:8px;display:flex}.pose-btns .btn.full{margin-top:0}.pose-studio{z-index:12;border:1px solid var(--line2);width:344px;box-shadow:var(--shadow-lg);-webkit-backdrop-filter:blur(16px)saturate(1.2);font-family:var(--sans);animation:studioIn .34s var(--spring) both;background:#16161adb;border-radius:18px;flex-direction:column;gap:11px;padding:16px;display:flex;position:absolute;top:14px;bottom:14px;right:14px}.pose-studio.closing{animation:studioOut .2s var(--ease) both}.pose-studio:before{content:"";opacity:.9;background:linear-gradient(90deg,#2b3cf5,#4d7bff 50%,#79c9ff) 0 0/200% 100%;border-radius:18px 18px 0 0;height:2px;animation:6s linear infinite stripeShift;position:absolute;top:0;left:0;right:0}.studio-head{justify-content:space-between;align-items:center;display:flex}.studio-head span{font-family:var(--display);letter-spacing:-.025em;color:var(--fg);font-size:18px;font-weight:720}.studio-head .x{color:var(--muted);cursor:pointer;transition:color var(--fast), background var(--fast);background:0 0;border:none;border-radius:8px;padding:3px 8px;font-size:17px}.studio-head .x:hover{color:var(--fg);background:var(--card2)}.studio-hint{color:var(--muted);margin:-2px 0 0;font-size:11.5px;line-height:1.45}.studio-actions{flex-direction:column;gap:8px;display:flex}.studio-actions .btn.full{margin-top:0}.studio-filters{flex-wrap:wrap;gap:6px;display:flex}.studio-filters .btn{flex:calc(33.333% - 4px);min-width:0;padding:6px 7px;font-size:10px}.pose-grid{flex:1;grid-template-columns:1fr 1fr;grid-auto-rows:min-content;align-content:start;gap:10px;min-height:0;margin:2px -3px 0 0;padding-right:3px;display:grid;overflow-y:auto}.pose-tile{cursor:pointer;aspect-ratio:1;background:var(--card2);border:1.5px solid var(--line);transition:border-color .16s ease, transform .16s var(--spring), box-shadow .16s ease;animation:tileIn .4s var(--ease) both;border-radius:12px;padding:0;display:block;position:relative;overflow:hidden}.pose-tile:hover{box-shadow:var(--shadow-md);border-color:#ffffff3d;transform:translateY(-3px)}.pose-tile.active{border-color:var(--accent);box-shadow:0 0 0 1.5px var(--accent), 0 6px 20px #3346ff4d}.pose-tile img,.pose-tile .tile-blank{object-fit:cover;background:#101014;width:100%;height:100%;display:block}.pose-tile span{color:#fff;text-align:center;white-space:nowrap;text-overflow:ellipsis;text-shadow:0 1px 3px #000c;background:linear-gradient(#0000,#06060aeb);padding:18px 6px 7px;font-size:11px;font-weight:700;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.pose-tile.active span{color:var(--cyan)}.pose-tile .del{color:#fff;opacity:0;background:#08080cd1;border-radius:50%;justify-content:center;align-items:center;width:19px;height:19px;font-size:10px;font-style:normal;transition:opacity .14s,background .14s;display:flex;position:absolute;top:6px;right:6px}.pose-tile:hover .del{opacity:1}.pose-tile .del:hover{background:#e5484d}.pose-tile.add{border-style:dashed;border-color:var(--line2);color:var(--muted);background:0 0;flex-direction:column;justify-content:center;align-items:center;gap:5px;display:flex}.pose-tile.add:hover{border-color:var(--accent);color:var(--cyan);background:var(--accent-soft)}.pose-tile.add span{color:inherit;text-shadow:none;background:0 0;padding:0;position:static}.pose-tile.add .add-plus{font-size:30px;font-weight:300;line-height:1}.pose-tile.add .add-text{font-size:11px;font-weight:700}.panel{background:var(--panel);border-left:1px solid var(--line);flex:none;width:380px;padding:18px 16px 34px;overflow-y:auto}.panel.hierarchy-sidebar{background:linear-gradient(#181b22fa,#111318fc);flex-direction:column;min-height:0;padding:0;display:flex;overflow:hidden}.hierarchy-pane{border-bottom:1px solid var(--line);background:#0b0d116b;flex-direction:column;flex:0 44%;min-height:220px;max-height:390px;display:flex}.hierarchy-heading,.inspector-heading{border-bottom:1px solid #ffffff0e;justify-content:space-between;align-items:center;gap:10px;padding:13px 14px 11px;display:flex}.hierarchy-heading>div{min-width:0}.hierarchy-heading strong,.inspector-heading strong{color:var(--fg);text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:600;display:block;overflow:hidden}.hierarchy-kicker,.inspector-heading>span{color:var(--muted);letter-spacing:.16em;text-transform:uppercase;margin-bottom:2px;font-size:8px;font-weight:700;display:block}.hierarchy-frame-status{color:#9aa9d8;background:#576fdd14;border:1px solid #7e9aff29;border-radius:999px;flex:none;padding:3px 7px;font-size:8px}.scene-switcher{background:#080a0e52;border-bottom:1px solid #fff1;flex:none;padding:8px 9px 7px}.scene-switcher-heading,.scene-switcher-heading>div,.scene-actions{align-items:center;display:flex}.scene-switcher-heading{justify-content:space-between;gap:8px;margin-bottom:6px}.scene-switcher-heading>div{gap:6px;min-width:0}.scene-switcher-heading strong{color:var(--fg);font-size:10px}.scene-switcher-heading span{color:var(--muted);font-size:8px}.scene-create-button,.scene-actions button{color:#aebade;font:inherit;cursor:pointer;background:#576fdd17;border:1px solid #7e9aff33;border-radius:5px;font-size:9px}.scene-create-button{height:24px;padding:0 8px}.scene-create-button:hover,.scene-actions button:hover:not(:disabled){color:var(--fg);background:#576fdd2e}.scene-list{background:#0000001f;border:1px solid #ffffff12;border-radius:6px;max-height:76px;overflow:auto}.scene-list-item{height:27px;padding:2px}.scene-list-item+.scene-list-item{border-top:1px solid #ffffff0b}.scene-list-item>button{width:100%;height:23px;color:var(--muted);font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:4px;align-items:center;gap:7px;padding:0 7px;font-size:10px;display:flex}.scene-list-item.active>button{color:var(--fg);background:#576fdd29}.scene-document-icon{border:1px solid #7284bd;border-radius:1px;width:8px;height:10px}.scene-rename-input{width:100%;height:23px;color:var(--fg);font:inherit;background:#161b29;border:1px solid #627cd0;border-radius:4px;outline:none;padding:0 7px;font-size:10px}.scene-actions{justify-content:flex-end;gap:4px;margin-top:5px}.scene-actions button{height:21px;padding:0 7px}.scene-actions button:disabled{opacity:.35;cursor:not-allowed}.hierarchy-tree{flex:1;min-height:0;padding:6px 6px 9px;overflow:auto}.hierarchy-row-wrap{height:27px;margin-left:calc(var(--hierarchy-depth) * 14px);border-radius:4px;align-items:stretch;display:flex;position:relative}.hierarchy-row-wrap:before{content:"";background:#ffffff0e;width:1px;position:absolute;top:-7px;bottom:13px;left:-7px}.hierarchy-toggle,.hierarchy-row{color:inherit;background:0 0;border:0;padding:0}.hierarchy-toggle{color:#7d8596;cursor:pointer;flex:0 0 20px;place-items:center;font-size:11px;display:grid}.hierarchy-toggle.placeholder{pointer-events:none}.hierarchy-row{text-align:left;cursor:default;flex:1;align-items:center;gap:7px;min-width:0;padding-right:6px;display:flex}.hierarchy-icon{background:#6f7fa51f;border:1px solid #65708b;border-radius:2px;flex:none;width:9px;height:9px}.hierarchy-icon.shot{border-color:#8a9cff;border-radius:50%;box-shadow:inset 0 0 0 2px #222a52}.hierarchy-icon.camera{border-color:#72a9ff;transform:skew(-8deg)}.hierarchy-icon.character{border-color:#8ed4c0;border-radius:50% 50% 3px 3px}.hierarchy-icon.key{border-color:#ffb45f;transform:rotate(45deg)scale(.72)}.hierarchy-icon.rig,.hierarchy-icon.bone{border-color:#d39cff;border-radius:50%}.hierarchy-icon.path{border-color:#60c7d0;border-radius:999px;width:11px;height:5px}.hierarchy-icon.environment{border-color:#77a878;border-radius:50%}.hierarchy-icon.props{border-color:#b8936b}.hierarchy-icon.object{background:#bc7e3f38;border-color:#d0a36f;transform:rotate(45deg)scale(.78)}.hierarchy-label{color:#b8bdc9;text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:10px;font-weight:500;overflow:hidden}.hierarchy-status{color:#8ea0ff;letter-spacing:.06em;margin-left:auto;font-size:7px;font-weight:700}.hierarchy-badge{color:#8f97a9;text-align:center;background:#fff1;border-radius:999px;flex:none;min-width:16px;padding:2px 4px;font-size:7px}.inspector-heading{background:#1f222ab8;flex:none;padding-top:10px;padding-bottom:9px;display:block}.inspector-scroll{flex:1;min-height:0;padding:10px 12px 18px;overflow:auto}.inspector-scroll>.card{margin-bottom:10px;animation:none}.inspector-scroll>[hidden]{display:none!important}.inspector-hint{color:var(--muted);margin:-1px 0 11px;font-size:9px;line-height:1.55}.inspector-status-grid{background:#0000001f;border:1px solid #ffffff0f;border-radius:6px;grid-template-columns:1fr auto;gap:7px 12px;margin:0 0 12px;padding:9px 10px;font-size:8px;display:grid}.inspector-status-grid span{color:var(--muted)}.inspector-status-grid b{color:#c7cde0;font-weight:600}.inspector-list{gap:5px;margin-bottom:10px;display:grid}.inspector-list button{color:#aeb4c2;text-align:left;cursor:pointer;background:#ffffff06;border:1px solid #fff1;border-radius:5px;justify-content:space-between;align-items:center;gap:10px;min-width:0;padding:8px 9px;display:flex}.inspector-list button span{text-overflow:ellipsis;white-space:nowrap;font-size:9px;overflow:hidden}.inspector-list button small{color:var(--muted);flex:none;font-size:7px}.inspector-list.compact button{padding-top:6px;padding-bottom:6px}.card{box-shadow:var(--shadow);transition:border-color var(--med) var(--ease);animation:cardIn .5s var(--ease) both;background:linear-gradient(#141417,#0b0b0d);border:1px solid #ffffff0f;border-radius:16px;margin-bottom:14px;padding:17px 18px 19px;position:relative;overflow:hidden}.card:after{content:"";opacity:.95;background:linear-gradient(90deg,#1a2acc,#3b6bff,#79c9ff 92%);height:2.5px;position:absolute;bottom:0;left:0;right:0}.panel .card:first-child{animation-delay:20ms}.panel .card:nth-child(2){animation-delay:70ms}.panel .card:nth-child(3){animation-delay:.12s}.panel .card:nth-child(4){animation-delay:.17s}.panel .card:nth-child(5){animation-delay:.22s}.panel .card:nth-child(6){animation-delay:.27s}.card h3{text-transform:uppercase;letter-spacing:.16em;color:var(--muted);align-items:center;gap:8px;margin:0 0 13px;font-size:10.5px;font-weight:600;display:flex}.card h3:before{content:"";background:var(--grad-soft);border-radius:50%;width:6px;height:6px;box-shadow:0 0 8px #4d7bffb3}.presets{grid-template-columns:1fr 1fr;gap:8px;display:grid}.presets button{background:var(--card2);border:1px solid var(--line);color:#cdcdd6;cursor:pointer;transition:transform var(--fast) var(--ease), background var(--fast), border-color var(--fast), color var(--fast), box-shadow var(--fast);border-radius:10px;padding:10px 8px;font-size:12px;font-weight:500}.presets button:hover{background:var(--hover);color:#fff;border-color:#4d7bff73;transform:translateY(-1px)}.presets button:active{transform:scale(.97)}.presets button.active{color:#fff;background:linear-gradient(#4d7bff42,#3346ff1f);border-color:#4d7bffbf;font-weight:600;box-shadow:0 0 0 1px #4d7bff40,0 5px 16px #3346ff33}.row{color:var(--muted);align-items:center;gap:12px;margin:13px 0;font-size:12px;display:flex}.row>span:first-child{flex:none;width:82px}.row .val{text-align:right;color:#eeeef2;font-variant-numeric:tabular-nums;width:46px;font-weight:500}.readout{color:var(--muted);font-variant-numeric:tabular-nums;justify-content:space-between;gap:8px;margin-top:4px;font-size:11.5px;display:flex}input[type=range]{appearance:none;background:var(--track);cursor:pointer;border-radius:999px;outline:none;flex:1;height:4px}input[type=range]::-webkit-slider-thumb{appearance:none;border:4px solid var(--accent);width:15px;height:15px;transition:transform var(--fast), box-shadow var(--fast);background:#fff;border-radius:50%;box-shadow:0 1px 3px #00000080}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.14)}input[type=range]::-moz-range-thumb{border:4px solid var(--accent);cursor:pointer;background:#fff;border-radius:50%;width:15px;height:15px;box-shadow:0 1px 3px #00000080}.check{color:var(--muted);cursor:pointer;transition:color var(--fast);align-items:center;gap:9px;margin-top:12px;font-size:12px;display:flex}.check input{accent-color:var(--accent);cursor:pointer;width:15px;height:15px}.check:hover{color:#ccccd4}.field label{color:var(--muted);margin-bottom:6px;font-size:11.5px;display:block}.field input[type=text],.field input[type=number],.field textarea{background:var(--card2);border:1px solid var(--line);width:100%;color:var(--fg);transition:border-color var(--fast), box-shadow var(--fast);border-radius:10px;padding:10px 12px;font-size:12.5px}.field input[type=text]::placeholder{color:var(--muted2)}.field input[type=text]:focus,.field input[type=number]:focus,.field textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-ring);outline:none}.field textarea{resize:vertical;min-height:114px;animation:rise var(--med) var(--ease);line-height:1.55}.field select{width:100%;color:var(--fg);border:1px solid var(--line);cursor:pointer;appearance:none;background:var(--card2) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%239a9aa4' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><path d='M6 9l6 6 6-6'/></svg>") no-repeat right 11px center;transition:border-color var(--fast), box-shadow var(--fast);border-radius:10px;padding:10px 32px 10px 12px;font-size:12.5px}.field select:hover{border-color:var(--line2)}.field select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-ring);outline:none}.segmented{border:1px solid var(--line);background:#101012;border-radius:11px;margin-bottom:6px;padding:4px;display:flex;position:relative}.segmented:before{content:"";background:var(--grad);width:calc(50% - 4px);transition:transform var(--med) var(--spring);z-index:0;border-radius:8px;position:absolute;top:4px;bottom:4px;left:4px;box-shadow:0 3px 12px #3346ff59}.segmented[data-active=video]:before{transform:translate(100%)}.segmented button{z-index:1;cursor:pointer;color:var(--muted);transition:color var(--fast);background:0 0;border:none;border-radius:8px;flex:1;padding:9px;font-size:12px;font-weight:600;position:relative}.sheet-checks{margin-bottom:4px}.sheet-checks .check{margin-top:9px}.actions{flex-direction:column;gap:9px;margin-top:4px;display:flex}.btn{border:1px solid var(--line2);background:var(--card2);color:var(--fg);cursor:pointer;box-shadow:var(--shadow);transition:transform var(--fast) var(--ease), background var(--fast), border-color var(--fast), box-shadow var(--fast);border-radius:11px;padding:11px 14px;font-size:13px;font-weight:600;position:relative;overflow:hidden}.btn:hover{background:var(--hover);box-shadow:var(--shadow-md);border-color:#4d7bff73;transform:translateY(-1px)}.btn:active{box-shadow:var(--shadow);transform:translateY(0)scale(.985)}.btn.ghost{border-color:var(--line);width:100%;box-shadow:none;color:var(--muted);background:0 0;margin-top:12px;padding:10px;font-size:12px;font-weight:500}.btn.full{width:100%;margin-top:6px}.btn.generate,.btn.cta{margin-top:10px;padding:14px;font-size:14px}.btn.primary{background:var(--grad);color:var(--on-accent);box-shadow:var(--glow), inset 0 1px #fff3;transition:transform var(--fast) var(--ease), background-position var(--med) var(--ease), box-shadow var(--fast);background-position:0%;background-size:160% 100%;border:none}.btn.primary:hover{background-position:100%;transform:translateY(-1px);box-shadow:0 12px 34px #3346ff80}.btn.primary:after{content:"";width:45%;height:100%;transition:left .5s var(--ease);background:linear-gradient(100deg,#0000,#ffffff47,#0000);position:absolute;top:0;left:-60%;transform:skew(-18deg)}.btn.primary:hover:after{left:130%}.hint{color:var(--muted);margin:12px 0 0;font-size:11.5px;line-height:1.6}.hint b{color:#dcdce2;font-weight:600}.ardy-meta{color:var(--muted2);letter-spacing:.04em;margin:0 0 4px;font-size:11px}.ardy-hint{color:var(--muted);margin:0;font-size:11.5px;line-height:1.6}.ardy-hint+.ardy-hint{margin-top:6px}.ardy-hint code,.ardy-outcome code{background:var(--card2);border:1px solid var(--line);color:#dcdce2;word-break:break-all;border-radius:6px;padding:1px 6px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:11px}.ardy-clamp{color:var(--muted2);margin-top:5px;font-size:10.5px;display:block}.ardy-status{color:var(--muted);margin:10px 0 0;font-size:11.5px;line-height:1.5}.ardy-status:before{content:"▸ ";color:var(--cyan)}.ardy-report{border:1px solid var(--line);background:var(--card2);animation:rise var(--med) var(--ease);border-radius:10px;margin-top:12px;padding:10px 12px}.ardy-report-grid{grid-template-columns:1fr auto;gap:4px 12px;font-size:11.5px;display:grid}.ardy-report-grid span{color:var(--muted)}.ardy-report-grid b{color:var(--fg);font-variant-numeric:tabular-nums;font-weight:600}.ardy-caveat{color:var(--muted2);margin:8px 0 0;font-size:10.5px;line-height:1.55}.ardy-outcome{margin:10px 0 0;font-size:11.5px;line-height:1.6}.ardy-outcome.done{color:var(--muted)}.ardy-outcome.done code{color:var(--cyan)}.ardy-outcome.error{color:#e5484d}.subjects-row{gap:11px;display:flex}.subject-box{background:var(--card2);border:1px solid var(--line);border-radius:13px;flex:1;min-width:0;padding:12px 13px 13px;position:relative}.subject-box.new{animation:subjectIn .42s var(--spring) both;transform-origin:100%}.subject-box-head{justify-content:space-between;align-items:center;gap:6px;margin-bottom:4px;display:flex}.sb-name,.subject-box-head>span{color:var(--fg);white-space:nowrap;text-overflow:ellipsis;font-size:11.5px;font-weight:600;overflow:hidden}.sb-actions{flex:none;align-items:center;gap:5px;display:flex}.cam-toggle{border:1px solid var(--line2);width:30px;height:25px;color:var(--muted);cursor:pointer;transition:transform var(--fast) var(--ease), background var(--fast), border-color var(--fast), color var(--fast), box-shadow var(--fast);background:#ffffff05;border-radius:8px;justify-content:center;align-items:center;display:inline-flex}.cam-toggle svg{width:14px;height:14px}.cam-toggle:hover{color:var(--fg);border-color:#4d7bff80}.cam-toggle:active{transform:scale(.92)}.cam-toggle.active{background:var(--grad);color:#fff;border-color:#0000;box-shadow:0 3px 12px #3346ff80}.sb-remove{width:22px;height:22px;color:var(--muted2);cursor:pointer;transition:color var(--fast), background var(--fast);background:0 0;border:none;border-radius:7px;justify-content:center;align-items:center;font-size:11px;display:flex}.sb-remove:hover{color:#fff;background:#e5484d}.subject-box-head .x{width:22px;height:22px;color:var(--muted2);cursor:pointer;transition:color var(--fast), background var(--fast);background:0 0;border:none;border-radius:7px;justify-content:center;align-items:center;font-size:11px;display:flex}.subject-box-head .x:hover{color:#fff;background:#e5484d}.cslider{margin-top:11px}.cslider-head{color:var(--muted);white-space:nowrap;justify-content:space-between;align-items:center;gap:6px;margin-bottom:6px;font-size:11px;display:flex}.cslider-head>span:first-child{text-overflow:ellipsis;overflow:hidden}.cslider-head .val{color:#eeeef2;font-variant-numeric:tabular-nums;flex:none;font-weight:500}.cslider input[type=range]{width:100%;display:block}.add-subject{border:1.5px dashed var(--line2);width:100%;color:var(--muted);cursor:pointer;transition:border-color var(--fast), color var(--fast), background var(--fast);background:0 0;border-radius:12px;justify-content:center;align-items:center;gap:8px;margin-top:12px;padding:12px;font-size:12.5px;font-weight:600;display:flex}.add-subject:hover{border-color:var(--accent);color:var(--cyan);background:var(--accent-soft)}.add-subject .as-plus{font-size:17px;font-weight:300;line-height:1}.dropdown{position:relative}.dropdown .trigger{background:var(--card2);width:100%;color:var(--fg);cursor:pointer;text-align:left;transition:border-color var(--fast), background var(--fast), box-shadow var(--fast);border:1px solid #ffffff14;border-radius:10px;justify-content:space-between;align-items:center;gap:8px;padding:10px 12px;font-size:12.5px;display:flex}.dropdown .trigger span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.dropdown .trigger:hover{border-color:#4d7bff73}.dropdown.open .trigger{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-ring)}.dd-caret{width:14px;height:14px;color:var(--muted);transition:transform var(--med) var(--ease);flex:none}.dropdown.open .dd-caret{transform:rotate(180deg)}.dropdown-menu{z-index:25;border:1px solid var(--line2);box-shadow:var(--shadow-lg);max-height:288px;animation:ddIn .16s var(--ease) both;background:#16161b;border-radius:13px;padding:6px;position:absolute;top:calc(100% + 7px);left:0;right:0;overflow-y:auto}.dropdown-item{color:#d6d6de;cursor:pointer;text-align:left;width:100%;transition:background var(--fast), color var(--fast);background:0 0;border:none;border-radius:8px;justify-content:space-between;align-items:center;gap:8px;padding:9px 11px;font-size:12.5px;display:flex}.dropdown-item span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.dropdown-item:hover{background:var(--hover);color:#fff}.dropdown-item.active{color:var(--cyan);font-weight:600}.dd-check{flex:none;width:14px;height:14px}.modal-overlay{z-index:30;-webkit-backdrop-filter:blur(8px);background:#050508b8;justify-content:center;align-items:center;padding:24px;animation:.2s fade;display:flex;position:fixed;inset:0}.modal{background:var(--card);border:1px solid var(--line2);width:480px;max-width:100%;max-height:90vh;box-shadow:var(--shadow-lg);animation:pop var(--med) var(--spring);border-radius:20px;padding:24px;position:relative;overflow-y:auto}.modal:before{content:"";background:linear-gradient(90deg,#2b3cf5,#4d7bff 50%,#79c9ff) 0 0/200% 100%;border-radius:20px 20px 0 0;height:2px;animation:6s linear infinite stripeShift;position:absolute;top:0;left:0;right:0}.modal-head{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.modal-head h3{font-family:var(--display);letter-spacing:-.025em;margin:0;font-size:20px;font-weight:720}.modal .x{color:var(--muted);cursor:pointer;transition:color var(--fast), background var(--fast);background:0 0;border:none;border-radius:8px;padding:6px;font-size:15px;line-height:1}.preview{border:1px solid var(--line);border-radius:12px;width:100%;display:block}.modal-label{text-transform:uppercase;letter-spacing:.13em;color:var(--muted);margin:16px 0 7px;font-size:10.5px;display:block}.modal-label em{color:var(--cyan);text-transform:none;letter-spacing:0;font-style:normal;font-weight:600}.promptbox{background:var(--card2);border:1px solid var(--line);color:#dcdce2;border-radius:11px;padding:14px;font-size:12px;line-height:1.6}.modal-actions{gap:9px;margin-top:16px;display:flex}.modal-actions .btn{flex:1}.toast{border:1px solid var(--line2);color:var(--fg);z-index:40;box-shadow:var(--shadow-lg);animation:toastIn .28s var(--spring);background:#202027;border-radius:11px;padding:11px 18px;font-size:12.5px;font-weight:500;position:fixed;bottom:26px;left:50%;transform:translate(-50%)}.timeline{z-index:6;border-top:1px solid var(--line);background:linear-gradient(#1b1b1e,#141416);flex-direction:column;flex:none;height:190px;display:flex;position:relative;box-shadow:0 -12px 32px #00000059}.timeline.collapsed{height:34px}.tl-head{border-bottom:1px solid var(--line);flex:none;align-items:center;gap:12px;height:34px;padding:0 12px 0 14px;display:flex}.tl-camera-editor{color:#d9d2e7;background:#201c28;border-bottom:1px solid #9a7bd461;flex:none;align-items:center;gap:7px;min-height:44px;padding:4px 10px;font-size:10px;display:flex;overflow-x:auto}.tl-camera-editor-title{text-overflow:ellipsis;white-space:nowrap;color:#cbb8ef;max-width:92px;font-size:11px;overflow:hidden}.tl-camera-head,.tl-camera-tool{color:#b9adc9;height:28px;font:inherit;cursor:pointer;background:#2b2731;border:1px solid #9a7bd459;border-radius:3px;padding:0 7px;font-weight:700}.tl-camera-head.active,.tl-camera-tool.active{color:#fff;background:#7258a0;border-color:#a78bfa}.tl-camera-head:disabled,.tl-camera-tool:disabled,.tl-camera-editor input:disabled{opacity:.4;cursor:default}.tl-camera-editor label{white-space:nowrap;color:#a99fb7;grid-template-columns:auto 50px auto;align-items:center;gap:3px;display:grid}.tl-camera-editor input{box-sizing:border-box;color:#eee8f7;width:50px;height:27px;font:inherit;font-variant-numeric:tabular-nums;background:#17151b;border:1px solid #9a7bd457;border-radius:3px;outline:0;padding:0 3px}.tl-camera-metric{box-sizing:border-box;color:#cfc6dc;width:50px;height:27px;font:inherit;font-variant-numeric:tabular-nums;background:#17151b8a;border:1px solid #9a7bd433;border-radius:3px;justify-content:flex-end;align-items:center;padding:0 5px;display:inline-flex}.tl-camera-editor input:focus{border-color:#a78bfa;box-shadow:0 0 0 1px #a78bfa47}.tl-camera-editor label small{color:#80758e;font-size:8px}.tl-camera-advanced{white-space:nowrap;color:#a99fb7;flex:none}.tl-camera-advanced[open]{align-items:center;gap:7px;display:flex}.tl-camera-advanced summary{cursor:pointer;color:#cbb8ef}.tl-camera-slate{color:#91869e;letter-spacing:.04em;text-transform:uppercase;border-left:1px solid #9a7bd44d;flex:none;padding-left:7px;font-size:9px;font-weight:700}.tl-camera-blocked{color:#d8bd83;white-space:nowrap;background:#e7b55714;border:1px solid #e7b55761;border-radius:3px;align-items:center;min-height:28px;padding:0 10px;font-size:10px;display:inline-flex}.tl-transport{align-items:center;gap:6px;display:flex}.tl-btn{width:26px;height:22px;color:var(--fg);border:1px solid var(--line2);cursor:pointer;transition:background var(--fast) var(--ease), border-color var(--fast) var(--ease);background:#26262b;border-bottom-width:2px;border-radius:6px;justify-content:center;align-items:center;font-size:12px;line-height:1;display:inline-flex}.tl-btn:active{transform:scale(.94)}.tl-btn.play{color:var(--on-accent);background:var(--accent);border-color:#2233d6}.tl-btn.play:hover{background:var(--accent-2)}.tl-readout{font-variant-numeric:tabular-nums;color:var(--muted);border:1px solid var(--line);white-space:nowrap;background:#101013;border-radius:6px;margin-left:6px;padding:3px 9px;font-size:12px}.tl-readout b{color:var(--cyan);font-weight:600}.tl-badge{letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;color:#ffd166;background:#ffd16614;border:1px solid #ffd16666;border-radius:999px;padding:3px 10px;font-size:10px;font-weight:700}.tl-toggle{width:24px;height:22px;color:var(--muted);cursor:pointer;transition:color var(--fast) var(--ease), background var(--fast) var(--ease);background:0 0;border:1px solid #0000;border-radius:6px;justify-content:center;align-items:center;margin-left:auto;font-size:11px;display:inline-flex}.tl-body{--tl-label-w:148px;flex:1;min-height:156px;position:relative;overflow:auto hidden}.tl-surface{height:100%;width:calc(var(--tl-label-w) + (100% - var(--tl-label-w)) * var(--tl-zoom));grid-template-rows:28px repeat(3,minmax(20px,1fr)) minmax(68px,1.7fr);display:grid;position:relative}.tl-ruler{grid-template-columns:var(--tl-label-w) 1fr;border-bottom:1px solid var(--line);background:#101013;height:auto;display:grid}.tl-ruler-label{letter-spacing:.14em;text-transform:uppercase;color:var(--muted2);border-right:1px solid var(--line);z-index:2;align-items:flex-end;padding:0 12px 5px;font-size:9.5px;display:flex;position:sticky;left:0}.tl-ruler-lane{cursor:ew-resize;touch-action:none;-webkit-user-select:none;user-select:none;position:relative}.tl-frame-box{top:3px;left:clamp(0px, calc(var(--tl-f) * 100%), calc(100% - 42px));background:var(--accent);color:#fff;font-variant-numeric:tabular-nums;pointer-events:none;z-index:2;border-radius:6px;justify-content:center;align-items:center;min-width:42px;height:20px;font-size:11px;font-weight:600;display:flex;position:absolute;box-shadow:0 0 12px #3346ff73}.tl-tick{bottom:0;left:clamp(2px, calc(var(--tl-f) * 100%), calc(100% - 2px));font-variant-numeric:tabular-nums;color:var(--muted2);pointer-events:none;flex-direction:column;align-items:center;gap:2px;font-size:9px;display:flex;position:absolute;transform:translate(-50%)}.tl-tick i{background:var(--line2);width:1px;height:5px;display:block}.tl-track{grid-template-columns:var(--tl-label-w) 1fr;border-bottom:1px solid #ffffff0f;height:auto;min-height:18px;display:grid}.tl-track-label{white-space:nowrap;color:var(--muted);border-right:1px solid var(--line);z-index:2;background:#17171a;align-items:center;padding:0 12px;font-size:10.5px;display:flex;position:sticky;left:0;overflow:hidden}.tl-lane{position:relative}.tl-grid{top:0;bottom:0;left:calc(var(--tl-f) * 100%);pointer-events:none;background:#ffffff08;width:1px;position:absolute}.tl-lane.root{cursor:crosshair}.tl-track-label{gap:7px}.tl-track-add{border:1px solid var(--line2);color:#aebcff;cursor:pointer;background:#242833;border-radius:4px;width:18px;height:18px;margin-left:auto;padding:0}.tl-track-add.cut{white-space:nowrap;width:auto;min-width:76px;padding:0 6px;font-size:9px}.tl-track-add.cut.camera{color:#cbb8ef;border-color:#9a7bd461;min-width:54px}.tl-chip{box-sizing:border-box;height:min(22px,100% - 4px);top:50%;left:calc(var(--tl-f-start) * 100%);width:calc((var(--tl-f-end) - var(--tl-f-start)) * 100%);color:#fff;letter-spacing:.02em;white-space:nowrap;pointer-events:auto;touch-action:none;cursor:grab;background:linear-gradient(103deg,#2b3cf5,#4d7bff);border-radius:5px;align-items:center;padding:0 8px;font-size:9.5px;font-weight:600;display:flex;position:absolute;overflow:hidden;transform:translateY(-50%);box-shadow:0 0 10px #3346ff59}.tl-chip.moving,.tl-chip.moving .tl-chip-input{cursor:grabbing;-webkit-user-select:none;user-select:none}.tl-chip.selected{outline:1px solid #9bb2ff;box-shadow:0 0 14px #5672ffa6}.tl-chip-input{color:#fff;min-width:0;height:100%;font:inherit;cursor:grab;background:0 0;border:0;outline:0;flex:1;padding:0 5px;font-weight:600}.tl-chip-input:focus{cursor:text}.tl-chip-input::placeholder{color:#ffffffb8}.tl-chip-handle{cursor:ew-resize;z-index:2;background:#fff3;border:0;width:8px;padding:0;position:absolute;top:0;bottom:0}.tl-chip-handle.start{left:0}.tl-chip-handle.end{right:0}.tl-chip-text{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.tl-chip.empty{box-shadow:none;background:linear-gradient(103deg,#2a2d3a,#3b4050)}.tl-chip.empty .tl-chip-text{color:var(--muted);font-weight:500}.tl-shot-block{box-sizing:border-box;top:3px;bottom:3px;left:calc(var(--tl-f-start) * 100%);width:calc((var(--tl-f-end) - var(--tl-f-start)) * 100%);color:#f0eaff;cursor:grab;touch-action:none;background:#44365d;border:1px solid #735ba0;border-radius:3px;align-items:flex-start;gap:4px;padding:5px 15px 28px;font-size:9.5px;display:flex;position:absolute;overflow:hidden;container-type:inline-size}.tl-shot-empty{color:#8e93a3;pointer-events:none;align-items:center;margin:0;padding:0 14px;font-size:9px;font-style:italic;display:flex;position:absolute;inset:0}.tl-shot-block.active{background:#503f6d;border-color:#e7b557}.tl-shot-block.active .tl-shot-label small{background:#503f6de6}.tl-shot-block.selected{box-shadow:inset 0 0 0 1px #c9b5f473,0 0 8px #9a7bd452}.tl-shot-block.moving{opacity:.72;cursor:grabbing;box-shadow:0 0 0 2px #e7b5574d}.tl-shot-label{z-index:5;white-space:nowrap;flex-direction:column;flex:1;align-items:flex-start;gap:1px;min-width:0;display:flex;position:relative;overflow:hidden}.tl-shot-label b{text-overflow:ellipsis;min-width:0;overflow:hidden}.tl-shot-label small{color:#aab4c0;font-variant-numeric:tabular-nums;background:#44365ddb;flex:none;padding-right:3px;font-size:8.5px}.tl-shot-camera-summary{white-space:nowrap;align-items:center;gap:4px;min-width:0;padding-top:1px;display:flex}.tl-shot-camera-summary>b{letter-spacing:.04em;font-size:9px}.tl-shot-camera-summary>small{text-overflow:ellipsis;color:#d0c3e5;font-variant-numeric:tabular-nums;min-width:0;font-size:8px;overflow:hidden}.tl-shot-key-surface{cursor:crosshair;z-index:1;background:#140c2452;border:0;border-top:1px solid #c9b5f447;height:12px;padding:0;position:absolute;bottom:0;left:12px;right:12px}.tl-shot-key-surface:hover{background:#a78bfa2e}.tl-shot-name-input{color:#fff;width:100%;min-width:28px;height:16px;font:inherit;background:#232323;border:1px solid #e7b557;outline:0;padding:0 3px}.tl-shot-edge{color:#e7b557;cursor:ew-resize;z-index:3;background:0 0;border:0;border-left:2px solid #e7b557;width:14px;padding:0;font-size:14px;line-height:1;position:absolute;top:-2px;bottom:-2px;left:0}.tl-shot-edge:hover{background:#e7b5576b}.tl-shot-edge.end{border-left:0;border-right:2px solid #e7b557;left:auto;right:0}.tl-shot-actions{z-index:6;background:#1d152aeb;border-radius:3px;gap:2px;padding:2px;display:none;position:absolute;top:3px;right:15px}.tl-shot-block:hover .tl-shot-actions,.tl-shot-block:focus-within .tl-shot-actions{display:flex}.tl-shot-actions button{width:auto;min-width:30px;height:20px;color:inherit;cursor:pointer;background:#ffffff1f;border:0;border-radius:2px;padding:0 4px;font-size:9px;line-height:1}.tl-shot-actions button:disabled{opacity:.35;cursor:default}.tl-camera-block-state{color:#d8ccef;letter-spacing:.06em;background:#00000029;border:1px solid #ffffff38;border-radius:2px;padding:1px 3px;font-size:7.5px;font-weight:700}.tl-marker.cam{pointer-events:auto;cursor:grab;z-index:5;background:#a78bfa;border-color:#1e1040;top:auto;bottom:2px;transform:translate(-50%);box-shadow:0 0 8px #a78bfacc}.tl-lane.cam{cursor:crosshair}.tl-rail{box-sizing:border-box;height:14px;top:auto;bottom:13px;left:calc(var(--tl-f-start) * 100%);width:calc((var(--tl-f-end) - var(--tl-f-start)) * 100%);z-index:4;pointer-events:none;position:absolute}.tl-rail-handle,.tl-rail-body{pointer-events:auto;touch-action:none}.tl-rail-body{color:#fff;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;cursor:grab;background:linear-gradient(103deg,#7c5cbf,#a78bfa);border:0;border-radius:4px;justify-content:center;align-items:center;gap:5px;padding:0 6px;font-size:9px;font-weight:700;display:flex;position:absolute;inset:0 8px;overflow:hidden;box-shadow:0 0 8px #a78bfa73}@container (width<=320px){.tl-shot-camera-summary>small,.tl-camera-block-state{display:none}}@container (width<=240px){.tl-shot-camera-summary{display:none}}.tl-rail-body:hover{filter:brightness(1.1)}.tl-rail-body:active{cursor:grabbing}.tl-rail-handle{cursor:ew-resize;z-index:2;background:#ffffff47;border:0;border-radius:3px;width:8px;padding:0;position:absolute;top:0;bottom:0}.tl-rail-handle.start{left:0}.tl-rail-handle.end{right:0}.tl-rail.selected .tl-rail-body{outline:1px solid #cbb7ff;box-shadow:0 0 12px #a78bfab3}.tl-rail.off{opacity:.62}.tl-rail.off .tl-rail-body{box-shadow:none;background:linear-gradient(103deg,#3b3f4d,#4a4f5e)}.tl-rail-body:focus-visible,.tl-rail-handle:focus-visible{outline-offset:1px;outline:2px solid #fff}.tl-rail-progress{top:-2px;bottom:-2px;left:calc(var(--tl-rail-p) * 100%);pointer-events:none;z-index:3;background:#ffe9a8;width:2px;position:absolute;box-shadow:0 0 6px #ffe9a8e6}.tl-marker{top:50%;left:clamp(3px, calc(var(--tl-f) * 100%), calc(100% - 3px));background:var(--cyan);pointer-events:none;z-index:2;border:2px solid #0d1b2e;border-radius:50%;width:10px;height:10px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 8px #79c9ffcc}.tl-marker.wp.pending{background:0 0;border-color:#ffd76c;box-shadow:0 0 10px #ffd76ce6}.tl-marker.wp{pointer-events:auto;cursor:pointer}.tl-marker.ik{pointer-events:auto;cursor:pointer;background:#ff8a3d;border-color:#2e1a0d;border-radius:2px;transform:translate(-50%,-50%)rotate(45deg);box-shadow:0 0 8px #ffa05acc}.tl-track-add.ik{color:#ffc79a;border-color:#4a382a}.tl-btn.ik:disabled{opacity:.4;cursor:not-allowed}.tl-btn.ik{white-space:nowrap;width:auto;min-width:48px;padding:0 7px}.tl-btn.ik.snap{border-color:#4a382a}.tl-btn.ik.snap.on{color:#ffc79a;border-color:#ff8a3d;box-shadow:0 0 8px #ff8a3d59}.tl-btn.wp{letter-spacing:.02em;width:auto;color:var(--muted);padding:0 9px;font-size:11px;font-weight:600}.tl-btn.zoom{font-variant-numeric:tabular-nums;letter-spacing:.02em;width:auto;color:var(--muted);padding:0 7px;font-size:11px}.tl-btn.zoom.on{color:#79c0ff;background:#388bfd1a;border-color:#79c0ff73}.tl-btn.clear{color:#ff9b9b;width:auto;padding:0 8px;font-size:11px}.tl-badge.generating{color:#79c0ff;background:#388bfd1a;border-color:#388bfd73}.tl-wp-hint{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;font-size:10.5px;overflow:hidden}.tl-playhead{top:0;bottom:0;left:calc(var(--tl-label-w) + (100% - var(--tl-label-w)) * var(--tl-f));background:var(--cyan);pointer-events:none;z-index:3;width:1.5px;position:absolute;box-shadow:0 0 8px #79c9ffb3}.tl-collapsed{align-items:center;gap:12px;height:100%;padding:0 14px;display:flex}@media (width<=1040px){.app{width:100%;height:auto;min-height:100vh;overflow-x:hidden}html,body,#root{height:auto;min-height:100%;overflow-x:hidden}.main{flex-direction:column;width:100%;max-width:100%}.workspace{flex-direction:column}.viewport{flex:none;min-width:0;max-width:100%;height:54vh;padding:0}.panel{border-left:none;border-top:1px solid var(--line);width:100%;min-width:0;max-width:100%;padding:16px 16px 40px;overflow:visible}.stage{aspect-ratio:auto;width:100%;max-width:100%;height:100%;max-height:none}.tagline{display:none}.pose-studio{width:auto;height:auto;inset:15% 8px 8px}.pose-grid{grid-template-columns:1fr 1fr 1fr;grid-auto-rows:min-content}}@media (width<=680px){body{font-size:12.5px}.topbar{gap:10px;height:54px;padding:0 14px}.kbd-hint{display:none}.wordmark{font-size:22px}.viewport{min-height:46vh;padding:10px}.stage{border-radius:13px}.pose-grid{grid-template-columns:1fr 1fr}.hud,.caption{font-size:10.5px}.caption{letter-spacing:.08em;padding:6px 11px}}@keyframes fade{0%{opacity:0}to{opacity:1}}@keyframes rise{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes riseCenter{0%{opacity:0;transform:translate(-50%,6px)}to{opacity:1;transform:translate(-50%)}}@keyframes pop{0%{opacity:0;transform:translateY(10px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes toastIn{0%{opacity:0;transform:translate(-50%,14px)}to{opacity:1;transform:translate(-50%)}}@keyframes cardIn{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes stageIn{0%{opacity:0;transform:translateY(18px)scale(.985)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes studioIn{0%{opacity:0;transform:translate(26px)scale(.96)}to{opacity:1;transform:translate(0)scale(1)}}@keyframes studioOut{0%{opacity:1;transform:translate(0)scale(1)}to{opacity:0;transform:translate(26px)scale(.96)}}@keyframes tileIn{0%{opacity:0;transform:translateY(10px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes fabPop{0%{opacity:0;transform:translateY(6px)scale(.9)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes stripeShift{0%{background-position:0%}to{background-position:200%}}@keyframes ddIn{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}@keyframes subjectIn{0%{opacity:0;transform:translate(18px)scale(.9)}to{opacity:1;transform:translate(0)scale(1)}}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}.workspace-splitter,.vp-inset-resize{display:none}@media (width>=1041px){.viewport{justify-content:stretch;align-items:stretch;padding:8px}.stage{aspect-ratio:auto;width:100%;max-width:none;height:100%;max-height:none}.panel.hierarchy-sidebar{width:var(--sidebar-width);grid-template-rows:var(--hierarchy-height) 6px minmax(0, 1fr);min-width:280px;max-width:50vw;display:grid}.hierarchy-pane{height:auto;min-height:0;max-height:none}.inspector-pane{flex-direction:column;min-height:0;display:flex;overflow:hidden}.timeline{height:var(--timeline-height);min-height:110px;max-height:58vh}.timeline.collapsed{height:34px;min-height:34px}.vp-inset{width:var(--inset-width);height:var(--inset-height);aspect-ratio:auto;min-width:190px;max-width:none;min-height:150px}.vp-inset.shot{aspect-ratio:auto}.workspace-splitter,.vp-inset-resize{touch-action:none;-webkit-user-select:none;user-select:none;display:block}.workspace-splitter-vertical{z-index:12;cursor:col-resize;flex:0 0 6px;margin-left:-3px;margin-right:-3px;position:relative}.workspace-splitter-vertical:after,.hierarchy-splitter:after,.timeline-splitter:after{content:"";transition:background var(--fast) ease;background:0 0;position:absolute}.workspace-splitter-vertical:after{width:2px;inset:0 2px}.hierarchy-splitter{z-index:3;cursor:row-resize;background:var(--panel);height:6px;position:relative}.hierarchy-splitter:after,.timeline-splitter:after{height:2px;top:2px;left:0;right:0}.timeline-splitter{z-index:13;cursor:row-resize;flex:0 0 6px;margin-top:-3px;margin-bottom:-3px;position:relative}.workspace-splitter:hover:after,body.is-resizing .workspace-splitter:after{background:var(--accent)}.vp-inset-resize{z-index:9;cursor:nwse-resize;pointer-events:auto;width:24px;height:24px;position:absolute;bottom:0;right:0}.vp-inset-resize:before,.vp-inset-resize:after{content:"";border-bottom:2px solid #ffffffb8;border-right:2px solid #ffffffb8;position:absolute;bottom:5px;right:5px}.vp-inset-resize:before{width:12px;height:12px}.vp-inset-resize:after{width:7px;height:7px}body.is-resizing,body.is-resizing *{-webkit-user-select:none!important;user-select:none!important}body.resize-sidebar,body.resize-sidebar *{cursor:col-resize!important}body.resize-hierarchy,body.resize-hierarchy *,body.resize-timeline,body.resize-timeline *{cursor:row-resize!important}body.resize-inset,body.resize-inset *{cursor:nwse-resize!important}}.panel.hierarchy-sidebar{background:#282828;border-color:#ffffff38}.hierarchy-pane{background:#2c2c2c;border-color:#ffffff38}.hierarchy-heading,.inspector-heading{background:#232323;border-color:#ffffff24}.hierarchy-heading strong,.inspector-heading strong{color:#d2d2d2}.hierarchy-kicker,.inspector-heading>span{color:#9a9a9a}.hierarchy-frame-status{color:#5a9bd4;background:#3a7cbf17;border-color:#3a7cbf59}.hierarchy-row-wrap:before{background:#ffffff21}.hierarchy-row-wrap:hover{background:#3a7cbf14}.hierarchy-row-wrap.selected{background:#2d5c8a;box-shadow:inset 2px 0 #3a7cbf}.hierarchy-toggle{color:#7c8588}.hierarchy-label{color:#d2d2d2}.selected .hierarchy-label{color:#fff}.hierarchy-status{color:#5a9bd4}.hierarchy-badge{color:#9a9a9a;background:#ffffff14}.hierarchy-icon{background:#ffffff0a;border-color:#71818d}.hierarchy-icon.shot{border-color:#3a7cbf;box-shadow:inset 0 0 0 2px #3c3c3c}.hierarchy-icon.camera{border-color:#d4972d}.hierarchy-icon.character{border-color:#6f9f86}.hierarchy-icon.key{border-color:#d65f55}.hierarchy-icon.rig,.hierarchy-icon.bone{border-color:#8a759d}.hierarchy-icon.path,.hierarchy-icon.environment{border-color:#6f9f86}.hierarchy-icon.props,.hierarchy-icon.object{border-color:#c7836f}.inspector-scroll{background:#282828}.card{box-shadow:var(--shadow);background:#2c2c2c;border-color:#ffffff2e;border-radius:8px}.card:after{opacity:.9;background:#3a7cbf;height:2px}.card h3{color:#9a9a9a}.card h3:before{box-shadow:none;background:#3a7cbf}.inspector-hint,.ardy-hint,.ardy-status,.hint,.check,.field label,.row,.readout{color:#9a9a9a}.hint b,.ardy-hint code,.ardy-outcome code{color:#d2d2d2}.inspector-status-grid,.ardy-report{background:#ffffff09;border-color:#ffffff24}.inspector-status-grid b{color:#d2d2d2}.inspector-list button{color:#3d4d58;background:#ffffff61;border-color:#ffffff29}.inspector-list button:hover,.inspector-list button.active{color:#d2d2d2;background:#3c3c3c;border-color:#3a7cbf8f}.presets button{color:#3d4d58;background:#383838;border-color:#ffffff29;border-radius:6px}.presets button:hover{color:#d2d2d2;background:#3c3c3c;border-color:#3a7cbf7a;transform:none}.presets button.active{color:#d2d2d2;background:#2d5c8a;border-color:#3a7cbf;box-shadow:0 0 0 1px #3a7cbf29}.row .val,.readout strong{color:#d2d2d2}input[type=range]{background:#3a3a3a}input[type=range]::-webkit-slider-thumb{background:#2c2c2c;border-color:#3a7cbf;box-shadow:0 1px 2px #0000002e}input[type=range]::-moz-range-thumb{background:#2c2c2c;border-color:#3a7cbf;box-shadow:0 1px 2px #0000002e}.field input[type=text],.field input[type=number],.field textarea,.field select,.dropdown .trigger{color:#d2d2d2;box-shadow:none;background-color:#323232;border-color:#fff3;border-radius:6px}.field input[type=text]::placeholder,.field textarea::placeholder{color:#979d9a}.field select option{color:#d2d2d2;background:#2c2c2c}.dropdown-menu{box-shadow:var(--shadow-md);background:#2c2c2c;border-color:#ffffff3d;border-radius:7px}.dropdown-item{color:#3d4d58;border-radius:5px}.dropdown-item.active{color:#5a9bd4}.segmented{background:#1e1e1e;border-color:#ffffff2e;border-radius:7px}.segmented button{color:#9a9a9a}.segmented button:hover{color:#d2d2d2}.segmented button.active{color:#fff}.btn{color:#d2d2d2;box-shadow:none;background:#383838;border-color:#ffffff3d;border-radius:6px}.btn.ghost{color:#9a9a9a;border-color:#ffffff2e}.btn.ghost:hover{color:#d2d2d2;background:#3c3c3c}.btn.primary{box-shadow:none;background:#3a7cbf;border:1px solid #397f91}.btn.primary:hover{box-shadow:none;background:#3f91a7}.vp-inset{border:1px solid #ffffff73;border-radius:7px;box-shadow:0 7px 20px #00000026}.vp-inset-resize{background:linear-gradient(135deg,#0000 50%,#26221e8c 50%);border-bottom-right-radius:7px}.vp-inset-resize:before,.vp-inset-resize:after{border-color:#fffcf7d9}.vp-inset-tag,.hud,.caption,.viewmode,.grid-toggle{color:#d2d2d2;box-shadow:none;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#fffaf1e6;border-color:#ffffff6b}.vp-inset-tag{color:#d2d2d2}.viewmode{border-radius:7px}.viewmode button{color:#52616b;border-radius:5px}.viewmode button:hover{color:#d2d2d2}.viewmode button.active{color:#fff;box-shadow:none;background:#3a7cbf}.caption{color:#d2d2d2}.grid-toggle.active{color:#5a9bd4;background:#3c3c3c;border-color:#3a7cbf}.film-frame i:before,.film-frame i:after{border-color:#ffffffb8}.toast,.modal,.promptbox{color:#d2d2d2;background:#2c2c2c;border-color:#ffffff3d}.modal-overlay{background:#ffffff4d}.modal:before{background:#3a7cbf;animation:none}.modal .x:hover{color:#d2d2d2;background:#1e1e1e}.timeline{background:#232323;border-color:#ffffff38;box-shadow:0 -5px 14px #00000014}.tl-head{background:#282828;border-color:#ffffff2e}.tl-btn{color:#d2d2d2;background:#2c2c2c;border-color:#ffffff45;border-bottom-width:1px;border-radius:5px}.tl-btn:hover{background:#3c3c3c;border-color:#3a7cbf}.tl-btn.play,.tl-btn.play:hover{color:#fff;background:#3a7cbf;border-color:#397f91}.tl-readout{color:#9a9a9a;background:#2c2c2c;border-color:#ffffff2e}.tl-readout b{color:#5a9bd4}.tl-badge{color:#e7b557;background:#e7b55724;border-color:#be861f75}.tl-toggle:hover{color:#d2d2d2;background:#1e1e1e;border-color:#fff3}.tl-body,.tl-surface{background:#282828}.tl-ruler{background:#232323;border-color:#ffffff2e}.tl-ruler-label,.tl-track-label{color:#52616b;background:#282828;border-color:#ffffff29}.tl-tick{color:#687477}.tl-tick i{background:#ffffff47}.tl-track{border-color:#ffffff1a}.tl-lane{background-color:#282828}.tl-grid{background:#ffffff13}.tl-lane:hover{background-color:#383838}.tl-frame-box{color:#d2d2d2;box-shadow:none;background:#e7b557;border:1px solid #c58d29;border-radius:5px}.tl-track-add{color:#5a9bd4;background:#2c2c2c;border-color:#ffffff3d}.tl-chip{color:#fff;box-shadow:none;background:#3a7cbf;border-radius:4px}.tl-chip.selected{outline-color:#5a9bd4;box-shadow:0 0 0 2px #3a7cbf2e}.tl-chip.empty{color:#52616b;background:#424242}.tl-chip.empty .tl-chip-text{color:#52616b}.tl-chip-handle{background:#ffffff52}.tl-marker{background:#6f9f86;border-color:#2c2c2c;box-shadow:0 0 0 1px #5d8a73}.tl-marker.wp.pending{border-color:#d69a31;box-shadow:0 0 0 2px #e7b55740}.tl-marker.wp:hover{box-shadow:0 0 0 3px #6f9f8633}.tl-marker.ik{background:#d65f55;border-color:#2c2c2c;box-shadow:0 0 0 1px #b54840}.tl-marker.ik:hover{box-shadow:0 0 0 3px #d65f5533}.tl-marker.cam{background:#9a7bd4;border-color:#2c2c2c;box-shadow:0 0 0 1px #7b5cb0}.tl-marker.cam:hover{box-shadow:0 0 0 3px #9a7bd440}.tl-track-add.ik,.tl-btn.ik.snap{color:#e58a80;border-color:#d65f5557}.tl-btn.ik.snap.on{color:#e58a80;box-shadow:none;background:#d65f5517;border-color:#d65f55}.tl-btn.wp.on{color:#8fc7a5;background:#6f9f861f;border-color:#6f9f868c}.tl-btn.zoom.on,.tl-badge.generating{color:#5a9bd4;background:#3a7cbf1a;border-color:#3a7cbf75}.tl-badge.playback{color:#8fc7a5;background:#6f9f861c;border-color:#6f9f8675}.tl-wp-hint.warn{color:#e7b557}.tl-playhead{box-shadow:none;background:#e7b557;width:2px}.tagline{letter-spacing:-.005em;font-size:12px;font-weight:480}.hierarchy-heading strong,.inspector-heading strong{font-family:var(--display);letter-spacing:-.015em;font-size:12.5px;font-weight:680}.hierarchy-kicker,.inspector-heading>span{letter-spacing:.105em;font-size:8.5px;font-weight:720}.hierarchy-label{letter-spacing:-.005em;font-size:10.75px;font-weight:520}.hierarchy-status,.hierarchy-badge,.hierarchy-frame-status{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:0}.card h3{font-family:var(--display);letter-spacing:.105em;font-size:10.5px;font-weight:720}.inspector-hint,.ardy-hint,.studio-hint{letter-spacing:0;font-size:10.5px;line-height:1.55}.presets button,.btn,.segmented button,.dropdown-item,.dropdown .trigger{letter-spacing:-.005em;font-size:12px;font-weight:580}.field label,.check{letter-spacing:0;font-size:11px;font-weight:520}.field input[type=text],.field input[type=number],.field textarea,.field select{letter-spacing:0;font-size:12px;font-weight:480}.row{letter-spacing:0;font-size:11.25px}.row .val,.readout,.inspector-status-grid,.ardy-status,.ardy-report-grid b,.ardy-report-grid span,.ardy-meta,.ardy-outcome code,.ardy-hint code,.kbd-hint,.caption,.hud,.tl-readout,.tl-badge,.tl-frame-box,.tl-tick,.tl-ruler-label,.tl-wp-hint{font-family:var(--mono);font-variant-numeric:tabular-nums}.row .val{letter-spacing:-.015em;font-size:11px;font-weight:650}.kbd-hint{letter-spacing:-.015em;font-size:10.5px}.kbd-hint b{letter-spacing:-.02em;font-size:9.5px;font-weight:650}.caption{letter-spacing:.065em;font-size:10px;font-weight:650}.viewmode button,.grid-toggle,.vp-inset-tag{font-family:var(--sans);letter-spacing:-.005em;font-size:10.5px;font-weight:650}.tl-btn{font-family:var(--sans);font-weight:620}.tl-readout{letter-spacing:-.02em;font-size:10.75px;font-weight:520}.tl-ruler-label{letter-spacing:.1em;font-size:9px;font-weight:700}.tl-track-label{letter-spacing:-.005em;font-size:10.25px;font-weight:540}.tl-tick{letter-spacing:-.025em;font-size:8.5px;font-weight:520}.tl-frame-box{letter-spacing:-.02em;font-size:10.5px;font-weight:720}.tl-chip,.tl-chip-input{font-family:var(--sans);letter-spacing:-.005em;font-size:9.5px;font-weight:620}.modal-label{letter-spacing:.1em;font-size:9.5px;font-weight:700}.promptbox{font-size:11.5px;line-height:1.6}.pose-studio{box-shadow:var(--shadow-lg);-webkit-backdrop-filter:blur(12px);background:#fffaf1f5;border-color:#ffffff3d;border-radius:8px}.pose-studio:before{background:#3a7cbf;border-radius:8px 8px 0 0;animation:none}@media (width>=1041px){.viewport{justify-content:stretch;align-items:stretch;padding:0}.stage{aspect-ratio:auto;width:100%;max-width:none;height:100%;max-height:none}.panel.hierarchy-sidebar{width:var(--sidebar-width);grid-template-rows:auto minmax(0,1fr);min-width:280px;max-width:50vw}.hierarchy-pane{height:auto;max-height:none}.timeline:not(.collapsed){height:var(--timeline-height)}.vp-inset,.vp-inset.shot{width:var(--inset-width);height:var(--inset-height);aspect-ratio:auto;max-width:none}}.panel.hierarchy-sidebar{flex-direction:column;display:flex}.right-panel-tabs{border-bottom:1px solid var(--line);background:var(--panel);flex:none;grid-template-columns:1fr 1fr;gap:4px;padding:8px;display:grid}.right-panel-tabs button{height:34px;color:var(--muted);font:inherit;letter-spacing:.03em;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:7px;padding:0 10px;font-size:10px;font-weight:700}.right-panel-tabs button:hover{color:var(--fg);background:#3a7cbf14}.right-panel-tabs button.active{color:#cfe3f5;background:#2d5c8a;border-color:#3a7cbf6b;box-shadow:inset 0 -2px #3a7cbf}.right-panel-view,.hierarchy-tab-pane,.inspector-pane{min-height:0}.right-panel-view{flex:1 1 0;overflow:hidden}.right-panel-view>[hidden]{display:none!important}.hierarchy-tab-pane,.hierarchy-tab-pane>.hierarchy-pane,.inspector-pane{width:100%;height:100%;max-height:none}.hierarchy-tab-pane>.hierarchy-pane{border-bottom:0}.hierarchy-toolbar{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:8px;padding:8px 10px;display:flex}.add-object{position:relative}.add-object-trigger{color:#cfe3f5;height:28px;font:inherit;cursor:pointer;background:#2d5c8a;border:1px solid #3a7cbf6b;border-radius:7px;align-items:center;gap:6px;padding:0 10px;font-size:10px;font-weight:700;display:inline-flex}.add-object-trigger:hover{background:#356795}.add-object-menu{z-index:20;border:1px solid var(--line);background:var(--panel);border-radius:9px;width:236px;max-height:330px;padding:6px;position:absolute;top:calc(100% + 6px);left:0;overflow:auto;box-shadow:0 12px 28px #0000002e}.add-object-group{gap:2px;padding-bottom:4px;display:grid}.add-object-heading{color:var(--muted);letter-spacing:.16em;text-transform:uppercase;padding:6px 8px 2px;font-size:8px;font-weight:700;display:block}.add-object-item{width:100%;color:var(--fg);font:inherit;text-align:left;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:6px;align-items:center;gap:8px;padding:6px 8px;font-size:10px;display:flex}.add-object-item:hover{background:#3a7cbf1a;border-color:#3a7cbf6b}.add-object-item small{color:var(--muted);margin-left:auto;font-size:8px}.add-object-swatch{border:1px solid #ffffff40;border-radius:3px;flex:none;width:12px;height:12px}.card .add-object{margin-bottom:10px;display:block}.card .add-object-menu{width:auto;box-shadow:none;margin-top:6px;position:static}.gizmo-modes kbd{font-family:var(--mono);border:1px solid #fff3;border-radius:4px;margin-left:5px;padding:1px 4px;font-size:8px}.object-colors{gap:6px;margin:4px 0 12px;display:flex}.object-color{cursor:pointer;border:1px solid #ffffff40;border-radius:6px;width:22px;height:22px}.object-color.active{box-shadow:0 0 0 2px var(--accent)}.vec3-row{align-items:center;gap:5px;margin:10px 0;display:flex}.vec3-label{width:54px;color:var(--muted);flex:none;font-size:11px;font-weight:520}.number-field{flex:1;align-items:stretch;min-width:0;display:flex}.number-field .axis{border:1px solid var(--line);background:var(--card2);width:18px;color:var(--muted);font-family:var(--mono);cursor:ew-resize;-webkit-user-select:none;user-select:none;touch-action:none;border-right:none;border-radius:6px 0 0 6px;flex:none;justify-content:center;align-items:center;font-size:9px;font-weight:650;display:flex}.number-field input{width:0;min-width:0;color:var(--fg);font-family:var(--mono);font-variant-numeric:tabular-nums;text-align:right;background:0 0;border:1px solid #0000;border-radius:0 6px 6px 0;flex:1;padding:3px 6px;font-size:10.5px;font-weight:480}.number-field:hover input{border-color:var(--line);background:var(--card2)}.number-field:focus-within .axis{border-color:var(--accent);background:var(--accent-soft)}.number-field input:focus{border-color:var(--accent);background:var(--card2);box-shadow:0 0 0 2px var(--accent-ring);outline:none}.hierarchy-context-menu{z-index:40;border:1px solid var(--line);background:var(--panel);border-radius:9px;width:236px;max-height:340px;padding:6px;position:fixed;overflow:auto;box-shadow:0 12px 28px #0000002e}.hierarchy-context-item{width:100%;color:var(--fg);font:inherit;text-align:left;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:6px;align-items:center;gap:8px;padding:6px 8px;font-size:10px;font-weight:520;display:flex}.hierarchy-context-item:hover{background:#3a7cbf1a;border-color:#3a7cbf6b}.hierarchy-rename-input{border:1px solid var(--accent);background:var(--card2);min-width:0;color:var(--fg);font:inherit;box-shadow:0 0 0 2px var(--accent-ring);border-radius:4px;outline:none;flex:1;padding:2px 5px;font-size:10.75px;font-weight:520}.move-ab{flex-wrap:wrap;gap:6px;display:flex}.move-ab .btn{flex:1;min-width:62px;padding:6px 0;font-size:11px}.move-ab .btn:disabled{opacity:.45;cursor:default}.move-ab .btn.rec-live{color:#e2574d;border-color:#e2574d99}.move-slate{letter-spacing:.06em;color:var(--muted);margin:4px 0 10px;font-size:10.5px}.move-frames{gap:10px;display:flex}.move-frames figure{flex:1;min-width:0;margin:0}.move-frames figcaption{letter-spacing:.06em;color:var(--muted);text-align:center;margin-top:4px;font-size:10.5px}.move-head{margin-top:18px}.camera-editor-pointer{color:#aaa2b5;background:#5d487e1f;border:1px solid #9a7bd447;border-radius:4px;margin:4px 0 2px;padding:8px 9px;font-size:10px;line-height:1.35}.move-slate.inline{margin:0}.scene-save-error{color:#e58a80;background:#d65f5517;border-bottom:1px solid #d65f5557;flex:none;margin:0;padding:7px 12px;font-size:12px;font-weight:600;line-height:1.45}.panel.hierarchy-left{background:var(--panel);border-right:1px solid var(--line);flex-direction:column;flex:none;min-height:0;padding:0;display:flex;overflow:hidden}.hierarchy-left .hierarchy-pane{border-bottom:0;flex:1;min-height:0;max-height:none}.inspector-sidebar{flex-direction:column;display:flex}.inspector-sidebar .inspector-pane{flex-direction:column;flex:1;min-height:0;display:flex}.viewport .viewmode{z-index:7;position:absolute;top:10px;left:10px}.bottom-window{background:var(--bg);border-top:1px solid var(--line);flex-direction:column;flex:none;min-height:0;display:flex}.bottom-window-tabs{border-bottom:1px solid var(--line);background:var(--panel);flex:none;gap:2px;padding:3px 8px 0;display:flex}.bottom-window-tabs button{height:26px;color:var(--muted);font:inherit;letter-spacing:.03em;cursor:pointer;background:0 0;border:1px solid #0000;border-bottom:0;border-radius:3px 3px 0 0;padding:0 12px;font-size:10px;font-weight:700}.bottom-window-tabs button:hover{color:var(--fg);background:var(--hover)}.bottom-window-tabs button.active{background:var(--bg);border-color:var(--line2);color:var(--fg);box-shadow:inset 0 2px var(--accent)}.bottom-window-tabs button.active:hover{background:var(--bg)}.bottom-timeline{flex-direction:column;min-height:0;display:flex}@media (width>=1041px){.timeline:not(.collapsed):has(.tl-camera-editor){height:max(calc(var(--timeline-height) + 12px), 234px);max-height:none}.timeline:not(.collapsed):has(.tl-camera-advanced[open]){height:max(calc(var(--timeline-height) + 48px), 270px)}}.console-pane{height:var(--timeline-height);background:var(--panel);min-height:110px;max-height:58vh;font-family:var(--mono);padding:6px 10px;font-size:11px;overflow-y:auto}.console-empty{color:var(--muted2);margin:8px 4px;font-size:11px}.console-line{border-bottom:1px solid var(--line);color:var(--fg);gap:10px;margin:0;padding:3px 4px;display:flex}.console-line time{color:var(--muted2);flex:none;font-size:10px}@media (width>=1041px){.panel.hierarchy-left{width:var(--hierarchy-width);min-width:220px;max-width:40vw}}@media (width<=1040px){.panel.hierarchy-left{border-right:0;border-bottom:1px solid var(--line);width:100%;max-height:38vh}.viewport .viewmode{top:8px;left:8px}}.editor-toolbar{justify-self:center;align-items:center;gap:8px;display:flex}.tool-switch{border:1px solid var(--line);background:var(--card2);border-radius:5px;gap:2px;padding:2px;display:flex}.tool-switch button,.snap-switch{height:24px;color:var(--muted);font:inherit;letter-spacing:.03em;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:3px;padding:0 10px;font-size:10px;font-weight:700}.tool-switch button:hover,.snap-switch:hover{color:var(--fg);background:var(--hover)}.tool-switch button.active{background:var(--accent);color:var(--on-accent)}.snap-switch{border-color:var(--line)}.snap-switch.active{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-2)}.card.foldout{padding-top:0}.foldout-head{border:0;border-bottom:1px solid var(--line);background:var(--card2);width:calc(100% + 36px);color:inherit;font:inherit;cursor:pointer;text-align:left;align-items:center;gap:7px;margin:0 -18px;padding:10px 18px;display:flex}.foldout-arrow{width:10px;color:var(--muted);flex:none;font-size:9px}.card.foldout h3{text-transform:none;letter-spacing:0;margin:0}.card.foldout h3:before{display:none}.foldout-body{padding-top:13px}.pane-tabs{z-index:8;display:flex;position:absolute;top:0;left:0}.pane-tabs button{border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--panel);height:26px;color:var(--muted);font:inherit;cursor:pointer;padding:0 14px;font-size:11px;font-weight:600}.pane-tabs button:hover{color:var(--fg)}.pane-tabs button.active{color:var(--fg);background:#232323;border-bottom-color:#232323}.viewport .viewmode.scene-only{border:1px solid var(--line);border-top:0;top:0;left:168px}.btn,.presets button,.field input[type=text],.field input[type=number],.field textarea,.field select,.dropdown .trigger,.dropdown-menu,.modal,.toast,.promptbox,.add-subject,.segmented,.tl-btn,.add-object-trigger,.hierarchy-context-menu,.add-object-menu,.card{box-shadow:none;border-radius:2px}.btn{color:var(--fg);background:#383838;border:1px solid #1a1a1a;transform:none}.btn:hover{box-shadow:none;background:#3f3f3f;border-color:#1a1a1a;transform:none}.btn:active{transform:none}.btn.primary,.btn.primary:hover{box-shadow:none;background:#2d5c8a;border:1px solid #1a1a1a;transform:none}.btn.primary:after{display:none}.btn.ghost{border-color:var(--line2);background:0 0}.btn.ghost:hover{background:var(--hover);box-shadow:none}.presets button{color:var(--fg);background:#383838;border:1px solid #1a1a1a}.presets button:hover{box-shadow:none;background:#3f3f3f;transform:none}.presets button.active{color:#fff;box-shadow:none;background:#2d5c8a;border-color:#1a1a1a}.field input[type=text],.field input[type=number],.field textarea,.field select,.dropdown .trigger{color:var(--fg);background-color:#2a2a2a;border:1px solid #1a1a1a}.field input[type=text]:focus,.field input[type=number]:focus,.field textarea:focus,.field select:focus,.dropdown.open .trigger{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.dropdown-menu{background:#2c2c2c;border:1px solid #1a1a1a;box-shadow:0 4px 12px #00000080}.dropdown-item:hover{color:#fff;background:#2d5c8a}.card{background:var(--panel);border:1px solid var(--line);padding:0 0 12px}.card:after{display:none}.card:hover{border-color:var(--line)}.foldout-head{border-bottom:1px solid var(--line);background:#2f2f2f;font-weight:600}input[type=range]{background:#1e1e1e;border-radius:0;height:4px}input[type=range]::-webkit-slider-thumb{width:12px;height:12px;box-shadow:none;background:#c4c4c4;border:1px solid #1a1a1a;border-radius:2px}input[type=range]::-webkit-slider-thumb:hover{background:#fff;transform:none}input[type=range]:active::-webkit-slider-thumb{box-shadow:0 0 0 1px var(--accent);transform:none}input[type=range]::-moz-range-thumb{width:12px;height:12px;box-shadow:none;background:#c4c4c4;border:1px solid #1a1a1a;border-radius:2px}.segmented{background:#2a2a2a;border:1px solid #1a1a1a;padding:2px}.segmented:before{box-shadow:none;background:#2d5c8a;border-radius:2px}.modal{background:#2c2c2c;border:1px solid #1a1a1a;box-shadow:0 8px 30px #0009}.modal:before{display:none}.toast{background:#2c2c2c;border:1px solid #1a1a1a;box-shadow:0 4px 12px #00000080}.pose-studio{-webkit-backdrop-filter:none;background:#2c2c2cf7;border:1px solid #1a1a1a;border-radius:2px;box-shadow:0 8px 30px #0009}.pose-studio:before{display:none}.hierarchy-row-wrap{height:22px}.hud,.caption,.viewmode{-webkit-backdrop-filter:none;border-radius:2px}.tool-switch button{align-items:center;gap:6px;display:inline-flex}.tool-icon{flex:none;width:13px;height:13px}.playview-empty{z-index:7;pointer-events:none;color:var(--muted);flex-direction:column;justify-content:center;align-items:center;gap:6px;font-size:12px;display:flex;position:absolute;inset:0}.playview-empty strong{color:var(--fg);font-size:14px;font-weight:600}.inspector-sidebar .inspector-pane{background:#2c2c2c}.inspector-heading{background:#282828;border-bottom:1px solid #1a1a1a;align-items:center;gap:8px;height:28px;padding:0 12px;display:flex}.inspector-heading>span{margin:0;font-size:9px}.inspector-scroll{background:#2c2c2c;padding:0}.inspector-scroll>.card{margin:0}.card.foldout,.card{background:0 0;border:0;border-bottom:1px solid #232323;border-radius:0;padding:0 0 8px}.foldout-head{letter-spacing:0;background:0 0;border-bottom:0;width:100%;height:24px;margin:0;padding:0 8px 0 6px;font-size:11px;font-weight:600}.foldout-head:hover{background:#ffffff0a}.foldout-arrow{width:12px;font-size:8px}.row{align-items:center;gap:8px;min-height:22px;margin:3px 0;font-size:11px;display:flex}.row>span:first-child{width:84px;color:var(--muted);flex:none;font-size:11px}.row .val{width:auto;min-width:34px;font-size:11px}input[type=range]{height:3px}.readout{color:var(--muted2);margin-top:2px;font-size:10px}.field{margin:4px 0}.field label{color:var(--muted);margin-bottom:3px;font-size:10px}.field input[type=text],.field input[type=number],.field textarea,.field select,.dropdown .trigger{border-radius:2px;height:22px;padding:2px 8px;font-size:11px}.field textarea{height:auto;min-height:72px;padding:6px 8px}.field select{background-position:right 7px center;padding-right:26px}.dropdown-menu{padding:3px}.dropdown-item{border-radius:2px;padding:4px 8px;font-size:11px}.vec3-row{gap:3px;min-height:22px;margin:4px 0}.vec3-label{width:52px;font-size:11px}.number-field .axis{border-radius:2px 0 0 2px;width:15px;font-size:9px}.number-field input{border-radius:0 2px 2px 0;height:20px;padding:1px 5px;font-size:11px}.presets{gap:4px;margin:4px 0}.presets button{height:24px;padding:0 8px;font-size:11px;font-weight:500}.check{gap:6px;min-height:20px;margin-top:4px;font-size:11px}.check input{width:13px;height:13px}.btn{white-space:nowrap;justify-content:center;align-items:center;height:24px;padding:0 12px;font-size:11px;font-weight:500;display:inline-flex}.btn.ghost{margin-top:6px;padding:0 12px}.btn.generate,.btn.cta{height:30px;font-size:12px}.segmented{margin-bottom:4px}.segmented button{padding:3px 9px;font-size:11px}.subjects-row{gap:6px}.subject-box{background:#282828;border-radius:2px;padding:6px 8px 8px}.sb-name,.subject-box-head>span{font-size:11px}.cslider-head{margin-bottom:3px;font-size:10px}.add-subject{border-width:1px;border-radius:2px;margin-top:6px;padding:6px;font-size:11px}.inspector-hint,.ardy-hint,.ardy-status,.hint,.ardy-caveat,.ardy-meta,.ardy-clamp{font-size:10px;line-height:1.5}.hint{margin-top:6px}.ardy-report,.inspector-status-grid{border-radius:2px;padding:6px 8px;font-size:10px}.inspector-list button{border-radius:2px;padding:4px 8px;font-size:11px}.presets.gizmo-modes{grid-template-columns:1fr 1fr 1fr}.presets.gizmo-modes button{padding:0 4px}.presets.gizmo-modes kbd{border-radius:2px;padding:0 3px;font-size:8px}.object-colors{gap:4px;margin:4px 0 8px}.object-color{border-radius:2px;width:18px;height:18px}.editor-toolbar.scene-tools{z-index:8;background:var(--panel);border-right:1px solid var(--line);border-bottom:1px solid var(--line);gap:0;display:flex;position:absolute;top:27px;left:0}.editor-toolbar.scene-tools .tool-switch{background:0 0;border:0;border-radius:0;padding:0}.editor-toolbar.scene-tools .tool-switch button,.editor-toolbar.scene-tools .snap-switch{border:0;border-right:1px solid var(--line);background:0 0;border-radius:0;height:26px}.editor-toolbar.scene-tools .tool-switch button.active{color:#fff;background:#2d5c8a}.editor-toolbar.scene-tools .snap-switch.active{color:var(--fg);background:#2d5c8a59}.vec3-row .number-field:first-of-type .axis{color:#e5484d}.vec3-row .number-field:nth-of-type(2) .axis{color:#7ee787}.vec3-row .number-field:nth-of-type(3) .axis{color:#79c0ff}.hierarchy-toggle{color:#8a8a8a;font-size:8px}.hierarchy-row-wrap{margin-left:calc(var(--hierarchy-depth) * 12px)}.hierarchy-row-wrap:before{background:#ffffff12;left:-9px}.hierarchy-icon{width:10px;height:10px}.hierarchy-label{font-size:11px}.hierarchy-heading,.inspector-heading{background:#2c2c2c;border-bottom:1px solid #1a1a1a;height:26px;padding:0 10px}.hierarchy-heading strong,.inspector-heading strong{font-size:11px;font-weight:600}.hierarchy-kicker,.inspector-heading>span{display:none}.vec3-row{grid-template-columns:56px 1fr 1fr 1fr;align-items:center;gap:4px;display:grid}.vec3-label{width:auto}.number-field{min-width:0}.number-field input{text-align:left;padding-left:4px}.viewport .viewmode.scene-only{border:1px solid var(--line);border-top:0;border-radius:0;top:0;left:auto;right:0}.object-colors{margin:2px 0 6px}.inspector-hint{margin:2px 0 6px;line-height:1.45}:is(.field:has(input[type=text]),.field:has(input[type=number]),.field:has(select),.field:has(.dropdown)){grid-template-columns:84px 1fr;align-items:center;gap:8px;display:grid}:is(.field:has(input[type=text]) label,.field:has(input[type=number]) label,.field:has(select) label,.field:has(.dropdown) label){color:var(--muted);margin:0;font-size:11px}.ardy-clamp{white-space:nowrap;text-overflow:ellipsis;display:block;overflow:hidden}.inspector-heading strong{letter-spacing:0;font-size:12.5px;font-weight:700}.foldout-head{gap:6px;height:26px;font-size:11.5px;font-weight:700}.foldout-head:after{content:"";background:0 0;border:1px solid #6f6f6f;border-radius:1px;flex:none;order:1;width:10px;height:10px}.foldout-arrow{color:#c4c4c4;order:0;width:12px;font-size:8px}.foldout-title{order:2}.card.foldout.open .foldout-head{border-bottom:1px solid #232323}.card.foldout{border-bottom:0;padding-bottom:6px}.card.foldout.open{border-bottom:1px solid #232323}.foldout-body{padding:6px 12px 2px 22px}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#4a4a4a;border:none;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#5c5c5c}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-corner{background:0 0}.inspector-scroll{overflow-x:hidden}.inspector-heading strong{font-size:11px;font-weight:600}.inspector-heading-selection{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;margin-left:auto;font-size:10px;font-weight:400;overflow:hidden}.inspector-scroll{padding-bottom:16px}.card.foldout:last-child{border-bottom:0}.inspector-scroll{flex-direction:column;display:flex}.inspector-scroll>.card.foldout.open:last-child{flex-direction:column;flex:1;display:flex}.inspector-scroll>.card.foldout.open:last-child .foldout-body{flex:1}.inspector-footer{background:#282828;border-top:1px solid #1a1a1a;flex:none;margin-top:auto;padding:8px 12px}.inspector-footer .btn{text-align:center;justify-content:center;align-items:center;width:100%;height:26px;margin:0;padding:0 8px;display:flex}.hierarchy-row-wrap:before{display:none}.hierarchy-icon{width:10px;height:10px;box-shadow:none;background:#ffffff0d;border:1px solid #8a8a8a;border-radius:2px;transform:none}.hierarchy-icon.shot{background:#3a7cbf2e;border-color:#3a7cbf;border-radius:50%}.hierarchy-icon.camera{background:#d4972d29;border-color:#d4972d;transform:skew(-8deg)}.hierarchy-icon.character{background:#6f9f8629;border-color:#6f9f86;border-radius:50% 50% 3px 3px}.hierarchy-icon.motion,.hierarchy-icon.clip,.hierarchy-icon.prompt{background:#3a7cbf2e;border-color:#3a7cbf}.hierarchy-icon.key{background:#d65f5529;border-color:#d65f55;transform:rotate(45deg)scale(.78)}.hierarchy-icon.rig,.hierarchy-icon.bone{background:#8a759d29;border-color:#8a759d;border-radius:50%}.hierarchy-icon.path{background:#6f9f8629;border-color:#6f9f86;border-radius:999px;width:12px;height:5px}.hierarchy-icon.environment{background:#6f9f8629;border-color:#6f9f86;border-radius:50%}.hierarchy-icon.props,.hierarchy-icon.object{background:#c7836f29;border-color:#c7836f}.hierarchy-badge{color:var(--muted2);background:0 0;min-width:0;padding:0;font-size:9px}.hierarchy-badge:where([data-zero=true]){display:none}.hierarchy-status{color:var(--muted2);letter-spacing:0;text-transform:none;font-size:9px}.hierarchy-row{min-width:0}.hierarchy-label{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.hierarchy-badge,.hierarchy-status{flex:none}.hierarchy-row-wrap{border-radius:2px;height:22px;padding-right:6px}.hierarchy-row-wrap.selected{box-shadow:none;background:#2d5c8a}.result-move-slate{justify-content:space-between;align-items:baseline;gap:12px;display:flex}.result-move-slate small{color:var(--cyan);font-family:var(--sans);letter-spacing:0;text-align:right;font-size:9.5px;font-weight:600}.result-modal{width:560px}.result-modal .promptbox{max-height:100px;overflow-y:auto}.result-next-intro{margin:0 0 10px}.result-handoff-steps{border-top:1px solid var(--line2);margin:0;padding:0;list-style:none}.result-handoff-steps li{border-bottom:1px solid var(--line2);grid-template-columns:128px minmax(0,1fr);gap:10px;padding:9px 0;font-size:10.5px;line-height:1.45;display:grid}.result-handoff-steps strong{color:var(--fg);font-weight:700}.result-handoff-steps span{color:var(--muted)}.result-handoff-note{color:var(--cyan);margin:10px 0 0;font-size:10px;line-height:1.45}.result-next{border:1px solid var(--line2);border-left:3px solid var(--accent);background:#282828;margin-top:16px;padding:12px 13px}.result-next h4{margin:0 0 5px;font-size:12px;font-weight:650}.result-next p{color:var(--muted);margin:0;font-size:11px;line-height:1.5}.result-next code{color:var(--fg);font-family:var(--mono);font-size:10px}.result-reference-video{border-top:1px solid var(--line2);padding-top:9px;display:block;margin-top:10px!important}.result-reference-video strong{color:var(--cyan);text-transform:uppercase;letter-spacing:.07em;font-size:10px;font-weight:650;display:block}.result-reference-video code{overflow-wrap:anywhere;margin:3px 0 2px;line-height:1.35;display:block}@media (prefers-reduced-motion:reduce){.modal-overlay,.modal{animation:none}}.inspector-tabs{background:#2c2c2c;border-bottom:1px solid #1a1a1a;flex:none;height:26px;display:flex}.inspector-tabs button{color:#9a9a9a;cursor:pointer;background:0 0;border:none;border-right:1px solid #1a1a1a;flex:1;font-size:11px;font-weight:600}.inspector-tabs button:last-child{border-right:none}.inspector-tabs button:hover{color:#d2d2d2}.inspector-tabs button.active{color:#fff;background:#383838;box-shadow:inset 0 -2px #3a7cbf}.inspector-scroll>.card{flex-shrink:0}

package/dist/index.html

@@ -2,12 +2,413 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Cozy Clay</title>
-    <script type="module" crossorigin src="./assets/index-BW_S1YRy.js"></script>
-    <link rel="stylesheet" crossorigin href="./assets/index-nRmmJgap.css">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
+    <meta name="description" content="CozyClay is an open-source, browser-based 3D staging and previz studio. Block a scene, pose characters, author camera moves and cuts, and preview generated motion — no Blender, no Unity, no install." />
+    <meta name="theme-color" content="#232323" />
+    <meta name="apple-mobile-web-app-title" content="CozyClay" />
+    <link rel="canonical" href="https://cozyclay.org/" />
+    <link rel="icon" href="/favicon.ico" sizes="any" />
+    <link rel="icon" type="image/png" sizes="32x32" href="/icons/icon-32.png" />
+    <link rel="icon" type="image/png" sizes="192x192" href="/icons/icon-192.png" />
+    <link rel="apple-touch-icon" href="/icons/apple-touch-icon.png" />
+
+    <meta property="og:type" content="website" />
+    <meta property="og:site_name" content="CozyClay" />
+    <meta property="og:title" content="CozyClay — browser-based 3D staging and previz studio" />
+    <meta property="og:description" content="Block a scene, pose characters, author camera moves and cuts, and preview generated motion. Open source, runs in your browser." />
+    <meta property="og:url" content="https://cozyclay.org/" />
+    <meta property="og:image" content="https://cozyclay.org/media/cozyclay-demo-poster.jpg" />
+    <meta property="og:image:width" content="1920" />
+    <meta property="og:image:height" content="1080" />
+    <meta property="og:image:alt" content="A CozyClay shot mid-wipe: the greybox previz on one half, the generated result on the other." />
+    <meta name="twitter:card" content="summary_large_image" />
+    <meta name="twitter:title" content="CozyClay — browser-based 3D staging and previz studio" />
+    <meta name="twitter:description" content="Block a scene, pose characters, author camera moves and cuts, and preview generated motion. Open source, runs in your browser." />
+    <meta name="twitter:image" content="https://cozyclay.org/media/cozyclay-demo-poster.jpg" />
+
+    <title>CozyClay — browser-based 3D staging and previz studio</title>
+
+    <meta property="og:video" content="https://cozyclay.org/media/cozyclay-demo.mp4" />
+    <meta property="og:video:type" content="video/mp4" />
+    <meta property="og:video:width" content="1920" />
+    <meta property="og:video:height" content="1080" />
+
+    <!-- Cloudflare Web Analytics. Cookie-less, so no consent banner. Installed by
+         hand because cozyclay.org resolves straight to GitHub Pages (DNS-only),
+         so Cloudflare never proxies the response and cannot inject the beacon. -->
+    <script defer src="https://static.cloudflareinsights.com/beacon.min.js" data-cf-beacon='{"token": "6a4384d1375d4ffc8a30a6346a8ad1a0"}'></script>
+
+    <script type="application/ld+json">
+      {
+        "@context": "https://schema.org",
+        "@type": "SoftwareApplication",
+        "name": "CozyClay",
+        "url": "https://cozyclay.org/",
+        "applicationCategory": "DesignApplication",
+        "applicationSubCategory": "3D previsualization",
+        "operatingSystem": "Any (Chromium-based browser)",
+        "description": "CozyClay is an open-source, browser-based 3D staging studio. Block a scene, pose characters, sequence motion prompts on a timeline, and preview generated motion in one local workspace that handles like the Unity Editor.",
+        "image": "https://cozyclay.org/media/cozyclay-demo-poster.jpg",
+        "screenshot": "https://cozyclay.org/media/cozyclay-demo-poster.jpg",
+        "logo": "https://cozyclay.org/media/cozyclay-logo.png",
+        "license": "https://github.com/HaD0Yun/CozyClay/blob/main/LICENSE",
+        "codeRepository": "https://github.com/HaD0Yun/CozyClay",
+        "programmingLanguage": ["JavaScript", "TypeScript"],
+        "offers": { "@type": "Offer", "price": "0", "priceCurrency": "USD" }
+      }
+    </script>
+    <script type="application/ld+json">
+      {
+        "@context": "https://schema.org",
+        "@type": "FAQPage",
+        "mainEntity": [
+          {
+            "@type": "Question",
+            "name": "What is CozyClay?",
+            "acceptedAnswer": {
+              "@type": "Answer",
+              "text": "CozyClay is an open-source 3D staging and previsualization studio that runs in a browser. You block a scene with primitives and set pieces, pose characters, draw root paths, author camera moves and cuts on a timeline, and preview generated motion."
+            }
+          },
+          {
+            "@type": "Question",
+            "name": "Do I need Blender or Unity to use CozyClay?",
+            "acceptedAnswer": {
+              "@type": "Answer",
+              "text": "No. CozyClay runs entirely in a Chromium-based browser using Three.js and React Three Fiber. The camera and gizmo controls deliberately follow Unity Editor conventions, so the handling is familiar, but no desktop DCC install is required."
+            }
+          },
+          {
+            "@type": "Question",
+            "name": "How does motion generation work?",
+            "acceptedAnswer": {
+              "@type": "Answer",
+              "text": "You sequence multi-phase motion as Prompt Blocks on the timeline and send them to NVIDIA ARDY through a local bridge, then play the result back with sparse IK correction. ARDY is a separate third-party project maintained by NVIDIA; it is not bundled with CozyClay. Staging, root paths, cameras and playback all work without it, and the build ships a pre-generated clip so the timeline has real motion on it from the first run."
+            }
+          },
+          {
+            "@type": "Question",
+            "name": "Is CozyClay free and open source?",
+            "acceptedAnswer": {
+              "@type": "Answer",
+              "text": "Yes. CozyClay is free and open source on GitHub, and it can be run locally with a single command: npx cozyclay."
+            }
+          },
+          {
+            "@type": "Question",
+            "name": "Can I run CozyClay offline?",
+            "acceptedAnswer": {
+              "@type": "Answer",
+              "text": "Yes. CozyClay runs entirely on your own machine with npx cozyclay or from a clone. Nothing is uploaded, and the studio keeps working without a network connection once it is running."
+            }
+          }
+        ]
+      }
+    </script>
+
+    <style>
+      :root {
+        --bg: #1b1b1b;
+        --panel: #232323;
+        --line: #343434;
+        --ink: #ece7de;
+        --muted: #a9a29a;
+        --clay: #f2eee6;
+        --accent: #d9a066;
+      }
+      * { box-sizing: border-box; }
+      html { scroll-behavior: smooth; }
+      body {
+        margin: 0;
+        background: var(--bg);
+        color: var(--ink);
+        font: 16px/1.65 ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+        -webkit-font-smoothing: antialiased;
+      }
+      a { color: var(--accent); }
+      .wrap { max-width: 980px; margin: 0 auto; padding: 0 20px; }
+      header.site {
+        border-bottom: 1px solid var(--line);
+        position: sticky; top: 0; background: rgba(27,27,27,.9);
+        backdrop-filter: blur(8px); z-index: 10;
+      }
+      header.site .wrap {
+        display: flex; align-items: center; gap: 16px;
+        min-height: 60px; flex-wrap: wrap;
+      }
+      .brand { font-weight: 700; letter-spacing: -.01em; color: var(--clay); text-decoration: none; font-size: 18px; }
+      header.site nav { margin-left: auto; display: flex; gap: 18px; flex-wrap: wrap; }
+      header.site nav a { color: var(--muted); text-decoration: none; font-size: 14px; }
+      header.site nav a:hover { color: var(--ink); }
+
+      .hero { padding: 64px 0 40px; }
+      h1 { font-size: clamp(30px, 5.2vw, 46px); line-height: 1.12; margin: 0 0 18px; letter-spacing: -.02em; color: var(--clay); }
+      .lede { font-size: clamp(17px, 2.2vw, 20px); color: var(--muted); margin: 0 0 28px; max-width: 44em; }
+      .cta { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
+      .btn {
+        display: inline-block; padding: 12px 20px; border-radius: 8px;
+        text-decoration: none; font-weight: 600; font-size: 15px; border: 1px solid var(--line);
+      }
+      .btn.primary { background: var(--clay); color: #1b1b1b; border-color: var(--clay); }
+      .btn.ghost { color: var(--ink); }
+      .note { color: var(--muted); font-size: 14px; margin: 0; }
+
+      figure { margin: 40px 0; }
+      figure img { width: 100%; height: auto; display: block; border: 1px solid var(--line); border-radius: 10px; }
+      figcaption { color: var(--muted); font-size: 13px; margin-top: 10px; }
+
+      /* The mark is blue on white and the eyes are knocked out of the fill, so
+         it sits on a light plate rather than straight on the dark page. */
+      .mark { margin: 0 0 26px; max-width: 190px; }
+      .mark img {
+        border: 0;
+        border-radius: 14px;
+        background: var(--clay);
+        padding: 14px 12px;
+      }
+
+      .reel {
+        margin: 0 0 30px;
+        border: 1px solid var(--line);
+        border-radius: 12px;
+        overflow: hidden;
+        background: #000;
+        box-shadow: 0 24px 60px rgba(0, 0, 0, .45);
+      }
+      .reel video { display: block; width: 100%; height: auto; }
+      .reel-note { color: var(--muted); font-size: 13px; margin: 12px 0 0; }
+
+      section { padding: 40px 0; border-top: 1px solid var(--line); }
+      h2 { font-size: clamp(22px, 3.2vw, 28px); margin: 0 0 8px; color: var(--clay); letter-spacing: -.01em; }
+      h3 { font-size: 17px; margin: 0 0 6px; color: var(--clay); }
+      .sub { color: var(--muted); margin: 0 0 26px; max-width: 48em; }
+
+      .grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px; }
+      .card { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 20px; }
+      .card p { margin: 0; color: var(--muted); font-size: 15px; }
+
+      pre {
+        background: var(--panel); border: 1px solid var(--line); border-radius: 10px;
+        padding: 16px 18px; overflow-x: auto; font-size: 14px; line-height: 1.7;
+      }
+      code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
+
+      table { width: 100%; border-collapse: collapse; font-size: 15px; }
+      th, td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--line); }
+      th { color: var(--clay); font-weight: 600; white-space: nowrap; }
+      td { color: var(--muted); }
+      .scroller { overflow-x: auto; }
+
+      details { border-bottom: 1px solid var(--line); padding: 16px 0; }
+      details summary { cursor: pointer; font-weight: 600; color: var(--clay); font-size: 16px; }
+      details p { color: var(--muted); margin: 12px 0 0; }
+
+      footer.site { border-top: 1px solid var(--line); padding: 32px 0 56px; color: var(--muted); font-size: 14px; }
+      footer.site a { color: var(--muted); }
+
+      @media (max-width: 620px) {
+        .hero { padding: 40px 0 28px; }
+        .btn { width: 100%; text-align: center; }
+        header.site nav { gap: 14px; width: 100%; margin-left: 0; padding-bottom: 10px; }
+      }
+    </style>
   </head>
   <body>
-    <div id="root"></div>
+    <header class="site">
+      <div class="wrap">
+        <a class="brand" href="/">CozyClay</a>
+        <nav>
+          <a href="#what">What it does</a>
+          <a href="#start">Quick start</a>
+          <a href="#controls">Controls</a>
+          <a href="#faq">FAQ</a>
+          <a href="https://github.com/HaD0Yun/CozyClay">GitHub</a>
+        </nav>
+      </div>
+    </header>
+
+    <main class="wrap">
+      <div class="hero">
+        <figure class="mark">
+          <img src="/media/cozyclay-logo.png" width="880" height="714" alt="CozyClay" />
+        </figure>
+
+        <h1>Block the shot before you pay to render it</h1>
+        <p class="lede">
+          CozyClay is a browser-based 3D staging studio. Block a scene, pose characters,
+          author camera moves and cuts, then hand the exact same shots to a video model.
+          No Blender, no Unity, no install.
+        </p>
+
+        <div class="reel">
+          <video
+            src="/media/cozyclay-demo.mp4"
+            poster="/media/cozyclay-demo-poster.jpg"
+            width="1920" height="1080"
+            autoplay muted loop playsinline controls preload="metadata"
+          ></video>
+        </div>
+        <p class="reel-note">
+          Thirty seconds: greybox previz on the left of the wipe, the generated result on the
+          right. Every cut came out of the same camera setup you see being built.
+        </p>
+
+        <div class="cta">
+          <a class="btn primary" href="https://github.com/HaD0Yun/CozyClay">View on GitHub</a>
+          <a class="btn ghost" href="#start">Run it locally</a>
+        </div>
+        <p class="note">
+          Free and open source. Built with Three.js and React Three Fiber.
+          <a href="https://github.com/HaD0Yun/CozyClay/issues">Report anything broken</a>.
+        </p>
+      </div>
+
+      <section id="what">
+        <h2>What you can do</h2>
+        <p class="sub">
+          Previz is the part of animation where you decide what happens before anyone commits
+          to final assets. CozyClay keeps that whole loop in one page.
+        </p>
+        <div class="grid">
+          <div class="card">
+            <h3>Stage a scene</h3>
+            <p>
+              Create primitives and set pieces, then move, rotate, and scale them with a
+              W/E/R gizmo. Grid snapping is a preference, not a law — hold Ctrl during a drag
+              to invert it. A bird's-eye plan view drives 2D root waypoints for character paths.
+            </p>
+          </div>
+          <div class="card">
+            <h3>Edit like Unity</h3>
+            <p>
+              Right-drag flies the camera, WASD walks, Q/E cranes, middle-drag pans,
+              Alt+drag orbits the selection, F frames it. The rule set follows Unity's manual
+              on purpose, so muscle memory carries over.
+            </p>
+          </div>
+          <div class="card">
+            <h3>Undo anything</h3>
+            <p>
+              Every scene mutation goes through a single history store: one interaction —
+              a drag, a scrub, an inspector edit — is exactly one undo entry. Esc cancels
+              an in-flight drag and restores the pre-drag transform.
+            </p>
+          </div>
+          <div class="card">
+            <h3>Generate motion</h3>
+            <p>
+              Pose characters, sequence multi-phase motion as Prompt Blocks on a resizable
+              timeline, send them to NVIDIA ARDY, then play the result back with sparse IK
+              correction where the generated motion needs fixing.
+            </p>
+          </div>
+        </div>
+      </section>
+
+      <section id="start">
+        <h2>Quick start</h2>
+        <p class="sub">
+          CozyClay runs on your machine. One command is enough — there is nothing to compile
+          and no dependency tree to install.
+        </p>
+        <pre><code>npx cozyclay</code></pre>
+        <p class="sub">Or clone and run the source:</p>
+        <pre><code>git clone https://github.com/HaD0Yun/CozyClay.git
+cd CozyClay
+npm install
+npm run dev</code></pre>
+        <p class="note">
+          Requires Node.js 22 or newer and a Chromium-based browser.
+          <code>npm run dev</code> starts the studio together with its local ARDY bridge;
+          <code>npm run dev:ui</code> starts the browser UI alone, without motion generation.
+        </p>
+      </section>
+
+      <section id="controls">
+        <h2>Controls</h2>
+        <p class="sub">Unity Editor conventions, with the divergences documented in the repo.</p>
+        <div class="scroller">
+          <table>
+            <thead><tr><th>Input</th><th>Action</th></tr></thead>
+            <tbody>
+              <tr><td>Right-drag</td><td>Look around (fly)</td></tr>
+              <tr><td>RMB + WASD</td><td>Walk while flying</td></tr>
+              <tr><td>RMB + Q/E</td><td>Crane down / up</td></tr>
+              <tr><td>Middle-drag</td><td>Pan</td></tr>
+              <tr><td>Alt + drag</td><td>Orbit the selection</td></tr>
+              <tr><td>Scroll</td><td>Dolly</td></tr>
+              <tr><td>Click</td><td>Select; empty space clears</td></tr>
+              <tr><td>W / E / R</td><td>Move / rotate / scale tool</td></tr>
+              <tr><td>Ctrl (during drag)</td><td>Invert grid snapping</td></tr>
+              <tr><td>Ctrl/Cmd+Z, Ctrl/Cmd+Shift+Z</td><td>Undo / redo</td></tr>
+              <tr><td>Esc</td><td>Cancel the in-flight drag</td></tr>
+              <tr><td>End</td><td>Drop the selection to the surface</td></tr>
+              <tr><td>Ctrl/Cmd+D</td><td>Duplicate the selection</td></tr>
+              <tr><td>F</td><td>Frame the selection</td></tr>
+            </tbody>
+          </table>
+        </div>
+      </section>
+
+      <section id="faq">
+        <h2>FAQ</h2>
+        <details open>
+          <summary>What is CozyClay?</summary>
+          <p>
+            CozyClay is an open-source 3D staging and previsualization studio that runs in a
+            browser. You block a scene with primitives and set pieces, pose characters, draw
+            root paths, author camera moves and cuts on a timeline, and preview generated motion.
+          </p>
+        </details>
+        <details>
+          <summary>Do I need Blender or Unity?</summary>
+          <p>
+            No. CozyClay runs entirely in a Chromium-based browser using Three.js and React
+            Three Fiber. The camera and gizmo controls deliberately follow Unity Editor
+            conventions, so the handling is familiar, but no desktop DCC install is required.
+          </p>
+        </details>
+        <details>
+          <summary>How does motion generation work?</summary>
+          <p>
+            You sequence multi-phase motion as Prompt Blocks on the timeline and send them to
+            <a href="https://github.com/nv-tlabs/ardy">NVIDIA ARDY</a> through a local bridge,
+            then play the result back with sparse IK correction. ARDY is a separate third-party
+            project owned and maintained by NVIDIA; it is not bundled here, and CozyClay is not
+            affiliated with or endorsed by NVIDIA. Staging, root paths, cameras and playback all
+            work without it, and the build ships a pre-generated clip so the timeline has real
+            motion on it from the first run.
+          </p>
+        </details>
+        <details>
+          <summary>Is it free and open source?</summary>
+          <p>
+            Yes. The source lives on
+            <a href="https://github.com/HaD0Yun/CozyClay">GitHub</a> and the studio can be run
+            locally with <code>npx cozyclay</code>.
+          </p>
+        </details>
+        <details>
+          <summary>Can I run it offline?</summary>
+          <p>
+            Yes. CozyClay runs entirely on your own machine with <code>npx cozyclay</code> or from
+            a clone. Nothing is uploaded, and the studio keeps working without a network
+            connection once it is running.
+          </p>
+        </details>
+      </section>
+    </main>
+
+    <footer class="site">
+      <div class="wrap">
+        <p>
+          <a href="https://github.com/HaD0Yun/CozyClay">GitHub</a> ·
+          <a href="https://www.npmjs.com/package/cozyclay">npm</a>
+        </p>
+        <p>
+          CozyClay is not affiliated with or endorsed by NVIDIA or Unity Technologies.
+        </p>
+      </div>
+    </footer>
   </body>
 </html>