/* ============================================================
   Site — visual Clash (mesma linguagem da home, do login e do admin)
   Carregada por último no portal_header: vale para todas as páginas do site.
   ============================================================ */

/* ---------- Tokens ---------- */
html[data-theme] body.portal-body {
  --game: "Lilita One", "Rajdhani", "Inter", system-ui, sans-serif;
  --radius: 20px;
  --radius-sm: 12px;
  --gold: #ffc53d; --gold-2: #ffd96e; --gold-deep: #a35f00;
  --gold-ink: var(--gold); --gold-ink-2: var(--gold-2);
  --accent: #ffc53d; --accent-2: #ffd96e; --accent-deep: #a35f00;
  --vio: var(--accent); --vio-2: var(--accent-2); --vio-deep: var(--accent-deep);
  --grad: linear-gradient(180deg, #ffd34d, #f0a019);
  --on-accent: #4a2a00;
  --nav: #0c1729; --nav-2: #12223b; --nav-edge: #0a1528;
}
html[data-theme="dark"] body.portal-body {
  --bg: #0f1a2c; --bg-2: #0c1626;
  --panel: #15233a; --panel-2: #1b2f4f; --panel-3: #0e1a2e;
  --edge: #0a1528; --soft: rgba(255, 255, 255, 0.07);
  --line: rgba(255, 255, 255, 0.08); --line-2: #24395c;
  --tx: #ffffff; --tx-2: rgba(255, 255, 255, 0.74); --tx-3: rgba(255, 255, 255, 0.52);
  --ok: #6cc93a; --ok-bg: rgba(108, 201, 58, 0.16);
  --warn: #ffb21f; --warn-bg: rgba(255, 178, 31, 0.16);
  --bad: #ff5a47; --bad-bg: rgba(255, 90, 71, 0.16);
  --shadow: 0 24px 50px rgba(0, 0, 0, 0.45);
}
html[data-theme="light"] body.portal-body {
  --bg: #e6d6b0; --bg-2: #dccaa0;
  --panel: #fbf3df; --panel-2: #f3e5c3; --panel-3: #ecdcb4;
  --edge: #7a5a2e; --soft: rgba(122, 90, 46, 0.18);
  --line: rgba(122, 90, 46, 0.2); --line-2: #c9ad78;
  --tx: #2c1d0b; --tx-2: #6b5233; --tx-3: #8f7652;
  --gold-ink: #8a5300; --gold-ink-2: #5c3700;
  --accent-2: #8a5300; --vio-2: #8a5300;
  --ok: #3f8f17; --ok-bg: rgba(63, 143, 23, 0.14);
  --warn: #b86e00; --warn-bg: rgba(184, 110, 0, 0.14);
  --bad: #c62f1c; --bad-bg: rgba(198, 47, 28, 0.12);
  --shadow: 0 18px 40px rgba(74, 50, 18, 0.25);
  --nav: #0c1729; --nav-2: #12223b; --nav-edge: #0a1528;
}

/* ---------- Base ---------- */
html[data-theme] body.portal-body {
  background:
    radial-gradient(1200px 500px at 80% -10%, rgba(74, 163, 255, 0.14), transparent 60%),
    radial-gradient(900px 500px at -10% 110%, rgba(255, 197, 61, 0.08), transparent 60%),
    var(--bg);
  background-attachment: fixed;
}
html[data-theme="light"] body.portal-body {
  background:
    radial-gradient(1000px 500px at 85% -10%, rgba(255, 255, 255, 0.55), transparent 60%),
    repeating-linear-gradient(45deg, rgba(122, 90, 46, 0.035) 0 2px, transparent 2px 14px),
    var(--bg);
}
body.portal-body :is(h1, h2, h3) { font-family: var(--game); font-weight: 400; letter-spacing: 0.01em; }
body.portal-body a { color: var(--gold-ink); }
body.portal-body a:hover, html[data-theme="light"] .portal-body a:hover { color: var(--gold-ink-2); }
body.portal-body ::selection { background: rgba(255, 197, 61, 0.4); color: inherit; }
body.portal-body :focus-visible { outline: 3px solid var(--gold); outline-offset: 2px; }

/* cursor do jogo: seta dourada e espada nos clicáveis */
body.portal-body { cursor: url("../images/cursor-arrow.svg") 4 3, auto; }
body.portal-body :is(a, button, summary, label, select, [role="button"], [role="tab"], [data-theme-toggle], input[type="checkbox"], input[type="radio"]) { cursor: url("../images/cursor-sword.svg") 3 3, pointer; }
body.portal-body :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]), textarea, [contenteditable="true"]) { cursor: text; }
body.portal-body :is(button, input, select):disabled { cursor: not-allowed; }

/* ---------- Topo ---------- */
body.portal-body .app-nav,
html[data-theme="light"] body.portal-body .app-nav {
  background: linear-gradient(180deg, var(--nav-2), var(--nav));
  border-bottom: 4px solid var(--nav-edge);
  box-shadow: 0 4px 0 rgba(0, 0, 0, 0.18);
  backdrop-filter: none; -webkit-backdrop-filter: none;
}
body.portal-body .app-logo, body.portal-body .app-logo:hover { color: #fff; }
body.portal-body .app-logo-mark { width: 42px; height: 42px; padding: 3px; border: 3px solid #8a5300; border-radius: 13px; background: linear-gradient(180deg, #ffe27a, #e08a0b); box-shadow: 0 3px 0 #5a3500; }
body.portal-body .app-logo-mark img { border-radius: 8px; }
body.portal-body .app-logo-text { font: 400 1.25rem/1 var(--game); letter-spacing: 0.02em; color: #fff; -webkit-text-stroke: 1px #0a1528; paint-order: stroke fill; text-shadow: 0 3px 0 rgba(0, 0, 0, 0.4); }
html[data-theme] body.portal-body .app-logo-text em { color: #ffd23f; }

body.portal-body .app-nav-links { gap: 6px; }
html[data-theme] body.portal-body .app-nav-links a {
  position: relative; top: 0; display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px;
  border: 3px solid transparent; border-radius: 12px; color: rgba(255, 255, 255, 0.8);
  font: 400 1.02rem var(--game); letter-spacing: 0.02em; transition: background-color 0.15s, color 0.15s, top 0.12s;
}
html[data-theme] body.portal-body .app-nav-links a:hover { color: #fff; background: rgba(255, 255, 255, 0.08); }
html[data-theme] body.portal-body .app-nav-links a.is-active {
  top: -1px; color: #fff; border-color: #8a5300; background: linear-gradient(180deg, #ffc53d, #f0a019);
  box-shadow: 0 4px 0 #8a5300; text-shadow: 0 2px 0 rgba(0, 0, 0, 0.35);
}
body.portal-body .app-nav-links a.is-active::after { display: none; }
body.portal-body .nav-new { font-family: var(--font); border: 2px solid #fff; background: linear-gradient(180deg, #8ee05a, #3a9a22); color: #fff; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.35); box-shadow: 0 2px 0 #1f5a10; }

body.portal-body :is(.app-cart, .app-theme-toggle, .app-profile-btn),
html[data-theme="light"] body.portal-body :is(.app-cart, .app-theme-toggle, .app-profile-btn) {
  border: 3px solid rgba(0, 0, 0, 0.35); background: rgba(255, 255, 255, 0.08); color: #fff; box-shadow: 0 3px 0 rgba(0, 0, 0, 0.3);
  transition: transform 0.12s, background-color 0.15s;
}
body.portal-body :is(.app-cart, .app-theme-toggle) { width: 44px; height: 44px; border-radius: 50%; }
body.portal-body :is(.app-cart, .app-theme-toggle, .app-profile-btn):hover,
body.portal-body :is(.app-cart-wrap.is-open .app-cart, .app-profile.is-open .app-profile-btn) { transform: translateY(-2px); background: rgba(255, 255, 255, 0.16); border-color: rgba(0, 0, 0, 0.35); color: #fff; }
body.portal-body .app-profile-btn { min-height: 44px; padding: 3px 12px 3px 4px; }
body.portal-body .app-profile-name { font: 400 1rem var(--game); letter-spacing: 0.02em; }
body.portal-body .app-caret { color: rgba(255, 255, 255, 0.7); }
body.portal-body .app-avatar { width: 32px; height: 32px; border: 2px solid rgba(255, 255, 255, 0.85); }
body.portal-body .app-cart-badge { min-width: 22px; height: 22px; top: -8px; right: -8px; border: 2.5px solid #fff; background: linear-gradient(180deg, #ff6b5a, #d1281a); color: #fff; font: 400 0.78rem/1 var(--game); box-shadow: 0 2px 0 #7a1208; }
body.portal-body .app-signup { border: 0; border-radius: 12px; background: linear-gradient(180deg, #ffc53d, #f0a019); color: #fff; font: 400 1.02rem var(--game); letter-spacing: 0.02em; text-shadow: 0 2px 0 rgba(0, 0, 0, 0.35); box-shadow: 0 4px 0 #a35f00; }
body.portal-body a.app-signup:hover { color: #fff; filter: none; background: linear-gradient(180deg, #ffd04f, #f5ab25); }

/* menus que abrem do topo */
body.portal-body :is(.app-dropdown, .app-cart-dropdown) {
  border: 3px solid var(--edge); border-radius: 18px; background: var(--panel); color: var(--tx); box-shadow: 0 6px 0 var(--edge), var(--shadow);
}
body.portal-body .app-dropdown-user { border-bottom: 3px dashed var(--soft); }
body.portal-body .app-dropdown-user .nm { font: 400 1.15rem var(--game); letter-spacing: 0.02em; }
body.portal-body .app-dropdown .app-dropdown-item:hover,
html[data-theme="light"] body.portal-body .app-dropdown .app-dropdown-item:hover { background: var(--panel-2); color: var(--tx); }
body.portal-body .app-dropdown-sep { height: 0; border-top: 3px dashed var(--soft); background: none; }
body.portal-body :is(.app-cart-dropdown-head, .app-cart-dropdown-foot) { border-color: var(--soft); border-width: 3px; }
body.portal-body .app-cart-dropdown-head strong { font: 400 1.1rem var(--game); letter-spacing: 0.02em; }
body.portal-body .app-cart-line em { color: var(--tx); }
body.portal-body .app-cart-line:hover { background: var(--panel-2); }

/* ---------- Rodapé ---------- */
body.portal-body .site-foot,
html[data-theme="light"] body.portal-body .site-foot { border-top: 4px solid var(--nav-edge); background: linear-gradient(180deg, var(--nav-2), var(--nav)); color: rgba(255, 255, 255, 0.72); }
body.portal-body .site-foot-logo span { font: 400 1.2rem var(--game); letter-spacing: 0.02em; color: #fff; }
body.portal-body .site-foot-logo em { color: #ffd23f; }
body.portal-body .site-foot-brand p, body.portal-body .site-foot-bottom .site-foot-inner { color: rgba(255, 255, 255, 0.55); }
body.portal-body .site-foot-col h4 { font: 400 0.95rem var(--game); letter-spacing: 0.06em; color: #ffd23f; }
body.portal-body .site-foot-col a { color: rgba(255, 255, 255, 0.7) !important; }
body.portal-body .site-foot-col a:hover { color: #ffd23f !important; }
body.portal-body .site-foot-bottom { border-top: 3px dashed rgba(255, 255, 255, 0.1); }

/* ---------- Botões 3D ---------- */
body.portal-body :is(.btn, .loja-btn, .portal-cta) {
  --top: rgba(255, 255, 255, 0.1); --top-h: rgba(255, 255, 255, 0.18); --base: rgba(0, 0, 0, 0.35);
  position: relative; top: 0; min-height: 46px; padding: 0 20px; border: 0; border-radius: 14px;
  background: var(--top); color: var(--tx); font: 400 1.04rem var(--game); letter-spacing: 0.02em;
  box-shadow: 0 5px 0 var(--base), inset 0 0 0 3px var(--soft); filter: none; transform: none;
  transition: top 0.12s cubic-bezier(.3, 1.6, .5, 1), box-shadow 0.12s, background-color 0.15s;
}
body.portal-body :is(.btn, .loja-btn, .portal-cta):hover { top: -2px; background: var(--top-h); box-shadow: 0 7px 0 var(--base), inset 0 0 0 3px var(--soft); filter: none; transform: none; color: var(--tx); }
body.portal-body :is(.btn, .loja-btn, .portal-cta):active { top: 3px; box-shadow: 0 2px 0 var(--base); transition-duration: 0.05s; }
html[data-theme="light"] body.portal-body :is(.btn-ghost, .loja-btn-ghost) { --top: #fffaf0; --top-h: #fff; --base: var(--edge); box-shadow: 0 5px 0 var(--base), inset 0 0 0 3px var(--edge); }
html[data-theme="light"] body.portal-body :is(.btn-ghost, .loja-btn-ghost):hover { box-shadow: 0 7px 0 var(--base), inset 0 0 0 3px var(--edge); }
body.portal-body :is(.btn-primary, .loja-btn-primary, .portal-cta),
html[data-theme] body.portal-body :is(a.btn-primary, a.loja-btn-primary, a.portal-cta) {
  --top: #ffb81f; --top-h: #ffc53d; --base: #a35f00;
  color: #fff; text-shadow: 0 2px 0 rgba(0, 0, 0, 0.35); box-shadow: 0 5px 0 var(--base);
}
body.portal-body :is(.btn-primary, .loja-btn-primary, .portal-cta):hover,
html[data-theme] body.portal-body :is(a.btn-primary, a.loja-btn-primary, a.portal-cta):hover { color: #fff; box-shadow: 0 7px 0 var(--base); }
body.portal-body :is(.btn-danger, .loja-btn-danger) { --top: #f0533d; --top-h: #ff6b55; --base: #8f1d0e; color: #fff; text-shadow: 0 2px 0 rgba(0, 0, 0, 0.35); box-shadow: 0 5px 0 var(--base); }
body.portal-body :is(.btn-sm, .loja-btn-sm, .portal-cta-sm) { min-height: 38px; padding: 0 14px; font-size: 0.95rem; border-radius: 12px; }

/* ---------- Cartões ---------- */
body.portal-body :is(.panel, .portal-panel, .stat-card, .quick-card, .hero, .u-card, .ov-empty) {
  border: 3px solid var(--edge); border-radius: var(--radius);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent 140px), var(--panel);
  box-shadow: 0 5px 0 var(--edge), 0 18px 34px rgba(0, 0, 0, 0.2);
}
html[data-theme="light"] body.portal-body :is(.panel, .portal-panel, .stat-card, .quick-card, .u-card, .ov-empty) {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.6), transparent 140px), var(--panel);
  box-shadow: 0 5px 0 var(--edge), 0 14px 26px rgba(74, 50, 18, 0.16);
}
body.portal-body .hero { background: var(--panel-3); }
body.portal-body :is(.panel-head h2, .portal-panel-head h2, .section-title h2) { font-size: 1.4rem; }
body.portal-body .stat-val { font: 400 1.6rem var(--game); letter-spacing: 0.01em; }
body.portal-body .stat-ico { border: 2px solid rgba(255, 197, 61, 0.35); background: rgba(255, 197, 61, 0.14); color: var(--gold-ink); }
body.portal-body :is(.lic-item, .order-item) { border: 3px solid var(--soft); border-radius: 14px; background: var(--panel-2); }
body.portal-body :is(.lic-item, .order-item):hover { border-color: var(--gold); }
body.portal-body .quick-card:hover { border-color: var(--edge); transform: translateY(-3px); }

/* ---------- Selos e avisos ---------- */
body.portal-body :is(.portal-badge, .act-pill) { padding: 3px 10px; border: 2px solid currentColor; font: 400 0.82rem var(--game); letter-spacing: 0.03em; }
body.portal-body .alert { border-width: 3px; border-radius: 14px; }
body.portal-body .alert.ok { border-color: var(--ok); }
body.portal-body .alert.err { border-color: var(--bad); }

/* ---------- Campos ---------- */
/* .mp-brick fica de fora: o formulário do cartão do Mercado Pago tem o próprio layout */
body.portal-body :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="hidden"]), select, textarea):not(.mp-brick *) {
  border: 3px solid var(--edge); border-radius: 12px; background-color: var(--panel-3); color: var(--tx);
  box-shadow: inset 0 3px 0 rgba(0, 0, 0, 0.18);
}
html[data-theme="light"] body.portal-body :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="hidden"]), select, textarea):not(.mp-brick *) { background-color: #fffaf0; box-shadow: inset 0 3px 0 rgba(122, 90, 46, 0.12); }
body.portal-body :is(input, select, textarea):not(.mp-brick *):focus { border-color: var(--gold); outline: none; box-shadow: inset 0 3px 0 rgba(0, 0, 0, 0.18), 0 0 0 4px rgba(255, 197, 61, 0.22); }
body.portal-body :is(input, textarea)::placeholder { color: var(--tx-3); }
/* campos dentro de uma caixa que já tem a borda (busca das estatísticas) */
body.portal-body .cs-search-box input { border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }

/* ---------- Tabelas ---------- */
body.portal-body :is(.portal-table, .u-table) th { color: var(--tx-3); font: 800 0.7rem var(--font); letter-spacing: 0.09em; text-transform: uppercase; border-bottom: 3px solid var(--edge); }
body.portal-body :is(.portal-table, .u-table) td { border-bottom: 2px solid var(--soft); }

/* ---------- Blocos de uso (perfil e key) ---------- */
body.portal-body { --u-display: var(--game); }
body.portal-body .u-card { padding: 22px 24px; }
body.portal-body .u-kpi { border: 3px solid var(--edge); border-radius: 18px; background: var(--panel); box-shadow: 0 5px 0 var(--edge); }
body.portal-body .u-kpi-value { font-family: var(--game); font-weight: 400; letter-spacing: 0.01em; }
body.portal-body :is(.u-kpi, .ar-score).has-pop { cursor: inherit; }
body.portal-body .u-portal-head h2 { font-size: 1.9rem; }
body.portal-body .u-portal-eyebrow {
  display: inline-block; width: fit-content; padding: 3px 16px; background: linear-gradient(180deg, #ffd34d, #f0a019); color: #4a2a00;
  font: 400 0.78rem var(--game); letter-spacing: 0.05em; border-radius: 4px; box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.18);
  clip-path: polygon(0 0, 100% 0, calc(100% - 8px) 50%, 100% 100%, 0 100%, 8px 50%);
}
body.portal-body .u-card-head h3 { font-size: 1.4rem; }
body.portal-body .u-seg { padding: 4px; border: 3px solid var(--edge); border-radius: 14px; background: var(--panel-3); }
body.portal-body .u-seg-btn { border-radius: 10px; font: 400 0.92rem var(--game); letter-spacing: 0.02em; color: var(--tx-2); }
body.portal-body .u-seg-btn.is-on { background: linear-gradient(180deg, #ffc53d, #f0a019); color: #fff; text-shadow: 0 2px 0 rgba(0, 0, 0, 0.3); box-shadow: 0 3px 0 #a35f00; }

/* ---------- Perfil ---------- */
body.portal-body .profile-head { border: 3px solid var(--edge); border-radius: 24px; box-shadow: 0 6px 0 var(--edge), 0 20px 40px rgba(0, 0, 0, 0.25); }
body.portal-body .profile-head.has-banner { border-color: #0a1528; box-shadow: 0 6px 0 #0a1528, 0 20px 40px rgba(0, 0, 0, 0.3); }
html[data-theme="light"] body.portal-body .profile-head.has-banner { border-color: #0a1528; box-shadow: 0 6px 0 #0a1528, 0 18px 30px rgba(74, 50, 18, 0.25); }
body.portal-body .profile-name-row h1 { font-size: 1.9rem; }
body.portal-body .profile-head.has-banner .profile-name-row h1 { -webkit-text-stroke: 1.2px #0a1528; paint-order: stroke fill; text-shadow: 0 3px 0 rgba(0, 0, 0, 0.45); }
body.portal-body .profile-av { border: 4px solid #fff; box-shadow: 0 4px 0 rgba(0, 0, 0, 0.35); }
body.portal-body .profile-head.has-banner :is(.loja-btn-ghost, a.loja-btn-ghost),
html[data-theme="light"] body.portal-body .profile-head.has-banner a.loja-btn-ghost { --top: rgba(6, 9, 16, 0.55); --top-h: rgba(6, 9, 16, 0.75); --base: rgba(0, 0, 0, 0.5); color: #fff; box-shadow: 0 5px 0 var(--base), inset 0 0 0 3px rgba(255, 255, 255, 0.25); }

body.portal-body .profile-tabs { gap: 6px; padding: 5px; border: 3px solid var(--edge); border-radius: 16px; background: var(--panel-3); }
body.portal-body .profile-tab { min-height: 40px; padding: 0 16px; border-radius: 11px; color: var(--tx-2); font: 400 1rem var(--game); letter-spacing: 0.02em; }
body.portal-body .profile-tab.is-active { background: linear-gradient(180deg, #ffc53d, #f0a019); color: #fff; text-shadow: 0 2px 0 rgba(0, 0, 0, 0.35); box-shadow: 0 3px 0 #a35f00; }
body.portal-body .profile-tab .tb { font-family: var(--font); }

body.portal-body .kx-head h2 { font: 400 1.9rem var(--game); letter-spacing: 0.01em; }
body.portal-body :is(.kx-sum span, .kx-steps li) { border: 2px solid var(--soft); }
body.portal-body .kx-steps b { border: 2px solid #8a5300; color: #4a2a00; font-family: var(--game); font-weight: 400; }
body.portal-body .kx-row { border: 3px solid var(--edge); border-radius: 20px; box-shadow: inset 6px 0 0 var(--st), 0 5px 0 var(--edge); }
body.portal-body .kx-row:hover { border-color: var(--edge); box-shadow: inset 6px 0 0 var(--st), 0 7px 0 var(--edge); }
body.portal-body .kx-row > * + * { border-left: 3px dashed var(--soft); }
body.portal-body .kx-title h3 { font: 400 1.4rem var(--game); letter-spacing: 0.01em; }
body.portal-body .kx-ring strong { font-family: var(--game); font-weight: 400; }
body.portal-body .kx-btn { position: relative; top: 0; min-height: 40px; border: 0; border-radius: 12px; background: var(--panel-2); box-shadow: 0 4px 0 var(--edge), inset 0 0 0 2px var(--soft); font: 400 0.98rem var(--game); letter-spacing: 0.02em; transition: top 0.12s, box-shadow 0.12s; }
body.portal-body .kx-btn:hover { top: -2px; color: var(--tx); box-shadow: 0 6px 0 var(--edge), inset 0 0 0 2px var(--gold); }
body.portal-body .kx-btn--gold { background: linear-gradient(180deg, #ffc53d, #f0a019); color: #fff; text-shadow: 0 2px 0 rgba(0, 0, 0, 0.35); box-shadow: 0 4px 0 #a35f00; }
body.portal-body .kx-btn--gold:hover { color: #fff; filter: none; box-shadow: 0 6px 0 #a35f00; }
body.portal-body .kx-btn.sx-btn-danger { color: var(--bad); }
body.portal-body .kx-actions :is(.kx-btn, .hwid-reset-btn) { width: 100%; padding: 0 10px; white-space: nowrap; font-size: 0.92rem; }
body.portal-body .kx-empty { border: 3px dashed var(--edge); border-radius: 20px; }

body.portal-body .sx-box { border: 3px solid var(--edge); border-radius: 22px; box-shadow: 0 5px 0 var(--edge); }
body.portal-body :is(.sx-top, .sx-item) { border-bottom: 3px dashed var(--soft); }
body.portal-body .sx-top h2 { font: 400 1.9rem var(--game); letter-spacing: 0.01em; }
body.portal-body .sx-item-txt strong { font: 400 1.2rem var(--game); letter-spacing: 0.01em; }
body.portal-body .sx-item-ico { border: 3px solid var(--soft); }
body.portal-body .sx-pill { border: 2px solid currentColor; font: 400 0.8rem var(--game); letter-spacing: 0.03em; }
body.portal-body .sx-dlg-head h3 { font: 400 1.4rem var(--game); letter-spacing: 0.01em; }
body.portal-body .sx-dlg-x { border: 3px solid var(--edge); border-radius: 50%; }
body.portal-body .av-form header h3 { font-size: 1.6rem; }
body.portal-body :is(.av-palette, .av-preview) { border: 3px solid var(--edge); }
body.portal-body .av-grid span { border: 3px solid var(--edge); }
body.portal-body .av-grid input:checked + span, body.portal-body .av-banners input:checked + span { border-color: var(--gold); box-shadow: 0 0 0 4px rgba(255, 197, 61, 0.35); }
body.portal-body .av-banners span { border: 3px solid var(--edge); }

/* ---------- Janelas ---------- */
body.portal-body dialog:not(.am) { border: 3px solid var(--edge); border-radius: 22px; background: var(--panel); color: var(--tx); box-shadow: 0 7px 0 var(--edge), 0 30px 80px rgba(0, 0, 0, 0.5); }
body.portal-body dialog::backdrop { background: rgba(4, 8, 14, 0.72); backdrop-filter: blur(4px); }
html[data-theme="light"] body.portal-body dialog::backdrop { background: rgba(42, 29, 12, 0.55); }

/* ---------- Rolagem ---------- */
body.portal-body ::-webkit-scrollbar { width: 12px; height: 12px; }
body.portal-body ::-webkit-scrollbar-thumb { background: var(--line-2); border: 3px solid transparent; border-radius: 99px; background-clip: padding-box; }
body.portal-body ::-webkit-scrollbar-track { background: transparent; }

/* ---------- Rodapé no fim da tela em páginas curtas ---------- */
body.portal-body { display: flex; flex-direction: column; }
body.portal-body > .portal-main { flex: 1 0 auto; width: 100%; box-sizing: border-box; }

/* ---------- Carrinho e pedido ---------- */
body.portal-body .loja-eyebrow {
  display: inline-block; width: fit-content; padding: 4px 16px; background: linear-gradient(180deg, #ffd34d, #f0a019); color: #4a2a00;
  font-family: var(--game); font-size: 0.8rem; font-weight: 400; letter-spacing: 0.06em;
  clip-path: polygon(0 0, 100% 0, calc(100% - 10px) 50%, 100% 100%, 0 100%, 10px 50%);
}
body.portal-body .loja-page-head h1 { margin-top: 8px; font: 400 2rem/1.1 var(--game); letter-spacing: 0.01em; }
body.portal-body :is(.cart-empty, .cart-summary) { border: 3px solid var(--edge); border-radius: 18px; background: var(--panel); box-shadow: 0 6px 0 var(--edge); }
body.portal-body .cart-empty h2, body.portal-body .cart-summary h3 { font-family: var(--game); font-weight: 400; letter-spacing: 0.01em; font-size: 1.35rem; }
body.portal-body .cart-row { border: 2px solid var(--line-2); border-radius: 14px; box-shadow: 0 4px 0 var(--line-2); }
body.portal-body .cart-row-main img { border: 2px solid var(--edge); }
body.portal-body .cart-row-main .t { font-family: var(--game); font-weight: 400; font-size: 1.05rem; letter-spacing: 0.01em; }
body.portal-body .cart-line, body.portal-body .cart-summary .row.total .val { font-family: var(--game); font-weight: 400; color: var(--gold-ink); }
body.portal-body .cart-summary .row.total .val { font-size: 1.5rem; }
body.portal-body .cart-summary .row.total { border-top: 2px solid var(--line-2); }
body.portal-body .cart-qty { border: 2px solid var(--edge); background: var(--panel-2); box-shadow: 0 3px 0 var(--edge); }
body.portal-body .cart-qty .q { font-family: var(--game); font-weight: 400; }
body.portal-body .cart-remove { border: 2px solid var(--line-2); box-shadow: 0 3px 0 var(--line-2); }
body.portal-body .cart-remove:hover { border-color: #c62f1c; box-shadow: 0 3px 0 #8f1f12; }
body.portal-body .pay-box { border: 3px solid #a35f00; border-radius: 14px; background: color-mix(in srgb, var(--gold) 12%, var(--panel-2)); box-shadow: 0 4px 0 #a35f00; }
body.portal-body .pay-label { color: var(--gold-ink); font-family: var(--game); font-weight: 400; font-size: 0.9rem; }
body.portal-body .pay-line strong { font-family: var(--game); font-weight: 400; letter-spacing: 0.01em; }
body.portal-body .key-card { border: 2px solid #3fae2a; border-radius: 13px; box-shadow: 0 3px 0 #2c7d1d; }
html[data-theme="light"] body.portal-body .key-plain { color: #2f7d16; }
body.portal-body .buy-hint-warn { border: 2px solid #a35f00; }
body.portal-body .profile-table th { font-family: var(--game); font-weight: 400; letter-spacing: 0.04em; }
body.portal-body .profile-table th, body.portal-body .profile-table td { border-bottom-width: 2px; }

/* ---------- Política de privacidade ---------- */
body.portal-body .cookie-policy { padding: 32px 38px 26px; border: 3px solid var(--edge); border-radius: 22px; background: var(--panel); box-shadow: 0 6px 0 var(--edge); }
body.portal-body .cookie-policy h1 { font: 400 2.1rem/1.1 var(--game); letter-spacing: 0.01em; }
body.portal-body .cookie-policy h2 {
  width: fit-content; margin-top: 24px; padding: 4px 18px; background: linear-gradient(180deg, #ffd34d, #f0a019); color: #4a2a00;
  font: 400 1rem var(--game); letter-spacing: 0.04em;
  clip-path: polygon(0 0, 100% 0, calc(100% - 10px) 50%, 100% 100%, 0 100%, 10px 50%);
}

/* ---------- Caixa de seleção (ui-select) ---------- */
body.portal-body .ui-select-btn { border: 3px solid var(--edge); background: var(--panel-3); box-shadow: inset 0 3px 0 rgba(0, 0, 0, 0.15); }
html[data-theme="light"] body.portal-body .ui-select-btn { background: #fffaf0; }
body.portal-body .ui-select-btn:hover, body.portal-body .ui-select.is-open .ui-select-btn, body.portal-body .ui-select-btn:focus-visible { border-color: #a35f00; box-shadow: inset 0 3px 0 rgba(0, 0, 0, 0.15); }
body.portal-body .ui-select.is-open .ui-select-arrow { color: var(--gold-ink); }
body.portal-body .ui-select-list { border: 3px solid var(--edge); border-radius: 14px; background: var(--panel); box-shadow: 0 6px 0 var(--edge), 0 18px 40px rgba(0, 0, 0, 0.3); }
body.portal-body .ui-select-opt.is-active { background: color-mix(in srgb, var(--gold) 16%, transparent); color: var(--tx); }
body.portal-body .ui-select-opt.is-selected, body.portal-body .ui-select-check { color: var(--gold-ink); }

@media (max-width: 900px) {
  html[data-theme] body.portal-body .app-nav-links a { padding: 0 10px; font-size: 0.95rem; }
}
