/**
 * CodeIQ Unit Screens — Editorial Refinement (June 2026)
 * ------------------------------------------------------
 * Overrides for the four self-contained unit surfaces:
 *   1. Initialisation screen   (.enhanced-loading / .li-*)
 *   2. Upload screens          (.upload-section: bank / invoices / merchant)
 *   3. Coding pipeline graphic (.tp-shell / .tp-*)
 *
 * Loaded LAST in codeiq/index.html so it wins the cascade. Pure presentation:
 * every functional id / class / data-attribute is untouched.
 * Palette: cream #faf8f5 · ivory #f5f2ed · ink #1a1a1a · salmon #c4576a ·
 * wine #9a4054 · sage #4a7c4a · gold #7a5c18 · rust #b04a3a
 */

/* =========================================================================
   SHARED EDITORIAL PRIMITIVES
   ========================================================================= */

.enhanced-loading,
.tp-shell,
.upload-section {
    --u-cream: #faf8f5;
    --u-ivory: #f5f2ed;
    --u-paper: #efece6;
    --u-ink: #1a1a1a;
    --u-ink-2: #3d3d3d;
    --u-ink-3: #6b6b6b;
    --u-ink-4: #999999;
    --u-rule: #e3ded5;
    --u-rule-strong: #c9c2b4;
    --u-salmon: #c4576a;
    --u-wine: #9a4054;
    --u-wash: #faeef0;
    --u-sage: #4a7c4a;
    --u-sage-wash: #eef3e9;
    --u-serif: 'Fraunces', Georgia, serif;
    --u-mono: 'JetBrains Mono', 'SF Mono', Consolas, monospace;
}

/* =========================================================================
   UNIT 1 — INITIALISATION SCREEN
   ========================================================================= */

.enhanced-loading {
    background: #fffdfa;
    border: 1px solid var(--u-rule);
    box-shadow: 0 24px 60px -42px rgba(39, 33, 28, 0.35);
}

/* Headline in the editorial serif */
.enhanced-loading .li-title {
    font-family: var(--u-serif);
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--u-ink);
}

.enhanced-loading .li-subtitle {
    color: var(--u-ink-3);
}

.enhanced-loading .li-percentage {
    font-family: var(--u-mono);
    background: var(--u-wine);
    color: #fff;
    font-weight: 600;
}

/* Progress ring: lighter track, more confident stroke */
.enhanced-loading .circular-progress .progress-bg {
    stroke: var(--u-paper);
    stroke-width: 7;
}
.enhanced-loading .circular-progress .progress-fill {
    stroke-width: 7;
    stroke-linecap: round;
}
.enhanced-loading .li-hero-ring {
    filter: drop-shadow(0 14px 24px rgba(154, 64, 84, 0.14));
}
.enhanced-loading .li-hero-fallback {
    font-family: var(--u-serif);
    font-weight: 600;
    font-size: 1.35rem;
    color: var(--u-ink);
}
.enhanced-loading .li-phase-name {
    font-family: var(--u-mono);
    letter-spacing: 0.14em;
    color: var(--u-wine);
    background: var(--u-wash);
    border: 1px solid rgba(196, 87, 106, 0.22);
}

/* "Now" banner: white card with a salmon rail instead of a full pink wash */
.enhanced-loading .li-now {
    background: #fff;
    border: 1px solid var(--u-rule);
    border-left: 3px solid var(--u-salmon);
    border-radius: 6px;
    box-shadow: 0 10px 26px -22px rgba(39, 33, 28, 0.4);
}
.enhanced-loading .li-now-kicker {
    color: var(--u-wine);
    font-family: var(--u-mono);
}
.enhanced-loading .li-now-icon {
    background: var(--u-wash);
    color: var(--u-wine);
    border: 1px solid rgba(196, 87, 106, 0.2);
}
.enhanced-loading .li-now-title { color: var(--u-ink); }
.enhanced-loading .li-now-message { color: var(--u-ink-3); }

/* Section heads: mono kickers with a hairline */
.enhanced-loading .li-section-head {
    font-family: var(--u-mono);
    font-size: 10px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--u-ink-4);
    border-bottom: 1px solid var(--u-rule);
    padding-bottom: 8px;
}

/* Pipeline steps: quiet editorial rows in place of solid washed blocks.
   State is carried by the leading icon disc + a left rail, not a full wash. */
.enhanced-loading .li-steps-list .step {
    background: transparent;
    border: none;
    border-left: 2px solid var(--u-rule);
    border-radius: 0;
    padding-left: 14px;
    transition: border-color 0.25s ease, background 0.25s ease;
}
.enhanced-loading .li-steps-list .step + .step {
    margin-top: 2px;
}
.enhanced-loading .li-steps-list .step .li-step-icon {
    background: var(--u-ivory);
    color: var(--u-ink-4);
    border: 1px solid var(--u-rule);
    border-radius: 50%;
    transition: all 0.25s ease;
}
.enhanced-loading .li-steps-list .step .li-step-title {
    color: var(--u-ink-3);
    font-weight: 500;
}
.enhanced-loading .li-steps-list .step .li-step-status {
    font-family: var(--u-mono);
    font-size: 10px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--u-ink-4);
}

.enhanced-loading .li-steps-list .step.completed {
    border-left-color: var(--u-sage);
}
.enhanced-loading .li-steps-list .step.completed .li-step-icon {
    background: var(--u-sage-wash);
    color: var(--u-sage);
    border-color: rgba(74, 124, 74, 0.3);
}
.enhanced-loading .li-steps-list .step.completed .li-step-title { color: var(--u-ink-2); }
.enhanced-loading .li-steps-list .step.completed .li-step-status { color: var(--u-sage); }

.enhanced-loading .li-steps-list .step.active {
    border-left-color: var(--u-salmon);
    background: linear-gradient(90deg, var(--u-wash) 0%, rgba(250, 238, 240, 0) 85%);
}
.enhanced-loading .li-steps-list .step.active .li-step-icon {
    background: var(--u-wine);
    color: #fff;
    border-color: var(--u-wine);
    box-shadow: 0 4px 12px -4px rgba(154, 64, 84, 0.5);
}
.enhanced-loading .li-steps-list .step.active .li-step-title {
    color: var(--u-ink);
    font-weight: 600;
}
.enhanced-loading .li-steps-list .step.active .li-step-status { color: var(--u-wine); }

/* Live counts: editorial stat rows — hairlines, mono numerals, no boxes */
.enhanced-loading .li-stat {
    background: transparent;
    border: none;
    border-bottom: 1px solid var(--u-rule);
    border-radius: 0;
    padding: 12px 2px;
}
.enhanced-loading .li-stat:last-child { border-bottom: none; }
.enhanced-loading .li-stat-label {
    font-family: var(--u-mono);
    font-size: 10px;
    letter-spacing: 0.14em;
    color: var(--u-ink-4);
}
.enhanced-loading .li-stat-value {
    font-family: var(--u-mono);
    font-size: 1.3rem;
    font-weight: 600;
    color: var(--u-ink);
    font-variant-numeric: tabular-nums;
}

/* Fact card: ivory, serif voice — a quote, not an alert */
.enhanced-loading .li-fact-card {
    background: var(--u-ivory);
    border: 1px solid var(--u-rule);
    border-left: 3px solid var(--u-rule-strong);
    border-radius: 6px;
}
.enhanced-loading .li-fact-kicker {
    font-family: var(--u-mono);
    color: var(--u-ink-4);
}
.enhanced-loading .li-fact-text {
    font-family: var(--u-serif);
    font-style: italic;
    font-size: 0.98rem;
    color: var(--u-ink-2);
    line-height: 1.55;
}

.enhanced-loading .li-cancel {
    border: 1px solid var(--u-rule-strong);
    color: var(--u-ink-3);
    background: #fff;
    transition: all 0.2s ease;
}
.enhanced-loading .li-cancel:hover {
    border-color: var(--u-salmon);
    color: var(--u-wine);
    background: var(--u-wash);
}

/* =========================================================================
   UNIT 2 — UPLOAD SCREENS
   ========================================================================= */

/* --- Tab rail ----------------------------------------------------------- */
.upload-section .upload-tabs {
    background: var(--u-ivory);
    border: 1px solid var(--u-rule);
    padding: 4px;
    gap: 4px;
}
.upload-section .upload-tab {
    font-weight: 500;
    color: var(--u-ink-3);
    border-radius: 6px;
    transition: all 0.2s ease;
}
.upload-section .upload-tab:hover:not(.active) {
    color: var(--u-ink);
    background: rgba(255, 255, 255, 0.7);
}
.upload-section .upload-tab.active {
    background: #fff;
    color: var(--u-wine);
    font-weight: 600;
    box-shadow: 0 1px 3px rgba(39, 33, 28, 0.1), inset 0 -2px 0 var(--u-salmon);
}

/* Section headers inside tabs: serif headline + muted standfirst */
.upload-section .upload-header h3,
.upload-section .invoice-header-text h3,
.upload-section .merchant-setup-header h3,
.upload-section .merchant-active h3 {
    font-family: var(--u-serif);
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--u-ink);
}
.upload-section .upload-header p,
.upload-section .invoice-header-text p,
.upload-section .merchant-setup-header p,
.upload-section .merchant-active p {
    color: var(--u-ink-3);
}

/* --- Bank cards ---------------------------------------------------------- */
.upload-section .bank-card {
    background: #fffdfa;
    border: 1px solid var(--u-rule);
    border-radius: 8px;
    box-shadow: 0 14px 34px -30px rgba(39, 33, 28, 0.45);
    transition: box-shadow 0.25s ease, border-color 0.25s ease, transform 0.25s ease;
}
.upload-section .bank-card:hover {
    border-color: var(--u-rule-strong);
    box-shadow: 0 20px 44px -30px rgba(39, 33, 28, 0.5);
}
.upload-section .bank-card .bank-name {
    font-weight: 600;
    color: var(--u-ink);
}
.upload-section .bank-card .bank-type {
    font-family: var(--u-mono);
    font-size: 10px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--u-ink-4);
    background: var(--u-ivory);
    border: 1px solid var(--u-rule);
    border-radius: 999px;
    padding: 2px 8px;
}
.upload-section .bank-card .bank-balance {
    font-family: var(--u-mono);
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    color: var(--u-ink-2);
    background: transparent; /* kill the green sticker wash from main.css */
    padding: 0;
}
.upload-section .bank-card .account-number {
    font-family: var(--u-mono);
    color: var(--u-ink-4);
    letter-spacing: 0.06em;
}
.upload-section .bank-card .platform-badge {
    font-family: var(--u-mono);
    font-size: 9px;
    letter-spacing: 0.14em;
    background: var(--u-wash);
    /* base .platform-badge in main.css declares `color: white !important`
       (it expects a gradient background) — match its weapon */
    color: var(--u-wine) !important;
    text-shadow: none !important;
    box-shadow: none;
    border: 1px solid rgba(196, 87, 106, 0.25);
    border-radius: 999px;
}

/* Drop zones: warm canvas, intentional dashes, salmon invitation on hover */
.upload-section .upload-area {
    background: var(--u-cream);
    border: 1.5px dashed var(--u-rule-strong);
    border-radius: 6px;
    transition: all 0.22s ease;
}
.upload-section .upload-area:hover,
.upload-section .upload-area.drag-over {
    background: var(--u-wash);
    border-color: var(--u-salmon);
}
.upload-section .upload-area .upload-icon {
    width: 44px;
    height: 44px;
    margin: 0 auto 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    color: var(--u-wine);
    border: 1px solid var(--u-rule);
    border-radius: 50%;
    font-size: 18px;
    box-shadow: 0 6px 14px -8px rgba(39, 33, 28, 0.3);
    transition: all 0.22s ease;
}
.upload-section .upload-area:hover .upload-icon {
    border-color: rgba(196, 87, 106, 0.35);
    transform: translateY(-2px);
}
.upload-section .upload-area .upload-text {
    color: var(--u-ink-2);
    font-weight: 500;
}
.upload-section .upload-area .upload-hint {
    color: var(--u-ink-4);
}
.upload-section .upload-area .upload-hint .browse,
.upload-section .upload-area .browse-link {
    color: var(--u-wine);
    font-weight: 600;
}

/* Uploading state */
.upload-section .upload-progress-text {
    color: var(--u-ink);
    font-weight: 600;
}
.upload-section .upload-progress-subtext {
    font-family: var(--u-mono);
    font-size: 11px;
    color: var(--u-ink-4);
}
.upload-section .upload-progress-bar {
    background: var(--u-paper);
    border-radius: 999px;
    overflow: hidden;
}
.upload-section .upload-progress-fill {
    background: linear-gradient(90deg, var(--u-salmon), var(--u-wine));
    border-radius: 999px;
}

/* Uploaded state: confident, quietly green */
.upload-section .upload-area.has-file {
    background: var(--u-sage-wash);
    border: 1.5px solid rgba(74, 124, 74, 0.35);
}
.upload-section .file-info .file-name {
    font-family: var(--u-mono);
    font-size: 12.5px;
    font-weight: 600;
    color: var(--u-ink);
}
.upload-section .file-info .file-size {
    font-family: var(--u-mono);
    font-size: 11px;
    color: var(--u-sage);
}
.upload-section .file-info .file-icon {
    background: #fff;
    color: var(--u-sage);
    border: 1px solid rgba(74, 124, 74, 0.3);
    border-radius: 50%;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.upload-section .file-info .remove-file {
    color: var(--u-ink-4);
    transition: color 0.2s ease;
}
.upload-section .file-info .remove-file:hover { color: #b04a3a; }

/* Toggle row */
.upload-section .no-transactions-toggle .toggle-label {
    color: var(--u-ink-3);
}

/* --- Upload summary footer ---------------------------------------------- */
.upload-section .upload-summary {
    background: var(--u-ivory);
    border-top: 1px solid var(--u-rule);
}
.upload-section .summary-stat .stat-value {
    font-family: var(--u-mono);
    font-variant-numeric: tabular-nums;
    color: var(--u-wine);
}
.upload-section .summary-stat .stat-label {
    font-family: var(--u-mono);
    font-size: 9.5px;
    letter-spacing: 0.12em;
    color: var(--u-ink-4);
}

/* --- Invoice tab ---------------------------------------------------------- */
/* Column cards: white with a top accent hairline instead of washed blocks */
.upload-section .invoice-column {
    background: #fffdfa;
    border: 1px solid var(--u-rule);
    border-radius: 8px;
    box-shadow: 0 14px 34px -30px rgba(39, 33, 28, 0.45);
    overflow: hidden;
}
.upload-section .invoice-column .column-header {
    background: transparent;
    border: none;
    border-bottom: 1px solid var(--u-rule);
    position: relative;
}
.upload-section .invoice-column .column-header::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
}
.upload-section .invoice-column.sales .column-header::before { background: var(--u-sage); }
.upload-section .invoice-column.purchase .column-header::before { background: #b04a3a; }

.upload-section .invoice-column .column-icon {
    border-radius: 50%;
    box-shadow: none;
}
.upload-section .invoice-column.sales .column-icon {
    background: var(--u-sage-wash);
    color: var(--u-sage);
    border: 1px solid rgba(74, 124, 74, 0.3);
}
.upload-section .invoice-column.purchase .column-icon {
    background: #f9ede9;
    color: #b04a3a;
    border: 1px solid rgba(176, 74, 58, 0.3);
}
.upload-section .invoice-column .column-title h4 {
    color: var(--u-ink);
    font-weight: 600;
}
.upload-section .invoice-column .column-hint {
    font-family: var(--u-mono);
    font-size: 10px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--u-ink-4);
}
.upload-section .invoice-column .column-count {
    font-family: var(--u-mono);
    font-variant-numeric: tabular-nums;
    background: var(--u-ivory);
    color: var(--u-ink-2);
    border: 1px solid var(--u-rule);
}

.upload-section .invoice-drop-zone,
.upload-section .invoice-column.sales .invoice-drop-zone,
.upload-section .invoice-column.purchase .invoice-drop-zone {
    background: var(--u-cream);
    border: 1.5px dashed var(--u-rule-strong);
    border-radius: 6px;
    transition: all 0.22s ease;
}
.upload-section .invoice-drop-zone:hover,
.upload-section .invoice-drop-zone.dragover,
.upload-section .invoice-column.sales .invoice-drop-zone:hover,
.upload-section .invoice-column.sales .invoice-drop-zone.dragover,
.upload-section .invoice-column.purchase .invoice-drop-zone:hover,
.upload-section .invoice-column.purchase .invoice-drop-zone.dragover {
    background: var(--u-wash);
    border-color: var(--u-salmon);
}
.upload-section .invoice-drop-zone .drop-icon {
    color: var(--u-wine);
}
.upload-section .invoice-drop-zone .drop-text { color: var(--u-ink-2); }
.upload-section .invoice-drop-zone .drop-hint {
    font-family: var(--u-mono);
    font-size: 10.5px;
    letter-spacing: 0.08em;
    color: var(--u-ink-4);
}
.upload-section .invoice-drop-zone .browse-link {
    color: var(--u-wine);
    font-weight: 600;
    text-decoration-color: rgba(154, 64, 84, 0.4);
}

/* Queue: give file name and status proper breathing room */
.upload-section .invoice-mini-queue {
    background: #fff;
    border: 1px solid var(--u-rule);
    border-radius: 6px;
}
.upload-section .mini-queue-list .queue-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 12px;
    border-bottom: 1px solid var(--u-rule);
}
.upload-section .mini-queue-list .queue-item:last-child { border-bottom: none; }
.upload-section .queue-item .queue-file-name {
    font-family: var(--u-mono);
    font-size: 12px;
    color: var(--u-ink-2);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.upload-section .queue-item .queue-status {
    font-family: var(--u-mono);
    font-size: 9.5px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 3px 9px;
    border-radius: 999px;
    flex-shrink: 0;
}
.upload-section .queue-item .queue-status.pending {
    background: var(--u-ivory);
    color: var(--u-ink-3);
    border: 1px solid var(--u-rule);
}

.upload-section .manual-entry-inline {
    border: 1px dashed var(--u-rule-strong);
    color: var(--u-ink-3);
    background: transparent;
    border-radius: 6px;
    transition: all 0.2s ease;
}
.upload-section .manual-entry-inline:hover {
    border-color: var(--u-salmon);
    color: var(--u-wine);
    background: var(--u-wash);
}

/* --- Merchant tab ---------------------------------------------------------- */
.upload-section .merchant-account-card {
    background: #fffdfa;
    border: 1px solid var(--u-rule);
    border-radius: 8px;
    box-shadow: 0 10px 26px -24px rgba(39, 33, 28, 0.45);
    cursor: pointer;
    transition: all 0.22s ease;
}
.upload-section .merchant-account-card:hover {
    border-color: var(--u-salmon);
    background: var(--u-wash);
    transform: translateY(-2px);
    box-shadow: 0 16px 32px -22px rgba(154, 64, 84, 0.4);
}
.upload-section .merchant-account-card-icon {
    background: var(--u-wash);
    color: var(--u-wine);
    border: 1px solid rgba(196, 87, 106, 0.22);
    border-radius: 50%;
    transition: all 0.22s ease;
}
.upload-section .merchant-account-card:hover .merchant-account-card-icon {
    background: var(--u-wine);
    color: #fff;
}
.upload-section .merchant-account-card-name {
    font-weight: 600;
    color: var(--u-ink);
}
.upload-section .merchant-account-card-detail {
    font-family: var(--u-mono);
    font-size: 11px;
    color: var(--u-ink-4);
}

/* =========================================================================
   UNIT 3 — TRANSACTION CODING PIPELINE
   ========================================================================= */

.tp-shell {
    background: #fffdfa;
    border: 1px solid var(--u-rule);
    box-shadow: 0 24px 60px -42px rgba(39, 33, 28, 0.35);
}

.tp-shell .tp-title {
    /* the incumbent rule in transaction-progress.css is !important throughout */
    font-family: var(--u-serif) !important;
    font-size: 20px !important;
    font-weight: 600 !important;
    letter-spacing: -0.01em !important;
    color: var(--u-ink);
}
.tp-shell .tp-subtitle { color: var(--u-ink-3); }
.tp-shell .tp-counter {
    font-family: var(--u-mono);
    font-variant-numeric: tabular-nums;
    color: var(--u-ink-2);
    background: var(--u-ivory);
    border: 1px solid var(--u-rule);
}
.tp-shell .tp-percentage {
    font-family: var(--u-mono);
    background: var(--u-wine);
    color: #fff;
}

/* Phase rail: lighter circles, hairline links; the wine is earned by state */
.tp-shell .tp-phase-circle {
    background: #fff;
    border: 1.5px solid var(--u-rule-strong);
    color: var(--u-ink-4);
    box-shadow: none;
    transition: all 0.3s ease;
}
.tp-shell .tp-phase-link {
    background: var(--u-rule);
    height: 1.5px;
}
.tp-shell .tp-phase-name {
    /* incumbent uses !important to beat animations.css — match it */
    font-family: var(--u-mono) !important;
    font-size: 9.5px !important;
    font-weight: 500 !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    color: var(--u-ink-4) !important;
}
.tp-shell .tp-phase.completed .tp-phase-circle {
    background: var(--u-sage-wash);
    border-color: rgba(74, 124, 74, 0.45);
    color: var(--u-sage);
}
.tp-shell .tp-phase.completed .tp-phase-link { background: rgba(74, 124, 74, 0.4); }
.tp-shell .tp-phase.completed .tp-phase-name { color: var(--u-sage) !important; }
.tp-shell .tp-phase.active .tp-phase-circle {
    background: var(--u-wine);
    border-color: var(--u-wine);
    color: #fff;
    box-shadow: 0 6px 16px -6px rgba(154, 64, 84, 0.55);
}
.tp-shell .tp-phase.active .tp-phase-name {
    color: var(--u-wine) !important;
    font-weight: 600 !important;
}

/* Bar: slimmer, calmer */
.tp-shell .tp-bar-track {
    background: var(--u-paper);
    border-radius: 999px;
}
.tp-shell .tp-bar-fill {
    background: linear-gradient(90deg, var(--u-salmon), var(--u-wine));
    border-radius: 999px;
}

/* Current phase: white card + salmon rail (mirror of the init "Now" card) */
.tp-shell .tp-current {
    background: #fff;
    border: 1px solid var(--u-rule);
    border-left: 3px solid var(--u-salmon);
    border-radius: 6px;
    box-shadow: 0 10px 26px -22px rgba(39, 33, 28, 0.4);
}
.tp-shell .tp-current-icon {
    background: var(--u-wash);
    color: var(--u-wine);
    border: 1px solid rgba(196, 87, 106, 0.2);
}
.tp-shell .tp-current-name { color: var(--u-ink); }
.tp-shell .tp-current-desc { color: var(--u-ink-3); }

/* Stat cards: quieter chrome, louder numerals */
.tp-shell .tp-stat {
    background: #fff;
    border: 1px solid var(--u-rule);
    border-radius: 6px;
    box-shadow: none;
    transition: border-color 0.25s ease, transform 0.25s ease;
}
.tp-shell .tp-stat:hover { border-color: var(--u-rule-strong); }
.tp-shell .tp-stat-icon {
    background: var(--u-ivory);
    color: var(--u-ink-3);
    border: 1px solid var(--u-rule);
    border-radius: 50%;
}
.tp-shell .tp-stat-value {
    font-family: var(--u-mono);
    font-variant-numeric: tabular-nums;
    color: var(--u-ink);
}
.tp-shell .tp-stat-label {
    font-family: var(--u-mono);
    font-size: 9px;
    letter-spacing: 0.12em;
    color: var(--u-ink-4);
}
/* Hero stat ("Remaining"): the one card allowed to speak in wine */
.tp-shell .tp-stat-hero {
    background: linear-gradient(160deg, #fff 0%, var(--u-wash) 100%);
    border: 1px solid rgba(196, 87, 106, 0.35);
}
.tp-shell .tp-stat-hero .tp-stat-icon {
    background: var(--u-wash);
    color: var(--u-wine);
    border-color: rgba(196, 87, 106, 0.25);
}
.tp-shell .tp-stat-hero .tp-stat-value { color: var(--u-wine); }
.tp-shell .tp-stat-hero .tp-stat-label { color: var(--u-wine); }

/* RiQ section + footer */
.tp-shell .riq-enhancement-section {
    background: var(--u-ivory);
    border: 1px solid var(--u-rule);
    border-radius: 6px;
}
.tp-shell .riq-label {
    font-family: var(--u-mono);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--u-wine);
}
.tp-shell .tp-footer {
    border-top: 1px solid var(--u-rule);
    color: var(--u-ink-4);
}
.tp-shell .tp-footer .tp-eta { color: var(--u-ink-3); }
.tp-shell .tp-velocity strong {
    font-family: var(--u-mono);
    color: var(--u-ink-2);
}