/* ==========================================================================
   Settle Up (web) — Settle Up, Payments, Insights, Recurring Splits and the
   Split Intelligence drawer. A port of the mobile Settle experience that uses
   the wider viewport: card lists instead of data grids, two-column layouts on
   desktop, and the same user (blue) / partner (amber) accent language.
   Tokens live on :root and are re-pointed for [data-bs-theme="dark"].
   ========================================================================== */

:root {
    --st-brand: var(--chipin-brand-primary, #5A45E6);
    --st-brand-2: var(--chipin-brand-accent, #7C6AF2);
    --st-brand-soft: color-mix(in srgb, var(--st-brand) 12%, transparent);
    --st-user: #2563EB;
    --st-user-soft: rgba(37, 99, 235, .12);
    --st-partner: #D97706;
    --st-partner-soft: rgba(217, 119, 6, .13);
    --st-pay: #16A34A;
    --st-pay-soft: rgba(22, 163, 74, .12);
    --st-danger: #DC2626;
    --st-surface: #ffffff;
    --st-surface-2: #f6f6fb;
    --st-surface-3: #eeeef8;
    --st-line: rgba(31, 36, 64, .09);
    --st-text: #1f2440;
    --st-muted: #6b7280;
    --st-shadow: 0 10px 30px rgba(31, 36, 64, .06);
    --st-shadow-lg: 0 -1.25rem 3.5rem rgba(15, 23, 42, .35);
    --st-radius: 18px;
    --st-radius-sm: 12px;
    --st-conf-high: #16A34A;
    --st-conf-high-bg: #DCFCE7;
    --st-conf-medium: #B45309;
    --st-conf-medium-bg: #FEF3C7;
    --st-conf-low: #565973;
    --st-conf-low-bg: #ECEAF6;
    --st-recurring-bg: #E8E5FF;
    --st-owner-bg: #DCFCE7;
}

[data-bs-theme="dark"] {
    --st-user: #60A5FA;
    --st-user-soft: rgba(96, 165, 250, .16);
    --st-partner: #FBBF24;
    --st-partner-soft: rgba(251, 191, 36, .16);
    --st-pay: #34D399;
    --st-pay-soft: rgba(52, 211, 153, .14);
    --st-danger: #F87171;
    --st-surface: #121728;
    --st-surface-2: #0f1424;
    --st-surface-3: #1a2036;
    --st-line: rgba(255, 255, 255, .08);
    --st-text: #f1f3f9;
    --st-muted: rgba(241, 243, 249, .62);
    --st-shadow: 0 10px 30px rgba(0, 0, 0, .35);
    --st-shadow-lg: 0 -1.25rem 3.5rem rgba(0, 0, 0, .6);
    --st-conf-high: #34D399;
    --st-conf-high-bg: #223A2B;
    --st-conf-medium: #F59E0B;
    --st-conf-medium-bg: #3A2E12;
    --st-conf-low: #EEEEEE;
    --st-conf-low-bg: #2B3045;
    --st-recurring-bg: #1F1A36;
    --st-owner-bg: #163224;
}

/* ------------------------------------------------------------------ shell */
.settle-page { color: var(--st-text); padding-bottom: 5rem; }
.settle-page .min-width-0, .settle-drawer .min-width-0, .admin-payment-sheet .min-width-0 { min-width: 0; }

.settle-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem 1.5rem;
    margin-bottom: 1.1rem;
}

.settle-head-copy { min-width: 0; max-width: 60ch; }

.settle-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--st-brand);
}

.settle-title { margin: .15rem 0 .25rem; font-size: 1.65rem; font-weight: 800; line-height: 1.15; }

.settle-desc { margin: 0; color: var(--st-muted); font-size: .95rem; line-height: 1.45; }

.settle-head-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; }

.settle-intel-btn {
    display: inline-flex;
    align-items: center;
    gap: .7rem;
    padding: .45rem 1rem .45rem .5rem;
    border: 0;
    border-radius: 999px;
    color: #fff;
    text-align: left;
    background: linear-gradient(135deg, var(--st-brand) 0%, var(--st-brand-2) 60%, #a78bfa 100%);
    box-shadow: 0 10px 24px color-mix(in srgb, var(--st-brand) 35%, transparent);
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}

.settle-intel-btn:hover:not(:disabled) { transform: translateY(-1px); box-shadow: 0 14px 30px color-mix(in srgb, var(--st-brand) 45%, transparent); filter: saturate(1.08); }
.settle-intel-btn:focus-visible { outline: 3px solid color-mix(in srgb, var(--st-brand) 45%, #fff); outline-offset: 2px; }
.settle-intel-btn:disabled { opacity: .55; cursor: not-allowed; }

.settle-intel-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, .18);
    font-size: 1.35rem;
    animation: settleIntelPulse 3.2s ease-in-out infinite;
}

.settle-intel-copy { display: grid; line-height: 1.1; }
.settle-intel-copy strong { font-size: .92rem; font-weight: 800; letter-spacing: .01em; }
.settle-intel-copy small { font-size: .7rem; opacity: .85; }

@keyframes settleIntelPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, .0); }
    50% { box-shadow: 0 0 0 6px rgba(255, 255, 255, .12); }
}

.settle-ghost-btn {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .55rem .9rem;
    border: 1px solid var(--st-line);
    border-radius: 999px;
    background: var(--st-surface);
    color: var(--st-text);
    font-size: .85rem;
    font-weight: 700;
    transition: border-color .15s ease, background .15s ease, color .15s ease;
}

.settle-ghost-btn:hover:not(:disabled) { border-color: var(--st-brand); color: var(--st-brand); background: var(--st-brand-soft); }
.settle-ghost-btn:disabled { opacity: .55; cursor: not-allowed; }
.settle-ghost-btn .bx-loader-alt { animation: settleSpin 1s linear infinite; }

@keyframes settleSpin { to { transform: rotate(360deg); } }

/* section tabs (Settle Up · Payments · Insights · Recurring Splits) */
.settle-tabs {
    display: flex;
    gap: .35rem;
    margin: 0 0 1.35rem;
    padding: .3rem;
    border-radius: 999px;
    background: var(--st-surface-3);
    overflow-x: auto;
    scrollbar-width: none;
    width: fit-content;
    max-width: 100%;
}

.settle-tabs::-webkit-scrollbar { display: none; }

.settle-tab {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    flex: 0 0 auto;
    padding: .55rem 1rem;
    border-radius: 999px;
    color: var(--st-muted);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    transition: background .15s ease, color .15s ease, box-shadow .15s ease;
}

.settle-tab i { font-size: 1.05rem; }
.settle-tab:hover { color: var(--st-text); }
.settle-tab.active { background: var(--st-surface); color: var(--st-brand); box-shadow: 0 4px 14px rgba(31, 36, 64, .08); }
[data-bs-theme="dark"] .settle-tab.active { box-shadow: 0 4px 14px rgba(0, 0, 0, .4); }

/* generic card */
.settle-card {
    border: 1px solid var(--st-line);
    border-radius: var(--st-radius);
    background: var(--st-surface);
    box-shadow: var(--st-shadow);
}

.settle-section-title {
    display: flex;
    align-items: center;
    gap: .6rem;
    margin: 0;
    font-size: .8rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--st-text);
}

.settle-section-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 12px;
    background: var(--st-brand-soft);
    color: var(--st-brand);
    font-size: 1.15rem;
}

.settle-section-desc { margin: .25rem 0 0; color: var(--st-muted); font-size: .86rem; line-height: 1.4; }

.settle-count-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.6rem;
    height: 1.6rem;
    padding: 0 .5rem;
    border-radius: 999px;
    background: var(--st-brand-soft);
    color: var(--st-brand);
    font-size: .78rem;
    font-weight: 800;
}

/* outline action buttons (PAY / ADJUST / REVERT / HISTORY ...) */
.settle-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    min-width: 5.25rem;
    padding: .55rem .9rem;
    border: 1.5px solid var(--st-line);
    border-radius: 14px;
    background: transparent;
    color: var(--st-text);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    white-space: nowrap;
    transition: background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease;
}

.settle-action:hover:not(:disabled) { transform: translateY(-1px); }
.settle-action:disabled { opacity: .5; cursor: not-allowed; }
.settle-action-pay { color: var(--st-pay); }
.settle-action-pay:hover:not(:disabled) { background: var(--st-pay-soft); border-color: var(--st-pay); }
.settle-action-brand { color: var(--st-brand); }
.settle-action-brand:hover:not(:disabled) { background: var(--st-brand-soft); border-color: var(--st-brand); }
.settle-action-danger { color: var(--st-danger); }
.settle-action-danger:hover:not(:disabled) { background: color-mix(in srgb, var(--st-danger) 12%, transparent); border-color: var(--st-danger); }
.settle-action-solid { background: var(--st-brand); border-color: var(--st-brand); color: #fff; }
.settle-action-solid:hover:not(:disabled) { background: var(--st-brand-2); border-color: var(--st-brand-2); }

/* avatars */
.settle-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 999px;
    overflow: hidden;
    background: var(--st-surface-2);
    color: #fff;
    font-weight: 800;
    font-size: 1rem;
    box-shadow: 0 0 0 2.5px var(--st-avatar-ring, transparent), 0 0 0 5px var(--st-surface);
}

.settle-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.settle-avatar-user { --st-avatar-ring: var(--st-user); }
.settle-avatar-partner { --st-avatar-ring: var(--st-partner); }
.settle-avatar-lg { width: 4.5rem; height: 4.5rem; font-size: 1.6rem; }
.settle-avatar-sm { width: 2.15rem; height: 2.15rem; font-size: .8rem; box-shadow: 0 0 0 2px var(--st-avatar-ring, transparent); }

/* merchant logos */
.settle-logo {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 3rem;
    height: 3rem;
    border-radius: 14px;
    overflow: hidden;
    background: var(--st-surface-2);
    color: #fff;
    font-weight: 800;
    font-size: 1.1rem;
}

.settle-logo img { width: 100%; height: 100%; object-fit: contain; background: #fff; display: block; }
.settle-logo-sm { width: 2.4rem; height: 2.4rem; border-radius: 11px; font-size: .95rem; }

/* ------------------------------------------------------------ Settle Up */
.settle-hero {
    position: relative;
    padding: 1.35rem 1.5rem 1.4rem;
    margin-bottom: 1.5rem;
    overflow: hidden;
}

.settle-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(60% 120% at 0% 0%, var(--st-user-soft), transparent 60%),
        radial-gradient(60% 120% at 100% 0%, var(--st-partner-soft), transparent 60%);
    pointer-events: none;
}

.settle-hero > * { position: relative; }

.settle-hero-label {
    margin-bottom: 1rem;
    text-align: center;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--st-muted);
}

.settle-hero-grid {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 1rem;
}

.settle-hero-side { display: grid; justify-items: center; gap: .3rem; text-align: center; }
.settle-hero-caption { font-size: .98rem; font-weight: 800; }
.settle-hero-user .settle-hero-caption { color: var(--st-user); }
.settle-hero-partner .settle-hero-caption { color: var(--st-partner); }
.settle-hero-amount { font-size: 1.9rem; font-weight: 900; letter-spacing: -.01em; line-height: 1.05; }
.settle-hero-count { font-size: .85rem; color: var(--st-muted); }

.settle-hero-center { display: grid; justify-items: center; gap: .35rem; text-align: center; padding: 0 1rem; }
.settle-hero-headline { font-size: 1.15rem; font-weight: 800; }
.settle-hero-sub { font-size: .82rem; color: var(--st-muted); }
.settle-hero-net {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .35rem .8rem;
    border-radius: 999px;
    background: var(--st-surface);
    border: 1px solid var(--st-line);
    font-size: .8rem;
    font-weight: 700;
}

.settle-hero-bar {
    display: flex;
    gap: .35rem;
    height: .7rem;
    margin: 1.25rem auto 0;
    max-width: 720px;
}

.settle-hero-bar span { display: block; height: 100%; min-width: .7rem; border-radius: 999px; transition: flex-grow .5s cubic-bezier(.2, .8, .2, 1); }
.settle-hero-bar-user { background: var(--st-user); }
.settle-hero-bar-partner { background: var(--st-partner); }
.settle-hero-hint { margin: .55rem 0 0; text-align: center; font-size: .74rem; color: var(--st-muted); }

@media (max-width: 767.98px) {
    .settle-hero-grid { grid-template-columns: 1fr 1fr; }
    .settle-hero-center { grid-column: 1 / -1; order: 3; padding: .5rem 0 0; }
    .settle-hero-amount { font-size: 1.5rem; }
}

.settle-columns { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media (min-width: 1200px) { .settle-columns { grid-template-columns: 1fr 1fr; align-items: start; } }

.settle-group { padding: 1.1rem 1.15rem 1.15rem; }
.settle-group-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: .9rem; }
.settle-group-head .settle-count-pill { margin-left: .4rem; }
.settle-group-actions { display: flex; align-items: center; gap: .5rem; flex: 0 0 auto; }

.settle-list { display: grid; gap: .65rem; }

.settle-split-card {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap: .85rem;
    padding: .8rem .9rem .8rem 1.05rem;
    border: 1px solid var(--st-line);
    border-radius: var(--st-radius-sm);
    background: var(--st-surface);
    transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.settle-split-card::before {
    content: "";
    position: absolute;
    left: 0;
    top: .7rem;
    bottom: .7rem;
    width: 4px;
    border-radius: 0 4px 4px 0;
    background: var(--st-card-accent, var(--st-user));
}

.settle-split-card.is-selecting { grid-template-columns: auto auto minmax(0, 1fr) auto auto; }
.settle-split-card.is-partner { --st-card-accent: var(--st-partner); }
.settle-split-card.is-user { --st-card-accent: var(--st-user); }
.settle-split-card.is-selected { border-color: var(--st-pay); background: var(--st-pay-soft); }
.settle-split-card.is-clickable:hover { border-color: color-mix(in srgb, var(--st-brand) 45%, var(--st-line)); box-shadow: 0 6px 18px rgba(31, 36, 64, .07); }

.settle-split-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.35rem;
    height: 1.35rem;
    border: 2px solid var(--st-line);
    border-radius: 7px;
    background: var(--st-surface);
    color: #fff;
    font-size: .95rem;
    transition: background .15s ease, border-color .15s ease;
}

.settle-split-check.is-on { background: var(--st-pay); border-color: var(--st-pay); }
.settle-split-check:focus-visible { outline: 2px solid var(--st-pay); outline-offset: 2px; }

.settle-split-body { min-width: 0; display: grid; gap: .12rem; text-align: left; background: none; border: 0; padding: 0; color: inherit; }
.settle-split-name { font-size: 1rem; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.settle-split-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; font-size: .82rem; color: var(--st-muted); }
.settle-ratio-chip {
    display: inline-flex;
    align-items: center;
    padding: .05rem .45rem;
    border-radius: 999px;
    background: var(--st-surface-3);
    color: var(--st-text);
    font-size: .72rem;
    font-weight: 800;
}
.settle-split-status { font-size: .78rem; color: var(--st-muted); }
.settle-split-amount { font-size: 1.15rem; font-weight: 900; white-space: nowrap; text-align: right; }
.settle-split-notes { font-size: .76rem; color: var(--st-muted); font-style: italic; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

@media (max-width: 575.98px) {
    .settle-split-card,
    .settle-split-card.is-selecting {
        grid-template-columns: auto minmax(0, 1fr) auto;
        grid-template-areas: "logo body amount" "check action action";
        row-gap: .55rem;
        padding: .75rem .8rem .75rem .95rem;
    }
    .settle-split-check { grid-area: check; align-self: center; }
    .settle-split-logo { grid-area: logo; align-self: start; }
    .settle-split-body { grid-area: body; }
    .settle-split-name { white-space: normal; line-height: 1.2; }
    .settle-split-amount { grid-area: amount; align-self: start; font-size: 1.05rem; }
    .settle-split-action { grid-area: action; justify-self: end; }
}

/* sticky batch bar */
.settle-select-bar {
    position: fixed;
    left: 50%;
    bottom: 1.25rem;
    z-index: 1080;
    display: flex;
    align-items: center;
    gap: .9rem;
    max-width: calc(100vw - 2rem);
    padding: .65rem .75rem .65rem 1.1rem;
    border-radius: 999px;
    background: var(--st-text);
    color: var(--st-surface);
    box-shadow: 0 18px 40px rgba(15, 23, 42, .35);
    transform: translateX(-50%);
    animation: settleRise .25s cubic-bezier(.2, .8, .2, 1);
}

[data-bs-theme="dark"] .settle-select-bar { background: #f1f3f9; color: #1f2440; }
.settle-select-bar strong { font-size: .95rem; }
.settle-select-bar small { display: block; font-size: .74rem; opacity: .75; }
.settle-select-bar .settle-action-pay { background: var(--st-pay); border-color: var(--st-pay); color: #fff; }
.settle-select-bar .settle-action-pay:hover:not(:disabled) { filter: brightness(1.08); }
.settle-select-bar .settle-select-cancel { border: 0; background: transparent; color: inherit; opacity: .8; font-weight: 700; }

@keyframes settleRise { from { opacity: 0; transform: translate(-50%, 1rem); } to { opacity: 1; transform: translate(-50%, 0); } }

/* empty / states */
.settle-empty {
    display: grid;
    justify-items: center;
    gap: .5rem;
    padding: 2.25rem 1rem;
    text-align: center;
    color: var(--st-muted);
    border: 1px dashed var(--st-line);
    border-radius: var(--st-radius-sm);
}

.settle-empty i { font-size: 2.2rem; color: var(--st-brand); opacity: .8; }
.settle-empty strong { color: var(--st-text); font-size: 1rem; }
.settle-empty p { margin: 0; max-width: 46ch; font-size: .88rem; }

.settle-state {
    display: grid;
    justify-items: center;
    gap: .75rem;
    padding: 3rem 1.5rem;
    text-align: center;
}

.settle-state-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 4.25rem;
    height: 4.25rem;
    border-radius: 999px;
    background: var(--st-brand-soft);
    color: var(--st-brand);
    font-size: 2rem;
}

.settle-state h2 { margin: 0; font-size: 1.25rem; font-weight: 800; }
.settle-state p { margin: 0; max-width: 52ch; color: var(--st-muted); }

/* toast */
.settle-toast {
    position: fixed;
    left: 50%;
    bottom: 1.25rem;
    z-index: 1100;
    display: flex;
    align-items: center;
    gap: .65rem;
    max-width: min(560px, calc(100vw - 2rem));
    padding: .8rem 1.1rem;
    border-radius: 16px;
    background: var(--st-text);
    color: var(--st-surface);
    box-shadow: 0 18px 40px rgba(15, 23, 42, .35);
    transform: translateX(-50%);
    animation: settleRise .25s cubic-bezier(.2, .8, .2, 1);
    font-size: .9rem;
    font-weight: 600;
}

[data-bs-theme="dark"] .settle-toast { background: #f1f3f9; color: #1f2440; }
.settle-toast i { font-size: 1.3rem; }
.settle-toast.is-success i { color: var(--st-pay); }
.settle-toast.is-error i { color: var(--st-danger); }
.settle-toast button { margin-left: .25rem; border: 0; background: transparent; color: inherit; opacity: .7; font-size: 1.2rem; line-height: 1; }

/* ---------------------------------------------------------- Payment sheet */
.admin-payment-sheet-backdrop {
    position: fixed;
    inset: 0;
    z-index: 10990;
    background: rgba(15, 23, 42, .36);
    backdrop-filter: blur(5px);
    animation: adminPaymentBackdropIn .18s ease-out;
}

.admin-payment-sheet {
    position: fixed;
    left: 50%;
    bottom: 0;
    z-index: 11000;
    width: min(680px, calc(100vw - 1rem));
    max-height: 92vh;
    overflow-y: auto;
    transform: translateX(-50%);
    padding: .75rem 1.1rem 1.2rem;
    border-radius: 26px 26px 0 0;
    background: var(--bs-body-bg, #fff);
    color: var(--bs-body-color, #212529);
    border: 1px solid var(--bs-border-color-translucent, rgba(0, 0, 0, .12));
    box-shadow: 0 -18px 48px rgba(15, 23, 42, .22);
    animation: adminPaymentSheetIn .26s cubic-bezier(.2, .8, .2, 1);
}

.admin-payment-sheet-grabber {
    width: 5rem;
    height: .35rem;
    margin: 0 auto .9rem;
    border-radius: 999px;
    background: var(--bs-secondary-color, rgba(100, 116, 139, .55));
    opacity: .5;
}

.admin-payment-sheet-header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: .85rem;
    margin-bottom: 1rem;
}

.admin-payment-sheet-icon,
.admin-payment-option-icon { display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; }

.admin-payment-sheet-icon { width: 3rem; height: 3rem; background: var(--st-brand-soft); color: var(--st-brand); font-size: 1.45rem; }
.admin-payment-sheet-kicker { font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--st-brand); }
.admin-payment-sheet-title { font-weight: 900; font-size: 1.2rem; }
.admin-payment-sheet-subtitle, .admin-payment-sheet-disclaimer, .admin-payment-option small { color: var(--bs-secondary-color, #6c757d); }
.admin-payment-sheet-close { border: 0; background: transparent; color: inherit; font-size: 1.45rem; line-height: 1; }

.admin-payment-sheet-batch {
    display: grid;
    gap: .35rem;
    margin: 0 0 1rem;
    padding: .7rem .85rem;
    border-radius: 14px;
    background: var(--st-surface-2);
    font-size: .84rem;
}

.admin-payment-sheet-batch-row { display: flex; justify-content: space-between; gap: 1rem; }
.admin-payment-sheet-batch-row span:first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-payment-sheet-batch-row strong { white-space: nowrap; }
.admin-payment-sheet-batch-more { color: var(--st-muted); font-size: .78rem; }

.admin-payment-sheet-options { display: grid; gap: .65rem; }
@media (min-width: 576px) { .admin-payment-sheet-options { grid-template-columns: 1fr 1fr; } }

.admin-payment-option {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: .85rem;
    align-items: center;
    width: 100%;
    padding: .85rem;
    border: 1px solid var(--bs-border-color-translucent, rgba(0, 0, 0, .08));
    border-radius: 18px;
    background: var(--bs-tertiary-bg, rgba(148, 163, 184, .1));
    color: inherit;
    text-align: left;
    transition: transform .18s ease, border-color .18s ease, background-color .18s ease;
}

.admin-payment-option:hover:not(:disabled) { transform: translateY(-1px); border-color: color-mix(in srgb, var(--st-brand) 40%, transparent); background: var(--st-brand-soft); }
.admin-payment-option:disabled { opacity: .58; cursor: not-allowed; }
.admin-payment-option-icon { width: 2.65rem; height: 2.65rem; font-size: 1.3rem; }
.admin-payment-option-venmo { background: rgba(61, 149, 206, .16); color: #3d95ce; }
.admin-payment-option-cashapp { background: rgba(0, 214, 64, .16); color: #00b843; }
.admin-payment-option-cash { background: var(--st-pay-soft); color: var(--st-pay); }
.admin-payment-option-check { background: var(--st-brand-soft); color: var(--st-brand); }
.admin-payment-option-other { background: var(--st-brand-soft); color: var(--st-brand); }
.admin-payment-option span:last-child { display: grid; gap: .1rem; }
.admin-payment-option small { font-size: .76rem; line-height: 1.3; }
.admin-payment-option-link { font-size: .7rem; color: var(--st-brand); font-weight: 700; }
.admin-payment-sheet-disclaimer { margin: 1rem .25rem 0; font-size: .8rem; line-height: 1.4; }

[data-bs-theme="dark"] .admin-payment-sheet { background: var(--bs-tertiary-bg, #1c2230); color: var(--bs-body-color, #e6e9ef); border-color: var(--bs-border-color-translucent, rgba(255, 255, 255, .08)); box-shadow: 0 -18px 48px rgba(0, 0, 0, .48); }
[data-bs-theme="dark"] .admin-payment-option { border-color: rgba(255, 255, 255, .08); background: rgba(15, 23, 42, .42); }

@keyframes adminPaymentBackdropIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes adminPaymentSheetIn { from { opacity: 0; transform: translate(-50%, 1.5rem); } to { opacity: 1; transform: translate(-50%, 0); } }

/* -------------------------------------------------------- confirm toast */
.admin-revert-payment-toast { position: fixed; inset: auto 1.5rem 1.5rem auto; z-index: 11000; max-width: min(420px, calc(100vw - 2rem)); }

.admin-revert-payment-toast-card {
    position: relative;
    display: grid;
    gap: .85rem;
    padding: 1rem;
    border-radius: 18px;
    background: var(--bs-body-bg, #fff);
    color: var(--bs-body-color, #212529);
    border: 1px solid var(--bs-border-color-translucent, rgba(0, 0, 0, .12));
    box-shadow: 0 18px 48px rgba(0, 0, 0, .2);
}

.admin-revert-payment-toast-close { position: absolute; top: .55rem; right: .55rem; border: 0; background: transparent; color: inherit; font-size: 1.25rem; line-height: 1; }
.admin-revert-payment-toast-title { padding-right: 2rem; font-weight: 800; }
.admin-revert-payment-toast-message { color: var(--bs-secondary-color, #6c757d); }
.admin-revert-payment-toast-actions { display: flex; justify-content: flex-end; gap: .5rem; }

[data-bs-theme="dark"] .admin-revert-payment-toast-card { background: var(--bs-tertiary-bg, #1c2230); color: var(--bs-body-color, #e6e9ef); border-color: var(--bs-border-color-translucent, rgba(255, 255, 255, .08)); box-shadow: 0 18px 48px rgba(0, 0, 0, .45); }

/* ------------------------------------------------------------- Payments */
.settle-rail-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; margin-bottom: 1.25rem; }
@media (min-width: 768px) { .settle-rail-tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.settle-rail-tile {
    position: relative;
    display: grid;
    gap: .15rem;
    padding: .9rem 1rem .9rem 1.15rem;
    overflow: hidden;
    text-align: left;
    border: 1px solid var(--st-line);
    border-radius: var(--st-radius-sm);
    background: var(--st-surface);
    color: var(--st-text);
    box-shadow: var(--st-shadow);
    transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease;
}

.settle-rail-tile { --st-rail: var(--st-brand); }
.settle-rail-tile-venmo { --st-rail: #3d95ce; }
.settle-rail-tile-cashapp { --st-rail: #00b843; }
.settle-rail-tile-cash { --st-rail: var(--st-pay); }
.settle-rail-tile-check { --st-rail: var(--st-brand); }
.settle-rail-tile::before { content: ""; position: absolute; left: 0; top: .8rem; bottom: .8rem; width: 4px; border-radius: 0 4px 4px 0; background: var(--st-rail); }
.settle-rail-tile > i { position: absolute; right: -.35rem; top: 50%; transform: translateY(-50%) rotate(-8deg); font-size: 4.2rem; color: var(--st-rail); opacity: .14; pointer-events: none; }
.settle-rail-tile:hover { transform: translateY(-1px); border-color: color-mix(in srgb, var(--st-brand) 40%, var(--st-line)); }
.settle-rail-tile.is-active { border-color: var(--st-brand); box-shadow: 0 0 0 3px var(--st-brand-soft); }
.settle-rail-tile-label { font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--st-muted); }
.settle-rail-tile-amount { font-size: 1.35rem; font-weight: 900; line-height: 1.1; }
.settle-rail-tile-count { font-size: .8rem; color: var(--st-muted); }
.settle-rail-tile-filter { position: absolute; right: .6rem; top: .55rem; font-size: .66rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--st-brand); }

.settle-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin-bottom: 1rem; }
.settle-search { position: relative; flex: 1 1 260px; max-width: 520px; }
.settle-search i { position: absolute; left: .95rem; top: 50%; transform: translateY(-50%); font-size: 1.2rem; color: var(--st-muted); }
.settle-search input {
    width: 100%;
    padding: .7rem 1rem .7rem 2.75rem;
    border: 1px solid var(--st-line);
    border-radius: 999px;
    background: var(--st-surface);
    color: var(--st-text);
    font-size: .95rem;
}
.settle-search input:focus { outline: none; border-color: var(--st-brand); box-shadow: 0 0 0 3px var(--st-brand-soft); }
.settle-search input::placeholder { color: var(--st-muted); }
.settle-scope { font-size: .86rem; color: var(--st-muted); }
.settle-link-btn { border: 0; background: transparent; color: var(--st-brand); font-weight: 700; font-size: .86rem; padding: 0; }

.settle-month { margin: 1.15rem 0 .55rem; font-size: .78rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--st-muted); }
.settle-month:first-of-type { margin-top: .25rem; }

.settle-month-list { display: grid; gap: .6rem; }
@media (min-width: 1200px) { .settle-month-list { grid-template-columns: 1fr 1fr; } }

.settle-payment-row {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap: .9rem;
    padding: .75rem .9rem .75rem 1.05rem;
    border: 1px solid var(--st-line);
    border-radius: var(--st-radius-sm);
    background: var(--st-surface);
    transition: border-color .15s ease, box-shadow .15s ease;
}

.settle-payment-row::before { content: ""; position: absolute; left: 0; top: .7rem; bottom: .7rem; width: 4px; border-radius: 0 4px 4px 0; background: var(--st-row-accent, var(--st-user)); }
.settle-payment-row.is-you { --st-row-accent: var(--st-user); }
.settle-payment-row.is-them { --st-row-accent: var(--st-partner); }
.settle-payment-row.is-clickable:hover { border-color: color-mix(in srgb, var(--st-brand) 45%, var(--st-line)); box-shadow: 0 6px 18px rgba(31, 36, 64, .07); }
.settle-payment-row .settle-avatar { --st-avatar-ring: var(--st-row-accent); width: 2.6rem; height: 2.6rem; box-shadow: 0 0 0 2px var(--st-avatar-ring); }
.settle-payment-body { min-width: 0; display: grid; gap: .1rem; text-align: left; background: none; border: 0; padding: 0; color: inherit; }
.settle-payment-name { font-size: 1rem; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.settle-payment-caption { font-size: .82rem; color: var(--st-muted); }
.settle-payment-caption .bx { vertical-align: -.1em; margin-right: .15rem; }
.settle-payment-amount { font-size: 1.15rem; font-weight: 900; white-space: nowrap; }
.settle-payment-lock { color: var(--st-muted); font-size: 1.1rem; }

@media (max-width: 575.98px) {
    .settle-payment-row { grid-template-columns: auto minmax(0, 1fr) auto; }
    .settle-payment-amount { grid-column: 2; font-size: 1rem; }
    .settle-payment-row .settle-action { grid-column: 3; grid-row: 1 / span 2; }
}

.settle-load-more { display: flex; justify-content: center; margin-top: 1rem; }

/* -------------------------------------------------------------- Insights */
.settle-range-chips { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.settle-chip {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .5rem .95rem;
    border: 1px solid transparent;
    border-radius: 999px;
    background: var(--st-surface-3);
    color: var(--st-text);
    font-size: .86rem;
    font-weight: 700;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.settle-chip:hover { border-color: var(--st-brand); }
.settle-chip.is-active { background: var(--st-brand-soft); color: var(--st-brand); border-color: color-mix(in srgb, var(--st-brand) 35%, transparent); }
.settle-chip-icon { padding: .5rem .65rem; }
.settle-chip-icon i { font-size: 1.1rem; }
.settle-custom-range { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.settle-custom-range input { padding: .45rem .7rem; border: 1px solid var(--st-line); border-radius: 10px; background: var(--st-surface); color: var(--st-text); font-size: .86rem; }
.settle-custom-range input:focus { outline: none; border-color: var(--st-brand); box-shadow: 0 0 0 3px var(--st-brand-soft); }

.settle-kpi-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; margin: 1.1rem 0 1.4rem; }
@media (min-width: 992px) { .settle-kpi-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.settle-kpi { position: relative; display: grid; gap: .2rem; padding: 1rem 1.1rem; overflow: hidden; min-height: 6.4rem; }
.settle-kpi > i { position: absolute; right: -.4rem; bottom: -.5rem; font-size: 4.6rem; color: var(--st-brand); opacity: .1; transform: rotate(-8deg); pointer-events: none; }
.settle-kpi-label { font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--st-muted); }
.settle-kpi-value { font-size: 1.55rem; font-weight: 900; line-height: 1.1; }
.settle-kpi-sub { font-size: .78rem; color: var(--st-muted); }
.settle-kpi-value.is-pay { color: var(--st-pay); }
.settle-kpi-value.is-partner { color: var(--st-partner); }

.settle-chart-grid { display: grid; grid-template-columns: 1fr; gap: 1.25rem; }
@media (min-width: 1200px) { .settle-chart-grid { grid-template-columns: 1fr 1fr; } .settle-chart-grid .settle-chart-wide { grid-column: 1 / -1; } }
.settle-chart-card { padding: 1rem 1.1rem 1.1rem; }
.settle-chart-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .75rem; }
.settle-chart-legend { display: flex; flex-wrap: wrap; gap: .9rem; font-size: .8rem; color: var(--st-muted); }
.settle-chart-legend span::before { content: ""; display: inline-block; width: .65rem; height: .65rem; margin-right: .35rem; border-radius: 999px; background: var(--st-legend, var(--st-brand)); vertical-align: -.02em; }
.settle-chart-legend .is-user { --st-legend: var(--st-user); }
.settle-chart-legend .is-partner { --st-legend: var(--st-partner); }
.settle-chart-empty { display: grid; place-items: center; min-height: 220px; color: var(--st-muted); font-size: .9rem; text-align: center; padding: 1rem; }

/* ----------------------------------------------------- Recurring Splits */
.settle-intro {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 1.1rem;
    padding: 1.15rem 1.25rem;
    margin-bottom: 1.35rem;
    background: var(--st-surface-2);
    border: 1px solid var(--st-line);
    border-radius: var(--st-radius);
}
.settle-intro-icon { display: inline-flex; align-items: center; justify-content: center; width: 3.6rem; height: 3.6rem; border-radius: 16px; background: var(--st-brand-soft); color: var(--st-brand); font-size: 1.7rem; }
.settle-intro h2 { margin: 0 0 .25rem; font-size: 1.25rem; font-weight: 800; }
.settle-intro p { margin: 0; color: var(--st-muted); font-size: .92rem; line-height: 1.45; }

.settle-rule-groups { display: grid; gap: 1.5rem; }
@media (min-width: 1400px) { .settle-rule-groups.has-both { grid-template-columns: 1fr 1fr; align-items: start; } }
.settle-rule-group-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .75rem; }
.settle-rule-group-head h3 { margin: 0; font-size: 1.15rem; font-weight: 800; }
.settle-rule-list { display: grid; gap: .8rem; }
@media (min-width: 768px) { .settle-rule-list.is-wide { grid-template-columns: 1fr 1fr; } }

.settle-rule { padding: 1rem 1.05rem; border: 1.5px solid color-mix(in srgb, var(--st-brand) 22%, var(--st-line)); }
.settle-rule.is-disabled { border-color: var(--st-line); opacity: .88; }
.settle-rule-head { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .85rem; margin-bottom: .7rem; }
.settle-rule-name { font-size: 1.05rem; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.settle-rule-freq { font-size: .82rem; color: var(--st-muted); }
.settle-status-pill { display: inline-flex; align-items: center; padding: .35rem .75rem; border-radius: 10px; font-size: .8rem; font-weight: 800; background: var(--st-brand-soft); color: var(--st-brand); }
.settle-status-pill.is-off { background: var(--st-surface-3); color: var(--st-muted); }
.settle-rule-split { font-size: .95rem; font-weight: 800; margin-bottom: .5rem; }
.settle-rule-split .is-user { color: var(--st-user); }
.settle-rule-split .is-partner { color: var(--st-partner); }
.settle-rule-split .dot { margin: 0 .35rem; color: var(--st-muted); }
.settle-rule-line { font-size: .84rem; color: var(--st-muted); margin-bottom: .2rem; }
.settle-rule-line.is-account { text-transform: uppercase; letter-spacing: .04em; font-size: .78rem; }
.settle-rule-counts { display: flex; justify-content: space-between; gap: 1rem; margin: .25rem 0 .2rem; font-size: .88rem; }
.settle-rule-counts strong { font-weight: 800; }
.settle-rule-role { font-size: .8rem; font-weight: 700; color: var(--st-partner); margin-top: .25rem; }
.settle-rule-role.is-owner { color: var(--st-pay); }
.settle-rule-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .85rem; }
.settle-rule-working { display: inline-flex; align-items: center; gap: .35rem; font-size: .8rem; color: var(--st-muted); }

/* percentage editor (inside the generic sheet) */
.settle-percent-editor { display: grid; gap: 1rem; }
.settle-percent-readout { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.settle-percent-readout div { padding: .8rem .9rem; border-radius: 14px; background: var(--st-surface-2); border: 1px solid var(--st-line); }
.settle-percent-readout small { display: block; font-size: .72rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--st-muted); }
.settle-percent-readout strong { font-size: 1.35rem; font-weight: 900; }
.settle-percent-readout .is-user strong { color: var(--st-user); }
.settle-percent-readout .is-partner strong { color: var(--st-partner); }
.settle-percent-slider { width: 100%; accent-color: var(--st-brand); }
.settle-percent-input { display: flex; align-items: center; gap: .5rem; }
.settle-percent-input input { width: 6rem; padding: .5rem .7rem; border: 1px solid var(--st-line); border-radius: 10px; background: var(--st-surface); color: var(--st-text); font-weight: 800; }
.settle-sheet-actions { display: flex; justify-content: flex-end; gap: .5rem; margin-top: .5rem; }

/* history rows */
.settle-history-row { display: grid; gap: .15rem; padding: .85rem .95rem; border: 1px solid var(--st-line); border-radius: var(--st-radius-sm); background: var(--st-surface); margin-bottom: .6rem; }
.settle-history-top { display: flex; justify-content: space-between; gap: 1rem; font-weight: 800; }
.settle-history-row small { color: var(--st-muted); font-size: .82rem; }
.settle-history-row .is-overridden { color: var(--st-partner); font-weight: 700; }

/* ------------------------------------------------------ generic sheet */
.settle-drawer-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1090;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    background: rgba(15, 23, 42, .45);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    animation: settleFade .2s ease-out;
}

.settle-drawer {
    position: relative;
    width: 100%;
    max-width: 720px;
    max-height: 88vh;
    overflow-y: auto;
    padding: .75rem 1.5rem 1.75rem;
    border-radius: 22px 22px 0 0;
    background: var(--bs-body-bg, #fff);
    color: var(--st-text);
    box-shadow: var(--st-shadow-lg);
    animation: settleSlideUp .28s cubic-bezier(.16, .84, .44, 1);
}

.settle-drawer-xl { max-width: 1120px; max-height: 92vh; }
[data-bs-theme="dark"] .settle-drawer { background: #141a2a; }
.settle-drawer-grip { width: 42px; height: 4px; margin: 0 auto .85rem; border-radius: 999px; background: color-mix(in srgb, var(--st-text) 18%, transparent); }
.settle-drawer-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding-bottom: .9rem; margin-bottom: 1rem; border-bottom: 1px solid var(--st-line); }
.settle-drawer-eyebrow { display: inline-flex; align-items: center; gap: .35rem; font-size: .72rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--st-brand); }
.settle-drawer-title { margin: .15rem 0 .1rem; font-size: 1.4rem; font-weight: 800; line-height: 1.15; }
.settle-drawer-sub { margin: 0; font-size: .86rem; color: var(--st-muted); }
.settle-drawer-close {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border: 0;
    border-radius: 999px;
    background: color-mix(in srgb, var(--st-text) 7%, transparent);
    color: var(--st-text);
    font-size: 1.7rem;
    line-height: 1;
    transition: background .15s ease, color .15s ease, transform .15s ease;
}
.settle-drawer-close:hover, .settle-drawer-close:focus-visible { background: var(--st-brand); color: #fff; transform: scale(1.05); }

@keyframes settleFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes settleSlideUp { from { transform: translateY(2.5rem); opacity: 0; } to { transform: translateY(0); opacity: 1; } }

/* ----------------------------------------------- Split Intelligence */
.si-progress { display: grid; gap: .7rem; padding: 1.25rem 0 .5rem; }
.si-progress-stage { font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--st-brand); }
.si-progress-message { font-size: 1.15rem; font-weight: 800; }
.si-progress-details { font-size: .86rem; color: var(--st-muted); }
.si-progress-bar { position: relative; height: .55rem; border-radius: 999px; background: var(--st-surface-3); overflow: hidden; }
.si-progress-bar span { position: absolute; inset: 0 auto 0 0; width: var(--si-progress, 5%); border-radius: 999px; background: linear-gradient(90deg, var(--st-brand), var(--st-brand-2)); transition: width .5s ease; }
.si-progress-bar.is-indeterminate span { width: 35%; animation: siIndeterminate 1.4s ease-in-out infinite; }
@keyframes siIndeterminate { 0% { left: -35%; } 100% { left: 100%; } }
.si-progress-note { display: flex; align-items: center; gap: .4rem; font-size: .8rem; color: var(--st-partner); }
.si-progress-actions { display: flex; gap: .5rem; }
.si-skeleton { display: grid; gap: .8rem; margin-top: 1rem; }
.si-skeleton span { display: block; height: 4.6rem; border-radius: 14px; background: linear-gradient(90deg, var(--st-surface-3) 25%, var(--st-surface-2) 37%, var(--st-surface-3) 63%); background-size: 400% 100%; animation: siShimmer 1.4s ease infinite; }
@keyframes siShimmer { 0% { background-position: 100% 50%; } 100% { background-position: 0 50%; } }

.si-hero { display: grid; gap: .6rem; padding: 1.1rem 1.25rem 1.2rem; margin-bottom: 1rem; }
.si-hero-top { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 1rem; }
.si-hero-headline { margin: 0; text-align: center; font-size: 1.35rem; font-weight: 800; line-height: 1.2; }
.si-hero-caption { text-align: center; font-size: .86rem; color: var(--st-muted); margin: 0; }
.si-coverage { display: flex; justify-content: space-between; gap: 1rem; font-size: .9rem; font-weight: 800; }
.si-coverage .is-user { color: var(--st-user); }
.si-coverage .is-partner { color: var(--st-partner); text-align: right; }
.si-coverage-bar { display: flex; gap: .35rem; height: .65rem; }
.si-coverage-bar span { display: block; height: 100%; min-width: .65rem; border-radius: 999px; transition: flex-grow .5s cubic-bezier(.2, .8, .2, 1); }
.si-coverage-bar .is-user { background: var(--st-user); }
.si-coverage-bar .is-partner { background: var(--st-partner); }

.si-columns { display: grid; grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 992px) { .si-columns { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: start; } }

.si-panel { padding: 1rem 1.15rem; }
.si-panel-label { font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--st-muted); margin-bottom: .4rem; }
.si-html { font-size: .9rem; line-height: 1.5; color: var(--st-text); }
.si-html h3, .si-html h4 { font-size: 1rem; font-weight: 800; margin: 0 0 .4rem; }
.si-html p { margin: 0 0 .6rem; }
.si-html p:last-child, .si-html ul:last-child, .si-html ol:last-child { margin-bottom: 0; }
.si-html ul, .si-html ol { margin: 0 0 .6rem 1.15rem; padding: 0; }
.si-html li { margin-bottom: .3rem; color: var(--st-muted); }
.si-html strong, .si-html em { color: var(--st-text); }
.si-expander { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0; border: 0; background: transparent; color: var(--st-text); font-size: .8rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.si-expander i { font-size: 1.35rem; transition: transform .2s ease; }
.si-expander.is-open i { transform: rotate(180deg); }
.si-expander-body { margin-top: .75rem; }

.si-list-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin: .25rem 0 .75rem; }
.si-list { display: grid; gap: .8rem; }
@media (min-width: 1600px) { .si-list.is-wide { grid-template-columns: 1fr 1fr; } }

.si-reco { position: relative; padding: 1rem 1.05rem; border: 1.5px solid color-mix(in srgb, var(--st-brand) 20%, var(--st-line)); overflow: hidden; }
.si-reco::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4.5rem; background: linear-gradient(90deg, var(--st-brand-soft), transparent); pointer-events: none; }
.si-reco.is-partner-owned::before { background: linear-gradient(90deg, var(--st-partner-soft), transparent); }
.si-reco > * { position: relative; }
.si-reco-top { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; gap: .8rem; }
.si-reco-name { font-size: 1.05rem; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.si-reco-amount { font-size: 1.15rem; font-weight: 900; white-space: nowrap; }
.si-reco-evidence { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; margin-top: .35rem; font-size: .8rem; color: var(--st-muted); }
.si-conf { display: inline-flex; align-items: center; padding: .12rem .55rem; border-radius: 999px; font-size: .66rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.si-conf-high { background: var(--st-conf-high-bg); color: var(--st-conf-high); }
.si-conf-medium { background: var(--st-conf-medium-bg); color: var(--st-conf-medium); }
.si-conf-low { background: var(--st-conf-low-bg); color: var(--st-conf-low); }
.si-tag { display: inline-flex; align-items: center; gap: .3rem; padding: .12rem .55rem; border-radius: 999px; font-size: .68rem; font-weight: 800; }
.si-tag-recurring { background: var(--st-recurring-bg); color: var(--st-brand); }
.si-tag-owner { background: var(--st-owner-bg); color: var(--st-conf-high); }
.si-reco-pattern { margin: .55rem 0 .15rem; font-size: .9rem; }
.si-reco-ratio { font-size: .9rem; font-weight: 700; color: var(--st-brand); }
.si-reco-shares { display: grid; gap: .1rem; margin-top: .35rem; font-size: .92rem; font-weight: 800; }
.si-reco-shares .is-user { color: var(--st-user); }
.si-reco-shares .is-partner { color: var(--st-partner); }
.si-reco-upcoming { margin-top: .45rem; font-size: .78rem; color: var(--st-muted); }
.si-reco-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .85rem; }
.si-reason { margin-top: .85rem; padding: .85rem .95rem; border-radius: 14px; background: var(--st-surface-2); border: 1px solid var(--st-line); }
.si-reason-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem .75rem; margin-bottom: .5rem; }
.si-reason-head strong { font-size: .95rem; }
.si-footer { margin-top: 1rem; font-size: .76rem; color: var(--st-muted); text-align: center; }

@media (max-width: 575.98px) {
    .settle-drawer { padding: .6rem 1rem 1.25rem; }
    .settle-drawer-head { flex-wrap: wrap; }
    .settle-drawer-head > :last-child { order: -1; width: 100%; display: flex; justify-content: flex-end; }
    .settle-drawer-head > :last-child .settle-ghost-btn span { display: none; }
    .si-hero-top { grid-template-columns: 1fr 1fr; justify-items: center; }
    .si-hero-top > div { grid-row: 2; grid-column: 1 / -1; }
    .si-hero-top > .settle-avatar-user { grid-row: 1; grid-column: 1; justify-self: end; margin-right: .6rem; }
    .si-hero-top > .settle-avatar-partner { grid-row: 1; grid-column: 2; justify-self: start; margin-left: .6rem; }
    .si-reco-top { grid-template-columns: auto minmax(0, 1fr); }
    .si-reco-amount { grid-column: 2; }
    .settle-select-bar { left: 1rem; right: 1rem; max-width: none; transform: none; justify-content: space-between; animation: settleFade .25s ease-out; }
    .settle-toast { left: 1rem; right: 1rem; max-width: none; transform: none; animation: settleFade .25s ease-out; }
}

/* respect the Accessibility page's reduce-motion switch and the OS setting */
html[data-a11y-reduce-motion="on"] .settle-page *,
html[data-a11y-reduce-motion="on"] .settle-drawer,
html[data-a11y-reduce-motion="on"] .settle-drawer-backdrop,
html[data-a11y-reduce-motion="on"] .admin-payment-sheet { animation: none !important; transition: none !important; }

@media (prefers-reduced-motion: reduce) {
    .settle-page *, .settle-drawer, .settle-drawer-backdrop, .admin-payment-sheet, .settle-intel-icon, .si-progress-bar span { animation: none !important; transition: none !important; }
}
