/* PIMPAMPUM team backoffice — CRT/terminal, verde fósforo sobre #050505 (estética de marca) */
:root {
  --bg: #050505;
  --panel: #0a0f0a;
  --green: #39ff88;
  --green-dim: #1d7a46;
  --text: #c8ffe0;
  --dim: #5c8a6e;
  --red: #ff4d6d;
  --border: #123a24;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
body {
  background: var(--bg);
  color: var(--text);
  font-family: "Space Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;
  font-size: 14px;
  letter-spacing: .02em;
}

/* scanlines CRT */
#crt {
  pointer-events: none; position: fixed; inset: 0; z-index: 9;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,.18) 0 1px, transparent 1px 3px);
  mix-blend-mode: multiply;
}

.hidden { display: none !important; }
.dim { color: var(--dim); }
.error { color: var(--red); margin-top: .6em; }
.banner {
  background: #201500; color: #ffb020; border-bottom: 1px solid #5a3c00;
  padding: .45em 1em; text-align: center;
}

/* glitch/aberración RGB del título */
.glitch { position: relative; color: var(--green); text-shadow: 0 0 8px rgba(57,255,136,.55); }
.glitch::before, .glitch::after {
  content: attr(data-text); position: absolute; inset: 0; overflow: hidden;
}
.glitch::before { color: #ff3355; transform: translate(-1px, 0); opacity: .45; }
.glitch::after  { color: #33aaff; transform: translate(1px, 0);  opacity: .45; }

/* login */
#login-view { display: flex; align-items: center; justify-content: center; min-height: 100vh; }
.login-box {
  width: min(360px, 92vw); padding: 2em; border: 1px solid var(--border);
  background: var(--panel); box-shadow: 0 0 30px rgba(57,255,136,.08);
}
.login-box h1 { font-size: 1.6em; text-align: center; }
.login-sub { text-align: center; color: var(--dim); margin: .3em 0 1.6em; font-size: .8em; }
.login-box label { display: block; color: var(--dim); font-size: .75em; margin-bottom: 1em; }
input {
  width: 100%; margin-top: .35em; padding: .55em .6em;
  background: #020a05; border: 1px solid var(--border); color: var(--text);
  font: inherit; outline: none;
}
input:focus { border-color: var(--green-dim); box-shadow: 0 0 6px rgba(57,255,136,.25); }
button {
  font: inherit; cursor: pointer; padding: .5em 1em;
  background: transparent; color: var(--green); border: 1px solid var(--green-dim);
}
button:hover { background: rgba(57,255,136,.12); text-shadow: 0 0 6px rgba(57,255,136,.6); }
.login-box button { width: 100%; margin-top: .4em; }

/* app shell */
header {
  display: flex; align-items: center; gap: 1.5em; flex-wrap: wrap;
  padding: .8em 1.2em; border-bottom: 1px solid var(--border); background: var(--panel);
}
.brand { font-weight: bold; }
#tabs { display: flex; gap: .4em; flex: 1; }
.tab { border-color: transparent; color: var(--dim); }
.tab.active { border-color: var(--green-dim); color: var(--green); text-shadow: 0 0 6px rgba(57,255,136,.5); }
.who { color: var(--dim); font-size: .85em; display: flex; gap: .8em; align-items: center; }
main { padding: 1.4em; max-width: 1100px; margin: 0 auto; }
.panel h2 { color: var(--green); font-size: 1.05em; margin-bottom: 1em; text-shadow: 0 0 8px rgba(57,255,136,.4); }

/* supply control */
.supply-bar { display: flex; justify-content: space-between; align-items: flex-end; gap: 1em; flex-wrap: wrap; margin-bottom: 1em; }
.tiles { display: flex; gap: .6em; flex-wrap: wrap; }
.tile { border: 1px solid var(--border); background: var(--panel); padding: .6em 1em; min-width: 7.5em; }
.tile-v { color: var(--green); font-size: 1.25em; text-shadow: 0 0 8px rgba(57,255,136,.4); }
.tile-l { color: var(--dim); font-size: .7em; margin-top: .2em; }
.supply-actions { display: flex; align-items: center; gap: .8em; font-size: .8em; }
#supply-table { width: 100%; border-collapse: collapse; }
#supply-table th, #supply-table td { text-align: left; padding: .45em .7em; border-bottom: 1px solid var(--border); white-space: nowrap; }
#supply-table th { color: var(--dim); font-size: .75em; background: var(--panel); }
#supply-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
#supply-table tr.known td { background: rgba(57,255,136,.05); }
#supply-table a { color: var(--dim); text-decoration: none; font-size: .85em; }
#supply-table a:hover { color: var(--green); }
.who-name { color: var(--green); }
.who-nick { color: var(--dim); font-size: .85em; margin-left: .4em; }

/* tarta de supply */
.chart-box { border: 1px solid var(--border); background: var(--panel); padding: 1em; margin-bottom: 1em; }
.chart-head { margin-bottom: .8em; }
select { font: inherit; background: #020a05; color: var(--text); border: 1px solid var(--border); padding: .4em .6em; }
.chart-row { display: flex; gap: 1.5em; align-items: center; flex-wrap: wrap; }
#sc-pie path, #sc-pie circle { stroke: var(--bg); stroke-width: 1; }
#sc-legend { display: flex; flex-direction: column; gap: .3em; font-size: .8em; max-height: 240px; overflow-y: auto; }
.leg { display: flex; align-items: center; gap: .5em; }
.leg-sw { width: .8em; height: .8em; flex: none; border-radius: 2px; }
.leg-pct { color: var(--dim); margin-left: auto; padding-left: 1em; font-variant-numeric: tabular-nums; }

/* EXIT · FRIENDS+FAMILY DUMP (modo "exit" del desplegable de la tarta) */
.sc-exit { margin-top: 1.2em; border-top: 1px solid var(--border); padding-top: 1em; }
.exit-head { color: var(--dim); font-size: .75em; letter-spacing: .08em; margin-bottom: .7em; }
.exit-sub { font-size: .72em; color: var(--dim); text-shadow: none; margin-top: .1em; }
.exit-table { width: 100%; border-collapse: collapse; margin-top: 1em; }
.exit-table th, .exit-table td { text-align: left; padding: .4em .7em; border-bottom: 1px solid var(--border); white-space: nowrap; }
.exit-table th { color: var(--dim); font-size: .75em; }
.exit-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
.exit-foot { font-size: .75em; margin-top: .8em; line-height: 1.5; }

/* system */
table.kv td { padding: .35em .9em .35em 0; }
table.kv td:first-child { color: var(--dim); }

/* tags y edición inline */
.table-wrap { overflow-x: auto; border: 1px solid var(--border); }
.tag {
  display: inline-flex; align-items: center; gap: .3em; margin: .1em .2em .1em 0;
  padding: .1em .5em; border: 1px solid var(--green-dim); border-radius: 2px;
  font-size: .75em; color: var(--green); background: rgba(57,255,136,.06);
}
.tag b { cursor: pointer; color: var(--dim); font-weight: normal; }
.tag b:hover { color: var(--red); }
button.copy, button.mini, button.tag-plus {
  padding: 0 .35em; margin-left: .4em; font-size: .8em; line-height: 1.4;
  border-color: var(--border); color: var(--dim);
}
button.copy:hover, button.mini:hover, button.tag-plus:hover { color: var(--green); border-color: var(--green-dim); }
#tag-menu {
  position: absolute; z-index: 20; max-width: 20em;
  background: var(--panel); border: 1px solid var(--green-dim); padding: .6em;
  box-shadow: 0 0 18px rgba(57,255,136,.15);
}
.tag-menu-list { display: flex; flex-wrap: wrap; gap: .25em; margin-bottom: .5em; }
.tag-menu-list:empty { display: none; }
.tag.clickable { cursor: pointer; }
.tag.clickable:hover { filter: brightness(1.4); }
#tag-menu input { width: 100%; margin-top: 0; padding: .3em .4em; font-size: .85em; }
.who-edit { width: 8em !important; margin: 0 .3em 0 0 !important; padding: .3em .4em; }

/* form admin: añadir known_account (aunque no tenga supply aun) */
.add-known { display: flex; gap: .5em; flex-wrap: wrap; align-items: center; margin: 0 0 1em; }
.add-known #ak-wallet { min-width: 320px; font-family: monospace; }
.add-known .dim { font-size: .85em; }
/* fees (admin): una card por token, un tile por contrato con su botón de claim */
.fees-bar { display: flex; justify-content: space-between; align-items: center; gap: 1em; flex-wrap: wrap; margin-bottom: .6em; }
.fees-wallet { display: flex; align-items: center; gap: .8em; font-size: .85em; flex-wrap: wrap; }
.fees-note { font-size: .8em; margin-bottom: 1em; max-width: 70em; }
.fees-card { border: 1px solid var(--border); background: var(--panel); padding: 1em; margin-bottom: 1em; }
.fees-card-head { margin-bottom: .8em; font-size: .9em; }
.fees-card-head b { color: var(--green); margin-right: .6em; }
.fees-card a { color: var(--dim); text-decoration: none; }
.fees-card a:hover { color: var(--green); }
.fees-tile { min-width: 16em; display: flex; flex-direction: column; gap: .15em; }
.fees-claim { margin-top: .6em; align-self: flex-start; }
.fees-claim:disabled { opacity: .35; cursor: not-allowed; text-shadow: none; }
.fees-claim:disabled:hover { background: transparent; }
.fees-log { font-size: .75em; color: var(--dim); white-space: pre-wrap; max-height: 14em; overflow-y: auto; }
.fees-log:empty { display: none; }

/* enlace "open in new tab" de las tarjetas */
.ad-open { color: var(--dim); font-size: .8em; text-decoration: none; margin-left: .4em; }
.ad-open:hover { color: var(--green); }
/* known_wallets sin supply on-chain: atenuadas */
#supply-table tr.no-supply { opacity: .5; }
#supply-table tr.no-supply td { font-style: italic; }

/* bots (admin): bot manager — formulario alta/edición + listado agrupado por tipo */
.bot-form { border: 1px solid var(--green-dim); background: var(--panel); padding: 1em; margin-bottom: 1.2em; box-shadow: 0 0 18px rgba(57,255,136,.08); }
.bot-form-head { margin-bottom: .8em; }
.bot-form-head b { color: var(--green); }
.bot-form-row { margin-bottom: .9em; }
.bot-form-row label { color: var(--dim); font-size: .85em; }
.bot-form-row select { margin-left: .5em; }
.bot-cfg-label { font-size: .75em; margin-bottom: .4em; }
.bot-cfg { border-collapse: collapse; width: 100%; max-width: 60em; margin-bottom: .5em; }
.bot-cfg th { color: var(--dim); font-size: .7em; text-align: left; padding: .3em .5em; border-bottom: 1px solid var(--border); }
.bot-cfg td { padding: .25em .5em; vertical-align: middle; }
.bot-cfg input, .bot-cfg select { margin-top: 0; padding: .3em .45em; font-size: .9em; }
.bot-cfg td.k { width: 16em; }
.bot-cfg td.t { width: 8em; }
.bot-cfg td.x { width: 2em; }
.bot-cfg input.bad { border-color: var(--red); }
.bot-form-actions { display: flex; gap: .6em; align-items: center; font-size: .85em; }
.bot-group { border: 1px solid var(--border); background: var(--panel); margin-bottom: 1em; }
.bot-group-head { padding: .6em 1em; border-bottom: 1px solid var(--border); color: var(--green); font-size: .9em; text-shadow: 0 0 6px rgba(57,255,136,.4); }
.bot-group-head .dim { margin-left: .6em; font-size: .85em; text-shadow: none; }
.bot-table { width: 100%; border-collapse: collapse; }
.bot-table th, .bot-table td { text-align: left; padding: .45em .9em; border-bottom: 1px solid var(--border); vertical-align: top; }
.bot-table th { color: var(--dim); font-size: .75em; }
.bot-table td.num { width: 4em; font-variant-numeric: tabular-nums; color: var(--dim); }
.bot-table td.acts { white-space: nowrap; width: 10em; }
.bot-table tr:last-child td { border-bottom: 0; }
.bot-empty { padding: .8em 1em; color: var(--dim); font-size: .85em; }
.cfg-kv { display: inline-block; margin: .1em .6em .1em 0; font-size: .8em; }
.cfg-kv b { color: var(--dim); font-weight: normal; }
.cfg-kv span { color: var(--text); }
.cfg-active { width: auto; margin: 0 0 0 .1em; vertical-align: middle; accent-color: var(--green); cursor: pointer; }
.cfg-active:disabled { cursor: wait; opacity: .5; }
.bot-table th.bal, .bot-table td.bal { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; width: 8em; }
/* trades de bots: filtros + tabla (dentro de un .bot-group) */
.bt-filters { display: flex; gap: 1em; align-items: center; padding: .6em 1em; border-bottom: 1px solid var(--border); font-size: .8em; color: var(--dim); }
.bt-filters select { margin-left: .4em; padding: .25em .4em; font-size: .95em; max-width: 14em; }
#bot-trades .table-wrap { border: 0; }
#bot-trades .bot-table td { white-space: nowrap; }
#bot-trades .bot-table a { color: var(--dim); text-decoration: none; }
#bot-trades .bot-table a:hover { color: var(--green); }
.bt-err { color: var(--red); font-size: .75em; white-space: normal; max-width: 24em; }
#bot-trades .error { padding: 0 1em .6em; }
.bot-env { margin-left: auto; float: right; font-size: .8em; text-shadow: none; }
.bank-badge { color: var(--text); }
.bank-badge.on { color: var(--red); font-weight: bold; text-shadow: 0 0 6px rgba(255,77,109,.5); }
/* iconos de coin en cabeceras de saldos */
.coin { width: 14px; height: 14px; vertical-align: -3px; margin-right: .4em; border-radius: 50%; }

/* xcampaign (admin): asistente de replies en X. Subtabs, tiles de estado, INBOX de candidatos, CRUD de variantes, form de config */
.xc-sub { display: flex; gap: .4em; align-items: center; margin-bottom: 1em; flex-wrap: wrap; }
.xc-tab { border-color: transparent; color: var(--dim); padding: .35em .8em; }
.xc-tab.active { border-color: var(--green-dim); color: var(--green); text-shadow: 0 0 6px rgba(57,255,136,.5); }
.xc-count { display: inline-block; min-width: 1.4em; padding: 0 .3em; margin-left: .2em; border: 1px solid #ffb020; color: #ffb020; font-size: .75em; text-align: center; }
.xc-count:empty { display: none; }
.xc-refresh { margin-left: auto; font-size: .8em; }
.xc-banner { margin-bottom: 1em; border: 1px solid #5a3c00; }
.xc-banner.bad { background: #200008; color: var(--red); border-color: #5a0018; text-shadow: 0 0 6px rgba(255,77,109,.5); }
.xc-tile { min-width: 10em; }
.xc-actions { display: flex; gap: .6em; align-items: center; flex-wrap: wrap; margin: 1em 0 .4em; font-size: .9em; }
.xc-switch { font-size: 1em; }
.xc-amt { width: 8em !important; margin: 0 !important; padding: .35em .5em; }
.xc-note { width: 16em !important; margin: 0 !important; padding: .35em .5em; }
.xc-msg { font-size: .85em; }
.xc-statusmsg { margin: .8em 0; font-size: .85em; }
.xc-query { font-size: .8em; margin: .6em 0; word-break: break-word; }
.xc-query code { color: var(--text); }
.xc-note-rules { font-size: .75em; margin-top: 1em; max-width: 70em; }
/* INBOX */
.xc-card { border: 1px solid var(--border); background: var(--panel); padding: .8em 1em; margin-bottom: .8em; }
.xc-card.xc-done { opacity: .45; }
.xc-card-head { font-size: .85em; margin-bottom: .5em; display: flex; flex-wrap: wrap; gap: .2em; align-items: baseline; }
.xc-card-head .ad-open { margin-left: auto; }
.xc-handle { color: var(--green); text-decoration: none; }
.xc-handle:hover { text-shadow: 0 0 6px rgba(57,255,136,.6); }
.xc-post { white-space: pre-wrap; word-break: break-word; padding: .5em .7em; border-left: 2px solid var(--green-dim); background: #020a05; margin-bottom: .6em; }
.xc-reply-row { display: flex; gap: .8em; align-items: center; margin: .4em 0; font-size: .85em; }
.xc-variant { max-width: 100%; }
textarea.xc-reply { width: 100%; padding: .5em .6em; background: #020a05; border: 1px solid var(--border); color: var(--text); font: inherit; outline: none; resize: vertical; }
textarea.xc-reply:focus { border-color: var(--green-dim); box-shadow: 0 0 6px rgba(57,255,136,.25); }
.xc-counter { font-variant-numeric: tabular-nums; }
.xc-card-actions { display: flex; gap: .6em; align-items: center; margin-top: .5em; }
.xc-reply-btn:disabled { opacity: .35; cursor: not-allowed; text-shadow: none; }
.xc-reply-btn:disabled:hover { background: transparent; }
/* VARIANTS */
.xc-vtable td.xc-vtext { white-space: normal; max-width: 40em; word-break: break-word; }
tr.xc-inactive td { opacity: .5; }
/* CONFIG */
.xc-form { display: grid; grid-template-columns: repeat(auto-fill, minmax(22em, 1fr)); gap: .6em 1.2em; margin-bottom: 1em; }
.xc-section { grid-column: 1 / -1; color: var(--green); font-size: .8em; margin-top: .8em; padding-bottom: .3em; border-bottom: 1px solid var(--border); text-shadow: 0 0 6px rgba(57,255,136,.4); }
.xc-field { display: block; font-size: .8em; }
.xc-label { display: block; color: var(--dim); }
.xc-help { display: block; font-size: .85em; opacity: .8; }
.xc-field textarea { width: 100%; margin-top: .35em; padding: .45em .6em; background: #020a05; border: 1px solid var(--border); color: var(--text); font: inherit; resize: vertical; }
.xc-field select { width: 100%; margin-top: .35em; }
.xc-preview { border: 1px solid var(--green-dim); background: var(--panel); padding: .6em 1em; font-size: .85em; margin-bottom: .6em; }
.xc-preview b { color: var(--green); }
/* LOG */
.xc-logsum { font-size: .8em; margin-bottom: .8em; }
.xc-cell { white-space: normal !important; max-width: 28em; word-break: break-word; }
.xc-inline { display: inline; padding: 0; border: 0; margin-left: .6em; }
.xc-mtiles { margin-top: .6em; }
.xc-metrics { white-space: nowrap; font-variant-numeric: tabular-nums; }
.xc-badge { font-size: .7em; margin-top: .35em; letter-spacing: .08em; font-weight: bold; }
.xc-postm { color: #ffb020; }
.xc-pace { font-variant-numeric: tabular-nums; margin-right: .6em; }

/* xcampaign PURGE */
.xc-ptable td.xc-cell { max-width: 34em; }
.xc-ptable td { white-space: nowrap; }

/* xcampaign WATCH: tiras de estado (una celda por cubo de tiempo) */
.xc-striprow { display: flex; align-items: center; gap: .8em; padding: .5em 1em; font-size: .8em; }
.xc-striprow .dim { min-width: 8em; }
.xc-strip { display: flex; gap: 1px; flex: 1; height: 18px; }
.xc-strip i { flex: 1; min-width: 1px; border-radius: 1px; }