:root {
    --bg: #f4f6fb;
    --panel: #ffffff;
    --text: #111827;
    --muted: #667085;
    --line: #d9e1ef;
    --primary: #2563eb;
    --primary-dark: #1d4ed8;
    --good: #15803d;
    --bad: #b91c1c;
    --warning-bg: #fff7ed;
    --warning-border: #fed7aa;
    --shadow: 0 12px 35px rgba(17, 24, 39, .08);
}

* { box-sizing: border-box; }
body {
    margin: 0;
    font-family: Arial, "Noto Sans Hebrew", sans-serif;
    background: var(--bg);
    color: var(--text);
    direction: rtl;
}

a { color: var(--primary); text-decoration: none; }
a:hover { text-decoration: underline; }

.topbar {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    align-items: center;
    padding: 22px 34px;
    background: linear-gradient(135deg, #0f172a, #1e3a8a);
    color: #fff;
}
.topbar h1 { margin: 0 0 6px; font-size: 26px; }
.topbar p { margin: 0; opacity: .85; }

.user-switch {
    display: flex;
    gap: 8px;
    align-items: end;
    background: rgba(255,255,255,.12);
    padding: 10px;
    border-radius: 14px;
}
.user-switch label { font-size: 12px; display: block; opacity: .85; }
.user-switch input {
    height: 40px;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 10px;
    padding: 0 12px;
    min-width: 160px;
}
.user-switch button,
.btn {
    border: 0;
    background: var(--primary);
    color: #fff;
    padding: 10px 16px;
    min-height: 40px;
    border-radius: 10px;
    cursor: pointer;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
}
.user-switch button:hover,
.btn:hover { background: var(--primary-dark); text-decoration: none; }
.btn.secondary { background: #e8eefc; color: #1e3a8a; }
.btn.secondary:hover { background: #dbe6ff; }
.btn.primary { background: var(--primary); }

.nav {
    display: flex;
    gap: 10px;
    padding: 12px 34px;
    background: #fff;
    border-bottom: 1px solid var(--line);
    position: sticky;
    top: 0;
    z-index: 10;
}
.nav a {
    color: #111827;
    font-weight: 700;
    padding: 8px 12px;
    border-radius: 10px;
}
.nav a:hover { background: #f1f5f9; text-decoration: none; }

.container {
    max-width: 1450px;
    margin: 0 auto;
    padding: 24px;
}

.grid { display: grid; gap: 16px; }
.stats-grid { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.split { display: grid; grid-template-columns: 1.1fr .9fr; gap: 16px; margin-top: 16px; }

.card {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 18px;
    box-shadow: var(--shadow);
    margin-bottom: 16px;
}
.card h2 { margin: 0 0 14px; font-size: 20px; }
.card-title-row {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin-bottom: 12px;
}
.metric span { display: block; color: var(--muted); font-size: 13px; margin-bottom: 8px; }
.metric strong { display: block; font-size: 24px; }
.muted { color: var(--muted); line-height: 1.7; }
.mini-box {
    background: #f8fafc;
    border: 1px solid var(--line);
    padding: 12px;
    border-radius: 12px;
    margin-top: 12px;
}
.mini-box.warning,
.alert.warning { background: var(--warning-bg); border-color: var(--warning-border); }

.alert {
    padding: 14px 16px;
    border-radius: 14px;
    border: 1px solid #bbf7d0;
    background: #f0fdf4;
    color: #14532d;
    margin-bottom: 16px;
    font-weight: 700;
}
.alert.error {
    background: #fef2f2;
    border-color: #fecaca;
    color: #7f1d1d;
}

.table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 14px; }
table { width: 100%; border-collapse: collapse; background: #fff; min-width: 920px; }
th, td {
    text-align: right;
    padding: 11px 12px;
    border-bottom: 1px solid #edf2f7;
    vertical-align: middle;
    white-space: nowrap;
}
th { background: #f8fafc; color: #334155; font-size: 13px; position: sticky; top: 0; }
tr:hover td { background: #fbfdff; }
.nowrap { white-space: nowrap; }
.delta { font-weight: 800; }
.delta.good { color: var(--good); }

.badge {
    display: inline-flex;
    border-radius: 999px;
    padding: 5px 9px;
    font-size: 12px;
    font-weight: 800;
    background: #f1f5f9;
}
.badge.active { background: #dcfce7; color: #166534; }
.badge.sold { background: #fee2e2; color: #991b1b; }
.badge.watch { background: #fef3c7; color: #92400e; }

.tabs { display: flex; gap: 8px; flex-wrap: wrap; }
.tabs a {
    padding: 8px 12px;
    border-radius: 999px;
    background: #f1f5f9;
    color: #111827;
    font-weight: 700;
}
.tabs a.active { background: #dbeafe; color: #1d4ed8; }

.form-row { margin-bottom: 14px; }
.form-row label,
.compact-form label { display: block; font-weight: 800; margin-bottom: 6px; }
input, select, textarea {
    width: 100%;
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    padding: 11px 12px;
    font: inherit;
    background: #fff;
}
textarea {
    resize: vertical;
    min-height: 340px;
    direction: rtl;
    line-height: 1.55;
}
small { color: var(--muted); display: block; margin-top: 5px; }
.actions { display: flex; gap: 10px; flex-wrap: wrap; }
.inline-form { display: flex; gap: 8px; align-items: center; }
.inline-form select { width: auto; min-width: 120px; }
.compact-form { display: grid; grid-template-columns: 1fr; gap: 8px; }
.player-head { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.player-head h2 { margin-bottom: 6px; }
.player-head small { color: var(--muted); display: inline; }
.small-link { font-weight: 800; }
.footer { text-align: center; color: var(--muted); padding: 30px; }

@media (max-width: 1000px) {
    .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .split { grid-template-columns: 1fr; }
    .topbar { align-items: stretch; flex-direction: column; padding: 18px; }
    .user-switch { align-items: stretch; flex-direction: column; }
    .container { padding: 14px; }
    .nav { padding: 10px 14px; overflow-x: auto; }
    .card-title-row, .player-head { flex-direction: column; align-items: stretch; }
    .inline-form { flex-direction: column; align-items: stretch; }
    .inline-form select { width: 100%; }
}

@media (max-width: 560px) {
    .stats-grid { grid-template-columns: 1fr; }
    .metric strong { font-size: 22px; }
}

.filters-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
    align-items: end;
}
.filters-grid .actions { align-items: end; }
.delta.bad { color: var(--bad); }
.delta.warn { color: #b45309; }
.badge.good { background: #dcfce7; color: #166534; }
.badge.bad { background: #fee2e2; color: #991b1b; }
.badge.warn { background: #fef3c7; color: #92400e; }
.smart-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.kpi-note { font-size: 12px; color: var(--muted); margin-top: 6px; line-height: 1.5; }
.row-actions { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.score-pill { font-weight:800; padding:4px 8px; border-radius:999px; background:#eef2ff; color:#3730a3; }
@media (max-width: 1000px) {
    .filters-grid, .smart-cards { grid-template-columns: 1fr; }
}

/* Lineup / training engine */
.lineup-split { grid-template-columns: 1fr 1fr; }
.lineup-table-wrap table { min-width: 980px; }
.lineup-table th:nth-child(3),
.lineup-table td:nth-child(3) { min-width: 180px; }
.lineup-trainee td { background: #f0fdf4; }
.lineup-trainee:hover td { background: #e8faee; }
.lineup-partial td { background: #fff7ed; }
.lineup-partial:hover td { background: #ffedd5; }
.badge.neutral { background: #f1f5f9; color: #334155; }
.badge.ok { background: #e0f2fe; color: #075985; }
.lineup-filters { grid-template-columns: 1.2fr 1fr 1fr .7fr .8fr; }
@media (max-width: 1200px) {
    .lineup-split { grid-template-columns: 1fr; }
    .lineup-filters { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 700px) {
    .lineup-filters { grid-template-columns: 1fr; }
}

/* Training analytics upgrade */
.big-number {
    font-size: 36px;
    line-height: 1;
    font-weight: 900;
    margin: 6px 0 10px;
}
.big-number.good { color: var(--good); }
.big-number.warn { color: #b45309; }
.big-number.bad { color: var(--bad); }
.big-number.ok { color: #1d4ed8; }
.forecast-line {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 9px 0;
    border-bottom: 1px solid #edf2f7;
}
.forecast-line:last-child { border-bottom: 0; }
.forecast-line span { color: var(--muted); }
.forecast-line strong { color: var(--good); }
.compact-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.compact-table table { min-width: 560px; }
.explanation-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.history-table .skill-cell {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-width: 42px;
}
.skill-up {
    background: #dcfce7;
    color: #166534;
    border-radius: 999px;
    padding: 3px 8px;
}
.inline-delta {
    display: inline-flex;
    font-size: 11px;
    margin: 0;
    direction: ltr;
}
.training-table td small {
    max-width: 260px;
    white-space: normal;
}
.badge.ok { background: #dbeafe; color: #1e40af; }
@media (max-width: 1000px) {
    .compact-metrics, .explanation-grid { grid-template-columns: 1fr; }
}

/* Training cycle counter / sortable history */
.history-filters {
    grid-template-columns: 1.4fr 1.2fr .8fr .7fr;
    margin: 8px 0 14px;
}
.training-sort-form select { min-width: 150px; }
.training-cycle {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    min-width: 92px;
    border-radius: 12px;
    padding: 5px 8px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    line-height: 1.2;
}
.training-cycle strong {
    font-size: 15px;
    color: #0f172a;
}
.training-cycle small {
    margin: 0;
    font-size: 11px;
    color: var(--muted);
    white-space: nowrap;
}
.training-cycle.level-up {
    background: #dcfce7;
    border-color: #86efac;
}
.training-cycle.level-up strong,
.training-cycle.level-up small {
    color: #166534;
}
.training-cycle.start {
    background: #eef2ff;
    border-color: #c7d2fe;
}
.training-cycle.start strong,
.training-cycle.start small {
    color: #3730a3;
}
@media (max-width: 1000px) {
    .history-filters { grid-template-columns: 1fr; }
}

/* Finance/value upgrade */
.btn.danger {
    background: #fee2e2;
    color: #991b1b;
}
.btn.danger:hover {
    background: #fecaca;
}
.finance-duo {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin: 14px 0;
}
.finance-mini-form {
    border: 1px solid var(--line);
    background: #f8fafc;
    padding: 14px;
    border-radius: 16px;
}
.finance-mini-form h3 {
    margin: 0 0 8px;
    font-size: 16px;
}
.transaction-edit-list {
    display: grid;
    gap: 12px;
}
.transaction-edit-row {
    display: grid;
    grid-template-columns: .7fr 1fr 1fr 1.4fr auto;
    gap: 10px;
    align-items: end;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #f8fafc;
}
.transaction-edit-row label {
    font-size: 12px;
    color: var(--muted);
    display: block;
    margin-bottom: 5px;
    font-weight: 800;
}
.tx-type {
    align-self: center;
}
.tx-actions {
    display: flex;
    gap: 8px;
    align-items: center;
}
.market-form {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}
.market-form .wide-field {
    grid-column: span 4;
}
@media (max-width: 1100px) {
    .finance-duo,
    .transaction-edit-row,
    .market-form {
        grid-template-columns: 1fr;
    }
    .market-form .wide-field { grid-column: auto; }
    .tx-actions { justify-content: stretch; }
}

/* Finance v7: buy -> average -> sell flow */
.finance-trio {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.locked-form {
    opacity: .65;
    background: #f1f5f9;
}
.locked-form input:disabled,
.locked-form button:disabled {
    cursor: not-allowed;
}
.transaction-edit-row .tx-type strong {
    color: #0f172a;
}
@media (max-width: 1200px) {
    .finance-trio { grid-template-columns: 1fr; }
}

/* Auth / team switcher */
.topbar-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: flex-start;
}
.user-switch select {
    height: 40px;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 10px;
    padding: 0 12px;
    min-width: 240px;
}
.auth-strip {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
    color: rgba(255,255,255,.85);
    font-size: 13px;
}
.auth-strip a {
    color: #fff;
    font-weight: 800;
    background: rgba(255,255,255,.12);
    padding: 6px 10px;
    border-radius: 999px;
}
.auth-strip a:hover { background: rgba(255,255,255,.2); text-decoration: none; }
.auth-page {
    min-height: 58vh;
    display: grid;
    place-items: start center;
}
.auth-card {
    width: min(520px, 100%);
}
.auth-card.wide {
    width: min(820px, 100%);
}
.auth-links {
    display: flex;
    gap: 8px;
    justify-content: center;
    margin-top: 16px;
    font-weight: 800;
}
.auth-grid-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}
.auth-grid-form label {
    display: block;
    font-weight: 800;
    margin-bottom: 6px;
}
.auth-grid-actions {
    grid-column: 1 / -1;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.alert.ok { background:#f0fdf4; border-color:#bbf7d0; color:#14532d; }
@media (max-width: 1000px) {
    .topbar-actions { align-items: stretch; }
    .auth-grid-form { grid-template-columns: 1fr; }
    .auth-grid-actions { flex-direction: column; }
}

.public-mode-badge,
.view-only-badge {
    display:inline-flex;
    align-items:center;
    gap:4px;
    padding:6px 10px;
    border-radius:999px;
    font-size:12px;
    font-weight:800;
    white-space:nowrap;
}
.public-mode-badge { background:#dcfce7; color:#166534; }
.view-only-badge { background:#fff7ed; color:#9a3412; }
.readonly-finance .mini-box small { display:block; margin-top:6px; color:#667085; }

/* Mobile polish v9.1: prevent page-wide horizontal overflow while preserving table scrolling */
html,
body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

body,
.topbar,
.nav,
.container,
.card,
.grid,
.split,
.table-wrap,
.auth-page,
.auth-card,
.finance-duo,
.finance-trio,
.smart-cards,
.filters-grid,
.history-filters,
.market-form,
.transaction-edit-row {
    min-width: 0;
}

.container {
    width: 100%;
}

.card {
    max-width: 100%;
    overflow: hidden;
}

.table-wrap {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
}

.table-wrap table {
    max-width: none;
}

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

@media (max-width: 760px) {
    .topbar {
        padding: 16px 12px;
        gap: 14px;
    }

    .topbar h1 {
        font-size: 23px;
        line-height: 1.25;
    }

    .topbar p {
        font-size: 13px;
        line-height: 1.55;
    }

    .topbar-actions,
    .user-switch {
        width: 100%;
    }

    .user-switch input,
    .user-switch select,
    .user-switch button {
        width: 100%;
        min-width: 0;
    }

    .auth-strip {
        justify-content: flex-start;
    }

    .nav {
        padding: 8px 10px;
        gap: 6px;
        overflow-x: auto;
        overflow-y: hidden;
        flex-wrap: nowrap;
        scrollbar-width: thin;
    }

    .nav a {
        flex: 0 0 auto;
        padding: 8px 10px;
        font-size: 14px;
    }

    .container {
        padding: 10px;
    }

    .card {
        padding: 14px;
        border-radius: 16px;
        margin-bottom: 12px;
        box-shadow: 0 8px 24px rgba(17, 24, 39, .06);
    }

    .card h2 {
        font-size: 18px;
    }

    .stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .metric span {
        font-size: 12px;
    }

    .metric strong {
        font-size: 21px;
        line-height: 1.25;
        word-break: break-word;
    }

    .big-number {
        font-size: 28px;
    }

    .split,
    .finance-duo,
    .finance-trio,
    .smart-cards,
    .compact-metrics,
    .explanation-grid,
    .lineup-split {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .filters-grid,
    .history-filters,
    .lineup-filters,
    .market-form,
    .transaction-edit-row,
    .auth-grid-form {
        grid-template-columns: 1fr;
    }

    .market-form .wide-field {
        grid-column: auto;
    }

    .table-wrap {
        max-width: calc(100vw - 20px);
        border-radius: 12px;
    }

    table {
        min-width: 760px;
    }

    .compact-table table {
        min-width: 560px;
    }

    .lineup-table-wrap table,
    .history-table table,
    .training-table table {
        min-width: 860px;
    }

    th,
    td {
        padding: 10px 9px;
        font-size: 13px;
    }

    input,
    select,
    textarea,
    .btn,
    .user-switch button {
        min-height: 42px;
    }

    .actions,
    .row-actions,
    .tx-actions,
    .auth-grid-actions,
    .auth-links {
        align-items: stretch;
        flex-direction: column;
    }

    .actions .btn,
    .row-actions .btn,
    .tx-actions .btn,
    .auth-grid-actions .btn,
    .auth-links .btn {
        width: 100%;
    }

    .forecast-line {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }
}

@media (max-width: 420px) {
    .container {
        padding: 8px;
    }

    .card {
        padding: 12px;
    }

    .stats-grid {
        grid-template-columns: 1fr;
    }

    .metric strong {
        font-size: 20px;
    }

    .table-wrap {
        max-width: calc(100vw - 16px);
    }

    table {
        min-width: 700px;
    }
}
