/* Carregado por último em index.html: ajustes que precisam vencer os estilos antigos. */
/* ==========================================================================
   MENOS CAIXA, MAIS TEXTO (2026-09-29)
   Botões secundários, abas do ranking e setas das novidades perderam contorno
   e fundo: fica só o texto, com brilho e movimento ao passar o mouse.
   ========================================================================== */

/* "Conhecer o reino": texto com traço dourado que se completa no hover. */
.hero-actions .button-ghost{border:0;background:none;box-shadow:none;padding:15px 4px;gap:14px;color:var(--gold-pale);position:relative;justify-content:flex-start}
.hero-actions .button-ghost::after{content:"";position:absolute;left:4px;right:4px;bottom:11px;height:1px;background:linear-gradient(90deg,var(--gold),rgba(211,165,79,0));transform:scaleX(.32);transform-origin:left;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.hero-actions .button-ghost:hover{background:none;border:0;transform:none;color:#fff3d0;text-shadow:0 0 18px rgba(241,213,143,.45)}
.hero-actions .button-ghost:hover::after{transform:scaleX(1)}
.hero-actions .button-ghost span{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.hero-actions .button-ghost:hover span{transform:translateX(6px)}

/* Abas do ranking: só o nome; a escolhida ganha o dourado e o fio de luz embaixo. */
.rank-tab,.rank-tab:hover,.rank-tab.is-selected{border-color:transparent;background:none;box-shadow:none;transform:none}
.rank-tab::before{display:none}
.rank-tab:hover{color:var(--gold-pale);text-shadow:0 0 14px rgba(241,213,143,.35)}
.rank-tab.is-selected{color:#ffe4a0;text-shadow:0 0 16px rgba(241,213,143,.4)}
.rank-tab.is-selected::after{left:30%;right:30%;height:1px}

/* Setas e pausa das novidades: só o símbolo. */
.news-controls button{border:0;background:none;width:auto;height:auto;padding:4px 7px;font-size:22px;line-height:1;color:var(--gold-pale);transition:color .2s,text-shadow .2s,transform .3s cubic-bezier(.2,.8,.2,1)}
.news-controls button:hover{border:0;background:none;color:#fff3d0;text-shadow:0 0 14px rgba(241,213,143,.6)}
.news-controls #news-prev:hover{transform:translateX(-4px)}
.news-controls #news-next:hover{transform:translateX(4px)}
.news-controls #news-pause{font-size:15px}

/* Favorito do guia: o selo mora ao lado do nome da invasão. */
.guide-title-row{display:flex;align-items:center;gap:14px}
.guide-fav{flex:none;width:34px;height:34px;padding:0;border:0;background:none;cursor:pointer;color:rgba(241,213,143,.42);transition:color .25s,transform .3s cubic-bezier(.3,1.6,.5,1)}
.guide-fav svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linejoin:round}
.guide-fav:hover{color:var(--gold-pale);transform:scale(1.1) rotate(-6deg)}
.guide-fav.is-on{color:#f1c95e}
.guide-fav.is-on svg{fill:currentColor;filter:drop-shadow(0 0 9px rgba(241,201,94,.55));animation:favPop .5s cubic-bezier(.3,1.7,.5,1)}
.guide-nav-fav,.event-fav{display:none;color:#f1c95e}
.guide-nav-fav svg,.event-fav svg{width:100%;height:100%;fill:currentColor}
.guide-nav-fav.is-on{display:inline-flex;width:13px;height:13px;margin-left:auto}
.event-fav.is-on{display:inline-block;width:15px;height:15px;margin-left:9px;vertical-align:1px;filter:drop-shadow(0 0 6px rgba(241,201,94,.5))}
@keyframes favPop{0%{transform:scale(.4) rotate(-30deg)}100%{transform:none}}
@media(prefers-reduced-motion:reduce){html:not(.force-motion) .guide-fav.is-on svg{animation:none}}

/* ==========================================================================
   ASSETS PRÓPRIOS (assets/ui, gerados pelo Caio em 2026-09-29)
   No lugar dos ✦, fios, losangos e quadrados genéricos.
   ========================================================================== */

/* Marcador: ponta de lança com pena. */
.ui-marca{display:inline-block;flex:none;width:22px;height:14px;padding:0;background:url('assets/ui/marcador.webp') center/contain no-repeat;vertical-align:-2px;text-shadow:none}
.event-note .ui-marca{margin-right:10px}
.change-item>.ui-marca,.system-guide-item>.ui-marca{margin-top:4px}
.zumbi-mark.ui-marca{width:24px;height:15px;margin-top:5px}

/* Dica de batalha e dica de campo: espadas cruzadas com escudo. */
.ui-dica{display:inline-block;flex:none;width:34px;height:34px;background:url('assets/ui/icone-dica.webp') center/contain no-repeat;filter:drop-shadow(0 4px 10px rgba(0,0,0,.5))}

/* Selo de favorito: apagado e aceso. */
.guide-fav{width:40px;height:40px}
.guide-fav img,.guide-nav-fav img,.event-fav img{width:100%;height:100%;object-fit:contain;display:block}
.guide-fav .fav-on,.guide-fav.is-on .fav-off,.guide-nav-fav .fav-off,.event-fav .fav-off{display:none}
.guide-fav.is-on .fav-on{display:block;animation:favPop .5s cubic-bezier(.3,1.7,.5,1)}
.guide-fav .fav-off{opacity:.62;transition:opacity .25s}
.guide-fav:hover .fav-off{opacity:1}
.guide-fav.is-on{filter:drop-shadow(0 0 10px rgba(241,201,94,.45))}
.guide-nav-fav.is-on{width:18px;height:18px}
.event-fav.is-on{width:20px;height:20px;vertical-align:-2px;filter:none}

/* Ornamento de filigrana no lugar do fio dourado solto. */
.guide-rule,.note-rule{width:260px;height:22px;background:url('assets/ui/divisor.webp') left center/contain no-repeat}
.guide-rule{margin:14px 0 26px}
.note-rule{margin:26px 0}
.note-rule::after{display:none}

/* Canto em filigrana nos cards de invasão, no lugar do quadrado girado. */
.event-card:after{bottom:6px;right:6px;width:92px;height:94px;border:0;transform:none;background:url('assets/ui/canto.webp') right bottom/contain no-repeat;opacity:.55;transition:opacity .3s}
.event-card:hover:after,.event-card.is-next:after{opacity:.85}


/* Grade quadriculada por cima do topo: saiu. */
.hero-grid,.updates-hero::before{display:none}

/* "E tem muito mais lá dentro": lista em colunas, cada nome com o marcador do site.
   Antes eram nomes corridos com um ponto entre eles, e o ponto sobrava no fim de cada linha. */
.more-systems-list{display:block;columns:3 190px;column-gap:28px}
.more-systems-list li{display:flex;align-items:center;gap:8px;break-inside:avoid;padding:4px 0;border:0;background:none;color:#e3cf9e;font:600 13px Manrope,Arial,sans-serif;letter-spacing:0;text-transform:none;transition:color .2s,text-shadow .2s}
.more-systems-list li::before{content:"";flex:none;width:16px;height:10px;background:url('assets/ui/marcador.webp') center/contain no-repeat;opacity:.75}
.more-systems-list li:hover{color:#fff3d0;text-shadow:0 0 12px rgba(241,213,143,.45)}
@media(max-width:540px){.more-systems-list{columns:2;column-gap:16px}}

/* Voltar ao topo: a ponta de lança do marcador, apontando para cima, sem caixa. */
.back-to-top{width:46px;height:46px;border:0;background:none;backdrop-filter:none;-webkit-backdrop-filter:none;font-size:0;color:transparent}
.back-to-top::before{content:"";position:absolute;inset:0;background:url('assets/ui/marcador.webp') center/contain no-repeat;transform:rotate(-90deg);filter:drop-shadow(0 4px 10px rgba(0,0,0,.6));transition:transform .3s cubic-bezier(.2,.8,.2,1),filter .3s}
.back-to-top:hover{border:0;background:none}
.back-to-top:hover::before{transform:rotate(-90deg) translateX(5px);filter:drop-shadow(0 0 12px rgba(241,213,143,.55))}

/* Notas de atualização: canto de filigrana no lugar do losango, resumo e versão só em texto. */
.update-detail::after{right:12px;top:12px;width:150px;height:150px;border:0;transform:scaleY(-1);background:url('assets/ui/canto.webp') right bottom/contain no-repeat;opacity:.85}
.note-summary{display:flex;flex-wrap:wrap;gap:6px 34px;border:0;background:none}
.note-summary div{padding:0;gap:3px}
.note-summary div+div{border-left:0}
.note-meta span{padding:0;min-height:0;border:0;background:none;color:var(--gold-pale);text-shadow:0 0 12px rgba(241,213,143,.35)}
.updates-sidebar button::after{border:0;width:18px;height:11px;background:url('assets/ui/marcador.webp') center/contain no-repeat;right:14px;transform:translateY(-50%)}

/* Setas das novidades: a mesma ponta de lança do voltar ao topo, para a esquerda e para a direita. */
.news-controls #news-prev,.news-controls #news-next{position:relative;width:34px;height:22px;padding:0;font-size:0;color:transparent;text-shadow:none}
.news-controls #news-prev::before,.news-controls #news-next::before{content:"";position:absolute;inset:0;background:url('assets/ui/marcador.webp') center/contain no-repeat;transition:filter .25s}
.news-controls #news-prev::before{transform:scaleX(-1)}
.news-controls #news-prev:hover::before,.news-controls #news-next:hover::before{filter:drop-shadow(0 0 8px rgba(241,213,143,.6))}

/* Ornamento das notas: vira divisor centralizado entre a galeria e a lista de mudanças. */
.note-rule{width:100%;max-width:850px;height:40px;margin:34px 0 18px;background:url('assets/ui/divisor.webp') center/contain no-repeat}

/* Ícones próprios da barra lateral: um pouco maiores, para os detalhes aparecerem. */
.orbit-link img{width:28px;height:28px}
.orbit-discord img{width:30px;height:30px}


/* Pausar e continuar das novidades. */
.news-controls #news-pause{position:relative;width:26px;height:26px;padding:0;font-size:0;color:transparent;text-shadow:none}
.news-controls #news-pause::before{content:"";position:absolute;inset:0;background:url('assets/ui/pausa.webp') center/contain no-repeat;transition:filter .25s}
.news-controls #news-pause[aria-pressed="true"]::before{background-image:url('assets/ui/continuar.webp')}
.news-controls #news-pause:hover::before{filter:drop-shadow(0 0 8px rgba(241,213,143,.6))}

/* Todas as setas "→" de link viram a ponta de lança (assets/ui/marcador.webp). */
.news-copy a b,.rank-arrow,.text-link span:last-child,#hero-secondary span{display:inline-block;width:26px;height:16px;padding:0;font-size:0;color:transparent;background:url('assets/ui/marcador.webp') center/contain no-repeat;vertical-align:middle;transition:transform .3s cubic-bezier(.2,.8,.2,1),filter .3s}
.news-copy a b{margin-left:9px}
.text-link span:last-child{margin-left:6px}
.news-copy a:hover b,.text-link:hover span:last-child,.rank-row:hover .rank-arrow{transform:translateX(5px);filter:drop-shadow(0 0 8px rgba(241,213,143,.55))}
.rank-arrow{justify-self:end;opacity:.8}

/* Cards de invasão: o canto de filigrana saiu (vai entrar uma moldura própria). */
.event-card:after{display:none}

/* Barra lateral: cápsula de obsidiana própria (9 fatias: ornamento de cima e de baixo fixos, meio estica). */
@media (min-width: 821px) {
  .orbit-dock{background:none;border-color:transparent;box-shadow:none}
  .orbit-dock::before{content:"";position:absolute;inset:-56px -12px -66px;z-index:-1;pointer-events:none;border-style:solid;border-width:62px 0 74px;border-image:url('assets/ui/fundo-barra.webp') 166 0 196 fill stretch;filter:drop-shadow(0 18px 30px rgba(0,0,0,.55))}
}

/* Ícone da seção atual: encaixe de joia atrás dele, no lugar da bolha de luz. */
.orbit-link.is-active{background:none}
.orbit-link.is-active::before{content:"";position:absolute;inset:-9px;z-index:-1;background:url('assets/ui/encaixe-ativo.webp') center/contain no-repeat}

/* Guerreiro do ranking: busto próprio no lugar do ícone genérico em caixinha (guildas mantêm o brasão). */
.rank-avatar:has(> svg){width:36px;height:36px;border:0!important;background:url('assets/ui/avatar-ranking.webp') center/contain no-repeat!important}
.rank-avatar:has(> svg) svg{display:none}

/* Cards de invasão: moldura própria em 9 fatias, cantos fixos e bordas que esticam. */
.event-card{isolation:isolate;border-color:transparent;background:none}
.event-card::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border-style:solid;border-width:30px;border-image:url('assets/ui/card-invasao.webp') 129 fill stretch}
.event-card.is-next{border-color:transparent;background:none}
.event-card.is-next::before{filter:brightness(1.18) drop-shadow(0 0 16px rgba(211,165,79,.22))}

/* ==========================================================================
   ENRIQUECIMENTOS (2026-09-29)
   ========================================================================== */

/* Topo: Atualizações vira texto com o pergaminho; bandeiras sem caixa; frase com o marcador. */
.hero-updates-btn{background:none!important;border:0!important;box-shadow:none!important;padding:6px 2px!important;gap:9px;color:var(--gold-pale);animation:none!important;transition:color .25s,text-shadow .25s}
.hero-updates-btn::before,.hero-updates-btn::after{display:none!important}
.hero-updates-icon{position:relative;z-index:1;width:24px;height:24px;object-fit:contain;transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
.hero-updates-btn:hover{transform:none!important;color:#fff3d0;text-shadow:0 0 14px rgba(241,213,143,.5)}
.hero-updates-btn:hover .hero-updates-icon{transform:rotate(-8deg) scale(1.1)}
.hero-updates-btn.has-news .hero-updates-flag{position:static;display:inline-block;margin-left:2px;padding:0;border-radius:0;background:none;box-shadow:none;color:#ffcf6a;font-size:10px;text-shadow:0 0 10px rgba(255,190,90,.7)}
.locale-picker{border:0;background:none;backdrop-filter:none;-webkit-backdrop-filter:none;padding:0}
.locale-flag{border:0!important;position:relative}
.locale-flag.is-active{filter:saturate(1.1) drop-shadow(0 0 6px rgba(241,213,143,.55))}
.locale-flag.is-active::after{content:"";position:absolute;left:20%;right:20%;bottom:-4px;height:1px;background:var(--gold);box-shadow:0 0 6px var(--gold)}


/* Cards de invasão: sem contorno em volta da moldura; o atual usa a moldura em ouro; clicável. */
.event-card,.event-card:hover,.event-card.is-next,.event-card.is-next:hover{border-color:transparent!important;box-shadow:none!important;cursor:pointer}
.event-card.is-next::before{filter:none;border-image-source:url('assets/ui/card-invasao-ouro.webp')}
.event-card:hover::before{filter:brightness(1.14)}
.event-card:focus-visible{outline:1px solid var(--gold-pale);outline-offset:4px}
/* Barra do tempo que ainda resta na invasão ao vivo. */
.event-barra{display:block;position:relative;max-width:290px;height:3px;margin:22px 0 0;border-radius:2px;background:rgba(211,165,79,.14);pointer-events:none}
/* Barra da invasão ao vivo: fica entre o local e o contador, encolhe com o tempo que resta e pulsa. */
.event-barra b{position:absolute;inset:0;border-radius:2px;background:linear-gradient(90deg,#ffd77a,#d3a54f);box-shadow:0 0 8px rgba(241,213,143,.6);transform:scaleX(var(--resta,1));transform-origin:left center;transition:transform 1s linear;animation:eventoPulso 1.8s ease-in-out infinite}
@keyframes eventoPulso{0%,100%{opacity:1;box-shadow:0 0 8px rgba(241,213,143,.6)}50%{opacity:.55;box-shadow:0 0 3px rgba(241,213,143,.25)}}
@media(prefers-reduced-motion:reduce){html:not(.force-motion) .event-barra b{animation:none}}
.event-card.is-live .event-time{bottom:26px}

/* Ranking: busto em ouro, prata e bronze para os três primeiros. */
.rank-top-1 .rank-avatar:has(> svg){width:40px;height:40px;background-image:url('assets/ui/avatar-ranking-ouro.webp')!important;filter:drop-shadow(0 0 8px rgba(241,201,94,.45))}
.rank-top-2 .rank-avatar:has(> svg){background-image:url('assets/ui/avatar-ranking-prata.webp')!important}
.rank-top-3 .rank-avatar:has(> svg){background-image:url('assets/ui/avatar-ranking-bronze.webp')!important}

/* Barra lateral: gema acesa no ícone de Atualizações quando há nota nova. */
.orbit-link.has-news:not(.is-active)::before{content:"";position:absolute;top:1px;right:1px;width:8px;height:8px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff3c4,#e0a93f 55%,#8a5a16);box-shadow:0 0 8px rgba(255,200,90,.85);animation:gemaNova 2.2s ease-in-out infinite}
@keyframes gemaNova{0%,100%{opacity:.75;transform:scale(.9)}50%{opacity:1;transform:scale(1.15)}}

/* Guia: botão "Só favoritas", texto com o selo. */
.guide-so-fav{display:flex;align-items:center;gap:8px;margin:10px 20px 4px;padding:4px 0;border:0;background:none;cursor:pointer;color:#8f8d86;font:600 11px "Barlow Condensed",sans-serif;letter-spacing:.12em;text-transform:uppercase;transition:color .2s,text-shadow .2s}
.guide-so-fav img{width:18px;height:18px;object-fit:contain;opacity:.45;filter:grayscale(.7);transition:opacity .2s,filter .2s}
.guide-so-fav:hover{color:var(--gold-pale)}
.guide-so-fav[aria-pressed="true"]{color:#ffd77a;text-shadow:0 0 10px rgba(241,213,143,.45)}
.guide-so-fav[aria-pressed="true"] img{opacity:1;filter:none}

/* Galial: pula ao passar o mouse, sacode ao ser cutucado, cochila no tour e fala num balãozinho. */
.galial-retrato,.note-galial-retrato,.zg-retrato{cursor:pointer}
.galial-retrato:hover .galial-pose,.note-galial-retrato:hover .note-galial-pose,.zg-retrato:hover .zg-pose{animation:galialPulinho .55s cubic-bezier(.3,1.6,.5,1)}
.is-cutucado .galial-pose,.is-cutucado .note-galial-pose,.is-cutucado .zg-pose{animation:galialSacode .5s ease}
.zg.is-sono .zg-pose{animation:zgRespira 7s ease-in-out infinite;filter:brightness(.78) drop-shadow(0 12px 18px rgba(0,0,0,.75))}
@keyframes galialPulinho{0%{transform:none}35%{transform:translateY(-12px) scale(1.03,.97)}70%{transform:translateY(2px) scale(.98,1.02)}100%{transform:none}}
@keyframes galialSacode{0%,100%{transform:none}20%{transform:rotate(-6deg)}40%{transform:rotate(5deg)}60%{transform:rotate(-3deg)}80%{transform:rotate(2deg)}}
.galial-diz[hidden]{display:none}
.galial-diz{position:fixed;z-index:3000;display:flex;align-items:center;gap:10px;max-width:320px;padding:9px 14px 9px 9px;border:1px solid rgba(227,189,111,.35);border-radius:14px;background:linear-gradient(160deg,rgba(30,22,16,.97),rgba(12,12,16,.96));box-shadow:0 14px 34px rgba(0,0,0,.6);color:#e8e0cd;font:500 13px/1.45 Manrope,sans-serif;pointer-events:none;opacity:0;transform:translateY(8px) scale(.96);transition:opacity .25s,transform .35s cubic-bezier(.3,1.5,.5,1)}
.galial-diz.is-on{opacity:1;transform:none}
.galial-diz img{width:34px;height:34px;object-fit:contain;flex:none}
@media(prefers-reduced-motion:reduce){html:not(.force-motion) .galial-retrato:hover .galial-pose,html:not(.force-motion) .note-galial-retrato:hover .note-galial-pose,html:not(.force-motion) .zg-retrato:hover .zg-pose,html:not(.force-motion) .is-cutucado *{animation:none}}

/* Índice do guia: com poucas invasões visíveis (filtro), os itens não esticam. */
.guide-nav{align-content:start}

/* Logo da barra lateral: desce para sair de baixo do ornamento de cima da cápsula. */
@media (min-width: 821px) { .orbit-dock .orbit-brand{margin-top:22px} }

/* Versão quieta (2026-09-29): o ouro com gema fica reservado para o que importa.
   Barra lateral: cápsula lisa de obsidiana com fio dourado, sem os ornamentos grandes. */
@media (min-width: 821px) {
  .orbit-dock::before{inset:-6px -4px;border:1px solid rgba(184,144,74,.55);border-image:none;border-radius:999px;background:url('assets/ui/obsidiana.webp') center/100% 100%;box-shadow:inset 0 0 0 3px rgba(0,0,0,.45),inset 0 0 0 4px rgba(184,144,74,.16),0 18px 40px rgba(0,0,0,.5);filter:none}
  .orbit-dock .orbit-brand{margin-top:4px}
}
/* Cards de invasão comuns: fio duplo dourado bem fino. Só o atual usa a moldura ornamentada em ouro. */
.event-card:not(.is-next)::before{border:1px solid rgba(184,144,74,.42);border-image:none;background:#0b0d12;box-shadow:inset 0 0 0 3px #0b0d12,inset 0 0 0 4px rgba(184,144,74,.16)}
.event-card:not(.is-next):hover::before{filter:none;border-color:rgba(214,172,96,.7)}

/* Página 404: o Galial acha que você se perdeu. */
.pagina-404{min-height:100vh;background:#07080b;overflow-x:hidden}
.p404-arte{position:fixed;inset:0;background:url('assets/hero-dragao-2-1280.webp') 66% 35%/cover no-repeat;opacity:.22;filter:saturate(.7) blur(2px)}
.p404-arte::after{content:"";position:absolute;inset:0;background:radial-gradient(70% 70% at 30% 50%,rgba(7,8,11,.55),#07080b 85%)}
.p404{position:relative;z-index:1;width:min(760px,calc(100% - 40px));margin:0 auto;padding:12vh 0 60px}
.p404-numero{margin:0;font:700 clamp(90px,16vw,170px)/.9 Cinzel,serif;letter-spacing:-.04em;color:transparent;background:linear-gradient(180deg,#f1d58f,#8a6424);-webkit-background-clip:text;background-clip:text;opacity:.85}
.p404 h1{margin:14px 0 8px;font:600 clamp(28px,4vw,42px)/1.15 Cinzel,serif;color:#efe8d8}
.p404 h1 em{font-style:normal;color:var(--gold)}
.p404-galial{margin-top:34px}
.p404-links{display:flex;flex-wrap:wrap;gap:14px 34px;margin-top:38px}
.p404-links a{display:inline-flex;align-items:center;gap:10px;color:var(--gold-pale);text-decoration:none;font:600 13px "Barlow Condensed",sans-serif;letter-spacing:.14em;text-transform:uppercase;transition:color .2s,text-shadow .2s}
.p404-links a span{width:26px;height:16px;background:url('assets/ui/marcador.webp') center/contain no-repeat;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.p404-links a:hover{color:#fff3d0;text-shadow:0 0 14px rgba(241,213,143,.45)}
.p404-links a:hover span{transform:translateX(5px)}

/* ==========================================================================
   CELULAR (revisão de 2026-09-29)
   ========================================================================== */
@media (max-width: 820px) {
  /* Barra de baixo: ícones menores e encaixe do ativo mais justo, para caber os 10 sem encostar. */
  .orbit-link img{width:22px;height:22px}
  .orbit-discord img{width:24px;height:24px}
  .orbit-link.is-active::before{inset:-5px}
  /* O rodapé do topo (Atualizações, Season, bandeiras) sobe para não ficar embaixo da barra. */
  .hero-bottom{bottom:94px}
  /* Novidades: véu escuro por cima da arte, o texto ocupa a largura toda no celular. */
  .news-slide{position:relative}
  .news-slide::before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(7,9,12,.92) 18%,rgba(7,9,12,.55) 70%,rgba(7,9,12,.35));pointer-events:none}
  .news-copy{position:relative;z-index:1}
}
@media (max-width: 540px) {
  /* Galial no guia: retrato em cima e balão na largura toda, em vez de uma coluna fina. */
  .galial-conta{grid-template-columns:1fr;gap:6px}
  .galial-retrato{width:96px;height:96px}
  .galial-balao:before{left:34px;bottom:auto;top:-8px;transform:rotate(135deg)}
}

/* Galial no guia de sistemas: fica sobre a área de leitura, à direita do índice. */
.zg.zg-sistema,.zg-chamar.zg-sistema{left:max(18px, calc(50% - 590px + 290px));z-index:8}
@media (max-width: 900px) { .zg.zg-sistema,.zg-chamar.zg-sistema{left:10px} }

/* Guia de sistemas: resumo (NPC, mapa, nome) só em texto, sem as três caixas. */
.system-guide-summary{display:flex;flex-wrap:wrap;gap:10px 40px;border:0;background:none;box-shadow:none}
.system-guide-summary div{padding:0;gap:4px}
.system-guide-summary div + div{border:0}

/* Guia de sistemas: contador "01 / 06" só em texto. */
.system-guide-meta span{padding:0;min-height:0;border:0;background:none;text-shadow:0 0 12px rgba(241,213,143,.35)}

/* Contagem para a abertura: números grandes em Cinzel, sem caixa. */
.hero-abertura[hidden]{display:none}
.hero-abertura{margin:-6px 0 30px}
.hero-abertura-titulo{margin:0 0 8px;color:var(--gold-pale);font:600 12px "Barlow Condensed",sans-serif;letter-spacing:.2em;text-transform:uppercase}
.hero-abertura-relogio{display:flex;align-items:flex-start;gap:12px}
.hero-abertura-relogio[hidden]{display:none}
.hero-abertura-relogio span{display:grid;justify-items:center;gap:4px;min-width:52px}
.hero-abertura-relogio b{font:600 38px/1 Cinzel,serif;color:#f1e9d8;text-shadow:0 0 18px rgba(241,213,143,.25);font-variant-numeric:tabular-nums}
.hero-abertura-relogio b.is-vira{animation:relogioVira .45s cubic-bezier(.2,.8,.2,1)}
.hero-abertura-relogio small{color:#8f8d86;font:600 10px "Barlow Condensed",sans-serif;letter-spacing:.16em;text-transform:uppercase}
.hero-abertura-relogio i{font:500 30px/1.1 Cinzel,serif;color:var(--gold);opacity:.55;font-style:normal}
.hero-abertura.is-aberto .hero-abertura-titulo{font:600 22px Cinzel,serif;letter-spacing:.02em;text-transform:none;color:#ffd77a;text-shadow:0 0 18px rgba(241,213,143,.4)}
@keyframes relogioVira{0%{opacity:.2;transform:translateY(-6px)}100%{opacity:1;transform:none}}
@media (max-width: 540px){.hero-abertura-relogio{gap:6px}.hero-abertura-relogio span{min-width:40px}.hero-abertura-relogio b{font-size:28px}.hero-abertura-relogio i{font-size:22px}}
@media(prefers-reduced-motion:reduce){html:not(.force-motion) .hero-abertura-relogio b.is-vira{animation:none}}

/* Contador do Discord no aviso das invasões. */
.discord-contagem[hidden]{display:none}
.discord-contagem{display:flex;align-items:center;gap:6px;margin:8px 0 0 32px;flex-basis:100%;color:var(--gold-pale);text-decoration:none;transition:text-shadow .2s}
.discord-contagem b{color:#ffd77a;font-weight:700}
.discord-contagem:hover{text-shadow:0 0 12px rgba(241,213,143,.45)}
.discord-online{display:inline-flex;align-items:center;gap:5px;margin-left:6px;color:#9ad7a2}
.discord-online i{width:6px;height:6px;border-radius:50%;background:#71bc77;box-shadow:0 0 8px rgba(113,188,119,.8)}

/* Acessibilidade: textos pequenos com contraste suficiente e foco visível para quem navega pelo teclado. */
.ranking-foot,.ranking-foot span{color:#8f9297}
#footer-copyright{color:#8f9297}
#footer-verse{color:#9a8f73}
.updates-sidebar button span{color:#8f9297}
a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:1px solid var(--gold-pale);outline-offset:3px}

/* Penas douradas só no topo: somem (e param) assim que o banner sai da tela. */
.feather-field{transition:opacity .6s ease}
.hero-fora .feather-field{opacity:0}
.hero-fora .feather-particle,.hero-fora .feather-particle::before,.hero-fora .feather-particle::after{animation-play-state:paused!important}

/* Celular: a pena de voltar ao topo (fixa, logo acima da barra) não encosta na última linha do rodapé. */
@media(max-width:820px){.footer{padding-bottom:104px}}

/* ============================================================
   TOM DAS PINTURAS nos assets de interface
   Os ícones, o ornamento de título e o canto de filigrana vieram com dourado
   liso e azul royal quase neon; as artes do site são escuras e de metal gasto.
   O filtro abaixo apaga o azul e queima o dourado, sem mexer nos arquivos.
   Para voltar ao original: troque o valor de --tom-ui por "none".
   ============================================================ */
:root{--tom-ui:saturate(.7) sepia(.14) brightness(.88) contrast(1.06)}
/* Ícones, divisor e canto foram refeitos no tom certo (30/09); o filtro fica só no encaixe
   atrás do ícone ativo, que ainda é a arte antiga. */
.orbit-link.is-active::before{filter:var(--tom-ui)}
.orbit-link img{filter:brightness(.88)}
.orbit-link:hover img{filter:brightness(1.1) drop-shadow(0 0 6px rgba(255,170,60,.45))}
.orbit-link.is-active img{filter:brightness(1.15) drop-shadow(0 0 7px rgba(255,170,60,.55))}
.orbit-discord img{filter:drop-shadow(0 0 6px rgba(255,170,60,.3))}
.orbit-discord:hover img{filter:brightness(1.1) drop-shadow(0 0 10px rgba(255,170,60,.6))}

/* Menos maiúsculo espaçado: fica só onde é informação (data, números, tipo, botões e abas).
   Rótulos que identificam um bloco viram texto normal; os decorativos saíram do HTML. */
.galial-nome,.note-galial-nome,.guide-tip strong{font:600 14px Cinzel,serif;letter-spacing:.01em;text-transform:none}
.guide-so-fav{text-transform:none;letter-spacing:.01em;font-size:12px}
.change-section h3{font:600 17px Cinzel,serif;letter-spacing:.01em;text-transform:none}

/* Antes da abertura: sem números inventados na faixa de status e no ranking. */
.status-band.is-prelaunch .server-metrics{display:none}
.status-band.is-prelaunch .pulse-dot{background:var(--gold);box-shadow:0 0 8px rgba(211,165,79,.8)}
.rank-vazio{margin:0;padding:48px 24px;text-align:center;color:#b7a171;font:600 17px Cinzel,serif}
.castle-siege.is-vazio .castle-siege-name{max-width:340px;text-align:center;font-size:20px;line-height:1.3}

/* ============================================================
   CRIAR CONTA (bloco Download): passo a passo do cadastro pelo Discord.
   ============================================================ */
.conta-guia{max-width:860px;margin:0 0 30px;border:1px solid rgba(211,165,79,.32);background:linear-gradient(135deg,rgba(211,165,79,.09),rgba(8,10,14,.86) 45%);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.conta-guia summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:20px 24px;cursor:pointer}
.conta-guia summary::-webkit-details-marker{display:none}
.conta-resumo{display:flex;flex-direction:column;gap:6px}
.conta-resumo strong{font:600 24px Cinzel,serif;color:#e8dfc7}
.conta-resumo strong em{font-style:normal;color:var(--gold)}
.conta-resumo span{max-width:520px;color:#b3b1ab;font-size:13px;line-height:1.6}
.conta-abrir{flex:none;display:flex;align-items:center;gap:10px;color:var(--gold-pale);font:600 13px Manrope,sans-serif}
.conta-abrir::after{content:"";width:22px;height:14px;background:url('assets/ui/marcador.webp') center/contain no-repeat;transform:rotate(90deg);transition:transform .25s}
.conta-guia[open] .conta-abrir::after{transform:rotate(-90deg)}
.conta-guia summary:hover .conta-abrir{text-shadow:0 0 10px rgba(241,213,143,.45)}
.conta-corpo{padding:4px 24px 24px;border-top:1px solid rgba(211,165,79,.18)}
.conta-passos{list-style:none;margin:0;padding:0}
.conta-passos li{display:grid;grid-template-columns:34px 1fr auto;gap:16px;align-items:start;padding:18px 0;border-bottom:1px solid rgba(255,255,255,.06)}
.conta-num{width:30px;height:30px;display:grid;place-items:center;border:1px solid rgba(211,165,79,.5);border-radius:50%;color:#ffd77a;font:600 14px Cinzel,serif}
.conta-texto h4{margin:4px 0 6px;font:600 17px Cinzel,serif;color:#e8dfc7}
.conta-texto p{margin:0;max-width:460px;color:#b3b1ab;font-size:13px;line-height:1.65}
.conta-texto .button{margin-top:14px}
.conta-prints{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;max-width:300px}
.conta-prints img{width:140px;height:92px;object-fit:cover;object-position:top left;border:1px solid rgba(211,165,79,.28);cursor:zoom-in;transition:border-color .2s,transform .2s}
.conta-prints img:hover{border-color:var(--gold);transform:translateY(-2px)}
.conta-zoom{margin:14px 0 0;color:#8e8c87;font-size:11px}
.conta-faq{margin-top:22px}
.conta-faq h4{margin:0 0 10px;font:600 17px Cinzel,serif;color:var(--gold-pale)}
.conta-faq dl{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:14px 28px}
.conta-faq dt{color:#e8dfc7;font-weight:600;font-size:13px;margin-bottom:4px}
.conta-faq dd{margin:0;color:#a9a7a1;font-size:12.5px;line-height:1.6}
@media(max-width:820px){
  .conta-guia summary{flex-direction:column;align-items:flex-start;gap:12px;padding:18px}
  .conta-corpo{padding:4px 18px 20px}
  .conta-passos li{grid-template-columns:30px 1fr;gap:12px}
  .conta-prints{grid-column:2;justify-content:flex-start;max-width:none}
  .conta-prints img{width:120px;height:80px}
  .conta-faq dl{grid-template-columns:1fr}
}
/* Frase depois da lista de "E tem muito mais" */
.more-systems-copy>.more-systems-after{margin:18px 0 0;color:#cfc6ae;font-size:13px;line-height:1.7}

/* Menu lateral fixo (22px a 82px da esquerda) x conteúdo: abaixo de ~1390px o .wrap centralizado
   começava por baixo do menu e escondia o começo do título e dos textos. O conteúdo agora começa
   sempre depois do menu (104px) e só centraliza quando sobra espaço. No celular o menu vira barra
   embaixo, então não precisa. */
@media(min-width:821px){.wrap{width:min(var(--wrap),calc(100% - 144px));margin-left:max(104px,calc((100% - var(--wrap)) / 2));margin-right:auto}.hero-bottom.wrap{left:0;transform:none}}