/* Scoped reusable title editor. Existing shell, canvas and Gallery keep their owners. */
#chartStudioTitleRuleDialog { width:min(1120px,calc(100vw - 40px)); max-width:1120px; max-height:calc(100dvh - 40px); border-radius:12px !important; padding:28px; }
#chartStudioTitleRuleDialog .title-editor-layout { display:grid; grid-template-columns:188px minmax(0,1fr); gap:24px; min-height:0; overflow:hidden; }
#chartStudioTitleRuleDialog .title-editor-targets { display:flex; flex-direction:column; gap:8px; overflow:auto; }
#chartStudioTitleRuleDialog .title-editor-targets button { flex:none; min-height:44px; text-align:left; overflow-wrap:anywhere; border:1px solid #e2e2e2; border-radius:8px; padding:10px 14px; }
#chartStudioTitleRuleDialog button[aria-pressed="true"] { background:#202020; color:white; }
#chartStudioTitleRuleDialog .chart-studio-title-rule-scroll { display:flex; flex-direction:column; min-width:0; overflow:auto; gap:16px; padding:1px 5px 4px 1px; }
#chartStudioTitleRuleDialog .chart-studio-title-rule-scroll > * { flex-shrink:0; }
#chartStudioTitleRuleDialog .chart-studio-title-rule-preview { order:8; min-height:150px; }
#chartStudioTitleRuleDialog .chart-studio-title-rule-top-grid { order:0; }
#chartStudioTitleRuleDialog .chart-studio-title-rule-top-grid > label { display:none; }
#chartStudioTitleRuleDialog .chart-studio-title-rule-custom { order:1; }
#chartStudioTitleRuleDialog .chart-studio-title-rule-size { order:3; }
#chartStudioTitleRuleDialog [data-title-underline] { order:4; align-self:flex-start; }
#chartStudioTitleRuleDialog .chart-studio-title-rule-auto { order:5; }
#chartStudioTitleRuleDialog .chart-studio-title-rule-source { order:7; }
#chartStudioTitleRuleDialog .chart-studio-title-rule-error { order:9; }
#chartStudioTitleRuleDialog .chart-studio-title-rule-actions { justify-content:flex-end; gap:16px; }
#chartStudioTitleRuleDialog .chart-studio-title-rule-actions button { min-width:124px; min-height:44px; }
.title-quick-fill { position:relative; display:flex; flex-direction:column; gap:8px; margin:8px 0; min-width:0; }
.title-quick-heading,.title-quick-chips,.title-dialog-actions { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.title-quick-heading { justify-content:space-between; }
.title-quick-chips button { min-height:36px; border:1px solid #e2e2e2; border-radius:8px; padding:8px 14px; }
.title-quick-popover { display:flex; flex-direction:column; gap:16px; padding:20px; border:1px solid #e2e2e2; border-radius:12px; background:white; box-shadow:0 8px 28px #00000014; }
.title-quick-popover input { width:100%; min-width:0; min-height:44px; box-sizing:border-box; }
.title-quick-popover label { display:flex; flex-direction:column; gap:7px; }
.title-quick-results { max-height:270px; overflow:auto; }
.title-quick-results > div { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 0; border-bottom:1px solid #eee; }
.title-quick-results span { display:flex; flex-direction:column; gap:4px; overflow-wrap:anywhere; min-width:0; }
.title-quick-results button { flex:none; }
.title-dialog-actions { justify-content:flex-end; margin-top:12px; }
.title-template-backdrop { position:fixed; inset:0; z-index:1400; background:#0004; display:grid; place-items:center; padding:20px; }
.title-template-dialog { background:#fff; color:#202020; padding:28px; border:1px solid #e2e2e2; border-radius:12px; width:min(640px,100%); box-sizing:border-box; max-height:calc(100dvh - 40px); overflow:auto; display:flex; flex-direction:column; gap:16px; font-family:"Century Gothic",Arial,sans-serif; }
.title-template-dialog h2 { font-size:24px; margin:0 0 8px; }
.title-template-dialog p { margin:0; line-height:1.5; }
.title-template-dialog label { display:flex; flex-direction:column; gap:7px; }
.title-template-dialog input,.title-template-dialog select,.title-template-dialog button { min-height:44px; border:1px solid #e2e2e2; border-radius:8px; padding:10px 14px; font:inherit; }
.title-template-dialog button,.title-quick-fill button { cursor:pointer; }
.title-template-dialog button:disabled,.title-quick-fill button:disabled { opacity:.45; cursor:default; }
.title-template-dialog button:focus-visible,.title-quick-fill button:focus-visible { outline:2px dashed #202020; outline-offset:-4px; }
.title-template-dialog .is-primary,#chartStudioTitleRuleDialog .is-primary { background:#202020; color:#fff; }
.title-template-dialog small[role="alert"] { color:#a91616; }
@media(max-width:760px) { #chartStudioTitleRuleDialog { padding:18px; width:calc(100vw - 24px); } #chartStudioTitleRuleDialog .title-editor-layout { grid-template-columns:1fr; gap:16px; } #chartStudioTitleRuleDialog .title-editor-targets { flex-direction:row; max-height:80px; } #chartStudioTitleRuleDialog .title-editor-targets button { max-width:180px; } .title-quick-results > div { align-items:flex-start; flex-direction:column; } }
body[data-view="charts"] #chartStudioTitleRuleDialog { border-radius:12px !important; }
body[data-view="charts"] #chartStudioTitleRuleDialog .chart-studio-title-rule-header { padding:0 0 20px; border:0; }
body[data-view="charts"] #chartStudioTitleRuleDialog .chart-studio-title-rule-actions { display:flex; padding:24px 0 0; border:0; }
body[data-view="charts"] #chartStudioTitleRuleDialog :is(input:not([type="color"]),select) { min-height:44px; height:44px; border-color:#e2e2e2; border-radius:8px !important; font-size:14px; }
body[data-view="charts"] #chartStudioTitleRuleDialog button { border-color:#e2e2e2; border-radius:8px !important; font-size:14px; font-weight:600; }
body[data-view="charts"] #chartStudioTitleRuleDialog .chart-studio-title-rule-custom > .chart-studio-title-rule-colors { gap:16px; margin-top:8px; }
body[data-view="charts"] #chartStudioTitleRuleDialog .chart-studio-title-rule-custom > .chart-studio-title-rule-colors label { height:44px; min-width:180px; border:1px solid #e2e2e2; border-radius:8px; padding:0 12px; font-size:13px; }
body[data-view="charts"] #chartStudioTitleRuleDialog .chart-studio-title-rule-custom > .chart-studio-title-rule-colors input { height:44px; min-height:44px; }
body[data-view="charts"] #chartStudioTitleRuleDialog .chart-studio-title-rule-preview { border-radius:12px !important; }
body[data-view="charts"] #chartStudioTitleRuleDialog .title-quick-popover { flex-shrink:0; }
body[data-view="charts"] #chartStudioTitleRuleDialog .title-quick-fill [data-title-quick-action="save"],
body[data-view="charts"] #chartStudioTitleRuleDialog .title-quick-fill [data-title-quick-action="more"] { border-color:transparent; }
body[data-view="charts"] #chartStudioTitleRuleDialog [hidden] { display:none !important; }
body[data-view="charts"] #chartStudioTitleRuleDialog .chart-studio-title-rule-actions button { width:auto; flex:0 0 auto; }
body[data-view="charts"] #chartStudioTitleRuleDialog [data-chart-studio-apply-title-rule] { min-width:228px; }
body[data-view="charts"] #chartStudioTitleRuleDialog .title-style-control-row { display:grid; grid-template-columns:2fr 1fr; align-items:end; gap:16px; min-width:0; }
body[data-view="charts"] #chartStudioTitleRuleDialog .title-style-control-row .chart-studio-title-rule-colors { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:0; }
body[data-view="charts"] #chartStudioTitleRuleDialog .title-style-control-row .chart-studio-title-rule-colors label { width:auto; height:44px; border:1px solid #e2e2e2; border-radius:8px; padding:0 10px; min-width:0; font-size:13px; }
body[data-view="charts"] #chartStudioTitleRuleDialog .title-style-control-row .chart-studio-title-rule-colors input { height:44px; min-height:44px; }
@media(max-width:760px) { body[data-view="charts"] #chartStudioTitleRuleDialog .title-style-control-row { grid-template-columns:1fr; } body[data-view="charts"] #chartStudioTitleRuleDialog [data-chart-studio-apply-title-rule] { min-width:150px; } }

#chartStudioTitleRuleDialog .title-token-selection { display:flex; align-items:center; justify-content:space-between; gap:8px; }
#chartStudioTitleRuleDialog .title-token-selection button { padding:4px 8px; min-height:28px; font-size:12px; }