/*! © 2026 Anderson Rodrigo Costa */
:root{--ink:#2b3a67;--sol:#ffd23f;--laranja:#ffab40;--verde:#5fd16a;--rosa:#ff7fb0;--creme:#fff6e0}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}html,body{height:100%;overflow:hidden}body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--ink);background:#79d2ff;user-select:none;-webkit-user-select:none;touch-action:manipulation;}#ceu{position:fixed;inset:0;width:100%;height:100%;z-index:0}#app{position:fixed;inset:0;z-index:1}.tela{position:absolute;inset:0;display:none;padding:12px}.tela.ativa{display:flex}.px{image-rendering:pixelated;image-rendering:crisp-edges}.bt{position:relative;width:58px;height:58px;border:4px solid var(--ink);border-radius:16px;background:var(--laranja);box-shadow:4px 5px 0 var(--ink);cursor:pointer;display:grid;place-items:center;padding:0;flex:none;font-size:26px;font-weight:900;color:var(--ink);}.bt canvas{width:36px;height:36px}.bt:active{transform:translate(3px,4px);box-shadow:1px 1px 0 var(--ink)}.bt.verde{background:var(--verde)}.bt.rosa{background:var(--rosa)}.bt.amarelo{background:var(--sol)}.bt.grande{width:70px;height:70px;font-size:32px;color:#fff;text-shadow:0 2px 0 var(--ink)}.bt:disabled{filter:grayscale(1);opacity:.5;box-shadow:2px 3px 0 var(--ink);cursor:default}.bt.off canvas{opacity:.35}.bt.off::after{content:'';position:absolute;left:6px;right:6px;top:50%;height:6px;margin-top:-3px;background:#e63946;border:2px solid var(--ink);border-radius:4px;transform:rotate(-40deg)}#intro.ativa{flex-direction:column;align-items:center;justify-content:center;gap:22px;cursor:pointer}#tit{width:min(92vw,620px);height:auto}.duo{display:flex;gap:min(6vw,40px);align-items:flex-end}.duo canvas{width:min(30vw,170px,24vh);height:auto;animation:pula 1s steps(4) infinite}.duo canvas+canvas{animation-delay:.5s}@keyframes pula{0%,100%{transform:translateY(0)}50%{transform:translateY(-16px)}}.toque{font-weight:900;font-size:22px;color:#fff;text-shadow:0 3px 0 var(--ink),2px 0 0 var(--ink),-2px 0 0 var(--ink);animation:pisca 1.2s ease-in-out infinite}@keyframes pisca{50%{opacity:.35}}.rodape{position:absolute;bottom:22px;left:0;right:0;text-align:center;color:var(--ink);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:2px}.rodape b{display:block;font-size:15px;letter-spacing:1px;text-transform:none;margin-top:2px}#galeria.ativa{flex-direction:column;gap:14px}#galeria header{display:flex;align-items:center;justify-content:space-between;gap:12px}#titG{width:min(60vw,300px);height:auto}#temas{flex:1;overflow:auto;padding:4px 6px 30px}.tema h2{display:inline-block;background:var(--sol);border:4px solid var(--ink);border-radius:12px;padding:3px 14px;font-size:18px;box-shadow:3px 4px 0 var(--ink);margin:12px 0 16px}.cards{display:flex;flex-wrap:wrap;gap:20px}.card{width:128px;background:#fff;border:4px solid var(--ink);border-radius:18px;padding:8px;cursor:pointer;position:relative;box-shadow:4px 5px 0 var(--ink)}.card:active{transform:translate(3px,4px);box-shadow:1px 1px 0 var(--ink)}.card canvas{width:100%;aspect-ratio:1;display:block;border-radius:6px}.card .nome{text-align:center;font-weight:800;font-size:14px;margin-top:6px}.card .est{position:absolute;top:-16px;right:-14px;font-size:32px;animation:pula 1.4s steps(3) infinite}#pintura.ativa{display:grid;gap:12px 16px;grid-template-columns:1fr 200px;grid-template-rows:auto 1fr auto;grid-template-areas:"topo topo" "centro side" "pots pots";}.topo{grid-area:topo;display:flex;align-items:center;gap:12px}#titP{flex:1;min-width:0;max-width:300px;height:auto;margin:0 auto}.centro{grid-area:centro;display:grid;place-items:center;min-width:0;min-height:0}.moldura{background:var(--creme);border:4px solid var(--ink);border-radius:20px;padding:12px;box-shadow:5px 6px 0 var(--ink);transition:padding .4s}#grade{--n:10;display:grid;grid-template-columns:repeat(var(--n),1fr);gap:3px;aspect-ratio:1;width:min(calc(100vw - 300px),calc(100vh - 230px),700px);transition:gap .4s;}.cel{background:#ece4f7;border-radius:6px;display:grid;place-items:center;position:relative;cursor:pointer;transition:border-radius .4s}.cel i{width:44%;height:44%;border:2px solid var(--ink);border-radius:50%;display:block}.cel.pintada i{display:none}.cel.alvo{outline:4px solid var(--rosa);outline-offset:-3px;z-index:1}#pintura.fim #grade{gap:0;animation:pop .5s ease-out}#pintura.fim .cel{border-radius:0}#pintura.fim .moldura{padding:8px}@keyframes pop{0%{transform:scale(.92)}60%{transform:scale(1.04)}100%{transform:scale(1)}}.side{grid-area:side;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px}.quadro{position:relative;background:#fff;border:4px solid var(--ink);border-radius:10px;padding:6px;box-shadow:5px 6px 0 var(--ink);transform:rotate(2deg);width:100%}.quadro::before{content:'';position:absolute;top:-14px;left:50%;width:56px;height:18px;margin-left:-28px;background:rgba(255,210,63,.9);border:2px solid var(--ink);transform:rotate(-4deg)}#mini{width:100%;aspect-ratio:1;display:block}#mascote{width:96px;height:auto;animation:pula 1.2s steps(3) infinite}#paleta{grid-area:pots;display:flex;gap:20px;justify-content:center;align-items:flex-start;background:#fff;border:4px solid var(--ink);border-radius:20px;padding:12px 18px 8px;box-shadow:5px 6px 0 var(--ink);touch-action:none;overflow-x:auto}.pote{display:flex;flex-direction:column;align-items:center;gap:6px;flex:none}.pote span{font-size:11px;font-weight:800;pointer-events:none}.cor{position:relative;width:60px;height:60px;border-radius:50%;border:4px solid var(--ink);box-shadow:3px 4px 0 var(--ink);cursor:grab;transition:transform .12s}.cor::before{content:'';position:absolute;left:10px;top:9px;width:15px;height:8px;background:rgba(255,255,255,.75);border-radius:6px;transform:rotate(-30deg)}.cor.sel{transform:translateY(-9px) scale(1.08);outline:5px solid var(--sol)}.cor.feita{opacity:.4;cursor:default}.cor.feita::after{content:'✔';position:absolute;inset:0;display:grid;place-items:center;font-size:30px;color:#fff;text-shadow:0 2px 0 var(--ink),2px 0 0 var(--ink),-2px 0 0 var(--ink)}.cor.dica{animation:dica .4s ease-in-out 3}@keyframes dica{50%{transform:translateY(-10px) scale(1.15);outline:5px solid var(--sol)}}#paleta.pisca .cor{animation:dica .35s ease-in-out 2}.bolinha{position:fixed;width:40px;height:40px;border-radius:50%;border:4px solid var(--ink);box-shadow:3px 4px 0 rgba(43,58,103,.5);transform:translate(-50%,-50%);pointer-events:none;z-index:60}#fimBox{grid-area:pots;display:none;align-items:center;justify-content:center;gap:22px;background:#fff;border:4px solid var(--ink);border-radius:20px;padding:8px 20px;box-shadow:5px 6px 0 var(--ink)}#pintura.fim #paleta{display:none}#pintura.fim #fimBox{display:flex;animation:pop .5s ease-out}#mascoteFim{width:54px;height:auto;animation:pula .8s steps(3) infinite}.fimTxt{font-size:16px;font-weight:800;color:#d6336c}.fimTxt b{display:block;font-size:22px;color:var(--ink)}#confete{position:fixed;inset:0;pointer-events:none;z-index:70;overflow:hidden}.conf{position:absolute;top:-40px;animation:cai linear forwards}@keyframes cai{to{transform:translateY(112vh) rotate(380deg)}}#creditos.ativa,#bloqueio.ativa{align-items:center;justify-content:center}.cartao a.autor{text-decoration:none;word-break:break-all}.cartao{background:#fff;border:4px solid var(--ink);border-radius:26px;padding:26px 28px;max-width:420px;width:100%;text-align:center;box-shadow:6px 8px 0 var(--ink);display:flex;flex-direction:column;align-items:center;gap:10px}.cartao .por{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:2px;opacity:.7}.cartao .autor{font-size:26px;font-weight:900;color:#d6336c}.cartao p{font-size:14px;line-height:1.4}.cartao .mudo{opacity:.6;font-size:12px}.cartao .bt{margin-top:8px}@media (max-aspect-ratio:1/1){#pintura.ativa{grid-template-columns:1fr;grid-template-rows:auto auto 1fr auto;grid-template-areas:"topo" "side" "centro" "pots"}.bt{width:52px;height:52px}.bt canvas{width:32px;height:32px}.side{flex-direction:row;gap:22px}.quadro{width:90px;padding:4px}#mascote{width:64px}#grade{width:min(calc(100vw - 52px),calc(100vh - 360px),620px)}#paleta{gap:12px;padding:10px 12px 8px;justify-content:space-around}.cor{width:52px;height:52px}#fimBox{gap:12px;padding:6px 14px}.bt.grande{width:60px;height:60px;font-size:28px}.card{width:min(calc(50% - 14px),170px)}}@media (min-width:700px) and (max-aspect-ratio:1/1){.bt{width:62px;height:62px}.bt canvas{width:38px;height:38px}.quadro{width:140px}#mascote{width:100px}.cor{width:66px;height:66px}#paleta{gap:22px}#grade{width:min(calc(100vw - 64px),calc(100vh - 400px),760px)}#pintura.fim #grade{width:min(calc(100vw - 64px),calc(100vh - 410px),700px)}}@media (min-width:1300px) and (min-aspect-ratio:1/1){#pintura.ativa{grid-template-columns:1fr 280px}#grade{width:min(calc(100vw - 400px),calc(100vh - 240px),780px)}#mascote{width:120px}.cor{width:68px;height:68px}}@media (orientation:landscape) and (max-height:520px){.tela{padding:8px}#pintura.ativa{grid-template-columns:auto 1fr auto;grid-template-rows:auto 1fr;grid-template-areas:"topo centro pots" "side centro pots";gap:8px 12px}.topo{flex-direction:column;gap:10px}#titP,#mascote{display:none}.bt{width:46px;height:46px;border-width:3px;border-radius:13px;box-shadow:3px 4px 0 var(--ink)}.bt canvas{width:28px;height:28px}.side{justify-content:flex-start;padding-top:14px}.quadro{width:90px;padding:4px;border-width:3px}.moldura{padding:8px;border-width:3px}#grade{width:min(calc(100vh - 66px),calc(100vw - 260px),620px)}#paleta{flex-direction:column;gap:10px;padding:10px 10px;overflow-x:hidden;overflow-y:auto;border-width:3px}.pote span{display:none}.cor{width:46px;height:46px}#fimBox{flex-direction:column;gap:8px;padding:8px 10px;border-width:3px}.fimTxt{display:none}#mascoteFim{width:38px}.bt.grande{width:54px;height:54px;font-size:26px}#intro.ativa{gap:10px}.duo canvas{width:min(20vw,110px)}.toque{font-size:18px}.rodape{bottom:6px}#galeria.ativa{gap:8px}.card{width:110px}}#folha{display:none}@media print{@page{margin:12mm}html,body{height:auto;overflow:visible;background:#fff}#app,#ceu,#confete,.bolinha{display:none!important}#folha{display:flex;flex-direction:column;align-items:center;gap:8mm;color:#000}#folhaTit{width:110mm;height:auto}#folhaNome{font-size:26pt;font-weight:900}#folhaCv{width:150mm;height:150mm;border:1.5mm solid #000}#folhaCred{font-size:11pt}}@media (prefers-reduced-motion:reduce){*{animation:none!important}}