/* =============================================================================
   wgf-objects.css - page chrome for the GAME OBJECT family (/objects/ + /object/).
   -----------------------------------------------------------------------------
   Loaded through object_app's extra_css seam, after wgf-chrome.css,
   wgf-world.css, wgf-ag-card.css, wgf-data-table.css and wgf-worldmap.css.
   Adds ONLY what those sheets do not carry: the hub's map-art header strip, the
   detail hero's framed type glyph, the pinned-map stack, and the glyph slot in
   the type filter buttons.

   Colour comes from static/css/_tokens.css - near-black slate panels, bronze and
   gold rules, parchment text. No green, no gradients, no glows, no invented art:
   every image on these pages is a first-party client asset served from /assets/.
   ============================================================================= */

/* -----------------------------------------------------------------------------
   .wgf-obj-strip - the hub's art header. A shipped world-map composite, cropped
   to a banner and credited underneath. object_read.header_map() picks the map
   that actually carries the most object placements, so the caption is a fact.
   --------------------------------------------------------------------------- */
.wgf-obj-strip {
  margin: 0 0 1rem;
  border: 1px solid var(--wgf-border-strong, rgba(183, 145, 47, .38));
  background: var(--wgf-panel, #14161c);
}
.wgf-obj-strip img {
  display: block;
  width: 100%;
  height: clamp(120px, 22vw, 210px);
  object-fit: cover;
  object-position: center 42%;
}
.wgf-obj-strip__credit {
  margin: 0;
  padding: .35rem .6rem;
  border-top: 1px solid var(--wgf-border, rgba(183, 145, 47, .20));
  color: var(--wgf-muted, #b3a88f);
  font-size: var(--text-xs, .75rem);
  letter-spacing: .02em;
}

/* -----------------------------------------------------------------------------
   .wgf-obj-hero - the detail identity row: the type glyph in the client's item
   border frame, then the name. The frame art comes from .wgf-qborder in
   wgf-chrome.css; only the size is overridden here.
   --------------------------------------------------------------------------- */
.wgf-obj-hero {
  display: flex;
  align-items: center;
  gap: .85rem;
}
.wgf-obj-hero__frame.wgf-qborder {
  width: 64px;
  height: 64px;
}
.wgf-obj-hero__frame .wgf-qborder__icon {
  width: 46px;
  height: 46px;
}
.wgf-obj-hero__text { min-width: 0; }
.wgf-obj-hero__text .wgf-seo-h1 {
  font-family: var(--font-game, 'FrizQuadrata', 'Cinzel', serif);
  margin: 0;
}

/* -----------------------------------------------------------------------------
   .wgf-obj-mapgrid - the pinned-map stack. Each entry is one shipped zone
   composite with this object's client placements projected onto it
   (wgf_worldmap_pins.project); the pins themselves are styled by
   assets/wgf-worldmap.css.
   --------------------------------------------------------------------------- */
.wgf-obj-mapgrid {
  display: grid;
  gap: 1rem;
  margin: .75rem 0 0;
}
@media (min-width: 900px) {
  .wgf-obj-mapgrid { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }
}
.wgf-obj-map__cap {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: .5rem;
  margin: 0 0 .35rem;
  font-size: var(--text-sm, .875rem);
}
.wgf-obj-map__cap span { color: var(--wgf-muted, #b3a88f); }
.wgf-obj-map__zone {
  color: var(--wgf-gold-link, #ffe375);
  font-family: var(--font-game, 'FrizQuadrata', 'Cinzel', serif);
  text-decoration: none;
}
.wgf-obj-map__zone:hover,
.wgf-obj-map__zone:focus-visible { text-decoration: underline; }

/* -----------------------------------------------------------------------------
   .wgf-obj-typebtn__icon - the glyph slot in the hub's type filter buttons.
   --------------------------------------------------------------------------- */
.wgf-obj-typebtn__icon {
  width: 18px;
  height: 18px;
  margin-right: .35rem;
  vertical-align: -3px;
  border: 1px solid var(--wgf-border, rgba(183, 145, 47, .20));
  background: #000;
}

/* -----------------------------------------------------------------------------
   .wgf-obj-items - the "Linked Items" list on a detail page. One item per row:
   icon, name, and the field that ties it to the object. The <a> itself carries
   the site-wide tooltip hook, so nothing here restyles the link.
   --------------------------------------------------------------------------- */
.wgf-obj-items {
  list-style: none;
  margin: .35rem 0 0;
  padding: 0;
  display: grid;
  gap: .35rem;
}
.wgf-obj-item {
  display: flex;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
  padding: .45rem .6rem;
  border: 1px solid var(--wgf-border, rgba(183, 145, 47, .20));
  background: var(--wgf-panel, #14120e);
}
.wgf-obj-item .wgf-ag-card__meta {
  margin-left: auto;
  color: var(--wgf-muted, #b3a88f);
}

/* -----------------------------------------------------------------------------
   .wgf-obj-variants - the hub's near-duplicate reveal. The building-variant
   family (garrison plots, cornerstone props) is 358 of the 2,220 browsable
   groups - name-swapped siblings the sitemap already refuses - so the browse
   list hides them behind one button instead of burying the 1,862 real objects.
   The cards stay in the HTML, so no URL is orphaned.
   --------------------------------------------------------------------------- */
.wgf-obj-variants {
  margin: .6rem 0 0;
}
.wgf-obj-variants__note {
  margin: .4rem 0 0;
  color: var(--wgf-muted, #b3a88f);
  font-size: .9rem;
}