:root{--bg:#070808;--panel:#111417;--line:rgba(218,179,111,.18);--text:#f5f1e8;--soft:#c7c0b2;--muted:#878174;--orange:#ff8a1c;--red:#d4483b;--green:#87d85d;--blue:#6aa7ff;--shadow:0 22px 60px rgba(0,0,0,.35)}*{box-sizing:border-box}body{margin:0;min-height:100vh;color:var(--text);background:radial-gradient(circle at 20% 0%,rgba(255,138,28,.10),transparent 32rem),var(--bg);font-family:system-ui,-apple-system,Segoe UI,sans-serif}.hidden{display:none!important}.login-screen{min-height:100vh;display:grid;place-items:center;padding:24px}.login-card{width:min(440px,100%);padding:28px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.01)),var(--panel);box-shadow:var(--shadow)}.brand-row{display:flex;gap:16px;align-items:center;margin-bottom:24px}.brand-mark{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;border:2px solid var(--orange);font-weight:900;font-size:32px}h1,h2,p{margin-top:0}h1{margin-bottom:4px}p{color:var(--soft)}label{display:block;margin:14px 0;color:var(--soft);font-weight:700}input{width:100%;margin-top:7px;padding:12px 13px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.25);color:var(--text);outline:none}button{min-height:42px;border:0;border-radius:10px;padding:10px 16px;background:linear-gradient(135deg,#ff9b22,#f05b21 60%,#c52f24);color:white;font-weight:900;text-transform:uppercase;letter-spacing:.06em;cursor:pointer}button.ghost{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12)}.error{margin-top:12px;color:#ff8a8a;font-weight:700}.dashboard{padding:22px}.topbar{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-bottom:18px}.kicker{margin:0 0 4px;color:var(--orange);font-weight:900;letter-spacing:.12em;text-transform:uppercase;font-size:12px}.topbar h1{margin:0;font-size:clamp(28px,4vw,46px);text-transform:uppercase;letter-spacing:.04em}.topbar-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}#sessionUser{color:var(--soft);font-weight:800}.summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:14px}.summary-grid article{padding:16px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.035)}.summary-grid span{color:var(--muted);text-transform:uppercase;font-weight:900;font-size:12px;letter-spacing:.08em}.summary-grid strong{display:block;font-size:28px}.panel-grid{display:grid;grid-template-columns:1.25fr .9fr;gap:14px}.panel{min-height:72vh;border:1px solid var(--line);border-radius:18px;background:rgba(17,20,23,.86);box-shadow:var(--shadow);overflow:hidden}.panel-head{min-height:76px;padding:16px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:14px}.panel-head h2{margin:0}.panel-head input{max-width:300px}.toggle{margin:0;display:flex;align-items:center;gap:8px}.toggle input{width:auto;margin:0}.log-list{max-height:calc(72vh - 76px);overflow:auto;padding:10px}.log-row{border:1px solid rgba(255,255,255,.08);border-left:4px solid rgba(255,255,255,.18);border-radius:12px;background:rgba(0,0,0,.18);padding:10px;margin-bottom:8px}.log-row.chat{border-left-color:var(--blue)}.log-row.kill{border-left-color:var(--green)}.log-row.teamkill{border-left-color:var(--red);background:rgba(212,72,59,.12)}.log-row.flagged{outline:1px solid rgba(255,138,28,.38)}.log-meta{display:flex;gap:8px;align-items:center;margin-bottom:6px;color:var(--muted);font-size:12px;text-transform:uppercase;font-weight:900}.badge{display:inline-flex;min-height:21px;padding:2px 7px;border-radius:999px;background:rgba(255,255,255,.08);color:var(--soft)}.badge.tk{background:rgba(212,72,59,.25);color:#ffd5d1}.badge.flag{background:rgba(255,138,28,.24);color:#ffe0bd}.log-text{white-space:pre-wrap;word-break:break-word}.flag-word{background:rgba(255,138,28,.28);color:#fff0da;border-radius:4px;padding:0 3px}.log-actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:8px}.log-actions a,.log-actions button{min-height:28px;padding:5px 8px;border-radius:7px;font-size:12px;text-transform:none;letter-spacing:0;color:var(--text);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10);text-decoration:none}.log-actions .danger{color:#ffd5d1;border-color:rgba(212,72,59,.35)}@media(max-width:1100px){.panel-grid,.summary-grid{grid-template-columns:1fr}.topbar{align-items:flex-start;flex-direction:column}.panel-head{align-items:stretch;flex-direction:column}.panel-head input{max-width:none}}
/* =========================================================
   Feed cleanup: separate chat/feed layout + better mobile
   ========================================================= */

.panel-grid {
  align-items: start;
}

.panel {
  min-height: 72vh;
}

.log-list {
  max-height: calc(72vh - 76px);
  overflow-y: auto;
  padding: 14px;
}

.log-row {
  margin-bottom: 10px;
  padding: 13px;
}

.log-text {
  font-size: 0.98rem;
  line-height: 1.35;
}

.log-actions {
  gap: 6px;
}

.log-actions a,
.log-actions button {
  min-height: 30px;
  padding: 6px 9px;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

.empty-state {
  padding: 18px;
  border: 1px dashed rgba(255,255,255,.16);
  border-radius: 14px;
  color: var(--muted);
  text-align: center;
  font-weight: 800;
}

@media (max-width: 800px) {
  .dashboard {
    padding: 12px;
  }

  .summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .summary-grid article {
    padding: 13px;
  }

  .summary-grid strong {
    font-size: 24px;
  }

  .panel {
    min-height: auto;
    border-radius: 16px;
  }

  .panel-grid {
    gap: 18px;
  }

  .panel-head {
    min-height: auto;
    padding: 14px;
  }

  .panel-head h2 {
    font-size: 1.35rem;
    line-height: 1.1;
  }

  .log-list {
    max-height: 70vh;
    padding: 10px;
  }

  .log-row {
    padding: 11px;
    border-radius: 13px;
  }

  .log-text {
    font-size: 0.94rem;
    line-height: 1.32;
  }

  .log-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .log-actions a,
  .log-actions button {
    width: 100%;
    justify-content: center;
    text-align: center;
  }
}

@media (max-width: 430px) {
  .summary-grid {
    grid-template-columns: 1fr;
  }

  .log-actions {
    grid-template-columns: 1fr 1fr;
  }
}


/* =========================================================
   Admin dashboard: clean two-column desktop feed layout
   ========================================================= */

@media (min-width: 1101px) {
  .panel-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(420px, .85fr);
    gap: 18px;
    align-items: start;
  }

  .panel {
    min-height: 74vh;
  }

  .log-list {
    max-height: calc(74vh - 80px);
    overflow-y: auto;
  }
}

@media (max-width: 1100px) {
  .panel-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
  }
}


/* =========================================================
   Admin dashboard refinement: TK watch, chat readability,
   two-column desktop, kill search, modal
   ========================================================= */

.tk-watch-panel {
  margin-bottom: 16px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.006)),
    var(--panel);
  box-shadow: var(--shadow);
}

.tk-watch-head {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 16px;
  margin-bottom: 12px;
}

.tk-watch-head h2 {
  margin: 0;
  font-size: clamp(1.35rem, 2.2vw, 2rem);
}

.tk-watch-note {
  color: var(--muted);
  font-weight: 800;
  font-size: .9rem;
}

.tk-offender-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.tk-offender-pill {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 38px;
  padding: 8px 12px;
  background: rgba(212,72,59,.16);
  border: 1px solid rgba(212,72,59,.36);
  border-radius: 999px;
  color: var(--text);
  text-transform: none;
  letter-spacing: 0;
}

.tk-offender-pill strong {
  color: #ffd0cb;
}

.kill-controls {
  display: flex;
  gap: 10px;
  align-items: center;
  width: min(420px, 100%);
}

.kill-controls input {
  flex: 1;
  min-width: 0;
}

.chat-line {
  display: grid;
  grid-template-columns: minmax(135px, auto) 1fr;
  gap: 12px;
  align-items: start;
  font-size: 1.08rem;
  line-height: 1.45;
}

.chat-player {
  color: var(--orange);
  font-weight: 900;
  word-break: break-word;
}

.chat-message {
  color: var(--text);
  word-break: break-word;
}

.kill-line {
  font-size: 1rem;
  line-height: 1.35;
}

.killer {
  color: var(--green);
  font-weight: 900;
}

.victim {
  color: #ff8a8a;
  font-weight: 900;
}

.arrow {
  color: var(--muted);
  padding: 0 6px;
}

.weapon {
  color: var(--soft);
  display: inline-block;
  margin-left: 6px;
}

.kill-links {
  margin-top: 10px;
  display: grid;
  gap: 7px;
}

.player-link-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}

.player-link-row strong {
  color: var(--soft);
  min-width: 150px;
}

.player-link-row a,
.modal-actions a {
  min-height: 28px;
  padding: 5px 8px;
  border-radius: 7px;
  font-size: 12px;
  font-weight: 900;
  text-decoration: none;
  color: var(--text);
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
}

.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(0,0,0,.72);
  backdrop-filter: blur(4px);
}

.modal-card {
  width: min(920px, 100%);
  max-height: 86vh;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--panel);
  box-shadow: var(--shadow);
}

.modal-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  padding: 16px;
  border-bottom: 1px solid var(--line);
}

.modal-head h2 {
  margin: 0;
}

.modal-body {
  padding: 14px;
  max-height: calc(86vh - 86px);
  overflow-y: auto;
}

.modal-actions {
  display: flex;
  gap: 8px;
  margin-bottom: 12px;
}

.modal-log-list {
  display: grid;
  gap: 8px;
}

@media (min-width: 1101px) {
  .panel-grid {
    grid-template-columns: minmax(0, 1.15fr) minmax(430px, .85fr);
    gap: 18px;
  }
}

@media (max-width: 800px) {
  .tk-watch-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .kill-controls {
    flex-direction: column;
    align-items: stretch;
  }

  .chat-line {
    grid-template-columns: 1fr;
    gap: 3px;
    font-size: 1.04rem;
  }

  .player-link-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .player-link-row strong {
    grid-column: 1 / -1;
  }

  .modal-card {
    max-height: 92vh;
  }
}

