/* FunPay banners (markup: src/components/FunpayAd.astro). Plain public file: tweak + upload it alone, no site rebuild. */
.fpb { display: block; }
.fpb a { display: block; border: 1px solid var(--line, rgb(255 255 255 / .12)); border-radius: 14px; overflow: hidden; box-shadow: 0 14px 34px rgb(0 0 0 / .3); }
.fpb img { display: block; width: 100%; height: auto; }
.fp-lbl { display: block; margin: 0 0 4px 2px; font-size: 11px; line-height: 1.2; opacity: .55; }

/* home: same gap above (to the DB tiles) and below (to «Новости») */
.fp-home { max-width: 1144px; margin: 28px auto 0; }
.fp-home + .nb-news { margin-top: 28px !important; }

/* phone: .fp-m under the title; PC: .fp-hero */
.fp-m { max-width: 480px; margin: 10px 0 14px; }
.fp-hero, .fp-v { display: none; }
@media (min-width: 760px) {
  .fp-m { display: none; }
  .fp-hero { display: block; width: min(728px, 100%); margin: 16px 0 6px; }
}
/* wide PC: right of the title, right edge on our blocks' line; s.js centres it between the hero top and the blocks */
@media (min-width: 1250px) {
  .hero-in:has(> .fp-hero) { min-height: 250px; }
  .hero-in:has(> .fp-hero) > :not(.fpb) { max-width: calc(56% - 24px); }
  .hero-in > .fp-hero { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); width: min(728px, 44%); margin: 0; }
}

.fp-v { width: 240px; }
/* items/npcs/quests: vertical in the left margin once it fits (wrap 1760px → margin ≥ 272px), level with the filters */
@media (min-width: 2304px) {
  .page-body:has(> .fp-gutter) { position: relative; }
  .fp-v.fp-gutter { display: block; position: absolute; right: calc(100% + 24px); top: 0; }
  .hero-in > .fp-hero.fp-off-wide { display: none; }
  .hero-in:has(> .fp-off-wide) > :not(.fpb) { max-width: none; }
}
/* guides: own right column (the Shugo is gone, owner 04.11), banner on its left side, picture top level with the first class card, scrolls with the page */
@media (min-width: 1000px) {
  .page-body:has(> .fp-guides) { display: grid; grid-template-columns: minmax(0, 1fr) clamp(320px, 32vw, 460px); column-gap: clamp(24px, 3vw, 48px); align-items: start; }
  .page-body:has(> .fp-guides) > * { grid-column: 1; }
  .page-body > .fp-v.fp-guides { display: block; grid-column: 2; grid-row: 1 / span 40; justify-self: start; align-self: start; }
  .hero-in > .fp-hero.fp-off-v { display: none; }
  .hero-in:has(> .fp-off-v) > :not(.fpb) { max-width: none; }
}
/* servers: next to the cards, picture top level with the first card (s.js sets left/top) */
@media (min-width: 1250px) {
  .page-body:has(> .fp-servers) { position: relative; }
  .fp-v.fp-servers { display: block; position: absolute; left: calc(900px + 40px); top: 0; }
}
@media (min-width: 1250px) {
  .hero-in > .fp-hero.fp-off-sv { display: none; }
  .hero-in:has(> .fp-off-sv) > :not(.fpb) { max-width: none; }
}