/* index.html */
body.home-page {
            font-family: Arial, sans-serif;
            text-align: center;
            margin-top: 100px;
            background: #f6fbff;
        }
.home-page .container {
            background-color: rgb(138, 67, 67);
            padding: 50px;
            border-radius: 10px;
            box-shadow: 0 4px 6px rgba(233, 230, 230, 0.1);
            display: inline-block;
            max-width:720px;
            width:90%;
            box-sizing:border-box;
        }
.home-page h1 {
            color: #ffffff;
        }
.home-page p {
            color: #666;
            font-size: 18px;
        }
.home-page .link-card {display:block;margin:18px auto 0;padding:14px 18px;background:#fff;border-radius:10px;box-shadow:0 6px 20px rgba(12,19,35,0.06);max-width:680px;text-decoration:none;color:inherit}
.home-page .link-card .title {font-weight:700;color:#0f172a;margin:0 0 6px}
.home-page .link-card .desc {color:#6b7280;margin:0;font-size:14px}
.home-page .actions {margin-top:12px}
.home-page .actions .btn {background:#2b6cb0;color:#fff;padding:8px 12px;border-radius:8px;border:none;cursor:pointer;text-decoration:none}

/* spelers_view.html */
.players-page {--bg:#f6fbff;--card:#fff;--accent:#2b6cb0;--muted:#6b7280}
body.players-page {font-family:Inter,Segoe UI,system-ui,Arial,sans-serif;background:var(--bg);margin:24px;color:#0f172a}
.players-page .wrap {max-width:1400px;margin:0 auto}
.players-page .card {background:var(--card);padding:20px;border-radius:12px;box-shadow:0 6px 20px rgba(12,19,35,0.06)}
.players-page h1 {margin:0 0 8px;font-size:20px}
.players-page p.lead {margin:0 0 16px;color:var(--muted)}
.players-page .controls {display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px;align-items:center}
.players-page .controls input[type=search] {flex:1;min-width:180px;padding:8px 12px;border-radius:8px;border:1px solid #e6eef8}
.players-page .controls button {background:var(--accent);color:#fff;border:none;padding:8px 12px;border-radius:8px;cursor:pointer}
.players-page .controls select {padding:8px 12px;border-radius:8px;border:1px solid #e6eef8}
.players-page .pagination {display:flex;flex-direction:column;gap:12px;margin-top:12px;align-items:center;justify-content:center}
.players-page .pagination .record-info {display:flex;justify-content:center;width:100%;font-size:13px;color:var(--muted);gap:24px}
.players-page .pagination .page-size-row {display:flex;justify-content:center;width:100%;gap:8px;align-items:center}
.players-page .pagination .button-row {display:flex;justify-content:center;width:100%;gap:16px;align-items:center}
.players-page .pagination button {background:var(--accent);color:#fff;border:none;padding:6px 10px;border-radius:6px;cursor:pointer;font-size:13px}
.players-page .pagination button:disabled {background:#ccc;cursor:not-allowed}
.players-page .pagination .info {font-size:13px;color:var(--muted);text-align:center}
.players-page .players-grid {display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin:20px 0}
.players-page .player-card {background:#fff;border:1px solid #e6eef8;border-radius:12px;padding:16px;text-align:center;cursor:pointer;transition:all 0.2s ease;box-shadow:0 2px 4px rgba(0,0,0,0.05)}
.players-page .player-card:hover {transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,0.1);border-color:var(--accent)}
.players-page .player-card .photo {width:60px;height:60px;border-radius:50%;object-fit:cover;margin:0 auto 8px;display:block;border:2px solid #e6eef8}
.players-page .player-card .photo.placeholder {background:#f0f0f0;display:flex;align-items:center;justify-content:center;color:#999;font-size:24px;font-weight:bold}
.players-page .player-card .name {font-weight:600;color:#333;font-size:14px}
.players-page .tooltip {position:absolute;background:#333;color:#fff;padding:8px 12px;border-radius:6px;font-size:12px;z-index:1000;pointer-events:none;opacity:0;transition:opacity 0.2s;max-width:200px;border:1px solid #555;box-shadow:0 4px 12px rgba(0,0,0,0.25)}
.players-page .tooltip.show {opacity:1}
.players-page .detail-modal {position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);display:none;align-items:center;justify-content:center;z-index:2000}
.players-page .detail-content {background:#fff;padding:24px;border-radius:12px;max-width:400px;width:90%;position:relative;text-align:center}
.players-page .detail-content .large-photo {width:120px;height:120px;border-radius:50%;object-fit:cover;margin:0 auto 16px;display:block;border:3px solid #e6eef8}
.players-page .detail-content .large-photo.placeholder {background:#f0f0f0;display:flex;align-items:center;justify-content:center;color:#999;font-size:48px;font-weight:bold}
.players-page .detail-content h3 {margin:0 0 16px 0;color:#333}
.players-page .detail-content .field {margin-bottom:12px;text-align:left}
.players-page .detail-content .field strong {color:var(--muted);display:inline-block;width:120px}
.players-page .detail-content .back-btn {background:var(--accent);color:hsl(0, 0%, 100%);border:none;padding:8px 16px;border-radius:6px;cursor:pointer;margin-top:16px}
.players-page table {display:none}
@media (max-width:1200px) {.players-page .players-grid {grid-template-columns:repeat(4,1fr)}}
@media (max-width:900px) {.players-page .players-grid {grid-template-columns:repeat(3,1fr)}}
@media (max-width:600px) {.players-page .players-grid {grid-template-columns:repeat(2,1fr)}}
@media (max-width:400px) {.players-page .players-grid {grid-template-columns:1fr}}
.players-page .muted {color:var(--muted);font-size:13px}
.players-page .small {font-size:13px;color:#333}
@media (max-width:720px) {.players-page thead {display:none}
.players-page tbody td {display:block;padding:10px 12px}
.players-page tbody tr {margin-bottom:12px;display:block;background:#fff;border-radius:8px;box-shadow:0 2px 8px rgba(2,6,23,0.02)}
.players-page tbody td:before {content:attr(data-label);display:block;font-weight:600;color:var(--muted);margin-bottom:6px}}