.cn-jogo{--tinta:#16295e;--azul:#1f3a93;--papel:#fff8e7;--fake:#e5254b;--ouro:#ffc93c;
  margin:16px auto;
  width:min(460px,100%,max(300px,calc((100vh - 32px) * 5 / 7)));
  width:min(460px,100%,max(300px,calc((100dvh - 32px) * 5 / 7)));font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--papel);
  line-height:1.4;-webkit-user-select:none;user-select:none;box-sizing:border-box}
.cn-jogo *,.cn-jogo *::before,.cn-jogo *::after{box-sizing:border-box}
.cn-jogo .cn-palco{position:relative;width:100%;aspect-ratio:5/7;border-radius:18px;overflow:hidden;
  background:var(--azul);box-shadow:0 10px 30px rgba(22,41,94,.35)}
.cn-jogo canvas{display:block;width:100%;height:100%;touch-action:none;cursor:none}

.cn-jogo .cn-tela{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:22px;background:rgba(22,41,94,.9);overflow-y:auto;transition:opacity .25s,visibility .25s}
.cn-jogo .cn-tela.cn-oculta{opacity:0;visibility:hidden;pointer-events:none}

.cn-jogo h2,.cn-jogo h3{font-family:Georgia,"Times New Roman",serif;font-weight:700;color:var(--papel);text-transform:none;
  letter-spacing:-.5px;line-height:1;margin:0 0 10px;padding:0;border:0;background:none}
.cn-jogo h2{font-size:clamp(26px,8vw,42px);transform:rotate(-3deg)}
.cn-jogo h3{font-size:28px}
.cn-jogo [data-tela="fim"] h2{font-size:30px}
.cn-jogo p{margin:5px 0;font-size:15px;line-height:1.45;max-width:32ch;color:#dfe6ff}

.cn-jogo .cn-marca{background:#fff;border-radius:12px;padding:8px 14px;margin-bottom:16px;display:inline-flex;align-items:center;
  color:var(--tinta);font-weight:800;font-size:17px}
.cn-jogo .cn-marca img{display:block;max-height:40px;max-width:200px;width:auto;height:auto;margin:0}

.cn-jogo .cn-legenda{display:flex;gap:12px;justify-content:center;margin:12px 0 16px;flex-wrap:wrap;font-size:13px}
.cn-jogo .cn-legenda span{display:flex;align-items:center;gap:6px}
.cn-jogo .cn-ico{width:22px;height:22px;border-radius:5px;display:inline-grid;place-items:center;font-weight:800;font-size:11px;font-style:normal}

.cn-jogo button{font:inherit;font-weight:700;font-size:17px;line-height:1.2;margin:0;padding:12px 26px;border:0;border-radius:999px;cursor:pointer;
  background:var(--ouro);color:var(--tinta);box-shadow:0 5px 0 #c9951a;text-transform:none;letter-spacing:normal;transition:transform .08s,box-shadow .08s}
.cn-jogo button:active{transform:translateY(4px);box-shadow:0 1px 0 #c9951a}
.cn-jogo button:focus-visible,.cn-jogo input:focus-visible{outline:3px solid var(--papel);outline-offset:3px}
.cn-jogo button:disabled{opacity:.6;cursor:wait}

.cn-jogo .cn-modos{display:flex;gap:8px;width:100%;max-width:340px;margin-bottom:10px}
.cn-jogo .cn-modos button{flex:1;padding:10px 4px;font-size:16px;display:flex;flex-direction:column;align-items:center;border-radius:14px}
.cn-jogo .cn-modos small{font-size:11px;font-weight:600;opacity:.8;margin-top:2px}
.cn-jogo .cn-modos [data-modo="facil"]{background:#7ee0a8;box-shadow:0 5px 0 #3e9e6a}
.cn-jogo .cn-modos [data-modo="dificil"]{background:var(--fake);color:#fff;box-shadow:0 5px 0 #a3132f}
.cn-jogo .cn-modos button:active{box-shadow:none}

.cn-jogo .cn-link{background:none;box-shadow:none;color:var(--papel);text-decoration:underline;text-underline-offset:3px;font-size:15px;padding:8px 12px}
.cn-jogo .cn-link:active{transform:none;box-shadow:none}

.cn-jogo .cn-abas{display:flex;gap:6px;margin:6px 0 14px}
.cn-jogo .cn-abas button{background:rgba(255,248,231,.12);color:var(--papel);box-shadow:none;font-size:14px;padding:7px 14px}
.cn-jogo .cn-abas button[aria-selected="true"]{background:var(--papel);color:var(--tinta)}

.cn-jogo ol.cn-lista{list-style:none;margin:0 0 6px;padding:0;width:100%;max-width:320px;text-align:left}
.cn-jogo .cn-lista li{display:flex;align-items:center;gap:10px;margin:0;padding:6px 10px;border-radius:8px;font-size:15px;color:var(--papel)}
.cn-jogo .cn-lista li:nth-child(odd){background:rgba(255,248,231,.07)}
.cn-jogo .cn-lista .cn-pos{width:24px;font-weight:800;color:var(--ouro);text-align:right}
.cn-jogo .cn-lista .cn-nome{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cn-jogo .cn-lista b{font-variant-numeric:tabular-nums}
.cn-jogo .cn-lista li.cn-eu{background:var(--ouro);color:var(--tinta)}
.cn-jogo .cn-lista li.cn-eu .cn-pos{color:var(--tinta)}
.cn-jogo .cn-lista li.cn-vazio{justify-content:center;opacity:.75;background:none}

.cn-jogo .cn-form{width:100%;max-width:320px;margin:8px 0 10px}
.cn-jogo .cn-form[hidden]{display:none}
.cn-jogo .cn-form label{display:block;font-size:14px;margin-bottom:6px;color:var(--ouro);font-weight:700}
.cn-jogo .cn-linha{display:flex;gap:6px}
.cn-jogo .cn-form input,.cn-jogo .cn-form input[type="text"]{
  display:block!important;flex:1 1 auto!important;width:auto!important;min-width:0!important;max-width:none!important;height:auto!important;
  margin:0!important;padding:10px 12px!important;font:inherit!important;font-size:16px!important;line-height:1.3!important;
  border:2px solid #fff8e7!important;border-radius:10px!important;background:#fff8e7!important;color:#16295e!important;
  -webkit-text-fill-color:#16295e!important;box-shadow:none!important;opacity:1!important;visibility:visible!important;
  -webkit-appearance:none!important;appearance:none!important;text-align:left!important}
.cn-jogo .cn-form input::placeholder{color:#6b77a3!important;-webkit-text-fill-color:#6b77a3!important;opacity:1!important}
.cn-jogo .cn-form input:focus{border-color:#ffc93c!important;outline:none!important}
.cn-jogo .cn-form button{font-size:15px;padding:10px 16px;border-radius:10px;box-shadow:0 3px 0 #c9951a}
.cn-jogo .cn-msg{font-size:13px;min-height:1.2em;color:#ffd0d8;margin:6px 0 0;max-width:none}

.cn-jogo .cn-grande{font-family:Georgia,serif;font-size:56px;font-weight:700;line-height:1;color:var(--ouro);margin:2px 0 6px}
.cn-jogo .cn-acoes{display:flex;gap:10px;align-items:center;margin-top:10px}
.cn-jogo .cn-dica{font-size:12px;opacity:.75}

@media (prefers-reduced-motion:reduce){.cn-jogo .cn-tela,.cn-jogo button{transition:none}}

.cn-jogo ol.cn-lista[hidden]{display:none}
.cn-jogo .cn-lista li.cn-vazio{text-align:center;line-height:1.35}