/* =====================================================================
   Gwop — admin panel (screens 'admin' and 'admin-user', see admin.js)
   ===================================================================== */
.adm { min-width: 0; }
.adm .panel { min-width: 0; }
.adm .panel h3 small { font-size: 13px; font-weight: 600; }
.adm-head { display: flex; align-items: center; gap: 12px; min-width: 0; }
.mono { font-variant-numeric: tabular-nums; font-feature-settings: "tnum"; letter-spacing: .01em; }
.adm .red { color: #ff5c7a; }

/* tabs */
.adm-tabs { display: flex; flex-wrap: wrap; gap: 4px; padding: 4px; margin-bottom: 14px; border-radius: 14px; background: var(--panel); }
.adm-tabs button { position: relative; flex: 1 1 auto; height: 36px; padding: 0 14px; border-radius: 10px; font-weight: 700; font-size: 13px; color: var(--muted); white-space: nowrap; transition: background .15s, color .15s; }
.adm-tabs button:hover { color: var(--ink); }
.adm-tabs button.on { background: var(--red-grad); color: #fff; }
.adm-tdot { position: absolute; top: 6px; right: 6px; width: 7px; height: 7px; border-radius: 50%; background: var(--red); box-shadow: 0 0 0 2px var(--panel); }
.adm-tabs button.on .adm-tdot { background: #fff; box-shadow: none; }
@media (max-width: 520px) {
  .adm-tabs { display: grid; grid-template-columns: repeat(3, 1fr); }
  .adm-tabs button { padding: 0 6px; }
}

/* toolbar: search, selects */
.adm-tools { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.adm-search { flex: 1 1 220px; min-width: 0; display: flex; align-items: center; gap: 8px; height: 42px; padding: 0 12px; border-radius: 12px; background: var(--panel); color: var(--muted); border: 1px solid transparent; }
.adm-search:focus-within { border-color: rgba(var(--red-rgb), .6); }
.adm-search .ic { width: 18px; height: 18px; }
.adm-search input { flex: 1; width: 0; min-width: 0; height: 100%; border: 0; outline: 0; background: none; color: var(--ink); font-weight: 600; font-size: 14px; }
.adm-search input::placeholder { color: var(--dim); font-weight: 500; }
.adm-search input::-webkit-search-cancel-button { filter: invert(1) opacity(.5); }
.adm-select { flex: 0 1 auto; min-width: 0; max-width: 100%; height: 42px; padding: 0 34px 0 12px; border-radius: 12px; border: 1px solid transparent; outline: 0; background: var(--panel); color: var(--ink);
  font: inherit; font-weight: 700; font-size: 14px; cursor: pointer; appearance: none; -webkit-appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);
  background-position: calc(100% - 17px) 18px, calc(100% - 12px) 18px; background-size: 5px 5px; background-repeat: no-repeat; }
.adm-select:focus { border-color: rgba(var(--red-rgb), .6); }
.adm-select option { background: var(--panel-2); color: var(--ink); }
.adm-tools .btn { height: 42px; }

.adm-hint { display: flex; align-items: center; gap: 6px; margin: -4px 0 10px; font-size: 12px; font-weight: 600; color: var(--dim); }
.adm-hint .ic { width: 14px; height: 14px; }
.adm-sec { margin: 18px 0 8px; font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.adm-sec:first-of-type { margin-top: 4px; }

/* big number cards */
.adm-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.adm-grid .skeleton { height: 86px; margin: 0; }
@media (max-width: 420px) { .adm-grid { grid-template-columns: 1fr 1fr; } }
.adm-stat { min-width: 0; padding: 14px 16px; border-radius: var(--r); background: var(--panel); }
.adm-stat small { display: block; font-size: 12px; font-weight: 700; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.adm-stat b { display: block; margin-top: 4px; font-size: 26px; font-weight: 800; letter-spacing: -.02em; line-height: 1.1; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.adm-stat span { display: block; margin-top: 2px; font-size: 12px; color: var(--dim); font-weight: 600; }
.adm-stat.green b { color: var(--green); }
.adm-stat.gold b { color: var(--gold); }
.adm-stat.red b { color: #ff5c7a; }
@media (max-width: 420px) { .adm-stat { padding: 12px; } .adm-stat b { font-size: 21px; } }

.adm-two { display: grid; gap: 12px; margin-top: 12px; }
.adm-two > .panel { min-width: 0; }
@media (min-width: 860px) { .adm-two { grid-template-columns: 1fr 1fr; align-items: start; } }

/* 14-day bars */
.adm-bars { display: flex; align-items: stretch; gap: 4px; height: 170px; padding-top: 16px; }
.adm-bars .b { position: relative; flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; }
.adm-bars i { display: block; width: 100%; max-width: 30px; border-radius: 5px 5px 2px 2px; background: var(--red-grad); transition: filter .15s; }
.adm-bars.gold i { background: linear-gradient(180deg, #ffd27a, #c98a24); }
.adm-bars .b:hover i { filter: brightness(1.3); }
.adm-bars .b > span { flex: none; margin-top: 6px; font-size: 10.5px; font-weight: 700; color: var(--dim); font-variant-numeric: tabular-nums; }
.adm-bars em { flex: none; margin-bottom: 3px; font-style: normal; font-size: 9.5px; font-weight: 700; color: var(--muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
.adm-bars .b:last-child > span { color: var(--ink); }
/* values above every bar only where they fit */
@media (max-width: 1180px) { .adm-bars em { display: none; } }
.adm-bars .b:hover em { display: block; position: absolute; bottom: calc(100% - 14px); z-index: 2; padding: 2px 6px; border-radius: 6px; background: var(--panel-3); color: var(--ink); }

/* tables (scroll inside their own box on narrow screens) */
.adm-flat { padding: 6px 4px; }
.adm-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }
.adm-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.adm-table th { padding: 8px 10px; text-align: left; font-size: 11.5px; font-weight: 700; color: var(--dim); text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; border-bottom: 1px solid var(--line); }
.adm-table td { padding: 9px 10px; vertical-align: middle; border-bottom: 1px solid var(--line-soft); }
.adm-table tbody tr:last-child td { border-bottom: 0; }
.adm-table tfoot td { border-top: 1px solid var(--line); border-bottom: 0; font-weight: 800; }
.adm-table .n { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.adm-table .nw { white-space: nowrap; }
.adm-table .note { color: var(--muted); font-size: 12.5px; min-width: 160px; max-width: 320px; overflow-wrap: anywhere; }
.adm-table tr.click { cursor: pointer; transition: background .12s; }
.adm-table tr.click:hover { background: var(--panel-2); }
.adm-table .amount { font-weight: 700; }
.panel .adm-table { min-width: 100%; }
.adm-flat .adm-table { min-width: 640px; }
.adm-two .adm-table { min-width: 420px; }

.adm-who { display: flex; align-items: center; gap: 10px; min-width: 0; }
.adm-who .nm { min-width: 0; }
.adm-who .nm b { display: flex; align-items: center; gap: 6px; font-size: 14px; white-space: nowrap; }
.adm-who .nm small { display: block; color: var(--muted); font-size: 12px; white-space: nowrap; }
.adm-who.big { gap: 14px; }
.adm-who.big .nm b { font-size: 20px; white-space: normal; overflow-wrap: anywhere; }
.adm-who.big .nm small { font-size: 13px; margin-top: 2px; }
.adm-who .tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.adm-dot { display: inline-block; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 8px var(--green); }
.adm-badge { display: inline-flex; align-items: center; height: 20px; padding: 0 7px; border-radius: 6px; font-size: 11px; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; background: rgba(255, 255, 255, .08); color: var(--muted); white-space: nowrap; }
.adm-badge.red { background: rgba(var(--red-rgb), .16); color: #ff5c7a; }
.adm-badge.gold { background: rgba(var(--gold-rgb), .14); color: var(--gold); }
.adm-link { display: inline; padding: 0; color: var(--ink); font-weight: 700; text-decoration: underline; text-decoration-color: rgba(255, 255, 255, .25); text-underline-offset: 3px; cursor: pointer; text-align: left; overflow-wrap: anywhere; }
.adm-link:hover { color: var(--red); text-decoration-color: currentColor; }
.adm-link.left { color: var(--muted); text-decoration-style: dashed; }

.adm-pager { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px; margin-top: 12px; font-size: 13px; font-weight: 600; color: var(--muted); }
.adm-pager .btn .ic { width: 16px; height: 16px; }

/* online users */
.adm-online-list { display: grid; gap: 2px; max-height: 420px; overflow-y: auto; margin: 0 -6px; }
.adm-online { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px 6px; border-radius: 12px; text-align: left; }
.adm-online:hover { background: var(--panel-2); }
.adm-online .nm { flex: 1; min-width: 0; }
.adm-online .nm b { display: block; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.adm-online .nm small { display: block; color: var(--muted); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.adm-online .pill { background: var(--panel-2); flex: none; }

/* live tables */
.adm-tables { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 10px; }
@media (max-width: 420px) { .adm-tables { grid-template-columns: 1fr; } }
.adm-tcard { display: flex; flex-direction: column; gap: 10px; min-width: 0; padding: 14px; border-radius: var(--r-lg); background: var(--panel); }
.adm-tcard .top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.adm-tcard .top b { font-size: 17px; }
.adm-tcard .top .pill { background: var(--panel-2); }
.adm-tcard .top .id { margin-left: auto; font-size: 12px; font-weight: 700; }
.adm-tcard .desc { font-size: 12.5px; margin-top: -4px; }
.adm-tcard .nums { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.adm-tcard .nums div { min-width: 0; padding: 8px; border-radius: 10px; background: var(--panel-2); }
.adm-tcard .nums small { display: block; font-size: 11px; font-weight: 700; color: var(--dim); }
.adm-tcard .nums b { display: block; font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
.adm-tcard .who { display: flex; flex-wrap: wrap; gap: 6px 12px; font-size: 13.5px; }
.adm-tcard .btn { margin-top: auto; }

/* anti-cheat */
.adm-sevsum { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.adm-sevsum span { padding: 6px 12px; border-radius: 10px; background: var(--panel); font-size: 13px; font-weight: 700; }
.adm-sevsum .sev-high { color: #ff5c7a; }
.adm-sevsum .sev-medium { color: var(--gold); }
.adm-sevsum .sev-low { color: var(--muted); }
.adm-flags { display: grid; gap: 8px; }
.adm-flag { --c: var(--muted); min-width: 0; padding: 12px 14px 12px 16px; border-radius: var(--r); background: var(--panel); box-shadow: inset 3px 0 0 var(--c); }
.panel .adm-flag { background: var(--panel-2); }
.adm-flag.sev-high { --c: #ff4d6a; background: linear-gradient(90deg, rgba(var(--red-rgb), .1), transparent 60%), var(--panel); }
.panel .adm-flag.sev-high { background: linear-gradient(90deg, rgba(var(--red-rgb), .1), transparent 60%), var(--panel-2); }
.adm-flag.sev-medium { --c: var(--gold); }
.adm-flag.sev-low { --c: var(--dim); }
.adm-flag .top { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; margin-bottom: 6px; font-size: 12px; font-weight: 700; color: var(--muted); }
.adm-flag .sev { padding: 2px 7px; border-radius: 6px; color: var(--c); background: rgba(255, 255, 255, .06); text-transform: uppercase; letter-spacing: .04em; font-size: 11px; font-weight: 800; }
.adm-flag .cnt { color: var(--ink); }
.adm-flag .when { margin-left: auto; color: var(--dim); }
.adm-flag > b { display: block; font-size: 15px; overflow-wrap: anywhere; }
.adm-flag p { margin: 4px 0 0; font-size: 13px; color: var(--muted); overflow-wrap: anywhere; }
.adm-flag .who { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.adm-uchip { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; min-width: 0; padding: 3px 3px 3px 10px; border-radius: 10px; background: var(--panel-3); font-size: 13px; }
.adm-uchip .adm-link { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.adm-uchip > .muted { font-size: 11.5px; }
.adm-uchip .ban { flex: none; height: 24px; padding: 0 8px; border-radius: 7px; background: rgba(var(--red-rgb), .16); color: #ff5c7a; font-size: 11.5px; font-weight: 800; }
.adm-uchip .ban:hover { background: rgba(var(--red-rgb), .3); }

/* ledger sums */
.adm-sums { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 6px; margin-bottom: 12px; }
.adm-sums div { min-width: 0; padding: 10px 12px; border-radius: 12px; background: var(--panel); }
.adm-sums small { display: block; font-size: 11.5px; font-weight: 700; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.adm-sums .amount { font-size: 15px; }
.adm-sums .all { box-shadow: inset 0 0 0 1px var(--line); }

/* player card */
.adm-card { display: grid; gap: 12px; }
@media (min-width: 900px) { .adm-card { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; } }
.adm-col { display: grid; gap: 12px; min-width: 0; }
.adm-hero { display: grid; gap: 14px; }
.adm-ban-note { padding: 10px 12px; border-radius: 12px; background: rgba(var(--red-rgb), .1); color: #ffb3c0; font-size: 13.5px; overflow-wrap: anywhere; }
.adm-ban-note b { color: #ff5c7a; }
.adm-acts { display: flex; flex-wrap: wrap; gap: 8px; }
.adm-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.adm-field { min-width: 0; padding: 10px 12px; border-radius: 12px; background: var(--panel-2); }
.adm-field small { display: block; font-size: 11.5px; font-weight: 700; color: var(--dim); }
.adm-field b { display: block; margin-top: 2px; font-size: 14.5px; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.adm-row { display: flex; align-items: center; gap: 10px; width: 100%; padding: 9px 0; text-align: left; }
.adm-row + .adm-row { border-top: 1px solid var(--line-soft); }
.adm-row .nm { flex: 1; min-width: 0; }
.adm-row .nm b { display: block; font-size: 14px; overflow-wrap: anywhere; }
.adm-row .nm small { display: block; color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
.adm-row > .amount { flex: none; }
.adm-row.click { cursor: pointer; border-radius: 10px; }
.adm-row.click:hover { background: var(--panel-2); }
.adm-row.click .ic { color: var(--dim); width: 16px; height: 16px; }
.adm-when { flex: none; text-align: right; font-size: 12.5px; }
.adm-when span { display: block; font-weight: 600; }
.adm-when small { display: block; font-size: 11.5px; }

/* dialogs */
.modal.adm-modal { width: min(460px, 100%); }
.adm-form { display: grid; gap: 10px; margin-top: 16px; }
.adm-form .chips { justify-content: center; }
.adm-form .chip { height: 32px; font-size: 13px; }
.adm-form textarea, .adm-input-plain { width: 100%; padding: 12px; border-radius: 12px; border: 1px solid transparent; outline: 0; background: var(--panel-2); color: var(--ink); font: inherit; font-size: 14px; resize: vertical; }
.adm-form textarea:focus, .adm-input-plain:focus, .adm-input:focus-within { border-color: rgba(var(--red-rgb), .6); }
.adm-input { display: flex; align-items: center; gap: 6px; height: 52px; padding: 0 14px; border-radius: 12px; border: 1px solid transparent; background: var(--panel-2); }
.adm-input span { color: var(--muted); font-weight: 800; font-size: 20px; }
.adm-input input { flex: 1; width: 0; min-width: 0; height: 100%; border: 0; outline: 0; background: none; color: var(--ink); font-weight: 800; font-size: 22px; font-variant-numeric: tabular-nums; }
.adm-seg { display: grid; grid-template-columns: 1fr 1fr; background: var(--panel-2); }
.adm-form-hint { min-height: 18px; text-align: center; font-size: 13px; font-weight: 600; color: var(--muted); }

/* the full-screen toggle sits in the top-right corner on wide screens: keep the header buttons clear of it */
@media (min-width: 960px) { .adm .page-head { padding-right: 54px; } }
.adm-bars i.z { background: var(--panel-3); border-radius: 2px; }

/* phones: the players / ledger / log tables become stacked rows (no sideways scrolling) */
@media (max-width: 640px) {
  .adm-flat .adm-table.adm-st { min-width: 0; }
  .adm-st thead { display: none; }
  .adm-st tbody tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 3px 12px; align-items: center; padding: 10px 10px; border-bottom: 1px solid var(--line-soft); }
  .adm-st tbody tr:last-child { border-bottom: 0; }
  .adm-st td { padding: 0; border: 0 !important; min-width: 0; }
  .adm-st td.note { max-width: none; min-width: 0; }
  .adm-st td.note:empty { display: none; }
  /* players: who | balance / profit, then games · last seen */
  .adm-users td:nth-child(1) { grid-area: 1 / 1 / 3 / 2; }
  .adm-users td:nth-child(2) { grid-area: 1 / 2; }
  .adm-users td:nth-child(4) { grid-area: 2 / 2; font-size: 12.5px; }
  .adm-users td:nth-child(3) { grid-area: 3 / 1; text-align: left; font-size: 12px; color: var(--muted); padding-left: 44px; }
  .adm-users td:nth-child(3)::before { content: "партии / победы: "; }
  .adm-users td:nth-child(5) { grid-area: 3 / 2; font-size: 12px; }
  .adm-users .adm-who .nm b, .adm-users .adm-who .nm small { overflow: hidden; text-overflow: ellipsis; }
  /* ledger: player | amount, kind | balance after, note, time */
  .adm-txt td:nth-child(2) { grid-area: 1 / 1; }
  .adm-txt td:nth-child(4) { grid-area: 1 / 2; }
  .adm-txt td:nth-child(3) { grid-area: 2 / 1; font-size: 12.5px; }
  .adm-txt td:nth-child(5) { grid-area: 2 / 2; font-size: 12px; }
  .adm-txt td:nth-child(5)::before { content: "баланс "; }
  .adm-txt td:nth-child(6) { grid-column: 1 / -1; font-size: 12px; }
  .adm-txt td:nth-child(1) { grid-column: 1 / -1; grid-row: 4; font-size: 11.5px; color: var(--dim); }
  /* audit log: action | time, target | admin, details */
  .adm-logt td:nth-child(3) { grid-area: 1 / 1; }
  .adm-logt td:nth-child(1) { grid-area: 1 / 2; font-size: 12px; text-align: right; }
  .adm-logt td:nth-child(4) { grid-area: 2 / 1; }
  .adm-logt td:nth-child(2) { grid-area: 2 / 2; font-size: 12.5px; text-align: right; }
  .adm-logt td:nth-child(2)::before { content: "админ "; color: var(--dim); font-size: 11.5px; }
  .adm-logt td:nth-child(5) { grid-column: 1 / -1; font-size: 12.5px; }
  /* per-game table: squeeze instead of scrolling */
  .adm-two .adm-table { min-width: 0; font-size: 12.5px; }
  .adm-two .adm-table th, .adm-two .adm-table td { padding: 8px 5px; }
  .adm-two .adm-table th { font-size: 10px; letter-spacing: .02em; }
}

/* payments & promo codes */
.adm-pay.open { box-shadow: inset 0 0 0 1px rgba(var(--gold-rgb), .35); }
.adm-pay .top b { font-size: 19px; font-variant-numeric: tabular-nums; }
.adm-pay-info { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.adm-pay-info div { min-width: 0; padding: 8px; border-radius: 10px; background: var(--panel-2); }
.adm-pay-info small { display: block; font-size: 11px; font-weight: 700; color: var(--dim); }
.adm-pay-info b { display: block; font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.adm-pay-details { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; padding: 10px 12px; border-radius: 10px;
  background: var(--panel-2); color: var(--ink); font-size: 13px; text-align: left; overflow-wrap: anywhere; }
.adm-pay-details .ic { flex: none; width: 16px; height: 16px; color: var(--muted); }
.adm-pay-sum { font-size: 12.5px; color: var(--muted); line-height: 1.45; }
.adm-pay-sum b { color: var(--ink); }
.adm-pay-acts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: auto; }
.adm-pay-done { font-size: 12px; margin-top: auto; }
.adm-badge.green { background: rgba(61, 220, 132, .14); color: var(--green); }
.adm-promo-form h3 { margin-bottom: 12px; }
.adm-promo-fields { display: grid; gap: 8px; margin-bottom: 8px; }
@media (min-width: 900px) { .adm-promo-fields { grid-template-columns: 1.2fr 1fr 1.3fr auto; align-items: center; } }
.adm-promo-fields .adm-input { height: 46px; }
.adm-promo-fields .adm-input input { flex: 1; width: 0; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--ink); font: inherit; font-size: 15px; }
.adm-promo-fields .adm-input-plain { height: 46px; }
.adm-promo-fields .btn { height: 46px; }
.adm-promo-form + .adm-flat { margin-top: 12px; }

/* commission bank */
.adm-house { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 12px;
  box-shadow: inset 0 0 0 1px rgba(var(--gold-rgb), .3); }
.adm-house small { display: block; font-size: 12px; font-weight: 700; color: var(--muted); }
.adm-house b { display: block; font-size: 32px; color: var(--gold); font-variant-numeric: tabular-nums; margin: 2px 0; }
.adm-house span { font-size: 12.5px; }