/* 4px spacing grid; 32px controls; values 12px and labels 11px. */
.editor>.right{overflow:hidden;min-width:0}
.right>.inspector-props,.inspector-shell{display:flex;flex-direction:column;flex:1;min-height:0}
.inspector-tabs{display:flex;gap:16px;padding:0 12px;flex-shrink:0;border-bottom:1px solid var(--line)}
.inspector-tabs [role=tab]{position:relative;min-height:40px;padding:8px 0;border:0;border-radius:0;background:transparent;font-size:12px;line-height:24px;color:var(--muted)}
.inspector-tabs [role=tab][aria-selected=true]{background:transparent;color:var(--text,#242429);font-weight:600}
.inspector-tabs [aria-selected=true]::after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:2px;background:var(--brand);border-radius:2px}
.inspector-content{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;scrollbar-width:thin}
.right .inspector-content>.inspector-section{padding:0 12px}
.right .inspector-content>.inspector-section>summary,.inspector-section-heading{display:flex;align-items:center;gap:8px;min-height:40px;padding:8px 0;font-size:12px;font-weight:550;line-height:24px;color:#55515e}
.inspector-section-heading>input[type=checkbox]{width:14px;height:14px;min-height:0;padding:0;margin:0;flex:0 0 14px;accent-color:var(--brand)}
.inspector-section-title{min-width:0;flex:1}
.inspector-section-actions{display:flex;align-items:center;gap:4px;margin-left:auto}
.right .inspector-section-actions .inspector-action{display:flex;align-items:center;justify-content:center;width:24px;height:24px;padding:4px;border:0;background:transparent;border-radius:4px;color:#777180;flex:none}
.right .inspector-section-actions .inspector-action:hover{background:#f2f0f7;color:#343039}
.inspector-section-actions .inspector-action svg{width:16px;height:16px}
.right .inspector-content .fields{gap:8px;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
.inspector-content>.inspector-section>.inspector-section-body{padding:0 0 12px}
.right .inspector-content .field,.right .inspector-content .field-label{gap:4px;font-size:11px;line-height:16px;font-weight:400}
.right .inspector-content input:not([type=checkbox]),.right .inspector-content select,.right .inspector-content .inspector-select-trigger,.right .inspector-content .font-picker-trigger,.right .inspector-content .color-property-button{font-size:12px;line-height:20px;min-height:32px;font-weight:400}
.right .inspector-content .inspector-select-value,.right .inspector-content .color-property-value,.right .inspector-content .color-property-button>span{font-size:12px;line-height:20px}
.right .inspector-content .numeric-box,.right .inspector-content .opacity-controls{min-height:32px}
.right .inspector-content .number-caption,.right .inspector-content .number-unit{font-size:11px;line-height:16px}
.right .inspector-content .typography-fields .field>span:first-child{height:auto;line-height:16px}
.right .inspector-content .transition-row,.right .inspector-content .shape-effect-color{display:grid;grid-template-columns:80px minmax(0,1fr);align-items:center;gap:8px;min-height:32px;margin:0;font-size:11px}
.right .inspector-content .transition-row>span:first-child,.right .inspector-content .shape-effect-color>span{font-size:11px;line-height:16px}
.right .inspector-content .constraint-offset-field{display:flex;flex-direction:column;align-items:stretch;gap:4px;grid-column:auto}
.right .inspector-content .constraint-offset-field>.number-caption{display:block;flex:none;width:auto;min-width:0;padding:0;font-size:11px;line-height:16px;white-space:nowrap}
.right .inspector-content .constraint-offset-field .numeric-box{width:100%}
.right .constraint-offset-field .numeric-box input[type=number]{padding-left:8px}
.right .inspector-content .inspector-fixed>summary{cursor:default}
.right .inspector-content .inspector-fixed>summary>svg{display:none}
.inspector-section-note{margin-left:auto;margin-right:0;font-weight:400;font-size:11px;color:var(--muted);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:128px;line-height:16px}
.hover-fields,.scroll-fields,.shape-effect-parameters,.feed-hover-parameters,.navigation-fields,.transition-fields{display:grid;gap:8px;min-width:0}
.right .inspector-content .hover-state-tabs{position:relative;min-height:40px;padding:4px;margin:32px 0 0}
.right .inspector-content .hover-state-tabs::before{content:"";position:absolute;top:-17px;left:0;right:0;height:1px;background:var(--line);pointer-events:none}
.right .inspector-content .hover-state-tabs button{font-size:12px;line-height:20px;min-height:28px;padding:4px}
.right .inspector-content .fixed-scroll-toggle{font-size:11px;line-height:16px;min-height:24px;padding:4px 0}
.inspector-image-source{height:72px;background:#f8f8fa;border:1px solid var(--line);border-radius:6px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.inspector-image-source img{max-width:100%;max-height:100%;object-fit:contain}
.inspector-content button.inspector-secondary{background:transparent;border:0;min-height:24px;color:var(--muted);padding:4px;font-size:11px;line-height:16px}
.inspector-more{padding-top:4px;border-top:1px solid var(--line)}
.inspector-more>summary{font-size:11px;cursor:pointer;min-height:32px;padding:8px 0;color:var(--muted);line-height:16px}
.inspector-more>.fields{padding:4px 0}
.member-interaction-list{display:grid;gap:4px}
.member-interaction-row{display:flex;align-items:center;gap:8px;width:100%;border:0;padding:8px 0;background:transparent;text-align:left;min-height:40px}
.member-interaction-row .interaction-card-copy{display:flex;flex:1;min-width:0;align-items:center;justify-content:space-between;gap:8px}
.member-interaction-row strong{font-size:12px;line-height:20px;font-weight:400;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.member-interaction-row .interaction-card-copy>span{font-size:11px;line-height:16px;color:var(--muted);white-space:nowrap}
.member-interaction-row>svg{width:14px;height:14px;flex:none;color:var(--muted)}
.right button:focus-visible,.right summary:focus-visible,.right input[type=checkbox]:focus-visible{outline:2px solid var(--brand);outline-offset:2px}

.right .inspector-content .stacked-number-field>.number-caption{display:block;flex:none;width:auto;min-width:0;padding:0;font-size:11px;line-height:16px}

.right .inspector-content .property-add-row{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:8px;min-height:32px}
.right .inspector-content .property-add-row>.inspector-select-control{flex:0 0 24px;width:24px}
.right .inspector-content .property-add-row .inspector-select-trigger{width:24px;height:24px;min-height:24px;border:0;padding:4px;background:transparent}
.right .inspector-content .property-add-row .inspector-select-trigger>svg{width:16px;height:16px}

.right .inspector-content .numeric-box{height:32px;min-height:32px}
.right .inspector-content .numeric-box input[type=number]{height:30px;min-height:0;line-height:20px;padding:5px 8px}
.right .inspector-content .field>input:not([type=checkbox]){height:32px;min-height:32px;padding:5px 8px}


/* Match the Sites workbench controls; one grid row owns both header baselines. */
.editor{grid-template-rows:56px max-content minmax(0,1fr) 27px}
.editor>.left,.editor>.right,.editor>.workspace{grid-row:2 / 5}
.editor>.workspace,.editor>.right{display:grid;grid-template-rows:subgrid;row-gap:0}
.editor>.workspace>.canvas-toolbar{grid-row:1;min-height:49px;height:auto;padding:8px 16px;background:#fafafc;border-bottom:1px solid var(--line);box-shadow:none}
.editor>.workspace>.canvas-viewport{grid-row:2;min-height:0}
.editor>.workspace>.canvas-hint{grid-row:3}
.editor>.right>.inspector-props,.editor .inspector-shell{display:grid;grid-template-rows:subgrid;grid-row:1 / -1;min-height:0}
.editor .inspector-tabs{grid-row:1;min-height:49px;padding:0 20px;align-items:stretch}
.editor .inspector-tabs [role=tab]{min-height:0}
.editor .inspector-content{grid-row:2 / -1}
.editor-header .editor-preview{height:32px;min-width:48px;padding:6px 10px;border:1px solid transparent;background:transparent;font-size:12px;line-height:18px}
.editor-header .editor-preview:hover{background:#f0eff5}
.right .inspector-content>.inspector-section{padding:0 20px}
.right .inspector-content>.inspector-section>summary,.right .inspector-section-heading{color:#242429}
.right .inspector-content .fields{gap:12px 10px}
.right .inspector-content .field,.right .inspector-content .field-label,.right .inspector-content .transition-row,.right .inspector-content .shape-effect-color{font-size:10px;color:#99929f}
.right .inspector-content .transition-row>span:first-child,.right .inspector-content .shape-effect-color>span,.right .inspector-content .number-caption,.right .inspector-content .constraint-offset-field>.number-caption,.right .inspector-content .stacked-number-field>.number-caption{font-size:10px;color:#99929f}
.right .inspector-content .field>input:not([type=checkbox]),.right .inspector-content select,.right .inspector-content textarea,.right .inspector-content .inspector-select-trigger,.right .inspector-content .font-picker-trigger,.right .inspector-content .color-property-button,.right .inspector-content .numeric-box{border:1px solid transparent;background:#f8f8fa;border-radius:6px;color:#242429;font-size:11px;line-height:20px;font-weight:400;min-height:34px;height:34px}
.right .inspector-content .field>input:not([type=checkbox]){padding:6px 8px}
.right .inspector-content .numeric-box input[type=number]{height:32px;min-height:0;line-height:20px;padding:6px 8px;font-size:11px;color:#242429}
.right .inspector-content .inspector-select-value,.right .inspector-content .color-property-value,.right .inspector-content .color-property-button>span{font-size:11px;line-height:20px}
.right .inspector-content .number-unit{font-size:10px;color:#99929f}
.right .inspector-content .field>input:not([type=checkbox]):hover,.right .inspector-content select:hover,.right .inspector-content textarea:hover,.right .inspector-content .inspector-select-trigger:hover,.right .inspector-content .font-picker-trigger:hover,.right .inspector-content .color-property-button:hover,.right .inspector-content .numeric-box:hover{border-color:#dedbe7}
.right .inspector-content .field>input:not([type=checkbox]):focus,.right .inspector-content select:focus,.right .inspector-content textarea:focus,.right .inspector-content .numeric-box:focus-within,.right .inspector-content .inspector-select-trigger[aria-expanded=true],.right .inspector-content .font-picker-trigger[aria-expanded=true]{outline:2px solid #6344ed30;border-color:#8e79ee}
.inspector-select-menu .inspector-select-option,.font-picker-menu .font-picker-option{font-size:11px}
@media(max-width:1180px){.editor>.workspace>.canvas-toolbar{padding:8px}}

.right .inspector-content textarea{height:auto;min-height:75px;padding:6px 8px;resize:vertical}


/* Dropdown focus/open state uses only its existing inner border. */
select:is(:focus,:focus-visible),.inspector-select-trigger:is(:focus,:focus-visible,[aria-expanded=true]),.font-picker-trigger:is(:focus,:focus-visible,[aria-expanded=true]),.right .inspector-content select:is(:focus,:focus-visible),.right .inspector-content .inspector-select-trigger:is(:focus,:focus-visible,[aria-expanded=true]),.right .inspector-content .font-picker-trigger:is(:focus,:focus-visible,[aria-expanded=true]){outline:0;box-shadow:none;border-color:#8e79ee}

.right .inspector-content .property-add-row .inspector-select-trigger:is(:focus,:focus-visible,[aria-expanded=true]){box-shadow:inset 0 0 0 1px #8e79ee}

/* Text and numeric fields use the same single focus border as dropdowns. */
input:not([type=checkbox]):not([type=radio]):not([type=range]):focus,textarea:focus,.numeric-box:focus-within,.right .inspector-content .field>input:not([type=checkbox]):focus,.right .inspector-content textarea:focus,.right .inspector-content .numeric-box:focus-within{outline:0;box-shadow:none;border-color:#8e79ee}

/* Sidebar names and inline content controls share the existing input grid. */
.editor-header{grid-template-columns:minmax(0,1fr) auto}
.editor-header .editor-identity{gap:12px}
.editor-header .editor-title{flex:0 0 auto;max-width:none;font-size:13px;font-weight:550}
.editor-header-divider{width:1px;height:20px;background:var(--line);flex:none}
.editor-header .save-state{display:inline-flex;align-items:center;gap:6px;flex:0 1 auto;max-width:180px;padding:6px 0;font-size:11px;text-align:left}
.editor-header .save-state>svg{width:14px;height:14px;flex:none;color:inherit}
.editor-header .save-state>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.editor-header .save-state.saving>svg{animation:save-indicator-spin 1s linear infinite}
@keyframes save-indicator-spin{to{transform:rotate(-360deg)}}
@media(prefers-reduced-motion:reduce){.editor-header .save-state.saving>svg{animation:none}}
@media(max-width:900px){.editor-header .editor-identity{gap:8px}.editor-header .editor-title{font-size:12px}.editor-header .save-state{flex-basis:auto;max-width:140px}}
.page-action-menu{width:220px}
.sidebar-renaming{display:flex;align-items:center;gap:8px;min-width:0}
.sidebar-name-input{min-width:0;width:100%;height:32px;padding:5px 8px;font-size:11px;background:#f8f8fa}
.layers .sidebar-renaming{padding-top:4px;padding-bottom:4px}
.right .inspector-content .source-inline-controls{display:flex;align-items:center;gap:4px;min-width:0}
.right .inspector-content .source-inline-controls>input{flex:1;min-width:0;width:0;height:34px;padding:6px 8px;font-size:11px;line-height:20px;border-color:transparent}
.right .inspector-content .source-inline-controls>input:focus{border-color:#8e79ee}
.right .inspector-content .source-inline-controls>.icon-control{width:24px;height:24px;min-height:24px;padding:4px;color:#777180}
.right .source-inline-controls>.icon-control>svg{width:16px;height:16px}
.right .source-inline .panel-error{margin:0;font-size:11px;line-height:18px}
.source-inline-confirm{display:flex;flex-wrap:wrap;gap:8px;min-width:0;font-size:11px;line-height:18px}
.source-inline-confirm>p{width:100%;margin:0}.source-inline-confirm>button{font-size:11px;padding:6px 10px}
/* Categories disclose their effects; only individual effects carry add actions. */
.right .inspector-content .inspector-interaction-children>.inspector-section{margin:0;padding:0;border:0}
.right .inspector-interaction-children>.inspector-section>.inspector-section-heading,.right .inspector-interaction-children>.inspector-section>summary{display:flex;align-items:center;gap:8px;min-height:40px;padding:8px 0;border:0;font-size:11px;font-weight:400;line-height:24px}
.right .inspector-interaction-children>.inspector-section>.inspector-section-body{padding:0 0 12px}
/* Inset separators distinguish related effects within each category. */
.right .inspector-content .inspector-interaction-children>.inspector-section+.inspector-section{border-top:1px solid var(--line)}

/* Field picker actions remain distinct from selectable field values. */
.inspector-select-menu .inspector-select-action{display:flex;align-items:center;gap:8px;width:100%;text-align:left;border:0;background:transparent;font-weight:400}
.inspector-select-menu .inspector-select-action>svg{width:14px;height:14px;flex:none;color:#85818c;pointer-events:none}
.inspector-select-menu .inspector-select-action:is(:hover,.active){background:#37352f12}
.inspector-select-menu .inspector-select-action[aria-disabled=true]{opacity:.45;cursor:default}
.inspector-select-action-first{position:relative;margin-top:8px}
.inspector-select-action-first::before{content:'';position:absolute;top:-4px;left:6px;right:6px;height:1px;background:var(--line);pointer-events:none}
.source-fields-dialog{width:min(560px,calc(100vw - 32px));max-height:calc(100dvh - 64px);border-color:#e9e7ee;border-radius:14px;box-shadow:0 24px 80px #21172f26;background:#fff;color:#242429}
.source-fields-dialog[open]{display:flex;flex-direction:column}
.source-fields-dialog>.modal-head{min-height:64px;padding:16px 20px;flex:none}
.source-fields-dialog>.modal-head h2{font-size:16px;line-height:24px;font-weight:600;margin:0}
.source-fields-dialog>.modal-head .icon-control{width:32px;height:32px;color:#8a8493}
.source-fields-dialog>.modal-body{min-height:0;max-height:none;overflow:auto;padding:16px 20px 20px}
.source-fields-dialog .source-target{font-size:12px;line-height:20px;margin:0 0 16px;color:#99929f}
.source-field-columns,.source-fields-dialog .source-field-row{display:grid;grid-template-columns:minmax(0,1fr) 64px;gap:12px;align-items:center}
.source-field-columns{font-size:11px;line-height:16px;color:#99929f;margin-bottom:8px}
.source-field-columns>span:last-child{text-align:center}
.source-fields-dialog .source-field-rows{gap:8px}
.source-fields-dialog .source-field-row input{width:100%;height:36px;padding:7px 10px;border:1px solid transparent;background:#f8f8fa;border-radius:6px;font-size:13px;line-height:20px}
.source-fields-dialog .source-field-row input:hover:not(:disabled){border-color:#dedbe7}
.source-fields-dialog .source-field-row input:focus{outline:0;box-shadow:none;border-color:#8e79ee}
.source-fields-dialog .source-field-row.is-archived input{color:#aaa4b0;background:#faf9fb}
.source-field-action{display:flex;justify-content:center;align-items:center}
.source-fields-dialog .source-field-action>.icon-control{width:32px;height:32px;color:#8a8493}
.source-field-restore{padding:6px 8px;border:0;background:transparent;font-size:12px;color:#6344ed}
.source-fields-dialog .source-field-add{display:flex;align-items:center;gap:8px;margin-top:12px;min-height:32px;padding:6px 8px;border:0;background:transparent;color:#6344ed;font-size:12px}
.source-field-add>svg{width:16px;height:16px}
.source-fields-dialog>.panel-error{margin:0;padding:0 20px 12px;font-size:12px;line-height:20px;flex:none}
.source-fields-dialog>.modal-footer{padding:14px 20px;gap:8px;background:#fcfbfd;flex:none}
.source-fields-dialog>.modal-footer>button{height:36px;min-width:76px;padding:7px 14px;font-size:12px;line-height:20px;border-radius:7px}
@media(max-width:600px){.source-fields-dialog{max-height:calc(100dvh - 32px)}.source-field-columns,.source-fields-dialog .source-field-row{grid-template-columns:minmax(0,1fr) 48px;gap:8px}}
.card-return{height:28px;padding:0 10px;font-size:11px;white-space:nowrap}.card-scope{font-size:10px;color:#96929f;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card-scope[hidden],.card-return[hidden]{display:none}.feed-region.editable .card-surface{pointer-events:none}
.source-fields-dialog .source-field-columns,.source-fields-dialog .source-field-row{grid-template-columns:minmax(0,1fr) 84px 40px;gap:12px}.source-field-type{font-size:12px;color:#8f8b99;align-self:center;padding-left:8px}.source-field-row select{height:36px;border:0;border-radius:8px;background:#f6f6f8;font-size:12px;padding:0 8px;color:#45414c}
.card-edit-context{position:absolute;top:12px;left:16px;z-index:8;display:flex;gap:8px;align-items:center;padding:4px;background:#fafafce8;border-radius:8px;backdrop-filter:blur(8px)}.card-edit-context .card-scope{max-width:240px}

/* The repeated card keeps its page/camera context; only the first item is editable. */
.inline-card-list{overflow:visible!important}.inline-card-context .feed-tile{cursor:default}.inline-card-host{overflow:visible!important;isolation:isolate;outline:1px solid var(--brand)}.inline-card-host>.card-design-board{box-shadow:none;outline:0}.inline-card-caption.card-edit-context{top:-34px;left:0;padding:3px 0;background:#fff;border:1px solid var(--line);border-radius:7px;backdrop-filter:none;gap:12px;white-space:nowrap}.inline-card-caption .card-scope{padding-left:10px;font-size:11px;color:var(--brand);max-width:none}.inline-card-caption .card-return{height:26px;border:0;border-left:1px solid var(--line);border-radius:0 6px 6px 0;font-size:11px}.card-design-board .artboard-selection{inset:0}.card-design-board .editable{pointer-events:auto}.inline-card-caption[hidden]{display:none}

.hover-shadow-change,.hover-stroke-change{align-items:start}.hover-shadow-parameters,.hover-stroke-parameters{display:grid;gap:8px;min-width:0}.hover-shadow-title,.hover-stroke-title{height:32px;display:flex;align-items:center;font-weight:500}

/* Edit one master; geometric repeats show layout without duplicating CMS content. */
.editor-card-placeholder{background:transparent;pointer-events:none;cursor:default}
.editor-card-placeholder::before{content:"";position:absolute;inset:var(--card-paint-top,0px) var(--card-paint-right,0px) var(--card-paint-bottom,0px) var(--card-paint-left,0px);border-radius:var(--card-paint-radius,4px);background:#ececf0;box-shadow:inset 0 0 0 1px #fff}
.feed-region.selected>.feed-content>.editor-card-master{outline:1px dashed #bdb2e9;outline-offset:0}
.card-template-entry{position:absolute;z-index:25;display:flex;align-items:center;height:26px;padding:0 10px;font-size:11px;line-height:1;color:var(--brand);background:#fff;border:1px solid #ddd6f3;border-radius:7px;box-shadow:0 2px 5px #28203608;white-space:nowrap;cursor:pointer}
.card-template-entry:hover{background:#f6f3ff;border-color:#c7b9f0}
.card-template-entry:focus-visible{outline:1px solid var(--brand);outline-offset:2px}

.feed-region.editable.has-card-entry{overflow:visible}

/* Gray context bounds are distinct from the one active purple selection. */
.inline-card-host{outline:1px dashed #cfccd6}
.inline-card-host:has(>.page-selected){outline:none}
.inline-card-caption.card-edit-context{gap:0}
.inline-card-caption .card-scope{height:26px;padding:4px 10px;border:0;border-radius:6px 0 0 6px;background:transparent;font-size:11px;color:var(--muted)}
.inline-card-caption .card-scope:hover{background:#f5f3fb;color:var(--brand)}
.inline-card-caption .card-scope[aria-pressed=true]{background:transparent;color:var(--brand)}
.inline-card-caption .card-object{color:var(--brand);font-size:11px;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:12px}
.inline-card-caption .card-object:empty{padding:0}

.card-design-board>.group-region.selected{outline:none}