/* The Kamer Life team (src/ui/admin-ui.js): the ADMIN PANEL, the staff card on a player's sheet, the free camera bar,
   the "removed" card (kicked / banned), the 🛡️ Team app's report chat. Dark and plain, like the panel the user showed. */
.adm-back { position: fixed; inset: 0; z-index: 30; display: none; align-items: center; justify-content: center; background: rgba(0,0,0,.55); padding: env(safe-area-inset-top,0px) 0 env(safe-area-inset-bottom,0px); }
.adm-back.open { display: flex; }
.adm { width: min(1080px, 100%); height: min(640px, 100%); background: #2b2b2b; color: #eee; display: flex; flex-direction: column; font: 600 14px var(--ui, system-ui, sans-serif); box-shadow: 0 10px 40px rgba(0,0,0,.5); }
.adm-hd { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-bottom: 1px solid #444; }
.adm-hd b { font-size: 14px; letter-spacing: .06em; flex: none; }
.adm-hd span { flex: 1; color: #aaa; font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.adm-x { border: 0; background: none; color: #e74c3c; font-size: 24px; line-height: 1; cursor: pointer; padding: 4px 6px; }
.adm-bd { flex: 1; min-height: 0; display: grid; grid-template-columns: 1fr 1fr; }
.adm-l, .adm-r { min-height: 0; display: flex; flex-direction: column; padding: 10px; gap: 8px; }
.adm-l { background: #6e6e6e; }
.adm-r { background: #2f2f2f; overflow-y: auto; }
.adm button { font: inherit; cursor: pointer; }
.adm-top { display: flex; gap: 6px; }
.adm-tab { flex: 1; border: 0; background: #d6d6d6; color: #222; padding: 9px 6px; font-weight: 800 !important; }
.adm-tab.on { background: #fff; box-shadow: inset 0 -3px 0 #f1c40f; }
.adm-tab em { font-style: normal; background: #e74c3c; color: #fff; border-radius: 999px; padding: 0 6px; font-size: 11px; }
.adm-search { display: flex; gap: 6px; }
.adm-search input, .adm-in { flex: 1; min-width: 0; border: 0; padding: 10px; font: 600 16px var(--ui, system-ui); background: #1e1e1e; color: #fff; }
.adm-search button { border: 0; background: #d6d6d6; padding: 0 14px; }
.adm-list { flex: 1; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 4px; }
.adm-row { display: grid; grid-template-columns: auto 1fr; column-gap: 10px; text-align: left; border: 0; background: #d6d6d6; color: #222; padding: 8px 10px; }
.adm-row.on { background: #fff; outline: 3px solid #f1c40f; }
.adm-row strong { font-size: 16px; text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.adm-row strong small { font-size: 11px; color: #666; }
.adm-row .adm-k { font-weight: 800; }
.adm-row > span:last-child { text-align: right; }
.adm-id { font-size: 13px; }
.adm-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #2ecc71; }
.adm-pages { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; }
.adm-pages button { border: 0; background: #6e6e6e; color: #222; font-size: 22px !important; font-weight: 800 !important; padding: 6px; background: #8a8a8a; }
.adm-pages button:disabled { opacity: .5; cursor: default; }
.adm-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.adm-chips button { border: 0; background: #d6d6d6; color: #222; padding: 8px 12px; border-radius: 999px; font-weight: 800 !important; }
.adm-chips button.on { background: #f1c40f; }
.adm-empty { color: #bbb; text-align: center; padding: 18px 8px; margin: 0; font-weight: 500; }
.adm-l .adm-empty { color: #f2f2f2; }
.adm-who { display: flex; align-items: center; gap: 10px; }
.adm-who strong { display: block; font-size: 18px; } .adm-who span { color: #aaa; font-size: 12.5px; }
.adm-backbtn { display: none; border: 0; background: #444; color: #fff; font-size: 22px !important; width: 38px; height: 38px; }
.adm-tabs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.adm-tabs button { border: 0; background: #d6d6d6; color: #222; padding: 9px 4px; font-size: 17px !important; font-weight: 800 !important; }
.adm-tabs button.on { background: #fff; box-shadow: inset 0 -3px 0 #f1c40f; }
.adm-pane { display: flex; flex-direction: column; gap: 8px; }
.adm-date { text-align: center; font-size: 17px; margin: 4px 0; }
.adm-kv { display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px solid #3c3c3c; padding: 6px 2px; }
.adm-kv span { color: #aaa; font-weight: 500; } .adm-kv b { text-align: right; } .adm-kv small { color: #ccc; font-weight: 500; }
.adm-big, .adm-wide { border: 0; background: #d6d6d6; color: #222; padding: 10px; font-weight: 800 !important; width: 100%; }
.adm-big { font-size: 18px !important; }
.adm-wide.danger { background: #e74c3c; color: #fff; }
.adm-wide:disabled { opacity: .5; cursor: default; }
.adm-row2 { display: flex; gap: 6px; } .adm-row2 > * { flex: 1; }
.adm-sect { color: #f1c40f; font-size: 12px; letter-spacing: .05em; text-transform: uppercase; margin-top: 6px; }
.adm-note { color: #999; font-size: 12px; font-weight: 500; margin: 0; }
.adm-rep { background: #3a3a3a; padding: 8px 10px; display: flex; flex-direction: column; gap: 4px; }
.adm-rep span { color: #ccc; font-weight: 500; font-size: 13px; }
.adm-rep q { color: #fff; font-weight: 500; }
.adm-link { border: 0; background: none; color: #f1c40f; padding: 0; text-decoration: underline; font-weight: 800 !important; text-align: left; }
.adm-evd { background: #262626; padding: 6px 10px; font-weight: 500; font-size: 13px; }
.adm-evd summary { cursor: pointer; color: #ddd; }
.adm-ev { padding: 2px 0; color: #ddd; } .adm-ev time { color: #888; margin-right: 6px; }
.adm-msgs { max-height: 240px; min-height: 80px; overflow-y: auto; display: flex; flex-direction: column; gap: 6px; padding: 4px 0; }
.adm-msg { display: grid; grid-template-columns: 46px 1fr; gap: 8px; font-size: 15px; }
.adm-msg time { color: #999; font-size: 11px; padding-top: 3px; }
.adm-msg.st span { color: #fff; } .adm-msg span { color: #ddd; }
.adm-send { display: flex; gap: 0; }
.adm-send input { flex: 1; min-width: 0; border: 0; background: #1e1e1e; color: #fff; padding: 10px; font: 500 16px var(--ui, system-ui); }
.adm-send button { border: 0; background: #444; color: #fff; padding: 0 14px; font-size: 18px !important; }
textarea.adm-in { resize: vertical; font-size: 15px; }
/* a phone held upright: one column - the list, then the player picked (‹ goes back) */
@media (max-width: 720px) {
  .adm { height: 100%; }
  .adm-bd { grid-template-columns: 1fr; }
  .adm .adm-r { display: none; }
  .adm.picked .adm-l { display: none; } .adm.picked .adm-r { display: flex; }
  .adm-backbtn { display: block; }
}
/* the staff card on a player's sheet (people-ui.js) */
.adm-card { background: #2b2b2b; color: #fff; border-radius: 16px; padding: 12px; margin-bottom: 10px; font: 700 14px var(--ui, system-ui); }
.adm-card > div:first-child { display: flex; flex-direction: column; gap: 3px; margin-bottom: 10px; }
.adm-card strong { font-size: 17px; }
.adm-cbtns { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.adm-cbtns button { border: 0; border-radius: 6px; background: #f1c40f; color: #222; padding: 9px 4px; font: 800 13px var(--ui, system-ui); cursor: pointer; }
/* the free camera bar */
#freecamBar { position: fixed; top: calc(env(safe-area-inset-top,0px) + 262px); left: 50%; transform: translateX(-50%); z-index: 25; display: none; align-items: center; gap: 8px; background: rgba(20,20,20,.85); color: #fff; padding: 6px 8px 6px 14px; border-radius: 999px; font: 700 14px var(--ui, system-ui); }
#freecamBar.show { display: flex; } #freecamBar b { white-space: nowrap; }
#freecamBar button { border: 0; border-radius: 999px; background: #444; color: #fff; min-width: 44px; height: 40px; font: 800 15px var(--ui, system-ui); cursor: pointer; touch-action: none; }
#freecamBar button[data-exit] { background: #e74c3c; padding: 0 14px; }
#freecamBar.watching :is([data-up], [data-down]) { display: none; } /* watching a player: the camera follows them */
body.freecam #hud, body.freecam .hud-top { opacity: .35; }
/* kicked / banned */
#removedCard { position: fixed; inset: 0; z-index: 80; display: none; align-items: center; justify-content: center; background: rgba(6,10,20,.7); padding: 16px; }
#removedCard.open { display: flex; }
#removedCard > div { width: min(340px, 100%); background: #fff; border-radius: 24px; padding: 20px; text-align: center; font-family: var(--ui); display: flex; flex-direction: column; gap: 6px; }
#removedCard b { font-size: 38px; } #removedCard strong { font: 800 17px var(--ui); color: #16243a; } #removedCard span { font: 500 13.5px/1.4 var(--ui); color: #4d5c72; }
#removedCard button { margin-top: 8px; border: 0; border-radius: 999px; padding: 13px; font: 800 15px var(--ui); background: var(--brand, #1f6fe5); color: #fff; cursor: pointer; }
/* the 🛡️ Team app: a report's chat with the team; the 🚩 Report form on a player's sheet */
.tm-thread { display: flex; flex-direction: column; gap: 6px; padding: 4px 4px 12px; }
.tm-msg { align-self: flex-start; max-width: 85%; background: var(--soft, #eef2f7); border-radius: 14px; padding: 8px 12px; font: 500 14px/1.35 var(--ui); display: flex; flex-direction: column; gap: 2px; }
.tm-msg.me { align-self: flex-end; background: #dbeafe; }
.tm-msg b { font-size: 12px; } .tm-msg time { font-size: 10.5px; color: #888; align-self: flex-end; }
.tm-thread textarea, .ppl-ab { width: 100%; box-sizing: border-box; border: 1px solid #d5dbe5; border-radius: 12px; padding: 10px; font: 500 16px var(--ui); }
.ppl-small button.on { background: #f1c40f; }
.tm-form label { display: block; margin: 14px 0 6px; font: 700 14px var(--ui); color: var(--ink, #16243a); }
.tm-form input, .tm-form textarea { display: block; width: 100%; box-sizing: border-box; border: 1px solid #d5dbe5; border-radius: 12px; padding: 10px 12px; font: 500 16px var(--ui); background: #fff; color: var(--ink, #16243a); }
.tm-form input { max-width: 120px; }
.tm-form .tile { margin-top: 14px; }
.tm-form .primary { margin-top: 12px; }
.tm-check { width: 28px; height: 28px; border-radius: 8px; border: 2px solid #b8c2d3; display: inline-flex !important; align-items: center; justify-content: center; font: 900 18px var(--ui) !important; color: #fff; flex: none; }
.tm-check.on { background: #1f6fe5; border-color: #1f6fe5; }