/* Mode toggle (URL vs Paste vs Editor) - three-button variant.
 * The shared tools.css `.mode-toggle::before` is a 50%-width sliding
 * pseudo-element that assumes exactly 2 buttons (single/bulk). KDC
 * has 3 buttons so the slider leaks from the active button into the
 * second slot. Disable it and use a solid white pill on .is-active. */
.mode-toggle::before { content: none; }
.mode-toggle {
    display: inline-flex;
    background: var(--ink-50, #f3f4f6);
    border: 1px solid var(--ink-100, #e5e7eb);
    border-radius: 8px;
    padding: 4px;
    margin-bottom: 12px;
    gap: 2px;
}
.mode-btn {
    appearance: none;
    border: 1px solid transparent;
    background: transparent;
    padding: 7px 16px;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    color: var(--ink-600, #4b5563);
    cursor: pointer;
    border-radius: 4px;
    transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
}
.mode-btn:hover:not(.is-active) { color: var(--ink, #1f2937); }
.mode-btn.is-active {
    background: #fff;
    color: var(--ink, #1f2937);
    border-color: var(--ink-100, #e5e7eb);
}
.mode-btn:focus-visible {
    outline: 2px solid var(--brand-red, var(--brand, #1d4ed8));
    outline-offset: 2px;
}

/* Form-field labels (shared shape lives per-tool; SCC has the same).
   Keeping the label-on-top-of-input layout the tool family standardized on. */
.field-label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--ink, #1f2937);
    margin: 0 0 4px 0;
}
.field-label + .text-input { margin-bottom: 0; }
.field-hint {
    margin-left: 6px;
    color: var(--ink-500, #6b7280);
    font-weight: 400;
    font-size: 12px;
}
.input-form .text-input { width: 100%; }
.input-form .field-label:not(:first-child) { margin-top: 12px; }
.input-feedback {
    min-height: 0;
    margin: 2px 0 0 0;
}
.input-feedback:empty { display: none; }
.input-feedback .feedback-msg:empty { display: none; }
.submit-row {
    margin-top: 12px;
    display: flex;
    justify-content: flex-end;
}
.mode-panel[hidden] { display: none; }

/* Tighter form card so the loading bar + table top sit above the fold. */
.tool-form-card { padding: 18px 24px; }
.kw-preview[hidden] { display: none; }
.kw-preview {
    background: var(--ink-25, #fafafa);
    border: 1px solid var(--ink-100, #e5e7eb);
    border-radius: 8px;
    padding: 10px 14px;
    margin-top: 12px;
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    font-size: 13px;
}
.kw-preview-row {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.kw-preview-label {
    color: var(--ink-500, #6b7280);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 11px;
}
.kw-preview-value {
    font-weight: 600;
    color: var(--ink-900, #111827);
}
.feedback-msg.is-error { color: var(--brand-red, #dc1717); }
.feedback-msg.is-ok    { color: #047857; }
.feedback-counter      { color: var(--ink-500, #6b7280); font-size: 12px; }
.wysiwyg-shell {
    border: 1px solid var(--card-border, #e5e7eb);
    border-radius: 10px;
    background: #ffffff;
    overflow: hidden;
}
.wysiwyg-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding: 6px 8px;
    background: var(--ink-25, #fafafa);
    border-bottom: 1px solid var(--ink-100, #e5e7eb);
}
.wy-btn {
    appearance: none;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 4px;
    padding: 4px 8px;
    cursor: pointer;
    font: inherit;
    font-size: 12px;
    color: var(--ink-700, #374151);
}
.wy-btn:hover { background: var(--ink-100, #e5e7eb); }
.wy-btn:active { background: var(--ink-200, #d1d5db); }
.wy-sep {
    width: 1px;
    background: var(--ink-200, #d1d5db);
    margin: 0 4px;
}
.wysiwyg-editor {
    min-height: 220px;
    padding: 12px 14px;
    font-size: 14px;
    line-height: 1.6;
    color: var(--ink-900, #111827);
    outline: none;
}
.wysiwyg-editor.is-empty:before {
    content: attr(data-placeholder);
    color: var(--ink-400, #9ca3af);
    pointer-events: none;
    display: block;
}
.wysiwyg-editor h1, .wysiwyg-editor h2, .wysiwyg-editor h3 {
    margin: 8px 0;
}
.wysiwyg-editor p { margin: 6px 0; }
.muted { color: var(--ink-400, #9ca3af); }
.history-list-ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.history-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 12px;
    cursor: pointer;
    border-bottom: 1px solid var(--ink-50, #f3f4f6);
    position: relative;
}
.history-item:hover {
    background: var(--brand-50, #eff6ff);
}
.history-item-input {
    flex: 1 1 auto;
    min-width: 0;
    color: var(--ink-900, #111827);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.history-item-meta { color: var(--ink-500, #6b7280); font-size: 12px; }
.history-item-when { color: var(--ink-400, #9ca3af); font-size: 12px; }
.history-item-delete {
    appearance: none;
    background: transparent;
    border: 0;
    color: var(--ink-400, #9ca3af);
    font-size: 18px;
    cursor: pointer;
    padding: 0 6px;
    line-height: 1;
    opacity: 0;
}
.history-item:hover .history-item-delete { opacity: 1; }
.history-empty {
    margin: 12px;
    color: var(--ink-500, #6b7280);
    font-size: 13px;
}
.pagination {
    margin-top: 12px;
    display: flex;
    gap: 4px;
    justify-content: flex-end;
    align-items: center;
}
.pg-btn {
    appearance: none;
    background: #ffffff;
    border: 1px solid var(--card-border, #e5e7eb);
    color: var(--ink-700, #374151);
    border-radius: 4px;
    padding: 4px 8px;
    cursor: pointer;
    font-size: 13px;
}
.pg-btn:hover:not([disabled]) { background: var(--ink-50, #f3f4f6); }
.pg-btn.is-current { background: var(--brand-700, #1d4ed8); color: #fff; border-color: var(--brand-700, #1d4ed8); }
.pg-btn[disabled] { opacity: 0.4; cursor: not-allowed; }
.pg-gap { color: var(--ink-400, #9ca3af); margin: 0 4px; }
.export-form { display: inline-flex; gap: 6px; }
.toasts {
    position: fixed;
    bottom: 16px;
    right: 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    z-index: 100;
    max-width: 360px;
}
.toast {
    background: #ffffff;
    border-radius: 10px;
    padding: 10px 14px;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.15);
    border-left: 4px solid var(--brand-700, #1d4ed8);
}
.toast--success { border-left-color: #16a34a; }
.toast--warning { border-left-color: #d97706; }
.toast--danger  { border-left-color: #dc2626; }
.toast-title { font-weight: 600; font-size: 13px; color: var(--ink-900, #111827); }
.toast-body  { font-size: 12px; color: var(--ink-700, #374151); margin-top: 2px; }
.toast.is-leaving { opacity: 0; transition: opacity 1s; }
.back-to-top {
    position: fixed;
    bottom: 18px;
    left: 18px;
    width: 36px;
    height: 36px;
    border-radius: 9999px;
    background: #ffffff;
    border: 1px solid var(--card-border, #e5e7eb);
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.10);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--ink-700, #374151);
}
.back-to-top[hidden] { display: none; }
.editor-serp-loading {
    color: var(--ink-500, #6b7280);
    font-size: 13px;
    margin: 8px 0;
}

/* Keyword Density Checker - tool-specific CSS.
 *
 * Composes the shared `tools.css` primitives. Tool-specific bits:
 *   - SERP toggle row + location autocomplete
 *   - Density panel (tabs, frequency table, stopword toggle)
 *   - SERP-coverage panel (3 collapsible sections)
 *   - Editor mode two-column layout (form on left, density panel on right)
 *   - Honest-framing card
 */

/* ===== Density region ===== */
.density-region {
    background: var(--card-bg, #ffffff);
    border: 1px solid var(--card-border, #e5e7eb);
    border-radius: 12px;
    padding: 16px 20px 20px;
    margin-top: 16px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}
.density-region[hidden] { display: none; }

.density-header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--ink-50, #f3f4f6);
}

.density-summary {
    display: flex;
    gap: 24px;
    align-items: center;
    flex-wrap: wrap;
}
.density-stat {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.density-stat-num {
    font-size: 22px;
    font-weight: 600;
    color: var(--ink-900, #111827);
    line-height: 1.1;
}
.density-stat-label {
    font-size: 12px;
    color: var(--ink-500, #6b7280);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-top: 2px;
}

.density-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
}

.density-tabs {
    display: inline-flex;
    background: var(--ink-50, #f3f4f6);
    padding: 4px;
    border-radius: 8px;
    gap: 2px;
}
.density-tab {
    appearance: none;
    background: transparent;
    border: 0;
    padding: 6px 12px;
    border-radius: 6px;
    cursor: pointer;
    font: inherit;
    color: var(--ink-700, #374151);
    font-size: 13px;
    line-height: 1;
}
.density-tab.is-active {
    background: #ffffff;
    color: var(--brand-700, #1e3a8a);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
    font-weight: 600;
}
.density-tab:hover:not(.is-active) {
    color: var(--ink-900, #111827);
}

.density-options {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 8px;
}
.density-stopword-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--ink-700, #374151);
    cursor: pointer;
    user-select: none;
}
.density-stopword-toggle input[type=checkbox] {
    margin: 0;
}

.density-table-wrap {
    margin-top: 12px;
    /* Important: no overflow-x:auto here. Sticky thead must stay
       attached to the viewport, not trapped in a 2D scroll container.
       See [[sticky-results-pattern]] memory. */
}
.density-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: auto;
}
.density-table thead th {
    background: var(--ink-50, #f3f4f6);
    color: var(--ink-700, #374151);
    font-weight: 600;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 10px 12px;
    text-align: left;
    border-bottom: 1px solid var(--card-border, #e5e7eb);
    position: sticky;
    top: 0;
    z-index: 2;
}
.density-table thead th.num {
    text-align: right;
}
.density-table tbody td {
    padding: 8px 12px;
    border-bottom: 1px solid var(--ink-50, #f3f4f6);
    font-size: 14px;
    color: var(--ink-800, #1f2937);
    vertical-align: top;
}
.density-table tbody td.num {
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.density-table tbody tr:hover {
    background: var(--ink-25, #fafafa);
}
.density-table .density-empty td {
    color: var(--ink-500, #6b7280);
    text-align: center;
    padding: 28px 12px;
}

.locations-chips {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 4px;
}
.location-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 18px;
    padding: 0 6px;
    border-radius: 4px;
    background: var(--ink-100, #e5e7eb);
    color: var(--ink-700, #374151);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.02em;
}
.location-chip--body {
    background: transparent;
    color: var(--ink-500, #6b7280);
    border: 1px dashed var(--ink-200, #d1d5db);
}

/* ===== SERP coverage region ===== */
.serp-region {
    margin-top: 16px;
}
.serp-region[hidden] { display: none; }
.serp-section {
    background: var(--card-bg, #ffffff);
    border: 1px solid var(--card-border, #e5e7eb);
    border-radius: 12px;
    padding: 0;
    margin-bottom: 12px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}
.serp-section > summary {
    cursor: pointer;
    padding: 14px 18px;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.serp-section > summary::-webkit-details-marker { display: none; }
.serp-section > summary::before {
    content: '▸';
    display: inline-block;
    color: var(--ink-500, #6b7280);
    margin-right: 6px;
    transition: transform 120ms ease;
}
.serp-section[open] > summary::before {
    transform: rotate(90deg);
}
.serp-section-title {
    font-size: 15px;
    font-weight: 600;
    color: var(--ink-900, #111827);
}
.serp-section-hint {
    font-size: 13px;
    color: var(--ink-500, #6b7280);
}
.serp-table-wrap {
    padding: 0 8px 12px 8px;
}
.serp-table-wrap .density-table thead th {
    background: var(--ink-25, #fafafa);
}
.found-on-chips {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 4px;
}
.found-on-chip {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    background: var(--brand-50, #eff6ff);
    color: var(--brand-700, #1d4ed8);
    font-size: 11px;
    border-radius: 9999px;
    text-decoration: none;
    max-width: 240px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.in-content-yes { color: #047857; font-weight: 600; }
.in-content-no  { color: #b45309; }

/* ===== SERP toggle + location (compact) ===== */
.serp-toggle-row {
    margin-top: 12px;
    padding: 8px 12px;
    border-radius: 8px;
    background: var(--ink-25, #fafafa);
    border: 1px solid var(--ink-100, #e5e7eb);
}
.serp-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-weight: 500;
    color: var(--ink-900, #111827);
    font-size: 13px;
}
.serp-toggle input[type=checkbox] {
    width: 14px;
    height: 14px;
    accent-color: var(--brand-700, #1d4ed8);
}
.serp-toggle-hint {
    margin: 2px 0 0 22px;
    color: var(--ink-500, #6b7280);
    font-size: 12px;
    line-height: 1.4;
}
.serp-location-row {
    margin-top: 10px;
}
.serp-location-row[hidden] { display: none; }
.location-input-wrap {
    position: relative;
}
.location-suggestions {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #ffffff;
    border: 1px solid var(--card-border, #e5e7eb);
    border-radius: 8px;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
    margin-top: 4px;
    max-height: 280px;
    overflow-y: auto;
    z-index: 50;
}
.location-suggestions[hidden] { display: none; }
.location-option {
    padding: 8px 12px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.location-option:hover, .location-option.is-active {
    background: var(--brand-50, #eff6ff);
}
.location-option-name {
    color: var(--ink-900, #111827);
    font-size: 14px;
}
.location-option-meta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--ink-500, #6b7280);
    font-size: 11px;
}
.location-option-type {
    background: var(--ink-100, #e5e7eb);
    color: var(--ink-700, #374151);
    padding: 1px 6px;
    border-radius: 9999px;
}

/* ===== Editor-mode shell ===== */
.check-shell.is-editor {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 20px;
    align-items: start;
}
.check-shell:not(.is-editor) .check-sidebar { display: none; }
.check-shell.is-editor .check-sidebar { display: block; }
.check-shell.is-editor .check-sidebar[hidden] { display: none; }
@media (max-width: 1000px) {
    .check-shell.is-editor {
        grid-template-columns: 1fr;
    }
}

.check-sidebar {
    position: sticky;
    top: 80px;
    align-self: start;
    max-height: calc(100vh - 100px);
    overflow-y: auto;
}
.check-sidebar > section {
    background: var(--card-bg, #ffffff);
    border: 1px solid var(--card-border, #e5e7eb);
    border-radius: 12px;
    padding: 12px 14px;
    margin-bottom: 12px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}
.check-sidebar .density-table {
    font-size: 13px;
}
.check-sidebar .density-table thead th {
    padding: 6px 8px;
    font-size: 11px;
}
.check-sidebar .density-table tbody td {
    padding: 4px 8px;
    font-size: 12px;
}
.check-sidebar .density-stat-num {
    font-size: 18px;
}

/* ===== Editor SERP region ===== */
.editor-serp-region {
    margin-top: 20px;
    padding: 18px 20px;
    background: var(--card-bg, #ffffff);
    border: 1px solid var(--card-border, #e5e7eb);
    border-radius: 12px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}
.editor-serp-region[hidden] { display: none; }
.editor-serp-header h2 {
    margin: 0 0 10px 0;
}
.editor-serp-form {
    display: flex;
    align-items: stretch;
    gap: 8px;
    position: relative;
}
.editor-serp-form .text-input {
    flex: 1 1 auto;
}
.editor-serp-hint {
    margin: 10px 0 0 0;
    font-size: 13px;
    color: var(--ink-500, #6b7280);
}
.editor-serp-region #editor-serp-results[hidden] { display: none; }

/* ===== Focus keyword stats card ===== */
.kwstats-region[hidden] { display: none; }
.kwstats-region {
    background: var(--card-bg, #ffffff);
    border: 1px solid var(--card-border, #e5e7eb);
    border-radius: 12px;
    padding: 14px 18px;
    margin-top: 16px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}
.kwstats-header {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-bottom: 12px;
}
.kwstats-eyebrow {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--ink-500, #6b7280);
}
.kwstats-title {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    color: var(--ink-900, #111827);
}
.kwstats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 12px;
}
.kwstats-grid--compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}
.kwstats-card {
    padding: 10px 12px;
    border-radius: 8px;
    background: var(--ink-25, #fafafa);
    border: 1px solid var(--ink-50, #f3f4f6);
}
.kwstats-label {
    font-size: 11px;
    text-transform: uppercase;
    color: var(--ink-500, #6b7280);
    margin-bottom: 4px;
}
.kwstats-value {
    font-size: 18px;
    font-weight: 600;
    color: var(--ink-900, #111827);
}
.kwstats-trend {
    height: 32px;
    display: flex;
    align-items: center;
}
.kwstats-trend svg {
    width: 100%;
    height: 32px;
}

/* ===== Honest framing (always-open info card) ===== */
.honest-framing {
    margin-top: 18px;
    background: var(--ink-25, #fafafa);
    border: 1px dashed var(--ink-200, #d1d5db);
    border-radius: 10px;
    padding: 14px 18px;
}
.honest-framing-title {
    margin: 0 0 10px 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--ink-700, #374151);
    display: flex;
    align-items: center;
}
.honest-framing-title::before {
    content: 'i';
    display: inline-block;
    width: 18px;
    height: 18px;
    line-height: 18px;
    text-align: center;
    background: var(--ink-200, #d1d5db);
    color: var(--ink-700, #374151);
    border-radius: 9999px;
    font-family: serif;
    font-style: italic;
    font-weight: 700;
    margin-right: 8px;
}
.honest-framing-body {
    color: var(--ink-700, #374151);
    font-size: 14px;
    line-height: 1.55;
}
.honest-framing-body p { margin: 0 0 8px 0; }
.honest-framing-body p:last-child { margin-bottom: 0; }

/* ===== Quota card (mirrors SCC/DAC/WAC/SSC shape) ===== */
.quota-region {
    background: #fff;
    border: 1px solid var(--ink-100, #e5e7eb);
    border-radius: 10px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    padding: 12px 16px;
    margin-bottom: 16px;
    margin-top: 16px;
}
.quota-region[hidden] { display: none; }
.quota-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}
.quota-title {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.4px;
    color: var(--ink-500, #6b7280);
}
.quota-upgrade {
    font-size: 12px;
    font-weight: 600;
    color: var(--brand-red, #dc1717);
    text-decoration: none;
}
.quota-upgrade:hover { text-decoration: underline; }
.quota-chips {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 10px;
}
.quota-chip {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 10px 12px;
    border-radius: 6px;
    background: var(--ink-50, #f3f4f6);
    border: 1px solid var(--ink-100, #e5e7eb);
}
.quota-chip-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: var(--ink-500, #6b7280);
}
.quota-chip-text {
    font-variant-numeric: tabular-nums;
    font-size: 13px;
    font-weight: 600;
    color: var(--ink, #1f2937);
}
.quota-chip-bar {
    display: block;
    height: 4px;
    background: var(--ink-200, #d1d5db);
    border-radius: 999px;
    overflow: hidden;
}
.quota-chip-fill {
    display: block;
    height: 100%;
    width: 0%;
    background: linear-gradient(90deg, var(--brand-red, #dc1717) 0%, #ef6262 100%);
    transition: width 0.4s ease;
}
.quota-chip.is-warning .quota-chip-fill { background: linear-gradient(90deg, #d97706 0%, #f59e0b 100%); }
.quota-chip.is-danger  .quota-chip-fill { background: linear-gradient(90deg, #b91c1c 0%, #ef4444 100%); }
.quota-chip.is-warning .quota-chip-text { color: #b45309; }
.quota-chip.is-danger  .quota-chip-text { color: #b91c1c; }

/* ===== Editor: hide non-editor regions when in editor mode ===== */
body.kdc-mode-editor #density-region,
body.kdc-mode-editor #serp-region,
body.kdc-mode-editor #kwstats-region,
body.kdc-mode-editor #progress-region,
body.kdc-mode-editor #history-region {
    display: none !important;
}
body.kdc-mode-editor .editor-serp-region {
    /* Shown after focus keyword is supplied AND user clicks "Compare". */
}
body:not(.kdc-mode-editor) #editor-serp-region,
body:not(.kdc-mode-editor) #drafts-region {
    display: none !important;
}

/* ===== Cross-tool link cell affordances ===== */
.cell-xlink {
    cursor: pointer;
    border-bottom: 1px dotted var(--ink-300, #9ca3af);
}
.cell-xlink:hover {
    color: var(--brand-700, #1d4ed8);
    border-bottom-style: solid;
    border-bottom-color: var(--brand-700, #1d4ed8);
}