/* ═══════════════════════════════════════════════════════════════
   Profile App — Shared design system for all profile service pages
   Scope: .profile-app (added to .profile-layout__content on each page)
   Loads alongside profile-settings.css; does NOT replace it.
   Strategy:
     1. Cascade --primary-color → var(--navy) so legacy page CSS using
        var(--primary-color, #002937) instantly aligns with brand.
     2. Provide modern shared components (.pa-*) that pages opt into.
     3. Each page may keep its namespaced classes (.wl-*, .snt-*, etc.)
        for behavior; page-specific tokenization migrates incrementally.
   STYLE_VERSION: 4.87
   ═══════════════════════════════════════════════════════════════ */

.profile-app {
    /* Brand cascade — legacy CSS that reads var(--primary-color, #002937)
       now resolves to our canonical navy. Zero blade edits required. */
    --primary-color: var(--navy, #152D50);

    /* Categorical icon palette (mirrors profile-dashboard) */
    --pa-info-bg:    rgba(59, 130, 246, 0.12);
    --pa-info-fg:    #3B82F6;
    --pa-success-bg: rgba(16, 163, 127, 0.12);
    --pa-success-fg: #10A37F;
    --pa-warn-bg:    rgba(245, 158, 11, 0.12);
    --pa-warn-fg:    #F59E0B;
    --pa-danger-bg:  rgba(239, 68, 68, 0.12);
    --pa-danger-fg:  #EF4444;
    --pa-purple-bg:  rgba(139, 92, 246, 0.12);
    --pa-purple-fg:  #8B5CF6;

    /* Surfaces */
    --pa-surface:        var(--bg-card, #FFFFFF);
    --pa-surface-soft:   var(--bg-subtle, #F8FAFC);
    --pa-surface-muted:  var(--bg-muted, #F1F5F9);
    --pa-border:         var(--border, #DDE5EF);
    --pa-border-light:   var(--border-light, #EBF0F7);
    --pa-border-strong:  var(--border-strong, #C4D0E0);

    /* Radii */
    --pa-r-sm: 12px;
    --pa-r-md: 16px;
    --pa-r-lg: 20px;
    --pa-r-xl: 24px;

    /* Shadows */
    --pa-shadow-sm: 0 1px 3px rgba(21, 45, 80, 0.06), 0 1px 2px rgba(21, 45, 80, 0.04);
    --pa-shadow-md: 0 4px 12px rgba(21, 45, 80, 0.07), 0 2px 4px rgba(21, 45, 80, 0.05);
    --pa-shadow-lg: 0 12px 28px rgba(21, 45, 80, 0.10), 0 4px 8px rgba(21, 45, 80, 0.06);
    --pa-shadow-glow: 0 0 0 4px rgba(14, 124, 123, 0.12);

    color: var(--text, #1A2B45);
}

/* ═══════════════════════════════════════════════════════════════
   PAGE HEAD — replaces ad-hoc head/hero on every page
   ═══════════════════════════════════════════════════════════════ */
.profile-app .pa-page-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-block-end: 20px;
    padding-block-end: 16px;
    border-block-end: 1px solid var(--pa-border-light);
    flex-wrap: wrap;
}
.profile-app .pa-page-head__title {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-size: clamp(1.15rem, 2.2vw, 1.4rem);
    font-weight: var(--font-extrabold, 800);
    color: var(--navy, #152D50);
    margin: 0;
    letter-spacing: -0.01em;
}
.profile-app .pa-page-head__title-bar {
    width: 5px;
    height: 26px;
    border-radius: 3px;
    background: linear-gradient(180deg, var(--teal, #0E7C7B), var(--teal-light, #12A09E));
    flex-shrink: 0;
}
.profile-app .pa-page-head__sub {
    font-size: 0.88rem;
    color: var(--text-muted, #5E7A95);
    margin-block-start: 4px;
    line-height: 1.5;
}
.profile-app .pa-page-head__actions {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

/* ═══════════════════════════════════════════════════════════════
   CARD — modern surface
   ═══════════════════════════════════════════════════════════════ */
.profile-app .pa-card {
    background: var(--pa-surface);
    border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-md);
    padding: 20px;
    box-shadow: var(--pa-shadow-sm);
    margin-block-end: 16px;
}
.profile-app .pa-card--inset { background: var(--pa-surface-soft); }
.profile-app .pa-card--bare {
    background: transparent;
    border: 0;
    box-shadow: none;
    padding: 0;
}

/* ═══════════════════════════════════════════════════════════════
   TABS / PILLS  (data tabs, filter pills, watchlist selectors)
   ═══════════════════════════════════════════════════════════════ */
.profile-app .pa-tabs {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-block-end: 16px;
    align-items: center;
}
.profile-app .pa-tab {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: var(--font-bold, 700);
    border: 1px solid transparent;
    background: var(--pa-surface-muted);
    color: var(--text-mid, #3D5A7A);
    text-decoration: none;
    cursor: pointer;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
    white-space: nowrap;
    line-height: 1.3;
}
.profile-app .pa-tab:hover {
    background: var(--pa-border-light);
    color: var(--navy, #152D50);
}
.profile-app .pa-tab.is-active,
.profile-app .pa-tab.active {
    background: var(--navy, #152D50);
    color: var(--text-on-navy, #fff);
    border-color: var(--navy, #152D50);
}
.profile-app .pa-tab__count {
    background: rgba(0, 0, 0, 0.10);
    padding: 1px 8px;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: var(--font-extrabold, 800);
    min-width: 22px;
    text-align: center;
}
.profile-app .pa-tab.is-active .pa-tab__count,
.profile-app .pa-tab.active .pa-tab__count {
    background: rgba(255, 255, 255, 0.20);
}

/* "Outlined" pill variant (for watchlist selector etc.) */
.profile-app .pa-tab--outlined {
    background: var(--pa-surface);
    border: 1px solid var(--pa-border);
    color: var(--text-mid, #3D5A7A);
}
.profile-app .pa-tab--outlined:hover {
    border-color: var(--pa-border-strong);
    color: var(--navy, #152D50);
}

/* "New" pill (dashed, add action) */
.profile-app .pa-tab--add {
    background: transparent;
    border: 1px dashed var(--pa-border-strong);
    color: var(--text-muted, #5E7A95);
}
.profile-app .pa-tab--add:hover {
    border-color: var(--teal, #0E7C7B);
    color: var(--teal, #0E7C7B);
    background: var(--teal-bg, #EBF7F7);
}

/* ═══════════════════════════════════════════════════════════════
   ADD-BAR (inline form: input + button)
   ═══════════════════════════════════════════════════════════════ */
.profile-app .pa-addbar {
    display: flex;
    gap: 10px;
    align-items: center;
    background: var(--pa-surface);
    border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-md);
    padding: 14px 18px;
    margin-block-end: 16px;
    position: relative;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.profile-app .pa-addbar:focus-within {
    border-color: var(--teal, #0E7C7B);
    box-shadow: var(--pa-shadow-glow);
}
.profile-app .pa-addbar__input {
    flex: 1;
    padding: 10px 16px;
    border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-sm);
    font-size: 0.92rem;
    font-family: inherit;
    color: var(--text, #1A2B45);
    background: var(--pa-surface);
    outline: none;
    transition: border-color .15s ease;
    min-width: 0;
}
.profile-app .pa-addbar__input:focus {
    border-color: var(--teal, #0E7C7B);
}
.profile-app .pa-addbar__input::placeholder {
    color: var(--text-muted, #5E7A95);
}
.profile-app .pa-addbar__btn {
    padding: 10px 24px;
    border-radius: var(--pa-r-sm);
    border: 0;
    background: var(--navy, #152D50);
    color: var(--text-on-navy, #fff);
    font-size: 0.9rem;
    font-weight: var(--font-extrabold, 800);
    font-family: inherit;
    cursor: pointer;
    transition: background .15s ease, transform .15s ease;
    white-space: nowrap;
    flex-shrink: 0;
}
.profile-app .pa-addbar__btn:hover {
    background: var(--navy-light, #1A3456);
    transform: translateY(-1px);
}

/* Autocomplete dropdown */
.profile-app .pa-suggest {
    position: absolute;
    inset-block-start: 100%;
    inset-inline: 0;
    z-index: 50;
    display: none;
    max-height: 300px;
    overflow-y: auto;
    background: var(--pa-surface);
    border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-sm);
    box-shadow: var(--pa-shadow-lg);
    margin-block-start: 6px;
}
.profile-app .pa-suggest__item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    cursor: pointer;
    border-block-end: 1px solid var(--pa-border-light);
    transition: background .12s ease;
}
.profile-app .pa-suggest__item:last-child { border-block-end: none; }
.profile-app .pa-suggest__item:hover {
    background: var(--pa-surface-soft);
}
.profile-app .pa-suggest__sym {
    font-weight: var(--font-extrabold, 800);
    color: var(--navy, #152D50);
    font-size: 0.92rem;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.profile-app .pa-suggest__main {
    flex: 1;
    min-width: 0;
}

/* ═══════════════════════════════════════════════════════════════
   PHASE 5 — PORTFOLIO TRACKER
   ═══════════════════════════════════════════════════════════════ */

/* Portfolios index — grid of portfolio cards */
.profile-app .pa-portfolios-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 16px;
}
.profile-app .pa-portfolio-card {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 22px;
    background: var(--pa-surface);
    border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-md);
    box-shadow: var(--pa-shadow-sm);
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
    text-decoration: none;
    color: inherit;
}
.profile-app .pa-portfolio-card:hover,
.profile-app .pa-portfolio-card:focus-visible {
    transform: translateY(-2px);
    box-shadow: var(--pa-shadow-md);
    border-color: var(--teal-border, #B8E0DF);
    color: inherit;
}
.profile-app .pa-portfolio-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.profile-app .pa-portfolio-card__icon {
    width: 44px;
    height: 44px;
    border-radius: var(--pa-r-sm);
    background: linear-gradient(135deg, var(--teal, #0E7C7B), var(--teal-light, #12A09E));
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(14, 124, 123, 0.30);
}
.profile-app .pa-portfolio-card__title {
    font-size: 1.05rem;
    font-weight: var(--font-extrabold, 800);
    color: var(--navy, #152D50);
    line-height: 1.3;
}
.profile-app .pa-portfolio-card__meta {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.82rem;
    color: var(--text-muted, #5E7A95);
    flex-wrap: wrap;
}
.profile-app .pa-portfolio-card__meta b { color: var(--navy, #152D50); font-weight: var(--font-extrabold, 800); }
.profile-app .pa-portfolio-card__sep { color: var(--pa-border-strong); }
.profile-app .pa-portfolio-card__cta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-block-start: auto;
    padding-block-start: 12px;
    border-block-start: 1px solid var(--pa-border-light);
    font-size: 0.84rem;
    font-weight: var(--font-extrabold, 800);
    color: var(--teal, #0E7C7B);
    transition: gap .15s ease;
}
.profile-app .pa-portfolio-card:hover .pa-portfolio-card__cta { gap: 10px; }

/* Portfolio show — stats panel */
.profile-app .pa-pf-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-block-end: 22px;
}
.profile-app .pa-pf-stat {
    background: var(--pa-surface);
    border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-md);
    padding: 18px 20px;
    box-shadow: var(--pa-shadow-sm);
    position: relative;
    overflow: hidden;
}
.profile-app .pa-pf-stat::before {
    content: '';
    position: absolute;
    inset-block-start: 0;
    inset-inline: 0;
    height: 3px;
    background: var(--pa-border);
}
.profile-app .pa-pf-stat--pos::before    { background: var(--pa-success-fg); }
.profile-app .pa-pf-stat--neg::before    { background: var(--pa-danger-fg); }
.profile-app .pa-pf-stat--flat::before   { background: var(--pa-border-strong); }
.profile-app .pa-pf-stat--halal-success::before { background: var(--pa-success-fg); }
.profile-app .pa-pf-stat--halal-warn::before    { background: var(--pa-warn-fg); }
.profile-app .pa-pf-stat--halal-danger::before  { background: var(--pa-danger-fg); }
.profile-app .pa-pf-stat--halal-muted::before   { background: var(--pa-border-strong); }
.profile-app .pa-pf-stat__label {
    font-size: 0.78rem;
    font-weight: var(--font-bold, 700);
    color: var(--text-muted, #5E7A95);
    margin-block-end: 8px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}
.profile-app .pa-pf-stat__num {
    font-size: clamp(1.3rem, 2.4vw, 1.7rem);
    font-weight: var(--font-extrabold, 800);
    color: var(--navy, #152D50);
    line-height: 1;
    letter-spacing: -0.02em;
}
.profile-app .pa-pf-stat--pos .pa-pf-stat__num { color: var(--pa-success-fg); }
.profile-app .pa-pf-stat--neg .pa-pf-stat__num { color: var(--pa-danger-fg); }
.profile-app .pa-pf-stat--halal-success .pa-pf-stat__num { color: var(--pa-success-fg); }
.profile-app .pa-pf-stat--halal-warn    .pa-pf-stat__num { color: var(--pa-warn-fg); }
.profile-app .pa-pf-stat--halal-danger  .pa-pf-stat__num { color: var(--pa-danger-fg); }
.profile-app .pa-pf-stat__num--muted { color: var(--text-muted, #5E7A95); }
.profile-app .pa-pf-stat__sub {
    font-size: 0.74rem;
    color: var(--text-muted, #5E7A95);
    margin-block-start: 6px;
    line-height: 1.4;
}

/* Allocation grid (sectors + countries) */
.profile-app .pa-pf-alloc-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-block-end: 22px;
}
.profile-app .pa-pf-alloc-row {
    margin-block-end: 10px;
}
.profile-app .pa-pf-alloc-row:last-child { margin-block-end: 0; }
.profile-app .pa-pf-alloc-row__head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    margin-block-end: 5px;
}
.profile-app .pa-pf-alloc-row__label {
    font-size: 0.84rem;
    font-weight: var(--font-bold, 700);
    color: var(--text, #1A2B45);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.profile-app .pa-pf-alloc-row__pct {
    font-size: 0.82rem;
    font-weight: var(--font-extrabold, 800);
    color: var(--teal, #0E7C7B);
}
.profile-app .pa-pf-alloc-bar {
    height: 8px;
    background: var(--pa-border-light);
    border-radius: 4px;
    overflow: hidden;
}
.profile-app .pa-pf-alloc-bar__fill {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, var(--teal, #0E7C7B), var(--teal-light, #12A09E));
    border-radius: 4px;
    transition: width .4s ease;
}
.profile-app .pa-pf-alloc-bar__fill--gold {
    background: linear-gradient(90deg, var(--gold, #C08A2E), var(--gold-light, #E5A83A));
}

/* Responsive */
@media (max-width: 1024px) {
    .profile-app .pa-pf-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ═══════════════════════════════════════════════════════════════
   PHASE 7 — TOOLS (calculators)
   ═══════════════════════════════════════════════════════════════ */

/* Tools hub — grid of tool cards */
.profile-app .pa-tools-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 14px;
}
.profile-app .pa-tool-card {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px 20px;
    background: var(--pa-surface);
    border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-md);
    box-shadow: var(--pa-shadow-sm);
    text-decoration: none;
    color: inherit;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.profile-app .pa-tool-card:hover,
.profile-app .pa-tool-card:focus-visible {
    transform: translateY(-2px);
    box-shadow: var(--pa-shadow-md);
    color: inherit;
}
.profile-app .pa-tool-card__icon {
    width: 48px;
    height: 48px;
    border-radius: var(--pa-r-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.profile-app .pa-tool-card__body { flex: 1; min-width: 0; }
.profile-app .pa-tool-card__label {
    font-size: 0.98rem;
    font-weight: var(--font-extrabold, 800);
    color: var(--navy, #152D50);
    margin-block-end: 3px;
}
.profile-app .pa-tool-card__desc {
    font-size: 0.78rem;
    color: var(--text-muted, #5E7A95);
    line-height: 1.45;
}
.profile-app .pa-tool-card__arrow {
    color: var(--text-muted, #5E7A95);
    flex-shrink: 0;
    transition: transform .15s ease;
}
.profile-app .pa-tool-card:hover .pa-tool-card__arrow { transform: translateX(-3px); color: var(--navy, #152D50); }

/* Tone variants */
.profile-app .pa-tool-card--gold    { border-color: var(--gold-light, #E5A83A); }
.profile-app .pa-tool-card--gold    .pa-tool-card__icon { background: linear-gradient(135deg, var(--gold, #C08A2E), var(--gold-light, #E5A83A)); color: #fff; }
.profile-app .pa-tool-card--success .pa-tool-card__icon { background: var(--pa-success-bg); color: var(--pa-success-fg); }
.profile-app .pa-tool-card--info    .pa-tool-card__icon { background: var(--pa-info-bg);    color: var(--pa-info-fg); }
.profile-app .pa-tool-card--warn    .pa-tool-card__icon { background: var(--pa-warn-bg);    color: var(--pa-warn-fg); }
.profile-app .pa-tool-card--danger  .pa-tool-card__icon { background: var(--pa-danger-bg);  color: var(--pa-danger-fg); }
.profile-app .pa-tool-card--purple  .pa-tool-card__icon { background: var(--pa-purple-bg);  color: var(--pa-purple-fg); }

/* Tool detail page — 2-col grid (form + result) */
.profile-app .pa-tool-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
    gap: 18px;
    align-items: start;
}
@media (max-width: 900px) {
    .profile-app .pa-tool-grid { grid-template-columns: 1fr; }
}

/* Form */
.profile-app .pa-tool-form {
    position: sticky;
    inset-block-start: 130px;
}
.profile-app .pa-tool-form__title {
    font-size: 0.86rem;
    font-weight: var(--font-extrabold, 800);
    color: var(--text-muted, #5E7A95);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-block-end: 14px;
}
.profile-app .pa-tool-field { margin-block-end: 14px; }
.profile-app .pa-tool-field .st-label { display: block; margin-block-end: 6px; }
.profile-app .pa-tool-field .st-input { width: 100%; }
.profile-app .pa-tool-form .row.g-3 { margin-block-end: 14px; }
.profile-app .pa-tool-form .row.g-3 .st-label { margin-block-end: 6px; }
.profile-app .pa-tool-form__hint {
    font-size: 0.74rem;
    color: var(--text-muted, #5E7A95);
    margin-block-start: 4px;
}
.profile-app .pa-tool-form__submit {
    width: 100%;
    justify-content: center;
    margin-block-start: 8px;
    padding-block: 12px;
}

/* Result */
.profile-app .pa-tool-result__card {
    border-width: 1px;
    border-style: solid;
    border-color: var(--pa-border);
    text-align: center;
    margin-block-end: 16px;
}
.profile-app .pa-tool-result__card--gold     { background: linear-gradient(135deg, var(--gold-bg, #FAF3E5), #FFFAF0); border-color: var(--gold-light, #E5A83A); }
.profile-app .pa-tool-result__card--success  { background: linear-gradient(135deg, var(--pa-success-bg), #fff); border-color: rgba(16, 163, 127, 0.30); }
.profile-app .pa-tool-result__card--warn     { background: linear-gradient(135deg, var(--pa-warn-bg), #fff);    border-color: rgba(245, 158, 11, 0.30); }
.profile-app .pa-tool-result__card--danger   { background: linear-gradient(135deg, var(--pa-danger-bg), #fff);  border-color: rgba(239, 68, 68, 0.30); }
.profile-app .pa-tool-result__card--info     { background: linear-gradient(135deg, var(--pa-info-bg), #fff);    border-color: rgba(59, 130, 246, 0.30); }
.profile-app .pa-tool-result__card--muted    { background: var(--pa-surface-soft); }

.profile-app .pa-tool-result__big { padding-block: 14px; }
.profile-app .pa-tool-result__big-label {
    font-size: 0.78rem;
    font-weight: var(--font-bold, 700);
    color: var(--text-muted, #5E7A95);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-block-end: 8px;
}
.profile-app .pa-tool-result__big-num {
    font-size: clamp(1.8rem, 4vw, 2.6rem);
    font-weight: var(--font-extrabold, 800);
    color: var(--navy, #152D50);
    line-height: 1;
    letter-spacing: -0.02em;
    margin-block-end: 10px;
}
.profile-app .pa-tool-result__card--gold    .pa-tool-result__big-num { color: var(--gold, #C08A2E); }
.profile-app .pa-tool-result__card--success .pa-tool-result__big-num { color: var(--pa-success-fg); }
.profile-app .pa-tool-result__card--warn    .pa-tool-result__big-num { color: var(--pa-warn-fg); }
.profile-app .pa-tool-result__card--danger  .pa-tool-result__big-num { color: var(--pa-danger-fg); }
.profile-app .pa-tool-result__card--info    .pa-tool-result__big-num { color: var(--pa-info-fg); }
.profile-app .pa-tool-result__big-sub {
    font-size: 0.86rem;
    color: var(--text-mid, #3D5A7A);
    line-height: 1.55;
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
}

.profile-app .pa-tool-result__empty {
    text-align: center;
    padding: 56px 24px;
    background: var(--pa-surface-soft);
    border: 1px dashed var(--pa-border);
    border-radius: var(--pa-r-md);
    color: var(--text-muted, #5E7A95);
}
.profile-app .pa-tool-result__empty p {
    font-size: 0.92rem;
    margin: 12px 0 4px;
    color: var(--text-mid, #3D5A7A);
    font-weight: var(--font-bold, 700);
}
.profile-app .pa-tool-result__empty small {
    font-size: 0.78rem;
    color: var(--text-muted, #5E7A95);
}

/* Result table — repurposes pa-table styles for label/value pairs */
.profile-app .pa-tool-result .pa-table th[scope="row"] {
    background: var(--pa-surface-soft);
    color: var(--text-mid, #3D5A7A);
    font-weight: var(--font-bold, 700);
    text-align: start;
    width: 50%;
    padding: 11px 14px;
    font-size: 0.86rem;
}
.profile-app .pa-tool-result .pa-table tbody tr td {
    padding: 11px 14px;
    text-align: end;
    font-weight: var(--font-extrabold, 800);
    color: var(--navy, #152D50);
}

/* ═══════════════════════════════════════════════════════════════
   PHASE 6 — PERSONAL CALENDAR (dividends)
   ═══════════════════════════════════════════════════════════════ */

/* Month-grouped event grid */
.profile-app .pa-cal-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 16px;
}

.profile-app .pa-cal-month {
    background: var(--pa-surface);
    border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-md);
    overflow: hidden;
    box-shadow: var(--pa-shadow-sm);
}
.profile-app .pa-cal-month__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    background: linear-gradient(135deg, var(--navy, #152D50), var(--navy-light, #1A3456));
    color: var(--text-on-navy, #fff);
}
.profile-app .pa-cal-month__label {
    font-size: 0.95rem;
    font-weight: var(--font-extrabold, 800);
}
.profile-app .pa-cal-month__count {
    font-size: 0.74rem;
    background: rgba(255, 255, 255, 0.16);
    padding: 3px 10px;
    border-radius: 999px;
    font-weight: var(--font-bold, 700);
}

.profile-app .pa-cal-events {
    list-style: none;
    margin: 0;
    padding: 0;
}
.profile-app .pa-cal-event {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 18px;
    border-block-end: 1px solid var(--pa-border-light);
    transition: background .15s ease;
}
.profile-app .pa-cal-event:last-child { border-block-end: none; }
.profile-app .pa-cal-event:hover { background: var(--pa-surface-soft); }

.profile-app .pa-cal-event__date {
    width: 52px;
    height: 56px;
    background: var(--teal-bg, #EBF7F7);
    border: 1px solid var(--teal-border, #B8E0DF);
    border-radius: var(--pa-r-sm);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.profile-app .pa-cal-event__day {
    font-size: 1.25rem;
    font-weight: var(--font-extrabold, 800);
    color: var(--teal, #0E7C7B);
    line-height: 1;
}
.profile-app .pa-cal-event__mon {
    font-size: 0.66rem;
    color: var(--teal, #0E7C7B);
    font-weight: var(--font-bold, 700);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-block-start: 3px;
}

.profile-app .pa-cal-event__body {
    flex: 1;
    min-width: 0;
}
.profile-app .pa-cal-event__sym {
    font-size: 0.95rem;
    margin-block-end: 2px;
}
.profile-app .pa-cal-event__name {
    font-size: 0.78rem;
    color: var(--text-muted, #5E7A95);
    margin-block-end: 4px;
}
.profile-app .pa-cal-event__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    font-size: 0.78rem;
    color: var(--text-mid, #3D5A7A);
}
.profile-app .pa-cal-event__meta b { color: var(--navy, #152D50); }

.profile-app .pa-cal-event__days {
    flex-shrink: 0;
    font-size: 0.74rem;
    font-weight: var(--font-extrabold, 800);
    padding: 4px 10px;
    border-radius: 999px;
    background: var(--pa-border-light);
    color: var(--text-muted, #5E7A95);
    white-space: nowrap;
}
.profile-app .pa-cal-event__days--soon {
    background: var(--pa-success-bg);
    color: var(--pa-success-fg);
}
.profile-app .pa-cal-event__days--mid {
    background: var(--pa-info-bg);
    color: var(--pa-info-fg);
}

/* "Coming Soon" placeholder */
.profile-app .pa-cal-soon {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px;
    background: linear-gradient(135deg, var(--pa-surface-soft), var(--bg-card, #fff));
    border: 1px dashed var(--pa-border-strong);
}
.profile-app .pa-cal-soon__icon {
    width: 48px;
    height: 48px;
    border-radius: var(--pa-r-sm);
    background: var(--pa-info-bg);
    color: var(--pa-info-fg);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.profile-app .pa-cal-soon__body { flex: 1; min-width: 0; }
.profile-app .pa-cal-soon__pill {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: var(--font-extrabold, 800);
    color: var(--pa-info-fg);
    background: var(--pa-info-bg);
    padding: 3px 10px;
    border-radius: 999px;
    margin-block-end: 6px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}
.profile-app .pa-cal-soon__title {
    font-size: 1rem;
    font-weight: var(--font-extrabold, 800);
    color: var(--navy, #152D50);
    margin-block-end: 4px;
}
.profile-app .pa-cal-soon__desc {
    font-size: 0.86rem;
    color: var(--text-mid, #3D5A7A);
    line-height: 1.55;
}

@media (max-width: 640px) {
    .profile-app .pa-cal-event { gap: 12px; padding: 12px 14px; }
    .profile-app .pa-cal-event__date { width: 46px; height: 50px; }
    .profile-app .pa-cal-event__day { font-size: 1.1rem; }
    .profile-app .pa-cal-soon { flex-wrap: wrap; }
}
@media (max-width: 640px) {
    .profile-app .pa-portfolios-grid { grid-template-columns: 1fr; }
    .profile-app .pa-pf-alloc-grid   { grid-template-columns: 1fr; }
    .profile-app .pa-pf-stat { padding: 14px 16px; }
    .profile-app .pa-pf-stat__num { font-size: 1.2rem; }
}

/* ─── COUNTRY BADGE (Gulf / Arab exchange code chip) ─── */
.profile-app .pa-country-badge {
    display: inline-block;
    padding: 1px 7px;
    border-radius: 5px;
    font-size: 0.62rem;
    font-weight: var(--font-extrabold, 800);
    background: var(--teal-bg, #EBF7F7);
    color: var(--teal, #0E7C7B);
    border: 1px solid var(--teal-border, #B8E0DF);
    letter-spacing: 0.6px;
    line-height: 1.4;
    margin-inline-start: 6px;
    vertical-align: middle;
    text-transform: uppercase;
}
.profile-app .pa-suggest__name {
    font-size: 0.78rem;
    color: var(--text-muted, #5E7A95);
    margin-block-start: 2px;
}
.profile-app .pa-suggest__logo {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    object-fit: contain;
    background: var(--pa-surface-muted);
    flex-shrink: 0;
}
.profile-app .pa-suggest__logo-fb {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: linear-gradient(135deg, var(--navy, #152D50), var(--navy-light, #1A3456));
    color: var(--text-on-navy, #fff);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: var(--font-extrabold, 800);
    flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════════════════
   TABLE — modern tabular data display
   ═══════════════════════════════════════════════════════════════ */
.profile-app .pa-tablewrap {
    background: var(--pa-surface);
    border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-md);
    overflow: hidden;
    box-shadow: var(--pa-shadow-sm);
}
.profile-app .pa-tablewrap__scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.profile-app .pa-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.86rem;
}
.profile-app .pa-table thead {
    background: linear-gradient(180deg, var(--navy, #152D50), var(--navy-light, #1A3456));
    color: var(--text-on-navy, #fff);
    position: sticky;
    inset-block-start: 0;
    z-index: 1;
}
.profile-app .pa-table th {
    padding: 12px 16px;
    font-weight: var(--font-bold, 700);
    white-space: nowrap;
    font-size: 0.8rem;
    text-align: start;
    letter-spacing: 0.2px;
}
.profile-app .pa-table td {
    padding: 12px 16px;
    white-space: nowrap;
    border-block-end: 1px solid var(--pa-border-light);
    color: var(--text, #1A2B45);
}
.profile-app .pa-table tbody tr:last-child td { border-block-end: none; }
.profile-app .pa-table tbody tr {
    transition: background .12s ease;
}
.profile-app .pa-table tbody tr:hover { background: var(--pa-surface-soft); }
.profile-app .pa-table .t-sym {
    font-weight: var(--font-extrabold, 800);
    color: var(--navy, #152D50);
}
.profile-app .pa-table .t-name { color: var(--text-muted, #5E7A95); }
.profile-app .pa-table .t-pos { color: var(--pa-success-fg); font-weight: var(--font-bold, 700); }
.profile-app .pa-table .t-neg { color: var(--pa-danger-fg);  font-weight: var(--font-bold, 700); }

/* ═══════════════════════════════════════════════════════════════
   BADGE / TAG / RATING
   ═══════════════════════════════════════════════════════════════ */
.profile-app .pa-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 0.74rem;
    font-weight: var(--font-extrabold, 800);
    line-height: 1.4;
    letter-spacing: 0.2px;
}
.profile-app .pa-badge--success { background: var(--pa-success-bg); color: var(--pa-success-fg); }
.profile-app .pa-badge--warn    { background: var(--pa-warn-bg);    color: var(--pa-warn-fg); }
.profile-app .pa-badge--danger  { background: var(--pa-danger-bg);  color: var(--pa-danger-fg); }
.profile-app .pa-badge--info    { background: var(--pa-info-bg);    color: var(--pa-info-fg); }
.profile-app .pa-badge--purple  { background: var(--pa-purple-bg);  color: var(--pa-purple-fg); }
.profile-app .pa-badge--muted   { background: var(--pa-border-light); color: var(--text-muted, #5E7A95); }

/* Rating bar (analyst rating, halal rating, etc.) */
.profile-app .pa-rating {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 0.74rem;
    font-weight: var(--font-extrabold, 800);
    color: #fff;
    white-space: nowrap;
    letter-spacing: 0.2px;
}
.profile-app .pa-rating--strong-buy  { background: #16A34A; }
.profile-app .pa-rating--buy         { background: #22C55E; }
.profile-app .pa-rating--hold        { background: #F59E0B; }
.profile-app .pa-rating--sell        { background: #EF4444; }
.profile-app .pa-rating--strong-sell { background: #B91C1C; }
.profile-app .pa-rating--none        { background: var(--pa-border-strong); color: var(--text-mid, #3D5A7A); }

.profile-app .pa-numbox {
    display: inline-block;
    min-width: 28px;
    text-align: center;
    padding: 3px 8px;
    border-radius: 6px;
    font-size: 0.78rem;
    font-weight: var(--font-extrabold, 800);
}
.profile-app .pa-numbox--sb { background: #DCFCE7; color: #166534; }
.profile-app .pa-numbox--b  { background: #D1FAE5; color: #065F46; }
.profile-app .pa-numbox--h  { background: #FEF3C7; color: #92400E; }
.profile-app .pa-numbox--s  { background: #FEE2E2; color: #991B1B; }
.profile-app .pa-numbox--ss { background: #FECACA; color: #7F1D1D; }

/* ═══════════════════════════════════════════════════════════════
   ROW ACTIONS — inline row-level buttons (delete, etc.)
   ═══════════════════════════════════════════════════════════════ */
.profile-app .pa-rowbtn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 14px;
    border-radius: 8px;
    border: 1px solid var(--pa-border);
    background: var(--pa-surface);
    color: var(--text-mid, #3D5A7A);
    font-size: 0.78rem;
    font-weight: var(--font-bold, 700);
    font-family: inherit;
    cursor: pointer;
    transition: all .12s ease;
}
.profile-app .pa-rowbtn:hover {
    border-color: var(--pa-border-strong);
    color: var(--navy, #152D50);
}
.profile-app .pa-rowbtn--danger {
    color: var(--pa-danger-fg);
    border-color: rgba(239, 68, 68, 0.3);
}
.profile-app .pa-rowbtn--danger:hover {
    background: rgba(239, 68, 68, 0.06);
    border-color: var(--pa-danger-fg);
}

.profile-app .pa-iconbtn {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 0;
    background: rgba(0, 0, 0, 0.06);
    color: var(--text-muted, #5E7A95);
    font-size: 0.85rem;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all .12s ease;
}
.profile-app .pa-iconbtn:hover {
    background: rgba(239, 68, 68, 0.10);
    color: var(--pa-danger-fg);
}

/* ═══════════════════════════════════════════════════════════════
   EMPTY STATE — modern, action-driven
   ═══════════════════════════════════════════════════════════════ */
.profile-app .pa-empty {
    text-align: center;
    padding: 48px 24px;
    color: var(--text-muted, #5E7A95);
}
.profile-app .pa-empty__icon {
    width: 80px;
    height: 80px;
    margin: 0 auto 16px;
    background: var(--pa-surface-soft);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-muted, #5E7A95);
}
.profile-app .pa-empty__title {
    font-size: 1.05rem;
    font-weight: var(--font-extrabold, 800);
    color: var(--navy, #152D50);
    margin-block-end: 6px;
}
.profile-app .pa-empty__desc {
    font-size: 0.9rem;
    color: var(--text-mid, #3D5A7A);
    margin-block-end: 20px;
    line-height: 1.55;
    max-width: 360px;
    margin-inline: auto;
}
.profile-app .pa-empty__actions {
    display: inline-flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center;
}

/* ═══════════════════════════════════════════════════════════════
   BUTTONS
   ═══════════════════════════════════════════════════════════════ */
.profile-app .pa-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 20px;
    border-radius: var(--pa-r-sm);
    font-size: 0.88rem;
    font-weight: var(--font-extrabold, 800);
    font-family: inherit;
    border: 1px solid transparent;
    background: transparent;
    color: var(--text, #1A2B45);
    cursor: pointer;
    transition: all .15s ease;
    text-decoration: none;
    line-height: 1.3;
}
.profile-app .pa-btn--primary {
    background: var(--navy, #152D50);
    border-color: var(--navy, #152D50);
    color: var(--text-on-navy, #fff);
}
.profile-app .pa-btn--primary:hover {
    background: var(--navy-light, #1A3456);
    border-color: var(--navy-light, #1A3456);
    color: var(--text-on-navy, #fff);
}
.profile-app .pa-btn--accent {
    background: var(--teal, #0E7C7B);
    border-color: var(--teal, #0E7C7B);
    color: #fff;
}
.profile-app .pa-btn--accent:hover {
    background: var(--teal-light, #12A09E);
    border-color: var(--teal-light, #12A09E);
    color: #fff;
}
.profile-app .pa-btn--ghost {
    background: var(--pa-surface);
    color: var(--text, #1A2B45);
    border-color: var(--pa-border);
}
.profile-app .pa-btn--ghost:hover {
    background: var(--pa-surface-soft);
    border-color: var(--pa-border-strong);
    color: var(--navy, #152D50);
}

/* ═══════════════════════════════════════════════════════════════
   MODAL — modern shared modal style (Bootstrap 5 modal compatible)
   ═══════════════════════════════════════════════════════════════ */
.profile-app .pa-modal-content,
.profile-app .modal-content.pa-modal {
    border-radius: var(--pa-r-lg);
    border: 0;
    box-shadow: 0 24px 56px rgba(21, 45, 80, 0.18);
    overflow: hidden;
}
.profile-app .pa-modal__head {
    padding: 28px 28px 20px;
    text-align: center;
}
.profile-app .pa-modal__icon {
    width: 56px;
    height: 56px;
    border-radius: var(--pa-r-md);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 16px;
    background: var(--teal-bg, #EBF7F7);
    color: var(--teal, #0E7C7B);
}
.profile-app .pa-modal__title {
    font-size: 1.05rem;
    font-weight: var(--font-extrabold, 800);
    color: var(--navy, #152D50);
    margin: 0 0 4px;
}
.profile-app .pa-modal__desc {
    font-size: 0.85rem;
    color: var(--text-muted, #5E7A95);
    margin: 0;
}
.profile-app .pa-modal__body {
    padding: 0 28px 20px;
}
.profile-app .pa-modal__foot {
    padding: 16px 28px;
    background: var(--pa-surface-soft);
    display: flex;
    gap: 10px;
    justify-content: center;
}
.profile-app .pa-modal__foot > .pa-btn { flex: 1; justify-content: center; }

/* ═══════════════════════════════════════════════════════════════
   ALERT (inline notice on form errors etc.)
   ═══════════════════════════════════════════════════════════════ */
.profile-app .pa-alert {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 18px;
    border-radius: var(--pa-r-sm);
    font-size: 0.88rem;
    margin-block-end: 16px;
    border: 1px solid transparent;
}
.profile-app .pa-alert--warn {
    background: #FFFBEB;
    color: #92400E;
    border-color: #FDE68A;
}
.profile-app .pa-alert--danger {
    background: #FEF2F2;
    color: #991B1B;
    border-color: #FECACA;
}
.profile-app .pa-alert--success {
    background: #F0FDF4;
    color: #166534;
    border-color: #BBF7D0;
}

/* ═══════════════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
    .profile-app .pa-page-head { flex-direction: column; align-items: stretch; }
    .profile-app .pa-page-head__actions { width: 100%; }
    .profile-app .pa-tabs { gap: 4px; overflow-x: auto; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; padding-block-end: 4px; scrollbar-width: none; }
    .profile-app .pa-tabs::-webkit-scrollbar { display: none; }
    .profile-app .pa-tab { font-size: 0.78rem; padding: 6px 14px; flex-shrink: 0; }
    .profile-app .pa-addbar { flex-wrap: wrap; padding: 12px 14px; }
    .profile-app .pa-addbar__input { width: 100%; }
    .profile-app .pa-addbar__btn { width: 100%; justify-content: center; }
    .profile-app .pa-table th, .profile-app .pa-table td { padding: 10px 12px; font-size: 0.78rem; }
    .profile-app .pa-card { padding: 16px; }
    .profile-app .pa-modal__head { padding: 24px 20px 16px; }
    .profile-app .pa-modal__body { padding: 0 20px 16px; }
    .profile-app .pa-modal__foot { padding: 14px 20px; }
}

@media (max-width: 480px) {
    .profile-app .pa-page-head__title { font-size: 1.05rem; }
    .profile-app .pa-tab { font-size: 0.74rem; padding: 6px 12px; }
    .profile-app .pa-tab__count { font-size: 0.65rem; padding: 1px 6px; }
    .profile-app .pa-addbar { padding: 10px 12px; }
    .profile-app .pa-table th, .profile-app .pa-table td { padding: 8px 10px; font-size: 0.74rem; }
    .profile-app .pa-card { padding: 14px; border-radius: var(--pa-r-sm); }
    .profile-app .pa-empty { padding: 36px 16px; }
    .profile-app .pa-empty__icon { width: 64px; height: 64px; }
}

@media (prefers-reduced-motion: reduce) {
    .profile-app *,
    .profile-app *::before,
    .profile-app *::after {
        transition: none !important;
        animation: none !important;
    }
}

/* ═══════════════════════════════════════════════════════════════
   PAGE-SPECIFIC SECTIONS — tokenized rewrites of legacy classes
   Each block preserves the page's existing class names (.snt-*, .sv-*,
   .nf-*, .inv-*, .ac-*, .scr-*, .ex-*) so blade structure is unchanged,
   but colors/borders/shadows now come from canonical tokens.
   ═══════════════════════════════════════════════════════════════ */

/* ─── SENTIMENTS (.snt-*) ─── */
.profile-app .snt-card {
    background: var(--pa-surface);
    border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-md);
    padding: 18px 22px;
    margin-block-end: 10px;
    display: flex;
    align-items: center;
    gap: 16px;
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.profile-app .snt-card:hover {
    border-color: var(--pa-border-strong);
    box-shadow: var(--pa-shadow-md);
    transform: translateY(-1px);
}
.profile-app .snt-card__dir {
    width: 48px;
    height: 48px;
    border-radius: var(--pa-r-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.profile-app .snt-card__dir--bull { background: var(--pa-success-bg); }
.profile-app .snt-card__dir--bear { background: var(--pa-danger-bg); }
.profile-app .snt-card__dir img { width: 26px; height: 26px; }
.profile-app .snt-card__body { flex: 1; min-width: 0; }
.profile-app .snt-card__row1 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-block-end: 6px;
}
.profile-app .snt-card__name {
    font-size: 0.95rem;
    font-weight: var(--font-extrabold, 800);
    color: var(--text, #1A2B45);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
    min-width: 0;
}
.profile-app .snt-card__change {
    font-size: 0.92rem;
    font-weight: var(--font-extrabold, 800);
    white-space: nowrap;
    flex-shrink: 0;
}
.profile-app .snt-card__change--up      { color: var(--pa-success-fg); }
.profile-app .snt-card__change--down    { color: var(--pa-danger-fg); }
.profile-app .snt-card__change--neutral { color: var(--text-muted, #5E7A95); }
.profile-app .snt-card__row2 {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}
.profile-app .snt-card__meta {
    font-size: 0.78rem;
    color: var(--text-muted, #5E7A95);
    display: flex;
    align-items: center;
    gap: 5px;
}
.profile-app .snt-card__meta b { color: var(--text-mid, #3D5A7A); font-weight: var(--font-bold, 700); }
.profile-app .snt-card__tag {
    font-size: 0.7rem;
    font-weight: var(--font-extrabold, 800);
    padding: 3px 11px;
    border-radius: 999px;
    letter-spacing: 0.2px;
}
.profile-app .snt-card__tag--bull { background: var(--pa-success-bg); color: var(--pa-success-fg); }
.profile-app .snt-card__tag--bear { background: var(--pa-danger-bg);  color: var(--pa-danger-fg); }
.profile-app .snt-card__tag--type { background: var(--pa-border-light); color: var(--text-mid, #3D5A7A); }
.profile-app .snt-card__actions { flex-shrink: 0; }
.profile-app .snt-close-btn {
    font-size: 0.78rem;
    font-weight: var(--font-bold, 700);
    padding: 7px 16px;
    border: 1px solid var(--pa-border);
    border-radius: 8px;
    background: var(--pa-surface);
    color: var(--text-mid, #3D5A7A);
    cursor: pointer;
    font-family: inherit;
    transition: all .15s ease;
}
.profile-app .snt-close-btn:hover {
    border-color: var(--pa-danger-fg);
    color: var(--pa-danger-fg);
    background: rgba(239, 68, 68, 0.06);
}
.profile-app .snt-closed-tag {
    font-size: 0.78rem;
    font-weight: var(--font-bold, 700);
    color: var(--text-muted, #5E7A95);
}

/* ═══════════════════════════════════════════════════════════════
   SAVED ITEMS — Modern Interactive Design (.sv-*)
   ═══════════════════════════════════════════════════════════════ */

/* ── Page Header ── */
.profile-app .sv-page-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-block-end: 20px;
    padding: 20px 24px;
    background: linear-gradient(135deg, var(--navy, #152D50) 0%, #1e3f6e 100%);
    border-radius: var(--pa-r-lg);
    color: #fff;
}
.profile-app .sv-page-header__info {
    display: flex;
    align-items: center;
    gap: 16px;
}
.profile-app .sv-page-header__icon {
    width: 48px;
    height: 48px;
    border-radius: var(--pa-r-sm);
    background: rgba(255, 255, 255, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #fff;
}
.profile-app .sv-page-header__title {
    font-size: 1.25rem;
    font-weight: var(--font-extrabold, 800);
    color: #fff;
    margin: 0 0 2px;
}
.profile-app .sv-page-header__sub {
    font-size: 0.82rem;
    color: rgba(255, 255, 255, 0.65);
    margin: 0;
}
.profile-app .sv-total-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 16px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.2);
    font-size: 0.82rem;
    font-weight: var(--font-bold, 700);
    color: #fff;
    white-space: nowrap;
}

/* ── Controls bar (segmented + spacer + view toggle) ── */
.profile-app .sv-controls {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-block-end: 14px;
    flex-wrap: wrap;
}
.profile-app .sv-controls__spacer { flex: 1; }

/* ── Segmented all/favorites toggle ── */
.profile-app .sv-seg {
    display: inline-flex;
    background: var(--pa-surface-muted);
    border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-sm);
    padding: 3px;
    gap: 2px;
}
.profile-app .sv-seg__btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 18px;
    border-radius: 10px;
    font-size: 0.84rem;
    font-weight: var(--font-bold, 700);
    color: var(--text-muted, #5E7A95);
    text-decoration: none;
    transition: background .15s ease, color .15s ease, box-shadow .15s ease;
    white-space: nowrap;
}
.profile-app .sv-seg__btn:hover { color: var(--navy, #152D50); }
.profile-app .sv-seg__btn.is-active {
    background: var(--pa-surface);
    color: var(--navy, #152D50);
    box-shadow: var(--pa-shadow-sm);
}

/* ── View toggle ── */
.profile-app .sv-view-toggle {
    display: inline-flex;
    gap: 2px;
    background: var(--pa-surface-muted);
    border: 1px solid var(--pa-border);
    padding: 3px;
    border-radius: 10px;
}
.profile-app .sv-view-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: none;
    background: transparent;
    border-radius: 8px;
    color: var(--text-muted, #5E7A95);
    cursor: pointer;
    transition: background .15s ease, color .15s ease;
}
.profile-app .sv-view-btn:hover { color: var(--navy, #152D50); }
.profile-app .sv-view-btn.is-active {
    background: var(--pa-surface);
    color: var(--navy, #152D50);
    box-shadow: var(--pa-shadow-sm);
}

/* ── Type filter chips ── */
.profile-app .sv-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-block-end: 20px;
}
.profile-app .sv-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 15px;
    border-radius: 999px;
    border: 1.5px solid var(--pa-border);
    font-size: 0.78rem;
    font-weight: var(--font-bold, 700);
    color: var(--text-muted, #5E7A95);
    text-decoration: none;
    transition: border-color .15s ease, color .15s ease, background .15s ease, transform .12s ease;
    white-space: nowrap;
    background: var(--pa-surface);
}
.profile-app .sv-chip:hover {
    border-color: var(--teal, #0E7C7B);
    color: var(--teal, #0E7C7B);
    transform: translateY(-1px);
}
.profile-app .sv-chip.is-active {
    border-color: var(--teal, #0E7C7B);
    background: rgba(14, 124, 123, 0.08);
    color: var(--teal, #0E7C7B);
}
/* colored active states per type */
.profile-app .sv-chip--company.is-active  { border-color: #4B74E8; background: rgba(75,116,232,0.08); color: #4B74E8; }
.profile-app .sv-chip--stock.is-active    { border-color: var(--teal, #0E7C7B); }
.profile-app .sv-chip--article.is-active  { border-color: #E07A30; background: rgba(224,122,48,0.08); color: #E07A30; }
.profile-app .sv-chip--currency.is-active { border-color: #7C4FD8; background: rgba(124,79,216,0.08); color: #7C4FD8; }

/* ── Grid container ── */
.profile-app .sv-items {
    display: grid;
    gap: 16px;
}
.profile-app .sv-items--grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.profile-app .sv-items--list {
    grid-template-columns: 1fr;
}

/* ── Item card ── */
.profile-app .sv-item {
    background: var(--pa-surface);
    border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-md);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
    position: relative;
}
.profile-app .sv-item:hover {
    border-color: var(--pa-border-strong);
    box-shadow: var(--pa-shadow-lg);
    transform: translateY(-3px);
}
/* Colored top accent per type */
.profile-app .sv-item::before {
    content: '';
    display: block;
    height: 3px;
    background: var(--pa-border);
    transition: background .2s ease;
}
.profile-app .sv-item--stock::before   { background: var(--teal, #0E7C7B); }
.profile-app .sv-item--company::before { background: #4B74E8; }
.profile-app .sv-item--article::before { background: #E07A30; }
.profile-app .sv-item--currency::before{ background: #7C4FD8; }

/* ── Thumbnail ── */
.profile-app .sv-item__thumb {
    display: block;
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
}
.profile-app .sv-item__img {
    display: block;
    width: 100%;
    height: 160px;
    object-fit: cover;
    background: var(--pa-surface-muted);
    transition: transform .28s ease;
}
.profile-app .sv-item:hover .sv-item__img { transform: scale(1.04); }
.profile-app .sv-item__placeholder {
    width: 100%;
    height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.profile-app .sv-item__placeholder--stock    { background: linear-gradient(135deg, #EBF7F7, #C5EBE9); color: var(--teal, #0E7C7B); }
.profile-app .sv-item__placeholder--company  { background: linear-gradient(135deg, #EEF2FF, #D9E3FF); color: #4B74E8; }
.profile-app .sv-item__placeholder--article  { background: linear-gradient(135deg, #FFF5EB, #FFE0C2); color: #E07A30; }
.profile-app .sv-item__placeholder--currency { background: linear-gradient(135deg, #F3EEFF, #E2D5F8); color: #7C4FD8; }
.profile-app .sv-item__placeholder--asset,
.profile-app .sv-item__placeholder--platform,
.profile-app .sv-item__placeholder--license,
.profile-app .sv-item__placeholder--default  { background: linear-gradient(135deg, var(--pa-surface-soft), var(--pa-surface-muted)); color: var(--pa-border-strong); }

/* ── Favorite dot on thumb ── */
.profile-app .sv-item__fav-dot {
    position: absolute;
    top: 10px;
    inset-inline-end: 10px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #F59E0B;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(245, 158, 11, 0.5);
}

/* ── Card body ── */
.profile-app .sv-item__body {
    padding: 14px 16px 16px;
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* ── Meta row: badge + age ── */
.profile-app .sv-item__meta {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-block-end: 9px;
    flex-wrap: wrap;
}
.profile-app .sv-item__badge {
    display: inline-block;
    font-size: 0.67rem;
    font-weight: var(--font-extrabold, 800);
    padding: 2px 10px;
    border-radius: 999px;
    letter-spacing: 0.3px;
    text-transform: uppercase;
    flex-shrink: 0;
}
.profile-app .sv-item__badge--stock    { background: rgba(14,124,123,0.1);   color: var(--teal, #0E7C7B); }
.profile-app .sv-item__badge--company  { background: rgba(75,116,232,0.1);   color: #4B74E8; }
.profile-app .sv-item__badge--article  { background: rgba(224,122,48,0.1);   color: #E07A30; }
.profile-app .sv-item__badge--currency { background: rgba(124,79,216,0.1);   color: #7C4FD8; }
.profile-app .sv-item__badge--asset,
.profile-app .sv-item__badge--platform,
.profile-app .sv-item__badge--license,
.profile-app .sv-item__badge--default  { background: var(--pa-surface-muted); color: var(--text-muted, #5E7A95); }

.profile-app .sv-item__age {
    font-size: 0.72rem;
    color: var(--text-muted, #5E7A95);
    margin-inline-start: auto;
    white-space: nowrap;
}

/* ── Title ── */
.profile-app .sv-item__title {
    font-size: 0.94rem;
    font-weight: var(--font-extrabold, 800);
    color: var(--navy, #152D50);
    margin: 0 0 8px;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.profile-app .sv-item__title a { color: inherit; text-decoration: none; }
.profile-app .sv-item__title a:hover { color: var(--teal, #0E7C7B); }

/* ── Excerpt ── */
.profile-app .sv-item__excerpt {
    font-size: 0.82rem;
    color: var(--text-muted, #5E7A95);
    line-height: 1.55;
    flex: 1;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-block-end: 14px;
}

/* ── Actions row ── */
.profile-app .sv-item__actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding-block-start: 12px;
    border-block-start: 1px solid var(--pa-border-light);
    margin-block-start: auto;
}
.profile-app .sv-item__read-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 0.78rem;
    font-weight: var(--font-bold, 700);
    color: var(--teal, #0E7C7B);
    text-decoration: none;
    padding: 5px 12px;
    border-radius: 8px;
    background: rgba(14, 124, 123, 0.07);
    border: 1px solid rgba(14, 124, 123, 0.15);
    transition: background .15s ease, color .15s ease;
}
.profile-app .sv-item__read-btn:hover {
    background: rgba(14, 124, 123, 0.14);
    color: var(--teal, #0E7C7B);
}

/* ── Right-actions group (share + savable) ── */
.profile-app .sv-item__right-actions {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

/* ── Share widget ── */
.profile-app .sv-share {
    position: relative;
    display: inline-flex;
}
.profile-app .sv-share__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: none;
    border-radius: 50%;
    background: var(--pa-surface-muted);
    color: var(--text-muted, #5E7A95);
    cursor: pointer;
    transition: background .15s ease, color .15s ease, transform .12s ease;
    box-shadow: 0 1px 3px rgba(0,0,0,.07);
}
.profile-app .sv-share__btn:hover {
    background: rgba(14, 124, 123, 0.1);
    color: var(--teal, #0E7C7B);
    transform: translateY(-1px);
}
.profile-app .sv-share.is-open .sv-share__btn {
    background: var(--teal, #0E7C7B);
    color: #fff;
}

/* ── Popover ── */
.profile-app .sv-share__popover {
    position: absolute;
    bottom: calc(100% + 8px);
    inset-inline-end: 0;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 10px;
    background: #fff;
    border: 1px solid var(--pa-border);
    border-radius: 14px;
    box-shadow: 0 8px 24px rgba(21, 45, 80, 0.14), 0 2px 6px rgba(21, 45, 80, 0.08);
    white-space: nowrap;
    z-index: 50;
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px) scale(0.96);
    transform-origin: bottom right;
    transition: opacity .18s ease, transform .18s ease, visibility .18s;
}
.profile-app .sv-share.is-open .sv-share__popover {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
}
/* Arrow */
.profile-app .sv-share__popover::after {
    content: '';
    position: absolute;
    bottom: -6px;
    inset-inline-end: 10px;
    width: 10px;
    height: 10px;
    background: #fff;
    border-inline-end: 1px solid var(--pa-border);
    border-bottom: 1px solid var(--pa-border);
    transform: rotate(45deg);
}

/* ── Individual share icons ── */
.profile-app .sv-share__item {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: none;
    cursor: pointer;
    text-decoration: none;
    color: #fff;
    transition: transform .15s ease, filter .15s ease;
    flex-shrink: 0;
}
.profile-app .sv-share__item:hover { transform: scale(1.12); filter: brightness(1.1); }
.profile-app .sv-share__item--fb   { background: #1877F2; }
.profile-app .sv-share__item--x    { background: #000; }
.profile-app .sv-share__item--wa   { background: #25D366; }
.profile-app .sv-share__item--tg   { background: #229ED9; }
.profile-app .sv-share__item--copy {
    background: var(--pa-surface-muted);
    color: var(--text-muted, #5E7A95);
    border: 1px solid var(--pa-border);
}
.profile-app .sv-share__item--copy:hover { color: var(--navy, #152D50); }
.profile-app .sv-share__item--copy.is-copied {
    background: rgba(14, 124, 123, 0.1);
    color: var(--teal, #0E7C7B);
    border-color: var(--teal, #0E7C7B);
}

/* ── List Mode Overrides ── */
.profile-app .sv-items--list .sv-item {
    flex-direction: row;
    align-items: stretch;
}
.profile-app .sv-items--list .sv-item::before { width: 3px; height: auto; }
.profile-app .sv-items--list .sv-item__thumb { width: 130px; flex-shrink: 0; }
.profile-app .sv-items--list .sv-item__img,
.profile-app .sv-items--list .sv-item__placeholder { height: 100%; min-height: 110px; width: 130px; }
.profile-app .sv-items--list .sv-item__body { padding: 14px 18px; justify-content: center; }
.profile-app .sv-items--list .sv-item__excerpt { -webkit-line-clamp: 1; margin-block-end: 10px; }
.profile-app .sv-items--list .sv-item__title  { -webkit-line-clamp: 1; margin-block-end: 5px; }

/* ── Pagination ── */
.profile-app .sv-pagination { margin-block-start: 28px; }

/* ── Empty State ── */
.profile-app .sv-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 14px;
    padding: 64px 24px;
    background: var(--pa-surface);
    border: 2px dashed var(--pa-border);
    border-radius: var(--pa-r-xl);
}
.profile-app .sv-empty__visual {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: var(--pa-surface-muted);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--pa-border-strong);
    margin-block-end: 4px;
}
.profile-app .sv-empty__heading {
    font-size: 1.1rem;
    font-weight: var(--font-extrabold, 800);
    color: var(--navy, #152D50);
}
.profile-app .sv-empty__body {
    font-size: 0.86rem;
    color: var(--text-muted, #5E7A95);
    line-height: 1.65;
    max-width: 380px;
}
.profile-app .sv-empty__cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 24px;
    border-radius: var(--pa-r-sm);
    background: var(--teal, #0E7C7B);
    color: #fff;
    font-size: 0.88rem;
    font-weight: var(--font-bold, 700);
    text-decoration: none;
    margin-block-start: 8px;
    transition: background .15s ease, transform .15s ease;
}
.profile-app .sv-empty__cta:hover { background: #0a6160; transform: translateY(-1px); color: #fff; }

/* ── Responsive ── */
@media (max-width: 900px) {
    .profile-app .sv-items--grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
    .profile-app .sv-page-header { padding: 16px; flex-direction: column; align-items: flex-start; }
    .profile-app .sv-items--grid { grid-template-columns: 1fr; }
    .profile-app .sv-items--list .sv-item__thumb { width: 90px; }
    .profile-app .sv-controls { flex-wrap: wrap; }
}


/* ─── ALERTS FEED (.nf-*) ─── */
.profile-app .nf-date-sep {
    font-size: 0.7rem;
    font-weight: var(--font-extrabold, 800);
    color: var(--text-muted, #5E7A95);
    letter-spacing: 0.8px;
    text-transform: uppercase;
    padding: 22px 4px 10px;
}
.profile-app .nf-date-sep:first-of-type { padding-top: 0; }

.profile-app .nf {
    display: flex;
    gap: 16px;
    padding: 18px 20px;
    margin-block-end: 8px;
    border-radius: var(--pa-r-sm);
    background: var(--pa-surface);
    border: 1px solid var(--pa-border);
    transition: background .12s ease, border-color .12s ease;
    position: relative;
}
.profile-app .nf:hover {
    background: var(--pa-surface-soft);
    border-color: var(--pa-border-strong);
}
.profile-app .nf--unread { background: var(--teal-bg, #EBF7F7); border-color: var(--teal-border, #B8E0DF); }
.profile-app .nf--unread:hover { background: #E0F2F1; }
.profile-app .nf--unread::before {
    content: '';
    position: absolute;
    inset-inline-start: 0;
    inset-block: 0;
    width: 3px;
    border-start-start-radius: var(--pa-r-sm);
    border-end-start-radius: var(--pa-r-sm);
    background: var(--teal, #0E7C7B);
}
.profile-app .nf__icon {
    width: 44px;
    height: 44px;
    border-radius: var(--pa-r-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.profile-app .nf__icon svg { width: 20px; height: 20px; }
.profile-app .nf__icon--instrument { background: var(--pa-success-bg); color: var(--pa-success-fg); }
.profile-app .nf__icon--economic   { background: var(--pa-warn-bg);    color: var(--pa-warn-fg); }
.profile-app .nf__icon--topic      { background: var(--pa-info-bg);    color: var(--pa-info-fg); }
.profile-app .nf__icon--default    { background: var(--pa-purple-bg);  color: var(--pa-purple-fg); }
.profile-app .nf__body { flex: 1; min-width: 0; }
.profile-app .nf__row1 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-block-end: 4px;
}
.profile-app .nf__title {
    font-size: 0.92rem;
    font-weight: var(--font-extrabold, 800);
    color: var(--navy, #152D50);
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.profile-app .nf__time {
    font-size: 0.76rem;
    color: var(--text-muted, #5E7A95);
    white-space: nowrap;
    flex-shrink: 0;
    font-weight: var(--font-medium, 500);
}
.profile-app .nf__desc {
    font-size: 0.84rem;
    color: var(--text-mid, #3D5A7A);
    line-height: 1.55;
}
.profile-app .nf__row3 {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-block-start: 12px;
    flex-wrap: wrap;
}
.profile-app .nf__tag {
    font-size: 0.7rem;
    font-weight: var(--font-extrabold, 800);
    padding: 3px 12px;
    border-radius: 999px;
    letter-spacing: 0.2px;
}
.profile-app .nf__tag--instrument { background: var(--pa-success-bg); color: var(--pa-success-fg); }
.profile-app .nf__tag--economic   { background: var(--pa-warn-bg);    color: var(--pa-warn-fg); }
.profile-app .nf__tag--topic      { background: var(--pa-info-bg);    color: var(--pa-info-fg); }
.profile-app .nf__tag--default    { background: var(--pa-purple-bg);  color: var(--pa-purple-fg); }
.profile-app .nf__mark-btn {
    font-size: 0.76rem;
    font-weight: var(--font-bold, 700);
    color: var(--teal, #0E7C7B);
    background: transparent;
    border: 0;
    cursor: pointer;
    padding: 0;
    transition: color .15s ease;
}
.profile-app .nf__mark-btn:hover { color: var(--teal-light, #12A09E); text-decoration: underline; }

/* ─── INVESTORS (.inv-*) ─── */
.profile-app .inv-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}
.profile-app .inv-card {
    background: var(--pa-surface);
    border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-lg);
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
    display: flex;
    flex-direction: column;
}
.profile-app .inv-card:hover {
    border-color: var(--pa-border-strong);
    box-shadow: var(--pa-shadow-md);
    transform: translateY(-3px);
    color: inherit;
}
.profile-app .inv-card__cover {
    height: 130px;
    background: linear-gradient(135deg, var(--navy, #152D50) 0%, var(--navy-light, #1A3456) 50%, var(--teal, #0E7C7B) 130%);
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
}
.profile-app .inv-card__cover::before {
    content: '';
    position: absolute;
    inset-block-start: -40px;
    inset-inline-end: -40px;
    width: 140px;
    height: 140px;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.08) 0%, transparent 70%);
    pointer-events: none;
}
.profile-app .inv-card__avatar {
    width: 76px;
    height: 76px;
    border-radius: 50%;
    border: 3px solid var(--pa-surface);
    background: var(--pa-surface);
    overflow: hidden;
    position: relative;
    margin-block-start: -38px;
    margin-inline-start: 20px;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(21, 45, 80, 0.18);
    z-index: 1;
}
.profile-app .inv-card__avatar img { width: 100%; height: 100%; object-fit: cover; }
.profile-app .inv-card__avatar-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--navy, #152D50), var(--navy-light, #1A3456));
    color: var(--text-on-navy, #fff);
    font-size: 1.5rem;
    font-weight: var(--font-extrabold, 800);
}
.profile-app .inv-card__body {
    padding: 48px 22px 22px;
    flex: 1;
    display: flex;
    flex-direction: column;
}
.profile-app .inv-card__name {
    font-size: 1.05rem;
    font-weight: var(--font-extrabold, 800);
    color: var(--navy, #152D50);
    margin: 0 0 4px;
    line-height: 1.3;
}
.profile-app .inv-card__title {
    font-size: 0.82rem;
    color: var(--text-muted, #5E7A95);
    margin-block-end: 12px;
}
.profile-app .inv-card__worth {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 0.8rem;
    font-weight: var(--font-extrabold, 800);
    color: var(--pa-success-fg);
    background: var(--pa-success-bg);
    padding: 5px 12px;
    border-radius: 999px;
    align-self: flex-start;
    margin-block-end: 12px;
}
.profile-app .inv-card__bio {
    font-size: 0.84rem;
    color: var(--text-mid, #3D5A7A);
    line-height: 1.55;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    flex: 1;
}
.profile-app .inv-card__link {
    font-size: 0.82rem;
    font-weight: var(--font-extrabold, 800);
    color: var(--teal, #0E7C7B);
    margin-block-start: 14px;
    display: flex;
    align-items: center;
    gap: 5px;
    transition: gap .15s ease;
}
.profile-app .inv-card:hover .inv-card__link { gap: 10px; }

/* ─── RESPONSIVE for these page sections ─── */
@media (max-width: 768px) {
    .profile-app .sv-grid  { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .profile-app .inv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
    .profile-app .snt-card { padding: 16px; gap: 14px; }
    .profile-app .nf       { padding: 14px 16px; gap: 12px; }
}
@media (max-width: 576px) {
    .profile-app .snt-card { flex-direction: column; align-items: flex-start; gap: 10px; padding: 14px 16px; }
    .profile-app .snt-card__row1 { flex-wrap: wrap; }
    .profile-app .snt-card__actions { align-self: flex-end; }
    .profile-app .nf__icon { width: 38px; height: 38px; }
    .profile-app .nf__icon svg { width: 18px; height: 18px; }
}
@media (max-width: 480px) {
    .profile-app .sv-grid  { grid-template-columns: 1fr; }
    .profile-app .inv-grid { grid-template-columns: 1fr; }
    .profile-app .sv-card__img,
    .profile-app .sv-card__placeholder { height: 144px; }
    .profile-app .inv-card__cover { height: 110px; }
    .profile-app .inv-card__avatar { width: 64px; height: 64px; margin-block-start: -32px; }
    .profile-app .inv-card__body { padding-block-start: 42px; }
}

/* ═══════════════════════════════════════════════════════════════
   CHARTS v2 (.ch2-*) — modern redesign 2026-05-07
   Full-width layout: header bar → horizontal metrics pills →
   chart card → sector peers panel → data table.
   ═══════════════════════════════════════════════════════════════ */

/* ── Root wrapper ── */
.profile-app .ch2 { display: flex; flex-direction: column; gap: 0; }

/* ── Header bar ── */
.profile-app .ch2-header {
    display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
    background: var(--pa-surface); border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-lg); padding: 18px 22px; margin-block-end: 14px;
    box-shadow: var(--pa-shadow-sm);
}
.profile-app .ch2-header__stock { display: flex; align-items: center; gap: 14px; flex: 1; min-width: 0; }
.profile-app .ch2-header__avatar {
    width: 46px; height: 46px; border-radius: 14px; flex-shrink: 0;
    background: linear-gradient(135deg, var(--navy, #152D50), #2A4A7A);
    color: var(--text-on-navy, #fff);
    display: flex; align-items: center; justify-content: center;
    font-size: 0.82rem; font-weight: var(--font-extrabold, 800);
    letter-spacing: .02em; text-transform: uppercase;
}
.profile-app .ch2-header__symbol {
    font-size: 1.25rem; font-weight: var(--font-extrabold, 800);
    color: var(--navy, #152D50); line-height: 1.15;
}
.profile-app .ch2-header__name {
    font-size: 0.82rem; color: var(--text-muted, #5E7A95); margin-block-start: 1px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 200px;
}
.profile-app .ch2-header__sector-badge {
    display: inline-flex; align-items: center;
    padding: 4px 12px; border-radius: 999px; font-size: 0.75rem; font-weight: var(--font-bold, 700);
    background: rgba(14, 124, 123, 0.10); color: var(--teal, #0E7C7B);
    border: 1px solid rgba(14, 124, 123, 0.20); white-space: nowrap; flex-shrink: 0;
}

/* Quick stats row inside header */
.profile-app .ch2-header__stats { display: flex; gap: 6px; flex-wrap: wrap; flex-shrink: 0; }
.profile-app .ch2-stat {
    display: flex; flex-direction: column; align-items: center;
    background: var(--pa-surface-soft); border: 1px solid var(--pa-border-light);
    border-radius: 10px; padding: 6px 14px; min-width: 72px;
}
.profile-app .ch2-stat__label {
    font-size: 0.68rem; color: var(--text-muted, #5E7A95); font-weight: var(--font-bold, 700);
    text-transform: uppercase; letter-spacing: .3px; white-space: nowrap;
}
.profile-app .ch2-stat__val {
    font-size: 0.88rem; font-weight: var(--font-extrabold, 800);
    color: var(--navy, #152D50); margin-block-start: 1px;
}

/* Search form inside header */
.profile-app .ch2-search-form { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.profile-app .ch2-search-wrap {
    position: relative;
    border: 1px solid var(--pa-border); border-radius: var(--pa-r-sm);
    background: var(--pa-surface-soft);
    transition: border-color .15s, box-shadow .15s;
}
.profile-app .ch2-search-wrap:focus-within {
    border-color: var(--teal, #0E7C7B); box-shadow: var(--pa-shadow-glow);
    background: var(--pa-surface);
}
.profile-app .ch2-search-icon {
    position: absolute; inset-inline-start: 12px; inset-block-start: 50%;
    transform: translateY(-50%); color: var(--text-muted, #5E7A95); pointer-events: none;
}
.profile-app .ch2-search-input {
    padding: 9px 14px 9px 38px; width: 180px;
    border: 0; background: transparent; outline: none;
    font-size: 0.88rem; font-family: inherit; color: var(--navy, #152D50);
}
.profile-app .ch2-search-btn {
    display: inline-flex; align-items: center; justify-content: center;
    width: 38px; height: 38px; border-radius: var(--pa-r-sm); border: 0;
    background: var(--navy, #152D50); color: var(--text-on-navy, #fff);
    cursor: pointer; flex-shrink: 0;
    transition: background .15s, transform .1s;
}
.profile-app .ch2-search-btn:hover { background: var(--teal, #0E7C7B); }
.profile-app .ch2-search-btn:active { transform: scale(.95); }

/* Autocomplete suggestions */
.profile-app .ch2-sug {
    position: absolute; inset-block-start: calc(100% + 6px); inset-inline: 0;
    z-index: 50; display: none; max-height: 300px; overflow-y: auto;
    background: var(--pa-surface); border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-md); box-shadow: var(--pa-shadow-lg);
}
.profile-app .ch2-sug__item {
    display: flex; align-items: center; gap: 10px;
    padding: 10px 14px; cursor: pointer; border-block-end: 1px solid var(--pa-border-light);
    transition: background .1s;
}
.profile-app .ch2-sug__item:last-child { border-block-end: 0; }
.profile-app .ch2-sug__item:hover { background: var(--pa-surface-soft); }
.profile-app .ch2-sug__avatar {
    width: 30px; height: 30px; border-radius: 8px; flex-shrink: 0;
    background: linear-gradient(135deg, var(--navy, #152D50), #2A4A7A);
    color: var(--text-on-navy, #fff);
    display: flex; align-items: center; justify-content: center;
    font-size: 0.68rem; font-weight: var(--font-extrabold, 800);
}
.profile-app .ch2-sug__sym { font-weight: var(--font-extrabold, 800); color: var(--navy, #152D50); font-size: 0.9rem; }
.profile-app .ch2-sug__name { font-size: 0.76rem; color: var(--text-muted, #5E7A95); }

/* ── Metrics bar ── */
.profile-app .ch2-metrics-bar {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
    background: var(--pa-surface); border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-lg); padding: 14px 20px; margin-block-end: 14px;
    box-shadow: var(--pa-shadow-sm);
}
.profile-app .ch2-metrics-group { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.profile-app .ch2-metrics-group--end { margin-inline-start: auto; }
.profile-app .ch2-metrics-group__label {
    font-size: 0.68rem; font-weight: var(--font-extrabold, 800);
    color: var(--text-muted, #5E7A95); text-transform: uppercase;
    letter-spacing: .5px; white-space: nowrap; padding-inline-end: 4px;
}
.profile-app .ch2-metrics-pills { display: flex; gap: 5px; flex-wrap: wrap; }
.profile-app .ch2-pill {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 7px 15px; border-radius: 999px;
    font-size: 0.82rem; font-weight: var(--font-bold, 700);
    background: var(--pa-surface-muted); color: var(--text-mid, #3D5A7A);
    text-decoration: none; border: 1px solid transparent;
    transition: all .15s ease; white-space: nowrap;
}
.profile-app .ch2-pill:hover { background: var(--pa-border-light); color: var(--navy, #152D50); border-color: var(--pa-border); }
.profile-app .ch2-pill.active {
    background: var(--navy, #152D50); color: var(--text-on-navy, #fff);
    border-color: var(--navy, #152D50); box-shadow: 0 2px 8px rgba(21,45,80,.22);
}
.profile-app .ch2-pill.disabled { opacity: 0.45; pointer-events: none; cursor: default; }
.profile-app .ch2-pill__lock { opacity: .7; }

/* Interval toggle */
.profile-app .ch2-interval-wrap { display: flex; border: 1px solid var(--pa-border); border-radius: 999px; overflow: hidden; }
.profile-app .ch2-interval-btn {
    padding: 6px 14px; font-size: 0.78rem; font-weight: var(--font-bold, 700);
    color: var(--text-mid, #3D5A7A); text-decoration: none; white-space: nowrap;
    transition: background .12s, color .12s;
}
.profile-app .ch2-interval-btn:hover { background: var(--pa-surface-soft); color: var(--navy, #152D50); }
.profile-app .ch2-interval-btn.active { background: var(--teal, #0E7C7B); color: var(--text-on-navy, #fff); }

/* ── Body layout ── */
.profile-app .ch2-body { display: flex; flex-direction: column; gap: 14px; }

/* ── Chart card ── */
.profile-app .ch2-chart-card {
    background: var(--pa-surface); border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-lg); padding: 24px; box-shadow: var(--pa-shadow-sm);
}
.profile-app .ch2-chart-card__head {
    display: flex; align-items: flex-start; justify-content: space-between;
    gap: 16px; flex-wrap: wrap; margin-block-end: 20px;
}
.profile-app .ch2-chart-card__title {
    font-size: 1.05rem; font-weight: var(--font-extrabold, 800);
    color: var(--navy, #152D50); margin: 0;
}
.profile-app .ch2-chart-card__desc { font-size: 0.82rem; color: var(--text-muted, #5E7A95); margin-block-start: 3px; }
.profile-app .ch2-chart-card__sub { font-size: 0.78rem; color: var(--text-muted, #5E7A95); }
.profile-app .ch2-chart-card--secondary { margin-block-start: 20px; }
.profile-app .ch2-canvas--secondary { height: 240px; }

/* Toggle controls */
.profile-app .ch2-chart-controls { display: flex; gap: 12px; align-items: center; flex-shrink: 0; flex-wrap: wrap; }
.profile-app .ch2-toggle { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; user-select: none; }
.profile-app .ch2-toggle input { position: absolute; opacity: 0; width: 0; height: 0; }
.profile-app .ch2-toggle__track {
    width: 34px; height: 20px; border-radius: 999px; flex-shrink: 0;
    background: var(--pa-surface-muted); border: 1px solid var(--pa-border);
    position: relative; transition: background .2s, border-color .2s;
}
.profile-app .ch2-toggle__track::after {
    content: ''; position: absolute; inset-block-start: 2px; inset-inline-start: 2px;
    width: 14px; height: 14px; border-radius: 999px;
    background: var(--pa-border-strong); transition: transform .2s, background .2s;
}
.profile-app .ch2-toggle input:checked + .ch2-toggle__track { background: var(--teal, #0E7C7B); border-color: var(--teal, #0E7C7B); }
.profile-app .ch2-toggle input:checked + .ch2-toggle__track::after { transform: translateX(14px); background: #fff; }
.profile-app .ch2-toggle__label {
    font-size: 0.82rem; font-weight: var(--font-bold, 700);
    color: var(--text-mid, #3D5A7A); white-space: nowrap;
}

/* Canvas */
.profile-app .ch2-figure { display: block; margin: 0; }
.profile-app .ch2-canvas { width: 100%; height: 380px; }

/* ── Compare & secondary chart canvases ── */
.profile-app .ch2-chart-card--compare { margin-block-start: 20px; }
.profile-app .ch2-chart-card--secondary { margin-block-start: 20px; }
.profile-app .ch2-canvas--compare { width: 100%; height: 380px; }
.profile-app .ch2-canvas--secondary { width: 100%; height: 260px; }

/* ── Responsive ── */
@media (max-width: 992px) {
    .profile-app .ch2-header__stats { display: none; }
}
@media (max-width: 768px) {
    .profile-app .ch2-header { gap: 12px; padding: 14px 16px; }
    .profile-app .ch2-header__name { max-width: 140px; }
    .profile-app .ch2-search-input { width: 140px; }
    .profile-app .ch2-metrics-bar { padding: 12px 14px; gap: 6px; }
    .profile-app .ch2-metrics-group--end { margin-inline-start: 0; }
    .profile-app .ch2-chart-card { padding: 16px; }
    .profile-app .ch2-canvas { height: 280px; }
    .profile-app .ch2-canvas--compare { min-height: 200px; }
    .profile-app .ch2-canvas--secondary { height: 200px; }
}
@media (max-width: 480px) {
    .profile-app .ch2-header__sector-badge { display: none; }
}

/* ─── SCREENER (.scr-*) ─── */
.profile-app .scr { max-width: 1200px; margin-inline: auto; }
.profile-app .scr-search { position: relative; margin-block-end: 16px; }
.profile-app .scr-search__input {
    width: 100%; padding: 14px 22px 14px 48px;
    border: 1px solid var(--pa-border); border-radius: var(--pa-r-md);
    font-size: 0.95rem; font-family: inherit; color: var(--text, #1A2B45);
    background: var(--pa-surface); outline: none;
    transition: border-color .15s, box-shadow .15s;
}
.profile-app .scr-search__input:focus {
    border-color: var(--teal, #0E7C7B);
    box-shadow: var(--pa-shadow-glow);
}
.profile-app .scr-search__icon {
    position: absolute; inset-block-start: 50%; inset-inline-start: 16px;
    transform: translateY(-50%); color: var(--text-muted, #5E7A95); pointer-events: none;
}
.profile-app .scr-filter-toggle {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 9px 18px; border-radius: var(--pa-r-sm);
    border: 1px solid var(--pa-border); background: var(--pa-surface);
    font-size: 0.85rem; font-weight: var(--font-bold, 700); color: var(--text-mid, #3D5A7A);
    cursor: pointer; font-family: inherit;
    transition: all .15s ease; margin-block-end: 16px;
}
.profile-app .scr-filter-toggle:hover { border-color: var(--pa-border-strong); color: var(--navy, #152D50); }
.profile-app .scr-filter-toggle.is-open { background: var(--navy, #152D50); color: var(--text-on-navy, #fff); border-color: var(--navy, #152D50); }
.profile-app .scr-filter-toggle svg { transition: transform .2s; }
.profile-app .scr-filter-toggle.is-open svg { transform: rotate(180deg); }
.profile-app .scr-panel {
    background: var(--pa-surface); border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-md); padding: 24px; margin-block-end: 16px;
    box-shadow: var(--pa-shadow-sm); display: none;
}
.profile-app .scr-panel.is-open { display: block; }
.profile-app .scr-fg { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-block-end: 16px; }
.profile-app .scr-fc {
    padding: 14px; background: var(--pa-surface-soft);
    border-radius: var(--pa-r-sm); border: 1px solid var(--pa-border-light);
}
.profile-app .scr-fc__label {
    font-size: 0.7rem; font-weight: var(--font-extrabold, 800);
    color: var(--text-muted, #5E7A95); text-transform: uppercase;
    letter-spacing: 0.5px; margin-block-end: 8px;
}
.profile-app .scr-fc__row { display: flex; gap: 6px; align-items: center; }
.profile-app .scr-sel, .profile-app .scr-inp {
    padding: 8px 11px; border: 1px solid var(--pa-border); border-radius: 8px;
    font-size: 0.84rem; font-family: inherit; color: var(--text, #1A2B45);
    background: var(--pa-surface); outline: none;
    transition: border-color .15s; flex: 1; min-width: 0;
}
.profile-app .scr-sel:focus, .profile-app .scr-inp:focus { border-color: var(--teal, #0E7C7B); }
.profile-app select.scr-sel { cursor: pointer; }
.profile-app .scr-inp--num { max-width: 90px; flex: none; text-align: center; }
.profile-app .scr-panel__actions {
    display: flex; gap: 8px; align-items: center;
    padding-block-start: 16px; border-block-start: 1px solid var(--pa-border-light);
}
.profile-app .scr-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-block-end: 16px; }
.profile-app .scr-chip {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 5px 14px; background: var(--teal-bg, #EBF7F7);
    border: 1px solid var(--teal-border, #B8E0DF);
    border-radius: 999px; font-size: 0.74rem;
    font-weight: var(--font-bold, 700); color: var(--teal, #0E7C7B);
}
.profile-app .scr-chip__x {
    width: 18px; height: 18px; border-radius: 50%;
    background: rgba(14, 124, 123, 0.15); display: flex;
    align-items: center; justify-content: center;
    text-decoration: none; color: var(--teal, #0E7C7B); font-size: 0.7rem;
    font-weight: var(--font-extrabold, 800); transition: background .12s;
}
.profile-app .scr-chip__x:hover { background: rgba(14, 124, 123, 0.30); }
.profile-app .scr-chips__clear {
    font-size: 0.76rem; font-weight: var(--font-bold, 700);
    color: var(--text-muted, #5E7A95); text-decoration: none; margin-inline-end: 8px;
}
.profile-app .scr-chips__clear:hover { color: var(--pa-danger-fg); }
.profile-app .scr-count {
    font-size: 0.85rem; color: var(--text-muted, #5E7A95);
    margin-block-end: 12px; display: flex; align-items: center; gap: 6px;
}
.profile-app .scr-count b { color: var(--navy, #152D50); font-weight: var(--font-extrabold, 800); }
.profile-app .scr-tw {
    background: var(--pa-surface); border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-md); overflow: hidden;
    box-shadow: var(--pa-shadow-sm);
}
.profile-app .scr-t { width: 100%; border-collapse: collapse; font-size: 0.86rem; }
.profile-app .scr-t thead { background: linear-gradient(180deg, var(--navy), var(--navy-light)); color: var(--text-on-navy, #fff); }
.profile-app .scr-t th {
    padding: 12px 14px; font-weight: var(--font-bold, 700);
    white-space: nowrap; font-size: 0.78rem; letter-spacing: 0.2px; text-align: start;
}
.profile-app .scr-t td {
    padding: 11px 14px; white-space: nowrap;
    border-block-end: 1px solid var(--pa-border-light); color: var(--text, #1A2B45);
}
.profile-app .scr-t tbody tr:last-child td { border-block-end: none; }
.profile-app .scr-t tbody tr:hover { background: var(--pa-surface-soft); }
.profile-app .scr-t .t-sym { font-weight: var(--font-extrabold, 800); color: var(--navy, #152D50); font-size: 0.92rem; }
.profile-app .scr-t .t-name { color: var(--text-muted, #5E7A95); max-width: 200px; overflow: hidden; text-overflow: ellipsis; }
.profile-app .scr-t .t-tag {
    font-size: 0.7rem; font-weight: var(--font-bold, 700); padding: 2px 10px;
    border-radius: 999px; background: var(--pa-border-light); color: var(--text-mid, #3D5A7A);
    display: inline-block;
}
.profile-app .scr-t .t-pos { color: var(--pa-success-fg); font-weight: var(--font-bold, 700); }
.profile-app .scr-t .t-neg { color: var(--pa-danger-fg);  font-weight: var(--font-bold, 700); }
.profile-app .scr-empty { text-align: center; padding: 48px; color: var(--text-muted, #5E7A95); font-size: 0.92rem; }

@media (max-width: 768px) {
    .profile-app .scr-fg { grid-template-columns: 1fr 1fr; }
    .profile-app .scr-panel { padding: 18px; }
}
@media (max-width: 480px) {
    .profile-app .scr-fg { grid-template-columns: 1fr; }
    .profile-app .scr-fc__row { flex-wrap: wrap; }
    .profile-app .scr-filter-toggle { font-size: 0.84rem; width: 100%; justify-content: center; }
}

/* ─── ALERT CENTER (.ac-*) ─── */
.profile-app .ac-wrap { max-width: 980px; margin-inline: auto; }
.profile-app .ac-form-card {
    background: var(--pa-surface); border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-md); padding: 22px 24px; margin-block-end: 20px;
    box-shadow: var(--pa-shadow-sm);
}
.profile-app .ac-form-card__title {
    font-size: 1rem; font-weight: var(--font-extrabold, 800);
    color: var(--navy, #152D50); margin: 0 0 16px;
    display: flex; align-items: center; gap: 10px;
}
.profile-app .ac-form-card__title svg { color: var(--teal, #0E7C7B); }
.profile-app .ac-rule {
    display: flex; align-items: center; gap: 14px;
    padding: 16px 20px; background: var(--pa-surface);
    border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-sm); margin-block-end: 8px;
    transition: border-color .12s ease, box-shadow .12s ease;
}
.profile-app .ac-rule:hover { border-color: var(--pa-border-strong); box-shadow: var(--pa-shadow-sm); }
.profile-app .ac-rule.disabled { opacity: 0.55; }
.profile-app .ac-rule__icon {
    width: 42px; height: 42px; border-radius: var(--pa-r-sm);
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.profile-app .ac-rule__icon--instrument { background: var(--pa-success-bg); color: var(--pa-success-fg); }
.profile-app .ac-rule__icon--economic   { background: var(--pa-warn-bg);    color: var(--pa-warn-fg); }
.profile-app .ac-rule__icon--editor     { background: var(--pa-info-bg);    color: var(--pa-info-fg); }
.profile-app .ac-rule__body { flex: 1; min-width: 0; }
.profile-app .ac-rule__name { font-size: 0.92rem; font-weight: var(--font-extrabold, 800); color: var(--text, #1A2B45); margin-block-end: 4px; }
.profile-app .ac-rule__meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.profile-app .ac-rule__tag {
    font-size: 0.7rem; font-weight: var(--font-extrabold, 800);
    padding: 3px 11px; border-radius: 999px;
    background: var(--pa-border-light); color: var(--text-mid, #3D5A7A);
    letter-spacing: 0.2px;
}
.profile-app .ac-rule__tag--green { background: var(--pa-success-bg); color: var(--pa-success-fg); }
.profile-app .ac-rule__tag--red   { background: var(--pa-danger-bg);  color: var(--pa-danger-fg); }
.profile-app .ac-rule__actions { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.profile-app .ac-icon-btn {
    width: 34px; height: 34px; border-radius: 8px;
    border: 1px solid var(--pa-border); background: var(--pa-surface);
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; color: var(--text-muted, #5E7A95);
    transition: all .12s ease;
}
.profile-app .ac-icon-btn:hover { border-color: var(--navy, #152D50); color: var(--navy, #152D50); }
.profile-app .ac-icon-btn--danger:hover { border-color: var(--pa-danger-fg); color: var(--pa-danger-fg); background: rgba(239, 68, 68, 0.06); }
.profile-app .ac-toggle-btn {
    font-size: 0.7rem; font-weight: var(--font-extrabold, 800);
    padding: 5px 13px; border-radius: 999px;
    border: 0; cursor: pointer; transition: all .12s ease;
}
.profile-app .ac-toggle-btn--on { background: var(--pa-success-bg); color: var(--pa-success-fg); }
.profile-app .ac-toggle-btn--on:hover { background: rgba(16, 163, 127, 0.20); }
.profile-app .ac-toggle-btn--off { background: var(--pa-border-light); color: var(--text-muted, #5E7A95); }
.profile-app .ac-toggle-btn--off:hover { background: var(--pa-border); }
.profile-app .ac-empty { text-align: center; padding: 40px 20px; color: var(--text-muted, #5E7A95); font-size: 0.9rem; }
.profile-app .ac-coming-soon {
    text-align: center; padding: 40px 20px; background: var(--pa-surface-soft);
    border-radius: var(--pa-r-md); color: var(--text-muted, #5E7A95);
    font-size: 0.92rem; font-weight: var(--font-bold, 700);
}
.profile-app .ac-section-gap { margin-block-start: 32px; }
.profile-app #instrument-symbol-suggestions,
.profile-app #economic-suggestions {
    z-index: 1000; display: none; max-height: 280px; overflow: auto;
    border: 1px solid var(--pa-border); border-radius: var(--pa-r-sm);
    background: var(--pa-surface); box-shadow: var(--pa-shadow-lg);
}
.profile-app #instrument-symbol-suggestions button,
.profile-app #economic-suggestions button {
    display: block; width: 100%; text-align: start; padding: 11px 16px;
    border: 0; background: transparent; font-size: 0.92rem; color: var(--text, #1A2B45);
    cursor: pointer; border-block-end: 1px solid var(--pa-border-light); font-family: inherit;
}
.profile-app #instrument-symbol-suggestions button:last-child,
.profile-app #economic-suggestions button:last-child { border-block-end: none; }
.profile-app #instrument-symbol-suggestions button:hover,
.profile-app #economic-suggestions button:hover { background: var(--pa-surface-soft); }
.profile-app #instrument-symbol-suggestions button { display: flex !important; align-items: center; gap: 10px; }
.profile-app #instrument-symbol-suggestions button .sym-logo { width: 30px; height: 30px; border-radius: 8px; object-fit: contain; flex-shrink: 0; background: var(--pa-surface-muted); }
.profile-app #instrument-symbol-suggestions button .sym-placeholder {
    width: 30px; height: 30px; border-radius: 8px; flex-shrink: 0;
    background: var(--pa-surface-muted); display: flex; align-items: center; justify-content: center;
    font-size: 0.7rem; font-weight: var(--font-extrabold, 800); color: var(--text-muted, #5E7A95);
}
.profile-app #instrument-symbol-suggestions button .sym-info { flex: 1; min-width: 0; }
.profile-app #instrument-symbol-suggestions button .sym-code { font-weight: var(--font-extrabold, 800); font-size: 0.92rem; color: var(--navy, #152D50); }
.profile-app #instrument-symbol-suggestions button .sym-name { font-size: 0.78rem; color: var(--text-muted, #5E7A95); display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.profile-app #instrument-symbol-suggestions button .sym-exchange { font-size: 0.7rem; color: var(--pa-border-strong); margin-inline-start: auto; flex-shrink: 0; }

@media (max-width: 576px) {
    .profile-app .ac-rule { flex-direction: column; align-items: flex-start; gap: 10px; padding: 14px 16px; }
    .profile-app .ac-rule__actions { align-self: flex-end; }
    .profile-app .ac-form-card { padding: 18px; }
    .profile-app .ac-form-card__title { font-size: 0.92rem; }
}

/* ═══════════════════════════════════════════════════════
   EXPLORER (.ex-*) — Modern interactive redesign
   ═══════════════════════════════════════════════════════ */
.profile-app .ex { max-width: 1200px; margin-inline: auto; }

/* ── Hero search bar ── */
.profile-app .ex-hero {
    background: linear-gradient(135deg, var(--navy, #152D50) 0%, #1e3d6e 100%);
    border-radius: 16px; padding: 28px 28px 24px;
    margin-block-end: 20px; position: relative; overflow: hidden;
}
.profile-app .ex-hero::before {
    content: ''; position: absolute; inset: 0;
    background: radial-gradient(ellipse at 80% 50%, rgba(14,124,123,.25) 0%, transparent 65%);
    pointer-events: none;
}
.profile-app .ex-hero__top {
    display: flex; align-items: center; gap: 16px;
    margin-block-end: 18px; position: relative; z-index: 1;
}
.profile-app .ex-hero__logo {
    width: 52px; height: 52px; border-radius: 12px;
    background: rgba(255,255,255,.12); display: flex; align-items: center;
    justify-content: center; font-size: 1.1rem; font-weight: 800;
    color: #fff; flex-shrink: 0; border: 1px solid rgba(255,255,255,.18);
    overflow: hidden;
}
.profile-app .ex-hero__logo img { width: 100%; height: 100%; object-fit: contain; }
.profile-app .ex-hero__info { flex: 1; }
.profile-app .ex-hero__sym {
    font-size: 1.6rem; font-weight: 900; color: #fff;
    line-height: 1; letter-spacing: -0.02em; direction: ltr;
}
.profile-app .ex-hero__name { font-size: 0.88rem; color: rgba(255,255,255,.7); margin-block-start: 3px; }
.profile-app .ex-hero__pills { display: flex; gap: 6px; flex-wrap: wrap; margin-block-start: 6px; }
.profile-app .ex-hero__pill {
    font-size: 0.7rem; font-weight: 700; padding: 3px 10px; border-radius: 999px;
    background: rgba(255,255,255,.12); color: rgba(255,255,255,.85); border: 1px solid rgba(255,255,255,.15);
}
.profile-app .ex-hero__kpis {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px;
    position: relative; z-index: 1;
}
.profile-app .ex-hero__kpi {
    background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12);
    border-radius: 10px; padding: 12px 14px;
}
.profile-app .ex-hero__kpi-label { font-size: 0.68rem; color: rgba(255,255,255,.6); font-weight: 700; margin-block-end: 4px; text-transform: uppercase; letter-spacing: .03em; }
.profile-app .ex-hero__kpi-val { font-size: 1.05rem; font-weight: 900; color: #fff; line-height: 1; }
.profile-app .ex-hero__kpi-val.pos { color: #4ade80; }
.profile-app .ex-hero__kpi-val.neg { color: #f87171; }

/* ── Search bar ── */
.profile-app .ex-searchbar {
    background: var(--pa-surface); border: 1px solid var(--pa-border);
    border-radius: 14px; padding: 6px 6px 6px 18px;
    margin-block-end: 20px; display: flex; align-items: center; gap: 10px;
    box-shadow: 0 2px 12px rgba(0,0,0,.06); position: relative;
}
.profile-app .ex-searchbar__icon { color: var(--text-muted,#5E7A95); flex-shrink: 0; width: 18px; height: 18px; }
.profile-app .ex-searchbar__input {
    flex: 1; border: none; outline: none; font-family: inherit;
    font-size: 0.95rem; background: transparent; color: var(--text,#1A2B45);
    direction: ltr;
}
.profile-app .ex-searchbar__input::placeholder { color: var(--text-muted,#5E7A95); direction: rtl; }
.profile-app .ex-searchbar__badge {
    font-size: 0.75rem; font-weight: 700; padding: 4px 12px; border-radius: 8px;
    background: var(--teal-bg,#EBF7F7); color: var(--teal,#0E7C7B);
    white-space: nowrap; flex-shrink: 0;
}
.profile-app .ex-sug {
    position: absolute; inset-block-start: calc(100% + 6px); inset-inline: 0; z-index: 100;
    display: none; max-height: 320px; overflow-y: auto;
    background: var(--pa-surface); border: 1px solid var(--pa-border);
    border-radius: 12px; box-shadow: 0 8px 32px rgba(0,0,0,.12);
}
.profile-app .ex-sug__item {
    display: flex; align-items: center; gap: 12px;
    padding: 12px 16px; cursor: pointer; border-block-end: 1px solid var(--pa-border-light);
    transition: background .1s ease;
}
.profile-app .ex-sug__item:last-child { border-block-end: none; }
.profile-app .ex-sug__item:hover { background: var(--pa-surface-soft); }
.profile-app .ex-sug__av {
    width: 36px; height: 36px; border-radius: 10px; flex-shrink: 0;
    background: linear-gradient(135deg, var(--navy,#152D50), #2a5298);
    color: #fff; display: flex; align-items: center; justify-content: center;
    font-size: 0.72rem; font-weight: 800; overflow: hidden;
}
.profile-app .ex-sug__av img { width: 100%; height: 100%; object-fit: contain; }
.profile-app .ex-sug__sym { font-weight: 800; color: var(--navy,#152D50); font-size: 0.9rem; direction: ltr; }
.profile-app .ex-sug__name { font-size: 0.78rem; color: var(--text-muted,#5E7A95); }
.profile-app .ex-sug__right { margin-inline-start: auto; text-align: end; }
.profile-app .ex-sug__price { font-size: 0.82rem; font-weight: 700; color: var(--text,#1A2B45); direction: ltr; }
.profile-app .ex-sug__chg { font-size: 0.72rem; font-weight: 700; }
.profile-app .ex-sug__chg.pos { color: #16a34a; }
.profile-app .ex-sug__chg.neg { color: #dc2626; }

/* ── Empty state ── */
.profile-app .ex-empty {
    text-align: center; padding: 72px 24px;
    background: var(--pa-surface); border: 1px solid var(--pa-border);
    border-radius: 16px; box-shadow: 0 2px 12px rgba(0,0,0,.04);
}
.profile-app .ex-empty__icon {
    width: 72px; height: 72px; border-radius: 20px; margin: 0 auto 20px;
    background: linear-gradient(135deg, #f0f4f8, #e2eaf2);
    display: flex; align-items: center; justify-content: center;
}
.profile-app .ex-empty__icon svg { width: 32px; height: 32px; color: var(--text-muted,#5E7A95); }
.profile-app .ex-empty__title { font-size: 1.15rem; font-weight: 800; color: var(--navy,#152D50); margin-block-end: 8px; }
.profile-app .ex-empty__sub { font-size: 0.9rem; color: var(--text-muted,#5E7A95); max-width: 340px; margin-inline: auto; line-height: 1.6; }
.profile-app .ex-popular-chips { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; margin-block-start: 20px; }
.profile-app .ex-popular-chip {
    padding: 8px 18px; border-radius: 999px; font-size: 0.82rem; font-weight: 700;
    background: var(--pa-surface-muted); border: 1px solid var(--pa-border);
    color: var(--navy,#152D50); cursor: pointer; transition: all .15s ease;
    text-decoration: none; direction: ltr;
}
.profile-app .ex-popular-chip:hover { background: var(--navy,#152D50); color: #fff; border-color: var(--navy,#152D50); }

/* ── Tabs ── */
.profile-app .ex-tabs-wrap {
    display: flex; align-items: center; gap: 8px; margin-block-end: 16px;
    overflow-x: auto; -webkit-overflow-scrolling: touch; padding-block-end: 2px;
}
.profile-app .ex-tabs-wrap::-webkit-scrollbar { height: 0; }
.profile-app .ex-tab {
    padding: 8px 18px; border-radius: 999px;
    font-size: 0.82rem; font-weight: 700;
    border: 1px solid transparent; cursor: pointer; text-decoration: none;
    color: var(--text-mid,#3D5A7A); background: var(--pa-surface);
    border-color: var(--pa-border);
    transition: all .15s ease; white-space: nowrap;
    display: inline-flex; align-items: center; gap: 5px; flex-shrink: 0;
}
.profile-app .ex-tab:hover { background: var(--pa-surface-soft); color: var(--navy,#152D50); border-color: var(--pa-border); }
.profile-app .ex-tab.active { background: var(--navy,#152D50); color: #fff; border-color: var(--navy,#152D50); }
.profile-app .ex-tab__count {
    font-size: 0.68rem; opacity: .75;
    background: rgba(255,255,255,.2); padding: 1px 6px; border-radius: 999px;
}
.profile-app .ex-tab:not(.active) .ex-tab__count { background: var(--pa-surface-muted); }

/* ── Main 2-column grid ── */
.profile-app .ex-grid { display: grid; grid-template-columns: 260px 1fr; gap: 16px; align-items: start; }

/* ── Sidebar ── */
.profile-app .ex-side {
    background: var(--pa-surface); border: 1px solid var(--pa-border);
    border-radius: 14px; overflow: hidden; align-self: start;
    position: sticky; inset-block-start: 120px;
    box-shadow: 0 2px 10px rgba(0,0,0,.05);
}
.profile-app .ex-side__head {
    padding: 14px 16px; border-block-end: 1px solid var(--pa-border);
    display: flex; align-items: center; justify-content: space-between;
}
.profile-app .ex-side__title { font-size: 0.84rem; font-weight: 800; color: var(--navy,#152D50); margin: 0; }
.profile-app .ex-side__count {
    font-size: 0.72rem; font-weight: 700; padding: 2px 8px; border-radius: 999px;
    background: var(--pa-surface-muted); color: var(--text-muted,#5E7A95);
}
.profile-app .ex-side__search-wrap { padding: 10px 12px; border-block-end: 1px solid var(--pa-border); }
.profile-app .ex-side__search {
    width: 100%; padding: 7px 12px; border: 1px solid var(--pa-border); border-radius: 8px;
    font-size: 0.84rem; font-family: inherit; outline: none; background: var(--pa-surface-soft);
    transition: border-color .15s;
}
.profile-app .ex-side__search:focus { border-color: var(--teal,#0E7C7B); background: var(--pa-surface); }
.profile-app .ex-side__list { max-height: 480px; overflow-y: auto; padding: 6px; }
.profile-app .ex-side__list::-webkit-scrollbar { width: 3px; }
.profile-app .ex-side__list::-webkit-scrollbar-thumb { background: var(--pa-border); border-radius: 99px; }
.profile-app .ex-side__link {
    display: flex; align-items: center; justify-content: space-between;
    padding: 9px 12px; border-radius: 9px;
    font-size: 0.83rem; font-weight: 500;
    color: var(--text-mid,#3D5A7A); text-decoration: none;
    transition: all .12s ease;
}
.profile-app .ex-side__link:hover { background: var(--pa-surface-soft); color: var(--navy,#152D50); }
.profile-app .ex-side__link.active {
    background: var(--teal-bg,#EBF7F7); color: var(--teal,#0E7C7B);
    font-weight: 800;
}
.profile-app .ex-side__link-dot {
    width: 6px; height: 6px; border-radius: 50%;
    background: var(--pa-border); flex-shrink: 0;
}
.profile-app .ex-side__link.active .ex-side__link-dot { background: var(--teal,#0E7C7B); }

/* ── Main panel ── */
.profile-app .ex-main {}

/* ── Value card ── */
.profile-app .ex-value-card {
    background: var(--pa-surface); border: 1px solid var(--pa-border);
    border-radius: 14px; margin-block-end: 14px;
    box-shadow: 0 2px 10px rgba(0,0,0,.05); overflow: hidden;
}
.profile-app .ex-value-card__header {
    padding: 20px 22px 16px; border-block-end: 1px solid var(--pa-border);
    display: flex; justify-content: space-between; align-items: flex-start; gap: 16px;
}
.profile-app .ex-value-card__left {}
.profile-app .ex-value-card__metric {
    font-size: 1rem; font-weight: 800; color: var(--navy,#152D50); margin: 0 0 4px;
}
.profile-app .ex-value-card__meta { font-size: 0.78rem; color: var(--text-muted,#5E7A95); display: flex; gap: 8px; align-items: center; }
.profile-app .ex-value-card__cat {
    padding: 2px 8px; border-radius: 999px; font-size: 0.68rem; font-weight: 700;
    background: var(--pa-surface-muted); color: var(--text-mid,#3D5A7A);
}
.profile-app .ex-value-card__right { text-align: end; flex-shrink: 0; }
.profile-app .ex-value-card__val {
    font-size: 2.2rem; font-weight: 900;
    color: var(--navy,#152D50); line-height: 1; letter-spacing: -0.03em; direction: ltr;
}
.profile-app .ex-value-card__delta { font-size: 0.84rem; font-weight: 700; margin-block-start: 5px; direction: ltr; }
.profile-app .ex-value-card__body { padding: 20px 22px; }

/* ── Rank bar ── */
.profile-app .ex-rank-bar { margin-block: 16px 4px; }
.profile-app .ex-rank-bar__label { display: flex; justify-content: space-between; font-size: 0.75rem; color: var(--text-muted,#5E7A95); font-weight: 700; margin-block-end: 6px; }
.profile-app .ex-rank-bar__track {
    height: 8px; background: var(--pa-surface-muted); border-radius: 999px; overflow: hidden;
}
.profile-app .ex-rank-bar__fill {
    height: 100%; border-radius: 999px;
    background: linear-gradient(90deg, var(--teal,#0E7C7B), #14b8a6);
    transition: width .6s cubic-bezier(.4,0,.2,1);
}

/* ── Charts ── */
.profile-app .ex-chart-wrap { margin-block-end: 8px; }
.profile-app .ex-chart-title { font-size: 0.78rem; font-weight: 700; color: var(--text-muted,#5E7A95); margin-block-end: 8px; }
.profile-app .ex-chart-container { height: 260px; border-radius: 10px; overflow: hidden; }

/* ── Metric definition ── */
.profile-app .ex-def {
    border-block-start: 1px solid var(--pa-border);
    padding: 18px 22px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
}
.profile-app .ex-def__block {}
.profile-app .ex-def__label { font-size: 0.7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted,#5E7A95); margin-block-end: 6px; }
.profile-app .ex-def__text { font-size: 0.84rem; color: var(--text,#1A2B45); line-height: 1.65; }
.profile-app .ex-def__formula {
    grid-column: 1 / -1; background: var(--pa-surface-soft); border-radius: 8px;
    padding: 12px 14px; font-size: 0.84rem; font-family: monospace;
    color: var(--teal,#0E7C7B); direction: ltr; white-space: pre-wrap;
}

/* ── Similar tags ── */
.profile-app .ex-similar-wrap { border-block-start: 1px solid var(--pa-border); padding: 16px 22px; }
.profile-app .ex-section-title { font-size: 0.84rem; font-weight: 800; color: var(--navy,#152D50); margin: 0 0 12px; }
.profile-app .ex-similar { display: flex; flex-wrap: wrap; gap: 6px; }
.profile-app .ex-similar__tag {
    padding: 6px 14px; border-radius: 999px;
    font-size: 0.78rem; font-weight: 700;
    background: var(--pa-surface-muted); color: var(--text-mid,#3D5A7A);
    border: 1px solid var(--pa-border);
    text-decoration: none; transition: all .12s ease;
}
.profile-app .ex-similar__tag:hover { background: var(--teal-bg,#EBF7F7); color: var(--teal,#0E7C7B); border-color: var(--teal,#0E7C7B); }

/* ── Benchmark ── */
.profile-app .ex-bench {
    background: var(--pa-surface); border: 1px solid var(--pa-border);
    border-radius: 14px; margin-block-end: 14px; overflow: hidden;
    box-shadow: 0 2px 10px rgba(0,0,0,.05);
}
.profile-app .ex-bench__header {
    padding: 16px 20px; border-block-end: 1px solid var(--pa-border);
    display: flex; justify-content: space-between; align-items: center;
}
.profile-app .ex-bench__title { font-size: 0.9rem; font-weight: 800; color: var(--navy,#152D50); margin: 0; }
.profile-app .ex-bench__sector {
    font-size: 0.72rem; font-weight: 700; padding: 4px 12px; border-radius: 999px;
    background: #fef3c7; color: #92400e;
}
.profile-app .ex-bench-table { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.profile-app .ex-bench-table th {
    padding: 10px 16px; font-weight: 700; color: var(--text-muted,#5E7A95);
    font-size: 0.74rem; border-block-end: 1px solid var(--pa-border-light);
    text-align: start; background: var(--pa-surface-soft); text-transform: uppercase; letter-spacing: .03em;
}
.profile-app .ex-bench-table td { padding: 11px 16px; border-block-end: 1px solid var(--pa-border-light); color: var(--text,#1A2B45); }
.profile-app .ex-bench-table tbody tr:last-child td { border-block-end: none; }
.profile-app .ex-bench-table .is-current { background: var(--teal-bg,#EBF7F7); }
.profile-app .ex-bench-table .is-current td:first-child { font-weight: 800; }
.profile-app .ex-bench__bar {
    height: 4px; background: var(--pa-surface-muted); border-radius: 999px; overflow: hidden; margin-block-start: 4px; width: 80px;
}
.profile-app .ex-bench__bar-fill { height: 100%; background: var(--teal,#0E7C7B); border-radius: 999px; }

/* ── Sector stats ── */
.profile-app .ex-stats-wrap { padding: 16px 20px; border-block-start: 1px solid var(--pa-border); }
.profile-app .ex-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.profile-app .ex-stat {
    text-align: center; padding: 12px 8px; background: var(--pa-surface-soft);
    border-radius: 10px; border: 1px solid var(--pa-border-light);
}
.profile-app .ex-stat__label { font-size: 0.68rem; color: var(--text-muted,#5E7A95); font-weight: 700; text-transform: uppercase; letter-spacing: .03em; }
.profile-app .ex-stat__value { font-size: 0.95rem; font-weight: 900; color: var(--navy,#152D50); margin-block-start: 4px; }

/* ── Metric selector bar ── */
.profile-app .ex-metric-bar {
    background: var(--pa-surface); border: 1px solid var(--pa-border);
    border-radius: 12px; padding: 14px 18px; margin-block-end: 14px;
    display: flex; align-items: center; gap: 12px;
    box-shadow: 0 1px 6px rgba(0,0,0,.04);
}
.profile-app .ex-metric-bar__label {
    font-size: 0.8rem; font-weight: 800; color: var(--text-mid,#3D5A7A);
    white-space: nowrap; flex-shrink: 0;
}
.profile-app .ex-metric-bar select {
    flex: 1; padding: 8px 12px; border: 1px solid var(--pa-border); border-radius: 8px;
    font-family: inherit; font-size: 0.88rem; color: var(--text,#1A2B45);
    background: var(--pa-surface-soft); outline: none; cursor: pointer;
}
.profile-app .ex-metric-bar select:focus { border-color: var(--teal,#0E7C7B); }

/* ── Responsive ── */
@media (max-width: 900px) {
    .profile-app .ex-hero__kpis { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .profile-app .ex-grid { grid-template-columns: 1fr; }
    .profile-app .ex-side { position: static; order: 2; }
    .profile-app .ex-hero { padding: 20px 16px 16px; }
    .profile-app .ex-hero__kpis { grid-template-columns: repeat(2, 1fr); }
    .profile-app .ex-hero__sym { font-size: 1.3rem; }
    .profile-app .ex-def { grid-template-columns: 1fr; }
    .profile-app .ex-stats { grid-template-columns: repeat(2, 1fr); }
    .profile-app .ex-searchbar { padding: 6px 6px 6px 14px; }
}

/* ─── CHART CANVAS (responsive Highstock container) ─── */
.profile-app .pa-chart-figure {
    display: block;
    width: 100%;
}
.profile-app .pa-chart-canvas {
    width: 100%;
    height: clamp(320px, 40vh, 460px);
    min-height: 320px;
    border-radius: var(--pa-r-sm);
    background: linear-gradient(135deg, var(--pa-surface-soft) 0%, var(--pa-surface-muted) 100%);
    background-size: 200% 200%;
    animation: pa-chart-skeleton 2.4s ease-in-out infinite;
}
.profile-app .pa-chart-canvas[data-chart-activated="1"] {
    background: var(--pa-surface);
    animation: none;
}
.profile-app .pa-chart-noscript {
    margin: 12px 0 0;
    padding: 14px 18px;
    background: var(--pa-surface-soft);
    border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-sm);
    font-size: 0.88rem;
    color: var(--text-mid, #3D5A7A);
}
@keyframes pa-chart-skeleton {
    0%   { background-position: 0%   50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0%   50%; }
}
@media (prefers-reduced-motion: reduce) {
    .profile-app .pa-chart-canvas { animation: none; }
}

/* ─── SPARKLINE (inline SVG row chart for watchlist tables) ─── */
.profile-app .pa-spark {
    display: inline-block;
    width: 92px;
    height: 28px;
    vertical-align: middle;
}
.profile-app .pa-spark__line {
    fill: none;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.profile-app .pa-spark--up   .pa-spark__line { stroke: var(--pa-success-fg, #10A37F); }
.profile-app .pa-spark--down .pa-spark__line { stroke: var(--pa-danger-fg,  #EF4444); }
.profile-app .pa-spark--flat .pa-spark__line { stroke: var(--text-muted,    #5E7A95); }
.profile-app .pa-spark__area {
    opacity: 0.18;
}
.profile-app .pa-spark--up   .pa-spark__area { fill: var(--pa-success-fg, #10A37F); }
.profile-app .pa-spark--down .pa-spark__area { fill: var(--pa-danger-fg,  #EF4444); }
.profile-app .pa-spark--flat .pa-spark__area { fill: var(--text-muted,    #5E7A95); }

/* ─── ACCURACY CARD (sentiment success-rate widget) ─── */
.profile-app .pa-acc-card {
    display: flex;
    align-items: center;
    gap: 22px;
    padding: 22px 24px;
    margin-block-end: 22px;
    background: var(--pa-surface);
    border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-md);
    box-shadow: var(--pa-shadow-sm);
}
.profile-app .pa-acc-card__progress {
    position: relative;
    width: 96px;
    height: 96px;
    flex-shrink: 0;
}
.profile-app .pa-acc-card__pct {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.15rem;
    font-weight: var(--font-extrabold, 800);
    color: var(--navy, #152D50);
    letter-spacing: -0.01em;
}
.profile-app .pa-acc-ring {
    transform: rotate(-90deg);
}
.profile-app .pa-acc-ring__track {
    fill: none;
    stroke: var(--pa-border-light, #EBF0F7);
    stroke-width: 8;
}
.profile-app .pa-acc-ring__fill {
    fill: none;
    stroke-width: 8;
    stroke-linecap: round;
    transition: stroke-dashoffset .6s ease;
}
.profile-app .pa-acc-ring--success .pa-acc-ring__fill { stroke: var(--pa-success-fg, #10A37F); }
.profile-app .pa-acc-ring--warn    .pa-acc-ring__fill { stroke: var(--pa-warn-fg,    #F59E0B); }
.profile-app .pa-acc-ring--danger  .pa-acc-ring__fill { stroke: var(--pa-danger-fg,  #EF4444); }
.profile-app .pa-acc-ring--muted   .pa-acc-ring__fill { stroke: var(--pa-border-strong, #C4D0E0); }

.profile-app .pa-acc-card__body { flex: 1; min-width: 0; }
.profile-app .pa-acc-card__title {
    font-size: 1.05rem;
    font-weight: var(--font-extrabold, 800);
    color: var(--navy, #152D50);
    margin-block-end: 4px;
}
.profile-app .pa-acc-card__sub {
    font-size: 0.86rem;
    color: var(--text-mid, #3D5A7A);
    margin-block-end: 12px;
    line-height: 1.5;
}
.profile-app .pa-acc-card__chips {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.profile-app .pa-acc-chip {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    padding: 5px 12px;
    border-radius: 999px;
    background: var(--pa-surface-soft);
    border: 1px solid var(--pa-border-light);
    font-size: 0.78rem;
    color: var(--text-mid, #3D5A7A);
}
.profile-app .pa-acc-chip__num { font-weight: var(--font-extrabold, 800); color: var(--navy, #152D50); }
.profile-app .pa-acc-chip__label { font-weight: var(--font-bold, 700); }
.profile-app .pa-acc-chip--info    { background: var(--pa-info-bg);    border-color: rgba(59, 130, 246, 0.25); }
.profile-app .pa-acc-chip--info    .pa-acc-chip__num   { color: var(--pa-info-fg); }
.profile-app .pa-acc-chip--info    .pa-acc-chip__label { color: var(--pa-info-fg); }
.profile-app .pa-acc-chip--success { background: var(--pa-success-bg); border-color: rgba(16, 163, 127, 0.25); }
.profile-app .pa-acc-chip--success .pa-acc-chip__num   { color: var(--pa-success-fg); }
.profile-app .pa-acc-chip--success .pa-acc-chip__label { color: var(--pa-success-fg); }
.profile-app .pa-acc-chip--danger  { background: var(--pa-danger-bg);  border-color: rgba(239, 68, 68, 0.25); }
.profile-app .pa-acc-chip--danger  .pa-acc-chip__num   { color: var(--pa-danger-fg); }
.profile-app .pa-acc-chip--danger  .pa-acc-chip__label { color: var(--pa-danger-fg); }

@media (max-width: 576px) {
    .profile-app .pa-acc-card { flex-direction: column; align-items: flex-start; gap: 14px; padding: 18px; }
    .profile-app .pa-acc-card__progress { align-self: center; }
}

/* ─── DASHBOARD PORTFOLIO PLACEHOLDER (Phase 5 stub) ─── */
.profile-dashboard .pd-portfolio-stub {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 22px 26px;
    margin-block-end: 24px;
    background: linear-gradient(135deg,
        var(--teal-bg, #EBF7F7) 0%,
        var(--bg-card, #fff) 100%);
    border: 1px dashed var(--teal, #0E7C7B);
    border-radius: var(--pd-r-md);
    position: relative;
    overflow: hidden;
}
.profile-dashboard .pd-portfolio-stub__icon {
    width: 56px;
    height: 56px;
    border-radius: var(--pd-r-sm);
    background: linear-gradient(135deg, var(--teal, #0E7C7B), var(--teal-light, #12A09E));
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 4px 14px rgba(14, 124, 123, 0.30);
}
.profile-dashboard .pd-portfolio-stub__body { flex: 1; min-width: 0; }
.profile-dashboard .pd-portfolio-stub__pill {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: var(--font-extrabold, 800);
    color: var(--teal, #0E7C7B);
    background: rgba(14, 124, 123, 0.12);
    padding: 3px 10px;
    border-radius: 999px;
    margin-block-end: 6px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}
.profile-dashboard .pd-portfolio-stub__title {
    font-size: 1.05rem;
    font-weight: var(--font-extrabold, 800);
    color: var(--navy, #152D50);
    margin-block-end: 4px;
    line-height: 1.3;
}
.profile-dashboard .pd-portfolio-stub__desc {
    font-size: 0.88rem;
    color: var(--text-mid, #3D5A7A);
    line-height: 1.5;
}
.profile-dashboard .pd-portfolio-stub__chart {
    width: 140px;
    height: 56px;
    flex-shrink: 0;
    opacity: 0.65;
}
@media (max-width: 640px) {
    .profile-dashboard .pd-portfolio-stub { flex-wrap: wrap; padding: 18px; }
    .profile-dashboard .pd-portfolio-stub__chart { display: none; }
}

/* Phase 5 — live portfolio summary variant */
.profile-dashboard a.pd-portfolio-stub {
    text-decoration: none;
    color: inherit;
}
.profile-dashboard a.pd-portfolio-stub:hover {
    color: inherit;
}
.profile-dashboard .pd-portfolio-stub--live {
    border-style: solid;
    border-color: var(--teal-border, #B8E0DF);
}
.profile-dashboard .pd-portfolio-stub__pnl {
    font-size: 0.92rem;
    font-weight: var(--font-extrabold, 800);
    margin-inline-start: 8px;
    padding: 2px 8px;
    border-radius: 6px;
    vertical-align: middle;
}
.profile-dashboard .pd-portfolio-stub__pnl--pos {
    background: var(--pa-success-bg, rgba(16, 163, 127, 0.12));
    color: var(--pa-success-fg, #10A37F);
}
.profile-dashboard .pd-portfolio-stub__pnl--neg {
    background: var(--pa-danger-bg, rgba(239, 68, 68, 0.12));
    color: var(--pa-danger-fg, #EF4444);
}
.profile-dashboard .pd-portfolio-stub__pnl--flat {
    background: var(--bg-muted, #F1F5F9);
    color: var(--text-muted, #5E7A95);
}

/* ═══════════════════════════════════════════════════════════════
   Sentiment Widget (.sntw) — Bearish/Bullish voting block
   Used on: stock-v2, currency-pairs, company-v2 pages
   STYLE_VERSION: 4.96
   ═══════════════════════════════════════════════════════════════ */

.sntw {
    margin-block: 2rem;
    container-type: inline-size;
}

.sntw__inner {
    background: #fff;
    border: 1px solid rgba(21, 45, 80, 0.1);
    border-radius: 16px;
    padding: 1.5rem;
    box-shadow: 0 2px 12px rgba(21, 45, 80, 0.06);
    transition: box-shadow 0.2s ease;
}

.sntw__inner:hover {
    box-shadow: 0 4px 24px rgba(21, 45, 80, 0.1);
}

/* Header */
.sntw__header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.sntw__icon {
    font-size: 1.2rem;
    flex-shrink: 0;
}

.sntw__question {
    font-size: 0.975rem;
    color: var(--ink, #1E293B);
    flex: 1;
    font-weight: 500;
}

.sntw__question strong {
    color: var(--navy, #152D50);
}

.sntw__total {
    font-size: 0.75rem;
    color: var(--text-muted, #475A72);
    background: var(--bg-muted, #F1F5F9);
    padding: 2px 10px;
    border-radius: 20px;
    white-space: nowrap;
}

/* Gauge bar */
.sntw__gauge {
    display: flex;
    height: 8px;
    border-radius: 99px;
    overflow: hidden;
    background: #E2E8F0;
    margin-bottom: 0.4rem;
    direction: ltr;
}

.sntw__gauge-fill {
    height: 100%;
    transition: width 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.sntw__gauge-fill--bull {
    background: linear-gradient(90deg, #10A37F, #059669);
}

.sntw__gauge-fill--bear {
    background: linear-gradient(90deg, #EF4444, #DC2626);
}

.sntw__gauge-labels {
    display: flex;
    justify-content: space-between;
    margin-bottom: 1.25rem;
}

.sntw__pct {
    font-size: 0.75rem;
    font-weight: 600;
}

.sntw__pct--bull {
    color: #10A37F;
}

.sntw__pct--bear {
    color: #EF4444;
}

/* Action buttons */
.sntw__actions {
    display: flex;
    align-items: stretch;
    gap: 0.75rem;
    direction: rtl;
}

.sntw__form {
    flex: 1;
    display: contents;
}

.sntw__btn {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.2rem;
    padding: 0.85rem 1rem;
    border-radius: 12px;
    border: 2px solid transparent;
    cursor: pointer;
    font-family: inherit;
    transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
    text-decoration: none;
    min-width: 0;
}

.sntw__btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
}

.sntw__btn:active {
    transform: translateY(0);
}

.sntw__btn--bull {
    background: linear-gradient(135deg, #D1FAE5, #A7F3D0);
    border-color: #10A37F;
    color: #065F46;
}

.sntw__btn--bull:hover {
    background: linear-gradient(135deg, #A7F3D0, #6EE7B7);
}

.sntw__btn--bear {
    background: linear-gradient(135deg, #FEE2E2, #FECACA);
    border-color: #EF4444;
    color: #7F1D1D;
}

.sntw__btn--bear:hover {
    background: linear-gradient(135deg, #FECACA, #FCA5A5);
}

.sntw__btn-icon {
    font-size: 1.6rem;
    line-height: 1;
}

.sntw__btn-label {
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: 0.01em;
}

.sntw__btn-sub {
    font-size: 0.7rem;
    opacity: 0.7;
    font-weight: 400;
}

.sntw__divider {
    display: flex;
    align-items: center;
    font-size: 0.75rem;
    color: var(--text-muted, #475A72);
    padding: 0 0.25rem;
    flex-shrink: 0;
}

/* Hint text */
.sntw__hint {
    font-size: 0.78rem;
    color: var(--text-muted, #475A72);
    text-align: center;
    margin-top: 0.9rem;
    margin-bottom: 0;
}

.sntw__hint a,
.sntw__hint-link {
    color: var(--teal, #0D9488);
    text-decoration: underline;
    background: none;
    border: none;
    cursor: pointer;
    font-size: inherit;
    font-family: inherit;
    padding: 0;
}

/* ── Auth Modal ── */
.sntw-modal {
    position: fixed;
    inset: 0;
    z-index: 9900;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.sntw-modal[hidden] {
    display: none !important;
}

.sntw-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.55);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    cursor: pointer;
}

.sntw-modal__box {
    position: relative;
    z-index: 1;
    background: #fff;
    border-radius: 20px;
    padding: 2rem 1.75rem 1.75rem;
    max-width: 420px;
    width: 100%;
    box-shadow: 0 24px 64px rgba(15, 23, 42, 0.2);
    text-align: center;
    animation: sntw-pop 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes sntw-pop {
    from { opacity: 0; transform: scale(0.88) translateY(16px); }
    to   { opacity: 1; transform: scale(1) translateY(0); }
}

.sntw-modal__close {
    position: absolute;
    inset-inline-end: 1rem;
    top: 1rem;
    background: var(--bg-muted, #F1F5F9);
    border: none;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    cursor: pointer;
    font-size: 0.85rem;
    color: var(--text-muted, #475A72);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s ease;
    line-height: 1;
}

.sntw-modal__close:hover {
    background: #E2E8F0;
}

.sntw-modal__icon {
    margin: 0 auto 1rem;
    width: 56px;
    height: 56px;
}

.sntw-modal__title {
    font-size: 1.3rem;
    font-weight: 800;
    color: var(--navy, #152D50);
    margin: 0 0 0.6rem;
}

.sntw-modal__desc {
    font-size: 0.875rem;
    color: var(--text-muted, #475A72);
    line-height: 1.6;
    margin: 0 0 1.25rem;
}

.sntw-modal__features {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    text-align: start;
    background: var(--bg-subtle, #F8FAFC);
    border-radius: 12px;
    padding: 0.9rem 1rem;
    margin-bottom: 1.5rem;
}

.sntw-modal__feat {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    font-size: 0.85rem;
    color: var(--ink, #1E293B);
}

.sntw-modal__feat-icon {
    font-size: 1rem;
    flex-shrink: 0;
}

.sntw-modal__cta {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.sntw-modal__btn {
    display: block;
    padding: 0.75rem 1.5rem;
    border-radius: 10px;
    font-size: 0.9rem;
    font-weight: 700;
    text-decoration: none;
    text-align: center;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.sntw-modal__btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

.sntw-modal__btn--primary {
    background: linear-gradient(135deg, #0D9488, #065F46);
    color: #fff;
}

.sntw-modal__btn--secondary {
    background: transparent;
    color: var(--navy, #152D50);
    border: 2px solid rgba(21, 45, 80, 0.2);
}

.sntw-modal__note {
    font-size: 0.72rem;
    color: var(--text-muted, #475A72);
    margin-top: 0.9rem;
    margin-bottom: 0;
}

/* ── Responsive ── */
@container (max-width: 400px) {
    .sntw__actions {
        flex-direction: column;
    }
    .sntw__divider {
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .sntw__inner {
        padding: 1.1rem;
    }
    .sntw__btn-icon {
        font-size: 1.3rem;
    }
    .sntw-modal__box {
        padding: 1.5rem 1.25rem;
    }
}

/* ── Investors pagination ───────────────────────────────────────────────── */
.inv-pagination {
    margin-block-start: 2rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .75rem;
}

.inv-pagination__nav {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .75rem;
}

.inv-pagination__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .25rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.inv-pagination__item {}

.inv-pagination__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.25rem;
    height: 2.25rem;
    padding-inline: .5rem;
    border-radius: var(--radius-sm, 6px);
    border: 1px solid var(--border, #e2e8f0);
    background: var(--surface, #fff);
    color: var(--ink, #1e293b);
    font-size: .875rem;
    font-weight: 500;
    text-decoration: none;
    transition: background .15s, border-color .15s, color .15s;
    cursor: pointer;
}

a.inv-pagination__link:hover {
    background: var(--teal-50, #f0fdfa);
    border-color: var(--teal, #0d9488);
    color: var(--teal, #0d9488);
}

.inv-pagination__item--active .inv-pagination__link {
    background: var(--teal, #0d9488);
    border-color: var(--teal, #0d9488);
    color: #fff;
    cursor: default;
}

.inv-pagination__item--disabled .inv-pagination__link {
    opacity: .4;
    cursor: default;
    pointer-events: none;
}

.inv-pagination__item--dots .inv-pagination__link {
    border-color: transparent;
    background: transparent;
    cursor: default;
}

.inv-pagination__info {
    font-size: .8125rem;
    color: var(--ink-soft, #64748b);
    margin: 0;
}

/* ── Analyst Estimates Dashboard ── */
.ch2-estimates-dashboard {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 30px;
}

.ch2-period-toggle {
    display: inline-flex;
    border: 1px solid var(--pa-border, #DDE5EF);
    border-radius: 999px;
    background: var(--pa-surface, #fff);
    overflow: hidden;
    padding: 3px;
}

.ch2-period-btn {
    padding: 6px 18px;
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--text-mid, #3D5A7A);
    background: transparent;
    border: none;
    border-radius: 999px;
    cursor: pointer;
    transition: all 0.15s ease;
}

.ch2-period-btn:hover:not(:disabled) {
    color: var(--navy, #152D50);
    background: var(--pa-surface-soft, #f8fafc);
}

.ch2-period-btn.active {
    background: var(--navy, #152D50);
    color: #fff;
}

/* Metric Cards Grid */
.ch2-metrics-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 16px;
}

.ch2-metric-card {
    background: var(--pa-surface, #fff);
    border: 1px solid var(--pa-border, #DDE5EF);
    border-radius: var(--pa-r-lg, 12px);
    padding: 16px;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: var(--pa-shadow-sm, 0 1px 3px rgba(0,0,0,0.05));
    position: relative;
    overflow: hidden;
}

.ch2-metric-card:hover {
    transform: translateY(-2px);
    border-color: var(--teal, #0E7C7B);
    box-shadow: 0 4px 12px rgba(14,124,123,0.08);
}

.ch2-metric-card.active {
    border-color: var(--teal, #0E7C7B);
    background: var(--pa-surface, #fff);
    box-shadow: 0 4px 16px rgba(14,124,123,0.12);
}

.ch2-metric-card.active::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 4px;
    background: var(--teal, #0E7C7B);
}

.ch2-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.ch2-card-title {
    font-size: 0.78rem;
    font-weight: 800;
    color: var(--text-muted, #5E7A95);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 80%;
}

.ch2-card-date {
    font-size: 0.72rem;
    font-weight: 700;
    background: var(--pa-surface-muted, #f1f5f9);
    padding: 2px 6px;
    border-radius: 4px;
    color: var(--navy, #152D50);
}

.ch2-card-value {
    font-size: 1.2rem;
    font-weight: 800;
    color: var(--navy, #152D50);
    direction: ltr;
    text-align: right;
}

/* Range Bar Visualization */
.ch2-range-bar-wrapper {
    margin-top: 10px;
}

.ch2-range-bar {
    height: 6px;
    background: var(--pa-surface-muted, #f1f5f9);
    border-radius: 999px;
    position: relative;
    margin-bottom: 6px;
}

.ch2-range-dot {
    width: 10px;
    height: 10px;
    background: var(--teal, #0E7C7B);
    border: 2px solid var(--pa-surface, #fff);
    border-radius: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}

.ch2-range-labels {
    font-size: 0.68rem;
    font-weight: 700;
    direction: ltr;
}

.ch2-no-range {
    font-size: 0.72rem;
    color: var(--text-muted, #5E7A95);
    padding: 4px 0;
}

/* Data Table Styling */
.ch2-estimates-table th {
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 2px solid var(--pa-border, #DDE5EF);
}

.ch2-estimates-table td {
    padding: 14px 16px;
    font-size: 0.85rem;
    border-bottom: 1px solid var(--pa-border-light, #EBF0F7);
}

.ch2-estimates-table tbody tr:hover {
    background: var(--pa-surface-soft, #f8fafc);
}

/* ── Stock Key Metrics TTM Dashboard ── */
.ch2-ttm-dashboard {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 30px;
}

/* Category Tabs */
.ch2-ttm-tabs-wrapper {
    overflow-x: auto;
    padding-bottom: 4px;
}

.ch2-ttm-tabs {
    display: inline-flex;
    gap: 8px;
    border-bottom: 2px solid var(--pa-border-light, #EBF0F7);
    width: 100%;
    padding-bottom: 4px;
}

.ch2-ttm-tab {
    padding: 10px 20px;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--text-mid, #3D5A7A);
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
    margin-bottom: -6px;
}

.ch2-ttm-tab:hover {
    color: var(--navy, #152D50);
}

.ch2-ttm-tab.active {
    color: var(--teal, #0E7C7B);
    border-bottom-color: var(--teal, #0E7C7B);
    font-weight: 800;
}

/* Split Layout */
.ch2-ttm-layout {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 24px;
    align-items: start;
}

@media (max-width: 991px) {
    .ch2-ttm-layout {
        grid-template-columns: 1fr;
    }
}

.ch2-ttm-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 16px;
}

.ch2-ttm-metrics-list {
    min-height: 400px;
}

.ch2-ttm-chart-panel {
    position: sticky;
    top: 20px;
}

/* Peers rows */
.bg-warning-light {
    background: #FFFBEB;
}

.ch2-ttm-peers-table {
    border-top: 1px solid var(--pa-border-light, #EBF0F7);
    padding-top: 16px;
}

/* ── Stock Income Statements Dashboard ── */
.ch2-income-dashboard {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-bottom: 30px;
}

.ch2-statements-scroll-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: var(--pa-r-md, 8px);
    border: 1px solid var(--pa-border-light, #EBF0F7);
}


/* ══════════════════════════════════════════════════════════════════════════
   CASH-FLOW STATEMENT PANEL (.cf-*) — explorer tab "قائمة التدفقات النقدية"
   Logical properties throughout: this panel is RTL-first and must mirror cleanly.
   ══════════════════════════════════════════════════════════════════════════ */

.profile-app .cf { display: block; }

.profile-app .cf .sr-only-cf {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ── Header ── */
.profile-app .cf-head {
    display: flex; flex-wrap: wrap; gap: 12px;
    align-items: flex-start; justify-content: space-between;
    margin-block-end: 16px;
}
.profile-app .cf-head__title { font-size: 1.25rem; font-weight: 900; color: var(--navy, #152D50); margin: 0 0 4px; }
.profile-app .cf-head__sub { font-size: 0.85rem; color: var(--text-muted, #5E7A95); margin: 0; line-height: 1.6; }
.profile-app .cf-head__badges { display: flex; gap: 6px; flex-wrap: wrap; }

.profile-app .cf-badge {
    display: inline-flex; align-items: center;
    padding: 5px 12px; border-radius: 999px;
    font-size: 0.72rem; font-weight: 800; line-height: 1.4;
    background: var(--pa-surface-muted); color: var(--text-mid, #3D5A7A);
    border: 1px solid var(--pa-border);
}
.profile-app .cf-badge--year { background: var(--navy, #152D50); color: #fff; border-color: var(--navy, #152D50); }
.profile-app .cf-badge--soft { background: var(--teal-bg, #EBF7F7); color: var(--teal, #0E7C7B); border-color: var(--teal, #0E7C7B); }
.profile-app .cf-badge--sector { background: #FEF3C7; color: #92400E; border-color: #FDE68A; }

/* ── Empty state ── */
.profile-app .cf-empty {
    background: var(--pa-surface); border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-md); padding: 48px 24px; text-align: center;
    box-shadow: var(--pa-shadow-sm);
}
.profile-app .cf-empty__icon {
    inline-size: 64px; block-size: 64px; margin-inline: auto; margin-block-end: 16px;
    display: grid; place-items: center; border-radius: 50%;
    background: var(--pa-surface-muted); color: var(--text-muted, #5E7A95);
}
.profile-app .cf-empty__icon svg { inline-size: 30px; block-size: 30px; }
.profile-app .cf-empty__title { font-size: 1.05rem; font-weight: 800; color: var(--navy, #152D50); margin: 0 0 8px; }
.profile-app .cf-empty__desc {
    font-size: 0.87rem; color: var(--text-muted, #5E7A95);
    max-inline-size: 460px; margin-inline: auto; line-height: 1.75; margin-block: 0;
}

/* ── KPI strip ── */
/* Three columns, not auto-fit: there are exactly six KPIs, and auto-fit resolved to five at
   the profile content width — five across and one stranded on its own row. Explicit 3x2 stays
   balanced at every desktop width. */
.profile-app .cf-kpis {
    display: grid; grid-template-columns: repeat(3, 1fr);
    gap: 10px; margin-block-end: 14px;
}
.profile-app .cf-kpi {
    background: var(--pa-surface); border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-sm); padding: 14px 16px;
    box-shadow: var(--pa-shadow-sm);
    border-inline-start: 3px solid var(--teal, #0E7C7B);
    transition: transform .15s ease, box-shadow .15s ease;
}
.profile-app .cf-kpi:hover { transform: translateY(-2px); box-shadow: var(--pa-shadow-md); }
.profile-app .cf-kpi__label {
    font-size: 0.72rem; font-weight: 800; color: var(--text-muted, #5E7A95);
    margin-block-end: 6px; line-height: 1.5;
}
.profile-app .cf-kpi__value {
    font-size: 1.15rem; font-weight: 900; color: var(--navy, #152D50);
    direction: ltr; text-align: end; unicode-bidi: isolate; line-height: 1.3;
}
.profile-app .cf-kpi__chg {
    display: flex; align-items: center; gap: 5px; flex-wrap: wrap;
    font-size: 0.72rem; font-weight: 700; margin-block-start: 6px;
}
.profile-app .cf-kpi__chg.is-good { color: var(--pa-success-fg, #10A37F); }
.profile-app .cf-kpi__chg.is-bad  { color: var(--pa-danger-fg, #EF4444); }
.profile-app .cf-kpi__chg.is-muted { color: var(--text-muted, #5E7A95); font-weight: 600; }
.profile-app .cf-kpi__chg.is-flat { color: var(--text-mid, #3D5A7A); }
.profile-app .cf-kpi__chg-note { color: var(--text-muted, #5E7A95); font-weight: 600; }

/* ── Card shell ── */
.profile-app .cf-card {
    background: var(--pa-surface); border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-md); margin-block-end: 14px; overflow: hidden;
    box-shadow: var(--pa-shadow-sm);
}
.profile-app .cf-card__head {
    display: flex; flex-wrap: wrap; gap: 12px;
    align-items: flex-start; justify-content: space-between;
    padding: 16px 20px; border-block-end: 1px solid var(--pa-border);
}
.profile-app .cf-card__title { font-size: 0.98rem; font-weight: 800; color: var(--navy, #152D50); margin: 0 0 3px; }
.profile-app .cf-card__sub { font-size: 0.78rem; color: var(--text-muted, #5E7A95); margin: 0; line-height: 1.6; }
.profile-app .cf-card__tools { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.profile-app .cf-card__sub--warn {
    margin-block-start: 6px; padding: 7px 11px; border-radius: 8px;
    background: var(--pa-warn-bg, rgba(245,158,11,.12)); color: #92400E;
    border-inline-start: 3px solid var(--pa-warn-fg, #F59E0B);
    font-weight: 700;
}

/* ── Segmented control ── */
.profile-app .cf-seg {
    display: inline-flex; gap: 2px; padding: 3px;
    background: var(--pa-surface-muted); border-radius: 999px; border: 1px solid var(--pa-border);
}
.profile-app .cf-seg__btn {
    appearance: none; border: 0; background: transparent; cursor: pointer;
    font-family: inherit; font-size: 0.78rem; font-weight: 800;
    color: var(--text-mid, #3D5A7A);
    padding: 8px 14px; min-block-size: 36px; border-radius: 999px;
    transition: background .15s ease, color .15s ease;
}
.profile-app .cf-seg__btn:hover { color: var(--navy, #152D50); background: rgba(255,255,255,.6); }
.profile-app .cf-seg__btn.is-active { background: var(--navy, #152D50); color: #fff; }
.profile-app .cf-seg__btn:focus-visible { outline: 2px solid var(--teal, #0E7C7B); outline-offset: 2px; }
.profile-app .cf-seg__btn.is-disabled,
.profile-app .cf-seg__btn[disabled] {
    opacity: .45; cursor: not-allowed; color: var(--text-muted, #5E7A95);
}
.profile-app .cf-seg__btn.is-disabled:hover,
.profile-app .cf-seg__btn[disabled]:hover { background: transparent; color: var(--text-muted, #5E7A95); }

/* ── Fields ── */
.profile-app .cf-field { display: inline-flex; align-items: center; gap: 6px; }
.profile-app .cf-field--grow { flex: 1 1 180px; }
.profile-app .cf-field__label { font-size: 0.74rem; font-weight: 800; color: var(--text-mid, #3D5A7A); white-space: nowrap; }
.profile-app .cf-select,
.profile-app .cf-input {
    font-family: inherit; font-size: 0.82rem; color: var(--text, #1A2B45);
    background: var(--pa-surface-soft); border: 1px solid var(--pa-border);
    border-radius: 8px; padding: 8px 12px; min-block-size: 44px; inline-size: 100%;
    outline: none; cursor: pointer;
}
.profile-app .cf-input { cursor: text; }
.profile-app .cf-select:focus,
.profile-app .cf-input:focus { border-color: var(--teal, #0E7C7B); background: var(--pa-surface); }

.profile-app .cf-btn {
    appearance: none; cursor: pointer; font-family: inherit;
    font-size: 0.78rem; font-weight: 800; color: var(--text-mid, #3D5A7A);
    background: var(--pa-surface-soft); border: 1px solid var(--pa-border);
    border-radius: 8px; padding: 8px 14px; min-block-size: 44px;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.profile-app .cf-btn:hover { background: var(--navy, #152D50); color: #fff; border-color: var(--navy, #152D50); }
.profile-app .cf-btn:focus-visible { outline: 2px solid var(--teal, #0E7C7B); outline-offset: 2px; }

/* ── Charts ── */
.profile-app .cf-chart { min-block-size: 300px; padding: 12px 8px; }
.profile-app .cf-chart--peers { min-block-size: 220px; border-block-end: 1px solid var(--pa-border); }

/* ── Tables ── */
.profile-app .cf-tablewrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.profile-app .cf-tablewrap--statement { max-block-size: 620px; overflow-y: auto; }
.profile-app .cf-tablewrap::-webkit-scrollbar { block-size: 8px; inline-size: 8px; }
.profile-app .cf-tablewrap::-webkit-scrollbar-thumb { background: var(--pa-border); border-radius: 999px; }

.profile-app .cf-peertable,
.profile-app .cf-table { inline-size: 100%; border-collapse: collapse; font-size: 0.83rem; }

.profile-app .cf-peertable th,
.profile-app .cf-table th {
    text-align: start; font-weight: 800; font-size: 0.74rem;
    color: var(--text-muted, #5E7A95); background: var(--pa-surface-soft);
    padding: 11px 14px; border-block-end: 1px solid var(--pa-border);
    white-space: nowrap;
}
.profile-app .cf-peertable td,
.profile-app .cf-table td {
    padding: 11px 14px; border-block-end: 1px solid var(--pa-border-light);
    color: var(--text, #1A2B45);
}

/* Peer table */
.profile-app .cf-peertable__rank { inline-size: 48px; font-weight: 800; color: var(--text-muted, #5E7A95); }
.profile-app .cf-peertable__name { font-weight: 700; min-inline-size: 160px; }
.profile-app .cf-peertable__sym { font-weight: 800; color: var(--teal, #0E7C7B); unicode-bidi: isolate; }
.profile-app .cf-peertable__val { min-inline-size: 150px; font-weight: 700; unicode-bidi: isolate; }
.profile-app .cf-peertable tbody tr.is-current { background: var(--teal-bg, #EBF7F7); }
.profile-app .cf-peertable tbody tr.is-current .cf-peertable__name { font-weight: 900; color: var(--navy, #152D50); }
.profile-app .cf-peertable tbody tr:last-child td { border-block-end: none; }

.profile-app .cf-chip {
    display: inline-block; margin-inline-start: 6px; padding: 2px 8px;
    border-radius: 999px; font-size: 0.66rem; font-weight: 800;
    background: var(--teal, #0E7C7B); color: #fff;
}
.profile-app .cf-chip--warn { background: var(--pa-warn-fg, #F59E0B); color: #3D2C00; }
.profile-app .cf-bar {
    display: block; block-size: 4px; inline-size: 100%; max-inline-size: 140px;
    background: var(--pa-surface-muted); border-radius: 999px;
    overflow: hidden; margin-block-start: 5px;
}
.profile-app .cf-bar__fill { display: block; block-size: 100%; background: var(--teal, #0E7C7B); border-radius: 999px; }
.profile-app .cf-bar__fill.is-neg { background: var(--pa-danger-fg, #EF4444); }

/* Statement table */
.profile-app .cf-table thead th { position: sticky; inset-block-start: 0; z-index: 3; }
.profile-app .cf-table__rowhead {
    position: sticky; inset-inline-start: 0; z-index: 2;
    background: var(--pa-surface); min-inline-size: 240px;
    font-weight: 700; color: var(--navy, #152D50); text-align: start;
}
.profile-app .cf-table thead .cf-table__rowhead { z-index: 4; background: var(--pa-surface-soft); }
.profile-app .cf-table__row.is-strong .cf-table__rowhead { font-weight: 900; }
.profile-app .cf-table__row.is-strong td { font-weight: 800; color: var(--navy, #152D50); }
.profile-app .cf-table__row:hover td,
.profile-app .cf-table__row:hover .cf-table__rowhead { background: var(--pa-surface-soft); }
.profile-app .cf-table td { color: var(--text-mid, #3D5A7A); unicode-bidi: isolate; white-space: nowrap; }
.profile-app .cf-table td.is-neg { color: var(--pa-danger-fg, #EF4444); }

.profile-app .cf-table__group td { background: var(--pa-surface-muted); padding: 0; }
.profile-app .cf-table__grouptoggle {
    appearance: none; border: 0; background: transparent; cursor: pointer;
    inline-size: 100%; text-align: start; font-family: inherit;
    font-size: 0.8rem; font-weight: 900; color: var(--teal, #0E7C7B);
    padding: 11px 14px; min-block-size: 44px;
    display: flex; align-items: center; gap: 8px;
}
.profile-app .cf-table__grouptoggle:focus-visible { outline: 2px solid var(--teal, #0E7C7B); outline-offset: -2px; }
.profile-app .cf-table__caret { font-size: 0.7rem; }

.profile-app .cf-note {
    font-size: 0.75rem; color: var(--text-muted, #5E7A95);
    padding: 12px 20px; margin: 0; line-height: 1.7;
    border-block-start: 1px solid var(--pa-border-light);
}
.profile-app .cf-source {
    font-size: 0.74rem; color: var(--text-muted, #5E7A95);
    text-align: center; margin-block: 4px 0; line-height: 1.7;
}

/* ── Responsive ── */
@media (max-width: 768px) {
    .profile-app .cf-head { flex-direction: column; }
    .profile-app .cf-card__head { flex-direction: column; align-items: stretch; }
    .profile-app .cf-card__tools { justify-content: space-between; }
    .profile-app .cf-seg { inline-size: 100%; justify-content: stretch; }
    .profile-app .cf-seg__btn { flex: 1; padding: 8px 6px; font-size: 0.74rem; }
    .profile-app .cf-kpis { grid-template-columns: repeat(2, 1fr); }
    .profile-app .cf-kpi__value { font-size: 1rem; }
    .profile-app .cf-table__rowhead { min-inline-size: 170px; }
    .profile-app .cf-tablewrap--statement { max-block-size: 460px; }
}
@media (max-width: 420px) {
    .profile-app .cf-kpis { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    .profile-app .cf-kpi { transition: none; }
    .profile-app .cf-kpi:hover { transform: none; }
}


/* ── Statement panel: per-feed accent + the description and summary cards ──
   --cf-accent is set inline on #cfPanel by the blade (teal / violet / gold), so the three tabs
   read as siblings rather than as one page shown three times, without three stylesheets. */

.profile-app .cf-kpi { border-inline-start-color: var(--cf-accent, var(--teal, #0E7C7B)); }
.profile-app .cf-badge--soft {
    background: color-mix(in srgb, var(--cf-accent, #0E7C7B) 12%, transparent);
    color: var(--cf-accent, #0E7C7B);
    border-color: var(--cf-accent, #0E7C7B);
}
.profile-app .cf-bar__fill { background: var(--cf-accent, var(--teal, #0E7C7B)); }
.profile-app .cf-peertable__sym { color: var(--cf-accent, var(--teal, #0E7C7B)); }
.profile-app .cf-table__grouptoggle { color: var(--cf-accent, var(--teal, #0E7C7B)); }
.profile-app .cf-seg__btn.is-active { background: var(--cf-accent, var(--navy, #152D50)); }
.profile-app .cf-chip { background: var(--cf-accent, var(--teal, #0E7C7B)); }

/* ── The plain-language explainer ── */
.profile-app .cf-intro {
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--cf-accent, #0E7C7B) 9%, var(--pa-surface, #fff)),
        var(--pa-surface, #fff));
    border: 1px solid color-mix(in srgb, var(--cf-accent, #0E7C7B) 26%, transparent);
    border-radius: var(--pa-r-md);
    margin-block-end: 14px;
    overflow: hidden;
}
.profile-app .cf-intro__head {
    display: flex; align-items: center; gap: 10px;
    padding: 14px 18px; cursor: pointer; list-style: none;
    min-block-size: 44px;
}
.profile-app .cf-intro__head::-webkit-details-marker { display: none; }
.profile-app .cf-intro__head:focus-visible { outline: 2px solid var(--cf-accent, #0E7C7B); outline-offset: -2px; }
.profile-app .cf-intro__icon {
    inline-size: 26px; block-size: 26px; flex-shrink: 0;
    display: grid; place-items: center; border-radius: 50%;
    background: var(--cf-accent, #0E7C7B); color: #fff;
    font-weight: 900; font-size: 0.85rem;
}
.profile-app .cf-intro__lead {
    flex: 1; font-size: 0.92rem; font-weight: 800;
    color: var(--navy, #152D50); line-height: 1.5;
}
.profile-app .cf-intro__toggle {
    inline-size: 0; block-size: 0; flex-shrink: 0;
    border-inline: 5px solid transparent;
    border-block-start: 6px solid var(--text-muted, #5E7A95);
    transition: transform .18s ease;
}
.profile-app .cf-intro[open] .cf-intro__toggle { transform: rotate(180deg); }
.profile-app .cf-intro__body {
    padding: 0 18px 16px;
    /* the icon column + its gap, so the prose lines up under the lead rather than under the badge */
    padding-inline-start: 54px;
}
.profile-app .cf-intro__body p {
    margin: 0 0 8px; font-size: 0.86rem; line-height: 1.85;
    color: var(--text-mid, #3D5A7A);
}
.profile-app .cf-intro__body p:last-child { margin-block-end: 0; }
.profile-app .cf-intro__watch {
    padding: 9px 12px; border-radius: 8px;
    background: var(--pa-surface-soft, #F8FAFC);
    border-inline-start: 3px solid var(--cf-accent, #0E7C7B);
}
.profile-app .cf-intro__watch strong { color: var(--navy, #152D50); }

/* ── TTM / attribution summary card ── */
.profile-app .cf-extra__total { text-align: end; }
.profile-app .cf-extra__total-label {
    display: block; font-size: 0.7rem; font-weight: 800;
    color: var(--text-muted, #5E7A95); margin-block-end: 3px;
}
.profile-app .cf-extra__total-value {
    font-size: 1.05rem; font-weight: 900; direction: ltr;
    unicode-bidi: isolate; display: block;
}
.profile-app .cf-extra__total-value.is-up   { color: var(--pa-success-fg, #10A37F); }
.profile-app .cf-extra__total-value.is-down { color: var(--pa-danger-fg, #EF4444); }

.profile-app .cf-extra__grid {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 1px; background: var(--pa-border-light, #EBF0F7);
}
.profile-app .cf-extra__item { background: var(--pa-surface, #fff); padding: 14px 18px; }
.profile-app .cf-extra__label {
    font-size: 0.74rem; font-weight: 700; color: var(--text-muted, #5E7A95);
    margin-block-end: 5px; line-height: 1.5;
}
.profile-app .cf-extra__value {
    font-size: 1rem; font-weight: 900; color: var(--navy, #152D50);
    direction: ltr; text-align: end; unicode-bidi: isolate;
}
.profile-app .cf-extra__value.is-up   { color: var(--pa-success-fg, #10A37F); }
.profile-app .cf-extra__value.is-down { color: var(--pa-danger-fg, #EF4444); }
.profile-app .cf-extra__bar {
    display: block; block-size: 4px; inline-size: 100%;
    background: var(--pa-surface-muted, #F1F5F9);
    border-radius: 999px; overflow: hidden; margin-block-start: 8px;
}
.profile-app .cf-extra__bar-fill { display: block; block-size: 100%; border-radius: 999px; inline-size: 0; }
.profile-app .cf-extra__bar-fill.is-up   { background: var(--pa-success-fg, #10A37F); }
.profile-app .cf-extra__bar-fill.is-down { background: var(--pa-danger-fg, #EF4444); }

/* The TTM card leads with its headline figure rather than a grid of equals. */
.profile-app .cf-extra--ttm .cf-extra__item:first-child .cf-extra__value {
    font-size: 1.25rem; color: var(--cf-accent, var(--teal, #0E7C7B));
}

/* Range selector sits beside the view switcher and must not compete with it. */
.profile-app .cf-seg--range { background: transparent; border-style: dashed; }
.profile-app .cf-seg--range .cf-seg__btn { font-size: 0.74rem; padding: 7px 11px; }

@media (max-width: 768px) {
    .profile-app .cf-intro__body { padding-inline-start: 18px; }
    .profile-app .cf-extra__grid { grid-template-columns: repeat(2, 1fr); }
    .profile-app .cf-extra__total { text-align: start; }
}
@media (max-width: 420px) {
    .profile-app .cf-extra__grid { grid-template-columns: 1fr; }
}


/* ══════════════════════════════════════════════════════════════════════════
   GROWTH PAGE (.gr-*) — /profile/growth
   A heatmap, not a statement table: metrics down, fiscal years across, colour
   carrying sign and magnitude. Shares the .cf-* card/intro shell so the two
   pages feel related without the growth page being a copy of the other one.
   ══════════════════════════════════════════════════════════════════════════ */

.profile-app .gr { display: block; }
.profile-app .gr .cf-intro { --cf-accent: var(--gr-accent, #0E7C7B); }
.profile-app .gr .cf-badge--soft {
    background: color-mix(in srgb, var(--gr-accent, #0E7C7B) 12%, transparent);
    color: var(--gr-accent, #0E7C7B);
    border-color: var(--gr-accent, #0E7C7B);
}
.profile-app .gr .cf-badge--year { background: var(--gr-accent, #152D50); border-color: var(--gr-accent, #152D50); }
.profile-app .gr .cf-seg__btn.is-active { background: var(--gr-accent, #152D50); }

/* ── The one-line verdict on the latest year ── */
.profile-app .gr-verdict {
    background: var(--pa-surface); border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-md); padding: 16px 20px; margin-block-end: 14px;
    box-shadow: var(--pa-shadow-sm);
}
.profile-app .gr-verdict__head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.profile-app .gr-verdict__period {
    font-size: 0.72rem; font-weight: 800; padding: 4px 11px; border-radius: 999px;
    background: var(--gr-accent, #0E7C7B); color: #fff; flex-shrink: 0;
}
.profile-app .gr-verdict__lead { font-size: 0.95rem; font-weight: 700; color: var(--navy, #152D50); line-height: 1.6; }
.profile-app .gr-verdict__lead .is-up   { color: var(--pa-success-fg, #10A37F); }
.profile-app .gr-verdict__lead .is-down { color: var(--pa-danger-fg, #EF4444); }

.profile-app .gr-verdict__bar {
    display: flex; block-size: 10px; border-radius: 999px; overflow: hidden;
    margin-block: 12px 8px; background: var(--pa-surface-muted);
}
.profile-app .gr-verdict__seg { display: block; block-size: 100%; }
.profile-app .gr-verdict__seg.is-up   { background: var(--pa-success-fg, #10A37F); }
.profile-app .gr-verdict__seg.is-flat { background: var(--pa-border-strong, #C4D0E0); }
.profile-app .gr-verdict__seg.is-down { background: var(--pa-danger-fg, #EF4444); }

.profile-app .gr-verdict__median { font-size: 0.8rem; color: var(--text-mid, #3D5A7A); }
.profile-app .gr-verdict__median strong { color: var(--navy, #152D50); direction: ltr; unicode-bidi: isolate; }
.profile-app .gr-verdict__note { color: var(--text-muted, #5E7A95); }

/* ── Biggest movers ── */
.profile-app .gr-movers {
    display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-block-end: 14px;
}
.profile-app .gr-movers__col {
    background: var(--pa-surface); border: 1px solid var(--pa-border);
    border-radius: var(--pa-r-md); padding: 14px 16px; box-shadow: var(--pa-shadow-sm);
}
.profile-app .gr-movers__title {
    font-size: 0.78rem; font-weight: 800; margin-block-end: 10px;
    padding-block-end: 8px; border-block-end: 1px solid var(--pa-border-light);
}
.profile-app .gr-movers__title.is-up   { color: var(--pa-success-fg, #10A37F); }
.profile-app .gr-movers__title.is-down { color: var(--pa-danger-fg, #EF4444); }
.profile-app .gr-movers__none { font-size: 0.8rem; color: var(--text-muted, #5E7A95); padding-block: 6px; }

.profile-app .gr-mover {
    display: flex; inline-size: 100%; align-items: center; gap: 10px;
    background: transparent; border: 0; cursor: pointer; font-family: inherit;
    padding: 8px; border-radius: 8px; min-block-size: 44px;
    text-align: start; transition: background .12s ease;
}
.profile-app .gr-mover:hover { background: var(--pa-surface-soft); }
.profile-app .gr-mover:focus-visible { outline: 2px solid var(--gr-accent, #0E7C7B); outline-offset: -2px; }
.profile-app .gr-mover__label { flex: 1; font-size: 0.82rem; font-weight: 700; color: var(--navy, #152D50); }
.profile-app .gr-mover__value {
    font-size: 0.85rem; font-weight: 900; direction: ltr; unicode-bidi: isolate; flex-shrink: 0;
}
.profile-app .gr-mover__value.is-up   { color: var(--pa-success-fg, #10A37F); }
.profile-app .gr-mover__value.is-down { color: var(--pa-danger-fg, #EF4444); }

/* ── The heatmap ── */
.profile-app .gr-mapwrap { max-block-size: 640px; overflow: auto; }
.profile-app .gr-map { inline-size: 100%; border-collapse: collapse; font-size: 0.8rem; }

.profile-app .gr-map th {
    position: sticky; inset-block-start: 0; z-index: 3;
    background: var(--pa-surface-soft); text-align: start;
    font-weight: 800; font-size: 0.73rem; color: var(--text-muted, #5E7A95);
    padding: 10px 12px; border-block-end: 1px solid var(--pa-border); white-space: nowrap;
}
.profile-app .gr-map td {
    padding: 8px 12px; border-block-end: 1px solid var(--pa-border-light);
    color: var(--text, #1A2B45); text-align: center;
    unicode-bidi: isolate; white-space: nowrap; font-weight: 700;
}
.profile-app .gr-map__rowhead {
    position: sticky; inset-inline-start: 0; z-index: 2;
    background: var(--pa-surface); min-inline-size: 230px;
    font-weight: 700; color: var(--navy, #152D50); text-align: start;
}
.profile-app .gr-map thead .gr-map__rowhead { z-index: 4; background: var(--pa-surface-soft); }
.profile-app .gr-map__row:hover .gr-map__rowhead { background: var(--pa-surface-soft); }

.profile-app .gr-map__spark { inline-size: 78px; padding-inline: 6px; text-align: center; }
.profile-app .gr-spark { display: inline-block; vertical-align: middle; }
.profile-app .gr-spark--none { color: var(--text-muted, #5E7A95); }

.profile-app .gr-map__group td {
    background: var(--pa-surface-muted); padding: 9px 12px;
    font-weight: 900; font-size: 0.78rem; color: var(--gr-accent, #0E7C7B);
    text-align: start; position: sticky; inset-inline-start: 0;
}

/* A jumped-to row flashes once so the reader's eye lands where the click sent it. */
.profile-app .gr-map__row.is-flash .gr-map__rowhead,
.profile-app .gr-map__row.is-flash td { animation: gr-flash 1.6s ease; }
@keyframes gr-flash {
    0%, 100% { background-color: transparent; }
    18%      { background-color: color-mix(in srgb, var(--gr-accent, #0E7C7B) 22%, transparent); }
}

/* ── Legend ── */
.profile-app .gr-legend {
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    padding: 12px 20px; border-block-start: 1px solid var(--pa-border-light);
    font-size: 0.74rem; color: var(--text-muted, #5E7A95);
}
.profile-app .gr-legend__label { font-weight: 800; color: var(--text-mid, #3D5A7A); }
.profile-app .gr-legend__scale {
    flex: 0 0 160px; block-size: 10px; border-radius: 999px;
    /* RTL: the gradient runs right-to-left, so "تراجع" on the right sits over red. */
    background: linear-gradient(to left,
        rgba(239,68,68,.72), rgba(239,68,68,.14),
        var(--pa-surface-muted),
        rgba(16,163,127,.14), rgba(16,163,127,.72));
}
.profile-app .gr-legend__note { flex: 1 1 100%; }

@media (max-width: 768px) {
    .profile-app .gr-movers { grid-template-columns: 1fr; }
    .profile-app .gr-verdict__head { flex-direction: column; align-items: flex-start; }
    .profile-app .gr-map__rowhead { min-inline-size: 160px; }
    .profile-app .gr-mapwrap { max-block-size: 480px; }
    .profile-app .gr-legend__scale { flex-basis: 110px; }
}

@media (prefers-reduced-motion: reduce) {
    .profile-app .gr-map__row.is-flash .gr-map__rowhead,
    .profile-app .gr-map__row.is-flash td { animation: none; outline: 2px solid var(--gr-accent, #0E7C7B); }
}
