/* Cores, fontes e formas extraídas das referências de cada tema. */
:root,[data-tema=caderno]{--fundo:#fdfcf4;--papel:#fff;--texto:#1b2a41;--texto-papel:#1b2a41;--suave:#44546b;--link:#1d4ed8;--link-papel:#1d4ed8;--marca:#1d4ed8;--ac:#1d4ed8;--sobre-ac:#fff;--destaque:#be123c;--nav:#fde047;--borda:0;--raio:0;--raio-p:0;--raio-alt:0;--raio-cel:0;--sombra:4px 6px 0 rgba(29,78,216,.16);--fonte:Nunito,system-ui,sans-serif;--fonte-tit:'Patrick Hand',system-ui,sans-serif;--peso-tit:400;--cel:#e6edf7;--sobre-cel:#1b2a41;--certa:#a7f3d0;--sobre-certa:#0d3b26;--erro:#fecdd3;--sobre-erro:#7f1231;--texto-ok:#15803d;--texto-nao:#be123c;--alt:#fff;--sobre-alt:#1b2a41;--alt-borda:#93c5fd;--conta:#fef9c3;--sobre-conta:#1b2a41}
[data-tema=caderno] body{background-color:#fdfcf4;background-image:linear-gradient(#cfe3f7 1px,transparent 1px),linear-gradient(90deg,#cfe3f7 1px,transparent 1px);background-size:28px 28px}
[data-tema=caderno] .alt{border-style:dashed}
[data-tema=caderno] .menu a:nth-child(2n){background:#a7f3d0;transform:rotate(1deg)}
[data-tema=caderno] .menu a:nth-child(2n+1){transform:rotate(-1.5deg)}
[data-tema=caderno] .item{box-shadow:2px 3px 0 rgba(27,42,65,.14);background:#fde047}
[data-tema=caderno] .grupo:nth-of-type(6n+2) .item{background:#a7f3d0}[data-tema=caderno] .grupo:nth-of-type(6n+3) .item{background:#bfdbfe}[data-tema=caderno] .grupo:nth-of-type(6n+4) .item{background:#fecdd3}[data-tema=caderno] .grupo:nth-of-type(6n+5) .item{background:#ddd6fe}[data-tema=caderno] .grupo:nth-of-type(6n) .item{background:#fed7aa}
[data-tema=caderno] .item.feita{outline:3px solid #16a34a}
[data-tema=caderno] .cartao{position:relative}
[data-tema=caderno] .cartao::before{content:"";position:absolute;top:-12px;left:40%;width:120px;height:26px;background:rgba(253,224,71,.75);transform:rotate(-2deg)}

.tabuleiro{background:#7ed957;border-radius:28px;padding:26px 18px 34px;display:flex;flex-wrap:wrap;gap:16px 10px;justify-content:center;margin-bottom:18px}
.casa{width:68px;height:68px;border-radius:50%;background:#ffe066;color:#123a2c;display:flex;align-items:center;justify-content:center;font-size:26px;font-weight:800;text-decoration:none;border:4px solid #fff;box-shadow:0 6px 0 rgba(18,58,44,.28)}
.casa:nth-child(2n){transform:translateY(10px);background:#a5d8ff}.casa:nth-child(3n){background:#ffa8a8}.casa:nth-child(5n){background:#d0bfff}
.casa.feita{background:#40c057;color:#fff}.casa.andamento{outline:4px solid #d9480f}.casa.breve{background:#d8efcb;color:#3c6450;opacity:1}

[data-tema=figurinhas]{--fundo:#e9e3ff;--papel:#fff;--texto:#2b2150;--texto-papel:#2b2150;--suave:#4a3d7a;--link:#4c2fb8;--link-papel:#4c2fb8;--marca:#4c2fb8;--ac:#4c2fb8;--sobre-ac:#fff;--destaque:#c02560;--nav:#ff8fb1;--borda:0;--raio:28px;--raio-p:999px;--raio-alt:999px;--raio-cel:8px;--sombra:none;--fonte:Fredoka,system-ui,sans-serif;--fonte-tit:Fredoka,system-ui,sans-serif;--peso-tit:700;--cel:#efeaff;--sobre-cel:#2b2150;--certa:#b2f7a0;--sobre-certa:#123d0c;--erro:#ffc2d4;--sobre-erro:#7a0f39;--texto-ok:#1d7a2c;--texto-nao:#c02560;--alt:#efeaff;--sobre-alt:#2b2150;--alt-borda:#efeaff;--conta:#f4f0ff;--sobre-conta:#2b2150}
[data-tema=figurinhas] .cartoes{grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:14px}
[data-tema=figurinhas] .item{aspect-ratio:1/1;border-radius:20px;background:#f7f4ff;border:2px dashed #6d5fb0;text-align:center;justify-items:center;align-content:center;padding:8px;font-size:12.5px;font-weight:600}
[data-tema=figurinhas] .item.feita{background:#ffd166;border:5px solid #fff;box-shadow:0 5px 10px rgba(43,33,80,.25);transform:rotate(-2deg)}
[data-tema=figurinhas] .item.andamento{background:#7bdff2;border:5px solid #fff}

[data-tema=planetas]{--fundo:#17123f;--papel:#2a2270;--texto:#f2f0ff;--texto-papel:#f2f0ff;--suave:#c8c2f5;--link:#ffd86b;--link-papel:#ffd86b;--marca:#f2f0ff;--ac:#ffd86b;--sobre-ac:#17123f;--destaque:#ffd86b;--nav:#2a2270;--borda:0;--raio:26px;--raio-p:14px;--raio-alt:14px;--raio-cel:50%;--sombra:none;--fonte:Outfit,system-ui,sans-serif;--fonte-tit:Outfit,system-ui,sans-serif;--peso-tit:800;--cel:#3b3192;--sobre-cel:#f2f0ff;--certa:#5ee7df;--sobre-certa:#0d2e2c;--erro:#ff7eb6;--sobre-erro:#3d0a22;--texto-ok:#5ee7df;--texto-nao:#ff9ec8;--alt:transparent;--sobre-alt:#f2f0ff;--alt-borda:#8f86d8;--conta:#1f1958;--sobre-conta:#f2f0ff}
[data-tema=planetas] body{background-image:radial-gradient(2px 2px at 10% 12%,#fff,transparent),radial-gradient(1.6px 1.6px at 27% 34%,#fff,transparent),radial-gradient(2px 2px at 48% 8%,#ffd86b,transparent),radial-gradient(2px 2px at 73% 20%,#fff,transparent),radial-gradient(2px 2px at 92% 40%,#fff,transparent),radial-gradient(2px 2px at 6% 60%,#fff,transparent),radial-gradient(2px 2px at 96% 74%,#ffd86b,transparent),radial-gradient(1.6px 1.6px at 40% 88%,#fff,transparent)}
.sistema{position:relative;height:420px;margin-bottom:22px;overflow:hidden}
.sistema svg{position:absolute;inset:0;width:100%;height:100%}
.sistema ellipse{fill:none;stroke:#7d70da;stroke-width:1.5}
.sol{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:104px;height:104px;border-radius:50%;background:#ffd86b;color:#17123f;display:flex;align-items:center;justify-content:center;text-align:center;font-weight:800;line-height:1.05;box-shadow:0 0 0 12px rgba(255,216,107,.18),0 0 0 26px rgba(255,216,107,.08)}
.planeta{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;color:#f2f0ff;text-decoration:none;font-size:14px;font-weight:600;line-height:1.15;white-space:nowrap}
.planeta small{font-size:12px}.planeta.breve{opacity:.8}
.esfera{width:var(--t);height:var(--t);border-radius:50%;background:var(--c);box-shadow:inset -9px -7px 0 rgba(0,0,0,.22);margin-bottom:4px}
.planeta.anel .esfera{outline:3px solid #ffd86b;outline-offset:5px}
.pl1{--t:38px;--c:#7fd6c2;left:31%;top:42%}.pl2{--t:62px;--c:#ffb86b;left:70%;top:57%}.pl3{--t:44px;--c:#ff7eb6;left:27%;top:17%}.pl4{--t:50px;--c:#5ee7df;left:17%;top:70%}.pl5{--t:38px;--c:#b48cff;left:86%;top:30%}.pl6{--t:56px;--c:#8bd450;left:72%;top:88%}.pl7{--t:40px;--c:#ff9d7e;left:40%;top:88%}.pl8{--t:42px;--c:#7ab8ff;left:67%;top:10%}.pl9{--t:36px;--c:#ffd86b;left:8%;top:40%}.pl10{--t:46px;--c:#e88cff;left:92%;top:62%}
.luas{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px}
.lua{display:flex;gap:10px;align-items:center;min-height:52px;padding:8px 12px;background:#2a2270;color:#f2f0ff;border-radius:999px;text-decoration:none;font-size:14px;line-height:1.15;min-width:0}
.lua b{flex:none;width:32px;height:32px;border-radius:50%;background:#544ab0;display:flex;align-items:center;justify-content:center}
.lua.feita b{background:#ffd86b;color:#17123f}.lua.andamento b{background:#5ee7df;color:#17123f}
@media (max-width:640px){.sistema{height:470px}.sol{width:78px;height:78px;font-size:12px}.esfera{transform:scale(.8);margin-bottom:0}.planeta{font-size:13px}.pl1{left:28%;top:40%}.pl2{left:74%;top:60%}.pl3{left:24%;top:14%}.pl4{left:20%;top:66%}.pl5{left:78%;top:36%}.pl6{left:74%;top:88%}.pl7{left:26%;top:90%}.pl8{left:72%;top:12%}}

[data-tema=colagem]{--fundo:#127c7a;--papel:#fff7e6;--texto:#fff;--texto-papel:#1d2b2a;--suave:#e6faf6;--link:#fff7e6;--link-papel:#1d2b2a;--marca:#1d2b2a;--ac:#b92c18;--sobre-ac:#fff;--destaque:#b92c18;--nav:#fff7e6;--texto-nav:#1d2b2a;--borda:0;--raio:0;--raio-p:0;--raio-alt:0;--raio-cel:0;--sombra:6px 8px 0 rgba(0,0,0,.2);--fonte:'Shantell Sans',system-ui,sans-serif;--fonte-tit:'Shantell Sans',system-ui,sans-serif;--peso-tit:800;--cel:#ffd8cc;--sobre-cel:#1d2b2a;--certa:#8fe3a2;--sobre-certa:#0d3319;--erro:#ffb5a3;--sobre-erro:#5e1409;--texto-ok:#116f2c;--texto-nao:#b92c18;--alt:#ffd8cc;--sobre-alt:#1d2b2a;--alt-borda:#ffd8cc;--conta:#bdeee9;--sobre-conta:#1d2b2a}
[data-tema=colagem] .marca{background:#ffb627;padding:10px 20px;transform:rotate(-2deg);clip-path:polygon(0 6%,98% 0,100% 92%,3% 100%)}
[data-tema=colagem] .cartao{transform:rotate(-.4deg)}
[data-tema=colagem] .alt:nth-child(2n){transform:rotate(.5deg)}[data-tema=colagem] .alt:nth-child(2n+1){transform:rotate(-.5deg)}
[data-tema=colagem] .menu a:nth-child(2n){transform:rotate(1deg);background:#ffb627}
[data-tema=colagem] .item{clip-path:polygon(2% 4%,99% 0,97% 97%,0 100%);background:#fff7e6}
[data-tema=colagem] .item:nth-child(2n){transform:rotate(1deg);background:#ffd8cc}[data-tema=colagem] .item:nth-child(3n){transform:rotate(-1deg);background:#bdeee9}
[data-tema=colagem] .item.feita{background:#ffb627}
[data-tema=colagem] .grupo h2{display:inline-block;background:#ffb627;color:#1d2b2a;padding:4px 12px;transform:rotate(-1deg)}
[data-tema=colagem] .item.breve{opacity:.82}

[data-tema=eras]{--fundo:#2a1a3f;--papel:#fdf4ff;--texto:#fdf4ff;--texto-papel:#2a1a3f;--suave:#e9c7ff;--link:#ffd9ec;--link-papel:#8a0f74;--marca:#fdf4ff;--ac:#a3128a;--sobre-ac:#fff;--destaque:#a3128a;--nav:#3d2758;--borda:0;--raio:20px;--raio-p:10px;--raio-alt:12px;--raio-cel:50%;--raio-selo:50%;--sombra:none;--fonte:Figtree,system-ui,sans-serif;--fonte-tit:'DM Serif Display',Georgia,serif;--peso-tit:400;--cel:#f2e3f7;--sobre-cel:#2a1a3f;--certa:#7fd6c2;--sobre-certa:#123d33;--erro:#f7a8d8;--sobre-erro:#5e0d42;--texto-ok:#0f7a63;--texto-nao:#a3128a;--alt:#f2e3f7;--sobre-alt:#2a1a3f;--alt-borda:#f2e3f7;--conta:#f7ecfa;--sobre-conta:#2a1a3f}
.eras{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:10px;margin-bottom:18px}
.era{border-radius:14px;padding:14px;background:var(--e);color:var(--te,#2a1a3f)}.era p{font-size:14px;font-weight:600;margin:0 0 8px}
.era1{--e:#7fd6c2}.era2{--e:#f2c75c}.era3{--e:#9fd3f2}.era4{--e:#f7a8d8}.era5{--e:#d6334c;--te:#fff}.era6{--e:#2f3f8f;--te:#fff}.era7{--e:#d9b3ff}.era8{--e:#d5d8e2}.era9{--e:#f59f5a}.era10{--e:#3fc7c0}
.ingressos{display:flex;flex-wrap:wrap;gap:5px}
.ingresso{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.55);color:#2a1a3f;font-weight:800;text-decoration:none}
.ingresso.feita{background:#2a1a3f;color:#fdf4ff}.ingresso.andamento{outline:3px solid #2a1a3f}.era6 .ingresso.andamento,.era5 .ingresso.andamento{outline-color:#fff}
.pulseira{display:flex;flex-wrap:wrap;gap:5px}
.micanga{width:36px;height:36px;border-radius:50%;background:#e4d3ea;color:#2a1a3f;display:flex;align-items:center;justify-content:center;font-weight:800}
.micanga.on:nth-child(5n+1){background:#f7a8d8}.micanga.on:nth-child(5n+2){background:#f2c75c}.micanga.on:nth-child(5n+3){background:#7fd6c2}.micanga.on:nth-child(5n+4){background:#9fd3f2}.micanga.on:nth-child(5n){background:#d9b3ff}

[data-tema=fliperama]{--fundo:#1a1033;--papel:#2b1c57;--texto:#f3efff;--texto-papel:#f3efff;--suave:#c7bde8;--link:#7dfdd0;--link-papel:#7dfdd0;--marca:#ffd23f;--ac:#7dfdd0;--sobre-ac:#1a1033;--destaque:#ff7ac6;--nav:#2b1c57;--borda:4px solid #7dfdd0;--raio:0;--raio-p:0;--raio-alt:0;--raio-cel:0;--raio-selo:0;--sombra:none;--fonte:Lexend,system-ui,sans-serif;--fonte-tit:Silkscreen,monospace;--peso-tit:700;--cel:#3d2c70;--sobre-cel:#f3efff;--certa:#7dfdd0;--sobre-certa:#1a1033;--erro:#ff7ac6;--sobre-erro:#1a1033;--texto-ok:#7dfdd0;--texto-nao:#ff9ed5;--alt:#1a1033;--sobre-alt:#f3efff;--alt-borda:#8d7cd0;--conta:#1a1033;--sobre-conta:#f3efff}
[data-tema=fliperama] body{font-weight:400}
.hud{display:flex;flex-wrap:wrap;gap:6px 18px;font-family:var(--fonte-tit);font-size:18px}
[data-tema=fliperama] .hud b{color:#7dfdd0}[data-tema=fliperama] .hud .hud-b{color:#ff7ac6}
.xp{display:flex;gap:3px;margin-bottom:18px}.xp i{flex:1 1 0;height:18px;background:#3d2c70}.xp i.on{background:#7dfdd0}
.fases{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:8px}
.fase{height:64px;display:flex;align-items:center;justify-content:center;background:#2b1c57;border:3px solid #8d7cd0;color:#f3efff;font-family:var(--fonte-tit);font-size:18px;text-decoration:none}
.fase.feita{background:#ffd23f;border-color:#ffd23f;color:#1a1033}.fase.andamento{border-color:#7dfdd0}

[data-tema=plataforma]{--fundo:#5c94fc;--papel:#fff8e3;--texto:#111;--texto-papel:#1c1c1c;--suave:#111;--link:#111;--link-papel:#7c2d0c;--marca:#fff;--ac:#1c1c1c;--sobre-ac:#fff8e3;--destaque:#a43c08;--nav:#f8d878;--texto-nav:#1c1c1c;--borda:5px solid #1c1c1c;--raio:0;--raio-p:0;--raio-alt:0;--raio-cel:0;--raio-selo:50%;--sombra:none;--fonte:Lexend,system-ui,sans-serif;--fonte-tit:'Pixelify Sans',monospace;--peso-tit:700;--cel:#f8d878;--sobre-cel:#1c1c1c;--certa:#3cbc3c;--sobre-certa:#0d2b0d;--erro:#f08a6a;--sobre-erro:#3d1003;--texto-ok:#177a17;--texto-nao:#a43c08;--alt:#f8d878;--sobre-alt:#1c1c1c;--alt-borda:#1c1c1c;--conta:#fdeebd;--sobre-conta:#1c1c1c}
[data-tema=plataforma] body{font-weight:400}
[data-tema=plataforma] .marca{text-shadow:3px 3px 0 #1c1c1c}
[data-tema=plataforma] .hud{color:#fff;text-shadow:2px 2px 0 #1c1c1c;font-size:20px}
[data-tema=plataforma] .abertura h1{color:#fff;text-shadow:3px 3px 0 #1c1c1c}[data-tema=plataforma] .lema{font-weight:600}
[data-tema=plataforma] .deco{display:block;position:absolute;inset:0 0 auto 0;height:140px;overflow:hidden}
[data-tema=plataforma] .deco span{position:absolute;background:#fff;border-radius:20px;height:36px;width:120px;top:64px;left:6%;opacity:.9}
[data-tema=plataforma] .deco span:nth-child(2){left:68%;width:150px;top:40px}[data-tema=plataforma] .deco span:nth-child(3){left:38%;width:90px;top:96px}
[data-tema=plataforma] .chao{display:block;height:74px;background-color:#c84c0c;background-image:linear-gradient(#1c1c1c 3px,transparent 3px),linear-gradient(90deg,#1c1c1c 3px,transparent 3px);background-size:37px 37px;border-top:5px solid #1c1c1c}
[data-tema=plataforma] .alt{box-shadow:inset -4px -4px 0 rgba(0,0,0,.2);border-width:4px}
.blocos-mundo{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:18px}
.bloco-q{width:66px;height:66px;background:#e8a050;color:#1c1c1c;border:4px solid #1c1c1c;box-shadow:inset -5px -5px 0 rgba(0,0,0,.25),inset 5px 5px 0 rgba(255,255,255,.4);display:flex;align-items:center;justify-content:center;font-family:var(--fonte-tit);font-size:32px;font-weight:700;text-decoration:none}
.bloco-q.andamento{background:#f8b800}.bloco-q.feita{background:#3cbc3c}.bloco-q.breve{background:#c9b08f}

[data-tema=arena]{--fundo:#091428;--papel:#0f2240;--texto:#f0e6d2;--texto-papel:#f0e6d2;--suave:#cdbf9f;--link:#f0e6d2;--link-papel:#0ac8b9;--marca:#e9d8a6;--ac:#0ac8b9;--sobre-ac:#091428;--destaque:#0ac8b9;--nav:#0f2240;--borda:2px solid #c8aa6e;--raio:0;--raio-p:0;--raio-alt:0;--raio-cel:0;--raio-selo:0;--sombra:none;--fonte:Mulish,system-ui,sans-serif;--fonte-tit:Cinzel,Georgia,serif;--peso-tit:800;--cel:#1e3560;--sobre-cel:#f0e6d2;--certa:#0ac8b9;--sobre-certa:#091428;--erro:#b55a4e;--sobre-erro:#fff;--texto-ok:#0ac8b9;--texto-nao:#f09a8c;--alt:#091428;--sobre-alt:#f0e6d2;--alt-borda:#785a28;--conta:#091428;--sobre-conta:#f0e6d2}
[data-tema=arena] .topo{box-shadow:0 2px 0 #c8aa6e}
[data-tema=arena] .menu a{background:none;border-bottom:2px solid transparent}
.elo{display:flex;gap:14px;align-items:center;background:#0f2240;border:2px solid #785a28;padding:12px 16px;min-width:0;flex:1 1 280px;max-width:380px}
.elo svg{flex:none;width:60px}.elo>div{flex:1;line-height:1.25;min-width:0}.elo b{display:block;font-family:Cinzel,serif;font-size:21px}.elo small{color:#cdbf9f}
.medidor{height:12px;background:#1e3560;border:1px solid #785a28;margin-top:4px}.medidor i{display:block;height:100%;background:#0ac8b9}
.rotas{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px}
.rota{background:#0f2240;border:2px solid #785a28;padding:16px;min-width:0}.rota h2{color:#e9d8a6;font-size:19px}
.linha-rota{display:flex;justify-content:space-between;gap:10px;padding:8px 0;min-height:44px;text-decoration:none;color:#f0e6d2;border-top:1px solid #1e3560;font-size:15px;line-height:1.25}
.linha-rota b{flex:none;color:#e9d8a6}.linha-rota.feita b{color:#0ac8b9}

[data-tema=tatica]{--fundo:#141a20;--papel:#1d252d;--texto:#e8edf2;--texto-papel:#e8edf2;--suave:#b8c2cc;--link:#e8edf2;--link-papel:#ffb54a;--marca:#e8edf2;--ac:#ffb54a;--sobre-ac:#141a20;--destaque:#ffb54a;--nav:#1d252d;--borda:0;--raio:0;--raio-p:0;--raio-alt:0;--raio-cel:0;--raio-selo:0;--sombra:none;--fonte:Barlow,system-ui,sans-serif;--fonte-tit:Rajdhani,sans-serif;--peso-tit:700;--cel:#2a333c;--sobre-cel:#e8edf2;--certa:#6fc2ff;--sobre-certa:#0c2233;--erro:#ffb54a;--sobre-erro:#2e1c04;--texto-ok:#7fdc9a;--texto-nao:#ffb54a;--alt:#2a333c;--sobre-alt:#e8edf2;--alt-borda:#2a333c;--conta:#141a20;--sobre-conta:#e8edf2}
[data-tema=tatica] body{font-weight:400}
[data-tema=tatica] .questao{border-top:4px solid #ffb54a}
.placar{display:flex;flex-wrap:wrap;gap:4px;flex:1 1 320px;font-family:Rajdhani,sans-serif;font-weight:700;margin-bottom:14px;max-width:640px}
.placar>div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 14px}.placar b{font-size:30px;line-height:1}
.pl-a{flex:1 1 120px;background:#233a52}.pl-a b{color:#6fc2ff}.pl-b{flex:1 1 120px;background:#4a3219}.pl-b b{color:#ffb54a}.pl-c{flex:0 1 96px;background:#0b0f13;flex-direction:column;gap:0!important;text-align:center}.pl-c small{font-size:13px;color:#b8c2cc}
.mapas{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:6px}
.mapa{display:grid;grid-template-columns:1fr auto;gap:4px 10px;padding:10px 12px;min-height:58px;background:#1d252d;color:#e8edf2;text-decoration:none;line-height:1.2;font-size:15px}
.mapa i{grid-column:1/-1;grid-row:2;height:6px;background:linear-gradient(90deg,#6fc2ff var(--p),#2a333c var(--p))}.mapa b{font-family:Rajdhani,sans-serif}.mapa.feita{border-left:4px solid #ffb54a}

[data-tema=rosa]{--fundo:#ffd6ec;--papel:#fff;--texto:#5c0a3f;--texto-papel:#5c0a3f;--suave:#7f1a5c;--link:#a30f6b;--link-papel:#a30f6b;--marca:#fff;--ac:#c2187f;--sobre-ac:#fff;--destaque:#c2187f;--nav:#fff;--texto-nav:#a30f6b;--borda:4px solid #ff8cc8;--raio:28px;--raio-p:999px;--raio-alt:999px;--raio-cel:50%;--sombra:none;--fonte:Quicksand,system-ui,sans-serif;--fonte-tit:Quicksand,system-ui,sans-serif;--peso-tit:700;--cel:#ffe3f2;--sobre-cel:#5c0a3f;--certa:#ff2fa4;--sobre-certa:#2e0420;--erro:#d9b7ca;--sobre-erro:#3f1230;--texto-ok:#c2187f;--texto-nao:#7a4a68;--alt:#ffe3f2;--sobre-alt:#5c0a3f;--alt-borda:#ffe3f2;--conta:#fff0f8;--sobre-conta:#5c0a3f}
[data-tema=rosa] .topo{background:#ff2fa4;border-radius:28px;padding:14px 22px}
[data-tema=rosa] .marca{color:#2e0420}
[data-tema=rosa] .alt{border-radius:26px}
[data-tema=rosa] .item{border-radius:24px;background:#fff0f8;border:3px solid #ff8cc8;text-align:center;justify-items:center}
[data-tema=rosa] .item.feita{background:#ff2fa4;border-color:#ff2fa4;color:#2e0420}
[data-tema=rosa] .item.andamento{background:#ffe3f2;border-color:#c76bff}
[data-tema=rosa] .marca-selo{clip-path:polygon(50% 0,63% 37%,100% 50%,63% 63%,50% 100%,37% 63%,0 50%,37% 37%);border-radius:0;width:64px;height:64px}

.cor1{--cor:var(--c1)}.cor2{--cor:var(--c2)}.cor3{--cor:var(--c3)}.cor4{--cor:var(--c4)}.cor5{--cor:var(--c5)}.cor6{--cor:var(--c6)}.cor7{--cor:var(--c7)}.cor8{--cor:var(--c8)}.cor9{--cor:var(--c9)}.cor10{--cor:var(--c10)}
.faixa-cor h2{border-left:8px solid #33333f;padding-left:10px}.faixa-cor.acesa h2{border-color:var(--cor)}
.tijolos{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:6px}
.tijolo{display:grid;gap:2px;background:#14141c;color:#f3f3f7;border:2px solid #55556a;padding:10px;min-height:76px;text-decoration:none;line-height:1.12;font-size:15px;min-width:0}
.tijolo b{font-size:19px}.tijolo.andamento{border-color:#ffe14d}
.tijolo.feita{background:var(--cor);border-color:var(--cor);color:#08080c}

/* Temas limpos: sem decoração, um único tom de destaque, progresso em barra. */
[data-tema=clear]{--fundo:#fff;--papel:#fff;--texto:#1a1d21;--texto-papel:#1a1d21;--suave:#555c66;--link:#1f5fa8;--link-papel:#1f5fa8;--marca:#1a1d21;--ac:#1f5fa8;--sobre-ac:#fff;--destaque:#1f5fa8;--nav:transparent;--borda:1px solid #d5d9df;--raio:8px;--raio-p:6px;--raio-alt:6px;--raio-cel:4px;--raio-selo:6px;--sombra:none;--fonte:Figtree,system-ui,sans-serif;--fonte-tit:Figtree,system-ui,sans-serif;--peso-tit:600;--cel:#eef0f3;--sobre-cel:#1a1d21;--certa:#1f5fa8;--sobre-certa:#fff;--erro:#dfe2e7;--sobre-erro:#1a1d21;--texto-ok:#1f5fa8;--texto-nao:#1a1d21;--alt:#fff;--sobre-alt:#1a1d21;--alt-borda:#8a93a0;--conta:#f4f5f7;--sobre-conta:#1a1d21;--trilho:#e4e7eb}
[data-tema=clean_escuro]{--fundo:#16181c;--papel:#1e2126;--texto:#e8eaed;--texto-papel:#e8eaed;--suave:#a9b0ba;--link:#7db4ee;--link-papel:#7db4ee;--marca:#e8eaed;--ac:#7db4ee;--sobre-ac:#10151b;--destaque:#7db4ee;--nav:transparent;--borda:1px solid #3a3f47;--raio:8px;--raio-p:6px;--raio-alt:6px;--raio-cel:4px;--raio-selo:6px;--sombra:none;--fonte:Figtree,system-ui,sans-serif;--fonte-tit:Figtree,system-ui,sans-serif;--peso-tit:600;--cel:#2b2f36;--sobre-cel:#e8eaed;--certa:#7db4ee;--sobre-certa:#10151b;--erro:#3a3f47;--sobre-erro:#e8eaed;--texto-ok:#7db4ee;--texto-nao:#e8eaed;--alt:#16181c;--sobre-alt:#e8eaed;--alt-borda:#6b7280;--conta:#16181c;--sobre-conta:#e8eaed;--trilho:#3a3f47;color-scheme:dark}
[data-tema=clear] body,[data-tema=clean_escuro] body{font-weight:400}
.barra{height:6px;background:var(--trilho);border-radius:3px;overflow:hidden}.barra i{display:block;height:100%;background:var(--ac)}
.barra-geral{flex:0 1 280px;min-width:180px;font-size:15px;color:var(--suave)}
.linhas{display:grid;gap:2px}
.linha{display:grid;grid-template-columns:1fr auto;gap:2px 12px;padding:8px 0;min-height:44px;text-decoration:none;color:var(--texto);min-width:0}
.linha small{color:var(--suave);font-size:14px}.linha .barra{grid-column:1/-1}


/* Jornada do Treinador: rotas, encontros e 8 insígnias, sem marcas de terceiros. */

/* Login: amostras reais dos temas ao fundo. Cada cartão recebe as cores do próprio tema. */
.vitrine{position:fixed;inset:-60px;z-index:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));grid-auto-rows:150px;gap:14px;padding:14px;overflow:hidden;transform:rotate(-4deg) scale(1.08);pointer-events:none;background:#101722}
.amostra{background:var(--fundo);color:var(--texto);font-family:var(--fonte);border-radius:14px;padding:12px 14px;display:flex;flex-direction:column;gap:6px;min-width:0;overflow:hidden;font-style:normal}
.amostra b{font-family:var(--fonte-tit);font-size:18px;line-height:1.1}
.amostra p{margin:0;font-size:14px}
.amostra div{display:flex;gap:5px;margin-top:auto}
.amostra div span{flex:1;text-align:center;padding:5px 2px;font-size:13px;background:var(--papel);color:var(--texto-papel);border-radius:8px}
.amostra div span.ok{background:var(--certa);color:var(--sobre-certa);font-weight:700}
body:has(.vitrine){background:#101722}
body:has(.vitrine) .pagina{position:relative;z-index:1}
body:has(.vitrine) .deco{display:none}
body:has(.vitrine) .topo{background:var(--papel);border-radius:12px;padding:8px 14px;width:fit-content;max-width:100%;box-shadow:0 8px 26px rgba(0,0,0,.4)}
body:has(.vitrine) .marca{color:var(--texto-papel)}
.cartao-entrar{position:relative;z-index:1;box-shadow:0 18px 50px rgba(0,0,0,.5)}
.chamada{margin:-4px 0 14px;color:var(--suave)}


/* Jogo de plataforma: mundos com blocos, canos, moedas, colinas e bandeira. */
[data-tema=plataforma] body{background-color:#5c94fc;background-image:radial-gradient(ellipse 240px 120px at 12% 100%,#2f9e3f 98%,transparent 100%),radial-gradient(ellipse 340px 170px at 86% 100%,#3cbc3c 98%,transparent 100%);background-attachment:fixed;background-repeat:no-repeat}
[data-tema=plataforma] .deco span{box-shadow:40px -18px 0 4px #fff,-34px -8px 0 -2px #fff}
.mundos{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(310px,100%),1fr));gap:18px;margin-bottom:18px}
.mundo{position:relative;background:rgba(255,248,227,.94);border:5px solid #1c1c1c;box-shadow:6px 6px 0 #1c1c1c;padding:12px 88px 14px 14px;min-height:150px;min-width:0}
.mundo h2{margin:0 0 10px;font-family:var(--fonte-tit);font-size:24px;color:#a43c08}
.trecho{display:flex;gap:0;align-items:center}
.mundo .bloco-q{width:54px;height:54px;flex:none}
.bloco-q{background:#f8b800;position:relative}.bloco-q.breve{background:#e8c98f}.bloco-q.andamento{background:#ffd23f;outline:3px solid #fff}
.bloco-q::before,.bloco-q::after{content:"";position:absolute;width:6px;height:6px;background:#1c1c1c;top:4px;left:4px}.bloco-q::after{left:auto;right:4px}
.tijolinho{width:20px;height:54px;flex:none;background-color:#c84c0c;background-image:linear-gradient(#1c1c1c 3px,transparent 3px),linear-gradient(90deg,#1c1c1c 3px,transparent 3px);background-size:17px 17px;border:4px solid #1c1c1c;box-sizing:border-box}
.moedas{display:flex;gap:8px;margin-top:10px}
.moeda{display:inline-block;width:20px;height:26px;border-radius:50%;background:#c9b98a;border:3px solid #1c1c1c;box-sizing:border-box;vertical-align:-6px}
.moeda.ganha{background:#f8b800;box-shadow:inset 3px 0 0 #fff0a8}
.hud .moeda{margin-right:6px}
.cano{position:absolute;right:14px;bottom:0;width:56px;height:96px;background:linear-gradient(90deg,#1f8f2d,#5fdc5f 35%,#1f8f2d);border:4px solid #1c1c1c;border-bottom:0;box-sizing:border-box}
.cano::before{content:"";position:absolute;top:-4px;left:-12px;right:-12px;height:26px;background:linear-gradient(90deg,#1f8f2d,#7bea7b 35%,#1f8f2d);border:4px solid #1c1c1c;box-sizing:border-box}
.bandeira{position:absolute;right:10px;top:6px;width:4px;height:44px;background:#1c1c1c}
.bandeira::after{content:"";position:absolute;right:4px;top:2px;border-right:26px solid #e03a1f;border-top:10px solid transparent;border-bottom:10px solid transparent}
@media (prefers-reduced-motion:no-preference){.moeda.ganha{animation:gira-moeda 2.4s linear infinite}@keyframes gira-moeda{0%,70%,100%{transform:scaleX(1)}85%{transform:scaleX(.2)}}}

/* Corrida dos Anéis: velocidade, piso xadrez e anéis dourados. */
[data-tema=velocidade]{--fundo:#1450c8;--papel:#fff;--texto:#fff;--texto-papel:#0f2a55;--suave:#e3ecff;--link:#ffe14d;--link-papel:#1450c8;--marca:#ffe14d;--ac:#0f2a55;--sobre-ac:#fff;--destaque:#a33a00;--nav:#ffd23f;--texto-nav:#0f2a55;--borda:4px solid #0f2a55;--raio:20px;--raio-p:999px;--raio-alt:14px;--raio-cel:14px;--sombra:6px 8px 0 #0a1f4a;--fonte:'Outfit',system-ui,sans-serif;--fonte-tit:'Outfit',system-ui,sans-serif;--peso-tit:800;--cel:#e6efff;--sobre-cel:#0f2a55;--certa:#8fe6a0;--sobre-certa:#0e3320;--erro:#ffb3ad;--sobre-erro:#5c0f0f;--texto-ok:#14733a;--texto-nao:#a33a00;--alt:#eef4ff;--sobre-alt:#0f2a55;--alt-borda:#0f2a55;--conta:#fff4c7;--sobre-conta:#0f2a55}
[data-tema=velocidade] body{background-color:#1450c8;background-image:linear-gradient(115deg,transparent 60%,rgba(255,255,255,.07) 60% 66%,transparent 66%),linear-gradient(115deg,transparent 30%,rgba(255,255,255,.06) 30% 34%,transparent 34%);background-attachment:fixed}
[data-tema=velocidade] .chao{display:block;height:64px;background-color:#8a4a12;background-image:conic-gradient(#c9792a 25%,#8a4a12 0 50%,#c9792a 0 75%,#8a4a12 0);background-size:64px 64px;border-top:10px solid #3cbc3c}
[data-tema=velocidade] .hud{display:flex;flex-wrap:wrap;gap:6px 20px;font-weight:800;color:#fff;font-size:20px}[data-tema=velocidade] .hud b{color:#ffe14d}
.anel-hud{display:inline-block;width:20px;height:20px;border:5px solid #ffd23f;border-radius:50%;box-sizing:border-box;margin-right:6px;vertical-align:-4px}
.zona{background:#0f2a55;border-radius:20px 20px 0 0;border-bottom:12px solid #3cbc3c;padding:14px;margin-bottom:16px}
.zona h2{margin:0 0 10px;font-weight:800;color:#ffe14d;display:flex;align-items:baseline;gap:10px}.zona h2 small{font-size:15px;color:#e3ecff;font-weight:400}
.atos{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px}
.ato{position:relative;display:grid;gap:2px;background:#fff;color:#0f2a55;border-radius:14px;padding:10px 12px 10px 56px;min-height:74px;text-decoration:none;line-height:1.15;min-width:0}
.ato b{position:absolute;left:10px;top:18px;width:38px;height:38px;border:6px solid #ffd23f;border-radius:50%;box-sizing:border-box;display:flex;align-items:center;justify-content:center;font-size:15px}
.ato small{color:#33476b}.ato.feita{background:#ffe9a3}.ato.andamento{outline:3px solid #ffd23f}.ato.breve{background:#c9d5ea}
@media (max-width:380px){.tijolinho{display:none}.mundo{padding-right:80px}}

.migalha{margin:0 0 2px;font-weight:700}
.materia{margin:18px 0 8px;color:var(--texto)}
.frentes{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(220px,100%),1fr));gap:12px}
.frente{display:grid;gap:6px;text-decoration:none;color:var(--texto-papel);min-width:0}
.frente b{font-size:20px}.frente.breve{opacity:.75}
.barra{display:block;height:10px;background:var(--cel);border-radius:999px;overflow:hidden}.barra i{display:block;height:100%;background:var(--ac)}

/* Controles no mesmo lugar em todos os temas: tamanho fixo, a fonte e as cores continuam do tema. */
html[data-tema] .topo{position:relative;z-index:40;border:0;display:grid;grid-template-columns:200px minmax(0,1fr);align-items:center;gap:10px 14px;box-sizing:border-box;height:80px;margin:0 0 20px;padding:8px 12px;transform:none}
html[data-tema] .marca{display:flex;align-items:center;width:200px;height:48px;overflow:hidden;font-size:20px!important;line-height:24px;letter-spacing:0;transform:none}
html[data-tema] .menu{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;width:min(100%,660px);justify-self:end}
html[data-tema] .menu>a,html[data-tema] .menu .seletor>summary{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100%;height:48px;min-height:0;margin:0;padding:2px 6px;overflow:hidden;font-size:14px!important;line-height:1.1;letter-spacing:0;text-align:center;transform:none!important}
html[data-tema] .botao{box-sizing:border-box;min-height:48px;transform:none}

html[data-tema] .seletor{position:relative;min-width:0}
html[data-tema] .seletor button{min-height:40px;padding:6px 10px;border:0;font-size:15px;line-height:1.15;border-radius:6px}
html[data-tema] .botao{width:200px;max-width:100%;padding-left:8px;padding-right:8px;justify-content:center;text-align:center}
html[data-tema] .botao.continuar{width:260px}
html[data-tema] .abertura:has(+ .continuar){min-height:112px;align-items:flex-start}
html[data-tema] .cartao{border-width:3px;box-sizing:border-box}
html[data-tema] .questao{padding:24px}
html[data-tema] .alt{box-sizing:border-box;min-height:52px;width:100%;margin-left:0;margin-right:0;border-width:2px}
html[data-tema] .hud{min-height:32px;box-sizing:border-box}
html[data-tema] .botao.continuar{margin-bottom:14px}

/* Setinha do menu da conta: mesmo lugar e tamanho, com o desenho de cada tema. */
.nome-conta{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.seta{flex:none;width:13px;height:10px;margin-left:6px;background:var(--cor-seta,currentColor);clip-path:var(--seta,polygon(0 0,100% 0,50% 100%));transition:transform .15s}
.seletor[open] .seta{transform:rotate(180deg)}
[data-tema=caderno]{--seta:polygon(0 12%,52% 62%,100% 6%,100% 40%,50% 100%,4% 46%);--cor-seta:#e0467c}
[data-tema=figurinhas]{--seta:polygon(0 0,100% 0,78% 34%,50% 100%,22% 34%)}
[data-tema=planetas]{--seta:circle(50% at 50% 50%);--cor-seta:#ffb347}
[data-tema=colagem]{--seta:polygon(0 8%,100% 0,62% 100%,44% 82%,30% 90%)}
[data-tema=eras]{--seta:circle(50% at 50% 50%);--cor-seta:conic-gradient(#ff7eb6,#ffd166,#4cc9f0,#a06cd5,#ff7eb6)}
[data-tema=fliperama],[data-tema=plataforma]{--seta:polygon(0 0,100% 0,100% 25%,76% 25%,76% 50%,62% 50%,62% 100%,38% 100%,38% 50%,24% 50%,24% 25%,0 25%)}
[data-tema=plataforma]{--cor-seta:#f8b800}
[data-tema=fliperama]{--cor-seta:#7dfdd0}
[data-tema=arena]{--seta:polygon(50% 100%,0 34%,18% 0,50% 42%,82% 0,100% 34%);--cor-seta:#c8aa6e}
[data-tema=tatica]{--seta:polygon(0 0,50% 58%,100% 0,100% 40%,50% 100%,0 40%);--cor-seta:#ffb627}
[data-tema=rosa]{--seta:polygon(50% 100%,0 34%,14% 0,50% 22%,86% 0,100% 34%);--cor-seta:#ff2fa4}
[data-tema=velocidade]{--seta:polygon(0 0,50% 34%,100% 0,100% 30%,50% 64%,0 30%,0 36%,50% 70%,100% 36%,100% 66%,50% 100%,0 66%);--cor-seta:#ffe14d}
[data-tema=clear],[data-tema=clean_escuro]{--seta:polygon(0 12%,12% 0,50% 62%,88% 0,100% 12%,50% 100%)}

/* Menu da conta: três blocos separados por uma linha, itens iguais e tema marcado com um visto. */
html[data-tema] .painel-conta{display:block;padding:0;overflow:hidden;gap:0;max-height:none}
.secao-conta{padding:6px;border-top:1px solid color-mix(in srgb,var(--texto-papel) 22%,transparent)}
.secao-conta:first-child{border-top:0}
html[data-tema] .secao-conta h2{margin:4px 10px 6px;padding:0;font-family:var(--fonte);font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;opacity:.7}
html[data-tema] .seletor[open] .form-tema{display:block;max-height:min(46vh,300px);overflow-y:auto}
html[data-tema] .painel-conta .item-conta{display:flex;align-items:center;width:100%;min-height:38px;padding:6px 10px 6px 30px;position:relative;background:none;color:var(--texto-papel);border:0;border-radius:6px;font-family:var(--fonte);font-size:15px;font-weight:400;line-height:1.2;text-align:left;text-decoration:none;cursor:pointer}
html[data-tema] .painel-conta .item-conta:hover,html[data-tema] .painel-conta .item-conta:focus-visible{background:color-mix(in srgb,var(--texto-papel) 12%,transparent)}
html[data-tema] .painel-conta .item-conta[aria-current]{font-weight:700}
.painel-conta .item-conta[aria-current]::before{content:"";position:absolute;left:11px;top:50%;width:10px;height:5px;margin-top:-5px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg)}

/* Barra de comentários do administrador. */
.barra-comentario{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;gap:8px;align-items:flex-end;padding:8px 16px;background:#14171c;color:#f1f3f6;font-family:system-ui,sans-serif;font-size:13px;box-shadow:0 -4px 16px rgba(0,0,0,.25)}
.barra-comentario label{flex:1;display:grid;gap:3px;min-width:0}
.barra-comentario textarea{box-sizing:border-box;width:100%;min-height:38px;max-height:30vh;padding:8px;font:15px/1.3 system-ui,sans-serif;color:#111;background:#fff;border:0;border-radius:6px;resize:vertical}
html[data-tema] .barra-comentario .botao{width:110px;min-height:38px;margin:0;font:700 14px system-ui,sans-serif;color:#111;background:#ffd23f;border:0;border-radius:6px;box-shadow:none}
.comentario-ok{display:none;position:absolute;right:16px;bottom:100%;margin-bottom:6px;padding:6px 10px;background:#17854a;color:#fff;border-radius:6px}
.comentario-ok:target{display:block}
body:has(.barra-comentario){padding-bottom:84px}

/* Jogo de plataforma: mais elementos do jogo. */
[data-tema=plataforma] .pagina,[data-tema=velocidade] .pagina{padding-bottom:150px}
[data-tema=plataforma] .topo{background:#c84c0c linear-gradient(#1c1c1c 3px,transparent 3px) 0 0/34px 17px;background-image:linear-gradient(#1c1c1c 3px,transparent 3px),linear-gradient(90deg,#1c1c1c 3px,transparent 3px);background-size:17px 17px;box-shadow:0 5px 0 #1c1c1c}
[data-tema=plataforma] .menu>a{background:#f8b800;color:#1c1c1c;box-shadow:inset -4px -4px 0 rgba(0,0,0,.25),inset 4px 4px 0 rgba(255,255,255,.45)}
[data-tema=plataforma] .menu .seletor>summary{background:#3cbc3c;color:#10310f;box-shadow:inset -4px -4px 0 rgba(0,0,0,.25),inset 4px 4px 0 rgba(255,255,255,.45)}
[data-tema=plataforma] .marca{background:#1c1c1c;padding:0 10px;box-sizing:border-box}
[data-tema=plataforma] .cartao{background-color:#fff8e3;background-image:repeating-linear-gradient(90deg,#c84c0c 0 30px,#1c1c1c 30px 33px,#f8b800 33px 63px,#1c1c1c 63px 66px);background-size:100% 12px;background-repeat:no-repeat}
[data-tema=plataforma] .alt{background:#fff0c2;border-color:#1c1c1c}
[data-tema=plataforma] .alt:hover{background:#ffd23f;box-shadow:inset -4px -4px 0 rgba(0,0,0,.2),0 -4px 0 #1c1c1c}
[data-tema=plataforma] .alt b{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;background:#f8b800;box-shadow:inset -3px -3px 0 rgba(0,0,0,.25)}
[data-tema=plataforma] .botao{background:linear-gradient(90deg,#1f8f2d,#5fdc5f 35%,#1f8f2d);color:#fff;border:4px solid #1c1c1c;border-radius:0;text-shadow:2px 2px 0 #1c1c1c}
[data-tema=plataforma] .cel{background:#c84c0c;color:#fff;border-radius:0;box-shadow:inset -3px -3px 0 rgba(0,0,0,.3)}
[data-tema=plataforma] .cel.certa{background:#f8b800;color:#1c1c1c}
[data-tema=plataforma] .cel.errada{background:#6b6b6b;color:#fff}
[data-tema=plataforma] .barra{height:14px;border:3px solid #1c1c1c;border-radius:0;box-sizing:border-box}
[data-tema=plataforma] .barra i{background:repeating-linear-gradient(90deg,#f8b800 0 12px,#c98a00 12px 14px)}
[data-tema=plataforma] .frente,[data-tema=plataforma] .item{border:4px solid #1c1c1c;box-shadow:5px 5px 0 #1c1c1c}
.chao{position:relative}.chao span{display:none}
[data-tema=plataforma] .chao span,[data-tema=velocidade] .chao span{display:block;position:absolute;bottom:100%}
[data-tema=plataforma] .chao span:nth-child(1){left:3%;width:64px;height:92px;background:linear-gradient(90deg,#1f8f2d,#5fdc5f 35%,#1f8f2d);border:4px solid #1c1c1c;border-bottom:0;box-sizing:border-box;box-shadow:0 0 0 0 #000}
[data-tema=plataforma] .chao span:nth-child(1)::before{content:"";position:absolute;left:-12px;right:-12px;top:-4px;height:26px;background:linear-gradient(90deg,#1f8f2d,#7bea7b 35%,#1f8f2d);border:4px solid #1c1c1c;box-sizing:border-box}
[data-tema=plataforma] .chao span:nth-child(2){left:16%;width:150px;height:38px;background:radial-gradient(circle at 18% 100%,#2f9e3f 34px,transparent 35px),radial-gradient(circle at 50% 100%,#3cbc3c 38px,transparent 39px),radial-gradient(circle at 82% 100%,#2f9e3f 34px,transparent 35px)}
[data-tema=plataforma] .chao span:nth-child(3){left:40%;width:46px;height:44px;background:radial-gradient(circle at 30% 26%,#fff 6px,transparent 7px),radial-gradient(circle at 70% 26%,#fff 6px,transparent 7px),radial-gradient(ellipse 23px 22px at 50% 44%,#e03a1f 98%,transparent 100%),linear-gradient(transparent 55%,#ffe0b0 55%);background-repeat:no-repeat}
[data-tema=plataforma] .chao span:nth-child(4){left:50%;width:40px;height:40px;bottom:calc(100% + 90px);background:#f8b800;border:4px solid #1c1c1c;box-sizing:border-box;box-shadow:inset -4px -4px 0 rgba(0,0,0,.25),44px 0 0 -2px #c84c0c,88px 0 0 -2px #f8b800}
[data-tema=plataforma] .chao span:nth-child(4)::after{content:"?";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--fonte-tit);color:#1c1c1c;font-size:20px}
[data-tema=plataforma] .chao span:nth-child(5){right:18%;width:6px;height:150px;background:#3cbc3c}
[data-tema=plataforma] .chao span:nth-child(5)::before{content:"";position:absolute;left:6px;top:8px;border-left:34px solid #fff;border-top:14px solid transparent;border-bottom:14px solid transparent}
[data-tema=plataforma] .chao span:nth-child(5)::after{content:"";position:absolute;left:-6px;top:-12px;width:18px;height:18px;border-radius:50%;background:#f8b800}
[data-tema=plataforma] .chao span:nth-child(6){right:3%;width:130px;height:110px;background-color:#c84c0c;background-image:linear-gradient(#1c1c1c 2px,transparent 2px),linear-gradient(90deg,#1c1c1c 2px,transparent 2px);background-size:15px 15px;clip-path:polygon(0 100%,0 0,14% 0,14% 12%,28% 12%,28% 0,42% 0,42% 12%,58% 12%,58% 0,72% 0,72% 12%,86% 12%,86% 0,100% 0,100% 100%,62% 100%,62% 60%,38% 60%,38% 100%)}

/* Corrida dos Anéis: mais elementos do jogo. */
[data-tema=velocidade] .topo{background:#0f2a55;border-radius:999px;box-shadow:0 6px 0 #3cbc3c,0 12px 0 #8a4a12}
[data-tema=velocidade] .marca{color:#ffe14d;font-weight:800}
[data-tema=velocidade] .menu>a{background:#ffd23f;color:#0f2a55;border-radius:999px;font-weight:800}
[data-tema=velocidade] .menu .seletor>summary{background:#e0301e;color:#fff;border-radius:999px;font-weight:800}
[data-tema=velocidade] .abertura h1{color:#fff;text-shadow:3px 3px 0 #0a1f4a;font-weight:800}
[data-tema=velocidade] .cartao{background-color:#fff;background-image:conic-gradient(#c9792a 25%,#8a4a12 0 50%,#c9792a 0 75%,#8a4a12 0);background-size:16px 16px;background-repeat:repeat-x;background-position:0 0;border-color:#0f2a55;box-shadow:0 8px 0 #3cbc3c}
[data-tema=velocidade] .alt{border-radius:999px;border-color:#0f2a55;background:#eef4ff}
[data-tema=velocidade] .alt:hover{background:#ffe9a3;box-shadow:-10px 0 0 -4px #1450c8,-20px 0 0 -7px #1450c8}
[data-tema=velocidade] .alt b{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:5px solid #ffd23f;border-radius:50%;box-sizing:border-box;font-size:15px}
[data-tema=velocidade] .botao{background:#e0301e;color:#fff;border:4px solid #0f2a55;border-radius:999px;font-weight:800;box-shadow:0 5px 0 #0f2a55}
[data-tema=velocidade] .cel{background:transparent;color:#0f2a55;border:5px solid #c9d5ea;border-radius:50%;box-sizing:border-box}
[data-tema=velocidade] .cel.certa{background:transparent;border-color:#ffd23f;color:#0f2a55}
[data-tema=velocidade] .cel.errada{background:transparent;border-color:#e0301e;border-style:dashed;color:#a33a00}
[data-tema=velocidade] .barra{height:14px;background:#c9d5ea}
[data-tema=velocidade] .barra i{background:radial-gradient(circle at 7px 7px,transparent 3px,#ffd23f 3.5px 6px,transparent 6.5px) 0 0/14px 14px,#1450c8}
[data-tema=velocidade] .frente,[data-tema=velocidade] .item{border:4px solid #0f2a55;border-radius:18px}
[data-tema=velocidade] .chao span:nth-child(1){left:3%;width:150px;height:150px;border-radius:50%;box-sizing:border-box;border:22px solid #8a4a12;border-top-color:#c9792a;border-left-color:#c9792a;box-shadow:inset 0 0 0 5px #3cbc3c,0 0 0 5px #3cbc3c;bottom:calc(100% - 8px)}
[data-tema=velocidade] .chao span:nth-child(2){left:22%;width:14px;height:110px;background:repeating-linear-gradient(#a8692a 0 12px,#7a4a1c 12px 16px);border-radius:6px}
[data-tema=velocidade] .chao span:nth-child(2)::before{content:"";position:absolute;left:-44px;top:-30px;width:100px;height:44px;background:#2f9e3f;clip-path:polygon(50% 100%,0 40%,20% 60%,25% 0,42% 50%,50% 0,58% 50%,75% 0,80% 60%,100% 40%)}
[data-tema=velocidade] .chao span:nth-child(3){left:38%;width:64px;height:28px;background:linear-gradient(#ffd23f 0 8px,#9aa6b8 8px 12px,#e0301e 12px 18px,#9aa6b8 18px 22px,#e0301e 22px)}
[data-tema=velocidade] .chao span:nth-child(4){left:52%;width:70px;height:70px;bottom:calc(100% + 60px);border-radius:50%;border:12px solid #ffd23f;box-sizing:border-box;box-shadow:inset 0 0 0 2px #fff0a8}
[data-tema=velocidade] .chao span:nth-child(4)::after{content:"";position:absolute;left:70px;top:14px;width:18px;height:18px;border:5px solid #ffd23f;border-radius:50%;box-shadow:32px 0 0 -0px transparent}
[data-tema=velocidade] .chao span:nth-child(5){right:22%;width:72px;height:26px;background:#c9d5ea;clip-path:polygon(0 100%,16% 0,33% 100%,50% 0,67% 100%,84% 0,100% 100%)}
[data-tema=velocidade] .chao span:nth-child(6){right:6%;width:10px;height:110px;background:repeating-linear-gradient(#1450c8 0 14px,#ffd23f 14px 28px)}
[data-tema=velocidade] .chao span:nth-child(6)::after{content:"";position:absolute;left:-9px;top:-22px;width:28px;height:28px;border-radius:50%;background:#e0301e;box-shadow:inset 3px 3px 0 rgba(255,255,255,.5)}
@media (max-width:700px){.chao span:nth-child(2),.chao span:nth-child(4),[data-tema] .chao span:nth-child(5){display:none!important}}

[data-tema=velocidade] .cel,[data-tema=velocidade] .cel.certa,[data-tema=velocidade] .cel.errada{background:#fff;color:#0f2a55}
html[data-tema] .barra-comentario .botao{text-shadow:none}

/* O menu da conta tem o mesmo formato em todos os temas: canto curvo pequeno, para nada ficar fora da borda. */
html[data-tema] .painel-conta{border-radius:12px;box-sizing:border-box}
html[data-tema] .painel-conta .item-conta{border-radius:6px}
.sep-temas{height:1px;margin:4px 10px;border:0;background:color-mix(in srgb,var(--texto-papel) 22%,transparent)}

/* Coração de favorito ao lado do nome do tema. */
.linha-tema{display:grid;grid-template-columns:minmax(0,1fr) 44px;align-items:center}
html[data-tema] .seletor .coracao{display:flex;align-items:center;justify-content:center;width:44px;min-height:38px;padding:0;background:none;border:0;color:#ff4d82;font:20px/1 system-ui,sans-serif;cursor:pointer}
html[data-tema] .seletor .coracao:hover{transform:scale(1.15)}

/* No celular o menu se alinha ao topo da página, para não sair da tela. */

/* Mundo Rosa: texto branco sobre pink mais fechado, para ficar legível. */
[data-tema=rosa] .topo{background:#d6127f}
[data-tema=rosa] .marca{color:#fff}
[data-tema=rosa] .item.feita,[data-tema=rosa] .item.feita small,[data-tema=rosa] .item.feita b{background:#d6127f;border-color:#d6127f;color:#fff}
[data-tema=rosa] .selo.on,[data-tema=rosa] .selo.on *{color:#fff}
[data-tema=rosa] .selo.on{background:#d6127f}


/* ---- Navegação ---- */
.icone{flex:none;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
html[data-tema] .menu>a,html[data-tema] .menu .seletor>summary{gap:6px}
html[data-tema] .menu>a[aria-current]{outline:2px solid currentColor;outline-offset:-4px}
.so-movel{display:none}
.oculto{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}
.barra-questao{display:none}
main p a:not(.botao){display:inline-flex;align-items:center;min-height:44px}
.retomar{display:grid;gap:4px;text-decoration:none;color:var(--texto-papel);margin-bottom:16px}
.retomar small{font-weight:700;color:var(--destaque);font-size:14px}.retomar b{font-size:22px;font-family:var(--fonte-tit)}
.em-breve{color:var(--suave);font-size:15px;margin-top:14px}

/* ---- Modo questão no computador: questões ao lado do enunciado ---- */
.layout-questao{display:grid;grid-template-columns:minmax(0,1fr) 208px;gap:16px;align-items:start}
.lateral{position:sticky;top:12px}
html[data-tema] .fita{display:grid;grid-template-columns:repeat(auto-fill,44px);gap:6px;margin:0 0 10px}
html[data-tema] .cel{width:44px;height:44px;transform:none}
.dica-teclas{font-size:13px;color:var(--suave)}
form:not(:has(input[name=letra]:checked)) .acao-fixa .botao{opacity:.5;pointer-events:none}

/* ---- Blocos que abrem e fecham no mapa ---- */
details.grupo>summary,details.zona>summary{display:flex;align-items:center;gap:10px;min-height:48px;cursor:pointer;list-style:none}
details.grupo>summary::-webkit-details-marker,details.zona>summary::-webkit-details-marker{display:none}
details.grupo>summary h2,details.zona>summary h2{margin:0}
details.grupo>summary small{margin-left:auto;font-weight:700}
details.grupo>summary .seta,details.zona>summary .seta{margin-left:6px}
details.zona>summary .seta{margin-left:auto}
details[open]>summary .seta{transform:rotate(180deg)}

/* ---- Celular e tablet: barra fixa embaixo ---- */
@media (max-width:900px){
  html[data-tema] .topo{grid-template-columns:minmax(0,1fr);height:52px;padding:2px 12px;margin-bottom:14px}
  html[data-tema] .marca{width:100%;height:48px}
  html[data-tema] .menu{position:fixed;left:0;right:0;bottom:0;z-index:45;width:auto;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;padding:0 0 env(safe-area-inset-bottom);background:var(--papel);box-shadow:0 -2px 10px rgba(0,0,0,.2)}
  html[data-tema] .menu>a,html[data-tema] .menu .seletor>summary{flex-direction:column;gap:2px;height:60px;padding:4px 2px;font-size:12px!important;font-weight:700;background:none;color:var(--texto-papel);border:0;border-radius:0;box-shadow:none;text-shadow:none}
  html[data-tema] .menu>a[aria-current]{outline:0;box-shadow:inset 0 3px 0 var(--ac)}
  html[data-tema] .menu .icone{width:22px;height:22px}
  html[data-tema] .menu .seta{display:none}
  .nome-conta{max-width:100%}
  .so-desktop{display:none!important}
  .so-movel{display:block}
  html[data-tema] .seletor{position:static}
  html[data-tema] .seletor[open]::before{content:"";position:fixed;inset:0;background:rgba(0,0,0,.45)}
  html[data-tema] .painel-conta{position:fixed;left:0;right:0;top:auto;bottom:calc(60px + env(safe-area-inset-bottom));width:auto;max-height:76vh;overflow-y:auto;border-radius:16px 16px 0 0;box-shadow:0 -8px 24px rgba(0,0,0,.35)}
  html[data-tema] .seletor[open] .form-tema{max-height:none;overflow:visible}
  html[data-tema] .painel-conta .item-conta{min-height:44px}
  html[data-tema] .seletor .coracao{min-height:44px}
  body{padding-bottom:calc(68px + env(safe-area-inset-bottom))}
  .barra-comentario{bottom:calc(60px + env(safe-area-inset-bottom));padding:6px 10px;align-items:center}
  .sobre-barra{display:none}
  html[data-tema] .barra-comentario .botao{width:84px}
  body:has(.barra-comentario){padding-bottom:124px}

  /* Modo questão: só o essencial na tela */
  .modo-questao .topo,.modo-questao .hud-questao,.modo-questao .sobre,.modo-questao .chao,.modo-questao .deco,.dica-teclas{display:none!important}
  .modo-questao{padding-bottom:0}
  .modo-questao .pagina{padding:0 12px 100px}
  body.modo-questao:has(.barra-comentario) .pagina{padding-bottom:160px}
  .modo-questao .menu{display:none}
  .barra-questao{position:sticky;top:0;z-index:30;display:grid;grid-template-columns:44px minmax(0,1fr);align-items:center;margin:0 -12px 12px;padding:0 12px;background:var(--papel);color:var(--texto-papel);box-shadow:0 2px 6px rgba(0,0,0,.15)}
  .barra-questao .volta{display:flex;align-items:center;justify-content:center;min-height:48px;font-size:22px;text-decoration:none;color:inherit}
  .barra-questao label{display:flex;align-items:center;gap:6px;min-height:48px;font-weight:700;font-size:15px;cursor:pointer}
  .trilho{grid-column:1/-1;display:block;height:4px;margin:0 -12px;background:var(--cel)}.trilho i{display:block;height:100%;background:var(--ac)}
  #ver-questoes:checked~.barra-questao .seta{transform:rotate(180deg)}
  .layout-questao{display:flex;flex-direction:column;gap:12px}
  .lateral{display:none;position:static;order:-1;background:var(--papel);padding:10px;border-radius:12px}
  #ver-questoes:checked~.layout-questao .lateral{display:block}
  html[data-tema] .lateral .fita{grid-template-columns:repeat(5,44px);justify-content:space-between;margin:0}
  html[data-tema] .questao{padding:14px}
  .fechadas .alt:not(.certa):not(.marcada){display:none}
  .acao-fixa{position:fixed;left:0;right:0;bottom:0;z-index:44;display:flex;gap:8px;margin:0;padding:8px 12px calc(8px + env(safe-area-inset-bottom));background:var(--papel);box-shadow:0 -2px 10px rgba(0,0,0,.2)}
  html[data-tema] .acao-fixa .botao{flex:1;width:auto;max-width:none;margin:0}
  body.modo-questao .barra-comentario{bottom:calc(64px + env(safe-area-inset-bottom))}
  html[data-tema] .botao.continuar{width:100%}
}

/* ---- Jogo de plataforma: arte em pixel art ---- */
[data-tema=plataforma] .topo,[data-tema=plataforma] .chao{background:url(/estatico/arte/tijolo.svg) 0 0/32px 32px}
[data-tema=plataforma] .marca{background:none;padding:0;color:#fff;text-shadow:2px 2px 0 #1c1c1c}
[data-tema=plataforma] .cartao{background-image:url(/estatico/arte/tijolo.svg);background-size:16px 16px;background-repeat:repeat-x}
[data-tema=plataforma] .bloco-q{background:url(/estatico/arte/bloco.svg) 0 0/100% 100%;border:0;box-shadow:none}
[data-tema=plataforma] .bloco-q.breve{background-image:url(/estatico/arte/bloco.svg);opacity:.75}
[data-tema=plataforma] .bloco-q.feita{filter:hue-rotate(70deg)}
[data-tema=plataforma] .bloco-q::before,[data-tema=plataforma] .bloco-q::after{display:none}
[data-tema=plataforma] .tijolinho{background:url(/estatico/arte/tijolo.svg) 0 0/20px 20px;border:0}
[data-tema=plataforma] .cano{background:url(/estatico/arte/cano.svg) top center/100% auto no-repeat;border:0;width:64px;height:96px;right:8px}
[data-tema=plataforma] .cano::before{display:none}
[data-tema=plataforma] .moeda.ganha,[data-tema=plataforma] .moeda{border:0;border-radius:0;box-shadow:none;background:url(/estatico/arte/moeda.svg) center/contain no-repeat}
[data-tema=plataforma] .moeda:not(.ganha){filter:grayscale(1) opacity(.6)}
[data-tema=plataforma] .deco span{height:60px;width:120px;background:url(/estatico/arte/nuvem.svg) center/contain no-repeat;box-shadow:none;border-radius:0;opacity:1}
[data-tema=plataforma] .deco span:nth-child(2){width:160px;height:80px}[data-tema=plataforma] .deco span:nth-child(3){width:96px;height:48px}
[data-tema=plataforma] body{background-image:none}
[data-tema=plataforma] .chao span{border:0;box-shadow:none;clip-path:none;background-position:bottom center;background-size:contain;background-repeat:no-repeat}
[data-tema=plataforma] .chao span::before,[data-tema=plataforma] .chao span::after{display:none}
[data-tema=plataforma] .chao span:nth-child(1){left:3%;width:80px;height:104px;background-image:url(/estatico/arte/cano.svg);background-position:top center}
[data-tema=plataforma] .chao span:nth-child(2){left:13%;width:176px;height:60px;background-image:url(/estatico/arte/moita.svg)}
[data-tema=plataforma] .chao span:nth-child(3){left:38%;width:48px;height:48px;background-image:url(/estatico/arte/cogumelo.svg)}
[data-tema=plataforma] .chao span:nth-child(4){left:50%;width:40px;height:40px;bottom:calc(100% + 90px);background:url(/estatico/arte/bloco-q.svg) 0 0/40px 40px no-repeat,url(/estatico/arte/tijolo.svg) 40px 0/40px 40px no-repeat,url(/estatico/arte/bloco-q.svg) 80px 0/40px 40px no-repeat;width:120px}
[data-tema=plataforma] .chao span:nth-child(5){right:20%;width:80px;height:300px;background-image:url(/estatico/arte/bandeira.svg);background-color:transparent}
[data-tema=plataforma] .chao span:nth-child(6){right:3%;width:192px;height:180px;background-image:url(/estatico/arte/castelo.svg);background-color:transparent}

/* ---- Temas mais ricos: fundo, piso e objetos próprios (arte em static/arte/temas) ---- */
[data-tema=rosa] body{background-image:url(/estatico/arte/temas/f-rosa.svg)}
[data-tema=rosa] .pagina{padding-bottom:150px}
[data-tema=rosa] .chao{display:block}[data-tema=rosa] .chao span{display:block;position:absolute;bottom:100%;background-repeat:no-repeat;background-position:bottom center;background-size:contain}
[data-tema=rosa] .chao span:nth-child(1){left:4%;width:112px;height:112px;background-image:url(/estatico/arte/temas/rosa-salto.svg)}
[data-tema=rosa] .chao span:nth-child(2){left:20%;width:84px;height:84px;background-image:url(/estatico/arte/temas/rosa-batom.svg)}
[data-tema=rosa] .chao span:nth-child(3){right:22%;width:84px;height:84px;background-image:url(/estatico/arte/temas/rosa-tiara.svg)}
[data-tema=rosa] .chao span:nth-child(6){right:4%;width:128px;height:128px;background-image:url(/estatico/arte/temas/rosa-casa.svg)}
[data-tema=caderno] body{background-image:url(/estatico/arte/temas/f-caderno.svg)}
[data-tema=caderno] .pagina{padding-bottom:150px}
[data-tema=caderno] .chao{display:block}[data-tema=caderno] .chao span{display:block;position:absolute;bottom:100%;background-repeat:no-repeat;background-position:bottom center;background-size:contain}
[data-tema=caderno] .chao span:nth-child(1){left:4%;width:112px;height:112px;background-image:url(/estatico/arte/temas/caderno-lapis.svg)}
[data-tema=caderno] .chao span:nth-child(2){left:20%;width:84px;height:84px;background-image:url(/estatico/arte/temas/caderno-regua.svg)}
[data-tema=caderno] .chao span:nth-child(3){right:22%;width:84px;height:84px;background-image:url(/estatico/arte/temas/caderno-borracha.svg)}
[data-tema=caderno] .chao span:nth-child(6){right:4%;width:128px;height:128px;background-image:url(/estatico/arte/temas/caderno-post.svg)}
[data-tema=figurinhas] body{background-image:url(/estatico/arte/temas/f-figurinhas.svg)}
[data-tema=figurinhas] .pagina{padding-bottom:150px}
[data-tema=figurinhas] .chao{display:block}[data-tema=figurinhas] .chao span{display:block;position:absolute;bottom:100%;background-repeat:no-repeat;background-position:bottom center;background-size:contain}
[data-tema=figurinhas] .chao span:nth-child(1){left:4%;width:112px;height:112px;background-image:url(/estatico/arte/temas/figurinhas-pacote.svg)}
[data-tema=figurinhas] .chao span:nth-child(2){left:20%;width:84px;height:84px;background-image:url(/estatico/arte/temas/figurinhas-holo.svg)}
[data-tema=figurinhas] .chao span:nth-child(3){right:22%;width:84px;height:84px;background-image:url(/estatico/arte/temas/figurinhas-album.svg)}
[data-tema=figurinhas] .chao span:nth-child(6){right:4%;width:128px;height:128px;background-image:url(/estatico/arte/temas/figurinhas-trofeu.svg)}
[data-tema=planetas] body{background-image:url(/estatico/arte/temas/f-planetas.svg)}
[data-tema=planetas] .pagina{padding-bottom:150px}
[data-tema=planetas] .chao{display:block}[data-tema=planetas] .chao span{display:block;position:absolute;bottom:100%;background-repeat:no-repeat;background-position:bottom center;background-size:contain}
[data-tema=planetas] .chao span:nth-child(1){left:4%;width:112px;height:112px;background-image:url(/estatico/arte/temas/planetas-foguete.svg)}
[data-tema=planetas] .chao span:nth-child(2){left:20%;width:84px;height:84px;background-image:url(/estatico/arte/temas/planetas-satelite.svg)}
[data-tema=planetas] .chao span:nth-child(3){right:22%;width:84px;height:84px;background-image:url(/estatico/arte/temas/planetas-lua.svg)}
[data-tema=planetas] .chao span:nth-child(6){right:4%;width:128px;height:128px;background-image:url(/estatico/arte/temas/planetas-saturno.svg)}
[data-tema=colagem] body{background-image:url(/estatico/arte/temas/f-colagem.svg)}
[data-tema=colagem] .pagina{padding-bottom:150px}
[data-tema=colagem] .chao{display:block}[data-tema=colagem] .chao span{display:block;position:absolute;bottom:100%;background-repeat:no-repeat;background-position:bottom center;background-size:contain}
[data-tema=colagem] .chao span:nth-child(1){left:4%;width:112px;height:112px;background-image:url(/estatico/arte/temas/colagem-tesoura.svg)}
[data-tema=colagem] .chao span:nth-child(2){left:20%;width:84px;height:84px;background-image:url(/estatico/arte/temas/colagem-cola.svg)}
[data-tema=colagem] .chao span:nth-child(3){right:22%;width:84px;height:84px;background-image:url(/estatico/arte/temas/colagem-pincel.svg)}
[data-tema=colagem] .chao span:nth-child(6){right:4%;width:128px;height:128px;background-image:url(/estatico/arte/temas/colagem-flor.svg)}
[data-tema=eras] body{background-image:url(/estatico/arte/temas/f-eras.svg)}
[data-tema=eras] .pagina{padding-bottom:150px}
[data-tema=eras] .chao{display:block}[data-tema=eras] .chao span{display:block;position:absolute;bottom:100%;background-repeat:no-repeat;background-position:bottom center;background-size:contain}
[data-tema=eras] .chao span:nth-child(1){left:4%;width:112px;height:112px;background-image:url(/estatico/arte/temas/eras-microfone.svg)}
[data-tema=eras] .chao span:nth-child(2){left:20%;width:84px;height:84px;background-image:url(/estatico/arte/temas/eras-violao.svg)}
[data-tema=eras] .chao span:nth-child(3){right:22%;width:84px;height:84px;background-image:url(/estatico/arte/temas/eras-pulseira.svg)}
[data-tema=eras] .chao span:nth-child(6){right:4%;width:128px;height:128px;background-image:url(/estatico/arte/temas/eras-palco.svg)}
[data-tema=fliperama] body{background-image:url(/estatico/arte/temas/f-fliperama.svg)}
[data-tema=fliperama] .pagina{padding-bottom:150px}
[data-tema=fliperama] .chao{display:block}[data-tema=fliperama] .chao span{display:block;position:absolute;bottom:100%;background-repeat:no-repeat;background-position:bottom center;background-size:contain}
[data-tema=fliperama] .chao span:nth-child(1){left:4%;width:112px;height:112px;background-image:url(/estatico/arte/temas/fliperama-gabinete.svg)}
[data-tema=fliperama] .chao span:nth-child(2){left:20%;width:84px;height:84px;background-image:url(/estatico/arte/temas/fliperama-nave.svg)}
[data-tema=fliperama] .chao span:nth-child(3){right:22%;width:84px;height:84px;background-image:url(/estatico/arte/temas/fliperama-coracao.svg)}
[data-tema=fliperama] .chao span:nth-child(6){right:4%;width:128px;height:128px;background-image:url(/estatico/arte/temas/fliperama-ficha.svg)}
[data-tema=arena] body{background-image:url(/estatico/arte/temas/f-arena.svg)}
[data-tema=arena] .pagina{padding-bottom:150px}
[data-tema=arena] .chao{display:block}[data-tema=arena] .chao span{display:block;position:absolute;bottom:100%;background-repeat:no-repeat;background-position:bottom center;background-size:contain}
[data-tema=arena] .chao span:nth-child(1){left:4%;width:112px;height:112px;background-image:url(/estatico/arte/temas/arena-escudo.svg)}
[data-tema=arena] .chao span:nth-child(2){left:20%;width:84px;height:84px;background-image:url(/estatico/arte/temas/arena-espada.svg)}
[data-tema=arena] .chao span:nth-child(3){right:22%;width:84px;height:84px;background-image:url(/estatico/arte/temas/arena-cristal.svg)}
[data-tema=arena] .chao span:nth-child(6){right:4%;width:128px;height:128px;background-image:url(/estatico/arte/temas/arena-torre.svg)}
[data-tema=tatica] body{background-image:url(/estatico/arte/temas/f-tatica.svg)}
[data-tema=tatica] .pagina{padding-bottom:150px}
[data-tema=tatica] .chao{display:block}[data-tema=tatica] .chao span{display:block;position:absolute;bottom:100%;background-repeat:no-repeat;background-position:bottom center;background-size:contain}
[data-tema=tatica] .chao span:nth-child(1){left:4%;width:112px;height:112px;background-image:url(/estatico/arte/temas/tatica-caixote.svg)}
[data-tema=tatica] .chao span:nth-child(2){left:20%;width:84px;height:84px;background-image:url(/estatico/arte/temas/tatica-sacos.svg)}
[data-tema=tatica] .chao span:nth-child(3){right:22%;width:84px;height:84px;background-image:url(/estatico/arte/temas/tatica-cone.svg)}
[data-tema=tatica] .chao span:nth-child(6){right:4%;width:128px;height:128px;background-image:url(/estatico/arte/temas/tatica-radar.svg)}

[data-tema=caderno] .chao{height:40px;background:repeating-linear-gradient(90deg,#e8c9a0 0 30px,#dcb98c 30px 60px);border-top:4px solid #a97f4c}
[data-tema=caderno] .cartao{background-image:linear-gradient(90deg,transparent 22px,#ff9db5 22px 24px,transparent 24px),repeating-linear-gradient(#fff 0 27px,#d7e6fb 27px 28px)}
[data-tema=caderno] .topo{background:#fff27a;box-shadow:3px 4px 0 rgba(0,0,0,.14)}
[data-tema=caderno] .marca{color:#1f3b73}
[data-tema=figurinhas] body{background-color:#d9ccff}
[data-tema=figurinhas] .chao{height:40px;background:repeating-linear-gradient(135deg,#ff8fb1 0 24px,#ffd166 24px 48px,#7bdff2 48px 72px)}
[data-tema=figurinhas] .topo{background:linear-gradient(100deg,#7a5cff,#ff8fb1 55%,#ffd166);border-radius:18px}
[data-tema=figurinhas] .marca{color:#fff}
[data-tema=figurinhas] .cartao{box-shadow:0 0 0 6px #fff,0 0 0 9px #7a5cff,0 12px 20px rgba(43,33,80,.25)}
[data-tema=planetas] body{background-color:#120d33;background-attachment:fixed}
[data-tema=planetas] .chao{height:44px;background:radial-gradient(ellipse 60% 200% at 50% 200%,#5b4fbf 60%,#2a2270 100%);border-top:3px solid #7fd4ff}
[data-tema=planetas] .topo{background:linear-gradient(90deg,#2a2270,#4a2f9a);border-radius:40px;box-shadow:0 0 18px #7a6bff}
[data-tema=planetas] .cartao{box-shadow:0 0 0 2px #7fd4ff,0 0 26px rgba(127,212,255,.4)}
[data-tema=colagem] .chao{height:44px;background:#ffb627;clip-path:polygon(0 14%,8% 0,18% 16%,30% 2%,44% 14%,58% 0,72% 16%,86% 2%,100% 12%,100% 100%,0 100%);overflow:visible}
[data-tema=colagem] .chao{clip-path:none;border-top:6px dashed #fff7e6}
[data-tema=colagem] .topo{background:#ff6b4a;box-shadow:6px 7px 0 rgba(0,0,0,.25)}
[data-tema=colagem] .cartao{box-shadow:7px 9px 0 rgba(0,0,0,.25),-5px -5px 0 #ffb627}
[data-tema=eras] body{background-color:#2a1a3f}
[data-tema=eras] .chao{height:44px;background:linear-gradient(90deg,#ff7eb6,#ffd166,#4cc9f0,#a06cd5,#ef476f,#ff7eb6)}
[data-tema=eras] .topo{background:linear-gradient(90deg,#a3128a,#6a2fc0,#1f7fbf);border-radius:16px}
[data-tema=eras] .cartao{box-shadow:0 0 0 3px #ffd166,0 0 30px rgba(255,126,182,.55)}
[data-tema=fliperama] body{background-size:80px 80px}
[data-tema=fliperama] body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:60;background:repeating-linear-gradient(transparent 0 3px,rgba(0,0,0,.13) 3px 4px)}
[data-tema=fliperama] .chao{height:44px;background:linear-gradient(#ff7ac6,#2b1c57);border-top:4px solid #7dfdd0}
[data-tema=fliperama] .topo{background:#120a24;box-shadow:0 0 0 3px #ff7ac6,0 0 18px #ff7ac6}
[data-tema=fliperama] .cartao{box-shadow:0 0 18px rgba(125,253,208,.5)}
[data-tema=fliperama] .marca{text-shadow:0 0 10px #ffd23f}
[data-tema=arena] .chao{height:44px;background:linear-gradient(#1c3a5e,#091428);border-top:3px solid #c8aa6e}
[data-tema=arena] .topo{background:linear-gradient(90deg,#0a1d38,#163a5c,#0a1d38)}
[data-tema=arena] .cartao{box-shadow:inset 0 0 0 4px #091428,inset 0 0 0 5px #c8aa6e,0 0 20px rgba(10,200,185,.25)}
[data-tema=tatica] .chao{height:44px;background:repeating-linear-gradient(135deg,#ffb54a 0 22px,#141a20 22px 44px)}
[data-tema=tatica] .topo{background:#1d252d;box-shadow:inset 0 -3px 0 #ffb54a}
[data-tema=tatica] .cartao{box-shadow:inset 0 0 0 1px #ffb54a;background-image:linear-gradient(135deg,#ffb54a 12px,transparent 12px),linear-gradient(315deg,#ffb54a 12px,transparent 12px)}

/* Mundo Rosa: mais vivo e brilhante. */
[data-tema=rosa] body{background-color:#f0389f;background-image:url(/estatico/arte/temas/f-rosa.svg),linear-gradient(160deg,#ff5cb8,#e0147f 60%,#a51fb5);background-size:160px 160px,cover;background-attachment:scroll,fixed}
[data-tema=rosa]{--texto:#fff;--suave:#fff;--link:#fff}
[data-tema=rosa] .abertura h1,[data-tema=rosa] .materia{color:#fff;text-shadow:2px 3px 0 #a00b63}
[data-tema=rosa] .lema,[data-tema=rosa] .em-breve{color:#fff;font-weight:700;text-shadow:1px 1px 0 #a00b63}
[data-tema=rosa] .topo{background:linear-gradient(95deg,#c20d78,#ff2fa4 50%,#ffb627);box-shadow:0 6px 0 #8a0f5c}
[data-tema=rosa] .marca{text-shadow:2px 2px 0 #8a0f5c}
[data-tema=rosa] .cartao{border:3px dashed #ff2fa4;box-shadow:0 0 0 6px #fff,0 0 0 9px #ffd166,0 14px 26px rgba(120,0,80,.4)}
[data-tema=rosa] .botao:not(.segundo){background:linear-gradient(#ff5cb8,#d6127f 55%,#b00d68);color:#fff;box-shadow:inset 0 2px 0 rgba(255,255,255,.55),0 4px 0 #8a0f5c}
[data-tema=rosa] .alt{background:linear-gradient(#fff,#ffeaf6);border-color:#ff8cc8}
[data-tema=rosa] .alt b{color:#d6127f}
[data-tema=rosa] .barra i,[data-tema=rosa] .trilho i{background:linear-gradient(90deg,#ff2fa4,#ffb627)}
[data-tema=rosa] .chao{height:48px;background:conic-gradient(#fff 25%,#ff8cc8 0 50%,#fff 0 75%,#ff8cc8 0) 0 0/48px 48px;border-top:6px solid #ffd166}
[data-tema=rosa] .selo,[data-tema=rosa] .item{box-shadow:0 5px 0 #c20d78}
[data-tema=rosa] .rodape-conquistas a{color:#fff}


/* Tamanho real dos fundos, para o desenho não crescer atrás do texto. */
[data-tema=caderno] body{background-size:200px 200px;background-repeat:repeat}
[data-tema=figurinhas] body{background-size:140px 140px;background-repeat:repeat}
[data-tema=planetas] body{background-size:220px 220px;background-repeat:repeat}
[data-tema=colagem] body{background-size:120px 120px;background-repeat:repeat}
[data-tema=eras] body{background-size:180px 180px;background-repeat:repeat}
[data-tema=fliperama] body{background-size:80px 80px;background-repeat:repeat}
[data-tema=arena] body{background-size:112px 112px;background-repeat:repeat}
[data-tema=tatica] body{background-size:240px 240px;background-repeat:repeat}
[data-tema=figurinhas] body,[data-tema=eras] body{background-blend-mode:normal}
[data-tema=plataforma] .chao span:nth-child(4){box-shadow:none;border:0}