/* Phone top panel, variant B (Mark 11.11.2026: "panel u gory ladny nowy, baner Wojny Veil z innym tlem, Kronika za duza").
   One painted plate (Astra, /v2/art/phone-top/plate.webp): avatar, name, level and class in one line, currencies under
   it, energy and XP side by side, the utility buttons at the bottom. The game's own elements, only rearranged. */
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #gameHeader{
  display:grid!important;grid-template-columns:52px minmax(0,1fr) minmax(0,1fr) 46px;
  grid-template-areas:"av name name mail" "av gold dia mail" "pow xp xp xp" "rail rail rail rail";
  align-items:center;column-gap:8px;row-gap:4px;height:auto!important;min-height:0!important;
  margin:0!important;padding:12px 16px 8px!important;box-sizing:border-box;
  border:solid transparent;border-width:22px 22px 18px;border-image:url('/v2/art/phone-top/plate.webp') 64 fill / 22px 22px 18px / 0 stretch;
  background:none!important;box-shadow:0 8px 18px #0009!important}
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #gameHeader :is(.header-row-top,.header-identity,.header-right,.header-xp-row){display:contents!important}
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #gameHeader .header-avatar-wrap{grid-area:av;align-self:center;width:50px!important;height:50px!important;margin:0!important}
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #gameHeader .header-name-block{grid-area:name;display:flex!important;align-items:center;gap:8px;min-width:0;margin:0!important}
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #gameHeader .header-name{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:18px!important}
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #gameHeader .header-meta{display:flex!important;flex:0 0 auto;gap:6px;margin:0!important}
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #gameHeader .currency-gold{grid-area:gold}
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #gameHeader .currency-crystals{grid-area:dia}
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #gameHeader :is(.currency-gold,.currency-crystals){height:30px!important;min-height:0!important;margin:0!important;padding:0 4px!important;background:none!important;border:0!important;box-shadow:none!important}
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #gameHeader :is(#headerGold,#headerCrystals){font-size:17px!important}
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #gameHeader #headerMailBtn{grid-area:mail;align-self:center;margin:0!important}
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #gameHeader .header-power{grid-area:pow;height:20px!important;margin:0!important;padding:0 6px!important;border-radius:10px;background:#120a0ecc!important;box-shadow:inset 0 0 0 1px #c9a05a55!important}
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #gameHeader .header-xp-bar-wrap{grid-area:xp;margin:0!important}
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #gameHeader .header-xp-bar{height:14px!important;border-radius:7px!important;background:#120a0ecc!important;box-shadow:inset 0 0 0 1px #c9a05a55!important}
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #gameHeader #gvUtilityRail{grid-area:rail;margin:4px 0 0!important;padding:4px 0 0!important;border-top:1px solid #c9a05a44;background:none!important}

/* the Veil War banner sits on a painted dusk sky that fades into the town, not on a flat purple band */
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #panelHome .gv-frontier-shell{background:url('/v2/art/phone-top/veil-sky.webp') center top/100% auto no-repeat,#211c30!important}

/* Town Chronicle: a small scroll in the corner instead of a big plank across the map */
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #panelHome details.v2-news:not([open]){left:10px!important;right:auto!important;bottom:12px!important;width:auto!important}
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #panelHome details.v2-news:not([open])>summary{display:flex!important;align-items:center;justify-content:center;width:150px!important;height:50px!important;min-height:0!important;margin:0!important;padding:0 10px 0 34px!important;box-sizing:border-box;background:url('/v2/art/phone-top/chronicle.webp') center/100% 100% no-repeat!important;border:0!important;font:700 13px/1.05 var(--font-display,serif)!important;letter-spacing:.02em;color:#f4e3c2!important;text-align:center;white-space:normal}
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #panelHome details.v2-news:not([open])>summary::before,html.gv-v2:is(.gv-phone,.gv-port-mobile) body #panelHome details.v2-news:not([open])>summary::after{display:none!important}
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #panelHome details.v2-news:not([open])>summary .gv-news-badge{position:absolute!important;right:-6px!important;top:-8px!important;left:auto!important;transform:none!important}
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #gameHeader .header-name-block{flex-direction:row!important;justify-content:flex-start!important;text-align:left!important;height:auto!important}
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #gameHeader .header-name{text-align:left!important;width:auto!important;line-height:1.1!important}
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #gameHeader :is(.currency-gold,.currency-crystals){justify-content:flex-start!important}
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #gameHeader #gvUtilityRail{height:auto!important;min-height:0!important}
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #panelHome .gv-frontier-shell{background-size:auto 215px,auto!important}
html.gv-v2:is(.gv-phone,.gv-port-mobile) body #panelHome .gv-frontier-shell .gv-town-viewport{-webkit-mask-image:linear-gradient(transparent,#000 46px);mask-image:linear-gradient(transparent,#000 46px)}