/* /artes/artes.css
   Artes do dono nos cards (2026-09-24): entrada do Naruto (.game-card) e Hub de Eventos (.subtab).
   A moldura original das artes tem os cantos chanfrados e muda um pouco de uma arte pra outra;
   por isso as imagens em /artes/ são recortadas POR DENTRO dela e o site desenha uma moldura
   octogonal única:  .arte-moldura (ouro) > .arte-filete (escuro) > img (a arte).
   Mockup aprovado: docs/mockups/upgrade/artes-do-dono.html */

.arte-oct{clip-path:polygon(var(--c) 0,calc(100% - var(--c)) 0,100% var(--c),100% calc(100% - var(--c)),calc(100% - var(--c)) 100%,var(--c) 100%,0 calc(100% - var(--c)),0 var(--c));}
.arte-moldura{--c:12px;display:block;padding:3px;background:linear-gradient(160deg,#ffe28f,#e8ac34 45%,#b77a16);}
.arte-filete{--c:10.5px;display:block;padding:1.5px;background:#2b1705;}
.arte-img{--c:9.5px;display:block;width:100%;height:auto;aspect-ratio:800/376;object-fit:cover;}

/* ---- entrada do Naruto: a arte ocupa o lugar do ícone, no topo do card ---- */
.game-card.game-card-arte{display:flex;flex-direction:column;padding:10px 10px 18px;border-color:rgba(227,179,65,.32);}
.game-card.game-card-arte:hover{border-color:rgba(227,179,65,.6);}
.game-card-arte .arte-moldura{margin-bottom:14px;transition:filter .2s;}
.game-card-arte:hover .arte-moldura{filter:brightness(1.08);}
.game-card-arte > h3,.game-card-arte > p,.game-card-arte > .game-card-chips,.game-card-arte > .game-card-go{margin-left:10px;margin-right:10px;}
.game-card-arte > .game-card-go{align-self:flex-start;margin-top:auto;}
/* card ainda sem arte (Coach): mesma moldura, fundo azul-escuro e o ícone de sempre no canto */
.arte-vazia{--c:9.5px;position:relative;display:block;width:100%;aspect-ratio:800/376;background:radial-gradient(120% 90% at 70% 40%,#1d3b52,#0c1a26 70%);}
.arte-vazia .game-card-svg-wrap{position:absolute;left:5%;top:9%;width:20%;height:auto;aspect-ratio:1;margin:0;border-radius:12px;background:linear-gradient(180deg,#7fe9ff,#1fb5e0);border:3px solid #f3c451;}
.arte-vazia .game-card-svg-wrap svg{width:48%;height:48%;stroke:#08243a;}
.game-card-arte:hover .arte-vazia .game-card-svg-wrap{transform:none;background:linear-gradient(180deg,#9ff0ff,#34c3ea);}
.game-card-arte:hover .arte-vazia .game-card-svg-wrap svg{stroke:#08243a;}

/* ---- Hub de Eventos: card com arte (a arte entra no lugar do ícone) ---- */
#page-eventos .subtab .ev-arte,#page-eventos .subtab .ev-nome{display:none;}
#page-eventos.eventos-hub-mode .events-week-group .subtab.subtab-com-arte{position:relative;padding:12px;gap:10px;border-color:rgba(227,179,65,.32);}
#page-eventos.eventos-hub-mode .events-week-group .subtab.subtab-com-arte:hover{border-color:var(--gold,#e3b341);}
#page-eventos.eventos-hub-mode .events-week-group .subtab.subtab-com-arte::before{display:none;}
#page-eventos.eventos-hub-mode .subtab-com-arte .ev-arte{display:block;width:100%;}
#page-eventos.eventos-hub-mode .subtab-com-arte .ev-nome{display:block;padding:0 2px;}
#page-eventos.eventos-hub-mode .subtab-com-arte .arte-moldura{--c:9px;padding:2.5px;}
#page-eventos.eventos-hub-mode .subtab-com-arte .arte-filete{--c:8px;padding:1px;}
#page-eventos.eventos-hub-mode .subtab-com-arte .arte-img{--c:7px;}
/* "em breve": o card já fica esmaecido pelo site; o selo vai pra cima da arte com fundo escuro pra ler */
#page-eventos.eventos-hub-mode .subtab-com-arte.subtab-soon::after{position:absolute;top:20px;right:20px;z-index:1;background:rgba(8,12,19,.88);}