/* ==========================================================================
   palis · tema pixel — carregado por último, só no EvoluAI (a home tem tema próprio em home.css).
   Cantos retos, bordas grossas, sombras "duras", fontes pixeladas.
   ========================================================================== */

*, *::before, *::after { border-radius: 0 !important; }
.grain { display: none !important; }

/* ---------- nitidez ---------- */

.px-canvas, canvas.px { image-rendering: pixelated; image-rendering: crisp-edges; }
.icon.px-icon { width: 16px; height: 16px; fill: currentColor; stroke: none; }

/* ---------- céu noturno pixelado ---------- */

.backdrop, .ep-backdrop { background: var(--bg) !important; }
.backdrop::before, .backdrop::after, .ep-backdrop::before, .ep-backdrop::after {
  content: '';
  position: absolute; inset: 0;
  opacity: 1;
  image-rendering: pixelated;
  -webkit-mask-image: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, 0.55) 55%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, 0.55) 55%, transparent 100%);
}
.backdrop::after, .ep-backdrop::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' shape-rendering='crispEdges'%3E%3Cg fill='%23f1e9d6'%3E%3Crect x='7' y='11' width='1' height='1' opacity='.55'/%3E%3Crect x='31' y='4' width='1' height='1' opacity='.35'/%3E%3Crect x='58' y='19' width='1' height='1' opacity='.6'/%3E%3Crect x='84' y='9' width='1' height='1' opacity='.3'/%3E%3Crect x='19' y='44' width='1' height='1' opacity='.4'/%3E%3Crect x='70' y='51' width='1' height='1' opacity='.45'/%3E%3Crect x='44' y='70' width='1' height='1' opacity='.3'/%3E%3Crect x='90' y='77' width='1' height='1' opacity='.5'/%3E%3Crect x='11' y='86' width='1' height='1' opacity='.35'/%3E%3C/g%3E%3Cg fill='%23c8f53c' opacity='.6'%3E%3Crect x='47' y='32' width='1' height='3'/%3E%3Crect x='46' y='33' width='3' height='1'/%3E%3C/g%3E%3C/svg%3E");
  background-size: 192px 192px;
}
.backdrop::before, .ep-backdrop::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='128' height='128' shape-rendering='crispEdges'%3E%3Cg fill='%235b9bff'%3E%3Crect x='22' y='27' width='1' height='3'/%3E%3Crect x='21' y='28' width='3' height='1'/%3E%3Crect x='101' y='88' width='1' height='1'/%3E%3C/g%3E%3Cg fill='%23ffd23f'%3E%3Crect x='76' y='14' width='1' height='1'/%3E%3Crect x='40' y='109' width='1' height='1'/%3E%3C/g%3E%3C/svg%3E");
  background-size: 256px 256px;
  animation: twinkle 2.4s steps(2) infinite;
}
@keyframes twinkle { 50% { opacity: 0.25; } }

/* ---------- tipografia ---------- */

.eyebrow { font: 400 11px/1.2 var(--pixel-ui); letter-spacing: 0.03em; }

.display, .section-title, .project-title, .contact-title, .about-text p:first-child, .slot h3,
.ob-title, .tr-title h1, .res-head h2, .brief h2, .skill-card h3, .track-card h3, .lv-card h3,
.pl-title h1, .sg-head h3, .apl-ph h3, .an-head h4, .ob-step-head h2, .ob-continue h2,
.ep-modal-head h2, .ow-title, .ow-card h2 {
  font-family: var(--pixel);
  font-weight: 600;
  letter-spacing: 0;
}
.display { font-weight: 700; line-height: 0.98; }
.display em, .ob-title em, .contact-title em, .ob-continue h2 em { font-family: inherit; font-style: normal; color: var(--accent); }
.about-text p:first-child { font-weight: 500; }

.kpi b, .ob-stats dd, .tr-kpis dd, .res-score b, .acc-row b, .cm-cell b, .pr dd, .res-details dd,
.sg-stats dd, .ep-stat b, .ring-label b, .res-xp-gain b, .project-metrics b, .now-list .v,
.wordmark, .ep-logo, .ep-avatar-badge, .lv-node, .ob-num, .tc-levels li, .ep-avatar-text b {
  font-family: var(--pixel);
  letter-spacing: 0;
}

.kind, .tc-kind, .cm-h, .cm-v, .cm-cell small, .pr dt, .res-details dt, .tr-kpis dt, .ob-stats dt,
.sg-label, .sg-stats dt, .lv-best, .data th, .data .q, .delta, .ro-dec, .chip, .project-metrics span,
.now-list .k, .filters .count, .links .soon, .pill, .tag, .skill-foot, .tc-foot, .res-thresholds,
.brief-thr, .acc-thr, .sub-top, .ro-head, .legend, .an-foot, .loss-meta, .submit-note, .nick-hint,
.side-note, .ep-by, .ep-crumbs, kbd, .sg-score, .sg-tab .mono, .project-meta .ver, .project-meta .idx {
  font-family: var(--pixel-ui);
  letter-spacing: 0.02em;
}
.pill, .tag { font-size: 10px; }

/* ---------- botões ---------- */

.btn {
  font-family: var(--pixel);
  font-weight: 500;
  letter-spacing: 0.01em;
  border: 2px solid #000;
  background: var(--surface-3);
  box-shadow: inset -2px -2px 0 rgba(0, 0, 0, 0.4), inset 2px 2px 0 rgba(255, 255, 255, 0.08), 3px 3px 0 0 #000;
  transition: transform 0.06s steps(1), box-shadow 0.06s steps(1), background 0.12s steps(2), color 0.12s;
}
.btn:hover { background: var(--line-2); border-color: #000; }
.btn:active { transform: translate(2px, 2px); box-shadow: inset -2px -2px 0 rgba(0, 0, 0, 0.4), inset 2px 2px 0 rgba(255, 255, 255, 0.08), 1px 1px 0 0 #000; }
.btn-primary {
  background: var(--accent);
  color: var(--accent-ink);
  border-color: #000;
  box-shadow: inset -3px -3px 0 var(--accent-dk), inset 3px 3px 0 #e8ffa0, 3px 3px 0 0 #000;
}
.btn-primary:hover { background: #d4ff52; border-color: #000; }
.btn-primary:active { box-shadow: inset -3px -3px 0 var(--accent-dk), inset 3px 3px 0 #e8ffa0, 1px 1px 0 0 #000; }
.btn-ghost { background: transparent; border-color: transparent; box-shadow: none; }
.btn-ghost:hover { background: var(--surface-2); border-color: var(--line-2); }
.btn-ghost:active { box-shadow: none; }
.btn:disabled { opacity: 0.4; }
kbd { border-width: 2px; border-bottom-width: 3px; background: var(--surface-2); color: var(--text-2); font-size: 9px; padding: 2px 5px; }

/* ---------- superfícies ---------- */

.card, .apl-panel, .lv-card, .skill-card, .track-card, .kpis, .ob-continue, .ep-modal-card, .side-card {
  border-width: 2px;
  border-color: var(--line-2);
  background: var(--surface);
  box-shadow: 4px 4px 0 0 rgba(0, 0, 0, 0.6);
}
.project { transition: transform 0.12s steps(2), box-shadow 0.12s steps(2), border-color 0.2s; }
.project:hover { transform: translate(-2px, -2px); box-shadow: 6px 6px 0 0 rgba(0, 0, 0, 0.7); border-color: var(--line-3); }
.project::before { display: none; }
.project-art { background: var(--bg-2); border-color: var(--line-2); border-width: 0 0 2px; }
.project.featured .project-art { border-width: 0 2px 0 0; }
@media (max-width: 980px) { .project.featured .project-art { border-width: 0 0 2px; } }
.project-art::after { display: none; }
.slot { border-width: 2px; background: repeating-linear-gradient(135deg, transparent 0 8px, rgba(255, 255, 255, 0.02) 8px 16px); }

.pill, .tag, .kind { border-width: 1px; border-color: var(--line-2); background: var(--surface-2); }
.dot { width: 6px; height: 6px; }
.dot.live { animation: blink 1.2s steps(2) infinite; }
@keyframes blink { 50% { opacity: 0.35; } }

.seg, .filters { border: 2px solid var(--line-2); background: var(--bg); padding: 2px; }
.seg button[aria-selected='true'], .filters button[aria-selected='true'] { background: var(--accent); color: var(--accent-ink); }
.filters button[aria-selected='true'] .count { color: var(--accent-ink); }
.seg button, .filters button { font-family: var(--pixel); }

/* ---------- topo e navegação ---------- */

.nav.scrolled, .ep-top {
  background: var(--bg);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border-bottom: 2px solid var(--line);
}
.mark {
  width: 24px; height: 24px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8' shape-rendering='crispEdges'%3E%3Cpath fill='%23c8f53c' d='M2 0h4v1H2zM1 1h6v1H1zM0 2h8v1H0z'/%3E%3Cpath fill='%237aa418' d='M0 2h1v1H0z'/%3E%3Cpath fill='%23f2c29b' d='M1 3h6v3H1zM2 6h4v1H2z'/%3E%3Cpath fill='%230c0b10' d='M2 4h1v1H2zM5 4h1v1H5z'/%3E%3C/svg%3E") center / contain no-repeat;
  box-shadow: none;
  image-rendering: pixelated;
}
.mark::after { display: none; }
.wordmark { font-size: 20px; font-weight: 700; }
.ep-logo { font-size: 18px; font-weight: 700; }
.ep-logo svg { width: 24px; height: 24px; }
.ep-stat, .ep-avatar { border-width: 2px; }
.ep-avatar-badge { background: var(--accent); color: var(--accent-ink); }
.nav-links a, .ep-crumbs { font-family: var(--pixel); }

/* ---------- controles ---------- */

.wslider::-webkit-slider-runnable-track, .pc-slider input[type='range']::-webkit-slider-runnable-track, .sg-slider input[type='range']::-webkit-slider-runnable-track { height: 6px; }
.wslider::-moz-range-track, .pc-slider input[type='range']::-moz-range-track, .sg-slider input[type='range']::-moz-range-track { height: 6px; }
.wslider::-webkit-slider-thumb, .pc-slider input[type='range']::-webkit-slider-thumb, .sg-slider input[type='range']::-webkit-slider-thumb {
  width: 12px; height: 18px; margin-top: -6px;
  background: var(--text); border: 2px solid #000;
  box-shadow: inset -2px -2px 0 var(--paper2, #c8bfa9);
}
.wslider::-moz-range-thumb, .pc-slider input[type='range']::-moz-range-thumb, .sg-slider input[type='range']::-moz-range-thumb {
  width: 8px; height: 14px; background: var(--text); border: 2px solid #000;
}
.wslider:active::-webkit-slider-thumb, .pc-slider input[type='range']:active::-webkit-slider-thumb, .sg-slider input[type='range']:active::-webkit-slider-thumb { transform: none; background: var(--accent); }

.switch span { width: 32px; height: 18px; border: 2px solid #000; background: var(--surface-3); }
.switch span::after { top: 2px; left: 2px; width: 10px; height: 10px; background: var(--muted); }
.switch input:checked + span::after { transform: translateX(14px); }

.meter { height: 10px; border: 2px solid var(--line-2); background: var(--bg); }
.meter i { background: repeating-linear-gradient(90deg, var(--accent) 0 6px, transparent 6px 8px); }
.acc-bar { height: 10px; border: 2px solid var(--line-2); background: var(--bg); }
.acc-bar > i { background: repeating-linear-gradient(90deg, var(--text-2) 0 6px, transparent 6px 8px); }
.acc-bar > i.hi { background: repeating-linear-gradient(90deg, var(--accent) 0 6px, transparent 6px 8px); }
.kpi .bar { height: 6px; gap: 2px; }

.stars .star { width: 16px; height: 16px; fill: currentColor; stroke: none; color: var(--line-3); }
.stars .star.on { color: var(--coin); }
.stars.xl { gap: 10px; }
.stars.xl .star { width: 40px; height: 40px; }
.stars.xl .star.on { filter: drop-shadow(3px 3px 0 #000); }

/* ---------- modais e avisos ---------- */

.ep-modal-scrim { backdrop-filter: none; -webkit-backdrop-filter: none; background: rgba(5, 5, 9, 0.82); }
.ep-modal-card { border-color: var(--line-3); box-shadow: 8px 8px 0 0 #000; background: var(--surface); }
.ep-modal-card { transition: opacity 0.12s steps(2), transform 0.15s steps(3); }
.ep-toast { border-width: 2px; box-shadow: 4px 4px 0 0 #000; font-family: var(--pixel); }
.res-xp, .sg-goal, .sg-msg, .sg-formula, .tr-note, .an-hint, .brief-tip, .brief-formula, .equation, .readout, .sub-progress, .pc-msg, .pc-formula {
  border-width: 2px;
}
.readout, .sub-progress { backdrop-filter: none; -webkit-backdrop-filter: none; background: var(--bg); box-shadow: 3px 3px 0 0 #000; }
.belt-stage, .sg-canvas { border-width: 2px; border-color: var(--line-2); background: var(--bg-2); }
.belt-stage::before { display: none; }
.hist, .loss, .spark { image-rendering: pixelated; }
.ep-badge-ico { background: var(--surface-3); color: var(--coin); }
.ep-badges li { border-width: 2px; }
.ep-badges li.new { box-shadow: 3px 3px 0 0 var(--accent-dk); }

/* ---------- abas dos jogos ---------- */

.sg-tab, .pc-gate { border-width: 2px; font-family: var(--pixel); }
.sg-tab.cur, .pc-gate.cur { background: var(--accent); color: var(--accent-ink); border-color: #000; box-shadow: 2px 2px 0 0 #000; }
.sg-tab.cur .mono, .pc-gate.cur .mono { color: var(--accent-ink); }
.sg-pips i { height: 8px; width: 12px; border: 2px solid var(--line-2); background: var(--bg); }
.sg-pips i.on { background: var(--accent); border-color: var(--accent-dk); }
.sg-chip-toggle { border-width: 2px; font-family: var(--pixel); }

/* ---------- home: arte e mascote ---------- */

.project-art canvas.art-px { display: block; width: 100%; height: 100%; object-fit: cover; image-rendering: pixelated; }
.now-who { display: inline-flex; align-items: center; gap: 12px; }
.mascot { width: 36px; height: 51px; image-rendering: pixelated; }
