/* Hotsite do companheiro: a paleta e as molduras de pedra do jogo novo (azul-ardósia + dourado); ciano para a área de foco. */
:root{
  --bg:#0d131b; --panel:#141c27; --panel-2:#1b2532; --line:#2a3a4e; --line-2:#3a5068;
  --ink:#dfeaf7; --ink-dim:#a3b6ca; --accent:#7fb8ec; --gold:#ffd166;
  --focus:#63c7d9; --focus-bg:#0f1a22; --focus-line:#2b4b57; --focus-ink:#d4f4fa;
  --rare:#67b9ff; --epic:#d49aff; --mythic:#fff36b;
  --shadow:0 18px 40px -18px #000c;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:56px} /* a barra fixa do topo não cobre o título de quem chega por âncora */
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Space Mono",ui-monospace,Consolas,monospace;line-height:1.6;-webkit-font-smoothing:antialiased;padding-inline:16px}
h1,h2,h3,.px{font-family:"Press Start 2P",ui-monospace,monospace;letter-spacing:.4px;text-wrap:balance;font-weight:400}
a{color:inherit}
img{max-width:100%}
.wrap{max-width:1080px;margin-inline:auto}
section{padding-block:64px}
.eyebrow{display:flex;align-items:center;gap:8px;font-size:10px;text-transform:uppercase;letter-spacing:2px;color:var(--accent);margin-bottom:16px}
.eyebrow:before{content:"";width:8px;height:8px;background:currentColor;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);flex:none}
.eyebrow.blue{color:var(--focus)}
h2{font-size:clamp(17px,2.6vw,23px);line-height:1.45;margin:0 0 14px}
.sub{color:var(--ink-dim);font-size:14.5px;max-width:62ch;margin:0 0 30px}
.px-img{image-rendering:pixelated}

/* ---------- nav ---------- */
nav{position:sticky;top:0;z-index:30;background:color-mix(in srgb,var(--bg) 84%,transparent);backdrop-filter:blur(6px);border-bottom:1px solid var(--line);margin-inline:-16px;padding-inline:16px}
nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-block:11px}
.brand{display:flex;align-items:center;gap:10px;font-size:12px;text-decoration:none}
.brand img{width:26px;height:26px;border-radius:6px}
nav ul{display:flex;gap:6px;list-style:none;margin:0;padding:0;flex-wrap:wrap;justify-content:flex-end}
nav a.l{font-size:11.5px;text-decoration:none;color:var(--ink-dim);padding:6px 9px;border-radius:4px}
nav a.l:hover{color:var(--ink);background:var(--panel-2)}
@media (max-width:720px){nav ul li:not(.keep){display:none}}
nav .langsw{display:flex;gap:2px;margin-left:6px}nav .langsw a.l{padding:6px 7px;font-weight:700;letter-spacing:.04em}nav .langsw a.l.on{color:var(--ink);background:var(--panel-2)}

/* ---------- hero ---------- */
.hero{padding-block:54px 24px;text-align:center}
.hero .eyebrow{justify-content:center}
h1{font-size:clamp(20px,4.2vw,36px);line-height:1.35;margin:0 auto 20px;max-width:26ch}
h1 span{color:var(--accent)}
.lede{color:var(--ink-dim);font-size:16px;max-width:60ch;margin:0 auto 28px}
.btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.btn{font-family:"Press Start 2P",monospace;font-size:11px;padding:14px 18px;border-radius:3px;text-decoration:none;border:1px solid var(--line-2);display:inline-block;cursor:pointer;background:transparent;color:var(--ink)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#101317}
.btn:hover{border-color:var(--accent)}
.btn.blue{border-color:var(--focus);color:var(--focus-ink)}

/* ---------- demo ---------- */
.demo{margin-top:40px}
.stage{position:relative;max-width:1040px;margin-inline:auto;border:1px solid var(--line-2);border-radius:10px;box-shadow:var(--shadow);overflow:hidden;background:#0b0d10}
.stage-bar{display:flex;align-items:center;gap:8px;padding:8px 12px;border-bottom:1px solid var(--line);font-size:11px;color:var(--ink-dim);text-align:left;background:#0e1115}
.stage-bar i{width:9px;height:9px;border-radius:50%;background:#3b424b;flex:none}
.stage-bar b{margin-left:auto;font-weight:400;display:flex;align-items:center;gap:6px;color:var(--accent)}
.stage-bar b:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent);animation:live 1.6s ease-in-out infinite}
@keyframes live{50%{opacity:.25}}
.viewport{position:relative;width:100%;overflow:hidden;background:#111820;aspect-ratio:16/9} /* a "tela do PC" (16:9): reserva a altura antes do JS escalar o jogo */
.desk{position:absolute;inset:0 0 7%;background:radial-gradient(120% 90% at 20% 10%,#5aa0cf 0,#2b6a99 38%,#173a5c 75%),linear-gradient(135deg,#1c3b5a,#2a6f97);overflow:hidden}
.desk:after{content:"";position:absolute;inset:0;background:radial-gradient(60% 50% at 78% 22%,#ffffff26,transparent 70%)}
.dicons{position:absolute;left:2.2%;top:4%;display:flex;flex-direction:column;gap:14px;z-index:1}
.dicons span{display:flex;flex-direction:column;align-items:center;gap:4px;font:10px/1.1 system-ui,sans-serif;color:#fff;text-shadow:0 1px 2px #0009;width:56px;text-align:center}
.dicons i{width:26px;height:20px;border-radius:3px;background:#f0c552;box-shadow:inset 0 -5px #d9a933}
.dicons i.fi{width:20px;height:26px;background:#f4f6f9;box-shadow:inset 0 -3px #c9d0d9}.dicons i.tr{width:20px;height:24px;background:#9fb0c2;border-radius:2px 2px 5px 5px;box-shadow:inset 0 5px #b9c8d8}
.fwin{position:absolute;background:#f6f7f9;border-radius:7px 7px 3px 3px;box-shadow:0 10px 30px #0006,0 0 0 1px #0003;overflow:hidden;z-index:2}
.fw-bar{display:flex;align-items:center;gap:6px;height:22px;padding:0 9px;background:#e6e9ee;font:10px system-ui,sans-serif;color:#444}
.fw-bar i{width:8px;height:8px;border-radius:50%;background:#c9ced6;flex:none}.fw-bar span{margin-left:8px}
.fw-main{left:9%;top:7%;width:52%;height:66%}
.fw-body{padding:16px 5% 0;display:flex;flex-direction:column;gap:9px}
.fw-body i{display:block;height:6px;border-radius:3px;background:#cfd5dd}
.fw-body b{display:block;height:11px;width:44%;border-radius:3px;background:#5b7fa6;margin-bottom:4px}
.fw-body em{display:block;height:34px;border-radius:4px;background:linear-gradient(90deg,#dbe6f2,#c7d6e8);margin:4px 0}
.fw-side{left:56%;top:16%;width:36%;height:56%;background:#fff}
.fw-grid{height:100%;background:linear-gradient(#e5e9ee 1px,transparent 1px) 0 0/100% 18px,linear-gradient(90deg,#e5e9ee 1px,transparent 1px) 0 0/22% 100%}
.taskbar{position:absolute;left:0;right:0;bottom:0;height:7%;min-height:18px;display:flex;align-items:center;gap:8px;padding:0 3%;background:#141a26f0;border-top:1px solid #ffffff1a;z-index:3}
.tb-start{display:grid;grid-template-columns:repeat(2,6px);gap:2px;margin-right:6px}.tb-start i{width:6px;height:6px;background:#5fb0ea}
.tb-app{width:16px;height:16px;border-radius:4px;background:#3a4560}.tb-app.on{background:#5b7fa6;box-shadow:0 3px 0 -1px #9fc4ec}
.tb-tray{margin-left:auto;position:relative;display:flex;align-items:center}
.tb-tray>button{all:unset;cursor:pointer;display:flex;padding:2px;border-radius:3px}.tb-tray>button:hover,.tb-tray>button:focus-visible{background:#ffffff26;outline:1px solid #9fc4ec}
.tb-tray img{width:16px;height:16px;image-rendering:pixelated;display:block}
.tray-menu{position:absolute;right:-6px;bottom:calc(100% + 6px);min-width:150px;background:#1b2230;border:1px solid #ffffff2e;box-shadow:0 6px 18px #000a;padding:4px;z-index:9;display:flex;flex-direction:column;font:11px system-ui,sans-serif;color:#dfe6f1}
.tray-menu[hidden]{display:none}
.tray-menu em{font-style:normal;color:#8895ab;padding:4px 8px}
.tray-menu hr{border:0;border-top:1px solid #ffffff1f;margin:3px 2px;width:auto}
.tray-menu button{all:unset;cursor:pointer;padding:5px 8px;border-radius:2px;white-space:nowrap}.tray-menu button:hover,.tray-menu button:focus-visible{background:#3d5f8a}
.tray-menu small{color:#9fc4ec;padding:4px 8px;max-width:190px;white-space:normal;border-top:1px solid #ffffff1f;margin-top:3px}
.gamebox.pulse{outline:2px solid #9fc4ec;outline-offset:3px}
.tb-clock{margin-left:8px;font:10px system-ui,sans-serif;color:#dfe6f1;font-weight:400}
.gamebox{position:absolute;left:50%;transform:translateX(-50%);bottom:7%;width:36%;aspect-ratio:520/220;z-index:4;outline:1px dashed #ffffff55;outline-offset:2px}
.gtag{position:absolute;left:0;bottom:calc(100% + 6px);white-space:nowrap;font:10px system-ui,sans-serif;color:#fff;background:#0009;padding:2px 7px;border-radius:9px}
.gamebox iframe{position:absolute;left:0;top:0;width:520px;height:220px;border:0;transform-origin:0 0;background:transparent}
@media (max-width:640px){.gamebox{width:64%}.gtag{font-size:9px}.dicons{display:none}.fw-main{left:5%;width:66%}.fw-side{display:none}}
.poster{position:absolute;inset:0;z-index:6;display:none;align-items:center;justify-content:center;flex-direction:column;gap:14px;background:#0e1115;text-align:center;padding:20px}
.poster.on{display:flex}
.poster p{margin:0;color:var(--ink-dim);font-size:13px;max-width:44ch}
.controls{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center;padding:14px 12px;border-top:1px solid var(--line);background:#0e1115}
.controls button,.controls select{font:inherit;font-size:12px;padding:8px 12px;background:var(--panel-2);color:var(--ink);border:1px solid var(--line-2);border-radius:5px;cursor:pointer}
.controls button:hover,.controls select:hover{border-color:var(--accent);background:#242e3a}
.controls .sep{width:1px;height:22px;background:var(--line-2);margin-inline:4px}
.controls label{font-size:11px;color:var(--ink-dim);display:flex;align-items:center;gap:6px}
.demo-note{color:var(--ink-dim);font-size:12.5px;margin:14px auto 0;max-width:70ch;text-align:center}

/* ---------- cards ---------- */
.grid{display:grid;gap:14px;grid-template-columns:repeat(4,1fr)}
@media (max-width:900px){.grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.grid{grid-template-columns:1fr}}
.grid.three{grid-template-columns:repeat(3,1fr)}
@media (max-width:820px){.grid.three{grid-template-columns:1fr}}
.card{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:20px;display:flex;flex-direction:column;gap:10px}
.card .n{font-family:"Press Start 2P",monospace;font-size:11px;color:var(--accent)}
.card h3{font-size:12px;line-height:1.55;margin:0}
.card p{margin:0;font-size:13px;color:var(--ink-dim)}
.card.blue{background:var(--focus-bg);border-color:var(--focus-line)}.card.blue .n{color:var(--focus)}
.spr-row{display:flex;gap:6px;align-items:flex-end;min-height:70px}

/* ---------- sprites animados (frames em fila; CSS steps) ---------- */
.spr{--fw:var(--w);--fh:var(--h,var(--w));display:inline-block;flex:none;width:var(--w);height:var(--h,var(--w));background-repeat:no-repeat;image-rendering:pixelated;
  background-size:calc(var(--n)*var(--fw)) var(--fh);background-position:var(--ox,0px) var(--oy,0px);animation:spr calc(var(--n)*var(--ms,110ms)) steps(var(--n)) infinite}
@keyframes spr{to{background-position:calc(var(--ox,0px) - var(--n)*var(--fw)) var(--oy,0px)}}
/* recortes: o personagem ocupa só parte do quadro (heróis 192px, orc 100px de quadro com ~17px de corpo): ampliamos e recortamos */
.s-pawn{--fw:192px;--fh:192px;--w:110px;--h:90px;--ox:-48px;--oy:-54px}
.s-war{--fw:192px;--fh:192px;--w:100px;--h:96px;--ox:-50px;--oy:-44px}
.s-orc{--fw:400px;--fh:400px;--w:100px;--h:76px;--ox:-170px;--oy:-158px}
.evo{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;justify-content:center;padding:20px 8px;background:radial-gradient(ellipse at 50% 100%,#222d3a 0,#0000 70%);border:1px solid var(--line);border-radius:10px;margin-bottom:14px}
.evo figure{margin:0;text-align:center;font-size:10.5px;color:var(--ink-dim);width:118px;display:flex;flex-direction:column;align-items:center}
.evo figcaption{margin-top:2px}
.evo .c-rare{color:var(--rare)}.evo .c-epic{color:var(--epic)}.evo .c-leg{color:#ff7a6b}.evo .c-myth{color:var(--mythic)}
.split{display:grid;gap:34px;grid-template-columns:1fr 1fr;align-items:center}
@media (max-width:820px){.split{grid-template-columns:1fr}}
.split.rev>:first-child{order:2}
@media (max-width:820px){.split.rev>:first-child{order:0}}
.split p{color:var(--ink-dim);font-size:14px;margin:0 0 12px}
.split ul{margin:0;padding-left:18px;color:var(--ink-dim);font-size:13.5px}.split li{margin-bottom:6px}
.split li b{color:var(--ink);font-weight:700}
.shot{border:1px solid var(--line-2);border-radius:10px;overflow:hidden;box-shadow:var(--shadow);background:#0c0e10}
.shot img{display:block;width:100%;height:auto}
.shot.blue{border-color:var(--focus-line)}
.shots3{display:grid;gap:14px;grid-template-columns:repeat(3,1fr);margin-top:26px}
@media (max-width:820px){.shots3{grid-template-columns:1fr}}
.shot figcaption{padding:9px 12px;font-size:11.5px;color:var(--ink-dim);border-top:1px solid var(--line);background:#0e1115}
figure.shot{margin:0}

/* ---------- foco (azul) ---------- */
.focus-band{background:linear-gradient(180deg,#0d1a24 0,#0b141c 100%);border:1px solid var(--focus-line);border-radius:14px;padding:clamp(20px,4vw,40px)}
.focus-band h2{color:var(--focus-ink)}
.focus-band .sub{color:#9cb8c9}
.badges{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.badge{font-size:11px;padding:6px 10px;border:1px solid var(--focus-line);border-radius:20px;color:var(--focus-ink);background:#0c141a}
.badge.gold{border-color:#a39348;color:#ffe9a8}

/* ---------- números ---------- */
.stats{display:grid;gap:14px;grid-template-columns:repeat(4,1fr)}
@media (max-width:820px){.stats{grid-template-columns:repeat(2,1fr)}}
.stat{border-left:2px solid var(--line-2);padding-left:14px}
.stat b{display:block;font-family:"Press Start 2P",monospace;font-size:clamp(16px,2.6vw,22px);color:var(--gold);margin-bottom:8px;font-weight:400}
.stat span{font-size:12.5px;color:var(--ink-dim)}

/* ---------- rodar ---------- */
.run{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:clamp(20px,4vw,36px);display:grid;gap:26px;grid-template-columns:1fr 1fr}
@media (max-width:820px){.run{grid-template-columns:1fr}}
.status{display:inline-flex;align-items:center;gap:7px;font-size:10.5px;color:var(--gold);border:1px solid var(--line-2);border-radius:20px;padding:5px 10px;margin-bottom:14px}
.status i{width:6px;height:6px;border-radius:50%;background:var(--gold)}
pre{background:#0b0d10;border:1px solid var(--line);border-radius:6px;padding:14px;font-size:12.5px;overflow-x:auto;color:#b1cae6;margin:0 0 12px}
.run p{color:var(--ink-dim);font-size:13.5px;margin:0 0 12px}
.run h3{font-size:12px;margin:0 0 10px}

footer{border-top:1px solid var(--line);padding-block:28px 44px;color:var(--ink-dim);font-size:12px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}
footer a{text-decoration:none;border-bottom:1px dotted var(--line-2)}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.spr,.stage-bar b:before{animation:none}}

/* ---------- download ---------- */
.dl{display:flex;flex-direction:column;gap:12px;margin-bottom:14px}
.dl .btn{text-align:center;font-size:12px;padding:16px 18px}
.run .fine{font-size:12px;color:var(--ink-dim);margin:0}

/* Reserva de espaço: nenhuma imagem/quadro muda a altura da página depois de carregar (a rolagem por âncora, ex.: Baixar, caía numa seção acima) */
/* (a proporção vem dos atributos width/height de cada <img>; nunca forçar uma proporção única aqui: distorcia as cenas 650x182) */

/* ---------- apoiar (doação por Pix) ---------- */
.cosm figure{margin:0;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px;text-align:center}
.cosm img{width:100%;height:auto;border-radius:4px;display:block;margin-bottom:8px}
.cosm figcaption{font-size:12.5px;color:var(--ink-dim)}
.donate{max-width:640px;margin:34px auto 0;background:var(--panel);border:1px solid var(--line-2);border-radius:10px;padding:22px;box-shadow:var(--shadow)}
.don-row{display:flex;flex-direction:column;gap:6px;font-size:13px;margin-bottom:14px}.don-row small{color:var(--ink-dim)}
.donate input,.donate textarea{font:inherit;font-size:14px;background:#0d1013;color:var(--ink);border:1px solid var(--line-2);border-radius:6px;padding:10px;width:100%}
.donate textarea{font-size:11px;word-break:break-all;resize:none}
.don-note{font-size:12.5px;margin:0 0 14px;padding:8px 10px;border-radius:6px;border:1px solid var(--line-2)}.don-note.ok{color:#c7d9ee;border-color:#516c8a}.don-note.low{color:#ffd9a0;border-color:#8a6b2e}
.don-err{color:#ffb3b3;font-size:13px}.don-small{color:var(--ink-dim);font-size:12.5px}.don-fine{color:var(--ink-dim);font-size:11.5px;margin:16px 0 0;text-align:center}
.don-qr{display:flex;gap:18px;flex-wrap:wrap;align-items:flex-start}.don-qr img{background:#fff;border-radius:8px;padding:8px;image-rendering:pixelated}.don-amt{font-size:18px;margin:0 0 6px}
.don-how{font-size:13px;color:var(--ink-dim);padding-left:20px}.donate h3{font-size:14px;margin:0 0 14px}
.donate .btn{margin-right:6px;margin-bottom:6px}
/* estudo e foco em destaque (2026-09-21) */
nav a.l.foc{color:#8fd0ff;font-weight:700}
.hero-badges{margin:18px 0 22px;justify-content:center}.hero-badges a.badge{text-decoration:none;cursor:pointer}.hero-badges a.badge:hover{filter:brightness(1.15)}
.steps{margin:16px 0 8px;padding-left:22px;display:grid;gap:8px;font-size:15px;line-height:1.5}.steps li::marker{color:#8fd0ff;font-weight:700}
.inspire{margin-top:28px;padding:18px 20px;border:1px dashed #3d4b5a;border-radius:10px;background:#10151aaa}.inspire p{margin:8px 0 0;line-height:1.6;color:#c8d3e0}
/* pagamento com cartão (Checkout Pro), valores fixos */
.don-or{display:flex;align-items:center;gap:10px;margin:20px 0 10px;color:var(--ink-dim);font-size:12px}.don-or:before,.don-or:after{content:"";flex:1;border-top:1px solid var(--line-2)}
.don-chips{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}.don-chips button{font:inherit;font-size:14px;padding:9px 14px;border-radius:8px;border:1px solid var(--line-2);background:#0d1013;color:var(--ink);cursor:pointer}
.don-chips button:hover{border-color:#749fd0;background:#141a20}.don-chips button.unlock{border-color:#a39348;color:#ffe9a8}.don-chips button:disabled{opacity:.5;cursor:wait}
.fine code{font-family:monospace;font-size:11.5px;background:#0d1013;border:1px solid var(--line-2);border-radius:4px;padding:1px 5px;word-break:break-all}
/* Novidades (PatchNotes) */
.pn{padding-block:48px 70px;max-width:820px}.pn-title{font-family:"Press Start 2P",monospace;font-size:clamp(18px,3vw,26px);line-height:1.5;margin:0 0 14px}
.pn-card{background:var(--panel);border:1px solid var(--line-2);border-radius:10px;padding:22px;margin:0 0 22px;box-shadow:var(--shadow)}
.pn-card header{display:flex;align-items:baseline;flex-wrap:wrap;gap:12px;margin-bottom:8px}.pn-ver{font-family:"Press Start 2P",monospace;font-size:16px;color:var(--accent)}
.pn-latest{font-size:10px;text-transform:uppercase;letter-spacing:1px;padding:3px 8px;border:1px solid #a39348;border-radius:20px;color:#ffe9a8}.pn-card time{color:var(--ink-dim);font-size:12.5px}
.pn-sum{margin:0 0 16px;line-height:1.6}.pn-sec{margin:14px 0}.pn-sec h3{font-size:12px;text-transform:uppercase;letter-spacing:1.5px;margin:0 0 8px}
.pn-novo h3{color:#749fd0}.pn-melhorado h3{color:#8fd0ff}.pn-corrigido h3{color:#ffe9a8}.pn-avisos h3{color:#ffb3b3}
.pn-sec ul{margin:0;padding-left:20px;display:grid;gap:7px;line-height:1.55;font-size:14px}.pn-sec code{font-family:monospace;font-size:12px;background:#0d1013;border:1px solid var(--line-2);border-radius:4px;padding:1px 5px}
.pn-dl{margin:18px 0 0}


/* ---------- molduras de pedra do jogo (9-slice) ---------- */
.btn,.toy button,.controls button,.controls select,.more summary,.news .btn{border:6px solid transparent;border-image:url(assets/ui/stone.png) 6 fill/6px/0 stretch;border-radius:0;background:none;image-rendering:pixelated;color:var(--ink)}
.btn:hover,.toy button:hover,.controls button:hover,.more summary:hover{border-image-source:url(assets/ui/stone_blue.png);border-color:transparent;background:none}
.btn.primary{border-image-source:url(assets/ui/stone_gold.png);background:none;color:#ffe9b0}
.btn.primary:hover{border-image-source:url(assets/ui/stone_gold.png);filter:brightness(1.15)}
.card,.shot,.stage{border-radius:0}
.hero .btns{gap:14px;margin-top:6px}
.hero .btn{padding:14px 20px}
.hero{padding-block:46px 24px}
/* ---------- sprites ampliados ---------- */
.spr.z2{--fw:calc(var(--w)*2);--fh:calc(var(--h,var(--w))*2);width:var(--fw);height:var(--fh)}
.spr.z3{--fw:calc(var(--w)*3);--fh:calc(var(--h,var(--w))*3);width:var(--fw);height:var(--fh)}
.spr.z1{--fw:var(--w);--fh:var(--h,var(--w))}
.aura-pair{position:relative;display:inline-block;width:calc(var(--w)*2);height:calc(var(--h)*2)}
.aura-pair .spr{position:absolute;left:0;top:0}
.aura-pair .spr.base{left:calc(var(--p)*2);top:calc(var(--p)*2)}
.aura-pair .spr:first-child{animation:spr calc(var(--n)*var(--ms,110ms)) steps(var(--n)) infinite,auraglow 3.2s ease-in-out infinite}
@keyframes auraglow{0%,100%{opacity:.45}50%{opacity:.95}}
.evo{padding:20px 8px}.evo figure{width:150px}.evo.mons figure{width:132px}
/* ---------- demo como brinquedo ---------- */
.toy{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:center;padding:16px 12px 8px;background:#0c1219;border-top:1px solid var(--line)}
.toy-t{font-family:"Press Start 2P",monospace;font-size:10px;color:var(--ink-dim);margin-right:6px}
.toy button{font:inherit;font-size:13px;padding:6px 14px;cursor:pointer}
.more{background:#0c1219;padding:0 12px 12px;text-align:center}
.more summary{display:inline-block;cursor:pointer;font-size:12px;padding:2px 12px;list-style:none;color:var(--ink-dim)}
.more summary::-webkit-details-marker{display:none}
.more .controls{border-top:0;background:none;margin-top:8px}
.demo-note{font-size:12.5px;color:var(--ink-dim);max-width:60ch;margin:14px auto 0}
/* ---------- novas seções ---------- */
.center{text-align:center;margin-inline:auto}
.cap{font-size:12.5px;color:var(--ink-dim);text-align:center;max-width:64ch;margin:14px auto 0}.cap.l{text-align:left;margin-inline:0}
.strip{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:26px}
.strip .shot img{width:100%;height:auto;display:block}   /* reduzida por filtro suave: 'pixelated' num tamanho não inteiro serrilhava a cena */
@media (max-width:820px){.strip{grid-template-columns:1fr}}
.moments{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:26px 0 20px}
.moment{background:var(--panel);border:1px solid var(--line);padding:14px 10px;text-align:center;display:flex;flex-direction:column;gap:10px;align-items:center}
.moment .spr-row{min-height:150px;align-items:flex-end;justify-content:center}
.moment p{margin:0;font-size:13px;color:var(--ink-dim)}
@media (max-width:820px){.moments{grid-template-columns:repeat(2,1fr)}}
.steps5{margin-top:46px;text-align:center}
.steps5 h3{font-size:13px;margin:0 0 16px}
.steps5 ol{list-style:none;counter-reset:s;display:flex;flex-wrap:wrap;gap:10px;justify-content:center;padding:0;margin:0 0 18px}
.steps5 li{counter-increment:s;background:var(--panel);border:1px solid var(--line);padding:12px 14px;font-size:13px;min-width:150px}
.steps5 li:before{content:counter(s);display:block;font-family:"Press Start 2P",monospace;font-size:11px;color:var(--accent);margin-bottom:6px}
.steps5 .you{font-size:14px;color:var(--ink-dim);max-width:52ch;margin:0 auto}
.h3{font-size:13px;line-height:1.6;margin:0 0 12px}
.pets{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin-top:14px}
.news{display:flex;gap:20px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:var(--panel);border:1px solid var(--line);padding:22px 24px}
#novidades-home{padding-block:26px}
.adv{margin-top:8px}.adv summary{cursor:pointer;font-size:12px;color:var(--ink-dim)}
.preview-note{border-left:2px solid var(--gold);padding-left:10px;color:var(--ink-dim)}
#leve .stats{margin-top:20px}
@media (max-width:560px){.moments{grid-template-columns:1fr}.moment{min-width:0}.evo figure,.evo.mons figure{width:112px}}
.away-demo{max-width:660px;margin:22px auto 6px}.away-demo .shot img{width:100%;height:auto;image-rendering:auto}