/* Detector tool skin — v7 "Indigo" identity.
   Re-points the R62 token table on its four scope classes so the ENTIRE tool
   re-themes without touching detector-r62.css or any plugin JS/markup (all
   .r62-* components consume these variables). Loaded after ai-detector-r62
   via dependency. Semantic status colors (teal=lower, amber=mixed, error)
   keep their R62 values — only brand/neutral tones change.
   AA verified: #5B48D9 text/bg pairs >=4.5:1 on all surfaces used. */
.ai-detector-wrapper-v3,
.ai-detector-results-v3,
.ai-detector-loading-screen-v3,
.ai-detector-error-v2 {
    --r62-page: #F8F9FE;
    --r62-primary: #5B48D9;
    --r62-primary-dark: #4638B8;
    --r62-peach: #E9E5FB;
    --r62-text: #15132A;
    --r62-text-2: #6D6889;
    --r62-border: #E4E0F2;
    --r62-border-strong: #D5CEF0;
    --r62-higher: #5B48D9;
    --r62-higher-bg: #E9E5FB;
    /* v8 handoff body face. This single variable feeds every .r62-* component,
       so leaving the v7 'Inter' here rendered the whole tool — labels, notes,
       select, sentence table — in a font the handoff never uses. */
    --r62-font: 'IBM Plex Sans', 'Plex Fallback', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* ── skin v2: everything the token table cannot reach ──────────────────── */

/* Status alignment with the site palette (AA-computed):
   lower-signal teal → site green; error red → #D31C1C on #FEF2F2. Amber kept. */
.ai-detector-wrapper-v3, .ai-detector-results-v3,
.ai-detector-loading-screen-v3, .ai-detector-error-v2 {
    --r62-teal: #15803D;
    --r62-teal-bg: #EFF9F1;
    --r62-error: #D31C1C;
    --r62-error-bg: #FEF2F2;
}

/* Analyze button: legacy rule carries hardcoded orange shadows + hover
   gradient; restyle to the site's gradient pill. Disabled state untouched. */
.ai-detector-wrapper-v3 .submit-btn-v3:not(:disabled) {
    background: linear-gradient(120deg, #6d5ae6 0%, #9333ea 100%);
    border-radius: 999px;
    box-shadow: 0 8px 24px rgba(91, 72, 217, .25);
    letter-spacing: .2px;
}
.ai-detector-wrapper-v3 .submit-btn-v3:not(:disabled):hover {
    background: linear-gradient(120deg, #5b48d9 0%, #7e22ce 100%);
    box-shadow: 0 10px 28px rgba(91, 72, 217, .32);
    transform: translateY(-1px) scale(1.003);
}
.ai-detector-wrapper-v3 .submit-btn-v3:disabled { border-radius: 999px; }

/* R62 buttons become pills like every site action. */
.r62-btn, .r62-btn-primary, .r62-btn-secondary { border-radius: 999px; }
.r62-btn-primary { background: linear-gradient(120deg, #6d5ae6 0%, #9333ea 100%); border-color: transparent; }
.r62-btn-primary:hover { background: linear-gradient(120deg, #5b48d9 0%, #7e22ce 100%); border-color: transparent; }

/* Scaffold elements with inline styles (class-targeted, hence !important). */
.detector-result-notice {
    background: #fafafe !important;
    border: 1px solid #E5E4F2 !important;
    border-left: 4px solid #5b48d9 !important;
    border-radius: 12px !important;
    color: #4A4869 !important;
}
.r62-sort, .r62-ssort { background: #fff !important; border-radius: 12px !important; }

/* Score-ring + checkpoint icon strokes (presentation attrs lose to CSS). */
.progress-ring-bg { stroke: rgba(27, 25, 64, .08); }
.checkpoint-status-icon svg circle { stroke: rgba(27, 25, 64, .12); }
.checkpoint-status-item.detected .checkpoint-status-icon svg circle { stroke: #D31C1C; fill: #D31C1C; }

/* Loading brain + (hidden) gauge gradients → violet. */
#loadingGradient stop:nth-of-type(1) { stop-color: #6D5AE6 !important; }
#loadingGradient stop:nth-of-type(2) { stop-color: #7C3AED !important; }
#loadingGradient stop:nth-of-type(3) { stop-color: #9333EA !important; }
#aiGradient stop { stop-color: #7C3AED !important; }

/* ── skin v3: the ~45 active literals the deep inventory found ─────────── */

/* Token gap: r62 never re-points the legacy blue/purple slots (both orange). */
.ai-detector-wrapper-v3, .ai-detector-results-v3,
.ai-detector-loading-screen-v3, .ai-detector-error-v2 {
    --color-blue: #5B48D9; --color-blue-dark: #4638B8; --color-blue-bg: rgba(91,72,217,.07);
    --color-purple: #7C3AED; --color-purple-dark: #6D28D9; --color-purple-bg: rgba(124,58,237,.08);
}

/* Focus / hover states hardcoded orange in the v4.2 block. */
.ai-detector-wrapper-v3 .form-textarea-v3:focus {
    border-color: #5B48D9 !important;
    box-shadow: 0 0 0 3px rgba(91,72,217,.10) !important;
}
.ai-detector-wrapper-v3 .form-select-v3:hover,
.ai-detector-wrapper-v3 .form-select-v3:focus { border-color: #5B48D9 !important; }
.ai-detector-wrapper-v3 .language-select-wrapper:hover .language-display {
    border-color: #5B48D9 !important;
    box-shadow: 0 4px 12px rgba(91,72,217,.14) !important;
}
.ai-detector-wrapper-v3 .language-select:focus + .language-display {
    border-color: #5B48D9 !important;
    box-shadow: 0 0 0 4px rgba(91,72,217,.14), 0 4px 12px rgba(91,72,217,.18) !important;
}
.ai-detector-wrapper-v3 .char-counter-v3.ready .current-count-v3,
.ai-detector-wrapper-v3 .char-counter-v3.ready .word-count-v3,
.ai-detector-wrapper-v3 .char-counter-v3.ready .char-separator,
.ai-detector-wrapper-v3 .char-counter-v3.ready .char-minimum-notice { color: #5442CE !important; }
.ai-detector-wrapper-v3 .header-badge-primary,
.ai-detector-wrapper-v3 .header-badge-info { background: rgba(91,72,217,.08) !important; color: #5442CE !important; }

/* Results action buttons (download / copy). */
.ai-detector-results-v3 .action-btn-primary { background: #5B48D9 !important; border-color: #5B48D9 !important; }
.ai-detector-results-v3 .action-btn-primary:hover { background: #4638B8 !important; border-color: #4638B8 !important; }

/* Evidence heat highlights: orange tints → violet ramp (ink stays readable). */
.ai-detector-results-v3 .ai-highlight,
.highlighted-text-container-v3 .ai-highlight { background: rgba(124,58,237,.22); border-bottom-color: rgba(124,58,237,.75); }
.ai-detector-results-v3 .ai-highlight[data-heat="high"],
.highlighted-text-container-v3 .ai-highlight[data-heat="high"] { background: rgba(124,58,237,.30); border-bottom-color: rgba(109,40,217,.95); }
.ai-detector-results-v3 .ai-highlight[data-heat="medium"],
.highlighted-text-container-v3 .ai-highlight[data-heat="medium"] { background: rgba(109,90,230,.24); border-bottom-color: rgba(91,72,217,.85); }
.ai-detector-results-v3 .ai-highlight[data-heat="low"],
.highlighted-text-container-v3 .ai-highlight[data-heat="low"] { background: rgba(139,124,240,.16); border-bottom-color: rgba(139,124,240,.7); }
.ai-detector-results-v3 .ai-highlight:hover,
.highlighted-text-container-v3 .ai-highlight:hover { background: rgba(124,58,237,.38); }

/* Highlight tooltip: amber gradient → indigo. */
.highlight-tooltip { background: linear-gradient(135deg,#6D5AE6,#5B48D9) !important; box-shadow: 0 8px 24px rgba(91,72,217,.35) !important; }
.highlight-tooltip::after { border-top-color: #5B48D9 !important; }

/* "Understanding the result" explainer components. */
.ai-detector-results-v3 .metric-row, .how-analysis-works-section-v3 .metric-row { border-left-color: #5B48D9 !important; }
.ai-detector-results-v3 .metric-number, .how-analysis-works-section-v3 .metric-number {
    background: linear-gradient(120deg,#6D5AE6,#9333EA) !important;
    box-shadow: 0 4px 11px rgba(91,72,217,.25) !important;
}
/* explainer scale: 'lower' band was painted brand orange — use the real green */
.how-analysis-works-section-v3 .scale-segment.green,
.ai-detector-results-v3 .scale-segment.green { background: linear-gradient(135deg,#15803D,#116632) !important; }

/* Loading screen: container border rode the orange --color-purple (re-pointed
   above); checkpoint dots + radial sweep are literals. */
.ai-detector-loading-screen-v3 .loading-checkpoint-dot { background: #5B48D9 !important; border-color: #5B48D9 !important; }

/* Warm literals inside detector-r62.css itself (same selectors, later file wins). */
.r62-source mark[aria-current="true"] { background: #DDD4F9; }
.r62-passage[aria-current="true"] { background: #FCFBFF; }
.r62-skeleton-row { background: linear-gradient(90deg,#EFEFF8 25%,#F7F7FC 37%,#EFEFF8 63%); }

/* ── skin v3.1: last residuals (pattern count, summary card, methodology note) ── */
.ai-detector-results-v3 .pattern-count {
    background: linear-gradient(120deg,#6D5AE6 0%,#9333EA 100%) !important;
    -webkit-background-clip: text !important; background-clip: text !important;
    -webkit-text-fill-color: transparent !important; color: #6D5AE6;
}
/* summary/section cards that carried warm tinted borders + glows */
.dc-tool-methodology-note { border-left-color: #5B48D9 !important; background: #fafafe !important; }
.dc-tool-methodology-note a { color: #5442CE !important; }
.factor-item { background: #F1F1FA !important; }

/* secondary reset button — was green text on a warm border */
.ai-detector-results-v3 .analyze-another-btn-v3 {
    color: #5442CE !important; border: 1px solid #C9C7E0 !important;
    background: #fff !important; border-radius: 999px !important;
}
.ai-detector-results-v3 .analyze-another-btn-v3:hover {
    background: #F1F1FA !important; border-color: #5B48D9 !important; color: #4638B8 !important;
}

/* mobile refinements from the design review */
@media(max-width:600px){
  /* Ctrl+Enter chip is meaningless on touch and crushed the counter row */
  .ai-detector-wrapper-v3 .keyboard-hint{display:none}
  .ai-detector-wrapper-v3 .language-display-text{white-space:normal;font-size:15px}
}
/* violet focus ring on the textarea (was ink) */
.ai-detector-wrapper-v3 .form-textarea-v3:focus-visible{outline-color:#5B48D9}

/* ── skin v4: results + loading presentation rebuilt (user: "very poor") ── */

/* LOADING — was a hard 2px+4px purple frame with a rotating warm radial sweep
   and edge-cramped title. Now a quiet card matching the tool container. */
.ai-detector-loading-screen-v3 .loading-container-v3 {
    background: #fff;
    border: 1px solid #E5E4F2;
    border-left-width: 1px;
    border-radius: 20px;
    box-shadow: 0 6px 24px -8px rgba(31, 27, 84, .08);
    padding: 36px 40px;
    overflow: hidden;
}
.ai-detector-loading-screen-v3 .loading-container-v3::before { display: none; animation: none; }
@media (max-width: 600px) {
    .ai-detector-loading-screen-v3 .loading-container-v3 { padding: 24px 20px; }
}

/* RESULTS SHELL — one coherent card; legacy chrome off. */
.ai-detector-results-v3.section-results {
    background: #fff;
    border: 1px solid #E5E4F2;
    border-radius: 20px;
    box-shadow: 0 6px 24px -8px rgba(31, 27, 84, .08);
    padding: 36px 40px;
}
@media (max-width: 600px) {
    .ai-detector-results-v3.section-results { padding: 22px 16px; }
}
/* "Analysis complete": plain left-aligned section title, no banner box */
.ai-detector-results-v3 .results-title-v3 {
    text-align: left !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    border: none !important;
    background: none !important;
    padding: 0 !important;
    margin: 0 0 18px !important;
    letter-spacing: -.02em;
}

/* Stats row: quiet aligned tiles — no hover lift, no mixed tints */
.ai-detector-results-v3 .stat-item {
    background: #FAFAFE !important;
    border: 1px solid #E5E4F2 !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    transform: none !important;
    transition: none !important;
}
.ai-detector-results-v3 .stat-item:hover { transform: none !important; box-shadow: none !important; border-color: #C9C7E0 !important; }

/* Detection Summary: the one-item grid floated a giant number in dead space.
   Compact inline stat chip instead. */
.ai-detector-results-v3 .pattern-summary-grid { display: flex !important; flex-wrap: wrap; gap: 12px; }
.ai-detector-results-v3 .pattern-summary-item {
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    gap: 14px;
    background: #FAFAFE !important;
    border: 1px solid #E5E4F2 !important;
    border-radius: 12px !important;
    padding: 12px 20px !important;
    min-height: 0 !important;
    width: auto !important;
    text-align: left !important;
}
.ai-detector-results-v3 .pattern-summary-item .pattern-count {
    font-size: 30px !important;
    line-height: 1 !important;
    padding: 0 !important;
    margin: 0 !important;
}
.ai-detector-results-v3 .pattern-summary-item .pattern-label,
.ai-detector-results-v3 .pattern-summary-item [class*="label"] {
    font-size: 12px !important;
    letter-spacing: .06em;
    margin: 0 !important;
    text-align: left !important;
}
.ai-detector-results-v3 .pattern-summary-header h3 { font-size: 18px; letter-spacing: -.01em; margin: 0; }
.ai-detector-results-v3 .pattern-summary-description { color: #6E6C8C; font-size: 14px; }

/* the small duplicate reset button 200px under the real action row */
.ai-detector-results-v3 .analyze-another-btn-v3 { display: none !important; }

/* consistent inner-section rhythm */
.ai-detector-results-v3 .pattern-detection-summary { margin-top: 26px; padding-top: 26px; border-top: 1px solid #EFEFF8; }

/* ── skin v5: state-verification findings (5-flow live drive) ──────────── */

/* duplicate back-to-top: the plugin ships its own warm-styled button that
   stacks on the theme's violet one — plugin copy retired */
.ai-detector-wrapper-v3 ~ .back-to-top-btn, .back-to-top-btn { display: none !important; }

/* error card: legacy orange Try Again + cramped padding + shouty hierarchy */
.ai-detector-error-v2 { padding: 32px !important; border-radius: 20px !important; border: 1px solid #E5E4F2 !important; }
.ai-detector-error-v2 .try-again-btn-v2 {
    background: linear-gradient(120deg,#6d5ae6 0%,#9333ea 100%) !important;
    border: none !important; border-radius: 999px !important; color: #fff !important;
    padding: 12px 26px !important;
}
.ai-detector-error-v2 .try-again-btn-v2:hover { background: linear-gradient(120deg,#5b48d9 0%,#7e22ce 100%) !important; }
/* reassurance line calms down; the heading carries the weight */
.ai-detector-error-v2 [class*="reassur"], .ai-detector-error-v2 .error-keep-text { color: #4A4869 !important; font-weight: 500 !important; }

/* mobile tabs: labels superimposed at 390px — scrollable single row */
@media (max-width: 600px) {
    .r62-tabs { display: flex !important; flex-wrap: nowrap !important; overflow-x: auto !important;
        -webkit-overflow-scrolling: touch; gap: 4px; scrollbar-width: none; }
    .r62-tabs::-webkit-scrollbar { display: none; }
    .r62-tabs [role="tab"] { flex: 0 0 auto !important; white-space: nowrap !important; min-height: 44px; }
    /* absolute nowrap tooltips overflowed the page 472px wide — pointless on touch */
    .highlight-tooltip { display: none !important; }
}

/* signal analyzer cards: red-500 borders were never semantic */
.ai-detector-results-v3 [class*="analyzer-card"], .how-analysis-works-section-v3 [class*="analyzer-card"],
.ai-detector-results-v3 .checkpoint-card, .how-analysis-works-section-v3 .checkpoint-card {
    border-color: #E5E4F2 !important;
}
/* KPI tile + stats icon chips: burnt orange → violet tint */
.ai-detector-results-v3 .stat-icon, .ai-detector-results-v3 [class*="kpi"] [class*="icon"],
.ai-detector-results-v3 .insight-icon {
    background: rgba(91,72,217,.10) !important; color: #5B48D9 !important;
    border-color: rgba(91,72,217,.25) !important;
}
/* readability tile group frame + step-section beige backgrounds */
.ai-detector-results-v3 .text-stats-grid, .ai-detector-results-v3 [class*="readability"] {
    border-color: #E5E4F2 !important;
}
.ai-detector-results-v3 [class*="step-section"], .how-analysis-works-section-v3 [class*="step"] > div {
    background-color: #F5F5FB;
}
/* understanding-results: stack instead of desktop split at phone widths */
@media (max-width: 600px) {
    .result-understanding-section-v3 .section-header-with-toggle,
    .result-understanding-section-v3 header { display: block !important; }
    .result-understanding-section-v3 h2 { font-size: 22px !important; text-align: left !important; }
}

/* upload Remove button + disabled submit + muted counters: cool neutrals */
.ai-detector-wrapper-v3 .upload-remove-btn, .ai-detector-wrapper-v3 [class*="remove-file"] {
    border-color: #C9C7E0 !important; color: #5442CE !important;
}
.ai-detector-wrapper-v3 .upload-remove-btn:hover { background: #F1F1FA !important; }
.ai-detector-wrapper-v3 .submit-btn-v3:disabled { background: #E3E3EF !important; color: #4A4869 !important; }
.ai-detector-wrapper-v3 .char-status-text, .ai-detector-wrapper-v3 .char-minimum-notice,
.ai-detector-wrapper-v3 .upload-sub-text, .ai-detector-wrapper-v3 .upload-formats,
.ai-detector-wrapper-v3 .keyboard-hint { color: #6E6C8C !important; }
.ai-detector-wrapper-v3 .keyboard-hint { background: rgba(27,25,64,.05) !important; }

/* ── craft: the tool's two signature moments ── */
/* Tab underline slides between tabs instead of snapping. */
.r62-tabs [role="tab"]{
  border-bottom-color:transparent !important;
  background-image:linear-gradient(90deg,#6D5AE6,#9333EA);
  background-repeat:no-repeat;background-position:left bottom;background-size:0% 3px;
  transition:background-size .22s ease,color .15s ease}
.r62-tabs [role="tab"][aria-selected="true"]{background-size:100% 3px}
@media(prefers-reduced-motion:reduce){.r62-tabs [role="tab"]{transition:none}}
/* The score figure is what gets screenshotted — it earns the gradient. */
.r62-score-value{
  background:linear-gradient(120deg,#4B3BC4 0%,#7C3AED 100%);
  -webkit-background-clip:text;background-clip:text;
  color:#5B48D9;-webkit-text-fill-color:transparent}

/* ── skin v6: input column per the design handoff (§3 left) ── */
.dc-tool-frame__input .ai-detector-wrapper-v3{--r62-page:#fbfaff}

/* Textarea: 280px min, 14px radius, field bg, indigo focus on white */
.dc-tool-frame__input .form-textarea-v3{min-height:270px !important;border-radius:14px !important;
  padding:16px !important;font-size:15px !important;line-height:1.65 !important;
  background:#faf9fe !important;border:1px solid #e4e0f2 !important}
.dc-tool-frame__input .form-textarea-v3:focus{border-color:#5b48d9 !important;background:#fff !important;
  box-shadow:none !important}

/* Language select + display: full column width, 45px tall, 10px radius (handoff) */
.dc-tool-frame__input .form-select-v3,
.dc-tool-frame__input .language-display{border-radius:10px !important;background:#faf9fe !important;
  border:1px solid #e4e0f2 !important;font-size:14.5px !important;font-weight:400 !important;
  font-family:'IBM Plex Sans',sans-serif !important;color:#15132a !important;
  min-height:45px !important;height:45px !important;padding:11px 40px 11px 12px !important;
  box-shadow:none !important;transform:none !important}
.dc-tool-frame__input .language-select-wrapper:hover .language-display{border-color:#5b48d9 !important;
  box-shadow:none !important;transform:none !important}
.dc-tool-frame__input .language-select:focus + .language-display{border-color:#5b48d9 !important;
  box-shadow:0 0 0 3px rgba(91,72,217,.12) !important}
.dc-tool-frame__input .language-select-arrow{width:16px !important;height:16px !important}
.dc-tool-frame__input .language-select-wrapper:hover .language-select-arrow{transform:none !important}

/* Counter row: mono 12px faint */
.dc-tool-frame__input .char-counter-v3,
.dc-tool-frame__input .char-counter-v3 *{font-family:'IBM Plex Mono',monospace !important;
  font-size:12px !important;color:#8a85a6 !important;letter-spacing:0 !important}
.dc-tool-frame__input .char-counter-v3.ready .current-count-v3,
.dc-tool-frame__input .char-counter-v3.ready .word-count-v3{color:#5b48d9 !important}
.dc-tool-frame__input .keyboard-hint{background:transparent !important;color:#8a85a6 !important;
  font-family:'IBM Plex Mono',monospace !important;font-size:12px !important}

/* Upload disclosure row (the collapsed affordance actually rendered): 64px tall,
   tinted field surface, lavender hairline, 34px indigo icon tile. */
.dc-tool-frame__input .upload-disclosure-btn{min-height:64px !important;border-radius:12px !important;
  background:#fbfaff !important;border:1px solid #d5cef0 !important;padding:13px 15px !important;
  gap:12px !important;box-shadow:none !important}
.dc-tool-frame__input .upload-disclosure-btn:hover{border-color:#5b48d9 !important;
  background:#f6f3ff !important;transform:none !important}
.dc-tool-frame__input .upload-disclosure-btn>svg:first-of-type{flex:0 0 auto;width:34px !important;
  height:34px !important;padding:8px;box-sizing:border-box;background:#efecfb;border-radius:9px;
  color:#5b48d9 !important}
.dc-tool-frame__input .upload-disclosure-label{font-family:'IBM Plex Sans',sans-serif !important;
  font-size:14px !important;font-weight:600 !important;color:#2a2542 !important}
.dc-tool-frame__input .upload-disclosure-hint{font-family:'IBM Plex Sans',sans-serif !important;
  font-size:12.5px !important;font-weight:400 !important;color:#8a85a6 !important}
.dc-tool-frame__input .upload-disclosure-chevron{width:16px !important;height:16px !important;
  color:#8a85a6 !important}

/* Upload dropzone: dashed lavender, tinted icon square */
.dc-tool-frame__input [class*="upload-area"],.dc-tool-frame__input .upload-section-v3{
  border:1px dashed #d5cef0 !important;border-radius:12px !important;background:#fff !important}
.dc-tool-frame__input [class*="upload-area"]:hover,.dc-tool-frame__input .upload-section-v3:hover{
  border-color:#5b48d9 !important;background:#f6f3ff !important}
.dc-tool-frame__input [class*="upload-icon"]{background:#efecfb !important;color:#5b48d9 !important;
  border-radius:9px !important;width:34px !important;height:34px !important}

/* Analyze / Clear: handoff button spec (solid indigo, 11px radius, 49px tall).
   The row is Analyze (flex) + Clear (auto) with a 12px gap. */
.dc-tool-frame__input .detector-actions-v3{display:flex;align-items:stretch;gap:12px}
.dc-tool-frame__input .detector-actions-v3 .submit-btn-v3{flex:1 1 auto;min-width:0;margin:0}
.dc-tool-frame__input .detector-clear-btn{flex:0 0 auto;background:#fff;border:1px solid #e4e0f2;
  border-radius:11px;padding:13px 18px;font-family:'Manrope',sans-serif;font-weight:600;font-size:15px;
  color:#4c4866;cursor:pointer;transition:border-color .2s,background .2s,color .2s;
  line-height:1.45;min-height:49px}
.dc-tool-frame__input .detector-clear-btn:hover{border-color:#d5cef0;background:#faf9fe;color:#15132a}
.dc-tool-frame__input .detector-clear-btn:focus-visible{outline:2px solid #5b48d9;outline-offset:2px}
/* typography holds in every state — the disabled rule below only changes colour */
.dc-tool-frame__input .submit-btn-v3{font-family:'Manrope',sans-serif !important;
  font-weight:700 !important;font-size:15px !important;letter-spacing:0 !important;
  padding:13px 18px !important;min-height:49px !important;height:auto !important;line-height:1.45 !important}
.dc-tool-frame__input .submit-btn-v3:not(:disabled){
  background:#5b48d9 !important;border-radius:11px !important;padding:13px 18px !important;
  font-family:'Manrope',sans-serif !important;font-weight:700 !important;font-size:15px !important;
  box-shadow:0 10px 24px -12px #5b48d9 !important;letter-spacing:0 !important}
.dc-tool-frame__input .submit-btn-v3:not(:disabled):hover{background:#4133a8 !important;
  transform:none !important;box-shadow:0 10px 24px -12px #4133a8 !important}
.dc-tool-frame__input .submit-btn-v3:disabled{background:#c3bce4 !important;color:#fff !important;
  border-radius:11px !important;box-shadow:none !important;cursor:not-allowed !important}
.dc-tool-frame__input .submit-btn-v3::before,.dc-tool-frame__input .submit-btn-v3::after{display:none !important}

/* Privacy note */
.dc-tool-frame__input .detector-input-warning,.dc-tool-frame__input .r62-submit-disclaimer{
  font-size:12.5px !important;color:#6d6889 !important;background:transparent !important;
  border:none !important;padding:0 !important;margin-top:10px !important}

/* Loading screen inside the result column: no card-in-card */
.dc-tool-frame__result .ai-detector-loading-screen-v3 .loading-container-v3{
  padding:28px 24px !important;border-radius:18px !important;border:1px solid #e4e0f2 !important;
  box-shadow:none !important;background:#fff !important}
.dc-tool-frame__result .ai-detector-results-v3.section-results{padding:0 !important;
  background:transparent !important;border:none !important;box-shadow:none !important}

/* The form's own card is redundant inside the frame's white surface. */
.dc-tool-frame__input .ai-detector-form-v3.section-input,
.dc-tool-frame__input .ai-detector-form-v3{background:transparent !important;border:none !important;
  box-shadow:none !important;border-radius:0 !important;padding:0 !important}

/* "INPUT" mono column label (handoff §3 left, first row) */
.dc-tool-frame__input::before{content:'INPUT';display:block;font-family:'IBM Plex Mono',monospace;
  font-size:11px;letter-spacing:.14em;color:#8a85a6;margin-bottom:14px}
.dc-tool-frame__result::before{content:'RESULT';display:block;font-family:'IBM Plex Mono',monospace;
  font-size:11px;letter-spacing:.14em;color:#8a85a6;margin-bottom:14px}

/* Handoff order: language row → textarea+counter → upload → actions → privacy.
   The form is a block container; flex + order reaches the handoff order with
   zero markup change (every child keeps its JS hooks and DOM identity). */
.dc-tool-frame__input .ai-detector-form-v3{display:flex !important;flex-direction:column}
.dc-tool-frame__input .ai-detector-form-v3>.section-badge{order:0}
.dc-tool-frame__input .ai-detector-form-v3>.language-selector-group{order:1;margin-bottom:18px}
.dc-tool-frame__input .ai-detector-form-v3>.form-group-v3:not(.language-selector-group):not(.file-upload-group){order:2}
.dc-tool-frame__input .ai-detector-form-v3>.file-upload-group{order:3;margin-top:14px}
.dc-tool-frame__input .ai-detector-form-v3>.detector-actions-v3{order:4;margin-top:16px}
.dc-tool-frame__input .ai-detector-form-v3>.submit-btn-v3{order:4;margin-top:16px}
.dc-tool-frame__input .ai-detector-form-v3>.r62-submit-disclaimer{order:5;margin-top:10px}
.dc-tool-frame__input .ai-detector-form-v3>*:not(.section-badge):not(.language-selector-group):not(.form-group-v3):not(.file-upload-group):not(.submit-btn-v3):not(.detector-actions-v3):not(.r62-submit-disclaimer){order:6}

/* Language row (handoff §3 left, rows 1-3): visible "Text language" label, a
   control spanning the full column, then the multilingual caveat as plain prose.
   The earlier right-aligned 280px treatment with a hidden label came from an
   intermediate reading of the handoff; the rendered reference shows the label
   and puts the select at the same 543px measure as the textarea below it. */
.dc-tool-frame__input{position:relative}
.dc-tool-frame__input .language-selector-group{max-width:none;background:transparent !important;
  border:none !important;padding:0 !important;box-shadow:none !important;border-radius:0 !important}
.dc-tool-frame__input .language-selector-group .language-select-wrapper{display:block;max-width:none;
  margin-left:0;margin-bottom:10px}
.dc-tool-frame__input .language-selector-group select{max-width:none;margin-left:0}
.dc-tool-frame__input .language-selector-group .form-label-v3{position:static;width:auto;height:auto;
  clip:auto;overflow:visible}
/* the label's decorative globe is not in the handoff */
.dc-tool-frame__input .language-selector-group .form-label-v3>svg{display:none}
/* Field labels: 13px / 600 / #3c3856, tight line box (the handoff labels are
   17px tall, i.e. line-height 1.3 — 1.6 pushed every control 7px down). */
.dc-tool-frame__input .form-label-v3{font-family:'IBM Plex Sans',sans-serif !important;
  font-size:13px !important;font-weight:600 !important;color:#3c3856 !important;
  line-height:1.3 !important;margin-bottom:6px !important;letter-spacing:0 !important}
/* Multilingual caveat: prose, not a bordered callout with an icon */
.dc-tool-frame__input .language-info-box{display:block !important;background:transparent !important;
  border:none !important;padding:0 !important;margin:0 !important;border-radius:0 !important;
  box-shadow:none !important;gap:0 !important}
.dc-tool-frame__input .language-info-item{display:block !important;padding:0 !important;
  background:transparent !important;border:none !important;gap:0 !important}
.dc-tool-frame__input .language-info-item>svg{display:none !important}
.dc-tool-frame__input .language-info-item,
.dc-tool-frame__input .language-info-item span{font-family:'IBM Plex Sans',sans-serif !important;
  font-size:12.5px !important;color:#8a85a6 !important;line-height:1.5 !important}
/* The eyebrows are absolutely positioned, so they take no space in the flow and
   each panel's padding-top has to clear them. 28px did not: the "INPUT" label
   and the "Text language" label were drawn on top of each other. Handoff
   geometry from the card's top edge: eyebrow 30px, first control 62px. */
.dc-tool-frame__input::before{position:absolute;top:30px;left:28px;margin:0}
.dc-tool-frame__result::before{position:absolute;top:30px;left:28px;margin:0}
.dc-tool-frame__result{position:relative;padding-top:65px}
.dc-tool-frame__input{padding-top:62px}
@media(max-width:820px){.dc-tool-frame__input::before,.dc-tool-frame__result::before{top:22px;left:20px}
  .dc-tool-frame__result{padding-top:56px}.dc-tool-frame__input{padding-top:54px}}

/* The globe glyph carries an inline `display:inline-block`, which no plain
   declaration can beat. */
.dc-tool-frame__input .language-selector-group .form-label-v3>svg{display:none !important}
/* Placeholder is upright in the handoff, and the lightning glyph on the primary
   button is not in it at all. */
.dc-tool-frame__input .form-textarea-v3::placeholder{font-style:normal;color:#8a85a6;opacity:1}
.dc-tool-frame__input .submit-btn-v3 .button-content>svg{display:none !important}
/* The frame's own footer already carries this exact sentence, so repeating it
   inside the input column duplicated the disclaimer on screen. */
.dc-tool-frame__input .r62-submit-disclaimer{display:none !important}

/* ═══ V8 handoff §3 right: the result panel ═══ */

/* Score card: band header bar + gauge body + scale + stats strip */
.dc-tool-frame__result .r62-score-block{background:#fff;border:1px solid #e4e0f2;border-radius:18px;
  overflow:hidden;padding:0}
.r62-band-bar{display:none}
.r62-band-bar[data-zone]{display:flex;align-items:center;justify-content:space-between;
  padding:13px 24px;border-bottom:1px solid #f1eefa;
  font-family:'IBM Plex Mono',monospace;font-size:11.5px;letter-spacing:.12em}
.r62-band-bar[data-zone="lower"]{background:rgba(15,138,95,.12)}
.r62-band-bar[data-zone="mixed"]{background:rgba(184,121,26,.14)}
.r62-band-bar[data-zone="higher"]{background:rgba(194,69,61,.12)}
.r62-band-bar[data-zone="lower"] .r62-band-bar__label{color:#0f8a5f}
.r62-band-bar[data-zone="mixed"] .r62-band-bar__label{color:#b8791a}
.r62-band-bar[data-zone="higher"] .r62-band-bar__label{color:#c2453d}
.r62-band-bar__range{color:#6d6889}

/* Conic gauge (126px ring, 98px white core) beside the score title */
.r62-gauge{display:none}
.r62-gauge.is-filled{display:grid;place-items:center;width:126px;height:126px;border-radius:50%;
  background:conic-gradient(var(--v8-band,#5b48d9) var(--v8-deg,0deg),#eeebf8 0);
  transition:background .5s ease;flex:none}
.r62-gauge__inner{width:98px;height:98px;border-radius:50%;background:#fff;display:grid;
  place-items:center;align-content:center;gap:0}
.r62-gauge__score{font-family:'Manrope',sans-serif;font-weight:800;font-size:32px;color:#15132a;line-height:1}
.r62-gauge__max{font-family:'IBM Plex Mono',monospace;font-size:11.5px;color:#8a85a6;margin-top:2px}

/* Gauge left, title + band note right */
.dc-tool-frame__result .r62-score-block{display:block}
.dc-tool-frame__result .r62-score-headline{display:flex;flex-direction:column;align-items:flex-start;
  gap:4px;padding:0}
.dc-tool-frame__result .r62-score-value[data-r62="score"]{display:none}
.dc-tool-frame__result .r62-score-label{font-family:'Manrope',sans-serif;font-weight:700;font-size:18px;
  color:#15132a;text-transform:none;letter-spacing:-.01em}
.dc-tool-frame__result .r62-status{display:none}
.dc-tool-frame__result .r62-score-caveat{display:none}
.dc-tool-frame__result .r62-band-description{font-size:13.5px;line-height:1.6;color:#6d6889;margin:0}
/* the gauge + text form one row inside the card body */
.dc-tool-frame__result .r62-score-block>.r62-gauge.is-filled{float:left;margin:24px 22px 8px 24px}
.dc-tool-frame__result .r62-score-block>.r62-score-headline{padding:26px 24px 0}
.dc-tool-frame__result .r62-score-block>.r62-band-description{padding:0 24px 4px;overflow:hidden}

/* Band scale: zones sized to the real band widths (0-39 / 40-49 / 50-100),
   each less its share of the two 4px gaps so the zone edges line up with the
   marker's percentage positions. */
/* Horizontal inset via margin, not padding: the marker is absolutely
   positioned inside .r62-scale with an inline left:<score>%, so the
   containing block has to be exactly as wide as the track or the marker
   drifts past the last zone at high scores. */
.dc-tool-frame__result .r62-scale{clear:both;padding:8px 0 4px;margin:0 24px}
.dc-tool-frame__result .r62-scale-track{height:10px;border-radius:100px;overflow:hidden;display:flex}
.dc-tool-frame__result .r62-scale-zone{height:100%}
.dc-tool-frame__result .r62-scale-zone.is-lower{flex:0 0 calc(40% - 3.2px);background:rgba(15,138,95,.28)}
.dc-tool-frame__result .r62-scale-zone.is-mixed{flex:0 0 calc(10% - .8px);background:rgba(184,121,26,.32)}
.dc-tool-frame__result .r62-scale-zone.is-higher{flex:0 0 calc(50% - 4px);background:rgba(194,69,61,.28)}
.dc-tool-frame__result .r62-scale-marker{width:2px;height:22px;border-radius:2px;
  background:var(--v8-marker,#5b48d9);box-shadow:0 0 0 3px #fff;margin-left:-5px;
  transition:left .5s ease}
.dc-tool-frame__result .r62-scale-legend{font-family:'IBM Plex Mono',monospace;font-size:11px;
  color:#8a85a6;padding-top:8px}

/* Stats strip: three equal cells with hairline separators */
.dc-tool-frame__result .r62-insights{display:flex;margin:14px 0 0;padding:0;
  border-top:1px solid #f1eefa;gap:0}
.dc-tool-frame__result .r62-insight{flex:1;text-align:left;padding:14px 20px;
  border-left:1px solid #f1eefa;display:block;background:none;font-size:12px;color:#8a85a6}
.dc-tool-frame__result .r62-insight:first-child{border-left:none}
.dc-tool-frame__result .r62-insight strong{display:block;font-family:'Manrope',sans-serif;
  font-weight:800;font-size:19px;color:#15132a;margin-bottom:2px}

/* Auxiliary agreement card (handoff §3.3) */
.r62-agree{margin-top:14px}
.r62-agree__row{margin-bottom:14px}
.r62-agree__head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.r62-agree__name{font-size:14px;color:#15132a;font-weight:500}
.r62-agree__val{font-family:'IBM Plex Mono',monospace;font-size:13px;color:#5b48d9}
.r62-agree__track{height:8px;border-radius:100px;background:#f1eefa;overflow:hidden;margin:7px 0 5px}
.r62-agree__fill{display:block;height:100%;border-radius:100px;background:#5b48d9;
  width:0;transition:width .5s ease}
.r62-agree__row:nth-child(2) .r62-agree__fill{background:#7a5fe6}
.r62-agree__row:nth-child(3) .r62-agree__fill{background:#9a86ee}
.r62-agree__hint{margin:0;font-size:12px;color:#8a85a6;line-height:1.5}
.r62-agree__note{margin:14px 0 0;padding-top:12px;border-top:1px solid #f4f2fb;
  font-size:12.5px;line-height:1.55;color:#6d6889}

/* Result column: cards stack at 14px, no tab chrome inside the panel */
.dc-tool-frame__result .r62-summary{gap:14px}
.dc-tool-frame__result .r62-card{border-radius:18px;border:1px solid #e4e0f2;background:#fff}
.dc-tool-frame__result .r62-warning{border-radius:14px;background:#fdf6ec;border:1px solid #f0d9c0}
.dc-tool-frame__result .r62-warning strong,.dc-tool-frame__result .r62-warning span{color:#6b4c1f}
.dc-tool-frame__result .r62-warning-icon{color:#b8791a}

/* V8 order: score card → stats strip → sample note → agreement.
   The scaffold's DOM order is score, warning, consistency, insights; flex
   order reaches the handoff sequence without touching markup. */
.dc-tool-frame__result .r62-summary{display:flex;flex-direction:column}
.dc-tool-frame__result .r62-summary>.r62-score-block{order:1}
.dc-tool-frame__result .r62-summary>.r62-insights{order:2;margin-top:-14px;
  background:#fff;border:1px solid #e4e0f2;border-top:none;border-radius:0 0 18px 18px}
.dc-tool-frame__result .r62-summary>.r62-warning{order:3}
.dc-tool-frame__result .r62-summary>.r62-card{order:4}
.dc-tool-frame__result .r62-summary>.r62-tabs{order:5}
/* score card loses its bottom rounding so the strip reads as one card */
.dc-tool-frame__result .r62-score-block{border-radius:18px 18px 0 0;border-bottom:none}

/* Scale: static zone colours (the active-zone outline was a v7 affordance),
   marker stays inside the track and wears the band colour. */
.dc-tool-frame__result .r62-scale{position:relative}
.dc-tool-frame__result .r62-scale-zone.is-active{outline:none;box-shadow:none;border:none}
.dc-tool-frame__result .r62-scale-marker{position:absolute;top:0;
  background:var(--v8-marker,#5b48d9)}

/* Action row belongs at the foot of the result column (handoff §3.5). */
.dc-tool-frame__result .r62-summary>.r62-sticky-action{order:9;margin-top:4px}
.dc-tool-frame__result .r62-sticky-action .r62-btn{border-radius:11px}
.dc-tool-frame__result .r62-sticky-action .r62-btn-primary{background:#5b48d9;border-color:#5b48d9}
.dc-tool-frame__result .r62-sticky-action .r62-btn-primary:hover{background:#4133a8;border-color:#4133a8}

/* Tab strip: the r62 strip is sized for a full-width panel, so inside the
   ~515px result column it spilled ~20px and clipped the last label mid-word.
   Tighten it only within the frame; the scroll behaviour the plugin relies on
   at narrow viewports is left intact. */
.dc-tool-frame__result .r62-tabs{gap:2px}
.dc-tool-frame__result .r62-tab{padding:12px 8px;font-size:14px}
.dc-tool-frame__result .r62-tab .r62-tab-count{margin-left:4px;padding:1px 5px;font-size:12px}

/* ── Input-panel vertical rhythm, measured against the handoff ──
   The plugin's own .form-group-v3 bottom margins (7px on the text group, 24px on
   the upload group) plus the privacy note's 16px stacked on top of the explicit
   order-rule margins, making the column 64px taller than the design with the
   privacy→upload and upload→actions gaps roughly doubled. Spacing is now owned
   solely by these rules. Handoff gaps from the element above: counter 9,
   privacy 14, upload 14, actions 18. */
.dc-tool-frame__input .form-textarea-v3{display:block}
.dc-tool-frame__input .char-counter-v3{margin-top:9px !important;margin-bottom:0 !important}
.dc-tool-frame__input .detector-input-warning{margin-top:14px !important;margin-bottom:0 !important}
.dc-tool-frame__input .ai-detector-form-v3>.form-group-v3{margin-bottom:0 !important}
.dc-tool-frame__input .ai-detector-form-v3>.language-selector-group{margin-bottom:18px !important}
.dc-tool-frame__input .ai-detector-form-v3>.file-upload-group{margin-top:14px !important;margin-bottom:0 !important}
.dc-tool-frame__input .ai-detector-form-v3>.detector-actions-v3{margin-top:18px !important}

/* ═══ v8.6.9 — result score card matches the reference's mock result ═══
   The standalone design renders a full result state once an analysis runs (it
   is not idle-only), and diffing against it showed the score card stacked where
   the reference puts the gauge beside the heading:

     reference:  [band bar                    ]
                 [ gauge ][ AI-likeness score ]
                 [        ][ description      ]
                 [ scale + ranged legend      ]

   Grid areas reach that from the existing DOM order (bar, headline, gauge,
   scale, description) with no markup change. Row 3 is 1fr so the description
   sits directly under the heading instead of being pushed to the bottom of the
   space the 126px gauge reserves. */
.dc-tool-frame__result .r62-score-block{
  display:grid;grid-template-columns:auto minmax(0,1fr);
  grid-template-rows:auto auto 1fr auto;
  grid-template-areas:"bar bar" "gauge head" "gauge desc" "scale scale";
  column-gap:24px;padding:0 0 22px}
.dc-tool-frame__result .r62-band-bar[data-zone]{grid-area:bar;margin-bottom:24px}
.dc-tool-frame__result .r62-gauge{grid-area:gauge;align-self:start;margin:0 0 0 24px}
.dc-tool-frame__result .r62-score-headline{grid-area:head;padding:0 24px 0 0;margin-top:16px}
.dc-tool-frame__result .r62-band-description{grid-area:desc;padding:0 24px 0 0}
.dc-tool-frame__result .r62-scale{grid-area:scale;margin:24px 24px 0;padding:0}
.dc-tool-frame__result .r62-gauge__max{font-size:10.5px}
.dc-tool-frame__result .r62-band-bar__label{font-size:12px;letter-spacing:.1em}
.dc-tool-frame__result .r62-band-bar__range{font-size:12px;letter-spacing:0}

/* Legend labels sit under the ends and the middle of the track, not all
   left-aligned inside equal thirds. */
.dc-tool-frame__result .r62-scale-legend>*:nth-child(2){text-align:center}
.dc-tool-frame__result .r62-scale-legend>*:nth-child(3){text-align:right}

/* Agreement card heading matches the reference's 15.5px Manrope 700. */
.dc-tool-frame__result .r62-consistency .r62-label{font-family:'Manrope',sans-serif;
  font-size:15.5px;font-weight:700;color:#15132a}

/* Leftover pre-v7 orange: the readability panel still tinted itself with
   rgba(194,65,12,.03) from the retired warm palette. */
.dc-tool-frame__result .readability-stats-section{background:#faf9fe !important;
  border-color:#eeebf8 !important}
/* The child-combinator rule at ~557 (0,3,0) outranks the grid rule above, so
   the vertical offsets have to be restated at matching specificity. Reference
   offsets from the card's top edge: bar 0–42, gauge 66, heading 82, description
   112, scale 216. */
.dc-tool-frame__result .r62-band-bar__label,
.dc-tool-frame__result .r62-band-bar__range{line-height:1.25}
.dc-tool-frame__result .r62-score-block>.r62-score-headline{padding:0 24px 0 0;margin:16px 0 6px}
.dc-tool-frame__result .r62-score-label{line-height:1.3}
/* Earlier rounds left float/padding rules for the same children at (0,3,0) and
   (0,4,0) — restated here at matching specificity so the grid layout actually
   owns the card instead of fighting the float layout it replaced. */
.dc-tool-frame__result .r62-score-block>.r62-gauge.is-filled{float:none;
  grid-area:gauge;align-self:start;margin:0 0 0 24px}
.dc-tool-frame__result .r62-score-block>.r62-band-description{grid-area:desc;
  padding:0 24px 0 0;overflow:visible}
.dc-tool-frame__result .r62-score-block>.r62-band-bar[data-zone]{grid-area:bar;margin-bottom:24px}
.dc-tool-frame__result .r62-score-block>.r62-scale{grid-area:scale;margin:24px 24px 0;padding:0}
/* row-gap:0 is essential: an inherited gap:16px was adding a row gap that the
   126px gauge silently absorbed by spanning it, which pushed every row 16px
   down. With it removed the offsets land on the reference exactly (gauge 66,
   heading 82, description 112, scale 216 from the card's top edge). */
.dc-tool-frame__result .r62-score-block{row-gap:0}

/* ═══ v8.7.3 — result column reshaped to the handoff ═══
   The tab strip is gone: the sentence cues sit inline directly under the
   agreement card, and everything the reference does not show (classifier tile,
   readability metrics, pattern checks, methodology copy, download report) is
   collapsed into one disclosure rather than deleted. */
.dc-tool-frame__result .r62-fulldetail{margin:14px 0 0;border:1px solid #e4e0f2;
  border-radius:14px;background:#fff;overflow:hidden}
.dc-tool-frame__result .r62-fulldetail__summary{list-style:none;cursor:pointer;
  padding:13px 16px;font-family:var(--font-mono);font-size:12px;letter-spacing:.04em;
  color:#6d6889;display:flex;align-items:center;gap:10px}
.dc-tool-frame__result .r62-fulldetail__summary::-webkit-details-marker{display:none}
.dc-tool-frame__result .r62-fulldetail__summary::before{content:'▸';color:#5b48d9;
  font-size:11px;line-height:1}
.dc-tool-frame__result .r62-fulldetail[open] .r62-fulldetail__summary::before{content:'▾'}
.dc-tool-frame__result .r62-fulldetail__summary:hover{color:#15132a}
.dc-tool-frame__result .r62-fulldetail__summary:focus-visible{outline:2px solid #5b48d9;
  outline-offset:-2px}
/* Also ring on plain :focus. The review button opens this disclosure and moves
   focus into it programmatically, and Chrome's :focus-visible heuristic does not
   match programmatic focus on a <summary> — so without this, focus could land
   here with nothing shown. */
.dc-tool-frame__result .r62-fulldetail__summary:focus{outline:2px solid #5b48d9;
  outline-offset:-2px}
.dc-tool-frame__result .r62-fulldetail__body{padding:4px 16px 16px;border-top:1px solid #eeebf8}

/* Action row: primary review button (only when passages were flagged), then the
   reference's Re-analyze / Copy summary / interpretation link. */
.dc-tool-frame__result .r62-actions-v8{display:flex;flex-wrap:wrap;align-items:center;
  gap:12px;margin-top:16px}
.dc-tool-frame__result .r62-actions__link{font-family:'Manrope',sans-serif;font-weight:600;
  font-size:14px;color:#5b48d9;text-decoration:none;padding:11px 4px}
.dc-tool-frame__result .r62-actions__link:hover{color:#4133a8;text-decoration:underline}
.dc-tool-frame__result .r62-btn-secondary{background:#fff;border:1px solid #d8d2f0;
  border-radius:11px;padding:11px 16px;font-family:'Manrope',sans-serif;font-weight:600;
  font-size:14px;color:#4133a8}
.dc-tool-frame__result .r62-btn-secondary:hover{background:#faf9fe;border-color:#5b48d9}
/* one visible Copy summary: the row now carries it, so the copy inside the
   disclosure's legacy quick-action strip would be a second identical control. */
.dc-tool-frame__result .result-quick-actions .copy-results-btn{display:none}

/* Agreement value reads as the reference's pill (the number is kept rather than
   collapsed to a Low/Medium/High word — it carries strictly more information and
   the acceptance suite asserts the x / 100 form). */
.dc-tool-frame__result .r62-consistency .r62-score-value{font-family:var(--font-mono);
  font-size:12px !important;font-weight:400;color:#4133a8;background:#efecfb;
  border-radius:100px;padding:5px 11px}

/* Sentence cues card (reference: white r18 panel, band-tinted sentence cards with
   a 3px accent on the leading edge, mono index + band/score meta, closing note). */
.dc-tool-frame__result .sentence-breakdown-section{background:#fff;
  border:1px solid #eeebf8;border-radius:18px;padding:22px 24px;margin-top:14px}
.dc-tool-frame__result .sentence-breakdown-section .section-badge,
.dc-tool-frame__result .sentence-breakdown-section .collapsible-header>svg,
.dc-tool-frame__result .sentence-breakdown-section .header-content>svg,
.dc-tool-frame__result .sentence-breakdown-section .collapse-icon{display:none}
.dc-tool-frame__result .sentence-breakdown-section h3{font-family:'Manrope',sans-serif;
  font-weight:700;font-size:15.5px;color:#15132a;margin:0}
.dc-tool-frame__result .sentence-breakdown-section .collapsible-header{margin-bottom:16px;
  cursor:default}
.dc-tool-frame__result .r62-sentence{background:#faf9fe;border:1px solid #eeebf8;
  border-left:3px solid #cfcae6;border-radius:10px;padding:11px 14px}
.dc-tool-frame__result .r62-sentence:has(.r62-status.is-higher){
  background:rgba(194,69,61,.06);border-left-color:#c2453d}
.dc-tool-frame__result .r62-sentence:has(.r62-status.is-mixed),
.dc-tool-frame__result .r62-sentence:has(.r62-status.is-indeterminate){
  background:rgba(214,150,40,.07);border-left-color:#d69628}
.dc-tool-frame__result .r62-sentence:has(.r62-status.is-lower){
  background:rgba(15,138,95,.06);border-left-color:#0f8a5f}
.dc-tool-frame__result .r62-sentence .r62-marker{font-family:var(--font-mono);
  font-size:10.5px;letter-spacing:.08em;color:#8a85a6}
.dc-tool-frame__result .r62-sentence .r62-passage-meta{font-family:var(--font-mono);
  font-size:10.5px;color:#8a85a6}
.dc-tool-frame__result .r62-sentence-body{font-size:14px;line-height:1.55;color:#2a2542}
.dc-tool-frame__result .r62-sentences__note{margin:14px 0 0;font-size:12.5px;
  line-height:1.55;color:#8a85a6}
/* `hidden` was losing to a display:flex rule, so the retired duplicate sort
   strip (still painted with the pre-v7 orange) was rendering under the cards.
   Scoped to that one strip on purpose: a blanket `[hidden]{display:none
   !important}` would also defeat jQuery .show(), which sets an inline display
   without clearing the attribute. */
.dc-tool-frame__result .breakdown-controls[hidden]{display:none !important}

/* The agreement value inherited the v7.2 gradient-score treatment
   (background-clip:text + -webkit-text-fill-color:transparent), so painting a
   flat pill background behind it clipped the digits to that flat fill and the
   pill rendered empty. Reset the clip and the fill colour explicitly. */
.dc-tool-frame__result .r62-consistency .r62-score-value{
  -webkit-background-clip:border-box;background-clip:border-box;
  -webkit-text-fill-color:#4133a8;background-image:none}

/* ═══ v8.7.9 — result detail band spans the full card width ═══
   The detail sections were squeezed into the 543px result column. They now sit
   in a cell that spans both card columns: the score card and the interpretation
   warning share the top row (each at roughly the 592px measure the score card is
   designed for), and the agreement card, the sentence cues, the disclosure and
   the action row all run the full width.

   These rules live HERE rather than in style.css because this file is enqueued
   after it; at equal specificity the skin's own .dc-tool-frame__result rules
   would otherwise win on source order. */
.dc-tool-frame__detail{grid-column:1 / -1;border-left:none;margin-left:0;
  border-top:1px solid #eeebf8;padding:24px 28px 28px}
.dc-tool-frame__detail::before{content:none}
/* Collapsed until the tool actually renders loading, a result or an error —
   otherwise the empty band left a ~94px gap under the two columns. */
.dc-tool-frame__detail{display:none}
.dc-tool-frame__card:has(#ai-detector-results:not([hidden]):not([aria-busy])) .dc-tool-frame__detail{display:block}

.dc-tool-frame__detail .r62-summary{display:grid;grid-template-columns:1fr 1fr;
  column-gap:24px;row-gap:0;align-items:start}
.dc-tool-frame__detail .r62-summary>.r62-score-block{grid-column:1;grid-row:1;order:0}
.dc-tool-frame__detail .r62-summary>.r62-insights{grid-column:1;grid-row:2;order:0}
.dc-tool-frame__detail .r62-summary>.r62-warning{grid-column:2;grid-row:1;order:0;margin:0}
.dc-tool-frame__detail .r62-summary>.r62-card,
.dc-tool-frame__detail .r62-summary>.r62-consistency{grid-column:1 / -1;order:0;margin-top:18px}

@media (max-width:793px){
  .dc-tool-frame__detail{padding:20px}
  .dc-tool-frame__detail .r62-summary{grid-template-columns:1fr}
  .dc-tool-frame__detail .r62-summary>.r62-score-block,
  .dc-tool-frame__detail .r62-summary>.r62-insights,
  .dc-tool-frame__detail .r62-summary>.r62-warning,
  .dc-tool-frame__detail .r62-summary>.r62-card,
  .dc-tool-frame__detail .r62-summary>.r62-consistency{grid-column:1;grid-row:auto}
  .dc-tool-frame__detail .r62-summary>.r62-warning{margin-top:14px}
}

/* ═══════════════════════════════════════════════════════════════════════════
   v8.9.0 — RESULTS CRAFT PASS
   The band had grown to 49 bordered or filled boxes: four near-identical white
   cards stacked full-width, tinted cards nested inside them, and progress rails
   1092px wide used to express values like "4/100". Nothing led, everything
   competed, and the caution panel out-shouted the score it was cautioning about.

   The fix is compositional, not decorative:
     · ONE elevated surface — the verdict plate. Everything below it is flat
       content on the band, separated by hairlines and mono section labels, so
       there is no card-inside-a-card anywhere.
     · The verdict gets the full width and the score gets the weight: gauge and
       label on the left, the 0–100 scale (which actually benefits from width) on
       the right, the three counts as a strip beneath.
     · The three auxiliary indicators sit side by side in a 3-up row with tracks
       capped to a readable measure. They exist to be COMPARED; three full-width
       rails stacked vertically made that impossible and burned 432px doing it.
     · Sentence cues become a hairline-separated list — index, sentence, score —
       instead of three separately decorated tiles. Removes the left-stripe
       accent, the border, the radius and the fill from every row.
     · Spacing is varied: 32px between zones, 18px inside them, hairlines between
       list rows. Uniform 18px everywhere is what made it read as a form dump.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── zone rhythm ───────────────────────────────────────────────────────────── */
.dc-tool-frame__detail{padding:26px 28px 30px}
.dc-tool-frame__detail .r62-summary{display:block}

/* "Analysis complete" is a status, not a title. It keeps its id and tabindex
   (focus target after a run) but stops competing as a 24px headline. */
.dc-tool-frame__detail .results-header-v3{margin:0 0 14px}
.dc-tool-frame__detail #results-title,
.dc-tool-frame__detail .results-title-v3{font-family:var(--font-mono);font-size:11px;
  font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:#8a85a6;margin:0}

/* ── 1. THE VERDICT PLATE — the one elevated surface ──────────────────────── */
.dc-tool-frame__detail .r62-score-block{
  display:grid;
  grid-template-columns:auto minmax(260px,1fr) minmax(300px,.95fr);
  grid-template-areas:"bar bar bar" "gauge head scale" "gauge desc scale";
  grid-template-rows:auto auto 1fr;
  column-gap:32px;row-gap:0;
  background:#fff;border:1px solid #e4e0f2;border-radius:18px 18px 0 0;
  border-bottom:none;padding:0 0 26px;
  box-shadow:0 1px 2px rgba(31,27,84,.04)}
.dc-tool-frame__detail .r62-score-block>.r62-band-bar[data-zone]{grid-area:bar;
  margin:0 0 26px;border-radius:17px 17px 0 0}
.dc-tool-frame__detail .r62-score-block>.r62-gauge.is-filled{grid-area:gauge;
  align-self:start;margin:0 0 0 26px}
.dc-tool-frame__detail .r62-score-block>.r62-score-headline{grid-area:head;
  padding:0;margin:14px 0 6px}
.dc-tool-frame__detail .r62-score-block>.r62-band-description{grid-area:desc;
  padding:0;max-width:62ch}
/* the scale earns the right-hand column: it is the one element here that reads
   better wide, and it balances the gauge across the plate */
.dc-tool-frame__detail .r62-score-block>.r62-scale{grid-area:scale;
  align-self:center;margin:0 26px 0 0;padding:0}

/* counts strip closes the plate */
.dc-tool-frame__detail .r62-insights{background:#fff;border:1px solid #e4e0f2;
  border-top:1px solid #f1eefa;border-radius:0 0 18px 18px;
  box-shadow:0 1px 2px rgba(31,27,84,.04)}

/* ── 2. THE CAUTION — a line of consequence, not a competing panel ─────────── */
.dc-tool-frame__detail .r62-warning{display:flex;align-items:flex-start;gap:10px;
  background:transparent;border:none;border-radius:0;padding:0;
  margin:18px 2px 0;font-size:13px;line-height:1.6;color:#6d6889}
.dc-tool-frame__detail .r62-warning svg{flex:0 0 auto;width:16px;height:16px;
  margin-top:2px;color:#b8791a}
.dc-tool-frame__detail .r62-warning strong{color:#8a5a12;font-weight:600}
.dc-tool-frame__detail .r62-warning span{color:#6d6889}

/* ── shared: a flat zone on the band, opened by a hairline ─────────────────── */
.dc-tool-frame__detail .r62-card.r62-consistency,
.dc-tool-frame__detail .sentence-breakdown-section{background:transparent;border:none;
  border-top:1px solid #e8e4f4;border-radius:0;box-shadow:none;
  padding:26px 2px 0;margin:32px 0 0}

/* ── 3. AGREEMENT — three indicators, side by side, comparable ─────────────── */
.dc-tool-frame__detail .r62-consistency>.r62-row{align-items:baseline;margin-bottom:4px}
.dc-tool-frame__detail .r62-consistency>.r62-muted{max-width:70ch}
.dc-tool-frame__detail .r62-agree{display:grid;grid-template-columns:repeat(3,1fr);
  gap:28px;margin-top:20px}
.dc-tool-frame__detail .r62-agree__row{display:block;margin:0}
.dc-tool-frame__detail .r62-agree__head{display:flex;align-items:baseline;
  justify-content:space-between;gap:10px;margin-bottom:8px}
.dc-tool-frame__detail .r62-agree__name{font-size:13px;color:#3c3856}
.dc-tool-frame__detail .r62-agree__track{height:6px;border-radius:100px;background:#efecfb}
.dc-tool-frame__detail .r62-agree__hint{margin-top:8px;font-size:12px;line-height:1.5;
  color:#8a85a6}
/* the closing note spans the row, below all three */
.dc-tool-frame__detail .r62-agree__note{grid-column:1 / -1;margin:4px 0 0;
  padding-top:16px;border-top:1px solid #f1eefa;font-size:12.5px;color:#8a85a6;
  max-width:none}
.dc-tool-frame__detail .r62-disclosure{margin-top:14px}

/* ── 4. SENTENCE CUES — a list, which is what it is ───────────────────────── */
.dc-tool-frame__detail .sentence-breakdown-section .collapsible-header{margin-bottom:14px}
.dc-tool-frame__detail .r62-sentences{margin-top:4px}
.dc-tool-frame__detail .r62-sentence{display:grid;
  grid-template-columns:28px minmax(0,1fr) auto;
  grid-template-areas:"idx text meta";
  column-gap:14px;align-items:baseline;
  background:transparent;border:none;border-left:none;border-radius:0;
  padding:13px 2px}
.dc-tool-frame__detail .r62-sentence + .r62-sentence{border-top:1px solid #f1eefa}
.dc-tool-frame__detail .r62-sentence-head{display:contents}
.dc-tool-frame__detail .r62-sentence .r62-marker{grid-area:idx;
  font-family:var(--font-mono);font-size:11px;letter-spacing:.06em;color:#a9a4c2;
  background:none;width:auto;height:auto;padding:0;border-radius:0;text-align:left}
.dc-tool-frame__detail .r62-sentence-body{grid-area:text;font-size:14.5px;
  line-height:1.6;color:#2a2542}
.dc-tool-frame__detail .r62-sentence .r62-passage-meta{grid-area:meta;
  display:inline-flex;align-items:center;gap:7px;white-space:nowrap;
  font-family:var(--font-mono);font-size:11px;color:#8a85a6}
/* the band reads as a colour, so the row needs no stripe, tint or border */
.dc-tool-frame__detail .r62-sentence .r62-passage-meta::before{content:'';
  width:7px;height:7px;border-radius:50%;background:#cfcae6;flex:0 0 auto}
.dc-tool-frame__detail .r62-sentence:has(.r62-status.is-higher) .r62-passage-meta::before{
  background:#c2453d}
.dc-tool-frame__detail .r62-sentence:has(.r62-status.is-mixed) .r62-passage-meta::before,
.dc-tool-frame__detail .r62-sentence:has(.r62-status.is-indeterminate) .r62-passage-meta::before{
  background:#d69628}
.dc-tool-frame__detail .r62-sentence:has(.r62-status.is-lower) .r62-passage-meta::before{
  background:#0f8a5f}
.dc-tool-frame__detail .r62-sentences__note{margin-top:16px;padding-top:16px;
  border-top:1px solid #f1eefa;font-size:12.5px;color:#8a85a6}

/* filters as one segmented control instead of four loose buttons */
.dc-tool-frame__detail .r62-filters{display:inline-flex;gap:0;border:1px solid #e4e0f2;
  border-radius:10px;overflow:hidden;background:#fff;margin-bottom:0}
.dc-tool-frame__detail .r62-filter{border:none;border-radius:0;background:#fff;
  min-height:38px;padding:8px 15px;font-size:13px;color:#4c4866;box-shadow:none}
.dc-tool-frame__detail .r62-filter + .r62-filter{border-left:1px solid #eeebf8}
.dc-tool-frame__detail .r62-filter[aria-pressed="true"]{background:#efecfb;color:#4133a8;
  font-weight:600}
.dc-tool-frame__detail .r62-filter:hover{background:#faf9fe}
/* sort reads as a quiet text control, not a form field */
.dc-tool-frame__detail .r62-ssort{min-height:38px !important;border:1px solid #e4e0f2 !important;
  border-radius:10px !important;font-size:13px !important;color:#4c4866;padding:8px 30px 8px 12px !important;
  background:#fff !important}
.dc-tool-frame__detail .sentence-breakdown-section>.collapsible-content>.r62-label{
  margin-left:10px;margin-bottom:0 !important;vertical-align:top}

/* ── 5. DISCLOSURE + ACTIONS — quiet, and clearly the end of the column ───── */
.dc-tool-frame__detail .r62-fulldetail{background:transparent;border:none;
  border-top:1px solid #e8e4f4;border-radius:0;margin:32px 0 0;overflow:visible}
.dc-tool-frame__detail .r62-fulldetail__summary{padding:16px 2px 0}
.dc-tool-frame__detail .r62-fulldetail__body{padding:14px 2px 0;border-top:none}
.dc-tool-frame__detail .r62-actions-v8{margin-top:26px;padding-top:22px;
  border-top:1px solid #e8e4f4}

/* ── responsive: the wide compositions fold back to one column ─────────────── */
@media (max-width:920px){
  .dc-tool-frame__detail .r62-score-block{
    grid-template-columns:auto minmax(0,1fr);
    grid-template-areas:"bar bar" "gauge head" "gauge desc" "scale scale"}
  .dc-tool-frame__detail .r62-score-block>.r62-scale{align-self:start;
    margin:22px 26px 0}
  .dc-tool-frame__detail .r62-agree{grid-template-columns:1fr;gap:18px}
}
@media (max-width:600px){
  .dc-tool-frame__detail .r62-sentence{grid-template-columns:22px minmax(0,1fr);
    grid-template-areas:"idx meta" "text text";column-gap:10px;row-gap:6px}
  .dc-tool-frame__detail .r62-filters{display:flex;flex-wrap:wrap}
}

/* ── v8.9.1 — corrections to the craft pass ────────────────────────────────── */

/* The counts strip is a SIBLING of the verdict plate, and it was previously kept
   adjacent to it by flex `order`. Setting the stack to display:block killed that,
   so the strip fell to its DOM position — stranded in the middle of the
   agreement zone. Restore an explicit order so the plate stays whole. */
.dc-tool-frame__detail .r62-summary{display:flex;flex-direction:column}
.dc-tool-frame__detail .r62-summary>.r62-score-block{order:1}
.dc-tool-frame__detail .r62-summary>.r62-insights{order:2}
.dc-tool-frame__detail .r62-summary>.r62-warning{order:3}
.dc-tool-frame__detail .r62-summary>.r62-card,
.dc-tool-frame__detail .r62-summary>.r62-consistency{order:4}

/* The band-tint + left-accent treatment on sentence rows is retired: the score
   dot carries the band now, so the fill was a third encoding of the same fact. */
.dc-tool-frame__detail .r62-sentence,
.dc-tool-frame__detail .r62-sentence:has(.r62-status.is-higher),
.dc-tool-frame__detail .r62-sentence:has(.r62-status.is-mixed),
.dc-tool-frame__detail .r62-sentence:has(.r62-status.is-indeterminate),
.dc-tool-frame__detail .r62-sentence:has(.r62-status.is-lower){
  background:transparent;border-left-color:transparent}

/* The results container is no longer a card — the band it sits in is the
   surface, so its radius and shadow were drawing a fifth outline. */
.dc-tool-frame__detail .ai-detector-results-v3.section-results{border-radius:0;
  border:none;box-shadow:none;background:transparent}

/* Score column: the meta sits hard against the right edge of the row; give the
   list a little inner gutter so nothing touches the band's padding. */
.dc-tool-frame__detail .r62-sentence{padding-right:6px}

/* align-items:stretch is explicit because an inherited align-items left the
   stack's flex items shrink-to-fit — the agreement zone came out 901px and the
   counts strip 412px inside a 1142px column. */
.dc-tool-frame__detail .r62-summary{align-items:stretch}

/* ── v8.9.3 — final polish on the results band ─────────────────────────────── */

/* Two more container outlines were still drawing faint boxes around the whole
   band and around the status eyebrow. The band is the surface; nothing inside it
   needs its own frame. */
.dc-tool-frame__detail .dc-results-shell,
.dc-tool-frame__detail #ai-detector-results,
.dc-tool-frame__detail .ai-detector-container-v3{background:transparent;border:none;
  border-radius:0;box-shadow:none;padding:0}

/* Agreement zone rhythm: the note and the explainer had ~40px of air each, which
   left the zone feeling unfinished rather than spacious. */
.dc-tool-frame__detail .r62-agree{margin-top:18px}
.dc-tool-frame__detail .r62-agree__note{padding-top:14px;margin-top:2px}
.dc-tool-frame__detail .r62-consistency .r62-disclosure{margin-top:10px}

/* "Why can these numbers differ?" was set as a bold indigo link, so it read as a
   section heading competing with "Auxiliary signal agreement". It is a footnote
   you can open — size and weight it accordingly. */
.dc-tool-frame__detail .r62-disclosure>summary{list-style:none;cursor:pointer;
  display:inline-flex;align-items:center;gap:7px;font-family:var(--font-body);
  font-size:12.5px;font-weight:400;color:#6d6889}
.dc-tool-frame__detail .r62-disclosure>summary::-webkit-details-marker{display:none}
.dc-tool-frame__detail .r62-disclosure>summary::before{content:'▸';color:#5b48d9;
  font-size:10px;line-height:1}
.dc-tool-frame__detail .r62-disclosure[open]>summary::before{content:'▾'}
.dc-tool-frame__detail .r62-disclosure>summary:hover{color:#15132a}
.dc-tool-frame__detail .r62-disclosure>p{margin-top:8px;font-size:12.5px !important;
  line-height:1.6;max-width:82ch}

/* Zone headings share one voice: 15.5px Manrope 700, with the supporting line
   directly under them rather than a paragraph's default margin away. */
.dc-tool-frame__detail .sentence-breakdown-section h3,
.dc-tool-frame__detail .r62-consistency .r62-label{font-family:'Manrope',sans-serif;
  font-size:15.5px;font-weight:700;color:#15132a}
.dc-tool-frame__detail .r62-consistency>.r62-muted{margin-top:5px !important;
  font-size:13px !important;line-height:1.6}

/* The counts strip carries the plate's closing corners, so its cell dividers
   should stop short of them rather than cutting the rounded edge. */
.dc-tool-frame__detail .r62-insights>.r62-insight{padding:16px 20px}

/* ── v8.9.4 — retire the last pre-v7 orange inside the tool ────────────────── */
/* detector-form.css still holds 122 references to the retired warm palette. Most
   sit behind selectors that no longer render, but the SHADOWS do paint — the
   understanding section carried `0 4px 20px rgba(194,65,12,.08)`, a dirty orange
   halo under a lavender panel. Re-point the legacy tint variables and drop
   shadows from the band's sections, which are flat zones now: the verdict plate
   is the only thing here that should sit above the surface. */
.ai-detector-wrapper-v3,.ai-detector-results-v3,
.ai-detector-loading-screen-v3,.ai-detector-error-v2{
  --color-green-bg:rgba(15,138,95,.07);
  --color-blue-bg:rgba(91,72,217,.07);
  --color-purple-bg:rgba(91,72,217,.07);
  --color-amber-bg:rgba(184,121,26,.08);
  --color-red-bg:rgba(194,69,61,.07)}
.dc-tool-frame__detail section,
.dc-tool-frame__detail .collapsible-section,
.dc-tool-frame__detail .r62-fulldetail__body>*{box-shadow:none}

/* ── v8.9.5 — the verdict plate stacks on phones ───────────────────────────── */
/* At 390px the gauge column left the verdict text about 90px of measure, so the
   description ran one or two words per line. Below 560px the plate becomes a
   single column with the gauge centred above the text, and the counts strip
   turns into stacked rows separated by hairlines instead of vertical rules. */
@media (max-width:560px){
  .dc-tool-frame__detail .r62-score-block{
    grid-template-columns:minmax(0,1fr);
    grid-template-areas:"bar" "gauge" "head" "desc" "scale";
    grid-template-rows:auto auto auto auto auto;
    row-gap:0;padding-bottom:22px}
  .dc-tool-frame__detail .r62-score-block>.r62-gauge.is-filled{margin:0 auto;
    justify-self:center}
  .dc-tool-frame__detail .r62-score-block>.r62-score-headline{margin:18px 20px 6px;
    text-align:center}
  .dc-tool-frame__detail .r62-score-block>.r62-band-description{margin:0 20px;
    max-width:none;text-align:center}
  .dc-tool-frame__detail .r62-score-block>.r62-scale{margin:20px 20px 0;align-self:auto}
  .dc-tool-frame__detail .r62-insights{grid-template-columns:1fr !important;
    display:grid !important}
  .dc-tool-frame__detail .r62-insights>.r62-insight{border-left:none !important;
    border-top:1px solid #f1eefa;padding:13px 20px}
  .dc-tool-frame__detail .r62-insights>.r62-insight:first-child{border-top:none}
}
/* .r62-score-headline is a flex column with align-items:flex-start, so
   text-align could not centre it on the stacked layout. */
@media (max-width:560px){
  .dc-tool-frame__detail .r62-score-block>.r62-score-headline{align-items:center}
}

/* ═══════════════════════════════════════════════════════════════════════════
   v8.10.0 — INITIAL ANALYSIS BESIDE THE INPUT, DETAIL FULL WIDTH BELOW

   The result markup has to stay one element: every runtime lookup is scoped to
   .ai-detector-results-v3. So instead of moving nodes, the four wrappers between
   the card and the result zones collapse with `display:contents` while a result
   is live, which promotes .r62-summary and its siblings to grid items of the
   card itself. From there they can be placed independently:

     ┌─────────────────────┬─────────────────────┐
     │  input              │  initial analysis   │   ← .r62-summary
     ├─────────────────────┴─────────────────────┤
     │  agreement / sentence cues / detail        │   ← full-width rows
     └───────────────────────────────────────────┘

   `!important` on the contents declarations is required: jQuery's fadeIn writes
   an inline `display:block` on the results section, and an inline style beats a
   normal declaration. The whole set is gated on the shell not being [hidden], so
   in the idle state the wrappers stay ordinary boxes and nothing leaks out.
   ═══════════════════════════════════════════════════════════════════════════ */

/* deterministic two-column card so explicit placement is predictable */
@media (min-width:794px){
  .dc-tool-frame__card{grid-template-columns:1fr 1fr}
}

/* (the loose v8.10.0 gate that lived here was removed in v8.11.1 — it fired
   during loading as well; the aria-busy + is-filled gate below is the only one) */

/* the idle cell has nothing left to show once a result exists */
.dc-tool-frame__card:has(#ai-detector-results:not([hidden])) .dc-tool-frame__result:not(.dc-tool-frame__detail){
  display:none}

@media (min-width:794px){
  /* right column: the status line then the initial analysis */
  .dc-tool-frame__card:has(#ai-detector-results:not([hidden]):not([aria-busy])) .results-header-v3,
  .dc-tool-frame__card:has(#ai-detector-results:not([hidden]):not([aria-busy])) .r62-summary,
  .dc-tool-frame__card:has(#ai-detector-results:not([hidden]):not([aria-busy])) .ai-detector-loading-screen-v3{
    grid-column:2}
  /* the input holds the whole first band beside them */
  .dc-tool-frame__card:has(#ai-detector-results:not([hidden]):not([aria-busy])) .dc-tool-frame__input{
    grid-column:1;grid-row:1 / span 2}
  /* everything below runs the full width */
  .dc-tool-frame__card:has(#ai-detector-results:not([hidden]):not([aria-busy])) .r62-consistency,
  .dc-tool-frame__card:has(#ai-detector-results:not([hidden]):not([aria-busy])) .sentence-breakdown-section,
  .dc-tool-frame__card:has(#ai-detector-results:not([hidden]):not([aria-busy])) .r62-fulldetail,
  .dc-tool-frame__card:has(#ai-detector-results:not([hidden]):not([aria-busy])) .r62-actions-v8,
  .dc-tool-frame__card:has(#ai-detector-results:not([hidden]):not([aria-busy])) .ai-detector-error-v2{
    grid-column:1 / -1}
}

/* ── surfaces: the result region reads as one tinted area, the input stays white ── */
.dc-tool-frame__detail .r62-summary{background:#fbfaff;padding:26px 28px 28px;
  border-left:1px solid #eeebf8}
.dc-tool-frame__detail .results-header-v3{background:#fbfaff;
  padding:26px 28px 0;border-left:1px solid #eeebf8;margin:0}
.dc-tool-frame__detail .r62-consistency,
.dc-tool-frame__detail .sentence-breakdown-section,
.dc-tool-frame__detail .r62-fulldetail,
.dc-tool-frame__detail .r62-actions-v8{background:#fbfaff;padding-left:28px;
  padding-right:28px;margin-left:0;margin-right:0}
.dc-tool-frame__detail .r62-consistency{border-top:1px solid #e8e4f4;
  padding-top:26px;margin-top:0}
.dc-tool-frame__detail .sentence-breakdown-section{margin-top:0;padding-top:26px}
.dc-tool-frame__detail .r62-fulldetail{margin-top:0;padding-top:0;border-top:1px solid #e8e4f4}
.dc-tool-frame__detail .r62-actions-v8{margin-top:0;padding-top:22px;padding-bottom:28px;
  border-top:1px solid #e8e4f4}

/* ── the verdict plate is back in a ~571px column, so it uses the narrow
      composition (gauge beside the label, scale beneath) at every width ── */
.dc-tool-frame__detail .r62-score-block{
  grid-template-columns:auto minmax(0,1fr);
  grid-template-areas:"bar bar" "gauge head" "gauge desc" "scale scale";
  grid-template-rows:auto auto 1fr auto;
  column-gap:0;padding-bottom:22px}
.dc-tool-frame__detail .r62-score-block>.r62-score-headline{margin:16px 24px 6px 24px;
  padding:0}
.dc-tool-frame__detail .r62-score-block>.r62-band-description{margin:0 24px;
  padding:0;max-width:none}
.dc-tool-frame__detail .r62-score-block>.r62-scale{grid-area:scale;align-self:auto;
  margin:22px 24px 0}
.dc-tool-frame__detail .r62-score-block>.r62-gauge.is-filled{margin:0 0 0 24px}

/* the counts strip sits inside the same column */
.dc-tool-frame__detail .r62-insights>.r62-insight{padding:14px 16px}

/* ── one column below 794px: the card is already single-column there, so the
      zones simply stack in DOM order and only the surfaces need flattening ── */
@media (max-width:793px){
  .dc-tool-frame__detail .r62-summary,
  .dc-tool-frame__detail .results-header-v3{border-left:none;padding-left:20px;
    padding-right:20px}
  .dc-tool-frame__detail .r62-consistency,
  .dc-tool-frame__detail .sentence-breakdown-section,
  .dc-tool-frame__detail .r62-fulldetail,
  .dc-tool-frame__detail .r62-actions-v8{padding-left:20px;padding-right:20px}
}

/* The input column is taller than the status line plus the initial analysis, and
   that leftover has to land somewhere. Sizing row 1 to the status line and row 2
   to 1fr sends it to the analysis row, so the tinted column simply fills down to
   the input's baseline instead of pushing the analysis 155px below it. */
@media (min-width:794px){
  .dc-tool-frame__card:has(#ai-detector-results:not([hidden])){
    grid-template-rows:min-content 1fr}
}
/* `.dc-tool-frame__detail .r62-card.r62-consistency` (0,3,0) from the craft pass
   outranks the plain `.r62-consistency` gutter rule, so the agreement zone kept a
   2px inset while its neighbours had 28px. Match the compound. */
.dc-tool-frame__detail .r62-card.r62-consistency{padding-left:28px;padding-right:28px}
@media (max-width:793px){
  .dc-tool-frame__detail .r62-card.r62-consistency{padding-left:20px;padding-right:20px}
}

/* ═══ v8.11.0 — detail-zone heading, summary pointer, stage rail, gate fix ═══ */

/* ── GATE FIX (this was a real defect, not a refinement) ────────────────────
   The display:contents gate fired on "shell not [hidden]", which is also true
   during LOADING — so the empty result skeleton was promoted into the card grid
   mid-analysis, and the suites read blank values. The results are only actually
   rendered once the shell has dropped aria-busy AND the gauge has been filled,
   which is a one-way latch set inside renderR62Summary. Gate on both. */
.dc-tool-frame__card:has(#ai-detector-results:not([hidden])) .dc-tool-frame__detail{
  display:block}
@media (min-width:794px){
  /* while an analysis is in flight the loading UI sits beside the input */
  .dc-tool-frame__card:has(#ai-detector-results[aria-busy="true"]) .dc-tool-frame__detail{
    grid-column:2}
}
.dc-tool-frame__card:has(#ai-detector-results:not([hidden]):not([aria-busy])):has(.r62-gauge.is-filled) .dc-tool-frame__detail,
.dc-tool-frame__card:has(#ai-detector-results:not([hidden]):not([aria-busy])):has(.r62-gauge.is-filled) .dc-results-shell,
.dc-tool-frame__card:has(#ai-detector-results:not([hidden]):not([aria-busy])):has(.r62-gauge.is-filled) .dc-tool-frame__detail .ai-detector-container-v3,
.dc-tool-frame__card:has(#ai-detector-results:not([hidden]):not([aria-busy])):has(.r62-gauge.is-filled) .ai-detector-results-v3{
  display:contents !important}

/* ── the detail zone opens with a heading ──────────────────────────────────── */
.dc-tool-frame__detail .r62-detail-head{background:#fbfaff;padding:28px 28px 0;
  border-top:1px solid #e8e4f4;margin:0}
.dc-tool-frame__detail .r62-detail-head:focus{outline:none}
.dc-tool-frame__detail .r62-detail-head__title{font-family:'Manrope',sans-serif;
  font-weight:800;font-size:19px;letter-spacing:-.01em;color:#15132a;margin:0}
.dc-tool-frame__detail .r62-detail-head__sub{margin:6px 0 0;font-size:13px;
  line-height:1.6;color:#8a85a6;max-width:70ch}
/* the agreement card follows it directly, so it drops its own top rule */
.dc-tool-frame__detail .r62-card.r62-consistency{border-top:none;padding-top:22px}

@media (min-width:794px){
  .dc-tool-frame__card:has(#ai-detector-results:not([hidden]):not([aria-busy])):has(.r62-gauge.is-filled) .r62-detail-head{
    grid-column:1 / -1}
}

/* ── pointer from the summary column down to the detail zone ───────────────── */
.dc-tool-frame__detail .r62-jump{order:4;display:inline-flex;align-items:center;gap:8px;
  align-self:flex-start;margin-top:18px;padding:9px 14px;background:#fff;
  border:1px solid #d8d2f0;border-radius:10px;font-family:'Manrope',sans-serif;
  font-weight:600;font-size:13.5px;color:#4133a8;text-decoration:none;
  transition:border-color .2s,background .2s,color .2s}
.dc-tool-frame__detail .r62-jump:hover{border-color:#5b48d9;background:#faf9fe;color:#15132a}
.dc-tool-frame__detail .r62-jump:focus-visible{outline:2px solid #5b48d9;outline-offset:2px}
.dc-tool-frame__detail .r62-jump span{font-size:12px;line-height:1}

/* ── loading stages: a connected rail, not four loose ticks ────────────────── */
.dc-tool-frame__result .r62-stages{display:grid;gap:0;margin:18px 0 0;padding:0;
  list-style:none}
.dc-tool-frame__result .r62-stage{position:relative;display:flex;align-items:flex-start;
  gap:14px;padding:0 0 18px 0;font-size:14px;line-height:1.45;color:#8a85a6}
.dc-tool-frame__result .r62-stage:last-child{padding-bottom:0}
/* the rail: a hairline from each marker down to the next */
.dc-tool-frame__result .r62-stage:not(:last-child)::before{content:'';position:absolute;
  left:10px;top:22px;bottom:0;width:2px;background:#eeebf8}
.dc-tool-frame__result .r62-stage.is-done:not(:last-child)::before{background:#c9bff1}
.dc-tool-frame__result .r62-stage-icon{position:relative;z-index:1;flex:0 0 auto;
  width:22px;height:22px;border-radius:50%;border:2px solid #e4e0f2;background:#fff;
  display:flex;align-items:center;justify-content:center;font-size:11px;line-height:1;
  color:#fff;box-shadow:none}
.dc-tool-frame__result .r62-stage.is-done{color:#4c4866}
.dc-tool-frame__result .r62-stage.is-done .r62-stage-icon{background:#5b48d9;
  border-color:#5b48d9;color:#fff}
.dc-tool-frame__result .r62-stage.is-active{color:#15132a;font-weight:600}
.dc-tool-frame__result .r62-stage.is-active .r62-stage-icon{border-color:#5b48d9;
  background:#fff}
/* the active step gets a quiet pulsing core so the list reads as "working" */
.dc-tool-frame__result .r62-stage.is-active .r62-stage-icon::after{content:'';
  width:8px;height:8px;border-radius:50%;background:#5b48d9;
  animation:dc-stage-pulse 1.4s ease-in-out infinite}
@keyframes dc-stage-pulse{0%,100%{transform:scale(.7);opacity:.55}50%{transform:scale(1);opacity:1}}
@media (prefers-reduced-motion:reduce){
  .dc-tool-frame__result .r62-stage.is-active .r62-stage-icon::after{animation:none}
}

/* ── v8.11.3 — the analysis-failure state ──────────────────────────────────
   Only rendered on failure, so it had escaped every visual pass: centred text
   inside a left-aligned tool, the warning icon wedged between the two copy
   lines (it is a SIBLING of the content, not part of it), the reassurance line
   in bold crimson — shouting at someone whose analysis just failed — and the
   retired v7 gradient pill on the retry button. Now a calm two-column notice. */
.dc-tool-frame__detail .ai-detector-error-v2,
.dc-tool-frame__result .ai-detector-error-v2{display:grid;
  grid-template-columns:auto minmax(0,1fr);grid-template-areas:"icon body";
  column-gap:14px;align-items:start;text-align:left;
  background:#fdf6ec;border:1px solid #f0d9c0;border-radius:14px;
  padding:18px 20px;margin:0;box-shadow:none;max-width:none}
.dc-tool-frame__detail .ai-detector-error-v2 .section-badge{display:none}
.dc-tool-frame__detail .ai-detector-error-v2 .error-icon-v2{grid-area:icon;
  width:auto;height:auto;margin:0;padding:0;background:none;border:none;
  border-radius:0;color:#b8791a;display:block}
.dc-tool-frame__detail .ai-detector-error-v2 .error-icon-v2 svg{width:22px;height:22px;
  display:block}
.dc-tool-frame__detail .ai-detector-error-v2 .error-content-v2{grid-area:body;
  text-align:left;margin:0}
.dc-tool-frame__detail .ai-detector-error-v2 .error-title-v2{font-family:'Manrope',sans-serif;
  font-weight:700;font-size:15.5px !important;color:#15132a;margin:0 0 5px !important;
  text-align:left}
.dc-tool-frame__detail .ai-detector-error-v2 .error-message-v2{font-size:13.5px;
  line-height:1.6;color:#6b4c1f;margin:0;text-align:left;
  background:none;border:none;padding:0;font-weight:400}
/* retry button matches every other secondary action in the tool */
.dc-tool-frame__detail .ai-detector-error-v2 .try-again-btn-v2{margin:14px 0 0;
  background:#5b48d9 !important;background-image:none !important;border:none;
  border-radius:11px !important;padding:11px 18px !important;
  font-family:'Manrope',sans-serif !important;font-weight:600 !important;
  font-size:14px !important;color:#fff !important;box-shadow:none !important;
  transform:none !important}
.dc-tool-frame__detail .ai-detector-error-v2 .try-again-btn-v2:hover{
  background:#4133a8 !important;transform:none !important}
.dc-tool-frame__detail .ai-detector-error-v2 .try-again-btn-v2 svg{width:16px;height:16px}

/* An earlier round left `.ai-detector-error-v2{padding:32px!important;
   border-radius:20px!important;border:1px solid #E5E4F2!important}`, so the new
   notice kept a 32px box and the wrong border. Match the !important. */
.dc-tool-frame__detail .ai-detector-error-v2,
.dc-tool-frame__result .ai-detector-error-v2{padding:18px 20px !important;
  border:1px solid #f0d9c0 !important;border-radius:14px !important}
/* The detail cell only has a box in the loading and error states (a rendered
   result collapses it), so its mobile gutter should match the 20px the rest of
   the tool uses there rather than the 28px desktop value. */
@media (max-width:793px){
  .dc-tool-frame__detail{padding:20px}
}

/* ── v8.11.6 — same AA fix inside the tool (see style.css for the rationale) ── */
.dc-tool-frame__input .char-counter-v3,
.dc-tool-frame__input .char-counter-v3 *,
.dc-tool-frame__input .keyboard-hint{color:#6d6889 !important}
.dc-tool-frame__input .language-info-item,
.dc-tool-frame__input .language-info-item span,
.dc-tool-frame__input .upload-disclosure-hint{color:#6d6889 !important}
.dc-tool-frame__input .form-textarea-v3::placeholder{color:#6d6889}
.dc-tool-frame__input::before,
.dc-tool-frame__result::before{color:#6d6889}
.dc-tool-frame__detail .r62-detail-head__sub,
.dc-tool-frame__detail .r62-agree__hint,
.dc-tool-frame__detail .r62-agree__note,
.dc-tool-frame__detail .r62-sentences__note,
.dc-tool-frame__detail .r62-fulldetail__summary,
.dc-tool-frame__detail .r62-sentence .r62-marker,
.dc-tool-frame__detail .r62-sentence .r62-passage-meta,
.dc-tool-frame__detail .r62-gauge__max,
.dc-tool-frame__detail #results-title,
.dc-tool-frame__detail .results-title-v3,
.dc-tool-frame__result .r62-stage{color:#6d6889}
.dc-tool-idle__sub{color:#6d6889}

/* The disabled Analyze label was white on the handoff's #c3bce4 disabled fill =
   1.81:1. WCAG exempts inactive controls, but a label nobody can read is still a
   defect, so the label takes a dark tone that still reads as disabled. */
.dc-tool-frame__input .submit-btn-v3:disabled{color:#46406e !important}

/* ── v8.11.8 — contrast in the RENDERED result (audited with real pixels) ────
   The idle tool was clean but the result state was not. Loading and error states
   pass; nine nodes in the result did not.

   The worst three sit in the legacy zone-legend inside Full detail, whose
   gradients were never swept onto the v7/v8 palette — still #f59e0b / #ef4444
   from the original build. White labels measured 2.6:1 on the amber and 4.3:1 on
   the red (verified by sampling the rendered pixels, since the segments are
   transparent and the colour comes from a gradient — reasoning from
   backgroundColor alone reports nothing). Re-pointed to the site's status inks,
   dark enough that the white labels clear 4.5:1. */
.dc-tool-frame__detail .scale-segment.green{
  background-image:linear-gradient(135deg,#0f7a54,#0b6b49) !important}
.dc-tool-frame__detail .scale-segment.yellow{
  background-image:linear-gradient(135deg,#8a5a12,#73490d) !important}
.dc-tool-frame__detail .scale-segment.red{
  background-image:linear-gradient(135deg,#b83b32,#9e3229) !important}

/* Band-bar label sat at 4.22:1 on its own 12%-tint strip; the range beside it at
   4.45:1. Both take a darker ink of the same hue family per zone. */
.dc-tool-frame__detail .r62-band-bar[data-zone] .r62-band-bar__range{color:#57536f}
.dc-tool-frame__detail .r62-band-bar[data-zone="higher"] .r62-band-bar__label{color:#9e3229}
.dc-tool-frame__detail .r62-band-bar[data-zone="mixed"] .r62-band-bar__label,
.dc-tool-frame__detail .r62-band-bar[data-zone="indeterminate"] .r62-band-bar__label{color:#8a5a12}
.dc-tool-frame__detail .r62-band-bar[data-zone="lower"] .r62-band-bar__label{color:#0b6b49}

/* The scale legend was still on the faint token at 11px = 3.51:1. */
.dc-tool-frame__detail .r62-scale-legend,
.dc-tool-frame__detail .r62-scale-legend>*{color:#6d6889}

/* ═══════════════════════════════════════════════════════════════════════════
   v8.12.0 — INPUT PANEL CRAFT PASS

   Diagnosis: the panel read as a form dump. Three near-identical bordered boxes
   stacked (select 45px, textarea 270px, upload 64px) sharing one fill and one
   border, differing only in radius (10/14/12/11). Gaps were 18/14/18 — nothing
   grouped. The textarea, which IS the task, carried no more weight than the
   language dropdown, and the loudest element at idle was the DISABLED submit
   slab: 455px of lavender you cannot press.

   Note what is deliberately NOT copied from the results pass: the controls here
   keep their boundaries. Flattening a container removes noise; flattening an
   interactive control removes affordance. The hierarchy comes from weight and
   rhythm instead.
      · the textarea becomes the one WHITE surface — on the panel's tinted
        ground that reads as "write here" before you read a word;
      · select and upload keep a boundary but recede to the tinted fill and a
        lighter hairline;
      · the counter attaches to the field it describes (6px, not 9px adrift);
      · grouping: field block tight, then options, then a hairline before the
        actions, so the eye gets three stops instead of five even ones.
   ═══════════════════════════════════════════════════════════════════════════ */

/* the eyebrow labels the PANEL, so it needs air before the first field label */
.dc-tool-frame__input::before{margin-bottom:20px}

/* ── the field is the subject: the only white surface in the column ───────── */
.dc-tool-frame__input .form-textarea-v3{background:#fff !important;
  border:1px solid #d8d2f0 !important;border-radius:12px !important;
  box-shadow:0 1px 2px rgba(31,27,84,.03) !important}
.dc-tool-frame__input .form-textarea-v3:hover{border-color:#c9bff1 !important}
.dc-tool-frame__input .form-textarea-v3:focus{border-color:#5b48d9 !important;
  box-shadow:0 0 0 3px rgba(91,72,217,.12) !important;background:#fff !important}

/* the counter belongs to the field above it, not to the note below it */
.dc-tool-frame__input .char-counter-v3{margin-top:6px !important;
  display:flex;align-items:baseline;gap:5px;flex-wrap:wrap}
.dc-tool-frame__input .keyboard-hint{margin-left:auto}

/* ── secondary controls recede: same family, lighter boundary ─────────────── */
.dc-tool-frame__input .form-select-v3,
.dc-tool-frame__input .language-display{border-color:#e8e4f4 !important;
  border-radius:10px !important}
.dc-tool-frame__input .language-select-wrapper:hover .language-display{
  border-color:#c9bff1 !important}

/* upload is a disclosure, not a third input field — lighter and shorter */
.dc-tool-frame__input .upload-disclosure-btn{min-height:56px !important;
  border:1px solid #e8e4f4 !important;background:#faf9fe !important;
  border-radius:10px !important;padding:11px 14px !important}
.dc-tool-frame__input .upload-disclosure-btn:hover{border-color:#c9bff1 !important;
  background:#f6f3ff !important}
.dc-tool-frame__input .upload-disclosure-btn>svg:first-of-type{width:30px !important;
  height:30px !important;padding:7px;background:#f1eefa;border-radius:8px}

/* ── rhythm: three stops instead of five even gaps ───────────────────────── */
/* label + select + caveat read as one block */
.dc-tool-frame__input .ai-detector-form-v3>.language-selector-group{
  margin-bottom:24px !important}
/* the privacy line is a caveat about the field, so it sits close to it… */
.dc-tool-frame__input .detector-input-warning{margin-top:12px !important;
  font-size:12.5px !important;line-height:1.55 !important}
/* …and the upload option gets real separation from it */
.dc-tool-frame__input .ai-detector-form-v3>.file-upload-group{
  margin-top:20px !important}
/* actions are a different kind of thing: hairline, then air */
.dc-tool-frame__input .ai-detector-form-v3>.detector-actions-v8,
.dc-tool-frame__input .ai-detector-form-v3>.detector-actions-v3{
  margin-top:22px !important;padding-top:20px;border-top:1px solid #eeebf8}

/* ── the disabled primary stops shouting ─────────────────────────────────── */
/* At idle the one thing you cannot press was the loudest element in the panel.
   It keeps a fill (so it still reads as a button) but a much quieter one, and
   the label keeps the dark tone that fixed its 1.81:1 contrast. */
.dc-tool-frame__input .submit-btn-v3:disabled{background:#efecfb !important;
  color:#5b5486 !important;border:1px solid #e0daf6 !important;
  box-shadow:none !important}
/* the enabled state is where the weight belongs */
.dc-tool-frame__input .submit-btn-v3:not(:disabled){
  box-shadow:0 8px 20px -10px rgba(91,72,217,.55) !important}

/* Clear sits beside a now-quiet primary, so it recedes a step further */
.dc-tool-frame__input .detector-clear-btn{border-color:#e8e4f4;color:#57536f}
.dc-tool-frame__input .detector-clear-btn:hover{border-color:#c9bff1;color:#15132a}

/* ── v8.12.1 — the expanded upload dropzone ─────────────────────────────────
   Never swept: my earlier dropzone rules targeted `[class*="upload-area"]` and
   `.upload-section-v3`, neither of which exists in this markup, so none of them
   ever applied. What is actually there still carries the warm ink #1c1917 — a
   2%-tint fill, a 15% dashed border and a warm-black heading — which reads
   subtly off against the lavender panel around it. The handoff specifies a
   dashed lavender zone. (The icon is NOT orange: a stale capture said it was,
   and a pixel sample proved it is already #6d6889.) */
.dc-tool-frame__input .file-upload-zone{background:#fbfaff !important;
  border:1px dashed #d5cef0 !important;border-radius:12px !important;
  padding:26px 24px !important}
.dc-tool-frame__input .file-upload-zone.is-dragover,
.dc-tool-frame__input .file-upload-zone:hover{border-color:#5b48d9 !important;
  background:#f6f3ff !important}
.dc-tool-frame__input .upload-zone-default svg{color:#8a85a6}
.dc-tool-frame__input .upload-main-text{color:#15132a !important;font-size:14.5px !important;
  font-weight:600}
.dc-tool-frame__input .upload-sub-text,
.dc-tool-frame__input .upload-formats{color:#6d6889 !important}
/* "browse files" is the action in this zone — it should look like one */
.dc-tool-frame__input .upload-browse-btn{color:#5b48d9 !important;font-weight:600;
  text-decoration:underline;text-underline-offset:2px;background:none !important;
  border:none !important;padding:0 !important;min-height:0 !important}
.dc-tool-frame__input .upload-browse-btn:hover{color:#4133a8 !important}
.dc-tool-frame__input .upload-browse-btn:focus-visible{outline:2px solid #5b48d9;
  outline-offset:2px;border-radius:4px}

/* Remove sits two controls away from Clear and was still on v7 tokens
   (#5442ce on #c9c7e0). Aligned to the same secondary treatment. */
.dc-tool-frame__input .upload-remove-btn{border-color:#e8e4f4 !important;
  color:#57536f !important;border-radius:10px !important;min-height:38px !important}
.dc-tool-frame__input .upload-remove-btn:hover{border-color:#c9bff1 !important;
  background:#faf9fe !important;color:#15132a !important}

/* ── v8.12.3 — the ENABLED primary button had no label colour at all ────────
   Pixel-sampled: near-black #15132a on indigo #5b48d9 = 2.60:1. The whole skin
   only ever set a colour for the :disabled state, so the enabled label fell back
   to inherited body ink and the site's main call to action was barely readable.
   This predates the input pass — it is in both rollback snapshots too. It went
   unnoticed because the button is disabled in almost every screenshot: the state
   you photograph is not the state users act on. */
.dc-tool-frame__input .submit-btn-v3:not(:disabled),
.dc-tool-frame__input .submit-btn-v3:not(:disabled) .button-text-v3,
.dc-tool-frame__input .submit-btn-v3:not(:disabled) .button-content{color:#fff !important}
.dc-tool-frame__input .submit-btn-v3:not(:disabled) svg{color:#fff !important}

/* ── v8.12.4 — the language control had NO focus indicator ──────────────────
   Both the plugin's rule and mine used `.language-select:focus + .language-display`,
   but in the markup `.language-display` comes BEFORE the <select> inside the
   wrapper — an adjacent-sibling selector cannot match backwards, so the ring
   never applied to anything. A keyboard user tabbing onto the language control
   saw no focus at all. `:focus-within` on the wrapper is order-independent.
   It also has to sit after the hover rule: clicking implies hovering, so the two
   states overlap and the later declaration wins when both match. */
.dc-tool-frame__input .language-select-wrapper:focus-within .language-display{
  border-color:#5b48d9 !important;
  box-shadow:0 0 0 3px rgba(91,72,217,.12) !important}
