:root{--paper:#fffcf8;--bg:#f5f2ed;--ink:#302b35;--muted:#948b95;--border:#e9e2dc;--purple:#756080;--soft:#eee6f0;--accent:#e4ac80;--radius:14px}*{box-sizing:border-box}body{margin:0;font:13px/1.5 system-ui,-apple-system,'Segoe UI','Malgun Gothic',sans-serif;background:var(--bg);color:var(--ink)}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer;background:var(--paper);border:1px solid var(--border);border-radius:9px;padding:9px 12px;transition:background .15s,border .15s}button:hover{background:#f1eaf1;border-color:#c8b6cf}button:disabled{opacity:.45;cursor:default}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #cab3da;outline-offset:2px}a{color:inherit}.primary{background:var(--purple);color:white;border-color:var(--purple);font-weight:650}.primary:hover{background:#61496e}.quiet{background:transparent;border-color:transparent}.soft{background:var(--soft);border-color:transparent;color:#71517e}.small{padding:6px 9px;font-size:11px}.danger{color:#ae625d}.hidden{display:none!important}.muted{color:var(--muted);font-size:11px}.micro{font-size:10px}.full{width:100%}header{height:74px;display:flex;align-items:center;padding:0 26px;gap:26px;border-bottom:1px solid var(--border);background:var(--paper);position:sticky;top:0;z-index:20}.brand{display:flex;gap:11px;align-items:center;font-size:17px;font-weight:750;text-decoration:none;white-space:nowrap}.brand-icon{background:var(--purple);color:white;width:37px;height:40px;display:grid;place-items:center;border-radius:12px;font:24px serif;box-shadow:0 5px 10px #75608022}.brand small{display:block;font-size:8px;letter-spacing:2px;color:var(--muted);margin-top:1px}.tabs{display:flex;background:#f3eeea;border-radius:10px;padding:4px;margin-left:15px}.tabs button{border:none;background:none;font-size:12px;padding:9px 18px;color:#9a8d9a}.tabs button.active{color:var(--purple);background:white;box-shadow:0 2px 6px #3923400b;font-weight:700}.top-actions{margin-left:auto;display:flex;align-items:center;gap:6px;font-size:11px}#saveState{color:#8a9b86;font-size:10px;margin-right:12px}.workspace{display:grid;grid-template-columns:224px 1fr;min-height:calc(100vh - 74px)}.rail{border-right:1px solid var(--border);padding:25px 15px;background:#faf7f3;display:flex;flex-direction:column;min-width:0}.project-label{color:#aea4ab;font-size:9px;font-weight:600;letter-spacing:1.6px;padding:0 10px}.project-title{padding:7px 10px 23px;background:transparent;border:0;text-align:left;font-weight:700;line-height:1.6;font-size:14px;overflow-wrap:anywhere}.rail-head{display:flex;align-items:center;justify-content:space-between;padding:9px;color:#7d7182;font-size:11px}.rail-head span{color:#b3aab4;font-size:10px}.rail-list{display:flex;flex-direction:column;gap:6px}.rail-item{display:flex;gap:10px;align-items:center;text-align:left;background:none;border:1px solid transparent;padding:10px;border-radius:10px;min-width:0}.rail-item.active{background:#eee5f0;color:#6e527a;border-color:#e8dcec}.rail-item strong{font-size:11px;display:block;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:142px}.rail-item small{font-size:9px;color:#a299a4;display:block;margin-top:3px}.rail-icon{width:32px;height:34px;background:#e2d9d3;display:grid;place-items:center;border-radius:6px;font-size:11px;color:#796c7d;flex:none}.dashed{background:none;border:1px dashed #d4c6d6;color:#866d8e;padding:10px;margin-top:12px;text-align:left;font-size:11px}.rail-bottom{margin-top:auto;padding:45px 10px 0;color:#a397a2;font-size:10px}.rail-bottom p{line-height:1.9}.tiny-pill{font-size:9px;letter-spacing:1px;background:#ede6e0;padding:5px 7px;border-radius:5px;color:#8d7d8a}.rail-bottom button{padding-left:0;font-size:10px}main{padding:27px 28px 38px;min-width:0;max-width:1800px;width:100%;margin:auto}.page-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:21px;gap:12px}.eyebrow{font-size:9px;letter-spacing:1.8px;color:#a597a5;font-weight:650}h1{font-size:24px;letter-spacing:-1px;margin:5px 0 0;font-weight:650}h2{font-size:12px;margin:0;font-weight:700}.layout{display:grid;grid-template-columns:minmax(360px,1fr) 302px;gap:21px;align-items:start}.center{min-width:0}.stage-card{background:var(--paper);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:0 14px 35px #51405608}.stage-toolbar{display:flex;align-items:center;gap:12px;height:45px;padding:0 17px;font-size:11px;border-bottom:1px solid var(--border)}.stage-toolbar strong{margin-right:auto;font-weight:650}.badge{font-size:9px;border:1px solid var(--border);border-radius:5px;padding:3px 6px;color:#a08ba4;white-space:nowrap}.stage-surround{padding:17px;background:#eeebe6}.stage{aspect-ratio:16/9;position:relative;border-radius:9px;overflow:hidden;isolation:isolate;background:#cbdadd}.stage-grid,.rig-grid{position:absolute;inset:0;background-image:linear-gradient(#fff2 1px,transparent 1px),linear-gradient(90deg,#fff2 1px,transparent 1px);background-size:36px 36px;pointer-events:none}.stage-grid{mask-image:linear-gradient(transparent,black)}.stage-floor{position:absolute;left:-15%;right:-15%;height:44%;bottom:-20%;border-radius:50%;background:#ffffff26;border:1px solid #fff5;pointer-events:none}.stage-caption{position:absolute;top:6%;left:5%;font-size:clamp(8px,1vw,13px);color:#4e565b80;letter-spacing:1px;pointer-events:none}#backdrops,#actorLayer{position:absolute;inset:0;pointer-events:none}.bg-layer{position:absolute;inset:0;background-size:cover;background-position:center}.actor{position:absolute;width:30%;height:74%;transform-origin:50% 100%;will-change:transform,left,top,filter,opacity;pointer-events:auto;touch-action:none;cursor:grab}.actor.selected:after{content:'';position:absolute;inset:8% 12% 0;border:1px dashed #7b58846b;border-radius:6px;pointer-events:none}.actor .actor-tag{position:absolute;bottom:-15px;left:50%;transform:translateX(-50%);background:#fff9;padding:1px 6px;border-radius:4px;font-size:8px;color:#78607e;white-space:nowrap}.actor-mount{position:absolute;inset:0;pointer-events:none}.actor-mount>div,.actor-mount canvas{width:100%!important;height:100%!important}.actor-fallback{width:100%;height:100%;position:absolute;inset:0;pointer-events:none}.dialogue{position:absolute;bottom:4%;left:4%;right:4%;min-height:22%;background:#27222eea;color:white;border:1px solid #ffffff55;border-radius:9px;padding:12px 16px;box-shadow:0 6px 14px #30223022;pointer-events:none}.dialogue>div{font-size:clamp(10px,.9vw,13px);font-weight:700;color:#e9c599}.dialogue p{font-size:clamp(10px,1vw,14px);line-height:1.7;margin:5px 0 14px;white-space:pre-wrap}.dialogue>span{position:absolute;bottom:7px;right:12px;font-size:8px;color:#b9adbccc}.stage-bottom{padding:12px 15px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:9px;color:#a398a6}.stage-bottom button{font-size:10px;padding:4px}.section-title{display:flex;justify-content:space-between;align-items:center;margin:20px 0 9px;font-size:11px}.section-title>span{font-size:8px;letter-spacing:1.2px;color:#b3a6b2}#sceneStrip{display:flex;gap:8px;overflow-x:auto;padding:2px 0 6px}.scene-tile{min-width:125px;max-width:160px;text-align:left;padding:10px;border-radius:9px;background:#fffcf8;color:#807382;font-size:10px}.scene-tile.active{border-color:#ad94b8;background:#f1eaf3}.scene-tile span{color:#b5a8b5;font-size:9px;display:block;margin-bottom:6px}.scene-tile b{display:block;max-width:140px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.note-banner{display:flex;align-items:center;gap:12px;border:1px solid #e8e0d8;border-radius:10px;padding:15px;margin-top:20px;background:#f8f4ee}.note-banner>span{font-size:20px;color:#bca7c0}.note-banner b{font-size:11px;font-weight:600}.note-banner p{font-size:10px;color:#a093a0;margin:3px 0 0}.note-banner button{margin-left:auto;font-size:10px;white-space:nowrap}.inspector{display:flex;flex-direction:column;gap:14px}.panel{border:1px solid var(--border);border-radius:12px;background:var(--paper);padding:16px}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:13px}.panel label{display:flex;flex-direction:column;font-size:10px;color:#9b8d9c;gap:5px;margin-bottom:11px}.panel input:not([type=range]):not([type=checkbox]):not([type=color]),.panel select,.panel textarea,.motion-top select,.modal-input{width:100%;border:1px solid var(--border);border-radius:7px;background:white;padding:8px 9px;font-size:11px;color:#4f4557;min-width:0}.panel textarea{resize:vertical;line-height:1.7}.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}.button-row{display:flex;align-items:center;gap:5px;flex-wrap:wrap}.button-row>button{font-size:10px}.panel input[type=color]{width:100%;height:33px;background:white;border:1px solid var(--border);border-radius:6px;padding:4px}.panel label.check,.check{display:flex;flex-direction:row;align-items:center;gap:6px;font-size:10px;color:#94859b;margin:0}.check input{accent-color:var(--purple)}.loop{margin-top:15px!important}.slider-row{margin:10px 0}.slider-row .slider-title{display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#95889a}.slider-row input[type=number]{width:60px!important;text-align:right;padding:3px 5px!important;background:#f6f1f6!important;border:none!important;border-radius:5px!important;color:#7a6086!important;font-size:10px!important}.slider-row input[type=range]{width:100%;accent-color:var(--purple);height:3px;margin:10px 0 5px;cursor:pointer}.chips{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:12px}.chips button{font-size:10px;padding:5px 8px}.chips .active{background:var(--soft);border-color:#d6c4dc;color:#7f5b8c}details{border-top:1px solid var(--border);padding-top:11px;margin-top:12px}summary{font-size:10px;color:#87748e;cursor:pointer;margin-bottom:9px}.motion-top{display:flex;align-items:center;gap:8px;margin-bottom:12px;font-size:11px}.motion-top label{display:flex;align-items:center;gap:8px;flex:1}.motion-top select{width:auto;min-width:110px}.motion-top button{font-size:10px;padding:5px}.rig-stage{height:380px;background:#ebe5ec;position:relative;overflow:hidden}.rig-grid{background-image:linear-gradient(#fff7 1px,transparent 1px),linear-gradient(90deg,#fff7 1px,transparent 1px);background-size:30px 30px}.rig-stage svg{height:100%;width:100%;position:relative}.rig-tip{position:absolute;bottom:12px;left:0;right:0;text-align:center;font-size:9px;color:#9f8ea5;pointer-events:none}.rig-bone{cursor:pointer}.rig-bone:hover{filter:brightness(1.08)}.rig-joint{fill:white;stroke:#826394;stroke-width:2}.motion-transport{display:flex;align-items:center;padding:13px 15px;gap:13px}.motion-transport button{font-size:10px}.motion-transport input{flex:1;min-width:40px;accent-color:var(--purple)}#timeReadout{font-size:10px;color:#9f8aa7;font-variant-numeric:tabular-nums}.key-panel{margin-top:14px}#keyTimeline{display:flex;gap:8px;overflow:auto;padding:4px 0 8px}#keyTimeline button{font-size:10px;flex:none}#keyTimeline button.active{background:var(--soft);border-color:#b99dc4;color:#755484}#draftNotice{margin:5px 0 0;font-size:10px}.part-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.part-buttons button{font-size:10px;padding:7px 3px;background:#faf6fa}.part-buttons button.active{border-color:#bfa7c9;color:#735381;background:#eee3f2}.upload-zone{border:1px dashed #c6b3cf;text-align:center;padding:12px 8px;border-radius:7px;cursor:pointer;background:#f9f4fa;color:#876b94!important}.upload-zone input{display:none}.inline-label{flex-direction:row!important;align-items:center;gap:8px!important;margin:0!important}.inline-label input[type=color]{width:36px;height:27px}.boot{text-align:center;padding:100px 20px;color:#9c8da2}dialog{border:1px solid var(--border);border-radius:16px;padding:24px;width:480px;max-width:92vw;color:var(--ink);background:var(--paper);box-shadow:0 25px 100px #32253933}dialog::backdrop{background:#24182e60;backdrop-filter:blur(3px)}dialog h2{font-size:17px}dialog p{font-size:12px;line-height:1.9;color:#8e7d95}dialog ol{padding-left:20px;font-size:12px;line-height:2;color:#8b7b91}.modal-actions{display:flex;justify-content:flex-end;gap:7px;margin-top:20px}.modal-input{font-size:13px;padding:12px}#toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,10px);opacity:0;background:#302638;color:white;max-width:90vw;padding:12px 18px;border-radius:10px;font-size:12px;z-index:100;pointer-events:none;transition:.2s}#toast.show{opacity:1;transform:translate(-50%,0)}#externalPreview{position:absolute;inset:0}body.playing{overflow:hidden}body.playing .stage-card{position:fixed;inset:0;z-index:40;background:#201c25;border:0;border-radius:0;display:grid;place-items:center}body.playing .stage-surround{width:min(100vw,177.777vh);padding:0;background:none}body.playing .stage{border-radius:0;max-height:100vh;cursor:pointer}body.playing .stage-toolbar,body.playing .stage-bottom{display:none}body.playing .actor{pointer-events:none}body.playing .actor:after,body.playing .actor-tag{display:none}body.playing .dialogue p{font-size:clamp(12px,1.7vw,24px)}body.playing .dialogue>div{font-size:clamp(11px,1.4vw,20px)}body.playing .dialogue>span{font-size:clamp(9px,1vw,14px)}body.playing .dialogue{padding:2% 3%}.show-bar{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;gap:15px;padding:12px 22px;background:linear-gradient(#211929bb,transparent);color:white;font-size:12px}.show-bar>strong{margin-right:auto}.show-bar button{color:white}.end-card{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#2a1c35de;color:#f4eef8;z-index:15;gap:15px;backdrop-filter:blur(9px)}.end-card h2{font-size:clamp(16px,2vw,30px);font-weight:500}.end-card small{color:#bfa2d2;letter-spacing:5px}.end-card button{color:white}.spine-player{border:0!important;background:transparent!important}.spine-player canvas{display:block}.spine-player-error{font-size:9px!important;background:#f8efef!important;color:#a35b5b!important}
@media(min-width:1550px){.layout{grid-template-columns:minmax(500px,1fr) 330px}.rig-stage{height:460px}}
@media(max-width:1150px){header{padding:0 18px;gap:15px}.tabs{margin-left:0}.tabs button{padding:8px 11px}#saveState{display:none}.workspace{grid-template-columns:185px 1fr}.rail{padding:22px 9px}.rail-item strong{max-width:115px}.layout{grid-template-columns:minmax(300px,1fr) 270px;gap:13px}main{padding:20px 17px}.stage-surround{padding:10px}.note-banner{padding:11px}.note-banner button{display:none}.stage-bottom{flex-direction:column;align-items:flex-start;gap:3px}.top-actions .quiet{padding:7px}h1{font-size:21px}.rig-stage{height:330px}}
@media(max-width:900px){header{height:auto;min-height:70px;flex-wrap:wrap;padding:12px 15px;gap:10px}.brand{font-size:15px}.brand small{font-size:7px}.top-actions{gap:0}.top-actions .quiet{font-size:10px}.tabs{order:3;width:100%;justify-content:center}.tabs button{flex:1}.workspace{grid-template-columns:160px 1fr}.layout{grid-template-columns:1fr}.inspector{display:grid;grid-template-columns:1fr 1fr;align-items:start}.rail-item{padding:8px 4px;gap:6px}.rail-item strong{max-width:90px;font-size:10px}.rail-icon{width:26px}.page-head{gap:7px}h1{font-size:19px}.page-head button{font-size:10px;padding:6px}.rig-stage{height:360px}.stage-bottom{flex-direction:row}.motion-top{flex-wrap:wrap}.show-bar>span{display:none}}
@media(max-width:600px){.brand-icon{width:30px;height:33px;font-size:19px}.brand{gap:7px;font-size:13px}.top-actions .quiet{font-size:9px;padding:5px}.top-actions .primary{font-size:10px;padding:7px 9px}.workspace{display:block}.rail{border:0;border-bottom:1px solid var(--border);padding:12px;display:block}.project-label,.project-title,.rail-head,.rail-bottom{display:none}.rail-list{flex-direction:row;overflow:auto;padding-bottom:5px}.rail-item{flex:none;padding:6px 8px}.rail-item small{display:none}.rail-item strong{max-width:110px}.rail-icon{width:22px;height:24px;font-size:9px}.dashed{margin-top:4px;padding:5px 8px;font-size:10px}main{padding:17px 12px}.page-head{margin-bottom:13px}.eyebrow{font-size:8px;letter-spacing:1px}h1{font-size:17px}.stage-toolbar{padding:0 12px;height:38px;font-size:10px}.stage-surround{padding:7px}.stage-bottom>span{display:none}.stage-bottom{padding:9px 12px;justify-content:flex-end}.dialogue{padding:7px 9px;bottom:3%;min-height:25%}.dialogue p{margin:2px 0 10px;font-size:10px}.dialogue>span{font-size:7px;bottom:3px}.inspector{grid-template-columns:1fr}.rig-stage{height:350px}.scene-tile{min-width:115px}.note-banner{margin-top:12px}.show-bar{padding:8px;font-size:10px;gap:7px}.show-bar button{font-size:10px;padding:6px}.actor-tag{display:none}.motion-transport{gap:8px;padding:12px}#timeReadout{font-size:9px}.show-bar>strong{font-size:10px}.part-buttons button{padding:10px}}
@media(prefers-reduced-motion:reduce){button,#toast{transition:none}}

/* World-sized rendering and editing handles. Only the stage boundary clips. */
#worldBackground{position:absolute;inset:0;transform-origin:0 0;pointer-events:none;will-change:transform}
.actor{inset:0!important;left:0!important;top:0!important;width:100%!important;height:100%!important;transform:none!important;pointer-events:none!important;cursor:default;overflow:visible;will-change:filter,opacity}
.actor.selected:after,.actor-tag{display:none!important}.actor-fallback{overflow:visible}.actor-fallback g{pointer-events:none}.actor-mount,.actor-mount canvas{position:absolute;inset:0;width:100%!important;height:100%!important;pointer-events:none}
#stageHandles{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;touch-action:none}
#stageHandles .hit-actor{pointer-events:all;cursor:move;fill:transparent;stroke:transparent;stroke-width:1;vector-effect:non-scaling-stroke}
#stageHandles .hit-actor.selected{stroke:#80598b99;stroke-dasharray:5 4}
#stageHandles .route{fill:none;stroke:#865c9c;stroke-width:2;stroke-dasharray:6 5;vector-effect:non-scaling-stroke}
#stageHandles .waypoint{fill:#fffcf8;stroke:#7a578e;stroke-width:2;cursor:move;pointer-events:all;vector-effect:non-scaling-stroke}
#stageHandles .pivot-handle{fill:#f8d8a6;stroke:#765189;stroke-width:2;pointer-events:all;cursor:crosshair;vector-effect:non-scaling-stroke}
#stageHandles text{font-size:12px;fill:#70547f;paint-order:stroke;stroke:#fff;stroke-width:3;pointer-events:none}
body.playing #stageHandles{display:none}.stage.picking{cursor:crosshair}.stage.picking #stageHandles .hit-actor{pointer-events:none}
.path-row{display:grid;grid-template-columns:17px minmax(0,1fr) minmax(0,1fr) auto;gap:4px;align-items:center;margin:7px 0;font-size:10px}.path-row input{padding:5px!important;font-size:10px!important;min-width:0}.path-row label{margin:0;font-size:9px;gap:2px}.path-row .point-actions{display:flex}.path-row button{padding:4px 5px;font-size:10px}.path-row .point-number{color:#9675a2}
.rail-item{position:relative}.rail-item .drag-grip{color:#b1a2b7;cursor:grab;font-size:16px;touch-action:none}.rail-item.dragging{opacity:.5}.rail-item.drop-before{box-shadow:0 -3px 0 #9570a6}.rail-item.drop-after{box-shadow:0 3px 0 #9570a6}.rail-head{flex-wrap:wrap}.rail-sort-help{font-size:8px;color:#afa0b4;margin:0 9px 10px}.dialogue p{min-height:1.7em}#showStatus{min-width:180px}
@media(max-width:600px){.rail-sort-help{margin:3px 0;font-size:9px}.path-row{grid-template-columns:17px 1fr 1fr auto}.path-row button{padding:7px}#stageHandles .waypoint,#stageHandles .pivot-handle{r:11px}}

.path-row{grid-template-columns:17px minmax(0,1fr) minmax(0,1fr) auto auto auto}
/* The rail stays available while the long inspector scrolls. */
@media(min-width:701px){.rail{position:sticky;top:74px;align-self:start;max-height:calc(100dvh - 74px);overflow-y:auto}.rail-list{flex-shrink:0}.rail-bottom{margin-top:24px}}
@media(max-width:700px){.rail{position:sticky;top:110px;z-index:19;max-height:180px;overflow:auto}.rail .project-label,.rail .project-title,.rail .rail-bottom{display:none}.rail-head{margin:0}.rail-list{flex-direction:row}.rail-list .rail-item{flex-shrink:0}.rail #railAdd{padding:4px;margin-top:4px}}
.waypoint-card{border:1px solid var(--border);border-radius:9px;padding:8px;margin:8px 0;background:#fcf9fd}.waypoint-card summary{font-size:11px}.waypoint-fields{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:10px}.waypoint-fields label{font-size:10px;margin:0}.waypoint-fields input,.waypoint-fields select{min-width:0;width:100%;padding:6px;font-size:11px}.waypoint-card .button-row{margin-top:6px;flex-wrap:wrap}#restorePreview{font-size:10px}

.rail{top:var(--header-height,74px)}@media(min-width:701px){.rail{max-height:calc(100dvh - var(--header-height,74px))}}.waypoint-preview #stageHandles{display:none}
/* Keep the stage visible alongside long scene properties; preserve a 16:9 canvas. */
body:not(.playing) #theaterView .center{position:sticky;top:calc(var(--header-height,74px) + 12px);align-self:start;z-index:5}
body:not(.playing) #theaterView .stage{width:min(100%,max(160px,calc((100dvh - var(--header-height,74px) - 210px)*16/9)));margin-inline:auto}
body:not(.playing) #theaterView .note-banner{margin-top:10px;padding:8px 12px}
@media(min-width:901px){.rail{height:calc(100dvh - var(--header-height,74px));max-height:none;overflow:hidden}.rail-list{min-height:0;overflow-y:auto;flex:1 1 auto;overscroll-behavior:contain}.rail-bottom{flex-shrink:0;margin-top:12px}.rail #railAdd{flex-shrink:0}}
@media(max-width:900px){body:not(.playing) #theaterView .center{top:var(--header-height,74px)}body:not(.playing) #theaterView .stage{width:min(100%,calc(40dvh*16/9))}body:not(.playing) #theaterView .note-banner{display:none}body:not(.playing) #theaterView .stage-bottom{padding:5px 8px;flex-direction:row;flex-wrap:wrap}body:not(.playing) #theaterView .stage-toolbar{padding:6px 10px}}
@media(max-width:700px){.rail{position:relative;top:auto;max-height:none}.rail-list{max-height:100px;overflow:auto}}
.dialogue.text-hidden #dialogueName,.dialogue.text-hidden #dialogueText,.dialogue.text-hidden #clickHint{visibility:hidden}.dialogue-options{flex-wrap:wrap}.dialogue-options .check{font-size:11px}
.transition-panel{margin-top:10px;padding:12px}.transition-panel h2{font-size:12px}.transition-labels{font-size:11px;color:var(--purple);margin-bottom:8px}.transition-panel input[type=range]{width:100%;accent-color:var(--purple);cursor:ew-resize}#transitionMarkers{position:relative;height:20px;margin:0 7px}.transition-marker{position:absolute;transform:translateX(-50%);border:0;background:none;color:#a778b6;padding:0;font-size:12px}.transition-panel p{margin:0}.bone-link{stroke:#b052cf;stroke-width:2.5;stroke-dasharray:5 3;pointer-events:none;vector-effect:non-scaling-stroke}.bone-name{font-size:10px;fill:#603279;paint-order:stroke;stroke:#fff;stroke-width:2;pointer-events:none}.hierarchy-row{display:block;padding:4px 8px;margin-top:3px;border-left:2px solid #c1a4cd;border-radius:0;font-size:11px}.hierarchy-row.active{background:#eee0f3}#rigHierarchy{margin:12px 0;max-height:200px;overflow:auto}.rig-stage svg{overflow:visible}body:not(.playing) #theaterView .stage{width:min(100%,max(120px,calc((100dvh - var(--header-height,74px) - 340px)*16/9)))}body:not(.playing) #theaterView .note-banner{display:none}@media(max-width:900px){body:not(.playing) #theaterView .stage{width:min(100%,calc(30dvh*16/9))}.top-actions #undoEdit,.top-actions #redoEdit{font-size:10px;padding:5px}}
.mesh-overlay circle{cursor:move;pointer-events:all}#rigSvg{touch-action:none}#meshFields details{margin-top:14px}#meshFields .button-row{flex-wrap:wrap}#meshFields>p{line-height:1.6}
/* Local editor navigation; production playback always uses the unmodified stage. */
.preview-navigation{display:flex;align-items:center;gap:7px;padding:7px 12px;border-bottom:1px solid var(--border);background:var(--paper);font-size:10px;flex-wrap:wrap}.preview-navigation>span{flex:1;color:#85738f}.preview-navigation output{min-width:38px;text-align:center;font-variant-numeric:tabular-nums}.preview-navigation [aria-pressed=true]{background:#e6d9ef;color:#694481}.preview-viewport{overflow:hidden;position:relative;touch-action:none}.preview-frame{outline:2px solid #9271aa;outline-offset:2px;transform-origin:center center}.preview-pan,.preview-pan *,.preview-dragging,.preview-dragging *{cursor:grab!important}.preview-dragging,.preview-dragging *{cursor:grabbing!important}.rig-preview-layer{position:absolute;inset:12px;transform-origin:center center}.rig-preview-layer .rig-grid{position:absolute;inset:0}.rig-preview-layer #rigSvg{position:absolute;inset:0}.rig-tip{z-index:2;background:#ebe5ecdd}
body:not(.playing) #motionView .center{position:sticky;top:calc(var(--header-height,74px) + 12px);align-self:start;z-index:5}#motionView .rig-stage{height:clamp(140px,calc(100dvh - var(--header-height,74px) - 330px),520px)}#motionView .note-banner{display:none}#motionView .key-panel{margin-top:8px}#motionView #keyTimeline{max-height:65px;overflow:auto}
body.playing .preview-navigation{display:none}body.playing #stage{transform:none!important;outline:none}body.playing .stage-surround{overflow:visible}
@media(max-width:900px){body:not(.playing) #motionView .center{top:var(--header-height,74px)}#motionView .rig-stage{height:clamp(130px,30dvh,320px)}.preview-navigation>span{flex-basis:100%;font-size:9px}}
/* Rig editing and variable theater frame. */
.preview-viewport,.preview-viewport *,#rigHierarchy{-webkit-user-select:none;user-select:none}.rig-preview-layer{outline:none}.stage{border-radius:0!important;aspect-ratio:var(--stage-ratio,1.7777778)!important}.drop-target{background:#dfc6ec!important;outline:2px solid #9573ae}.stage-toolbar{flex-wrap:wrap;height:auto!important;min-height:44px;gap:8px;padding-block:7px}#saveMotionPinned{margin-left:auto;white-space:nowrap}body:not(.playing) #theaterView .stage{width:min(100%,max(100px,calc((100dvh - var(--header-height,74px) - 380px)*var(--stage-ratio,1.7777778))))}body.playing .stage-surround{width:min(100vw,calc(100dvh * var(--stage-ratio,1.7777778)))}body.playing .stage{width:100%}.rig-stage [data-bone]{cursor:move}
.file-menu{position:relative;flex:none}.file-menu>summary{cursor:pointer;list-style:none;padding:9px 10px;font-size:12px}.file-menu>div{position:absolute;top:100%;left:0;z-index:80;width:235px;padding:6px;background:var(--paper);border:1px solid var(--border);border-radius:10px;box-shadow:0 12px 40px #302b3520}.file-menu button{display:flex;justify-content:space-between;width:100%;text-align:left;border:0;background:none;padding:12px;font-size:12px}.file-menu button:hover{background:#eee4f2}.file-menu small{color:var(--muted)}.episode-home{display:none;max-width:1120px;margin:0 auto;padding:64px 32px}.home-mode .episode-home{display:block}.home-mode #workspace,.home-mode header .tabs,.home-mode header .top-actions,.home-mode #homeButton{display:none!important}.home-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}.home-hero h1{font-size:32px;margin:12px 0}.home-hero p{color:var(--muted);font-size:14px}.owner-badge{font-size:11px;padding:8px 12px;background:#eee6f2;border-radius:20px;white-space:nowrap}.home-actions{display:flex;gap:10px;flex-wrap:wrap;margin:30px 0 22px}.home-explorer{border:1px solid var(--border);background:var(--paper);border-radius:14px;overflow:hidden;min-height:300px}.home-location{display:flex;justify-content:space-between;gap:12px;padding:16px 22px;border-bottom:1px solid var(--border);font-size:12px;background:#f1edf2}.home-location button{border:0;background:none;padding:2px;color:#6d507e}.home-location>span{white-space:nowrap;color:var(--muted)}.file-row{display:flex;align-items:center;gap:14px;padding:10px 20px;border-bottom:1px solid #ece6ee}.file-row:last-child{border-bottom:0}.file-open{display:flex;align-items:center;text-align:left;gap:16px;flex:1;min-width:0;border:0;background:transparent;padding:12px 0}.file-open strong{display:block;font-size:14px;overflow-wrap:anywhere}.file-open small{display:block;font-size:10px;color:var(--muted);margin-top:6px}.file-icon{display:grid;place-items:center;width:42px;height:44px;border-radius:9px;flex:none;font-size:27px;color:#867099;background:#ede4f2}.file-icon.folder{color:#ab8850;background:#f4ead3}.file-row time{font-size:11px;color:var(--muted)}.home-empty{text-align:center;padding:50px 20px;color:var(--muted)}.home-empty>span{font-size:34px}.home-empty h2{font-size:17px}.home-empty p,.home-storage{font-size:12px;line-height:1.8;color:var(--muted)}header{flex-wrap:wrap;height:auto;min-height:74px;gap:12px;padding-block:10px}@media(max-width:700px){.episode-home{padding:30px 16px}.home-hero h1{font-size:23px}.home-hero{flex-wrap:wrap}.file-row{gap:5px;padding:8px 12px;flex-wrap:wrap}.file-row time{display:none}.file-open{flex-basis:65%}.home-location{padding:12px}.home-actions button{font-size:11px}.home-storage{font-size:10px}}
.public-home a{text-decoration:none;color:inherit}.public-home header{justify-content:space-between}.viewer-mode header,.viewer-mode #episodeHome,.viewer-mode #workspace{display:none}.viewer-mode.playing #workspace{display:grid}.viewer-mode .show-bar{z-index:100}.viewer-mode .show-bar>span{display:block}.file-row{flex-wrap:wrap}
.login-card{max-width:440px;margin:12vh auto;padding:32px;background:var(--paper);border:1px solid var(--border);border-radius:16px}.login-card h1{margin-top:24px}.login-card p{font-size:13px;line-height:1.7;color:var(--muted)}.login-card input{font-size:16px}.login-card button{width:100%;margin-top:18px}#loginError{color:#a24e5d}@media(max-width:500px){.login-card{margin:8vh 16px;padding:24px}}
/* Captions use logical 960px canvas units so preview and playback agree. */
.stage .dialogue{font-size:calc(var(--caption-size,28)*var(--stage-unit,1px));padding:.45em .65em;min-height:0;overflow-wrap:anywhere}
.stage .dialogue p{font-size:inherit;line-height:1.5;margin:.15em 0;min-height:1.5em}
.stage .dialogue #dialogueName{font-size:.7em}
.stage .dialogue[data-mode=center]{left:50%;top:50%;right:auto;bottom:auto;transform:translate(-50%,-50%);width:90%;background:none;border:0;box-shadow:none;text-align:center;text-shadow:0 2px 5px #000,0 0 3px #000}
.stage .dialogue[data-mode=speech],.stage .dialogue[data-mode=thought]{left:var(--bubble-x,50%);top:var(--bubble-y,30%);right:auto;bottom:auto;transform:translate(-50%,-50%);width:max-content;max-width:80%;background:#fff;color:#292331;border:2px solid #423448;border-radius:1em;box-shadow:0 3px 10px #0002;pointer-events:auto;touch-action:none;cursor:move}
.stage .dialogue[data-mode=speech]:after{content:'';position:absolute;top:100%;left:28%;border-top:.6em solid #423448;border-right:.5em solid transparent}
.stage .dialogue[data-mode=thought]{border-radius:2em;border-style:dashed}
.stage .dialogue[data-mode=thought]:after{content:'';position:absolute;top:calc(100% + .12em);left:25%;width:.4em;height:.4em;background:#fff;border:2px solid #423448;border-radius:50%;box-shadow:-.4em .5em 0 -.08em #fff}
.stage .dialogue[data-mode=speech] #dialogueName,.stage .dialogue[data-mode=thought] #dialogueName{color:#765281}
body.playing .dialogue{cursor:default;pointer-events:none}
body.playing .stage-caption,body.playing .stage-grid,body.playing .actor-tag,body.playing #endCard,body.playing #toast,body.playing #showCounter,body.playing #showStatus,body.playing #previousShow,body.playing #exitShow{display:none!important}
body.playing .show-bar{position:fixed;top:12px;right:12px;bottom:auto;left:auto;width:auto;transform:none;background:#211c29b8;border:1px solid #ffffff30;border-radius:12px;padding:6px;display:flex;gap:5px;z-index:100}
body.playing .show-bar button{color:white;background:#ffffff14;border-color:#ffffff30;font-size:12px}
#watchMenu{width:min(480px,92vw);max-height:80dvh;overflow:auto;border:1px solid var(--border);border-radius:16px;padding:22px;background:var(--paper);color:var(--ink)}
#watchMenu::backdrop{background:#15101c99}.watch-menu-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}#watchMenu details{padding:14px 0;border-top:1px solid var(--border)}#watchMenu summary{cursor:pointer;font-weight:650}#episodeInfo,#dialogueLog{margin-top:12px;white-space:pre-wrap;overflow-wrap:anywhere}#leaveWatch{margin-top:16px;width:100%}

body.playing .stage .dialogue p{font-size:inherit}body.playing .stage .dialogue #dialogueName{font-size:.7em}body.playing .stage .dialogue{padding:.45em .65em}
/* Fixed caption geometry is independent of font size. */
.stage-caption{display:none!important}
.stage .dialogue[data-mode=box],body.playing .stage .dialogue[data-mode=box]{left:0;right:0;bottom:0;height:25%;padding:2% 5%;border:0;border-radius:0;box-shadow:none;background:linear-gradient(to bottom,transparent 0%,var(--dialogue-color,#27222e) 100%);display:flex;flex-direction:column;justify-content:center}
.stage .dialogue[data-mode=speech],.stage .dialogue[data-mode=thought],body.playing .stage .dialogue[data-mode=speech],body.playing .stage .dialogue[data-mode=thought]{width:44%;max-width:80%;height:25%;padding:2% 3%;border:0;border-radius:28% / 40%;background:var(--bubble-color,#fff);box-shadow:0 2px 3px #0002;display:flex;flex-direction:column;justify-content:center;text-align:center}
.stage .dialogue[data-mode=speech]:after{top:88%;left:76%;width:13%;height:28%;border:0;background:var(--bubble-color,#fff);clip-path:polygon(0 0,70% 0,100% 100%)}
.stage .dialogue[data-mode=thought]{border:2px dashed #6a5c6b}
.stage .dialogue[data-mode=thought]:after{top:104%;left:76%;width:5%;height:15%;border:0;background:var(--bubble-color,#fff);box-shadow:8px 9px 0 -2px var(--bubble-color,#fff)}
.stage .dialogue[data-mode=box] p,.stage .dialogue[data-mode=speech] p,.stage .dialogue[data-mode=thought] p{min-height:0;overflow:auto;flex:0 1 auto}
.stage .dialogue[data-mode=center]{background:none;text-shadow:0 1px 2px #0006}
.stage .dialogue[data-mode=center] p{display:inline;box-decoration-break:clone;-webkit-box-decoration-break:clone;background:var(--center-background,rgba(0,0,0,.8));padding:.12em .3em;line-height:1.8}
.stage .dialogue[data-mode=center] #dialogueName{width:fit-content;margin:0 auto .3em;background:var(--center-background,rgba(0,0,0,.8));padding:.1em .4em}
.stage .dialogue[data-mode=center] #dialogueName:empty{display:none}
.dialogue-log-entry{display:block;width:100%;text-align:left;margin:8px 0;white-space:pre-wrap;overflow-wrap:anywhere}
.stage .dialogue[data-mode=speech],.stage .dialogue[data-mode=thought],body.playing .stage .dialogue[data-mode=speech],body.playing .stage .dialogue[data-mode=thought]{background:linear-gradient(to bottom,color-mix(in srgb,var(--bubble-color,#fff) 80%,transparent),var(--bubble-color,#fff))}
/* Independent typography and geometry. Center captions cover the entire stage. */
.stage .dialogue #dialogueName,body.playing .stage .dialogue #dialogueName{font-size:calc(var(--name-size,20)*var(--stage-unit,1px))}
.stage .dialogue[data-mode=speech],.stage .dialogue[data-mode=thought],body.playing .stage .dialogue[data-mode=speech],body.playing .stage .dialogue[data-mode=thought]{width:var(--bubble-width,44%);height:var(--bubble-height,25%);max-width:none}
.stage .dialogue[data-mode=box],body.playing .stage .dialogue[data-mode=box]{height:var(--bubble-height,25%)}
.stage .dialogue.bubble-flipped[data-mode=speech]:after{left:11%;transform:scaleX(-1)}
.stage .dialogue.bubble-flipped[data-mode=thought]:after{left:19%;transform:scaleX(-1)}
.stage .dialogue[data-mode=center],body.playing .stage .dialogue[data-mode=center]{inset:0;transform:none;width:100%;height:100%;padding:5%;display:flex;flex-direction:column;justify-content:center;align-items:center;border-radius:0;background:var(--center-background,#000)}
.stage .dialogue[data-mode=center] p,.stage .dialogue[data-mode=center] #dialogueName{background:none;display:block;max-width:100%;overflow-wrap:anywhere}
body.hide-editor-grid .stage-grid,body.hide-editor-grid .rig-grid{display:none!important}
#episodeEnd{width:min(500px,92vw);border:0;border-radius:16px;padding:28px;background:var(--paper);color:var(--ink)}#episodeEnd h2{margin-bottom:20px}#episodeEnd::backdrop{background:#0008}
/* Only relevant caption controls are visible; honor hidden even in grid/flex rules. */
.panel [hidden]{display:none!important}
.stage .dialogue,body.playing .stage .dialogue{font-family:var(--caption-font,system-ui)}
.stage .dialogue #dialogueText,body.playing .stage .dialogue #dialogueText{color:var(--text-color,#fff)}
.stage .dialogue #dialogueName,body.playing .stage .dialogue #dialogueName{color:var(--name-color,#e9c599)}
.stage .dialogue[data-mode] #dialogueName{color:var(--name-color,#e9c599)}
#rigSvg .bone-name,#rigSvg .bone-link,#rigSvg .rig-joint{visibility:hidden}
.rig-stage>.rig-screen-overlay{position:absolute;inset:0;width:100%;height:100%;z-index:6;pointer-events:none;overflow:visible;user-select:none;transform:none!important}
.rig-screen-overlay [data-bone]{cursor:pointer}
.rig-screen-overlay [data-link-child]{cursor:move}
#rigLayers{max-height:260px;overflow:auto;margin:8px 0}.rig-layer-row{display:flex;gap:3px;align-items:center;padding:3px;border:1px solid transparent;border-radius:6px}.rig-layer-row.active{background:#eee0f3;border-color:#cbb6d5}.rig-layer-row button{font-size:10px;padding:5px}.rig-layer-row .layer-name{flex:1;text-align:left;min-width:0;overflow-wrap:anywhere;cursor:grab}
