/* Players and servers pages since the makeover (owner 2026-10-25): user profiles (user.html), the players list
   (users.html), the servers page (servers.html), the server worlds and their plots (server-worlds.html,
   server-plots.html). Only what these pages need beyond site.css; loaded by their templates through block head. */

/* ---- Profile head: the big head beside the name ---- */
.people-head { flex: none; width: 96px; height: 96px; border: 1px solid var(--ui-line); border-radius: 8px; image-rendering: pixelated; object-fit: cover; }
.people-profile .ui-head { align-items: center; }

/* ---- Players list ---- */
.people-find { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px 16px; padding: 14px 22px; border-top: 1px solid var(--ui-soft-line); }
.people-find .ui-field { flex: 1 1 260px; max-width: 420px; }
/* The table's first and last columns line up with the card's head text (22 px in) */
.people-page .ui-table th:first-child, .people-page .ui-table td:first-child { padding-left: 22px; }
.people-page .ui-table th:last-child, .people-page .ui-table td:last-child { padding-right: 22px; }
.people-player { display: inline-flex; align-items: center; gap: 10px; font-weight: bold; }
.people-player img { width: 28px; height: 28px; border-radius: 4px; image-rendering: pixelated; flex: none; }

/* ---- Servers: forum thread rows (.ui-list > .ui-item) and the original server's link cards (.ui-linkcards) ---- */
.people-link { flex-wrap: nowrap; color: #333 !important; text-decoration: none !important; }
.people-link:hover { background: var(--ui-tint); }
.people-link img { width: 32px; height: 32px; border-radius: 4px; image-rendering: pixelated; flex: none; }
.people-link-title { font-weight: bold; color: var(--ui-link); overflow-wrap: anywhere; }
.people-link-desc { font-size: 13px; color: var(--ui-muted); overflow-wrap: anywhere; }
.people-link-by { font-size: 12px; color: var(--ui-muted); }
.people-tiles { padding: 0 22px 18px; }

/* ---- Server worlds: the featured world, download rows, how-to ---- */
.people-feature { display: flex; flex-wrap: wrap; overflow: hidden; }
.people-feature-pic { flex: 1 1 360px; min-width: 0; background: #1c1c1c; display: flex; align-items: center; justify-content: center; }
.people-feature-pic img { display: block; max-width: 100%; height: auto; image-rendering: pixelated; }
.people-feature-text { flex: 999 1 380px; min-width: 0; padding: 20px 22px; display: flex; flex-direction: column; gap: 12px; }
.people-feature-text .ui-dl { grid-template-columns: repeat(3, auto); grid-auto-flow: column; grid-template-rows: auto auto; justify-content: start; gap: 0 28px; }
.people-feature-text .ui-dl dd { text-align: left; font-weight: bold; }
.people-dlrow-pic { flex: none; width: 120px; height: 90px; object-fit: cover; border-radius: 6px; background: #1c1c1c; image-rendering: pixelated; }
.people-dlrow-text b { font-size: 15px; color: var(--ui-text); }
.people-dlrow-text small, .people-dlrow-facts { font-size: 13px; color: var(--ui-muted); }
.people-dlrow-facts { flex: 1 1 160px; display: flex; flex-direction: column; gap: 2px; }
.people-dlrow-get { flex: 0 0 auto; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.people-group-title { padding: 14px 22px 4px; border-top: 1px solid var(--ui-soft-line); font-size: 15px; }
.people-group-note { padding: 0 22px 10px; font-size: 13px; color: var(--ui-muted); }
.people-prose { display: flex; flex-direction: column; gap: 10px; }  /* text: .ui-prose */
.people-prose ol, .people-prose ul { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 6px; }

@media (max-width: 600px) {
  .people-hide-s { display: none; }
  .people-head { width: 64px; height: 64px; }
  .people-find { padding-left: 16px; padding-right: 16px; }
  .people-tiles { padding: 0 16px 14px; }
  .people-page .ui-table th:first-child, .people-page .ui-table td:first-child { padding-left: 16px; }
  .people-page .ui-table th:last-child, .people-page .ui-table td:last-child { padding-right: 16px; }
  .people-dlrow-pic { width: 100%; height: auto; aspect-ratio: 4 / 3; }
  .people-dlrow-get { align-items: stretch; width: 100%; }
  .people-feature-text .ui-dl { grid-auto-flow: row; grid-template-columns: auto 1fr; grid-template-rows: none; gap: 6px 14px; }
}

/* ---- Plot search form (partials/plot-search.html; on the server worlds page and Creative Archive 1.8's world page) ---- */
.people-own[hidden] { display: none; }
