/* MyTag.Live — estilos base (provisórios até fechar o logótipo) */
:root {
  --bg: #0B0912;
  --card: #15111F;
  --field: #0F0C17;
  --line: #2A2338;
  --text: #F4F1FA;
  --muted: #A59FB8;
  --accent: #7C4DFF;
  --accent-hover: #6A3BF0;
  --cyan: #2EE6D6;
  --red: #FF3355;
  --ok: #34D399;
  /* cores de estado e detalhes (mudam no modo claro) */
  --ok-text: #B8F5DD; --err-text: #FFC2CC; --warn-text: #FFE7A8;
  --ok-soft: #8EF0C8; --warn-soft: #FFE08A; --err-soft: #FF9AAA;
  --lock-bg: #3A2F52; --lock-text: #E6DDFF; --group-title: #B9A8FF;
  --chart-base: #4A4060; --tip-bg: #0F0C17; --shadow: rgba(0,0,0,.4);
  --admin: #FFC83D;
  /* ícones coloridos do menu do painel */
  --ni-purple: #A98BFF; --ni-cyan: #2EE6D6; --ni-orange: #FF9A4D; --ni-lav: #C4B5FF; --ni-blue: #5CC8FF;
  --ni-green: #34D399; --ni-pink: #FF6FB5; --ni-red: #FF4D6A; --ni-gold: #FFC83D; --ni-yellow: #FFE066;
  color-scheme: dark;
}

/* Modo claro do painel: escolhido pelo utilizador ou automático (segue o sistema) */
:root[data-theme="light"] {
  --bg: #F4F2F9; --card: #FFFFFF; --field: #F7F5FC; --line: #DDD7EA;
  --text: #17131F; --muted: #625B73; --accent: #6A3BF0; --accent-hover: #5A2BDC;
  --cyan: #0B7F76; --red: #D11A3D; --ok: #13915F;
  --ok-text: #0B5E3E; --err-text: #9B1030; --warn-text: #7A5200;
  --ok-soft: #0E7A50; --warn-soft: #8A5B00; --err-soft: #B3173A;
  --lock-bg: #ECE6FF; --lock-text: #4B2DB8; --group-title: #5B35D6;
  --chart-base: #B9B1CC; --tip-bg: #FFFFFF; --shadow: rgba(40,20,80,.15);
  --admin: #A36A00;
  --ni-purple: #6A3BF0; --ni-cyan: #0B8A80; --ni-orange: #D4600F; --ni-lav: #5B35D6; --ni-blue: #0A78C2;
  --ni-green: #13915F; --ni-pink: #C8237A; --ni-red: #D11A3D; --ni-gold: #B07A00; --ni-yellow: #A68600;
  color-scheme: light;
}
@media (prefers-color-scheme: light) {
  :root[data-theme="auto"] {
    --bg: #F4F2F9; --card: #FFFFFF; --field: #F7F5FC; --line: #DDD7EA;
    --text: #17131F; --muted: #625B73; --accent: #6A3BF0; --accent-hover: #5A2BDC;
    --cyan: #0B7F76; --red: #D11A3D; --ok: #13915F;
    --ok-text: #0B5E3E; --err-text: #9B1030; --warn-text: #7A5200;
    --ok-soft: #0E7A50; --warn-soft: #8A5B00; --err-soft: #B3173A;
    --lock-bg: #ECE6FF; --lock-text: #4B2DB8; --group-title: #5B35D6;
    --chart-base: #B9B1CC; --tip-bg: #FFFFFF; --shadow: rgba(40,20,80,.15);
    --admin: #A36A00;
    --ni-purple: #6A3BF0; --ni-cyan: #0B8A80; --ni-orange: #D4600F; --ni-lav: #5B35D6; --ni-blue: #0A78C2;
    --ni-green: #13915F; --ni-pink: #C8237A; --ni-red: #D11A3D; --ni-gold: #B07A00; --ni-yellow: #A68600;
    color-scheme: light;
  }
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; min-height: 100vh; display: flex; flex-direction: column;
  background: var(--bg); color: var(--text);
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 16px; line-height: 1.5;
}
a { color: var(--cyan); }

/* Topo */
.topbar {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  width: 100%; max-width: 1080px; margin: 0 auto; padding: 16px 20px;
}
.brand {
  display: inline-flex; align-items: center; line-height: 1;
  font-weight: 800; font-size: 22px; letter-spacing: -.5px;
  color: var(--text); text-decoration: none;
}
.brand-logo { display: block; height: 1.05em; width: auto; }
.lg-t { fill: currentColor; } .lg-d { fill: var(--red); } .lg-l { fill: var(--cyan); }
.nav { display: flex; align-items: center; gap: 16px; }
.nav a { color: var(--text); text-decoration: none; font-weight: 600; }
.nav .btn { color: #fff; }
.inline { display: inline; margin: 0; }
.link {
  background: none; border: 0; padding: 8px 0; cursor: pointer;
  color: var(--muted); font: inherit; font-weight: 600;
}
.link:hover { color: var(--text); }

/* Conteúdo */
.container { flex: 1; width: 100%; max-width: 1080px; margin: 0 auto; padding: 24px 20px 48px; }
.card {
  max-width: 440px; margin: 24px auto; padding: 32px 28px;
  background: var(--card); border: 1px solid var(--line); border-radius: 20px;
}
.card.wide { max-width: 720px; }
h1 { margin: 0 0 6px; font-size: 28px; letter-spacing: -.5px; line-height: 1.2; }
.subtitle { margin: 0 0 24px; color: var(--muted); }
.muted { color: var(--muted); }

/* Formulários */
.field { margin-bottom: 18px; }
label { display: block; margin-bottom: 6px; font-size: 14px; font-weight: 600; }
input[type=email], input[type=password], input[type=text], input[type=tel], input[type=search], input[type=url], input[type=number] {
  width: 100%; min-height: 46px; padding: 12px 14px;
  background: var(--field); color: var(--text);
  border: 1px solid var(--line); border-radius: 10px; font: inherit;
}
input:focus { outline: 2px solid var(--accent); outline-offset: 1px; border-color: var(--accent); }
.hint { margin-top: 6px; font-size: 13px; color: var(--muted); }

.prefix-input {
  display: flex; align-items: stretch; overflow: hidden;
  background: var(--field); border: 1px solid var(--line); border-radius: 10px;
}
.prefix-input span { display: flex; align-items: center; padding: 0 2px 0 14px; color: var(--muted); white-space: nowrap; }
.prefix-input input { border: 0; border-radius: 0; padding-left: 2px; }
.prefix-input input:focus { outline: none; }
.prefix-input:focus-within { outline: 2px solid var(--accent); outline-offset: 1px; border-color: var(--accent); }

.field-status { min-height: 20px; margin-top: 6px; font-size: 13px; }
.field-status.ok { color: var(--ok); }
.field-status.bad { color: var(--red); }

.check { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; font-weight: 500; cursor: pointer; }
.check input { width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--accent); flex-shrink: 0; }

/* Botões */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 46px; padding: 0 20px; cursor: pointer;
  background: var(--accent); color: #fff; border: 0; border-radius: 10px;
  font: inherit; font-weight: 700; text-decoration: none;
}
.btn:hover { background: var(--accent-hover); }
.btn-block { width: 100%; }
.btn-sm { min-height: 38px; padding: 0 14px; font-size: 14px; }

/* Alertas */
.alert {
  max-width: 440px; margin: 0 auto 16px; padding: 12px 16px;
  border: 1px solid; border-radius: 12px; font-size: 14px;
}
.card .alert, .alert-warn { max-width: none; }
.alert p { margin: 0 0 10px; }
.alert ul { margin: 0; padding-left: 18px; }
.alert-success { background: rgba(52,211,153,.1); border-color: rgba(52,211,153,.4); color: var(--ok-text); }
.alert-error   { background: rgba(255,51,85,.1);  border-color: rgba(255,51,85,.45); color: var(--err-text); }
.alert-warn    { background: rgba(255,200,61,.1); border-color: rgba(255,200,61,.45); color: var(--warn-text); }

.form-foot { margin: 16px 0 0; text-align: center; font-size: 14px; color: var(--muted); }

/* Página inicial */

/* Rodapé */
.footer { padding: 24px 20px; text-align: center; font-size: 13px; color: var(--muted); }
.footer p { margin: 0; }
.langs { display: flex; justify-content: center; flex-wrap: wrap; gap: 16px; margin-bottom: 8px; }
.langs a { color: var(--muted); text-decoration: none; padding: 6px 0; }
.langs a[aria-current] { color: var(--text); font-weight: 700; }

@media (max-width: 480px) {
  .card { padding: 24px 18px; }
  .nav { gap: 12px; }
}

/* Passo 5 — login social e conta */
.social { display: grid; gap: 10px; margin-bottom: 18px; }
.btn-discord { background: #4752C4; }
.btn-discord:hover { background: #3C45A5; }
.btn-twitch { background: #772CE8; }
.btn-twitch:hover { background: #5C16C5; }
.btn-ghost { background: transparent; border: 1px solid var(--line); color: var(--text); }
.btn-ghost:hover { background: var(--field); }
.divider { display: flex; align-items: center; gap: 12px; margin: 0 0 18px; font-size: 13px; color: var(--muted); }
.divider::before, .divider::after { content: ""; flex: 1; height: 1px; background: var(--line); }
h2 { margin: 28px 0 6px; font-size: 18px; }
.providers { display: grid; gap: 10px; margin: 16px 0 0; padding: 0; list-style: none; }
.provider {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 14px 16px; background: var(--field); border: 1px solid var(--line); border-radius: 12px;
}
.provider strong { display: block; }
.provider small { color: var(--muted); }
.actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }

/* Passo 7A — separadores do painel e perfil */
.tabs {
  display: flex; gap: 4px; max-width: 720px; margin: 8px auto 0; padding: 4px;
  background: var(--card); border: 1px solid var(--line); border-radius: 14px; overflow-x: auto;
}
.tabs a {
  flex: 1; min-height: 40px; display: flex; align-items: center; justify-content: center;
  padding: 0 14px; border-radius: 10px; white-space: nowrap;
  color: var(--muted); font-weight: 600; font-size: 14px; text-decoration: none;
}
.tabs a:hover { color: var(--text); }
.tabs a[aria-current] { background: var(--accent); color: #fff; }

.label { display: block; margin-bottom: 6px; font-size: 14px; font-weight: 600; }
textarea {
  width: 100%; padding: 12px 14px; resize: vertical; min-height: 100px;
  background: var(--field); color: var(--text); border: 1px solid var(--line); border-radius: 10px; font: inherit;
}
textarea:focus { outline: 2px solid var(--accent); outline-offset: 1px; border-color: var(--accent); }

.banner-preview {
  aspect-ratio: 3 / 1; margin-bottom: 10px; overflow: hidden;
  background: var(--field); border: 1px dashed var(--line); border-radius: 12px;
}
.banner-preview img { width: 100%; height: 100%; object-fit: cover; display: block; }

.avatar-row { display: flex; align-items: center; gap: 18px; }
.avatar-preview {
  width: 96px; height: 96px; flex-shrink: 0; overflow: hidden; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--accent); border: 3px solid var(--line);
}
.avatar-preview img { width: 100%; height: 100%; object-fit: cover; }
.avatar-initial { font-size: 40px; font-weight: 800; color: #fff; }
[hidden] { display: none !important; }

.file-row { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; margin-bottom: 4px; }
.file-btn:focus-within { outline: 2px solid var(--accent); outline-offset: 2px; }
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* Passo 7B — listas ordenáveis, links e gamertags */
select {
  width: 100%; min-height: 46px; padding: 0 14px;
  background: var(--field); color: var(--text); border: 1px solid var(--line); border-radius: 10px; font: inherit;
}
select:focus { outline: 2px solid var(--accent); outline-offset: 1px; border-color: var(--accent); }
.empty { padding: 18px; text-align: center; color: var(--muted); border: 1px dashed var(--line); border-radius: 12px; }

.sortable { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.item { background: var(--field); border: 1px solid var(--line); border-radius: 12px; }
.item.dragging { opacity: .6; border-color: var(--accent); }
.item-row { display: flex; align-items: center; gap: 6px; padding: 10px 10px 10px 6px; }
.item-main { flex: 1; min-width: 0; display: flex; flex-direction: column; padding: 0 6px; }
.item-main strong, .item-main small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.item-main small { font-size: 13px; color: var(--muted); }

.icon-btn {
  width: 40px; height: 40px; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;
  background: transparent; color: var(--muted); border: 0; border-radius: 8px; cursor: pointer;
}
.icon-btn:hover { background: var(--card); color: var(--text); }
.icon-btn:focus-visible { outline: 2px solid var(--accent); }
.icon-danger:hover { color: var(--red); }
.drag-handle { cursor: grab; touch-action: none; }
.dragging .drag-handle { cursor: grabbing; }

.switch { position: relative; width: 44px; height: 26px; flex-shrink: 0; margin: 0 6px; cursor: pointer; }
.switch input {
  appearance: none; -webkit-appearance: none; margin: 0; width: 44px; height: 26px; cursor: pointer;
  background: var(--line); border-radius: 13px; transition: background .15s;
}
.switch input::after {
  content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px;
  background: #fff; border-radius: 50%; transition: transform .15s;
}
.switch input:checked { background: var(--ok); }
.switch input:checked::after { transform: translateX(18px); }
.switch input:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

.item-edit { border-top: 1px solid var(--line); padding: 0 14px; }
.item-edit summary { padding: 10px 0; cursor: pointer; color: var(--cyan); font-size: 14px; font-weight: 600; }
.item-edit[open] { padding-bottom: 14px; }
.delete-form { margin-top: 10px; }
.btn-danger { background: transparent; border: 1px solid rgba(255,51,85,.5); color: var(--err-soft); }
.btn-danger:hover { background: rgba(255,51,85,.12); }


/* Correções 7B — telemóvel e arrastar */
.sortable { grid-template-columns: minmax(0, 1fr); }     /* textos longos não esticam a lista */
.item, .item-row { min-width: 0; }
.card { min-width: 0; overflow-wrap: anywhere; }
.dragging-active, .dragging-active * { user-select: none; -webkit-user-select: none; cursor: grabbing; }

@media (max-width: 480px) {
  .container { padding-left: 12px; padding-right: 12px; }
  .tabs { margin-left: 0; margin-right: 0; }
  .tabs a { padding: 0 10px; font-size: 13px; }
  .item-row { gap: 2px; padding: 8px 6px 8px 2px; }
  .icon-btn { width: 34px; height: 40px; }
  .switch { margin: 0 4px; }
}

/* Passo 8 — escolha de tema */
.themes {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 14px;
  margin: 0; padding: 0; border: 0;
}
.theme { position: relative; display: block; cursor: pointer; }
.theme input { position: absolute; opacity: 0; }
.theme-swatch {
  display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 16px 14px;
  height: 120px; border-radius: 14px; border: 2px solid var(--line);
}
.theme-dot { width: 30px; height: 30px; border-radius: 50%; }
.theme-bar { width: 100%; height: 18px; border-radius: 6px; border: 2px solid; }
.theme-bar.short { width: 60%; height: 8px; border: 0; }
.theme-name { display: block; margin-top: 8px; font-size: 14px; font-weight: 600; text-align: center; }
.theme input:checked + .theme-swatch { border-color: var(--cyan); box-shadow: 0 0 0 3px rgba(46,230,214,.25); }
.theme input:focus-visible + .theme-swatch { outline: 2px solid var(--accent); outline-offset: 3px; }
.theme.locked { opacity: .5; cursor: not-allowed; }
.badge {
  display: inline-block; padding: 1px 7px; border-radius: 999px; font-size: 11px; font-weight: 700;
  background: var(--accent); color: #fff; vertical-align: middle;
}

/* Passo 9 — estatísticas */
.periods { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 20px; }
.periods a {
  display: inline-flex; align-items: center; min-height: 38px; padding: 0 14px; border-radius: 999px;
  border: 1px solid var(--line); color: var(--muted); font-size: 14px; font-weight: 600; text-decoration: none;
}
.periods a:hover { color: var(--text); }
.periods a[aria-current] { background: var(--text); color: var(--bg); border-color: var(--text); }

.tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin: 16px 0 8px; }
.tile {
  display: flex; flex-direction: column; gap: 4px; padding: 16px;
  background: var(--field); border: 1px solid var(--line); border-radius: 12px; color: var(--text); text-decoration: none;
}
.tile-link:hover { border-color: var(--accent); }
.tile-label { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--muted); }
.tile-value { font-size: 30px; line-height: 1.1; font-variant-numeric: tabular-nums; }
.tile-note { font-size: 12px; color: var(--muted); }
.key { display: inline-block; width: 10px; height: 10px; border-radius: 3px; flex-shrink: 0; }
.key-line { display: inline-block; width: 14px; height: 2px; border-radius: 1px; flex-shrink: 0; }

.legend { display: flex; flex-wrap: wrap; gap: 18px; margin: 4px 0 8px; font-size: 13px; color: var(--muted); }
.legend > span { display: inline-flex; align-items: center; gap: 8px; }

.chart { position: relative; }
.chart svg { display: block; overflow: visible; }
.c-grid { stroke: var(--line); stroke-width: 1; }
.c-base { stroke: var(--chart-base); stroke-width: 1; }
.c-tick { fill: var(--muted); font-size: 11px; font-variant-numeric: tabular-nums; }
.c-cross { stroke: var(--muted); stroke-width: 1; stroke-dasharray: 3 3; }
.c-hit { cursor: crosshair; outline: none; }
.c-hit:focus-visible { stroke: var(--accent); stroke-width: 2; }
.c-tip {
  position: absolute; top: 8px; min-width: 130px; padding: 10px 12px; pointer-events: none; z-index: 2;
  background: var(--tip-bg); border: 1px solid var(--line); border-radius: 10px; font-size: 13px;
  box-shadow: 0 6px 20px var(--shadow);
}
.c-tip-date { color: var(--muted); margin-bottom: 4px; }
.c-tip-row { display: flex; align-items: center; gap: 8px; }
.c-tip-row strong { min-width: 28px; font-variant-numeric: tabular-nums; }

.table-view { margin-top: 10px; }
.table-view summary { cursor: pointer; color: var(--cyan); font-size: 14px; font-weight: 600; padding: 6px 0; }
.table-view table { width: 100%; margin-top: 8px; border-collapse: collapse; font-size: 14px; font-variant-numeric: tabular-nums; }
.table-view th, .table-view td { padding: 6px 8px; text-align: right; border-bottom: 1px solid var(--line); }
.table-view th:first-child, .table-view td:first-child { text-align: left; }
.table-view th { color: var(--muted); font-weight: 600; }

.stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 8px 28px; }
.stats-grid > section { min-width: 0; }
.stats-grid h2 { font-size: 16px; }
.bars { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; margin: 12px 0 0; padding: 0; list-style: none; }
.bar-head { display: flex; justify-content: space-between; gap: 10px; font-size: 14px; }
.bar-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bar-head strong { font-variant-numeric: tabular-nums; white-space: nowrap; }
.bar-track { height: 8px; margin-top: 5px; background: var(--line); border-radius: 4px; overflow: hidden; }
.bar-fill { display: block; height: 100%; border-radius: 4px; }

/* Passo 10 — admin */
.nav-admin { color: var(--admin) !important; }
.table-wrap { width: 100%; overflow-x: auto; margin-top: 10px; }
.admin-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.admin-table th, .admin-table td { padding: 10px 8px; text-align: left; border-bottom: 1px solid var(--line); white-space: nowrap; }
.admin-table th { color: var(--muted); font-weight: 600; font-size: 13px; }
.admin-table td a { font-weight: 600; }
.admin-table .num { text-align: right; font-variant-numeric: tabular-nums; }
.admin-table tbody tr:hover { background: var(--field); }

.status { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 12px; font-weight: 700; vertical-align: middle; }
.status-ok   { background: rgba(52,211,153,.15);  color: var(--ok-soft); }
.status-warn { background: rgba(255,200,61,.15);  color: var(--warn-soft); }
.status-bad  { background: rgba(255,51,85,.15);   color: var(--err-soft); }

.search-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 8px 0 16px; }
.search-row input[type=text], .search-row input[type=date], .search-row select { flex: 1; min-width: 160px; width: auto; }
input[type=date] {
  min-height: 46px; padding: 0 12px; background: var(--field); color: var(--text);
  border: 1px solid var(--line); border-radius: 10px; font: inherit; color-scheme: dark;
}
.pager { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 16px; }

.user-head { display: flex; align-items: center; gap: 16px; }
.user-head h1 { margin: 0; }
.avatar-sm { width: 64px; height: 64px; }
.avatar-sm .avatar-initial { font-size: 26px; }

.facts { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 8px 18px; margin: 10px 0 0; font-size: 14px; }
.facts dt { color: var(--muted); }
.facts dd { margin: 0; overflow-wrap: anywhere; }

.danger-zone { margin-top: 28px; padding: 0 16px; border: 1px solid rgba(255,51,85,.4); border-radius: 12px; }
.danger-zone summary { padding: 12px 0; cursor: pointer; color: var(--err-soft); font-weight: 700; }

.chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 0; padding: 0; list-style: none; }
.chips li {
  display: inline-flex; align-items: center; gap: 2px; padding: 0 2px 0 12px;
  background: var(--field); border: 1px solid var(--line); border-radius: 999px; font-size: 14px;
}
.chip-x {
  width: 32px; height: 32px; border: 0; border-radius: 50%; background: transparent; color: var(--muted);
  font-size: 18px; line-height: 1; cursor: pointer;
}
.chip-x:hover { color: var(--red); background: rgba(255,51,85,.12); }

/* Fase A — planos, funções e redirecionamento */
.badge-pro { background: linear-gradient(90deg, #7C4DFF, #17A99C); }
.badge-lock { display: inline-flex; align-items: center; gap: 4px; background: var(--lock-bg); color: var(--lock-text); }
.plan-line { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 4px 0 12px; }
.locked-box {
  display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 16px;
  background: var(--field); border: 1px dashed var(--line); border-radius: 12px;
}
.locked-box p { margin: 0; color: var(--muted); font-size: 14px; }
.period-locked {
  display: inline-flex; align-items: center; gap: 6px; min-height: 38px; padding: 0 12px;
  border: 1px dashed var(--line); border-radius: 999px; color: var(--muted); font-size: 14px;
}
.redirect-banner { max-width: 720px; margin: 8px auto 0; }

.feature-list { display: grid; gap: 8px; margin: 10px 0 0; padding: 0; list-style: none; }
.feature-list li {
  display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 10px 12px;
  background: var(--field); border: 1px solid var(--line); border-radius: 12px;
}
.feature-name { display: flex; flex-direction: column; margin: 0; min-width: 0; font-weight: 400; }
.feature-name small { color: var(--muted); font-size: 12px; }
.feature-name .gift-count { color: var(--warn-soft); }
.feature-list select { width: 150px; flex-shrink: 0; min-height: 40px; font-size: 14px; font-weight: 600; }
.feature-list select.access-casual { border-color: rgba(52,211,153,.6); }
.feature-list select.access-pro { border-color: rgba(124,77,255,.8); }
.feature-list select.access-off { border-color: rgba(255,51,85,.6); }
@media (max-width: 480px) {
  .feature-list li { flex-direction: column; align-items: stretch; }
  .feature-list select { width: 100%; }
}

/* Fase A (ajustes) — pedidos */
.redirect-banner p, .renew-box p { margin: 0 0 10px; }
.redirect-banner form, .renew-box form { margin: 0; }
.renew-box { max-width: none; }

/* Fase B — painel › Aparência */
.card.xwide { max-width: 1080px; }
.tabs { max-width: 1080px; }
.ap-layout { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 28px; align-items: start; }
.ap-form { display: grid; gap: 14px; min-width: 0; }
.ap-sec { margin: 0; padding: 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--field); display: grid; gap: 12px; min-width: 0; }
.ap-sec legend { padding: 0 6px; font-weight: 700; font-size: 16px; display: inline-flex; align-items: center; gap: 8px; color: var(--cyan); }
.ap-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
.ap-sec .hint { margin: 0; }
.ap-save {
  position: sticky; bottom: 0; z-index: 2; display: flex; justify-content: flex-end;
  margin: 0 -8px; padding: 12px 8px calc(env(safe-area-inset-bottom, 0px) + 12px);
  background: var(--card); border-top: 1px solid var(--line);
}
input[type=color] { width: 46px; height: 38px; padding: 2px; border: 1px solid var(--line); border-radius: 8px; background: var(--card); cursor: pointer; }
input[type=range] { width: 100%; accent-color: var(--accent); }
input:disabled, select:disabled { opacity: .5; cursor: not-allowed; }
.is-disabled { opacity: .5; pointer-events: none; }

.swatches { display: grid; grid-template-columns: repeat(auto-fill, minmax(46px, 1fr)); gap: 6px; }
.swatch { position: relative; cursor: pointer; margin: 0; }
.swatch input { position: absolute; opacity: 0; }
.sw-box { position: relative; display: block; aspect-ratio: 1; max-width: 100%; border-radius: 10px; border: 2px solid transparent; }
.sw-box i { position: absolute; top: 6px; left: 6px; width: 12px; height: 12px; border-radius: 50%; }
.sw-box b { position: absolute; left: 5px; right: 5px; bottom: 5px; height: 8px; border-radius: 4px; }
.swatch input:checked + .sw-box { border-color: var(--cyan); box-shadow: 0 0 0 2px var(--field), 0 0 0 4px var(--cyan); }
.swatch input:focus-visible + .sw-box { outline: 2px solid var(--accent); outline-offset: 3px; }

.seg { display: flex; flex-wrap: wrap; gap: 6px; }
.seg button {
  min-height: 36px; padding: 0 12px; border-radius: 8px; cursor: pointer; font: inherit; font-size: 13px; font-weight: 600;
  background: transparent; color: var(--muted); border: 1px solid var(--line);
}
.seg button[aria-selected="true"], .seg button[aria-pressed="true"] { background: var(--text); color: var(--bg); border-color: var(--text); }
.seg button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.seg button:disabled { opacity: .45; cursor: not-allowed; }
.font-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 8px; position: relative; max-height: 352px; overflow-y: auto; padding: 2px 6px 2px 2px; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: var(--cyan) transparent; }
.font-grid::-webkit-scrollbar { width: 8px; } .font-grid::-webkit-scrollbar-thumb { background: var(--cyan); border-radius: 8px; }
.font-tile { position: relative; margin: 0; cursor: pointer; }
.font-tile input { position: absolute; opacity: 0; }
.font-tile-box { display: grid; gap: 2px; padding: 10px 12px; min-height: 64px; border: 1px solid var(--line); border-radius: 10px; background: var(--card); }
.font-tile-sample { font-size: 19px; line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--text); }
.font-tile-sample.is-pixel { font-size: 11px; line-height: 2; }
.font-tile-box small { font-size: 11px; color: var(--muted); }
.font-tile input:checked + .font-tile-box { border-color: var(--cyan); box-shadow: inset 0 0 0 1px var(--cyan); }
.font-tile input:focus-visible + .font-tile-box { outline: 2px solid var(--accent); outline-offset: 2px; }
.font-tile input:disabled + .font-tile-box { opacity: .5; cursor: not-allowed; }

.box-group { display: grid; gap: 8px; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--card); }
.box-group + .box-group { margin-top: 6px; }
.box-group-title { margin: 0 0 2px; font-weight: 700; font-size: 15px; color: var(--group-title); letter-spacing: .02em; }
.box-row-label { margin: 2px 0 -2px; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.box-group .pick-box { background: var(--field); }
.tiles-pick { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
@media (max-width: 1100px) { .tiles-pick { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.pick { position: relative; margin: 0; cursor: pointer; }
.pick input { position: absolute; opacity: 0; }
.pick-box { display: grid; gap: 6px; padding: 8px 6px; border: 1px solid var(--line); border-radius: 10px; background: var(--card); }
.pick-box small { font-size: 11px; color: var(--muted); line-height: 1.3; hyphens: auto; }
.pick input:checked + .pick-box { border-color: var(--cyan); box-shadow: inset 0 0 0 1px var(--cyan); }
.pick input:focus-visible + .pick-box { outline: 2px solid var(--accent); outline-offset: 2px; }
.pick input:disabled + .pick-box { opacity: .5; cursor: not-allowed; }
.mini { display: block; height: 22px; background: var(--muted); opacity: .8; }
.mini-reto { border-radius: 0; } .mini-suave { border-radius: 5px; } .mini-arredondado { border-radius: 10px; } .mini-pilula { border-radius: 999px; }
.mini-chanfrado { clip-path: polygon(7px 0, 100% 0, 100% calc(100% - 7px), calc(100% - 7px) 100%, 0 100%, 0 7px); }
.mini-inclinado { clip-path: polygon(7px 0, 100% 0, calc(100% - 7px) 100%, 0 100%); }
.fxm-solido { border-radius: 6px; }
.fxm-contorno { border-radius: 6px; background: transparent; box-shadow: inset 0 0 0 2px var(--muted); }
.fxm-vidro { border-radius: 6px; opacity: .35; }
.fxm-sombra { border-radius: 6px; box-shadow: 0 5px 8px rgba(0,0,0,.5); }
.fxm-neon { border-radius: 6px; background: transparent; opacity: 1; box-shadow: inset 0 0 0 2px var(--accent), 0 0 8px var(--accent); }
.fxm-retro { border-radius: 6px; box-shadow: 4px 4px 0 var(--cyan); }

.bg-thumb { width: 100%; max-width: 220px; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 10px; border: 1px solid var(--line); }

.ap-preview { position: sticky; top: 16px; display: grid; gap: 10px; justify-items: stretch; }
.ap-preview #reload-preview { justify-self: start; }
.ap-preview-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.phone-frame { border-radius: 30px; padding: 8px; background: #050409; box-shadow: 0 0 0 1px var(--line), 0 16px 40px var(--shadow); }
.phone-frame iframe { display: block; width: 100%; height: 680px; border: 0; border-radius: 24px; background: #0B0912; }
@media (max-width: 960px) {
  .ap-layout { grid-template-columns: minmax(0, 1fr); }
  .ap-preview { position: static; max-width: 380px; width: 100%; margin: 0 auto; }
  .phone-frame iframe { height: 600px; }
}

/* ---------- Fase C: Apoiar o canal e Setup ---------- */
.card-h { margin-top: 0; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.card-h .muted { font-size: 14px; font-weight: 400; color: var(--muted); }
.form-2col { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; }
@media (max-width: 560px) { .form-2col { grid-template-columns: minmax(0, 1fr); } }
.setup-thumb { width: 44px; height: 44px; flex-shrink: 0; border-radius: 8px; object-fit: cover; background: var(--field); border: 1px solid var(--line); }
.file-row .setup-thumb { width: 64px; height: 64px; }
.chip-suggest { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.chip-suggest .btn { border-radius: 999px; }
.setup-group-title { margin: 22px 0 10px; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--accent2, var(--accent)); }
.setup-group-title:first-of-type { margin-top: 8px; }
.setup-settings { display: grid; gap: 12px; margin-top: 12px; }
.sp-ic { width: 34px; height: 34px; flex-shrink: 0; border-radius: 9px; display: inline-grid; place-items: center; overflow: hidden; }
.sp-ic svg { display: block; }
.sp-generic { background: var(--field); color: #FF4D6D; border: 1px solid var(--line); }
.sp-flag { width: 34px; height: 26px; border-radius: 5px; border: 1px solid var(--line); }
.sp-flag svg { width: 100%; height: 100%; }
.tip-card { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; border-color: var(--line); border-left: 4px solid #772CE8; background: rgba(119,44,232,.08); }
.tip-card p { flex: 1; min-width: 220px; margin: 0; }

.sp-flag img { width: 100%; height: 100%; object-fit: cover; display: block; }
.country-row { display: flex; align-items: center; gap: 10px; }
.country-row select { flex: 1; min-width: 0; }
.country-flag { width: 24px; height: 18px; flex-shrink: 0; }
.country-flag img, .flag { display: block; border-radius: 3px; object-fit: cover; box-shadow: 0 0 0 1px var(--line); }
.badge-extra { background: var(--field); border: 1px solid var(--line); border-radius: 12px; padding: 12px 12px 0; margin-bottom: 14px; }
.badge-extra-hint { grid-column: 1 / -1; margin: -6px 0 12px; }

/* ---------- Fase D: botão claro/escuro do painel ---------- */
.theme-toggle {
  display: inline-grid; place-items: center; width: 40px; height: 40px; padding: 0; cursor: pointer;
  background: var(--card); color: var(--text); border: 1px solid var(--line); border-radius: 50%;
}
.theme-toggle:hover { border-color: var(--accent); }
.theme-toggle:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.theme-toggle svg { display: none; }
:root[data-theme="auto"] .theme-toggle .ic-auto,
:root[data-theme="dark"] .theme-toggle .ic-dark,
:root[data-theme="light"] .theme-toggle .ic-light { display: block; }
@media (max-width: 480px) { .nav { gap: 10px; } .theme-toggle { width: 36px; height: 36px; } }
.c-dot { stroke: var(--card); }

/* ---------- Fase E: presentes ---------- */
.gift-bar {
  display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 12px;
  width: 100%; max-width: 1080px; margin: 0 auto; padding: 10px 20px; font-weight: 600; font-size: 14px;
  background: var(--lock-bg); color: var(--lock-text); border-radius: 12px;
}
.gift-list { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.gift-actions { display: grid; gap: 10px; padding: 0 12px 12px; }
.gift-buttons { display: flex; flex-wrap: wrap; gap: 8px; }
.copy-row { display: flex; gap: 8px; }
.copy-row input { flex: 1; min-width: 0; font-size: 14px; }
.gift-actions .item-edit form { display: grid; gap: 8px; padding-top: 8px; }
.gift-form textarea { resize: vertical; }

/* Página do presente */
.gift-page { max-width: 980px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 28px; align-items: start; }
.gift-page .card { max-width: none; margin: 0; }
.gift-hero { text-align: center; }
.gift-emoji { font-size: 44px; line-height: 1; }
.gift-hero h1 { margin-top: 8px; }
.gift-note {
  margin: 18px 0 0; padding: 14px 16px; border-radius: 12px; text-align: left; white-space: pre-line;
  background: var(--field); border: 1px solid var(--line); border-left: 4px solid var(--accent);
}
.gift-perks { display: grid; gap: 6px; margin: 18px 0 0; padding: 0; list-style: none; text-align: left; font-size: 14px; }
.gift-perks li::before { content: "✓ "; color: var(--ok); font-weight: 800; }
.gift-claim { margin-top: 22px; text-align: left; }
.gift-claim h2 { margin: 0 0 12px; font-size: 18px; }
.gift-claim details { margin-top: 12px; border: 1px solid var(--line); border-radius: 12px; padding: 0 14px; }
.gift-claim summary { padding: 12px 0; cursor: pointer; font-weight: 700; }
.gift-claim details[open] summary { border-bottom: 1px solid var(--line); margin-bottom: 14px; }
.gift-claim details form { padding-bottom: 14px; }
.gift-preview .phone-frame iframe { height: 620px; }
.gift-preview p { text-align: center; font-size: 13px; color: var(--muted); }
@media (max-width: 860px) {
  .gift-page { grid-template-columns: minmax(0, 1fr); }
  .gift-preview { max-width: 360px; margin: 0 auto; width: 100%; }
}
@media (max-width: 420px) {
  .topbar { padding: 12px 14px; gap: 8px; }
  .brand { font-size: 19px; }
  .nav .btn-sm { padding: 0 10px; white-space: nowrap; }
}
.tpl-select { margin-bottom: 8px; }

/* ---------- Fase F: HTML livre ---------- */
.html-status p { margin: 0 0 10px; }
.html-toggle { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin: 6px 0; }
.html-editor textarea {
  width: 100%; min-height: 420px; resize: vertical; tab-size: 2; white-space: pre;
  font: 13px/1.55 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
}
.html-editor-foot { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.html-editor-foot .over { color: var(--err-soft); font-weight: 700; }
.html-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.html-images { display: grid; gap: 10px; margin: 16px 0 0; padding: 0; list-style: none; }
.html-images li { display: flex; align-items: center; gap: 12px; padding: 10px; background: var(--field); border: 1px solid var(--line); border-radius: 12px; min-width: 0; }
.html-img-thumb { flex-shrink: 0; width: 72px; height: 72px; border-radius: 8px; overflow: hidden; background: repeating-conic-gradient(var(--line) 0 25%, transparent 0 50%) 0 0 / 14px 14px; }
.html-img-thumb img { width: 100%; height: 100%; object-fit: contain; display: block; }
.html-img-info { flex: 1; min-width: 0; display: grid; gap: 4px; }
.html-img-info strong, .html-img-info small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.html-img-info small { color: var(--muted); font-size: 13px; }
.html-img-info .copy-row input { font: 12px ui-monospace, Menlo, Consolas, monospace; min-height: 38px; }
.html-clicks { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.html-clicks li { display: flex; justify-content: space-between; gap: 12px; padding: 8px 12px; background: var(--field); border-radius: 8px; }
.html-clicks span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.html-review { display: grid; grid-template-columns: 360px minmax(0, 1fr); gap: 24px; align-items: start; }
.html-linklist { margin: 0 0 16px; padding-left: 18px; font-size: 13px; word-break: break-all; }
.html-code-view { width: 100%; font: 12px/1.5 ui-monospace, Menlo, Consolas, monospace; white-space: pre; }
.html-decide { display: flex; flex-wrap: wrap; gap: 16px; align-items: flex-end; margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--line); }
.html-reject { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; flex: 1; min-width: 260px; }
.html-reject label { width: 100%; font-weight: 700; font-size: 14px; }
.html-reject input { flex: 1; min-width: 180px; }
.html-row-actions { display: flex; gap: 8px; flex-wrap: wrap; }
@media (max-width: 760px) { .html-review { grid-template-columns: minmax(0, 1fr); } }

/* Guia */
.guide h2 { margin-top: 32px; }
.guide h3 { margin: 22px 0 6px; font-size: 16px; }
.guide p, .guide li { color: var(--text); }
.guide ul { padding-left: 20px; }
.guide code { padding: 1px 6px; border-radius: 5px; background: var(--field); border: 1px solid var(--line); font-size: 13px; }
.guide pre { margin: 10px 0; padding: 14px; overflow-x: auto; border-radius: 10px; background: var(--field); border: 1px solid var(--line); font-size: 12.5px; line-height: 1.55; }
.guide pre code { padding: 0; border: 0; background: none; }
.guide table { width: 100%; border-collapse: collapse; font-size: 14px; margin: 8px 0; }
.guide th, .guide td { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--line); vertical-align: top; }
.guide .toc { display: flex; flex-wrap: wrap; gap: 8px; padding: 0; list-style: none; }
.guide .toc a { display: inline-block; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--line); text-decoration: none; font-size: 14px; font-weight: 600; }
.guide .ok { color: var(--ok-soft); font-weight: 700; }
.guide .no { color: var(--err-soft); font-weight: 700; }

/* ---------- Menu do topo: Entrar | Criar conta | Idioma | Tema ---------- */
.nav { gap: 6px; }
.nav-a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 10px; border-radius: 10px; }
.nav a.nav-a:hover, .nav .link.nav-a:hover { background: var(--card); color: var(--text); }
.nav .nav-cta { margin: 0 4px; color: #fff; }
.lang-menu { position: relative; }
.lang-menu > summary { list-style: none; }
.lang-menu > summary::-webkit-details-marker { display: none; }
.ctl-btn {
  display: inline-flex; align-items: center; gap: 7px; height: 40px; padding: 0 11px; cursor: pointer;
  border: 1px solid var(--line); border-radius: 999px; background: var(--card); color: var(--text);
  font-size: 14px; font-weight: 700; user-select: none;
}
.ctl-btn:hover { border-color: var(--accent); }
.ctl-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.lang-flag { display: block; flex-shrink: 0; border-radius: 3px; box-shadow: 0 0 0 1px rgba(127,127,127,.35); }
.lang-chev { transition: transform .15s; }
.lang-menu[open] .lang-chev { transform: rotate(180deg); }
.lang-list {
  position: absolute; right: 0; top: calc(100% + 8px); z-index: 50; width: 230px; padding: 6px;
  background: var(--card); border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 18px 40px var(--shadow);
}
.nav .lang-list a { display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 0 12px; border-radius: 10px; font-weight: 500; }
.nav .lang-list a:hover { background: var(--field); }
.nav .lang-list a[aria-current] { font-weight: 700; }
.lang-chk { margin-left: auto; color: var(--accent); }
.footer .foot-links { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px 16px; margin-bottom: 10px; }
.footer .foot-links a { color: var(--muted); text-decoration: none; }
.footer .foot-links a:hover { color: var(--text); }
@media (max-width: 560px) {
  .lang-code { display: none; }
  .ctl-btn { padding: 0 9px; }
  .hide-xs { display: none; }
  .nav-a { padding: 0 7px; font-size: 14px; }
  .nav .nav-cta { margin: 0 2px; padding: 0 10px; font-size: 13px; }
}
@media (max-width: 380px) { .lang-chev { display: none; } }
.trust-item { padding: 16px 0; border-top: 1px solid var(--line); scroll-margin-top: 20px; }
.trust-item h2 { margin: 0 0 6px; }
.trust-item p { margin: 0 0 4px; }
.trust-item:target { background: var(--field); margin: 0 -16px; padding: 16px; border-radius: 12px; }
@media (max-width: 420px) {
  .topbar, .h-top-in { padding-left: 14px !important; padding-right: 14px !important; }
  .topbar { gap: 6px; }
  .brand { font-size: 16px !important; letter-spacing: -.4px; }
  .nav { gap: 2px; }
  .nav-a { padding: 0 6px; font-size: 13px; min-height: 40px; }
  .nav .nav-cta { margin: 0 2px; padding: 0 9px; font-size: 13px; min-height: 36px; }
  .ctl-btn { height: 36px; padding: 0 7px; }
  .lang-chev { display: none; }
  .theme-toggle { width: 36px; height: 36px; }
}
@media (max-width: 380px) {
  .topbar { gap: 4px; }
  .nav-a { padding: 0 4px; }
  .nav .nav-cta { padding: 0 7px; }
}
.teaser-card.is-on { border-color: color-mix(in srgb, var(--warn-soft) 55%, var(--line)); }

/* ---------- Central de Confiança ---------- */
.legal { max-width: 820px; }
.legal-back { margin: 0 0 12px; font-size: 14px; }
.legal-meta { margin: -12px 0 20px; font-size: 13px; color: var(--muted); }
.legal-toc { margin: 0 0 24px; padding: 14px 18px; border-radius: 14px; background: var(--field); border: 1px solid var(--line); }
.legal-toc ol { margin: 6px 0 0; padding-left: 20px; columns: 2; column-gap: 28px; font-size: 14px; }
.legal-toc li { break-inside: avoid; margin: 3px 0; }
.legal-sec { padding-top: 6px; scroll-margin-top: 16px; }
.legal-sec h2 { margin: 26px 0 8px; font-size: 19px; }
.legal-sec p, .legal-sec li { line-height: 1.65; }
.legal-sec ul { padding-left: 20px; }
.legal-sec li { margin: 4px 0; }
.legal-sec table { width: 100%; border-collapse: collapse; font-size: 14px; margin: 8px 0; }
.legal-sec th, .legal-sec td { text-align: left; padding: 9px 10px; border-bottom: 1px solid var(--line); vertical-align: top; }
.legal-sec th { color: var(--muted); font-weight: 600; font-size: 13px; }
.legal-sec code { padding: 1px 6px; border-radius: 5px; background: var(--field); border: 1px solid var(--line); font-size: 13px; }
.legal-note { margin-top: 24px; }
.trust-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0 0 20px; padding: 0; list-style: none; }
.trust-tile { display: grid; gap: 4px; height: 100%; padding: 16px 18px; border-radius: 14px; background: var(--field); border: 1px solid var(--line); text-decoration: none; color: var(--text) !important; }
.trust-tile:hover { border-color: var(--accent); }
.trust-tile span { font-size: 14px; color: var(--muted); }
.report-reasons { border: 0; padding: 0; margin: 0 0 18px; display: grid; gap: 8px; }
.report-reasons legend { font-weight: 700; font-size: 14px; margin-bottom: 8px; }
@media (max-width: 620px) { .trust-grid { grid-template-columns: minmax(0, 1fr); } .legal-toc ol { columns: 1; } }

/* Top Pro Player */
.badge-top { background: linear-gradient(90deg, #F5B300, #FF6A1A); color: #1A0E00; }
.feature-list select.access-top { border-color: rgba(245,179,0,.8); }
.delete-list { margin: 4px 0 14px; padding-left: 20px; color: var(--muted); font-size: 14px; }
.delete-form { display: grid; gap: 12px; padding-bottom: 16px; }
.delete-form .field { margin: 0; }
.delete-form .btn-danger { justify-self: start; }

/* Presentes: plano oferecido na lista */
.gift-list .gift-plan { align-self: flex-start; margin: 2px 0; }

/* ---------- Barra lateral do painel / admin ---------- */
.side-nav > summary { list-style: none; }
.side-nav > summary::-webkit-details-marker { display: none; }
.side-nav nav { display: flex; flex-direction: column; gap: 2px; padding: 8px; background: var(--card); border: 1px solid var(--line); border-radius: 14px; }
.side-nav a, .sn-group > summary {
  display: flex; align-items: center; gap: 10px; min-height: 40px; padding: 0 12px; border-radius: 10px;
  color: var(--muted); font-weight: 600; font-size: 14px; text-decoration: none; cursor: pointer;
}
.side-nav a:hover, .sn-group > summary:hover { color: var(--text); background: var(--field); }
.side-nav a[aria-current] { background: var(--accent); color: #fff; }
.side-nav a:focus-visible, .sn-group > summary:focus-visible, .sn-toggle:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.sn-ic { flex-shrink: 0; }
/* ícones coloridos (cada secção com a sua cor; no item ativo ficam brancos) */
.sn-ic { color: var(--ic, currentColor); transition: transform .15s; }
.ic-home { --ic: var(--ni-purple); } .ic-cog { --ic: var(--ni-cyan); } .ic-user { --ic: var(--ni-orange); }
.ic-layers { --ic: var(--ni-lav); } .ic-monitor { --ic: var(--ni-blue); } .ic-link { --ic: var(--ni-cyan); }
.ic-pad { --ic: var(--ni-green); } .ic-image { --ic: var(--ni-orange); } .ic-twitch { --ic: var(--ni-purple); } .ic-heart { --ic: var(--ni-pink); } .ic-live { --ic: var(--ni-red); }
.ic-palette { --ic: var(--ni-gold); } .ic-code { --ic: var(--ni-purple); } .ic-chart { --ic: var(--ni-blue); }
.ic-card { --ic: var(--ni-green); } .ic-gift { --ic: var(--ni-pink); } .ic-star { --ic: var(--ni-gold); }
.ic-bulb { --ic: var(--ni-yellow); } .ic-shield { --ic: var(--admin); } .ic-dot { --ic: var(--admin); }
.ic-grid { --ic: var(--ni-gold); } .ic-users { --ic: var(--ni-orange); } .ic-key { --ic: var(--ni-gold); } .ic-handshake { --ic: var(--ni-green); }
.ic-share { --ic: var(--ni-pink); } .ic-tag { --ic: var(--ni-lav); } .ic-wallet { --ic: var(--ni-green); } .ic-calc { --ic: var(--ni-cyan); }
.ic-rocket { --ic: var(--ni-red); } .ic-ticket { --ic: var(--ni-purple); } .ic-flag { --ic: var(--ni-red); } .ic-db { --ic: var(--ni-blue); }
/* Admin: seletor Painel | Admin, títulos de grupo e contadores */
.sn-switch { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 4px; margin-bottom: 6px; background: var(--field); border: 1px solid var(--line); border-radius: 12px; }
.side-nav .sn-switch a { justify-content: center; min-height: 36px; padding: 6px 8px; font-size: 13.5px; border-radius: 9px; position: relative; }
.side-nav .sn-switch a[aria-current] { background: var(--accent); color: #fff; }
.side-nav .sn-switch a.is-admin[aria-current] { background: var(--admin); color: var(--bg); }
.side-nav .sn-switch a[aria-current] .sn-ic { color: inherit; }
.sn-title { margin: 10px 12px 2px; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.sn-badge { margin-left: auto; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--red); color: #fff; font-size: 11.5px; font-weight: 800; line-height: 20px; text-align: center; }
.sn-switch .sn-badge { position: absolute; top: -7px; right: -5px; min-width: 18px; height: 18px; line-height: 18px; font-size: 10.5px; padding: 0 5px; box-shadow: 0 0 0 2px var(--card); }
.side-nav nav.is-admin a[aria-current]:not(.sn-switch a) { background: var(--admin); color: var(--bg); }
.side-nav nav.is-admin a[aria-current] .sn-ic { color: inherit; }
.side-nav a:hover .sn-ic, .sn-group > summary:hover .sn-ic { transform: scale(1.12); }
.side-nav a[aria-current] .sn-ic { color: #fff; }
.sn-group > summary { list-style: none; }
.sn-group > summary::-webkit-details-marker { display: none; }
.sn-group > summary::after { content: ""; margin-left: auto; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translate(-2px, -2px); transition: transform .15s; }
.sn-group:not([open]) > summary::after { transform: rotate(-45deg); }
.sn-sub { display: flex; flex-direction: column; gap: 2px; margin: 2px 0 4px 21px; padding-left: 8px; border-left: 1px solid var(--line); }
.sn-sub a { min-height: 36px; font-size: 13.5px; }
.sn-toggle { display: none; }

@media (min-width: 900px) {
  main.container:has(> .side-nav) {
    display: grid; grid-template-columns: 220px minmax(0, 1fr); grid-template-rows: auto 1fr;
    grid-template-areas: "nav flash" "nav body"; column-gap: 28px; align-items: start;
  }
  main > .side-nav { grid-area: nav; position: sticky; top: 16px; }
  main > .flash-zone { grid-area: flash; }
  main > .panel-body { grid-area: body; min-width: 0; }
  .panel-body > .card, .panel-body > .alert, main:has(> .side-nav) > .flash-zone > .alert { margin-left: 0; margin-right: 0; }
  .panel-body > .card.wide, .panel-body > .card { max-width: none; }
  .panel-body > :first-child, .flash-zone + .panel-body > :first-child { margin-top: 0; }
  main:has(> .side-nav) > .flash-zone > .alert:first-child { margin-top: 0; }
}
@media (max-width: 899px) {
  .side-nav { margin: 0 0 16px; }
  .sn-toggle {
    display: flex; align-items: center; gap: 10px; min-height: 46px; padding: 0 14px; cursor: pointer;
    background: var(--card); border: 1px solid var(--line); border-radius: 12px; font-weight: 700;
  }
  .sn-cur { color: var(--muted); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sn-burger, .sn-burger::before, .sn-burger::after { display: block; width: 18px; height: 2px; background: currentColor; border-radius: 2px; position: relative; }
  .sn-burger::before, .sn-burger::after { content: ""; position: absolute; left: 0; }
  .sn-burger::before { top: -6px; } .sn-burger::after { top: 6px; }
  .side-nav[open] > .sn-toggle { border-radius: 12px 12px 0 0; border-bottom-color: transparent; }
  .side-nav[open] nav { border-radius: 0 0 12px 12px; border-top: 0; }
}

/* Estatísticas: Setup e Apoiar o canal */
.stats-items-h { margin: 0 0 4px; font-size: 24px; }
.stats-grid h3 { margin: 0 0 12px; font-size: 15px; }

/* Gamertags personalizadas */
.gt-custom { padding: 14px; margin: 0 0 16px; background: var(--field); border: 1px dashed var(--line); border-radius: 12px; }
.gt-custom[hidden] { display: none; }
.gt-icon-row { display: flex; align-items: center; gap: 10px; }
.gt-icon-row input { flex: 1; }
.gt-icon-preview .ic, .gt-list-icon .ic, .gt-icon-opt .ic {
  display: inline-grid; place-items: center; width: 36px; height: 36px; flex-shrink: 0; border-radius: 50%;
  background: var(--card); color: var(--text); border: 1px solid var(--line); overflow: hidden;
}
.gt-list-icon .ic { width: 32px; height: 32px; }
.gt-icon-preview .ic.has-brand, .gt-list-icon .ic.has-brand, .gt-icon-opt .ic.has-brand { background: var(--brand); color: var(--on-brand); border-color: transparent; }
.ic-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gt-icon-results { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 6px; margin: 10px 0; max-height: 236px; overflow-y: auto; }
.gt-icon-results:empty { display: none; }
.gt-icon-results .hint { grid-column: 1 / -1; margin: 0; }
.gt-icon-opt {
  display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 4px 8px; text-align: left;
  background: var(--card); color: var(--text); border: 1px solid var(--line); border-radius: 10px; font: inherit; font-size: 13px; cursor: pointer;
}
.gt-icon-opt .ic { width: 30px; height: 30px; }
.gt-icon-opt span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gt-icon-opt:hover { border-color: var(--accent); }
.gt-icon-opt[aria-selected="true"] { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent); }
.gt-icon-opt:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.gt-icon-q { width: 100%; min-height: 44px; padding: 10px 14px; background: var(--card); color: var(--text); border: 1px solid var(--line); border-radius: 10px; font: inherit; }
.gt-icon-q:focus { outline: 2px solid var(--accent); outline-offset: 1px; border-color: var(--accent); }

/* Botão do Google (regras da marca: fundo branco no claro, #131314 no escuro, "G" colorido) */
.btn-google { display: inline-flex; align-items: center; justify-content: center; gap: 10px; background: #131314; color: #E3E3E3; border: 1px solid #8E918F; }
.btn-google:hover { background: #1F1F21; color: #E3E3E3; }
.btn-google .g-logo { flex-shrink: 0; }
:root[data-theme="light"] .btn-google { background: #FFFFFF; color: #1F1F1F; border-color: #747775; }
:root[data-theme="light"] .btn-google:hover { background: #F2F2F2; }
@media (prefers-color-scheme: light) {
  :root[data-theme="auto"] .btn-google { background: #FFFFFF; color: #1F1F1F; border-color: #747775; }
  :root[data-theme="auto"] .btn-google:hover { background: #F2F2F2; }
}
.gift-claim .btn-google { margin-bottom: 10px; }

/* Convite para a montra da página inicial */
.showcase-invite { display: flex; gap: 14px; align-items: flex-start; margin: 16px 0; padding: 18px; border-radius: 14px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 22%, var(--card)), var(--card)); border: 1px solid color-mix(in srgb, var(--accent) 55%, var(--line)); }
.showcase-invite h2 { margin: 0 0 6px; font-size: 18px; }
.showcase-invite p { margin: 0 0 12px; }
.showcase-invite .hint { margin: 10px 0 0; }
.showcase-invite-ic { flex-shrink: 0; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--accent); color: #fff; font-size: 20px; }
.showcase-actions { display: flex; flex-wrap: wrap; gap: 8px; }

/* Admin › Parceiros */
.partner-thumb { display: block; width: 120px; aspect-ratio: 4 / 5; object-fit: cover; margin: 0 0 10px; border-radius: 10px; border: 1px solid var(--line); }
.partner-mini { width: 44px; height: 55px; object-fit: cover; border-radius: 8px; flex-shrink: 0; margin-right: 6px; }

/* Indicações */
.ref-box { margin: 0 0 16px; }
.ref-box > summary { cursor: pointer; color: var(--cyan); font-weight: 600; font-size: 14px; margin-bottom: 10px; }
.ref-box .field { margin-top: 6px; }
.ref-commission { margin-top: 22px; padding: 16px 18px; border-radius: 12px; background: var(--field); border: 1px solid var(--line); border-left: 4px solid var(--accent); }
.ref-commission p { margin: 6px 0 0; }
.table-wrap { overflow-x: auto; }
.ref-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.ref-table th, .ref-table td { padding: 10px 8px; border-bottom: 1px solid var(--line); text-align: left; white-space: nowrap; }
.ref-table th { color: var(--muted); font-size: 12px; font-weight: 600; }

/* Data de nascimento: dia / mês / ano */
.birth-row { display: grid; grid-template-columns: 1fr 1.6fr 1.2fr; gap: 8px; }
.birth-row select { width: 100%; min-width: 0; }

/* Data de nascimento: dia / mês / ano */
.birth-row { display: grid; grid-template-columns: 1fr 1.6fr 1.2fr; gap: 8px; }
.birth-row select { width: 100%; min-width: 0; }
.char-count { text-align: right; }
.char-count.is-near { color: var(--warn-text); }

/* Painel › Plano e Admin › Pagamentos */
.h-sec { margin: 32px 0 6px; font-size: 18px; }
.plan-now { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 8px; margin: 0 0 22px; padding: 14px 16px; border-radius: 12px; background: var(--field); border: 1px solid var(--line); }
.alert-inline { color: var(--warn-text); font-weight: 600; }
.checkout fieldset { margin: 0 0 18px; padding: 0; border: 0; }
.checkout legend { margin-bottom: 10px; font-weight: 700; }
.plan-pick { display: grid; gap: 10px; }
.plan-opt, .pay-opt { position: relative; display: block; cursor: pointer; }
.plan-opt input, .pay-opt input { position: absolute; opacity: 0; pointer-events: none; }
.plan-opt-in { display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; padding: 14px 16px; border-radius: 14px; border: 2px solid var(--line); background: var(--card); transition: border-color .15s; }
.plan-opt-name { font-weight: 700; font-size: 16px; }
.plan-opt-price { text-align: right; white-space: nowrap; }
.plan-opt-kind { grid-column: 1 / -1; font-size: 13px; }
.plan-opt input:checked + .plan-opt-in, .pay-opt input:checked + .pay-opt-in { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent); }
.plan-opt input:focus-visible + .plan-opt-in, .pay-opt input:focus-visible + .pay-opt-in { outline: 2px solid var(--accent); outline-offset: 2px; }
.plan-opt.is-off { cursor: not-allowed; opacity: .55; }
.pay-methods { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; }
.pay-methods legend, .pay-methods .hint { grid-column: 1 / -1; }
.pay-opt-in { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 12px; border: 2px solid var(--line); background: var(--card); font-weight: 600; font-size: 14px; }
.pr-m { padding: 3px 8px; border-radius: 6px; border: 1px solid var(--line); font-weight: 800; font-size: 11px; letter-spacing: .03em; white-space: nowrap; }
.pr-m-pix { border-color: #32BCAD; color: #32BCAD; }
.pr-m-mbway { border-color: #D60511; color: #FF4B55; }
.guardian { padding: 12px 14px; border-radius: 12px; border: 1px solid var(--line); background: var(--field); }
.btn.is-busy { opacity: .7; cursor: progress; }
.pay-state { text-align: center; padding: 26px 18px; border-radius: 16px; border: 1px solid var(--line); background: var(--field); }
.pay-state h2 { margin: 10px 0 6px; font-size: 21px; }
.pay-state p { margin: 0 auto 12px; max-width: 520px; }
.pay-ic { width: 56px; height: 56px; margin: 0 auto; border-radius: 50%; display: grid; place-items: center; font-size: 26px; font-weight: 800; background: var(--card); border: 1px solid var(--line); }
.pay-ic-ok { background: rgba(52,211,153,.15); color: var(--ok-soft); border-color: rgba(52,211,153,.4); }
.pay-ic-bad { background: rgba(255,51,85,.12); color: var(--err-soft); border-color: rgba(255,51,85,.4); }
.pay-spin { width: 46px; height: 46px; margin: 0 auto; border-radius: 50%; border: 4px solid var(--line); border-top-color: var(--accent); animation: pay-spin 1s linear infinite; }
@keyframes pay-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .pay-spin { animation-duration: 3s; } }
.pix-box { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 20px; align-items: center; margin: 18px 0; text-align: left; }
.pix-qr { width: 220px; height: 220px; padding: 8px; border-radius: 12px; background: #fff; }
.pix-qr svg { display: block; width: 100%; height: 100%; }
.pix-dl { display: grid; grid-template-columns: auto 1fr; gap: 6px 12px; margin: 14px 0 0; font-size: 14px; }
.pix-dl dt { color: var(--muted); }
.pix-dl dd { margin: 0; word-break: break-all; }
.pix-done { margin-top: 6px; }
.pix-done .hint { margin-top: 8px; }
@media (max-width: 560px) { .pix-box { grid-template-columns: minmax(0, 1fr); justify-items: center; } }
.filter-row { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; }
.filter-row input { flex: 1 1 200px; min-width: 0; }
.filter-row select { flex: 0 1 200px; }
.row-menu { position: relative; display: inline-block; }
.row-menu summary { list-style: none; }
.row-menu summary::-webkit-details-marker { display: none; }
.row-menu-box { position: absolute; right: 0; top: calc(100% + 6px); z-index: 5; display: grid; gap: 10px; width: 230px; padding: 12px; border-radius: 12px; background: var(--card); border: 1px solid var(--line); box-shadow: 0 10px 30px rgba(0,0,0,.35); white-space: normal; }
.pause-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.plan-link { margin-left: auto; font-size: 14px; font-weight: 600; }
.daily-box { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin-top: 24px; padding: 12px 16px; border-radius: 12px; border: 1px dashed var(--line); font-size: 14px; }
.au-more { margin-top: 16px; }
.au-info { margin: 0 0 20px; padding: 14px 16px; border-radius: 12px; background: var(--field); border: 1px solid var(--line); font-size: 14px; }
.au-info h2 { margin: 10px 0 4px; font-size: 15px; }
.au-info h2:first-child { margin-top: 0; }
.au-info p { margin: 0 0 6px; }
.pix-wait { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 6px 0 0; font-weight: 600; }
.pay-spin.pay-spin-sm { width: 20px; height: 20px; margin: 0; border-width: 3px; }

/* Computador: site mais largo (painel e admin com mais espaço) */
@media (min-width: 1240px) {
  .topbar, .container, .gift-bar, .card.xwide, .tabs { max-width: 1320px; }
}

/* Admin › Funções: matriz função × plano */
.fx-hint { margin: 4px 0 0; }
.fx-table { width: 100%; border-collapse: separate; border-spacing: 0 6px; min-width: 620px; }
.fx-table th, .fx-table td { text-align: center; vertical-align: middle; }
.fx-head th { padding: 18px 6px 4px; font-size: 13px; font-weight: 700; color: var(--muted); white-space: nowrap; width: 112px; }
.fx-head th.fx-grp { text-align: left; padding-left: 0; font-size: 20px; color: var(--text); width: auto; }
.fx-head .fx-c-casual { color: var(--ok-soft); }
.fx-head .fx-c-pro { color: var(--group-title); }
.fx-head .fx-c-top { color: var(--admin); }
.fx-head .fx-c-off { color: var(--err-soft); }
.fx-row > * { background: var(--field); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 10px 6px; }
.fx-row > th { text-align: left; padding-left: 14px; border-left: 1px solid var(--line); border-radius: 12px 0 0 12px; }
.fx-row > td:last-child { border-right: 1px solid var(--line); border-radius: 0 12px 12px 0; }
.fx-row td.fx-c-off { border-left: 1px dashed var(--line); }
.fx-row:hover > * { border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); }
.fx-cell { display: inline-flex; margin: 0; cursor: pointer; padding: 4px; border-radius: 50%; }
.fx-cell input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.fx-mark {
  --c: var(--line);
  display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%;
  border: 2px solid var(--line); background: transparent; transition: background .15s, border-color .15s, transform .1s;
}
.fx-mark svg { width: 16px; height: 16px; fill: none; stroke: var(--c); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; opacity: 0; }
.fx-cell:hover .fx-mark { border-color: var(--muted); }
.fx-cell input:focus-visible + .fx-mark { outline: 2px solid var(--accent); outline-offset: 2px; }
.fx-c-casual .fx-mark { --c: var(--ok); }
.fx-c-pro .fx-mark { --c: var(--accent); }
.fx-c-top .fx-mark { --c: #F5B300; }
.fx-c-off .fx-mark { --c: var(--red); }
/* incluído (planos acima do mínimo escolhido): contorno + visto */
.fx-row:has(input[value="casual"]:checked) :is(.fx-c-casual, .fx-c-pro, .fx-c-top) .fx-mark,
.fx-row:has(input[value="pro"]:checked) :is(.fx-c-pro, .fx-c-top) .fx-mark,
.fx-row:has(input[value="top"]:checked) .fx-c-top .fx-mark { border-color: var(--c); }
.fx-row:has(input[value="casual"]:checked) :is(.fx-c-casual, .fx-c-pro, .fx-c-top) .fx-mark svg,
.fx-row:has(input[value="pro"]:checked) :is(.fx-c-pro, .fx-c-top) .fx-mark svg,
.fx-row:has(input[value="top"]:checked) .fx-c-top .fx-mark svg { opacity: 1; }
/* o escolhido: cheio */
.fx-cell input:checked + .fx-mark { background: var(--c); border-color: var(--c); }
.fx-cell input:checked + .fx-mark svg { stroke: #fff; opacity: 1; }
.fx-row:has(input[value="off"]:checked) > th strong { opacity: .55; text-decoration: line-through; }
@media (max-width: 640px) {
  .fx-table { min-width: 0; }
  .fx-head th { width: 46px; padding: 14px 2px 4px; font-size: 10px; white-space: normal; line-height: 1.15; overflow-wrap: normal; word-break: keep-all; }
  .fx-head th.fx-grp { font-size: 17px; }
  .fx-row > * { padding: 8px 2px; }
  .fx-row > th { padding-left: 10px; }
  .fx-row .feature-name small { display: none; }
  .fx-cell { padding: 2px; }
  .fx-mark { width: 26px; height: 26px; }
  .fx-mark svg { width: 14px; height: 14px; }
}

/* Admin › Resumo: caixa de segurança */
.sec-box h2 { margin: 0 0 10px; font-size: 18px; }
.sec-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.sec-list li { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: 10px; background: var(--field); border: 1px solid var(--line); border-left-width: 4px; }
.sec-list li.is-ok { border-left-color: var(--ok); }
.sec-list li.is-warn { border-left-color: var(--admin); }
.sec-list .muted { font-size: 12.5px; overflow-wrap: anywhere; }
.nav-a { white-space: nowrap; }
.nav a.nav-a[aria-current="page"] { color: var(--accent); }

/* Selos dos planos: cores vivas e iguais em todo o lado (painel, cadeados, presentes) */
.badge-pro, .badge-lock.badge-pro { background: linear-gradient(90deg, #7C4DFF, #C13CFF); color: #fff; }
.badge-top, .badge-lock.badge-top { background: linear-gradient(90deg, #F5B300, #FF6A1A); color: #1A0E00; }
.badge-lock.badge-pro, .badge-lock.badge-top { box-shadow: 0 1px 6px rgba(124, 77, 255, .25); }
.badge-lock.badge-top { box-shadow: 0 1px 6px rgba(245, 140, 0, .25); }

/* Checkout: todas as formas de pagamento, com a moeda por baixo */
.pay-opt-txt { display: flex; flex-direction: column; line-height: 1.25; }
.pay-opt-txt small { font-size: 12px; font-weight: 500; }
.pay-opt.is-off { opacity: .5; cursor: not-allowed; }

/* Dados de faturação (Painel › Conta e checkout) */
.bill-box { margin: 6px 0 14px; }
.bill-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 0 14px; }
.bill-kind { margin-bottom: 12px; }
.bill-private { margin: 4px 0 0; }
.check-inline { display: inline-flex; gap: 6px; align-items: center; font-size: 13px; font-weight: 500; margin-left: 4px; }
.check-inline input { width: 16px; height: 16px; margin: 0; }
.bill-co { margin: 0 0 18px; border: 1px solid var(--line); border-radius: 14px; background: var(--card); }
.bill-co > summary { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; padding: 12px 14px; cursor: pointer; list-style: none; }
.bill-co > summary::-webkit-details-marker { display: none; }
.bill-co > summary::before { content: "▸"; color: var(--muted); transition: transform .15s; }
.bill-co[open] > summary::before { transform: rotate(90deg); }
.bill-co-t { font-weight: 700; }
.bill-co-s { font-size: 13px; min-width: 0; overflow-wrap: anywhere; }
.bill-co-e { margin-left: auto; color: var(--cyan); font-weight: 600; font-size: 13px; }
.bill-co[open] .bill-co-e { display: none; }
.bill-co > .bill-box { margin: 0; padding: 4px 14px 14px; }
.facts-tight { gap: 4px 12px; margin: 0; font-size: 13px; }
td:first-child .row-menu-box { left: 0; right: auto; width: 290px; }

/* Teste grátis, confirmação no checkout e página AFK */
.trial-box { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); background: color-mix(in srgb, var(--accent) 12%, var(--card)); }
.trial-box p { margin: 0; }
.trial-note { margin: -12px 0 18px; }
.consent-box { padding: 12px 14px; border-radius: 12px; border: 1px solid var(--line); background: var(--field); }
.consent-box .check { font-weight: 500; line-height: 1.45; }
#pay-btn:disabled { opacity: .45; cursor: not-allowed; }
.refund-box { width: 300px; font-size: 13px; }
.refund-box p { margin: 0; }
.refund-box label:not(.check) { display: grid; gap: 4px; font-weight: 600; }
.refund-box input[type=number] { padding: 8px 10px; }
.refund-proof summary { cursor: pointer; color: var(--cyan); font-weight: 600; }
.refund-proof p { margin: 6px 0 0; overflow-wrap: anywhere; }
.afk { max-width: 520px; margin: 40px auto 24px; padding: 0 16px; text-align: center; }
.afk-avatar { position: relative; width: 132px; height: 132px; margin: 0 auto 18px; }
.afk-avatar img, .afk-avatar > span:first-child { width: 132px; height: 132px; border-radius: 50%; object-fit: cover; display: grid; place-items: center; filter: grayscale(.85) brightness(.8); border: 3px solid var(--line); background: var(--field); font-size: 52px; font-weight: 800; line-height: 1; color: var(--muted); }
.afk-zz { position: absolute; top: -6px; right: -18px; font-weight: 800; color: var(--accent); font-size: 22px; letter-spacing: 2px; }
.afk-zz span:nth-child(1) { font-size: 17px; } .afk-zz span:nth-child(2) { font-size: 13px; }
.afk-nick { display: flex; justify-content: center; align-items: center; gap: 8px; margin: 0; font-size: 26px; overflow-wrap: anywhere; }
.afk-handle { margin: 4px 0 18px; color: var(--muted); font-size: 14px; }
.afk-line { margin: 0 auto 26px; padding: 14px 18px; max-width: 420px; border-radius: 14px; border: 1px dashed var(--line); background: var(--card); font-size: 18px; font-weight: 700; }
@media (prefers-reduced-motion: no-preference) {
  .afk-zz { animation: afk-zz 2.4s ease-in-out infinite; }
  @keyframes afk-zz { 0%, 100% { transform: translateY(0); opacity: .9; } 50% { transform: translateY(-6px); opacity: .5; } }
}
@media (max-width: 430px) { .hide-xxs { display: none; } }

/* Painel › AO VIVO e Online */
.lv-list { display: grid; gap: 8px; }
.lv-row { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px; border: 1px solid var(--line); background: var(--card); }
.lv-row .ic { width: 38px; height: 38px; border-radius: 10px; display: inline-grid; place-items: center; flex-shrink: 0; background: var(--brand, var(--field)); color: var(--on-brand, var(--text)); }
.lv-txt { flex: 1; min-width: 0; display: grid; gap: 2px; font-size: 14px; }
.lv-txt .muted { font-size: 13px; overflow-wrap: anywhere; }
.lv-now { font-size: 13px; font-weight: 700; }
.lv-now.lv-on { color: #FF4B55; }
.lv-now.lv-on::before { content: "● "; }
.lv-now.lv-ok { color: var(--ok-soft); }
.lv-extra { margin: -2px 0 6px; padding: 10px 14px 12px; border-radius: 0 0 14px 14px; border: 1px dashed var(--line); border-top: 0; }
.lv-extra label:not(.check) { display: block; font-weight: 600; font-size: 13px; margin: 2px 0 6px; }
.lv-extra .hint, .lv-extra p { margin: 6px 0 0; }
.lv-join { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.lv-actions { margin-top: 18px; }
.lv-check { margin-top: 10px; }

/* Paletas Neon (Top) no painel */
.ap-neon-h { margin: 14px 0 6px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.swatches-neon { grid-template-columns: repeat(auto-fill, minmax(78px, 1fr)); }
.swatch-neon .sw-box { aspect-ratio: 1.4; box-shadow: 0 0 10px -2px var(--n1); border-color: color-mix(in srgb, var(--n1) 40%, transparent); }
.swatch-neon .sw-box i { width: 18px; height: 18px; }
.swatch-neon .sw-name { display: block; margin-top: 4px; font-size: 11px; font-weight: 600; text-align: center; color: var(--muted); }
.swatch-neon input:checked ~ .sw-name { color: var(--text); }
.swatch-neon input:disabled + .sw-box { opacity: .55; }

.setup-type { display: block; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--cyan); }

/* Aparência: ordem das secções */
.sec-order { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; counter-reset: sec; }
.sec-order li { display: flex; align-items: center; gap: 8px; padding: 6px 8px 6px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--card); counter-increment: sec; }
.sec-num::before { content: counter(sec); display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; font-size: 12px; font-weight: 800; background: var(--cyan); color: #06201d; }
.sec-name { flex: 1; font-weight: 700; }
.sec-mv { min-width: 40px; padding: 0; }
.sec-order li:first-child .sec-mv[data-mv="-1"], .sec-order li:last-child .sec-mv[data-mv="1"] { visibility: hidden; }

/* Admin · nicks reservados */
.rn-quick { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 10px 0 0; padding: 10px 12px; border: 1px dashed var(--cyan); border-radius: 10px; }
.rn-quick span { flex: 1; min-width: 160px; }
.rn-quick select { width: auto; min-height: 36px; }
.rn-kind { display: inline-block; padding: 2px 9px; border-radius: 999px; font-size: 12px; font-weight: 700; border: 1px solid var(--line); }
.rn-system { color: var(--muted); }
.rn-brand { color: var(--cyan); border-color: color-mix(in srgb, var(--cyan) 45%, transparent); }
.rn-blocked { color: #FF6B81; border-color: color-mix(in srgb, #FF6B81 45%, transparent); }
.rn-table td.rn-note { white-space: normal; min-width: 160px; max-width: 320px; color: var(--muted); }
.rn-table td.rn-act { text-align: right; }
.rn-act > * { display: inline-block; vertical-align: middle; }
.rn-edit { position: relative; }
.rn-edit summary { list-style: none; }
.rn-edit summary::-webkit-details-marker { display: none; }
.rn-edit[open] form { position: absolute; right: 0; top: calc(100% + 6px); z-index: 5; display: grid; gap: 8px; width: 260px; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--card); box-shadow: 0 10px 30px rgba(0,0,0,.35); }
.rn-add { margin-top: 8px; }
.rn-table td a.status { margin-left: 6px; text-decoration: none; }
.periods a .muted { margin-left: 5px; font-weight: 600; }

/* Presentes (oferecer, os meus presentes, resgatar) */
.gift-qty { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.gift-qty .btn { width: 44px; min-height: 44px; padding: 0; font-size: 20px; }
.gift-qty input { width: 72px; text-align: center; font-size: 20px; font-weight: 800; }
.gift-sum { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 14px 0; padding: 14px 16px; border: 1px solid var(--line); border-radius: 12px; }
.gift-sum strong { font-size: 22px; }
.gift-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; }
.gift-warn { margin: 12px 0; }
.gift-code { font: 700 14px ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .05em; }
.gift-table td { white-space: normal; }
.gift-act { text-align: right; white-space: nowrap !important; }
.gift-refund { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; padding: 8px 0; border-top: 1px solid var(--line); font-size: 14px; }
.gift-redeem { text-align: center; }
.gift-hero .gift-big { font-size: 56px; line-height: 1; margin-bottom: 8px; }
.gift-codebox { display: inline-block; margin: 6px 0 16px; padding: 12px 18px; border: 2px dashed var(--cyan); border-radius: 12px; font: 800 22px ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .1em; }
.gift-redeem .alert { text-align: left; }
.gift-redeem .search-row { text-align: left; }

/* Aviso importante (caixa amarela com ⚠) */
.tip { display: flex; align-items: flex-start; flex-wrap: wrap; gap: 8px; margin: 8px 0 0; padding: 10px 12px; border-radius: 10px; font-size: 13px; line-height: 1.45; font-weight: 600;
  color: var(--text); background: color-mix(in srgb, #F5B400 13%, transparent); border: 1px solid color-mix(in srgb, #F5B400 45%, transparent); }
.tip::before { content: "⚠"; color: #F5B400; font-size: 15px; line-height: 1.2; }
.tip > span { flex: 1; min-width: 180px; }
.tip.tip-ok { background: color-mix(in srgb, #23C55E 12%, transparent); border-color: color-mix(in srgb, #23C55E 45%, transparent); }
.tip.tip-ok::before { content: "✓"; color: #23C55E; }
.lv-extra .tip { margin-top: 8px; }

/* Setup: prévia do aviso de afiliados (só com a caixa marcada) */
.aff-prev { display: grid; gap: 4px; margin: 8px 0 12px; padding: 10px 12px; border-left: 3px solid var(--cyan); border-radius: 0 10px 10px 0; background: color-mix(in srgb, var(--cyan) 8%, transparent); font-size: 13px; }
.aff-prev q { font-style: italic; }
form:has(#aff_note:not(:checked)) .aff-prev { display: none; }

/* Setup (painel): sugestões e grupos que abrem/fecham */
.chip-suggest-t { margin: 12px 0 6px; font-size: 13px; font-weight: 700; color: var(--muted); }
.setup-group > summary { display: flex; align-items: center; gap: 8px; cursor: pointer; list-style: none; user-select: none; }
.setup-group > summary::-webkit-details-marker { display: none; }
.setup-group > summary::before { content: "▸"; display: inline-block; transition: transform .15s; }
.setup-group[open] > summary::before { transform: rotate(90deg); }
.setup-group > summary small { font-weight: 600; letter-spacing: 0; text-transform: none; }
.setup-group:first-of-type > summary { margin-top: 8px; }

/* Conta: bloco do nick em destaque (é o endereço da página) */
.nick-box { margin: 14px 0 6px; padding: 4px 16px 16px; border-radius: 14px; border: 1px solid color-mix(in srgb, #FF3355 45%, transparent); background: color-mix(in srgb, #FF3355 9%, transparent); }
.nick-box h2 { margin-top: 12px; }
.creator-pf { border: 0; padding: 0; margin: 0 0 12px; min-width: 0; }
.creator-pf legend { font-weight: 600; font-size: 14px; margin-bottom: 6px; padding: 0; }
.creator-pf-list { display: flex; flex-wrap: wrap; gap: 6px 16px; }
.creator-pf input[type=text] { margin-top: 8px; }

/* Aparência › Caixas: um grupo aberto de cada vez */
details.box-group > summary { display: flex; align-items: center; gap: 8px; cursor: pointer; list-style: none; margin: 0; }
details.box-group > summary::-webkit-details-marker { display: none; }
details.box-group > summary::after { content: "▾"; margin-left: auto; transition: transform .15s; color: var(--muted); }
details.box-group:not([open]) > summary::after { transform: rotate(-90deg); }
details.box-group > summary small { font-weight: 600; font-size: 12px; }
details.box-group[open] > summary { margin-bottom: 4px; }
.setup-group > summary { padding: 8px 12px; border-radius: 10px; background: color-mix(in srgb, var(--text) 5%, transparent); margin-top: 14px; }
.setup-group > summary:hover { background: color-mix(in srgb, var(--text) 9%, transparent); }
.setup-group[open] > summary { margin-bottom: 8px; }
details.box-group:not([open]) { padding-block: 10px; }
.sp-ic.sp-img img { width: 100%; height: 100%; object-fit: contain; display: block; }

/* Conta › Perfil de criador: caixa própria e uma linha por rede */
.creator-box { margin: 18px 0 6px; padding: 4px 16px 16px; border-radius: 14px; border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); background: color-mix(in srgb, var(--accent) 8%, transparent); }
.creator-box h2 { margin-top: 12px; }
.creator-nets { border: 0; padding: 0; margin: 0 0 12px; min-width: 0; display: grid; gap: 8px; }
.creator-nets legend { font-weight: 600; font-size: 14px; margin-bottom: 6px; padding: 0; }
.creator-net { display: grid; grid-template-columns: minmax(140px, 1fr) minmax(120px, 1fr) auto; gap: 8px; align-items: center; }
.creator-net:has([data-net-other]:not([hidden])) { grid-template-columns: minmax(120px, 1fr) minmax(110px, 1fr) minmax(110px, 1fr) auto; }
.creator-net .creator-net-x { width: 40px; min-height: 40px; padding: 0; font-size: 18px; }
.creator-nets [data-net-add] { justify-self: start; }
@media (max-width: 560px) {
  .creator-net, .creator-net:has([data-net-other]:not([hidden])) { grid-template-columns: 1fr auto; padding-bottom: 10px; border-bottom: 1px dashed var(--line); }
  .creator-net select, .creator-net [data-net-other] { grid-column: 1 / -1; }
}

/* ---------- Kit do Parceiro ---------- */
.pk-hero { position: relative; overflow: hidden; background:
  radial-gradient(600px 220px at 0% 0%, rgba(124,77,255,.28), transparent 70%),
  radial-gradient(500px 200px at 100% 100%, rgba(46,230,214,.14), transparent 70%), var(--card); }
.pk-hero-logo { display: block; height: 40px; width: auto; margin-bottom: 10px; }
:root[data-theme="light"] .pk-hero-logo { content: url(../kit/logo-claro.svg); }
.pk-toc { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.pk-toc a { padding: 6px 12px; border-radius: 999px; border: 1px solid var(--line); background: var(--field); color: var(--text); font-size: 13px; font-weight: 600; text-decoration: none; }
.pk-toc a:hover { border-color: var(--accent); }
.pk-benefits { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 12px; }
.pk-ben { display: flex; flex-direction: column; gap: 6px; align-items: flex-start; padding: 16px; border-radius: 14px; background: var(--field); border: 1px solid var(--line); }
.pk-ben p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.45; }
.pk-ben-i { font-size: 26px; line-height: 1; }
.pk-ben-top { border-color: #E9B949; background: linear-gradient(135deg, rgba(233,185,73,.16), transparent 60%), var(--field); }
.pk-ben-codes, .pk-media { grid-column: 1 / -1; }
.pk-media { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.pk-media .check { flex: 1 1 320px; }
.pk-codes { list-style: none; margin: 6px 0; padding: 0; width: 100%; display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 8px; }
.pk-code { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: 10px; background: var(--card); border: 1px solid var(--line); border-left: 4px solid var(--accent); font-size: 14px; }
.pk-code b { white-space: nowrap; }
.pk-code-top { border-left-color: #E9B949; }
.pk-code-pro { border-left-color: var(--accent); }
.pk-code-casual { border-left-color: #2EE6D6; }
.pk-media .check { font-size: 14px; color: var(--muted); }
.pk-vit { border: 1px solid color-mix(in srgb, var(--accent, #7C4DFF) 45%, var(--line)); }
.pk-vit-st { display: inline-block; margin: 2px 0 14px; padding: 6px 12px; border-radius: 999px; font-size: 13.5px; font-weight: 600; background: var(--field); border: 1px solid var(--line); }
.pk-vit-v_st_pending { color: #B7791F; border-color: rgba(214,158,46,.45); background: rgba(214,158,46,.1); }
.pk-vit-v_st_on, .pk-vit-v_st_ok { color: #2F855A; border-color: rgba(56,161,105,.45); background: rgba(56,161,105,.1); }
.pk-vit-grid { display: grid; grid-template-columns: 200px 1fr; gap: 20px; align-items: start; }
.pk-vit-grid .field { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.pk-vit-grid .field:last-child { align-items: stretch; }
.pk-vit-grid .field:last-child .btn { align-self: flex-start; }
.pk-vit-photo { width: 200px; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 14px; border: 1px solid var(--line); background: var(--field); }
.pk-vit-empty { display: grid; place-items: center; font-size: 34px; }
.pk-vit-media { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 12px 14px; border-radius: 12px; background: var(--field); border: 1px solid var(--line); }

.pk-vit-media .check { flex: none; }
@media (max-width: 640px) { .pk-vit-grid { grid-template-columns: 1fr; } .pk-vit-photo { width: 160px; } }
.pk-link-grid { display: grid; grid-template-columns: 1fr 220px; gap: 20px; align-items: start; }
.pk-qr-box { display: flex; flex-direction: column; gap: 8px; align-items: center; text-align: center; }
.pk-qr { width: 200px; height: 200px; border-radius: 14px; background: #fff; }
.pk-namelink { display: grid; gap: 8px; margin: 10px 0 16px; padding: 14px; border-radius: 14px; border: 1px solid var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); }
.pk-nl-l { flex: 0 0 auto; min-width: 54px; align-self: center; font-weight: 700; font-size: 13px; color: var(--muted); }
.pk-where { display: grid; gap: 8px; }
.pk-w { border: 1px solid var(--line); border-radius: 12px; background: var(--field); }
.pk-w > summary { display: flex; align-items: center; gap: 10px; padding: 10px 14px; cursor: pointer; font-weight: 700; list-style: none; }
.pk-w > summary::-webkit-details-marker { display: none; }
.pk-w > summary::after { content: "▸"; margin-left: auto; transition: transform .15s; color: var(--muted); }
.pk-w[open] > summary::after { transform: rotate(90deg); }
.pk-w > p { margin: 0; padding: 0 14px 12px; color: var(--muted); line-height: 1.5; }
.pk-w-i { font-size: 18px; width: 30px; text-align: center; }
.pk-bot { margin: 0 14px 10px; }
.pk-texts { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 12px; }
.pk-text { padding: 12px; border-radius: 12px; border: 1px solid var(--line); background: var(--field); }
.pk-text-h button { white-space: nowrap; }
.pk-text-h { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 8px; }
.pk-text textarea { width: 100%; resize: vertical; font-size: 14px; line-height: 1.45; background: var(--card); }
.pk-arts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 12px 0 20px; }
.pk-art { margin: 0; display: flex; flex-direction: column; gap: 8px; }
.pk-art canvas { width: 100%; height: auto; border-radius: 12px; border: 1px solid var(--line); background: var(--bg); }
.pk-a-wide { grid-column: span 2; }
.pk-a-tall { grid-column: 3; grid-row: 1 / span 3; }
.pk-a-tall canvas { max-height: 640px; object-fit: contain; }
.pk-a-checker canvas { background: repeating-conic-gradient(#2a2338 0% 25%, #1b1626 0% 50%) 50% / 24px 24px; }
.pk-art figcaption { display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 14px; }
.pk-logos { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px; margin: 10px 0 14px; }
.pk-logo { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; min-height: 120px; padding: 16px; border-radius: 12px; border: 1px solid var(--line); text-decoration: none; }
.pk-logo img { max-width: 100%; height: 34px; width: auto; }
.pk-logo-sq img { height: 56px; }
.pk-logo small { font-weight: 700; font-size: 12px; }
.pk-logo-dark { background: #0B0912; color: #A59FB8; }
.pk-logo-light { background: #F4F2F9; color: #625B73; }
.pk-logo-accent { background: #7C4DFF; color: #fff; }
.pk-logo:hover { outline: 2px solid var(--accent); outline-offset: 2px; }
.pk-rules { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.pk-rule { padding: 14px 16px; border-radius: 12px; border: 1px solid var(--line); background: var(--field); }
.pk-rule h3 { margin: 0 0 8px; font-size: 16px; }
.pk-rule ul { margin: 0; padding-left: 18px; display: grid; gap: 6px; line-height: 1.45; }
.pk-rule-do { border-left: 4px solid #2EBD6B; }
.pk-rule-dont { border-left: 4px solid #FF3355; }
.pk-ad { margin-top: 12px; }
.pk-steps { margin: 0 0 14px; padding-left: 20px; display: grid; gap: 6px; line-height: 1.5; }
.pk-prog { display: grid; gap: 8px; padding: 14px; border-radius: 12px; background: var(--field); border: 1px solid var(--line); }
.pk-prog-bar { height: 12px; border-radius: 999px; background: var(--line); overflow: hidden; }
.pk-prog-bar span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #7C4DFF, #2EE6D6); }
@media (max-width: 760px) {
  .pk-link-grid, .pk-rules { grid-template-columns: 1fr; }
  .pk-arts { grid-template-columns: 1fr; }
  .pk-a-wide, .pk-a-tall { grid-column: auto; grid-row: auto; }
  .pk-a-tall canvas { max-height: 520px; }
}
.pk-admin-acts { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.pk-term { margin: 4px 0 14px; border: 1px solid var(--line); border-radius: 12px; padding: 10px 14px; background: var(--field); }
.pk-term > summary { cursor: pointer; font-weight: 600; font-size: 14px; }
.pk-term-form { display: grid; grid-template-columns: 2fr 1fr 1fr auto; gap: 10px 12px; align-items: end; margin-top: 12px; }
.pk-term-form .field { margin: 0; }
.pk-term-form .hint { grid-column: 1 / -1; margin: 0; }
@media (max-width: 720px) { .pk-term-form { grid-template-columns: 1fr 1fr; } .pk-term-name { grid-column: 1 / -1; } }
.pk-admin-acts form { margin: 0; }
.item-main small.pk-admin-info { white-space: normal; overflow: visible; text-overflow: clip; line-height: 1.5; }
.gift-plans { margin-top: -10px; }
.gift-plans a { font-size: 13px; min-height: 32px; }
.gift-plans a.gp-casual { border-left: 3px solid #2EE6D6; }
.gift-plans a.gp-pro { border-left: 3px solid #7C4DFF; }
.gift-plans a.gp-top { border-left: 3px solid #E9B949; }

/* ---------- Sugestões ---------- */
.sg-home { display: flex; align-items: center; gap: 14px 18px; flex-wrap: wrap; margin: 4px 0 18px; padding: 18px 20px; border-radius: 16px;
  border: 1px solid color-mix(in srgb, #FFC93C 55%, transparent);
  background: radial-gradient(120% 160% at 0% 0%, rgba(255,201,60,.18), transparent 60%), var(--field);
  box-shadow: 0 0 24px rgba(255,201,60,.12); }
.sg-home-ic { font-size: 34px; filter: drop-shadow(0 0 10px rgba(255,201,60,.6)); }
.sg-home > div { flex: 1; min-width: 220px; display: grid; gap: 3px; }
.sg-home strong { font-size: 17px; }
.sg-home span { color: var(--muted); font-size: 14px; }
.sg-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.sg-kinds { border: 0; padding: 0; margin: 0 0 14px; display: flex; flex-wrap: wrap; gap: 8px; }
.sg-kinds legend { margin-bottom: 8px; }
.sg-kind input { position: absolute; opacity: 0; }
.sg-kind span { display: inline-flex; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--line); background: var(--field); font-weight: 600; font-size: 14px; cursor: pointer; }
.sg-kind input:checked + span { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 18%, var(--field)); }
.sg-kind input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.sg-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.sg-item { padding: 14px 16px; border-radius: 14px; border: 1px solid var(--line); background: var(--field); border-left: 4px solid var(--line); }
.sg-item p { margin: 8px 0 0; line-height: 1.5; }
.sg-item-h { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; flex-wrap: wrap; }
.sg-status { font-size: 13px; font-weight: 700; padding: 3px 10px; border-radius: 999px; background: var(--card); border: 1px solid var(--line); white-space: nowrap; }
.sg-st-new { border-left-color: #7C4DFF; } .sg-st-review { border-left-color: #22D3EE; } .sg-st-dev { border-left-color: #F59E0B; }
.sg-st-done { border-left-color: #2EBD6B; } .sg-st-later { border-left-color: #A59FB8; } .sg-st-pending { border-left-color: #64748B; }
.sg-reply { margin-top: 10px; padding: 10px 12px; border-radius: 10px; background: color-mix(in srgb, var(--accent) 10%, var(--card)); border: 1px solid color-mix(in srgb, var(--accent) 35%, transparent); }
.sg-reply p { margin: 4px 0 0; }
.sg-admin-form { margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--line); }
.sg-admin-checks { display: grid; gap: 6px; align-content: end; }
.sg-admin-acts { display: flex; gap: 8px; }
.rn-state.rn-gift { border-color: #E9B949; } .rn-state.rn-user { border-color: var(--accent); } .rn-state.rn-old { border-color: var(--muted); }

/* Admin › Custos dos pagamentos */
.fee-grid{display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(min(100%,520px),1fr));margin-top:18px}
.fee-box{border:1px solid var(--line,rgba(127,127,127,.25));border-radius:16px;padding:18px;min-width:0}
.fee-box .card-h{margin-top:0}
.fee-chips{display:flex;flex-wrap:wrap;gap:8px;margin:-4px 0 14px}
.fee-chip{cursor:pointer;border:1px solid var(--line,rgba(127,127,127,.3));background:transparent;color:inherit;border-radius:999px;padding:6px 12px;font:inherit;font-size:.85rem}
.fee-chip:hover{border-color:var(--accent,#7C4DFF)}
.fee-table{width:100%;font-size:.92rem}
.fee-table td,.fee-table th{padding:8px 6px;vertical-align:top}
.fee-table tr.fee-best td{background:rgba(46,230,214,.08)}
.fee-table tr.fee-best td:first-child strong::after{content:" ⭐"}
.fee-total{margin:12px 0 0;font-size:.92rem;line-height:1.5}
.fee-note{margin-top:14px}
.fee-edit input{width:100%;max-width:110px;padding:6px 8px}
.fee-edit td{padding:6px}
.fee-table td.num{white-space:nowrap}
@media (max-width:560px){.fee-box{padding:12px}.fee-table{font-size:.85rem}.fee-table td,.fee-table th{padding:6px 4px}.fee-opt{display:none}}

/* Preço de lançamento (checkout, presentes, admin) */
.ln-note{display:flex;flex-direction:column;gap:8px;margin:0 0 16px;padding:12px 16px;border-radius:14px;border:1px solid rgba(255,51,85,.45);background:rgba(255,51,85,.08)}
.ln-note strong{color:#FF6A80}
:root[data-theme="light"] .ln-note strong{color:#D11A3D}
.ln-bar{height:10px;border-radius:999px;background:rgba(127,127,127,.22);overflow:hidden}
.ln-bar span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#FF3355,#7C4DFF)}
.ln-then{font-size:.85em;opacity:.75}
.ln-adm-bar{height:14px}

/* Menus dentro de tabelas (Reembolso, Dados da fatura…): abrem como janela ao centro, sem barras de rolagem na tabela */
.table-wrap .row-menu[open] > summary::before { content: ""; position: fixed; inset: 0; z-index: 99; background: rgba(5,4,10,.6); cursor: default; }
.table-wrap .row-menu[open] .row-menu-box { position: fixed; left: 50%; top: 50%; right: auto; transform: translate(-50%, -50%); z-index: 100;
  width: min(380px, calc(100vw - 32px)); max-height: calc(100vh - 48px); overflow-y: auto; padding: 18px; box-shadow: 0 20px 60px rgba(0,0,0,.55); }
.table-wrap td:first-child .row-menu[open] .row-menu-box { left: 50%; width: min(420px, calc(100vw - 32px)); }

/* Página 404 / nick livre */
.nf{position:relative;overflow:hidden;max-width:820px;margin:20px auto 40px;padding:56px 24px 40px;border-radius:28px;text-align:center;
  border:1px solid var(--line);background:radial-gradient(ellipse 70% 60% at 50% 0%,rgba(124,77,255,.28),transparent 70%),
  linear-gradient(rgba(124,77,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(124,77,255,.08) 1px,transparent 1px),var(--card);
  background-size:100% 100%,40px 40px,40px 40px,auto;display:flex;flex-direction:column;align-items:center;gap:18px}
.nf-glow{position:absolute;inset:auto -20% -40% -20%;height:60%;background:radial-gradient(ellipse at center,rgba(46,230,214,.18),transparent 70%);pointer-events:none}
.nf-404{position:absolute;top:-10px;left:50%;transform:translateX(-50%);font:800 clamp(140px,28vw,260px)/1 "Chakra Petch",system-ui,sans-serif;letter-spacing:-.04em;
  color:transparent;-webkit-text-stroke:2px rgba(124,77,255,.22);pointer-events:none;user-select:none}
.nf>*:not(.nf-404):not(.nf-glow){position:relative}
.nf-pill{display:inline-block;padding:6px 16px;border-radius:999px;font-size:.78rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  border:1.5px solid rgba(255,51,85,.6);color:#FF6A80;background:rgba(255,51,85,.1)}
.nf-pill.is-free{border-color:rgba(46,230,214,.6);color:#2EE6D6;background:rgba(46,230,214,.1)}
.nf-pill.is-free::before{content:"● "}
.nf-h{margin:6px 0 0;font-size:clamp(2rem,6vw,3.2rem);line-height:1.08;letter-spacing:-.01em}
.nf-h em{font-style:normal;background:linear-gradient(90deg,#2EE6D6,#7C4DFF);-webkit-background-clip:text;background-clip:text;color:transparent}
.nf-p{margin:0;max-width:560px;font-size:1.08rem;line-height:1.6;opacity:.85}
.nf-nick{display:flex;align-items:center;gap:2px;padding:14px 22px;border-radius:16px;border:2px solid #7C4DFF;background:rgba(124,77,255,.1);
  box-shadow:0 0 40px rgba(124,77,255,.35);font-size:clamp(1.1rem,4vw,1.5rem);max-width:100%;overflow:hidden}
.nf-nick span{opacity:.65}.nf-nick b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nf-nick i{font-style:normal;margin-left:12px;display:grid;place-items:center;width:28px;height:28px;flex:none;border-radius:50%;background:#2EE6D6;color:#0B0912;font-weight:900;font-size:.9rem}
.nf-acts{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:6px}
.nf-feat{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.nf-feat li{padding:6px 14px;border-radius:999px;font-size:.82rem;font-weight:700;border:1px solid rgba(46,230,214,.45);color:#2EE6D6;background:rgba(46,230,214,.07)}
.nf-feat li.is-live{border-color:rgba(255,51,85,.55);color:#FF6A80;background:rgba(255,51,85,.08)}
.nf-feat li.is-live::before{content:"● "}
.nf-trial{margin:0;font-size:.95rem;opacity:.85}
.nf-follow{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:10px;padding-top:20px;border-top:1px solid var(--line);width:min(420px,100%)}
.nf-follow>span{font-size:.8rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;opacity:.7}
.nf-soc{display:flex;gap:12px}
.nf-soc a{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;border:1px solid var(--line);background:rgba(127,127,127,.08);color:inherit;transition:transform .15s,border-color .15s,box-shadow .15s}
.nf-soc a svg{width:22px;height:22px}
.nf-soc a:hover{transform:translateY(-2px)}
.nf-soc-instagram:hover{border-color:#FF0069;box-shadow:0 0 20px rgba(255,0,105,.45)}
.nf-soc-youtube:hover{border-color:#FF0000;box-shadow:0 0 20px rgba(255,0,0,.4)}
.nf-soc-tiktok:hover{border-color:#2EE6D6;box-shadow:0 0 20px rgba(46,230,214,.45)}
:root[data-theme="light"] .nf-pill.is-free,:root[data-theme="light"] .nf-feat li{color:#0B7F76}
:root[data-theme="light"] .nf-pill,:root[data-theme="light"] .nf-feat li.is-live{color:#D11A3D}
@media (max-width:560px){.nf{padding:44px 16px 30px;border-radius:20px}.nf-acts .btn{width:100%}.nf-nick{font-size:1rem;padding:12px 14px}}

/* Redes da MyTag.Live no rodapé */
.foot-soc{display:flex;justify-content:center;gap:10px;margin:14px 0 4px}
.foot-soc a{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;border:1px solid var(--line);color:var(--muted);transition:color .15s,border-color .15s,transform .15s}
.foot-soc a svg{width:18px;height:18px}
.foot-soc a:hover{transform:translateY(-2px);color:var(--text)}
.foot-soc-instagram:hover{border-color:#FF0069}.foot-soc-youtube:hover{border-color:#FF0000}.foot-soc-tiktok:hover{border-color:#2EE6D6}

/* Conta suspensa: página em análise */
.nf-ic{display:grid;place-items:center;width:96px;height:96px;border-radius:50%;color:#FFC93C;background:rgba(255,201,60,.1);border:2px solid rgba(255,201,60,.45);box-shadow:0 0 40px rgba(255,201,60,.25)}
.nf.is-review .nf-404{display:none}
.nf-pill.is-review{border-color:rgba(255,201,60,.6);color:#FFC93C;background:rgba(255,201,60,.1)}
.nf-404-res{opacity:.28;filter:saturate(.6)}.nf-nick-res{border-color:#FFC93C;background:rgba(255,201,60,.08)}.nf-nick-res i{background:#FFC93C;font-size:.8rem}.nf-mail{margin-top:10px;font-size:.92rem;opacity:.8}
:root[data-theme="light"] .nf-pill.is-review{color:#9A6B00}
.nf-pill.is-review::before{content:"● "}
:root[data-theme="light"] .nf-pill.is-review,:root[data-theme="light"] .nf-ic{color:#9A6B00}
.su-banner form{margin-top:8px}
.su-adm .row-menu-box{width:min(380px,calc(100vw - 32px))}
.su-adm textarea{width:100%;box-sizing:border-box}

/* Painel › Conta: secções organizadas */
.acc-top{padding-bottom:18px}
.acc-top h1{margin-bottom:12px}
.acc-nav{display:flex;flex-wrap:wrap;gap:8px}
.acc-nav a{padding:7px 14px;border-radius:999px;border:1px solid var(--line);font-size:.85rem;font-weight:700;color:var(--muted);text-decoration:none;transition:border-color .15s,color .15s}
.acc-nav a:hover{border-color:var(--accent);color:var(--text)}
.acc-nav a.is-danger:hover{border-color:#FF3355;color:#FF6A80}
.acc-sec{scroll-margin-top:90px}
.acc-h{display:flex;gap:14px;align-items:flex-start;margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.acc-h h2{margin:0;font-size:1.2rem}
.acc-h p{margin:4px 0 0;color:var(--muted);font-size:.92rem;line-height:1.5}
.acc-ic{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:rgba(124,77,255,.14);color:var(--accent)}
.acc-danger .acc-ic{background:rgba(255,51,85,.12);color:#FF3355}
.acc-sub{margin:22px 0 4px;font-size:1rem}
.acc-rows{display:grid;gap:10px}
.acc-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:var(--field)}
.acc-row-i{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0}
.acc-k{font-size:.8rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);min-width:70px}
.acc-v{font-size:1rem;word-break:break-all}
.acc-note{margin:0}
.acc-more{width:auto}
.acc-more[open]{flex-basis:100%}
.acc-more[open]>summary{margin-bottom:12px}
.acc-more summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;line-height:1.2}
.acc-more summary::-webkit-details-marker{display:none}
.acc-form{display:grid;gap:4px;max-width:420px}
.acc-pending{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.acc-pending p{margin:0}
.acc-addr{margin:0 0 14px}
.acc-nick{border-color:color-mix(in srgb,#FF3355 45%,transparent);background:color-mix(in srgb,#FF3355 7%,var(--card))}
.acc-nick .acc-ic{background:rgba(255,51,85,.14);color:#FF3355}
.acc-nick .acc-h{border-bottom-color:color-mix(in srgb,#FF3355 30%,transparent)}

/* ---------- Paletas próprias (Aparência › As minhas paletas) e arquivo do Admin ---------- */
.pal-list { list-style: none; margin: 8px 0 4px; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.pal-item { display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center; padding: 8px 10px; background: var(--field); border: 1px solid var(--line); border-radius: 12px; }
.pal-item.is-on { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent) inset; }
.pal-strip { display: inline-flex; border-radius: 8px; overflow: hidden; border: 1px solid var(--line); flex-shrink: 0; }
.pal-strip i { display: block; width: 18px; height: 30px; }
.pal-name { font-weight: 700; min-width: 0; overflow-wrap: anywhere; }
.pal-on { display: inline-block; font-size: 11px; font-weight: 800; color: #fff; background: var(--accent); border-radius: 6px; padding: 1px 7px; margin-left: 4px; vertical-align: 1px; }
.pal-acts { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.pal-gen { display: flex; gap: 8px; flex-wrap: wrap; margin: 6px 0; }
.pal-gen .file-btn.is-disabled { opacity: .5; pointer-events: none; }
.pal-chips { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
.pal-chip { width: 30px; height: 30px; border-radius: 8px; border: 1px solid var(--line); }
.pal-sugs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 10px; }
.pal-sug { display: flex; flex-direction: column; gap: 6px; align-items: stretch; padding: 6px; background: var(--field); border: 2px solid var(--line); border-radius: 12px; cursor: pointer; color: var(--text); font: inherit; font-size: 13px; }
.pal-sug.is-on, .pal-sug:hover { border-color: var(--accent); }
.pal-sug:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.pal-mini { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 8px 6px; border-radius: 8px; font-size: 10px; font-weight: 700; min-height: 108px; }
.pal-mini b { width: 22px; height: 22px; border-radius: 50%; border: 3px solid; background: rgba(127,127,127,.35); }
.pal-mini em { font-style: normal; font-size: 11px; }
.pal-mini i { display: block; width: 100%; font-style: normal; text-align: center; padding: 3px 0; border-radius: 5px; }
.pal-mini u { text-decoration: none; padding: 0 6px; border-radius: 5px; }
.pal-editor { margin-top: 10px; padding: 12px; border: 1px dashed var(--accent); border-radius: 12px; }
.pal-colors { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin: 10px 0; }
.pal-col { display: flex; flex-direction: column; align-items: center; gap: 3px; font-size: 12px; font-weight: 700; text-align: center; }
.pal-col input[type=color] { width: 100%; height: 42px; padding: 2px; border-radius: 10px; }
.pal-col code { font-size: 10.5px; color: var(--muted); }
.pal-ed-acts { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
@media (max-width: 600px) {
  .pal-item { grid-template-columns: auto 1fr; }
  .pal-acts { grid-column: 1 / -1; justify-content: flex-start; }
  .pal-colors { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pal-sugs { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
}
/* Admin › Paletas criadas */
.pa-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; margin-top: 12px; }
.pa-card { background: var(--field); border: 1px solid var(--line); border-radius: 14px; padding: 10px; display: flex; flex-direction: column; gap: 8px; position: relative; }
.pa-card.is-new { border-color: var(--admin); box-shadow: 0 0 0 1px var(--admin) inset; }
.pa-card .pal-mini { min-height: 120px; }
.pa-card .pal-strip { width: 100%; }
.pa-card .pal-strip i { flex: 1; width: auto; height: 22px; }
.pa-new { position: absolute; top: 8px; right: 8px; font-size: 10.5px; font-weight: 800; background: var(--admin); color: var(--bg); border-radius: 6px; padding: 1px 6px; }
.pa-meta { font-size: 12.5px; color: var(--muted); display: flex; flex-wrap: wrap; gap: 4px 10px; }
.pa-meta strong { color: var(--text); }
.pa-copy { display: flex; gap: 6px; }
.pa-copy input { flex: 1; min-width: 0; font: 11px ui-monospace, monospace; padding: 4px 6px; }
/* Painel › Destaques */
.dq-title-row { display: flex; gap: 8px; align-items: center; }
.dq-title-row input { flex: 1; min-width: 0; }
.dq-thumb { width: 120px; height: auto; aspect-ratio: 20 / 9; object-fit: cover; border-radius: 8px; border: 1px solid var(--line); flex-shrink: 0; }
@media (max-width: 480px) { .dq-thumb { width: 88px; } }

/* Checkout › botões do PayPal (cartão e carteiras) */
.pp-area { margin-top: 4px; }
.pp-with { margin: 0 0 10px; font-weight: 800; font-size: 16px; }
.pp-area .pp-msg { margin: 0 0 12px; }
.pp-consent { margin: 0 0 10px; }
.pp-load { display: flex; align-items: center; gap: 8px; margin: 6px 0 12px; }
.pp-buttons { max-width: 520px; background: #fff; border-radius: 14px; padding: 14px 14px 4px; position: relative; z-index: 0; transition: opacity .2s, filter .2s; }
.pp-buttons:empty { display: none; }
.pp-buttons.is-off { opacity: .45; filter: grayscale(.5); pointer-events: none; }
.pp-secure { margin: 10px 0 0; }

/* Painel › Twitch + */
.twp-chan { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px; margin: 0 0 10px; }
.twp-chan small { display: block; margin-top: 2px; }
.twp-glitch { flex: none; width: 40px; height: 40px; border-radius: 10px; background: #9146ff; color: #fff; display: flex; align-items: center; justify-content: center; }
.twp-glitch svg { width: 22px; height: 22px; }
.twp-now { margin: 0 0 16px; font-size: 14px; }
.twp-form fieldset { border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; margin: 0 0 14px; }
.twp-form legend { font-weight: 800; padding: 0 6px; }
.twp-opt { align-items: flex-start; padding: 6px 0; }
.twp-opt small { display: block; margin-top: 2px; }
.twp-auth { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--line); }
.twp-connect { background: #9146ff; border-color: #9146ff; color: #fff; display: inline-flex; align-items: center; gap: 8px; }
.twp-sub { margin: -2px 0 8px 32px; padding: 6px 0 4px 12px; border-left: 2px solid var(--line); }
.twp-sub .check { padding: 3px 0; }
.twp-note { margin: 6px 0 0; }
.twp-h { font-size: 17px; margin: 0 0 4px; }

/* Admin › Proposta de parceria */
.prop-form { max-width: 520px; }
.prop-link { display: flex; align-items: center; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.prop-link span { padding: 0 10px; color: var(--muted); font-weight: 700; white-space: nowrap; }
.prop-link input { border: 0; border-radius: 0; flex: 1; min-width: 0; }

/* ---------- Fase BC: acesso do suporte ---------- */
.side-nav nav a.sn-help {
  display: flex; align-items: center; gap: 10px; margin: 12px 4px 4px; padding: 11px 13px; border-radius: 12px;
  background: linear-gradient(135deg, #FF3355, #FF8A3D); color: #fff; font-weight: 700; text-decoration: none; line-height: 1.25;
  box-shadow: 0 0 0 1px rgba(255,255,255,.12) inset, 0 6px 22px -6px rgba(255,51,85,.75);
}
.side-nav nav a.sn-help:hover, .side-nav nav a.sn-help[aria-current] { background: linear-gradient(135deg, #FF3355, #FF8A3D); color: #fff; filter: brightness(1.08); }
.side-nav nav a.sn-help .sn-ic { color: #fff; flex-shrink: 0; }
.side-nav nav a.sn-help small { display: block; font-weight: 500; font-size: 11.5px; opacity: .92; }
.side-nav nav a.sn-help.is-on, .side-nav nav a.sn-help.is-on:hover, .side-nav nav a.sn-help.is-on[aria-current] { background: linear-gradient(135deg, #13915F, #1FB8AA); box-shadow: 0 6px 22px -6px rgba(46,230,214,.55); }
.sn-help-dot { width: 8px; height: 8px; margin-left: auto; flex-shrink: 0; border-radius: 50%; background: #fff; box-shadow: 0 0 0 3px rgba(255,255,255,.3); animation: sup-pulse 1.4s infinite; }
@keyframes sup-pulse { 50% { opacity: .35; } }
@media (prefers-reduced-motion: reduce) { .sn-help-dot { animation: none; } }
.btn.sup-go { background: linear-gradient(135deg, #FF3355, #FF8A3D); color: #fff; font-weight: 700; }
.btn.sup-go:hover { background: linear-gradient(135deg, #F02848, #F57A2C); }
.gift-bar.is-sup { background: rgba(255,51,85,.14); color: var(--text); border: 1px solid rgba(255,51,85,.45); }
.sup-safe { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 16px 0; }
.sup-safe > div { padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--field); font-size: 14px; }
.sup-safe b { display: block; margin-bottom: 6px; }
.sup-safe ul { margin: 0; padding-left: 18px; line-height: 1.6; }
.sup-lbl { display: block; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #FF8A3D; margin: 20px 0 8px; }
.sup-dur { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; border: 0; padding: 0; }
.sup-dur label { position: relative; padding: 9px 16px; border: 1px solid var(--line); border-radius: 999px; cursor: pointer; font-weight: 600; }
.sup-dur input { position: absolute; opacity: 0; pointer-events: none; }
.sup-dur label:has(input:checked) { border-color: #FF3355; background: rgba(255,51,85,.14); }
.sup-dur label:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; }
.sup-on { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; padding: 16px; border-radius: 14px; border: 1px solid rgba(46,230,214,.45); background: rgba(46,230,214,.08); }
.sup-on > .sup-on-ic { font-size: 26px; }
.sup-on strong { font-size: 16px; }
.sup-on form { margin-left: auto; }
.sup-log { width: 100%; border-collapse: collapse; font-size: 14px; }
.sup-log td { padding: 8px 6px; border-bottom: 1px solid var(--line); vertical-align: top; }
.sup-log td:first-child { white-space: nowrap; color: var(--muted); width: 1%; padding-right: 18px; }
@media (max-width: 640px) { .sup-safe { grid-template-columns: 1fr; } }

/* ---------- Fase BE: Admin › Acessos ---------- */
.acs-head { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.acs-head h1 { margin: 0; }
.acs-head > a, .acs-per { margin-left: auto; }
.acs-per { display: flex; flex-wrap: wrap; gap: 6px; }
.acs-strip { margin-bottom: 18px; }
.acs-d { display: block; margin-top: 4px; font-size: 12.5px; color: var(--muted); }
.acs-d.is-up { color: var(--ok, #13915F); }
.acs-d.is-down { color: var(--red, #D11A3D); }
.acs-chart-w { margin-top: 18px; }
.acs-chart { width: 100%; height: auto; display: block; color: var(--text); }
.acs-chart .acs-grid { stroke: currentColor; opacity: .09; }
.acs-chart .acs-ax { fill: currentColor; opacity: .55; font-size: 12px; }
.acs-legend { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 13px; margin-top: 6px; }
.acs-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin-top: 24px; }
.acs-grid2 > div { min-width: 0; }
.acs-h { margin: 0 0 10px; font-size: 15px; }
.acs-bar { margin: 0 0 9px; }
.acs-bar-h { display: flex; justify-content: space-between; gap: 10px; font-size: 14px; }
.acs-bar-h span { display: inline-flex; align-items: center; gap: 6px; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.acs-bar-t { height: 8px; border-radius: 99px; background: var(--field); margin-top: 4px; overflow: hidden; }
.acs-bar-t i { display: block; height: 100%; border-radius: 99px; }
.admin-table .num { text-align: right; white-space: nowrap; }
.acs-pre { margin-top: 18px; border-color: rgba(245,180,0,.55); }
@media (max-width: 760px) { .acs-grid2 { grid-template-columns: 1fr; } .acs-per { margin-left: 0; } }
.acs-head + .subtitle { margin-top: 10px; }
@media (max-width: 760px) { .acs-chart .acs-ax { font-size: 22px; } }
.tp-note { margin: 18px 0 0; padding: 10px 14px; border-radius: 10px; background: var(--field); border: 1px solid var(--line); color: var(--muted); font-size: 13.5px; line-height: 1.5; }
.tp-note strong { color: var(--text); }

/* Género: distribuição no admin e campo na ficha do utilizador */
.gen-bars { max-width: 560px; margin: 0 0 18px; }
.gen-form { display: inline-flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.gen-form select { width: auto; min-width: 180px; padding-block: 6px; }

/* Cupões: caixa no checkout e etiqueta no plano */
.cp-box { margin: 0 0 18px; }
.cp-add { border: 1px dashed var(--line); border-radius: 14px; background: var(--card); }
.cp-add > summary { padding: 12px 14px; cursor: pointer; font-weight: 700; list-style: none; }
.cp-add > summary::-webkit-details-marker { display: none; }
.cp-row { display: flex; gap: 8px; padding: 0 14px 12px; }
.cp-row input { flex: 1; min-width: 0; text-transform: uppercase; letter-spacing: .04em; }
.cp-err { margin: -4px 14px 12px; color: var(--red); font-size: 14px; font-weight: 600; }
.cp-on { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 10px 14px; border-radius: 14px; border: 1px solid var(--ok); background: color-mix(in srgb, var(--ok) 12%, transparent); color: var(--text); font-weight: 600; margin-bottom: 8px; }
.cp-on.is-off { border-color: var(--red); background: color-mix(in srgb, var(--red) 10%, transparent); font-weight: 500; }
.cp-tag { display: block; margin-top: 4px; font-size: 13px; }
.cp-tag s { color: var(--muted); }
.cp-tag strong { color: var(--ok); }
.cp-tag.is-off { color: var(--muted); }
.cp-tag[hidden] { display: none; }
/* Admin › Cupões */
.cp-form .cp-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 0 16px; }
.cp-kind { display: flex; gap: 18px; flex-wrap: wrap; margin-bottom: 8px; }
.cp-code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-weight: 800; letter-spacing: .03em; }
.cp-stats { display: flex; gap: 6px 14px; flex-wrap: wrap; font-size: 13px; }
/* Kit do Parceiro: cupões */
.pk-cp { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.pk-cp li { border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; display: grid; gap: 6px; }
.pk-cp li.is-off { opacity: .6; }
.pk-cp-h { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.pk-cp-h .cp-code { font-size: 18px; }

/* Admin › Perfis de criador */
.cr-table td { vertical-align: top; }
.cr-net { white-space: nowrap; }
.cr-pf { display: block; font-size: 12px; color: var(--muted); }
.cr-net.is-hit { background: color-mix(in srgb, var(--accent) 10%, transparent); }
.cr-net.is-hit .cr-pf { color: var(--accent); font-weight: 700; }
.cr-games { min-width: 180px; font-size: 14px; }

/* Faturas: pedido no checkout (Brasil) e coluna no histórico */
.inv-want { margin: 0 0 16px; }
.inv-want small { display: block; font-weight: 400; }
.inv-cell { white-space: nowrap; font-size: 13px; }
.inv-cell .link { font-size: 13px; }
/* Admin › Faturas: teste da ligação */
.fz-test { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0 0 16px; padding: 12px 14px; border: 1px dashed var(--line); border-radius: 14px; font-size: 14px; }
.fz-steps { list-style: none; margin: 4px 0 0; padding: 0; width: 100%; display: grid; gap: 4px; }
.fz-steps small { color: var(--red); margin-left: 26px; display: inline-block; }
.fz-test-acts { display: flex; gap: 8px; flex-wrap: wrap; width: 100%; }
/* Stripe: formulário do cartão no checkout */
.st-area { margin: 0 0 18px; padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--card); }
.st-element { min-height: 60px; }
.st-msg { margin: 12px 0 0; }
.st-secure { margin: 10px 0 0; }

/* ============================================================
   Mensagens do Admin (inc/messages.php): sino, faixa, página Mensagens e Admin › Mensagens
   ============================================================ */
.bell { position: relative; }
.bell > summary { list-style: none; cursor: pointer; position: relative; justify-content: center; width: 40px; padding: 0; }
.bell > summary::-webkit-details-marker { display: none; }
.bell-n { position: absolute; top: 2px; right: 0; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: var(--red); color: #fff; font-size: 11px; font-weight: 800; line-height: 18px; text-align: center; box-shadow: 0 0 0 2px var(--bg); }
.bell[open] > summary { background: var(--field); }
.bell-pop { position: absolute; right: 0; top: calc(100% + 8px); z-index: 60; font-weight: 400; white-space: normal; width: min(360px, calc(100vw - 24px)); padding: 8px; text-align: left;
  background: var(--card); border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow, 0 20px 50px rgba(0,0,0,.35)); }
.bell-hd { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 8px 10px 10px; }
.bell-hd .link { font-size: 12.5px; color: var(--accent); }
.bell-it { display: flex; gap: 10px; padding: 10px; border-radius: 12px; text-decoration: none; color: var(--text); }
.bell-it:hover, .bell-it:focus-visible { background: var(--field); }
.bell-it.is-new { background: color-mix(in srgb, var(--c) 9%, transparent); }
.bell-it b { display: block; font-size: 13.5px; line-height: 1.3; }
.bell-it small { display: block; color: var(--muted); font-size: 12.5px; line-height: 1.35; }
.bell-ic, .msg-ic { width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center; flex-shrink: 0; background: color-mix(in srgb, var(--c) 18%, transparent); font-size: 16px; }
.bell-empty { margin: 0; padding: 14px 10px; color: var(--muted); font-size: 14px; }
.bell-ft { display: block; text-align: center; padding: 10px; margin-top: 4px; font-size: 13px; font-weight: 700; color: var(--accent); border-top: 1px solid var(--line); text-decoration: none; }
@media (max-width: 560px) { .bell-pop { position: fixed; left: 12px; right: 12px; top: 64px; width: auto; } }

.msg-tag { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--c); }
.msg-tag::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--c); }
.msg-ban { position: relative; display: flex; gap: 12px; align-items: flex-start; margin: 0 0 18px; padding: 14px 44px 14px 16px; border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--c) 50%, transparent); background: color-mix(in srgb, var(--c) 10%, var(--card)); }
.msg-ban .msg-ic { width: 36px; height: 36px; background: var(--c); }
.msg-ban b { display: block; font-size: 15px; margin: 2px 0; }
.msg-ban p { margin: 0; font-size: 14px; color: var(--muted); line-height: 1.45; }
.msg-ban .btn { margin-top: 10px; }
.msg-x { position: absolute; top: 8px; right: 8px; margin: 0; }
.msg-x button { width: 30px; height: 30px; border-radius: 8px; border: 0; background: transparent; color: var(--muted); cursor: pointer; font-size: 15px; }
.msg-x button:hover { background: var(--field); color: var(--text); }
.msg-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.msg-head h1 { margin: 0; }
.msg-list { display: flex; flex-direction: column; gap: 10px; margin-top: 16px; }
.msg-item { position: relative; display: flex; gap: 14px; padding: 14px 16px; border-radius: 14px; background: var(--card); border: 1px solid var(--line); scroll-margin-top: 90px; }
.msg-item.is-new { border-color: color-mix(in srgb, var(--c) 55%, var(--line)); box-shadow: inset 4px 0 0 var(--c); }
.msg-item:target { outline: 2px solid var(--c); outline-offset: 2px; }
.msg-item .msg-ic { width: 40px; height: 40px; font-size: 19px; }
.msg-body { min-width: 0; flex: 1; }
.msg-body h2 { margin: 3px 0 4px; font-size: 16px; }
.msg-body p { margin: 0 0 10px; color: var(--muted); font-size: 14.5px; line-height: 1.55; overflow-wrap: anywhere; }
.msg-body p:last-child { margin-bottom: 0; }
.msg-meta { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.msg-when { font-size: 12px; color: var(--muted); }
.msg-pin { font-size: 12px; font-weight: 700; color: var(--warn-text); }
.msg-dot { position: absolute; top: 14px; right: 14px; width: 9px; height: 9px; border-radius: 50%; background: var(--red); box-shadow: 0 0 0 3px color-mix(in srgb, var(--red) 25%, transparent); }

/* Admin › Mensagens */
.mm-h { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.mm-h h1 { margin: 0; }
.mm-tabs { display: flex; gap: 6px; margin: 14px 0 18px; flex-wrap: wrap; }
.mm-tabs a { padding: 8px 14px; border-radius: 10px; background: var(--field); color: var(--muted); text-decoration: none; font-weight: 600; font-size: 14px; }
.mm-tabs a[aria-current] { background: var(--admin); color: var(--bg); }
.mm-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 20px; align-items: start; }
.mm-side { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.mm-box { margin: 0; min-width: 0; background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: 18px; }
.mm-box h2, .mm-box legend { margin: 0 0 12px; padding: 0; font-size: 15px; font-weight: 800; }
.mm-box legend { float: left; width: 100%; }
.mm-box legend + * { clear: both; }
.mm-types { display: flex; gap: 8px; flex-wrap: wrap; }
.mm-type input, .mm-pill input { position: absolute; opacity: 0; pointer-events: none; }
.mm-type span { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border-radius: 999px; border: 1px solid var(--line); font-size: 13.5px; font-weight: 600; background: var(--field); cursor: pointer; }
.mm-type input:checked + span { border-color: var(--c); box-shadow: 0 0 0 2px color-mix(in srgb, var(--c) 35%, transparent); }
.mm-type input:focus-visible + span, .mm-pill input:focus-visible + span { outline: 2px solid var(--admin); outline-offset: 2px; }
.mm-langs { display: flex; gap: 2px; flex-wrap: wrap; border-bottom: 1px solid var(--line); margin: 16px 0 12px; }
.mm-langs button { padding: 8px 12px; border: 0; border-bottom: 2px solid transparent; background: none; color: var(--muted); font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
.mm-langs button[aria-selected=true] { color: var(--text); border-color: var(--admin); }
.mm-langs small { font-weight: 600; opacity: .7; }
.mm-langs em { font-style: normal; color: var(--ok); margin-left: 4px; }
.mm-opt { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding: 10px 12px; margin-bottom: 8px; border: 1px solid var(--line); border-radius: 12px; font-size: 14px; cursor: pointer; }
.mm-opt:has(> input:checked) { border-color: var(--admin); background: color-mix(in srgb, var(--admin) 8%, transparent); }
.mm-opt input[type=text], .mm-opt input[type=date], .mm-opt input[type=datetime-local] { width: auto; flex: 1; min-width: 150px; min-height: 36px; padding: 6px 10px; }
.mm-opt.is-dis { opacity: .55; cursor: default; }
.mm-svc { align-items: flex-start; }
.mm-svc input { margin-top: 4px; }
.mm-filters { display: grid; gap: 12px; padding: 12px; margin-bottom: 8px; border-radius: 12px; background: var(--field); }
.mm-filters[hidden] { display: none; }
.mm-filters .label { display: block; margin-bottom: 6px; }
.mm-pills { display: flex; gap: 6px; flex-wrap: wrap; }
.mm-pill { position: relative; }
.mm-pill span { display: inline-flex; align-items: center; gap: 5px; padding: 5px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 700; border: 1px solid var(--line); background: var(--card); cursor: pointer; }
.mm-pill span small { opacity: .6; font-weight: 600; }
.mm-pill input:checked + span { background: var(--admin); color: var(--bg); border-color: var(--admin); }
.mm-count { display: flex; align-items: center; gap: 12px; margin-top: 4px; padding: 14px; border-radius: 12px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--admin) 18%, transparent), transparent); border: 1px solid color-mix(in srgb, var(--admin) 40%, transparent); }
.mm-count b { font-size: 28px; line-height: 1; }
.mm-count small { display: block; color: var(--muted); font-size: 12.5px; }
.mm-acts { display: flex; gap: 10px; justify-content: flex-end; flex-wrap: wrap; margin-top: 8px; }
.mm-send { background: var(--admin); color: var(--bg); }
.mm-tag { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--c); }
.mm-tag::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--c); }
.mm-read { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.mm-read span { flex: 1; min-width: 60px; height: 6px; border-radius: 9px; background: var(--field); overflow: hidden; }
.mm-read span i { display: block; height: 100%; background: var(--ok); }
@media (max-width: 860px) { .mm-grid { grid-template-columns: 1fr; } }

/* Aparência › Temas especiais */
.th-pick { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin-bottom: 10px; }
.th-opt { position: relative; cursor: pointer; }
.th-opt input { position: absolute; opacity: 0; pointer-events: none; }
.th-card { display: flex; flex-direction: column; gap: 4px; min-height: 96px; padding: 12px; border-radius: 14px; color: #fff; border: 2px solid transparent;
  background: radial-gradient(120% 90% at 50% 0%, color-mix(in srgb, var(--a) 55%, transparent), transparent 70%), linear-gradient(160deg, var(--bg), color-mix(in srgb, var(--b) 25%, var(--bg))); }
.th-card.is-none { color: var(--text); background: var(--field); justify-content: center; text-align: center; }
.th-card b { font-size: 14px; }
.th-card small { font-size: 11.5px; opacity: .8; }
.th-card em { font-style: normal; font-size: 11px; font-weight: 800; opacity: .9; }
.th-sw { font-size: 22px; line-height: 1; }
.th-opt input:checked + .th-card { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 30%, transparent); }
.th-opt input:focus-visible + .th-card { outline: 2px solid var(--accent); outline-offset: 2px; }
.th-grant { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 6px; } .th-grant input[type=text] { flex: 1; min-width: 150px; } .th-grant input[type=date], .th-grant select { width: auto; }
.admin-table tr.is-current td { background: color-mix(in srgb, var(--admin) 8%, transparent); }

/* ============ Media Kit (painel/kit) ============ */
.sn-switch.is-3 { grid-template-columns: repeat(3, 1fr); }
.side-nav .sn-switch.is-3 a { flex-direction: column; gap: 2px; font-size: 12px; padding: 6px 4px; }
.side-nav .sn-switch a.is-kit[aria-current] { background: linear-gradient(120deg, #C04CFF, #2EE6D6); color: #fff; }
.ic-kit { --ic: var(--ni-pink); }
.mk-top { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-bottom: 14px; }
.mk-top h1 { margin: 0; font-size: 22px; }
.mk-url { min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 6px 10px; border-radius: 999px; background: var(--field); border: 1px solid var(--line); font-size: 13px; color: var(--muted); }
.mk-url b { color: var(--text); }
.mk-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-left: auto; }
.mk-pub, .mk-swl { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; cursor: pointer; }
.mk-pub input, .mk-swl input, .mk-lk input, .mk-pal input, .mk-tc input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.mk-sw { position: relative; width: 38px; height: 22px; border-radius: 999px; background: var(--chart-base); transition: background .15s; flex-shrink: 0; }
.mk-sw::after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: transform .15s; }
input:checked + .mk-sw { background: var(--ok); }
input:checked + .mk-sw::after { transform: translateX(16px); }
input:focus-visible + .mk-sw, .mk-lk input:focus-visible + span, .mk-tc input:focus-visible + .mk-tc-in, .mk-pal input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.mk-private { margin: 0 0 12px; padding: 10px 12px; border-radius: 10px; background: var(--lock-bg); color: var(--lock-text); font-size: 14px; }
.mk-prog { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; padding: 12px 14px; border-radius: 14px; background: var(--field); border: 1px solid var(--line); }
.mk-prog small { display: block; margin-top: 2px; color: var(--muted); font-size: 13px; }
.mk-prog small a { color: var(--accent); }
.mk-ring { --p: 0; width: 54px; height: 54px; border-radius: 50%; flex-shrink: 0; display: grid; place-items: center; background: conic-gradient(var(--ok) calc(var(--p) * 1%), var(--line) 0); }
.mk-ring b { width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; background: var(--field); font-size: 13px; }
.mk-grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 18px; align-items: start; margin-top: 14px; }
.mk-grid-1 { grid-template-columns: minmax(0, 1fr); }
.mk-grid-1 .mk-pv { max-width: 380px; margin: 0 auto; width: 100%; }
.mk-quick { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; }
.mk-q { display: flex; flex-direction: column; gap: 6px; padding: 16px; border-radius: 14px; background: var(--field); border: 1px solid var(--line); text-decoration: none; color: var(--text); transition: border-color .15s, transform .15s; }
.mk-q:hover { border-color: var(--accent); transform: translateY(-2px); }
.mk-q span { font-size: 24px; }
.mk-b { display: flex; align-items: center; gap: 10px; padding: 10px 12px; margin-bottom: 8px; border-radius: 12px; background: var(--field); border: 1px solid var(--line); }
.mk-b > div:not(.mk-tags) { flex: 1; min-width: 0; }
.mk-b b { display: block; font-size: 14.5px; }
.mk-b small { display: block; color: var(--muted); font-size: 12.5px; line-height: 1.35; }
.mk-b-fixed { opacity: .85; }
.mk-blocks { list-style: none; margin: 0; padding: 0; }
.mk-blocks .mk-b { cursor: grab; }
.mk-b.dragging { opacity: .45; border-style: dashed; }
.mk-b.is-off > div:not(.mk-tags), .mk-b.is-off .mk-ic { opacity: .45; }
.mk-h { color: var(--muted); font-size: 14px; letter-spacing: -2px; user-select: none; }
.mk-ic { font-size: 20px; width: 28px; text-align: center; }
.mk-tags { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.mk-t { padding: 3px 8px; border-radius: 999px; font-size: 11px; font-weight: 700; background: var(--card); border: 1px solid var(--line); color: var(--muted); white-space: nowrap; }
.mk-t.auto { color: var(--ok-soft); border-color: color-mix(in srgb, var(--ok) 40%, transparent); }
.mk-lk { position: relative; cursor: pointer; }
.mk-lk span { display: grid; place-items: center; width: 30px; height: 26px; border-radius: 8px; border: 1px solid var(--line); filter: grayscale(1); opacity: .5; }
.mk-lk input:checked + span { filter: none; opacity: 1; border-color: var(--admin); background: color-mix(in srgb, var(--admin) 15%, transparent); }
.mk-mv { display: flex; flex-direction: column; }
.mk-mv button { border: 0; background: none; color: var(--muted); font-size: 10px; line-height: 1; padding: 2px 4px; cursor: pointer; }
.mk-mv button:hover { color: var(--text); }
.mk-save { display: flex; justify-content: flex-end; gap: 8px; margin-top: 14px; }
.mk-pv { position: sticky; top: 16px; padding: 12px; border-radius: 16px; background: var(--field); border: 1px solid var(--line); }
.mk-pv-h { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; font-size: 14px; }
.mk-seg { display: inline-flex; padding: 3px; border-radius: 10px; background: var(--card); border: 1px solid var(--line); }
.mk-seg button { border: 0; background: none; color: var(--muted); font: inherit; font-size: 12.5px; font-weight: 700; padding: 5px 10px; border-radius: 7px; cursor: pointer; }
.mk-seg button[aria-pressed="true"] { background: var(--accent); color: #fff; }
.mk-phone { margin: 0 auto; width: 300px; max-width: 100%; height: 600px; border-radius: 28px; overflow: hidden; border: 6px solid #000; background: #000; box-shadow: 0 10px 30px var(--shadow); }
.mk-phone iframe { width: 100%; height: 100%; border: 0; display: block; background: #fff; }
.mk-phone.is-pc { width: 100%; height: 520px; border-radius: 10px; border-width: 4px; }
.mk-phone.is-pc iframe { width: 200%; height: 200%; transform: scale(.5); transform-origin: 0 0; }
.mk-tpl { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px; margin-bottom: 16px; }
.mk-tc { position: relative; cursor: pointer; }
.mk-tc-in { display: block; height: 100%; padding: 10px; border-radius: 14px; background: var(--field); border: 2px solid var(--line); transition: border-color .15s; }
.mk-tc input:checked + .mk-tc-in { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 25%, transparent); }
.mk-tc-t { display: block; margin-top: 8px; }
.mk-tc-t b { display: block; font-size: 14px; } .mk-tc-t small { color: var(--muted); font-size: 12px; line-height: 1.35; display: block; }
.mk-thumb { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 26px 18px 18px; gap: 5px; padding: 8px; height: 96px; border-radius: 10px; }
.mk-thumb i { border-radius: 5px; } .mk-thumb i:first-child { grid-column: span 2; }
.mk-th-gamer { background: #0B0614; } .mk-th-gamer i { background: linear-gradient(120deg, #C04CFF, #2EE6D6); box-shadow: 0 0 8px #C04CFF; } .mk-th-gamer i + i { background: #1C1230; box-shadow: none; border: 1px solid #C04CFF66; }
.mk-th-formal { background: #F3F5F9; } .mk-th-formal i { background: #1E3A8A; } .mk-th-formal i + i { background: #fff; border: 1px solid #DDE3EE; }
.mk-th-minimal { background: #fff; } .mk-th-minimal i { background: #111; height: 6px; align-self: center; } .mk-th-minimal i + i { background: none; border-top: 1px solid #ddd; border-radius: 0; }
.mk-th-resume { background: #E9ECF1; padding: 8px 18px; } .mk-th-resume i { background: #fff; border-bottom: 3px solid #0F766E; } .mk-th-resume i + i { background: #fff; border: 0; }
.mk-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.mk-row-3 { grid-template-columns: repeat(3, 1fr); }
.mk-card { margin: 0; padding: 14px; border-radius: 14px; border: 1px solid var(--line); background: var(--field); display: grid; gap: 10px; align-content: start; }
.mk-card legend { padding: 0 6px; font-weight: 800; }
.mk-pal { display: flex; flex-wrap: wrap; gap: 8px; }
.mk-pal label { position: relative; cursor: pointer; }
.mk-pal span { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; border: 2px solid var(--line); }
.mk-pal span.is-none { width: auto; padding: 0 12px; font-size: 12.5px; font-weight: 700; background: var(--card); }
.mk-pal input:checked + span { border-color: var(--text); box-shadow: 0 0 0 3px var(--accent); }
.mk-nets { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 10px; }
.mk-n { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 14px; background: var(--field); border: 1px solid var(--line); }
.mk-n > div { flex: 1; min-width: 0; }
.mk-n b { display: block; } .mk-n small { display: block; color: var(--muted); font-size: 12.5px; }
.mk-n input { width: 130px; flex-shrink: 0; }
.mk-st { display: inline-block; margin-top: 4px; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 700; background: var(--card); border: 1px solid var(--line); color: var(--muted); }
.mk-st.is-on { color: var(--ok-soft); border-color: color-mix(in srgb, var(--ok) 45%, transparent); }
.mk-note { margin: 12px 0; font-size: 13px; color: var(--muted); }
.mk-manual { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 10px; margin-top: 10px; }
.mk-manual .mk-save { grid-column: 1 / -1; }
.mk-form { display: grid; gap: 12px; margin-bottom: 18px; }
.mk-form .field { margin: 0; }
.mk-list { display: grid; gap: 10px; margin: 10px 0 18px; }
.mk-li { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 12px; background: var(--field); border: 1px solid var(--line); }
.mk-li > div:first-child { flex: 1; min-width: 0; }
.mk-li b { display: block; } .mk-li small { display: block; color: var(--muted); font-size: 12.5px; }
.mk-li-a { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.mk-price { font-weight: 800; white-space: nowrap; }
.mk-prop { padding: 14px; border-radius: 14px; background: var(--field); border: 1px solid var(--line); }
.mk-prop.is-new { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent); }
.mk-prop-h { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.mk-ps { margin-left: auto; padding: 3px 9px; border-radius: 999px; font-size: 11.5px; font-weight: 800; background: var(--card); border: 1px solid var(--line); }
.mk-ps-new { background: var(--accent); color: #fff; border-color: var(--accent); }
.mk-ps-replied { color: var(--cyan); } .mk-ps-accepted { color: var(--ok-soft); } .mk-ps-declined { color: var(--err-soft); }
.mk-prop-b { margin: 8px 0 0; font-size: 14px; }
.mk-prop-m { margin: 8px 0 12px; font-size: 14.5px; white-space: normal; overflow-wrap: anywhere; }
.mk-prop-st select { min-height: 34px; padding: 4px 8px; font-size: 13px; }
.mk-lock { display: grid; place-items: center; text-align: center; padding: 40px 16px; }
.mk-lock p { color: var(--muted); max-width: 440px; margin: 8px auto 16px; }
@media (max-width: 980px) {
  .mk-grid { grid-template-columns: minmax(0, 1fr); }
  .mk-pv { position: static; }
}
@media (max-width: 600px) {
  .mk-acts { margin-left: 0; }
  .mk-row, .mk-row-3 { grid-template-columns: 1fr; }
  .mk-b { flex-wrap: wrap; }
  .mk-tags { width: 100%; justify-content: flex-end; }
  .mk-li { flex-wrap: wrap; }
  .mk-n input { width: 110px; }
}
/* Media Kit · BP-2 */
.mk-ov { display: grid; grid-template-columns: 1fr 1.4fr; gap: 12px; margin-top: 14px; }
.mk-ov-c { display: grid; gap: 8px; align-content: start; padding: 14px; border-radius: 14px; background: var(--field); border: 1px solid var(--line); }
.mk-swl-row { align-items: flex-start; gap: 12px; font-weight: 500; }
.mk-swl-row .mk-sw { margin-top: 2px; }
.mk-swl-row small { display: block; color: var(--muted); font-size: 12.5px; }
.mk-blocks .mk-b { flex-wrap: wrap; }
.mk-pick { width: 100%; margin: 4px 0 0 52px; font-size: 13.5px; }
.mk-pick summary { cursor: pointer; color: var(--accent); font-weight: 700; }
.mk-pick-l { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 6px 12px; margin: 10px 0 4px; }
.mk-pick-l span { display: inline-flex; align-items: center; gap: 8px; }
.mk-pick-l img { width: 28px; height: 28px; object-fit: contain; border-radius: 6px; background: #fff; }
.mk-row-3d { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mk-row-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.mk-bg-now { display: flex; align-items: center; gap: 12px; }
.mk-bg-now img { width: 120px; height: 68px; object-fit: cover; border-radius: 10px; border: 1px solid var(--line); }
.mk-fx { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.mk-fx label { position: relative; display: grid; gap: 4px; justify-items: center; cursor: pointer; font-size: 12px; text-align: center; }
.mk-fx input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.mk-fx span { --img: linear-gradient(135deg, #5b2bd6, #1fb6c7 50%, #ffb347); position: relative; display: block; width: 100%; aspect-ratio: 4 / 3; border-radius: 10px; overflow: hidden; border: 2px solid var(--line); background: #111; }
.mk-fx span::before, .mk-fx span i { content: ""; position: absolute; inset: 0; }
.mk-fx span::before { background: var(--img) center / cover; }
.mk-fx-dark i { background: rgba(10, 8, 18, .7); }
.mk-fx-blur::before { filter: blur(4px); inset: -6px !important; }
.mk-fx-blur i { background: rgba(10, 8, 18, .35); }
.mk-fx-gradient i { background: linear-gradient(180deg, transparent, rgba(10, 8, 18, .95) 85%); }
.mk-fx-duotone::before { filter: grayscale(1); }
.mk-fx-duotone i { background: linear-gradient(135deg, var(--accent), var(--cyan)); mix-blend-mode: multiply; }
.mk-fx input:checked + span { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 30%, transparent); }
.mk-fx input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.mk-yt2 { align-items: flex-start; }
.mk-yt2-f { display: grid; grid-template-columns: 1fr 160px auto; gap: 6px; margin-top: 8px; }
.mk-yt2-f input { width: 100%; min-width: 0; }
.mk-set .mk-card { gap: 12px; }
.mk-in-kit { margin-left: 6px; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 700; background: var(--card); border: 1px solid var(--line); color: var(--muted); }
.mk-photo { display: flex; align-items: center; gap: 14px; padding: 12px; border-radius: 12px; border: 1px solid var(--line); background: var(--card); }
.mk-photo img, .mk-photo-l { width: 72px; height: 72px; border-radius: 14px; object-fit: cover; flex-shrink: 0; }
.mk-photo-l { display: grid; place-items: center; font-size: 28px; font-weight: 800; background: var(--field); }
.mk-photo > div { display: grid; gap: 4px; min-width: 0; }
.mk-photo small { color: var(--muted); font-size: 12.5px; }
.mk-photo input[type=file] { font-size: 13px; max-width: 100%; }
.mk-tagin { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
.mk-tagin input { min-width: 0; }
.mk-vf { display: grid; grid-template-columns: minmax(0, 1fr) 150px; gap: 10px; align-items: end; }
.mk-vf .field { margin: 0; }
.mk-vis { min-height: 44px; font-size: 13px; }
.lbl { display: block; font-size: 14px; font-weight: 600; margin-bottom: 6px; }
.mk-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.mk-chips label { position: relative; cursor: pointer; }
.mk-chips input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.mk-chips span { display: inline-block; padding: 6px 12px; border-radius: 999px; font-size: 13px; font-weight: 600; background: var(--card); border: 1px solid var(--line); }
.mk-chips input:checked + span { background: var(--accent); border-color: var(--accent); color: #fff; }
.mk-chips input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.mk-open { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; }
.mk-open .check { padding: 10px 12px; border-radius: 10px; border: 1px solid var(--line); background: var(--card); }
@media (max-width: 980px) {
  .mk-row-3d { grid-template-columns: 1fr; }
  .mk-row-4 { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
  .mk-ov { grid-template-columns: 1fr; }
  .mk-tagin { grid-template-columns: 1fr 1fr; }
  .mk-vf { grid-template-columns: 1fr; gap: 6px; }
  .mk-yt2-f { grid-template-columns: 1fr; }
  .mk-pick { margin-left: 0; }
  .mk-row-4 { grid-template-columns: 1fr; }
}

/* Media Kit · BP-3: parcerias, pesquisa de logos, editor de case study */
.mk-ls { position: relative; display: grid; gap: 6px; }
.mk-ls input[type=search] { width: 100%; }
.mk-ls-r { position: absolute; z-index: 20; top: 100%; left: 0; right: 0; margin: 4px 0 0; padding: 4px; list-style: none; max-height: 340px; overflow: auto; border-radius: 12px; background: var(--card); border: 1px solid var(--line); box-shadow: 0 12px 30px var(--shadow); }
.mk-ls-r li.is-msg { padding: 10px 12px; color: var(--muted); font-size: 13.5px; }
.mk-ls-r button { width: 100%; display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 0; border-radius: 9px; background: none; color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.mk-ls-r button:hover, .mk-ls-r button:focus-visible { background: var(--field); outline: none; }
.mk-ls-r img { width: 28px; height: 28px; border-radius: 7px; object-fit: contain; background: #fff; flex-shrink: 0; }
.mk-ls-r span { flex: 1; min-width: 0; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mk-ls-r small { color: var(--muted); font-size: 12px; }
.mk-badd { margin-bottom: 14px; }
.mk-bman summary { cursor: pointer; color: var(--accent); font-weight: 700; font-size: 14px; }
.mk-bman[open] summary { margin-bottom: 10px; }
.mk-brands { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 10px; }
.mk-brand { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 12px; background: var(--field); border: 1px solid var(--line); }
.mk-brand > div:not(.mk-li-a) { flex: 1; min-width: 0; }
.mk-brand b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mk-brand small { color: var(--muted); font-size: 12px; }
.mk-blg { width: 44px; height: 44px; border-radius: 10px; flex-shrink: 0; overflow: hidden; display: grid; place-items: center; font-weight: 900; font-size: 13px; background: var(--card); border: 1px solid var(--line); }
.mk-blg img { width: 100%; height: 100%; object-fit: contain; display: block; }
.mk-li .mk-blg { width: 40px; height: 40px; }
.mk-src-note { margin-top: 10px; font-size: 12px; color: var(--muted); }
.mk-mvf { display: inline-flex; flex-direction: column; }
.mk-mvf i { display: block; height: 14px; }
.mk-mvf button { border: 0; background: none; color: var(--muted); font-size: 10px; line-height: 1; padding: 2px 4px; cursor: pointer; }
.mk-mvf button:hover { color: var(--text); }
.mk-cbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.mk-cbar .hint { margin: 0; }
.mk-ce { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 18px; align-items: start; }
.mk-cf .mk-card { gap: 12px; }
.mk-cbrand { display: grid; gap: 10px; }
.mk-cbrand[hidden] { display: none; }
.mk-cbrand-now { display: flex; align-items: flex-end; gap: 12px; }
.mk-cbrand-now .field { flex: 1; margin: 0; }
.mk-cbrand-now .mk-blg { width: 48px; height: 48px; margin-bottom: 2px; }
.mk-dl { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.mk-d { padding: 10px; border-radius: 12px; background: var(--card); border: 1px solid var(--line); display: grid; gap: 10px; }
.mk-d-h { display: flex; align-items: center; gap: 8px; }
.mk-d-h input { flex: 1; min-width: 0; }
.mk-d-b { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 12px; }
.mk-d-img { width: 90px; aspect-ratio: 9 / 14; border-radius: 10px; overflow: hidden; background: var(--field); border: 1px dashed var(--line); }
.mk-d-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mk-d-f { display: grid; gap: 8px; align-content: start; }
.mk-d-up { display: grid; gap: 4px; font-size: 13px; font-weight: 600; }
.mk-d-up input { font-size: 12.5px; max-width: 100%; }
.mk-d-n { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.mk-d-n label { display: grid; gap: 2px; font-size: 11.5px; color: var(--muted); }
.mk-d-n input { min-width: 0; min-height: 38px; padding: 6px 8px; }
.mk-d-st { color: var(--ok-soft); font-size: 12px; min-height: 1em; }
.mk-ins { display: grid; gap: 6px; }
.mk-cpv { position: sticky; top: 16px; display: grid; gap: 8px; }
.mk-cpv-t { font-size: 14px; }
.mk-cprev { --bg: #2B1A4A; --text: #F6F0FF; --a: #C9A7FF; --b: #7EF0FF; --on-a: #1A0F2E; padding: 14px; border-radius: 18px; color: var(--text); background: linear-gradient(160deg, #3A2266, #23153F); max-height: calc(100vh - 60px); overflow: auto; }
.mk-cprev .mk-c2-dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mk-cprev .mk-case2 { padding: 16px; border-radius: 16px; background: color-mix(in srgb, var(--text) 5%, transparent); border: 1px solid color-mix(in srgb, var(--text) 9%, transparent); display: grid; gap: 10px; }
.mk-cprev .mk-c2-h { display: flex; align-items: center; gap: 12px; }
.mk-cprev .mk-c2-lg { width: 44px; height: 44px; border-radius: 50%; flex-shrink: 0; overflow: hidden; display: grid; place-items: center; font-weight: 900; font-size: 13px; color: var(--on-a); background: linear-gradient(135deg, var(--a), var(--b)); }
.mk-cprev .mk-c2-lg img { width: 100%; height: 100%; object-fit: cover; display: block; background: #fff; }
.mk-cprev .mk-c2-h small { display: block; font-size: 12px; font-weight: 700; opacity: .7; text-transform: uppercase; letter-spacing: .04em; }
.mk-cprev .mk-c2-h b { display: block; font-size: 17px; line-height: 1.25; }
.mk-cprev .mk-c2-meta { margin: 0; font-size: 13px; opacity: .75; }
.mk-cprev .mk-c2-cats { display: flex; flex-wrap: wrap; gap: 6px; }
.mk-cprev .mk-c2-cats span { padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; border: 1px solid color-mix(in srgb, var(--text) 22%, transparent); }
.mk-cprev .mk-c2-d { margin: 0; font-size: 14px; white-space: pre-line; }
.mk-cprev .mk-c2-tot { display: grid; grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)); border-top: 1px solid color-mix(in srgb, var(--text) 12%, transparent); border-bottom: 1px solid color-mix(in srgb, var(--text) 12%, transparent); }
.mk-cprev .mk-c2-tot div { padding: 10px 6px; }
.mk-cprev .mk-c2-tot div + div { border-left: 1px solid color-mix(in srgb, var(--text) 12%, transparent); padding-left: 12px; }
.mk-cprev .mk-c2-tot b { display: block; font-size: 20px; color: var(--a); }
.mk-cprev .mk-c2-tot small { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; opacity: .7; }
.mk-cprev .mk-cprev .mk-case2 h4 { margin: 4px 0 0; font-size: 12px; text-transform: uppercase; letter-spacing: .08em; opacity: .7; }
.mk-cprev .mk-c2-dl { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.mk-cprev .mk-c2-dv { display: grid; gap: 4px; align-content: start; padding: 8px; border-radius: 14px; text-decoration: none; color: inherit; background: color-mix(in srgb, var(--text) 5%, transparent); border: 1px solid color-mix(in srgb, var(--text) 10%, transparent); min-width: 0; }
.mk-cprev .mk-c2-dv:hover { border-color: var(--a); }
.mk-cprev .mk-c2-img { position: relative; display: grid; place-items: center; aspect-ratio: 16 / 9; border-radius: 10px; overflow: hidden; background: color-mix(in srgb, var(--text) 10%, transparent); }
.mk-cprev .mk-c2-dv.is-v .mk-c2-img { aspect-ratio: 9 / 14; }
.mk-cprev .mk-c2-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mk-cprev .mk-c2-img em { position: absolute; left: 6px; bottom: 6px; padding: 2px 7px; border-radius: 7px; font-style: normal; font-size: 11.5px; font-weight: 700; background: rgba(0,0,0,.7); color: #fff; }
.mk-cprev .mk-c2-dv small { font-size: 11.5px; opacity: .7; }
.mk-cprev .mk-c2-n { display: flex; flex-wrap: wrap; gap: 4px; }
.mk-cprev .mk-c2-n i { font-style: normal; font-size: 11.5px; padding: 2px 7px; border-radius: 999px; border: 1px solid color-mix(in srgb, var(--text) 18%, transparent); }
.mk-cprev .mk-c2-dv b { font-size: 12.5px; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.mk-cprev .mk-c2-open { margin-top: 2px; font-size: 12px; font-weight: 700; color: var(--a); }
.mk-cprev .mk-c2-ins { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.mk-cprev .mk-c2-ins li { padding: 8px 12px; border-radius: 10px; font-size: 13.5px; font-weight: 600; background: color-mix(in srgb, var(--a) 12%, transparent); border-left: 3px solid var(--a); }

@media (max-width: 1100px) {
  .mk-ce { grid-template-columns: minmax(0, 1fr); }
  .mk-cpv { position: static; }
  .mk-cprev { max-height: none; }
}
@media (max-width: 600px) {
  .mk-d-b { grid-template-columns: 70px minmax(0, 1fr); }
  .mk-d-img { width: 70px; }
}
.mk-cprev .mk-c2-dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mk-page input[type=date] { width: 100%; min-height: 46px; padding: 10px 14px; background: var(--field); color: var(--text); border: 1px solid var(--line); border-radius: 10px; font: inherit; }
.mk-d-h input[type=url] { min-height: 40px; padding: 8px 12px; }
.mk-cprev .mk-c2-tot { grid-template-columns: repeat(auto-fit, minmax(90px, 1fr)); }
.mk-c2-tot small { letter-spacing: .02em; }
.mk-yt2-f { grid-template-columns: 1fr; gap: 4px; }
.mk-yt2-f label { margin: 4px 0 0; font-size: 12.5px; }
.mk-yt2-f input { min-height: 40px; padding: 8px 12px; }
.mk-yt2-f .btn { justify-self: start; margin-top: 6px; }
.mk-yt2 > div { flex: 1; min-width: 0; }
.mk-bedit { margin-top: 4px; font-size: 13px; }
.mk-bedit summary { cursor: pointer; color: var(--accent); font-weight: 700; }
.mk-bedit form { display: grid; gap: 6px; margin-top: 8px; }
.mk-bedit label { margin: 0; font-size: 12.5px; display: grid; gap: 3px; }
.mk-bedit input[type=text] { min-height: 38px; padding: 6px 10px; }
.mk-bedit input[type=file] { font-size: 12px; max-width: 100%; }
.mk-bedit .btn { justify-self: start; }
.mk-brand { align-items: flex-start; }
.mk-ttgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 8px; margin-top: 8px; font-size: 13px; color: var(--muted); }
.mk-ttv { display: grid; gap: 4px; padding: 6px; border-radius: 10px; border: 1px solid var(--line); background: var(--card); color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.mk-ttv img { width: 100%; aspect-ratio: 9 / 14; object-fit: cover; border-radius: 8px; display: block; background: var(--field); }
.mk-ttv span { font-size: 12px; font-weight: 700; }
.mk-ttv small { font-size: 11.5px; color: var(--muted); overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.mk-ttv.is-on, .mk-ttv:hover { border-color: var(--accent); }
.mk-ttv.is-on { box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 35%, transparent); }
.mk-n-av { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }

/* Media Kit › Redes › Público por rede */
.mk-aud-h { margin: 28px 0 4px; font-size: 18px; }
.mk-aud-f { display: grid; gap: 10px; margin-top: 10px; }
.mk-aud-n { border-radius: 14px; background: var(--field); border: 1px solid var(--line); }
.mk-aud-n summary { display: flex; align-items: center; gap: 10px; padding: 12px 14px; cursor: pointer; list-style: none; }
.mk-aud-n summary::-webkit-details-marker { display: none; }
.mk-aud-n summary::after { content: "▾"; margin-left: 8px; color: var(--muted); transition: transform .15s; }
.mk-aud-n[open] summary::after { transform: rotate(180deg); }
.mk-aud-n summary small { margin-left: auto; color: var(--muted); font-size: 12.5px; }
.mk-aud-where { margin: 0 14px 10px; font-size: 12.5px; color: var(--muted); }
.mk-aud-cols { display: grid; grid-template-columns: 200px 1fr 1fr; gap: 14px; padding: 0 14px 14px; }
.mk-aud-cols fieldset { margin: 0; padding: 10px 12px 12px; border: 1px solid var(--line); border-radius: 12px; min-width: 0; display: grid; gap: 6px; align-content: start; }
.mk-aud-cols legend { padding: 0 6px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.mk-aud-cols label { font-size: 13px; }
.mk-aud-cols input, .mk-aud-cols select { width: 100%; min-width: 0; }
.mk-aud-w { color: var(--muted); font-size: 12.5px; min-height: 1em; }
.mk-aud-ages { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
.mk-aud-ages label { display: grid; gap: 3px; text-align: center; font-size: 12px; color: var(--muted); }
.mk-aud-c { display: grid; grid-template-columns: 1fr 72px; gap: 6px; }
@media (max-width: 860px) { .mk-aud-cols { grid-template-columns: 1fr; } }
@media (max-width: 420px) { .mk-aud-ages { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.mk-pdf-opts { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 6px 16px; margin-top: 8px; }
/* Visão geral › PDF do Media Kit */
.mk-ov-left { display: grid; gap: 14px; min-width: 0; }
.mk-pdf-c { padding: 16px; border-radius: 16px; background: var(--field); border: 1px solid var(--line); display: grid; gap: 14px; }
.mk-pdf-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.mk-pdf-head b { display: block; font-size: 15px; }
.mk-pdf-head small { display: block; margin-top: 2px; color: var(--muted); font-size: 12.5px; max-width: 46ch; }
.mk-pdf-body { display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: 18px; align-items: start; }
.mk-pdf-set { display: grid; gap: 12px; justify-items: start; min-width: 0; }
.mk-pdf-lbl { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.mk-pdf-pal span { width: 34px; height: 34px; border-radius: 10px; }
.mk-pdf-pal span.is-none { height: 34px; }
.mk-pdf-opts { margin-top: 0; width: 100%; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
/* mini folha A4 com as cores escolhidas */
.mk-pdf-mini { width: 130px; aspect-ratio: 210 / 297; border-radius: 6px; background: #fff; box-shadow: 0 6px 18px rgba(0,0,0,.25); overflow: hidden; display: flex; flex-direction: column; gap: 5px; padding-bottom: 8px; }
.mk-pdf-mini i { display: block; margin: 0 10px; border-radius: 2px; }
.mk-pdf-mini .b { margin: 0 0 4px; height: 30px; border-radius: 0; background: var(--c1); position: relative; }
.mk-pdf-mini .b em { position: absolute; left: 10px; height: 4px; border-radius: 2px; background: rgba(255,255,255,.9); }
.mk-pdf-mini .b em:first-child { top: 9px; width: 52px; } .mk-pdf-mini .b em:last-child { top: 17px; width: 30px; opacity: .7; }
.mk-pdf-mini .t { height: 4px; width: 46px; background: var(--c1); }
.mk-pdf-mini .l { height: 3px; background: #E4E6EB; } .mk-pdf-mini .l.s { width: 70px; }
.mk-pdf-mini .g { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px; }
.mk-pdf-mini .g em { height: 14px; border-radius: 2px; background: #F1F2F5; }
.mk-pdf-mini .g em:nth-child(2) { background: color-mix(in srgb, var(--c2) 22%, #fff); }
.mk-pdf-mini .r { display: grid; gap: 3px; }
.mk-pdf-mini .r em { height: 4px; border-radius: 2px; background: var(--c1); width: 80%; }
.mk-pdf-mini .r em:last-child { width: 55%; background: var(--c2); }
@media (max-width: 560px) { .mk-pdf-body { grid-template-columns: 1fr; } }

/* Loja (painel) */
.sh-cat { margin: 22px 0 10px; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.sh-cat small { margin-left: 8px; letter-spacing: 0; text-transform: none; font-weight: 500; }
.sh-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 12px; }
.sh-card { display: grid; grid-template-rows: auto auto 1fr auto; gap: 10px; padding: 16px; border-radius: 18px; background: var(--field); border: 1px solid var(--line); min-width: 0; }
.sh-art { position: relative; height: 92px; border-radius: 12px; display: grid; place-items: center; font-size: 40px; overflow: hidden; }
.sh-art small { position: absolute; left: 10px; top: 10px; padding: 3px 8px; border-radius: 999px; background: rgba(0,0,0,.45); color: #fff; font-size: 10.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.sh-art-sm { width: 96px; height: 96px; flex-shrink: 0; }
.sh-card h3 { margin: 0; font-size: 16px; }
.sh-card p { margin: 4px 0 0; color: var(--muted); font-size: 13.5px; }
.sh-card ul { margin: 0; padding-left: 18px; color: var(--muted); font-size: 13px; }
.sh-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; padding-top: 10px; border-top: 1px solid var(--line); }
.sh-price b { font-size: 19px; } .sh-price small { color: var(--muted); font-size: 12.5px; }
.sh-pill { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 700; border: 1px solid var(--line); }
.sh-pill.is-ok { color: var(--ok-soft); border-color: color-mix(in srgb, var(--ok) 45%, transparent); background: color-mix(in srgb, var(--ok) 12%, transparent); }
.sh-pill.is-inc { border-color: color-mix(in srgb, var(--accent) 55%, transparent); background: color-mix(in srgb, var(--accent) 16%, transparent); }
.sh-pill.is-soon { color: var(--muted); }
.sh-empty { padding: 30px 16px; text-align: center; color: var(--muted); border: 1px dashed var(--line); border-radius: 16px; }
.sh-buy-head { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; margin: 8px 0 16px; }
.sh-buy-head h2 { margin: 0; }
.sh-buy-head p { margin: 4px 0 0; }
.sh-total { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 12px 14px; margin-bottom: 14px; border-radius: 14px; background: var(--field); border: 1px solid var(--line); }
.sh-total strong { font-size: 20px; }
/* Admin › Loja */
.sh-adm { display: grid; gap: 12px; max-width: 760px; }
.sh-langs { display: flex; gap: 6px; flex-wrap: wrap; margin: 4px 0 8px; }
.sh-sale { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0; padding: 0; border: 0; }
.sh-sale legend { font-size: 13px; font-weight: 700; margin-bottom: 6px; }
.sh-opt { display: flex; gap: 8px; align-items: flex-start; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--line); background: var(--field); cursor: pointer; }
.sh-opt b { display: block; } .sh-opt small { color: var(--muted); }
.sh-opt:has(input:checked) { border-color: var(--accent); }
.admin-table tr.is-sel td { background: color-mix(in srgb, var(--accent) 10%, transparent); }
@media (max-width: 560px) { .sh-sale { grid-template-columns: 1fr; } }
/* Conta › Página pública (pausar) */
.acc-vis-st { margin: 0 0 12px; padding: 10px 14px; border-radius: 12px; border: 1px solid rgba(46,230,214,.35); background: rgba(46,230,214,.08); }
.acc-vis-st b { color: #2EE6D6; }
.acc-vis-st.is-off { border-color: rgba(255,201,60,.45); background: rgba(255,201,60,.08); }
.acc-vis-st.is-off b { color: #FFC93C; }
:root[data-theme="light"] .acc-vis-st b { color: #0B7F76; } :root[data-theme="light"] .acc-vis-st.is-off b { color: #9A6B00; }

/* ============================================================
   Painel › Overlay e Destaque (lt-)
   ============================================================ */
.lt-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.lt-head h1 { margin: 0; }
.lt-st { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 999px; background: color-mix(in srgb, var(--text) 8%, transparent); color: var(--muted); }
.lt-st i { width: 8px; height: 8px; border-radius: 50%; background: #888; }
.lt-st.is-live { background: rgba(235,4,0,.14); color: #ff6b6b; }
.lt-st.is-live i { background: #EB0400; animation: lt-blink 1.2s infinite; }
@keyframes lt-blink { 50% { opacity: .3; } }
.lt-jump { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.lt-jump a { font-size: 13px; font-weight: 600; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--line); text-decoration: none; color: var(--text); }
.lt-jump a:hover { border-color: var(--accent); }
.lt-now { margin: 14px 0; padding: 14px; border-radius: 14px; border: 1.5px solid var(--accent); background: color-mix(in srgb, var(--accent) 10%, transparent); display: flex; flex-direction: column; gap: 12px; }
.lt-now-k { font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); }
.lt-now-m { display: flex; gap: 12px; align-items: center; min-width: 0; }
.lt-now-m > div { min-width: 0; display: flex; flex-direction: column; }
.lt-now-m small { color: var(--muted); overflow-wrap: anywhere; }
.lt-now-e { font-size: 28px; line-height: 1; flex: none; }
.lt-dom { font-size: 12px; }
.lt-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.lt-stats div { text-align: center; padding: 8px; border-radius: 10px; border: 1px solid var(--line); background: var(--field); }
.lt-stats b { display: block; font-size: 20px; font-variant-numeric: tabular-nums; }
.lt-stats span { font-size: 11px; color: var(--muted); }
.lt-now-a { display: flex; gap: 8px; flex-wrap: wrap; }
.lt-now-a form { margin: 0; }
.lt-none { color: var(--muted); margin: 12px 0; }
.lt-form { display: flex; flex-direction: column; gap: 4px; margin-top: 10px; }
.lt-form > .btn { align-self: flex-start; margin-top: 6px; }
.lt-emo { border: 0; padding: 0; margin: 0 0 8px; display: flex; flex-wrap: wrap; gap: 6px; }
.lt-emo legend { font-size: 13px; font-weight: 600; margin-bottom: 6px; padding: 0; }
.lt-emo label { cursor: pointer; }
.lt-emo input { position: absolute; opacity: 0; pointer-events: none; }
.lt-emo span { display: grid; place-items: center; width: 42px; height: 42px; font-size: 20px; border-radius: 10px; border: 1px solid var(--line); }
.lt-emo input:checked + span { border-color: var(--accent); box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 35%, transparent); }
.lt-emo input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.lt-2 { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 0 12px; }
@media (max-width: 560px) { .lt-2 { grid-template-columns: minmax(0, 1fr); } }
.lt-h3 { margin: 20px 0 8px; font-size: 14px; }
.lt-recent { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.lt-recent li { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 12px; }
.lt-recent form { margin: 0; }
.lt-r-m { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.lt-r-m strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lt-r-m small { color: var(--muted); }
.lt-opts { margin-top: 16px; }
.lt-opts .check span { display: flex; flex-direction: column; }
.lt-reply { display: flex; flex-direction: column; gap: 4px; padding: 10px 12px; margin: 12px 0; border-radius: 12px; background: color-mix(in srgb, var(--cyan) 10%, transparent); border: 1px dashed color-mix(in srgb, var(--cyan) 50%, transparent); }
.lt-reply span { font-size: 12px; color: var(--muted); }
.lt-bots { display: flex; flex-direction: column; gap: 12px; }
.lt-bot { display: flex; flex-direction: column; gap: 4px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; }
.lt-bot-h { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; align-items: baseline; }
.lt-bot-h small { color: var(--muted); font-size: 12px; }
.lt-bot .hint { margin: 0; }
.lt-bot .copy-row input, .lt-secret { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; }
.lt-prev { margin: 14px 0; }
.lt-prev-box { position: relative; width: 100%; aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; border: 1px solid var(--line); background: #111; margin-top: 6px; }
.lt-prev-box iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.lt-ovf { display: flex; flex-direction: column; gap: 10px; }
.lt-ovf fieldset { border: 0; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.lt-ovf legend { font-size: 13px; font-weight: 700; margin-bottom: 6px; padding: 0; }
.lt-snd { display: flex; flex-wrap: wrap; gap: 10px 20px; align-items: center; }
.lt-vol { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.lt-vol input { width: 160px; accent-color: var(--accent); }
.lt-acts { display: flex; gap: 8px; flex-wrap: wrap; }
.lt-sum { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 8px; margin: 10px 0; }
.lt-sum div { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 2px; padding: 12px 8px; border-radius: 12px; border: 1px solid var(--line); }
.lt-sum b { font-size: 22px; font-variant-numeric: tabular-nums; }
.lt-sum small { font-size: 12px; color: var(--muted); }
.lt-home { border: 1.5px solid var(--accent); border-radius: 14px; padding: 14px; margin: 16px 0; background: color-mix(in srgb, var(--accent) 8%, transparent); }
.lt-home-h { display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; }
.lt-home-h strong { font-size: 15px; }
.lt-home form { margin: 0; }