/* reborn-unify.20260923.css
 * One layer, loaded last, that gives every standard inner page the same
 * column, frame, page header, type scale, radius and button set, and makes
 * inner pages work on phones. Hero/feature pages (why-reborn, support-us,
 * chaos teaser, class talents, ...) do not use .page-shell--sleek-bronze and
 * keep their own design. Remove the <link> in templates/partials/header.php
 * to roll everything here back. */

body.reborn-site-theme:not(.reborn-home-theme) {
  --u-ink: #ece0c4;
  --u-copy: #bdbcae;
  --u-muted: #8d9284;
  --u-gold: #cfb780;
  --u-gold-deep: #a88951;
  --u-edge: rgba(181, 155, 97, 0.24);
  --u-edge-soft: rgba(181, 155, 97, 0.13);
  --u-surface: rgba(255, 244, 214, 0.022);
  --u-width: 72rem;
  --u-radius: 4px;
}

/* Banner: one height and one bronze grade, whichever banner art is picked. */
body.reborn-site-theme:not(.reborn-home-theme) .banner-hero {
  height: 112px !important;
}
body.reborn-site-theme:not(.reborn-home-theme) .banner-hero > img,
body.reborn-site-theme:not(.reborn-home-theme) .banner-hero video {
  filter: grayscale(1) sepia(0.55) brightness(0.42) contrast(1.1) !important;
}

/* One column for every standard page. */
body.reborn-site-theme:not(.reborn-home-theme) #site-page-content > .page-shell--sleek-bronze {
  max-width: var(--u-width) !important;
  width: 100%;
  margin-top: 2rem !important;
}

/* One frame: the ornate Lineage frame on every page's outer panel (reference
 * pages had it switched off); nested frames stay plain. */
body.reborn-site-theme:not(.reborn-home-theme) #site-page-content.reference-page .table-frame--decor > .table-frame__decor {
  display: block !important;
}
body.reborn-site-theme:not(.reborn-home-theme) #site-page-content .table-frame--decor .table-frame--decor > .table-frame__decor {
  display: none !important;
}
body.reborn-site-theme:not(.reborn-home-theme) .page-shell--sleek-bronze > .table-frame--decor > .table-frame__content,
body.reborn-site-theme:not(.reborn-home-theme) .page-shell--sleek-bronze > div > .table-frame--decor > .table-frame__content {
  padding: 2.75rem 3rem 3rem !important;
}

/* Page header, rendered by page_header() in templates/partials/page-header.php. */
.u-page-head {
  position: relative;
  margin: 0 0 2rem !important;
  padding-bottom: 1.6rem;
  border-bottom: 1px solid var(--u-edge);
}
.u-page-head .u-eyebrow {
  display: block;
  margin: 0 0 0.85rem !important;
  color: var(--u-gold) !important;
  font: 600 0.68rem/1 Arial, Helvetica, sans-serif !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase;
}
.u-page-head .u-eyebrow a { color: inherit; text-decoration: none; }
.u-page-head .u-eyebrow a:hover { color: #f1dfb0; }
.u-page-head .u-eyebrow span[aria-hidden] { color: var(--u-muted); margin: 0 0.5em; }
.u-page-head h1 {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  font-size: 2.6rem !important;
  line-height: 1.1 !important;
  color: var(--u-ink) !important;
  letter-spacing: -0.01em !important;
  text-wrap: balance;
}
.u-page-head .u-lede {
  margin: 0.9rem 0 0 !important;
  max-width: 46rem;
  font-size: 1rem !important;
  line-height: 1.7 !important;
  color: var(--u-copy) !important;
}
.u-page-head .u-actions {
  position: absolute;
  right: 0;
  bottom: 1.6rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.u-page-head .u-actions a {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--u-edge);
  border-radius: var(--u-radius);
  padding: 0.45rem 0.8rem;
  color: #e6d3a6;
  background: rgba(181, 155, 97, 0.07);
  font: 500 0.8rem/1.2 Arial, Helvetica, sans-serif;
  text-decoration: none;
}
.u-page-head .u-actions a:hover { border-color: rgba(207, 183, 128, 0.6); background: rgba(181, 155, 97, 0.14); }

/* Section headings: one step each, never smaller than body text. */
body.reborn-site-theme:not(.reborn-home-theme) .page-shell--sleek-bronze .table-frame__content h2:not(.reference-title) {
  font-size: 1.5rem !important;
  line-height: 1.25 !important;
}
body.reborn-site-theme:not(.reborn-home-theme) .page-shell--sleek-bronze .table-frame__content h3 {
  font-size: 1.15rem !important;
  line-height: 1.3 !important;
}
body.reborn-site-theme:not(.reborn-home-theme) .page-shell--sleek-bronze .table-frame__content :is(p, li):not([class*="uppercase"]):not([class*="text-xs"]):not([class*="text-["]) {
  font-size: 0.925rem;
  color: var(--u-copy);
}

/* One accent: sky / emerald / violet / cyan section chrome becomes gold.
 * Rarity colours and Standard/Classic badges are untouched. */
body.reborn-site-theme:not(.reborn-home-theme) .page-shell--sleek-bronze :is([class*="border-sky-"], [class*="border-emerald-"], [class*="border-violet-"], [class*="border-cyan-"]):is(.page-surface--sleek-bronze, .rounded-xl, .rounded-2xl) {
  border-color: var(--u-edge) !important;
}
body.reborn-site-theme:not(.reborn-home-theme) .page-shell--sleek-bronze :is(.text-sky-100, .text-sky-200, .text-emerald-100, .text-cyan-100) {
  color: var(--u-ink) !important;
}
body.reborn-site-theme:not(.reborn-home-theme) .page-shell--sleek-bronze p:is(.text-sky-300\/80, .text-sky-300, .text-emerald-300\/80, .text-cyan-300\/80) {
  color: var(--u-gold) !important;
}

/* One radius; inner surfaces are quiet hairline cards. */
body.reborn-site-theme:not(.reborn-home-theme) .page-shell--sleek-bronze :is(.page-surface--sleek-bronze, .rounded-xl, .rounded-2xl, .rounded-lg) {
  border-radius: var(--u-radius) !important;
}
body.reborn-site-theme:not(.reborn-home-theme) .page-shell--sleek-bronze .page-surface--sleek-bronze {
  background: var(--u-surface) !important;
  border-color: var(--u-edge-soft) !important;
}

/* Buttons: primary (gold fill), secondary (outline), chip (filters). */
body.reborn-site-theme:not(.reborn-home-theme) .page-shell--sleek-bronze :is(button, a[class*="btn"], .reference-pager a) {
  border-radius: var(--u-radius) !important;
  font-family: Arial, Helvetica, sans-serif;
}
body.reborn-site-theme:not(.reborn-home-theme) .page-shell--sleek-bronze :is(button.bg-amber-500, button.bg-amber-600, a.bg-amber-500, input.bg-amber-500, button[type="submit"]) {
  background: linear-gradient(135deg, #d8c28c, var(--u-gold-deep)) !important;
  color: #1a160e !important;
  border-color: #d8c28c !important;
  font-weight: 600;
}

/* Tables: one header style, tabular numbers. */
body.reborn-site-theme:not(.reborn-home-theme) .page-shell--sleek-bronze table {
  font-variant-numeric: tabular-nums;
}
body.reborn-site-theme:not(.reborn-home-theme) .page-shell--sleek-bronze th {
  font-size: 0.68rem !important;
  letter-spacing: 0.12em !important;
  color: #c9b787 !important;
}

/* Phones and small tablets (inner pages now use width=device-width). The
 * header reuses the existing mobile drawer, as the homepage already does. */
@media (max-width: 1023px) {
  /* Row 1: logo + Menu. Row 2: Log in / Discord / Support Us (the drawer has
   * no Discord or Support links, so they stay visible). */
  body.reborn-site-theme:not(.reborn-home-theme) > header > div:first-child > div:first-child {
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center;
    gap: 8px;
    padding: 8px 14px 10px;
  }
  body.reborn-site-theme:not(.reborn-home-theme) .site-header-primary { flex: 1 1 100%; display: block !important; }
  body.reborn-site-theme:not(.reborn-home-theme) .site-header-account {
    flex: 1 1 100%;
    justify-content: flex-end !important;
  }
  body.reborn-site-theme:not(.reborn-home-theme) .site-primary-nav { display: none !important; }
  body.reborn-site-theme:not(.reborn-home-theme) [data-mobile-menu-toggle] {
    display: inline-flex !important;
    border-color: var(--u-edge) !important;
    background: rgba(182, 155, 97, 0.05) !important;
  }
  body.reborn-site-theme:not(.reborn-home-theme) [data-mobile-menu]:not(.hidden) { display: block !important; }
  body.reborn-site-theme:not(.reborn-home-theme) [data-mobile-menu] > div {
    background: #1a1b17 !important;
    border-color: var(--u-edge) !important;
  }
  body.reborn-site-theme:not(.reborn-home-theme) .header-logo { max-width: 84px; }
  body.reborn-site-theme:not(.reborn-home-theme) .banner-hero { height: 56px !important; }

  body.reborn-site-theme:not(.reborn-home-theme) .page-shell--sleek-bronze > .table-frame--decor > .table-frame__content,
  body.reborn-site-theme:not(.reborn-home-theme) .page-shell--sleek-bronze > div > .table-frame--decor > .table-frame__content {
    padding: 1.5rem 1.15rem 1.75rem !important;
  }
  .u-page-head h1 { font-size: 1.95rem !important; }
  .u-page-head .u-actions { position: static; margin-top: 1rem; }
  body.reborn-site-theme:not(.reborn-home-theme) .page-shell--sleek-bronze table {
    display: block;
    overflow-x: auto;
  }
  body.reborn-site-theme:not(.reborn-home-theme) .page-shell--sleek-bronze .grid:is(.grid-cols-3, .grid-cols-4, .grid-cols-5, .grid-cols-6) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Very narrow phones (iPhone SE): keep the three account buttons on one line. */
@media (max-width: 380px) {
  body.reborn-site-theme:not(.reborn-home-theme) .site-header-account { gap: 4px !important; }
  body.reborn-site-theme:not(.reborn-home-theme) .site-header-account :is(a, button) {
    white-space: nowrap;
    padding: 6px 9px !important;
    font-size: 12px !important;
  }
}

/* Classes index title (h1 in .class-atlas-head) uses the page-title size. */
body.reborn-site-theme:not(.reborn-home-theme) .class-atlas-head h1 {
  margin: 0 0 0.5rem;
  font-size: 2.6rem !important;
  line-height: 1.1 !important;
  color: var(--u-ink) !important;
}
@media (max-width: 1023px) {
  body.reborn-site-theme:not(.reborn-home-theme) .class-atlas-head h1 { font-size: 1.95rem !important; }
}

/* Phones: nothing smaller than 10px (guide tags and pet badges were 8px). */
@media (max-width: 1023px) {
  body.reborn-site-theme #site-page-content :is(.player-guide-tag, .pet-evolved-badge, .pet-ring-badge, [class*="text-[8px]"], [class*="text-[9px]"]) {
    font-size: 10px !important;
  }
}
