/* Reference design: navy viewport, 52px menu bar, gold accents, full-width dope sheet. */
#plannerMenubar #plannerLeavePoseMode{position:fixed;left:50%;transform:translateX(-50%);height:30px;padding:0 16px;border:1px solid #ff8188;border-radius:4px;background:#b52634;color:#fff;font:600 11px Arial,sans-serif;box-shadow:0 3px 14px #0006;z-index:40;}
#plannerMenubar #plannerLeavePoseMode:hover{background:#d33342;}
#plannerMenubar #plannerLeavePoseMode:focus-visible{outline:2px solid #fff;outline-offset:3px;}
#plannerMenubar #plannerLeavePoseMode[hidden]{display:none!important;}
body.planner-reference { --planner-timeline-height: min(348px, 40dvh); --track-label: clamp(200px,20.55vw,366px); margin-right:0!important; }
#plannerMenubar {position:fixed;inset:0 0 auto;z-index:33;height:52px;box-sizing:border-box;display:flex;align-items:center;gap:18px;padding:0 20px;background:linear-gradient(#151e28,#101820);border-bottom:1px solid #303740;color:#e3e5e8;font:14px Arial,sans-serif;}
#plannerMenubar button,#plannerMenubar summary{width:auto;margin:0;border:0;border-radius:3px;background:transparent;color:inherit;font:inherit;letter-spacing:0;white-space:nowrap;cursor:pointer;box-shadow:none;}
#plannerMenubar>button,#plannerMenubar summary{height:44px;padding:0 13px;display:flex;align-items:center;gap:12px;}
#plannerMenubar .plannerBrand{padding:0;gap:14px;margin-right:26px;color:#ecb348;font-size:16px;letter-spacing:1px;font-weight:700;}
.plannerBrand svg{width:44px;height:32px;flex-shrink:0;}
.plannerMenu{position:relative;flex-shrink:0;}
#plannerMenubar summary{list-style:none;}#plannerMenubar summary::-webkit-details-marker{display:none;}
#plannerMenubar summary:after,#plannerMenubar #assetsToggle:after,.plannerKeying summary:after{content:'⌄';font-size:14px;margin-left:4px;}
#plannerMenubar button:hover,#plannerMenubar summary:hover,#plannerMenubar details[open]>summary{background:#26313e;}
#plannerMenubar summary.active{color:#edb649;}
.plannerMenuPopup{position:absolute;top:calc(100% + 4px);left:0;z-index:60;min-width:220px;padding:6px;border:1px solid #39434f;border-radius:4px;background:#18222e;box-shadow:0 16px 30px #0008;}
#plannerMenubar .plannerMenuPopup button{display:block;width:100%;height:34px;text-align:left;padding:0 12px;font-size:13px;}
.plannerMenuSpace{flex:1;min-width:0;}
#plannerMenubar .plannerTopIcon{padding:0 8px;font-size:25px;}#plannerMenubar button:disabled{opacity:.3;cursor:default;}
.plannerSceneMenu{border-left:1px solid #45505d;border-right:1px solid #27313d;}
.plannerSceneMenu .plannerMenuPopup{left:auto;right:0;}
body.planner-reference #plannerMenubar #assetsMenu{display:block!important;position:relative!important;inset:auto!important;z-index:auto!important;margin:0!important;flex-shrink:0;}
#plannerMenubar #assetsToggle{height:44px;padding:0 13px;font-size:14px;border:0;display:flex;align-items:center;gap:12px;}
body.planner-reference #assetsDropdown{top:48px;left:0;right:auto;width:250px;max-height:calc(100dvh - 76px);overflow:auto;padding:8px;background:#18222e;border:1px solid #39434f;}
#plannerMenubar .assetsMenuItem{width:100%;height:32px;text-align:left;font-size:13px;background:transparent!important;}#plannerMenubar .assetsMenuLabel{padding:10px 7px 5px;color:#d8af58;font-size:10px;letter-spacing:1px;}
body.planner-reference #studioHomeButton,body.planner-reference #screenplayToggle,body.planner-reference #helpButton,body.planner-reference #panelToggle,body.planner-reference #shotPanelToggle,body.planner-reference #shotPlannerAnimationButton,body.planner-reference #shotPlannerRenderButton{display:none!important;}
body.planner-reference #panel{top:52px;height:calc(100dvh - 52px);z-index:30;background:#18222e;}
body.planner-reference #panel.collapsed{visibility:hidden;pointer-events:none;}
body.planner-reference.planner-animation-open #panel{height:calc(100dvh - 52px - var(--planner-timeline-height));}
body.planner-reference .plannerViewportCanvas{position:fixed!important;top:52px!important;left:0!important;width:100vw!important;height:calc(100dvh - 52px)!important;}
body.planner-reference.planner-animation-open .plannerViewportCanvas{height:calc(100dvh - 52px - var(--planner-timeline-height))!important;}
body.planner-reference #shotPlannerTimeline{height:var(--planner-timeline-height);min-height:180px;max-height:none;grid-template-rows:64px minmax(0,1fr);background:#1c232c;color:#cbd0d7;border-top:1px solid #343d48;}
body.planner-reference #shotPlannerTimeline[hidden]{display:none!important;}
body.planner-reference #shotPlannerTimeline .plannerTransport{height:64px;min-height:64px;box-sizing:border-box;padding:9px 18px;gap:16px;background:linear-gradient(#1b232d,#171e26);border-bottom:1px solid #343d48;overflow-y:visible;}
body.planner-reference #shotPlannerTimeline button{width:auto;flex-shrink:0;height:42px;min-height:42px;font:15px Arial,sans-serif;background:linear-gradient(#232a34,#1c232b);border:1px solid #343d47;border-radius:4px;padding:0 22px;}
body.planner-reference #shotPlannerTimeline .plannerToolGroup{height:42px;border:0;padding:0;gap:7px;}
body.planner-reference #shotPlannerTimeline .plannerIconButton{width:62px;min-width:44px;padding:0;font-size:23px;}
body.planner-reference #shotPlannerTimeline .plannerPlayButton{color:#e9b348;border-color:#625335;}
body.planner-reference #shotPlannerTimeline .plannerFrameGroup{gap:14px;}
body.planner-reference #shotPlannerTimeline .plannerFrameGroup output{height:42px;width:102px;background:#10171f;color:#edb744;border:1px solid #29323b;font:15px Arial;}
body.planner-reference #shotPlannerTimeline .plannerFrameGroup label{gap:10px;color:#a5adb7;font:14px Arial;}
body.planner-reference #shotPlannerTimeline .plannerFrameGroup input{width:62px;height:32px;font:14px Arial;text-align:center;background:#202730;border:1px solid #303946;color:#e4e6ea;}
body.planner-reference #shotPlannerTimeline #plannerAddKey{width:102px;padding:0;}
body.planner-reference #shotPlannerTimeline #plannerRemoveKey{width:130px;padding:0;}
body.planner-reference #shotPlannerTimeline .plannerFrameGroup label{gap:24px;}
.plannerKeying{min-width:118px;}
.plannerKeying .plannerMenuPopup{position:fixed!important;bottom:calc(var(--planner-timeline-height) - 8px)!important;top:auto!important;}
.plannerKeying{position:relative;flex-shrink:0;font:15px Arial;}.plannerKeying summary{list-style:none;cursor:pointer;padding:12px 20px;border:1px solid #343d47;border-radius:4px;}.plannerKeying .plannerMenuPopup{top:auto;bottom:48px;}.plannerKeying .plannerMenuPopup button{width:100%;margin:2px 0!important;}
body.planner-reference #shotPlannerTimeline .plannerAnimationBadge{color:#efb63d;border:1px solid #bc8d30;background:linear-gradient(#353329,#22252a);min-width:156px;}
.plannerDopeSheet{position:relative;overflow:auto;min-width:0;min-height:0;background:#1a2129;scrollbar-color:#46515d #171e26;}
.plannerSheetRuler,.plannerSheetRow{display:grid;grid-template-columns:var(--track-label) minmax(250px,1fr);padding-right:44px;height:29px;box-sizing:border-box;border-bottom:1px solid #2c343f;}
.plannerSheetRuler{height:34px;position:sticky;top:0;z-index:3;background:#141c25;}
.plannerSheetRow.object{height:31px;background:linear-gradient(90deg,#272f3a,#202832);}
.plannerSheetRow:nth-child(odd){background-color:#1e252e;}
body.planner-reference #shotPlannerTimeline .plannerSheetLabel{display:flex;justify-content:flex-start;align-items:center;min-height:0;height:100%;width:100%;padding:0 28px;border:0;border-radius:0;background:transparent;text-align:left;font:14px Arial;color:#c7ccd2;}
body.planner-reference #shotPlannerTimeline .plannerSheetRow:not(.object) .plannerSheetLabel{padding-left:68px;position:relative;}
.plannerSheetLabel[data-channel]:not([data-channel='']):before{content:'';position:absolute;left:65px;width:4px;height:19px;background:#e15464;transform:translateX(-12px);}
.plannerSheetLabel[data-channel='y']:before{background:#5cc97b!important;}.plannerSheetLabel[data-channel='z']:before{background:#369de7!important;}
.plannerSheetScale,.plannerSheetRail{position:relative;min-width:0;background-image:linear-gradient(to right,#343d48 1px,transparent 1px);background-size:var(--tick-width) 100%;}
body.planner-reference #shotPlannerTimeline .plannerSheetScale button{position:absolute;top:0;transform:translateX(-50%);min-height:0;height:32px;padding:0;border:0;background:transparent;color:#a4adb8;font-size:14px;overflow:visible;}
body.planner-reference #shotPlannerTimeline .plannerSheetKey{position:absolute;left:0;top:0;transform:translateX(-50%);height:28px;min-height:0;width:18px;padding:0;border:0;background:transparent;color:#bfc4cb;font-size:15px;}
body.planner-reference #shotPlannerTimeline .selected .plannerSheetKey{color:#f1b13c;}
.plannerSheetCursor{position:absolute;top:0;bottom:0;min-height:100%;width:2px;background:#eab344;pointer-events:none;z-index:4;}
.plannerSheetCursor span{position:sticky;top:0;display:flex;align-items:center;justify-content:center;transform:translateX(-50%);height:31px;width:38px;background:linear-gradient(#e6b950,#ecae30);border:1px solid #f0c760;border-radius:5px;color:#24211b;font:15px Arial;}
body:has(#studioHome.open) #plannerMenubar,body:has(#studioOpening.open) #plannerMenubar,body.animator-open #plannerMenubar,body.video-editor-open #plannerMenubar,body.two-d-animation-open #plannerMenubar,body.scoring-stage-open #plannerMenubar{display:none;}
@media(max-width:1450px){#plannerMenubar{gap:4px;padding-inline:12px;font-size:13px;}#plannerMenubar .plannerBrand{font-size:13px;margin-right:10px;gap:8px;}#plannerMenubar>button,#plannerMenubar summary,#plannerMenubar #assetsToggle{padding-inline:9px;}body.planner-reference #shotPlannerTimeline .plannerTransport{gap:10px;}body.planner-reference #shotPlannerTimeline .plannerIconButton{width:48px;}body.planner-reference #shotPlannerTimeline button{padding-inline:16px;}}
@media(max-width:1000px){#plannerMenubar .plannerBrand{font-size:0;margin:0;}#plannerMenubar .plannerTopIcon{font-size:20px;padding:0 5px;}#plannerMenubar{gap:0;}#plannerMenubar summary,#plannerMenubar #assetsToggle{gap:4px;font-size:12px;}body.planner-reference #shotPlannerTimeline .plannerTransport{overflow-x:auto;}body.planner-reference{--track-label:200px;}}
@media(max-width:650px){#plannerMenubar{height:90px;flex-wrap:wrap;align-content:center;justify-content:flex-start;padding:0 5px;}#plannerMenubar .plannerBrand{height:40px;}#plannerMenubar>button,#plannerMenubar summary,#plannerMenubar #assetsToggle{height:40px;padding-inline:7px;}#plannerMenubar .plannerMenuSpace{display:none;}#plannerMenubar .plannerMenuPopup{position:fixed;top:90px;left:8px;right:8px;max-height:65dvh;overflow:auto;}body.planner-reference #assetsDropdown{position:fixed;top:90px;left:8px;}body.planner-reference .plannerViewportCanvas{top:90px!important;height:calc(100dvh - 90px)!important;}body.planner-reference.planner-animation-open .plannerViewportCanvas{height:calc(100dvh - 90px - var(--planner-timeline-height))!important;}body.planner-reference #panel{top:90px;height:calc(100dvh - 90px);}body.planner-reference.planner-animation-open #panel{height:calc(100dvh - 90px - var(--planner-timeline-height));}}

/* Discoverable inspector tab, available independently of the settings menu. */
#plannerInspectorToggle{position:fixed;z-index:32;right:0;top:42%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;width:42px;height:122px;padding:7px 0;margin:0;border:1px solid #657181;border-right:0;border-radius:8px 0 0 8px;background:#202c39ee;color:#f0c366;box-shadow:-4px 0 18px #0005;cursor:pointer;}
#plannerInspectorToggle.expanded{right:min(var(--inspector-width),calc(100vw - 44px));}
#plannerInspectorToggle:hover,#plannerInspectorToggle:focus-visible{background:#344556;border-color:#edbf5b;outline:2px solid #edbf5b;outline-offset:-2px;}
.plannerInspectorChevron{font:32px/1 Arial;}.plannerInspectorCaption{writing-mode:vertical-rl;letter-spacing:.06em;font:11px/1.2 Arial;}
body:has(#studioHome.open) #plannerInspectorToggle,body:has(#studioOpening.open) #plannerInspectorToggle,body.animator-open #plannerInspectorToggle,body.video-editor-open #plannerInspectorToggle,body.two-d-animation-open #plannerInspectorToggle,body.scoring-stage-open #plannerInspectorToggle,body.camera-monitor-active #plannerInspectorToggle{display:none;}
.plannerSheetCursor{pointer-events:auto;cursor:ew-resize;touch-action:none;outline:none;}
.plannerSheetCursor:before{content:'';position:absolute;inset:0 -8px;}
.plannerSheetCursor:focus-visible span{outline:2px solid white;outline-offset:2px;}
.plannerSheetScale,.plannerSheetRail{touch-action:none;}
.plannerDopeSheet.scrubbing,.plannerDopeSheet.scrubbing *{cursor:ew-resize!important;user-select:none;}
.plannerSheetCursor span{user-select:none;}
body.planner-reference #shotPlannerTimeline .plannerTransport{overflow-y:hidden;scrollbar-width:thin;scrollbar-color:#4a5664 #18212b;}

#plannerWelcomeGuide{width:min(530px,calc(100vw - 32px));box-sizing:border-box;max-height:calc(100dvh - 32px);overflow:auto;margin:auto;padding:28px;border:1px solid #53606e;border-radius:12px;background:linear-gradient(145deg,#1d2a38,#101923);color:#e4e8ed;box-shadow:0 24px 100px #0009;font:15px/1.6 Arial,sans-serif;}
#plannerWelcomeGuide::backdrop{background:#030911b8;backdrop-filter:blur(3px);}
.plannerGuideTop{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:10px;letter-spacing:.12em;color:#b0becd;}
#plannerWelcomeGuide button{width:auto;margin:0;min-height:38px;padding:8px 15px;border:1px solid #53606e;border-radius:5px;background:#263443;color:#e2e8ee;font:13px Arial;cursor:pointer;}
#plannerWelcomeGuide button:focus-visible{outline:2px solid #f0c366;outline-offset:3px;}
#plannerWelcomeGuide button:disabled{opacity:.35;cursor:default;}
#plannerWelcomeGuide [data-guide-skip]{border:0;background:transparent;padding:5px;color:#b6c1cc;}
#plannerWelcomeGuide [data-guide-next]{background:#e6b451;color:#151b23;border-color:#efc577;font-weight:bold;}
.plannerGuideEyebrow{margin:24px 0 7px;color:#e6b451;font-size:11px;letter-spacing:.13em;}
#plannerGuideTitle{font:600 27px/1.2 Arial;margin:0 0 14px;color:#fff;letter-spacing:-.02em;}
#plannerGuideCopy{margin:0;color:#b9c6d3;min-height:96px;}
.plannerGuideFooter{display:flex;align-items:center;gap:8px;border-top:1px solid #35414f;margin-top:24px;padding-top:20px;}
.plannerGuideProgress{flex:1;color:#8f9eae;font-size:10px;letter-spacing:.06em;}
.plannerGuideIllustration{height:96px;border:1px solid #45586d;border-radius:5px;margin-top:22px;background:linear-gradient(155deg,#152638,#21374b);position:relative;overflow:hidden;}
.plannerGuideIllustration:before{content:'';position:absolute;inset:0 0 auto;height:15px;border-bottom:1px solid #4c5f73;background:#101820;}
.plannerGuideIllustration i{position:absolute;width:32px;height:47px;left:46%;top:28px;border:1px solid #e6b451;transform:skewY(-7deg);}
.plannerGuideIllustration b{position:absolute;inset:16px 0 0 auto;width:80px;background:#263749;border-left:1px solid #5a6a7a;}
.plannerGuideIllustration span{position:absolute;right:81px;top:31px;color:#e6b451;background:#2d4256;padding:0 5px;font-size:27px;border-radius:4px 0 0 4px;}
@media(max-width:480px){#plannerWelcomeGuide{padding:20px;}.plannerGuideTop{font-size:9px;}#plannerGuideTitle{font-size:23px;}.plannerGuideProgress{font-size:9px;}#plannerWelcomeGuide button{padding:8px 11px;}}
@media(max-width:650px){body.planner-reference{--track-label:140px;}.plannerSheetRuler,.plannerSheetRow{grid-template-columns:var(--track-label) minmax(120px,1fr);padding-right:24px;}body.planner-reference #shotPlannerTimeline .plannerSheetLabel{font-size:11px;padding-left:14px;}body.planner-reference #shotPlannerTimeline .plannerSheetRow:not(.object) .plannerSheetLabel{padding-left:44px;}.plannerSheetLabel[data-channel]:not([data-channel='']):before{left:44px;}}