/* =====================================================================
SKINS — seis linguagens visuais, não seis paletas (11/09/2026)
Este arquivo carrega DEPOIS de estilo-jogo.css e é o único lugar onde
uma skin muda de forma. A skin A ("Ilhas") é o jogo como estava e não
aparece aqui: tudo abaixo vale só para html[data-skin="b"…"f"].
Como está organizado:
0. fontes (Google, com fallback) — o index.html não é tocado
1. TOKENS por skin: papel, tinta, superfície, linha, seleção, botão
2. REMAPEAMENTO comum (B–F): todo branco fixo do estilo-jogo.css
vira var(--tx*), todo rgba(255,255,255,.05) vira var(--sup), etc.
É isto que permite três skins CLARAS (B, D, F) sem tocar o CSS base.
3. Uma seção por skin: tipografia, forma, imagem, movimento.
Especificidade: o prefixo `html:is([data-skin="b"],…)` vale (0,1,1),
igual a `html[data-skin="b"]`. Por isso a ORDEM decide: o remapeamento
comum vem antes, a seção da skin vem depois e ganha. As listas dentro
de :is() só têm classes simples, para não inflar a especificidade.
===================================================================== */
/* ⚠ O @import DAS FONTES SAIU DAQUI EM 11/09/2026 (skin G). Um @import no
CSS vale para todas as skins, inclusive a que existe justamente para não
baixar nada — e não há como condicioná-lo. As famílias passaram para um
injetado no do index.html, que pula a injeção quando a
skin é a 'g'. Skin nova que precise de família nova: acrescente lá. */
/* ---------------------------------------------------------------------
1 · TOKENS
--paper fundo das telas --tx / --tx2 / --tx3 tinta em 3 pesos
--sup superfície de cartão --sup2 superfície mais forte
--line borda / hairline --line2 divisor fraco
--sel fundo do que está escolhido --sel-tx texto sobre ele
--btn / --btn-tx / --btn-sh botão principal (fundo, texto, sombra)
--c-teal --c-amber --c-green --c-warm --c-purple acentos de texto
--paper-rgb o papel em r,g,b, para gradientes com alfa
--------------------------------------------------------------------- */
html[data-skin="b"]{
--paper:#FBEBD6;--paper-rgb:251,235,214;
--tx:#10233F;--tx2:#3A4A66;--tx3:#6B7A95;
--sup:rgba(255,255,255,.74);--sup2:rgba(255,255,255,.92);--line:rgba(255,255,255,.95);--line2:rgba(16,35,63,.14);
--sel:#1B7F8A;--sel-tx:#FFFFFF;
--btn:#F28C28;--btn-tx:#1F1200;--btn-sh:#C96A14;--btn-dark:#F79A3E;
--marca:#1B7F8A;--acento:#F28C28;--halo:27,127,138;
--c-teal:#1B7F8A;--c-amber:#B4600A;--c-green:#3E8A2E;--c-warm:#C2571A;--c-purple:#6A3FB8;
--niv-fundo:#1B4F86;--niv-meio:#1B7F8A;--niv-alto:#2BB5B0;--niv-suave:#7ED6D1;--niv-nome:#10233F;
--niv-tinta:#FFFFFF;--niv-halo:27,127,138;
--r:20px;--r-btn:18px;
--f1:#E4F1FC;--f2:#E4F1FC;--f3:#E4F1FC}
html[data-skin="c"]{
--paper:#F4F0E6;--paper-rgb:244,240,230;
--tx:#2A2118;--tx2:#5A4A3A;--tx3:#8A7A66;
--sup:#FFFCF6;--sup2:#F3EADB;--line:#8A6A33;--line2:rgba(42,33,24,.16);
--sel:#AF0421;--sel-tx:#FFF8EC;
--btn:#AF0421;--btn-tx:#FFF8EC;--btn-sh:#6E5530;--btn-dark:#8E0A1E;
--marca:#7A5C2B;--acento:#AF0421;--halo:175,4,33; /* latão: #8A6A33 dava 4,40:1 sobre o papel — §8.8 */
--c-teal:#1F6F7A;--c-amber:#8A5A12;--c-green:#3F7A46;--c-warm:#AF0421;--c-purple:#5B3FA8;
--niv-fundo:#5E4A28;--niv-meio:#7A5C2E;--niv-alto:#8A6A33;--niv-suave:#B08D57;--niv-nome:#2A2118;
--niv-tinta:#FFF8EC;--niv-halo:138,106,51;
--r:6px;--r-btn:3px;
--f1:#F4F0E6;--f2:#F4F0E6;--f3:#F4F0E6}
html[data-skin="d"]{
--paper:#FFF6E9;--paper-rgb:255,246,233;
--tx:#2B1F17;--tx2:#6B5A4E;--tx3:#9C8A7A;
--sup:#FFFDF8;--sup2:#F2E6D4;--line:#E6D6C0;--line2:#EDE1D0;
--sel:#C9553D;--sel-tx:#FFFDF8;
--btn:#C9553D;--btn-tx:#FFFDF8;--btn-sh:#8F3A29;--btn-dark:#B04A34;
--marca:#DB1E2F;--acento:#C9553D;--halo:201,85,61;
--c-teal:#1F6F7A;--c-amber:#9A5B00;--c-green:#3F7A46;--c-warm:#C9553D;--c-purple:#6B45B8;
--niv-fundo:#1F4A5C;--niv-meio:#17A6A6;--niv-alto:#5ED6D6;--niv-suave:#8FD6D6;--niv-nome:#1F4A5C;
--niv-tinta:#0F2F3A;--niv-halo:23,166,166;
--r:22px;--r-btn:18px;
--f1:#FFF6E9;--f2:#FFF6E9;--f3:#FFF6E9}
html[data-skin="e"]{
--paper:#0B1E3A;--paper-rgb:11,30,58;
--tx:#F4F6FF;--tx2:#B8C4E6;--tx3:#7C8BB5;
--sup:#16396B;--sup2:#1F4C8A;--line:#000000;--line2:#0A2A55;
--sel:#FFC53D;--sel-tx:#1A1400;
--btn:#FF7A2F;--btn-tx:#1A0A00;--btn-sh:#000;--btn-dark:#E86A22;
--marca:#FFC53D;--acento:#FFC53D;--halo:255,197,61;
--c-teal:#5EE6E6;--c-amber:#FFC53D;--c-green:#5BE58A;--c-warm:#FF7A2F;--c-purple:#B79BFF;
--niv-fundo:#0E6B3A;--niv-meio:#22C55E;--niv-alto:#5BE58A;--niv-suave:#8FD9A8;--niv-nome:#C8F5D8;
--niv-tinta:#05301A;--niv-halo:34,197,94;
--r:0px;--r-btn:0px;
--f1:#0B1E3A;--f2:#0B1E3A;--f3:#0B1E3A}
html[data-skin="f"]{
--paper:#17233A;--paper-rgb:23,35,58;
--tx:#F4F6FA;--tx2:#B9C3D6;--tx3:#7F8CA6;
--sup:#22314D;--sup2:#2C3D5E;--line:#22314D;--line2:#2C3D5E;
--sel:#17C4C4;--sel-tx:#05303A;
--btn:#F2A65A;--btn-tx:#2A1600;--btn-sh:#C0682C;--btn-dark:#F6B679;
--marca:#F2A65A;--acento:#17C4C4;--halo:23,196,196;
--c-teal:#5EDCDC;--c-amber:#F2A65A;--c-green:#7BD88F;--c-warm:#F0805A;--c-purple:#C4B0FF;
--niv-fundo:#0F6B8A;--niv-meio:#17C4C4;--niv-alto:#6FE3E3;--niv-suave:#9AEDED;--niv-nome:#DFF9F9;
--niv-tinta:#05303A;--niv-halo:23,196,196;
--r:10px;--r-btn:10px;
--f1:#17233A;--f2:#17233A;--f3:#17233A}
/* ---------------------------------------------------------------------
2 · REMAPEAMENTO COMUM (B, C, D, E, F)
--------------------------------------------------------------------- */
/* fundo das telas e do aparelho */
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #app{background:var(--paper) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .tela{
background:var(--paper) !important;color:var(--tx) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(#corpo,.corpo,.mtxt,.rodape){color:var(--tx)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #corpo :is(.title,.body,.catcab){text-shadow:none}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .rodape{
background:linear-gradient(180deg,rgba(var(--paper-rgb),0),var(--paper) 42%) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #t-mapa .mtxt .btn{
box-shadow:0 -20px 20px -8px var(--paper),0 -40px 26px -22px var(--paper)}
/* a imagem de fundo das perguntas: o gradiente que a dissolve no papel */
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #cenafundo::after{
background:linear-gradient(180deg,
rgba(var(--paper-rgb),.04) 0%,rgba(var(--paper-rgb),.12) 16%,
rgba(var(--paper-rgb),.74) 40%,rgba(var(--paper-rgb),.97) 88%,var(--paper) 100%) !important}
/* tinta 1 — o que era branco */
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(
.title,.rot,.placar,.pgcab-rot,.mg-bloco-nome,.esc-op,.portao-sim,.mo-rot,.dv-t,.dv-s,.fb-tit,
.fb-op,.fb-trilha,.arq-nome,.arq-viz-n,.cx-t,.obs-rot,.mf-t,.glos-nm,.glos-e,.deg-f-nome,.mgf-nome,
.mgg-nome,.mg-art-p,.es-tit,.fi-tit,.fi-plano-r,.pgperg,.nt-tit,.pf-r,.tu-t,.sb-t,.mgd-t,.mo-seta,
.mais-cab,.headline,.display,.rt-tx,.arq-sec,.fb-porq,.fb-metodo,.fb-caixa,.consent,.tm-corpo,
.ct-cab,.comu-c,.es-tx,.ident-tit,.ident-r,.palp-txt,.contador,.leg,.dg-nome,.mg-tarefa,.fi-in,
.es-in,.cv2-l,.rb-nota,.cx-r,.selo-papel,.pf-bl,.pouso,.turma,.conta,.comu,.fi-erra,.mfato,.falta-p,
.exp-tx,.dica,.medidor,.nudge,.mg-ext-p,.pendencias){color:var(--tx) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(
.fb-tit b,.fb-metodo b,.fb-caixa h4,.fb-porque label,.arq-sec p,.arq-sec li,.fb-trilha li,.fb-porq p,
.consent p b,.tm-corpo p b,.palp-txt b,.deg-cab p,.es-tx b,.contador b,.selo-papel span,.pf-ul li b,
.pf-p b,.ct-cab b,.comu-n b,.sb-g summary,.leg b,.mais-txt b,.mais-p .rot,.dica b,.mg-tarefa b,
.fb-op.on,.fb-op.certa,.esc-op.on,.dv-t,.mrev b,.leg.tres b,.ct-ok b,.tu-t,.glos-e,.pgcab-rot,
.mg-bloco-nome,.mo-rot,.mgf-nome,.mgg-nome,.dg-item.agora .dg-nome,.rt-tx b,.fi-tit,.es-tit,
.arq-nome,.cx-t,.cx-n,.fb-gap-l b,.fb-gap-l.destaque b,.mf-t,.glos-nm,.pf-r,.obs-rot,.md-rot,
.mgd-t,.mg-art-p,.nt-tit,.nt-p,.es-tx span,.pf-obg){color:var(--tx) !important}
/* tinta 2 — o que era branco a 60–85% */
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(
.body,.mg-porque,.mo-n,.mo-dif,.dv-f,.fb-sub,.fb-porque-n,.fb-fila-pes,.fb-caixa-n,.fb-nota-p,
.arq-d,.arq-nota,.sb-int,.cx-nota,.obs-sub,.glos-p,.deg-g-n,.deg-pe,.mgf-perg,.mgf-pe,.mg-nota,
.mg-art-rot,.mg-trava,.es-sub,.fi-sentido,.fi-pos,.catmin,.mmin,.menuop-pe,.menuop-rev,.mrev,
.pf-p,.pf-q,.pf-ul,.pf-ref,.ct-msg,.comu-p,.comu-n,.comu-ok,.tu-c,.tu-bt,.ident-lgpd,.tg-est,
.mg-termo,.fi-termo,.skins-rot,.skin-op,.capa-conta,.capa-layout,.pular,.pular-tela,.mg-voltar,
.rt-novo,.linha-pes,.rot-nota,.mgd,.esc-n,.mo-num,.pc-de,.rb-cab,.cx-cab,.cv2-cab,.fb-passo,
.dv-selo,.arq-r,.mf-f,.falta-n,.fi-de,.es-mast,.nt-mast,.pf-selo,.pf-cab,.pf-comp-t,.comu-cab,
.tm-x,.tm-id,.exp-tx,.fb-gap-seta,.consent-link,.ident-sub,.ident-n,.mais-txt span,.dica-mais,
.cardaviso,.avisoRodape,.glos-cab,.deg-cab,.fb-metodo p,.fb-op:disabled,.fi-dica-gesto,.arq-raro-n,
.mg-degrauzinho,.er-n,.fi-bt,.fi-pl,.ct-recusa,.im-r,.md-leg){color:var(--tx2) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(
.consent p,.tm-corpo p,.tm-cab .mono,.mais-txt span,.palp-txt span,.leg.tres .z,.es-tx span,
.rt-tx span,.pf-ul li,.mg-tarefa span,.glos-cab .mono,.deg-cab .mono,.glos-cab p,.ct-cab span,
.ct-ok span,.fb-gap-l span,.dv-le .dv-selo,.arq-fato .arq-r,.mg-degrauzinho i,.leg.tres .ex,
.fi-plano-r i,.deg-diz,.mais-p .ch,.nt-p){color:var(--tx2) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .it .nm{color:var(--tx2) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .it.cel .nm{color:var(--tx2) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .it[data-n="3"] .nm,
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .it[data-n="4"] .nm,
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .it[data-n="5"] .nm,
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .it.cel[data-n="3"] .nm,
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .it.cel[data-n="4"] .nm,
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .it.cel[data-n="5"] .nm,
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .it.tog[data-n="1"] .nm,
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .it.tog[data-n="2"] .nm,
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .it.arrastando .nm{color:var(--tx) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .medidor .d{color:var(--tx2) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .medidor .n{color:var(--acento) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .placar.pecas .pc-ico{color:var(--acento);text-shadow:none}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .it .disco svg.marca-real{color:var(--tx)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .it svg{fill:var(--tx3)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .estrelas .st{color:var(--sup2)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .es-est i{color:var(--sup2)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .glos-est i{color:var(--sup2)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .mast{color:var(--marca) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .mast::after{background:var(--marca) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .mast.on-dark{color:var(--tx) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .mast.on-dark::after{background:var(--tx) !important}
/* acentos de texto que eram claros demais para papel */
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(
.dv-le .dv-selo,.arq-aprende .arq-r,.cv2-l li b,.rt-tx b,.selo-papel b,.pf-selo,.pf-cab,.tu-selo,
.ct-ok b,.mg-saber,.fi-termo b,.leg.tres .g,.leg.tres .g i,.cardaviso,.obs-ok,.dica-mais,.nt-mast,
.fb-caixa-ped h4,.comu-cab,.pf-g b,.it.tog[data-n="1"] .tg-est){color:var(--c-teal) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(
.fb-tit b,.dv-selo,.mf-selo,.falta-cab,.falta-i,.arq-risco .arq-r,.arq-raro b,.mg-tarefa b,
.mg-ext-p,.mg-ext-bt,.pular.on,.es-i.zero .es-tx b,.fi-erra b,.cx-n,.fb-gap-l.destaque b,
.leg.tres .p,.leg.tres .p i,.it.tog[data-n="2"] .tg-est,.ident-tit,.pendencias,.mais-txt b,
.sb-g summary i,.glos-est i.on,.fb-trilha li::marker){color:var(--c-amber) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(
.arq-forte .arq-r,.mo.visto .mo-n,.mo.visto .mo-seta,.fb-porq.acertou .fb-porq-s,.mgd-t,
.dg-item.feito .dg-nome){color:var(--c-green) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(
.fb-passo,.fb-porq-s,.fi-de,.es-mast,.dg-aqui,.glos-i[data-n="0"] .glos-nm,.glos-i[data-n="1"] .glos-nm,
.ct-msg.ruim,.comu-ok.ruim,.ident-erro){color:var(--c-warm) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .arq-viz .arq-r{color:var(--c-purple) !important}
/* superfícies — o que era rgba(255,255,255,.05) */
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(
.mg-bloco,.esc-op,.portao-sim,.mo,.dv,.fb-op,.fb-f,.fb-gap,.fb-caixa,.fb-porq,.arq-sec,.sb-g,.cx,
.radarBox,.cv2,.glos,.deg,.mgf,.mgg,.mg-art,.mg-trava,.mg-degrauzinho,.mg-tarefa,.pgcab,.medidor,
.dica,.palp,.ident,.mais,.aberta,.expandir,.mfato,.retomar,.es-in,.fi-in,.conta,.comu,.pf-bl,
.selo-papel,.pouso,.turma,.arq-raro,.fb-cod,.nt-cod,.pf-cod,.voltar,.aa,.mo-peca,.catmin,.mgf-deg,
.esc-n,.mo-num,.mo-seta,.fi-bt,.fi-pl,.mg-saber,.ct-bt,.tm-in,.mg-desce,.mg-ext,.mgg-seta,
.ident-r .opc,.falta,.pendencias,.fb-caixa-ped,.dv-le,.dv-fa,.arq-forte,.arq-risco,.arq-aprende,
.arq-viz,.arq-fato,.es-i.zero,.fi-erra,.it.cel,.im-p,.md-rot,.md-dg,.md-leg,.er-n){
background:var(--sup) !important;border-color:var(--line) !important;color:inherit}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(.bl .falta,#resumo .falta){background:var(--sup) !important;border-color:var(--line) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(
.ch,.it .disco,.mais-p .ch,#obsTxt,.ct-email,.ct-cod,.comu-campos input,.ident-i,textarea.aberta,
.dg-bola,.pgcab-pips i,.mg-pips i,.trilha i,.leg.escala .lg i,.dg-lig,.er-b,.est .ponto,.fb-f,
.mo-peca,.esc-n,.mo-num,.mo-seta,.mgg-seta,.im-p){background:var(--sup2) !important;border-color:var(--line) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(.ch,.mais-p .ch){color:var(--tx) !important;box-shadow:none !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(#obsTxt,.ct-email,.ct-cod,.comu-campos input,.ident-i,textarea.aberta,.aberta){
color:var(--tx) !important;background:var(--sup) !important;border:1px solid var(--line) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(#obsTxt,.ident-i,textarea.aberta)::placeholder{color:var(--tx3) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(.fb-cod,.nt-cod,.pf-cod){color:var(--tx) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .it .disco{
box-shadow:0 0 0 1px var(--line) !important;transform:none}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .it.cel .disco{box-shadow:0 0 0 1px var(--line) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .mg-cel .disco{background:var(--sup2) !important}
/* linhas e divisórias */
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .topo{border-bottom-color:var(--line2) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(
.cx-l,.deg-g,.glos-i,.pf-li,.dv-s,.fi-nav,.fi-plano,.fb-bate,.consent,.tm-cab,.tm-pe,.pf-comp-t,
.sb-i,.deg-f-cab,.pf-ref,.ident-zap){border-color:var(--line2) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .trilha i.feito{background:var(--marca) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .trilha i.atual{background:var(--tx) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .mg-pips i.feito{background:var(--acento) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .mg-pips i.atual{background:var(--tx) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .pgcab-pips i.feito{background:var(--tx3) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .chips.multi .ch::before{border-color:var(--tx2);background:var(--sup)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .chips.multi .ch.on::before{background:var(--sel-tx);border-color:var(--sel-tx)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .chips.multi .ch.on::after{border-color:var(--sel)}
/* o que está escolhido */
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(.ch.on,.mais-p .ch.on){
background:var(--sel) !important;color:var(--sel-tx) !important;border-color:var(--sel) !important;
box-shadow:none !important;transform:none}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(.esc-op.on,.portao-sim,.fb-op.on,.mo.visto,.palp.on,.fi-pl.on,.mg-ext-bt.on,.fb-f.on){
background:var(--sup) !important;border-color:var(--sel) !important;box-shadow:inset 0 0 0 1px var(--sel) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(.fi-pl.on,.mg-ext-bt.on,.fb-f.on){
background:var(--sel) !important;color:var(--sel-tx) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .esc-op.on .esc-n{background:var(--sel) !important;color:var(--sel-tx) !important;border-color:var(--sel) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .mo.visto .mo-num{background:var(--sel) !important;color:var(--sel-tx) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .palp.on .palp-txt b{color:var(--sel) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .palp-check{background:var(--sup) !important;border-color:var(--line) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .palp.on .palp-check{background:var(--sel) !important;border-color:var(--sel) !important;box-shadow:none !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .palp.on .palp-check::after{border-color:var(--sel-tx)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .palp::before{display:none}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .palp-arte{box-shadow:0 0 0 1px var(--line)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .palp.on .palp-arte{box-shadow:0 0 0 2px var(--sel)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .mais-ico{background:var(--sel) !important;color:var(--sel-tx) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .mais-pts{background:var(--sup2) !important;color:var(--tx) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .im-reg.on .im-p{background:var(--sel) !important;border-color:var(--sel-tx) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .ilhamapa--denso .im-reg.on .im-p b{color:var(--sel-tx)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .ilhamapa--denso .im-p b{color:var(--tx)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .mgd-selo{background:var(--sel) !important;color:var(--sel-tx) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .exp-mais{background:var(--sel);color:var(--sel-tx)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .it.cel[data-n="3"],
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .it.cel[data-n="4"],
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .it.cel[data-n="5"]{
background:var(--sup2) !important;border-color:var(--line) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .it.cel .cel-q{background:var(--sel);color:var(--sel-tx);box-shadow:none}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .it .disco::before{opacity:1}
/* botões */
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .btn{
background:var(--btn) !important;color:var(--btn-tx) !important;
box-shadow:0 4px 0 var(--btn-sh) !important;border-radius:var(--r-btn) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .btn:hover{background:var(--btn-dark) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .btn:active:not(:disabled){transform:translateY(3px);box-shadow:0 1px 0 var(--btn-sh) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .btn:disabled{
background:var(--sup2) !important;color:var(--tx3) !important;box-shadow:none !important;opacity:1}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .btn.ghost{
background:transparent !important;color:var(--tx2) !important;border:1px solid var(--line) !important;box-shadow:none !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #bok.avisa{
background:var(--btn) !important;color:var(--btn-tx) !important;box-shadow:0 4px 0 var(--btn-sh) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #bok.avisa::before{background:var(--acento)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .avisoRodape{color:var(--acento) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(.voltar,.aa){
color:var(--tx) !important;background:var(--sup) !important;border:1px solid var(--line) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .voltar svg{stroke:var(--tx) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .som svg{stroke:var(--tx)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .som svg path:first-child{fill:var(--tx)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .ct-google{border-color:var(--line)}
/* a capa: os estilos inline do index.html só cedem a !important */
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .capa-txt{background:var(--paper) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .capa-txt::after{background:linear-gradient(rgba(var(--paper-rgb),0),var(--paper))}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .capa-txt::before{background:var(--marca) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .capa-txt :is(.mono,.body,b,div,span){color:var(--tx) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .capa-txt > .mono,
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .capa-txt .mono[style]{color:var(--tx2) !important;opacity:1 !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #capa-lead{color:var(--tx2) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .capa-topo .marca{color:var(--tx) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .capa-topo .marca svg :is(path,rect,circle)[fill="#fff"]{fill:var(--tx)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .tit-jogo,
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .tit-jogo span,
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #mt.tit-jogo,
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #mt.tit-jogo span{
background:none !important;-webkit-text-fill-color:var(--tx) !important;color:var(--tx) !important;filter:none !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .skin-op img{border-color:var(--line2);background:var(--sup2)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .skin-op.atual img{border-color:var(--sel);box-shadow:0 0 0 2px rgba(var(--halo),.25)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .skin-op.atual{color:var(--tx) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #t-fim h2[style]{color:var(--tx) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .capa-arte::after{
background:linear-gradient(180deg,rgba(var(--paper-rgb),0) 0%,rgba(var(--paper-rgb),0) 45%,
rgba(var(--paper-rgb),.55) 78%,var(--paper) 100%)}
/* o mapa entre categorias */
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #board{
border:1px solid var(--line2);box-shadow:none;background:var(--sup2)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #board .bg{background:var(--sup2) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #board::after{display:none}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #rota .trecho{stroke:var(--tx3)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #rota .trecho.feito{stroke:var(--acento);filter:none}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #rota .seta{fill:var(--acento);filter:none}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .er-a{border-color:var(--line);box-shadow:none;background-color:var(--sup)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .er-b{color:var(--tx);box-shadow:none}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .est.ilhareal.feita .er-b{background:var(--c-green) !important;color:var(--paper)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .est.ilhareal.agora .er-b{background:var(--sel) !important;color:var(--sel-tx)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .est.ilhareal.agora .er-a{border-color:var(--sel);box-shadow:0 0 0 2px var(--sel)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .est.ilhareal.feita .er-a{border-color:var(--c-green)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .est.ilhareal.falta .er-a{filter:grayscale(1) opacity(.4)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .est.ilhareal.agora .er-n{color:var(--tx) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .dg-item.feito .dg-bola{background:var(--c-green) !important;color:var(--paper)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .dg-item.agora .dg-bola{
background:var(--sel) !important;color:var(--sel-tx);border-color:var(--paper);box-shadow:none;animation:none}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .dg-item.agora .dg-ilha{border-color:var(--sel);box-shadow:0 0 0 2px var(--sel)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .dg-item.falta .dg-ilha{filter:grayscale(1) opacity(.4)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .ilhamapa{border-color:var(--line);box-shadow:none}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .ilhamapa::after{display:none}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .ilhamapa .im-r{background:var(--paper);border-color:var(--line);color:var(--tx)}
/* sobreposições: escala das estrelas, ficha, termo, cartão, sem-link */
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(#escala,#ficha,#termo,#cardmodal,#naotem){
background:rgba(var(--paper-rgb),.88);backdrop-filter:blur(6px)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .tm-in{border-top-color:var(--marca)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .tm-corpo h3{color:var(--marca)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .tm-corpo a{color:var(--marca)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .consent-link{color:var(--marca)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(.es-in,.fi-in){box-shadow:0 20px 50px rgba(0,0,0,.18)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .fi-x{color:var(--tx2)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .es-i:last-child .es-est i.on,
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .estrelas .st.on.alta{text-shadow:none}
/* o interlúdio entre categorias (flash) e as faixas de texto claras */
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #flash{background:var(--paper)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #flcv{display:none}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .cortina{background:var(--sel)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #flfoto::after,
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #flfoto.chegada::after{
background:linear-gradient(180deg,rgba(var(--paper-rgb),.55) 0%,rgba(var(--paper-rgb),.82) 45%,rgba(var(--paper-rgb),.97) 100%) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(.fl-conteudo,.fl-num,.fl-txt,.fl-sub,.fl-cheg){color:var(--tx) !important;text-shadow:none !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .fl-toque{color:var(--tx3)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .fl-sub{color:var(--acento) !important}
/* estilos inline do app.js (o bloco "palpite × retrato", entre outros):
brancos escritos no atributo style só cedem a !important */
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #app [style*="color:rgba(255,255,255"]{color:var(--tx2) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #app [style*="color:#fff"]{color:var(--tx) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #app [style*="background:rgba(255,255,255"]{background:var(--sup) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #app [style*="border:1px solid rgba(255,255,255"]{border-color:var(--line) !important}
/* elementos que entraram em 11/09 à tarde (fluxo simples, tela de arte,
entrar/sair, chip da conta, tela final): brancos fixos no CSS base */
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(
.capa-arte-bt,.capa-acesso,.capa-acesso .ca-linha,.capa-acesso .ca-chip,.conta-pop .cp-quem,.fim-conta,.fb-resto summary,
.catpg,.capa-acesso .ca-quem){color:var(--tx2) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(
.capa-arte-bt b,.skins.skins-tela .skin-op span,.ca-lk,.capa-acesso .ca-bt,.capa-acesso .ca-sair,.capa-acesso .ca-quem b,
.conta-chip,.conta-pop button,.fim-conta b){color:var(--tx) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .conta-pop .cp-n{color:var(--tx3) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .catpg{background:var(--sup2) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) :is(.conta-chip,.conta-pop button,.capa-acesso .ca-bt,.capa-acesso .ca-sair){
background:var(--sup) !important;border-color:var(--line) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .conta-chip.on{background:var(--btn) !important;color:var(--btn-tx) !important;border-color:transparent !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .conta-pop{background:var(--sup) !important;border-color:var(--line) !important;box-shadow:0 12px 30px rgba(0,0,0,.25)}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .skins.skins-tela .skin-op img{border-color:transparent}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .skins.skins-tela .skin-op.atual img{border-color:var(--sel)}
html[data-skin="b"] #app [style*="border:1px solid rgba(255,255,255"]{border:1px solid rgba(255,255,255,.95) !important;background:rgba(255,255,255,.74) !important;border-radius:20px;box-shadow:0 8px 24px rgba(20,60,120,.14)}
html[data-skin="c"] #app [style*="border:1px solid rgba(255,255,255"]{border:1px solid rgba(176,141,87,.55) !important;background:transparent !important;border-radius:6px}
html[data-skin="d"] #app [style*="border:1px solid rgba(255,255,255"]{border:0 !important;border-radius:22px;box-shadow:0 4px 0 #E6D6C0;background:#FFFDF8 !important}
html[data-skin="e"] #app [style*="border:1px solid rgba(255,255,255"]{border:4px solid #000 !important;box-shadow:4px 4px 0 #000,inset 0 0 0 2px #2B5CE6;background:#16396B !important}
html[data-skin="f"] #app [style*="border:1px solid rgba(255,255,255"]{border:0 !important;border-radius:10px;box-shadow:0 4px 0 #0E1727;background:#22314D !important}
/* =====================================================================
3 · B · ILHA FLUTUANTE — céu de fim de tarde, vidro e casinhas
Derivada da arte low-poly (ilhas flutuando num céu azul→laranja): o
céu em gradiente é o fundo das telas — azul no alto, como o topo da
arte, horizonte quente embaixo; os cartões são vidro translúcido com
cantos generosos; o botão é o laranja do pôr do sol com sombra
deslocada; os acentos vêm das casinhas (turquesa, roxo, amarelo,
verde). Baloo 2 nos títulos, Quicksand no corpo. Casual, luminoso.
===================================================================== */
html[data-skin="b"] :where(*:not(.fb-cod):not(.nt-cod):not(.pf-cod):not(.ct-cod):not(.tm-id)){font-family:Quicksand,Nunito,system-ui,-apple-system,sans-serif !important}
html[data-skin="b"] :is(.title,.headline,.display,.tit-jogo,.fb-tit,.arq-nome,.es-tit,.fi-tit,.nt-tit,.pgcab-rot,.mg-bloco-nome,.mgf-nome,.mgg-nome,.ident-tit,.dv-t,.medidor .n,.fl-num,.cx-n,.placar,.btn,.arq-viz-n,.fb-caixa h4),
html[data-skin="b"] :is(.title,.headline,.display,.tit-jogo,.fb-tit,.arq-nome,.placar,.btn) *{font-family:'Baloo 2',Quicksand,Nunito,system-ui,sans-serif !important;font-weight:800 !important}
html[data-skin="b"] .title{font-size:clamp(22px,6.2vw,27px);line-height:1.15;letter-spacing:-.01em}
html[data-skin="b"] .body{font-size:15px;line-height:1.55;font-weight:600}
html[data-skin="b"] :is(.ch,.esc-op,.mo,.fb-op,.palp,.portao-sim,.mg-saber,.fi-pl,.ct-bt,.fi-bt,.mg-ext-bt){font-weight:700 !important}
html[data-skin="b"] .mast{font-weight:800 !important;letter-spacing:.12em;font-size:12px;color:#10233F !important}
html[data-skin="b"] .mast::after{background:#F28C28 !important;height:3px;border-radius:2px}
/* o céu: azul no alto (o topo da arte), horizonte quente embaixo */
html[data-skin="b"] #app{background:#8CC6F4 !important}
html[data-skin="b"] .tela,html[data-skin="b"] #flash{background:linear-gradient(180deg,#3FA2EE 0%,#8CC6F4 26%,#E4F1FC 52%,#FBEBD6 100%) !important}
html[data-skin="b"] .capa-txt{background:linear-gradient(180deg,#E4F1FC 0%,#FBEBD6 100%) !important}
html[data-skin="b"] .capa-txt::after{background:linear-gradient(rgba(228,241,252,0),#E4F1FC)}
html[data-skin="b"] #cenafundo{height:46% !important;background-position:center 30% !important}
html[data-skin="b"] #cenafundo::after{background:linear-gradient(180deg,rgba(228,241,252,0) 0%,rgba(228,241,252,.15) 22%,rgba(228,241,252,.66) 52%,rgba(228,241,252,.95) 100%) !important}
html[data-skin="b"] #flfoto::after,html[data-skin="b"] #flfoto.chegada::after{background:linear-gradient(180deg,rgba(228,241,252,.2) 0%,rgba(228,241,252,.7) 50%,rgba(251,235,214,.96) 100%) !important}
html[data-skin="b"] .rodape{background:linear-gradient(180deg,rgba(251,235,214,0),#FBEBD6 42%) !important}
/* cartões de vidro */
html[data-skin="b"] :is(.mo,.esc-op,.palp,.dv,.fb-op,.pgcab,.mg-bloco,.dica,.medidor,.fb-caixa,.fb-gap,.fb-porq,.arq-sec,
.sb-g,.cx,.radarBox,.cv2,.glos,.deg,.mgf,.mgg,.mg-art,.mg-tarefa,.mfato,.expandir,.retomar,.conta,.comu,.pf-bl,
.selo-papel,.pouso,.turma,.arq-raro,.falta,.pendencias,.mg-trava,.mg-desce,.mg-ext,.ident,.es-in,.fi-in,
.portao-sim,.mais,.it.cel,.mg-degrauzinho,.fi-erra,.es-i.zero,.tm-in,.fb-f){
background:rgba(255,255,255,.76) !important;border:1.5px solid rgba(255,255,255,.95) !important;border-radius:20px !important;
box-shadow:0 10px 26px rgba(20,60,120,.14) !important}
html[data-skin="b"] :is(.esc-op,.mo,.fb-op,.palp,.dv,.pgcab,.mg-bloco,.ident,.cx,.fb-caixa,.fb-porq,.portao-sim){-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
html[data-skin="b"] :is(.dv-le,.dv-fa,.arq-forte,.arq-risco,.arq-aprende,.arq-viz,.arq-fato,.fb-porq,.mg-bloco,.mgf,.mg-tarefa,.turma,.fi-erra,.mfato,.pouso,.selo-papel){
border-left:6px solid var(--c,#2BB5B0) !important}
html[data-skin="b"] :is(.dv-le,.arq-aprende){--c:#2BB5B0}
html[data-skin="b"] :is(.dv-fa,.arq-risco,.mfato,.mg-tarefa){--c:#F5C242}
html[data-skin="b"] .arq-forte{--c:#6CC24A}
html[data-skin="b"] .arq-viz{--c:#7B4FD0}
html[data-skin="b"] .arq-fato{--c:#F28C28}
html[data-skin="b"] .pgcab::before{width:0}
html[data-skin="b"] .pgcab{border-left:6px solid var(--fam,#2BB5B0) !important}
html[data-skin="b"] .mg-bloco{border-left-color:var(--c,#7B4FD0) !important}
html[data-skin="b"] .ch:is(*,.x.x.x){background:rgba(255,255,255,.84) !important;border:1.5px solid #fff !important;border-radius:999px !important;
box-shadow:0 4px 12px rgba(20,60,120,.12) !important;padding:12px 18px;color:#10233F !important}
html[data-skin="b"] .ch.on{background:#1B7F8A !important;color:#fff !important;border-color:#1B7F8A !important;box-shadow:0 4px 0 #125A62 !important}
html[data-skin="b"] .chips.multi .ch,html[data-skin="b"] .chips.linha .ch{border-radius:16px !important}
html[data-skin="b"] .chips.multi .ch::before{border-color:#8CC6F4;background:#fff;border-radius:6px}
html[data-skin="b"] .chips.multi .ch.on::before{background:#fff;border-color:#fff}
html[data-skin="b"] .chips.multi .ch.on::after{border-color:#1B7F8A}
html[data-skin="b"] :is(.esc-op,.mo,.fb-op,.palp){padding:15px 16px}
html[data-skin="b"] :is(.esc-op.on,.fb-op.on,.fb-op.certa,.palp.on,.mo.visto,.portao-sim){
background:rgba(255,255,255,.96) !important;border-color:#1B7F8A !important;box-shadow:0 0 0 2px #1B7F8A,0 10px 26px rgba(27,127,138,.22) !important}
html[data-skin="b"] :is(.esc-n,.mo-num,.mo-seta,.mgg-seta):is(*,.x.x.x){
background:#E4F1FC !important;border:0 !important;color:#1B7F8A !important;border-radius:50% !important;box-shadow:none}
html[data-skin="b"] .esc-op.on .esc-n:is(*,.x.x.x),html[data-skin="b"] .mo.visto .mo-num:is(*,.x.x.x){background:#1B7F8A !important;color:#fff !important}
html[data-skin="b"] .fb-f.on,html[data-skin="b"] .fi-pl.on,html[data-skin="b"] .mg-ext-bt.on{background:#1B7F8A !important;color:#fff !important;box-shadow:0 3px 0 #125A62 !important}
html[data-skin="b"] .fb-f{border-radius:14px !important}
html[data-skin="b"] .fb-fila{gap:5px}
/* botão: o laranja do pôr do sol, com sombra deslocada */
html[data-skin="b"] .btn{text-transform:none !important;letter-spacing:0 !important;font-size:17px !important;padding:16px 22px !important;
background:#F28C28 !important;color:#1F1200 !important;border:0 !important;border-radius:18px !important;
box-shadow:0 5px 0 #C96A14,0 12px 24px rgba(201,106,20,.28) !important}
html[data-skin="b"] .btn:hover{background:#F79A3E !important}
html[data-skin="b"] .btn:active:not(:disabled){transform:translateY(5px);box-shadow:0 0 0 #C96A14 !important}
html[data-skin="b"] .btn:disabled{background:rgba(255,255,255,.55) !important;color:#6B7A95 !important;box-shadow:none !important;border:1.5px solid rgba(255,255,255,.9) !important}
html[data-skin="b"] .btn.ghost{background:rgba(255,255,255,.7) !important;color:#10233F !important;border:1.5px solid #fff !important;box-shadow:0 4px 0 rgba(20,60,120,.15) !important}
html[data-skin="b"] #bok.avisa{background:#1B7F8A !important;color:#fff !important;box-shadow:0 5px 0 #125A62 !important}
html[data-skin="b"] #bok.avisa::before{display:none}
html[data-skin="b"] :is(.voltar,.aa):is(*,.x.x.x){background:rgba(255,255,255,.82) !important;border:1.5px solid #fff !important;border-radius:14px;box-shadow:0 4px 12px rgba(20,60,120,.12) !important;color:#10233F !important}
html[data-skin="b"] .topo{border-bottom:0 !important;padding-bottom:10px}
html[data-skin="b"] .trilha{gap:5px}
html[data-skin="b"] .trilha i{height:8px;border-radius:4px;background:rgba(255,255,255,.55) !important}
html[data-skin="b"] .trilha i.feito{background:#1B7F8A !important}
html[data-skin="b"] .trilha i.atual{background:#F28C28 !important}
html[data-skin="b"] .placar{color:#10233F !important}
html[data-skin="b"] .placar.pecas .pc-ico{color:#C2571A}
html[data-skin="b"] .mg-pips i,html[data-skin="b"] .pgcab-pips i{background:rgba(16,35,63,.12) !important;height:6px;border-radius:3px}
html[data-skin="b"] .mg-pips i.feito{background:var(--c,#7B4FD0) !important}
html[data-skin="b"] .mg-pips i.atual{background:#F28C28 !important}
html[data-skin="b"] .pgcab-pips i.feito{background:#8CC6F4 !important}
html[data-skin="b"] .pgcab-pips i.atual{box-shadow:none;background:#1B7F8A !important}
html[data-skin="b"] .medidor .n{color:#C2571A !important}
/* a grade de ferramentas e as células */
html[data-skin="b"] .it .disco{background:rgba(255,255,255,.86) !important;border:1.5px solid #fff !important;box-shadow:0 4px 12px rgba(20,60,120,.14) !important}
html[data-skin="b"] .it .disco::before{background:linear-gradient(0deg,#1B4F86,#1B7F8A 60%,#2BB5B0) !important}
html[data-skin="b"] .it .pips i{background:rgba(16,35,63,.14) !important}
html[data-skin="b"] .it[data-n="4"] .pips i,html[data-skin="b"] .it[data-n="5"] .pips i{background:#1B7F8A !important;box-shadow:none}
html[data-skin="b"] .it.cel[data-n="3"],html[data-skin="b"] .it.cel[data-n="4"],html[data-skin="b"] .it.cel[data-n="5"]{background:#E4F6F5 !important;border-color:#2BB5B0 !important}
html[data-skin="b"] .leg.escala .lg i{background:rgba(255,255,255,.8) !important;border-radius:4px}
html[data-skin="b"] .estrelas .st{color:rgba(16,35,63,.18)}
html[data-skin="b"] .estrelas .st.on{color:#1B7F8A}
html[data-skin="b"] .estrelas .st.on.alta{color:#F28C28}
html[data-skin="b"] .es-est i.on{color:#1B7F8A}
html[data-skin="b"] .glos-est i.on{color:#B4600A}
html[data-skin="b"] .it.cel .cel-q{background:#1B7F8A;color:#fff;box-shadow:none}
html[data-skin="b"] .mais-ico{background:#F28C28 !important;color:#1F1200 !important}
html[data-skin="b"] .mais-pts{background:#E4F1FC !important}
html[data-skin="b"] :is(.mg-saber,.fi-pl,.ct-bt,.fi-bt,.mg-ext-bt):is(*,.x.x.x){background:rgba(255,255,255,.86) !important;border:1.5px solid #fff !important;border-radius:999px !important;color:#10233F !important;box-shadow:0 4px 12px rgba(20,60,120,.12) !important}
html[data-skin="b"] :is(.ident-i,#obsTxt,.ct-email,.ct-cod,.comu-campos input,textarea.aberta,.aberta){background:#fff !important;border:2px solid #BFD9F0 !important;border-radius:14px !important;color:#10233F !important}
html[data-skin="b"] :is(.ident-i,#obsTxt,textarea.aberta):focus{border-color:#1B7F8A !important;box-shadow:0 0 0 4px rgba(27,127,138,.15) !important;outline:0}
html[data-skin="b"] .ident-r .obr{background:#F28C28;color:#1F1200}
html[data-skin="b"] .ident-r .opc{background:#E4F1FC !important;color:#3A4A66}
html[data-skin="b"] :is(.catmin,.mgf-deg,.falta-i,.exp-mais):is(*,.x.x.x){background:rgba(255,255,255,.8) !important;border-radius:999px;color:#3A4A66 !important}
/* capa: a ilha no céu, o título em duas cores */
html[data-skin="b"] .capa-arte{background:#3FA2EE url('assets/ilha-q5_acesso-b.webp') center 48%/cover no-repeat !important}
html[data-skin="b"] .capa-arte::after{background:linear-gradient(180deg,rgba(228,241,252,0) 0%,rgba(228,241,252,0) 72%,rgba(228,241,252,.55) 90%,#E4F1FC 100%)}
html[data-skin="b"] .capa-txt::before{height:6px;width:64px;border-radius:3px;background:#F28C28 !important}
html[data-skin="b"] #t-intro .tit-jogo,html[data-skin="b"] #t-intro .tit-jogo span{font-size:clamp(40px,12vw,60px);letter-spacing:-.02em;line-height:.92;
color:#10233F !important;-webkit-text-fill-color:#10233F !important;text-shadow:0 4px 0 rgba(255,255,255,.9)}
html[data-skin="b"] #t-intro .tit-jogo span:last-child{color:#1B7F8A !important;-webkit-text-fill-color:#1B7F8A !important}
html[data-skin="b"] .capa-txt > div[style*="display:flex"]{gap:8px !important}
html[data-skin="b"] .capa-txt .btn{padding:14px 20px !important;font-size:16px !important}
html[data-skin="b"] #capa-lead{font-size:14px !important;line-height:1.45}
html[data-skin="b"] .capa-txt > div[style*="display:flex"] > div{padding:8px 10px}
html[data-skin="b"] .capa-txt > div[style*="display:flex"] > div{flex:1;background:rgba(255,255,255,.76);border:1.5px solid #fff;border-radius:16px;padding:10px 12px;box-shadow:0 6px 16px rgba(20,60,120,.12)}
html[data-skin="b"] .capa-txt > div[style*="display:flex"] > div > div:first-child{color:#C2571A !important}
html[data-skin="b"] .skin-op img{border-radius:14px !important;border:2px solid #fff;box-shadow:0 6px 16px rgba(20,60,120,.16)}
html[data-skin="b"] .skin-op.atual img{border-color:#F28C28;box-shadow:0 0 0 3px #F28C28,0 6px 16px rgba(20,60,120,.16) !important}
/* o mapa: céu e mar como na arte */
html[data-skin="b"] #board{padding:0;background:#3FA2EE !important;border:1.5px solid #fff;box-shadow:0 10px 26px rgba(20,60,120,.18)}
html[data-skin="b"] #board .bg{background:linear-gradient(180deg,#3FA2EE 0%,#9FD0F6 34%,#FAB161 50%,#1E5BB0 56%,#062562 100%) !important}
html[data-skin="b"] .er-a{border:2px solid #fff;border-radius:12px;box-shadow:0 6px 14px rgba(0,20,60,.35)}
html[data-skin="b"] .est.ilhareal.agora .er-a{border-color:#F28C28;box-shadow:0 0 0 3px #F28C28,0 6px 14px rgba(0,20,60,.35)}
html[data-skin="b"] .est.ilhareal.feita .er-a{border-color:#6CC24A}
html[data-skin="b"] .est.ilhareal.falta .er-a{filter:saturate(.3) brightness(.75) opacity(.8)}
html[data-skin="b"] .er-n{background:rgba(255,255,255,.9);color:#10233F !important;border:0;border-radius:8px}
html[data-skin="b"] .er-b{background:#fff !important;color:#10233F;box-shadow:0 2px 6px rgba(0,20,60,.3)}
html[data-skin="b"] .est.ilhareal.feita .er-b{background:#3E8A2E !important;color:#fff}
html[data-skin="b"] .est.ilhareal.agora .er-b{background:#F28C28 !important;color:#1F1200}
html[data-skin="b"] #rota .trecho{stroke:rgba(255,255,255,.75);stroke-dasharray:2 6}
html[data-skin="b"] #rota .trecho.feito{stroke:#fff}
html[data-skin="b"] #rota .seta{fill:#F28C28}
html[data-skin="b"] #mt.tit-jogo,html[data-skin="b"] #mt.tit-jogo span{color:#10233F !important;-webkit-text-fill-color:#10233F !important;text-shadow:0 3px 0 rgba(255,255,255,.9)}
html[data-skin="b"] #msub{color:#C2571A !important}
html[data-skin="b"] #msub::after{background:#F28C28 !important}
html[data-skin="b"] .dg-ilha,html[data-skin="b"] .ilhamapa,html[data-skin="b"] .mg-descida,html[data-skin="b"] .cartaArq{border:2px solid #fff;border-radius:16px;box-shadow:0 8px 20px rgba(20,60,120,.18)}
html[data-skin="b"] .dg-item.agora .dg-ilha{border-color:#F28C28;box-shadow:0 0 0 3px #F28C28,0 8px 20px rgba(20,60,120,.18)}
html[data-skin="b"] .arq-nome,html[data-skin="b"] .fb-tit b,html[data-skin="b"] .dv-selo,html[data-skin="b"] .cx-n{color:#C2571A !important}
html[data-skin="b"] .dv-le .dv-selo{color:#1B7F8A !important}
html[data-skin="b"] :is(#escala,#ficha,#termo,#cardmodal,#naotem){background:rgba(228,241,252,.86)}
html[data-skin="b"] .tm-in{border-top:6px solid #F28C28;border-radius:22px 22px 0 0 !important}
html[data-skin="b"] .nudge,html[data-skin="b"] .expl{background:#10233F;border-radius:18px;box-shadow:0 10px 26px rgba(20,60,120,.3)}
html[data-skin="b"] .ganho{background:#F28C28;color:#1F1200;border-radius:999px;box-shadow:0 5px 0 #C96A14}
html[data-skin="b"] .cortina{background:#3FA2EE}
html[data-skin="b"] .fl-num{color:#10233F !important}
html[data-skin="b"] .fl-sub{color:#C2571A !important}
html[data-skin="b"] ::selection{background:#1B7F8A;color:#fff}
html[data-skin="b"] :is(.esc-op,.mo,.ch,.fb-op,.palp,.btn):focus-visible{outline:3px solid #F28C28;outline-offset:2px}
/* =====================================================================
4 · C · CARTOGRAFIA — a mesa do cartógrafo
⚠ VIROU CLARA EM 11/09/2026. O Giordano: "o fundo escuro nao ta batendo.
Seria melhor um fundo off white tb". A mesa escura brigava com a arte e
com as outras cinco linguagens, e jogava contraste invertido no meio do
instrumento. Agora o fundo É o papel (off-white #F4F0E6), a tinta é
sépia, o latão escureceu para #8A6A33 (o #B08D57 antigo era claro demais
sobre papel) e o vermelho FAROL é o que marca o escolhido.
Derivada da arte (papel rasgado, fio vermelho ligando alfinetes de
latão, mapas a lápis): o fundo é a folha; cada cartão é um pedaço de
PAPEL com grão e borda irregular; o que está escolhido ganha o fio vermelho em volta e um
alfinete de latão; o progresso é o próprio fio; números e marcadores
são latão. Spectral (serifa humanista) nos títulos e no corpo, Plex
Mono pequena nos rótulos. O botão é uma etiqueta de papel carimbada.
===================================================================== */
html[data-skin="c"]{--tex:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .30 0 0 0 0 .22 0 0 0 0 .12 0 0 0 .11 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}
html[data-skin="c"] :where(*:not(.fb-cod):not(.nt-cod):not(.pf-cod):not(.ct-cod):not(.tm-id)){font-family:Spectral,Alegreya,Georgia,'Times New Roman',serif !important}
html[data-skin="c"] :is(.mono,.mast,.rot,.label,.pgcab-n,.dv-selo,.fb-passo,.arq-r,.mg-bloco-n,.fl-sub,.fl-cheg,.es-mast,.fi-de,.mf-selo,.falta-cab,
.linha-pes,.rot-nota,.tu-selo,.pf-selo,.pf-cab,.comu-cab,.deg-f-d,.deg-g-d,.mgg-deg,.mg-art-rot,.fb-porq-s,.obs-ok,.mgd-selo,.skins-rot,
.pc-de,.catmin,.mgf-deg,.leg,.er-n,.er-b,.esc-n,.mo-num,.cx-cab,.rb-cab,.cv2-cab,.placar,.medidor .d,.tg-est,.ident-r .obr,.ident-r .opc,
.btn,.mg-degrauzinho,.fi-bt,.fi-pl,.mg-saber,.ct-bt,.mg-ext-bt,.pf-comp-t,.pular,.pular-tela,.mg-voltar,.catpg,.conta-chip,.ganho,
.capa-txt > .mono,.cel-q,.dg-bola,.ca-lk,.capa-arte-bt),
html[data-skin="c"] :is(.mast,.btn,.placar,.leg) *{font-family:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace !important}
html[data-skin="c"] :is(.title,.headline,.display,.tit-jogo,.fb-tit,.arq-nome,.es-tit,.fi-tit,.nt-tit,.pgcab-rot,.mg-bloco-nome,.mgf-nome,.mgg-nome,.dv-t,.ident-tit,.fb-caixa h4){font-weight:600 !important;letter-spacing:-.01em}
html[data-skin="c"] .title{font-size:clamp(23px,6.4vw,28px);line-height:1.18}
html[data-skin="c"] .body{font-size:15.5px;line-height:1.55}
html[data-skin="c"] .mast{font-weight:600 !important;letter-spacing:.16em;font-size:11.5px;color:#8A6A33 !important;text-transform:uppercase}
html[data-skin="c"] .mast::after{background:#DB1E2F !important;height:1px}
html[data-skin="c"] .mast.on-dark{color:#F1E9D8 !important}
/* a mesa */
html[data-skin="c"] #app{background:#F4F0E6 !important}
html[data-skin="c"] .tela,html[data-skin="c"] #flash{background:#F4F0E6 !important;
background-image:var(--tex),radial-gradient(120% 70% at 50% 0%,rgba(255,255,255,.045),transparent 60%) !important}
html[data-skin="c"] .capa-txt{background:#F4F0E6 !important;background-image:var(--tex) !important}
html[data-skin="c"] #cenafundo{opacity:1 !important;height:44% !important;background-position:center 40% !important}
html[data-skin="c"] #cenafundo::after{background:linear-gradient(180deg,rgba(244,240,230,0) 0%,rgba(244,240,230,.28) 22%,rgba(244,240,230,.82) 52%,rgba(244,240,230,.97) 100%) !important}
/* papel: todo cartão é um pedaço de papel creme, com grão e borda irregular;
dentro dele a tinta é escura (o remapeamento comum pintou de creme) */
html[data-skin="c"] :is(.mo,.esc-op,.palp,.dv,.fb-op,.pgcab,.mg-bloco,.dica,.medidor,.fb-caixa,.fb-gap,.fb-porq,.arq-sec,
.sb-g,.cx,.radarBox,.cv2,.glos,.deg,.mgf,.mgg,.mg-art,.mg-tarefa,.mfato,.expandir,.retomar,.conta,.comu,.pf-bl,
.selo-papel,.pouso,.turma,.arq-raro,.falta,.pendencias,.mg-trava,.mg-desce,.mg-ext,.ident,.es-in,.fi-in,
.portao-sim,.mais,.it.cel,.mg-degrauzinho,.fi-erra,.es-i.zero,.tm-in,.fb-f,.ch,.nudge,.expl,.conta-pop):is(*,.x.x.x){
background:#FFFCF6 !important;background-image:var(--tex) !important;border:0 !important;
border-radius:14px 5px 11px 7px/6px 12px 5px 13px !important;
box-shadow:2px 3px 0 rgba(42,33,24,.20),0 0 0 1px rgba(42,33,24,.06) !important;color:#2A2118 !important}
html[data-skin="c"] :is(.mo,.esc-op,.palp,.dv,.fb-op,.pgcab,.mg-bloco,.dica,.medidor,.fb-caixa,.fb-gap,.fb-porq,.arq-sec,
.sb-g,.cx,.radarBox,.cv2,.glos,.deg,.mgf,.mgg,.mg-art,.mg-tarefa,.mfato,.expandir,.retomar,.conta,.comu,.pf-bl,
.selo-papel,.pouso,.turma,.arq-raro,.falta,.pendencias,.mg-trava,.mg-desce,.mg-ext,.ident,.es-in,.fi-in,
.portao-sim,.mais,.it.cel,.mg-degrauzinho,.fi-erra,.es-i.zero,.tm-in,.fb-f,.ch,.nudge,.expl,.conta-pop):is(*,.x.x.x) *{color:#2A2118 !important}
/* dentro do papel: rótulos em vermelho-carimbo, secundário em sépia, mono em latão escuro */
html[data-skin="c"] :is(.mo,.esc-op,.palp,.dv,.fb-op,.pgcab,.mg-bloco,.fb-caixa,.fb-gap,.fb-porq,.arq-sec,.sb-g,.cx,.cv2,.glos,.deg,.mgf,.mgg,.mg-art,
.mg-tarefa,.mfato,.conta,.comu,.pf-bl,.selo-papel,.pouso,.turma,.arq-raro,.falta,.pendencias,.ident,.es-in,.fi-in,.mais,.it.cel,.fi-erra,.tm-in,.medidor,.dica):is(*,.x.x.x) :is(
.mo-n,.mo-dif,.dv-f,.fb-sub,.arq-d,.arq-nota,.cx-nota,.glos-p,.deg-pe,.deg-g-n,.mg-nota,.es-sub,.fi-sentido,.fi-pos,.pf-p,.pf-q,.pf-ul,.ct-msg,
.comu-p,.comu-n,.ident-sub,.ident-n,.ident-lgpd,.mg-porque,.fb-caixa-n,.fb-nota-p,.mgf-perg,.mgf-pe,.sb-int,.obs-sub,.fb-porque-n,.pc-de,
.tg-est,.menuop-pe,.menuop-rev,.mrev,.fb-metodo p,.consent p,.tm-corpo p,.glos-cab p,.deg-cab p,.mg-termo,.fi-termo,.medidor .d,.dica-mais,
.cx-r,.pf-ref,.fi-dica-gesto,.ct-recusa,.es-tx span,.mais-txt span,.palp-txt span,.leg.tres .z){color:#5A4A3A !important}
html[data-skin="c"] :is(.mo,.esc-op,.palp,.dv,.fb-op,.pgcab,.mg-bloco,.fb-caixa,.fb-gap,.fb-porq,.arq-sec,.sb-g,.cx,.cv2,.glos,.deg,.mgf,.mgg,.mg-art,
.mg-tarefa,.mfato,.conta,.comu,.pf-bl,.selo-papel,.pouso,.turma,.arq-raro,.falta,.pendencias,.ident,.es-in,.fi-in,.mais,.it.cel,.fi-erra,.tm-in,.medidor,.dica):is(*,.x.x.x) :is(
.mono,.mast,.rot,.esc-n,.mo-num,.mo-seta,.mgg-seta,.mgg-deg,.deg-f-d,.deg-g-d,.mg-art-rot,.leg,.catmin,.mgf-deg,.linha-pes,.rot-nota,.pf-comp-t,
.glos-cab .mono,.deg-cab .mono,.tm-cab .mono,.ct-cab span,.mgd){color:#7A5C2E !important}
html[data-skin="c"] :is(.mo,.esc-op,.palp,.dv,.fb-op,.pgcab,.mg-bloco,.fb-caixa,.fb-gap,.fb-porq,.arq-sec,.sb-g,.cx,.cv2,.glos,.deg,.mgf,.mgg,.mg-art,
.mg-tarefa,.mfato,.conta,.comu,.pf-bl,.selo-papel,.pouso,.turma,.arq-raro,.falta,.pendencias,.ident,.es-in,.fi-in,.mais,.it.cel,.fi-erra,.tm-in,.medidor,.dica):is(*,.x.x.x) :is(
.dv-selo,.fb-passo,.arq-r,.mg-bloco-n,.pgcab-n,.cx-cab,.rb-cab,.cv2-cab,.pf-cab,.comu-cab,.mf-selo,.falta-cab,.fb-porq-s,.es-mast,.fi-de,.tu-selo,
.pf-selo,.mgd-selo,.cx-n,.fb-tit b,.arq-viz-n,.fb-gap-l.destaque b,.dg-aqui,.ident-erro,.ct-msg.ruim,.comu-ok.ruim,.medidor .n,.tm-corpo h3,
.tm-corpo a,.consent-link,.ident-tit,.mais-txt b,.mg-tarefa b,.pendencias,.fi-erra b,.mg-ext-p,.mg-ext-bt,.glos-est i.on,.es-est i.on,.pf-obg){color:#AF0421 !important}
html[data-skin="c"] :is(.fb-trilha li)::marker{color:#AF0421}
/* o escolhido: fio vermelho em volta e alfinete de latão */
html[data-skin="c"] :is(.esc-op,.mo,.fb-op,.palp,.portao-sim,.ch,.fb-f,.fi-pl,.mg-ext-bt,.mg-saber,.ct-bt,.fi-bt){position:relative}
html[data-skin="c"] :is(.esc-op.on,.fb-op.on,.fb-op.certa,.palp.on,.mo.visto,.portao-sim,.fb-f.on,.fi-pl.on,.mg-ext-bt.on,.ch.on):is(*,.x.x.x.x){
background:#FFFCF6 !important;background-image:var(--tex) !important;box-shadow:2px 3px 0 rgba(42,33,24,.20),0 0 0 2px #DB1E2F !important;color:#2A2118 !important}
html[data-skin="c"] :is(.esc-op.on,.fb-op.on,.fb-op.certa,.palp.on,.mo.visto,.portao-sim)::before{content:'';display:block;position:absolute;top:-5px;left:14px;width:11px;height:11px;border-radius:50%;
background:radial-gradient(circle at 35% 30%,#F1DCA8,#8A6A33 55%,#6E5530);box-shadow:1px 2px 2px rgba(42,33,24,.18);z-index:2;opacity:1;inset:auto;transform:none}
html[data-skin="c"] .ch:is(*,.x.x.x){padding:11px 15px;font-weight:500 !important;border-radius:9px 4px 8px 5px/5px 9px 4px 10px !important;box-shadow:2px 2px 0 rgba(42,33,24,.20) !important}
html[data-skin="c"] .ch.on:is(*,.x.x.x.x),html[data-skin="c"] .ch.on:is(*,.x.x.x.x) *{background:#AF0421 !important;background-image:none !important;color:#FFF8EC !important;box-shadow:2px 2px 0 rgba(42,33,24,.20) !important}
html[data-skin="c"] .chips.multi .ch::before{border-color:#7A5C2E;background:#FFFAF0;border-radius:2px}
html[data-skin="c"] .chips.multi .ch.on::before{background:#FFF8EC;border-color:#FFF8EC}
html[data-skin="c"] .chips.multi .ch.on::after{border-color:#AF0421}
html[data-skin="c"] :is(.esc-op,.mo,.fb-op,.palp){padding:15px 16px}
html[data-skin="c"] .esc-n:is(*,.x.x.x.x),html[data-skin="c"] .mo-num:is(*,.x.x.x.x),html[data-skin="c"] .mo-seta:is(*,.x.x.x.x),html[data-skin="c"] .mgg-seta:is(*,.x.x.x.x){
background:transparent !important;border:1.5px solid #7A5C2E !important;color:#7A5C2E !important;border-radius:50% !important;box-shadow:none !important;font-size:12px}
html[data-skin="c"] .esc-op.on .esc-n:is(*,.x.x.x.x),html[data-skin="c"] .mo.visto .mo-num:is(*,.x.x.x.x){background:#DB1E2F !important;border-color:#DB1E2F !important;color:#FFF8EC !important}
html[data-skin="c"] .fb-f.on:is(*,.x.x.x.x),html[data-skin="c"] .fi-pl.on:is(*,.x.x.x.x),html[data-skin="c"] .mg-ext-bt.on:is(*,.x.x.x.x){background:#AF0421 !important;background-image:none !important;color:#FFF8EC !important}
html[data-skin="c"] .fb-f{border-radius:7px 3px 6px 4px/4px 7px 3px 8px !important;box-shadow:2px 2px 0 rgba(42,33,24,.20) !important;font-weight:600 !important}
html[data-skin="c"] .fb-fila{gap:5px}
html[data-skin="c"] .palp.on .palp-check:is(*,.x.x.x.x){background:#DB1E2F !important;border-color:#DB1E2F !important}
html[data-skin="c"] .palp-check{border:1.5px solid #7A5C2E !important;background:#FFFAF0 !important}
html[data-skin="c"] .palp-arte{border-radius:6px 3px 5px 3px;box-shadow:1px 2px 0 rgba(42,33,24,.18)}
html[data-skin="c"] .it.cel .cel-q:is(*,.x.x.x.x){background:#DB1E2F;color:#FFF8EC !important;border-radius:3px;box-shadow:1px 1px 0 rgba(42,33,24,.15)}
html[data-skin="c"] .mais-ico:is(*,.x.x.x.x){background:#AF0421 !important;color:#FFF8EC !important;border-radius:3px}
html[data-skin="c"] .mais-pts:is(*,.x.x.x.x){background:transparent !important;border:1px solid #7A5C2E;border-radius:3px;color:#7A5C2E !important}
/* botão: etiqueta de papel com carimbo vermelho */
/* ⚠ O BOTÃO É CARIMBO, NÃO ETIQUETA (11/09/2026). Sobre a mesa escura, um
botão de papel creme saltava; sobre o papel off-white ele sumia — papel
quase branco contra papel quase branco, que foi exatamente o defeito que
o Giordano viu ("nao da nem p ver a cor no botao"). Agora o botão é a
tinta: vermelho chapado, letra creme, e a moldura de latão por fora. */
html[data-skin="c"] .btn{background:#AF0421 !important;background-image:var(--tex) !important;color:#FFF8EC !important;border:2px solid #7A5C2E !important;border-radius:3px !important;
box-shadow:inset 0 0 0 3px #AF0421,inset 0 0 0 4px #FFF8EC,3px 4px 0 rgba(42,33,24,.35) !important;
font-weight:600 !important;font-size:13.5px !important;letter-spacing:.16em !important;text-transform:uppercase !important;padding:17px 20px !important;transform:rotate(-.6deg)}
html[data-skin="c"] .btn:hover{background-color:#8E0A1E !important}
html[data-skin="c"] .btn:active:not(:disabled){transform:rotate(-.6deg) translate(3px,4px);box-shadow:inset 0 0 0 3px #AF0421,inset 0 0 0 4px #FFF8EC,0 0 0 rgba(42,33,24,.35) !important}
html[data-skin="c"] .btn:disabled{background:transparent !important;background-image:none !important;color:#8A7A66 !important;border:1px dashed rgba(138,106,51,.5) !important;box-shadow:none !important;transform:none}
html[data-skin="c"] .btn.ghost{background:transparent !important;background-image:none !important;color:#2A2118 !important;border:1px solid rgba(138,106,51,.6) !important;box-shadow:none !important;transform:none}
html[data-skin="c"] #bok.avisa{background:#DB1E2F !important;background-image:none !important;color:#FFF8EC !important;border-color:#7A5C2E !important;box-shadow:inset 0 0 0 3px #DB1E2F,inset 0 0 0 4px #FFF8EC,3px 4px 0 rgba(42,33,24,.35) !important}
html[data-skin="c"] #bok.avisa::before{display:none}
html[data-skin="c"] :is(.voltar,.aa):is(*,.x.x.x){background:transparent !important;border:1px solid rgba(138,106,51,.6) !important;color:#2A2118 !important;border-radius:50%}
html[data-skin="c"] .aa{border-radius:6px}
html[data-skin="c"] .voltar svg{stroke:#2A2118 !important}
/* cabeçalho: o fio vermelho é o progresso */
html[data-skin="c"] .topo{border-bottom:1px solid rgba(138,106,51,.32) !important;padding-bottom:12px}
html[data-skin="c"] .trilha{gap:3px;align-items:center}
html[data-skin="c"] .trilha i{height:2px;border-radius:0;background:rgba(138,106,51,.3) !important}
html[data-skin="c"] .trilha i.feito{background:#DB1E2F !important}
html[data-skin="c"] .trilha i.atual{height:5px;background:#8A6A33 !important}
html[data-skin="c"] .placar{color:#2A2118 !important;font-weight:700}
html[data-skin="c"] .placar.pecas .pc-ico{color:#8A6A33}
html[data-skin="c"] .catpg{background:transparent !important;border:1px solid rgba(138,106,51,.4);color:#8A6A33 !important}
html[data-skin="c"] .conta-chip:is(*,.x.x.x){background:transparent !important;border-color:rgba(138,106,51,.6) !important;color:#2A2118 !important}
html[data-skin="c"] .mg-pips i,html[data-skin="c"] .pgcab-pips i{background:rgba(42,33,24,.18) !important;height:2px;border-radius:0}
html[data-skin="c"] .mg-pips i.feito,html[data-skin="c"] .pgcab-pips i.feito{background:#DB1E2F !important}
html[data-skin="c"] .mg-pips i.atual,html[data-skin="c"] .pgcab-pips i.atual{background:#7A5C2E !important;height:4px;box-shadow:none}
html[data-skin="c"] .pgcab::before{width:0}
html[data-skin="c"] .pgcab{border-left:4px solid var(--fam,#DB1E2F) !important}
html[data-skin="c"] .mg-bloco{border-left:4px solid #DB1E2F !important}
html[data-skin="c"] :is(.dv-le,.dv-fa,.arq-forte,.arq-risco,.arq-aprende,.arq-viz,.arq-fato,.fb-porq,.mgf,.mg-tarefa,.turma,.fi-erra,.mfato,.pouso,.selo-papel){border-left:4px solid #DB1E2F !important}
html[data-skin="c"] :is(.dv-le,.arq-aprende,.arq-forte){border-left-color:#8A6A33 !important}
/* a grade de ferramentas: moedas de papel sobre a mesa */
html[data-skin="c"] .it .disco{background:#FFFCF6 !important;background-image:var(--tex) !important;border:0 !important;box-shadow:2px 2px 0 rgba(42,33,24,.22),0 0 0 1px rgba(42,33,24,.06) !important}
html[data-skin="c"] .it .disco::before{background:#DB1E2F !important}
html[data-skin="c"] .it svg{fill:#5A4A3A}
html[data-skin="c"] .it .disco svg.marca-real{color:#2A2118}
html[data-skin="c"] .it[data-n="5"] .disco svg.marca-real,html[data-skin="c"] .it.tog[data-n="2"] .disco svg.marca-real{color:#FFF8EC !important}
html[data-skin="c"] .it .pips i{background:rgba(42,33,24,.22) !important}
html[data-skin="c"] .it[data-n="4"] .pips i,html[data-skin="c"] .it[data-n="5"] .pips i{background:#DB1E2F !important;box-shadow:none}
html[data-skin="c"] .it.cel[data-n="3"]:is(*,.x.x.x),html[data-skin="c"] .it.cel[data-n="4"]:is(*,.x.x.x),html[data-skin="c"] .it.cel[data-n="5"]:is(*,.x.x.x){
background:#FFFCF6 !important;box-shadow:2px 3px 0 rgba(42,33,24,.20),0 0 0 2px #DB1E2F !important}
html[data-skin="c"] .leg.escala .lg i{background:#FFFCF6 !important;border-radius:2px;box-shadow:1px 1px 0 rgba(42,33,24,.18)}
html[data-skin="c"] .leg.escala .lg i::after{background:#DB1E2F !important}
html[data-skin="c"] .estrelas .st{color:rgba(42,33,24,.2)}
html[data-skin="c"] .estrelas .st.on{color:#8A6A33}
html[data-skin="c"] .estrelas .st.on.alta{color:#AF0421}
html[data-skin="c"] :is(.mg-saber,.fi-pl,.ct-bt,.fi-bt,.mg-ext-bt):is(*,.x.x.x){background:#FFFCF6 !important;background-image:var(--tex) !important;border:0 !important;border-radius:8px 3px 7px 4px/4px 8px 3px 9px !important;color:#2A2118 !important;box-shadow:2px 2px 0 rgba(42,33,24,.20) !important}
html[data-skin="c"] :is(.ident-i,#obsTxt,.ct-email,.ct-cod,.comu-campos input,textarea.aberta,.aberta):is(*,.x.x.x.x){
background:#FFFAF0 !important;background-image:none !important;border:0 !important;border-bottom:2px solid #7A5C2E !important;border-radius:4px 4px 0 0 !important;color:#2A2118 !important;caret-color:#DB1E2F;box-shadow:none !important}
html[data-skin="c"] :is(.ident-i,#obsTxt,textarea.aberta):focus{border-bottom-color:#DB1E2F !important;outline:0}
html[data-skin="c"] :is(.ident-i,#obsTxt,textarea.aberta)::placeholder{color:#8A7A66 !important}
html[data-skin="c"] .ident-r .obr:is(*,.x.x.x.x){background:#AF0421;color:#FFF8EC !important;border-radius:2px}
html[data-skin="c"] .ident-r .opc:is(*,.x.x.x.x){background:transparent !important;border:1px solid #7A5C2E !important;color:#7A5C2E !important;border-radius:2px}
html[data-skin="c"] :is(.catmin,.mgf-deg,.falta-i,.exp-mais):is(*,.x.x.x){background:transparent !important;border:1px solid rgba(138,106,51,.5);border-radius:2px;color:#8A6A33 !important;text-transform:uppercase;letter-spacing:.08em;font-size:11px}
/* capa: a arte e o título em serifa */
html[data-skin="c"] .capa-arte{background:#F4F0E6 url('assets/ilha-q5_acesso-c.webp') center 46%/cover no-repeat !important}
html[data-skin="c"] .capa-arte::after{background:linear-gradient(180deg,rgba(244,240,230,.1) 0%,rgba(244,240,230,0) 40%,rgba(244,240,230,.75) 82%,#F4F0E6 100%)}
html[data-skin="c"] .capa-topo .marca{color:#F1E9D8 !important}
html[data-skin="c"] .capa-txt::before{height:1px;width:100%;background:#DB1E2F !important;margin-bottom:14px}
html[data-skin="c"] .capa-txt > .mono{color:#8A6A33 !important;letter-spacing:.16em;text-transform:uppercase;font-size:11.5px !important}
html[data-skin="c"] #t-intro .tit-jogo,html[data-skin="c"] #t-intro .tit-jogo span{font-family:Spectral,Georgia,serif !important;font-weight:600 !important;font-size:clamp(44px,13.5vw,66px);letter-spacing:-.03em;line-height:.98;text-transform:none;
color:#2A2118 !important;-webkit-text-fill-color:#2A2118 !important;text-shadow:none}
html[data-skin="c"] #t-intro .tit-jogo span:last-child{font-style:italic;font-weight:500 !important;color:#AF0421 !important;-webkit-text-fill-color:#AF0421 !important}
html[data-skin="c"] #capa-lead{font-size:15.5px !important}
html[data-skin="c"] .capa-txt > div[style*="display:flex"]{gap:10px !important}
html[data-skin="c"] .capa-txt > div[style*="display:flex"] > div{flex:1;background:#FFFCF6;background-image:var(--tex);border-radius:9px 4px 8px 5px/5px 9px 4px 10px;padding:9px 12px;box-shadow:2px 3px 0 rgba(42,33,24,.20)}
html[data-skin="c"] .capa-txt > div[style*="display:flex"] > div > div:first-child{font-family:Spectral,serif !important;font-weight:600 !important;font-size:26px !important;color:#2A2118 !important}
html[data-skin="c"] .capa-txt > div[style*="display:flex"] > div > .mono,html[data-skin="c"] .capa-txt > div[style*="display:flex"] > div > .mono[style]{color:#7A5C2E !important;opacity:1 !important;letter-spacing:.14em;font-size:10.5px !important}
html[data-skin="c"] .skins-rot{color:#8A6A33 !important;text-transform:uppercase;letter-spacing:.16em}
html[data-skin="c"] .skin-op img{border-radius:8px 3px 7px 4px/4px 8px 3px 9px !important;border:0 !important;box-shadow:2px 3px 0 rgba(42,33,24,.22),0 0 0 1px rgba(138,106,51,.35)}
html[data-skin="c"] .skin-op.atual img{box-shadow:2px 3px 0 rgba(42,33,24,.22),0 0 0 2px #DB1E2F !important;border:0 !important}
html[data-skin="c"] .skins.skins-tela .skin-op img{border:0 !important}
html[data-skin="c"] .skin-op span{font-style:italic;font-size:14px}
html[data-skin="c"] .capa-arte-bt,html[data-skin="c"] .ca-lk{text-decoration-color:#DB1E2F}
/* o mapa: a mesa com a grade a lápis; as ilhas são recortes de papel */
html[data-skin="c"] #board{border:1px solid rgba(138,106,51,.35);border-radius:4px;background:#F4F0E6 !important;box-shadow:none}
html[data-skin="c"] #board .bg{background:#F4F0E6 !important;background-image:var(--tex),linear-gradient(rgba(138,106,51,.20) 1px,transparent 1px),linear-gradient(90deg,rgba(138,106,51,.20) 1px,transparent 1px) !important;background-size:160px 160px,28px 28px,28px 28px !important}
html[data-skin="c"] .er-a{border:0;border-radius:8px 3px 7px 4px/4px 8px 3px 9px;box-shadow:2px 3px 0 rgba(42,33,24,.22),0 0 0 1px rgba(138,106,51,.3);background-color:#F4F0E6}
html[data-skin="c"] .est.ilhareal.agora .er-a{box-shadow:2px 3px 0 rgba(42,33,24,.22),0 0 0 2px #DB1E2F}
html[data-skin="c"] .est.ilhareal.feita .er-a{box-shadow:2px 3px 0 rgba(42,33,24,.22),0 0 0 1px #8A6A33}
html[data-skin="c"] .est.ilhareal.falta .er-a{filter:grayscale(.8) opacity(.42)}
html[data-skin="c"] .er-n{background:#FFFCF6;background-image:var(--tex);color:#2A2118 !important;border:0;border-radius:3px;box-shadow:1px 2px 0 rgba(42,33,24,.22);font-weight:500 !important;text-transform:uppercase;letter-spacing:.06em;font-size:10.5px !important}
html[data-skin="c"] .er-b{background:radial-gradient(circle at 35% 30%,#F1DCA8,#8A6A33 55%,#6E5530) !important;color:#2A2118;border:0;box-shadow:1px 2px 3px rgba(42,33,24,.22);font-size:11px}
html[data-skin="c"] .est.ilhareal.feita .er-b{background:#AF0421 !important;color:#FFF8EC}
html[data-skin="c"] .est.ilhareal.agora .er-b{background:#DB1E2F !important;color:#FFF8EC}
html[data-skin="c"] .est.ilhareal.agora .er-n{color:#AF0421 !important}
html[data-skin="c"] #rota .trecho{stroke:rgba(138,106,51,.45);stroke-dasharray:3 4}
html[data-skin="c"] #rota .trecho.feito{stroke:#DB1E2F;stroke-dasharray:none}
html[data-skin="c"] #rota .seta{fill:#8A6A33}
html[data-skin="c"] #mt.tit-jogo,html[data-skin="c"] #mt.tit-jogo span{font-family:Spectral,serif !important;font-weight:600 !important;text-transform:none;letter-spacing:-.02em;color:#2A2118 !important;-webkit-text-fill-color:#2A2118 !important}
html[data-skin="c"] #msub{color:#8A6A33 !important}
html[data-skin="c"] #msub::after{background:#DB1E2F !important}
html[data-skin="c"] .dg-ilha,html[data-skin="c"] .ilhamapa,html[data-skin="c"] .mg-descida,html[data-skin="c"] .cartaArq{border:0;border-radius:10px 4px 8px 5px/5px 10px 4px 11px;box-shadow:2px 3px 0 rgba(42,33,24,.22),0 0 0 1px rgba(138,106,51,.3)}
html[data-skin="c"] .dg-item.agora .dg-ilha{box-shadow:2px 3px 0 rgba(42,33,24,.22),0 0 0 2px #DB1E2F;border:0}
html[data-skin="c"] .dg-item.feito .dg-bola{background:#AF0421 !important;color:#FFF8EC}
html[data-skin="c"] .dg-item.agora .dg-bola{background:#8A6A33 !important;color:#2A2118}
html[data-skin="c"] .cartaArq-tx b{font-family:Spectral,serif !important;font-weight:600}
html[data-skin="c"] .cartaArq-tx .mono{color:#8A6A33}
html[data-skin="c"] .arq-nome{color:#2A2118 !important}
html[data-skin="c"] .fb-tit b{color:#AF0421 !important}
html[data-skin="c"] .fb-passo,html[data-skin="c"] .fi-de,html[data-skin="c"] .es-mast{color:#8A6A33 !important}
html[data-skin="c"] :is(#escala,#ficha,#termo,#cardmodal,#naotem){background:rgba(244,240,230,.88)}
html[data-skin="c"] .tm-in{border-top:3px solid #DB1E2F !important;border-radius:6px 6px 0 0 !important}
html[data-skin="c"] .es-in,html[data-skin="c"] .fi-in{border-top:3px solid #DB1E2F !important}
html[data-skin="c"] .nudge,html[data-skin="c"] .expl{border-top:3px solid #DB1E2F !important}
html[data-skin="c"] .ganho{background:#AF0421;color:#FFF8EC;border-radius:3px;box-shadow:2px 3px 0 rgba(42,33,24,.22);letter-spacing:.1em;text-transform:uppercase}
html[data-skin="c"] .cortina{background:#DB1E2F}
html[data-skin="c"] .fl-num{font-family:Spectral,serif !important;font-weight:600;color:#2A2118 !important}
html[data-skin="c"] .fl-sub{color:#8A6A33 !important;text-transform:uppercase;letter-spacing:.16em}
html[data-skin="c"] ::selection{background:#DB1E2F;color:#FFF8EC}
html[data-skin="c"] :is(.esc-op,.mo,.ch,.fb-op,.palp,.btn,.voltar,.aa):focus-visible{outline:2px solid #DB1E2F;outline-offset:3px}
/* =====================================================================
5 · D · PAPEL RECORTADO — claro, quente, com peso de papel
Creme, superfícies brancas como folhas soltas, sombra dura de papel
(0 4px 0), cantos muito arredondados, Nunito, terracota como acento.
As ilhas de paper craft (skin D) ficam como estão.
===================================================================== */
html[data-skin="d"] *:not(.fb-cod):not(.nt-cod):not(.pf-cod):not(.ct-cod):not(.tm-id){
font-family:Nunito,'Baloo 2',system-ui,-apple-system,sans-serif !important}
html[data-skin="d"] :is(.title,.headline,.display,.tit-jogo,.fb-tit,.arq-nome,.es-tit,.fi-tit,.nt-tit,.pgcab-rot,.mg-bloco-nome,.mgf-nome,.mgg-nome,.palp-txt b){font-weight:900 !important}
html[data-skin="d"] .title{font-size:clamp(21px,5.8vw,26px);letter-spacing:-.01em;line-height:1.18}
html[data-skin="d"] .body{font-size:15px;line-height:1.55;font-weight:600}
html[data-skin="d"] .mast{font-weight:800 !important;letter-spacing:.12em;font-size:12px}
html[data-skin="d"] .mast::after{height:3px;border-radius:2px}
html[data-skin="d"] :is(.btn,.ch,.esc-op,.mo,.fb-op,.palp,.portao-sim,.mg-saber,.fi-pl,.ct-bt,.fi-bt,.mg-ext-bt){font-weight:800 !important}
html[data-skin="d"] .btn{
text-transform:none !important;letter-spacing:0 !important;font-size:16px !important;padding:16px 22px !important;
background:#C9553D !important;color:#FFFDF8 !important;border-radius:18px !important;
box-shadow:0 5px 0 #8F3A29 !important;border:0 !important}
html[data-skin="d"] .btn:hover{background:#B84B35 !important}
html[data-skin="d"] .btn:active:not(:disabled){transform:translateY(5px);box-shadow:0 0 0 #8F3A29 !important}
html[data-skin="d"] .btn:disabled{background:#F2E6D4 !important;color:#B3A08C !important;box-shadow:0 4px 0 #E3D3BE !important}
html[data-skin="d"] .btn.ghost{background:#FFFDF8 !important;color:#6B5A4E !important;border:0 !important;box-shadow:0 4px 0 #E3D3BE !important}
html[data-skin="d"] #bok.avisa{background:#DB1E2F !important;box-shadow:0 5px 0 #8A0F1C !important}
html[data-skin="d"] #bok.avisa::before{display:none}
/* folhas de papel */
html[data-skin="d"] :is(.mo,.esc-op,.palp,.dv,.fb-op,.pgcab,.mg-bloco,.dica,.medidor,.fb-caixa,.fb-gap,.fb-porq,.arq-sec,
.sb-g,.cx,.radarBox,.cv2,.glos,.deg,.mgf,.mgg,.mg-art,.mg-tarefa,.mfato,.expandir,.retomar,.conta,.comu,.pf-bl,
.selo-papel,.pouso,.turma,.arq-raro,.falta,.pendencias,.mg-trava,.mg-desce,.mg-ext,.ident,.es-in,.fi-in,
.portao-sim,.mais,.it.cel,.mg-degrauzinho,.fi-erra,.es-i.zero,.tm-in,.fb-f,#board){
background:#FFFDF8 !important;border:0 !important;border-radius:22px !important;
box-shadow:0 4px 0 #E6D6C0 !important}
html[data-skin="d"] :is(.dv-le,.dv-fa,.arq-forte,.arq-risco,.arq-aprende,.arq-viz,.arq-fato,.fb-porq,.mg-bloco,.mgf,.mg-tarefa,.turma,.fi-erra,.mfato,.pouso,.selo-papel){
border-left:6px solid var(--c,#C9553D) !important}
html[data-skin="d"] :is(.dv-le,.arq-aprende){--c:#1F6F7A}
html[data-skin="d"] :is(.dv-fa,.arq-risco,.mfato,.mg-tarefa){--c:#E0A030}
html[data-skin="d"] .arq-forte{--c:#5E8C61}
html[data-skin="d"] .arq-viz{--c:#6B45B8}
html[data-skin="d"] .arq-fato{--c:#C9B9A4}
html[data-skin="d"] .pgcab::before{width:0}
html[data-skin="d"] .pgcab{border-left:6px solid var(--fam,#C9553D) !important}
html[data-skin="d"] .mg-bloco{border-left-color:var(--c,#C9553D) !important}
html[data-skin="d"] .ch{background:#FFFDF8 !important;border:0 !important;border-radius:999px !important;
box-shadow:0 3px 0 #E6D6C0 !important;padding:12px 18px;color:#2B1F17 !important}
html[data-skin="d"] .ch:active{transform:translateY(3px);box-shadow:none !important}
html[data-skin="d"] .ch.on{background:#C9553D !important;color:#FFFDF8 !important;box-shadow:0 3px 0 #8F3A29 !important}
html[data-skin="d"] .chips.multi .ch,html[data-skin="d"] .chips.linha .ch{border-radius:16px !important}
html[data-skin="d"] .chips.multi .ch::before{border-color:#C9B9A4;background:#FFF6E9;border-radius:5px}
html[data-skin="d"] .chips.multi .ch.on::before{background:#FFFDF8;border-color:#FFFDF8}
html[data-skin="d"] .chips.multi .ch.on::after{border-color:#C9553D}
html[data-skin="d"] :is(.esc-op,.mo,.fb-op,.palp){padding:15px 16px;border-radius:20px !important}
html[data-skin="d"] :is(.esc-op.on,.fb-op.on,.fb-op.certa,.palp.on,.mo.visto,.portao-sim){
background:#FFFDF8 !important;box-shadow:0 4px 0 #C9553D,inset 0 0 0 2px #C9553D !important}
html[data-skin="d"] .esc-op:active,html[data-skin="d"] .mo:active,html[data-skin="d"] .fb-op:active,html[data-skin="d"] .palp:active{transform:translateY(4px);box-shadow:none !important}
html[data-skin="d"] .esc-n,html[data-skin="d"] .mo-num,html[data-skin="d"] .mo-seta,html[data-skin="d"] .mgg-seta{
background:#F2E6D4 !important;border:0 !important;color:#6B5A4E !important;box-shadow:0 2px 0 #E6D6C0}
html[data-skin="d"] .esc-op.on .esc-n,html[data-skin="d"] .mo.visto .mo-num{background:#C9553D !important;color:#FFFDF8 !important;box-shadow:0 2px 0 #8F3A29}
html[data-skin="d"] .fb-f.on,html[data-skin="d"] .fi-pl.on,html[data-skin="d"] .mg-ext-bt.on{background:#C9553D !important;color:#FFFDF8 !important;box-shadow:0 3px 0 #8F3A29 !important}
html[data-skin="d"] .fb-f{border-radius:14px !important;box-shadow:0 3px 0 #E6D6C0 !important}
html[data-skin="d"] .fb-fila{gap:5px}
html[data-skin="d"] :is(.voltar,.aa){background:#FFFDF8 !important;border:0 !important;box-shadow:0 3px 0 #E6D6C0 !important;border-radius:12px}
html[data-skin="d"] :is(.voltar,.aa):active{transform:translateY(3px);box-shadow:none !important}
html[data-skin="d"] .topo{border-bottom:0 !important;padding-bottom:10px}
html[data-skin="d"] .trilha{gap:5px}
html[data-skin="d"] .trilha i{height:8px;border-radius:4px;background:#F2E6D4 !important;box-shadow:0 2px 0 #E6D6C0}
html[data-skin="d"] .trilha i.feito{background:#C9553D !important;box-shadow:0 2px 0 #8F3A29}
html[data-skin="d"] .trilha i.atual{background:#DB1E2F !important;box-shadow:0 2px 0 #8A0F1C}
html[data-skin="d"] .medidor{padding:12px 16px}
html[data-skin="d"] .medidor .n{color:#C9553D !important}
html[data-skin="d"] .it .disco{background:#FFFDF8 !important;border:0 !important;box-shadow:0 3px 0 #E6D6C0 !important}
html[data-skin="d"] .it:active .disco{transform:translateY(3px) !important;box-shadow:none !important}
html[data-skin="d"] .it .disco::before{background:linear-gradient(0deg,#1F4A5C,#17A6A6 60%,#5ED6D6) !important}
html[data-skin="d"] .it .pips i{background:#E6D6C0 !important}
html[data-skin="d"] .it[data-n="4"] .pips i,html[data-skin="d"] .it[data-n="5"] .pips i{background:#17A6A6 !important;box-shadow:none}
html[data-skin="d"] .it.cel{padding:11px 4px 8px}
html[data-skin="d"] .it.cel[data-n="3"],html[data-skin="d"] .it.cel[data-n="4"],html[data-skin="d"] .it.cel[data-n="5"]{
background:#E9F6F6 !important;box-shadow:0 4px 0 #A9DADA !important}
html[data-skin="d"] .grade.inv{gap:8px !important}
html[data-skin="d"] .leg.escala .lg i{background:#F2E6D4 !important;border-radius:4px}
html[data-skin="d"] .estrelas .st.on{color:#17A6A6}
html[data-skin="d"] .estrelas .st.on.alta{color:#C9553D}
html[data-skin="d"] .es-est i.on{color:#17A6A6}
html[data-skin="d"] .glos-est i.on{color:#E0A030}
html[data-skin="d"] .it.cel .cel-q{background:#1F6F7A;color:#fff;box-shadow:0 2px 0 #163F47}
html[data-skin="d"] .mais-ico{background:#C9553D !important;color:#fff !important;box-shadow:0 2px 0 #8F3A29}
html[data-skin="d"] .mais-pts{background:#F2E6D4 !important}
html[data-skin="d"] :is(.mg-saber,.fi-pl,.ct-bt,.fi-bt,.mg-ext-bt){background:#FFFDF8 !important;border:0 !important;box-shadow:0 3px 0 #E6D6C0 !important;color:#2B1F17 !important;border-radius:999px !important}
html[data-skin="d"] :is(.ident-i,#obsTxt,.ct-email,.ct-cod,.comu-campos input,textarea.aberta,.aberta){
background:#FFFDF8 !important;border:2px solid #E6D6C0 !important;border-radius:16px !important;color:#2B1F17 !important}
html[data-skin="d"] :is(.ident-i,#obsTxt,textarea.aberta):focus{border-color:#C9553D !important;box-shadow:0 0 0 4px rgba(201,85,61,.14) !important;outline:0}
html[data-skin="d"] .ident-r .obr{background:#C9553D}
html[data-skin="d"] .ident-r .opc{background:#F2E6D4 !important;color:#6B5A4E}
html[data-skin="d"] .catmin,html[data-skin="d"] .mgf-deg,html[data-skin="d"] .falta-i,html[data-skin="d"] .exp-mais{background:#F2E6D4 !important;border-radius:999px;color:#6B5A4E !important}
html[data-skin="d"] .mg-pips i,html[data-skin="d"] .pgcab-pips i{background:#F2E6D4 !important;height:5px;border-radius:3px}
html[data-skin="d"] .mg-pips i.feito{background:var(--c,#C9553D) !important}
html[data-skin="d"] .pgcab-pips i.feito{background:#C9B9A4 !important}
html[data-skin="d"] .pgcab-pips i.atual{box-shadow:none}
html[data-skin="d"] .mg-pips i.atual{background:#2B1F17 !important}
/* a capa e o mapa */
html[data-skin="d"] .capa-arte{background:url('assets/ilha-q5_acesso-d.webp') center 40%/cover no-repeat !important}
html[data-skin="d"] .capa-arte::after{background:linear-gradient(180deg,rgba(255,246,233,0) 0%,rgba(255,246,233,0) 50%,rgba(255,246,233,.6) 80%,#FFF6E9 100%)}
html[data-skin="d"] .capa-topo .marca{color:#2B1F17 !important}
html[data-skin="d"] .capa-txt::before{height:6px;width:64px;border-radius:3px;background:#C9553D !important;box-shadow:0 3px 0 #8F3A29}
html[data-skin="d"] #t-intro .tit-jogo,html[data-skin="d"] #t-intro .tit-jogo span{font-size:clamp(44px,13.5vw,68px);letter-spacing:-.03em;line-height:.92;color:#C9553D !important;-webkit-text-fill-color:#C9553D !important;text-shadow:0 4px 0 #E6D6C0}
html[data-skin="d"] .capa-txt > div[style*="display:flex"] > div{flex:1;background:#FFFDF8;border-radius:16px;padding:10px 12px;box-shadow:0 4px 0 #E6D6C0}
html[data-skin="d"] .capa-txt > div[style*="display:flex"]{gap:8px !important}
html[data-skin="d"] .skin-op img{border-radius:14px !important;border:0;box-shadow:0 3px 0 #E6D6C0}
html[data-skin="d"] .skin-op.atual img{box-shadow:0 3px 0 #8F3A29,0 0 0 3px #C9553D !important}
html[data-skin="d"] #board{padding:6px;background:#FFFDF8 !important}
html[data-skin="d"] #board .bg{background:#E9F6F6 !important;border-radius:16px;inset:6px}
html[data-skin="d"] .er-a{border:0;border-radius:12px;box-shadow:0 3px 0 #C9B9A4}
html[data-skin="d"] .est.ilhareal.agora .er-a{box-shadow:0 3px 0 #8F3A29,0 0 0 3px #C9553D}
html[data-skin="d"] .er-n{background:#FFFDF8;color:#2B1F17 !important;border-radius:8px;box-shadow:0 2px 0 #E6D6C0}
html[data-skin="d"] .er-b{background:#F2E6D4 !important;color:#6B5A4E;box-shadow:0 2px 0 #C9B9A4}
html[data-skin="d"] .est.ilhareal.feita .er-b{background:#5E8C61 !important;color:#fff}
html[data-skin="d"] .est.ilhareal.agora .er-b{background:#C9553D !important;color:#fff}
html[data-skin="d"] #rota .trecho{stroke:#C9B9A4;stroke-width:1.2}
html[data-skin="d"] #rota .trecho.feito{stroke:#C9553D}
html[data-skin="d"] #rota .seta{fill:#C9553D}
html[data-skin="d"] #mt.tit-jogo,html[data-skin="d"] #mt.tit-jogo span{color:#C9553D !important;-webkit-text-fill-color:#C9553D !important;text-shadow:0 3px 0 #E6D6C0}
html[data-skin="d"] .dg-ilha{border-radius:14px;box-shadow:0 3px 0 #C9B9A4;border:0}
html[data-skin="d"] .cartaArq{border:0;border-radius:22px;box-shadow:0 6px 0 #E6D6C0}
html[data-skin="d"] .ilhamapa{border:0;box-shadow:0 5px 0 #E6D6C0}
html[data-skin="d"] .arq-nome{color:#C9553D !important}
html[data-skin="d"] .fb-tit b{color:#C9553D !important}
html[data-skin="d"] .dv-selo{color:#C9553D !important}
html[data-skin="d"] .cx-n{color:#C9553D !important}
html[data-skin="d"] .placar.pecas .pc-ico{color:#C9553D}
html[data-skin="d"] :is(#escala,#ficha,#termo,#cardmodal,#naotem){background:rgba(255,246,233,.86)}
html[data-skin="d"] .tm-in{border-top:6px solid #C9553D;border-radius:22px 22px 0 0 !important}
html[data-skin="d"] .nudge,html[data-skin="d"] .expl{background:#2B1F17;border-radius:18px;box-shadow:0 5px 0 #14100C}
html[data-skin="d"] .ganho{background:#C9553D;box-shadow:0 5px 0 #8F3A29}
html[data-skin="d"] .cortina{background:#C9553D}
html[data-skin="d"] ::selection{background:#C9553D;color:#fff}
/* =====================================================================
6 · E · 16-BIT — console, pixel, borda grossa
Press Start 2P nos títulos e botões, Plex Mono no corpo, bordas de 4px
pretas, sombra dura deslocada, paleta curta, tudo pixelado. Fundo com
xadrez de 8px, bem discreto, no lugar do gradiente.
===================================================================== */
html[data-skin="e"] *{font-family:'IBM Plex Mono',ui-monospace,monospace !important;text-shadow:none}
html[data-skin="e"] :is(.title,.headline,.display,.tit-jogo,.btn,.mast,.fb-tit,.arq-nome,.es-tit,.fi-tit,.nt-tit,.placar,
.pgcab-rot,.mg-bloco-nome,.mgf-nome,.mgg-nome,.medidor .n,.fl-num,.fl-txt,.fb-passo,.dv-selo,.mg-bloco-n,.esc-n,
.mo-num,.cx-n,.fb-gap-l b,.pf-g b,.mgd-selo,.exp-mais,.mais-pts,.er-b,.dg-bola,.cel-q,.skins-rot,.capa-txt > div[style*="display:flex"] > div > div:first-child){
font-family:'Press Start 2P','IBM Plex Mono',monospace !important;letter-spacing:0 !important}
html[data-skin="e"] :is(.title,.headline,.display,.tit-jogo,.btn,.mast,.fb-tit,.arq-nome,.es-tit,.fi-tit,.nt-tit,.placar) *{font-family:'Press Start 2P','IBM Plex Mono',monospace !important}
html[data-skin="e"] .title{font-size:clamp(13px,3.6vw,15px);line-height:1.6;font-weight:400;text-transform:uppercase;color:#FFC53D !important;
text-shadow:2px 2px 0 #000}
html[data-skin="e"] .title.title-pg{font-size:11px;opacity:1}
html[data-skin="e"] .body{font-size:13.5px;line-height:1.6}
html[data-skin="e"] .mast{font-size:9px;letter-spacing:0;line-height:1.4;color:#5EE6E6 !important}
html[data-skin="e"] .mast::after{height:4px;width:32px;background:#5EE6E6 !important;box-shadow:2px 2px 0 #000}
html[data-skin="e"] .mast.on-dark{color:#F4F6FF !important}
html[data-skin="e"] :is(.fb-passo,.dv-selo,.mg-bloco-n,.skins-rot){font-size:9px;line-height:1.5}
html[data-skin="e"] .placar{font-size:15px !important;color:#FFC53D !important;text-shadow:2px 2px 0 #000}
html[data-skin="e"] .placar.pecas .pc-ico{font-size:13px;color:#FF7A2F}
html[data-skin="e"] .pc-de{font-size:9px !important}
html[data-skin="e"] .medidor .n{font-size:22px;color:#FFC53D !important;text-shadow:2px 2px 0 #000}
html[data-skin="e"] .tela{
background:#0B1E3A repeating-conic-gradient(#0D2242 0 25%,#0B1E3A 0 50%) 0 0/8px 8px !important}
html[data-skin="e"] #t-intro .tit-jogo,html[data-skin="e"] #t-intro .tit-jogo span{font-size:clamp(24px,7.4vw,36px);line-height:1.25;letter-spacing:0;font-weight:400;
color:#FFC53D !important;-webkit-text-fill-color:#FFC53D !important;text-shadow:4px 4px 0 #000,4px 4px 0 #000;
filter:none !important}
html[data-skin="e"] #mt.tit-jogo,html[data-skin="e"] #mt.tit-jogo span{font-size:clamp(18px,5.4vw,26px);line-height:1.3;color:#FFC53D !important;-webkit-text-fill-color:#FFC53D !important;text-shadow:3px 3px 0 #000}
html[data-skin="e"] :is(#cenafundo,.er-a,.dg-ilha,.ilhamapa,.mg-descida,#flfoto,.cartaArq img,.palp-arte img,.skin-op img,.capa-arte,#board .bg,.it .disco img){image-rendering:pixelated}
/* caixas de diálogo de RPG */
html[data-skin="e"] :is(.mo,.esc-op,.palp,.dv,.fb-op,.pgcab,.mg-bloco,.dica,.medidor,.fb-caixa,.fb-gap,.fb-porq,.arq-sec,
.sb-g,.cx,.radarBox,.cv2,.glos,.deg,.mgf,.mgg,.mg-art,.mg-tarefa,.mfato,.expandir,.retomar,.conta,.comu,.pf-bl,
.selo-papel,.pouso,.turma,.arq-raro,.falta,.pendencias,.mg-trava,.mg-desce,.mg-ext,.ident,.es-in,.fi-in,
.portao-sim,.mais,.it.cel,.mg-degrauzinho,.fi-erra,.es-i.zero,.tm-in,.fb-f,#board,.cartaArq,.ch){
background:#16396B !important;border:4px solid #000 !important;border-radius:0 !important;
box-shadow:4px 4px 0 #000,inset 0 0 0 2px #2B5CE6 !important}
html[data-skin="e"] :is(.dv,.arq-sec,.cx,.radarBox,.cv2,.glos,.deg,.pf-bl,.comu,.fb-caixa,.fb-porq,.fb-gap,.mg-art,.mfato,.falta,.retomar,.es-in,.fi-in,.tm-in,.mais,.conta,.selo-papel,.pouso,.turma,.arq-raro,.pendencias,.mg-trava,.mg-ext,.ident,.mg-tarefa,.mg-degrauzinho,.fi-erra,.es-i.zero){
box-shadow:4px 4px 0 #000,inset 0 0 0 2px #2B5CE6,inset 0 0 0 4px #16396B !important}
html[data-skin="e"] :is(.dv-le,.dv-fa,.arq-forte,.arq-risco,.arq-aprende,.arq-viz,.arq-fato,.fb-porq,.mg-bloco,.mgf,.mg-tarefa,.turma,.fi-erra,.mfato,.pouso,.selo-papel,.pgcab){
border-left:4px solid #000 !important}
html[data-skin="e"] .pgcab::before{width:6px;left:0;background:var(--fam)}
html[data-skin="e"] .mg-bloco::after{content:'';position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--c,#5EE6E6)}
html[data-skin="e"] .mg-bloco{position:relative;padding-left:18px}
html[data-skin="e"] .ch{padding:11px 14px;font-weight:700 !important;box-shadow:3px 3px 0 #000 !important;border-width:3px !important}
html[data-skin="e"] .ch:active,html[data-skin="e"] .esc-op:active,html[data-skin="e"] .mo:active,html[data-skin="e"] .fb-op:active,html[data-skin="e"] .palp:active{transform:translate(3px,3px);box-shadow:0 0 0 #000 !important}
html[data-skin="e"] .ch.on{background:#FFC53D !important;color:#1A1400 !important;box-shadow:3px 3px 0 #000,inset 0 0 0 2px #FFE9A8 !important}
html[data-skin="e"] .chips.multi .ch::before{border:2px solid #000;border-radius:0;background:#0B1E3A}
html[data-skin="e"] .chips.multi .ch.on::before{background:#1A1400;border-color:#1A1400}
html[data-skin="e"] .chips.multi .ch.on::after{border-color:#FFC53D}
html[data-skin="e"] :is(.esc-op.on,.fb-op.on,.fb-op.certa,.palp.on,.mo.visto,.portao-sim,.fb-f.on,.fi-pl.on,.mg-ext-bt.on){
background:#1F4C8A !important;box-shadow:4px 4px 0 #000,inset 0 0 0 2px #FFC53D !important}
html[data-skin="e"] .esc-op.on::before{content:'▶';position:absolute;left:-2px;top:50%;transform:translateY(-50%);color:#FFC53D;font-size:10px;
font-family:'Press Start 2P',monospace !important;animation:e-pisca .8s steps(1) infinite}
html[data-skin="e"] .esc-op{position:relative;padding-left:16px}
@keyframes e-pisca{50%{opacity:0}}
html[data-skin="e"] .esc-n,html[data-skin="e"] .mo-num,html[data-skin="e"] .mo-seta,html[data-skin="e"] .mgg-seta{
background:#0B1E3A !important;border:2px solid #000 !important;border-radius:0 !important;color:#FFC53D !important;font-size:10px}
html[data-skin="e"] .esc-op.on .esc-n,html[data-skin="e"] .mo.visto .mo-num{background:#FFC53D !important;color:#1A1400 !important}
html[data-skin="e"] .fb-f.on{background:#FFC53D !important;color:#1A1400 !important}
html[data-skin="e"] .fb-f{border-width:3px !important;box-shadow:3px 3px 0 #000 !important}
html[data-skin="e"] .fb-fila{gap:6px}
/* botões-sprite */
html[data-skin="e"] .btn{
font-size:11px !important;line-height:1.5 !important;letter-spacing:0 !important;padding:16px 18px !important;
background:#FF7A2F !important;color:#1A0A00 !important;border:4px solid #000 !important;border-radius:0 !important;
box-shadow:4px 4px 0 #000,inset -4px -4px 0 #B84E10,inset 4px 4px 0 #FFB27A !important;text-transform:uppercase !important}
html[data-skin="e"] .btn:hover{background:#FF8A45 !important}
html[data-skin="e"] .btn:active:not(:disabled){transform:translate(4px,4px);box-shadow:0 0 0 #000,inset -4px -4px 0 #B84E10,inset 4px 4px 0 #FFB27A !important}
html[data-skin="e"] .btn:disabled{background:#1F4C8A !important;color:#7C8BB5 !important;box-shadow:4px 4px 0 #000,inset -4px -4px 0 #16396B,inset 4px 4px 0 #2B5CE6 !important}
html[data-skin="e"] .btn.ghost{background:#16396B !important;color:#F4F6FF !important;box-shadow:4px 4px 0 #000,inset -4px -4px 0 #0B1E3A,inset 4px 4px 0 #2B5CE6 !important}
html[data-skin="e"] #bok.avisa{background:#22C55E !important;color:#062012 !important;box-shadow:4px 4px 0 #000,inset -4px -4px 0 #0E6B3A,inset 4px 4px 0 #8FD9A8 !important}
html[data-skin="e"] #bok.avisa::before{display:none}
html[data-skin="e"] :is(.voltar,.aa){background:#16396B !important;border:3px solid #000 !important;border-radius:0 !important;color:#F4F6FF !important;box-shadow:3px 3px 0 #000 !important}
html[data-skin="e"] :is(.voltar,.aa):active{transform:translate(3px,3px);box-shadow:none !important}
html[data-skin="e"] .topo{border-bottom:4px solid #000 !important;padding-bottom:12px}
html[data-skin="e"] .trilha{gap:4px}
html[data-skin="e"] .trilha i{height:10px;border-radius:0;background:#16396B !important;border:2px solid #000}
html[data-skin="e"] .trilha i.feito{background:#22C55E !important}
html[data-skin="e"] .trilha i.atual{background:#FFC53D !important;animation:e-pisca 1s steps(1) infinite}
html[data-skin="e"] .medidor{padding:10px 14px}
html[data-skin="e"] .it .disco{background:#16396B !important;border:3px solid #000 !important;border-radius:0 !important;box-shadow:3px 3px 0 #000 !important}
html[data-skin="e"] .it:active .disco{transform:translate(3px,3px) !important;box-shadow:none !important}
html[data-skin="e"] .it .disco::before{background:#22C55E !important;box-shadow:inset 0 3px 0 #5BE58A}
html[data-skin="e"] .it .disco svg.marca-real{color:#F4F6FF}
html[data-skin="e"] .it[data-n="5"] .disco svg.marca-real,html[data-skin="e"] .it.tog[data-n="2"] .disco svg.marca-real{color:#05301A !important}
html[data-skin="e"] .it .pips{gap:3px !important}
html[data-skin="e"] .it .pips i{background:#16396B !important;border:1px solid #000;border-radius:0 !important;width:9px !important;height:6px !important}
html[data-skin="e"] .it[data-n="4"] .pips i,html[data-skin="e"] .it[data-n="5"] .pips i{background:#22C55E !important;box-shadow:none}
html[data-skin="e"] .it.cel{padding:10px 3px 7px}
html[data-skin="e"] .it.cel[data-n="3"],html[data-skin="e"] .it.cel[data-n="4"],html[data-skin="e"] .it.cel[data-n="5"]{background:#0E6B3A !important;box-shadow:4px 4px 0 #000,inset 0 0 0 2px #22C55E !important}
html[data-skin="e"] .grade.inv{gap:9px !important}
html[data-skin="e"] .grade:not(.inv){gap:14px 4px !important}
html[data-skin="e"] .leg.escala .lg i{background:#16396B !important;border:2px solid #000;border-radius:0;width:13px;height:13px}
html[data-skin="e"] .leg.escala .lg i::after{background:#22C55E !important}
html[data-skin="e"] .estrelas .st{color:#1F4C8A}
html[data-skin="e"] .estrelas .st.on{color:#8FD9A8}
html[data-skin="e"] .estrelas .st.on.alta{color:#22C55E}
html[data-skin="e"] .it.cel .cel-q{background:#FFC53D;color:#1A1400;border:2px solid #000;border-radius:0;box-shadow:2px 2px 0 #000;font-size:9px}
html[data-skin="e"] .mais-ico{background:#FF7A2F !important;color:#1A0A00 !important;border:2px solid #000;border-radius:0}
html[data-skin="e"] .mais-pts{background:#0B1E3A !important;border:2px solid #000;border-radius:0;font-size:9px}
html[data-skin="e"] :is(.mg-saber,.fi-pl,.ct-bt,.fi-bt,.mg-ext-bt,.catmin,.mgf-deg,.falta-i,.exp-mais,.mo-peca,.er-b,.dg-bola,.im-p,.md-rot,.md-dg,.md-leg,.er-n,.skin-op img,.palp-arte,.dg-ilha,.ilhamapa,.mg-descida,.comu-campos input,.ct-google,.medidor.medidor-fino,.ident-r i,.tm-in){border-radius:0 !important}
html[data-skin="e"] :is(.mg-saber,.fi-pl,.ct-bt,.fi-bt,.mg-ext-bt){background:#16396B !important;border:3px solid #000 !important;box-shadow:3px 3px 0 #000 !important;color:#F4F6FF !important}
html[data-skin="e"] :is(.ident-i,#obsTxt,.ct-email,.ct-cod,.comu-campos input,textarea.aberta,.aberta){
background:#0B1E3A !important;border:3px solid #000 !important;border-radius:0 !important;color:#F4F6FF !important;box-shadow:inset 3px 3px 0 #061225}
html[data-skin="e"] :is(.ident-i,#obsTxt,textarea.aberta):focus{border-color:#FFC53D !important;outline:0}
html[data-skin="e"] .ident-r .obr{background:#DB1E2F;border:2px solid #000;border-radius:0}
html[data-skin="e"] .ident-r .opc{background:#0B1E3A !important;border:2px solid #000;border-radius:0}
html[data-skin="e"] .catmin,html[data-skin="e"] .mgf-deg,html[data-skin="e"] .falta-i{background:#0B1E3A !important;border:2px solid #000;font-size:10px}
html[data-skin="e"] .mg-pips i,html[data-skin="e"] .pgcab-pips i{background:#0B1E3A !important;border:1px solid #000;height:6px;border-radius:0}
html[data-skin="e"] .mg-pips i.feito{background:var(--c,#5EE6E6) !important}
html[data-skin="e"] .mg-pips i.atual{background:#FFC53D !important}
html[data-skin="e"] .pgcab-pips i.feito{background:#7C8BB5 !important}
html[data-skin="e"] .pgcab-pips i.atual{box-shadow:none;background:var(--fam) !important}
/* capa, mapa, ficha */
html[data-skin="e"] .capa-arte{background:#0B1E3A url('assets/ilha-q5_acesso-e.webp') center 40%/cover no-repeat !important}
html[data-skin="e"] .capa-arte::after{background:linear-gradient(180deg,rgba(11,30,58,0) 0%,rgba(11,30,58,0) 55%,rgba(11,30,58,.7) 82%,#0B1E3A 100%)}
html[data-skin="e"] .capa-topo .marca{color:#FFC53D !important;font-family:'Press Start 2P',monospace !important;font-size:10px;text-shadow:2px 2px 0 #000}
html[data-skin="e"] .capa-topo .marca svg :is(path,rect,circle)[fill="#fff"]{fill:#FFC53D}
html[data-skin="e"] .capa-txt{border-top:4px solid #000}
html[data-skin="e"] .capa-txt::before{height:6px;width:100%;background:repeating-linear-gradient(90deg,#FFC53D 0 8px,#000 8px 16px) !important;border-radius:0}
html[data-skin="e"] .capa-txt > .mono{font-family:'Press Start 2P',monospace !important;font-size:8px !important;color:#5EE6E6 !important}
html[data-skin="e"] .capa-txt > div[style*="display:flex"] > div{flex:1;background:#16396B;border:3px solid #000;box-shadow:3px 3px 0 #000;padding:9px 10px}
html[data-skin="e"] .capa-txt > div[style*="display:flex"] > div > div:first-child{font-size:16px !important;color:#FFC53D !important;margin-bottom:6px}
html[data-skin="e"] .capa-txt > div[style*="display:flex"] > div > .mono{font-size:9px !important;font-family:'Press Start 2P',monospace !important;opacity:1 !important;color:#B8C4E6 !important}
html[data-skin="e"] .capa-txt > div[style*="display:flex"]{gap:8px !important}
html[data-skin="e"] .skin-op img{border:3px solid #000;box-shadow:3px 3px 0 #000}
html[data-skin="e"] .skin-op.atual img{border-color:#FFC53D;box-shadow:3px 3px 0 #000 !important}
html[data-skin="e"] .skin-op span{font-size:11px}
html[data-skin="e"] #board{padding:0}
html[data-skin="e"] #board .bg{background:#0B1E3A repeating-conic-gradient(#0D2242 0 25%,#0B1E3A 0 50%) 0 0/8px 8px !important}
html[data-skin="e"] .er-a{border:3px solid #000;border-radius:0;box-shadow:3px 3px 0 #000}
html[data-skin="e"] .est.ilhareal.agora .er-a{border-color:#FFC53D;box-shadow:3px 3px 0 #000}
html[data-skin="e"] .est.ilhareal.feita .er-a{border-color:#22C55E}
html[data-skin="e"] .er-n{background:#16396B;color:#F4F6FF !important;border:2px solid #000;border-radius:0;font-size:10px !important}
html[data-skin="e"] .er-b{background:#0B1E3A !important;border:2px solid #000;color:#F4F6FF;font-size:9px}
html[data-skin="e"] .est.ilhareal.feita .er-b{background:#22C55E !important;color:#062012}
html[data-skin="e"] .est.ilhareal.agora .er-b{background:#FFC53D !important;color:#1A1400}
html[data-skin="e"] #rota .trecho{stroke:#2B5CE6;stroke-width:2;stroke-dasharray:4 4;stroke-linecap:butt}
html[data-skin="e"] #rota .trecho.feito{stroke:#22C55E}
html[data-skin="e"] #rota .seta{fill:#FFC53D;filter:none}
html[data-skin="e"] .dg-ilha{border:3px solid #000;border-radius:0;box-shadow:3px 3px 0 #000}
html[data-skin="e"] .cartaArq-tx b{font-family:'Press Start 2P',monospace !important;font-size:14px;line-height:1.4;color:#FFC53D}
html[data-skin="e"] .arq-nome{font-size:15px;line-height:1.5;color:#FFC53D !important;text-shadow:2px 2px 0 #000}
html[data-skin="e"] .fb-tit{font-size:13px;line-height:1.6}
html[data-skin="e"] .fb-tit b{color:#FFC53D !important}
html[data-skin="e"] .es-tit,html[data-skin="e"] .fi-tit,html[data-skin="e"] .nt-tit{font-size:12px;line-height:1.6}
html[data-skin="e"] :is(.pgcab-rot,.mg-bloco-nome,.mgf-nome,.mgg-nome){font-size:10px;line-height:1.5}
html[data-skin="e"] :is(#escala,#ficha,#termo,#cardmodal,#naotem){background:rgba(6,14,28,.9);backdrop-filter:none}
html[data-skin="e"] .nudge,html[data-skin="e"] .expl{background:#16396B;border:4px solid #000;border-radius:0;box-shadow:4px 4px 0 #000}
html[data-skin="e"] .ganho{background:#FFC53D;color:#1A1400;border:3px solid #000;border-radius:0;box-shadow:3px 3px 0 #000;font-family:'Press Start 2P',monospace !important;font-size:14px}
html[data-skin="e"] .cortina{background:#000}
html[data-skin="e"] #flash{background:#0B1E3A repeating-conic-gradient(#0D2242 0 25%,#0B1E3A 0 50%) 0 0/8px 8px}
html[data-skin="e"] #flfoto::after,html[data-skin="e"] #flfoto.chegada::after{background:linear-gradient(180deg,rgba(11,30,58,.3) 0%,rgba(11,30,58,.6) 45%,rgba(11,30,58,.92) 100%) !important}
html[data-skin="e"] .fl-num{font-size:clamp(56px,20vw,110px);color:#FFC53D !important;text-shadow:6px 6px 0 #000 !important}
html[data-skin="e"] .fl-txt{font-size:clamp(12px,3.6vw,16px);line-height:1.6}
html[data-skin="e"] ::selection{background:#FFC53D;color:#1A1400}
html[data-skin="e"] :is(.esc-op,.mo,.ch,.fb-op,.palp,.btn):focus-visible{outline:3px solid #FFC53D;outline-offset:2px}
html[data-skin="e"] .ct-google{border:3px solid #000;box-shadow:3px 3px 0 #000}
/* =====================================================================
7 · F · ISOMÉTRICO CHAPADO — vetor flat, infográfico
Derivada da arte isométrica (ilha laranja-areia e turquesa sobre
azul-noite #17233A, sem gradiente): tudo é superfície CHAPADA; a
profundidade é uma forma sólida deslocada de um tom mais escuro, nunca
sombra difusa; cantos de 10px; botão laranja com sombra sólida; acentos
turquesa e azul. Sora nos títulos, Manrope no corpo.
===================================================================== */
html[data-skin="f"] :where(*:not(.fb-cod):not(.nt-cod):not(.pf-cod):not(.ct-cod):not(.tm-id)){font-family:Manrope,Rubik,Inter,system-ui,-apple-system,sans-serif !important}
html[data-skin="f"] :is(.title,.headline,.display,.tit-jogo,.fb-tit,.arq-nome,.es-tit,.fi-tit,.nt-tit,.pgcab-rot,.mg-bloco-nome,.mgf-nome,.mgg-nome,.dv-t,.ident-tit,.medidor .n,.fl-num,.cx-n,.placar,.btn,.fb-f,.esc-n,.mo-num,.er-b,.dg-bola,.cel-q,.arq-viz-n,.fb-caixa h4,.mast),
html[data-skin="f"] :is(.title,.headline,.display,.tit-jogo,.fb-tit,.arq-nome,.placar,.btn) *{font-family:Sora,Manrope,Rubik,system-ui,sans-serif !important;font-weight:700 !important}
html[data-skin="f"] .title{font-size:clamp(22px,6vw,26px);line-height:1.2;letter-spacing:-.02em}
html[data-skin="f"] .body{font-size:15px;line-height:1.55;font-weight:500}
html[data-skin="f"] .mast{letter-spacing:.14em;font-size:11.5px;color:#F2A65A !important}
html[data-skin="f"] .mast::after{background:#F2A65A !important;height:4px;border-radius:2px}
html[data-skin="f"] .mast.on-dark{color:#F4F6FA !important}
html[data-skin="f"] #app{background:#17233A !important}
html[data-skin="f"] .tela,html[data-skin="f"] #flash,html[data-skin="f"] .capa-txt{background:#17233A !important}
html[data-skin="f"] #cenafundo{height:44% !important;background-size:auto 92% !important;background-position:center 0 !important;background-repeat:no-repeat !important;opacity:1 !important}
html[data-skin="f"] #cenafundo::after{background:linear-gradient(180deg,rgba(23,35,58,0) 0%,rgba(23,35,58,.2) 24%,rgba(23,35,58,.8) 54%,rgba(23,35,58,.98) 100%) !important}
/* superfícies chapadas com sombra sólida */
html[data-skin="f"] :is(.mo,.esc-op,.palp,.dv,.fb-op,.pgcab,.mg-bloco,.dica,.medidor,.fb-caixa,.fb-gap,.fb-porq,.arq-sec,
.sb-g,.cx,.radarBox,.cv2,.glos,.deg,.mgf,.mgg,.mg-art,.mg-tarefa,.mfato,.expandir,.retomar,.conta,.comu,.pf-bl,
.selo-papel,.pouso,.turma,.arq-raro,.falta,.pendencias,.mg-trava,.mg-desce,.mg-ext,.ident,.es-in,.fi-in,
.portao-sim,.mais,.it.cel,.mg-degrauzinho,.fi-erra,.es-i.zero,.tm-in,.fb-f,#board,.conta-pop){
background:#22314D !important;border:0 !important;border-radius:10px !important;box-shadow:0 4px 0 #0E1727 !important}
html[data-skin="f"] :is(.dv-le,.dv-fa,.arq-forte,.arq-risco,.arq-aprende,.arq-viz,.arq-fato,.fb-porq,.mg-bloco,.mgf,.mg-tarefa,.turma,.fi-erra,.mfato,.pouso,.selo-papel){
border-left:6px solid var(--c,#17C4C4) !important}
html[data-skin="f"] :is(.dv-le,.arq-aprende){--c:#17C4C4}
html[data-skin="f"] :is(.dv-fa,.arq-risco,.mfato,.mg-tarefa){--c:#F2A65A}
html[data-skin="f"] .arq-forte{--c:#7BD88F}
html[data-skin="f"] .arq-viz{--c:#C4B0FF}
html[data-skin="f"] .arq-fato{--c:#2B5CE6}
html[data-skin="f"] .pgcab::before{width:0}
html[data-skin="f"] .pgcab{border-left:6px solid var(--fam,#17C4C4) !important}
html[data-skin="f"] .mg-bloco{border-left-color:var(--c,#2B5CE6) !important}
html[data-skin="f"] .ch:is(*,.x.x.x){background:#2C3D5E !important;border:0 !important;border-radius:10px !important;box-shadow:0 3px 0 #0E1727 !important;padding:12px 16px;color:#F4F6FA !important;font-weight:600 !important}
html[data-skin="f"] .ch:active{transform:translateY(3px);box-shadow:none !important}
html[data-skin="f"] .ch.on{background:#17C4C4 !important;color:#05303A !important;box-shadow:0 3px 0 #0F6B8A !important}
html[data-skin="f"] .chips.multi .ch::before{border-color:#7F8CA6;background:#17233A;border-radius:4px}
html[data-skin="f"] .chips.multi .ch.on::before{background:#05303A;border-color:#05303A}
html[data-skin="f"] .chips.multi .ch.on::after{border-color:#17C4C4}
html[data-skin="f"] :is(.esc-op,.mo,.fb-op,.palp){padding:15px 16px}
html[data-skin="f"] :is(.esc-op.on,.fb-op.on,.fb-op.certa,.palp.on,.mo.visto,.portao-sim){background:#26405F !important;box-shadow:0 4px 0 #0F6B8A,inset 0 0 0 2px #17C4C4 !important}
html[data-skin="f"] :is(.esc-op,.mo,.fb-op,.palp):active{transform:translateY(4px);box-shadow:none !important}
html[data-skin="f"] :is(.esc-n,.mo-num,.mo-seta,.mgg-seta):is(*,.x.x.x){background:#17233A !important;border:0 !important;color:#B9C3D6 !important;border-radius:8px !important;box-shadow:none}
html[data-skin="f"] .esc-op.on .esc-n:is(*,.x.x.x),html[data-skin="f"] .mo.visto .mo-num:is(*,.x.x.x){background:#17C4C4 !important;color:#05303A !important}
html[data-skin="f"] .fb-f.on,html[data-skin="f"] .fi-pl.on,html[data-skin="f"] .mg-ext-bt.on{background:#17C4C4 !important;color:#05303A !important;box-shadow:0 3px 0 #0F6B8A !important}
html[data-skin="f"] .fb-f{border-radius:8px !important;box-shadow:0 3px 0 #0E1727 !important}
html[data-skin="f"] .fb-fila{gap:5px}
html[data-skin="f"] .palp.on .palp-txt b{color:#17C4C4 !important}
/* botão laranja, sombra sólida */
html[data-skin="f"] .btn{text-transform:none !important;letter-spacing:0 !important;font-size:16px !important;padding:16px 22px !important;
background:#F2A65A !important;color:#2A1600 !important;border:0 !important;border-radius:10px !important;box-shadow:0 5px 0 #C0682C !important}
html[data-skin="f"] .btn:hover{background:#F6B679 !important}
html[data-skin="f"] .btn:active:not(:disabled){transform:translateY(5px);box-shadow:0 0 0 #C0682C !important}
html[data-skin="f"] .btn:disabled{background:#22314D !important;color:#7F8CA6 !important;box-shadow:0 4px 0 #0E1727 !important}
html[data-skin="f"] .btn.ghost{background:#2C3D5E !important;color:#F4F6FA !important;box-shadow:0 4px 0 #0E1727 !important}
html[data-skin="f"] #bok.avisa{background:#E5673A !important;color:#2A1600 !important;box-shadow:0 5px 0 #8F3A1C !important}
html[data-skin="f"] #bok.avisa::before{display:none}
html[data-skin="f"] :is(.voltar,.aa):is(*,.x.x.x){background:#22314D !important;border:0 !important;border-radius:10px;box-shadow:0 3px 0 #0E1727 !important;color:#F4F6FA !important}
html[data-skin="f"] :is(.voltar,.aa):active{transform:translateY(3px);box-shadow:none !important}
html[data-skin="f"] .topo{border-bottom:0 !important;padding-bottom:10px}
html[data-skin="f"] .trilha{gap:5px}
html[data-skin="f"] .trilha i{height:8px;border-radius:2px;background:#22314D !important;box-shadow:0 2px 0 #0E1727}
html[data-skin="f"] .trilha i.feito{background:#17C4C4 !important;box-shadow:0 2px 0 #0F6B8A}
html[data-skin="f"] .trilha i.atual{background:#F2A65A !important;box-shadow:0 2px 0 #C0682C}
html[data-skin="f"] .placar.pecas .pc-ico{color:#F2A65A}
html[data-skin="f"] .medidor .n{color:#F2A65A !important}
html[data-skin="f"] .catpg{background:#22314D !important;box-shadow:0 2px 0 #0E1727;color:#B9C3D6 !important}
html[data-skin="f"] .conta-chip:is(*,.x.x.x){box-shadow:0 2px 0 #0E1727;border:0 !important;background:#22314D !important}
/* a grade e as células */
html[data-skin="f"] .it .disco{background:#22314D !important;border:0 !important;box-shadow:0 3px 0 #0E1727 !important}
html[data-skin="f"] .it:active .disco{transform:translateY(3px) !important;box-shadow:none !important}
html[data-skin="f"] .it .disco::before{background:#17C4C4 !important}
html[data-skin="f"] .it svg{fill:#7F8CA6}
html[data-skin="f"] .it .disco svg.marca-real{color:#F4F6FA}
html[data-skin="f"] .it[data-n="5"] .disco svg.marca-real,html[data-skin="f"] .it.tog[data-n="2"] .disco svg.marca-real{color:#05303A !important}
html[data-skin="f"] .it .pips i{background:#2C3D5E !important}
html[data-skin="f"] .it[data-n="4"] .pips i,html[data-skin="f"] .it[data-n="5"] .pips i{background:#17C4C4 !important;box-shadow:none}
html[data-skin="f"] .it.cel[data-n="3"],html[data-skin="f"] .it.cel[data-n="4"],html[data-skin="f"] .it.cel[data-n="5"]{background:#0F6B8A !important;box-shadow:0 4px 0 #083E50 !important}
html[data-skin="f"] .leg.escala .lg i{background:#2C3D5E !important;border-radius:3px}
html[data-skin="f"] .leg.escala .lg i::after{background:#17C4C4 !important}
html[data-skin="f"] .estrelas .st{color:#2C3D5E}
html[data-skin="f"] .estrelas .st.on{color:#17C4C4}
html[data-skin="f"] .estrelas .st.on.alta{color:#F2A65A}
html[data-skin="f"] .es-est i.on,html[data-skin="f"] .glos-est i.on{color:#F2A65A}
html[data-skin="f"] .it.cel .cel-q{background:#F2A65A;color:#2A1600;box-shadow:0 2px 0 #C0682C;border-radius:6px}
html[data-skin="f"] .mais-ico{background:#F2A65A !important;color:#2A1600 !important;border-radius:8px}
html[data-skin="f"] .mais-pts{background:#17233A !important;border-radius:8px}
html[data-skin="f"] :is(.mg-saber,.fi-pl,.ct-bt,.fi-bt,.mg-ext-bt):is(*,.x.x.x){background:#2C3D5E !important;border:0 !important;box-shadow:0 3px 0 #0E1727 !important;color:#F4F6FA !important;border-radius:10px !important}
html[data-skin="f"] :is(.ident-i,#obsTxt,.ct-email,.ct-cod,.comu-campos input,textarea.aberta,.aberta){background:#17233A !important;border:2px solid #2C3D5E !important;border-radius:10px !important;color:#F4F6FA !important}
html[data-skin="f"] :is(.ident-i,#obsTxt,textarea.aberta):focus{border-color:#17C4C4 !important;outline:0;box-shadow:none !important}
html[data-skin="f"] .ident-r .obr{background:#F2A65A;color:#2A1600;border-radius:6px}
html[data-skin="f"] .ident-r .opc{background:#17233A !important;border-radius:6px}
html[data-skin="f"] :is(.catmin,.mgf-deg,.falta-i,.exp-mais):is(*,.x.x.x){background:#2C3D5E !important;border-radius:8px;color:#B9C3D6 !important}
html[data-skin="f"] .mg-pips i,html[data-skin="f"] .pgcab-pips i{background:#17233A !important;height:6px;border-radius:2px}
html[data-skin="f"] .mg-pips i.feito{background:var(--c,#2B5CE6) !important}
html[data-skin="f"] .mg-pips i.atual{background:#F2A65A !important}
html[data-skin="f"] .pgcab-pips i.feito{background:#7F8CA6 !important}
html[data-skin="f"] .pgcab-pips i.atual{box-shadow:none;background:#17C4C4 !important}
/* capa e mapa */
html[data-skin="f"] .capa-arte{background:#17233A url('assets/ilha-q5_acesso-f.webp') center 46%/cover no-repeat !important}
html[data-skin="f"] .capa-arte::after{background:linear-gradient(180deg,rgba(23,35,58,0) 0%,rgba(23,35,58,0) 72%,#17233A 100%)}
html[data-skin="f"] .capa-topo .marca{color:#F4F6FA !important}
html[data-skin="f"] .capa-txt::before{height:6px;width:64px;border-radius:3px;background:#17C4C4 !important;box-shadow:0 3px 0 #0F6B8A}
html[data-skin="f"] #t-intro .tit-jogo,html[data-skin="f"] #t-intro .tit-jogo span{font-family:Sora,system-ui,sans-serif !important;font-weight:800 !important;font-size:clamp(44px,13.5vw,68px);letter-spacing:-.04em;line-height:.95;text-transform:uppercase;
color:#F4F6FA !important;-webkit-text-fill-color:#F4F6FA !important;text-shadow:0 4px 0 #0E1727}
html[data-skin="f"] #t-intro .tit-jogo span:last-child{color:#F2A65A !important;-webkit-text-fill-color:#F2A65A !important;text-shadow:0 4px 0 #C0682C}
html[data-skin="f"] .capa-txt > div[style*="display:flex"]{gap:8px !important}
html[data-skin="f"] .capa-txt > div[style*="display:flex"] > div{flex:1;background:#22314D;border-radius:10px;padding:10px 12px;box-shadow:0 4px 0 #0E1727}
html[data-skin="f"] .capa-txt > div[style*="display:flex"] > div > div:first-child{color:#F2A65A !important}
html[data-skin="f"] .skin-op img{border-radius:10px !important;border:0 !important;box-shadow:0 4px 0 #0E1727}
html[data-skin="f"] .skin-op.atual img{box-shadow:0 4px 0 #0F6B8A,0 0 0 3px #17C4C4 !important}
html[data-skin="f"] .skins.skins-tela .skin-op img{border:0 !important}
html[data-skin="f"] #board{padding:0;background:#1B2A45 !important;border:0;border-radius:14px !important;box-shadow:0 6px 0 #0E1727 !important}
html[data-skin="f"] #board .bg{background:#1B2A45 !important;background-image:
radial-gradient(ellipse 52% 38% at 28% 42%,#1F3152 0 99%,transparent 100%),
radial-gradient(ellipse 46% 40% at 74% 58%,#1F3152 0 99%,transparent 100%),
radial-gradient(ellipse 30% 22% at 55% 16%,#1F3152 0 99%,transparent 100%) !important}
html[data-skin="f"] .er-a{border:0;border-radius:12px;box-shadow:none;background-color:transparent}
html[data-skin="f"] .est.ilhareal.agora .er-a{box-shadow:0 0 0 3px #17C4C4}
html[data-skin="f"] .est.ilhareal.feita .er-a{box-shadow:0 0 0 2px #7BD88F}
html[data-skin="f"] .est.ilhareal.falta .er-a{filter:saturate(.25) brightness(.55) opacity(.9)}
html[data-skin="f"] .er-n{background:#0E1727;color:#F4F6FA !important;border:0;border-radius:6px}
html[data-skin="f"] .er-b{background:#2C3D5E !important;color:#F4F6FA;box-shadow:0 2px 0 #0E1727}
html[data-skin="f"] .est.ilhareal.feita .er-b{background:#7BD88F !important;color:#0B2E14}
html[data-skin="f"] .est.ilhareal.agora .er-b{background:#F2A65A !important;color:#2A1600}
html[data-skin="f"] #rota .trecho{stroke:#3B5079;stroke-width:2;stroke-dasharray:6 6}
html[data-skin="f"] #rota .trecho.feito{stroke:#17C4C4}
html[data-skin="f"] #rota .seta{fill:#F2A65A}
html[data-skin="f"] #mt.tit-jogo,html[data-skin="f"] #mt.tit-jogo span{font-family:Sora,system-ui,sans-serif !important;font-weight:800 !important;text-transform:uppercase;letter-spacing:-.03em;color:#F4F6FA !important;-webkit-text-fill-color:#F4F6FA !important;text-shadow:0 3px 0 #0E1727}
html[data-skin="f"] #msub{color:#F2A65A !important}
html[data-skin="f"] #msub::after{background:#F2A65A !important}
html[data-skin="f"] .dg-ilha,html[data-skin="f"] .ilhamapa,html[data-skin="f"] .mg-descida{border:0;border-radius:12px;box-shadow:0 4px 0 #0E1727}
html[data-skin="f"] .dg-item.agora .dg-ilha{box-shadow:0 4px 0 #0E1727,0 0 0 3px #17C4C4;border:0}
html[data-skin="f"] .cartaArq{border:0;border-radius:14px;box-shadow:0 6px 0 #0E1727}
html[data-skin="f"] .arq-nome,html[data-skin="f"] .fb-tit b,html[data-skin="f"] .dv-selo,html[data-skin="f"] .cx-n{color:#F2A65A !important}
html[data-skin="f"] .dv-le .dv-selo{color:#5EDCDC !important}
html[data-skin="f"] :is(#escala,#ficha,#termo,#cardmodal,#naotem){background:rgba(23,35,58,.9)}
html[data-skin="f"] .tm-in{border-top:6px solid #F2A65A !important;border-radius:14px 14px 0 0 !important}
html[data-skin="f"] .nudge,html[data-skin="f"] .expl{background:#0E1727;border-radius:10px;box-shadow:0 4px 0 #060B14}
html[data-skin="f"] .ganho{background:#F2A65A;color:#2A1600;border-radius:10px;box-shadow:0 4px 0 #C0682C}
html[data-skin="f"] .cortina{background:#17C4C4}
html[data-skin="f"] .fl-num{color:#F2A65A !important;text-shadow:0 5px 0 #0E1727}
html[data-skin="f"] .fl-sub{color:#17C4C4 !important}
html[data-skin="f"] ::selection{background:#17C4C4;color:#05303A}
html[data-skin="f"] :is(.esc-op,.mo,.ch,.fb-op,.palp,.btn):focus-visible{outline:3px solid #F2A65A;outline-offset:2px}
/* ---------------------------------------------------------------------
Modo computador e tamanho de texto: nada aqui muda medidas de layout;
só um ajuste onde a tipografia nova ficaria grande demais em 900px+.
--------------------------------------------------------------------- */
html[data-layout="computador"][data-skin="b"] #t-intro .tit-jogo{font-size:64px}
html[data-layout="computador"][data-skin="c"] #t-intro .tit-jogo{font-size:60px}
html[data-layout="computador"][data-skin="d"] #t-intro .tit-jogo{font-size:66px}
html[data-layout="computador"][data-skin="e"] #t-intro .tit-jogo{font-size:34px}
html[data-layout="computador"][data-skin="f"] #t-intro .tit-jogo{font-size:62px}
/* Retrô: as estrelas da legenda "o que cada estrela quer dizer" tinham a cor
do fundo e sumiam (Giordano, 11/09). */
html[data-skin="e"] .es-est i{color:#3A5A9A}
html[data-skin="e"] .es-est i.on{color:#22C55E}
/* =====================================================================
8 · LEGIBILIDADE — o que a auditoria de contraste de 11/09/2026 achou
Medida como se mede, não a olho: para cada skin, a travessia inteira
(capa, escolha da arte, escada, mergulho, grade de ferramentas,
identificação, mapa, devolutiva) foi percorrida no navegador a 390×844;
em cada tela, todo texto visível teve o contraste WCAG calculado contra
o PIXEL REALMENTE PINTADO atrás dele — captura de tela com a tinta de
texto apagada, e a cor lida do bitmap. Medir contra a cor declarada do
pai não serve aqui: metade dos fundos deste jogo é gradiente ou é a
ilustração da categoria, e nenhum dos dois aparece em `backgroundColor`.
Reprova: < 4,5:1 abaixo de 19px; < 3:1 de 19px para cima. Glifo que é
CONTROLE e não texto (a estrela vazia da nota, a moeda que voa) responde
pelo mínimo de 3:1 do WCAG 1.4.11.
A regra desta seção: corrigir CONTRASTE, não trocar o estilo. Onde o
culpado era um token da skin, o token mudou; onde era um valor cravado
no estilo-jogo.css que a skin não remapeava, entrou o remapeamento que
faltava. Nada de fonte nova, nada de medida de layout.
===================================================================== */
/* ---------------------------------------------------------------------
8.1 · A INTERFACE DE CIMA FLUTUAVA SOBRE A ILUSTRAÇÃO
`#cenafundo` desenha a arte da categoria atrás da tela toda, e o véu
(`::after`) só começa a cobrir lá pelos 20% da altura dela. Resultado:
a barra de cima e a linha de capítulo ficavam sobre a imagem crua — e
como a imagem MUDA a cada categoria, a leitura passava a depender de
qual arte era. Medido antes:
C "Aa" 1,17:1 · "entrar" 1,18:1 · placar 1,11:1 · rótulo 1,15:1
(a arte da Cartografia é escura no alto e, desde a repintura para
papel, a tinta também é escura — ficou preto sobre preto)
D "CATEGORIA 1 · ACESSO" em vermelho sobre o mar: 1,89:1
B ◈ do placar 1,75:1 · "de 119" 2,05:1
F "de 119" 2,16:1 · ◈ 2,98:1 · rótulo da categoria 3,29:1
A correção não apaga a arte: põe um véu de papel SÓ atrás das duas
faixas que já não eram arte — a barra e a linha de capítulo — e deixa
a ilustração inteira aparecer logo abaixo delas.
--------------------------------------------------------------------- */
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .topo:is(*,.x.x.x){
background:linear-gradient(180deg,
var(--paper) 0%,var(--paper) 58%,
rgba(var(--paper-rgb),0) 100%) !important}
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #corpo .catcab:is(*,.x.x.x){
background:linear-gradient(180deg,
rgba(var(--paper-rgb),0) 0%,var(--paper) 13%,
var(--paper) 87%,rgba(var(--paper-rgb),0) 100%)}
/* e o véu da própria arte sobe um degrau nas três skins claras, onde a
legenda "✓ gratuito · ★ pago" e a frase "Toque para trocar" caem na
faixa em que a imagem ainda estava forte (B 2,42:1 · C 4,10:1 · D 4,24:1) */
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) #cenafundo::after{
background:linear-gradient(180deg,
rgba(var(--paper-rgb),.10) 0%,rgba(var(--paper-rgb),.26) 16%,
rgba(var(--paper-rgb),.86) 42%,rgba(var(--paper-rgb),.98) 84%,
var(--paper) 100%) !important}
html[data-skin="b"] #cenafundo::after{background:linear-gradient(180deg,
rgba(228,241,252,.08) 0%,rgba(228,241,252,.32) 22%,rgba(228,241,252,.88) 50%,
rgba(228,241,252,.98) 78%,#E4F1FC 100%) !important}
html[data-skin="c"] #cenafundo::after{background:linear-gradient(180deg,
rgba(244,240,230,.10) 0%,rgba(244,240,230,.42) 22%,rgba(244,240,230,.92) 50%,
rgba(244,240,230,.99) 80%,#F4F0E6 100%) !important}
html[data-skin="f"] #cenafundo::after{background:linear-gradient(180deg,
rgba(23,35,58,.06) 0%,rgba(23,35,58,.26) 24%,rgba(23,35,58,.86) 54%,
rgba(23,35,58,.99) 88%,#17233A 100%) !important}
/* a marca FAROL na capa: o remapeamento comum (§2) a pinta de --tx e, na
Cartografia e no 16-bit, a arte da capa é escura embaixo dela — 1,03:1
na C. Cada skin já tinha a sua cor; faltava vencer o comum. */
html[data-skin="c"] .capa-topo .marca:is(*,.x.x.x),
html[data-skin="c"] .capa-topo .marca:is(*,.x.x.x) *{color:#F1E9D8 !important}
html[data-skin="e"] .capa-topo .marca:is(*,.x.x.x),
html[data-skin="e"] .capa-topo .marca:is(*,.x.x.x) *{color:#FFC53D !important}
html[data-skin="b"] .capa-topo .marca:is(*,.x.x.x),
html[data-skin="b"] .capa-topo .marca:is(*,.x.x.x) *{color:#10233F !important}
html[data-skin="d"] .capa-topo .marca:is(*,.x.x.x),
html[data-skin="d"] .capa-topo .marca:is(*,.x.x.x) *{color:#2B1F17 !important}
html[data-skin="f"] .capa-topo .marca:is(*,.x.x.x),
html[data-skin="f"] .capa-topo .marca:is(*,.x.x.x) *{color:#F4F6FA !important}
/* ---------------------------------------------------------------------
8.2 · O QUE O REMAPEAMENTO COMUM TINHA ESQUECIDO
Três classes continuavam com valor cravado do tema escuro original.
Em skin clara isso é branco sobre branco — literalmente invisível:
.pgcab-dif rgba(255,255,255,.58) → B 1,06:1 · D 1,01:1
(é a frase que explica a família de ferramentas: "Você
escreve, ela responde." Sumia inteira.)
.pgcab-n var(--c,#17C4C4) → B 1,89:1 · D 2,12:1
.mg-bloco-n var(--c,#17C4C4), e o --c que o app.js injeta por bloco
é #7C4DFF → E 2,38:1 · F 2,70:1 · B 4,35:1 · A 2,45:1
`--c` vem dos dados, um por família/bloco, e não há como garantir
contraste de uma cor que o CSS não conhece. O rótulo passa para a tinta
secundária da skin; a cor da família continua visível onde ela é forma
e não texto — o fio da esquerda do cartão e os pips do progresso.
(A Cartografia já resolvia isso à sua maneira, em §4; fica como está.)
--------------------------------------------------------------------- */
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .pgcab-dif{color:var(--tx2) !important}
html:is([data-skin="b"],[data-skin="d"],[data-skin="e"],[data-skin="f"]) :is(.pgcab-n,.mg-bloco-n){color:var(--tx2) !important}
/* ---------------------------------------------------------------------
8.3 · A ESTRELA VAZIA NÃO EXISTIA
A nota de cada ferramenta são cinco estrelas; as que faltam são o
TRILHO do controle, e sem elas ninguém sabe que o máximo é cinco.
Estavam assim: B 1,37:1 · D 1,21:1 (creme sobre creme) · E 1,34:1 ·
F 1,20:1. Na Cartografia o defeito era o oposto: a regra de §4 que
pinta tudo dentro do papel de #2A2118 vencia a da estrela, e as cinco
saíam IGUAIS — cheia e vazia indistinguíveis.
Vazia passa para a tinta mais fraca da skin (--tx3), que é o token que
existe exatamente para isto e dá de 3,3:1 a 3,9:1. Onde a cheia ficou
com a mesma luminância da vazia — e aí a nota volta a não se ler — a
cheia escureceu um degrau dentro da própria família de cor da skin.
--------------------------------------------------------------------- */
/* ⚠ `!important` obrigatório: a regra de §4 que pinta TODO descendente de
um papel de #2A2118 é `!important`, e important vence especificidade —
sem isto a Cartografia continuava com as cinco estrelas iguais. */
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .estrelas .st:is(*,.x.x.x.x){color:var(--tx3) !important}
html[data-skin="b"] .estrelas .st:is(*,.x.x.x.x){color:rgba(16,35,63,.50) !important}
html[data-skin="b"] .estrelas .st.on:is(*,.x.x.x.x){color:#0E4B52 !important}
html[data-skin="b"] .estrelas .st.on.alta:is(*,.x.x.x.x){color:#A85A08 !important}
html[data-skin="c"] .estrelas .st:is(*,.x.x.x.x){color:rgba(42,33,24,.50) !important}
html[data-skin="c"] .estrelas .st.on:is(*,.x.x.x.x){color:#6E5227 !important}
html[data-skin="c"] .estrelas .st.on.alta:is(*,.x.x.x.x){color:#AF0421 !important}
html[data-skin="d"] .estrelas .st.on:is(*,.x.x.x.x){color:#12797C !important}
html[data-skin="d"] .estrelas .st.on.alta:is(*,.x.x.x.x){color:#B0452E !important}
html[data-skin="e"] .estrelas .st.on:is(*,.x.x.x.x){color:#8FD9A8 !important}
html[data-skin="e"] .estrelas .st.on.alta:is(*,.x.x.x.x){color:#22C55E !important}
html[data-skin="f"] .estrelas .st.on:is(*,.x.x.x.x){color:#17C4C4 !important}
html[data-skin="f"] .estrelas .st.on.alta:is(*,.x.x.x.x){color:#F2A65A !important}
/* ---------------------------------------------------------------------
8.4 · O SELO "✓ ESCOLHIDA" NA TELA DE ARTE
O estilo-jogo.css já escreve `color:var(--sel-tx);background:var(--sel)`
— o par que toda skin define COM contraste. Só que o remapeamento de
tinta de §2 pintava o selo de --tx por cima, e aí o selo saía na cor
do texto comum sobre o fundo da seleção: C 2,15:1 · E 1,46:1 ·
F 1,99:1 · B 3,33:1 · D 3,70:1. Devolver o --sel-tx resolve quatro;
no Papel Recortado o par --sel/--sel-tx dá 4,26:1, um fio abaixo do
mínimo, e o selo passa a usar a sombra do botão (o mesmo terracota,
um degrau mais escuro).
--------------------------------------------------------------------- */
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .skins.skins-tela .skin-op.atual .skin-marca:is(*,.x.x.x),
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .skins.skins-tela .skin-op.atual .skin-marca:is(*,.x.x.x) *{
color:var(--sel-tx) !important}
html[data-skin="d"] .skins.skins-tela .skin-op.atual .skin-marca:is(*,.x.x.x){background:var(--btn-sh) !important}
/* ---------------------------------------------------------------------
8.5 · ACENTOS DE TEXTO CLAROS DEMAIS PARA 13px
Na Ilha Flutuante o turquesa e o âmbar dos acentos davam 4,04:1 e
3,89:1 sobre o PRÓPRIO papel da skin — ou seja, reprovavam mesmo sem
arte nenhuma atrás. É a legenda "✓ gratuito · ★ pago", que é a chave
de leitura da grade inteira. Descem um degrau, na mesma família.
As outras skins claras já passavam sobre o papel (C 5,1 · D 5,3+): o
que as reprovava era a arte, corrigida em §8.1.
--------------------------------------------------------------------- */
html[data-skin="b"]{--c-teal:#146069;--c-amber:#8F4C06;--c-green:#2F6B22;--c-warm:#99430F}
/* o "obrigatório" da identificação, branco sobre o terracota do Papel
Recortado: 4,33:1. O mesmo terracota, um degrau mais escuro. */
html[data-skin="d"] .ident-r .obr:is(*,.x.x.x){background:#A63F29}
/* ---------------------------------------------------------------------
8.6 · A MOEDA QUE VOA
`.moeda-voo` é o +1 que sobe quando se responde. Nasceu no tema escuro
com o turquesa #17C4C4 cravado e atravessa a tela inteira, então o
fundo dela é qualquer coisa: sobre o céu da Ilha deu 1,02:1, sobre o
papel do Recortado 1,73:1. Passa a usar a tinta da skin, com um halo
de papel que a segura sobre a arte também.
--------------------------------------------------------------------- */
html:is([data-skin="b"],[data-skin="c"],[data-skin="d"],[data-skin="e"],[data-skin="f"],[data-skin="g"]) .moeda-voo:is(*,.x.x.x){
color:var(--tx) !important;
text-shadow:0 0 4px rgba(var(--paper-rgb),.95),0 0 10px rgba(var(--paper-rgb),.8),0 2px 4px rgba(0,0,0,.25)}
/* ---------------------------------------------------------------------
8.7 · O CHIP DO VOCABULÁRIO SUMIA NO CARTÃO (Papel Recortado)
`.mg-vocab .ch` vinha com a superfície --sup2 sobre o cartão --sup, sem
sombra: diferença de luminância 0,02 — o alvo de toque não tinha borda
nenhuma. Ganha o mesmo degrau de papel que os outros chips da skin já
tinham (§5), sem mudar medida.
--------------------------------------------------------------------- */
html[data-skin="d"] .mg-vocab .ch:is(*,.x.x.x){
background:#FFFDF8 !important;box-shadow:0 3px 0 #E6D6C0 !important}
/* ---------------------------------------------------------------------
8.8 · O LATÃO DA CARTOGRAFIA ERA CLARO DEMAIS PARA TEXTO
#8A6A33 sobre o papel #F4F0E6 dá 4,40:1 — reprova por pouco, e é
justamente a cor de TODO rótulo pequeno da skin: o capítulo, o "1 de
19", o "FAROL · CIN-UFPE" da capa, os selos da devolutiva. Um degrau
mais escuro no mesmo latão (#7A5C2B) leva a 5,44:1 e não muda a
linguagem. O token `--marca` já desceu junto (§1); aqui ficam os
lugares em que a seção 4 cravou o valor antigo.
Onde o latão é FORMA e não texto — o alfinete, a bola do degrau, o fio
do cartão, a seta da rota — continua #8A6A33.
--------------------------------------------------------------------- */
html[data-skin="c"] :is(.mast,.catpg,.catmin,.mgf-deg,.falta-i,.exp-mais,.skins-rot,
.fb-passo,.fi-de,.es-mast,.fl-sub,.cartaArq-tx .mono):is(*,.x.x.x.x),
html[data-skin="c"] .capa-txt > .mono:is(*,.x.x.x.x),
html[data-skin="c"] #msub:is(*,.x.x.x.x){color:#7A5C2B !important}
/* =====================================================================
9 · G · SÓ TEXTO — a versão que não baixa imagem nenhuma
11/09/2026. O Giordano: "deve ter uma opção sem arte, sem imagens, bem
só texto, mas muito bonito, super bem acabado, mas pra pessoas que têm
internet lenta, celular lento, e que não queira carregar com as imagens
todas".
Duas regras que definem tudo o que segue:
1 · NÃO É A MESMA TELA COM AS FIGURAS ESCONDIDAS. `display:none` num
`![]()
` baixa a imagem do mesmo jeito, e `background-image` numa
regra que não se aplica é a única coisa que o navegador realmente
pula. Por isso o corte é no JavaScript (`semArte()` em app.js): a
arte não é PEDIDA. O CSS aqui só termina o serviço, para o caso de
uma imagem nova entrar sem a pergunta.
2 · TIPOGRAFIA DO SISTEMA, ZERO BYTES. Nenhuma família importada — a
fonte que já está no aparelho é a única que não custa rede: San
Francisco no iPhone, Roboto no Android. A beleza vem de escala,
espaço e fio, não de download.
A linguagem é a régua do FAROL levada ao limite: rótulo pequeno em
caixa alta, fio vermelho, manchete grande e apertada, corpo largo e
arejado, e uma hairline separando blocos. Superfície chapada: o que
organiza a página é o espaço em branco, não a sombra.
===================================================================== */
html[data-skin="g"]{
--paper:#FCFBF8;--paper-rgb:252,251,248;
--tx:#16181D;--tx2:#4A4F58;--tx3:#787F8A;
--sup:#FFFFFF;--sup2:#F2F1ED;--line:#16181D;--line2:rgba(22,24,29,.13);
--sel:#DB1E2F;--sel-tx:#FFFFFF;
--btn:#DB1E2F;--btn-tx:#FFFFFF;--btn-sh:#8A0F1C;--btn-dark:#C2172A;
--marca:#DB1E2F;--acento:#DB1E2F;--halo:219,30,47;
--c-teal:#00636E;--c-amber:#8A5A00;--c-green:#2F6B38;--c-warm:#B3341F;--c-purple:#5B3FA8;
--niv-fundo:#2B2F36;--niv-meio:#4A4F58;--niv-alto:#787F8A;--niv-suave:#B9BEC6;--niv-nome:#16181D;
--niv-tinta:#FFFFFF;--niv-halo:22,24,29;
--r:10px;--r-btn:8px;
--f1:#FCFBF8;--f2:#FCFBF8;--f3:#FCFBF8;
--gtipo:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif}
/* ---- 9.1 · nenhuma imagem, em nenhuma camada ---- */
html[data-skin="g"] :is(#cenafundo,#flfoto,.capa-arte,.mg-descida,.dg-ilha,.ilhamapa,#board .bg){
background-image:none !important}
html[data-skin="g"] #cenafundo{display:none !important}
html[data-skin="g"] .capa-arte{display:none !important}
html[data-skin="g"] :is(.palp-arte,.cartaArq img,.it .disco img,.ico-conceito){display:none !important}
html[data-skin="g"] .er-a{background-image:none !important}
/* ---- 9.2 · a tipografia do sistema, em escala editorial ---- */
html[data-skin="g"] :where(*){font-family:var(--gtipo) !important}
html[data-skin="g"] :is(.mono,.mast,.rot,.label,.catmin,.catpg,.skins-rot,
.comu-cab,.pf-cab,.dv-selo,.mg-bloco-n,.pgcab-n,.es-mast,.nt-mast,.fi-de,.tu-selo,.mgd-selo){
font-family:var(--gtipo) !important;letter-spacing:.14em;text-transform:uppercase;font-weight:700}
/* ⚠ o placar NÃO entra na régua de caixa alta: "de 119" com .14em de
entreletra quebrava em duas linhas dentro da barra de cima. */
html[data-skin="g"] :is(.placar,.pc-de,.leg,.leg *){letter-spacing:0 !important;text-transform:none !important}
/* ⚠ A ESTRELA CONTINUA NA SERIFADA. O glifo ★ da fonte do sistema é mais
largo que o da Georgia, e a régua de cinco estrelas transbordava o
cartão da ferramenta. Trocar a família de TEXTO não pode trocar a
família de um SÍMBOLO que tem medida. */
html[data-skin="g"] :is(.estrelas .st,.es-est i){font-family:Georgia,'Times New Roman',serif !important}
html[data-skin="g"] .estrelas .st{color:var(--tx3) !important}
html[data-skin="g"] .estrelas .st.on{color:var(--tx) !important}
html[data-skin="g"] .estrelas .st.on.alta{color:var(--sel) !important}
/* "BLOCO 1 DE 4" vinha no roxo da família (dado, não estilo): 2,4:1 sobre o
cartão branco. A cor da família continua no fio e nos pips. */
html[data-skin="g"] .mg-bloco-n{color:var(--tx2) !important}
html[data-skin="g"] .pgcab-dif{color:var(--tx2) !important}
html[data-skin="g"] .title{font-size:clamp(25px,7vw,31px);line-height:1.1;letter-spacing:-.022em;font-weight:800}
html[data-skin="g"] .body{font-size:16px;line-height:1.62;color:var(--tx2)}
html[data-skin="g"] .mast{font-size:13px;color:var(--acento) !important;font-weight:800}
html[data-skin="g"] .mast::after{background:var(--acento) !important;height:2px}
html[data-skin="g"] #t-intro .tit-jogo,html[data-skin="g"] #t-intro .tit-jogo span{
font-family:var(--gtipo) !important;font-weight:800 !important;
font-size:clamp(40px,12vw,58px);letter-spacing:-.045em;line-height:.94;text-transform:none;
color:var(--tx) !important;-webkit-text-fill-color:var(--tx) !important;text-shadow:none}
html[data-skin="g"] #t-intro .tit-jogo span:last-child{color:var(--acento) !important;-webkit-text-fill-color:var(--acento) !important}
/* a capa perde a faixa de arte: o fio vermelho é que abre a página */
html[data-skin="g"] .capa-txt{padding-top:26px}
html[data-skin="g"] .capa-txt::before{height:3px;width:56px;background:var(--acento) !important;margin-bottom:18px}
/* ---- 9.3 · superfície chapada: fio, não sombra ---- */
html[data-skin="g"] :is(.mo,.esc-op,.palp,.dv,.fb-op,.pgcab,.mg-bloco,.dica,.medidor,.fb-caixa,.fb-gap,
.fb-porq,.arq-sec,.sb-g,.cx,.cv2,.glos,.deg,.mgf,.mgg,.mg-art,.ident,.turma,.comu,.retomar,.conta,
.it.cel,.cartaArq,.mais,.skins.skins-tela .skin-op):is(*,.x.x.x){
background:var(--sup) !important;background-image:none !important;
border:1px solid var(--line2) !important;box-shadow:none !important;border-radius:var(--r) !important}
html[data-skin="g"] :is(.esc-op.on,.fb-op.on,.palp.on,.mo.visto,.portao-sim,.fb-f.on,.fi-pl.on,
.mg-ext-bt.on,.ch.on):is(*,.x.x.x.x){
background:var(--sup) !important;border:2px solid var(--sel) !important;color:var(--tx) !important;
box-shadow:inset 3px 0 0 var(--sel) !important}
html[data-skin="g"] .esc-op.on .esc-n:is(*,.x.x.x.x),html[data-skin="g"] .mo.visto .mo-num:is(*,.x.x.x.x){
background:var(--sel) !important;border-color:var(--sel) !important;color:#fff !important}
html[data-skin="g"] .ch:is(*,.x.x.x){border-radius:999px !important;border:1px solid var(--line2) !important;
background:var(--sup) !important;box-shadow:none !important;font-weight:600 !important}
html[data-skin="g"] .ch.on:is(*,.x.x.x.x),html[data-skin="g"] .ch.on:is(*,.x.x.x.x) *{
background:var(--sel) !important;color:#fff !important;border-color:var(--sel) !important}
/* ---- 9.4 · o botão: retângulo cheio, sem relevo ---- */
html[data-skin="g"] .btn{background:var(--btn) !important;background-image:none !important;
color:#fff !important;border:0 !important;border-radius:var(--r-btn) !important;
box-shadow:none !important;font-weight:700 !important;font-size:16px !important;
letter-spacing:.01em !important;text-transform:none !important;padding:16px 20px !important;transform:none}
html[data-skin="g"] .btn:active:not(:disabled){transform:translateY(1px);background:var(--btn-dark) !important}
html[data-skin="g"] .btn:disabled{background:var(--sup2) !important;color:var(--tx3) !important;box-shadow:none !important}
html[data-skin="g"] .btn.ghost{background:transparent !important;color:var(--tx) !important;
border:1px solid var(--line) !important}
html[data-skin="g"] :is(.voltar,.aa):is(*,.x.x.x){background:transparent !important;
border:1px solid var(--line2) !important;color:var(--tx) !important}
html[data-skin="g"] .voltar svg{stroke:var(--tx) !important}
/* ---- 9.5 · o mapa sem ilha: cada categoria é um número e um nome ---- */
html[data-skin="g"] #board{background:var(--paper) !important;border:1px solid var(--line2);border-radius:var(--r)}
html[data-skin="g"] #board .bg{background:var(--paper) !important;background-image:
linear-gradient(var(--line2) 1px,transparent 1px),linear-gradient(90deg,var(--line2) 1px,transparent 1px) !important;
background-size:34px 34px,34px 34px !important;opacity:.55}
html[data-skin="g"] .er-a{background:var(--sup) !important;border:1px solid var(--line2) !important;
border-radius:var(--r) !important;box-shadow:none !important}
html[data-skin="g"] .est.ilhareal.agora .er-a{border:2px solid var(--sel) !important}
html[data-skin="g"] .est.ilhareal.feita .er-a{background:var(--sup2) !important}
html[data-skin="g"] .est.ilhareal.falta .er-a{filter:none;opacity:.55}
/* ⚠ a régua comum pinta `.er-b` com `--sup2 !important`: sem !important
aqui, o número da categoria saía cinza-claro sobre branco (1,2:1). */
html[data-skin="g"] .er-b:is(*,.x.x.x){background:var(--tx) !important;color:#fff !important;
border-color:var(--tx) !important;border-radius:999px !important;font-weight:800}
html[data-skin="g"] .est.ilhareal.agora .er-b:is(*,.x.x.x){background:var(--sel) !important;border-color:var(--sel) !important}
html[data-skin="g"] .est.ilhareal.feita .er-b:is(*,.x.x.x){background:var(--tx2) !important;border-color:var(--tx2) !important}
html[data-skin="g"] .er-n{color:var(--tx) !important;font-weight:700}
/* ---- 9.6 · arquétipo e palpite viram ficha, não figura ---- */
html[data-skin="g"] .palp{padding:14px 16px}
html[data-skin="g"] .cartaArq{padding:16px 18px}
html[data-skin="g"] .cartaArq .mono{color:var(--acento) !important}
/* ---- 9.7 · campos ---- */
html[data-skin="g"] :is(.ident-i,#obsTxt,.ct-email,.ct-cod,.comu-campos input,textarea.aberta,.aberta):is(*,.x.x.x.x){
background:var(--sup) !important;color:var(--tx) !important;border:1px solid var(--line2) !important;
border-radius:var(--r-btn) !important;box-shadow:none !important}
html[data-skin="g"] :is(.ident-i,#obsTxt,textarea.aberta):focus{border-color:var(--sel) !important;outline:0;
box-shadow:0 0 0 3px rgba(219,30,47,.14) !important}
/* ---- 9.8 · a barra de cima: fio fino e número que não quebra ----
A trilha herdava a superfície dos cartões (a régua comum pinta
`.trilha i` com `--sup2`) e, sem regra própria, virava duas cápsulas
vazias de 26×22 no alto da tela — onde deveria haver um fio. E o
"de 119" do placar quebrava em duas linhas com a tipografia do sistema,
que é mais larga que a Inter. */
html[data-skin="g"] .trilha{gap:4px;align-items:center}
html[data-skin="g"] .trilha i{height:3px !important;border:0 !important;border-radius:2px !important;
background:var(--line2) !important}
html[data-skin="g"] .trilha i.feito{background:var(--sel) !important}
html[data-skin="g"] .trilha i.atual{height:5px !important;background:var(--tx) !important}
html[data-skin="g"] :is(.placar,.placar.pecas,.pc-de){white-space:nowrap}