/* Spectrum interface tokens. Learner colours remain controlled by the course theme. */
.dock-tabs>button{touch-action:none;user-select:none}.dock-dragging{cursor:grabbing}.dock-group.dock-drop-target{outline:2px solid var(--ui-accent);outline-offset:-2px;background:var(--ui-accent-soft)}
.author-toolbar .author-drag-hint{display:none}.author-toolbar .author-tool-group>button{width:34px;padding:6px;font-size:15px}.author-toolbar .author-main-row{gap:8px}.author-toolbar .author-selection-actions{gap:5px}.author-toolbar .author-selection-actions [data-author-status]{max-width:80px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dock-trigger-editor>header{display:none}.dock-trigger-editor [data-trigger-root=list]>.trigger-hint,.dock-trigger-editor .trigger-panel-head .trigger-kicker{display:none}.author-window-options>button>.dock-window-label{width:auto;flex:1;color:inherit}
.dock-trigger-editor:has([data-trigger-root=wizard])>header{display:block;margin-bottom:12px}.dock-trigger-editor:has([data-trigger-root=wizard])>header>.trigger-hint{display:none}
.inspector.workspace-dock{padding:0;display:flex;flex-direction:column;height:var(--studio-dock-height,calc(100dvh - var(--account-bar-height,0px) - 68px));max-height:var(--studio-dock-height,calc(100dvh - var(--account-bar-height,0px) - 68px));min-height:min(320px,var(--studio-dock-height,320px));overflow:hidden}
.workspace-dock[hidden]{display:none}.dock-heading{flex:none;gap:8px;padding:10px 12px!important;margin:0!important;border-bottom:1px solid var(--ui-border)}.dock-heading>span{margin-right:auto}.dock-heading .btn{font-size:10px;padding:5px 8px;min-height:28px}.dock-heading .icon-button{flex:none}
.dock-stack{flex:1;min-height:0;display:grid;grid-template-rows:minmax(0,1fr)}.dock-stack[data-two-groups=true]{grid-template-rows:minmax(0,var(--dock-split,55%)) 8px minmax(0,1fr)}
.dock-group{display:flex;flex-direction:column;min-height:0;overflow:hidden}.dock-group-bar{display:flex;align-items:flex-start;gap:4px;background:var(--ui-soft);border-bottom:1px solid var(--ui-border);padding:4px 4px 0;flex:none}.dock-tabs{display:flex;flex:1;min-width:0;flex-wrap:wrap;gap:1px}.dock-tabs>button{border:0;border-bottom:2px solid transparent;padding:9px 7px;font-size:11px;color:var(--ui-muted);border-radius:5px 5px 0 0;cursor:grab;white-space:nowrap}.dock-tabs>button[aria-selected=true]{background:var(--ui-surface);color:var(--ui-accent);border-bottom-color:var(--ui-accent)}.dock-tabs>button:focus-visible{outline:2px solid var(--ui-accent);outline-offset:-2px}
.dock-group-controls{display:flex;gap:1px;padding-top:2px}.dock-group-controls>button{width:22px;height:28px;font-size:14px;border-radius:4px;color:var(--ui-muted)}.dock-group-controls>button:hover{background:var(--ui-surface);color:var(--ui-text)}
.dock-group-body{min-height:0;flex:1;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable}.dock-panel{padding:16px;min-width:0;overflow-wrap:anywhere}.dock-panel[hidden]{display:none}.dock-panel .panel-label{padding:0}.dock-panel>h3{font-size:14px;margin:0 0 16px}.dock-panel .studio-section{margin-top:16px;padding-top:16px}.dock-panel .studio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dock-panel .studio-helper,.dock-panel .panel-note{font-size:11px}.dock-intro,.dock-empty{font-size:12px;line-height:1.8;color:var(--ui-muted);margin:0 0 16px}.dock-empty{padding:20px}.dock-quick-links{display:flex;flex-wrap:wrap;gap:6px;border-top:1px solid var(--ui-border);padding-top:14px;margin-top:14px}
.dock-splitter{cursor:row-resize;background:var(--ui-soft);border-block:1px solid var(--ui-border);touch-action:none;position:relative}.dock-splitter:after{content:'';position:absolute;top:2px;left:calc(50% - 18px);width:36px;border-top:2px solid var(--ui-muted);border-radius:3px}.dock-splitter:hover,.dock-splitter:focus-visible{background:var(--ui-accent-soft);outline:2px solid var(--ui-accent);outline-offset:-2px}
.author-window-menu{position:relative;z-index:190}.author-window-menu>summary{cursor:pointer;list-style:none;padding:9px 12px;border:1px solid var(--ui-border);border-radius:var(--ui-radius);font-size:12px;background:var(--ui-surface);color:var(--ui-text)}.author-window-menu>summary:after{content:' ⌄';color:var(--ui-muted)}.author-window-menu>summary::-webkit-details-marker{display:none}.author-window-menu[open]>summary{background:var(--ui-accent-soft);border-color:var(--ui-accent)}
.author-window-options{position:absolute;right:0;top:calc(100% + 8px);width:250px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 140px);overflow:auto;padding:10px;background:var(--ui-surface);color:var(--ui-text);border:1px solid var(--ui-border);border-radius:10px;box-shadow:0 12px 32px #0005}.author-window-options>button{display:flex;width:100%;align-items:center;gap:10px;font-size:12px;text-align:left;padding:9px;border-radius:5px}.author-window-options>button:hover,.author-window-options>button:focus-visible{background:var(--ui-soft)}.author-window-options>button>span{width:14px;color:var(--ui-accent)}.author-window-options>hr{border:0;border-top:1px solid var(--ui-border);margin:6px 0}.dock-menu-label{font-size:9px;letter-spacing:1px;color:var(--ui-muted);display:block;padding:6px 9px}.author-window-options>p{font-size:11px;color:var(--ui-muted);line-height:1.6;padding:8px;margin:0}
.dock-panel[data-dock-body=triggers]{padding:12px}.dock-trigger-editor>header h3{font-size:15px;margin:0 0 4px}.dock-trigger-editor .trigger-panel-head{gap:6px;flex-wrap:wrap}.dock-trigger-editor .trigger-panel-head h3{font-size:13px}.dock-trigger-editor .trigger-list{gap:10px;margin:12px 0}.dock-trigger-editor .trigger-card{padding:12px;gap:8px}.dock-trigger-editor .trigger-card-copy{flex-basis:100%}.dock-trigger-editor .trigger-card h3{font-size:12px}.dock-trigger-editor .trigger-card-tools{justify-content:flex-start;flex-basis:100%;gap:4px}.dock-trigger-editor .trigger-card-tools .btn{font-size:10px;padding:5px 7px;min-height:28px}.dock-trigger-editor .trigger-hint{font-size:11px;margin:8px 0 12px}.dock-trigger-editor .trigger-wizard-grid{grid-template-columns:1fr;gap:14px}.dock-trigger-editor .trigger-row{grid-template-columns:1fr;gap:5px;margin-bottom:12px}.dock-trigger-editor .trigger-group{padding:12px;margin-bottom:12px}.dock-trigger-editor .trigger-group legend{font-size:11px}.dock-trigger-editor .trigger-conditions{margin-top:16px;padding-top:14px}.dock-trigger-editor .trigger-condition{padding:12px}.dock-trigger-editor .trigger-preview{margin-top:16px;padding:12px}.dock-trigger-footer{display:flex;gap:6px;justify-content:flex-end;position:sticky;bottom:0;background:var(--ui-surface);padding:12px 0;margin-top:10px;border-top:1px solid var(--ui-border);flex-wrap:wrap}.dock-trigger-footer .btn{font-size:11px;padding:8px}
.dock-panel .object-settings{display:grid;gap:10px}.dock-panel .object-state-list>div,.dock-panel .object-rule{flex-wrap:wrap}.dock-panel .variable-row{grid-template-columns:1fr;gap:4px;padding-bottom:16px;margin-bottom:16px;border-bottom:1px solid var(--ui-border)}.dock-panel .variable-row .field{margin-bottom:8px}.dock-panel .variable-row>button{justify-self:start}.dock-panel fieldset{min-width:0}.type-preview{min-height:0}
.free-edit .positioned-block{touch-action:none}.free-edit .learn-block{cursor:move;user-select:none}.free-edit :is(input,textarea,select,[contenteditable=true]){cursor:auto;user-select:text;touch-action:auto}.free-edit .move-handle{opacity:0;pointer-events:none}.free-edit .move-handle:focus-visible{opacity:1;pointer-events:auto}.free-edit .resize-handle,.free-edit .rotate-handle{opacity:0;pointer-events:none}.free-edit .positioned-block:has(>.selected)>:is(.resize-handle,.rotate-handle),.free-edit :is(.resize-handle,.rotate-handle):focus-visible{opacity:1;pointer-events:auto}
.free-edit .positioned-block>.resize-handle{position:absolute;inset:auto;width:24px;height:24px;min-height:0;padding:0;border:0;border-radius:0;background:transparent;z-index:12;transform:translate(-50%,-50%) scale(var(--canvas-handle-scale,1));touch-action:none}
.free-edit .resize-handle::after{content:'';position:absolute;inset:7px;border:1px solid #635bff;border-radius:1px;background:#fff;box-shadow:0 0 0 1px #fff}
.free-edit img{-webkit-user-drag:none;user-select:none}
.free-edit .resize-handle:focus-visible{outline:2px solid var(--ui-accent,#635bff);outline-offset:0;border-radius:3px}.free-edit .resize-handle:hover::after{background:#dcd7ff}
.free-edit .resize-handle[data-resize-edge=nw]{left:0;top:0;cursor:nwse-resize}.free-edit .resize-handle[data-resize-edge=n]{left:50%;top:0;cursor:ns-resize}.free-edit .resize-handle[data-resize-edge=ne]{left:100%;top:0;cursor:nesw-resize}.free-edit .resize-handle[data-resize-edge=e]{left:100%;top:50%;cursor:ew-resize}.free-edit .resize-handle[data-resize-edge=se]{left:100%;top:100%;cursor:nwse-resize}.free-edit .resize-handle[data-resize-edge=s]{left:50%;top:100%;cursor:ns-resize}.free-edit .resize-handle[data-resize-edge=sw]{left:0;top:100%;cursor:nesw-resize}.free-edit .resize-handle[data-resize-edge=w]{left:0;top:50%;cursor:ew-resize}
@media(max-width:950px){.inspector.workspace-dock{height:580px;max-height:80dvh;min-height:320px;grid-column:1/-1}.dock-stack[data-two-groups=true]{grid-template-rows:minmax(0,var(--dock-split,55%)) 8px minmax(0,1fr)}}
dialog:has([data-trigger-root]){width:min(900px,calc(100vw - 32px));max-width:min(900px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto}
.trigger-panel-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px}
.trigger-panel-head h3{margin:6px 0 0;font-size:20px}.trigger-kicker{font-size:10px;font-weight:700;letter-spacing:1.1px;color:var(--ui-muted)}
.trigger-hint{font-size:12px;line-height:1.7;color:var(--ui-muted);margin:10px 0 16px}
.trigger-list{list-style:none;padding:0;margin:20px 0;display:grid;gap:12px}
.trigger-card{border:1px solid var(--ui-border);border-radius:var(--ui-card-radius);padding:18px;display:flex;flex-wrap:wrap;gap:16px;background:var(--ui-soft)}
.trigger-card-copy{flex:1 1 260px;min-width:0;overflow-wrap:anywhere}.trigger-card h3{font-size:14px;line-height:1.6;margin:6px 0}.trigger-card p{font-size:12px;line-height:1.6;margin:6px 0}
.trigger-card-tools{display:flex;align-content:flex-start;align-items:start;justify-content:flex-end;gap:6px;flex-wrap:wrap;flex:0 1 230px}.trigger-card-tools .btn{background:var(--ui-surface)}
.trigger-conditions-summary{color:var(--ui-muted)}.trigger-empty{text-align:center;border:1px dashed var(--ui-border);border-radius:12px;padding:36px 24px}.trigger-empty p{font-size:13px;color:var(--ui-muted);line-height:1.7;margin:12px auto 20px;max-width:390px}
.trigger-wizard-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:start}.trigger-wizard-grid section{min-width:0}
.trigger-group{border:1px solid var(--ui-border);border-radius:10px;padding:18px 16px 8px;margin:0 0 16px;min-width:0}.trigger-group legend{font-size:12px;font-weight:700;padding:0 8px;color:var(--ui-accent)}
.trigger-row{display:grid;grid-template-columns:80px minmax(0,1fr);align-items:center;gap:12px;margin-bottom:14px;font-size:12px;line-height:1.5}.trigger-row>span:first-child{color:var(--ui-muted)}.trigger-row .input{font-size:12px;width:100%;min-height:38px}.trigger-static{border:1px solid var(--ui-border);border-radius:7px;padding:10px 12px;background:var(--ui-soft);color:var(--ui-muted)}
.trigger-conditions{margin-top:24px;border-top:1px solid var(--ui-border);padding-top:18px}.trigger-conditions summary{cursor:pointer;font-size:13px;font-weight:600;min-height:32px}.trigger-conditions summary span{font-weight:400;color:var(--ui-muted);margin-left:8px}.trigger-condition{border:1px solid var(--ui-border);border-radius:10px;padding:16px;margin-bottom:12px;max-width:600px}.trigger-condition>.trigger-kicker{display:block;margin-bottom:14px}
.trigger-preview{padding:16px 18px;background:var(--ui-accent-soft);border:1px solid var(--ui-border);border-radius:10px;margin-top:24px;overflow-wrap:anywhere}.trigger-preview p{font-size:12px;line-height:1.8;margin:8px 0 0;white-space:pre-line}.trigger-error{color:var(--ui-text);font-size:12px;line-height:1.7;overflow-wrap:anywhere}.trigger-error:not(:empty){padding:12px 14px;border-left:3px solid var(--ui-accent);background:var(--ui-soft);margin-top:16px}.trigger-delete-confirm{flex-basis:100%;border-top:1px solid var(--ui-border);padding-top:12px}.trigger-delete-confirm button{margin-right:8px}
@media(max-width:700px){.trigger-wizard-grid{grid-template-columns:1fr;gap:16px}.trigger-card-tools{flex-basis:100%;justify-content:flex-start}.trigger-row{grid-template-columns:72px minmax(0,1fr);gap:8px}dialog:has([data-trigger-root]){padding:22px 18px}.trigger-panel-head{flex-wrap:wrap}}
.quiz-author-options{border:1px solid var(--ui-border);border-radius:8px;padding:10px;margin:14px 0}.quiz-author-options legend{font-size:11px;color:var(--ui-muted)}.quiz-author-option{display:grid;gap:8px;padding:12px 0;border-bottom:1px solid var(--ui-border)}.quiz-author-option:last-child{border:0}.quiz-author-option>label:not(.field){font-size:11px;display:flex;align-items:center;gap:7px}.quiz-author-option details{font-size:11px}.quiz-author-option details>.field{margin-top:10px}
/* A real dock: the canvas scrolls independently while the page-entry timeline stays in view. */
.stage.animation-pane-open{display:flex;flex-direction:column;min-height:0;padding-bottom:var(--animation-dock-height,360px)}
.stage.animation-pane-open>.studio-tools,.stage.animation-pane-open>.author-toolbar,.stage.animation-pane-open>.stage-toolbar{flex:none}
/* Keep drawing/selection tools available; opening a pen must not dismiss the timeline. */
.animation-pane-open .author-viewport,.animation-pane-open .animation-workspace-scroll{flex:none;min-height:180px;height:calc(100vh - var(--account-bar-height,0px) - 68px - 112px - var(--animation-dock-height,360px));overflow:auto}
.animation-workspace-scroll>.canvas{margin-bottom:20px}
.animation-dock{position:fixed;bottom:0;left:0;right:0;z-index:170;min-width:0;border:1px solid var(--ui-border);border-radius:12px 12px 0 0;background:var(--ui-surface);box-shadow:0 -6px 28px #00000030}
.animation-pane{padding:12px;color:var(--ui-text);font-size:11px}
.animation-pane header,.animation-transport{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.animation-pane header{justify-content:space-between;gap:10px;margin-bottom:10px}
.animation-pane header strong{font-size:14px;margin-right:10px}.animation-pane header span{font-size:9px;letter-spacing:1.2px;color:var(--ui-muted)}
.animation-transport output{font-variant-numeric:tabular-nums;min-width:100px;color:var(--ui-muted)}
.animation-properties{display:flex;align-items:end;gap:10px;flex-wrap:wrap;padding:10px;background:var(--ui-soft);border-radius:8px}
.animation-properties label{display:grid;gap:5px;font-size:10px;flex:1;min-width:95px}.animation-properties label:first-child{flex:2;min-width:150px}
.animation-properties label span{display:inline;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.animation-properties .input{width:100%;min-height:32px;font-size:11px;padding:6px 8px}.animation-properties p{margin:0;color:var(--ui-muted);line-height:1.6}
.animation-seek{display:flex;gap:10px;align-items:center;margin:9px 0}.animation-seek input[type=range]{min-width:100px;flex:1;accent-color:var(--ui-accent)}.animation-seek span{color:var(--ui-muted);font-size:10px;max-width:250px}
.animation-motion-consent{display:flex;align-items:center;gap:6px;font-size:11px;white-space:nowrap}.animation-motion-consent[hidden]{display:none}.animation-motion-consent input{flex:none;min-width:0;accent-color:var(--ui-accent)}.animation-motion-consent small{font-size:10px;color:var(--ui-muted)}
.animation-tracks{overflow-x:auto;border:1px solid var(--ui-border);border-radius:7px;background:var(--ui-bg)}
.animation-ruler,.animation-track{display:grid;grid-template-columns:145px minmax(220px,1fr);min-width:390px}
.animation-ruler{height:25px;color:var(--ui-muted);font-size:9px;padding-right:16px}.animation-ruler>span{padding:7px 9px;letter-spacing:1px}.animation-ruler>div{position:relative;margin:0 0 0 6px}.animation-ruler>div span{position:absolute;top:7px;transform:translateX(-50%)}.animation-ruler>div span:first-child{transform:none}
.animation-track-list{max-height:115px;overflow:auto;scrollbar-gutter:stable}.animation-track{height:38px;border-top:1px solid var(--ui-border)}
.animation-track.active{background:var(--ui-accent-soft)}.animation-track-name{text-align:left;padding:5px 9px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}.animation-track-name small{display:block;color:var(--ui-muted);font-size:9px;margin-top:2px}
.animation-lane{position:relative;margin:0 6px;background-image:linear-gradient(to right,var(--ui-border) 1px,transparent 1px);background-size:20% 100%}
.animation-lane:after{content:'';position:absolute;top:0;bottom:0;left:var(--animation-cursor,0%);width:1px;background:var(--ui-accent);pointer-events:none;z-index:3}
.animation-bar{position:absolute;top:8px;height:25px;min-width:3px;border:1px solid #9287f5;border-radius:5px;background:#635bff;color:#fff;font-size:10px;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:4px 6px;cursor:ew-resize;touch-action:none}
.animation-end{position:absolute;top:9px;transform:translateX(-50%);height:23px;width:10px;background:#d8d3ff;border:2px solid #635bff;border-radius:4px;cursor:ew-resize;touch-action:none;z-index:2}
.animation-add{font-size:10px;color:var(--ui-muted);height:100%;padding-left:8px}.animation-help{margin:8px 0 0;font-size:10px;color:var(--ui-muted);line-height:1.6}
.animation-previewing{outline:2px solid var(--ui-accent);outline-offset:2px;pointer-events:none}
/* Keyframe tracks, grouped property rows and the on-canvas motion path editor. */
.animation-properties{flex-direction:column;align-items:stretch;gap:8px;max-height:132px;overflow:auto}
.animation-group{display:flex;align-items:end;gap:8px;flex-wrap:wrap}.animation-group+.animation-group{padding-top:8px;border-top:1px solid var(--ui-border)}
.animation-group .input{min-height:28px;padding:4px 7px}.animation-group label{min-width:78px}.animation-group .btn{white-space:nowrap}
.animation-group-title{align-self:center;font-size:9px;letter-spacing:1.2px;text-transform:uppercase;color:var(--ui-muted);min-width:92px}
.keyframe-chips{display:flex;gap:4px;align-self:center}.keyframe-chip{min-width:24px;height:24px;border:1px solid var(--ui-border);border-radius:6px;font-size:10px;background:var(--ui-surface)}.keyframe-chip[aria-pressed=true]{background:#f59e0b;border-color:#b45309;color:#111}
.animation-speed{display:flex;align-items:center;gap:5px;font-size:10px;color:var(--ui-muted)}.animation-speed .input{min-height:26px;padding:2px 4px;font-size:10px}
.animation-track{height:46px}.animation-track-list{max-height:138px}.animation-bar{top:4px;height:21px;padding:2px 6px}.animation-end{top:5px;height:19px}
.motion-span{position:absolute;top:31px;height:6px;min-width:3px;border-radius:3px;background:#f59e0b66;border:1px solid #d97706;cursor:ew-resize;touch-action:none}
.animation-lane:not(:has(.animation-bar)) .motion-span{top:20px}.animation-lane:not(:has(.animation-bar)) .keyframe-diamond{top:17px}
.keyframe-diamond{position:absolute;top:28px;width:12px;height:12px;margin-left:-6px;transform:rotate(45deg);background:#fbbf24;border:2px solid #b45309;border-radius:2px;cursor:ew-resize;touch-action:none;z-index:2;padding:0}
.keyframe-diamond.active{background:#fff;border-color:#635bff;box-shadow:0 0 0 2px #635bff55}.keyframe-diamond:focus-visible,.motion-span:focus-visible,.motion-handle:focus-visible{outline:2px solid var(--ui-accent);outline-offset:2px}
.motion-path-overlay{position:absolute;left:0;top:0;z-index:60;pointer-events:none}.motion-path-overlay.drawing{pointer-events:auto;cursor:crosshair;background:#635bff0d}
.motion-path-overlay svg{position:absolute;inset:0;overflow:visible}.motion-path-overlay polyline{fill:none;stroke:#635bff;stroke-width:2;stroke-dasharray:6 4}
.motion-ghost{position:absolute;border:2px dashed #635bff;border-radius:6px;background:#635bff14;transform-origin:center;pointer-events:none}
.motion-handle{position:absolute;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;border:2px solid #fff;background:#635bff;color:#fff;font:700 10px/1 system-ui,sans-serif;box-shadow:0 1px 4px #0006;cursor:grab;pointer-events:auto;touch-action:none;padding:0}
.motion-handle.active{background:#f59e0b;color:#111}.motion-handle:disabled{opacity:.5;cursor:not-allowed}.motion-path-overlay[hidden]{display:none}
/* Native motion-authoring timeline: shared keyframe rows, not an embedded compositor. */
.animation-dock{max-height:65vh;overflow-y:auto}
.timeline-tools{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:8px 0;font-size:10px}.timeline-tools label{display:flex;align-items:center;gap:5px}.timeline-tools .input{width:auto;padding:3px 6px;min-height:26px;font-size:10px}.timeline-tools span{color:var(--ui-muted);line-height:1.5}.timeline-tools input{accent-color:var(--ui-accent)}
.animation-ruler,.animation-track{grid-template-columns:220px minmax(280px,1fr);min-width:520px;width:var(--timeline-width,100%)}
.animation-track-list{min-width:var(--timeline-width,100%);max-height:210px}
.timeline-ruler-lane{position:relative;margin:0 6px;padding:0;text-align:left;color:var(--ui-muted);font-size:9px;cursor:crosshair;touch-action:none}.timeline-ruler-lane span{position:absolute;top:7px;transform:translateX(-50%)}.timeline-ruler-lane span:first-child{transform:none}
.animation-ruler>span,.timeline-object-name,.timeline-property-name{position:sticky;left:0;z-index:4;background:var(--ui-surface);min-width:0}
.timeline-object-name{display:flex;align-items:center;padding:0 6px}.timeline-object-name .animation-track-name{flex:1;min-width:0}.timeline-expand,.timeline-expand-spacer{flex:none;width:22px}.timeline-expand{height:28px;border-radius:4px;font-size:14px;color:var(--ui-muted)}
.timeline-property-track{height:32px}.timeline-property-name{display:flex;align-items:center;justify-content:space-between;padding:0 12px 0 36px;gap:6px;font-size:10px}.timeline-property-name button{text-align:left;color:var(--ui-muted);padding:4px 0}.timeline-property-name output{font-variant-numeric:tabular-nums;font-size:9px;white-space:nowrap;color:var(--ui-muted)}
.timeline-property-track .animation-lane .keyframe-diamond{top:10px}.timeline-property-track .animation-lane{background-color:var(--ui-soft)}
.timeline-object .animation-lane{background-size:var(--timeline-grid,20%) 100%}
.timeline-key-controls{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding-top:6px}.timeline-easing{display:flex;align-items:center;gap:8px;margin:0 0 0 8px;color:var(--ui-muted);font-size:9px}.timeline-easing svg{width:90px;height:38px;overflow:visible;background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:4px}.timeline-easing polyline{stroke:var(--ui-accent);stroke-width:2;fill:none}
.timeline-expand:focus-visible,.timeline-ruler-lane:focus-visible,.timeline-property-name button:focus-visible{outline:2px solid var(--ui-accent);outline-offset:2px}
[data-animation-toggle][aria-expanded=true]{background:var(--ui-accent-soft);border-color:var(--ui-accent)}
@media(max-width:800px){.animation-dock{position:relative;inset:auto;margin-top:12px}.stage.animation-pane-open{padding-bottom:0}.animation-pane-open .author-viewport{height:40vh;flex:auto}.animation-pane-open .animation-workspace-scroll{max-height:40vh;flex:auto}.animation-seek{flex-wrap:wrap}.animation-seek span{max-width:none}.animation-track-list{max-height:115px}}
:root{--ui-bg:#f5f6f8;--ui-surface:#fff;--ui-soft:#eef0f4;--ui-text:#20242c;--ui-muted:#596375;--ui-accent:#5148cf;--ui-accent-soft:#eeecfc;--ui-border:#dce1e8;--ui-radius:8px;--ui-card-radius:12px;--ui-shadow:0 6px 24px #17192308;--ink:var(--ui-text);--muted:var(--ui-muted);--paper:var(--ui-bg);--line:var(--ui-border);--brand:var(--ui-accent);--accent:var(--ui-accent);color-scheme:light}
:root[data-ui-theme=dark]{--ui-bg:#111317;--ui-surface:#1a1d24;--ui-soft:#242831;--ui-text:#eef0f5;--ui-muted:#adb5c5;--ui-accent:#b5adff;--ui-accent-soft:#302c49;--ui-border:#343b47;--ui-shadow:0 12px 28px #00000026;color-scheme:dark}
body{background:var(--ui-bg);color:var(--ui-text);font-family:Inter,'Segoe UI',system-ui,sans-serif}
button,input,textarea,select{font-family:inherit}
button{transition:background-color .14s,border-color .14s,box-shadow .14s}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--ui-accent);outline-offset:3px}
[hidden]{display:none!important}
.btn{border:1px solid var(--ui-border);background:var(--ui-surface);color:var(--ui-text);border-radius:var(--ui-radius);min-height:36px;font-weight:600;box-shadow:none}
.btn:hover{background:var(--ui-soft);border-color:var(--ui-muted)}
.btn.primary,.btn.dark{background:#635bff;color:#fff;border-color:#635bff}
.btn.primary:hover,.btn.dark:hover{background:#5148e4;border-color:#5148e4}
.btn.danger{color:#d83854;background:var(--ui-surface)}
.icon-button{color:var(--ui-muted);border-radius:8px;min-width:34px;min-height:34px}
.icon-button:hover{color:var(--ui-text);background:var(--ui-soft)}
.input{background:var(--ui-surface);color:var(--ui-text);border-color:var(--ui-border);border-radius:8px;min-height:36px}
.sidebar{width:224px;background:var(--ui-surface);color:var(--ui-text);border-right:1px solid var(--ui-border);padding:28px 18px}
.main{margin-left:224px}
.logo{margin:0 0 38px;padding:0 10px}
.spectrum-brand{display:inline-flex;align-items:center;gap:9px;text-align:left;font-size:21px;font-weight:700;letter-spacing:-.7px;color:var(--ui-text)}
.spectrum-brand svg{width:32px;height:32px;flex:none}
.spectrum-brand small{display:block;font-size:10px;color:var(--ui-muted);font-weight:500;letter-spacing:.2px;margin-top:2px}
.workspace-label{color:var(--ui-muted);font-size:10px;letter-spacing:1.4px;margin:0 12px 12px}
.side-nav{gap:6px}.side-nav button,.side-nav .lab-nav{color:var(--ui-muted);padding:11px 12px;border-radius:9px;background:transparent;width:100%;font-size:13px;font-weight:550;display:flex;gap:12px;align-items:center;text-align:left;min-height:40px}
.side-nav button:hover{background:var(--ui-soft);color:var(--ui-text)}
.side-nav button.active{background:var(--ui-accent-soft);color:var(--ui-accent)}
.side-nav .badge{background:var(--ui-soft);color:var(--ui-muted)}
.sidebar-bottom{padding:0 6px}.pilot{background:var(--ui-soft);border:1px solid var(--ui-border);border-radius:12px;padding:16px;color:var(--ui-text)}
.pilot .mini{color:var(--ui-muted);font-size:9px;letter-spacing:1px}.pilot p{font-size:16px;line-height:1.5;font-weight:550}.pilot button{color:var(--ui-accent);font-size:11px}
.profile{border-color:var(--ui-border);color:var(--ui-text)}.profile small{color:var(--ui-muted)}
.avatar{background:var(--ui-accent-soft);color:var(--ui-accent);border:1px solid var(--ui-border);border-radius:10px}
.topbar,.preview-top{background:var(--ui-surface);border-bottom:1px solid var(--ui-border);color:var(--ui-text);min-height:68px;height:auto;padding:16px 30px;gap:16px;flex-wrap:wrap}
.top-actions{gap:9px;flex-wrap:wrap}.breadcrumbs,.local-label{color:var(--ui-muted)}.breadcrumbs strong{color:var(--ui-text)}.dot{background:#31a981}
.content{max-width:1480px;padding:34px 40px}.heading-row{gap:20px;margin-bottom:28px}.heading-row h1{font-family:inherit;font-size:30px;letter-spacing:-1.2px;line-height:1.2;font-weight:650}.heading-row p{color:var(--ui-muted);margin-top:10px;font-size:13px;line-height:1.6}.eyebrow{color:var(--ui-muted);font-size:10px;letter-spacing:1.4px;font-weight:600}
.workspace-overview{display:grid;grid-template-columns:1.2fr 1fr;gap:30px;background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:16px;padding:22px 28px;overflow:hidden}
.overview-mark .spectrum-brand{font-size:13px;letter-spacing:0}.overview-mark .spectrum-brand svg{width:22px;height:22px}.overview-mark small{display:none}.workspace-overview h2{font-family:inherit;font-size:25px;line-height:1.25;letter-spacing:-.8px;margin:20px 0 12px;max-width:400px}.workspace-overview p{color:var(--ui-muted);font-size:13px;line-height:1.7;max-width:400px;margin-bottom:22px}
.overview-composition{display:flex;align-items:center;justify-content:center;position:relative;min-height:230px;background:radial-gradient(ellipse at 75% 35%,#45cbe822,transparent 60%),radial-gradient(ellipse at 30% 60%,#9868f722,transparent 65%);border-radius:12px}
.mini-canvas{border:1px solid var(--ui-border);background:var(--ui-surface);box-shadow:0 16px 32px #37335a12;padding:22px;width:240px;transform:rotate(-5deg);border-radius:12px;position:relative}.mini-chip{font-size:8px;letter-spacing:1.5px;color:var(--ui-muted)}.mini-canvas b{display:block;margin:18px 0;color:var(--ui-text);font-size:25px;line-height:1.2;letter-spacing:-1px}.mini-canvas i{width:36px;height:36px;position:absolute;right:-16px;top:38px;background:linear-gradient(140deg,#635bff,#9868f7,#45cbe8);border-radius:10px;transform:rotate(16deg)}.mini-canvas em{font-style:normal;font-size:9px;color:var(--ui-muted)}.composition-label{position:absolute;bottom:9px;right:10px;font-size:10px;color:var(--ui-muted)}
.workspace-summary{display:flex;align-items:center;gap:24px;margin:24px 0 32px;padding:0 2px;font-size:12px;color:var(--ui-muted)}.workspace-summary strong{color:var(--ui-text);font-weight:650}.tenant-context{margin-left:auto;border:1px solid var(--ui-border);padding:6px 10px;border-radius:7px;font-size:11px}
.section-bar h2{font-size:18px;font-family:inherit;letter-spacing:-.4px}.filter-row{gap:9px;flex-wrap:wrap}.project-sort{width:150px;font-size:12px}.view-switch{display:flex;border:1px solid var(--ui-border);border-radius:8px;padding:2px;background:var(--ui-surface)}.view-switch [aria-pressed=true]{background:var(--ui-accent-soft);color:var(--ui-accent)}
.tabs{border-color:var(--ui-border);margin-bottom:22px}.tabs button{color:var(--ui-muted);font-size:12px}.tabs button.active{color:var(--ui-accent);border-color:var(--ui-accent)}
.course-grid{gap:20px;grid-template-columns:repeat(3,minmax(0,1fr))}.course-card{border:1px solid var(--ui-border);border-radius:14px;background:var(--ui-surface);box-shadow:none;overflow:hidden;transition:box-shadow .15s,border-color .15s}.course-card:hover{transform:none;box-shadow:var(--ui-shadow);border-color:var(--ui-accent)}.card-link{color:var(--ui-text);width:100%}.cover{height:180px;margin:10px;border-radius:8px;position:relative;overflow:hidden;padding:22px;background:var(--cover)}.cover:after{content:'';position:absolute;width:130px;height:130px;border:20px solid currentColor;opacity:.09;right:-25px;bottom:-50px;border-radius:50%}.cover-title{font-family:inherit;font-weight:650;font-size:24px;letter-spacing:-.8px;line-height:1.15;position:relative;z-index:1}.cover-tag{font-size:8px;letter-spacing:1px}.card-body{padding:12px 20px 16px}.card-body h3{color:var(--ui-text);font-size:15px;letter-spacing:-.2px}.card-desc{font-size:12px;color:var(--ui-muted);line-height:1.6}.card-meta{font-size:10px;color:var(--ui-muted);gap:8px;flex-wrap:wrap}.status{background:var(--ui-soft);color:var(--ui-muted);font-size:10px;border-radius:6px}.status.review{background:var(--ui-accent-soft);color:var(--ui-accent)}.status.approved{background:#dff5e9;color:#216447}.card-foot{border-top:1px solid var(--ui-border);padding-top:12px!important}.card-foot button{color:var(--ui-accent);font-size:11px}
.project-list{grid-template-columns:1fr}.project-list .course-card{display:flex;align-items:center}.project-list .card-link{display:flex;align-items:center;flex:1;text-align:left}.project-list .cover{width:130px;height:96px;flex:none;padding:12px}.project-list .cover-title{font-size:16px}.project-list .cover-tag{display:none}.project-list .card-body{flex:1}.project-list .card-desc{margin:5px 0}.project-list .card-foot{border:0;flex:none;padding:12px 20px!important;display:flex;gap:16px}.prototype-note{color:var(--ui-muted);background:transparent;border:0;font-size:11px;line-height:1.6}
.editor-top{padding:12px 18px;gap:12px}.editor-title{min-width:0}.editor-title strong{font-size:13px;color:var(--ui-text)}.editor-title small{color:var(--ui-muted)}.studio-wordmark{display:flex;text-decoration:none;margin-right:16px;padding-right:16px;border-right:1px solid var(--ui-border)}.studio-wordmark .spectrum-brand{font-size:16px}.studio-wordmark svg{width:24px;height:24px}.studio-wordmark small{font-size:8px}.editor{grid-template-columns:220px minmax(0,1fr) 280px;min-height:calc(100vh - 74px);background:var(--ui-bg)}.page-panel,.inspector{background:var(--ui-surface);border-color:var(--ui-border);color:var(--ui-text);padding:20px 16px}.panel-label{color:var(--ui-muted);font-size:10px;letter-spacing:1px}.page-item{border-radius:8px;color:var(--ui-muted);font-size:12px;padding:11px 9px}.page-item.active{background:var(--ui-accent-soft);color:var(--ui-accent);border-color:transparent}.page-num{color:var(--ui-muted)}.page-tools{border-color:var(--ui-border)}.panel-note,.help,.studio-helper{color:var(--ui-muted);font-size:11px;line-height:1.6}.inspector h3{font-size:15px;letter-spacing:-.3px}.inspector .field label{color:var(--ui-muted);font-size:11px}.inspector .input{font-size:12px}.inspector-actions{border-color:var(--ui-border)}
.studio-mode-switch{display:flex;gap:2px;padding:3px;border:1px solid var(--ui-border);border-radius:9px;background:var(--ui-soft)}.studio-mode-switch .btn{border:0;background:transparent;min-height:28px;font-size:11px;padding:6px 10px;color:var(--ui-muted)}.studio-mode-switch [aria-pressed=true]{background:var(--ui-surface);color:var(--ui-accent);box-shadow:0 1px 3px #17192312}.studio-library-tools{display:flex;gap:7px;margin:16px 0}.studio-library-tools .btn{font-size:11px;flex:1;padding:7px}
.stage{padding:20px;background:var(--ui-bg)}.stage-toolbar{color:var(--ui-muted)}.studio-tools,.author-toolbar{background:var(--ui-surface);border-color:var(--ui-border);border-radius:12px;padding:12px;color:var(--ui-text);box-shadow:none}.studio-layout-badge{background:var(--ui-accent-soft);color:var(--ui-accent);border-radius:7px}.studio-settings summary,.studio-insert-menu summary{color:var(--ui-muted);border-color:var(--ui-border);background:var(--ui-surface);border-radius:8px}.studio-settings-grid,.studio-import-popover{background:var(--ui-surface);border-color:var(--ui-border)}.studio-section{border-color:var(--ui-border)}.studio-section h3{color:var(--ui-text)}.author-viewport{background-color:var(--ui-soft);border-color:var(--ui-border);border-radius:12px}.devices{background:var(--ui-surface);border-color:var(--ui-border);color:var(--ui-muted)}.devices button{color:var(--ui-muted)}.devices button.active{background:var(--ui-accent-soft);color:var(--ui-accent)}.author-toolbar .input{background:var(--ui-surface);color:var(--ui-text);border-color:var(--ui-border)}.author-tool-group,.author-align-group{border-color:var(--ui-border)}.author-toolbar button{color:var(--ui-text)}.author-toolbar button.active{background:var(--ui-accent-soft);color:var(--ui-accent)}.author-toolbar details>div{background:var(--ui-surface);color:var(--ui-text);border-color:var(--ui-border)}
.layer-row,.layer-root{color:var(--ui-text);border-color:var(--ui-border)}.layer-row.selected,.layer-row.active{background:var(--ui-accent-soft)}.layer-name,.layer-meta{color:var(--ui-muted)}.layer-notice{background:var(--ui-soft);color:var(--ui-muted)}
:root[data-studio-mode=simple] [data-advanced],:root[data-studio-mode=simple] .studio-tools-top>[data-scene-action],:root[data-studio-mode=simple] .studio-tools-top>[data-studio-action=variables]{display:none}
:root[data-studio-mode=simple] .inspector:after{content:'Need precise layout or motion controls? Switch to Advanced above.';display:block;margin-top:22px;padding:12px;background:var(--ui-soft);border-radius:8px;font-size:11px;line-height:1.6;color:var(--ui-muted)}
dialog{background:var(--ui-surface);color:var(--ui-text);border:1px solid var(--ui-border);border-radius:16px;box-shadow:0 24px 90px #13151e33;width:min(800px,calc(100vw - 32px));max-height:88vh;padding:28px}dialog::backdrop{background:#13151e66;backdrop-filter:blur(3px)}dialog h2{font-family:inherit;letter-spacing:-.7px;font-size:24px}.dialog-desc{color:var(--ui-muted)}.dialog-foot{border-color:var(--ui-border);position:sticky;bottom:-28px;background:var(--ui-surface);padding:18px 0;margin-top:24px}.finding{background:var(--ui-soft);color:var(--ui-text);border:1px solid var(--ui-border);border-radius:10px}.finding.ok{background:#e9f8ef;color:#216447}
.component-catalog{margin-top:20px}.catalog-search{max-width:440px;margin-bottom:26px}.catalog-search label{display:block;font-size:11px;margin-bottom:8px;color:var(--ui-muted)}.component-category{margin-bottom:26px}.component-category h3{font-size:12px;font-weight:650;margin-bottom:12px;color:var(--ui-text)}.component-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.component-card{display:flex;flex-direction:column;align-items:stretch;text-align:left;background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:12px;padding:10px;color:var(--ui-text);min-width:0}.component-card:hover{border-color:var(--ui-accent);box-shadow:var(--ui-shadow)}.component-thumb{height:100px;display:flex;justify-content:center;background:var(--ui-soft);border-radius:7px;margin-bottom:12px}.component-thumb svg{width:112px;fill:none;stroke:var(--ui-accent);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}.component-card strong{font-size:12px;margin:0 4px 7px}.component-card>span:not(.component-thumb){font-size:11px;line-height:1.6;color:var(--ui-muted);margin:0 4px 12px}.component-card small{font-size:9px;color:var(--ui-accent);margin:auto 4px 5px}.roadmap-note{display:flex;flex-direction:column;gap:7px;background:var(--ui-soft);border:1px dashed var(--ui-border);border-radius:10px;padding:16px;color:var(--ui-muted);font-size:11px;line-height:1.6}
.round-row,.review-panel,.theme-card,.library-card{background:var(--ui-surface);color:var(--ui-text);border-color:var(--ui-border);border-radius:12px}.round-row p{color:var(--ui-muted)}.review-layout{grid-template-columns:minmax(0,1fr) 320px;gap:24px;margin-top:16px}.review-layout .preview-wrap{max-width:none}.review-panel{padding:22px}.review-hint{background:var(--ui-soft);color:var(--ui-muted);border-radius:8px;font-size:11px;line-height:1.6}.comment{border-color:var(--ui-border);color:var(--ui-text)}.comment-meta span,.comment small{color:var(--ui-muted)}.reply{background:var(--ui-soft);border-color:var(--ui-border)}.feedback-collapsed{grid-template-columns:1fr}.feedback-collapsed>.review-panel{display:none}
.publish-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:22px 0}.publish-steps>div{border:1px solid var(--ui-border);border-radius:12px;padding:16px}.publish-steps span{display:block;color:var(--ui-accent);font-size:11px;margin-bottom:14px}.publish-steps strong{display:block;font-size:13px}.publish-steps p{color:var(--ui-muted);font-size:11px;line-height:1.7;margin-top:8px}.portable-exports{margin-top:20px;color:var(--ui-muted);font-size:12px}.portable-exports summary{cursor:pointer;padding:12px 0}.lab-hero{background:var(--ui-soft);border-radius:12px;padding:24px;margin:22px 0}.lab-hero h3{margin:12px 0;font-size:21px;letter-spacing:-.5px}.lab-hero p{color:var(--ui-muted);font-size:13px;line-height:1.7}.lab-starters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}.lab-starters span{font-size:11px;border:1px solid var(--ui-border);padding:8px 10px;border-radius:8px;color:var(--ui-muted)}
.account-bar{background:var(--ui-surface);color:var(--ui-muted);border-bottom:1px solid var(--ui-border);font-size:11px;padding:8px 20px}.account-bar .btn{background:var(--ui-surface);color:var(--ui-text);border-color:var(--ui-border);font-size:10px;min-height:30px}.account-bar .btn:hover{background:var(--ui-soft);color:var(--ui-text)}.auth-wrap{background:var(--ui-bg);color:var(--ui-text)}.auth-card{background:var(--ui-surface);border-color:var(--ui-border);border-radius:16px;color:var(--ui-text)}.auth-card p{color:var(--ui-muted)}
@media(min-width:1600px){.course-grid:not(.project-list){grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1200px){.editor{grid-template-columns:190px minmax(0,1fr) 250px}.content{padding:28px}.course-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.project-list{grid-template-columns:1fr}.studio-wordmark{display:none}.editor-top .local-label{display:none}.workspace-overview{padding:26px}}
@media(max-width:950px){.sidebar{width:76px;padding:24px 10px}.main{margin-left:76px}.sidebar .spectrum-brand>span,.sidebar .pilot,.sidebar .profile>div,.sidebar .workspace-label{display:none}.sidebar .logo{padding:0 10px}.side-nav .lab-nav{font-size:0}.side-nav .lab-nav:before{content:'◇';font-size:18px}.editor{grid-template-columns:180px minmax(0,1fr)}.inspector{grid-column:1/-1;max-height:none}.workspace-overview{grid-template-columns:1fr 1fr}.workspace-summary{flex-wrap:wrap;gap:12px}.tenant-context{margin-left:0}.section-bar{align-items:flex-start;gap:16px;flex-wrap:wrap}.review-layout{grid-template-columns:1fr}.component-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.content{padding:22px 16px}.heading-row{align-items:flex-start;flex-direction:column}.heading-row h1{font-size:25px}.workspace-overview{grid-template-columns:1fr;padding:22px}.overview-composition{display:none}.course-grid{grid-template-columns:1fr}.topbar,.preview-top{padding:12px 16px}.topbar .avatar,.topbar .local-label{display:none}.sidebar{width:60px;padding:20px 4px}.main{margin-left:60px}.logo{padding:0}.sidebar .logo{padding:0 10px}.spectrum-brand svg{width:26px}.side-nav button{padding:10px}.editor{grid-template-columns:1fr}.page-panel{max-height:280px;overflow:auto}.stage{padding:10px}.inspector{grid-column:auto}.project-list .course-card{display:block}.project-list .card-foot{padding:12px 20px!important}.publish-steps{grid-template-columns:1fr}.component-cards{grid-template-columns:1fr 1fr}.component-card{padding:8px}.component-card>span:not(.component-thumb){font-size:10px}.component-thumb{height:80px}.filter-row .search{width:100%}.filter-row{width:100%}.review-panel{width:auto}.editor-title{width:100%}.studio-mode-switch{order:-1}.account-bar{padding:10px}}
.pilot p{color:var(--ui-text)}.layer-row button,.layer-row button[aria-pressed=true]{color:var(--ui-text)}.layer-hint{color:var(--ui-muted)}.layer-options[open]>div,.drawing-picker{background:var(--ui-surface);border-color:var(--ui-border);color:var(--ui-text)}.author-toolbar .author-popover{background:var(--ui-surface);border-color:var(--ui-border);color:var(--ui-text)}.author-toolbar .author-popover p,.author-align-hint,.author-brush span{color:var(--ui-muted)}.author-shapes summary{border-color:var(--ui-border)}
.author-toolbar button,.author-toolbar select{background:var(--ui-surface);border-color:var(--ui-border);color:var(--ui-text)}.author-toolbar button[aria-pressed=true],.author-toolbar button[aria-pressed=true]:hover{background:var(--ui-accent-soft);color:var(--ui-accent);border-color:var(--ui-accent)}.author-toolbar button:not(:disabled):hover{background:var(--ui-soft);border-color:var(--ui-accent)}.studio-tools .btn[data-action=add-block]{background:#635bff;color:#fff;border-color:#635bff}
.review-version-label{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--ui-muted)}.review-version-label select{width:220px;font-size:11px}.review-avatar{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;background:var(--ui-accent-soft);color:var(--ui-accent)!important;border-radius:8px;font-size:11px;font-weight:650;flex:none}.comment-meta{align-items:center;gap:8px}.comment-meta>span:last-child{margin-left:auto}
.publish-readiness{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:22px 0}.publish-readiness>div{padding:14px;border:1px solid var(--ui-border);border-radius:10px}.publish-readiness strong{display:block;font-size:12px;margin-bottom:8px}.publish-readiness span{display:block;font-size:11px;line-height:1.6;color:var(--ui-muted)}dialog label:has(>#scorm-version),dialog label:has(>#scorm-activity),dialog label:has(>#scorm-passing){display:grid;gap:8px;margin:16px 0;font-size:12px;color:var(--ui-muted)}dialog #scorm-version,dialog #scorm-activity,dialog #scorm-passing{padding:10px 12px;width:100%;border:1px solid var(--ui-border);border-radius:8px;background:var(--ui-surface);color:var(--ui-text)}.auth-wrap{max-width:520px;margin:8vh auto;padding:32px;background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:16px}.auth-wrap>.eyebrow{margin-bottom:24px}.auth-wrap h1{font-size:27px;letter-spacing:-.8px}
@media(max-width:640px){.publish-readiness{grid-template-columns:1fr}.auth-wrap{margin:20px 16px;padding:24px}.review-version-label{width:100%}.review-version-label select{width:100%}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
:root[data-ui-theme=dark] .workspace-overview{background:linear-gradient(125deg,#1d2030,var(--ui-surface) 65%)}
:root[data-ui-theme=dark] :is(.input,.author-toolbar select){background:#141720}
:root[data-ui-theme=dark] :is(.input,.author-toolbar select):focus{border-color:var(--ui-accent)}
:root[data-ui-theme=dark] .blocks-picker button{background:var(--ui-soft);color:var(--ui-text);border:1px solid var(--ui-border)}
:root[data-ui-theme=dark] .blocks-picker button:hover{border-color:var(--ui-accent);background:var(--ui-accent-soft)}
:root[data-ui-theme=dark] .finding.ok{background:#17362a;border-color:#2c5844;color:#a0e5bc}
:root[data-ui-theme=dark] .status.approved{background:#17362a;color:#a0e5bc}
:root[data-ui-theme=dark] .subtle{color:var(--ui-muted)}
/* The workspace is dark; authored learning is not automatically rethemed. */
.learner-content{color-scheme:light}
.alpha-image{display:block;max-width:100%;max-height:380px;object-fit:contain;border:1px solid var(--ui-border);border-radius:10px;margin:16px 0;background:var(--ui-soft)}.alpha-consent{display:flex;align-items:flex-start;gap:8px;font-size:12px;line-height:1.6;margin:14px 0;color:var(--ui-text)}.alpha-screenshot-tools,.alpha-inbox-tools{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:16px 0}.alpha-context{margin:16px 0;font-size:12px;color:var(--ui-muted)}.alpha-context summary{cursor:pointer}.alpha-context pre{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--ui-soft);padding:14px;border-radius:10px;font-size:11px}.alpha-error{color:#ff8d8d;font-size:12px}.alpha-report{display:block;width:100%;text-align:left;padding:16px;margin:12px 0;border:1px solid var(--ui-border);border-radius:10px;background:var(--ui-surface);color:var(--ui-text)}.alpha-report:hover{border-color:var(--ui-accent);background:var(--ui-soft)}.alpha-report span{display:block;font-size:11px;color:var(--ui-muted);margin:8px 0}.alpha-report p{font-size:12px;line-height:1.6}.alpha-report-details{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.7;font-size:13px;margin-bottom:22px}
.template-picker{border:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0}.template-picker legend{font-size:14px;font-weight:700;margin-bottom:12px}
.template-choice{position:relative;display:grid;gap:8px;padding:14px;border:1px solid var(--ui-border);border-radius:12px;cursor:pointer;font-size:12px;line-height:1.5}.template-choice:has(input:checked){outline:2px solid var(--ui-accent,#635bff);background:#635bff0d}.template-choice input{position:absolute;right:12px;top:12px}.template-choice small{color:var(--ui-muted)}
.template-art{height:70px;background:#e7e2ff;border-radius:6px;padding:12px;display:flex;gap:8px}.template-art i{display:block;background:#635bff;border-radius:3px;flex:1;opacity:.8}.template-scroll .template-art{background:#f3dfc8;flex-direction:column}.template-scroll .template-art i{background:#865b3a}.template-explore .template-art{background:#b3f2e6}.template-explore .template-art i{background:#176b72;border-radius:12px}.template-blank .template-art{background:#e8eaf1}.template-blank .template-art i{border:1px dashed #8890a3;background:transparent}
.type-preview{margin:16px 0;background:white;color:var(--course-color)}.type-preview .canvas-content{padding:20px}.type-preview p{margin:14px 0}
@media(max-width:600px){.template-picker{grid-template-columns:1fr}}
dialog:has(.template-picker){max-width:980px}.template-picker{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:900px){.template-picker{grid-template-columns:1fr 1fr}}@media(max-width:600px){.template-picker{grid-template-columns:1fr}}
/* Explicit grid slots let either panel disappear without moving the stage into the wrong column. */
.edit-shell>.editor{--studio-pages-width:220px;--studio-inspector-width:280px;--studio-pages-column:var(--studio-pages-width);--studio-inspector-column:var(--studio-inspector-width);grid-template-columns:var(--studio-pages-column) minmax(0,1fr) var(--studio-inspector-column)}
.edit-shell>.editor[data-pages-collapsed=true]{--studio-pages-column:44px}
.edit-shell>.editor[data-inspector-collapsed=true]{--studio-inspector-column:44px}
.editor>.page-panel,.editor>.editor-panel-rail-pages{grid-column:1;grid-row:1}
.editor>.stage{grid-column:2;grid-row:1}
.editor>#inspector,.editor>.editor-panel-rail-inspector{grid-column:3;grid-row:1}
.editor-panel-controls{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin:0 0 10px;padding:0 12px;color:var(--ui-muted);min-height:32px;flex:none}
.editor-panel-controls>div{display:flex;gap:5px;flex-wrap:wrap}.editor-panels-label{font-size:10px;letter-spacing:.5px}
.editor-panel-controls .btn{min-height:30px;padding:5px 8px;font-size:10px}.editor-panel-controls svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6}
.editor-panel-controls [aria-expanded=false],.editor-panel-controls [aria-pressed=true]{background:var(--ui-accent-soft);color:var(--ui-accent);border-color:var(--ui-accent)}
.editor-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 16px;color:var(--ui-muted);font-size:11px;font-weight:600}
.editor-panel-heading .icon-button{font-size:23px;min-width:30px;width:30px;min-height:30px;height:30px}
.editor-panel-rail{background:var(--ui-surface);border:1px solid var(--ui-border);border-top:0;min-width:0;align-self:stretch}
.editor-panel-rail>button{position:sticky;top:12px;width:100%;min-height:150px;display:flex;align-items:center;gap:12px;padding:12px 8px;writing-mode:vertical-rl;font-size:11px;color:var(--ui-muted)}
.editor-panel-rail>button>span:first-child{font-size:24px;writing-mode:horizontal-tb;line-height:1}.editor-panel-rail>button:hover{background:var(--ui-accent-soft);color:var(--ui-accent)}
@media(max-width:1200px){.edit-shell>.editor{--studio-pages-width:190px;--studio-inspector-width:250px}}
@media(max-width:950px){.edit-shell>.editor{--studio-pages-width:180px;grid-template-columns:var(--studio-pages-column) minmax(0,1fr)}.editor>#inspector,.editor>.editor-panel-rail-inspector{grid-column:1/-1;grid-row:2}.editor-panel-rail-inspector>button{position:static;writing-mode:horizontal-tb;min-height:44px;justify-content:center}.editor-panel-rail-inspector>button>span:first-child{transform:rotate(-90deg)}}
@media(max-width:640px){.edit-shell>.editor{grid-template-columns:minmax(0,1fr)}.editor>.page-panel,.editor>.editor-panel-rail-pages{grid-column:1;grid-row:1}.editor>.stage{grid-column:1;grid-row:2}.editor>#inspector,.editor>.editor-panel-rail-inspector{grid-column:1;grid-row:3}.editor-panel-rail-pages>button{position:static;writing-mode:horizontal-tb;min-height:44px;justify-content:center}.editor-panel-rail-pages>button>span:first-child{transform:rotate(90deg)}.editor-panels-label{display:none}.editor-panel-controls{padding:0}}
.vector-pen-tools{color:var(--ui-text)}.vector-pen-tools>span{color:var(--ui-muted)}.vector-pen-tools button{border:1px solid var(--ui-border);border-radius:6px;padding:7px 9px}.vector-pen-tools button:hover{background:var(--ui-accent-soft);color:var(--ui-accent)}
/* Workspace splitters overlay panel edges without taking another grid column. */
.workspace-resizer{position:relative;z-index:120;touch-action:none;user-select:none;outline-offset:-2px}
.workspace-resizer[hidden]{display:none!important}
.workspace-resizer-pages,.workspace-resizer-inspector{position:sticky;top:8px;grid-row:1;width:10px;height:calc(100vh - 100px);cursor:col-resize;align-self:start}
.workspace-resizer-pages{grid-column:1;justify-self:end;margin-right:-5px}
.workspace-resizer-inspector{grid-column:3;justify-self:start;margin-left:-5px}
.workspace-resizer>span{position:absolute;background:var(--ui-border);border-radius:4px;transition:background .1s}
.workspace-resizer-pages>span,.workspace-resizer-inspector>span{top:80px;left:3px;width:4px;height:42px}
.workspace-resizer:hover>span,.workspace-resizer:focus-visible>span{background:var(--ui-accent)}
.workspace-resizer:focus-visible{outline:2px solid var(--ui-accent)}
.workspace-resizer-timeline{position:sticky;top:0;z-index:4;height:10px;cursor:row-resize;background:var(--ui-surface)}
.workspace-resizer-timeline>span{left:calc(50% - 22px);top:3px;width:44px;height:4px}
.animation-dock{height:var(--studio-timeline-height,auto)}
[data-workspace-resizing],[data-workspace-resizing] *{user-select:none!important;cursor:col-resize!important}
[data-workspace-resizing=timeline],[data-workspace-resizing=timeline] *{cursor:row-resize!important}
@media(max-width:950px){.workspace-resizer-inspector{display:none}}
@media(max-width:640px){.workspace-resizer-pages{display:none}}
.animation-start-policy{display:flex;align-items:center;gap:10px;margin:8px 0;color:var(--ui-muted)}.animation-start-policy .input{width:auto;max-width:240px;padding:6px;font-size:11px}
.shape-format-island{position:fixed;z-index:150;display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 12px;border:1px solid var(--ui-border);border-radius:14px;background:var(--ui-surface);color:var(--ui-text);box-shadow:0 8px 30px #0005;font-size:10px}
.shape-format-island[hidden]{display:none}.shape-format-island label{display:flex;align-items:center;gap:5px;margin:0}.shape-format-island input{background:var(--ui-input);color:var(--ui-text);border:1px solid var(--ui-border);border-radius:5px;min-height:28px}.shape-format-island input[type=color]{width:30px;padding:2px}.shape-format-island input[type=number]{width:56px;padding:4px}.shape-island-name{max-width:110px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600}.shape-island-upload{cursor:pointer}.shape-island-upload input{width:1px;height:1px;position:absolute;opacity:0}.shape-island-upload:focus-within{outline:2px solid var(--ui-accent);outline-offset:3px}
.rule-animation-note{grid-column:1/-1;margin:0}
.animation-dock:focus-visible,[data-shortcut-scope="preview"]:focus-visible{outline:2px solid var(--ui-accent,#9868f7);outline-offset:-3px}
.shortcut-guide{display:grid;gap:14px}.shortcut-guide section{padding:14px;border:1px solid var(--ui-border,#353644);border-radius:12px}.shortcut-guide h3{margin:0 0 8px}.shortcut-guide p{margin:8px 0;line-height:1.6}.shortcut-guide kbd{display:inline-block;border:1px solid var(--ui-border,#353644);border-radius:5px;padding:1px 6px;font:inherit;font-size:.9em;background:var(--ui-surface,#20212b)}.shortcut-focus-actions{display:flex;gap:8px;margin-top:16px}
.measurement-toolbar,.measurement-pagination{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:12px 0}.measurement-toolbar>span{color:var(--ui-muted);font-size:11px}.measurement-notice{padding:14px;border:1px solid var(--ui-border);border-radius:10px;background:var(--ui-soft);line-height:1.5}.measurement-notice p{margin-bottom:0}.measurement-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:16px 0}.measurement-cards>div{padding:14px;border:1px solid var(--ui-border);border-radius:10px;display:grid;gap:6px}.measurement-cards span{font-size:11px;color:var(--ui-muted)}.measurement-cards strong{font-size:24px}.measurement-table{overflow:auto}.measurement-table table{border-collapse:collapse;width:100%;font-size:12px}.measurement-table th,.measurement-table td{padding:10px;border-bottom:1px solid var(--ui-border);text-align:left;vertical-align:top}.measurement-table small{display:block;color:var(--ui-muted);margin-top:5px}.measurement-table th button{white-space:normal;text-align:left}dialog:has([data-reporting-root]){width:min(980px,95vw)}@media(max-width:480px){.measurement-cards{grid-template-columns:1fr}}
dialog:has([data-reporting-root]){width:min(980px,calc(100vw - 32px));max-width:min(980px,calc(100vw - 32px))}@media(min-width:800px){.measurement-cards{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* Studio rhythm. Author chrome only: never target authored canvas descendants.
   Proximity groups related actions; space separates tasks, not nested boxes. */
:root {
  --ui-space-1:4px; --ui-space-2:8px; --ui-space-3:12px;
  --ui-space-4:16px; --ui-space-6:24px; --ui-space-8:32px;
  --ui-font:'Segoe UI',system-ui,sans-serif;
  --ui-type-small:12px; --ui-type-body:14px; --ui-type-section:18px;
  --ui-control-height:40px; --ui-control-compact:36px;
  --ui-primary:#6257dc; --ui-primary-hover:#554ac8;
}
body { font-family:var(--ui-font); }
:is(.content,dialog) :is(h1,h2,h3,h4):not(.canvas *):not(.learner-content *):not(.type-preview *):not(.theme-preview *):not(.cover *) { font-family:var(--ui-font); }
:is(.heading-row,.section-bar,.workspace-resume,.component-category,.library-card,.theme-card,.review-panel,.auth-wrap,.shortcut-guide,.studio-section,.animation-pane) :is(h1,h2,h3):not(.canvas *):not(.type-preview *), dialog>h2 {
  font-family:var(--ui-font); font-weight:600; line-height:1.35; letter-spacing:-.02em;
}
:is(.topbar,.preview-top,.account-bar,.content,.page-panel,.inspector,.studio-tools,.author-toolbar,.editor-panel-controls,.animation-dock,.shape-format-island,.auth-wrap,dialog) .btn:not(.canvas *):not(.learner-content *):not(.type-preview *) {
  min-height:var(--ui-control-height); padding:8px 16px; font-size:var(--ui-type-small);
  line-height:1.4; border-radius:var(--ui-radius); font-weight:600; filter:none;
}
:is(.topbar,.preview-top,.account-bar,.page-panel,.inspector,.studio-tools,.author-toolbar,.editor-panel-controls,.animation-dock,.shape-format-island) .btn.small:not(.canvas *):not(.learner-content *):not(.type-preview *) {
  min-height:var(--ui-control-compact); padding:6px 12px;
}
:is(.topbar,.preview-top,.content,.page-panel,.inspector,.studio-tools,.auth-wrap,dialog) .input:not(.canvas *):not(.learner-content *):not(.type-preview *) {
  min-height:var(--ui-control-height); padding:8px 12px; font-size:13px; line-height:1.5;
}
:is(.topbar,.preview-top,.content,.page-panel,.inspector,.studio-tools,.auth-wrap,dialog) .input:not(.code-input):not(.canvas *):not(.learner-content *):not(.type-preview *) { font-family:var(--ui-font); }
:is(.topbar,.preview-top,.content,.studio-tools,.auth-wrap,dialog) .btn:is(.primary,.dark):not(.canvas *):not(.learner-content *):not(.type-preview *), .studio-tools .btn[data-action=add-block] {
  background:var(--ui-primary); border-color:var(--ui-primary); color:#fff;
}
:is(.topbar,.preview-top,.content,.studio-tools,.auth-wrap,dialog) .btn:is(.primary,.dark):not(.canvas *):not(.learner-content *):not(.type-preview *):hover, .studio-tools .btn[data-action=add-block]:hover {
  background:var(--ui-primary-hover); border-color:var(--ui-primary-hover);
}
.main { width:calc(100% - 224px); }
.content { padding:var(--ui-space-8); }
.heading-row { margin-bottom:var(--ui-space-6); }
.heading-row h1 { font-size:30px; margin:8px 0; }
.heading-row p { font-size:var(--ui-type-body); margin:0; }
.eyebrow,.workspace-label,.panel-label,.studio-menu-label { font-size:11px; letter-spacing:.08em; }
.sidebar { padding:24px 16px; overflow-y:auto; }
.sidebar .logo { margin-bottom:32px; }
.sidebar .workspace-label { margin-top:0; }
.side-nav { gap:4px; margin-bottom:24px; }
.side-nav button,.side-nav .lab-nav { min-height:44px; font-size:13px; line-height:1.4; }
.sidebar-bottom .pilot { padding:16px; margin-bottom:20px; background:transparent; border:0; border-top:1px solid var(--ui-border); border-radius:0; }
.sidebar-bottom .pilot p { font-size:14px; font-weight:500; }
.sidebar-bottom .pilot .mini { font-size:10px; }
.sidebar-bottom .profile { padding:0 8px 8px; }
.topbar,.preview-top { padding:12px 24px; gap:16px; }
.top-actions { gap:8px; min-width:0; }
.editor-title { flex:1 1 220px; }
.editor-title>div { min-width:0; }
.editor-title strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:360px; font-size:14px; }
.editor-title small { font-size:12px; }
.editor-top .studio-wordmark { margin-right:0; padding-right:12px; }
.account-bar { padding:8px 16px; gap:8px 16px; line-height:1.5; }
.account-bar .btn { font-size:12px; }
.workspace-resume { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:24px; border:1px solid var(--ui-border); border-radius:var(--ui-card-radius); background:var(--ui-surface); }
.workspace-resume>div { min-width:0; }
.workspace-resume h2 { font-size:20px; margin:8px 0; overflow-wrap:anywhere; }
.workspace-resume p { color:var(--ui-muted); font-size:13px; line-height:1.5; margin:0; }
.workspace-summary { margin:24px 0 32px; gap:24px; flex-wrap:wrap; font-size:12px; }
.tenant-context { border:0; padding:0; font-size:12px; overflow-wrap:anywhere; }
.section-bar { gap:16px; margin-bottom:16px; flex-wrap:wrap; }
.section-bar h2 { font-size:var(--ui-type-section); }
.filter-row { gap:8px; }
.project-sort { width:160px; }
.view-switch { padding:1px; }
.view-switch .icon-button { width:36px; height:36px; }
.tabs { margin-bottom:24px; overflow-x:auto; }
.tabs button { min-height:44px; padding:12px 16px; font-size:12px; white-space:nowrap; }
.course-grid,.theme-grid,.library-grid { gap:24px; align-items:stretch; }
.course-card { display:flex; flex-direction:column; border-radius:var(--ui-card-radius); }
.card-link { flex:1; display:flex; flex-direction:column; align-items:stretch; }
.card-body { flex:1; display:flex; flex-direction:column; padding:12px 20px 20px; }
.card-body h3 { font-family:var(--ui-font); font-size:16px; line-height:1.4; }
.card-desc { height:auto; flex:1; min-height:42px; font-size:13px; margin-bottom:16px; }
.card-meta { margin-top:auto; padding-top:16px; border-color:var(--ui-border); font-size:12px; }
.card-foot { margin:0 20px 16px; gap:8px; }
.card-foot button { font-size:12px; min-height:36px; }
.status { font-size:11px; }
.project-list .course-card,.project-list .card-link { flex-direction:row; }
.project-list .card-body { display:block; }
.project-list .card-desc { min-height:0; }
.project-list .card-foot { margin:0; }
.component-cards { gap:16px; }
dialog:has(.component-catalog) { width:min(960px,calc(100vw - 32px)); max-width:min(960px,calc(100vw - 32px)); }
.component-card { padding:16px; border-radius:var(--ui-card-radius); }
.component-card strong { font-size:14px; margin:0 0 8px; }
.component-card>span:not(.component-thumb) { font-size:12px; margin:0 0 16px; }
.component-card small { font-size:11px; margin:auto 0 0; }
.component-thumb { margin-bottom:16px; }
.component-category { margin-bottom:32px; }
.component-category h3 { font-size:16px; margin-bottom:16px; }
.catalog-search label { font-size:12px; }
.theme-card,.library-card,.review-panel { padding:24px; }
.theme-card p,.library-card p,.round-row p { font-size:13px; line-height:1.6; }
.library-card h3,.theme-card h3,.round-row h3 { font-family:var(--ui-font); font-size:16px; }
.stage { padding:16px; }
.module-full-stage .studio-tools,.module-full-stage .stage-toolbar { margin-left:0; margin-right:0; }
.editor-panel-controls { padding:0; margin-bottom:12px; gap:8px; }
.editor-panels-label { font-size:11px; letter-spacing:0; }
.editor-panel-controls>div { gap:8px; }
.editor-panel-controls .btn { font-size:11px; }
.page-panel,.inspector { padding:16px; }
.editor-panel-heading { padding-bottom:12px; margin-bottom:16px; border-bottom:1px solid var(--ui-border); font-size:12px; }
.panel-label { padding:0; margin-bottom:12px; }
.page-item { min-height:40px; margin-bottom:4px; gap:8px; }
.page-num { font-size:11px; }
.block-list { margin-top:24px; }
.block-item { min-height:36px; font-size:12px; }
.block-item.active { color:var(--ui-accent); background:var(--ui-accent-soft); }
.panel-note { margin:24px 0; }
.studio-section { margin-top:24px; padding-top:24px; }
.studio-section h3,.inspector h3 { font-size:14px; margin-bottom:16px; }
.inspector .field { margin-bottom:16px; }
.inspector .field label { font-size:12px; margin-bottom:8px; line-height:1.5; }
.studio-grid { gap:16px 12px; }
.studio-grid .field { margin-bottom:0; }
.panel-note,.help,.studio-helper { font-size:12px; line-height:1.6; }
.studio-tools-compact { padding:12px; margin-bottom:12px; border-radius:var(--ui-card-radius); }
.studio-tools-top { gap:8px; }
.studio-layout-badge { background:none; color:var(--ui-muted); font-weight:500; font-size:12px; padding-right:8px; }
.studio-settings summary,.studio-more-tools summary,.studio-utilities summary { display:flex; align-items:center; gap:8px; list-style:none; cursor:pointer; min-height:36px; padding:8px 12px; font-size:12px; line-height:1.4; border:1px solid var(--ui-border); border-radius:var(--ui-radius); background:var(--ui-surface); color:var(--ui-text); white-space:nowrap; }
.studio-more-tools summary:after,.studio-utilities summary:after { content:'⌄'; color:var(--ui-muted); }
.studio-settings summary::-webkit-details-marker,.studio-more-tools summary::-webkit-details-marker,.studio-utilities summary::-webkit-details-marker { display:none; }
.studio-settings[open]>summary,.studio-more-tools[open]>summary,.studio-utilities[open]>summary { background:var(--ui-accent-soft); border-color:var(--ui-accent); color:var(--ui-accent); }
.studio-more-tools,.studio-utilities { position:relative; }
.studio-more-tools[open],.studio-tools:has(.studio-more-tools[open]) { z-index:181; } /* Lift both stacking contexts above the fixed animation dock (170). */
.studio-utilities { z-index:180; }
.studio-tools-menu,.studio-utilities-menu { position:absolute; top:calc(100% + 8px); right:0; z-index:160; width:250px; max-width:calc(100vw - 32px); padding:8px; background:var(--ui-surface); border:1px solid var(--ui-border); border-radius:var(--ui-card-radius); box-shadow:0 12px 32px #0003; }
.studio-tools-menu>div { display:grid; gap:4px; padding:8px; }
.studio-tools-menu>div+div { border-top:1px solid var(--ui-border); margin-top:8px; padding-top:16px; }
.studio-menu-label { color:var(--ui-muted); font-size:10px; margin-bottom:8px; }
.studio-tools-menu .btn,.studio-utilities-menu .btn { width:100%; justify-content:flex-start; background:transparent; border-color:transparent; text-align:left; white-space:normal; }
.studio-tools-menu .btn:hover,.studio-utilities-menu .btn:hover { background:var(--ui-soft); }
.studio-tools-menu label.btn { cursor:pointer; }
.studio-utilities-menu .editor-panel-controls { display:block; border-bottom:1px solid var(--ui-border); padding:8px 0; margin:0 0 8px; }
.studio-utilities-menu .editor-panels-label { display:block; padding:4px 12px 8px; }
.studio-utilities-menu .editor-panel-controls>div { display:grid; gap:4px; }
.studio-utilities-menu .editor-panel-controls .btn { font-size:12px; }
.studio-utilities-menu .editor-panel-controls :is([aria-expanded=false],[aria-pressed=true]) { background:var(--ui-accent-soft); color:var(--ui-accent); }
.studio-settings-grid { gap:16px; padding:24px; border-radius:var(--ui-card-radius); }
.studio-settings-grid label { font-size:12px; margin-bottom:8px; }
.author-toolbar { margin:0 0 12px; padding:12px; font-size:12px; border-radius:var(--ui-card-radius); }
.author-main-row,.author-align-row { gap:12px 16px; }
.author-main-row { border-color:var(--ui-border); padding-bottom:12px; }
.author-align-row { padding-top:12px; }
.author-toolbar :is(button,select) { min-height:36px; height:auto; border-radius:var(--ui-radius); font-size:12px; }
.author-tool-group { gap:4px; flex-wrap:wrap; }
.author-selection-actions { gap:8px; }
.author-toolbar .author-alignment-buttons { gap:4px; flex-wrap:wrap; }
.author-alignment-buttons button { width:36px; padding:6px; }
.author-divider { background:var(--ui-border); margin:0 4px; }
.author-align-hint { font-size:11px; margin-left:auto; }
.author-options summary,.author-shapes summary { font-size:12px; min-height:36px; padding:8px 12px; border-radius:var(--ui-radius); }
.author-selection-actions [data-author-status] { color:var(--ui-muted); font-size:11px; }
.shape-format-island { font-size:12px; gap:12px; border-radius:var(--ui-card-radius); }
.shape-format-island input { min-height:32px; background:var(--ui-surface); }
.animation-pane { font-size:12px; padding:12px; }
.animation-dock { left:var(--studio-pages-column,0px); right:var(--studio-inspector-column,0px); height:var(--studio-timeline-height,min(340px,45vh,var(--animation-available-height,65vh))); box-shadow:0 -4px 16px #0002; }
.animation-pane header { gap:12px; position:sticky; top:10px; z-index:6; background:var(--ui-surface); padding-bottom:8px; }
.animation-settings { margin-bottom:4px; }
.animation-settings>summary { cursor:pointer; color:var(--ui-accent); font-size:12px; padding:4px 0; }
.animation-settings[open]>summary { margin-bottom:8px; }
.animation-pane .animation-seek { flex-wrap:wrap; gap:6px; margin:6px 0; }
.animation-pane .animation-seek [data-animation-status] { flex-basis:100%; max-width:none; font-size:11px; }
.animation-pane .timeline-tools>span { flex-basis:100%; font-size:11px; }
.animation-pane .timeline-tools { margin:6px 0; gap:8px; }
.animation-pane-open .author-viewport,.animation-pane-open .animation-workspace-scroll { height:var(--animation-workspace-height,180px); min-height:120px; }
.animation-pane label,.animation-start-policy .input { font-size:12px; }
.animation-properties { gap:12px; flex-wrap:nowrap; max-height:200px; overflow-x:hidden; overflow-y:auto; }
.animation-properties>.animation-group { flex:none; min-width:0; width:100%; }
.animation-properties .animation-group>p { flex-basis:100%; }
.animation-dock .input { font-size:12px; }
.measurement-toolbar,.measurement-pagination { gap:12px; margin:16px 0; }
.measurement-toolbar>span { font-size:12px; }
.measurement-cards { gap:16px; margin:24px 0; }
.measurement-cards>div { padding:20px; gap:8px; border-radius:var(--ui-card-radius); }
.measurement-cards span { font-size:12px; }
.measurement-cards strong { font-size:28px; font-weight:600; font-variant-numeric:tabular-nums; }
.measurement-notice { padding:16px; font-size:13px; line-height:1.6; }
.measurement-table table { font-size:13px; line-height:1.5; }
.measurement-table th,.measurement-table td { padding:16px 12px; }
.measurement-table thead { background:var(--ui-soft); }
.measurement-table th { font-weight:600; color:var(--ui-muted); }
.measurement-table small { font-size:12px; }
dialog { padding:24px; border-radius:var(--ui-card-radius); }
dialog>h2 { font-size:24px; margin-bottom:12px; }
dialog>.dialog-desc { font-size:14px; line-height:1.6; margin-bottom:24px; }
dialog>.field { margin-bottom:20px; }
dialog>.field>label { font-size:12px; margin-bottom:8px; }
.dialog-foot { bottom:-24px; padding:16px 0 0; margin-top:24px; gap:8px; flex-wrap:wrap; }
:root[data-studio-mode=simple] .studio-tools-menu :is([data-scene-action],[data-studio-action=variables]) { display:none; }
@media(max-width:1100px) {
  .editor-top .studio-wordmark { display:none; }
  .editor-top .local-label { display:none; }
}
@media(max-width:950px) {
  .main { width:calc(100% - 76px); }
  .sidebar .side-nav button { justify-content:center; }
  .sidebar .side-nav .lab-nav { font-size:0; gap:0; padding:12px; }
  .sidebar .side-nav [data-spectrum=alpha-inbox]:before { content:'F'; }
  .sidebar .side-nav [data-spectrum=reporting]:before { content:'M'; }
  .content { padding:24px; }
  .filter-row { flex-wrap:wrap; }
  .animation-dock { right:0; }
}
@media(max-width:800px) {
  .animation-dock { position:relative; left:auto; right:auto; height:var(--studio-timeline-height,320px); }
  .animation-pane-open .author-viewport,.animation-pane-open .animation-workspace-scroll { height:40vh; min-height:180px; }
}
@media(max-width:640px) {
  .main { width:calc(100% - 60px); }
  .content { padding:24px 16px; }
  .workspace-resume { align-items:flex-start; flex-direction:column; padding:20px; gap:16px; }
  .workspace-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
  .workspace-summary strong { display:block; margin-bottom:4px; font-size:20px; }
  .tenant-context { grid-column:1/-1; }
  .filter-row { width:100%; }
  .filter-row .search { width:100%; }
  .project-sort { flex:1; width:auto; }
  .topbar,.preview-top { padding:12px 16px; }
  .top-actions { max-width:100%; }
  .editor-title { width:auto; }
  .editor-title strong { max-width:calc(100vw - 100px); }
  .stage { padding:12px; }
  .author-main-row,.author-align-row { gap:8px; }
  .author-selection-actions { margin-left:0; }
  .author-align-hint { margin-left:0; flex-basis:100%; }
  .studio-tools-top { position:relative; }
  .studio-more-tools { position:static; }
  .studio-tools-menu { right:0; }
  .studio-settings-grid { grid-template-columns:1fr; padding:16px; }
  .component-cards { grid-template-columns:1fr; }
  .project-list .card-link { flex-direction:column; align-items:stretch; }
  .measurement-cards { gap:12px; }
  .measurement-cards>div { padding:16px; }
}

/* Canvas fullscreen is transient: browser Escape restores the ordinary workspace. */
.stage:fullscreen { width:100vw; height:100dvh; overflow:auto; padding:16px; background:var(--ui-bg); display:flex; flex-direction:column; }
.stage:fullscreen .animation-dock { left:0; right:0; }
.stage:fullscreen:not(.animation-pane-open) .author-viewport { flex:1; min-height:120px; height:auto; }
.stage:fullscreen>.studio-tools,.stage:fullscreen>.author-toolbar { flex:none; }
.stage:focus-visible { outline:2px solid var(--ui-accent); outline-offset:-3px; }
.hold-keyframe { transform:none; border-radius:1px; }
.shortcut-table { overflow-x:auto; }
.shortcut-table table { width:100%; border-collapse:collapse; font-size:12px; }
.shortcut-table th,.shortcut-table td { padding:10px 8px; border-bottom:1px solid var(--ui-border); text-align:left; line-height:1.5; }
.shortcut-table thead th { color:var(--ui-muted); font-weight:500; }
.channel-hold input { width:20px; height:20px; accent-color:var(--ui-accent); }

/* Organisation drafting is a review workspace, not an auto-publishing control. */
dialog:has([data-ai-root]) { width:min(1160px,94vw); max-width:94vw; }
.ai-draft-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:24px; margin-top:20px; }
.ai-draft-grid>section { min-width:0; display:flex; flex-direction:column; gap:10px; }
.ai-draft-grid label,.ai-settings>label { font-size:12px; font-weight:600; color:var(--ui-text); }
.ai-connection,.ai-settings,.ai-page { padding:16px; border:1px solid var(--ui-border); background:var(--ui-soft); border-radius:10px; }
.ai-connection p { margin:8px 0; }
.ai-settings { margin-top:12px; }
.ai-settings summary,.ai-page summary { cursor:pointer; font-weight:600; }
.ai-settings[open]>summary,.ai-page[open]>summary { margin-bottom:14px; }
.ai-settings .input,.ai-page .input { margin:6px 0 12px; }
.ai-consent { display:flex; align-items:flex-start; gap:10px; line-height:1.6; padding:12px 0; }
.ai-consent input { flex:none; width:18px; height:18px; margin-top:3px; accent-color:var(--ui-accent); }
.ai-chat { max-height:320px; overflow:auto; padding:4px; }
.ai-message { padding:14px; margin-bottom:12px; border-left:2px solid var(--ui-border); background:var(--ui-soft); border-radius:6px; }
.ai-message p { white-space:pre-wrap; overflow-wrap:anywhere; margin:8px 0 0; line-height:1.65; }
.ai-history { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.ai-history label { flex-basis:100%; }.ai-history select { flex:1; min-width:160px; }
[data-ai-proposal] { display:grid; gap:10px; }
.ai-page-body { min-height:180px; }
[data-ai-status]:not(:empty) { padding:12px; border:1px solid var(--ui-border); border-radius:8px; line-height:1.6; }
[data-ai-status][role=alert] { border-color:var(--ui-accent); }
@media(max-width:800px) { .ai-draft-grid { grid-template-columns:1fr; gap:28px; } }

dialog:has([data-publishing-root]) { width:min(1000px,94vw); max-width:94vw; }
.publish-config-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-bottom:16px; }
.publish-config-grid label { display:grid; gap:8px; font-size:12px; font-weight:600; }
.publish-findings { display:grid; gap:10px; padding:0; list-style:none; max-height:280px; overflow:auto; }
.publish-findings li { border:1px solid var(--ui-border); background:var(--ui-soft); padding:12px; border-radius:8px; }
.publish-findings p { margin:6px 0 0; line-height:1.6; }
[data-publish-analysis] { margin:20px 0; padding-top:12px; border-top:1px solid var(--ui-border); }
[data-publishing-root] .completion-choice { display:flex; align-items:flex-start; gap:10px; padding:8px 0; line-height:1.6; }
[data-publishing-root] .completion-choice input { flex:none; width:18px; height:18px; margin-top:3px; }
[data-publishing-root] fieldset { padding:16px; border:1px solid var(--ui-border); border-radius:8px; }
@media(max-width:650px) { .publish-config-grid { grid-template-columns:1fr; } }
/* Modeless media/component browsers share dock rhythm and never resize the canvas. */
.library-panel{display:grid;gap:16px;min-width:0}.library-panel h3{margin:0 0 8px;font-size:13px}.library-panel p{overflow-wrap:anywhere}.library-panel .field{margin:0;min-width:0}
.library-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.library-list{display:grid;gap:8px;max-height:230px;overflow:auto;padding:2px}
.library-item{display:grid;gap:5px;text-align:left;border:1px solid var(--ui-border);border-radius:8px;padding:12px;background:var(--ui-surface);color:var(--ui-text);min-width:0;width:100%;cursor:pointer}.library-item strong,.library-item small{overflow-wrap:anywhere}.library-item small{font-size:11px;color:var(--ui-muted);line-height:1.5}.library-item.is-selected{border-color:var(--ui-accent,#8c7dff);box-shadow:inset 3px 0 var(--ui-accent,#8c7dff)}
.library-detail,.library-create,.library-instance{display:grid;gap:12px;border-top:1px solid var(--ui-border);padding-top:16px;min-width:0}.library-image-preview{display:block;object-fit:contain;width:100%;max-height:230px;border:1px solid var(--ui-border);border-radius:8px;background:#fff}.library-component-preview{display:block;box-sizing:border-box;width:100%;height:280px;border:1px solid var(--ui-border);border-radius:8px;background:#fff}
.library-publish,.library-comparison{display:grid;gap:10px;padding-top:12px;border-top:1px solid var(--ui-border)}.library-comparison ul{padding-left:16px;max-height:200px;overflow:auto}.library-comparison li{margin-bottom:12px;overflow-wrap:anywhere}.library-comparison li span{display:block;color:var(--ui-muted);font-size:11px;line-height:1.6}
.library-upload{position:relative;overflow:hidden;cursor:pointer}.library-upload input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}.library-upload:focus-within{outline:2px solid var(--ui-accent,#8c7dff);outline-offset:3px}.library-panel [role=status]{font-size:12px;line-height:1.6;white-space:pre-wrap}
.library-create summary,.library-publish summary{cursor:pointer;font-weight:600;font-size:12px;line-height:1.6}.library-create[open] summary,.library-publish[open] summary{margin-bottom:14px}.library-instance:empty{display:none}
.design-font-library{border:1px solid var(--ui-border,#444653);padding:16px;border-radius:10px;margin:20px 0}.design-font-library h3{margin:0 0 12px}.design-font-family{padding:12px 0;border-bottom:1px solid var(--ui-border,#444653);margin-bottom:12px;overflow-wrap:anywhere}.design-font-family>div{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-top:8px}.design-font-family span{font-size:12px;color:var(--ui-muted,#a9adbc)}.design-font-library [role=status]{font-size:12px;line-height:1.6;overflow-wrap:anywhere}
.design-font-upload>summary{font-weight:600;cursor:pointer;padding:10px 0}.design-font-upload[open]>summary{margin-bottom:12px}

/* Author-only preview diagnostics: collapsed by default, independent scrolling. */
.trigger-action-order{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:12px}
.interaction-debugger{position:fixed;right:20px;bottom:20px;z-index:30;width:min(440px,calc(100vw - 32px));border:1px solid var(--ui-border,#444653);border-radius:12px;background:var(--ui-surface,#20222c);color:var(--ui-text,#f5f5fa);box-shadow:0 10px 40px #0005;font-size:12px}
.interaction-debugger:not([open]){width:auto}.interaction-debugger>summary{cursor:pointer;padding:14px 16px;font-weight:600;list-style-position:inside}.interaction-debugger>summary span{margin-left:12px;font-size:10px;color:var(--ui-muted,#a9adbc);font-weight:400}
.debugger-inner{border-top:1px solid var(--ui-border,#444653);padding:16px;max-height:65vh;overflow:auto;overscroll-behavior:contain}.debugger-toolbar{position:sticky;top:-16px;z-index:1;display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;padding:10px 0;background:var(--ui-surface,#20222c)}.debugger-toolbar [aria-pressed=true]{border-color:var(--ui-accent,#8c7dff);background:var(--ui-accent,#8c7dff);color:#fff}
.debug-values{margin:0 0 16px}.debug-values>div{padding:10px 0;border-bottom:1px solid var(--ui-border,#444653)}.debug-values dt{font-weight:600}.debug-values dt small{display:block;font-weight:400;color:var(--ui-muted,#a9adbc);font-size:10px}.debug-values dd{margin:6px 0 0;white-space:pre-wrap;overflow-wrap:anywhere;font-family:ui-monospace,monospace;line-height:1.6}
.debug-events{list-style:none;margin:0 0 16px;padding:0}.debug-transaction{padding:12px 0;border-bottom:1px solid var(--ui-border,#444653);overflow-wrap:anywhere}.debug-transaction p{margin:6px 0;line-height:1.6;color:var(--ui-muted,#a9adbc)}.debug-transaction summary{cursor:pointer;padding:8px 0}.debug-transaction ol{padding-left:20px;line-height:1.7}.debug-transaction li{margin-bottom:8px}.debug-error>strong{color:#ffb5ad}
@media(max-width:640px){.interaction-debugger{right:12px;bottom:12px}.debugger-inner{max-height:55vh}}

[data-save-state]{display:inline-block;max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}
[data-save-state=invalid],[data-save-state=error]{font-weight:600;color:var(--ui-warning,#9c3c16)}
:root[data-ui-theme=dark] [data-save-state=invalid],:root[data-ui-theme=dark] [data-save-state=error]{color:#ffbf96}
.layer-options small{display:block;color:var(--ui-muted);line-height:1.6;margin:6px 0 12px}
.frame-size-presets{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.section-api-example{font:12px/1.6 ui-monospace,monospace;white-space:pre-wrap;overflow-wrap:anywhere;padding:12px;border-radius:6px;background:var(--ui-soft)}

.stage .editable [data-inline-field]{cursor:text;white-space:pre-wrap;overflow-wrap:anywhere;outline-offset:3px}
.stage .editable [data-inline-field]:hover{outline:1px dashed #7563d8}
.stage .editable [data-inline-field]:focus-visible{outline:2px solid #7563d8}
.stage .editable [data-inline-field]:empty{display:block;min-height:1.5em;min-width:2em}
.stage .editable [data-inline-field]:empty::before{content:'Double-click to add ' attr(data-inline-label);font-size:12px;font-style:italic;color:#59667a}
.inline-object-name{position:absolute;left:6px;bottom:6px;z-index:3;max-width:calc(100% - 12px);display:block;padding:3px 6px;border-radius:4px;font-size:12px;line-height:1.5;color:#4a426e;background:#f7f5fff2}
.inline-author-notes{margin-top:16px;padding:12px;border:1px dashed #a59acb;border-radius:8px;background:#f7f5ff;color:#282044;font-size:13px}
.inline-author-notes summary{cursor:pointer;padding:4px 0}.inline-author-notes p{margin:10px 0}.inline-author-notes small{display:block;margin-top:12px}
.inline-text-editor{position:fixed;z-index:3000;max-width:calc(100vw - 24px);padding:4px;border:2px solid var(--ui-accent,#7563d8);border-radius:8px;background:var(--ui-surface,#fff);color:var(--ui-text,#222);box-shadow:0 8px 32px #0004}
.inline-text-area{display:block;width:100%;min-height:54px;max-height:calc(100vh - 140px);padding:6px;border:0;outline:0;resize:vertical;background:var(--ui-surface,#fff);color:var(--ui-text,#222);box-sizing:border-box;white-space:pre-wrap;overflow-wrap:anywhere}
.inline-text-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:8px 6px 4px;border-top:1px solid var(--ui-border,#ddd);font-size:11px;line-height:1.5}.inline-text-actions span{flex:1 1 160px;color:var(--ui-muted,#59667a)}.inline-text-actions button{border:1px solid var(--ui-border,#ddd);border-radius:5px;padding:5px 10px;background:var(--ui-soft,#f4f4f4)}
.inline-text-editor>p{margin:0;padding:0 6px;font-size:12px;line-height:1.5;color:var(--ui-text,#222)}.inline-text-editor>p:empty{display:none}