/* ============================================================
   ExitGaming — /pts/ scoped styles
   Reusa tokens (:root) e classes utilitárias do style.css principal.
   Aqui só vivem classes novas específicas do módulo.
   ============================================================ */

.pts-body {
  background: var(--c-black);
  color: var(--c-ice);
  min-height: 100vh;
  font-family: var(--f-body);
}

.pts-main {
  padding-top: calc(var(--nav-h) + 32px);
  padding-bottom: 80px;
}

/* ----- Page header tweaks ----- */

.parties-section .section-title {
  margin-top: 8px;
  margin-bottom: 16px;
}

.parties-section .section-lede {
  max-width: 720px;
  margin-bottom: 48px;
}

/* ----- Grid + party card ----- */

.parties-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 28px;
}

.parties-empty {
  grid-column: 1 / -1;
  padding: 48px 24px;
  border: 1px dashed var(--c-gray-dark);
  text-align: center;
  color: var(--c-gray);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.party-card {
  background: var(--c-coal);
  border: 1px solid var(--c-gray-dark);
  border-radius: 2px;
  padding: 24px 24px 16px;
  position: relative;
  overflow: hidden;
}

.party-card::before {
  /* Faixa lateral vermelha sutil */
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 2px;
  background: linear-gradient(180deg, var(--c-blood), transparent 70%);
  opacity: 0.6;
}

.party-card__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--c-gray-dark);
}

.party-card__title {
  font-family: var(--f-display);
  font-size: 20px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--c-ice);
  margin: 0;
}

.party-card__meta {
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--c-gray);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin: 0;
}

/* ----- Slot rows ----- */

.slot-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.slot-row {
  display: grid;
  grid-template-columns: 28px auto 1fr;
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  border-radius: 2px;
  cursor: pointer;
  transition: background var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
  border-left: 2px solid transparent;
}

.slot-row:hover,
.slot-row:focus-within {
  background: var(--c-coal-light);
  border-left-color: var(--c-blood);
}

.slot-row__order {
  font-family: var(--f-mono);
  font-size: 12px;
  color: var(--c-gray);
  text-align: right;
}

.slot-row__role {
  font-family: var(--f-mono);
  font-size: 12px;
  font-weight: 700;
  color: var(--c-gray);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
}

.slot-row__nick {
  font-family: var(--f-display);
  font-size: 16px;
  font-weight: 600;
  color: var(--c-ice);
  letter-spacing: 0.04em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.slot-row--vacant .slot-row__nick {
  color: var(--c-gray);
  font-family: var(--f-body);
  font-style: italic;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0;
}

.slot-row--vacant {
  opacity: 0.78;
}

.slot-row--vacant:hover {
  opacity: 1;
}

/* ----- Page footer ----- */

.parties-footer {
  margin-top: 48px;
  text-align: center;
  font-family: var(--f-mono);
  font-size: 12px;
  color: var(--c-gray);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.parties-footer a {
  color: var(--c-blood);
  text-decoration: none;
  border-bottom: 1px dotted var(--c-deep);
}

.parties-footer a:hover {
  color: var(--c-ice);
  border-bottom-color: var(--c-blood);
}

/* ============================================================
   Modal claim/edit
   ============================================================ */

.party-modal {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.party-modal[hidden] {
  display: none !important;
}

.party-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.78);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.party-modal__card {
  position: relative;
  background: var(--c-coal-light);
  border: 1px solid var(--c-gray-dark);
  border-radius: 2px;
  width: min(440px, 100%);
  padding: 32px 28px 28px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(179, 0, 0, 0.15);
  animation: modalIn 220ms var(--ease);
}

@keyframes modalIn {
  from { opacity: 0; transform: translateY(8px) scale(0.98); }
  to   { opacity: 1; transform: translateY(0)   scale(1);    }
}

.party-modal__close {
  position: absolute;
  top: 8px; right: 8px;
  width: 36px; height: 36px;
  background: none;
  border: 0;
  color: var(--c-gray);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color var(--t-fast) var(--ease);
}

.party-modal__close:hover { color: var(--c-blood); }

.party-modal__close svg { width: 18px; height: 18px; }

.party-modal__title {
  font-family: var(--f-display);
  font-size: 18px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--c-ice);
  margin: 0 0 4px;
}

.party-modal__sub {
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--c-blood);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin: 0 0 24px;
}

.party-modal__form .form-row {
  margin-bottom: 16px;
}

.party-modal__form .form-row label {
  display: block;
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--c-gray);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 6px;
}

.party-modal__form .form-row input {
  width: 100%;
  background: var(--c-black);
  border: 1px solid var(--c-gray-dark);
  border-radius: 2px;
  padding: 10px 12px;
  color: var(--c-ice);
  font-family: var(--f-body);
  font-size: 16px;
  outline: none;
  transition: border-color var(--t-fast) var(--ease);
}

.party-modal__form .form-row input:focus {
  border-color: var(--c-blood);
}

.party-modal__error {
  font-family: var(--f-mono);
  font-size: 12px;
  color: #ff6464;
  letter-spacing: 0.04em;
  background: rgba(179, 0, 0, 0.12);
  border-left: 2px solid var(--c-blood);
  padding: 8px 12px;
  margin: 0 0 16px;
}

.party-modal__error[hidden] { display: none; }

/* Variante de SUCESSO (Fase 13): pedido de sorteio enviado, aguardando aprovação. */
.party-modal__error--ok {
  color: #7af09a;
  background: rgba(46, 160, 67, 0.12);
  border-left-color: #2ea043;
}

.party-modal__actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  flex-wrap: wrap;
}

/* ============================================================
   Setup page (1ª instalação — exibição de PINs)
   ============================================================ */

.pts-setup-body {
  background: var(--c-black);
  color: var(--c-ice);
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  font-family: var(--f-body);
}

.pts-setup {
  width: 100%;
  max-width: 560px;
}

.pts-setup__card {
  background: var(--c-coal);
  border: 1px solid var(--c-gray-dark);
  padding: 40px 36px;
  text-align: center;
}

.pts-setup__logo {
  width: 80px;
  height: auto;
  margin-bottom: 20px;
  filter: drop-shadow(0 0 30px rgba(179, 0, 0, 0.3));
}

.pts-setup__title {
  font-family: var(--f-display);
  font-size: 22px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--c-ice);
  margin: 0 0 12px;
}

.pts-setup__lede {
  font-family: var(--f-body);
  font-size: 17px;
  color: var(--c-gray);
  margin: 0 0 28px;
  line-height: 1.5;
}

.pts-setup__pins {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin: 24px 0 28px;
  text-align: left;
}

.pts-setup__pins dt {
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--c-blood);
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.pts-setup__pins dd {
  margin: 4px 0 8px;
  padding: 14px 18px;
  background: var(--c-black);
  border: 1px solid var(--c-gray-dark);
  border-radius: 2px;
}

.pts-setup__pins code {
  font-family: var(--f-mono);
  font-size: 22px;
  font-weight: 700;
  color: var(--c-ice);
  letter-spacing: 0.18em;
  user-select: all;
}

.pts-setup__hint {
  font-family: var(--f-body);
  font-size: 15px;
  color: var(--c-gray);
  text-align: left;
  margin: 0 0 24px;
  line-height: 1.5;
}

.pts-setup__hint a {
  color: var(--c-blood);
  text-decoration: none;
  border-bottom: 1px dotted var(--c-deep);
}

.pts-setup__hint a:hover { color: var(--c-ice); }

.pts-setup__form {
  margin: 0 0 20px;
}

.pts-setup__warn {
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--c-gray);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 0;
}

/* ============================================================
   Admin panel
   ============================================================ */

.admin-shell {
  padding-top: calc(var(--nav-h) + 32px);
  padding-bottom: 80px;
}

.admin-login {
  max-width: 380px;
  margin: 60px auto 0;
  background: var(--c-coal);
  border: 1px solid var(--c-gray-dark);
  padding: 32px 28px;
}

.admin-login h1 {
  font-family: var(--f-display);
  font-size: 18px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--c-ice);
  margin: 0 0 24px;
  text-align: center;
}

.admin-login .form-row label {
  display: block;
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--c-gray);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 6px;
}

.admin-login .form-row input {
  width: 100%;
  background: var(--c-black);
  border: 1px solid var(--c-gray-dark);
  padding: 10px 12px;
  color: var(--c-ice);
  font-family: var(--f-body);
  font-size: 16px;
  outline: none;
  margin-bottom: 16px;
}

.admin-login .form-row input:focus { border-color: var(--c-blood); }

.admin-login .btn { width: 100%; }

.admin-error {
  background: rgba(179, 0, 0, 0.12);
  border-left: 2px solid var(--c-blood);
  padding: 10px 14px;
  font-family: var(--f-mono);
  font-size: 12px;
  color: #ff6464;
  margin: 0 0 20px;
}

.admin-toolbar {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin: 16px 0 32px;
  padding: 12px 16px;
  background: var(--c-coal);
  border: 1px solid var(--c-gray-dark);
  align-items: center;
}

.admin-toolbar__spacer { flex: 1; }

.admin-banner {
  background: rgba(179, 0, 0, 0.12);
  border: 1px solid var(--c-deep);
  padding: 12px 16px;
  margin: 0 0 24px;
  font-family: var(--f-mono);
  font-size: 12px;
  color: var(--c-ice);
}

.admin-banner strong { color: var(--c-blood); }

.admin-party {
  background: var(--c-coal);
  border: 1px solid var(--c-gray-dark);
  margin-bottom: 24px;
  overflow: hidden;
}

.admin-party__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  border-bottom: 1px solid var(--c-gray-dark);
  gap: 16px;
  flex-wrap: wrap;
}

.admin-party__head input[type="text"],
.admin-party__head input[type="number"] {
  background: var(--c-black);
  border: 1px solid var(--c-gray-dark);
  color: var(--c-ice);
  padding: 6px 10px;
  font-family: var(--f-mono);
  font-size: 13px;
}

.admin-party__head input[type="number"] { width: 72px; }
.admin-party__head .name-input { width: 220px; max-width: 100%; }

.admin-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--f-mono);
  font-size: 13px;
}

.admin-table thead th {
  text-align: left;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--c-blood);
  padding: 10px 12px;
  border-bottom: 1px solid var(--c-gray-dark);
}

.admin-table tbody td {
  padding: 8px 12px;
  border-bottom: 1px solid rgba(58, 58, 58, 0.5);
  vertical-align: middle;
}

.admin-table tbody tr:last-child td { border-bottom: 0; }

.admin-table input[type="text"],
.admin-table input[type="number"] {
  background: var(--c-black);
  border: 1px solid var(--c-gray-dark);
  color: var(--c-ice);
  padding: 6px 10px;
  font-family: var(--f-mono);
  font-size: 13px;
  width: 100%;
}

.admin-table input[type="number"] { width: 56px; max-width: 56px; }
.admin-table .role-cell input { max-width: 180px; }

.admin-table .actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.admin-table button {
  background: var(--c-black);
  color: var(--c-ice);
  border: 1px solid var(--c-gray-dark);
  padding: 5px 10px;
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
  transition: border-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}

.admin-table button:hover { border-color: var(--c-blood); color: var(--c-blood); }
.admin-table button.danger:hover { border-color: var(--c-blood); color: #ff6464; }
.admin-table button.primary { background: var(--c-deep); border-color: var(--c-deep); color: var(--c-ice); }
.admin-table button.primary:hover { background: var(--c-blood); border-color: var(--c-blood); color: var(--c-ice); }

.admin-party__foot {
  padding: 14px 18px;
  border-top: 1px solid var(--c-gray-dark);
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: space-between;
}

.admin-party__foot .left { display: flex; gap: 10px; flex-wrap: wrap; }
.admin-party__foot .right { display: flex; gap: 10px; flex-wrap: wrap; }

.admin-party__foot button { font-family: var(--f-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; padding: 6px 12px; background: var(--c-black); color: var(--c-ice); border: 1px solid var(--c-gray-dark); cursor: pointer; }
.admin-party__foot button:hover { border-color: var(--c-blood); color: var(--c-blood); }
.admin-party__foot button.danger:hover { color: #ff6464; }

.admin-audit {
  background: var(--c-coal);
  border: 1px solid var(--c-gray-dark);
  padding: 18px 20px;
  margin-top: 32px;
  max-height: 360px;
  overflow-y: auto;
}

.admin-audit h2 {
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--c-blood);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  margin: 0 0 12px;
}

.admin-audit ol {
  list-style: none;
  margin: 0;
  padding: 0;
  font-family: var(--f-mono);
  font-size: 12px;
  color: var(--c-gray);
}

.admin-audit li {
  display: grid;
  grid-template-columns: 130px 110px 1fr;
  gap: 12px;
  padding: 6px 0;
  border-bottom: 1px solid rgba(58, 58, 58, 0.4);
}

.admin-audit li:last-child { border-bottom: 0; }
.admin-audit .a-ts { color: var(--c-gray); }
.admin-audit .a-act { color: var(--c-ice); }

/* ============================================================
   FASE 2 — Líder de party (coroa)
   ============================================================ */

.slot-row--leader {
  background: linear-gradient(90deg, rgba(179, 0, 0, 0.12), transparent 50%);
  border-left-color: var(--c-blood);
}

.slot-row__crown {
  font-size: 14px;
  margin-right: 2px;
  filter: drop-shadow(0 0 4px rgba(255, 215, 0, 0.5));
}

/* ============================================================
   FASE 2 — Ranking público (grid + cards por epic)
   ============================================================ */

.ranking-section {
  padding: 64px 0 80px;
  border-top: 1px solid var(--c-gray-dark);
  margin-top: 64px;
}

.ranking-section .section-lede {
  max-width: 740px;
}

.ranking-section .section-lede a {
  color: var(--c-blood);
  text-decoration: none;
  border-bottom: 1px dotted var(--c-deep);
  margin-left: 8px;
}

.ranking-section .section-lede a:hover { color: var(--c-ice); }

.ranking-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
  margin-top: 32px;
}

.ranking-card {
  background: var(--c-coal);
  border: 1px solid var(--c-gray-dark);
  border-radius: 2px;
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
}

.ranking-card__head {
  margin-bottom: 12px;
  display: flex;
  align-items: center;
}

.ranking-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.ranking-row {
  display: grid;
  grid-template-columns: 22px 1fr auto;
  gap: 10px;
  align-items: baseline;
  padding: 6px 0;
  border-bottom: 1px solid rgba(58, 58, 58, 0.4);
}

.ranking-row:last-child { border-bottom: 0; }

.ranking-row__pos {
  font-family: var(--f-mono);
  font-size: 12px;
  color: var(--c-gray);
  text-align: right;
}

.ranking-row__nick {
  font-family: var(--f-display);
  font-size: 14px;
  color: var(--c-ice);
  letter-spacing: 0.04em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ranking-row__points {
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--c-blood);
  letter-spacing: 0.08em;
}

.ranking-row--empty {
  font-family: var(--f-body);
  font-style: italic;
  color: var(--c-gray);
  text-align: center;
  display: block;
  padding: 16px 0;
  font-size: 13px;
}

/* Epic pills — 1 cor por epic */
.epic-pill {
  display: inline-block;
  padding: 4px 12px;
  font-family: var(--f-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  border: 1px solid;
  border-radius: 2px;
}

.epic-pill--valakas   { color: #ff5a3c; border-color: #7a2a1a; background: rgba(255, 90, 60, 0.08); }
.epic-pill--antharas  { color: #5dd96a; border-color: #1a5f24; background: rgba(93, 217, 106, 0.08); }
.epic-pill--baium     { color: #3fd9c0; border-color: #1a6f63; background: rgba(63, 217, 192, 0.08); }
.epic-pill--frintezza { color: #c576ff; border-color: #4d2872; background: rgba(197, 118, 255, 0.08); }
.epic-pill--zaken     { color: #4ec5ff; border-color: #1a4a6f; background: rgba(78, 197, 255, 0.08); }
.epic-pill--queenant  { color: #ffc94e; border-color: #6f4d1a; background: rgba(255, 201, 78, 0.08); }
.epic-pill--orfen     { color: #ff7ec5; border-color: #6f1a4a; background: rgba(255, 126, 197, 0.08); }
.epic-pill--core      { color: #b1b1b1; border-color: #4a4a4a; background: rgba(177, 177, 177, 0.06); }

/* ============================================================
   FASE 2 — Ranking page (ranking.php — tabela cheia)
   ============================================================ */

.ranking-page-section {
  padding-top: calc(var(--nav-h) + 32px);
  padding-bottom: 80px;
}

.ranking-page-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 24px;
  margin-top: 40px;
}

.ranking-page-card {
  background: var(--c-coal);
  border: 1px solid var(--c-gray-dark);
  padding: 20px 22px;
}

.ranking-page-card .epic-pill { margin-bottom: 12px; }

.ranking-page-card table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--f-mono);
  font-size: 13px;
}

.ranking-page-card th {
  text-align: left;
  color: var(--c-gray);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 8px 6px;
  border-bottom: 1px solid var(--c-gray-dark);
}

.ranking-page-card td {
  padding: 7px 6px;
  border-bottom: 1px solid rgba(58, 58, 58, 0.4);
  color: var(--c-ice);
}

.ranking-page-card .col-pos    { width: 36px; color: var(--c-gray); }
.ranking-page-card .col-points { text-align: right; color: var(--c-blood); }

/* ============================================================
   FASE 2 — Admin: tabs, toast, banner, edits Phase 2
   ============================================================ */

.tabs {
  display: flex;
  gap: 4px;
  margin: 32px 0 0;
  border-bottom: 1px solid var(--c-gray-dark);
  overflow-x: auto;
}

.tab {
  background: transparent;
  border: 0;
  color: var(--c-gray);
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 12px 18px;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  transition: color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
  white-space: nowrap;
}

.tab:hover { color: var(--c-ice); }

.tab--active {
  color: var(--c-blood);
  border-bottom-color: var(--c-blood);
}

.tab-panel { padding: 32px 0 0; }
.tab-panel[hidden] { display: none; }

/* Toast (canto sup. direito, auto-dismiss) */
.toast-stack {
  position: fixed;
  top: 88px;
  right: 24px;
  z-index: 200;
  display: flex;
  flex-direction: column;
  gap: 8px;
  pointer-events: none;
}

.toast {
  background: var(--c-coal-light);
  border-left: 3px solid var(--c-blood);
  padding: 12px 18px;
  font-family: var(--f-mono);
  font-size: 12px;
  letter-spacing: 0.06em;
  color: var(--c-ice);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.5);
  max-width: 360px;
  pointer-events: auto;
  animation: toastIn 200ms var(--ease);
}

@keyframes toastIn {
  from { opacity: 0; transform: translateX(20px); }
  to   { opacity: 1; transform: translateX(0); }
}

.toast--success { border-left-color: #5dd96a; }
.toast--error   { border-left-color: #ff6464; }

/* Banner inline (erro embaixo do card) */
.banner-inline {
  background: rgba(179, 0, 0, 0.12);
  border-left: 2px solid var(--c-blood);
  padding: 10px 14px;
  font-family: var(--f-mono);
  font-size: 12px;
  color: #ff6464;
  margin: 12px 0;
}

.banner-inline[hidden] { display: none; }

/* Leader column / checkbox no admin table */
.admin-table .leader-cell {
  text-align: center;
  width: 50px;
}

.admin-table .leader-cell input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: var(--c-blood);
  cursor: pointer;
}

/* ============================================================
   FASE 2 — Admin: Members tab
   ============================================================ */

.member-add-row {
  display: flex;
  gap: 12px;
  margin-bottom: 24px;
  padding: 16px;
  background: var(--c-coal);
  border: 1px solid var(--c-gray-dark);
  flex-wrap: wrap;
  align-items: center;
}

.member-add-row input[type="text"] {
  background: var(--c-black);
  border: 1px solid var(--c-gray-dark);
  color: var(--c-ice);
  padding: 8px 12px;
  font-family: var(--f-body);
  font-size: 14px;
  flex: 1;
  min-width: 200px;
}

.member-add-row input:focus { border-color: var(--c-blood); outline: none; }

.members-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--f-mono);
  font-size: 13px;
}

.members-table th {
  text-align: left;
  color: var(--c-blood);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 10px 12px;
  border-bottom: 1px solid var(--c-gray-dark);
}

.members-table td {
  padding: 8px 12px;
  border-bottom: 1px solid rgba(58, 58, 58, 0.4);
  color: var(--c-ice);
  vertical-align: middle;
}

.members-table input[type="text"] {
  background: var(--c-black);
  border: 1px solid var(--c-gray-dark);
  color: var(--c-ice);
  padding: 6px 10px;
  font-family: var(--f-mono);
  font-size: 13px;
  width: 100%;
}

.members-table .col-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.members-table button {
  background: var(--c-black);
  color: var(--c-ice);
  border: 1px solid var(--c-gray-dark);
  padding: 5px 10px;
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
}

.members-table button:hover { border-color: var(--c-blood); color: var(--c-blood); }
.members-table .row--inactive td { opacity: 0.5; }

/* ============================================================
   FASE 2 — Admin: Events tab
   ============================================================ */

.events-section { margin-bottom: 40px; }

.events-section h2 {
  font-family: var(--f-display);
  font-size: 16px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--c-ice);
  margin: 0 0 16px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--c-gray-dark);
}

.event-create-form {
  display: grid;
  grid-template-columns: auto 1fr 140px 80px auto;
  gap: 12px;
  background: var(--c-coal);
  border: 1px solid var(--c-gray-dark);
  padding: 14px 16px;
  margin-bottom: 16px;
  align-items: center;
}

.event-create-form select,
.event-create-form input {
  background: var(--c-black);
  border: 1px solid var(--c-gray-dark);
  color: var(--c-ice);
  padding: 7px 10px;
  font-family: var(--f-mono);
  font-size: 13px;
}

.event-create-form input:focus,
.event-create-form select:focus { border-color: var(--c-blood); outline: none; }

.event-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.event-card {
  background: var(--c-coal);
  border: 1px solid var(--c-gray-dark);
  padding: 12px 16px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items: center;
}

.event-card__info { display: flex; flex-direction: column; gap: 4px; }

.event-card__name {
  font-family: var(--f-display);
  font-size: 14px;
  color: var(--c-ice);
  letter-spacing: 0.06em;
}

.event-card__meta {
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--c-gray);
  letter-spacing: 0.06em;
}

.event-card__meta strong { color: var(--c-blood); }

.event-card__actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.event-card__rsvps {
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--c-ice);
  margin-top: 4px;
  padding: 4px 0;
}

.event-card__rsvps--empty { color: var(--c-gray); font-style: italic; }

.event-card__actions button {
  background: var(--c-black);
  color: var(--c-ice);
  border: 1px solid var(--c-gray-dark);
  padding: 5px 10px;
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
}

.event-card__actions button:hover { border-color: var(--c-blood); color: var(--c-blood); }
.event-card__actions button.danger:hover { color: #ff6464; }

/* Modal de presença (checklist de members) */
.attendance-modal__card {
  max-width: 520px;
  max-height: 80vh;
  overflow-y: auto;
}

.attendance-modal__checklist {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 12px 0 20px;
  max-height: 50vh;
  overflow-y: auto;
  border: 1px solid var(--c-gray-dark);
  padding: 8px 12px;
  background: var(--c-black);
}

.attendance-modal__checklist label {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 4px;
  font-family: var(--f-mono);
  font-size: 13px;
  color: var(--c-ice);
  cursor: pointer;
  border-radius: 2px;
}

.attendance-modal__checklist label:hover { background: var(--c-coal); }

.attendance-modal__checklist input[type="checkbox"] {
  width: 16px; height: 16px;
  accent-color: var(--c-blood);
}

.attendance-modal__addnew {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
}

.attendance-modal__addnew input {
  flex: 1;
  background: var(--c-black);
  border: 1px solid var(--c-gray-dark);
  color: var(--c-ice);
  padding: 6px 10px;
  font-family: var(--f-mono);
  font-size: 13px;
}

/* ============================================================
   FASE 2 — Admin: Ranking & Drops tab
   ============================================================ */

.admin-ranking-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 20px;
}

.admin-ranking-card {
  background: var(--c-coal);
  border: 1px solid var(--c-gray-dark);
  padding: 18px 20px;
}

.admin-ranking-card__head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 14px;
}

.admin-ranking-card__head button {
  background: var(--c-deep);
  border: 1px solid var(--c-deep);
  color: var(--c-ice);
  padding: 6px 12px;
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
}

.admin-ranking-card__head button:hover { background: var(--c-blood); border-color: var(--c-blood); }

.admin-ranking-card .ranking-list { max-height: 320px; overflow-y: auto; }

.admin-ranking-card__history {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--c-gray-dark);
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--c-gray);
}

.admin-ranking-card__history-item {
  display: flex;
  justify-content: space-between;
  padding: 4px 0;
}

.admin-ranking-card__history-item button {
  background: transparent;
  border: 0;
  color: var(--c-gray);
  cursor: pointer;
  font-family: var(--f-mono);
  font-size: 11px;
  text-decoration: underline;
}

.admin-ranking-card__history-item button:hover { color: #ff6464; }

/* ============================================================
   FASE 4 — Próximos Eventos (RSVP)
   ============================================================ */

.upcoming-section {
  padding: 56px 0;
  border-top: 1px solid var(--c-gray-dark);
}

.upcoming-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 16px;
  margin-top: 24px;
}

.upcoming-card {
  background: var(--c-coal);
  border: 1px solid var(--c-gray-dark);
  border-left: 3px solid var(--c-blood);
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.upcoming-card__head {
  border-bottom: 1px solid var(--c-gray-dark);
  padding-bottom: 8px;
}

.upcoming-card__name {
  font-family: var(--f-display);
  font-size: 18px;
  font-weight: 700;
  color: var(--c-ice);
  letter-spacing: 0.06em;
  margin: 0 0 4px;
  text-transform: uppercase;
}

.upcoming-card__meta {
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--c-gray);
  letter-spacing: 0.06em;
}

.upcoming-card__meta strong { color: var(--c-blood); }

.upcoming-card__type {
  display: inline-block;
  background: var(--c-black);
  border: 1px solid var(--c-deep);
  color: var(--c-blood);
  padding: 2px 8px;
  margin-right: 4px;
  font-weight: 700;
  text-transform: uppercase;
}

.upcoming-card__count {
  font-family: var(--f-mono);
  font-size: 12px;
  color: var(--c-blood);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.rsvp-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
  max-height: 200px;
  overflow-y: auto;
}

.rsvp-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: var(--c-black);
  padding: 6px 10px;
  border-left: 2px solid var(--c-deep);
}

.rsvp-row__nick {
  font-family: var(--f-display);
  font-size: 13px;
  color: var(--c-ice);
  letter-spacing: 0.04em;
}

.rsvp-row__cancel {
  background: transparent;
  border: 0;
  color: var(--c-gray);
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
  padding: 2px 6px;
}

.rsvp-row__cancel:hover { color: #ff6464; }

.rsvp-empty {
  font-family: var(--f-body);
  font-style: italic;
  color: var(--c-gray);
  font-size: 13px;
  margin: 0;
  padding: 8px 0;
}

.upcoming-card__cta { width: 100%; margin-top: auto; }

/* ============================================================
   FASE 3 — Saldo (balances tabela)
   ============================================================ */

.balances-section,
.bau-section,
.reservations-section {
  padding: 56px 0;
  border-top: 1px solid var(--c-gray-dark);
}

.balances-section .section-lede a,
.bau-section .section-lede a,
.reservations-section .section-lede a {
  color: var(--c-blood);
  text-decoration: none;
  border-bottom: 1px dotted var(--c-deep);
}

.balances-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--f-mono);
  font-size: 13px;
  margin-top: 24px;
}

.balances-table th {
  text-align: left;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--c-blood);
  padding: 10px 12px;
  border-bottom: 1px solid var(--c-gray-dark);
}

.balances-table td {
  padding: 8px 12px;
  border-bottom: 1px solid rgba(58, 58, 58, 0.4);
  color: var(--c-ice);
  vertical-align: middle;
}

.balances-table tbody tr:last-child td { border-bottom: 0; }
.balances-table .col-pos     { width: 40px; color: var(--c-gray); text-align: right; }
.balances-table .col-bal     { text-align: right; font-weight: 700; color: var(--c-ice); width: 90px; }
.balances-table .col-bal.is-negative { color: #ff6464; }
.balances-table .col-extra   { text-align: right; color: var(--c-gray); font-size: 12px; width: 110px; }
.balances-table .is-negative td { background: rgba(179, 0, 0, 0.06); }

.balances-table--full td:nth-child(2) { font-family: var(--f-display); font-size: 14px; }

/* ============================================================
   FASE 3 — Baú (grid de item cards)
   ============================================================ */

.bau-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 16px;
  margin-top: 24px;
}

.item-card {
  background: var(--c-coal);
  border: 1px solid var(--c-gray-dark);
  border-radius: 2px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition: border-color var(--t-fast) var(--ease);
}

.item-card:hover { border-color: var(--c-deep); }

.item-card--out { opacity: 0.5; }

.item-card__img,
.item-card__placeholder {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  background: var(--c-black);
  border: 1px solid var(--c-gray-dark);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--f-display);
  font-size: 44px;
  font-weight: 800;
  color: var(--c-blood);
  letter-spacing: 0;
}

.item-card__body {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}

.item-card__name {
  font-family: var(--f-display);
  font-size: 15px;
  font-weight: 700;
  color: var(--c-ice);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 0;
  line-height: 1.2;
}

.item-card__meta {
  display: flex;
  justify-content: space-between;
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: 0.06em;
}

.item-card__cost  { color: var(--c-blood); font-weight: 700; }
.item-card__stock { color: var(--c-gray); }

.item-card .btn { width: 100%; margin-top: auto; }

/* ============================================================
   FASE 3 — Reservations (lista pública)
   ============================================================ */

.reservations-list {
  list-style: none;
  margin: 24px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.reservation-row {
  display: grid;
  grid-template-columns: auto auto 1fr auto auto;
  gap: 12px;
  align-items: center;
  padding: 10px 14px;
  background: var(--c-coal);
  border: 1px solid var(--c-gray-dark);
  font-family: var(--f-mono);
  font-size: 13px;
}

.reservation-row__nick {
  color: var(--c-ice);
  font-family: var(--f-display);
  font-size: 14px;
  letter-spacing: 0.04em;
}

.reservation-row__arrow { color: var(--c-blood); }
.reservation-row__item  { color: var(--c-ice); font-size: 13px; }
.reservation-row__cost  { color: var(--c-blood); font-weight: 700; font-size: 11px; }

.reservation-row__cancel {
  background: transparent;
  border: 1px solid var(--c-gray-dark);
  color: var(--c-gray);
  padding: 4px 10px;
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
}

.reservation-row__cancel:hover {
  border-color: #ff6464;
  color: #ff6464;
}

/* ============================================================
   FASE 3 — Admin: Baú tab (CRUD items)
   ============================================================ */

.bau-admin-toolbar {
  display: flex;
  gap: 12px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.items-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--f-mono);
  font-size: 12px;
}

.items-table th {
  text-align: left;
  color: var(--c-blood);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 8px 6px;
  border-bottom: 1px solid var(--c-gray-dark);
  white-space: nowrap;
}

.items-table td {
  padding: 6px;
  border-bottom: 1px solid rgba(58, 58, 58, 0.4);
  vertical-align: middle;
}

.items-table input[type="text"],
.items-table input[type="number"],
.items-table select {
  background: var(--c-black);
  border: 1px solid var(--c-gray-dark);
  color: var(--c-ice);
  padding: 5px 8px;
  font-family: var(--f-mono);
  font-size: 12px;
  width: 100%;
}

.items-table .col-code  { width: 130px; }
.items-table .col-name  { min-width: 160px; }
.items-table .col-cat   { width: 100px; }
.items-table .col-cost  { width: 70px; }
.items-table .col-stock { width: 70px; }
.items-table .col-img   { min-width: 200px; }
.items-table .col-sort  { width: 60px; }
.items-table .col-act   { width: 120px; }

.items-table input[type="number"] { text-align: right; }

.items-table .row-inactive { opacity: 0.55; }

.items-table .actions {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.items-table button {
  background: var(--c-black);
  color: var(--c-ice);
  border: 1px solid var(--c-gray-dark);
  padding: 4px 8px;
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
}

.items-table button:hover { border-color: var(--c-blood); color: var(--c-blood); }
.items-table button.primary { background: var(--c-deep); border-color: var(--c-deep); }
.items-table button.primary:hover { background: var(--c-blood); border-color: var(--c-blood); color: var(--c-ice); }
.items-table button.danger:hover { color: #ff6464; }

/* ============================================================
   FASE 3 — Admin: Reservas & Histórico
   ============================================================ */

.admin-reservations { margin-bottom: 36px; }

.admin-reservations h2,
.admin-history h2,
.admin-balances h2 {
  font-family: var(--f-display);
  font-size: 16px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--c-ice);
  margin: 0 0 16px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--c-gray-dark);
}

.admin-reservations__row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 12px;
  align-items: center;
  padding: 10px 14px;
  background: var(--c-coal);
  border: 1px solid var(--c-gray-dark);
  margin-bottom: 6px;
  font-family: var(--f-mono);
  font-size: 13px;
}

.admin-reservations__row.warn {
  border-left: 3px solid #ffc94e;
  background: rgba(255, 201, 78, 0.04);
}

.admin-reservations__info {
  color: var(--c-ice);
}

.admin-reservations__info strong { color: var(--c-blood); }
.admin-reservations__warning { color: #ffc94e; font-size: 11px; }

.admin-reservations__actions {
  display: flex;
  gap: 6px;
}

.admin-reservations__actions button {
  background: var(--c-deep);
  color: var(--c-ice);
  border: 1px solid var(--c-deep);
  padding: 6px 12px;
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
}

.admin-reservations__actions button:hover { background: var(--c-blood); border-color: var(--c-blood); }
.admin-reservations__actions button.danger { background: var(--c-black); border-color: var(--c-gray-dark); color: var(--c-gray); }
.admin-reservations__actions button.danger:hover { border-color: #ff6464; color: #ff6464; background: var(--c-black); }

.admin-history { margin-top: 32px; }

.admin-history__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.admin-history__row {
  display: grid;
  grid-template-columns: 140px 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 8px 12px;
  background: var(--c-coal);
  border: 1px solid var(--c-gray-dark);
  font-family: var(--f-mono);
  font-size: 12px;
}

.admin-history__row.is-undone {
  opacity: 0.5;
  text-decoration: line-through;
}

.admin-history__ts { color: var(--c-gray); font-size: 11px; }
.admin-history__detail { color: var(--c-ice); }
.admin-history__detail strong { color: var(--c-blood); }

.admin-history__row button {
  background: transparent;
  border: 1px solid var(--c-gray-dark);
  color: var(--c-gray);
  padding: 4px 10px;
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
}

.admin-history__row button:hover { border-color: #ff6464; color: #ff6464; }
.admin-history__row.is-undone button { display: none; }

/* ============================================================
   Mobile tweaks
   ============================================================ */

@media (max-width: 600px) {
  .parties-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .party-card { padding: 20px 18px 12px; }
  .party-card__title { font-size: 17px; }
  .slot-row { grid-template-columns: 24px auto 1fr; padding: 10px 8px; gap: 8px; }
  .slot-row__nick { font-size: 14px; }
  .party-modal { padding: 12px; }
  .party-modal__card { padding: 28px 22px 22px; }

  .admin-toolbar { padding: 10px 12px; }
  .admin-toolbar .btn--small { padding: 6px 10px; font-size: 11px; }
  .admin-table { font-size: 12px; }
  .admin-table thead { display: none; }
  .admin-table tbody td { display: block; border: 0; padding: 4px 0; }
  .admin-table tbody tr { display: block; padding: 12px 0; border-bottom: 1px solid rgba(58, 58, 58, 0.5); }
  .admin-table .actions { justify-content: flex-start; }
  .admin-audit li { grid-template-columns: 1fr; gap: 2px; }

  /* Phase 2 mobile */
  .ranking-grid { grid-template-columns: 1fr; gap: 12px; }
  .ranking-card { padding: 14px 16px; }
  .ranking-row__nick { font-size: 13px; }
  .event-create-form {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .event-create-form select,
  .event-create-form input { width: 100%; }
  .event-card { grid-template-columns: 1fr; }
  .event-card__actions { justify-content: flex-start; }
  .members-table thead { display: none; }
  .members-table tbody td { display: block; border: 0; padding: 4px 0; }
  .members-table tbody tr { display: block; padding: 12px 0; border-bottom: 1px solid rgba(58, 58, 58, 0.5); }
  .members-table .col-actions { justify-content: flex-start; }
  .tabs { gap: 0; }
  .tab { padding: 10px 12px; font-size: 10px; }
  .toast-stack { right: 12px; top: 80px; left: 12px; }
  .toast { max-width: none; }
}

/* ============================================================
   FASE 5 — Check-in (página pública + UI admin)
   ============================================================ */

/* ----- Página pública /pts/checkin.php ----- */
.checkin-page {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 48px 16px;
}

.checkin-box {
  width: min(440px, 100%);
  background: var(--c-coal-light);
  border: 1px solid var(--c-gray-dark);
  border-radius: 2px;
  padding: 36px 30px 30px;
  text-align: center;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(179, 0, 0, 0.12);
}

.checkin-box__logo {
  width: 96px;
  height: auto;
  margin: 0 auto 18px;
  display: block;
  mix-blend-mode: screen;
}

.checkin-box__eyebrow { margin-bottom: 6px; }

.checkin-box__title {
  font-family: var(--f-display);
  font-size: 24px;
  color: var(--c-ice);
  letter-spacing: 0.04em;
  margin: 0 0 8px;
  line-height: 1.15;
}

.checkin-box__meta {
  font-family: var(--f-mono);
  font-size: 12px;
  color: var(--c-gray);
  letter-spacing: 0.06em;
  margin: 0 0 24px;
}

.checkin-box__meta strong { color: var(--c-blood); }
.checkin-box__type { color: var(--c-ice); text-transform: uppercase; }

.checkin-box__lede {
  font-family: var(--f-body);
  font-size: 15px;
  color: var(--c-gray);
  line-height: 1.5;
  margin: 0 0 22px;
}

.checkin-box__closed {
  font-family: var(--f-mono);
  font-size: 13px;
  color: #ff8a8a;
  border: 1px solid rgba(255, 100, 100, 0.4);
  background: rgba(255, 100, 100, 0.06);
  padding: 12px 14px;
  margin: 0 0 22px;
}

.checkin-form {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0 0 26px;
  text-align: left;
}

.checkin-form label {
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--c-gray);
}

.checkin-form input[type="text"],
.checkin-form input[type="password"] {
  background: var(--c-black);
  border: 1px solid var(--c-gray-dark);
  color: var(--c-ice);
  padding: 11px 12px;
  font-family: var(--f-mono);
  font-size: 15px;
  letter-spacing: 0.04em;
}

/* Senha (PIN do login) em vermelho — bem visível ao digitar. Antes o input
   type=password não pegava estilo nenhum e o texto ficava quase invisível. */
.checkin-form input[type="password"] { color: #ff5555; }

.checkin-form input[type="text"]:focus,
.checkin-form input[type="password"]:focus {
  outline: none;
  border-color: var(--c-blood);
}

.checkin-form .btn { margin-top: 6px; width: 100%; justify-content: center; }

.checkin-form__error {
  font-family: var(--f-mono);
  font-size: 12px;
  color: #ff8a8a;
  margin: 0;
}
.checkin-form__error[hidden] { display: none; }

.checkin-form__hint {
  font-family: var(--f-body);
  font-size: 13px;
  color: var(--c-gray);
  margin: 2px 0 0;
}
.checkin-form__hint strong { color: var(--c-ice); }

.checkin-list {
  border-top: 1px solid var(--c-gray-dark);
  padding-top: 18px;
}

.checkin-list__head {
  font-family: var(--f-mono);
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--c-blood);
  margin: 0 0 8px;
}

.checkin-list__nicks {
  font-family: var(--f-mono);
  font-size: 13px;
  color: var(--c-ice);
  line-height: 1.6;
  margin: 0;
  word-break: break-word;
}
.checkin-list__nicks--empty { color: var(--c-gray); font-style: italic; }

/* ----- Admin: linha de check-in no event-card ----- */
.event-card__checkin {
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--c-gray);
  margin-top: 6px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.event-card__checkin strong { color: var(--c-ice); }
.event-card__checkin .has-pending { color: var(--c-blood); }

.event-card__checkin button {
  background: var(--c-black);
  color: var(--c-ice);
  border: 1px solid var(--c-gray-dark);
  padding: 4px 9px;
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
}
.event-card__checkin button:hover { border-color: var(--c-blood); color: var(--c-blood); }

.checkin-link-display {
  width: 100%;
  background: var(--c-black);
  border: 1px solid var(--c-gray-dark);
  color: var(--c-ice);
  padding: 6px 8px;
  font-family: var(--f-mono);
  font-size: 11px;
  margin-top: 4px;
  word-break: break-all;
}

/* ----- Admin: modal de aprovação de check-ins ----- */
.checkin-modal__card {
  max-width: 520px;
  max-height: 80vh;
  overflow-y: auto;
}

.checkin-modal__list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 12px 0 18px;
  max-height: 50vh;
  overflow-y: auto;
  border: 1px solid var(--c-gray-dark);
  padding: 8px 10px;
  background: var(--c-black);
}

.checkin-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 6px;
  font-family: var(--f-mono);
  font-size: 13px;
  color: var(--c-ice);
  border-radius: 2px;
}
.checkin-row:hover { background: var(--c-coal); }

.checkin-row input[type="checkbox"] {
  width: 16px; height: 16px;
  accent-color: var(--c-blood);
}

.checkin-row__nick { flex: 1; }
.checkin-row__time { color: var(--c-gray); font-size: 11px; }

.checkin-badge-new {
  display: inline-block;
  background: rgba(179, 0, 0, 0.18);
  border: 1px solid rgba(179, 0, 0, 0.5);
  color: #ffb3b3;
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 1px 6px;
  border-radius: 2px;
}

.checkin-row__actions { display: flex; gap: 4px; }
.checkin-row__actions button {
  background: var(--c-black);
  border: 1px solid var(--c-gray-dark);
  color: var(--c-ice);
  cursor: pointer;
  padding: 3px 8px;
  font-family: var(--f-mono);
  font-size: 12px;
}
.checkin-row__actions button.ok:hover    { border-color: #5dd96a; color: #5dd96a; }
.checkin-row__actions button.no:hover    { border-color: #ff6464; color: #ff6464; }

.checkin-modal__section-title {
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--c-gray);
  margin: 10px 0 6px;
}

.checkin-modal__empty {
  font-family: var(--f-mono);
  font-size: 12px;
  color: var(--c-gray);
  text-align: center;
  padding: 18px 0;
}

/* ============================================================
   Nav mobile nas páginas /pts/ (sem hambúrguer → links inline visíveis)
   ============================================================ */
/* O style.css principal, em <=820px, transforma .nav__links num menu hambúrguer
   deslizado pra fora da tela (translateY(-110%)), revelado só com .is-open. As
   páginas /pts/ NÃO têm o botão burger nem o JS de toggle, então "Voltar pro site"
   ficava escondido/cortado no topo. Aqui restauramos os links como linha inline
   compacta. Escopo .pts-body pra não tocar na landing (que usa o burger). */
@media (max-width: 820px) {
  .pts-body .nav { height: auto; }

  .pts-body .nav__inner {
    flex-wrap: wrap;
    gap: 4px 14px;
    min-height: var(--nav-h);
    padding-top: 8px;
    padding-bottom: 8px;
  }

  .pts-body .nav__links {
    position: static;
    inset: auto;
    transform: none;
    transition: none;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    gap: 6px 14px;
    padding: 0;
    background: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border-bottom: none;
  }

  .pts-body .nav__links a {
    width: auto;
    padding: 2px 0;
    border-bottom: none;
    font-size: 11px;
    letter-spacing: 0.1em;
    white-space: nowrap;
  }
  .pts-body .nav__links a::after { display: none; }

  /* Folga extra no topo: o nav pode quebrar em 2 linhas no mobile. O admin tem 3
     links (pior caso) → folga maior pra nunca encostar o conteudo, mesmo a 320px. */
  .pts-body .pts-main,
  .pts-body .ranking-page-section { padding-top: calc(var(--nav-h) + 56px); }
  .pts-body .admin-shell { padding-top: calc(var(--nav-h) + 80px); }
}

/* ============================================================
   FASE 6 — Quadro de formação do evento (modal admin)
   ============================================================ */
.formation-modal__card {
  width: min(900px, 100%);
  max-width: min(900px, 100%);
  max-height: 85vh;
  overflow-y: auto;
}

.formation-hint {
  font-family: var(--f-mono);
  font-size: 12px;
  color: var(--c-gray);
  margin: 0 0 14px;
}
.formation-hint strong { color: #5dd96a; }
.formation-hint em { color: var(--c-ice); font-style: normal; }

.formation-board {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: flex-start;
}

.formation-col {
  flex: 1 1 200px;
  min-width: 180px;
  border: 1px solid var(--c-gray-dark);
  background: var(--c-black);
}

.formation-col--sempt { border-style: dashed; border-color: var(--c-blood); }

.formation-col__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--c-gray-dark);
  font-family: var(--f-display);
  font-size: 12px;
  letter-spacing: 0.08em;
  color: var(--c-ice);
  text-transform: uppercase;
}

.formation-col__count {
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--c-blood);
  letter-spacing: 0;
}

.formation-col__list { padding: 6px; display: flex; flex-direction: column; gap: 4px; }

.formation-empty {
  font-family: var(--f-mono);
  font-size: 12px;
  color: var(--c-gray);
  text-align: center;
  padding: 8px 0;
  margin: 0;
}

/* Linha da formação em 2 níveis: topo = status + nome; base = classe + Mover + ação. */
.formation-row {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 3px;
  padding: 5px 6px;
  font-family: var(--f-mono);
  font-size: 12px;
  color: var(--c-ice);
  background: var(--c-coal);
  border: 1px solid var(--c-gray-dark);
}
.formation-row--new { border-color: #d9a441; }  /* nome fora da lista de membros */

.formation-row__top { display: flex; align-items: center; gap: 6px; }
.formation-row__bot { display: flex; align-items: center; gap: 6px; }

.formation-row__st { width: 14px; text-align: center; flex: none; }
.formation-row__st.ok   { color: #5dd96a; }
.formation-row__st.pend { color: var(--c-gray); }
.formation-row__st.rsvp { width: auto; }

.formation-row__nick { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; }
.formation-row__moved { flex: none; color: var(--c-blood); }
.formation-row__new { flex: none; color: #d9a441; font-size: 11px; }

/* Classe (role da PT fixa) — fica na base, à esquerda. */
.formation-row__class {
  flex: 1; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  color: var(--c-ice); font-size: 11px;
}
.formation-row__class--none { color: var(--c-gray); font-style: italic; font-weight: 400; }

/* Tag "inscrito" (RSVP) — no lugar do botão de presença (pontos só pelo check-in). */
.formation-row__tag {
  flex: none;
  font-size: 10px;
  color: var(--c-gray);
  border: 1px solid var(--c-gray-dark);
  border-radius: 4px;
  padding: 1px 6px;
  white-space: nowrap;
}

.formation-row__move {
  flex: none;
  max-width: 92px;
  background: var(--c-black);
  border: 1px solid var(--c-gray-dark);
  color: var(--c-ice);
  font-family: var(--f-mono);
  font-size: 11px;
  padding: 2px 4px;
}

.formation-row button {
  flex: none;
  background: var(--c-black);
  border: 1px solid var(--c-gray-dark);
  color: var(--c-ice);
  cursor: pointer;
  padding: 2px 7px;
  font-family: var(--f-mono);
  font-size: 12px;
}
.formation-row button.ok:hover { border-color: #5dd96a; color: #5dd96a; }
.formation-row button:hover { border-color: var(--c-blood); color: var(--c-blood); }

.formation-total {
  font-family: var(--f-mono);
  font-size: 12px;
  color: var(--c-gray);
  text-align: right;
  margin: 12px 0 0;
}

/* ============================================================
   FASE 7 — Rodízio (coluna no baú + flag de repetição na reserva)
   ============================================================ */
.items-table .col-rot { text-align: center; white-space: nowrap; }
.rot-cell { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.rot-cell input[type="checkbox"] { accent-color: var(--c-blood); width: 15px; height: 15px; }
.rot-takers { font-family: var(--f-mono); font-size: 10px; color: var(--c-blood); white-space: nowrap; }
.admin-reservations__row.repeat { border-left: 3px solid #ffb84e; }

/* ============================================================
   FASE 10 — Temporada de pontos (controles no topo da aba Reservas/Saldo)
   ============================================================ */
.admin-season {
  border: 1px solid var(--c-gray-dark);
  background: var(--c-coal);
  padding: 14px 16px;
  margin-bottom: 20px;
}
.admin-season h2 {
  font-family: var(--f-display);
  font-size: 14px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--c-ice);
  margin: 0 0 10px;
}
.admin-season__row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 18px;
  font-family: var(--f-mono);
  font-size: 12px;
  color: var(--c-gray);
}
.admin-season__since strong { color: var(--c-ice); }
.admin-season__mode select {
  background: var(--c-black);
  border: 1px solid var(--c-gray-dark);
  color: var(--c-ice);
  font-family: var(--f-mono);
  font-size: 12px;
  padding: 3px 6px;
  margin-left: 4px;
}
.admin-season button.danger {
  background: var(--c-black);
  border: 1px solid #7a2a1a;
  color: #ff8a6b;
  cursor: pointer;
  padding: 6px 12px;
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.admin-season button.danger:hover { border-color: var(--c-blood); color: var(--c-blood); }

/* ============================================================
   FASE 11 — Roleta de Sorteios
   ============================================================ */
.raffle-wrap { padding: 8px 0 24px; }
.raffle-pick { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; margin-bottom: 16px; }
.raffle-pick select { background: var(--c-black); border: 1px solid var(--c-gray-dark); color: var(--c-ice); font-family: var(--f-mono); font-size: 14px; padding: 9px 10px; border-radius: 2px; width: 100%; }
.raffle-stats { display: flex; flex-wrap: wrap; gap: 10px 18px; font-family: var(--f-mono); font-size: 12px; color: var(--c-gray); margin-bottom: 14px; }
.raffle-stat b { color: var(--c-ice); }
.raffle-stat--warn { color: var(--c-ember); }

.raffle-manager { display: flex; flex-direction: column; gap: 14px; margin-bottom: 18px; }
.raffle-grp__h { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-blood); margin-bottom: 8px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.raffle-grp--dim .raffle-grp__h { color: var(--c-gray); }
.raffle-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.raffle-chip { display: inline-flex; align-items: center; gap: 6px; background: var(--c-coal); border: 1px solid var(--c-gray-dark); border-radius: 3px; padding: 5px 8px; font-family: var(--f-mono); font-size: 12px; color: var(--c-ice); }
.raffle-chip small { color: var(--c-gray); font-size: 11px; }
.raffle-chip--add { border-style: dashed; }
.raffle-chip--dim { opacity: 0.5; }
.raffle-tag { font-style: normal; font-size: 9px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--c-ember); border: 1px solid currentColor; border-radius: 2px; padding: 0 3px; }
/* Selo da regra da jóia repetida (avisa, não bloqueia) — dourado, com tooltip. */
.raffle-jewel { font-style: normal; font-size: 10px; color: #e9b949; border: 1px solid currentColor; border-radius: 2px; padding: 0 4px; white-space: nowrap; cursor: help; }
.raffle-x, .raffle-plus { background: none; border: none; cursor: pointer; font-family: var(--f-mono); font-weight: 700; line-height: 1; padding: 2px 4px; }
.raffle-x { color: var(--c-gray); }
.raffle-x:hover { color: var(--c-blood); }
.raffle-plus { color: #5dd96a; font-size: 15px; }
.raffle-plus:hover { color: #7af09a; }
/* Fase 13 — pedidos pendentes (aguardando validação) + botão aprovar (✓ verde). */
.raffle-ok { background: none; border: none; cursor: pointer; font-family: var(--f-mono); font-weight: 700; line-height: 1; padding: 2px 4px; color: #5dd96a; font-size: 14px; }
.raffle-ok:hover { color: #7af09a; }
.raffle-grp--pending .raffle-grp__h { color: var(--c-ember); }
.raffle-chip--pending { border-color: var(--c-ember); border-style: dashed; background: rgba(255, 69, 0, 0.06); }
/* Confete da vitória — canvas overlay leve sobre a roda (não captura cliques). */
.raffle-confetti { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 3; }
.raffle-empty { font-family: var(--f-mono); font-size: 12px; color: var(--c-gray); }

.raffle-mode { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; font-family: var(--f-mono); font-size: 13px; color: var(--c-ice); margin-bottom: 18px; }
.raffle-mode__lbl { color: var(--c-gray); font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; }
.raffle-mode label { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.raffle-mode input[type="radio"] { accent-color: var(--c-blood); width: 15px; height: 15px; }

.raffle-wheel-wrap { position: relative; width: 100%; max-width: 360px; margin: 0 auto 18px; }
.raffle-wheel { display: block; width: 100%; height: auto; }
.raffle-pointer { position: absolute; top: -6px; left: 50%; transform: translateX(-50%); width: 0; height: 0; border-left: 14px solid transparent; border-right: 14px solid transparent; border-top: 24px solid var(--c-ember); filter: drop-shadow(0 2px 3px rgba(0,0,0,0.5)); z-index: 2; }

.raffle-spin { display: block; width: 100%; max-width: 360px; margin: 0 auto 16px; font-size: 15px; }
.raffle-spin:disabled { opacity: 0.4; cursor: not-allowed; }

.raffle-winner-banner { text-align: center; font-family: var(--f-display); font-size: 20px; color: var(--c-ember); padding: 14px; margin: 0 auto 20px; max-width: 480px; border: 1px solid var(--c-deep); background: rgba(179,0,0,0.08); border-radius: 3px; animation: modalIn var(--t-med) var(--ease); }
.raffle-winner-banner small { font-family: var(--f-mono); font-size: 12px; color: var(--c-gray); }

.raffle-hist-title { font-family: var(--f-display); font-size: 14px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-ice); margin: 24px 0 12px; }
.raffle-history { display: flex; flex-direction: column; gap: 6px; }
.raffle-hrow { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; background: var(--c-coal); border: 1px solid var(--c-gray-dark); border-radius: 3px; padding: 8px 12px; font-family: var(--f-mono); font-size: 12px; color: var(--c-ice); }
.raffle-hrow__main { flex: 1; min-width: 200px; }
.raffle-hrow__meta { color: var(--c-gray); font-size: 11px; }
.raffle-row--undone { opacity: 0.5; }
.raffle-row--undone .raffle-hrow__main { text-decoration: line-through; }

@media (max-width: 600px) {
  .raffle-wheel-wrap, .raffle-spin { max-width: 86vw; }
  .raffle-pick { flex-direction: column; align-items: stretch; }
  .raffle-hrow { flex-direction: column; align-items: flex-start; }
}
.item-card__raffle { font-family: var(--f-mono); font-size: 11px; color: var(--c-ember); margin: 2px 0 6px; }

/* ============================================================
   FASE 12 — AFK (tag + extrato)
   ============================================================ */
.afk-badge { display: inline-block; margin-left: 6px; padding: 1px 6px; font-family: var(--f-mono); font-size: 10px; font-weight: 700; letter-spacing: 0.04em; color: #ffd9a0; background: rgba(179, 80, 0, 0.22); border: 1px solid rgba(255, 150, 60, 0.45); border-radius: 4px; vertical-align: middle; white-space: nowrap; }
.event-closed-pill { font-family: var(--f-mono); font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--c-gray); border: 1px solid var(--c-gray-dark); border-radius: 3px; padding: 1px 5px; }
.ledger-modal__card { max-width: 640px; width: 100%; }
.ledger-note { font-family: var(--f-mono); font-size: 11px; color: var(--c-gray); margin: 0 0 10px; }
.ledger-table { width: 100%; border-collapse: collapse; font-family: var(--f-mono); font-size: 12px; }
.ledger-table th { text-align: left; color: var(--c-blood); font-size: 10px; text-transform: uppercase; letter-spacing: 0.08em; padding: 6px 8px; border-bottom: 1px solid var(--c-gray-dark); }
.ledger-table td { padding: 5px 8px; border-bottom: 1px solid rgba(138,138,138,0.15); color: var(--c-ice); vertical-align: top; }
.ledger-pos { color: #5dd96a; }
.ledger-neg { color: #ff6464; }
.ledger-afk td { background: rgba(179, 80, 0, 0.10); }
.ledger-undone { opacity: 0.5; text-decoration: line-through; }
.ledger-offseason { opacity: 0.6; }

/* ============================================================
   FASE 13 — Páginas de regras (públicas)
   ============================================================ */
.rules-page { max-width: 760px; margin: 0 auto; padding: calc(var(--nav-h, 72px) + 32px) var(--gutter, 20px) 80px; }
.rules-logo { width: 64px; height: auto; display: block; margin: 0 auto 16px; filter: drop-shadow(0 0 20px rgba(179,0,0,0.35)); }
.rules-eyebrow { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--c-blood); text-align: center; margin: 0 0 6px; }
.rules-title { font-family: var(--f-display); font-size: clamp(28px, 6vw, 44px); font-weight: 900; letter-spacing: 0.04em; text-align: center; color: var(--c-ice); margin: 0 0 14px; }
.rules-lede { font-family: var(--f-body); font-size: 21px; color: var(--c-gray); text-align: center; margin: 0 auto 36px; max-width: 580px; line-height: 1.5; }
.rules-section { background: var(--c-coal); border: 1px solid var(--c-gray-dark); border-left: 3px solid var(--c-blood); border-radius: 3px; padding: 18px 20px; margin: 0 0 16px; }
.rules-section--afk { border-left-color: #ff963c; }
.rules-section__title { font-family: var(--f-display); font-size: 20px; font-weight: 800; letter-spacing: 0.03em; color: var(--c-ice); margin: 0 0 10px; }
.rules-section p { font-family: var(--f-body); font-size: 18.5px; line-height: 1.6; color: #d6d6d6; margin: 0 0 8px; }
.rules-section p:last-child { margin-bottom: 0; }
.rules-section strong { color: var(--c-ice); }
.rules-list { margin: 0 0 8px; padding-left: 20px; }
.rules-list li { font-family: var(--f-body); font-size: 18.5px; line-height: 1.6; color: #d6d6d6; margin: 0 0 6px; }
.rules-note { font-family: var(--f-mono); font-size: 15px !important; color: var(--c-ember) !important; }
.rules-example { font-family: var(--f-mono) !important; font-size: 15px !important; color: var(--c-gray) !important; background: var(--c-black); border: 1px dashed var(--c-gray-dark); border-radius: 3px; padding: 12px 14px; }
.rules-outro { font-family: var(--f-body); font-size: 19px; font-style: italic; color: var(--c-gray); text-align: center; margin: 28px auto 12px; max-width: 640px; line-height: 1.5; }
.rules-cta { text-align: center; font-family: var(--f-mono); font-size: 14px; margin-top: 10px; }
.rules-cta a { color: var(--c-blood); text-decoration: none; }
.rules-cta a:hover { color: var(--c-ember); }
@media (max-width: 600px) { .rules-section p, .rules-list li { font-size: 17px; } .rules-lede { font-size: 19px; } }