/**
 * Dynasty Exchange Portfolio — Styles
 * Stock-market dark theme with glassmorphism panels.
 *
 * @package dynasty-market-build
 */

/* ─── Import Google Fonts ─── */
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;600;700;800;900&family=Inter:wght@400;500;600;700;800&display=swap');

/* ─── Root tokens ─── */
:root {
    --pf-bg-deep:      #0a0d16;
    --pf-bg-card:      rgba(18, 22, 36, 0.72);
    --pf-border:       rgba(255, 255, 255, 0.07);
    --pf-border-glow:  rgba(89, 167, 255, 0.25);
    --pf-accent-buy:   #20ceb8;
    --pf-accent-sell:  #fc2b6d;
    --pf-accent-trade: #bd66ff;
    --pf-accent-blue:  #59a7ff;
    --pf-accent-gold:  #f9cf25;
    --pf-text-muted:   #64748b;
    --pf-text-dim:     #94a3b8;
    --pf-text-main:    #e2e8f0;
    --pf-radius:       12px;
    --pf-radius-sm:    8px;
    --pf-blur:         blur(16px);
}

/* ─── Wrapper ─── */
.pf-wrapper {
    max-width: 1400px;
    margin: 0 auto;
    padding: 2rem 1.25rem 4rem;
    font-family: 'Inter', sans-serif;
    color: var(--pf-text-main);
    min-height: 100vh;
    background: radial-gradient(ellipse at 15% 20%, rgba(89,167,255,0.04) 0%, transparent 60%),
                radial-gradient(ellipse at 85% 80%, rgba(189,102,255,0.04) 0%, transparent 60%);
}

/* ─── Main + sidebar layout ─── */
.pf-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 1.25rem;
    align-items: start;
}
.pf-main {
    min-width: 0;
    display: flex;
    flex-direction: column;
}
.pf-sidebar {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0; /* panels already have margin-bottom */
}
.pf-side-panel {
    padding: 1.1rem 1.15rem;
}
.pf-side-panel .pf-panel-title {
    font-size: 0.92rem;
    margin-bottom: 0.85rem;
    padding-bottom: 0.55rem;
}

@media (max-width: 1100px) {
    .pf-layout {
        grid-template-columns: 1fr;
    }
    .pf-sidebar {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 1rem;
    }
    .pf-sidebar > .pf-glass-panel {
        margin-bottom: 0;
    }
}
@media (max-width: 720px) {
    .pf-sidebar {
        grid-template-columns: 1fr;
    }
}

/* ─── Glass Panel ─── */
.pf-glass-panel {
    background: var(--pf-bg-card);
    border: 1px solid var(--pf-border);
    backdrop-filter: var(--pf-blur);
    -webkit-backdrop-filter: var(--pf-blur);
    border-radius: var(--pf-radius);
    padding: 1.5rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 8px 32px rgba(0,0,0,0.4);
    transition: border-color 0.2s ease;
}
.pf-glass-panel:hover {
    border-color: rgba(255,255,255,0.11);
}

.pf-panel-title {
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 1rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #fff;
    margin: 0 0 1.25rem;
    display: flex;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid var(--pf-border);
    padding-bottom: 0.75rem;
}

/* ─── Hero Header ─── */
.pf-hero {
    border-top: 3px solid var(--pf-accent-blue);
    background: linear-gradient(135deg, rgba(89,167,255,0.07) 0%, rgba(18,22,36,0.8) 60%);
}

.pf-hero-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.pf-stat-block {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.pf-stat-label {
    font-size: 0.65rem;
    font-weight: 700;
    color: var(--pf-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.pf-stat-value {
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 2rem;
    font-weight: 900;
    color: #fff;
    line-height: 1;
}

.pf-stat-value.small {
    font-size: 1.4rem;
}

.pf-stat-sub {
    font-size: 0.72rem;
    color: var(--pf-text-dim);
    font-weight: 500;
}

/* ─── Delta indicators ─── */
.pf-delta {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-family: 'Barlow Condensed', sans-serif;
    font-weight: 800;
    font-size: 0.85rem;
}
.pf-delta-up   { color: var(--pf-accent-buy);  }
.pf-delta-down { color: var(--pf-accent-sell); }
.pf-delta-flat { color: var(--pf-text-muted);  }

.pf-delta::before {
    content: '▲';
    font-size: 0.65rem;
}
.pf-delta-down::before { content: '▼'; }
.pf-delta-flat::before { content: '—'; font-size: 0.75rem; }

/* ─── Pill badges ─── */
.pf-pill {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    border-radius: 99px;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border: 1px solid;
}

.pf-pill-blue   { color: var(--pf-accent-blue);  background: rgba(89,167,255,0.1);   border-color: rgba(89,167,255,0.3);   }
.pf-pill-green  { color: var(--pf-accent-buy);   background: rgba(32,206,184,0.1);   border-color: rgba(32,206,184,0.3);   }
.pf-pill-red    { color: var(--pf-accent-sell);  background: rgba(252,43,109,0.1);   border-color: rgba(252,43,109,0.3);   }
.pf-pill-purple { color: var(--pf-accent-trade); background: rgba(189,102,255,0.1);  border-color: rgba(189,102,255,0.3);  }
.pf-pill-gold   { color: var(--pf-accent-gold);  background: rgba(249,207,37,0.1);   border-color: rgba(249,207,37,0.3);   }

/* ─── Shares badge ─── */
.pf-shares-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 6px;
    font-family: 'Barlow Condensed', sans-serif;
    font-weight: 900;
    font-size: 0.85rem;
    background: rgba(89,167,255,0.15);
    color: var(--pf-accent-blue);
    border: 1px solid rgba(89,167,255,0.3);
}
.pf-shares-badge.multi {
    background: rgba(249,207,37,0.15);
    color: var(--pf-accent-gold);
    border-color: rgba(249,207,37,0.35);
}

/* ─── NAV / stock chart ─── */
.pf-nav-hint {
    display: inline-block;
    margin-left: 4px;
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 0.6rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    color: var(--pf-accent-blue);
    background: rgba(89,167,255,0.12);
    border: 1px solid rgba(89,167,255,0.28);
    vertical-align: middle;
    cursor: help;
}

.pf-chart-panel .pf-chart-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 0.5rem;
    border-bottom: 1px solid var(--pf-border);
    padding-bottom: 0.85rem;
}

.pf-chart-header-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
}

.pf-chart-explainer {
    margin: 6px 0 0;
    max-width: 520px;
    font-size: 0.74rem;
    line-height: 1.45;
    color: var(--pf-text-dim);
}
.pf-chart-explainer strong { color: #fff; font-weight: 700; }
.pf-chart-explainer em { color: var(--pf-accent-blue); font-style: normal; font-weight: 600; }

.pf-chart-period-change {
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 1.05rem;
    font-weight: 900;
    letter-spacing: 0.02em;
}
.pf-chart-period-change .up   { color: var(--pf-accent-buy); }
.pf-chart-period-change .down { color: var(--pf-accent-sell); }
.pf-chart-period-change .flat { color: var(--pf-text-muted); font-size: 0.85rem; font-weight: 700; }

.pf-chart-container {
    position: relative;
    height: 280px;
    margin-top: 0.75rem;
}
.pf-chart-container.pf-stock-chart {
    height: 340px;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.015) 0%, transparent 40%),
        repeating-linear-gradient(
            0deg,
            transparent,
            transparent 39px,
            rgba(255,255,255,0.012) 40px
        );
    border: 1px solid rgba(255,255,255,0.04);
    border-radius: 10px;
    padding: 8px 4px 4px;
}

.pf-chart-controls {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.pf-tab-btn {
    padding: 5px 12px;
    border-radius: 6px;
    border: 1px solid var(--pf-border);
    background: transparent;
    color: var(--pf-text-muted);
    font-size: 0.72rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.15s ease;
    font-family: 'Inter', sans-serif;
    min-width: 42px;
}
.pf-tab-btn:hover   { border-color: var(--pf-accent-blue); color: var(--pf-accent-blue); }
.pf-tab-btn.active  { background: var(--pf-accent-blue); color: #000; border-color: var(--pf-accent-blue); }

.pf-chart-legend {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    margin-top: 0.85rem;
    font-size: 0.7rem;
    color: #94a3b8;
}
.pf-chart-legend-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.pf-chart-legend-swatch {
    display: inline-block;
    width: 16px;
    height: 2.5px;
    border-radius: 2px;
}

/* ─── Diversification ─── */
.pf-insight-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 10px;
    margin-bottom: 1.35rem;
}
.pf-insight-stack {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 1rem;
}
.pf-insight-card {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 12px 14px;
    border-radius: var(--pf-radius-sm);
    border: 1px solid var(--pf-border);
    background: rgba(255,255,255,0.025);
}
.pf-insight-card-sm {
    padding: 9px 11px;
}
.pf-insight-card-sm .pf-insight-value {
    font-size: 1rem;
}
.pf-div-row-head-side {
    grid-template-columns: 42px 1fr auto auto;
    font-size: 0.72rem;
}
.pf-side-player-row {
    display: grid;
    grid-template-columns: 1fr 36px auto;
    gap: 6px;
    align-items: center;
    padding: 6px 0;
    border-bottom: 1px solid rgba(255,255,255,0.04);
    font-size: 0.78rem;
}
.pf-side-player-row a {
    color: #fff;
    text-decoration: none;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.pf-side-player-row a:hover { color: var(--pf-accent-blue); }
.pf-side-val {
    font-family: 'Barlow Condensed', sans-serif;
    font-weight: 800;
    font-size: 0.88rem;
}
.pf-watchlist-stack {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.pf-watch-card-side {
    padding: 10px 11px;
}
.pf-watch-card-side .pf-watch-card-header {
    margin-bottom: 0;
}
.pf-watch-card-side .pf-watch-card-name {
    font-size: 0.82rem;
}
.pf-watch-card-side .pf-watch-card-price {
    font-size: 0.95rem;
}
.pf-insight-icon {
    font-size: 1rem;
    margin-top: 2px;
    opacity: 0.95;
}
.pf-insight-body {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.pf-insight-label {
    font-size: 0.62rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--pf-text-muted);
}
.pf-insight-value {
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 1.15rem;
    font-weight: 900;
    color: #fff;
    line-height: 1.15;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.pf-insight-sub {
    font-size: 0.68rem;
    color: var(--pf-text-dim);
    line-height: 1.3;
}

.pf-div-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}
@media (max-width: 800px) {
    .pf-div-columns { grid-template-columns: 1fr; }
}

.pf-div-col-title {
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 0.95rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #fff;
    margin: 0 0 0.85rem;
    display: flex;
    align-items: center;
    gap: 8px;
}

.pf-div-row {
    margin-bottom: 10px;
}
.pf-div-row-head {
    display: grid;
    grid-template-columns: 48px 1fr auto auto;
    gap: 8px;
    align-items: baseline;
    margin-bottom: 4px;
    font-size: 0.78rem;
}
.pf-div-key {
    font-family: 'Barlow Condensed', sans-serif;
    font-weight: 900;
    font-size: 0.95rem;
    color: #fff;
}
.pf-div-meta {
    color: var(--pf-text-muted);
    font-size: 0.68rem;
    font-weight: 600;
}
.pf-div-val {
    font-family: 'Barlow Condensed', sans-serif;
    font-weight: 800;
    color: #e2e8f0;
    font-size: 0.9rem;
}
.pf-div-pct {
    font-family: 'Barlow Condensed', sans-serif;
    font-weight: 700;
    color: var(--pf-text-dim);
    font-size: 0.82rem;
    min-width: 42px;
    text-align: right;
}
.pf-div-bar-track {
    height: 5px;
    border-radius: 99px;
    background: rgba(255,255,255,0.05);
    overflow: hidden;
}
.pf-div-bar-fill {
    height: 100%;
    border-radius: 99px;
    opacity: 0.85;
    min-width: 2px;
    transition: width 0.35s ease;
}
.pf-div-more {
    font-size: 0.72rem;
    color: var(--pf-text-muted);
    font-style: italic;
    margin-top: 4px;
}

/* ─── Holdings Table ─── */
.pf-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.82rem;
}

.pf-table th {
    padding: 8px 10px;
    text-align: left;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--pf-text-muted);
    border-bottom: 1px solid var(--pf-border);
    cursor: pointer;
    white-space: nowrap;
    user-select: none;
}
.pf-table th:hover { color: var(--pf-accent-blue); }
.pf-table th .sort-icon { opacity: 0.4; margin-left: 3px; }
.pf-table th.sort-asc .sort-icon,
.pf-table th.sort-desc .sort-icon { opacity: 1; color: var(--pf-accent-blue); }

.pf-table td {
    padding: 10px 10px;
    border-bottom: 1px solid rgba(255,255,255,0.03);
    vertical-align: middle;
    color: var(--pf-text-main);
}

.pf-table tr:hover td { background: rgba(255,255,255,0.025); }

.pf-table .pf-player-cell {
    display: flex;
    align-items: center;
    gap: 10px;
}

.pf-ticker-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 34px;
    border-radius: 6px;
    font-family: 'Barlow Condensed', 'Roboto Mono', monospace;
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    flex-shrink: 0;
    backdrop-filter: blur(4px);
    user-select: none;
}

/* Shared ticker + position pricing chrome (portfolio chips, ledger, bottom bar) */
.ticker {
    font-family: 'Barlow Condensed', 'Roboto Mono', monospace;
    font-weight: 900;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border-radius: 6px;
    border: 1.5px solid;
}
.pf-ticker-chip.ticker,
.pf-ledger-sym.ticker {
    /* base fills overridden per position below */
    background: rgba(189, 102, 255, 0.12);
    border-color: rgba(189, 102, 255, 0.35);
    color: #bd66ff;
}
.ticker.ticker-QB,
.ticker.ticker-qb { background: rgba(252,43,109,0.12); border-color: rgba(252,43,109,0.4); color: #fc2b6d; }
.ticker.ticker-RB,
.ticker.ticker-rb,
.ticker.ticker-FB { background: rgba(32,206,184,0.12); border-color: rgba(32,206,184,0.4); color: #20ceb8; }
.ticker.ticker-WR,
.ticker.ticker-wr { background: rgba(89,167,255,0.12); border-color: rgba(89,167,255,0.4); color: #59a7ff; }
.ticker.ticker-TE,
.ticker.ticker-te { background: rgba(253,151,45,0.12); border-color: rgba(253,151,45,0.4); color: #fd972d; }
.ticker.ticker-K,
.ticker.ticker-PK { background: rgba(249,207,37,0.12); border-color: rgba(249,207,37,0.4); color: #f9cf25; }
/* DL group */
.ticker.ticker-DL,
.ticker.ticker-DE,
.ticker.ticker-DT,
.ticker.ticker-NT,
.ticker.ticker-EDGE,
.ticker.ticker-IDL { background: rgba(253,92,1,0.12); border-color: rgba(253,92,1,0.4); color: #fd5c01; }
/* LB group */
.ticker.ticker-LB,
.ticker.ticker-ILB,
.ticker.ticker-OLB,
.ticker.ticker-MLB,
.ticker.ticker-WLB,
.ticker.ticker-SLB { background: rgba(163,172,255,0.12); border-color: rgba(163,172,255,0.4); color: #a3acff; }
/* DB group */
.ticker.ticker-DB,
.ticker.ticker-CB,
.ticker.ticker-S,
.ticker.ticker-SS,
.ticker.ticker-FS,
.ticker.ticker-SAF,
.ticker.ticker-NB { background: rgba(253,125,182,0.12); border-color: rgba(253,125,182,0.4); color: #fd7db6; }
/* Futures / unknown */
.ticker.ticker-FUT,
.ticker.ticker-UNK { background: rgba(189,102,255,0.12); border-color: rgba(189,102,255,0.4); color: #bd66ff; }

.pf-futures-badge {
    display: inline-block;
    margin-left: 8px;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.58rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    vertical-align: middle;
    color: #bd66ff;
    background: rgba(189,102,255,0.12);
    border: 1px solid rgba(189,102,255,0.3);
}
.pf-futures-round {
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--pf-text-dim);
}
.pf-futures-row td {
    padding-top: 9px;
    padding-bottom: 9px;
}

.pf-player-name {
    font-weight: 700;
    color: #fff;
    text-decoration: none;
    font-size: 0.85rem;
    display: block;
    line-height: 1.2;
}
.pf-player-name:hover { color: var(--pf-accent-blue); }

.pf-player-meta {
    font-size: 0.68rem;
    color: var(--pf-text-muted);
    font-weight: 600;
}

.pf-price,
.pf-shares-badge,
.pf-watch-card-price {
	font-family: var(--mono), monospace;
	font-variant-numeric: tabular-nums;
}
.pf-price {
    font-family: 'Barlow Condensed', sans-serif;
    font-weight: 800;
    font-size: 0.92rem;
}

.pf-table .pf-watch-star {
    cursor: pointer;
    font-size: 0.85rem;
    color: var(--pf-text-muted);
    transition: color 0.15s, transform 0.15s;
}
.pf-table .pf-watch-star:hover,
.pf-table .pf-watch-star.watching { color: var(--pf-accent-gold); }
.pf-table .pf-watch-star.watching { transform: scale(1.15); }

/* ─── League Breakdown Accordion ─── */
.pf-league-card {
    border: 1px solid var(--pf-border);
    border-radius: var(--pf-radius-sm);
    overflow: hidden;
    margin-bottom: 10px;
}

.pf-league-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    background: rgba(255,255,255,0.025);
    cursor: pointer;
    transition: background 0.15s;
    user-select: none;
}
.pf-league-header:hover { background: rgba(255,255,255,0.04); }

.pf-league-header .league-name {
    font-weight: 700;
    font-size: 0.9rem;
    color: #fff;
}

.pf-league-body {
    display: none;
    padding: 14px 16px;
    border-top: 1px solid var(--pf-border);
}
.pf-league-card.open .pf-league-body { display: block; }
.pf-league-card.open .pf-league-chevron { transform: rotate(180deg); }
.pf-league-chevron { transition: transform 0.2s ease; color: var(--pf-text-muted); }

/* ─── Transaction Ledger ─── */
.pf-ledger-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.82rem;
}

.pf-ledger-table th {
    padding: 8px 10px;
    text-align: left;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--pf-text-muted);
    border-bottom: 1px solid var(--pf-border);
}

.pf-ledger-row {
    border-bottom: 1px solid rgba(255,255,255,0.03);
    transition: background 0.12s;
}
.pf-ledger-row:hover { background: rgba(255,255,255,0.02); }

.pf-ledger-row td {
    padding: 10px 10px;
    vertical-align: middle;
}

/* Flow direction — value entering vs leaving the portfolio */
.pf-ledger-row.flow-in  { border-left: 3px solid var(--pf-accent-buy);  }
.pf-ledger-row.flow-out { border-left: 3px solid var(--pf-accent-sell); }
.pf-ledger-row.tx-add,
.pf-ledger-row.tx-trade_in  { /* keep flow-in color */ }
.pf-ledger-row.tx-drop,
.pf-ledger-row.tx-trade_out { /* keep flow-out color */ }

.pf-flow-badge {
    display: inline-flex;
    flex-direction: column;
    gap: 1px;
    min-width: 72px;
}
.pf-flow-arrow {
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.04em;
}
.pf-flow-type {
    font-size: 0.58rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    opacity: 0.75;
}
.pf-flow-badge.in  .pf-flow-arrow { color: var(--pf-accent-buy); }
.pf-flow-badge.out .pf-flow-arrow { color: var(--pf-accent-sell); }
.pf-flow-badge.in  .pf-flow-type  { color: var(--pf-accent-buy); }
.pf-flow-badge.out .pf-flow-type  { color: var(--pf-accent-sell); }

.pf-ledger-date {
    color: var(--pf-text-muted);
    font-size: 0.75rem;
    white-space: nowrap;
}
.pf-ledger-league {
    font-size: 0.72rem;
    color: var(--pf-text-dim);
    max-width: 120px;
}
.pf-ledger-player {
    display: flex;
    align-items: center;
    gap: 8px;
}
.pf-ledger-sym {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 48px;
    height: 26px;
    padding: 0 6px;
    border-radius: 5px;
    font-family: 'Barlow Condensed', monospace;
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.05em;
    color: var(--pf-accent-blue);
    background: rgba(89,167,255,0.1);
    border: 1px solid rgba(89,167,255,0.25);
}
.pf-ledger-name {
    color: #fff;
    font-weight: 700;
    text-decoration: none;
    font-size: 0.82rem;
}
.pf-ledger-name:hover { color: var(--pf-accent-blue); }

.pf-ledger-value {
    font-family: 'Barlow Condensed', sans-serif;
    font-weight: 900;
    font-size: 1rem;
    white-space: nowrap;
}
.pf-ledger-value.pf-val-in  { color: var(--pf-accent-buy); }
.pf-ledger-value.pf-val-out { color: var(--pf-accent-sell); }

.pf-est-badge {
    font-size: 0.58rem;
    color: var(--pf-text-muted);
    font-style: italic;
    margin-left: 3px;
}
.pf-sync-auto-note {
    font-size: 0.7rem;
    color: var(--pf-text-muted);
}

.pf-ledger-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-top: 1rem;
}

.pf-page-btn {
    padding: 5px 12px;
    border-radius: 6px;
    border: 1px solid var(--pf-border);
    background: transparent;
    color: var(--pf-text-dim);
    font-size: 0.75rem;
    cursor: pointer;
    transition: all 0.15s;
    font-family: 'Inter', sans-serif;
}
.pf-page-btn:hover   { border-color: var(--pf-accent-blue); color: var(--pf-accent-blue); }
.pf-page-btn.active  { background: var(--pf-accent-blue); color: #000; border-color: var(--pf-accent-blue); font-weight: 700; }
.pf-page-btn:disabled { opacity: 0.3; cursor: default; }

/* ─── Watchlist Cards ─── */
.pf-watchlist-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 12px;
    margin-top: 0.75rem;
}

.pf-watch-card {
    background: rgba(255,255,255,0.025);
    border: 1px solid var(--pf-border);
    border-radius: var(--pf-radius-sm);
    padding: 14px;
    transition: border-color 0.2s, transform 0.15s;
    position: relative;
    overflow: hidden;
}
.pf-watch-card:hover {
    border-color: rgba(255,255,255,0.12);
    transform: translateY(-1px);
}
.pf-watch-card.watched { border-top: 2px solid var(--pf-accent-gold); }

.pf-watch-card-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.pf-watch-card-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    background: rgba(255,255,255,0.05);
    flex-shrink: 0;
}

.pf-watch-card-name {
    font-weight: 800;
    font-size: 0.88rem;
    color: #fff;
    display: block;
    text-decoration: none;
    line-height: 1.2;
}
.pf-watch-card-name:hover { color: var(--pf-accent-blue); }

.pf-watch-card-pos {
    font-size: 0.68rem;
    color: var(--pf-text-muted);
    font-weight: 600;
}

.pf-watch-card-stats {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-top: 8px;
}

.pf-watch-card-price {
    font-family: 'Barlow Condensed', sans-serif;
    font-weight: 900;
    font-size: 1.1rem;
    color: #fff;
}

.pf-watch-toggle-btn {
    font-size: 0.65rem;
    padding: 3px 8px;
    border-radius: 5px;
    border: 1px solid var(--pf-border);
    background: transparent;
    color: var(--pf-text-muted);
    cursor: pointer;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    transition: all 0.15s;
}
.pf-watch-toggle-btn:hover,
.pf-watch-toggle-btn.watching {
    border-color: var(--pf-accent-gold);
    color: var(--pf-accent-gold);
    background: rgba(249,207,37,0.08);
}

.pf-watch-card-news {
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid rgba(255,255,255,0.05);
    font-size: 0.72rem;
    color: var(--pf-text-dim);
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ─── Watchlist Filter Bar ─── */
.pf-filter-bar {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.pf-filter-btn {
    padding: 5px 12px;
    border-radius: 6px;
    border: 1px solid var(--pf-border);
    background: transparent;
    color: var(--pf-text-muted);
    font-size: 0.72rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.15s;
    font-family: 'Inter', sans-serif;
}
.pf-filter-btn:hover  { border-color: var(--pf-accent-blue); color: var(--pf-accent-blue); }
.pf-filter-btn.active { background: rgba(89,167,255,0.12); border-color: var(--pf-accent-blue); color: var(--pf-accent-blue); }

/* ─── News Feed ─── */
.pf-news-feed {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 0.75rem;
}

.pf-news-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    border-radius: var(--pf-radius-sm);
    background: rgba(255,255,255,0.02);
    border: 1px solid rgba(255,255,255,0.04);
    transition: border-color 0.15s;
}
.pf-news-item:hover { border-color: rgba(255,255,255,0.09); }

.pf-news-player-chip {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 99px;
    background: rgba(249,207,37,0.12);
    color: var(--pf-accent-gold);
    font-size: 0.65rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
    flex-shrink: 0;
}

.pf-news-content {
    flex: 1;
    min-width: 0;
}

.pf-news-title {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--pf-text-main);
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.pf-news-meta {
    font-size: 0.65rem;
    color: var(--pf-text-muted);
    margin-top: 3px;
}

/* ─── Empty States ─── */
.pf-empty-state {
    text-align: center;
    padding: 3rem 1rem;
    color: var(--pf-text-muted);
}

.pf-empty-icon {
    font-size: 2.5rem;
    margin-bottom: 0.75rem;
    opacity: 0.4;
}

.pf-empty-title {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--pf-text-dim);
    margin-bottom: 0.4rem;
}

.pf-empty-sub {
    font-size: 0.8rem;
    line-height: 1.5;
}

/* ─── Sync bar ─── */
.pf-sync-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
    padding: 10px 14px;
    background: rgba(89,167,255,0.05);
    border: 1px solid rgba(89,167,255,0.15);
    border-radius: var(--pf-radius-sm);
    margin-bottom: 1rem;
    font-size: 0.78rem;
}

.pf-sync-btn {
    padding: 6px 16px;
    border-radius: 6px;
    background: var(--pf-accent-blue);
    color: #000;
    font-weight: 800;
    font-size: 0.75rem;
    border: none;
    cursor: pointer;
    font-family: 'Inter', sans-serif;
    transition: opacity 0.15s, transform 0.15s;
    display: flex;
    align-items: center;
    gap: 6px;
}
.pf-sync-btn:hover   { opacity: 0.85; transform: translateY(-1px); }
.pf-sync-btn:disabled { opacity: 0.5; cursor: wait; }

/* ─── Loading spinner ─── */
.pf-spinner {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255,255,255,0.2);
    border-top-color: var(--pf-accent-blue);
    border-radius: 50%;
    animation: pf-spin 0.7s linear infinite;
}
@keyframes pf-spin { to { transform: rotate(360deg); } }

/* ─── Responsive ─── */
@media (max-width: 768px) {
    .pf-wrapper { padding: 1rem 0.75rem 3rem; }
    .pf-hero-stats { grid-template-columns: 1fr 1fr; }
    .pf-stat-value { font-size: 1.5rem; }
    .pf-chart-container { height: 200px; }
    .pf-table th:nth-child(n+5),
    .pf-table td:nth-child(n+5) { display: none; }
    .pf-watchlist-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 480px) {
    .pf-watchlist-grid { grid-template-columns: 1fr; }
    .pf-hero-stats     { grid-template-columns: 1fr; }
}

/* ─── Ticker Marquee Bar ─── */
.pf-ticker-bar {
    position: relative;
    width: 100%;
    background: rgba(10, 13, 22, 0.85);
    border-top: 1px solid rgba(89,167,255,0.12);
    border-bottom: 1px solid rgba(89,167,255,0.12);
    overflow: hidden;
    height: 38px;
    margin: 0 0 8px;
    backdrop-filter: blur(6px);
}
.pf-ticker-bar::before,
.pf-ticker-bar::after {
    content: '';
    position: absolute;
    top: 0; bottom: 0;
    width: 48px;
    z-index: 2;
    pointer-events: none;
}
.pf-ticker-bar::before {
    left: 0;
    background: linear-gradient(to right, #0a0d16, transparent);
}
.pf-ticker-bar::after {
    right: 0;
    background: linear-gradient(to left, #0a0d16, transparent);
}

.pf-ticker-track {
    display: flex;
    align-items: center;
    gap: 0;
    height: 100%;
    white-space: nowrap;
    animation: pfTickerScroll 60s linear infinite;
    will-change: transform;
}
.pf-ticker-track:hover {
    animation-play-state: paused;
}

@keyframes pfTickerScroll {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

.pf-ticker-item {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 0 14px;
    height: 38px;
    text-decoration: none;
    color: var(--pf-text-dim);
    font-size: 0.7rem;
    transition: background 0.15s;
    border-right: 1px solid rgba(255,255,255,0.05);
}
.pf-ticker-item:hover {
    background: rgba(255,255,255,0.04);
    color: #fff;
}
.pf-ticker-sym {
    font-family: 'Barlow Condensed', monospace;
    font-weight: 900;
    font-size: 0.75rem;
    letter-spacing: 0.04em;
    color: var(--tc, #59a7ff);
}
.pf-ticker-price {
    font-family: 'Barlow Condensed', monospace;
    font-weight: 700;
    color: #e2e8f0;
    font-size: 0.78rem;
}
.pf-ticker-delta {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}
.pf-ticker-dot {
    color: rgba(255,255,255,0.15);
    font-size: 1rem;
    margin-left: 2px;
}
.pf-ticker-badge {
    font-size: 0.58rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    padding: 1px 5px;
    border-radius: 3px;
    text-transform: uppercase;
}
.pf-ticker-badge.up {
    color: #20ceb8;
    background: rgba(32,206,184,0.12);
    border: 1px solid rgba(32,206,184,0.3);
}
.pf-ticker-badge.down {
    color: #fc2b6d;
    background: rgba(252,43,109,0.12);
    border: 1px solid rgba(252,43,109,0.3);
}
.pf-ticker-item.is-up  { background: rgba(32,206,184,0.04); }
.pf-ticker-item.is-down { background: rgba(252,43,109,0.04); }