/* vietnamese */
@font-face {
  font-family: 'Anton';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/anton-vietnamese.889f979804.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Anton';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/anton-latin-ext.ae1a8ac1c2.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Anton';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/anton-latin.23aab0b269.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url("/assets/fonts/archivo-vietnamese.2518e8eb97.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url("/assets/fonts/archivo-latin-ext.a999e009fd.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url("/assets/fonts/archivo-latin.7150c0ec5a.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url("/assets/fonts/archivo-vietnamese.2518e8eb97.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url("/assets/fonts/archivo-latin-ext.a999e009fd.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url("/assets/fonts/archivo-latin.7150c0ec5a.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url("/assets/fonts/archivo-vietnamese.2518e8eb97.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url("/assets/fonts/archivo-latin-ext.a999e009fd.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url("/assets/fonts/archivo-latin.7150c0ec5a.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 800;
  font-stretch: 100%;
  font-display: swap;
  src: url("/assets/fonts/archivo-vietnamese.2518e8eb97.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 800;
  font-stretch: 100%;
  font-display: swap;
  src: url("/assets/fonts/archivo-latin-ext.a999e009fd.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 800;
  font-stretch: 100%;
  font-display: swap;
  src: url("/assets/fonts/archivo-latin.7150c0ec5a.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/jetbrains-mono-cyrillic-ext.142ebf7f49.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/jetbrains-mono-cyrillic.cfc54a0a56.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/jetbrains-mono-greek.557933eed1.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/jetbrains-mono-vietnamese.71ab65f877.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/jetbrains-mono-latin-ext.9a1b37b154.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/jetbrains-mono-latin.615a7673d3.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
body{margin:0;background:#07120b;color:#f3efe2;font-family:'Archivo',sans-serif;-webkit-font-smoothing:antialiased}
a{color:#f2c94c;text-decoration:none}a:hover{color:#ffe08a}
*{box-sizing:border-box}
@keyframes spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(0,156,59,.6)}70%{box-shadow:0 0 0 18px rgba(0,156,59,0)}100%{box-shadow:0 0 0 0 rgba(0,156,59,0)}}
@keyframes shine{0%{background-position:200% 0}100%{background-position:-200% 0}}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.35}}
html{scroll-behavior:smooth}
/* ===== acréscimos de produção (o que vem do export fica acima, intocado) ===== */

/* o molde cru nunca aparece antes do motor subir */
x-dc{display:none}

/* overflow:hidden no contêiner da página prendia o position:sticky do header */
[data-b22="page"]{overflow:hidden!important}
@supports (overflow:clip){[data-b22="page"]{overflow:clip!important}}

/* Safari antes do 18 só entende o prefixo */
#dc-root header{-webkit-backdrop-filter:blur(10px)}

/* com o link do Airdrop o menu ficou mais largo: de 1140 a 1259 px ele aperta o espaçamento para caber numa linha */
@media (min-width:1140px) and (max-width:1259px){
  [data-b22="bar"] nav{gap:13px!important;font-size:14px!important;flex-wrap:nowrap!important}
  [data-b22="bar"] nav>div{gap:6px!important}
}

/* ---- header em telas estreitas: uma linha só, nada sai da tela ---- */
@media (max-width:1139px){
  [data-b22="bar"] nav{flex-wrap:nowrap!important;gap:8px!important}
  [data-b22="bar"] nav>a{display:none!important}
}
@media (max-width:767px){
  [data-b22="bar"]{padding:10px 16px!important;gap:8px!important}
  [data-b22="bar"] nav>div{gap:6px!important}
  [data-b22="bar"] nav a[href*="instagram.com"]{width:40px;padding:0!important;justify-content:center}
  [data-b22="bar"] nav a[href*="instagram.com"]>span{display:none!important}
  [data-b22="bar"] nav button:not([data-b22="lang-btn"]){padding:0 14px!important;font-size:13px!important;white-space:nowrap}
  [data-b22="bar"] nav button>img{display:none}
  /* seletor de idioma compacto: some o idioma atual, fica só o botão do outro */
  [data-b22="lang"]{padding:0!important}
  [data-b22="lang-btn"][data-on="1"]{display:none}
  [data-b22="lang-btn"]{width:38px!important;height:38px!important;background:transparent!important;color:#f2c94c!important}
}
@media (max-width:559px){
  [data-b22="wordmark"]{display:none!important}
}
@media (max-width:429px){
  [data-b22="bar"]{padding-left:12px!important;padding-right:12px!important}
  [data-b22="bar"] nav>div{gap:4px!important}
  [data-b22="bar"] nav>div>a{width:34px!important;height:34px!important}
  [data-b22="bar"] nav button:not([data-b22="lang-btn"]){height:34px!important;padding:0 10px!important;font-size:12px!important}
  [data-b22="lang-btn"]{width:32px!important;height:32px!important;font-size:11px!important}
}
@media (max-width:359px){
  [data-b22="bar"] nav>div>a[href*="x.com"],[data-b22="bar"] nav>div>a[href*="t.me"]{display:none!important}
}

/* ---- cartão de swap em telas estreitas: o botão da carteira saía pela borda ---- */
@media (max-width:459px){
  [data-b22="swap-head"]{flex-wrap:wrap;gap:8px!important}
  [data-b22="swap-head"] button{padding-left:12px!important;padding-right:12px!important;font-size:13px!important;white-space:nowrap}
  [data-b22="swap-head"] button>img{display:none}
}
@media (max-width:379px){
  [data-b22="swap-head"]{gap:6px!important}
  [data-b22="swap-head"] button{padding-left:8px!important;padding-right:8px!important;font-size:12px!important}
}

/* ---- tokenomics: título e anel de distribuição ao lado do mosaico; carteiras públicas embaixo ---- */
[data-b22="tok-palco"]{grid-template-columns:minmax(0,1fr)}
[data-b22="tok-fatia"]{container-type:inline-size}
[data-b22="tok-fatia"][data-grande="1"]{grid-column:1/-1}
/* letras das peças: acompanham a largura da própria peça (cqw); a primeira linha de cada par vale onde cqw não existe */
[data-b22="tok-nome"]{letter-spacing:.06em;font-size:12px;font-size:clamp(10.5px,8.6cqw,13px)}
[data-b22="tok-qtd"]{font-size:clamp(36px,9.6vw,64px);font-size:clamp(28px,27cqw,64px)}
[data-b22="tok-pct"]{font-size:clamp(18px,4.4vw,30px);font-size:clamp(14px,12.5cqw,30px)}
[data-grande="1"] [data-b22="tok-qtd"]{font-size:clamp(72px,19vw,116px);font-size:clamp(64px,24cqw,116px)}
[data-grande="1"] [data-b22="tok-pct"]{font-size:clamp(32px,8vw,52px);font-size:clamp(30px,10.5cqw,52px)}
[data-b22="tok-lista"]{grid-template-columns:minmax(0,1fr)}
@media (max-width:349px){
  [data-b22="tok-mosaico"]{grid-template-columns:minmax(0,1fr)!important}
}
@media (max-width:559px){
  [data-b22="tok-nota"]{font-size:13px!important}
}
@media (min-width:700px){
  [data-b22="tok-lista"]{grid-template-columns:repeat(2,minmax(0,1fr))}
  [data-b22="tok-lista"][data-n="1"]{grid-template-columns:minmax(0,1fr)}
  [data-b22="tok-lista"][data-n="3"]{grid-template-columns:repeat(3,minmax(0,1fr))}
}
/* tablet: título de um lado, anel do outro; o mosaico vem embaixo em toda a largura */
@media (min-width:700px) and (max-width:979px){
  [data-b22="tok-topo"]{flex-direction:row!important;align-items:center;justify-content:space-between}
  [data-b22="tok-anel"]{flex:none;width:min(44%,340px)!important;margin:0!important}
}
@media (min-width:980px){
  [data-b22="tok-palco"]{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
  [data-b22="tok-mosaico"]{grid-template-rows:auto 1fr 1fr}
  [data-b22="tok-lista"][data-n="4"]{grid-template-columns:repeat(4,minmax(0,1fr))}
}
/* cada arco se desenha quando o anel entra na tela (data-in vem do setupReveal); --l = comprimento, --d = atraso (src/page.js) */
[data-b22="tok-anel"]{container-type:inline-size}
[data-b22="tok-anel"] [data-arc]{stroke-dasharray:var(--l) var(--l);stroke-dashoffset:0;transition:stroke-dashoffset 1.1s cubic-bezier(.2,.8,.2,1) var(--d,0s),opacity .25s ease,stroke-width .25s ease}
[data-b22="tok-anel"]:not([data-in]) [data-arc]{stroke-dashoffset:var(--l)}
/* centro do anel: as letras acompanham a largura do anel */
[data-b22="tok-centro"]{gap:1.6cqw;animation:b22tok .3s cubic-bezier(.2,.8,.2,1)}
[data-b22="tok-numero"]{font-family:'Anton',sans-serif;line-height:.9;font-size:88px;font-size:clamp(60px,29cqw,124px)}
[data-b22="tok-numero"][data-fatia]{font-size:72px;font-size:clamp(48px,23cqw,100px)}
[data-b22="tok-legenda"]{max-width:54%;font-weight:800;letter-spacing:.14em;text-transform:uppercase;line-height:1.25;text-wrap:balance;font-size:12px;font-size:clamp(10px,3.3cqw,14px)}
[data-b22="tok-quantia"]{font-family:'Anton',sans-serif;line-height:1;color:#c9c6b8;font-size:18px;font-size:clamp(14px,5.4cqw,22px)}
@keyframes b22tok{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  [data-b22="tok-anel"] [data-arc]{transition:none}
  [data-b22="tok-anel"] circle{animation:none!important}
  [data-b22="tok-centro"]{animation:none}
}

/* ---- comprar com Apple Pay (app Moonshot): em tela larga o QR do link fica ao lado; no celular, só o botão ---- */
[data-b22="ap-lado"]{display:none!important}
@media (min-width:900px){
  [data-b22="ap-band"][data-qr="1"]{grid-template-columns:minmax(0,1fr) 340px!important}
  [data-b22="ap-lado"]{display:flex!important}
}
/* os três passos lado a lado só quando cabem os três; senão um embaixo do outro (nunca dois em cima e um sobrando) */
[data-b22="ap-texto"]{container-type:inline-size}
@container (max-width:599px){
  [data-b22="ap-passos"]{grid-template-columns:minmax(0,1fr)!important}
}
/* --ap-m = altura da marca do Apple Pay em cada botão (as regras do desenho estão mais abaixo, em "botões Comprar com"); os
   valores de base ficam antes das telas estreitas, que os trocam */
[data-b22="ap-cta"]{--ap-m:56px}
[data-b22="token-moonshot"]{--ap-m:40px}
[data-b22="swap-moonshot"]{--ap-m:44px}
/* o botão grande no celular ocupa a linha toda; frase, marca e seta encolhem juntas para caber até em 320 px */
@media (max-width:479px){
  [data-b22="ap-cta"]{--ap-m:44px;flex:1 1 100%;font-size:17px!important;gap:11px!important;padding:11px 12px 11px 18px!important}
}
@media (max-width:374px){
  [data-b22="ap-cta"]{--ap-m:38px;font-size:16px!important;gap:10px!important;padding:10px 10px 10px 16px!important}
}
@media (max-width:339px){
  [data-b22="ap-cta"]{--ap-m:36px;font-size:14px!important;gap:9px!important;padding:9px 9px 9px 14px!important}
}
@media (max-width:359px){
  [data-b22="ap-texto"]{padding:24px 20px!important}
  [data-b22="ap-selo"]{font-size:11px!important;letter-spacing:.08em!important}
}

/* ---- botões "Comprar com [Apple Pay]": seção da compra (ap-cta), seção do token (token-moonshot) e cartão de troca (swap-moonshot) ----
   A marca é a arte oficial da Apple, sem alteração: src/assets/badges/apple-pay-mark.svg, do pacote Apple-Pay-Mark.zip de
   developer.apple.com/apple-pay/marketing. Nela só a altura muda: nada de sombra, filtro, canto ou fundo.
   O dono quer o botão bem visível a todos, com a marca grande, e todo branco, no estilo da marca: fundo branco, fio preto em
   volta e letra preta (08/10/2026; os estilos de cor estão nas vistas). Frase, marca e seta são três peças alinhadas pelo
   meio; a marca tem pelo menos o dobro da altura da letra e, em volta dela, sobra no mínimo 1/4 da sua altura até a borda do
   botão e até as vizinhas (a Apple pede 1/4 em peça de divulgação). No toque o botão sobe e clareia, sem mudar de tamanho: a
   marca não pode ser ampliada, girada nem animada. A seta é um disco preto com o desenho em branco, igual
   em qualquer aparelho (o caractere "→" continua no texto, sem aparecer, para quem copia a frase). */
[data-b22="ap-marca"]{display:block;flex:none;height:var(--ap-m);width:auto;aspect-ratio:165.52107/105.9651}
[data-b22="ap-seta"]{display:block;flex:none;width:calc(var(--ap-m)*.82);height:calc(var(--ap-m)*.82);border-radius:50%;font-size:0;
  background:#000 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 12h15M13 5.5l6.5 6.5-6.5 6.5'/%3E%3C/svg%3E") 50% 50%/54% no-repeat;
  transition:background-position .28s cubic-bezier(.2,.8,.2,1)}
:is([data-b22="ap-cta"],[data-b22="token-moonshot"],[data-b22="swap-moonshot"]):hover [data-b22="ap-seta"]{background-position:calc(50% + 4px) 50%}
[data-b22="ap-cta"]:focus-visible{outline:3px solid #f2c94c;outline-offset:4px}
[data-b22="token-moonshot"]:focus-visible,[data-b22="swap-moonshot"]:focus-visible{outline:2px solid #f2c94c;outline-offset:3px}
/* seção do token: os dois botões com a mesma altura; no celular, um por linha, de ponta a ponta */
[data-b22="token-botoes"]>a{display:inline-flex;align-items:center;justify-content:center;min-height:60px}
@media (max-width:479px){
  [data-b22="token-botoes"]>a{flex:1 1 100%}
}
@media (max-width:479px){
  [data-b22="swap-linha"]{font-size:19px!important}
}
@media (max-width:374px){
  [data-b22="swap-moonshot"]{--ap-m:40px}
  [data-b22="swap-linha"]{font-size:17px!important;gap:10px!important}
}
@media (max-width:359px){
  [data-b22="token-moonshot"]{--ap-m:36px;gap:10px!important;padding:9px 10px 9px 20px!important}
}
@media (max-width:339px){
  [data-b22="swap-moonshot"]{--ap-m:34px;padding-left:12px!important;padding-right:12px!important}
  [data-b22="swap-linha"]{font-size:15px!important;gap:9px!important}
}
@media (prefers-reduced-motion:reduce){
  [data-b22="ap-seta"]{transition:none}
}

/* ---- campos do airdrop ---- */
[data-b22="airdrop-page"] input::placeholder{color:#6f7d72;opacity:1}
[data-b22="airdrop-page"] button[aria-disabled="true"]{cursor:not-allowed}
[data-b22="ad-confirmar"]:focus-visible,[data-b22="airdrop-page"] button:focus-visible,[data-b22="airdrop-page"] a:focus-visible{outline:2px solid #f2c94c;outline-offset:3px}
/* em tela larga a apresentação acompanha a rolagem enquanto o formulário passa ao lado */
@media (min-width:900px){
  [data-b22="airdrop-side"]{position:sticky!important;top:96px}
}

/* ---- compra com Pix ---- */
[data-b22="pix-page"] input::placeholder{color:#6f7d72;opacity:1}
[data-b22="pix-page"] button[aria-disabled="true"]{cursor:not-allowed}
[data-b22="pix-page"] button:focus-visible,[data-b22="pix-page"] a:focus-visible,[data-b22="px-confirmar"]:focus-visible{outline:2px solid #f2c94c;outline-offset:3px}
[data-b22="px-trilho"] li[data-on="agora"]>span:first-child{animation:b22px 1.4s ease-in-out infinite}
@keyframes b22px{0%,100%{box-shadow:0 0 0 0 rgba(242,201,76,.45)}50%{box-shadow:0 0 0 8px rgba(242,201,76,0)}}
/* celular: chamada, caixa da compra, avisos; tela larga: chamada e avisos à esquerda, a caixa à direita na altura das duas */
@media (min-width:900px){
  [data-b22="pix-page"]{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;grid-template-areas:'topo caixa' 'avisos caixa'!important;grid-template-rows:auto 1fr;column-gap:48px!important}
}
@media (max-width:479px){
  [data-b22="pix-page"]{padding:32px 16px 64px!important}
}
@media (prefers-reduced-motion:reduce){
  [data-b22="px-trilho"] li[data-on="agora"]>span:first-child{animation:none}
}

/* ---- milestones: $22M → $222M → $??? (um de cada vez, em ciclo) ---- */
.b22-cycle{position:relative;display:inline-block;min-width:4.4ch;height:1em;line-height:1;text-align:right}
.b22-cycle>span{position:absolute;right:0;top:0;opacity:0;white-space:nowrap;animation:b22cycle 5.4s cubic-bezier(.2,.8,.2,1) infinite}
.b22-cycle>span:nth-child(2){animation-delay:1.8s}
.b22-cycle>span:nth-child(3){animation-delay:3.6s}
@keyframes b22cycle{
  0%{opacity:0;transform:translateY(.45em) scale(.7)}
  5%,28%{opacity:1;transform:none}
  33.3%,100%{opacity:0;transform:translateY(-.45em) scale(1.25)}
}
@media (prefers-reduced-motion:reduce){
  .b22-cycle>span{animation:none}
  .b22-cycle>span:nth-child(3){opacity:1}
}
/* faixa do airdrop em tela estreita: o losango desce para trás da lista, longe do texto */
@media (max-width:820px){
  [data-b22="airdrop-losango"]{top:auto!important;bottom:-60px;right:-210px!important;transform:rotate(45deg)!important}
}
@media (max-width:479px){
  [data-b22="ms-trilho"]{gap:6px!important}
  [data-b22="airdrop-band"] ol li{padding:12px 14px!important}
  [data-b22="airdrop-cta"]{font-size:17px!important;padding:16px 20px!important}
}

/* ---- /casa: a casa das HypersKids em 3D. O molde desta tela não leva estilo embutido: tudo mora aqui. ---- */
[data-b22="casa-page"]{--hk-chao:#07120b;--hk-laje:#0d1f14;--hk-amarelo:#f2c94c;--hk-creme:#f3efe2;--hk-apoio:#c9c6b8;--hk-verde:#2fd36b;--hk-linha:rgba(242,201,76,.22);
  display:flex;flex-direction:column;gap:clamp(72px,9vw,128px);padding:clamp(14px,2vw,24px) clamp(12px,2vw,24px) clamp(72px,9vw,120px);color:var(--hk-creme)}
[data-b22="casa-page"] .sc-interp{display:contents}
[data-b22="casa-page"] ::selection{background:var(--hk-amarelo);color:var(--hk-chao)}
[data-b22="casa-page"] :focus-visible{outline:2px solid var(--hk-amarelo);outline-offset:3px}
[data-b22="casa-page"] button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
[data-b22="casa-page"] button[aria-disabled="true"]{cursor:not-allowed;opacity:.45}
[data-b22="casa-page"] h1,[data-b22="casa-page"] h2{margin:0;font-family:'Anton',sans-serif;font-weight:400;text-transform:uppercase;line-height:.95;text-wrap:balance}
[data-b22="casa-page"] p{margin:0}
/* palco: título e seletor de partes acima da janela do 3D (numa linha só em tela larga; empilhados no celular) */
[data-b22="casa-palco"]{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
[data-b22="casa-topo"]{display:flex;flex-direction:column;gap:14px;padding:8px 4px 4px}
[data-b22="casa-cabeca"]{display:flex;flex-direction:column;gap:8px}
[data-b22="casa-cabeca"] h1{font-size:clamp(40px,11vw,60px)}
[data-b22="casa-cabeca"] p{font-size:15px;line-height:1.45;color:var(--hk-apoio);max-width:44ch}
[data-b22="casa-predios"],[data-b22="casa-vistas"],[data-b22="casa-zoom"]{display:flex;gap:2px;padding:4px;background:var(--hk-chao);border:1px solid var(--hk-linha);border-radius:16px;align-self:flex-start;max-width:100%;overflow-x:auto;scrollbar-width:none}
[data-b22="casa-predios"] button,[data-b22="casa-vistas"] button,[data-b22="casa-zoom"] button{flex:none;border:0;background:none;color:var(--hk-apoio);padding:10px 14px;border-radius:12px;font-weight:700;font-size:14px;line-height:1.2;white-space:nowrap;transition:background-color .18s ease,color .18s ease}
[data-b22="casa-predios"] button:hover,[data-b22="casa-vistas"] button:hover,[data-b22="casa-zoom"] button:hover{color:var(--hk-creme)}
[data-b22="casa-predios"] button[aria-pressed="true"],[data-b22="casa-vistas"] button[aria-pressed="true"]{background:var(--hk-amarelo);color:var(--hk-chao)}
/* a cena: janela do 3D, história da etapa e trilho. É ela que vai para a tela cheia (onde não há, ela se expande na página) */
[data-b22="casa-cena"]{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
[data-b22="casa-cena"][data-full="1"],[data-b22="casa-cena"]:fullscreen{grid-template-rows:minmax(0,1fr) auto;padding:12px;background:var(--hk-chao);overflow:auto}
[data-b22="casa-cena"][data-full="1"]{position:fixed;inset:0;z-index:60;height:100dvh}
[data-b22="casa-cena"][data-full="1"] [data-b22="casa-janela"],[data-b22="casa-cena"]:fullscreen [data-b22="casa-janela"]{height:auto;min-height:260px}
[data-b22="casa-janela"]{position:relative;overflow:hidden;border-radius:24px;background:#c4d5dc;height:clamp(340px,56svh,540px);isolation:isolate}
[data-b22="casa-poster"],[data-b22="casa-canvas"]{position:absolute;inset:0}
[data-b22="casa-poster"] img{display:block;width:100%;height:100%;object-fit:cover}
[data-b22="casa-canvas"]{outline-offset:-4px;cursor:grab}
[data-b22="casa-canvas"]:active{cursor:grabbing}
/* comandos por cima da janela. No celular: vistas prontas em cima à esquerda, com a dica de uso (ou o aviso de carga, ou o de erro)
   logo abaixo, e aproximar/afastar/tela cheia empilhados na borda direita, como num mapa. Em tela larga vira uma barra só, à direita.
   O que não é botão deixa o arrasto passar para o 3D. */
[data-b22="casa-comandos"]{position:absolute;z-index:2;top:12px;left:12px;right:12px;display:grid;grid-template:"vistas zoom" auto "nota zoom" 1fr/minmax(0,1fr) auto;gap:8px;align-items:start;justify-items:start;pointer-events:none}
[data-b22="casa-vistas"]{grid-area:vistas;overflow:visible;pointer-events:auto}
[data-b22="casa-zoom"]{grid-area:zoom;flex-direction:column;overflow:visible;pointer-events:auto}
[data-b22="casa-vistas"] button{display:grid;place-items:center;min-height:40px;padding:8px 9px;font-size:13px}
[data-b22="casa-icone"]{display:grid;place-items:center;width:40px;height:40px;padding:0}
[data-b22="casa-dica"],[data-b22="casa-carregando"]{grid-area:nota;max-width:100%;padding:8px 12px;border-radius:14px;background:var(--hk-chao);color:var(--hk-creme);font-size:12px;font-weight:600;line-height:1.3;pointer-events:none}
[data-b22="casa-carregando"]::before{content:'';display:inline-block;width:8px;height:8px;margin-right:8px;border-radius:50%;background:var(--hk-amarelo);animation:blink 1.2s infinite}
[data-b22="casa-erro"]{grid-area:nota;justify-self:stretch;pointer-events:auto;display:flex;flex-direction:column;gap:6px;padding:14px 16px;border-radius:16px;background:var(--hk-chao);font-size:14px;line-height:1.45}
[data-b22="casa-erro"] span{color:var(--hk-apoio)}
[data-b22="casa-erro"] button{align-self:flex-start;margin-top:4px;border:1px solid var(--hk-amarelo);background:none;color:var(--hk-amarelo);border-radius:999px;padding:8px 14px;font-weight:800;font-size:13px}
[data-b22="casa-ref"]{position:absolute;z-index:2;right:12px;bottom:12px;width:132px;padding:0;border:0;border-radius:14px;overflow:hidden;background:var(--hk-chao);text-align:left;transition:transform .2s ease}
[data-b22="casa-ref"]:hover{transform:translateY(-3px)}
[data-b22="casa-ref"] img{display:block;width:100%;height:78px;object-fit:cover}
[data-b22="casa-ref"]>span{display:flex;flex-direction:column;gap:2px;padding:8px 10px 10px}
[data-b22="casa-ref"] strong{font-size:12px;font-weight:800;line-height:1.2}
[data-b22="casa-ref"] small{font-size:11px;font-weight:700;color:var(--hk-amarelo)}
/* a história da etapa: em tela larga é uma laje sobre a cena; no celular vem logo abaixo da tira */
[data-b22="casa-historia"]>div{display:flex;align-items:center;gap:12px}
[data-b22="casa-numero"]{font-family:'Anton',sans-serif;font-size:40px;line-height:1;color:var(--hk-amarelo)}
[data-b22="casa-tipo"]{border:1px solid currentColor;border-radius:999px;padding:5px 10px;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;line-height:1.2;color:var(--hk-apoio)}
[data-b22="casa-tipo"][data-kind="photos"]{color:var(--hk-verde)}
[data-b22="casa-tipo"][data-kind="projection"]{color:var(--hk-amarelo)}
[data-b22="casa-historia"] h2{font-family:'Archivo',sans-serif;font-weight:800;font-size:22px;line-height:1.2;text-transform:none}
[data-b22="casa-historia"] p{font-size:15px;line-height:1.55;color:var(--hk-apoio);text-wrap:pretty}
[data-b22="casa-historia"][data-flip="0"]>*{animation:hkpar .28s cubic-bezier(.2,.8,.2,1)}
[data-b22="casa-historia"][data-flip="1"]>*{animation:hkimpar .28s cubic-bezier(.2,.8,.2,1)}
@keyframes hkpar{from{opacity:0;transform:translateY(6px)}}
@keyframes hkimpar{from{opacity:0;transform:translateY(6px)}}
/* trilho: tocar, a tira de etapas (quadros tirados do próprio modelo) e a conta */
[data-b22="casa-trilho"]{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px 16px;padding:14px 10px 22px;border-radius:24px;background:var(--hk-laje)}
[data-b22="casa-play"]{display:flex;align-items:center;gap:12px;border:0;background:none;padding:0;font-weight:800;font-size:15px;line-height:1.2;text-align:left}
[data-b22="casa-play-disco"]{display:grid;place-items:center;flex:none;width:48px;height:48px;border-radius:50%;background:var(--hk-amarelo);color:var(--hk-chao);transition:transform .18s ease}
[data-b22="casa-play"]:hover [data-b22="casa-play-disco"]{transform:scale(1.06)}
[data-b22="casa-play"]{grid-row:1;grid-column:1;justify-self:start}
[data-b22="casa-conta"]{grid-row:1;grid-column:2}
[data-b22="casa-conta"]{font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--hk-apoio);font-variant-numeric:tabular-nums}
[data-b22="casa-etapas"]{position:relative;grid-row:2;grid-column:1/-1}
[data-b22="casa-range"]{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
[data-b22="casa-range"]:focus-visible+[data-b22="casa-tira"]{outline:2px solid var(--hk-amarelo);outline-offset:6px}
[data-b22="casa-tira"]{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:3px;height:74px;border-radius:12px;touch-action:pan-y;cursor:ew-resize;user-select:none;-webkit-user-select:none}
[data-b22="casa-tira"]::after{content:'';position:absolute;left:0;right:0;bottom:-10px;height:3px;border-radius:2px;background:rgba(243,239,226,.16)}
[data-b22="casa-quadro"]{position:relative;container-type:inline-size;overflow:hidden;border-radius:10px;background:#1b2e22;outline:2px solid transparent;outline-offset:-2px;transition:outline-color .18s ease}
[data-b22="casa-quadro"] img{display:block;width:100%;height:100%;object-fit:cover;opacity:.5;transition:opacity .25s ease}
[data-b22="casa-quadro"][data-on="true"]{outline-color:var(--hk-amarelo)}
[data-b22="casa-quadro"][data-on="true"] img,[data-b22="casa-quadro"][data-done="true"] img{opacity:1}
[data-b22="casa-quadro"]::before{content:'';position:absolute;z-index:1;top:6px;left:6px;width:8px;height:8px;border-radius:2px;background:rgba(243,239,226,.6)} /* o marcador quadrado da legenda: tipo da etapa */
[data-b22="casa-quadro"][data-kind="photos"]::before{background:var(--hk-verde)}
[data-b22="casa-quadro"][data-kind="projection"]::before{background:var(--hk-amarelo)}
[data-b22="casa-quadro"]::after{content:'';position:absolute;inset:40% 0 0;background:linear-gradient(rgba(7,18,11,0),rgba(7,18,11,.88))}
[data-b22="casa-quadro"]>span{position:absolute;z-index:1;left:4px;right:1px;bottom:5px;display:flex;flex-direction:column;gap:1px;font-size:11px;font-weight:800;line-height:1.15;color:var(--hk-creme);white-space:nowrap}
[data-b22="casa-quadro"] b{font-family:'Anton',sans-serif;font-weight:400;font-size:17px;color:var(--hk-amarelo)}
[data-b22="casa-quadro"] i{font-style:normal;display:none} /* quadro estreito: fica o número; o nome da etapa está na história, logo abaixo */
@container (min-width:60.5px){ /* o nome entra quando cabe inteiro em 11px, com 3px de folga (em inglês os nomes são mais longos: o corte é maior) */
  [data-b22="casa-quadro"] i{display:block}
  [data-b22="casa-quadro"] b{font-size:14px}
}
@container (min-width:60.5px) and (max-width:64.9px){
  [data-b22="casa-quadro"] i:lang(en){display:none}
  [data-b22="casa-quadro"] b:lang(en){font-size:17px}
}
[data-b22="casa-feito"]{position:absolute;z-index:1;left:0;bottom:-10px;height:3px;width:70%;border-radius:2px;background:var(--hk-amarelo);pointer-events:none}
/* o cursor some atrás da faixa onde ficam número e nome da etapa: a linha não corta o texto do quadro escolhido */
[data-b22="casa-cursor"]{position:absolute;z-index:2;top:-6px;bottom:-14px;left:70%;width:2px;margin-left:-1px;background:linear-gradient(var(--hk-amarelo) 0 38%,transparent 46% 80%,var(--hk-amarelo) 86%);pointer-events:none}
[data-b22="casa-cursor"]::before{content:'';position:absolute;top:-5px;left:50%;width:12px;height:12px;border-radius:3px;background:var(--hk-amarelo);transform:translateX(-50%) rotate(45deg)}
[data-b22="casa-ferramentas"]{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;padding:4px 4px 0}
[data-b22="casa-ferramentas"]>p{flex:1 1 280px;font-size:13px;line-height:1.5;color:#9aa79d;max-width:62ch}
[data-b22="casa-ferramentas"]>div{display:flex;flex-wrap:wrap;gap:8px}
[data-b22="casa-ferramentas"] button,[data-b22="casa-video"]{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--hk-linha);border-radius:999px;background:none;padding:10px 16px;font-weight:700;font-size:14px;line-height:1.2;color:var(--hk-creme);transition:border-color .18s ease,color .18s ease}
[data-b22="casa-ferramentas"] button:hover:not([aria-disabled="true"]),[data-b22="casa-video"]:hover{border-color:var(--hk-amarelo);color:var(--hk-amarelo)}
[data-b22="casa-aviso"]{flex:1 1 100%;font-size:14px;color:var(--hk-creme)}
[data-b22="casa-video"]{background:var(--hk-amarelo);border-color:var(--hk-amarelo);color:var(--hk-chao)}
[data-b22="casa-video"]:hover{color:var(--hk-chao)}
/* seções de baixo: fotos, legenda, números e o fecho */
[data-b22="casa-fotos"],[data-b22="casa-legenda"],[data-b22="casa-numeros"],[data-b22="casa-fecho"]{width:100%;max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:28px;scroll-margin-top:96px}
[data-b22="casa-page"] section>h2,[data-b22="casa-secao-cabeca"] h2{font-size:clamp(36px,6vw,72px);line-height:1.1}
[data-b22="casa-secao-cabeca"]{display:flex;flex-direction:column;gap:14px}
[data-b22="casa-secao-cabeca"] p{font-size:18px;line-height:1.55;color:var(--hk-apoio);max-width:62ch;text-wrap:pretty}
[data-b22="casa-foto-palco"]{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
[data-b22="casa-foto"]{margin:0;overflow:hidden;border-radius:24px;background:var(--hk-laje)}
[data-b22="casa-foto"] img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;background:#16261c}
[data-b22="casa-foto"] figcaption{display:flex;flex-direction:column;gap:4px;padding:16px 20px 20px}
[data-b22="casa-foto"] figcaption>span:first-child{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--hk-apoio)}
[data-b22="casa-foto"] figcaption strong{font-size:20px;font-weight:800;line-height:1.25}
[data-b22="casa-foto"] figcaption>span:last-child{font-size:15px;line-height:1.5;color:var(--hk-apoio)}
[data-b22="casa-foto-lista"]{display:flex;gap:8px;overflow-x:auto;padding-bottom:8px;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:var(--hk-amarelo) transparent}
[data-b22="casa-foto-lista"] button{flex:none;width:128px;display:flex;flex-direction:column;gap:8px;padding:6px 6px 10px;border:1px solid transparent;border-radius:14px;background:var(--hk-laje);text-align:left;scroll-snap-align:start;transition:border-color .18s ease}
[data-b22="casa-foto-lista"] button[aria-pressed="true"]{border-color:var(--hk-amarelo)}
[data-b22="casa-foto-lista"] img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:9px}
[data-b22="casa-foto-lista"] span{padding:0 4px;font-size:13px;font-weight:700;line-height:1.25}
[data-b22="casa-legenda"] dl,[data-b22="casa-numeros"] dl{margin:0;display:flex;flex-direction:column}
[data-b22="casa-legenda"] dl>div{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;padding:22px 0;border-top:1px solid var(--hk-linha)}
[data-b22="casa-legenda"] dt{display:flex;align-items:center;gap:12px;font-size:20px;font-weight:800;line-height:1.2}
[data-b22="casa-legenda"] dt::before{content:'';flex:none;width:14px;height:14px;border-radius:3px;background:rgba(243,239,226,.55)}
[data-b22="casa-legenda"] [data-kind="photos"] dt::before{background:var(--hk-verde)}
[data-b22="casa-legenda"] [data-kind="projection"] dt::before{background:var(--hk-amarelo)}
[data-b22="casa-legenda"] dd{margin:0;font-size:17px;line-height:1.6;color:var(--hk-apoio);max-width:70ch;text-wrap:pretty}
[data-b22="casa-numeros"] dl>div{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:16px 0;border-top:1px solid var(--hk-linha)}
[data-b22="casa-numeros"] dt{font-size:17px;line-height:1.4;color:var(--hk-apoio)}
[data-b22="casa-numeros"] dd{margin:0;font-family:'Anton',sans-serif;font-size:clamp(26px,3.6vw,40px);line-height:1;color:var(--hk-amarelo);text-align:right;font-variant-numeric:tabular-nums}
[data-b22="casa-numeros"]>p{font-size:14px;color:#9aa79d}
[data-b22="casa-fecho"]{gap:20px;padding-top:clamp(40px,6vw,72px);border-top:1px solid var(--hk-linha)}
[data-b22="casa-fecho"]>p{font-size:19px;line-height:1.55;color:var(--hk-apoio);max-width:60ch;text-wrap:pretty}
[data-b22="casa-envio"]{white-space:nowrap;font-weight:800;color:var(--hk-amarelo)}
[data-b22="casa-fecho"]>div{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
[data-b22="casa-comprar"],[data-b22="casa-ig"]{padding:16px 28px;border-radius:999px;font-weight:800;font-size:19px;line-height:1.2;transition:transform .2s cubic-bezier(.2,.8,.2,1),background-color .2s ease,color .2s ease,border-color .2s ease}
[data-b22="casa-comprar"]{background:#009c3b;color:#fff}
[data-b22="casa-comprar"]:hover{background:#00b444;color:#fff;transform:translateY(-3px)}
[data-b22="casa-ig"]{border:1.5px solid var(--hk-creme);color:var(--hk-creme)}
[data-b22="casa-ig"]:hover{border-color:var(--hk-amarelo);color:var(--hk-amarelo);transform:translateY(-3px)}
[data-b22="casa-historia"]{display:flex;flex-direction:column;gap:8px;order:3;padding:6px 4px 0}
[data-b22="casa-trilho"]{order:2}
@media (max-width:559px){
  [data-b22="casa-predios"]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-self:stretch;overflow:visible}
  [data-b22="casa-predios"] button{min-height:44px;padding:10px 8px;font-size:13px}
  [data-b22="casa-cabeca"] h1{font-size:clamp(34px,10.4vw,48px)}
}
@media (max-width:359px){ /* as três vistas ocupam a linha de cima; a pilha de aproximar desce */
  [data-b22="casa-comandos"]{grid-template:"vistas vistas" auto "nota zoom" auto/minmax(0,1fr) auto}
}
@media (min-width:560px){
  [data-b22="casa-tira"]{height:92px;gap:4px}
  [data-b22="casa-cursor"]{background:linear-gradient(var(--hk-amarelo) 0 50%,transparent 57% 82%,var(--hk-amarelo) 87%)}
  [data-b22="casa-trilho"]{padding:14px 16px 22px}
}
@container (min-width:136px){ /* quadro com largura para número e nome na mesma linha (quem decide é o próprio quadro, não a tela) */
  [data-b22="casa-quadro"]>span{flex-direction:row;align-items:baseline;gap:6px;font-size:12px;letter-spacing:.03em;text-transform:uppercase;left:9px;bottom:7px}
  [data-b22="casa-quadro"] b{font-size:15px}
  [data-b22="casa-quadro"]::before{top:8px;left:9px;width:10px;height:10px}
}
@media (min-width:980px){
  /* título à esquerda e as partes do conjunto à direita, numa linha só acima da janela (texto por cima de um 3D que gira não tem contraste garantido) */
  [data-b22="casa-topo"]{flex-direction:row;align-items:flex-end;justify-content:space-between;gap:16px 32px;flex-wrap:wrap;padding:6px 8px 4px}
  [data-b22="casa-cabeca"] h1{font-size:clamp(44px,4.4vw,68px)}
  [data-b22="casa-cabeca"] p{max-width:none}
  [data-b22="casa-predios"]{align-self:flex-end}
  [data-b22="casa-janela"]{height:clamp(440px,calc(100svh - 372px),860px);border-radius:28px}
  [data-b22="casa-comandos"]{top:20px;left:20px;right:20px;grid-template:"vistas zoom" auto "nota nota" auto/auto auto;justify-content:end;justify-items:end}
  [data-b22="casa-zoom"]{flex-direction:row}
  [data-b22="casa-vistas"] button{min-height:34px;padding:8px 10px}
  [data-b22="casa-icone"]{width:34px;height:34px}
  [data-b22="casa-dica"],[data-b22="casa-carregando"]{max-width:none;white-space:nowrap}
  [data-b22="casa-erro"]{justify-self:end;width:340px}
  [data-b22="casa-janela"],[data-b22="casa-historia"]{grid-row:1;grid-column:1}
  [data-b22="casa-historia"]{z-index:2;align-self:end;justify-self:start;order:0;margin:0 0 20px 20px;width:min(420px,calc(100% - 260px));padding:18px 22px 20px;border-radius:20px;background:var(--hk-chao)}
  [data-b22="casa-trilho"]{grid-row:2}
  [data-b22="casa-ref"]{right:20px;bottom:20px;width:188px}
  [data-b22="casa-ref"] img{height:112px}
  [data-b22="casa-ref"] strong{font-size:13px}
  [data-b22="casa-ref"] small{font-size:12px}
  [data-b22="casa-trilho"]{grid-template-columns:auto minmax(0,1fr) auto;gap:20px;padding:14px 22px 24px 14px}
  [data-b22="casa-etapas"]{grid-row:1;grid-column:2}
  [data-b22="casa-conta"]{grid-column:3}
  [data-b22="casa-conta"]{font-size:14px}
  [data-b22="casa-foto-palco"]{grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:20px;align-items:start}
  [data-b22="casa-foto-lista"]{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;overflow:visible;padding:0}
  [data-b22="casa-foto-lista"] button{width:auto;display:grid;grid-template-columns:84px minmax(0,1fr);align-items:center;gap:14px;padding:7px}
  [data-b22="casa-foto-lista"] span{padding:0;font-size:15px}
  [data-b22="casa-legenda"] dl>div{grid-template-columns:260px minmax(0,1fr);gap:32px}
}
@media (prefers-reduced-motion:reduce){
  [data-b22="casa-historia"]>*{animation:none!important}
  [data-b22="casa-carregando"]::before{animation:none}
}
/* chamada da página inicial para /casa */
[data-b22="casa-chamada"]{display:grid;grid-template-columns:minmax(0,1fr);overflow:hidden;border-radius:20px;background:#0d1f14;border:1px solid rgba(242,201,76,.15);color:#f3efe2}
[data-b22="casa-chamada"]:hover{border-color:rgba(242,201,76,.6);transform:translateY(-4px);color:#f3efe2}
[data-b22="casa-chamada"] .sc-interp{display:contents}
[data-b22="casa-chamada-foto"] img{display:block;width:100%;height:100%;min-height:180px;max-height:260px;object-fit:cover}
[data-b22="casa-chamada-texto"]{display:flex;flex-direction:column;gap:10px;justify-content:center;padding:24px 28px 28px}
[data-b22="casa-chamada-texto"] strong{font-family:'Anton',sans-serif;font-weight:400;font-size:clamp(30px,4vw,44px);line-height:1;text-transform:uppercase}
[data-b22="casa-chamada-texto"]>span{font-size:17px;line-height:1.5;color:#c9c6b8}
[data-b22="casa-chamada-texto"]>[data-b22="casa-chamada-cta"]{margin-top:6px;font-weight:800;font-size:16px;color:#f2c94c}
@media (min-width:760px){
  [data-b22="casa-chamada"]{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
  [data-b22="casa-chamada-foto"] img{max-height:none;position:absolute;inset:0}
  [data-b22="casa-chamada-foto"]{position:relative;min-height:220px}
}

/* ---- roadmap: seção "B22 Roadmap" no modelo RM·4 Figurinhas (escolha do dono na vitrine, 08/10/2026). As regras abaixo são cópia
   de prototipos/roadmap/base.css e m4.css: mudou lá, muda aqui. O álbum é uma página de figurinhas: nove cromos numerados, cada um
   colado um pouco torto no seu espaço; as três metas de market cap são as "brilhantes", em folha dourada. Tudo é medido pela largura
   do contêiner "rm" (cqi), não pela janela. --r = inclinação da figurinha; --tx/--ty/--mx/--my vêm do ponteiro (src/client/roadmap.js). ---- */
#roadmap{container-type:inline-size;container-name:rm}
#roadmap .sc-interp{display:contents}
.rm{line-height:1.5;text-align:left}
.rm ::selection{background:#f2c94c;color:#07120b}
.rm-sec{max-width:1200px;margin:0 auto;padding:clamp(72px,10cqi,120px) 24px 0;display:flex;flex-direction:column;gap:clamp(32px,5cqi,56px)}
.rm-cab{display:flex;flex-direction:column;gap:12px}
.rm-olho{color:#f2c94c;font-weight:700;letter-spacing:.12em;font-size:14px;line-height:1.4}
.rm-tit{margin:0;font-family:'Anton',Impact,sans-serif;font-weight:400;font-size:clamp(48px,7cqi,88px);line-height:.95;text-transform:uppercase}
.rm-lead{margin:0;color:#c9c6b8;font-size:20px;line-height:1.5;max-width:640px;text-wrap:pretty}
.rm-pils{display:flex;flex-wrap:wrap;gap:6px}
.rm-pil{display:inline-flex;align-items:center;border:1px solid rgba(242,201,76,.45);color:#f2c94c;padding:6px 12px;border-radius:999px;font-size:12px;font-weight:800;letter-spacing:.08em;line-height:1.2;text-transform:uppercase;white-space:nowrap}
.rm-pil[data-t="meta"]{border-color:rgba(201,198,184,.38);color:#c9c6b8}
.rm-us,.rm-mc{font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.rm-n{font-family:'Anton',Impact,sans-serif;font-weight:400;letter-spacing:0}
.rm-aviso{margin:0;font-size:13px;line-height:1.6;color:#8a968d;max-width:900px;text-wrap:pretty}
.m4-album{list-style:none;margin:0;padding:8px 6px 18px;display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(20px,2.6cqi,28px)}
.m4-f{position:relative;min-width:0}
/* o espaço vazio do álbum, com o número da figurinha, aparece antes de ela ser colada e sobra nas beiradas */
.m4-f::before{content:attr(data-n);position:absolute;inset:0;display:grid;place-items:center;border:2px dashed rgba(242,201,76,.26);border-radius:24px;font-family:'Anton',Impact,sans-serif;font-size:72px;line-height:1;color:rgba(242,201,76,.14)}
.m4-fig{position:relative;height:100%;display:flex;flex-direction:column;padding:7px;border-radius:24px;background:#f3efe2;box-shadow:0 16px 30px rgba(0,0,0,.5);rotate:var(--r);transform:perspective(900px) rotateX(calc(var(--ty,0)*-7deg)) rotateY(calc(var(--tx,0)*9deg));transition:transform .35s ease}
.m4-fig.mexe{transition:none}
.m4-num{position:absolute;z-index:2;top:-12px;left:-12px;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:#f2c94c;color:#07120b;font-family:'Anton',Impact,sans-serif;font-size:23px;line-height:1;box-shadow:0 0 0 4px #07120b,0 6px 12px rgba(0,0,0,.4)}
.m4-dentro{position:relative;flex:1;display:flex;flex-direction:column;gap:10px;min-height:190px;padding:clamp(20px,2.2cqi,26px) clamp(18px,2.2cqi,26px) 36px;border-radius:18px;overflow:hidden;background:radial-gradient(120% 90% at 100% 0,#14341f,#0d2a17 55%,#0a2012)}
.m4-ev h3{margin:8px 0 0;font-family:'Anton',Impact,sans-serif;font-weight:400;font-size:clamp(24px,2.5cqi,32px);line-height:1;text-transform:uppercase;text-wrap:balance}
.m4-ev .m4-texto p{margin:0;font-size:16px;line-height:1.5;color:#c9c6b8}
.m4-ev .rm-pils{margin-top:8px}
.m4-ev .rm-pils+h3{margin-top:0}
/* o retrato da arte é uma foto colada ao lado do texto: moldura branca e um pouco torta, como um cromo do álbum
   (só os passos com pessoa têm foto; a torta alterna de lado a cada figurinha) */
.m4-corpo{display:flex;flex:1;align-items:center;gap:12px}
.m4-texto{flex:1;min-width:0}
.m4-foto{flex:none;width:clamp(78px,11cqi,112px);aspect-ratio:2/3;object-fit:cover;border-radius:10px;border:3px solid #f3efe2;background:#0a2012;rotate:-2.5deg;box-shadow:0 8px 14px rgba(0,0,0,.45)}
.m4-f:nth-child(even) .m4-foto{rotate:2deg}
/* o lema é um adesivo menor, colado por cima da beirada de baixo */
.m4-lema{position:relative;z-index:2;align-self:flex-end;max-width:88%;margin:-22px -10px -12px 0;padding:9px 13px;border-radius:10px;background:#f2c94c;color:#07120b;font-family:'Anton',Impact,sans-serif;font-size:clamp(15px,1.5cqi,18px);line-height:1.08;text-transform:uppercase;rotate:2.5deg;box-shadow:0 8px 16px rgba(0,0,0,.4)}
.m4-brilho{position:absolute;inset:7px;border-radius:18px;pointer-events:none;opacity:0;background:radial-gradient(circle at calc(var(--mx,.5)*100%) calc(var(--my,.5)*100%),rgba(255,255,255,.34),transparent 46%);mix-blend-mode:screen;transition:opacity .3s ease}
.m4-fig.mexe .m4-brilho{opacity:1}

/* brilhante: folha dourada que acompanha o ponteiro, com um clarão que varre de tempos em tempos */
.m4-meta .m4-dentro{justify-content:flex-end;gap:8px;color:#07120b;background:linear-gradient(115deg,#f2c94c 0%,#fff3c4 18%,#e0b23a 34%,#ffe9a3 52%,#c9961c 68%,#f8d86a 84%,#f2c94c 100%);background-size:220% 220%;background-position:calc(var(--mx,.2)*100%) calc(var(--my,.3)*100%)}
.m4-tag{align-self:flex-start;margin:8px 0 auto;padding:5px 10px;border-radius:999px;background:#07120b;color:#f2c94c;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.m4-valor{position:relative;z-index:1;display:flex;flex-wrap:wrap;align-items:baseline;gap:0 12px;font-size:clamp(12px,1.3cqi,15px)}
.m4-valor .rm-n{font-size:var(--tam);line-height:.9}
.m4-meta[data-nivel="1"]{--tam:clamp(min(84px,23cqi),13cqi,150px)}
.m4-meta[data-nivel="2"]{--tam:clamp(min(96px,26cqi),17cqi,200px)}
.m4-meta[data-nivel="3"]{--tam:clamp(min(108px,29cqi),24cqi,280px)}
.m4-st{position:relative;z-index:1;font-size:11px;font-weight:800;letter-spacing:.1em;line-height:1.4;text-transform:uppercase}
.m4-fecho{position:relative;z-index:1;margin:6px 0 0;font-family:'Anton',Impact,sans-serif;font-size:clamp(20px,2.6cqi,34px);line-height:1.1;text-transform:uppercase}
.m4-varre{position:absolute;inset:-20% -60%;pointer-events:none;background:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.7) 50%,transparent 58%);translate:-60% 0;animation:m4-varre 4.6s ease-in-out infinite}
@keyframes m4-varre{0%,55%{translate:-60% 0}100%{translate:60% 0}}
.m4-meta .m4-lema{background:#07120b;color:#f2c94c}

/* entrada: a figurinha vem de cima, torta e maior, acelera e para de uma vez no lugar, como quem bate o cromo na página
   (classe "colada", posta pelo m4.js); ela já aparece inteira no começo do caminho */
.m4.anim .m4-f:not(.colada) .m4-fig{opacity:0}
.m4.anim .m4-f.colada .m4-fig{animation:m4-cola .4s cubic-bezier(.6,0,.9,.35) backwards,m4-surge .14s ease-out backwards;animation-delay:calc(var(--k,0)*80ms)}
@keyframes m4-cola{from{translate:0 -54px;rotate:calc(var(--r)*-5);scale:1.2}}
@keyframes m4-surge{from{opacity:0}}

/* da largura de duas figurinhas para cima: as duas ativações lado a lado e, embaixo, a meta a que elas levam, de ponta a ponta */
@container rm (min-width:560px){
  .m4-album{grid-template-columns:repeat(2,minmax(0,1fr))}
  .m4-meta{grid-column:span 2}
}
@media (prefers-reduced-motion:reduce){
  .m4-fig{transition:none}
}
@media (prefers-reduced-motion:reduce){
  .rm *,.rm *::before,.rm *::after{animation:none!important}
}