:root{color-scheme:light;--indigo:#11273c;--azul:#173f59;--azul-claro:#224f6d;--papel:#f4efdf;--laranja:#f2992e;--verde:#173f2a;font-family:"Segoe UI",system-ui,sans-serif;color:var(--indigo)}
*{box-sizing:border-box}
html,body{width:100%;min-height:100%;margin:0}
body{min-height:100dvh;padding:clamp(10px,2vw,22px);display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:10px;background-color:#d5d3c4;background-image:radial-gradient(#11273c12 .8px,transparent .8px);background-size:7px 7px}
.cabecalho,.instrucao{width:min(100%,620px);margin:0 auto}.cabecalho{display:flex;align-items:center;justify-content:space-between;gap:12px}.produto-marca{font-size:.94rem}.marca-aplicacao{font-size:1.2rem;font-weight:750}.cabecalho a{color:var(--verde);text-decoration:none}.instrucao{text-align:center;color:#486157;font-size:.82rem}
.adicionar-botao{display:grid;place-items:center;width:34px;height:34px;padding:0;border:0;border-radius:50%;color:var(--papel);background:var(--indigo);box-shadow:0 3px 8px #07162455;font:300 1.8rem/1 system-ui;cursor:pointer}.adicionar-botao:hover{color:var(--laranja);background:#183a56}.adicionar-botao:focus-visible,.menu-adicionar button:focus-visible,.botao-apoio:focus-visible{outline:3px solid #e8d73a;outline-offset:3px}
.palco{--placa-topo:clamp(96px,21%,165px);--corda-topo:-8px;position:relative;width:min(100%,620px);height:100%;min-height:470px;margin:0 auto;overflow:hidden}
.corda{position:absolute;z-index:3;top:var(--corda-topo);width:12px;height:calc(var(--placa-topo) - var(--corda-topo) + 19px);border-radius:999px;background:repeating-linear-gradient(115deg,#f7b04d 0 4px,#c96f19 5px 8px,#f2992e 9px 12px);box-shadow:inset 2px 0 #ffd18a80,inset -2px 0 #743b1266,0 3px 7px #07162455}.corda::after{content:"";position:absolute;left:50%;bottom:-8px;width:19px;height:14px;border:5px solid var(--laranja);border-top:0;border-radius:0 0 12px 12px;transform:translateX(-50%)}.corda-esquerda{left:22%}.corda-direita{right:22%}
.placa-apoio{position:absolute;z-index:2;top:var(--placa-topo);left:50%;width:min(94%,520px);padding:clamp(14px,3vw,22px);border:9px solid #081d2e;border-radius:8px;background:repeating-linear-gradient(1deg,transparent 0 38px,#ffffff08 39px,#06131e20 41px),linear-gradient(100deg,var(--azul),var(--azul-claro) 48%,#12344d);box-shadow:0 22px 34px #06131e75,inset 0 0 0 2px #315c78,inset 13px 0 22px #06131e45;color:var(--papel);transform:translateX(-50%)}
.placa-marca{display:grid;justify-items:center;margin:0 0 14px;text-shadow:0 2px 2px #0007}.placa-marca em{font:italic clamp(1.45rem,5vw,2rem)/1 Georgia,serif}.placa-marca small{margin-top:5px;color:var(--laranja);font-size:.55rem;font-weight:800;letter-spacing:.24em}
.botoes-apoio{display:grid;gap:10px}.botao-apoio{display:flex;align-items:center;justify-content:center;min-height:48px;padding:9px 12px;border-radius:7px;font-weight:750;text-align:center;text-decoration:none;box-shadow:0 3px 8px #06131e55;transition:translate .16s ease,filter .16s ease}.botao-apoio:hover{translate:0 -2px;filter:brightness(1.1)}.botao-github{border:1px solid #30363d;color:#f0f6fc;background:#21262d}.botao-github span{margin-right:8px;color:#db61a2;font-size:1.3rem}.botao-kofi{width:100%;border:0;color:#fff;background:#0d365e;font:inherit;cursor:pointer}.icone-kofi{width:31px;height:24px;margin-right:8px;overflow:visible;filter:drop-shadow(0 1px 1px #06131e88);transform-origin:52% 55%;animation:kofi-balanco 2.8s ease-in-out infinite}.xicara-kofi{fill:#fff}.alca-kofi{fill:none;stroke:#fff;stroke-width:4;stroke-linecap:round}.coracao-kofi{fill:#ff5e5b}.botao-kofi:hover .icone-kofi{animation-duration:.65s}.botao-apoia{border:1px solid #18b0c4;color:#fff;background:#0c4852aa}.botao-personalizado{border:1px solid #f2992e;color:#11273c;background:#f4efdf}
@keyframes kofi-balanco{0%,76%,100%{transform:rotate(0)}82%{transform:rotate(-8deg)}88%{transform:rotate(7deg)}94%{transform:rotate(-3deg)}}
.botao-apoio[hidden]{display:none}
.menu-adicionar{position:fixed;z-index:100;width:min(310px,calc(100vw - 16px));padding:8px;border:1px solid #11273c35;border-radius:10px;background:#f4efdf;box-shadow:0 14px 35px #07162470}.menu-adicionar[hidden]{display:none}.menu-adicionar button{display:grid;width:100%;padding:9px 10px;border:0;border-radius:7px;color:#11273c;background:transparent;text-align:left;cursor:pointer}.menu-adicionar button:hover{background:#11273c0d}.menu-adicionar span{font-weight:750}.menu-adicionar small,.menu-adicionar p{color:#52666b}.menu-adicionar p{margin:7px 10px 4px;font-size:.72rem}
.janela-apoio{position:fixed;z-index:200;inset:0;display:grid;place-items:center;padding:clamp(10px,3vw,28px)}.janela-apoio[hidden]{display:none}.janela-apoio-fundo{position:absolute;z-index:0;inset:0;width:100%;height:100%;padding:0;border:0;background:#06131edb;cursor:default}.janela-apoio-conteudo{position:relative;z-index:1;display:grid;grid-template-rows:auto minmax(0,1fr);gap:7px;width:min(96vw,1120px);height:min(92dvh,900px);min-height:0}.janela-apoio iframe{display:block;width:100%;height:100%;min-height:0;border:0;border-radius:9px;background:#fff;box-shadow:0 24px 60px #02080dcc}.janela-apoio[data-plataforma="kofi"] .janela-apoio-conteudo{width:min(94vw,760px);height:min(88dvh,770px)}.voltar-placa{justify-self:start;padding:.5rem .75rem;border:1px solid var(--laranja);border-radius:999px;color:var(--papel);background:var(--indigo);font:700 .78rem/1 system-ui;cursor:pointer}.voltar-placa:focus-visible{outline:3px solid #e8d73a;outline-offset:2px}
html[data-embed="1"] body{padding:0;background:transparent;grid-template-rows:minmax(0,1fr)}html[data-embed="1"] :is(.cabecalho,.instrucao){display:none}html[data-embed="1"] .palco{--placa-topo:clamp(58px,16%,72px);width:100%;height:100%;min-height:0}html[data-embed="1"] .placa-apoio{width:calc(100% - 8px);padding:12px 10px;border-width:7px}html[data-embed="1"] .placa-marca{margin-bottom:11px}html[data-embed="1"] .corda{width:10px}html[data-embed="1"] .corda-esquerda{left:24%}html[data-embed="1"] .corda-direita{right:24%}html[data-embed="1"] .botao-apoio{min-height:44px;font-size:.9rem}
@media(max-width:420px){.produto-marca{font-size:.82rem}.palco{min-height:430px}.placa-apoio{width:96%}}
@media(prefers-reduced-motion:reduce){.botao-apoio{transition:none}.icone-kofi{animation:none}}
