/* Easy setup: all colors inherit the extension light/dark palette. */
#setupWizardModal .modal-content { width: min(820px, calc(100vw - 24px)); max-height: calc(100dvh - 28px); display: flex; flex-direction: column; }
#setupWizardModal .modal-header { flex: 0 0 auto; gap: 12px; }
#setupWizardModal .modal-body { overflow: auto; scrollbar-gutter: stable; min-height: 0; padding: 20px; }
#setupWizardModal h2 { font-size: clamp(20px, 3vw, 26px); margin: 3px 0; }
#setupWizardModal h3 { margin: 0 0 10px; font-size: 19px; }
#setupWizardModal h4 { margin: 10px 0; }
#setupWizardModal .wiz-dots { display: flex; flex-wrap: wrap; gap: 6px; }
#setupWizardModal .wiz-dot { font-size: 11px; white-space: nowrap; }
#setupWizardModal button.wiz-dot { font-family: inherit; cursor: pointer; }
#setupWizardModal button.wiz-dot:hover:not(:disabled) { border-color: var(--brand-500); }
#setupWizardModal button.wiz-dot:disabled { opacity: .55; cursor: wait; }
#setupWizardModal .wiz-dot[aria-current="step"] { background: var(--brand-500); color: white; }
.wiz-kicker { color: var(--brand-500); text-transform: uppercase; letter-spacing: .07em; font-size: 11px; font-weight: 700; }
#setupWizardModal .wiz-style-card { min-width: 150px; }
#setupWizardModal .wiz-field { display: grid; gap: 8px; margin: 18px 0 12px; font-size: 13px; font-weight: 600; }
#setupWizardModal textarea, #setupWizardModal select, #setupWizardModal input[type="tel"] { max-width: 100%; width: 100%; box-sizing: border-box; padding: 10px; color: var(--text); background: var(--surface-1); border: 1px solid var(--border); border-radius: 9px; font: inherit; }
.wiz-presets { border: 0; padding: 0; margin: 18px 0 10px; min-width: 0; }
.wiz-presets legend { font-size: 14px; font-weight: 700; }
.wiz-chip-row { display: flex; flex-wrap: wrap; gap: 8px; }
.wiz-chip-row + .wiz-chip-row { margin-top: 8px; }
#setupWizardModal .wiz-prompt-primary textarea { font-weight: 400; line-height: 1.6; min-height: 160px; resize: vertical; }
.wiz-phone-insert { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.wiz-phone-insert .wiz-field { flex: 1 1 240px; }
.wiz-phone-insert button { margin-top: 22px; }
.wiz-caption-chip { border: 1px solid var(--border); background: var(--surface-1); color: var(--text); border-radius: 22px; padding: 9px 13px; font: inherit; font-size: 13px; cursor: pointer; }
.wiz-caption-chip[aria-pressed="true"] { background: var(--brand-100, #dff3fc); border-color: var(--brand-500); color: var(--brand-700, #075d7c); box-shadow: inset 0 0 0 1px var(--brand-500); }
[data-theme="dark"] .wiz-caption-chip[aria-pressed="true"] { background: #123d50; color: #bdeaff; }
.wiz-caption-options { border-top: 1px solid var(--border); padding-top: 12px; }
.wiz-caption-options summary { cursor: pointer; color: var(--text-muted); font-size: 13px; }
.wiz-preview-controls { display: flex; align-items: end; gap: 12px; flex-wrap: wrap; }
.wiz-preview-controls label { flex: 1 1 200px; min-width: 0; font-size: 12px; display: grid; gap: 6px; }
.wiz-preview-controls button { white-space: normal; }
#wizPreviewStatus[data-kind="error"] { color: var(--danger); }
#wizGenerateCaption:disabled { opacity: .55; cursor: not-allowed; }
#wizPreviewCooldown:empty { display: none; }
#setupWizardModal .wiz-live-preview { background: var(--surface-1); }
.wiz-example, .wiz-summary { margin: 14px 0; padding: 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-2); font-size: 13px; }
.wiz-example pre { margin-bottom: 0; font: 13px/1.6 var(--font-display, sans-serif); white-space: pre-wrap; overflow-wrap: anywhere; }
.wiz-photo-explain { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 12px 0 20px; }
.wiz-photo-explain article, .wiz-reply-cards article { padding: 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-2); min-width: 0; font-size: 13px; line-height: 1.55; }
.wiz-photo-explain p, .wiz-reply-cards p { color: var(--text-muted); }
.wiz-photo-explain button { margin-top: 9px; white-space: normal; }
.wiz-reply-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 12px; }
.wiz-reply-cards button { margin-top: 8px; white-space: normal; }
.wiz-reply-cards blockquote { margin: 12px 0; padding: 12px; border-left: 3px solid var(--brand-500); background: var(--surface-1); border-radius: 4px; }
.wiz-status { margin: 10px 0; font-size: 13px; color: var(--text-muted); overflow-wrap: anywhere; }
.wiz-status[data-kind="error"] { color: var(--danger); }
.wiz-status[data-kind="saved"] { color: var(--success); }
#wizCalRemoveBtn { background: #a65308; border-color: #a65308; color: #fff; }
#wizCalRemoveBtn:disabled { opacity: .5; }
#setupWizardModal .wiz-footer { flex: 0 0 auto; margin: 0; padding: 15px 20px; background: var(--surface-1); border-top: 1px solid var(--border); z-index: 2; }
#wizNextBtn { background: #117646; border-color: #117646; color: white; }
#setupWizardModal .wiz-summary p { margin: 8px 0; }
.wiz-auto-post { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 18px; padding: 16px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-2); }
.wiz-auto-post > div { flex: 1 1 300px; min-width: 0; }
.wiz-auto-post h4 { margin: 0 0 5px !important; color: var(--text); }
.wiz-auto-post p { margin: 6px 0 0; color: var(--text-muted); font-size: 12px; line-height: 1.6; }
.wiz-auto-post p strong { color: var(--text); }
.wiz-auto-post .big-toggle { flex: 0 0 auto; }
#wizAutoPostStatus { font-weight: 650; }
#setupWizardModal [hidden] { display: none !important; }
/* The actual caption/gallery/workspace nodes live here while setup is open.
   One outer dialog, one scrolling body, and always-visible Back/Next controls. */
#setupWizardModal.wiz-has-editor > .modal-content { width: min(1100px, calc(100vw - 24px)); max-width: 1100px !important; }
#setupWizardModal .wiz-editor-host { min-width: 0; margin: 14px 0; }
#setupWizardModal .wiz-editor-host > .modal { position: static; inset: auto; padding: 0; background: none; backdrop-filter: none; z-index: auto; align-items: stretch; justify-content: stretch; }
#setupWizardModal .wiz-editor-host > .modal > .modal-content { width: 100%; max-width: none !important; max-height: none; margin: 0; box-shadow: none; }
#setupWizardModal .wiz-editor-host .modal-body { overflow: visible; padding: 14px; scrollbar-gutter: auto; }
#setupWizardModal .wiz-editor-host #aiModalBody { max-height: none; overflow: visible; }
#setupWizardModal .wiz-editor-host h2 { font-size: 20px; }
#setupWizardModal .wiz-editor-host [inert] { opacity: .65; }
#setupWizardModal #aiphotos { padding: 12px 0; }
/* Compact caption step: keep the real editor and its permission/error states.
   Only duplicate presentation is removed; none of these rules enable actions. */
#setupWizardModal > .modal-content > .modal-header { padding: 10px 18px; }
#setupWizardModal > .modal-content > .modal-header h2 { font-size: 20px; }
#setupWizardModal > .modal-content > .modal-body { padding: 10px 16px; }
#setupWizardModal #wizIntro,
#setupWizardModal #wizPlanLabel,
#setupWizardModal #wizSaveStatus:not([data-kind="error"]):not([data-kind="saved"]) { display: none; }
#setupWizardModal .wiz-dots { margin: 0 0 10px; }
#setupWizardModal .wiz-footer { padding: 10px 16px; }
.wiz-caption-guide { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.wiz-caption-guide > button { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface-1); color: var(--text); text-align: left; font: inherit; cursor: pointer; }
.wiz-caption-guide > button:hover { border-color: var(--brand-500); background: var(--brand-glow-soft); }
.wiz-caption-guide b { display: grid; place-items: center; flex: 0 0 24px; height: 24px; border-radius: 50%; background: var(--brand-500); color: white; font-size: 12px; }
.wiz-caption-guide strong, .wiz-caption-guide small { display: block; }
.wiz-caption-guide strong { font-size: 12px; line-height: 1.35; }
.wiz-caption-guide small { margin-top: 2px; font-size: 10px; line-height: 1.3; color: var(--text-muted); }
.wiz-caption-guide-note { margin: 6px 0; font-size: 11px; line-height: 1.45; color: var(--text-muted); }
#wizCaptionGuideStatus:empty { display: none; }
.wiz-caption-examples { margin: 6px 0; font-size: 11px; line-height: 1.5; color: var(--text-muted); }
.wiz-caption-examples summary { cursor: pointer; font-weight: 650; color: var(--text); }
.wiz-caption-examples > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.wiz-caption-examples article { padding: 10px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface-1); }
.wiz-caption-examples article p { margin: 5px 0 0; }
#setupWizardModal .wiz-caption-vehicle { margin: 5px 0 8px; font-size: 11px; line-height: 1.5; color: var(--text-muted); }
#setupWizardModal .wiz-caption-vehicle summary { cursor: pointer; font-weight: 650; color: var(--text); padding: 3px 0; }
#setupWizardModal .wiz-caption-vehicle > summary { padding-right: 30px; }
#setupWizardModal .wiz-caption-vehicle[open] > summary { margin-bottom: 8px; }
#setupWizardModal.wiz-caption-compact .wiz-editor-host { margin: 6px 0 0; }
#setupWizardModal.wiz-caption-compact #aiContentModal > .modal-content { border: 0; background: transparent; position: relative; }
#setupWizardModal.wiz-caption-compact #aiContentModal > .modal-content > .modal-header { padding: 0 !important; justify-content: flex-end; border: 0; min-height: 0; }
#setupWizardModal.wiz-caption-compact #aiModalTitle,
#setupWizardModal.wiz-caption-compact .cs-intro,
#setupWizardModal.wiz-caption-compact .cs-policy-heading,
#setupWizardModal.wiz-caption-compact .cs-result-heading > p { display: none; }
#setupWizardModal.wiz-caption-compact #aiContentModal > .modal-content > .modal-header .modal-close { position: absolute; right: 0; top: 0; width: 26px; height: 26px; z-index: 1; }
#setupWizardModal.wiz-caption-compact #aiModalBody { padding: 0; }
#setupWizardModal.wiz-caption-compact .cs-vehicle-picker { margin: 0 32px 6px 0; gap: 6px; }
#setupWizardModal.wiz-caption-compact .cs-picker-field label { margin-bottom: 3px; }
#setupWizardModal.wiz-caption-compact .cs-vehicle-facts { padding: 7px 10px; margin-bottom: 8px; }
#setupWizardModal.wiz-caption-compact .cs-vehicle-facts .cs-title { font-size: 14px; margin: 2px 0 4px; }
#setupWizardModal.wiz-caption-compact .cs-fact-tags { margin-top: 4px; gap: 4px; }
#setupWizardModal.wiz-caption-compact .cs-fact-tags span { padding: 2px 6px; }
#setupWizardModal.wiz-caption-compact .cs-source-details { margin-top: 4px; }
#setupWizardModal.wiz-caption-compact > .modal-content { width: min(1280px, calc(100vw - 24px)); max-width: 1280px !important; }
#setupWizardModal.wiz-caption-compact .cs-workspace { gap: 12px; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
#setupWizardModal.wiz-caption-compact .cs-policy-editor { padding: 10px; }
#setupWizardModal.wiz-caption-compact .cs-sticky-actions { margin: 0 0 5px; }
#setupWizardModal.wiz-caption-compact .cs-policy-fields { margin-top: 6px; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); column-gap: 14px; }
#setupWizardModal.wiz-caption-compact .cs-policy-style { margin-bottom: 5px; grid-column: 1 / -1; }
#setupWizardModal.wiz-caption-compact .cs-policy-style > span { width: auto; }
#setupWizardModal.wiz-caption-compact .cs-policy-label { margin: 6px 0 3px; }
#setupWizardModal.wiz-caption-compact .wiz-caption-shortcuts, #setupWizardModal.wiz-caption-compact .wiz-caption-writing { min-width: 0; }
#setupWizardModal.wiz-caption-compact .cs-policy-chips { max-height: none; overflow: visible; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3px 5px; padding: 2px; margin: 4px 0 6px; }
#setupWizardModal.wiz-caption-compact .cs-policy-chips .feature-chip { font-size: 12px; line-height: 1.3; padding: 5px 7px; }
#setupWizardModal.wiz-caption-compact .cs-policy-hint { font-size: 11px; line-height: 1.4; }
#setupWizardModal.wiz-caption-compact :is(#csPolicyInstructions, #csSimPrompt) { height: 74px; min-height: 74px; border: 2px solid var(--brand-500); }
#setupWizardModal.wiz-caption-compact :is(#csPolicySpecificText, #csSimExact) { height: 44px; min-height: 44px; }
#setupWizardModal.wiz-caption-compact :is(#csGeneratePreview, #csPolicySave) { box-shadow: 0 0 0 1px var(--brand-500); }
#setupWizardModal.wiz-caption-compact .cs-result-heading { margin-bottom: 6px; }
#setupWizardModal.wiz-caption-compact .cs-result-heading h3 { font-size: 16px; margin: 2px 0; }
#setupWizardModal.wiz-caption-compact .cs-comparison { gap: 8px; }
#setupWizardModal.wiz-caption-compact .cs-caption-text { min-height: 150px; max-height: 230px; padding: 10px; font-size: 12px; line-height: 1.5; }
#setupWizardModal.wiz-caption-compact .cs-after textarea { height: 205px; min-height: 150px; padding: 10px; font-size: 12px; line-height: 1.5; }
#setupWizardModal.wiz-caption-compact .cs-policy-message:empty { display: none; }
#setupWizardModal.wiz-caption-compact .cs-policy-actions span,
#setupWizardModal.wiz-caption-compact .cs-policy-preview-terms,
#setupWizardModal.wiz-caption-compact .cs-actions { display: none; }
#setupWizardModal.wiz-caption-compact .cs-policy-actions { margin-top: 6px; padding-top: 6px; }
#setupWizardModal.wiz-caption-compact .cs-after-empty { padding: 12px; font-size: 12px; line-height: 1.5; }
#setupWizardModal.wiz-caption-compact .cs-after-empty h4 { margin: 0 0 6px; font-size: 13px; }
#setupWizardModal.wiz-caption-compact .cs-after-empty p { margin: 6px 0; }
#setupWizardModal .wiz-caption-target { outline: 3px solid var(--brand-500) !important; outline-offset: 3px; }
@media (max-width: 720px) {
  #setupWizardModal.wiz-caption-compact .cs-workspace { grid-template-columns: minmax(0, 1fr); }
  #setupWizardModal.wiz-caption-compact .cs-policy-fields { grid-template-columns: minmax(0, 1fr); }
  #setupWizardModal.wiz-caption-compact .cs-policy-chips { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wiz-caption-guide { gap: 5px; }
  .wiz-caption-guide > button { padding: 7px; gap: 5px; align-items: flex-start; }
  .wiz-caption-guide small { display: none; }
  .wiz-caption-guide strong { font-size: 11px; }
  .wiz-caption-examples > div { grid-template-columns: minmax(0, 1fr); }
}
#setupWizardModal button:focus-visible, #setupWizardModal select:focus-visible, #setupWizardModal textarea:focus-visible, #setupWizardModal input:focus-visible { outline: 3px solid var(--brand-500); outline-offset: 3px; }
@media (max-width: 600px) {
  #setupWizardModal .modal-body { padding: 14px; }
  #setupWizardModal .wiz-footer { padding: 12px 14px; flex-wrap: wrap; }
  #setupWizardModal .wiz-footer .btn { white-space: normal; }
  .wiz-photo-explain, .wiz-reply-cards { grid-template-columns: minmax(0, 1fr); }
  #setupWizardModal .wiz-style-card { min-width: 130px; }
  #setupWizardModal .wiz-dots { gap: 5px; }
  #setupWizardModal .wiz-dot { padding: 4px 7px; }
  .wiz-auto-post { align-items: flex-start; flex-direction: column; }
}

/* ── Caption style: the toolbar entry + the guided panel (app-caption-setup.js).
   Tokens only, so refined/classic × light/dark all follow the palette; the
   pressed chip carries a ✓ as well as a colour. No animation is needed for
   anything to be readable — the only transition is opt-in below. */
/* TEXT colours, kept apart from the fill/border colours. Classic light's
   cyan (#0891B2) and amber (#D97706) are drawn for fills; as 10–12.5px text
   on its paper surfaces they measured 3.0–3.4:1 and 2.6–2.9:1, under the
   4.5:1 floor — the blocking status line, the meter and the "Suggested" tag
   among them. Both light palettes take --brand-600 for accent text (refined's
   #087c9d also fell to 4.2:1 on a pressed chip), and classic light mixes its
   amber toward --text (≥4.9:1 on every surface here; still amber, still
   tokens — refined already ships a darkened amber). The dark palettes
   measure 6:1 or better and keep the base tokens. */
#captionSetupModal, .cap-setup-entry { --cap-accent-text: var(--brand-500); --cap-warn-text: var(--warning); }
html:not([data-theme="dark"]) :is(#captionSetupModal, .cap-setup-entry) { --cap-accent-text: var(--brand-600); }
html:not([data-appearance="refined"]):not([data-theme="dark"]) #captionSetupModal { --cap-warn-text: color-mix(in srgb, var(--warning) 62%, var(--text)); }
.cap-setup-entry { display: inline-flex; align-items: center; gap: 5px; max-width: 100%; }
.cap-setup-k { color: var(--text-muted); font-weight: 600; }
.cap-setup-v { color: var(--text); font-weight: 650; max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cap-setup-edit { color: var(--cap-accent-text); font-weight: 650; padding-left: 7px; margin-left: 2px; border-left: 1px solid var(--border); }
.cap-setup-entry.needs-setup::after { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--brand-500); flex: none; }
@media (max-width: 520px) { .cap-setup-v { max-width: 130px; } }

#captionSetupModal .modal-content { width: min(720px, calc(100vw - 24px)); max-width: 720px; max-height: calc(100dvh - 28px); display: flex; flex-direction: column; }
.cap-setup-grid { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-areas: "main" "side" "rest"; gap: 0 22px; }
.cap-setup-main { grid-area: main; min-width: 0; }
.cap-setup-side { grid-area: side; min-width: 0; }
.cap-setup-rest { grid-area: rest; min-width: 0; }
@media (min-width: 960px) {
  #captionSetupModal .modal-content { width: min(1000px, calc(100vw - 32px)); max-width: 1000px; }
  .cap-setup-grid { grid-template-columns: minmax(0, 1fr) 320px; grid-template-areas: "main side" "rest side"; }
  .cap-setup-side { position: sticky; top: 0; align-self: start; max-height: calc(100dvh - 210px); overflow: auto; }
}
#captionSetupModal .modal-header { flex: 0 0 auto; gap: 12px; }
#captionSetupModal .modal-header h2 { font-size: clamp(18px, 2.6vw, 22px); margin: 3px 0 0; }
/* The 11px kicker borrowed from Easy setup is text too. */
#captionSetupModal .wiz-kicker { color: var(--cap-accent-text); }
#captionSetupModal .modal-body { overflow: auto; min-height: 0; padding: 18px 20px; }
#captionSetupModal [hidden] { display: none !important; }
.cap-setup-lead { font-size: 13px; color: var(--text-muted); line-height: 1.5; margin: 0 0 12px; }
.cap-setup-note { font-size: 12px; color: var(--text-muted); line-height: 1.5; margin: 6px 0 0; }
.cap-setup-notice { padding: 10px 12px; border: 1px solid var(--brand-500); border-radius: 10px; background: var(--brand-glow-soft); color: var(--text); font-size: 13px; line-height: 1.5; margin: 0 0 12px; }
.cap-setup-top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 0 0 18px; }
.cap-setup-top .cap-setup-note { margin: 0; flex: 1 1 220px; }
.cap-q { border: 0; padding: 0; margin: 0 0 20px; min-width: 0; }
.cap-q legend { display: flex; align-items: center; gap: 8px; padding: 0; margin: 0 0 9px; font-size: 14px; font-weight: 700; color: var(--text); }
.cap-q-n { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: var(--brand-glow-soft); color: var(--cap-accent-text); font-size: 12px; font-weight: 700; flex: none; }
.cap-q-hint { font-size: 12px; color: var(--text-muted); line-height: 1.5; margin: 7px 0 0; }
.cap-q > .cap-q-hint:first-of-type { margin: -3px 0 9px; }
.cap-q-why { display: block; margin-top: 2px; }
.cap-chip-row { display: flex; flex-wrap: wrap; gap: 8px; }
.cap-chip { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 7px 14px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface-1); color: var(--text); font: inherit; font-size: 13px; font-weight: 600; line-height: 1.2; cursor: pointer; }
.cap-chip:hover { border-color: var(--brand-500); }
.cap-chip[aria-pressed="true"] { background: var(--brand-glow-soft); border-color: var(--brand-500); box-shadow: inset 0 0 0 1px var(--brand-500); }
.cap-chip[aria-pressed="true"]::before { content: '✓'; color: var(--cap-accent-text); font-weight: 800; }
.cap-chip-other:not([aria-pressed="true"]) { color: var(--text-muted); font-weight: 500; border-style: dashed; }
.cap-sugg { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--cap-accent-text); border: 1px solid var(--cap-accent-text); border-radius: 999px; padding: 1px 6px; }
.cap-input-row { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.cap-input-label { flex: 0 0 120px; font-size: 12px; font-weight: 600; color: var(--text-muted); }
#captionSetupModal input[type="text"], #captionSetupModal input[type="tel"], #captionSetupModal textarea { box-sizing: border-box; padding: 9px 11px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface-0); color: var(--text); font: inherit; font-size: 13px; font-weight: 400; }
#captionSetupModal .cap-input-row :is(input[type="text"], input[type="tel"]) { flex: 1 1 200px; min-width: 0; max-width: 340px; }
#captionSetupModal input[aria-invalid="true"] { border-color: var(--cap-warn-text); }
#captionSetupModal input[type="checkbox"] { accent-color: var(--brand-500); width: 16px; height: 16px; margin: 0; }
.cap-input-err { flex-basis: 100%; font-size: 12px; color: var(--cap-warn-text); }
.cap-input-err:empty { display: none; }
.cap-input-note { font-size: 11.5px; color: var(--text-muted); }
.cap-use-own { white-space: normal; text-align: left; }
.cap-use-from { color: var(--text-muted); font-weight: 400; }
.cap-sub { flex-basis: 100%; display: flex; align-items: center; gap: 8px; padding-left: 128px; font-size: 12.5px; color: var(--text); cursor: pointer; }
.cap-link { background: none; border: 0; padding: 0; font: inherit; color: var(--cap-accent-text); text-decoration: underline; cursor: pointer; }
.cap-field { display: grid; gap: 8px; margin: 4px 0 16px; font-size: 14px; font-weight: 700; color: var(--text); }
.cap-field-hint { font-size: 12px; font-weight: 400; color: var(--text-muted); }
#captionSetupModal textarea { width: 100%; max-width: 100%; resize: vertical; line-height: 1.5; }
.cap-example { margin: 0 0 12px; padding: 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-0); }
.cap-example h4 { margin: 0; font-size: 13px; color: var(--text); }
.cap-example pre { margin: 10px 0 0; font-family: inherit; font-size: 13px; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; color: var(--text); }
.cap-compiled { margin: 0 0 8px; }
.cap-compiled summary { cursor: pointer; font-size: 12.5px; color: var(--text-muted); }
.cap-compiled pre { margin: 8px 0 0; padding: 10px 12px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface-0); color: var(--text); font-size: 12px; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }
.cap-setup-footer { flex: 0 0 auto; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 12px 20px; border-top: 1px solid var(--border); background: var(--surface-1); }
.cap-setup-status { flex: 1 1 100%; margin: 0; font-size: 12.5px; line-height: 1.45; color: var(--text-muted); overflow-wrap: anywhere; }
.cap-setup-status:empty { display: none; }
.cap-setup-status[data-kind="error"], .cap-setup-status[data-kind="warn"] { color: var(--cap-warn-text); font-weight: 600; }
.cap-meter { font-size: 12px; color: var(--text-muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cap-meter[data-over="true"] { color: var(--cap-warn-text); font-weight: 700; }
.cap-spacer { flex: 1 1 auto; }
#captionSetupModal :is(button, input, textarea, summary):focus-visible { outline: 3px solid var(--brand-500); outline-offset: 2px; }
@media (prefers-reduced-motion: no-preference) {
  .cap-chip { transition: border-color .15s ease, background-color .15s ease; }
}
@media (max-width: 560px) {
  #captionSetupModal .modal-body { padding: 14px; }
  .cap-setup-footer { padding: 12px 14px; }
  .cap-setup-footer .btn { white-space: normal; flex: 1 1 auto; }
  .cap-setup-footer .cap-meter { flex-basis: 100%; }
  .cap-setup-footer .cap-spacer { display: none; }
  .cap-input-label { flex-basis: 100%; }
  .cap-sub { padding-left: 0; }
  #captionSetupModal .cap-input-row input { max-width: none; }
}
/* Classic has no .btn-ghost of its own (it falls back to the plain, filled
   .btn); inside this panel a ghost button stays quiet in every palette. */
#captionSetupModal .btn-ghost { background: transparent; border-color: transparent; color: var(--text-muted); }
#captionSetupModal .btn-ghost:hover:not(:disabled) { color: var(--text); border-color: var(--border); }