/* =====================================================================
   SaatVachan — Design System & Application Stylesheet
   Phase 1 · v1.0.0
   Palette: Ivory · Champagne gold · Deep burgundy · Charcoal
   ===================================================================== */

/* ---------------------------------------------------------------------
   1. Design tokens
--------------------------------------------------------------------- */
:root {
    /* Brand palette */
    --sv-ivory: #FAF7F0;
    --sv-cream: #F3EDE1;
    --sv-cream-deep: #EDE4D3;
    --sv-white: #FFFFFF;
    --sv-gold: #C6A15B;
    --sv-gold-soft: #DCC894;
    --sv-gold-deep: #A9853F;
    --sv-wine: #6B1F2E;
    --sv-wine-deep: #521623;
    --sv-wine-soft: #8A3244;
    --sv-ink: #2C2926;
    --sv-text: #4A443B;
    --sv-muted: #82796A;
    --sv-line: #E8E0D0;
    --sv-line-soft: #EFE9DC;

    /* Feedback */
    --sv-success: #2E7D5B;
    --sv-success-bg: #EDF6F0;
    --sv-danger: #B3402F;
    --sv-danger-bg: #FBF0EE;
    --sv-warning: #A3762B;
    --sv-warning-bg: #FBF4E6;
    --sv-info: #3D6B8E;
    --sv-info-bg: #EEF4F9;

    /* Typography */
    --sv-font-head: 'Playfair Display', Georgia, 'Times New Roman', serif;
    --sv-font-body: 'Poppins', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;

    /* Shape & depth */
    --sv-radius: 14px;
    --sv-radius-sm: 9px;
    --sv-radius-lg: 22px;
    --sv-shadow: 0 2px 10px rgba(44, 41, 38, 0.05);
    --sv-shadow-lg: 0 18px 50px rgba(44, 41, 38, 0.12);

    /* Motion (subtle only) */
    --sv-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
    --sv-speed: 0.22s;
}

/* ---------------------------------------------------------------------
   2. Base
--------------------------------------------------------------------- */
html { -webkit-text-size-adjust: 100%; }

body {
    font-family: var(--sv-font-body);
    font-size: 1rem;
    line-height: 1.65;
    color: var(--sv-text);
    background: var(--sv-ivory);
}

h1, h2, h3, h4, h5, h6 { font-family: var(--sv-font-head); color: var(--sv-ink); font-weight: 600; }
h1 { font-weight: 700; }

a { color: var(--sv-wine); text-decoration: none; transition: color var(--sv-speed) var(--sv-ease); }
a:hover { color: var(--sv-wine-deep); }

img { max-width: 100%; height: auto; }

::selection { background: var(--sv-gold-soft); color: var(--sv-ink); }

/* Visible focus for keyboard users */
:focus-visible {
    outline: 3px solid var(--sv-gold);
    outline-offset: 2px;
    border-radius: 4px;
}

.sv-skip-link {
    position: absolute;
    left: -999px;
    top: 8px;
    z-index: 2000;
    background: var(--sv-wine);
    color: var(--sv-ivory);
    padding: 10px 18px;
    border-radius: var(--sv-radius-sm);
    font-weight: 500;
}
.sv-skip-link:focus { left: 8px; color: var(--sv-ivory); }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ---------------------------------------------------------------------
   3. Buttons
--------------------------------------------------------------------- */
.btn {
    --bs-btn-focus-box-shadow: 0 0 0 0.2rem rgba(198, 161, 91, 0.35);
    font-family: var(--sv-font-body);
    font-weight: 500;
    border-radius: var(--sv-radius-sm);
    letter-spacing: 0.01em;
    transition: all var(--sv-speed) var(--sv-ease);
    min-height: 44px; /* comfortable touch target */
    padding: 0.55rem 1.35rem;
}
.btn:focus-visible { outline: 3px solid var(--sv-gold); outline-offset: 2px; }

.sv-btn-primary {
    background: var(--sv-wine);
    border: 1px solid var(--sv-wine);
    color: var(--sv-ivory);
    font-weight: 500;
}
.sv-btn-primary:hover, .sv-btn-primary:focus {
    background: var(--sv-wine-deep);
    border-color: var(--sv-wine-deep);
    color: var(--sv-ivory);
    transform: translateY(-1px);
    box-shadow: 0 8px 22px rgba(104, 26, 41, 0.28);
}
.sv-btn-primary:active { transform: translateY(0); }

.sv-btn-outline {
    background: transparent;
    border: 1.5px solid var(--sv-gold-deep);
    color: var(--sv-wine);
    font-weight: 500;
}
.sv-btn-outline:hover, .sv-btn-outline:focus {
    background: rgba(198, 161, 91, 0.12);
    border-color: var(--sv-gold-deep);
    color: var(--sv-wine-deep);
}

.sv-btn-outline-light {
    background: transparent;
    border: 1.5px solid rgba(250, 247, 240, 0.7);
    color: var(--sv-ivory);
}
.sv-btn-outline-light:hover, .sv-btn-outline-light:focus {
    background: rgba(250, 247, 240, 0.12);
    color: var(--sv-ivory);
    border-color: var(--sv-ivory);
}

.sv-btn-gold {
    background: linear-gradient(135deg, #D3AC66, var(--sv-gold-deep));
    border: 1px solid var(--sv-gold-deep);
    color: #FFF9EE;
    font-weight: 600;
}
.sv-btn-gold:hover, .sv-btn-gold:focus {
    color: #FFF9EE;
    filter: brightness(1.06);
    transform: translateY(-1px);
    box-shadow: 0 10px 26px rgba(169, 133, 63, 0.35);
}

.sv-btn-ghost { color: var(--sv-wine); border: 1px solid transparent; }
.sv-btn-ghost:hover, .sv-btn-ghost:focus { color: var(--sv-wine-deep); background: rgba(198, 161, 91, 0.12); }

.sv-btn-danger {
    background: transparent;
    border: 1.5px solid var(--sv-danger);
    color: var(--sv-danger);
    font-weight: 500;
}
.sv-btn-danger:hover, .sv-btn-danger:focus { background: var(--sv-danger); color: #fff; }

.sv-btn-disabled {
    background: var(--sv-cream);
    border: 1px solid var(--sv-line);
    color: var(--sv-muted);
    cursor: not-allowed;
    opacity: 0.85;
}

.sv-btn-lg { padding: 0.75rem 1.9rem; font-size: 1.02rem; }
.sv-btn-sm { min-height: 38px; padding: 0.35rem 1rem; font-size: 0.92rem; }
.sv-btn-block { width: 100%; }
.sv-btn-sm-wide { padding-left: 1.6rem; padding-right: 1.6rem; }

.sv-btn-spinner { margin-left: 8px; }

.btn[disabled], .btn:disabled { cursor: not-allowed; }

/* ---------------------------------------------------------------------
   4. Header / navigation
--------------------------------------------------------------------- */
.sv-header {
    background: rgba(250, 247, 240, 0.92);
    backdrop-filter: blur(8px);
    border-bottom: 1px solid var(--sv-line-soft);
    position: sticky;
    top: 0;
    z-index: 1030;
}

.sv-navbar { padding: 0.65rem 0; }

.sv-brand-link { display: inline-flex; align-items: center; gap: 0.65rem; text-decoration: none; }
.sv-brand-link:hover { color: inherit; }

.sv-logo-mark { width: 40px; height: 40px; flex: 0 0 auto; }

.sv-brand-text { display: flex; flex-direction: column; line-height: 1.15; }
.sv-brand-name {
    font-family: var(--sv-font-head);
    font-size: 1.32rem;
    font-weight: 700;
    color: var(--sv-wine);
    letter-spacing: 0.01em;
}
.sv-brand-tag { font-size: 0.62rem; color: var(--sv-gold-deep); letter-spacing: 0.14em; text-transform: uppercase; font-family: var(--sv-font-body); }

.sv-nav .nav-link {
    color: var(--sv-text);
    font-weight: 500;
    font-size: 0.97rem;
    padding: 0.55rem 0.95rem;
    border-radius: var(--sv-radius-sm);
    position: relative;
}
.sv-nav .nav-link:hover { color: var(--sv-wine); background: rgba(198, 161, 91, 0.1); }
.sv-nav .nav-link.active { color: var(--sv-wine); }
.sv-nav .nav-link.active::after {
    content: "";
    position: absolute;
    left: 0.95rem; right: 0.95rem; bottom: 0.18rem;
    height: 2px; border-radius: 2px;
    background: var(--sv-gold);
}
.sv-nav .sv-nav-logout { border: 0; background: none; cursor: pointer; width: 100%; text-align: left; }

.sv-nav-divider { border-top: 1px solid var(--sv-line); margin: 0.5rem 1rem; }

.sv-toggler { border: 1px solid var(--sv-line); padding: 0.45rem 0.6rem; border-radius: var(--sv-radius-sm); }
.sv-toggler:focus { box-shadow: 0 0 0 0.2rem rgba(198, 161, 91, 0.35); }

/* Mobile drawer */
.sv-navdrawer { background: var(--sv-ivory); }
@media (max-width: 991.98px) {
    .sv-navdrawer {
        border-left: 1px solid var(--sv-line);
        padding: 1rem;
    }
    .sv-nav .nav-link { font-size: 1.02rem; padding: 0.75rem 1rem; }
    .sv-nav .nav-link.active::after { display: none; }
    .sv-nav .nav-link.active { background: rgba(107, 31, 46, 0.07); }
}

/* ---------------------------------------------------------------------
   5. Sections, headings & rules
--------------------------------------------------------------------- */
.sv-section { padding: 4.2rem 0; }
.sv-section-tight { padding: 2.2rem 0; }
.sv-section-cream { background: var(--sv-cream); }

.sv-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--sv-gold-deep);
    margin-bottom: 0.75rem;
    font-family: var(--sv-font-body);
}
.sv-eyebrow-center { justify-content: center; display: flex; }
.sv-eyebrow-light { color: var(--sv-gold-soft); }

.sv-section-title {
    font-size: clamp(1.7rem, 3.4vw, 2.5rem);
    margin-bottom: 0;
    text-align: center;
}

.sv-rule {
    width: 74px; height: 3px;
    background: linear-gradient(90deg, transparent, var(--sv-gold), transparent);
    border-radius: 3px;
    margin: 1.1rem auto 0;
}

.sv-section-head { margin-bottom: 2.6rem; }
.sv-section-head p.sv-demo-note { margin-top: 1.1rem; }

.sv-demo-note, .sv-tmpl-note {
    text-align: center;
    color: var(--sv-muted);
    font-size: 0.9rem;
    background: rgba(255, 255, 255, 0.6);
    border: 1px dashed var(--sv-line);
    border-radius: var(--sv-radius-sm);
    padding: 0.55rem 1rem;
    max-width: 720px;
    margin-left: auto; margin-right: auto;
}
.sv-demo-note i, .sv-tmpl-note i { color: var(--sv-gold-deep); }

.sv-breadcrumb { font-size: 0.88rem; color: var(--sv-muted); margin-bottom: 1.2rem; display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; }
.sv-breadcrumb i { font-size: 0.7rem; color: var(--sv-gold); }

/* ---------------------------------------------------------------------
   6. Cards
--------------------------------------------------------------------- */
.sv-card {
    background: var(--sv-white);
    border: 1px solid var(--sv-line-soft);
    border-radius: var(--sv-radius);
    padding: 1.5rem;
    box-shadow: var(--sv-shadow);
}
.sv-card-elevated { box-shadow: var(--sv-shadow-lg); }
.sv-card-h-full { height: 100%; }
.sv-card-soft { background: linear-gradient(180deg, #fff, var(--sv-ivory)); }
.sv-card-danger { border-color: rgba(179, 64, 47, 0.35); background: #FFFBFA; }

.sv-card-title {
    font-size: 1.18rem;
    font-weight: 600;
    margin-bottom: 0.2rem;
}
.sv-card-sub { color: var(--sv-muted); font-size: 0.92rem; margin-bottom: 1rem; }

/* ---------------------------------------------------------------------
   7. Hero
--------------------------------------------------------------------- */
.sv-hero {
    background:
        radial-gradient(1200px 500px at 85% -10%, rgba(198, 161, 91, 0.16), transparent 60%),
        radial-gradient(900px 480px at -10% 20%, rgba(107, 31, 46, 0.06), transparent 55%),
        var(--sv-ivory);
    padding: 4.5rem 0 4rem;
    overflow: hidden;
}

.sv-hero-title {
    font-size: clamp(2.35rem, 5.6vw, 3.9rem);
    line-height: 1.12;
    color: var(--sv-ink);
    margin: 0.4rem 0 1.1rem;
}
.sv-hero-lead { font-size: 1.08rem; color: var(--sv-text); max-width: 34rem; }
.sv-hero-points { list-style: none; display: flex; flex-wrap: wrap; gap: 1.1rem; padding: 0; margin: 1.6rem 0 0; }
.sv-hero-points li { display: inline-flex; align-items: center; gap: 0.45rem; font-size: 0.92rem; color: var(--sv-muted); }
.sv-hero-points i { color: var(--sv-gold-deep); }

.sv-hero-actions { display: flex; flex-wrap: wrap; gap: 0.8rem; margin-top: 1.9rem; }
.sv-hero-actions-center { justify-content: center; }

.sv-hero-visual { position: relative; max-width: 580px; margin-inline: auto; }
.sv-hero-visual img {
    width: 100%;
    border-radius: 300px 300px var(--sv-radius) var(--sv-radius);
    border: 1px solid var(--sv-gold-soft);
    outline: 6px solid rgba(198, 161, 91, 0.14);
    outline-offset: 6px;
    display: block;
    box-shadow: var(--sv-shadow-lg);
}

.sv-hero-chip {
    position: absolute;
    left: -10px; bottom: 26px;
    background: var(--sv-wine);
    color: var(--sv-ivory);
    border-radius: var(--sv-radius);
    padding: 0.9rem 1.15rem;
    display: flex; align-items: center; gap: 0.65rem;
    max-width: 220px;
    box-shadow: 0 16px 34px rgba(82, 22, 35, 0.35);
    font-size: 0.85rem;
    line-height: 1.4;
}
.sv-hero-chip i { color: var(--sv-gold-soft); font-size: 1.3rem; }

@media (max-width: 575.98px) {
    .sv-hero { padding: 2.8rem 0 3rem; }
    .sv-hero-chip { position: static; margin-top: 1rem; max-width: none; }
}

/* ---------------------------------------------------------------------
   8. Quick search
--------------------------------------------------------------------- */
.sv-quicksearch { margin-top: -3.4rem; position: relative; z-index: 5; }
.sv-quicksearch-intro {
    background: linear-gradient(160deg, var(--sv-wine), var(--sv-wine-deep));
    border-radius: var(--sv-radius) 0 0 var(--sv-radius);
    padding: 1.6rem;
    color: var(--sv-ivory);
    display: flex; flex-direction: column; justify-content: center;
}
.sv-quicksearch-intro .sv-card-title { color: var(--sv-ivory); }
.sv-quicksearch-intro .sv-card-sub { color: rgba(250, 247, 240, 0.75); }
.sv-quicksearch > .row > .col-lg-9 { padding: 1.6rem 1.7rem; }

@media (max-width: 991.98px) {
    .sv-quicksearch { margin-top: 0; }
    .sv-quicksearch-intro { border-radius: var(--sv-radius) var(--sv-radius) 0 0; }
    .sv-quicksearch > .row > .col-lg-9 { padding: 1.4rem 1.2rem; }
}

.sv-optional { color: var(--sv-muted); font-weight: 400; font-size: 0.85em; }
.sv-req { color: var(--sv-danger); }

/* ---------------------------------------------------------------------
   9. Forms
--------------------------------------------------------------------- */
.form-label { font-size: 0.9rem; font-weight: 500; color: var(--sv-ink); margin-bottom: 0.35rem; }

.form-control, .form-select {
    border: 1px solid var(--sv-line);
    border-radius: var(--sv-radius-sm);
    padding: 0.62rem 0.9rem;
    font-size: 0.97rem;
    color: var(--sv-ink);
    background-color: var(--sv-white);
    min-height: 46px;
}
.form-control:focus, .form-select:focus {
    border-color: var(--sv-gold);
    box-shadow: 0 0 0 0.2rem rgba(198, 161, 91, 0.22);
}
.form-control::placeholder { color: #B4AA97; }

textarea.form-control { min-height: auto; }

.input-group-text {
    background: var(--sv-cream);
    border: 1px solid var(--sv-line);
    color: var(--sv-muted);
    border-radius: var(--sv-radius-sm) 0 0 var(--sv-radius-sm);
}
.input-group .form-control:not(:last-child) { border-radius: var(--sv-radius-sm) 0 0 var(--sv-radius-sm); }
.input-group .btn { border-radius: 0 var(--sv-radius-sm) var(--sv-radius-sm) 0; }

.form-hint { font-size: 0.82rem; color: var(--sv-muted); margin-top: 0.35rem; }
.form-hint.is-ok { color: var(--sv-success); }
.form-hint.is-error { color: var(--sv-danger); }

.invalid-feedback { font-size: 0.84rem; }

.sv-password-toggle {
    background: var(--sv-cream);
    border: 1px solid var(--sv-line);
    border-left: 0;
    color: var(--sv-muted);
    border-radius: 0 var(--sv-radius-sm) var(--sv-radius-sm) 0;
}
.sv-password-toggle:hover { color: var(--sv-wine); }

.form-check-input { border-color: var(--sv-line); }
.form-check-input:checked { background-color: var(--sv-wine); border-color: var(--sv-wine); }
.form-check-input:focus { box-shadow: 0 0 0 0.2rem rgba(198, 161, 91, 0.25); border-color: var(--sv-gold); }

.sv-consent { background: var(--sv-ivory); border: 1px solid var(--sv-line-soft); border-radius: var(--sv-radius-sm); padding: 0.9rem 1rem; }
.sv-consent .form-check-label { font-size: 0.9rem; }

.sv-radio-card, .sv-check-row {
    border: 1px solid var(--sv-line);
    border-radius: var(--sv-radius-sm);
    padding: 0.85rem 1rem;
    margin-bottom: 0.6rem;
    transition: border-color var(--sv-speed) var(--sv-ease), background var(--sv-speed) var(--sv-ease);
}
.sv-radio-card:hover, .sv-check-row:hover { border-color: var(--sv-gold); }
.sv-radio-card:has(input:checked), .sv-check-row:has(input:checked) { border-color: var(--sv-gold-deep); background: rgba(198, 161, 91, 0.08); }

/* ---------------------------------------------------------------------
   10. Trust cards, steps, help cards
--------------------------------------------------------------------- */
.sv-trust-card {
    background: var(--sv-white);
    border: 1px solid var(--sv-line-soft);
    border-radius: var(--sv-radius);
    padding: 1.7rem 1.4rem;
    height: 100%;
    box-shadow: var(--sv-shadow);
}
.sv-trust-icon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 52px; height: 52px;
    border-radius: 50%;
    background: linear-gradient(150deg, rgba(198, 161, 91, 0.2), rgba(107, 31, 46, 0.08));
    color: var(--sv-wine);
    font-size: 1.45rem;
    margin-bottom: 0.9rem;
}
.sv-trust-card h3 { font-size: 1.08rem; margin-bottom: 0.4rem; }
.sv-trust-card p { font-size: 0.9rem; color: var(--sv-muted); margin: 0; }

.sv-step {
    position: relative;
    background: var(--sv-white);
    border: 1px solid var(--sv-line);
    border-radius: var(--sv-radius);
    padding: 1.8rem 1.4rem 1.5rem;
    height: 100%;
    text-align: center;
}
.sv-step-num {
    position: absolute;
    top: -14px; left: 50%;
    transform: translateX(-50%);
    width: 30px; height: 30px;
    border-radius: 50%;
    background: var(--sv-wine);
    color: var(--sv-ivory);
    display: flex; align-items: center; justify-content: center;
    font-family: var(--sv-font-head);
    font-weight: 700; font-size: 0.95rem;
    border: 2px solid var(--sv-gold-soft);
}
.sv-step-icon { font-size: 1.7rem; color: var(--sv-gold-deep); margin: 0.5rem 0 0.7rem; display: block; }
.sv-step h3 { font-size: 1.05rem; }
.sv-step p { font-size: 0.88rem; color: var(--sv-muted); margin: 0; }
.sv-step-lg { padding-top: 2.1rem; }

.sv-help-card {
    display: block;
    background: var(--sv-white);
    border: 1px solid var(--sv-line-soft);
    border-radius: var(--sv-radius);
    padding: 1.6rem;
    height: 100%;
    color: var(--sv-text);
    box-shadow: var(--sv-shadow);
    transition: transform var(--sv-speed) var(--sv-ease), box-shadow var(--sv-speed) var(--sv-ease);
}
.sv-help-card:hover { color: var(--sv-text); transform: translateY(-3px); box-shadow: var(--sv-shadow-lg); }
.sv-help-card i { font-size: 1.6rem; color: var(--sv-gold-deep); }
.sv-help-card h2 { font-size: 1.05rem; margin: 0.6rem 0 0.35rem; }
.sv-help-card p { font-size: 0.88rem; color: var(--sv-muted); margin: 0; }

/* ---------------------------------------------------------------------
   11. Profile cards
--------------------------------------------------------------------- */
.sv-profile-card {
    background: var(--sv-white);
    border: 1px solid var(--sv-line-soft);
    border-radius: var(--sv-radius);
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
    box-shadow: var(--sv-shadow);
    transition: transform var(--sv-speed) var(--sv-ease), box-shadow var(--sv-speed) var(--sv-ease);
    position: relative;
}
.sv-profile-card:hover { transform: translateY(-4px); box-shadow: var(--sv-shadow-lg); }

.sv-profile-photo {
    position: relative;
    aspect-ratio: 1 / 1;
    background: linear-gradient(150deg, var(--sv-cream), var(--sv-cream-deep));
    display: flex; align-items: center; justify-content: center;
    overflow: hidden;
}
.sv-profile-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }

.sv-profile-photo-lg { border-radius: var(--sv-radius); overflow: hidden; }

.sv-profile-initials {
    font-family: var(--sv-font-head);
    font-size: 2.6rem;
    font-weight: 700;
    color: var(--sv-wine);
    background: linear-gradient(150deg, var(--sv-cream), #fff);
    border: 1px solid var(--sv-line);
    border-radius: 50%;
    width: 96px; height: 96px;
    display: flex; align-items: center; justify-content: center;
}
.sv-profile-initials-lg { width: 140px; height: 140px; font-size: 3.4rem; }

.sv-verified-badge {
    position: absolute;
    top: 10px; left: 10px;
    background: rgba(255, 255, 255, 0.95);
    color: var(--sv-info);
    font-size: 0.72rem;
    font-weight: 600;
    padding: 0.28rem 0.6rem;
    border-radius: 999px;
    display: inline-flex; align-items: center; gap: 0.3rem;
    border: 1px solid rgba(61, 107, 142, 0.25);
    box-shadow: var(--sv-shadow);
}

.sv-sample-ribbon {
    position: absolute;
    top: 12px; right: -34px;
    transform: rotate(45deg);
    background: var(--sv-gold-deep);
    color: #FFF9EE;
    font-size: 0.66rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 0.22rem 2.6rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.22);
}

.sv-profile-body { padding: 1rem 1.1rem 0.4rem; flex: 1 1 auto; }
.sv-profile-name { font-size: 1.12rem; margin: 0 0 0.15rem; }
.sv-profile-meta { display: block; font-size: 0.85rem; color: var(--sv-gold-deep); font-weight: 500; font-family: var(--sv-font-body); }
.sv-profile-education { font-size: 0.87rem; color: var(--sv-muted); margin: 0.3rem 0 0; }
.sv-profile-tagline { font-size: 0.85rem; color: var(--sv-text); margin: 0.55rem 0 0; font-style: italic; }

.sv-profile-footer { padding: 0.9rem 1.1rem 1.1rem; }

/* Demo profile page */
.sv-demo-banner {
    display: flex; gap: 0.7rem; align-items: flex-start;
    background: var(--sv-warning-bg);
    border: 1px solid rgba(163, 118, 43, 0.3);
    color: #6E5222;
    border-radius: var(--sv-radius-sm);
    padding: 0.8rem 1rem;
    font-size: 0.9rem;
    margin-bottom: 1.4rem;
}
.sv-demo-banner-inline { max-width: 760px; margin: 1.4rem auto 0; }
.sv-demo-banner i { color: var(--sv-warning); font-size: 1.05rem; margin-top: 0.1rem; }

.sv-demo-profile { margin-top: 0.5rem; }
.sv-demo-name { font-size: clamp(1.6rem, 3vw, 2.2rem); }
.sv-demo-meta { color: var(--sv-gold-deep); font-weight: 500; font-size: 1rem; }
.sv-demo-tagline { font-size: 1.02rem; font-style: italic; color: var(--sv-text); }
.sv-demo-actions { display: flex; flex-wrap: wrap; gap: 0.7rem; margin-top: 1.4rem; }
.sv-demo-note-text { font-size: 0.85rem; color: var(--sv-muted); margin: 1rem 0 0; }

.sv-subhead { font-size: 1.15rem; margin: 1.4rem 0 0.8rem; }

.sv-details-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 0.9rem 1.6rem;
    margin: 0;
}
.sv-details-grid dt { font-size: 0.76rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--sv-muted); font-weight: 600; }
.sv-details-grid dd { margin: 0.1rem 0 0; font-size: 0.98rem; color: var(--sv-ink); }

/* ---------------------------------------------------------------------
   12. Story cards
--------------------------------------------------------------------- */
.sv-story-card {
    background: var(--sv-white);
    border: 1px solid var(--sv-line-soft);
    border-radius: var(--sv-radius);
    overflow: hidden;
    height: 100%;
    box-shadow: var(--sv-shadow);
    position: relative;
}
.sv-story-photo { position: relative; aspect-ratio: 16/9; overflow: hidden; }
.sv-story-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sv-story-body { padding: 1.2rem 1.3rem 1.4rem; }
.sv-story-names { font-size: 1.2rem; margin: 0; }
.sv-story-meta { color: var(--sv-gold-deep); font-size: 0.85rem; font-weight: 500; font-family: var(--sv-font-body); margin: 0.2rem 0 0.6rem; }
.sv-story-text { font-size: 0.9rem; color: var(--sv-muted); margin: 0; }

/* ---------------------------------------------------------------------
   13. Plan (pricing) cards
--------------------------------------------------------------------- */
.sv-plan-card {
    background: var(--sv-white);
    border: 1px solid var(--sv-line-soft);
    border-radius: var(--sv-radius);
    padding: 1.7rem 1.5rem;
    height: 100%;
    display: flex; flex-direction: column;
    box-shadow: var(--sv-shadow);
    position: relative;
}
.sv-plan-card.is-featured {
    border: 1.5px solid var(--sv-gold);
    box-shadow: 0 16px 44px rgba(169, 133, 63, 0.22);
    background: linear-gradient(180deg, #FFFDF8, #fff);
}
.sv-plan-flag {
    position: absolute;
    top: -13px; left: 50%;
    transform: translateX(-50%);
    background: linear-gradient(135deg, #D3AC66, var(--sv-gold-deep));
    color: #FFF9EE;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 0.25rem 0.9rem;
    border-radius: 999px;
    white-space: nowrap;
}
.sv-plan-name { font-size: 1.3rem; margin: 0; }
.sv-plan-tagline { color: var(--sv-muted); font-size: 0.85rem; font-family: var(--sv-font-body); margin: 0.15rem 0 0.9rem; }
.sv-plan-price { font-family: var(--sv-font-head); font-size: 1.9rem; font-weight: 700; color: var(--sv-wine); margin: 0 0 1rem; }
.sv-plan-price small { font-size: 0.85rem; color: var(--sv-muted); font-family: var(--sv-font-body); font-weight: 400; }

.sv-plan-features { list-style: none; padding: 0; margin: 0 0 1.4rem; flex: 1 1 auto; }
.sv-plan-features li { display: flex; gap: 0.55rem; font-size: 0.9rem; padding: 0.28rem 0; align-items: flex-start; }
.sv-plan-features i { color: var(--sv-gold-deep); margin-top: 0.22rem; }

/* ---------------------------------------------------------------------
   14. FAQ
--------------------------------------------------------------------- */
.sv-faq .accordion-item {
    background: var(--sv-white);
    border: 1px solid var(--sv-line-soft);
    border-radius: var(--sv-radius-sm) !important;
    margin-bottom: 0.7rem;
    overflow: hidden;
    box-shadow: var(--sv-shadow);
}
.sv-faq .accordion-button {
    font-family: var(--sv-font-head);
    font-size: 1.02rem;
    font-weight: 600;
    color: var(--sv-ink);
    padding: 1.05rem 1.25rem;
}
.sv-faq .accordion-button:not(.collapsed) { background: rgba(198, 161, 91, 0.08); color: var(--sv-wine); box-shadow: none; }
.sv-faq .accordion-button:focus { box-shadow: 0 0 0 0.2rem rgba(198, 161, 91, 0.25); border-color: var(--sv-gold); }
.sv-faq .accordion-button:not(.collapsed)::after { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23A9853F'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); }
.sv-faq .accordion-body { font-size: 0.93rem; color: var(--sv-text); padding: 0.2rem 1.25rem 1.1rem; line-height: 1.7; }

/* ---------------------------------------------------------------------
   15. CTA band
--------------------------------------------------------------------- */
.sv-cta-band {
    background:
        radial-gradient(800px 320px at 15% 0%, rgba(198, 161, 91, 0.22), transparent 55%),
        linear-gradient(160deg, var(--sv-wine), var(--sv-wine-deep));
    color: var(--sv-ivory);
    padding: 4.4rem 0;
}
.sv-cta-title { color: var(--sv-ivory); font-size: clamp(1.6rem, 3.4vw, 2.4rem); }
.sv-cta-text { color: rgba(250, 247, 240, 0.85); max-width: 40rem; margin: 0.8rem auto 0; }

/* ---------------------------------------------------------------------
   16. Footer
--------------------------------------------------------------------- */
.sv-footer {
    background: #241418;
    color: #CFC5B4;
    padding: 3.6rem 0 0;
    margin-top: auto;
}
.sv-footer-brand { margin-bottom: 1rem; }
.sv-brand-text-light .sv-brand-name { color: var(--sv-ivory); }
.sv-brand-text-light .sv-brand-tag { color: var(--sv-gold-soft); }
.sv-footer-about { font-size: 0.9rem; color: #A79C8A; max-width: 24rem; }
.sv-footer-heading { font-family: var(--sv-font-body); font-size: 0.78rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--sv-gold-soft); font-weight: 600; margin-bottom: 0.9rem; }
.sv-footer-links { list-style: none; padding: 0; margin: 0; }
.sv-footer-links li { margin-bottom: 0.5rem; }
.sv-footer-links a { color: #CFC5B4; font-size: 0.93rem; text-decoration: none; }
.sv-footer-links a:hover { color: #fff; }

.sv-social { display: flex; gap: 0.6rem; margin-top: 1.2rem; }
.sv-social-btn {
    width: 40px; height: 40px;
    border-radius: 50%;
    border: 1px solid rgba(198, 161, 91, 0.4);
    color: var(--sv-gold-soft);
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 1.05rem;
    cursor: default;
}
.sv-social-btn:hover { border-color: var(--sv-gold); color: var(--sv-gold-soft); }

.sv-footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    margin-top: 2.8rem;
    padding: 1.1rem 0 1.3rem;
    display: flex; flex-wrap: wrap; gap: 0.5rem;
    justify-content: space-between;
    font-size: 0.84rem;
    color: #8F8474;
}
.sv-footer-version { color: #6F6656; }

/* ---------------------------------------------------------------------
   17. Alerts / flash messages
--------------------------------------------------------------------- */
.sv-flash-wrap { margin-top: 1.1rem; }
.sv-alert {
    border: 1px solid;
    border-radius: var(--sv-radius-sm);
    font-size: 0.93rem;
    display: flex; align-items: flex-start; gap: 0.55rem;
    padding: 0.85rem 2.6rem 0.85rem 1rem;
}
.sv-alert i { margin-top: 0.12rem; }
.sv-alert .btn-close { position: absolute; top: 0.7rem; right: 0.6rem; }

.sv-alert-success { background: var(--sv-success-bg); border-color: rgba(46, 125, 91, 0.3); color: #1D5A40; }
.sv-alert-success i { color: var(--sv-success); }
.sv-alert-danger { background: var(--sv-danger-bg); border-color: rgba(179, 64, 47, 0.3); color: #8C2F22; }
.sv-alert-danger i { color: var(--sv-danger); }
.sv-alert-warning { background: var(--sv-warning-bg); border-color: rgba(163, 118, 43, 0.3); color: #6E5222; }
.sv-alert-warning i { color: var(--sv-warning); }
.sv-alert-info { background: var(--sv-info-bg); border-color: rgba(61, 107, 142, 0.3); color: #2C5470; }
.sv-alert-info i { color: var(--sv-info); }

/* ---------------------------------------------------------------------
   18. Auth pages
--------------------------------------------------------------------- */
.sv-auth-body {
    background:
        radial-gradient(900px 500px at 100% 0%, rgba(198, 161, 91, 0.14), transparent 55%),
        radial-gradient(700px 500px at 0% 100%, rgba(107, 31, 46, 0.07), transparent 55%),
        var(--sv-ivory);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.sv-auth-shell { flex: 1 1 auto; display: flex; flex-direction: column; align-items: center; padding: 1.8rem 1rem 0.6rem; }
.sv-auth-main { width: 100%; display: flex; flex-direction: column; align-items: center; }
.sv-auth-main .sv-flash-wrap { margin-bottom: 0.5rem; }

.sv-auth-card {
    background: var(--sv-white);
    border: 1px solid var(--sv-line-soft);
    border-radius: var(--sv-radius-lg);
    box-shadow: var(--sv-shadow-lg);
    padding: 2.1rem 1.8rem;
    width: 100%;
    max-width: 460px;
    margin: 1.2rem 0 2rem;
}
.sv-auth-card-wide { max-width: 680px; }

.sv-auth-card-head { text-align: center; margin-bottom: 1.6rem; }
.sv-auth-card-head h1 { font-size: 1.6rem; margin-bottom: 0.35rem; }
.sv-auth-card-head p { color: var(--sv-muted); font-size: 0.92rem; margin: 0; }

.sv-auth-alt { text-align: center; font-size: 0.92rem; color: var(--sv-muted); margin: 1.3rem 0 0; }
.sv-auth-alt a { font-weight: 500; }
.sv-auth-legal { text-align: center; font-size: 0.8rem; color: var(--sv-muted); padding-bottom: 1.2rem; }
.sv-auth-legal a { color: var(--sv-muted); }
.sv-auth-legal a:hover { color: var(--sv-wine); }

@media (max-width: 575.98px) {
    .sv-auth-card { padding: 1.6rem 1.2rem; }
}

/* ---------------------------------------------------------------------
   19. Member dashboard
--------------------------------------------------------------------- */
.sv-dash-body { background: var(--sv-ivory); min-height: 100vh; }

.sv-dash-topbar {
    background: var(--sv-white);
    border-bottom: 1px solid var(--sv-line-soft);
    position: sticky; top: 0; z-index: 1040;
}
.sv-dash-topbar-inner {
    display: flex; align-items: center; gap: 0.9rem;
    padding: 0.6rem 1rem;
    max-width: 1440px; margin: 0 auto;
}
.sv-dash-brand .sv-brand-name { font-size: 1.15rem; }
.sv-dash-brand .sv-logo-mark { width: 34px; height: 34px; }

.sv-dash-burger {
    border: 1px solid var(--sv-line);
    background: var(--sv-white);
    border-radius: var(--sv-radius-sm);
    width: 44px; height: 44px;
    font-size: 1.3rem;
    color: var(--sv-wine);
    display: inline-flex; align-items: center; justify-content: center;
}
@media (min-width: 992px) { .sv-dash-burger { display: none; } }

.sv-dash-actions { display: flex; align-items: center; gap: 1rem; }

.sv-dash-bell { position: relative; color: var(--sv-wine); font-size: 1.25rem; padding: 8px; border-radius: 50%; }
.sv-dash-bell:hover { background: rgba(198, 161, 91, 0.14); color: var(--sv-wine); }
.sv-dash-bell-badge {
    position: absolute; top: 1px; right: 0;
    background: var(--sv-danger); color: #fff;
    font-size: 0.62rem; font-weight: 600;
    min-width: 17px; height: 17px;
    border-radius: 999px;
    display: flex; align-items: center; justify-content: center;
    padding: 0 4px;
}

.sv-dash-user {
    display: inline-flex; align-items: center; gap: 0.55rem;
    border: 1px solid var(--sv-line);
    background: var(--sv-white);
    border-radius: 999px;
    padding: 0.28rem 0.8rem 0.28rem 0.32rem;
    color: var(--sv-ink); font-weight: 500; font-size: 0.93rem;
}
.sv-dash-user:hover { border-color: var(--sv-gold); }
.sv-dash-user i { font-size: 0.75rem; color: var(--sv-muted); }

.sv-avatar {
    width: 36px; height: 36px;
    border-radius: 50%;
    background: linear-gradient(150deg, var(--sv-wine), var(--sv-wine-deep));
    color: var(--sv-ivory);
    display: inline-flex; align-items: center; justify-content: center;
    font-weight: 600; font-size: 0.85rem;
    letter-spacing: 0.02em;
}
.sv-avatar-lg { width: 56px; height: 56px; font-size: 1.2rem; }
.sv-avatar-xl { width: 84px; height: 84px; font-size: 1.7rem; font-family: var(--sv-font-head); }

.sv-dropdown { border-radius: var(--sv-radius-sm); border-color: var(--sv-line); box-shadow: var(--sv-shadow-lg); overflow: hidden; }
.sv-dropdown .dropdown-item { padding: 0.55rem 1rem; font-size: 0.93rem; }
.sv-dropdown .dropdown-item:active { background: var(--sv-wine); color: var(--sv-ivory); }
.sv-text-danger { color: var(--sv-danger) !important; }
.sv-text-danger:active { color: #fff !important; }

.sv-dash-shell {
    display: flex;
    max-width: 1440px;
    margin: 0 auto;
    align-items: stretch;
}

.sv-dash-sidebar { width: 264px; flex: 0 0 264px; }
@media (max-width: 991.98px) {
    .sv-dash-sidebar {
        background: var(--sv-ivory);
        border-right: 1px solid var(--sv-line);
    }
}

.sv-dash-nav { display: flex; flex-direction: column; gap: 0.2rem; padding: 1.2rem 0.9rem; }

.sv-dash-link {
    display: flex; align-items: center; gap: 0.75rem;
    padding: 0.72rem 0.95rem;
    border-radius: var(--sv-radius-sm);
    color: var(--sv-text);
    font-weight: 500;
    font-size: 0.95rem;
    text-decoration: none;
    transition: background var(--sv-speed) var(--sv-ease), color var(--sv-speed) var(--sv-ease);
}
.sv-dash-link i { font-size: 1.1rem; color: var(--sv-muted); width: 22px; text-align: center; transition: color var(--sv-speed) var(--sv-ease); }
.sv-dash-link:hover { background: rgba(198, 161, 91, 0.12); color: var(--sv-wine); }
.sv-dash-link:hover i { color: var(--sv-gold-deep); }
.sv-dash-link.is-active { background: var(--sv-wine); color: var(--sv-ivory); }
.sv-dash-link.is-active i { color: var(--sv-gold-soft); }
.sv-dash-link.is-soon { color: var(--sv-muted); }
.sv-dash-link.is-soon span:first-of-type { opacity: 0.85; }
.sv-dash-link.is-soon:hover { color: var(--sv-wine); }

.sv-soon-pill {
    margin-left: auto;
    font-size: 0.62rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    background: var(--sv-cream-deep);
    color: var(--sv-gold-deep);
    border: 1px solid var(--sv-gold-soft);
    border-radius: 999px;
    padding: 0.1rem 0.5rem;
}
.sv-dash-link.is-active .sv-soon-pill { background: rgba(250, 247, 240, 0.15); color: var(--sv-gold-soft); border-color: rgba(220, 200, 148, 0.5); }

.sv-badge-count {
    margin-left: auto;
    background: var(--sv-danger); color: #fff;
    font-size: 0.7rem; font-weight: 600;
    border-radius: 999px; padding: 0.05rem 0.5rem;
}
.sv-dash-link.is-active .sv-badge-count { background: #fff; color: var(--sv-danger); }

.sv-dash-side-note {
    margin-top: 1.4rem;
    background: rgba(198, 161, 91, 0.1);
    border: 1px dashed var(--sv-gold-soft);
    border-radius: var(--sv-radius-sm);
    padding: 1rem 1.1rem;
    font-size: 0.8rem;
    color: var(--sv-muted);
    display: flex; gap: 0.6rem; align-items: flex-start;
}
.sv-dash-side-note i { color: var(--sv-gold-deep); font-size: 1.1rem; margin-top: 0.1rem; }
.sv-dash-side-note p { margin: 0; }

.sv-dash-main { flex: 1 1 auto; padding: 1.6rem 1.2rem 3rem; min-width: 0; }
@media (min-width: 992px) { .sv-dash-main { padding: 2rem 2.2rem 3.4rem; } }

.sv-dash-flashes:empty { display: none; }

/* Dashboard components */
.sv-page-head {
    display: flex; flex-wrap: wrap; gap: 1rem;
    justify-content: space-between; align-items: center;
    margin-bottom: 1.4rem;
}
.sv-page-title { font-size: clamp(1.5rem, 3vw, 1.95rem); margin: 0; }
.sv-page-sub { color: var(--sv-muted); font-size: 0.95rem; margin: 0.2rem 0 0; }
.sv-namaste { font-size: 1.1em; }

.sv-progress { height: 10px; border-radius: 999px; background: var(--sv-cream-deep); }
.sv-progress .progress-bar { background: linear-gradient(90deg, var(--sv-gold), var(--sv-gold-deep)); border-radius: 999px; }

.sv-progress-figure {
    font-family: var(--sv-font-head);
    font-size: 1.7rem;
    font-weight: 700;
    color: var(--sv-wine);
    line-height: 1;
}

.sv-missing-title { font-size: 0.82rem; font-weight: 600; color: var(--sv-muted); letter-spacing: 0.04em; }
.sv-missing-list { list-style: none; padding: 0; margin: 0; }
.sv-missing-list li { display: flex; align-items: center; gap: 0.55rem; padding: 0.22rem 0; font-size: 0.93rem; }
.sv-missing-list i { color: var(--sv-gold-deep); font-size: 0.8rem; }
.sv-missing-list li.is-future { color: var(--sv-muted); }
.sv-missing-list li.is-future i { color: var(--sv-muted); }

.sv-done-note { color: var(--sv-success); font-size: 0.95rem; }
.sv-done-note i { margin-right: 0.35rem; }

.sv-future-details summary { font-size: 0.88rem; color: var(--sv-muted); cursor: pointer; }
.sv-future-details summary:hover { color: var(--sv-wine); }

.sv-mini-profile { display: flex; gap: 1rem; align-items: center; background: var(--sv-ivory); border: 1px solid var(--sv-line-soft); border-radius: var(--sv-radius-sm); padding: 1rem; }
.sv-mini-name { font-size: 1.1rem; margin: 0; }
.sv-managed-by { display: block; font-size: 0.76rem; color: var(--sv-gold-deep); font-family: var(--sv-font-body); font-weight: 500; }
.sv-mini-meta { font-size: 0.88rem; color: var(--sv-muted); margin: 0.15rem 0 0; }

.sv-membership-pill { display: flex; align-items: center; gap: 0.8rem; background: var(--sv-ivory); border: 1px solid var(--sv-line-soft); border-radius: var(--sv-radius-sm); padding: 0.9rem 1rem; }
.sv-membership-pill i { font-size: 1.5rem; color: var(--sv-gold-deep); }
.sv-membership-pill strong { display: block; color: var(--sv-ink); }
.sv-membership-pill span { font-size: 0.82rem; color: var(--sv-success); font-weight: 500; }

.sv-membership-current-icon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 56px; height: 56px; border-radius: 50%;
    background: linear-gradient(150deg, rgba(198, 161, 91, 0.22), rgba(107, 31, 46, 0.1));
    color: var(--sv-wine); font-size: 1.5rem;
}

.sv-notice-list { list-style: none; padding: 0; margin: 0; }
.sv-notice-list li { display: flex; gap: 0.9rem; padding: 0.85rem 0.4rem; border-bottom: 1px solid var(--sv-line-soft); align-items: flex-start; }
.sv-notice-list li:last-child { border-bottom: 0; }
.sv-notice-list li i { color: var(--sv-gold-deep); margin-top: 0.2rem; }
.sv-notice-list li.is-unread { background: rgba(198, 161, 91, 0.06); border-radius: var(--sv-radius-sm); padding-left: 0.6rem; padding-right: 0.6rem; }
.sv-notice-title { margin: 0; font-weight: 600; font-family: var(--sv-font-body); color: var(--sv-ink); font-size: 0.95rem; }
.sv-notice-text { margin: 0.1rem 0 0; font-size: 0.88rem; color: var(--sv-muted); }
.sv-notice-time { margin: 0.25rem 0 0; font-size: 0.78rem; color: #A79C8A; display: flex; align-items: center; gap: 0.4rem; }

.sv-notice-list-lg li { padding: 1rem 0.6rem; }
.sv-notice-icon {
    width: 40px; height: 40px; flex: 0 0 40px;
    border-radius: 50%;
    background: var(--sv-cream);
    color: var(--sv-muted);
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 1.05rem;
}
.sv-notice-icon.is-active { background: rgba(198, 161, 91, 0.2); color: var(--sv-gold-deep); }
.sv-unread-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--sv-gold-deep); display: inline-block; }
.sv-notice-footnote { font-size: 0.8rem; color: var(--sv-muted); margin: 0.8rem 0 0; }

.sv-quick-actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 0.7rem; }
.sv-quick-action {
    display: flex; flex-direction: column; align-items: center; gap: 0.5rem;
    border: 1px solid var(--sv-line);
    border-radius: var(--sv-radius-sm);
    background: var(--sv-white);
    color: var(--sv-text);
    font-size: 0.88rem;
    font-weight: 500;
    padding: 1.1rem 0.6rem;
    text-align: center;
    transition: all var(--sv-speed) var(--sv-ease);
}
.sv-quick-action i { font-size: 1.4rem; color: var(--sv-gold-deep); }
.sv-quick-action:hover { border-color: var(--sv-gold); color: var(--sv-wine); transform: translateY(-2px); box-shadow: var(--sv-shadow); }

.sv-photo-placeholder {
    text-align: center; padding: 1.6rem 1rem;
    border: 1.5px dashed var(--sv-gold-soft);
    border-radius: var(--sv-radius-sm);
    background: rgba(198, 161, 91, 0.05);
}
.sv-photo-placeholder .sv-avatar { margin-bottom: 0.8rem; }
.sv-photo-placeholder p { font-size: 0.85rem; color: var(--sv-muted); margin: 0; }

.sv-readonly-note { font-size: 0.82rem; color: var(--sv-muted); margin: 0.8rem 0 0; }

/* Coming soon */
.sv-coming { text-align: center; max-width: 620px; margin: 2.5rem auto; padding: 0 1rem; }
.sv-coming-icon {
    width: 84px; height: 84px;
    border-radius: 50%;
    background: linear-gradient(150deg, rgba(198, 161, 91, 0.2), rgba(107, 31, 46, 0.08));
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 2.1rem; color: var(--sv-wine);
    margin-bottom: 1.1rem;
}
.sv-coming-phase {
    display: inline-block;
    font-size: 0.7rem; font-weight: 600;
    letter-spacing: 0.16em; text-transform: uppercase;
    color: var(--sv-gold-deep);
    background: var(--sv-cream);
    border: 1px solid var(--sv-gold-soft);
    border-radius: 999px;
    padding: 0.2rem 0.85rem;
}
.sv-coming-title { font-size: clamp(1.6rem, 3.5vw, 2.2rem); margin: 0.7rem 0 0.6rem; }
.sv-coming-text { color: var(--sv-muted); font-size: 0.98rem; }
.sv-coming-note {
    display: flex; gap: 0.6rem; align-items: flex-start; text-align: left;
    background: var(--sv-info-bg);
    border: 1px solid rgba(61, 107, 142, 0.22);
    border-radius: var(--sv-radius-sm);
    padding: 0.9rem 1rem;
    font-size: 0.85rem;
    color: #2C5470;
    margin: 1.6rem 0;
}
.sv-coming-note i { color: var(--sv-info); margin-top: 0.15rem; }
.sv-coming-actions { display: flex; flex-wrap: wrap; gap: 0.7rem; justify-content: center; }

/* Empty state */
.sv-empty { text-align: center; padding: 2.4rem 1rem; }
.sv-empty-icon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 66px; height: 66px;
    border-radius: 50%;
    background: var(--sv-cream);
    color: var(--sv-gold-deep);
    font-size: 1.7rem;
    margin-bottom: 0.9rem;
}
.sv-empty-title { font-size: 1.15rem; margin: 0 0 0.4rem; }
.sv-empty-text { color: var(--sv-muted); font-size: 0.92rem; max-width: 30rem; margin: 0 auto 1.1rem; }

/* Search page */
.sv-search-filters { position: sticky; top: 84px; }
@media (max-width: 991.98px) { .sv-search-filters { position: static; } }
.sv-search-note {
    display: flex; gap: 0.6rem; align-items: flex-start;
    background: var(--sv-warning-bg);
    border: 1px solid rgba(163, 118, 43, 0.25);
    border-radius: var(--sv-radius-sm);
    padding: 0.8rem 0.9rem;
    font-size: 0.8rem;
    color: #6E5222;
    margin-top: 1.1rem;
}
.sv-search-note i { color: var(--sv-warning); margin-top: 0.1rem; }
.sv-search-head { margin-bottom: 1.2rem; }
.sv-search-count { color: var(--sv-muted); font-size: 0.92rem; margin: 0.25rem 0 0; }

/* Pagination */
.sv-pagination { justify-content: center; display: flex; }
.sv-pagination .page-link {
    color: var(--sv-wine);
    border-color: var(--sv-line);
    padding: 0.45rem 0.85rem;
    min-width: 42px;
    text-align: center;
}
.sv-pagination .page-item.active .page-link {
    background: var(--sv-wine);
    border-color: var(--sv-wine);
    color: var(--sv-ivory);
}
.sv-pagination .page-item.disabled .page-link { color: #C5BBA7; background: var(--sv-cream); }

/* Status pills */
.sv-status-pill {
    display: inline-flex; align-items: center;
    font-size: 0.74rem; font-weight: 600;
    letter-spacing: 0.05em;
    border-radius: 999px;
    padding: 0.22rem 0.7rem;
    white-space: nowrap;
}
.sv-status-success { background: var(--sv-success-bg); color: var(--sv-success); border: 1px solid rgba(46, 125, 91, 0.3); }
.sv-status-danger { background: var(--sv-danger-bg); color: var(--sv-danger); border: 1px solid rgba(179, 64, 47, 0.3); }
.sv-status-muted { background: var(--sv-cream); color: var(--sv-muted); border: 1px solid var(--sv-line); }

/* Tables */
.sv-table { --bs-table-bg: transparent; font-size: 0.92rem; }
.sv-table thead th {
    font-family: var(--sv-font-body);
    font-size: 0.72rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--sv-muted);
    font-weight: 600;
    border-bottom: 1px solid var(--sv-line);
    padding: 0.6rem 0.75rem;
    white-space: nowrap;
}
.sv-table td { padding: 0.75rem; border-color: var(--sv-line-soft); }
.sv-table-name { display: block; font-weight: 500; color: var(--sv-ink); }
.sv-table-sub { display: block; font-size: 0.8rem; color: var(--sv-muted); }

/* Stat cards */
.sv-stat-card {
    display: flex; align-items: center; gap: 1rem;
    background: var(--sv-white);
    border: 1px solid var(--sv-line-soft);
    border-radius: var(--sv-radius);
    padding: 1.25rem 1.3rem;
    height: 100%;
    box-shadow: var(--sv-shadow);
}
.sv-stat-icon {
    width: 52px; height: 52px; flex: 0 0 52px;
    border-radius: var(--sv-radius-sm);
    background: linear-gradient(150deg, rgba(198, 161, 91, 0.2), rgba(107, 31, 46, 0.07));
    color: var(--sv-wine);
    font-size: 1.4rem;
    display: inline-flex; align-items: center; justify-content: center;
}
.sv-stat-value { font-family: var(--sv-font-head); font-size: 1.6rem; font-weight: 700; color: var(--sv-ink); margin: 0; line-height: 1.1; }
.sv-stat-label { font-size: 0.85rem; color: var(--sv-text); font-weight: 500; margin: 0.15rem 0 0; }
.sv-stat-hint { font-size: 0.76rem; color: var(--sv-muted); margin: 0.15rem 0 0; }
.sv-stat-danger .sv-stat-value { color: var(--sv-danger); }
.sv-stat-danger .sv-stat-icon { background: var(--sv-danger-bg); color: var(--sv-danger); }

.sv-status-list { margin: 0; display: grid; gap: 0.65rem; }
.sv-status-list > div { display: flex; justify-content: space-between; gap: 1rem; align-items: center; border-bottom: 1px dashed var(--sv-line-soft); padding-bottom: 0.6rem; }
.sv-status-list > div:last-child { border-bottom: 0; }
.sv-status-list dt { font-size: 0.88rem; color: var(--sv-muted); font-weight: 500; }
.sv-status-list dd { margin: 0; font-size: 0.92rem; color: var(--sv-ink); font-weight: 500; text-align: right; }

.sv-checklist { list-style: none; padding: 0; margin: 0; }
.sv-checklist li { display: flex; gap: 0.7rem; align-items: flex-start; font-size: 0.9rem; color: var(--sv-text); padding: 0.5rem 0; border-bottom: 1px dashed var(--sv-line-soft); }
.sv-checklist li:last-child { border-bottom: 0; }
.sv-checklist i { color: var(--sv-gold-deep); margin-top: 0.2rem; }

/* Prose pages */
.sv-prose { font-size: 0.98rem; }
.sv-prose h2 { font-size: 1.3rem; margin: 1.9rem 0 0.7rem; }
.sv-prose p { margin-bottom: 0.9rem; }
.sv-prose ul { padding-left: 1.2rem; }
.sv-prose li { margin-bottom: 0.5rem; }
.sv-prose-lead { font-size: 1.12rem; color: var(--sv-ink); font-style: italic; border-left: 3px solid var(--sv-gold); padding-left: 1rem; }

/* Error pages */
.sv-error-body {
    background: var(--sv-ivory);
    min-height: 100vh;
    display: flex; align-items: center; justify-content: center;
    padding: 1.5rem;
}
.sv-error-wrap { text-align: center; max-width: 460px; }
.sv-error-mark { color: var(--sv-gold); font-size: 3.2rem; margin-bottom: 0.5rem; }
.sv-error-mark svg { width: 84px; height: 84px; }
.sv-error-code {
    font-family: var(--sv-font-head);
    font-size: 3.4rem;
    font-weight: 700;
    color: var(--sv-wine);
    margin: 0;
    line-height: 1;
}
.sv-error-title { font-size: 1.35rem; margin: 0.5rem 0 0.6rem; }
.sv-error-text { color: var(--sv-muted); font-size: 0.95rem; }
.sv-error-actions { display: flex; flex-wrap: wrap; gap: 0.7rem; justify-content: center; margin-top: 1.6rem; }
.sv-error-detail {
    text-align: left; font-size: 0.78rem;
    background: #241418; color: #E8DFD2;
    border-radius: var(--sv-radius-sm);
    padding: 0.9rem 1rem;
    white-space: pre-wrap;
    overflow-x: auto;
}

/* Admin */
.sv-admin-body { background: var(--sv-ivory); min-height: 100vh; }
.sv-admin-topbar { background: linear-gradient(160deg, var(--sv-wine), var(--sv-wine-deep)); position: sticky; top: 0; z-index: 1040; }
.sv-admin-topbar-inner { display: flex; align-items: center; gap: 1rem; padding: 0.65rem 1.2rem; max-width: 1240px; margin: 0 auto; }
.sv-admin-brand { display: inline-flex; align-items: center; gap: 0.6rem; text-decoration: none; }
.sv-admin-brand-text { color: var(--sv-ivory); font-family: var(--sv-font-head); font-weight: 700; font-size: 1.15rem; }
.sv-admin-brand-text small { color: var(--sv-gold-soft); font-family: var(--sv-font-body); font-weight: 500; font-size: 0.75rem; letter-spacing: 0.12em; text-transform: uppercase; }
.sv-admin-version { color: rgba(250, 247, 240, 0.7); font-size: 0.8rem; border: 1px solid rgba(220, 200, 148, 0.4); border-radius: 999px; padding: 0.15rem 0.7rem; }
.sv-admin-link { color: rgba(250, 247, 240, 0.85); font-size: 0.88rem; text-decoration: none; }
.sv-admin-link:hover { color: #fff; }
.sv-admin-logout { background: none; border: 1px solid rgba(250, 247, 240, 0.35); color: rgba(250, 247, 240, 0.9); border-radius: 999px; font-size: 0.85rem; padding: 0.32rem 0.9rem; }
.sv-admin-logout:hover { background: rgba(250, 247, 240, 0.12); color: #fff; }
.sv-admin-main { max-width: 1240px; margin: 0 auto; padding: 1.8rem 1rem 3rem; }
.sv-admin-login-wrap { max-width: 460px; margin: 2.5rem auto 1rem; padding: 0 1rem; }
.sv-admin-narrow { max-width: 500px; }

.sv-link { font-size: 0.9rem; font-weight: 500; }

/* Loading state (buttons) */
.btn[data-busy="true"] { pointer-events: none; opacity: 0.75; }

/* Utility */
.text-muted { color: var(--sv-muted) !important; }

/* =====================================================================
   Phase 2 — Profile system (wizard, hub, photos, member page, admin)
   ===================================================================== */

/* ---- Status pills ---- */
.sv-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.28rem 0.7rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.01em;
    white-space: nowrap;
}
.sv-pill i { font-size: 0.85em; }
.sv-pill-draft { background: #F1EEE7; color: var(--sv-muted); }
.sv-pill-incomplete { background: #FBF3E4; color: #9A7B33; }
.sv-pill-complete { background: var(--sv-success-bg); color: var(--sv-success); }
.sv-pill-pending_review { background: #FDF1E3; color: #B4771F; }
.sv-pill-published { background: #EAF1FA; color: #2C5E9E; }
.sv-pill-suspended { background: #FBEDEB; color: #B3402F; }
.sv-pill-soft { background: rgba(255, 255, 255, 0.16); color: #fff; backdrop-filter: blur(2px); }
.sv-online i { color: #7BD8A9; font-size: 0.6em; }
.sv-member-hero .sv-pill-soft { background: rgba(107, 31, 46, 0.85); color: #fff; }

/* ---- Wizard ---- */
.sv-wizard-card { padding: 1.6rem; }
.sv-wizard-heading { font-family: var(--sv-font-display); font-size: 1.28rem; color: var(--sv-ink); margin-bottom: 0.35rem; }
.sv-wizard-heading-sm { font-family: var(--sv-font-display); font-size: 1.05rem; color: var(--sv-ink); margin-bottom: 0.25rem; }
.sv-wizard-divider { border: 0; border-top: 1px solid var(--sv-line-soft); margin: 1.5rem 0 1.15rem; opacity: 1; }
.sv-field-group { margin-bottom: 1.15rem; }
.sv-optional { font-size: 0.72rem; color: var(--sv-muted); font-weight: 500; text-transform: uppercase; letter-spacing: 0.05em; margin-left: 0.3rem; }
.sv-required { font-size: 0.72rem; color: var(--sv-wine); font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; margin-left: 0.3rem; }
.sv-readonly-value { font-weight: 600; color: var(--sv-ink); padding: 0.55rem 0; margin: 0; }

.sv-wizard-side { padding: 1.2rem 1.3rem; }
.sv-wizard-progress-label { font-size: 0.82rem; color: var(--sv-muted); margin: 0; }
.sv-wizard-progress-label strong { color: var(--sv-wine); font-size: 1rem; }
.sv-wizard-progress-top { display: flex; justify-content: space-between; margin-bottom: 0.4rem; }
.sv-wizard-steps { display: flex; flex-wrap: wrap; gap: 0.35rem; margin: 0.9rem 0 0; padding: 0; }
.sv-wizard-step { flex: 1 0 30%; min-width: 86px; }
.sv-wizard-step-link {
    display: flex; flex-direction: column; align-items: center; gap: 0.3rem;
    padding: 0.5rem 0.25rem; border-radius: 0.7rem; text-decoration: none;
    color: var(--sv-muted); font-size: 0.68rem; text-align: center; line-height: 1.2;
    border: 1px solid transparent;
}
.sv-wizard-step-link:hover { background: var(--sv-ivory); color: var(--sv-text); }
.sv-wizard-step-dot {
    width: 26px; height: 26px; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--sv-cream); color: var(--sv-muted);
    font-size: 0.72rem; font-weight: 700;
}
.sv-wizard-step.is-done .sv-wizard-step-dot { background: var(--sv-success-bg); color: var(--sv-success); }
.sv-wizard-step.is-current .sv-wizard-step-link { background: var(--sv-ivory); border-color: var(--sv-gold-soft); color: var(--sv-wine); }
.sv-wizard-step.is-current .sv-wizard-step-dot { background: var(--sv-wine); color: #fff; }
.sv-wizard-step-title { max-width: 100%; }

.sv-draft-note { font-size: 0.82rem; color: #9A7B33; margin: 0.4rem 0 0; }
.sv-count-warn { color: #B4771F; font-weight: 600; }

.sv-notice { border-radius: 0.8rem; border: 0; padding: 0.8rem 1rem; font-size: 0.9rem; }
.sv-notice-soft { background: var(--sv-ivory); color: var(--sv-text); border: 1px solid var(--sv-line-soft); }
.sv-notice-success { background: var(--sv-success-bg); color: var(--sv-success); }
.sv-notice-danger { background: #FBEDEB; color: #B3402F; }

.sv-check-card {
    border: 1px solid var(--sv-line-soft); border-radius: 0.8rem;
    padding: 0.85rem 1rem; background: var(--sv-white);
}
.sv-check-card .form-check-input { margin-top: 0.28rem; }
.sv-check-card:has(input:checked) { border-color: var(--sv-gold-soft); background: #FDFBF5; }
.sv-check-card-warn { border-style: dashed; }
.sv-check-inline { background: var(--sv-ivory); border-radius: 0.6rem; padding: 0.45rem 0.7rem; }

/* ---- Publish checklist ---- */
.sv-checklist { list-style: none; padding: 0; margin: 0 0 1rem; }
.sv-checklist li { display: flex; align-items: center; gap: 0.55rem; padding: 0.4rem 0; color: var(--sv-text); }
.sv-checklist li i { color: var(--sv-muted); }
.sv-checklist li.is-done { color: var(--sv-success); font-weight: 600; }
.sv-checklist li.is-done i { color: var(--sv-success); }
.sv-checklist-note { color: var(--sv-muted); font-weight: 400; font-size: 0.85em; }
.sv-publish-box { background: var(--sv-ivory); border: 1px solid var(--sv-line-soft); border-radius: 1rem; padding: 1.2rem; }

/* ---- Profile hub ---- */
.sv-completion-list { list-style: none; padding: 0; margin: 0; }
.sv-completion-list li a, .sv-completion-list li > span {
    display: flex; align-items: center; gap: 0.55rem;
    padding: 0.45rem 0.5rem; border-radius: 0.6rem;
    color: var(--sv-text); text-decoration: none; font-size: 0.92rem;
}
.sv-completion-list li a:hover { background: var(--sv-ivory); }
.sv-completion-list li i { color: var(--sv-line-deep, #C9BFA9); }
.sv-completion-list li.is-done i { color: var(--sv-success); }
.sv-completion-weight { margin-left: auto; font-size: 0.75rem; color: var(--sv-muted); }
.sv-recommend { background: #FDFBF5; border: 1px dashed var(--sv-gold-soft); border-radius: 0.8rem; padding: 0.85rem 1rem; }
.sv-recommend-title { font-weight: 600; color: var(--sv-gold-deep); font-size: 0.85rem; margin: 0; }
.sv-subnav-card {
    display: flex; gap: 0.75rem; align-items: flex-start;
    border: 1px solid var(--sv-line-soft); border-radius: 0.85rem;
    padding: 0.9rem 1rem; text-decoration: none; background: var(--sv-white);
    height: 100%; transition: border-color .15s ease, transform .15s ease;
}
.sv-subnav-card:hover { border-color: var(--sv-gold-soft); transform: translateY(-1px); }
.sv-subnav-card i { font-size: 1.25rem; color: var(--sv-wine); margin-top: 0.1rem; }
.sv-subnav-card strong { display: block; color: var(--sv-ink); font-size: 0.95rem; }
.sv-subnav-card small { color: var(--sv-muted); font-size: 0.8rem; }

/* ---- Photo manager ---- */
.sv-photo-upload { display: flex; gap: 1.25rem; flex-wrap: wrap; align-items: stretch; }
.sv-photo-drop {
    flex: 1 1 240px; display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 0.3rem; text-align: center; cursor: pointer;
    border: 2px dashed var(--sv-gold-soft); border-radius: 1rem;
    background: #FDFBF5; padding: 1.6rem 1rem; margin: 0;
}
.sv-photo-drop:hover, .sv-photo-drop:focus-within { border-color: var(--sv-gold-deep); background: #FBF6EA; }
.sv-photo-drop i { font-size: 1.8rem; color: var(--sv-gold-deep); }
.sv-photo-drop-title { font-weight: 600; color: var(--sv-ink); }
.sv-photo-drop-sub { font-size: 0.8rem; color: var(--sv-muted); }
.sv-photo-upload-side { flex: 0 1 240px; min-width: 200px; }
.sv-photo-note { font-size: 0.8rem; color: var(--sv-muted); }
.sv-photo-note-error { color: #B3402F; font-weight: 600; }
.sv-photo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 1rem; margin-top: 1.4rem; }
.sv-photo-grid-admin { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); margin-top: 0.4rem; }
.sv-photo-item { border: 1px solid var(--sv-line-soft); border-radius: 0.9rem; overflow: hidden; background: var(--sv-white); }
.sv-photo-item.is-primary { border-color: var(--sv-gold); box-shadow: 0 0 0 1px var(--sv-gold-soft); }
.sv-photo-thumb { display: block; position: relative; aspect-ratio: 1 / 1; }
.sv-photo-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sv-photo-badge {
    position: absolute; top: 0.5rem; left: 0.5rem;
    background: rgba(107, 31, 46, 0.92); color: #fff;
    font-size: 0.68rem; font-weight: 700; padding: 0.22rem 0.55rem; border-radius: 999px;
}
.sv-photo-privacy {
    position: absolute; bottom: 0.5rem; right: 0.5rem;
    background: rgba(44, 41, 38, 0.82); color: #fff;
    font-size: 0.66rem; font-weight: 600; padding: 0.2rem 0.5rem; border-radius: 999px;
    display: inline-flex; align-items: center; gap: 0.25rem;
}
.sv-photo-actions { padding: 0.6rem; }
.sv-photo-meta { padding: 0.4rem 0 0.2rem; color: var(--sv-muted); }

/* ---- Member / preview profile page ---- */
.sv-member { max-width: 980px; margin: 0 auto; }
.sv-member-hero {
    background: linear-gradient(135deg, var(--sv-wine) 0%, var(--sv-wine-deep) 55%, #3E1019 100%);
    border-radius: 1.25rem; padding: 2rem 1.5rem; color: #fff;
    position: relative; overflow: hidden;
}
.sv-member-hero::after {
    content: ""; position: absolute; inset: 0;
    background: radial-gradient(600px 200px at 85% -10%, rgba(198, 161, 91, 0.35), transparent 70%);
    pointer-events: none;
}
.sv-member-hero-inner { display: flex; gap: 1.5rem; align-items: center; flex-wrap: wrap; position: relative; z-index: 1; }
.sv-member-photo {
    width: 132px; height: 132px; border-radius: 50%; overflow: hidden;
    border: 4px solid rgba(198, 161, 91, 0.7); flex: 0 0 auto;
    background: var(--sv-cream); box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35);
}
.sv-member-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sv-member-photo-fallback {
    display: flex; align-items: center; justify-content: center;
    font-family: var(--sv-font-display); font-size: 2.4rem; color: var(--sv-wine); width: 100%; height: 100%;
}
.sv-member-id { flex: 1 1 260px; min-width: 230px; }
.sv-member-name { font-family: var(--sv-font-display); font-size: 1.9rem; margin: 0 0 0.3rem; color: #fff; }
.sv-member-meta { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0 0 0.7rem; color: rgba(255, 255, 255, 0.85); font-size: 0.98rem; }
.sv-member-tags { display: flex; flex-wrap: wrap; gap: 0.45rem; }
.sv-member-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 0.7rem; margin-top: 0.9rem; }
.sv-member-gallery-item { border-radius: 0.85rem; overflow: hidden; aspect-ratio: 1 / 1; display: block; }
.sv-member-gallery-item img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .2s ease; }
.sv-member-gallery-item:hover img { transform: scale(1.05); }
.sv-member-body { margin-top: 1.2rem; }
.sv-member-card {
    background: var(--sv-white); border: 1px solid var(--sv-line-soft);
    border-radius: 1rem; padding: 1.3rem 1.4rem; height: 100%;
}
.sv-member-card-title {
    font-family: var(--sv-font-display); font-size: 1.05rem; color: var(--sv-wine);
    margin: 0 0 0.9rem; padding-bottom: 0.55rem; border-bottom: 1px solid var(--sv-line-soft);
}
.sv-member-about { color: var(--sv-text); line-height: 1.75; white-space: pre-line; margin: 0; }
.sv-member-note { font-size: 0.8rem; color: var(--sv-muted); margin: 0.8rem 0 0; }
.sv-member-footer-note { text-align: center; color: var(--sv-muted); margin: 2.2rem 0 0; }
.sv-preview-wrap { background: var(--sv-cream); border-radius: 1.25rem; padding: 1.2rem; }
.sv-preview-label { font-weight: 600; color: var(--sv-wine); margin: 0 0.5rem 0.8rem; }

/* Key–value rows */
.sv-kv { margin: 0; }
.sv-kv-row { display: flex; gap: 1rem; padding: 0.42rem 0; border-bottom: 1px dashed var(--sv-line-soft); font-size: 0.92rem; }
.sv-kv-row:last-child { border-bottom: 0; }
.sv-kv-row dt { flex: 0 0 42%; color: var(--sv-muted); font-weight: 500; }
.sv-kv-row dd { flex: 1; margin: 0; color: var(--sv-ink); font-weight: 500; }
.sv-kv-heading { font-size: 0.85rem; font-weight: 600; color: var(--sv-muted); text-transform: uppercase; letter-spacing: 0.05em; margin: 0.6rem 0 0.3rem; }

/* Contact reveal buttons (anti-scrape) */
.sv-reveal {
    background: var(--sv-ivory); border: 1px dashed var(--sv-gold-soft); color: var(--sv-gold-deep);
    border-radius: 999px; padding: 0.18rem 0.8rem; font-size: 0.8rem; font-weight: 600;
}
.sv-reveal:hover { background: #FBF6EA; }

/* ---- Admin additions ---- */
.sv-admin-navlinks { display: flex; gap: 0.9rem; }
.sv-admin-navlinks .sv-admin-link.is-active { color: var(--sv-gold); font-weight: 600; }
.sv-admin-pills .nav-link { border-radius: 999px; color: var(--sv-muted); font-size: 0.85rem; padding: 0.3rem 0.9rem; }
.sv-admin-pills .nav-link.active { background: var(--sv-wine); color: #fff; }
.sv-admin-table th { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--sv-muted); font-weight: 600; }
.sv-admin-link-strong { color: var(--sv-ink); font-weight: 600; text-decoration: none; }
.sv-admin-link-strong:hover { color: var(--sv-wine); text-decoration: underline; }
.sv-admin-breadcrumb { font-size: 0.8rem; color: var(--sv-muted); margin: 0 0 0.2rem; }
.sv-admin-breadcrumb a { color: var(--sv-muted); }
.sv-admin-quote {
    background: var(--sv-ivory); border-left: 3px solid var(--sv-gold-soft);
    border-radius: 0 0.6rem 0.6rem 0; padding: 0.8rem 1rem; color: var(--sv-text);
    line-height: 1.7; white-space: pre-line; margin: 0;
}
.sv-progress-sm { height: 0.45rem; min-width: 48px; }

/* ---- Responsive tweaks ---- */
@media (max-width: 575.98px) {
    .sv-wizard-card { padding: 1.05rem; }
    .sv-wizard-steps { gap: 0.2rem; }
    .sv-wizard-step { flex: 1 0 44%; min-width: 72px; }
    .sv-member-hero { border-radius: 1rem; padding: 1.4rem 1rem; }
    .sv-member-photo { width: 104px; height: 104px; }
    .sv-member-name { font-size: 1.5rem; }
    .sv-photo-upload-side { flex: 1 1 100%; }
    .sv-kv-row dt { flex: 0 0 46%; }
}

/* =====================================================================
   Phase 3 · v1.2.0 — Discovery, search results, member cards,
   interests, shortlists, match panel, action bar
   ===================================================================== */

/* -- Result grid & member cards ------------------------------------- */
.sv-mgrid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 1rem;
}
.sv-mcard {
    display: flex;
    flex-direction: column;
    background: var(--sv-white);
    border: 1px solid var(--sv-line-soft);
    border-radius: var(--sv-radius);
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(44, 41, 38, 0.04);
    transition: box-shadow .2s ease, transform .2s ease;
}
.sv-mcard:hover { box-shadow: 0 8px 22px rgba(44, 41, 38, 0.09); transform: translateY(-2px); }
.sv-mcard.is-unavailable { opacity: 0.75; }
.sv-mcard.is-unavailable:hover { transform: none; }
.sv-mcard-photo { position: relative; display: block; aspect-ratio: 1 / 1; background: var(--sv-cream); }
.sv-mcard-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sv-mcard-fallback {
    width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    font-family: var(--sv-font-display); font-size: 2.3rem; color: var(--sv-wine);
    background: linear-gradient(135deg, var(--sv-ivory), var(--sv-cream));
}
.sv-mcard-match {
    position: absolute; left: 0.6rem; bottom: 0.6rem;
    background: rgba(107, 31, 46, 0.92); color: #fff;
    font-size: 0.74rem; font-weight: 600; letter-spacing: 0.02em;
    padding: 0.25rem 0.55rem; border-radius: 999px;
}
.sv-mcard-match i { margin-right: 0.25rem; }
.sv-mcard-unavail {
    position: absolute; inset: 0;
    display: flex; align-items: center; justify-content: center;
    background: rgba(250, 247, 240, 0.82); color: var(--sv-muted);
    font-size: 0.85rem; font-weight: 600; text-align: center; padding: 0.5rem;
}
.sv-mcard-body { padding: 0.9rem 0.95rem 0.4rem; flex: 1 1 auto; min-width: 0; }
.sv-mcard-name { font-size: 1.02rem; margin: 0 0 0.25rem; font-weight: 600; }
.sv-mcard-name a { color: var(--sv-ink); text-decoration: none; }
.sv-mcard-name a:hover { color: var(--sv-wine); }
.sv-mcard-meta { font-size: 0.85rem; color: var(--sv-muted); margin: 0 0 0.15rem; }
.sv-mcard-sub { font-size: 0.85rem; color: var(--sv-text); margin: 0; }
.sv-mcard-note { font-size: 0.82rem; color: var(--sv-muted); padding: 0.35rem 0; }
.sv-mcard-actions {
    display: flex; flex-wrap: wrap; align-items: center; gap: 0.45rem;
    padding: 0.75rem 0.95rem 0.95rem;
}
.sv-mcard-actions form { display: inline-flex; margin: 0; }
.sv-btn-icon {
    min-height: 38px; min-width: 38px;
    display: inline-flex; align-items: center; justify-content: center;
    border: 1px solid var(--sv-line); border-radius: var(--sv-radius-sm);
    background: var(--sv-white); color: var(--sv-wine); font-size: 1.05rem;
}
.sv-btn-icon:hover { background: var(--sv-ivory); color: var(--sv-wine-deep); }
.sv-btn-icon.is-saved { color: var(--sv-gold-deep); border-color: var(--sv-gold-soft); background: #FBF6EA; }

/* Interest state pills on cards */
.sv-state-pill {
    display: inline-flex; align-items: center; gap: 0.35rem;
    font-size: 0.76rem; font-weight: 600;
    border-radius: 999px; padding: 0.28rem 0.65rem; margin-top: 0.5rem;
}
.sv-state-pill i { font-size: 0.85em; }
.sv-state-pending { background: #FDF1E3; color: #B4771F; }
.sv-state-accepted { background: var(--sv-success-bg); color: var(--sv-success); }
.sv-state-declined { background: var(--sv-danger-bg); color: var(--sv-danger); }

.sv-results-count { color: var(--sv-muted); font-size: 0.92rem; }

/* -- Discover filter bar & chips ------------------------------------ */
.sv-filterbar-row {
    display: flex; flex-wrap: wrap; gap: 0.8rem 1.4rem;
    align-items: center; justify-content: space-between;
}
.sv-gender-chips, .sv-sort-chips { display: flex; flex-wrap: wrap; gap: 0.45rem; }
.sv-chip {
    display: inline-flex; align-items: center;
    border: 1px solid var(--sv-line); border-radius: 999px;
    padding: 0.34rem 0.85rem; font-size: 0.86rem; font-weight: 500;
    color: var(--sv-text); text-decoration: none; background: var(--sv-white);
    transition: all .15s ease;
}
.sv-chip:hover { border-color: var(--sv-wine-soft); color: var(--sv-wine); }
.sv-chip.is-active { background: var(--sv-wine); border-color: var(--sv-wine); color: #fff; }
.sv-filterbar-note { margin: 0.8rem 0 0; font-size: 0.85rem; color: var(--sv-muted); }
.sv-filterbar-note a { color: var(--sv-wine); font-weight: 500; }
.sv-matches-list { list-style: none; padding: 0; margin: 0; }
.sv-matches-list li { display: flex; gap: 0.5rem; align-items: flex-start; font-size: 0.9rem; color: var(--sv-text); margin-bottom: 0.3rem; }
.sv-matches-list i { color: var(--sv-success); margin-top: 0.15rem; }

/* -- Search form ----------------------------------------------------- */
.sv-search-form .form-label { font-size: 0.82rem; font-weight: 600; color: var(--sv-ink); margin-bottom: 0.25rem; }
.sv-search-form .form-select, .sv-search-form .form-control { font-size: 0.9rem; }
.sv-field-hint { font-size: 0.78rem; color: var(--sv-muted); margin: 0.25rem 0 0; }
.sv-save-search-form .form-control { min-width: 220px; }
.sv-saved-summary { color: var(--sv-muted); font-size: 0.86rem; }
.sv-saved-search .collapse form { max-width: 420px; }

/* -- Tabs (interests) ------------------------------------------------ */
.sv-tabs { display: flex; flex-wrap: wrap; gap: 0.5rem; border-bottom: 1px solid var(--sv-line); }
.sv-tab {
    display: inline-flex; align-items: center; gap: 0.4rem;
    padding: 0.6rem 1.05rem; font-size: 0.93rem; font-weight: 500;
    color: var(--sv-muted); text-decoration: none;
    border: 1px solid transparent; border-bottom: none;
    border-radius: var(--sv-radius-sm) var(--sv-radius-sm) 0 0;
    position: relative; top: 1px;
}
.sv-tab:hover { color: var(--sv-wine); }
.sv-tab.is-active { color: var(--sv-wine); border-color: var(--sv-line); background: var(--sv-white); }
.sv-tab-count {
    background: var(--sv-wine); color: #fff; border-radius: 999px;
    font-size: 0.72rem; font-weight: 600; padding: 0.1rem 0.5rem;
}

/* -- Member page action bar ------------------------------------------ */
.sv-actionbar-sep { border: none; border-top: 1px solid var(--sv-line-soft); margin: 1.4rem 0 1.1rem; }
.sv-actionbar-state { font-size: 0.95rem; padding: 0.85rem 1rem; border-radius: var(--sv-radius-sm); }
.sv-actionbar-connected { background: var(--sv-success-bg); color: var(--sv-success); }
.sv-actionbar-muted { background: var(--sv-ivory); color: var(--sv-muted); }
.sv-report-details { position: relative; }
.sv-report-details > summary {
    list-style: none; cursor: pointer;
    display: inline-flex; align-items: center;
    min-height: 38px; padding: 0.35rem 1rem; font-size: 0.92rem;
    border-radius: var(--sv-radius-sm);
}
.sv-report-details > summary::-webkit-details-marker { display: none; }
.sv-report-details[open] > summary { background: rgba(198, 161, 91, 0.12); }
.sv-report-panel {
    margin-top: 0.7rem; padding: 1rem;
    background: var(--sv-ivory); border: 1px solid var(--sv-line-soft);
    border-radius: var(--sv-radius-sm); max-width: 460px;
}
.sv-report-note { font-size: 0.84rem; color: var(--sv-text); }

/* -- Preference Match panel ------------------------------------------ */
.sv-match-panel { border-left: 4px solid var(--sv-gold); }
.sv-match-figure { text-align: right; }
.sv-match-pct {
    display: block; font-family: var(--sv-font-display);
    font-size: 2rem; color: var(--sv-wine); line-height: 1;
}
.sv-match-frac { font-size: 0.78rem; color: var(--sv-muted); }
.sv-match-list { list-style: none; padding: 0; margin: 0.6rem 0 0; }
.sv-match-item {
    display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem 0.7rem;
    padding: 0.5rem 0.2rem; border-top: 1px dashed var(--sv-line-soft);
    font-size: 0.9rem;
}
.sv-match-icon { font-size: 1rem; }
.sv-match-match .sv-match-icon { color: var(--sv-success); }
.sv-match-miss .sv-match-icon { color: var(--sv-danger); }
.sv-match-unknown .sv-match-icon { color: var(--sv-muted); }
.sv-match-label { font-weight: 600; color: var(--sv-ink); flex: 0 0 9.5rem; }
.sv-match-values { display: flex; flex-wrap: wrap; gap: 0.2rem 1rem; color: var(--sv-muted); font-size: 0.84rem; }
@media (max-width: 575.98px) {
    .sv-match-label { flex: 1 1 100%; }
    .sv-match-figure { text-align: left; }
}

/* -- Dashboard activity row + owner views ----------------------------- */
.sv-activity-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 0.8rem; }
.sv-activity-stat {
    display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.3rem 0.55rem;
    padding: 0.85rem 0.95rem; text-decoration: none;
    background: var(--sv-ivory); border: 1px solid var(--sv-line-soft);
    border-radius: var(--sv-radius-sm);
}
.sv-activity-stat i { color: var(--sv-gold-deep); font-size: 1.05rem; }
.sv-activity-stat strong { font-size: 1.15rem; color: var(--sv-ink); }
.sv-activity-stat span { flex-basis: 100%; font-size: 0.8rem; color: var(--sv-muted); }
.sv-activity-stat:hover { border-color: var(--sv-wine-soft); }
.sv-activity-stat.has-attention { border-color: var(--sv-gold); background: #FBF6EA; }
.sv-owner-views { font-size: 0.92rem; color: var(--sv-text); }

/* -- Sidebar nav headings (grouped navigation) ------------------------ */
.sv-dash-nav-heading {
    font-size: 0.7rem; font-weight: 700; letter-spacing: 0.09em;
    text-transform: uppercase; color: var(--sv-muted);
    margin: 1.15rem 0.6rem 0.35rem;
}
.sv-dash-nav-heading:first-child { margin-top: 0.2rem; }

/* =====================================================================
   Phase 4 · v1.3.0 — Dashboard welcome, overview cards, search groups,
   settings sections, notification centre refinements
   ===================================================================== */

/* -- Dashboard welcome hero ------------------------------------------- */
.sv-welcome {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
    gap: 1.4rem;
    background:
        radial-gradient(420px 200px at 92% -20%, rgba(198, 161, 91, 0.18), transparent 60%),
        var(--sv-white);
    border: 1px solid var(--sv-line-soft);
    border-radius: var(--sv-radius-lg);
    box-shadow: var(--sv-shadow);
    padding: 1.6rem 1.7rem;
    margin-bottom: 1.2rem;
}
.sv-welcome-main { display: flex; align-items: center; gap: 1.2rem; min-width: 0; }
.sv-welcome-avatar {
    width: 72px; height: 72px; flex: 0 0 72px;
    border-radius: 50%;
    background: linear-gradient(150deg, var(--sv-cream), var(--sv-ivory));
    border: 2px solid var(--sv-gold-soft);
    color: var(--sv-wine);
    font-family: var(--sv-font-head); font-size: 1.5rem; font-weight: 700;
    display: inline-flex; align-items: center; justify-content: center;
    overflow: hidden;
}
.sv-welcome-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sv-welcome-title {
    font-family: var(--sv-font-head); font-weight: 700;
    font-size: clamp(1.35rem, 3vw, 1.8rem); line-height: 1.2;
    color: var(--sv-ink); margin: 0 0 0.3rem;
}
.sv-welcome-msg { margin: 0; color: var(--sv-text); font-size: 0.95rem; max-width: 34rem; }
.sv-welcome-actions { display: flex; flex-wrap: wrap; gap: 0.6rem; margin-top: 0.9rem; }

/* Completion ring (SVG) */
.sv-welcome-ring { display: flex; flex-direction: column; align-items: center; gap: 0.35rem; flex: 0 0 auto; }
.sv-ring-track { fill: none; stroke: var(--sv-line-soft); stroke-width: 9; }
.sv-ring-fill {
    fill: none; stroke: var(--sv-gold); stroke-width: 9; stroke-linecap: round;
    transform: rotate(-90deg); transform-origin: 60px 60px;
    transition: stroke-dasharray 0.6s var(--sv-ease);
}
.sv-ring-num {
    font-family: var(--sv-font-head); font-size: 1.55rem; font-weight: 700;
    fill: var(--sv-ink); text-anchor: middle;
}
.sv-ring-label { font-size: 0.5rem; letter-spacing: 0.12em; text-transform: uppercase; fill: var(--sv-muted); text-anchor: middle; }
.sv-welcome-ring-link { font-size: 0.82rem; font-weight: 500; color: var(--sv-wine); text-decoration: none; }
.sv-welcome-ring-link:hover, .sv-welcome-ring-link:focus-visible { text-decoration: underline; }

@media (max-width: 575.98px) {
    .sv-welcome { padding: 1.25rem; }
    .sv-welcome-main { flex-direction: column; text-align: center; }
    .sv-welcome-msg { margin-inline: auto; }
    .sv-welcome-actions { justify-content: center; }
}

/* -- Dashboard overview cards ------------------------------------------ */
.sv-ov-grid {
    display: grid; gap: 0.8rem;
    grid-template-columns: repeat(auto-fit, minmax(158px, 1fr));
    margin-bottom: 0.55rem;
}
.sv-ov-card {
    display: flex; flex-direction: column; align-items: flex-start; gap: 0.2rem;
    background: var(--sv-white);
    border: 1px solid var(--sv-line-soft);
    border-radius: var(--sv-radius);
    box-shadow: var(--sv-shadow);
    padding: 1rem 1.1rem 0.95rem;
    text-decoration: none;
    min-height: 44px;
    transition: transform var(--sv-speed) var(--sv-ease), border-color var(--sv-speed) var(--sv-ease), box-shadow var(--sv-speed) var(--sv-ease);
}
.sv-ov-card:hover {
    transform: translateY(-2px);
    border-color: var(--sv-gold);
    box-shadow: 0 8px 22px rgba(44, 41, 38, 0.09);
}
.sv-ov-icon {
    width: 40px; height: 40px;
    border-radius: var(--sv-radius-sm);
    background: linear-gradient(150deg, rgba(198, 161, 91, 0.2), rgba(107, 31, 46, 0.07));
    color: var(--sv-wine); font-size: 1.15rem;
    display: inline-flex; align-items: center; justify-content: center;
    margin-bottom: 0.35rem;
}
.sv-ov-value { font-family: var(--sv-font-head); font-size: 1.65rem; font-weight: 700; line-height: 1.05; color: var(--sv-ink); }
.sv-ov-value[data-zero] { color: var(--sv-muted); }
.sv-ov-label { font-size: 0.86rem; font-weight: 500; color: var(--sv-text); }
.sv-ov-hint { font-size: 0.74rem; color: var(--sv-muted); }
.sv-ov-card.has-attention { border-color: var(--sv-gold); background: #FDFBF4; }
.sv-ov-card.has-attention .sv-ov-icon { background: rgba(198, 161, 91, 0.28); color: var(--sv-gold-deep); }
.sv-stats-note { font-size: 0.78rem; color: var(--sv-muted); margin: 0 0 1.1rem; }

/* -- Finish-your-profile chips ----------------------------------------- */
.sv-finish-chips { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.sv-chip-todo { border-style: dashed; border-color: var(--sv-gold-soft); color: var(--sv-text); }
.sv-chip-todo i { color: var(--sv-gold-deep); font-size: 0.8rem; }
.sv-chip-todo:hover { border-style: solid; background: #FBF6EA; color: var(--sv-wine); }
@media (max-width: 575.98px) {
    .sv-chip, .sv-chip-todo { padding: 0.55rem 0.95rem; min-height: 44px; }
}

/* -- Mini key/value list (dashboard side card) ------------------------- */
.sv-mini-kv { list-style: none; padding: 0; margin: 0.6rem 0 0; }
.sv-mini-kv li {
    display: flex; justify-content: space-between; align-items: baseline; gap: 1rem;
    padding: 0.5rem 0; border-bottom: 1px solid var(--sv-line-soft);
    font-size: 0.88rem;
}
.sv-mini-kv li:last-child { border-bottom: 0; }
.sv-mini-kv span { color: var(--sv-muted); }
.sv-mini-kv strong { color: var(--sv-ink); font-weight: 600; text-align: right; }

/* -- Notification centre ------------------------------------------------ */
.sv-ntf-group-title {
    font-size: 0.72rem; font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase;
    color: var(--sv-muted);
    margin: 1.4rem 0.6rem 0.4rem;
}
.sv-ntf-group-title:first-child { margin-top: 0.2rem; }
.sv-notice-list-lg li { flex-wrap: wrap; align-items: flex-start; }
.sv-ntf-actions { display: flex; flex-wrap: wrap; gap: 0.45rem; align-items: center; margin-left: auto; }
@media (max-width: 575.98px) {
    .sv-ntf-actions { flex-basis: 100%; margin-left: 3.4rem; }
}

/* -- Search: grouped filters + active-filter chips ---------------------- */
.sv-search-form .form-label { font-size: 0.82rem; font-weight: 500; }
.sv-field-hint { font-size: 0.76rem; color: var(--sv-muted); margin: 0.25rem 0 0; }
.sv-adv-filters { border-top: 1px dashed var(--sv-line); padding-top: 0.4rem; }
.sv-adv-filters > summary {
    cursor: pointer; user-select: none;
    font-weight: 600; font-size: 0.92rem; color: var(--sv-wine);
    padding: 0.55rem 0.2rem;
    min-height: 44px; display: flex; align-items: center;
    list-style: none;
}
.sv-adv-filters > summary::-webkit-details-marker { display: none; }
.sv-adv-filters > summary::after {
    content: "\F282"; /* chevron down */
    font-family: "bootstrap-icons";
    margin-left: auto; font-size: 0.85rem; color: var(--sv-muted);
    transition: transform var(--sv-speed) var(--sv-ease);
}
.sv-adv-filters[open] > summary::after { transform: rotate(180deg); }
.sv-adv-filters > summary:hover { color: var(--sv-wine-soft); }
.sv-adv-count {
    font-size: 0.68rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase;
    background: var(--sv-gold); color: var(--sv-white);
    border-radius: 999px; padding: 0.12rem 0.5rem; margin-left: 0.4rem;
}
.sv-field-search-sort { min-width: 11rem; }
.sv-active-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 0.45rem; }
.sv-active-filters-label { font-size: 0.8rem; font-weight: 600; color: var(--sv-muted); }
.sv-chip-active {
    background: rgba(107, 31, 46, 0.05);
    border-color: var(--sv-wine-soft);
    color: var(--sv-wine);
}
.sv-chip-active strong { font-weight: 600; }
.sv-chip-active:hover { background: var(--sv-wine); border-color: var(--sv-wine); color: var(--sv-white); }
.sv-chip-clear { border-style: dashed; color: var(--sv-muted); }
.sv-chip-clear:hover { color: var(--sv-danger); border-color: var(--sv-danger); }

/* -- Settings: section nav + safety list -------------------------------- */
.sv-group-nav {
    display: flex; flex-wrap: wrap; gap: 0.45rem;
    border-bottom: 1px solid var(--sv-line);
    padding-bottom: 0.75rem;
}
.sv-group-nav-link {
    display: inline-flex; align-items: center;
    font-size: 0.86rem; font-weight: 500;
    color: var(--sv-text); text-decoration: none;
    border: 1px solid var(--sv-line); border-radius: 999px;
    background: var(--sv-white);
    padding: 0.45rem 0.9rem; min-height: 44px;
    transition: all var(--sv-speed) var(--sv-ease);
}
.sv-group-nav-link:hover { border-color: var(--sv-wine-soft); color: var(--sv-wine); }
.sv-safety-list { list-style: none; padding: 0; margin: 0; }
.sv-safety-list li {
    display: flex; gap: 0.8rem; align-items: flex-start;
    padding: 0.9rem 0; border-bottom: 1px solid var(--sv-line-soft);
}
.sv-safety-list li:last-child { border-bottom: 0; }
.sv-safety-list > li > i { font-size: 1.15rem; color: var(--sv-gold-deep); margin-top: 0.15rem; }
.sv-safety-list strong { color: var(--sv-ink); display: block; margin-bottom: 0.2rem; }
.sv-safety-list a { color: var(--sv-wine); font-weight: 500; }

/* -- Member card: interest date ------------------------------------------ */
.sv-mcard-date {
    margin: 0.15rem 0 0; font-size: 0.76rem; color: var(--sv-muted);
    display: flex; align-items: center; gap: 0.3rem;
}

/* -- Sidebar safety note link ------------------------------------------- */
.sv-dash-side-note a { color: var(--sv-gold-soft); font-weight: 500; }
.sv-dash-side-note a:hover, .sv-dash-side-note a:focus-visible { color: #fff; }

/* -- Accessible focus outlines (Phase 4 accessibility pass) ------------- */
.sv-ov-card:focus-visible,
.sv-quick-action:focus-visible,
.sv-chip:focus-visible,
.sv-group-nav-link:focus-visible,
.sv-subnav-card:focus-visible,
.sv-mcard-photo:focus-visible,
.sv-adv-filters > summary:focus-visible {
    outline: 3px solid var(--sv-gold);
    outline-offset: 2px;
    border-radius: var(--sv-radius-sm);
}
@media (max-width: 575.98px) {
    .sv-quick-action { min-height: 72px; justify-content: center; }
    .sv-group-nav-link { flex: 1 1 auto; justify-content: center; }
}

/* =====================================================================
   Phase 5 · v1.4.0 — Inbox & private chat
   ===================================================================== */

/* -- Inbox: search + conversation list ---------------------------------- */
.sv-inbox-search { padding: 0.75rem; }
.sv-inbox-search .input-group-text { background: var(--sv-ivory); border-color: var(--sv-line); color: var(--sv-muted); }
.sv-inbox-search .form-control { border-left: 0; }
.sv-inbox-search .form-control:focus { box-shadow: none; border-color: var(--sv-line); }

.sv-convlist { list-style: none; padding: 0; margin: 0; display: grid; gap: 0.45rem; }
.sv-conv {
    display: flex; align-items: center; gap: 0.85rem;
    background: var(--sv-white);
    border: 1px solid var(--sv-line-soft);
    border-radius: var(--sv-radius);
    padding: 0.7rem 0.9rem;
    text-decoration: none;
    min-height: 72px;
    transition: border-color var(--sv-speed) var(--sv-ease), box-shadow var(--sv-speed) var(--sv-ease);
}
.sv-conv:hover, .sv-conv:focus-visible { border-color: var(--sv-gold); box-shadow: var(--sv-shadow); }
.sv-conv.is-unread { background: #FDFBF4; border-color: var(--sv-gold-soft); }
.sv-conv-avatar {
    width: 52px; height: 52px; flex: 0 0 52px;
    border-radius: 50%;
    background: linear-gradient(150deg, var(--sv-cream), var(--sv-ivory));
    border: 1.5px solid var(--sv-gold-soft);
    color: var(--sv-wine);
    font-weight: 700; font-size: 1rem;
    display: inline-flex; align-items: center; justify-content: center;
    overflow: hidden;
}
.sv-conv-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sv-conv-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 0.15rem; }
.sv-conv-top { display: flex; align-items: baseline; justify-content: space-between; gap: 0.6rem; }
.sv-conv-name { color: var(--sv-ink); font-weight: 600; font-size: 0.98rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sv-conv.is-unread .sv-conv-name { color: var(--sv-wine); }
.sv-conv-time { flex: 0 0 auto; font-size: 0.74rem; color: var(--sv-muted); }
.sv-conv-bottom { display: flex; align-items: center; justify-content: space-between; gap: 0.6rem; }
.sv-conv-preview { flex: 1 1 auto; min-width: 0; font-size: 0.85rem; color: var(--sv-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sv-conv.is-unread .sv-conv-preview { color: var(--sv-text); }
.sv-conv-new { color: var(--sv-gold-deep); font-style: italic; }
.sv-conv-badge {
    flex: 0 0 auto;
    background: var(--sv-wine); color: var(--sv-white);
    font-size: 0.72rem; font-weight: 700;
    border-radius: 999px; padding: 0.1rem 0.5rem;
}
.sv-conv-archived { flex: 0 0 auto; color: var(--sv-muted); font-size: 0.85rem; }
.sv-inbox-footnote { font-size: 0.78rem; color: var(--sv-muted); margin: 0.9rem 0 0; }
.sv-inbox-footnote a { color: var(--sv-wine); font-weight: 500; }

/* -- Chat window ---------------------------------------------------------- */
.sv-chat {
    display: flex; flex-direction: column;
    height: calc(100vh - 185px);
    height: calc(100dvh - 185px);
    min-height: 420px;
    max-width: 860px;
    background: var(--sv-white);
    border: 1px solid var(--sv-line-soft);
    border-radius: var(--sv-radius-lg);
    box-shadow: var(--sv-shadow);
    overflow: hidden;
}
.sv-chat-head {
    display: flex; align-items: center; gap: 0.7rem;
    padding: 0.6rem 0.8rem;
    background: var(--sv-white);
    border-bottom: 1px solid var(--sv-line);
}
.sv-chat-back {
    flex: 0 0 auto;
    width: 44px; height: 44px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 50%;
    color: var(--sv-wine); text-decoration: none; font-size: 1.1rem;
    transition: background var(--sv-speed) var(--sv-ease);
}
.sv-chat-back:hover, .sv-chat-back:focus-visible { background: var(--sv-cream); }
.sv-chat-peer-avatar {
    width: 44px; height: 44px; flex: 0 0 44px;
    border-radius: 50%;
    background: linear-gradient(150deg, var(--sv-cream), var(--sv-ivory));
    border: 1.5px solid var(--sv-gold-soft);
    color: var(--sv-wine); font-weight: 700; font-size: 0.9rem;
    display: inline-flex; align-items: center; justify-content: center;
    overflow: hidden;
}
.sv-chat-peer-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sv-chat-peer { min-width: 0; }
.sv-chat-peer-name { display: block; font-weight: 600; color: var(--sv-ink); text-decoration: none; font-size: 0.98rem; }
.sv-chat-peer-name:hover, .sv-chat-peer-name:focus-visible { color: var(--sv-wine); }
.sv-chat-peer-sub { font-size: 0.76rem; color: var(--sv-muted); }
.sv-chat-peer-sub a { color: var(--sv-wine); }
.sv-chat-muted-tag { color: var(--sv-warning); font-weight: 600; }

/* Chat options menu (native details — works without JS) */
.sv-chat-menu { position: relative; margin-left: auto; }
.sv-chat-menu > summary {
    list-style: none; cursor: pointer; user-select: none;
    width: 44px; height: 44px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 50%; color: var(--sv-text); font-size: 1.15rem;
}
.sv-chat-menu > summary::-webkit-details-marker { display: none; }
.sv-chat-menu > summary:hover, .sv-chat-menu[open] > summary { background: var(--sv-cream); color: var(--sv-wine); }
.sv-chat-menu-panel {
    position: absolute; right: 0; top: calc(100% + 0.35rem); z-index: 30;
    min-width: 230px;
    background: var(--sv-white);
    border: 1px solid var(--sv-line);
    border-radius: var(--sv-radius-sm);
    box-shadow: var(--sv-shadow-lg);
    padding: 0.35rem;
}
.sv-chat-menu-item {
    display: flex; align-items: center;
    width: 100%;
    background: none; border: 0; text-align: left;
    padding: 0.6rem 0.7rem; min-height: 44px;
    font-size: 0.88rem; font-weight: 500;
    color: var(--sv-text); text-decoration: none;
    border-radius: var(--sv-radius-sm);
    cursor: pointer;
}
.sv-chat-menu-item:hover, .sv-chat-menu-item:focus-visible { background: var(--sv-ivory); color: var(--sv-wine); }
.sv-chat-menu-sep { margin: 0.3rem 0; border-color: var(--sv-line-soft); opacity: 1; }
.sv-chat-report > summary { list-style: none; }
.sv-chat-report > summary::-webkit-details-marker { display: none; }
.sv-chat-report-form { padding: 0.5rem 0.7rem 0.7rem; border-top: 1px solid var(--sv-line-soft); margin-top: 0.25rem; }
.sv-chat-report-form .form-label { font-size: 0.78rem; font-weight: 600; color: var(--sv-text); }
.sv-chat-report-note { font-size: 0.72rem; color: var(--sv-muted); margin: 0.5rem 0 0; }

/* Message area */
.sv-chat-scroll {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 1rem 1rem 0.6rem;
    background:
        radial-gradient(600px 300px at 90% -10%, rgba(198, 161, 91, 0.08), transparent 60%),
        var(--sv-ivory);
    scroll-behavior: smooth;
}
.sv-chat-scroll-admin { height: 460px; min-height: 260px; flex: none; }
.sv-chat-older { display: block; margin: 0 auto 0.8rem; }
.sv-chat-empty { text-align: center; color: var(--sv-muted); padding: 2.2rem 1rem; font-size: 0.95rem; }
.sv-chat-empty i { font-size: 2rem; color: var(--sv-gold-soft); }
.sv-chat-list { display: flex; flex-direction: column; gap: 0.55rem; }

/* Bubbles */
.sv-msg { display: flex; flex-direction: column; align-items: flex-start; max-width: 86%; }
.sv-msg.mine { align-self: flex-end; align-items: flex-end; }
.sv-msg-bubble {
    padding: 0.5rem 0.8rem 0.35rem;
    border-radius: 16px;
    border-bottom-left-radius: 6px;
    background: var(--sv-white);
    border: 1px solid var(--sv-line);
    color: var(--sv-ink);
    font-size: 0.94rem;
    line-height: 1.45;
    box-shadow: 0 1px 3px rgba(44, 41, 38, 0.04);
    overflow-wrap: anywhere;
    white-space: normal;
}
.sv-msg.mine .sv-msg-bubble {
    background: var(--sv-wine);
    border-color: var(--sv-wine-deep);
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 6px;
    color: #FBF5EC;
}
.sv-msg-body { display: block; }
.sv-msg-hidden { display: block; font-style: italic; color: var(--sv-muted); font-size: 0.84rem; }
.sv-msg.mine .sv-msg-hidden { color: rgba(251, 245, 236, 0.75); }
.sv-msg-meta { display: flex; align-items: center; gap: 0.3rem; margin-top: 0.2rem; font-size: 0.68rem; color: var(--sv-muted); }
.sv-msg.mine .sv-msg-meta { color: rgba(251, 245, 236, 0.8); }
.sv-msg-tick { display: inline-flex; font-size: 0.78rem; }
.sv-msg-tick.is-read { color: var(--sv-gold-soft); }
.sv-msg-author { display: block; font-size: 0.7rem; font-weight: 700; color: var(--sv-gold-deep); margin-bottom: 0.15rem; }
.sv-msg-hide-form { margin-top: 0.15rem; }

/* Composer */
.sv-chat-composer {
    display: flex; align-items: flex-end; gap: 0.6rem;
    padding: 0.7rem 0.8rem 0.55rem;
    background: var(--sv-white);
    border-top: 1px solid var(--sv-line);
}
.sv-chat-composer .form-control {
    flex: 1 1 auto;
    resize: none;
    min-height: 44px; max-height: 140px;
    border-radius: 999px;
    padding: 0.6rem 1.05rem;
    line-height: 1.4;
}
.sv-chat-send {
    flex: 0 0 auto;
    height: 44px;
    border-radius: 999px;
    padding-inline: 1.1rem;
    display: inline-flex; align-items: center; justify-content: center;
}
.sv-chat-send.is-busy { opacity: 0.7; }
.sv-chat-hint { margin: 0; padding: 0 0.9rem 0.5rem; font-size: 0.7rem; color: var(--sv-muted); background: var(--sv-white); }
.sv-chat-composer-disabled {
    display: flex; align-items: center;
    color: var(--sv-text); font-size: 0.9rem;
    padding: 0.95rem 1rem;
    background: var(--sv-cream);
    border-top: 1px solid var(--sv-line);
}

/* Chat focus states */
.sv-chat-scroll:focus-visible, .sv-conv:focus-visible, .sv-chat-menu-item:focus-visible, .sv-chat-back:focus-visible {
    outline: 3px solid var(--sv-gold);
    outline-offset: 2px;
}

@media (max-width: 575.98px) {
    .sv-chat { height: calc(100vh - 175px); height: calc(100dvh - 175px); border-radius: var(--sv-radius); }
    .sv-msg { max-width: 92%; }
    .sv-chat-scroll { padding: 0.8rem 0.7rem 0.5rem; }
    .sv-chat-send span { display: none !important; }
    .sv-chat-send { padding-inline: 0.95rem; }
    .sv-chat-hint { display: none; }
    .sv-conv { min-height: 68px; }
}

/* =====================================================================
   Phase 6 — Membership, plans, checkout, receipts & admin payments
   ===================================================================== */

.sv-membership-current-icon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 56px; height: 56px; border-radius: 50%;
    background: linear-gradient(135deg, var(--sv-gold, #C6A15B), #a9853f);
    color: #fff; font-size: 1.5rem; flex: 0 0 auto;
}
.sv-benefit-card { text-align: center; padding: 1.25rem 1rem; }
.sv-benefit-card i { font-size: 1.6rem; color: var(--sv-wine, #6B1F2E); }
.sv-benefit-card h3 { font-size: 1rem; font-weight: 600; margin: 0.5rem 0 0.25rem; }
.sv-benefit-card p { font-size: 0.85rem; color: var(--sv-muted, #6c655c); }

.sv-plan-card { position: relative; display: flex; flex-direction: column; }
.sv-plan-note { font-size: 0.78rem; color: var(--sv-muted, #6c655c); margin: 0.5rem 0 0; text-align: center; }
.sv-plan-card .btn { margin-top: auto; }

/* Payment status pills */
.sv-pay-created { background: #eef1f6; color: #4a5568; }
.sv-pay-pending { background: #fff4e0; color: #92600a; }
.sv-pay-paid { background: #e6f6ec; color: #1c7c3c; }
.sv-pay-failed, .sv-pay-expired { background: #fdeaea; color: #a12626; }
.sv-pay-refunded, .sv-pay-partially_refunded { background: #ede7f6; color: #5e35b1; }
.sv-pay-initiated { background: #e8eaf6; color: #3949ab; }
.sv-pay-processed { background: #e6f6ec; color: #1c7c3c; }

/* Comparison table — scrolls sideways on phones, first column sticks */
.sv-compare-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.sv-compare-table th[scope="row"] { white-space: nowrap; }
.sv-compare-table thead th { position: static; }
@media (max-width: 575.98px) {
    .sv-compare-table th[scope="row"], .sv-compare-table td:first-child {
        position: sticky; left: 0; background: var(--sv-cream, #F3EDE1); z-index: 1;
    }
    .sv-compare-table td, .sv-compare-table th { white-space: nowrap; }
}
.sv-compare-table .sv-col-premium { color: var(--sv-wine, #6B1F2E); }

/* Featured (premium highlight) member card */
.sv-mcard.is-featured { border: 2px solid var(--sv-gold, #C6A15B); box-shadow: 0 6px 18px rgba(198, 161, 91, 0.25); }
.sv-mcard-featured {
    position: absolute; top: 0.5rem; left: 0.5rem; z-index: 2;
    background: linear-gradient(135deg, var(--sv-gold, #C6A15B), #a9853f);
    color: #fff; font-size: 0.7rem; font-weight: 600; letter-spacing: 0.02em;
    padding: 0.15rem 0.5rem; border-radius: 999px; display: inline-flex; align-items: center; gap: 0.25rem;
}
.sv-mcard-featured i { font-size: 0.65rem; }

/* Checkout */
.sv-checkout-card { position: sticky; top: 1rem; }
.sv-sim-badge {
    display: inline-block; font-size: 0.78rem; font-weight: 600;
    background: repeating-linear-gradient(45deg, #fdf3d7, #fdf3d7 8px, #f7e6b8 8px, #f7e6b8 16px);
    color: #8a6d1a; border: 1px dashed #c9a743; border-radius: 6px; padding: 0.3rem 0.6rem;
}
.sv-dl-rows { margin: 0; }
.sv-dl-rows > div { display: flex; justify-content: space-between; gap: 1rem; padding: 0.55rem 0; border-bottom: 1px dashed rgba(108, 101, 92, 0.25); }
.sv-dl-rows > div:last-child { border-bottom: 0; }
.sv-dl-rows dt { color: var(--sv-muted, #6c655c); font-weight: 500; }
.sv-dl-rows dd { margin: 0; text-align: right; }

/* Receipt */
.sv-receipt-wrap { max-width: 720px; margin: 0 auto; }
.sv-receipt { padding: 2rem; }
.sv-receipt-head { display: flex; justify-content: space-between; gap: 1rem; border-bottom: 2px solid var(--sv-wine, #6B1F2E); padding-bottom: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.sv-receipt-title { font-family: var(--sv-font-display, serif); font-size: 1.5rem; margin: 0; }
.sv-receipt-sub { margin: 0.15rem 0 0; color: var(--sv-muted, #6c655c); font-size: 0.9rem; }
.sv-receipt-no { margin: 0; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--sv-muted, #6c655c); }
.sv-receipt-note { font-size: 0.82rem; color: var(--sv-muted, #6c655c); margin: 1.25rem 0 0; }
.sv-receipt-actions { margin-top: 1rem; }
@media print {
    .sv-receipt-actions, .sv-dash-topbar, .sv-dash-sidebar, .sv-dash-backdrop, .sv-flash, footer { display: none !important; }
    .sv-receipt-wrap { margin: 0; }
    .sv-card { box-shadow: none; border: 1px solid #ccc; }
}

/* Admin membership bits */
.sv-admin-narrow { max-width: 860px; }
.sv-admin-subhead { font-size: 1rem; font-weight: 600; }
.sv-admin-note { font-size: 0.85rem; color: var(--sv-muted, #6c655c); margin-top: 0.75rem; }
.sv-admin-warn { border-left: 4px solid #c9a743; }
.sv-row-inactive { opacity: 0.55; }
.sv-admin-action-pop {
    position: absolute; z-index: 30; right: 0; top: 100%;
    background: #fff; border: 1px solid rgba(0,0,0,0.12); border-radius: 10px;
    padding: 0.75rem; min-width: 300px; box-shadow: 0 10px 28px rgba(0,0,0,0.16);
}
.sv-admin-inline-details { position: relative; }
.sv-admin-inline-details summary { list-style: none; cursor: pointer; }
.sv-admin-inline-details summary::-webkit-details-marker { display: none; }
.sv-ext-days { width: 74px; }
.sv-refund-row { border-bottom: 1px dashed rgba(0,0,0,0.12); padding: 0.5rem 0; }
.sv-refund-row:last-of-type { border-bottom: 0; }
.sv-mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.85em; }
.sv-timeline-list { list-style: none; margin: 0; padding: 0; }
.sv-timeline-list li { display: flex; gap: 1rem; padding: 0.4rem 0; border-bottom: 1px dashed rgba(108, 101, 92, 0.2); font-size: 0.88rem; }
.sv-timeline-list li:last-child { border-bottom: 0; }
.sv-timeline-date { flex: 0 0 110px; color: var(--sv-muted, #6c655c); }
@media (max-width: 991.98px) { .sv-admin-navlinks { flex-wrap: wrap; row-gap: 0.35rem; } }

/* =====================================================================
   Phase 7 — admin shell: sidebar + topbar
   ===================================================================== */
.sv-admin-shelled { }
.sv-admin-sidebar {
    position: fixed; top: 0; left: 0; bottom: 0; width: 250px; z-index: 1045;
    background: linear-gradient(175deg, var(--sv-wine-deep, #3D1017), var(--sv-wine, #6B1F2E));
    color: #fff; display: flex; flex-direction: column;
    transform: translateX(-100%); transition: transform 0.2s ease;
    box-shadow: 0 0 32px rgba(0,0,0,0.28);
}
.sv-admin-sidebar.is-open { transform: translateX(0); }
.sv-admin-brand { display: flex; align-items: center; gap: 0.6rem; padding: 0.9rem 1rem 0.7rem; border-bottom: 1px solid rgba(255,255,255,0.14); }
.sv-admin-brand-text { color: #fff; font-family: var(--sv-font-display, serif); font-size: 1.05rem; line-height: 1.05; }
.sv-admin-brand-text small { display: block; font-family: var(--sv-font-body, sans-serif); font-size: 0.66rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--sv-gold, #C6A15B); }
.sv-admin-side-nav { flex: 1 1 auto; overflow-y: auto; padding: 0.6rem 0.55rem 1rem; }
.sv-admin-side-group { margin-bottom: 0.85rem; }
.sv-admin-side-heading { font-size: 0.64rem; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(243,231,206,0.55); margin: 0 0 0.25rem 0.6rem; }
.sv-admin-side-link {
    display: flex; align-items: center; gap: 0.6rem; padding: 0.42rem 0.6rem; border-radius: 8px;
    color: rgba(255,255,255,0.82); text-decoration: none; font-size: 0.88rem; margin-bottom: 1px;
}
.sv-admin-side-link i { font-size: 0.95rem; width: 1.15rem; text-align: center; opacity: 0.85; }
.sv-admin-side-link:hover { background: rgba(255,255,255,0.09); color: #fff; }
.sv-admin-side-link.is-active { background: rgba(198,161,91,0.22); color: #fff; box-shadow: inset 2.5px 0 0 var(--sv-gold, #C6A15B); }
.sv-admin-side-link .badge { font-size: 0.62rem; }
.sv-admin-side-foot { border-top: 1px solid rgba(255,255,255,0.14); padding: 0.65rem 1rem; display: flex; align-items: center; justify-content: space-between; }
.sv-admin-side-logout { color: rgba(255,255,255,0.75); font-size: 0.8rem; text-decoration: none; }
.sv-admin-side-logout:hover { color: #fff; }
.sv-admin-backdrop { position: fixed; inset: 0; background: rgba(24,16,18,0.55); z-index: 1044; }
.sv-admin-wrap { min-height: 100vh; display: flex; flex-direction: column; }
.sv-admin-main { flex: 1 1 auto; width: 100%; }
@media (min-width: 992px) {
    .sv-admin-sidebar { transform: translateX(0); }
    .sv-admin-wrap { margin-left: 250px; }
    .sv-admin-backdrop { display: none !important; }
    .sv-admin-burger { display: none; }
}
.sv-admin-burger {
    background: rgba(255,255,255,0.12); border: 0; color: #fff; font-size: 1.25rem;
    border-radius: 8px; padding: 0.2rem 0.55rem; line-height: 1.3;
}
.sv-admin-page-title { font-size: 1.02rem; font-weight: 600; color: #fff; margin: 0; letter-spacing: 0.01em; }
.sv-admin-quicksearch { position: relative; }
.sv-admin-quicksearch i { position: absolute; left: 0.6rem; top: 50%; transform: translateY(-50%); color: rgba(255,255,255,0.6); font-size: 0.85rem; }
.sv-admin-quicksearch input {
    background: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.22); color: #fff;
    border-radius: 999px; padding: 0.3rem 0.85rem 0.3rem 2rem; font-size: 0.85rem; width: 190px;
}
.sv-admin-quicksearch input::placeholder { color: rgba(255,255,255,0.55); }
.sv-admin-quicksearch input:focus { background: rgba(255,255,255,0.18); color: #fff; outline: 0; border-color: var(--sv-gold, #C6A15B); box-shadow: none; }
.sv-admin-bell { position: relative; color: #fff; font-size: 1.1rem; text-decoration: none; padding: 0.25rem 0.4rem; }
.sv-admin-bell-dot {
    position: absolute; top: -0.1rem; right: -0.15rem; background: #d9534f; color: #fff;
    font-size: 0.62rem; font-weight: 600; border-radius: 999px; padding: 0.05rem 0.32rem;
}
.sv-admin-user { background: transparent; border: 0; display: flex; align-items: center; gap: 0.5rem; color: #fff; }
.sv-admin-user-avatar {
    display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px;
    border-radius: 50%; background: var(--sv-gold, #C6A15B); color: var(--sv-wine-deep, #3D1017);
    font-weight: 700; font-size: 0.8rem;
}
.sv-admin-user-name { display: block; font-size: 0.84rem; font-weight: 600; line-height: 1.1; }
.sv-admin-user-role { display: block; font-size: 0.68rem; color: rgba(255,255,255,0.7); }
.sv-admin-menu { font-size: 0.9rem; }
.sv-admin-wrap-bare .sv-admin-main { max-width: 1240px; margin: 0 auto; }
.sv-admin-wrap-bare { margin-left: 0; }

/* Admin misc Phase 7 */
.sv-admin-side-note { font-size: 0.8rem; color: var(--sv-muted, #6c655c); }
.sv-admin-kv { margin: 0; }
.sv-admin-kv > div { display: flex; justify-content: space-between; gap: 1rem; padding: 0.45rem 0; border-bottom: 1px dashed rgba(108,101,92,0.22); font-size: 0.9rem; }
.sv-admin-kv > div:last-child { border-bottom: 0; }
.sv-admin-kv dt { color: var(--sv-muted, #6c655c); }
.sv-admin-kv dd { margin: 0; text-align: right; font-weight: 500; }
.sv-admin-badge-role { background: rgba(107,31,46,0.1); color: var(--sv-wine, #6B1F2E); border: 1px solid rgba(107,31,46,0.25); border-radius: 999px; font-size: 0.72rem; font-weight: 600; padding: 0.12rem 0.55rem; }
.sv-chart-legend { display: flex; flex-wrap: wrap; gap: 0.35rem 0.9rem; font-size: 0.78rem; color: var(--sv-muted, #6c655c); }
.sv-chart-legend i { width: 10px; height: 10px; border-radius: 2px; display: inline-block; margin-right: 0.35rem; }
.sv-bar-row { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.4rem; font-size: 0.85rem; }
.sv-bar-row-label { flex: 0 0 150px; text-align: right; color: var(--sv-muted, #6c655c); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sv-bar-row-track { flex: 1 1 auto; background: rgba(108,101,92,0.12); border-radius: 5px; height: 14px; }
.sv-bar-row-fill { height: 14px; border-radius: 5px; background: linear-gradient(90deg, var(--sv-wine, #6B1F2E), var(--sv-gold, #C6A15B)); min-width: 2px; }
.sv-admin-tabs .nav-link { color: var(--sv-muted, #6c655c); font-weight: 600; font-size: 0.9rem; border: 0; border-bottom: 2.5px solid transparent; border-radius: 0; padding: 0.5rem 0.9rem; }
.sv-admin-tabs .nav-link.active { color: var(--sv-wine, #6B1F2E); border-bottom-color: var(--sv-gold, #C6A15B); background: transparent; }
.sv-note-list { list-style: none; margin: 0; padding: 0; }
.sv-note-list li { border-left: 3px solid var(--sv-gold, #C6A15B); background: rgba(198,161,91,0.08); padding: 0.5rem 0.75rem; border-radius: 0 8px 8px 0; margin-bottom: 0.5rem; font-size: 0.86rem; }
.sv-note-meta { font-size: 0.74rem; color: var(--sv-muted, #6c655c); }
@media (max-width: 575.98px) { .sv-bar-row-label { flex-basis: 100px; } }
.sv-pill-rejected { background: #F6E3E0; color: #8C2F1F; }

/* ------------------------------------------------------------------ */
/* Phase 7 — charts, safety hub, users, settings, content admin        */
/* ------------------------------------------------------------------ */
.sv-chart-card{margin-bottom:1rem}
.sv-chart-total{font-weight:600;font-size:.95rem}
.sv-chart-card svg{width:100%;height:170px;display:block;margin-top:.5rem}
.sv-chart-empty{padding:2.25rem 1rem;text-align:center;color:#6b7280;font-size:.9rem}
.sv-chart-axis{display:flex;justify-content:space-between;color:#6b7280;font-size:.75rem;margin-top:.25rem}
.sv-range-bar{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-bottom:1.25rem}
.sv-range-chip{display:inline-block;padding:.35rem .85rem;border-radius:999px;border:1px solid var(--sv-border,#e5e7eb);color:#4b5563;text-decoration:none;font-size:.875rem;font-weight:500;background:#fff}
.sv-range-chip:hover{border-color:#7c3aed;color:#5b21b6}
.sv-range-chip.active{background:#5b21b6;border-color:#5b21b6;color:#fff}
.sv-range-form{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.sv-range-form input{max-width:150px}
.sv-admin-tabs{display:flex;flex-wrap:wrap;gap:.25rem;border-bottom:1px solid var(--sv-border,#e5e7eb);margin-bottom:1.25rem}
.sv-admin-tab{padding:.55rem .95rem;text-decoration:none;color:#4b5563;font-weight:500;font-size:.9rem;border-bottom:2px solid transparent;margin-bottom:-1px}
.sv-admin-tab:hover{color:#5b21b6}
.sv-admin-tab.active{color:#5b21b6;border-bottom-color:#5b21b6}
.sv-dist-row{display:flex;align-items:center;gap:.75rem;padding:.45rem 0;border-bottom:1px dashed #eef0f4}
.sv-dist-row:last-child{border-bottom:0}
.sv-dist-name{flex:0 0 42%;font-size:.9rem;color:#374151;word-break:break-word}
.sv-dist-bar{flex:1;height:10px;border-radius:6px;background:#eef0f4;overflow:hidden}
.sv-dist-fill{height:100%;border-radius:6px;background:linear-gradient(90deg,#7c3aed,#a78bfa)}
.sv-dist-val{flex:0 0 84px;text-align:right;font-weight:600;font-size:.9rem}
.sv-kv-note{background:#fffbeb;border:1px solid #fde68a;border-radius:10px;padding:.75rem 1rem;font-size:.875rem;color:#78350f}
.sv-report-reason{background:#f8fafc;border:1px solid #e5e7eb;border-radius:8px;padding:.5rem .75rem;font-size:.875rem}
.sv-form-label{font-weight:600;font-size:.875rem;margin-bottom:.35rem;display:block}
.sv-form-hint{font-size:.78rem;color:#6b7280;margin-top:.25rem}
.sv-switch{display:flex;gap:.6rem;align-items:flex-start;padding:.65rem .9rem;border:1px solid var(--sv-border,#e5e7eb);border-radius:10px;background:#fff}
.sv-switch input{margin-top:.2rem}
.sv-story-photo{width:86px;height:64px;object-fit:cover;border-radius:8px;border:1px solid #e5e7eb}
.sv-preview-box{border:2px dashed #ddd6fe;background:#faf5ff;border-radius:12px;padding:1.25rem}
.sv-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.85em}
.sv-quick-actions .btn+.btn{margin-left:.4rem}
@media (max-width:575.98px){.sv-admin-tab{padding:.45rem .6rem;font-size:.82rem}.sv-dist-name{flex-basis:36%}}
.sv-link-quiet{font-size:.8rem;font-weight:600;color:#6d28d9;text-decoration:none}
.sv-link-quiet:hover{color:#5b21b6;text-decoration:underline}
.sv-note-list li{display:flex;gap:.6rem;align-items:flex-start}
.sv-note-list li>i{color:#b08d2f;margin-top:.15rem}
.sv-note-list li>div{display:flex;flex-direction:column}
.sv-note-text{color:#374151}
.sv-note-time{font-size:.72rem;color:#9ca3af;margin-top:.1rem}
.sv-notif-icon{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#5b21b6,#7c3aed);color:#fff;flex:0 0 34px;font-size:1rem}
.sv-status-warn{background:#fffbeb !important;color:#92400e !important;border-color:#fde68a !important}
/* Phase 7 — status pills for account & report statuses */
.sv-pill-active { background: var(--sv-success-bg, #E7F4EC); color: var(--sv-success, #0E9F6E); }
.sv-pill-deletion_requested { background: #FBEDEB; color: #B3402F; }
.sv-pill-deleted { background: #F1EEE7; color: #6c655c; }
.sv-pill-new { background: #FBEDEB; color: #B3402F; }
.sv-pill-reviewing { background: #FDF1E3; color: #B4771F; }
.sv-pill-action_taken { background: #E5F0FA; color: #2C5E9E; }
.sv-pill-resolved { background: #E7F4EC; color: #0E9F6E; }
.sv-pill-dismissed { background: #F1EEE7; color: #6c655c; }
.sv-pill-paid, .sv-pill-successful { background: #E7F4EC; color: #0E9F6E; }
.sv-pill-pending, .sv-pill-created { background: #FDF1E3; color: #B4771F; }
.sv-pill-failed { background: #FBEDEB; color: #B3402F; }
.sv-pill-refunded { background: #F6E3E0; color: #8C2F1F; }
.sv-pill-partially_refunded { background: #FDF1E3; color: #B4771F; }
.sv-pill-expired { background: #F1EEE7; color: #6c655c; }
.sv-pill-cancelled { background: #F1EEE7; color: #6c655c; }

/* ---------------------------------------------------------------------
   Phase 8 — Profile verification, trust & safety
--------------------------------------------------------------------- */
.sv-verif-count {
    display: inline-flex; align-items: center; gap: 0.5rem;
    padding: 0.5rem 1rem; border-radius: 999px;
    background: var(--sv-cream, #F6F1E7); border: 1px solid var(--sv-line, #E8E0D0);
    font-weight: 600; font-size: 0.92rem; color: var(--sv-wine, #6B1F2E);
}
.sv-verif-count i { color: var(--sv-gold-deep, #9C7B3E); }
.sv-verif-info-icon { color: var(--sv-gold-deep, #9C7B3E); font-size: 1.15rem; flex-shrink: 0; margin-top: 0.1rem; }
.sv-verif-type-icon { color: var(--sv-wine, #6B1F2E); font-size: 1.15rem; }
.sv-verif-done {
    display: flex; align-items: flex-start; gap: 0.5rem;
    background: var(--sv-success-bg, #E7F4EC); color: var(--sv-success, #0E9F6E);
    border: 1px solid rgba(46, 125, 91, 0.25); border-radius: var(--sv-radius-sm, 10px);
    padding: 0.7rem 0.9rem; font-size: 0.9rem; font-weight: 500;
}
.sv-verif-done i { margin-top: 0.12rem; flex-shrink: 0; }
.sv-verif-reason {
    display: flex; align-items: flex-start; gap: 0.5rem;
    background: #FBF3E4; color: #9A7B33; border: 1px solid rgba(154, 123, 51, 0.25);
    border-radius: var(--sv-radius-sm, 10px); padding: 0.7rem 0.9rem; font-size: 0.9rem;
}
.sv-verif-reason i { margin-top: 0.12rem; flex-shrink: 0; }
.sv-verif-footnote {
    font-size: 0.85rem; color: var(--sv-muted, #6c655c);
    padding: 0.9rem 1.1rem; border: 1px dashed var(--sv-line, #E8E0D0); border-radius: var(--sv-radius-sm, 10px);
    background: var(--sv-ivory, #FAF7F0);
}
.sv-verif-footnote a { color: var(--sv-wine, #6B1F2E); }
.sv-verif-result-icon { font-size: 3rem; margin-bottom: 0.75rem; }
.sv-verif-result-icon.is-ok { color: var(--sv-success, #0E9F6E); }
.sv-verif-result-icon.is-err { color: var(--sv-danger, #B3402F); }
.sv-otp-input { max-width: 180px; letter-spacing: 0.35em; font-weight: 600; text-align: center; }
.sv-safety-list { margin: 0; padding-left: 1.1rem; display: grid; gap: 0.45rem; font-size: 0.92rem; color: var(--sv-ink, #2A2723); }
.sv-safety-list li::marker { color: var(--sv-gold-deep, #9C7B3E); }

/* Trust badges (member cards, profiles, admin) — meaning per badge,
   wording chosen to describe exactly what was checked. */
.sv-vbadges { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.sv-vbadge {
    display: inline-flex; align-items: center; gap: 0.3rem;
    font-size: 0.72rem; font-weight: 600; letter-spacing: 0.02em;
    padding: 0.18rem 0.55rem; border-radius: 999px; border: 1px solid;
    cursor: help; text-decoration: none;
}
.sv-vbadge i { font-size: 0.85em; }
.sv-vbadge-email { background: #EAF1FA; color: #2C5E9E; border-color: rgba(44, 94, 158, 0.3); }
.sv-vbadge-phone { background: #E7F4EC; color: #2E7D5B; border-color: rgba(46, 125, 91, 0.3); }
.sv-vbadge-photo { background: #F3EDFA; color: #6B4FA3; border-color: rgba(107, 79, 163, 0.3); }
.sv-vbadge-identity { background: #F6EDE7; color: #8C5A2B; border-color: rgba(140, 90, 43, 0.3); }
.sv-vbadge:hover, .sv-vbadge:focus-visible { filter: brightness(0.96); }
.sv-mcard-vbadges { margin-top: 0.35rem; }
.sv-member-vbadges { margin: 0.4rem 0 0.1rem; }
.sv-member-badge-note {
    font-size: 0.82rem; color: var(--sv-muted, #6c655c); margin: 0.65rem 0 0;
    padding: 0.55rem 0.85rem; border-radius: var(--sv-radius-sm, 10px);
    background: var(--sv-ivory, #FAF7F0); border: 1px dashed var(--sv-line, #E8E0D0);
}
.sv-member-badge-note a { color: var(--sv-wine, #6B1F2E); }
.sv-vbadge-none { background: #F1EEE7; color: #6c655c; border-color: #E8E0D0; }