/* Variable sidebar detail: dimensions and typography measured from the design preview. */
#tester-variable-drawer.studio-variable-managed{color:#1f2a24;font-family:'DM Sans',sans-serif}
#tester-variable-drawer.studio-variable-managed>.drawer-header{box-sizing:border-box;height:56px;min-height:56px;padding:0 24px;gap:8px;border-bottom:1px solid #cfe0d4}
#tester-variable-drawer .drawer-kicker{display:block;font:500 10px/12.5px 'DM Sans',sans-serif;letter-spacing:.05em;text-transform:uppercase;color:#66746d}
#tester-variable-drawer #tester-variable-title{margin:0;font:600 16px/20px 'Space Grotesk',sans-serif;letter-spacing:-.025em}
#tester-variable-drawer .studio-variable-active{font:400 12px/16px 'DM Sans',sans-serif;color:#3f7f55}
#tester-variable-drawer :is(.studio-variable-back,.studio-variable-add,.drawer-close){box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;flex:none;width:32px;height:32px;min-height:32px;padding:0;border:1px solid #cfe0d4;border-radius:6px;background:#fff;color:#66746d;box-shadow:none}
#tester-variable-drawer .studio-variable-panel{display:flex;flex-direction:column;flex:1;min-height:0;padding:0 24px;overflow:hidden}
#tester-variable-drawer .studio-variable-toolbar{box-sizing:border-box;flex:none;padding:20px 0 12px;gap:12px;border-bottom:1px solid #cfe0d4;min-height:0}
#tester-variable-drawer .studio-variable-toolbar button{color:#66746d;font:500 12px/16px 'DM Sans',sans-serif;gap:6px;box-shadow:none}
#tester-variable-drawer .studio-variant-picker{height:32px;align-items:center;box-sizing:border-box}
#tester-variable-drawer .studio-variant-picker>button{height:32px;min-height:32px;font-weight:400}
#tester-variable-drawer .studio-variable-toolbar :is(.studio-variable-copy){width:32px;min-width:32px;padding:0;flex:none}
#tester-variable-drawer .studio-variable-toolbar .studio-variable-ai{padding:0 12px}
#tester-variable-drawer .studio-variable-toolbar .studio-variable-compare{padding:0 10px}
#tester-variable-drawer .studio-variable-content{display:flex;flex-direction:column;flex:1;min-height:0;padding:24px 0 0;overflow:auto;scrollbar-gutter:auto}
#tester-variable-drawer .studio-variable-title-row{display:flex;align-items:center;gap:8px;flex:none;height:36px;box-sizing:border-box;border-bottom:1px solid rgb(207 224 212 / 70%)}
#tester-variable-drawer .studio-variable-title-row>small{float:none;flex:none;margin:0;padding:0;color:#66746d;font:500 11px/16.5px 'DM Sans',sans-serif;letter-spacing:.05em}
#tester-variable-drawer .studio-variable-title{flex:1;min-width:0;margin:0;padding:0;border:0;background:transparent;color:#1f2a24;font:600 15px/22.5px 'DM Sans',sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#tester-variable-drawer .studio-variable-prompt{box-sizing:border-box;flex:1;min-height:220px;margin:0;padding:16px 0;border:0;border-radius:0;background:transparent;color:#1f2a24;font:400 13.5px/1.75 'JetBrains Mono',monospace;box-shadow:none}
#tester-variable-drawer .studio-variable-form-host{display:none}
#tester-variable-drawer .studio-variable-panel.is-editing .studio-variable-content>:is(.studio-variable-title-row,.studio-variable-prompt){display:none}
#tester-variable-drawer .studio-variable-panel.is-editing .studio-variable-content{overflow:hidden}
#tester-variable-drawer .studio-variable-panel.is-editing .studio-variable-form-host{display:flex;flex:1;min-height:0}
#tester-variable-drawer .studio-variable-form-host #tester-variable-form:not([hidden]){display:flex;flex-direction:column;flex:1;min-height:0;margin:0;padding:0;gap:0;border:0;overflow:visible}
#tester-variable-drawer .studio-variable-form-host #tester-variable-form>label:not(#tester-variable-value-field){box-sizing:border-box;display:flex;align-items:center;flex:none;height:36px;margin:0;padding:0;gap:8px;border:0;border-bottom:1px solid rgb(207 224 212 / 70%)}
#tester-variable-drawer .studio-variable-form-host #tester-variable-label-caption{font:500 11px/16.5px 'DM Sans',sans-serif;letter-spacing:.05em;color:#66746d}
#tester-variable-drawer .studio-variable-form-host #tester-variable-label{height:auto;margin:0;padding:0;background:transparent;font:600 15px/22.5px 'DM Sans',sans-serif;color:#1f2a24}
#tester-variable-drawer .studio-variable-form-host #tester-variable-value-field{display:flex;flex-direction:column;flex:1;min-height:0;margin:0;padding:0;border:0}
#tester-variable-drawer .studio-variable-form-host #tester-variable-value{box-sizing:border-box;display:block;flex:1;min-height:220px;max-height:none;height:auto;margin:0;padding:16px 0;border-radius:0;resize:none;overflow:auto;background:transparent;font:400 13.5px/1.75 'JetBrains Mono',monospace;color:#1f2a24;caret-color:#3f7f55}
#tester-variable-drawer .studio-variable-form-host :is(#tester-variable-label,#tester-variable-value):is(:focus,:focus-visible),#tester-variable-drawer .studio-variable-form-host :is(#tester-variable-label,#tester-variable-value){border:0!important;outline:none!important;box-shadow:none!important}
#tester-variable-drawer .studio-variable-footer{box-sizing:border-box;flex:none;padding:8px 0;border-top:1px solid rgb(207 224 212 / 70%);gap:12px;color:#66746d;font:400 11px/16.5px 'DM Sans',sans-serif}
#tester-variable-drawer .studio-variable-edit-status{display:inline-flex;align-items:center;gap:6px}
#tester-variable-drawer .studio-variable-edit-status svg{width:12px;height:12px}
#tester-variable-drawer .studio-variable-panel.is-editing .studio-variable-edit-status svg{display:none}
#tester-variable-drawer .studio-variable-panel.is-editing .studio-variable-edit-status::before{content:'';width:6px;height:6px;border-radius:50%;background:#3f7f55;flex:none}
#tester-variable-drawer :is(.studio-variable-primary-actions,#tester-variable-form>div:last-child){box-sizing:border-box;flex:none;display:flex;justify-content:space-between;align-items:center;gap:6px;margin:8px -24px 0;padding:12px 24px;border:0;border-top:1px solid #cfe0d4;background:#fff}
#tester-variable-drawer #tester-variable-form>div:last-child{justify-content:flex-end;position:sticky;bottom:0}
#tester-variable-drawer .studio-variable-panel.is-editing .studio-variable-primary-actions{display:none}
#tester-variable-drawer :is(.studio-variable-primary-actions,#tester-variable-form>div:last-child) button{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;gap:4px;height:32px;min-height:32px;padding:0 12px;border-radius:6px;font:500 12px/16px 'DM Sans',sans-serif;box-shadow:none}
#tester-variable-drawer :is(.studio-variable-actions-left,.studio-variable-actions-right){gap:6px}
#tester-variable-drawer .studio-variable-primary-actions .studio-variable-actions-left button{width:32px;padding:0}
#tester-variable-drawer .studio-variable-primary-actions .studio-variable-actions-right button:not(.is-primary):not(.is-select){color:#66746d}
#tester-variable-drawer :is(.studio-variable-primary-actions .is-primary,#tester-variable-save){background:#3f7f55;border-color:#3f7f55;color:#f8f9f8;font-weight:500}
#tester-variable-drawer #tester-variable-cancel{background:#fff;border-color:#cfe0d4;color:#1f2a24;font-weight:500}
#tester-variable-drawer :is(.studio-variable-primary-actions .is-primary,#tester-variable-save):not(:disabled):hover{background:#2f6042;filter:none}
#tester-variable-drawer :is(.studio-variable-toolbar button,.studio-variable-back,.studio-variable-add,.drawer-close,#tester-variable-cancel):not(:disabled):hover{border-color:#3f7f55;background:#eaf4ed;color:#3f7f55}
#tester-variable-drawer .studio-variable-toolbar button:disabled{opacity:.3}
#tester-variable-drawer #tester-variable-form>div:last-child button:disabled{opacity:.5}
#tester-variable-drawer .studio-variable-primary-actions button svg,#tester-variable-drawer #tester-variable-form>div:last-child button svg{width:14px;height:14px;flex:none}
#tester-variable-drawer .studio-variable-actions-left button svg{width:16px;height:16px}
@media(max-width:760px){#tester-variable-drawer .studio-variable-panel{padding-inline:16px}#tester-variable-drawer.studio-variable-managed>.drawer-header{padding-inline:16px}#tester-variable-drawer :is(.studio-variable-primary-actions,#tester-variable-form>div:last-child){margin-inline:-16px;padding-inline:16px}#tester-variable-drawer .studio-variable-toolbar{gap:8px}#tester-variable-drawer .studio-variable-footer{flex-wrap:wrap}}

#tester-variable-drawer.studio-variable-detail .studio-drawer-scroll{overflow:hidden;scrollbar-gutter:auto}
#tester-variable-drawer :is(.studio-variable-toolbar,.drawer-header) button svg{width:16px;height:16px;flex:none}
#tester-variable-drawer :is(.studio-variable-primary-actions,#tester-variable-form>div:last-child) button>span{font:inherit;color:inherit;line-height:inherit}
#tester-variable-drawer .studio-variable-primary-actions .submission-button{gap:4px}
@media(min-width:1100px){#tester-variable-drawer.studio-variable-managed{border-left:0}}
#tester-variable-drawer .studio-variable-panel.is-editing .studio-variable-primary-actions{display:none!important}
#tester-variable-drawer #tester-variable-form>div:last-child{width:calc(100% + 48px);max-width:none;align-self:stretch}
#tester-variable-drawer :is(.studio-variable-toolbar,.studio-variable-primary-actions,#tester-variable-form>div:last-child) button{letter-spacing:normal;text-transform:none}
#tester-variable-drawer :is(.studio-variable-primary-actions,#tester-variable-form>div:last-child) button{border-width:1px;border-style:solid}
@media(max-width:760px){#tester-variable-drawer #tester-variable-form>div:last-child{width:calc(100% + 32px)}}
#tester-variable-drawer .studio-variable-primary-actions .submission-button svg{width:16px;height:16px}
#tester-variable-drawer .studio-variable-primary-actions .studio-variable-actions-left button{padding:0!important}
#tester-variable-drawer :is(#tester-variable-value-field,.studio-variable-prompt)[hidden]{display:none!important}
@media(max-width:760px){body:has(#tester-variable-drawer.open) .studio-quick-nav{display:none}}

/* Variant picker matches the preview; keep entry timestamps and existing keyboard selection. */
html body .studio-variant-popup[role="listbox"]{width:max-content;min-width:288px;max-width:min(36rem,90vw);max-height:min(320px,calc(100dvh - 16px));padding:6px;border:1px solid #cfe0d4;border-radius:8px;background:#fff;scrollbar-gutter:auto;overflow-y:auto}
html body .studio-variant-popup[role="listbox"] button{align-items:center;gap:10px;min-height:36px;padding:6px 8px;border-radius:8px;color:#1f2a24;font:400 14px/20px 'DM Sans',sans-serif}
html body .studio-variant-popup[role="listbox"] .studio-entry-badge{box-sizing:border-box;min-width:52px;height:24px;padding:0 8px;border-radius:8px;font:600 10px/15px 'DM Sans',sans-serif}
html body .studio-variant-popup[role="listbox"] .studio-entry-badge.is-active{border-color:#3f7f55;background:#3f7f55;color:#f8f9f8}
html body .studio-variant-popup[role="listbox"] .studio-entry-badge.is-variant.is-active{border-color:#d4855a;background:#d4855a;color:#f8f9f8}
html body .studio-variant-popup[role="listbox"] .studio-variant-name{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font:400 14px/20px 'DM Sans',sans-serif}
html body .studio-variant-popup[role="listbox"] time{flex:none;margin-left:12px;padding:0;text-align:right;white-space:nowrap;color:#66746d;font:400 11px/16.5px 'JetBrains Mono',monospace}
html body .studio-variant-popup[role="listbox"] button[aria-selected="true"]{background:#eaf4ed}
html body .studio-variant-popup[role="listbox"] .studio-entry-badge.is-variant:not(.is-active):not(.is-inactive){border-color:rgb(212 133 90 / .3);background:rgb(212 133 90 / .1);color:#d4855a}
html body .studio-variant-popup[role="listbox"] .studio-entry-badge.is-active.is-inactive{border-color:#cfe0d4;background:#f2f4f2;color:#66746d}
html body .studio-variant-popup[role="listbox"] button{box-sizing:border-box;width:100%;margin:0}
html body .studio-variant-popup[role="listbox"] button:is(:hover,:focus-visible){background:#eaf4ed;outline:none;box-shadow:none}

html body .studio-variant-popup[role="listbox"] button+button{margin-top:4px}

/* Task 94: separate ownership badge, same dimensions as the variant badge. */
#tester-variable-drawer .studio-variable-toolbar>.studio-detail-new{background:#436087;border-color:#436087;color:#fff}