/* ── Companies List ────────────────────────────────── */

.sc-company-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}

@media (max-width: 992px) {
    .sc-company-grid { grid-template-columns: 1fr; }
}

.sc-company-card {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 12px 14px;
    text-decoration: none;
    color: inherit;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.sc-company-card:hover {
    border-color: #198754;
    box-shadow: 0 2px 8px rgba(25, 135, 84, 0.1);
    color: inherit;
    text-decoration: none;
}

.sc-company-card-header {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    min-width: 130px;
}

.sc-company-logo {
    width: 28px;
    height: 28px;
    border-radius: 5px;
    object-fit: contain;
    background: #f8f9fa;
}

.sc-company-logo-fallback {
    width: 28px;
    height: 28px;
    border-radius: 5px;
    background: #198754;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 11px;
}

.sc-company-ticker {
    font-weight: 700;
    font-size: 14px;
    color: #198754;
}

.sc-company-card-body {
    flex: 1;
    min-width: 0;
}

.sc-company-name {
    font-weight: 600;
    font-size: 13px;
    color: #1f2937;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sc-company-industry {
    font-size: 12px;
    color: #9ca3af;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sc-company-card-stats {
    display: flex;
    gap: 20px;
    flex-shrink: 0;
}

.sc-stat-value {
    font-weight: 600;
    font-size: 13px;
    color: #1f2937;
}

.sc-stat-label {
    font-size: 10px;
    color: #9ca3af;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

@media (max-width: 992px) {
    .sc-company-card-stats { display: none; }
}

/* ── Research Depth (Level 1–5) ───────────────────── */

.sc-level-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    margin-bottom: 16px;
    overflow: hidden;
}

.sc-level-card-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    background: #f9fafb;
    border-bottom: 1px solid #f3f4f6;
}

.sc-level-badge {
    font-size: 13px;
    font-weight: 800;
    color: #fff;
    width: 28px;
    height: 28px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.sc-level-label {
    font-size: 14px;
    font-weight: 700;
    color: #1f2937;
}

.sc-level-count {
    font-size: 12px;
    color: #9ca3af;
}

.sc-level-bar {
    display: flex;
    gap: 3px;
    margin-left: auto;
}

.sc-depth-seg {
    width: 18px;
    height: 6px;
    border-radius: 3px;
    background: #e5e7eb;
}

.sc-level-card .sc-company-grid {
    display: flex;
    flex-direction: column;
    border: none;
    border-radius: 0;
    gap: 0;
}

.sc-level-card .sc-company-card {
    border: none;
    border-radius: 0;
    border-bottom: 1px solid #f3f4f6;
}

.sc-level-card .sc-company-card:last-child {
    border-bottom: none;
}

.sc-depth-chip {
    font-size: 10px;
    font-weight: 700;
    padding: 1px 6px;
    border: 1.5px solid;
    border-radius: 8px;
    margin-left: auto;
    white-space: nowrap;
    flex-shrink: 0;
}

/* ── Depth Explainer Panel ───────────────────────── */

.sc-depth-explainer {
    margin-bottom: 16px;
}

.sc-depth-explainer-inner {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 20px;
}

.sc-depth-groups {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 16px;
}

.sc-depth-group-row {
    display: flex;
    align-items: baseline;
    gap: 10px;
    font-size: 13px;
    padding: 6px 10px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
}

.sc-depth-group-name {
    font-weight: 700;
    color: #1f2937;
    min-width: 120px;
    flex-shrink: 0;
}

.sc-depth-group-count {
    font-size: 11px;
    font-weight: 600;
    color: #6b7280;
    background: #f3f4f6;
    padding: 1px 6px;
    border-radius: 4px;
    flex-shrink: 0;
}

.sc-depth-group-items {
    font-size: 12px;
    color: #9ca3af;
    text-transform: capitalize;
}

.sc-depth-scale {
    display: flex;
    gap: 12px;
    justify-content: center;
    padding-top: 12px;
    border-top: 1px solid #e5e7eb;
}

.sc-depth-scale-item {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: #6b7280;
}

.sc-depth-scale-badge {
    width: 22px;
    height: 22px;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 800;
    color: #fff;
}

.sc-depth-scale-range {
    font-weight: 500;
}

/* Ticker Autocomplete styles → stocks-autocomplete.css (shared component) */

/* ── Company Detail ───────────────────────────────── */

.sc-profile-card {
    border-left: 4px solid #198754;
}

.sc-detail-logo {
    width: 52px;
    height: 52px;
    border-radius: 8px;
    object-fit: contain;
    background: #f8f9fa;
    padding: 4px;
}

.sc-header-value {
    font-weight: 700;
    font-size: 16px;
    color: #1f2937;
}

.sc-header-label {
    font-size: 11px;
    color: #9ca3af;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

/* ── Key Metrics Grid ─────────────────────────────── */

.sc-metrics-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.sc-metric-item {
    background: #f8f9fa;
    border-radius: 8px;
    padding: 18px 20px;
    border: 1px solid #e5e7eb;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.sc-metric-item:hover {
    border-color: #c7d2fe;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.sc-metric-item.sc-metric-good {
    background: #d1fae5;
    border-color: #a7f3d0;
}

.sc-metric-item.sc-metric-bad {
    background: #fee2e2;
    border-color: #fecaca;
}

.sc-metric-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 6px;
}

.sc-metric-lbl {
    font-size: 14px;
    color: #1f2937;
    font-weight: 700;
    line-height: 1.4;
}

.sc-metric-desc {
    font-size: 12px;
    font-weight: 400;
    color: #6b7280;
}

.sc-metric-val {
    font-weight: 800;
    font-size: 26px;
    color: #1f2937;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    margin-bottom: 8px;
}

.sc-metric-formula {
    font-size: 12px;
    color: #4b5563;
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
    margin-bottom: 6px;
}

.sc-metric-inputs {
    font-size: 12px;
    color: #4b5563;
    line-height: 1.7;
}

.sc-metric-inputs span {
    color: #111827;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.sc-metric-note {
    font-size: 12px;
    color: #92400e;
    font-style: italic;
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px solid #e5e7eb;
}

.sc-metric-source {
    display: inline-block;
    font-size: 9px;
    font-weight: 700;
    padding: 1px 5px;
    border-radius: 3px;
    letter-spacing: 0.3px;
}

/* ── Analysis Script Bar ──────────────────────────── */

.sc-scripts-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
}

.sc-run-script {
    font-size: 13px;
    font-weight: 500;
    border-style: dashed;
}

.sc-run-script:hover {
    border-style: solid;
}

.sc-run-script.sc-running {
    pointer-events: none;
    opacity: 0.6;
}

#sc-script-results .card {
    border-left: 3px solid #198754;
}

/* ── Deep Analysis Run Button ────────────────────── */

.sc-run-all-btn {
    font-size: 14px;
    font-weight: 700;
    padding: 8px 20px;
    border-radius: 8px;
    letter-spacing: 0.3px;
    transition: all 0.2s;
    box-shadow: 0 2px 8px rgba(37, 99, 235, 0.25);
}

.sc-run-all-btn:hover {
    box-shadow: 0 4px 14px rgba(37, 99, 235, 0.35);
    transform: translateY(-1px);
}

.sc-run-all-btn:disabled {
    transform: none;
    box-shadow: none;
}

.sc-run-all-btn.btn-outline-success {
    box-shadow: 0 2px 8px rgba(25, 135, 84, 0.25);
}

/* ── Deep Analysis Terminal Feed ──────────────────── */

.sc-terminal-feed {
    margin-bottom: 12px;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid #1e293b;
    font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
}

.sc-terminal-header {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    background: #1e293b;
}

.sc-terminal-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.sc-terminal-title {
    font-size: 11px;
    color: #94a3b8;
    margin-left: 6px;
    font-weight: 600;
}

.sc-terminal-status {
    margin-left: auto;
    font-size: 10px;
    font-weight: 600;
}

.sc-terminal-body {
    background: #0f172a;
    padding: 10px 14px;
    max-height: 420px;
    overflow-y: auto;
    font-size: 11px;
    line-height: 1.7;
}

.sc-terminal-body::-webkit-scrollbar {
    width: 6px;
}
.sc-terminal-body::-webkit-scrollbar-track {
    background: #1e293b;
}
.sc-terminal-body::-webkit-scrollbar-thumb {
    background: #475569;
    border-radius: 3px;
}

.sc-feed-line {
    display: flex;
    gap: 8px;
    padding: 1px 0;
}

.sc-feed-time {
    color: #475569;
    flex-shrink: 0;
    font-size: 10px;
    min-width: 55px;
    font-variant-numeric: tabular-nums;
}

.sc-feed-layer {
    flex-shrink: 0;
    font-size: 10px;
    font-weight: 700;
    min-width: 28px;
    text-align: right;
}

.sc-feed-msg {
    color: #e2e8f0;
}

.sc-feed-msg.sc-feed-ok { color: #4ade80; }
.sc-feed-msg.sc-feed-err { color: #f87171; }
.sc-feed-msg.sc-feed-dim { color: #64748b; }
.sc-feed-msg.sc-feed-info { color: #38bdf8; }
.sc-feed-msg.sc-feed-warn { color: #fbbf24; }

.sc-feed-cursor {
    display: inline-block;
    width: 7px;
    height: 13px;
    background: #4ade80;
    animation: sc-blink 1s step-end infinite;
    vertical-align: text-bottom;
    margin-left: 2px;
}

@keyframes sc-blink {
    50% { opacity: 0; }
}

/* ── Future Predictions ──────────────────────────── */

.sc-prediction-layer {
    padding: 10px 14px;
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
}

.sc-layer-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #1e293b;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    flex-shrink: 0;
}

@media (max-width: 992px) {
    .sc-metrics-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 576px) {
    .sc-metrics-grid { grid-template-columns: 1fr; }
}

.sc-source-api {
    background: #dbeafe;
    color: #1e40af;
}

.sc-source-calc {
    background: #fef3c7;
    color: #92400e;
}

/* ── Metric Legend ─────────────────────────────────── */

.sc-legend {
    display: flex;
    gap: 14px;
    font-size: 12px;
    color: #6b7280;
}

.sc-legend-item {
    display: flex;
    align-items: center;
    gap: 5px;
}

.sc-legend-swatch {
    display: inline-block;
    width: 14px;
    height: 14px;
    border-radius: 3px;
    border: 1px solid #e5e7eb;
}

/* ── Financial Tables ─────────────────────────────── */

.sc-fin-table {
    font-size: 13px;
    margin-bottom: 0;
}

.sc-fin-table thead th {
    font-weight: 600;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    color: #6b7280;
    border-bottom: 2px solid #e5e7eb;
    padding: 6px 10px;
    white-space: nowrap;
}

.sc-fin-table tbody td {
    padding: 6px 10px;
    white-space: nowrap;
    vertical-align: middle;
}

.sc-fin-table tbody td:first-child {
    font-weight: 500;
    color: #374151;
}

.sc-fin-table tbody td:not(:first-child) {
    font-variant-numeric: tabular-nums;
}

.sc-highlight-row {
    background: #f8f9fa;
    font-weight: 600;
}

.sc-highlight-row td {
    font-weight: 600 !important;
    color: #1f2937 !important;
}

/* ── Provenance Icons ─────────────────────────────── */

.sc-prov-icon {
    font-size: 0.72rem;
    vertical-align: middle;
    margin-left: 4px;
    transition: opacity 0.15s;
}

.sc-prov-icon:hover {
    opacity: 0.7;
}

.sc-prov-missing {
    color: #d1d5db;
    font-size: 0.65rem;
}

/* ── Provenance Card ─────────────────────────────── */

.sc-prov-card {
    margin: 6px 0 8px;
}

.sc-prov-card-inner {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-left: 3px solid #198754;
    border-radius: 0 6px 6px 0;
    padding: 10px 14px;
    font-size: 13px;
}

.sc-prov-row {
    display: flex;
    padding: 3px 0;
}

.sc-prov-label {
    width: 80px;
    flex-shrink: 0;
    color: #64748b;
    font-weight: 500;
    font-size: 12px;
}

.sc-prov-value {
    color: #1e293b;
    flex: 1;
    font-size: 12px;
}

.sc-prov-confidence {
    display: inline-block;
    font-size: 11px;
    font-weight: 600;
    padding: 1px 10px;
    border-radius: 10px;
}

/* ── Freshness (header) ──────────────────────────── */

.sc-freshness {
    font-size: 12px;
    color: #9ca3af;
}

/* ── Search ───────────────────────────────────────── */

.sc-search:focus {
    border-color: #198754;
    box-shadow: 0 0 0 0.2rem rgba(25, 135, 84, 0.15);
}

/* ── Header Action Buttons (company detail) ──────── */

.sc-cat-btn,
.sc-watch-btn {
    font-size: 13px;
    font-weight: 600;
    padding: 4px 14px;
    border-radius: 6px;
    transition: all 0.15s;
    white-space: nowrap;
}

.sc-cat-btn:hover {
    text-decoration: none;
}

/* ── Script Results ──────────────────────────────── */

.sc-sr-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}

.sc-sr-card {
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 12px 14px;
    font-size: 12px;
}

.sc-sr-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
}

.sc-sr-title {
    font-weight: 700;
    font-size: 13px;
    color: #1f2937;
}

.sc-sr-date {
    font-size: 11px;
    color: #9ca3af;
}

.sc-sr-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 8px;
}

.sc-sr-stat {
    display: flex;
    flex-direction: column;
}

.sc-sr-stat-label {
    font-size: 10px;
    color: #9ca3af;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.sc-sr-stat-value {
    font-size: 14px;
    font-weight: 700;
}

.sc-sr-summary {
    font-size: 12px;
    color: #4b5563;
    line-height: 1.5;
    margin-bottom: 8px;
    padding: 6px 8px;
    background: #fff;
    border-radius: 4px;
    border-left: 3px solid #198754;
}

.sc-sr-steps {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.sc-sr-step {
    font-size: 11px;
    line-height: 1.4;
    padding: 3px 0;
    border-bottom: 1px solid #f3f4f6;
}

.sc-sr-step:last-child {
    border-bottom: none;
}

.sc-sr-step-name {
    font-weight: 600;
    color: #374151;
}

.sc-sr-step-detail {
    color: #6b7280;
    margin-left: 4px;
}

@media (max-width: 768px) {
    .sc-sr-grid { grid-template-columns: 1fr; }

    /* ── Mobile stacking — card headers and layer rows ───────
       Most cards use Bootstrap's `d-flex` rows without `flex-wrap`,
       which overflows the card on narrow screens. Force wrap on
       common containers so every piece visibly stacks.
       ──────────────────────────────────────────────────── */

    /* Key Metrics header: H6 + legend + Scale button → wrap, and
       hide the legend text labels (just show the API/CALC badges
       inside the metric cells, which are already visible there). */
    .sc-legend {
        display: none;
    }
    /* Bootstrap card headers that use justify-content-between — force wrap */
    .card-body > .d-flex.justify-content-between {
        flex-wrap: wrap;
        row-gap: 8px;
    }

    /* Deep Analysis layer header — badge + title + subtitle + buttons + status.
       On desktop it's one row; on mobile let it wrap (status ends up on
       its own line, which reads fine). */
    .sc-prediction-layer > .d-flex {
        flex-wrap: wrap;
        row-gap: 4px;
    }
    .sc-layer-status {
        flex-basis: 100%;
    }

    /* (No forced width on #sc-run-all-predictions — the parent block is
       already pulled right via margin-left:auto above, so the button
       keeps its natural size and sits at the right edge.) */

    /* Scripts bar (Industry Comparison button + "Last run" timestamp).
       Keep buttons right-aligned on mobile — primary actions cluster at
       the right edge, timestamps sit on their own line under them. */
    .sc-scripts-bar {
        flex-wrap: wrap;
        row-gap: 6px;
        justify-content: flex-end;
    }
    .sc-scripts-bar .sc-last-run {
        flex: 0 0 100%;
        text-align: right;
    }

    /* Any card-body header that wrapped — push the wrapped action block to
       the right edge of its own line (Scale button, Research button, etc.).
       Matches the mobile convention that primary actions stack along the
       right side, not left-aligned under the title. */
    .card-body > .d-flex.justify-content-between > .d-flex.align-items-center {
        margin-left: auto;
    }

    /* Deep Analysis top card: "Run Deep Analysis" action block right-aligned. */
    .card-body > .d-flex.justify-content-between > div[style*="text-align:right"] {
        margin-left: auto;
    }

    /* The rating-scale chips panel that opens under the Scale button was
       absolutely right-aligned — on mobile, pin it left so it doesn't
       hang off the card edge. */
    #sc-tier-legend > div {
        justify-content: flex-start;
    }

    /* Companies list header — autocomplete was overflowing. Give it
       full width once wrapped so it doesn't stick out past the card. */
    .sc-list-header .sc-ac-wrap {
        width: 100%;
        max-width: 100%;
    }
}

@media print {
    .sc-sr-grid { grid-template-columns: 1fr; }
    .sc-sr-card { break-inside: avoid; }
}

/* ── Pre-Flight Intelligence Card ─────────────────── */
.sc-preflight-card {
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    margin-bottom: 16px;
    overflow: hidden;
    background: #fafbfc;
}
.sc-preflight-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    background: #f0f4f8;
    border-bottom: 1px solid #e5e7eb;
    font-size: 13px;
}
.sc-preflight-header i.bi-radar { color: #6366f1; font-size: 15px; }
.sc-preflight-type {
    background: #6366f1;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 10px;
}
.sc-preflight-confidence {
    font-size: 11px;
    color: #6b7280;
}
.sc-preflight-summary {
    padding: 10px 14px;
    font-size: 12px;
    color: #4b5563;
    line-height: 1.6;
}
.sc-preflight-details { padding: 0 14px 14px; }
.sc-pf-section { margin-bottom: 12px; }
.sc-pf-section h6 {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6b7280;
    margin-bottom: 6px;
    padding-bottom: 4px;
    border-bottom: 1px solid #e5e7eb;
}
.sc-pf-segment {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 0;
    font-size: 12px;
}
.sc-pf-segment-bar {
    height: 6px;
    border-radius: 3px;
    background: #6366f1;
    flex-shrink: 0;
}
.sc-pf-segment-name { font-weight: 600; color: #1f2937; min-width: 120px; }
.sc-pf-segment-meta { color: #6b7280; font-size: 11px; }
.sc-pf-peer {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 0;
    font-size: 12px;
    border-bottom: 1px solid #f3f4f6;
}
.sc-pf-peer:last-child { border-bottom: none; }
.sc-pf-peer-ticker { font-weight: 700; min-width: 50px; color: #1f2937; }
.sc-pf-peer-score {
    font-size: 11px;
    font-weight: 600;
    min-width: 35px;
    text-align: center;
    padding: 1px 5px;
    border-radius: 4px;
}
.sc-pf-peer-score-high { background: #dcfce7; color: #166534; }
.sc-pf-peer-score-mid { background: #fef3c7; color: #92400e; }
.sc-pf-peer-score-low { background: #fee2e2; color: #991b1b; }
.sc-pf-peer-excluded { opacity: 0.5; text-decoration: line-through; }
.sc-pf-peer-reason { color: #6b7280; font-size: 11px; flex: 1; }
.sc-pf-method-run, .sc-pf-method-skip {
    display: inline-block;
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 4px;
    margin: 2px;
}
.sc-pf-method-run { background: #dcfce7; color: #166534; }
.sc-pf-method-skip { background: #fee2e2; color: #991b1b; }
.sc-pf-thesis {
    font-size: 12px;
    color: #374151;
    line-height: 1.7;
    font-style: italic;
    padding: 8px 12px;
    background: #fff;
    border-left: 3px solid #6366f1;
    border-radius: 0 4px 4px 0;
}
.sc-pf-warning {
    font-size: 12px;
    color: #92400e;
    padding: 4px 0;
}
.sc-pf-warning::before { content: "⚠ "; }

/* ── Business History card (markdown output) ───────── */
.sc-markdown {
    font-size: 14px;
    line-height: 1.65;
    color: #1f2937;
}
.sc-markdown h3 {
    font-size: 16px;
    font-weight: 700;
    color: #111827;
    margin: 20px 0 8px;
    padding-bottom: 4px;
    border-bottom: 1px solid #e5e7eb;
}
.sc-markdown h3:first-child { margin-top: 0; }
.sc-markdown h4, .sc-markdown h5, .sc-markdown h6 {
    font-size: 14px;
    font-weight: 600;
    color: #374151;
    margin: 14px 0 6px;
}
.sc-markdown p { margin: 0 0 10px; }
.sc-markdown ul {
    margin: 0 0 12px;
    padding-left: 22px;
}
.sc-markdown li { margin-bottom: 4px; }
.sc-markdown strong { color: #111827; }
.sc-markdown em { color: #4b5563; }

/* ── Tier Chip (Amazing/Good/Terrible N/10) ─────────
 * Shared chip used by the Industry Benchmarks comparison card and the inline
 * tier chips rendered into each key metric tile by injectIndustryAverages().
 * Tier colors are injected via --sc-tier-bg / --sc-tier-text custom properties
 * so callers only need to set two variables (not re-declare all the styling).
 */
.sc-tier-chip {
    display: inline-block;
    font-weight: 700;
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 4px;
    cursor: help;
    color: var(--sc-tier-text, #fff);
    background: var(--sc-tier-bg, #6b7280);
    white-space: nowrap;
}
/* Dimmed variant for inline use inside key metric tiles — lets the metric
 * value stay visually dominant, chip stays visible but doesn't shout. */
.sc-tier-chip--dim {
    font-size: 12px;
    opacity: 0.3;
    transition: opacity 0.15s;
}
.sc-tier-chip--dim:hover {
    opacity: 1;
}

/* ── Reviewed By Delvantic section ─────────────────── */
.sc-reviewed-section {
    margin-bottom: 20px;
}
.sc-reviewed-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 4px 10px;
}
.sc-reviewed-header h5 {
    font-weight: 700;
    color: #1f2937;
}
.sc-reviewed-count {
    font-size: 12px;
    color: #6b7280;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.sc-reviewed-chip {
    position: absolute;
    top: 8px;
    right: 8px;
    color: #fff;
    font-weight: 700;
    font-size: 12px;
    padding: 3px 8px;
    border-radius: 12px;
    letter-spacing: 0.3px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.08);
}
.sc-reviewed-section .sc-company-card {
    position: relative;
    border-color: #fde68a;
    background: linear-gradient(to bottom right, #fffbeb, #fff);
}
.sc-reviewed-section .sc-company-card:hover {
    border-color: #f59e0b;
}
.sc-section-divider {
    display: flex;
    align-items: center;
    margin: 24px 0 16px;
    color: #6b7280;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.8px;
}
.sc-section-divider::before,
.sc-section-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #e5e7eb;
}
.sc-section-divider span {
    padding: 0 14px;
}

/* ── My Notes Card ─────────────────────────────────────────────
   Per-ticker personal note + interest rating. Renders in both
   signed-in and signed-out states (sign-in prompt variant), so
   base styles must always ship regardless of auth status.
   ────────────────────────────────────────────────────────────── */
.sc-notes-card { border: 1px solid #e5e7eb; }
.sc-notes-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-bottom: 1px solid #f3f4f6;
}
.sc-notes-title { font-weight: 600; font-size: 15px; color: #1f2937; }
.sc-notes-sub { font-size: 12px; color: #9ca3af; font-style: italic; margin-left: 4px; }
.sc-notes-status { font-size: 12px; color: #6b7280; min-width: 70px; text-align: right; }
.sc-notes-status.saving { color: #f59e0b; }
.sc-notes-status.saved { color: #16a34a; }
.sc-notes-status.error { color: #dc2626; }
.sc-notes-body { padding: 14px 16px; }
.sc-notes-row { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.sc-notes-rating-label { font-size: 13px; font-weight: 600; color: #374151; margin: 0; }
.sc-notes-rating {
    padding: 4px 10px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    min-width: 68px;
    background: #fff;
}
.sc-notes-rating-hint { font-size: 12px; color: #9ca3af; }
.sc-notes-viewall-link { font-size: 13px; color: #4f46e5; text-decoration: none; }
.sc-notes-viewall-link:hover { text-decoration: underline; }
.sc-notes-textarea {
    width: 100%;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    padding: 10px 12px;
    font-size: 14px;
    line-height: 1.5;
    resize: vertical;
    font-family: inherit;
}
.sc-notes-textarea:focus {
    outline: none;
    border-color: #4f46e5;
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.1);
}
.sc-notes-signin {
    font-size: 14px;
    color: #6b7280;
    padding: 12px;
    text-align: center;
    background: #f9fafb;
    border-radius: 6px;
}
.sc-notes-signin a { color: #4f46e5; font-weight: 600; text-decoration: none; }
.sc-notes-signin a:hover { text-decoration: underline; }

/* ── Clamp Widget (reusable "Show more / Show less") ────────────
   Wrap any long content in <div class="sc-clamp">. The widget auto-
   detects overflow and injects a toggle button as a sibling. Custom
   clamp height via data-sc-height="NNN" (px). JS lives in
   company-detail.js → ScClamp (window-exposed); call ScClamp.refresh()
   after swapping dynamic content so overflow can be re-evaluated.
   ────────────────────────────────────────────────────────────── */
.sc-clamp {
    position: relative;
    max-height: var(--sc-clamp-height, 200px);
    overflow: hidden;
    transition: max-height 0.35s ease;
}
.sc-clamp.expanded {
    max-height: 6000px;
}
.sc-clamp:not(.expanded)::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 30px;
    background: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,1));
    pointer-events: none;
}
.sc-clamp-toggle {
    margin-top: 10px;
    padding: 4px 10px;
    font-size: 12px;
    font-weight: 600;
    color: #4f46e5;
    background: none;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.sc-clamp-toggle:hover {
    background: #f9fafb;
    color: #3730a3;
}
.sc-clamp-toggle-icon {
    transition: transform 0.2s ease;
    font-size: 10px;
}
.sc-clamp-toggle.expanded .sc-clamp-toggle-icon {
    transform: rotate(180deg);
}

/* ── Deep Analysis Layer — Skip/Error Helper Text ───────────────
   Shown in a layer body when the script was skipped by classification
   (--skipped, gray) or failed with a data-incompat error (--error,
   amber). Renders even when the layer has cached results, because
   the context is useful ("this is excluded for this classification").
   ────────────────────────────────────────────────────────────── */
.sc-layer-reason {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 12px;
    line-height: 1.5;
    padding: 8px 12px;
    margin-bottom: 8px;
    border-radius: 6px;
    border: 1px solid;
}
.sc-layer-reason i { font-size: 14px; flex-shrink: 0; margin-top: 1px; }
.sc-layer-reason--skipped {
    background: #f9fafb;
    border-color: #e5e7eb;
    color: #6b7280;
}
.sc-layer-reason--skipped i { color: #9ca3af; }
.sc-layer-reason--error {
    background: #fffbeb;
    border-color: #fde68a;
    color: #92400e;
}
.sc-layer-reason--error i { color: #d97706; }