/* Shared published-projection composition. Tokens only. Theme-aware. */

.npp-scoreboard {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 0.75rem;
    padding: 0.85rem 1rem;
    border: 1px solid hsl(var(--border));
    border-radius: 12px;
    background: hsl(var(--card));
}
.npp-scoreboard__team span,
.npp-scoreboard__mid span,
.npp-facts span,
.npp-meta dt {
    display: block;
    color: hsl(var(--muted-foreground));
    font-size: 0.68rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.npp-scoreboard__team strong,
.npp-scoreboard__mid b,
.npp-facts strong,
.npp-num {
    font-family: var(--mono, ui-monospace, monospace);
    font-variant-numeric: tabular-nums;
}
.npp-scoreboard__team strong { font-size: 1.45rem; }
.npp-scoreboard__team--home { text-align: right; }
.npp-scoreboard__mid { text-align: center; }
.npp-scoreboard__mid b { display: block; font-size: 0.95rem; }
.npp-scoreboard__team small { color: hsl(var(--muted-foreground)); font-size: 0.72rem; }

.npp-facts {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.5rem;
    margin: 0.75rem 0;
}
.npp-facts > div {
    padding: 0.65rem 0.75rem;
    border: 1px solid hsl(var(--border));
    border-radius: 10px;
    background: hsl(var(--muted) / 0.35);
}

.npp-meta {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 0.55rem 1rem;
    margin: 0.75rem 0 0;
    font-size: 0.78rem;
}
.npp-meta dd { margin: 0.15rem 0 0; }
.npp-meta--awaiting,
.npp-empty,
.npp-awaiting p {
    color: hsl(var(--muted-foreground));
    font-size: 0.86rem;
}
.npp-warnings {
    margin: 0.5rem 0 0;
    padding-left: 1.1rem;
    color: hsl(var(--brand-strong, var(--brand)));
    font-size: 0.75rem;
}
.npp-forecast-withheld {
    margin: 0.75rem 0;
    padding: 0.85rem 1rem;
    border: 1px solid hsl(var(--border));
    border-radius: 12px;
    background: hsl(var(--muted) / 0.4);
}
.npp-forecast-withheld h3 {
    margin: 0 0 0.35rem;
    font-size: 1rem;
}
.npp-forecast-withheld p,
.npp-forecast-withheld__note {
    margin: 0.45rem 0 0;
    color: hsl(var(--muted-foreground));
    font-size: 0.86rem;
    line-height: 1.45;
}

.npp-players { display: grid; gap: 1rem; margin-top: 1rem; }
.npp-players__group h3,
.npp-td-board h3,
.npp-awaiting h3,
.npp-review h3 {
    margin: 0 0 0.5rem;
    font-family: var(--cond, inherit);
    font-size: 0.82rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.npp-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8rem;
}
.npp-table th,
.npp-table td {
    padding: 0.45rem 0.5rem;
    border-bottom: 1px solid hsl(var(--border));
    text-align: left;
    vertical-align: top;
}
.npp-table thead th {
    color: hsl(var(--muted-foreground));
    font-size: 0.62rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}
.npp-table .npp-num,
.npp-table td { font-family: var(--mono, ui-monospace, monospace); font-variant-numeric: tabular-nums; }
.npp-table tbody th { font-family: var(--sans, inherit); font-weight: 650; }
.npp-table tbody th span,
.npp-player-warnings {
    color: hsl(var(--muted-foreground));
    font-size: 0.68rem;
    font-weight: 500;
}
.npp-stat-heat {
    font-weight: 650;
    color: hsl(var(--foreground));
}
.npp-stat-heat--1 { background: hsl(var(--brand) / 0.06); }
.npp-stat-heat--2 { background: hsl(var(--brand) / 0.11); }
.npp-stat-heat--3 { background: hsl(var(--brand) / 0.17); }
.npp-stat-heat--4 { background: hsl(var(--brand) / 0.24); }

.npp-td-row--other th,
.npp-td-row--no-td th { font-style: italic; }
.npp-td-row--no-td { background: hsl(var(--muted) / 0.4); }
.npp-td-board { margin-top: 1rem; }
.npp-td-board__head { margin-bottom: 0.4rem; }
.npp-td-row th > div {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    flex-wrap: wrap;
}
.npp-td-result { margin-left: 0.1rem; vertical-align: middle; }
.td-live-fav-row .npp-td-result { margin-left: 0.35rem; }

/* Satellite pages do not load common.css. Keep these identical to the shared form squares. */
.form-dots {
    display: inline-flex;
    align-items: center;
    gap: 2px;
}
.form-dot {
    width: 14px;
    height: 14px;
    border-radius: 2px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: var(--cond, var(--sans, sans-serif));
    font-size: 8px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
    padding-top: 1.5px;
}
.form-dot--w {
    background: hsl(var(--electric-mint, var(--brand, 27 77% 52%)));
    color: hsl(var(--deep-midnight, 0 0% 100%));
}
.form-dot--l {
    background: hsl(var(--electric-mint, var(--brand, 27 77% 52%)) / 0.15);
    color: hsl(var(--electric-mint, var(--brand, 27 77% 52%)) / 0.6);
}
.form-dot--d {
    background: hsl(var(--muted-foreground) / 0.28);
    color: hsl(var(--muted-foreground));
}
.form-dots--sm .form-dot { width: 12px; height: 12px; font-size: 7px; }

.npp-awaiting,
.npp-review {
    padding: 1rem 1.1rem;
    border: 1px solid hsl(var(--border));
    border-radius: 12px;
    background: hsl(var(--card));
}
.npp-previews {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 0.4rem;
    padding: 0;
    list-style: none;
}
.npp-previews a {
    display: block;
    padding: 0.45rem 0.6rem;
    border: 1px solid hsl(var(--border));
    border-radius: 8px;
    color: hsl(var(--foreground));
    text-decoration: none;
    font-size: 0.78rem;
}
.npp-previews a:hover { border-color: hsl(var(--brand)); }

.npp-week-proj { align-items: flex-start; }
.npp-week-proj strong { display: block; font-family: var(--mono, ui-monospace, monospace); }
.npp-week-proj span { color: hsl(var(--muted-foreground)); }

.npp-markets {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin: 0 0 0.85rem;
}
.npp-markets button {
    padding: 0.4rem 0.75rem;
    border: 1px solid hsl(var(--border));
    border-radius: 999px;
    background: hsl(var(--card));
    color: hsl(var(--muted-foreground));
    font-size: 0.76rem;
    font-weight: 700;
    cursor: pointer;
}
.npp-markets button.is-active {
    border-color: hsl(var(--brand));
    background: hsl(var(--brand) / 0.14);
    color: hsl(var(--foreground));
}

.npp-week-td { margin-top: 1.25rem; }

.npp-ftd, .npp-ftd-lb {
    margin-top: 1rem;
    padding: 1rem;
    border: 1px solid hsl(var(--border));
    border-radius: 12px;
    background: hsl(var(--card));
}
.npp-ftd h3, .npp-ftd-lb h3 {
    margin: 0 0 0.35rem;
    font-size: 0.95rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.npp-ftd p, .npp-ftd-lb p, .npp-ftd-me {
    margin: 0 0 0.75rem;
    color: hsl(var(--muted-foreground));
    font-size: 0.82rem;
}
.npp-ftd-list { display: grid; gap: 0.4rem; }
.npp-ftd-choice {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    width: 100%;
    padding: 0.65rem 0.75rem;
    border: 1px solid hsl(var(--border));
    border-radius: 10px;
    background: hsl(var(--muted) / 0.35);
    color: hsl(var(--foreground));
    cursor: pointer;
    text-align: left;
}
.npp-ftd-choice small { color: hsl(var(--muted-foreground)); }
.npp-ftd-choice.is-selected {
    border-color: hsl(var(--brand));
    background: hsl(var(--brand) / 0.14);
}
.npp-ftd-choice:disabled { cursor: default; opacity: 0.85; }
.npp-ftd-choice--residual { font-style: italic; }

.td-status { display: grid; gap: 0.35rem; }
.td-status-line { display: flex; align-items: center; gap: 0.5rem; }

/* Preseason matchup previews (mutable; never the frozen weekly release) */
.npp-preview-card {
    padding: 0.65rem 1rem;
    border-top: 1px solid hsl(var(--border));
    font-size: 0.72rem;
}
.npp-preview-card__score strong {
    display: block;
    font-family: var(--mono, ui-monospace, monospace);
    font-variant-numeric: tabular-nums;
    color: hsl(var(--brand-strong, var(--brand)));
}
.npp-preview-card__score span,
.npp-preview-card__state span,
.npp-preview-card__leader small {
    color: hsl(var(--muted-foreground));
}
.npp-preview-card__leaders {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 1rem;
    margin-top: 0.45rem;
}
.npp-preview-card__leader span {
    display: block;
    color: hsl(var(--muted-foreground));
    font-size: 0.6rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}
.npp-preview-card__leader strong { font-size: 0.74rem; }
.npp-preview-card__leader small { display: block; font-size: 0.62rem; }
.npp-preview-card__state { margin-top: 0.45rem; }
.npp-preview-card__state span {
    font-size: 0.62rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.npp-game-preview { display: grid; gap: 0.9rem; }
.npp-preview-meta__label { margin: 0; font-size: 0.82rem; }
.npp-preview-meta__label strong { text-transform: uppercase; letter-spacing: 0.06em; }
.npp-preview-meta__copy {
    margin: 0.2rem 0 0;
    color: hsl(var(--muted-foreground));
    font-size: 0.8rem;
}
.npp-preview-team { display: grid; gap: 0.8rem; }
.npp-preview-team__name {
    margin: 0.35rem 0 0;
    font-family: var(--cond, inherit);
    font-size: 1rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.npp-preview-reserves-group h4 {
    margin: 0.6rem 0 0.35rem;
    font-family: var(--cond, inherit);
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: hsl(var(--muted-foreground));
}
.npp-role {
    display: inline-block;
    margin-left: 0.3rem;
    padding: 0 0.3rem;
    border: 1px solid hsl(var(--border));
    border-radius: 4px;
    color: hsl(var(--muted-foreground));
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.04em;
}
.npp-role.is-weak {
    border-color: hsl(var(--brand));
    color: hsl(var(--brand-strong, var(--brand)));
}
.npp-preview-row--excluded th,
.npp-preview-row--excluded td { opacity: 0.62; }
.npp-reserves-toggle {
    justify-self: start;
    padding: 0.4rem 0.75rem;
    border: 1px solid hsl(var(--border));
    border-radius: 8px;
    background: hsl(var(--card));
    color: hsl(var(--muted-foreground));
    font-size: 0.76rem;
    font-weight: 700;
    cursor: pointer;
}
.npp-reserves-toggle:hover { border-color: hsl(var(--brand)); color: hsl(var(--foreground)); }
.npp-reserves { display: grid; gap: 0.8rem; }
.npp-reserves[hidden] { display: none; }
.npp-format-toggle { margin: 0; }

@media (max-width: 760px) {
    .npp-scoreboard { grid-template-columns: 1fr; text-align: center; }
    .npp-scoreboard__team--home { text-align: center; }
    .npp-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .npp-table thead { display: none; }
    .npp-table tbody tr {
        display: block;
        margin-bottom: 0.55rem;
        border: 1px solid hsl(var(--border));
        border-radius: 10px;
        background: hsl(var(--card));
    }
    .npp-table td,
    .npp-table tbody th {
        display: flex;
        justify-content: space-between;
        gap: 0.75rem;
        border-bottom: 0;
    }
    .npp-table td::before {
        content: attr(data-label);
        color: hsl(var(--muted-foreground));
        font-family: var(--sans, inherit);
        font-size: 0.62rem;
        letter-spacing: 0.05em;
        text-transform: uppercase;
    }
    /* Preview tables are too wide for stacked cards: scroll the data container.
     * The min-width chain keeps the 620px table from stretching ancestor grids
     * past the viewport (grid items default to min-width:auto). */
    .npp-game-preview > *,
    .npp-preview-team,
    .npp-players__group,
    .npp-preview-reserves-group { min-width: 0; }
    .npp-preview-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .npp-preview-table-wrap .npp-table { min-width: 620px; }
    .npp-preview-table-wrap .npp-table thead { display: table-header-group; }
    .npp-preview-table-wrap .npp-table tbody tr {
        display: table-row;
        margin: 0;
        border: 0;
        background: transparent;
    }
    .npp-preview-table-wrap .npp-table td,
    .npp-preview-table-wrap .npp-table tbody th {
        display: table-cell;
        border-bottom: 1px solid hsl(var(--border));
    }
    .npp-preview-table-wrap .npp-table td::before { content: none; }
}

.npp-td-photo {
    width: 32px;
    height: 32px;
    object-fit: cover;
    background: hsl(var(--muted));
    float: left;
    margin-right: 0.5rem;
}
.npp-td-board__more {
    margin: 0.7rem 0 0;
    color: hsl(var(--muted-foreground));
    font-size: 0.82rem;
}
.npp-td-board__more a { color: hsl(var(--foreground)); font-weight: 700; }