/* Wiki - layered on ../styles.css */

/* Spaces in filename - percent-encoded so every server/OS resolves the same URL. */
@font-face {
  font-family: "MADE TOMMY Bold_PERSONAL USE";
  src: url("../assets/fonts/made_tommy/MADE%20TOMMY%20Bold_PERSONAL%20USE.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "MADE TOMMY Bold_PERSONAL USE";
  src: url("../assets/fonts/made_tommy/MADE%20TOMMY%20Bold_PERSONAL%20USE.otf") format("opentype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "MADE TOMMY Bold_PERSONAL USE";
  src: url("../assets/fonts/made_tommy/MADE%20TOMMY%20Bold_PERSONAL%20USE.otf") format("opentype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* Breadcrumb trail (Home · Wiki · …) */
@font-face {
  font-family: "MADE TOMMY Light_PERSONAL USE";
  src: url("../assets/fonts/made_tommy/MADE%20TOMMY%20Light_PERSONAL%20USE.otf") format("opentype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

:root {
  --font-wiki-heading: "MADE TOMMY Bold_PERSONAL USE", "Lexend", var(--font-nav), system-ui, sans-serif;
  /* Biography + wiki article / infobox body: Lexend Light (300) + fallbacks; files in assets/fonts/lexend. */
  --font-wiki-prose: "Lexend", "Futura PT", "Futura", "Source Sans 3", system-ui, sans-serif;
  /* Admin font preview (wiki-edit.js) may override --font-wiki-prose / --font-wiki-heading on <html>. */
  --font-wiki-prose-weight: 300;
  --font-wiki-breadcrumb: "MADE TOMMY Light_PERSONAL USE", system-ui, sans-serif;
}

/* Wiki mega-menu section labels (wiki.css loads on wiki pages only) */
.nav-dropdown-heading {
  font-family: var(--font-wiki-heading);
  /* Main site sets Lexend @ 300 here; MADE TOMMY has no 300, so the browser skipped to Lexend. */
  font-weight: 600;
}

.wiki-page {
  padding: 2rem 0 4rem;
  min-height: 60vh;
}

/* Article + lead: Lexend Light (see styles.css @font-face weight 300) for biography/wiki prose. */
.wiki-page .wiki-main,
.wiki-page .wiki-lead {
  font-family: var(--font-wiki-prose);
  font-weight: var(--font-wiki-prose-weight);
}

.wiki-breadcrumb {
  font-family: var(--font-wiki-breadcrumb);
  font-weight: 300;
  font-size: 0.9rem;
  color: var(--muted);
  margin: 0 0 1rem;
}

.wiki-breadcrumb a {
  color: var(--muted);
}

.wiki-breadcrumb a:hover {
  color: var(--accent);
}

/* Admin (adminrs): Publish / Make private - injected by script.js into the site footer row on wiki pages */
.wiki-admin-visibility-bar {
  width: auto;
  margin: 0;
  box-sizing: border-box;
}

.wiki-admin-visibility-bar[hidden] {
  display: none !important;
}

.wiki-admin-visibility-bar__inner {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.4rem 0.55rem;
  padding: 0.34rem 0.55rem;
  border-radius: calc(var(--radius) - 2px);
  border: 1px solid rgba(34, 211, 238, 0.22);
  background: rgba(34, 211, 238, 0.06);
}

.wiki-admin-visibility-bar__label {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.5);
  margin-right: 0.15rem;
}

.wiki-admin-visibility-bar__btn {
  font-family: var(--font-nav);
  font-size: 0.82rem;
  padding: 0.26rem 0.65rem;
  border-radius: calc(var(--radius) - 2px);
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.06);
  color: var(--text);
  cursor: pointer;
}

.wiki-admin-visibility-bar__btn:hover {
  border-color: rgba(34, 211, 238, 0.45);
  color: var(--accent);
}

.wiki-admin-visibility-bar__btn--primary {
  background: rgba(34, 211, 238, 0.14);
  border-color: var(--accent-dim);
  color: var(--accent);
}

.wiki-page-title {
  font-family: var(--font-wiki-heading);
  font-weight: 600;
  font-size: calc(clamp(2rem, 2.5vw + 1.25rem, 3.25rem) * var(--wiki-main-scale, 1));
  letter-spacing: 0.04em;
  margin: 0 0 0.5rem;
  border-bottom: 1px solid var(--border);
  padding-bottom: 0.75rem;
  box-sizing: border-box;
}

/*
 * Two-column articles: keep the title block and its rule above the pulled-up infobox.
 * Font size unchanged - only the box width. Hub / pages without an infobox stay full width.
 */
@media (min-width: 901px) and (max-width: 1919px) {
  main.wiki-page:has(.wiki-layout aside.wiki-infobox) .wiki-page-title {
    max-width: min(100%, max(0px, calc(100% - 380px - 2.5rem - 1rem - 0.75rem)));
  }
}

@media (min-width: 1920px) {
  main.wiki-page:has(.wiki-layout aside.wiki-infobox) .wiki-page-title {
    max-width: min(100%, max(0px, calc(100% - 492px - 3rem - 1rem - 0.75rem)));
  }
}

/* Edit-mode block resizer sets inline width; lift caps so east handle can widen past prose / infobox column math. */
main.wiki-page:has(.wiki-layout aside.wiki-infobox) .wiki-page-title[style*="width"] {
  max-width: none;
}

/* Title rule spans the (possibly narrowed) title box only. */
@media (min-width: 901px) {
  .wiki-page-title {
    border-bottom: none;
    position: relative;
  }

  .wiki-page-title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    height: 1px;
    background: var(--border);
    width: 100%;
  }
}

/* 1080p desktop: slightly smaller sidebar/infobox column (leave 1440p+ unchanged). */
@media (min-width: 901px) and (max-width: 1919px) {
  .wiki-layout {
    grid-template-columns: 1fr minmax(270px, 380px);
  }
}

/* 4K+ displays: scale headings up (no change on smaller screens). */
@media (min-width: 2560px) {
  .wiki-page .wiki-page-title {
    font-size: calc(clamp(2.6rem, 1.65vw + 1.9rem, 4.1rem) * var(--wiki-main-scale, 1));
  }

  .wiki-page .wiki-main h2 {
    font-size: calc(1.9rem * var(--wiki-main-scale, 1));
  }

  .wiki-page .wiki-main h3 {
    font-size: calc(1.35rem * var(--wiki-main-scale, 1));
  }
}

.wiki-lead {
  font-size: calc(1.05rem * var(--wiki-main-scale, 1));
  color: var(--muted);
  font-style: italic;
  margin: 0 0 1.75rem;
  max-width: 70ch;
}

/* Two-column: body + infobox */
.wiki-layout {
  display: grid;
  grid-template-columns: 1fr minmax(300px, 456px);
  gap: 2rem 2.5rem;
  align-items: start;
}

@media (max-width: 900px) {
  .wiki-layout {
    grid-template-columns: 1fr;
  }

  .wiki-infobox {
    order: -1;
    max-width: min(456px, 100%);
    margin-inline: auto;
  }
}

.wiki-main {
  min-width: 0;
}

.wiki-main h2 {
  font-family: var(--font-wiki-heading);
  font-weight: 600;
  font-size: calc(1.5rem * var(--wiki-main-scale, 1));
  letter-spacing: 0.06em;
  margin: 2rem 0 0.75rem;
  padding-top: 0.5rem;
  border-top: 1px solid var(--border);
  max-width: 68ch;
  box-sizing: border-box;
}

.wiki-main h2:first-of-type {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
}

.wiki-main h2#biography {
  text-transform: uppercase;
}

.wiki-main h3 {
  font-family: var(--font-wiki-heading);
  font-weight: 600;
  font-size: calc(1.1rem * var(--wiki-main-scale, 1));
  letter-spacing: 0.04em;
  margin: 1.25rem 0 0.5rem;
  max-width: 68ch;
  box-sizing: border-box;
}

.wiki-main p {
  margin: 0 0 1rem;
  max-width: 68ch;
}

.wiki-main,
.wiki-main p,
.wiki-main li,
.wiki-main figcaption {
  font-size: calc(1rem * var(--wiki-main-scale, 1));
}

/* If a block gets an explicit inline width (edit-mode resizer), don't clamp it to the prose measure. */
.wiki-main p[style*="width"],
.wiki-main hr.wiki-divider[style*="width"],
.wiki-main ul[style*="width"],
.wiki-main ol[style*="width"],
.wiki-main figure[style*="width"],
.wiki-main h2[style*="width"],
.wiki-main h3[style*="width"] {
  max-width: none;
}

/* Thin section divider (wiki editor: toolbar “Divider”) */
.wiki-main hr.wiki-divider,
.wiki-lead hr.wiki-divider {
  border: none;
  border-top: 1px solid var(--border);
  margin: 1.35rem 0;
  max-width: 68ch;
  height: 0;
  opacity: 0.9;
}

.wiki-figure {
  margin: 1.5rem 0;
  max-width: min(100%, 640px);
}

.wiki-figure img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--radius);
  border: 1px solid var(--border);
}

.wiki-figure figcaption {
  font-size: 0.9rem;
  color: var(--muted);
  margin-top: 0.5rem;
  line-height: 1.45;
}

.wiki-main figure img {
  cursor: zoom-in;
}

/*
  Multiple images in article body - use any of:

  Grid (responsive columns):
  <div class="wiki-gallery">
    <figure class="wiki-figure"><img src="../assets/…" alt="…" /></figure>
    <figure class="wiki-figure"><img … /></figure>
  </div>

  Optional modifiers on .wiki-gallery:
  - wiki-gallery--sm  -> tighter tiles
  - wiki-gallery--lg  -> wider minimum column width

  Vertical stack: repeat <figure class="wiki-figure">…</figure> blocks in .wiki-main.
*/

.wiki-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(168px, 1fr));
  gap: 0.85rem 1rem;
  margin: 1.5rem 0;
  width: 100%;
  max-width: min(100%, 56rem);
}

.wiki-gallery .wiki-figure {
  margin: 0;
  max-width: none;
}

.wiki-gallery .wiki-figure img {
  width: 100%;
  height: auto;
}

.wiki-gallery--sm {
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 0.65rem 0.85rem;
}

.wiki-gallery--lg {
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}

@media (max-width: 520px) {
  .wiki-gallery {
    grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  }

  .wiki-gallery--lg {
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  }
}

.wiki-main ul,
.wiki-main ol {
  margin: 0 0 1rem;
  padding-left: 1.35rem;
  max-width: 68ch;
}

.wiki-main li {
  margin-bottom: 0.35rem;
}

/* Table of contents */
.wiki-toc {
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1rem 1.25rem;
  margin-bottom: 1.5rem;
}

.wiki-toc-title {
  font-family: var(--font-wiki-heading);
  font-weight: 400;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--muted);
  margin: 0 0 0.65rem;
}

.wiki-toc ol {
  margin: 0;
  padding-left: 1.2rem;
  font-size: 0.95rem;
}

.wiki-toc a {
  color: var(--text);
  text-decoration: none;
}

.wiki-toc a:hover {
  color: var(--accent);
}

/* Infobox (fandom-style) */
.wiki-infobox {
  /* Same tint as section headers: white 4% over elevated (slideshow frame bars use this too). */
  --wiki-infobox-section-surface: color-mix(in srgb, var(--bg-elevated) 96%, rgb(255, 255, 255) 4%);
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  /* Grow with added rows; avoid accidental fixed height (inline height wins if present until normalized). */
  height: auto;
  max-height: none;
  font-size: 0.9rem;
  font-family: var(--font-wiki-prose);
  font-weight: var(--font-wiki-prose-weight);
}

/* Character infobox: tabs extend outside the card; keep outer corners rounded without clipping tabs. */
aside.wiki-infobox[aria-label="Character facts"] {
  overflow: visible !important;
  border-radius: var(--radius);
}

@media (min-width: 901px) {
  .wiki-layout .wiki-infobox {
    margin-top: -3.5rem;
    margin-inline-start: 1rem;
  }

  /* Long / tall titles: cancel pull-up and add a hair of space so nothing kisses the infobox */
  main.wiki-page.wiki-page--tall-title .wiki-layout .wiki-infobox {
    margin-top: 0.75rem;
  }

  /* TCC production page: keep the previous, less aggressive pull-up (multi-season slideshow layout). */
  main.wiki-page.wiki-page--tcc .wiki-layout .wiki-infobox {
    margin-top: -2.25rem;
  }

  main.wiki-page.wiki-page--tcc.wiki-page--tall-title .wiki-layout .wiki-infobox {
    margin-top: 0.75rem;
  }
}

.wiki-infobox-header {
  font-family: var(--font-wiki-heading);
  background: rgba(34, 211, 238, 0.14);
  border-bottom: 1px solid var(--border);
  padding: 0.65rem 1rem;
  font-weight: 400;
  text-align: center;
  font-size: 1rem;
  border-top-left-radius: var(--radius);
  border-top-right-radius: var(--radius);
}

/* Footer / CTA row: rounded bottom corners. */
.wiki-infobox-footer,
.wiki-infobox-row--cta:last-child,
.wiki-infobox dl > .wiki-infobox-row--cta:last-child {
  border-bottom-left-radius: var(--radius);
  border-bottom-right-radius: var(--radius);
}

/* Character tab strip font (local assets). */
@font-face {
  font-family: "MADE TOMMY Regular_PERSONAL USE";
  src: url("../assets/fonts/made_tommy/MADE%20TOMMY%20Regular_PERSONAL%20USE.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/*
 * Single infobox image frame site-wide: 1830×2158 (portrait).
 * All character, production, and slideshow images use this aspect ratio; only width/scale and object-position vary.
 */
.wiki-infobox-media {
  --wiki-infobox-frame-w: 1830;
  --wiki-infobox-frame-h: 2158;
  --wiki-infobox-scale: 0.78;
  position: relative;
  width: calc(100% * var(--wiki-infobox-scale));
  margin-inline: auto;
  aspect-ratio: var(--wiki-infobox-frame-w) / var(--wiki-infobox-frame-h);
  background: var(--bg);
  border-radius: 0;
  overflow: hidden;
  line-height: 0;
}

.wiki-infobox-image {
  position: absolute;
  display: block;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  /* Default: slightly cropped (no letterboxing). */
  object-fit: cover;
  object-position: center center;
  cursor: pointer;
}

/* Alice: anchor crop on upper/mid portrait so the face isn’t clipped (tall frame + cover) */
.wiki-infobox-media.wiki-infobox-media--alice .wiki-infobox-image {
  object-position: center 22%;
}

.wiki-infobox-media.wiki-infobox-media--kate .wiki-infobox-image {
  object-fit: cover;
  object-position: center center;
  transform: translateX(6%) scale(1.12);
  transform-origin: 54% center;
}

/* Tony Parrish - nudge crop slightly left (subject sits a bit right in source photo) */
.wiki-infobox-media.wiki-infobox-media--tony .wiki-infobox-image {
  object-position: 56% center;
}

/* Victoria Whitson - face high in frame; anchor crop upper so forehead isn’t clipped */
.wiki-infobox-media.wiki-infobox-media--victoria .wiki-infobox-image {
  object-position: center 32%;
}

/* Ben Kramer - head near top of source; favor upper crop in tall infobox */
.wiki-infobox-media.wiki-infobox-media--ben .wiki-infobox-image {
  object-position: center 34%;
}

/* Rylee Simpson - portrait; head high in frame; keep hair in view in tall infobox */
.wiki-infobox-media.wiki-infobox-media--rylee .wiki-infobox-image {
  object-position: center 30%;
}

/* Jessica Fisher - square headshot; hair near top of frame; favor upper crop in tall infobox */
.wiki-infobox-media.wiki-infobox-media--jessica .wiki-infobox-image {
  object-position: center 25%;
}

/* Amanda Nichols - portrait in car; face upper-mid; favor upper crop so hair stays in view */
.wiki-infobox-media.wiki-infobox-media--amanda .wiki-infobox-image {
  object-position: center 30%;
}

/* Delaney Gilmour - head very high in frame; anchor crop top so hair isn’t clipped */
.wiki-infobox-media.wiki-infobox-media--delaney .wiki-infobox-image {
  object-position: center 12%;
}

/* Jesse Nichols - landscape demo still; subject on right; pan right + favor top so face stays in frame */
.wiki-infobox-media.wiki-infobox-media--jesse .wiki-infobox-image {
  object-position: 80% 18%;
}

/* Cormac Brennan - portrait; head high in frame; favor upper crop in tall infobox */
.wiki-infobox-media.wiki-infobox-media--cormac .wiki-infobox-image {
  object-position: center 25%;
}

/* Bodhi Ferguson - landscape webcam still; face upper-mid; favor upper crop in tall infobox */
.wiki-infobox-media.wiki-infobox-media--bodhi .wiki-infobox-image {
  object-position: center 28%;
}

.wiki-infobox-image.is-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--muted);
  font-size: 0.8rem;
  text-align: center;
  padding: 1rem;
}

/* Production pages - full width of infobox; same portrait frame as all wiki infobox images (1830×2158) */
.wiki-infobox-media.wiki-infobox-media--production {
  --wiki-infobox-scale: 1;
  width: 100%;
  max-width: 100%;
}

.wiki-infobox-media.wiki-infobox-media--production .wiki-infobox-image {
  object-position: center center;
}

/* Greenlight Racing - wide logo on black; letterbox inside portrait frame */
.wiki-infobox-media.wiki-infobox-media--greenlight-racing {
  background: #000;
  padding: 0.5rem;
  box-sizing: border-box;
}

.wiki-infobox-media.wiki-infobox-media--greenlight-racing .wiki-infobox-image {
  object-fit: contain;
  object-position: center center;
}

/* PericoGrandPrix - widescreen event logo on black */
.wiki-infobox-media.wiki-infobox-media--pericograndprix {
  background: #000;
  padding: 0.5rem;
  box-sizing: border-box;
}

.wiki-infobox-media.wiki-infobox-media--pericograndprix .wiki-infobox-image {
  object-fit: contain;
  object-position: center center;
}

/* RACER GIRL covers are square; zoom out slightly inside the portrait frame */
.wiki-infobox-media.wiki-infobox-media--racer-girl .wiki-infobox-image {
  /* Square covers in a tall portrait frame: avoid cutting off left/right edges. */
  object-fit: contain;
  object-position: center center;
  transform: none !important;
}

.wiki-infobox-media.wiki-infobox-media--racer-girl {
  /* When using contain, the unused area should match the infobox dark grey, not pure black. */
  background: var(--bg-elevated);
  /* We position arrows at the infobox edges (outside the frame), so don't clip them. */
  overflow: visible;
}

.wiki-infobox-media.wiki-infobox-media--racer-girl .wiki-cover-slideshow__viewport {
  background: var(--bg-elevated);
  border-radius: 0;
}

.wiki-infobox-media.wiki-infobox-media--racer-girl .wiki-cover-slideshow__btn {
  z-index: 6;
  /* Ensure cover slideshow arrows stay above frame and remain interactive. */
  opacity: 1 !important;
  pointer-events: auto !important;
}

.wiki-infobox-media.wiki-infobox-media--racer-girl .wiki-cover-slideshow__btn--prev {
  /* The slideshow wrapper has padding-inline gutters; push arrows to the infobox edges. */
  left: calc(-2.85rem + 0.05rem + 0.22rem);
}

.wiki-infobox-media.wiki-infobox-media--racer-girl .wiki-cover-slideshow__btn--next {
  right: calc(-2.85rem + 0.05rem + 0.22rem);
}

/* FASTLANE 2 covers - handle like RACER GIRL (no crop, grey background, edge arrows) */
.wiki-infobox-media.wiki-infobox-media--fastlane-2 .wiki-infobox-image {
  object-fit: contain;
  object-position: center center;
  transform: none !important;
}

.wiki-infobox-media.wiki-infobox-media--fastlane-2 {
  background: var(--bg-elevated);
  overflow: visible;
}

.wiki-infobox-media.wiki-infobox-media--fastlane-2 .wiki-cover-slideshow__viewport {
  background: var(--bg-elevated);
  border-radius: 0;
}

.wiki-infobox-media.wiki-infobox-media--fastlane-2 .wiki-cover-slideshow__btn {
  z-index: 6;
  opacity: 1 !important;
  pointer-events: auto !important;
}

.wiki-infobox-media.wiki-infobox-media--fastlane-2 .wiki-cover-slideshow__btn--prev {
  left: calc(-2.85rem + 0.05rem + 0.22rem);
}

.wiki-infobox-media.wiki-infobox-media--fastlane-2 .wiki-cover-slideshow__btn--next {
  right: calc(-2.85rem + 0.05rem + 0.22rem);
}

/* FASTLANE 3 covers - handle like RACER GIRL / FASTLANE 2 */
.wiki-infobox-media.wiki-infobox-media--fastlane-3 .wiki-infobox-image {
  object-fit: contain;
  object-position: center center;
  transform: none !important;
}

.wiki-infobox-media.wiki-infobox-media--fastlane-3 {
  background: var(--bg-elevated);
  overflow: visible;
}

.wiki-infobox-media.wiki-infobox-media--fastlane-3 .wiki-cover-slideshow__viewport {
  background: var(--bg-elevated);
  border-radius: 0;
}

.wiki-infobox-media.wiki-infobox-media--fastlane-3 .wiki-cover-slideshow__btn {
  z-index: 6;
  opacity: 1 !important;
  pointer-events: auto !important;
}

.wiki-infobox-media.wiki-infobox-media--fastlane-3 .wiki-cover-slideshow__btn--prev {
  left: calc(-2.85rem + 0.05rem + 0.22rem);
}

.wiki-infobox-media.wiki-infobox-media--fastlane-3 .wiki-cover-slideshow__btn--next {
  right: calc(-2.85rem + 0.05rem + 0.22rem);
}

/* TheCousinChronicles covers - handle like other cover slideshows */
.wiki-infobox-media.wiki-infobox-media--tcc .wiki-infobox-image {
  object-fit: contain;
  object-position: center center;
  transform: none !important;
}

.wiki-infobox-media.wiki-infobox-media--tcc {
  background: var(--bg-elevated);
  overflow: visible;
}

.wiki-infobox-media.wiki-infobox-media--tcc .wiki-cover-slideshow__viewport {
  background: var(--bg-elevated);
  border-radius: 0;
}

.wiki-infobox-media.wiki-infobox-media--tcc .wiki-cover-slideshow__btn {
  z-index: 6;
  opacity: 1 !important;
  pointer-events: auto !important;
}

.wiki-infobox-media.wiki-infobox-media--tcc .wiki-cover-slideshow__btn--prev {
  left: calc(-2.85rem + 0.05rem + 0.22rem);
}

.wiki-infobox-media.wiki-infobox-media--tcc .wiki-cover-slideshow__btn--next {
  right: calc(-2.85rem + 0.05rem + 0.22rem);
}

/* A Symphony Of Two covers - handle like movie covers (RACER GIRL style) */
.wiki-infobox-media.wiki-infobox-media--asot .wiki-infobox-image {
  object-fit: contain;
  object-position: center center;
  transform: none !important;
}

.wiki-infobox-media.wiki-infobox-media--asot {
  background: var(--bg-elevated);
  overflow: visible;
}

.wiki-infobox-media.wiki-infobox-media--asot .wiki-cover-slideshow__viewport {
  background: var(--bg-elevated);
  border-radius: 0;
}

.wiki-infobox-media.wiki-infobox-media--asot .wiki-cover-slideshow__btn {
  z-index: 6;
  opacity: 1 !important;
  pointer-events: auto !important;
}

.wiki-infobox-media.wiki-infobox-media--asot .wiki-cover-slideshow__btn--prev {
  left: calc(-2.85rem + 0.05rem + 0.22rem);
}

.wiki-infobox-media.wiki-infobox-media--asot .wiki-cover-slideshow__btn--next {
  right: calc(-2.85rem + 0.05rem + 0.22rem);
}

/* ASOT: second cover is slightly smaller; scale to match first */
.wiki-infobox-media.wiki-infobox-media--asot .wiki-cover-slideshow__slide:nth-child(2) .wiki-infobox-image {
  transform: scale(1.07) !important;
  transform-origin: center center;
}

/* Character pages: ALWAYS crop-to-fill (even for "cover" style variants). */
aside.wiki-infobox[aria-label="Character facts"] .wiki-infobox-media.wiki-infobox-media--racer-girl .wiki-infobox-image,
aside.wiki-infobox[aria-label="Character facts"] .wiki-infobox-media.wiki-infobox-media--fastlane-2 .wiki-infobox-image,
aside.wiki-infobox[aria-label="Character facts"] .wiki-infobox-media.wiki-infobox-media--fastlane-3 .wiki-infobox-image,
aside.wiki-infobox[aria-label="Character facts"] .wiki-infobox-media.wiki-infobox-media--tcc .wiki-infobox-image,
aside.wiki-infobox[aria-label="Character facts"] .wiki-infobox-media.wiki-infobox-media--asot .wiki-infobox-image {
  object-fit: cover !important;
}

/* A Symphony Of Two - infobox cover slideshow (two posters, swipe + controls) */
.wiki-infobox-cover-slideshow {
  width: 100%;
  max-width: 100%;
  margin-inline: auto;
  /* Put arrow gutters OUTSIDE the photo frame (no inner side bars). */
  position: relative;
  padding-inline: 2.85rem;
}

/* Slideshow viewport anchors to the media frame (default scale matches voice-actor infoboxes e.g. Elizabeth; --production = full width for posters) */
.wiki-infobox-cover-slideshow .wiki-infobox-media {
  position: relative;
  /* Fill the photo frame; arrow gutters live on the wrapper, not inside the frame. */
  width: 100%;
}

/* Default: when multiple infobox images exist, prefer slideshow markup */
.wiki-infobox-cover-slideshow {
  width: 100%;
}

.wiki-cover-slideshow__viewport {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  /* hidden = fallback; clip tightens sub-pixel bleed at slide edges where supported */
  overflow: hidden;
  overflow: clip;
  /* Prevent sub-pixel slide bleed on transforms */
  isolation: isolate;
  touch-action: pan-y pinch-zoom;
  outline: none;
}

.wiki-cover-slideshow__viewport:focus-visible {
  outline: 2px solid rgba(46, 163, 184, 0.65);
  outline-offset: -2px;
}

/* Don't hide slideshow viewport; hiding causes blank/grey frames on file:// and during edit-time markup changes. */
.wiki-infobox-cover-slideshow[data-asot-slideshow]:not([data-asot-ready]) .wiki-cover-slideshow__viewport {
  visibility: visible;
}

/* In edit mode, never hide the slideshow viewport (prevents grey/blank squares while attaching photos). */
body.wiki-is-editing .wiki-infobox-cover-slideshow[data-asot-slideshow] .wiki-cover-slideshow__viewport {
  visibility: visible !important;
}

@media (scripting: none) {
  .wiki-infobox-cover-slideshow[data-asot-slideshow] .wiki-cover-slideshow__viewport {
    visibility: visible !important;
  }
}

.wiki-cover-slideshow__track {
  display: flex;
  height: 100%;
  width: 200%;
  transition: transform 0.38s ease;
  will-change: transform;
  backface-visibility: hidden;
  transform: translate3d(0, 0, 0);
}

@media (prefers-reduced-motion: reduce) {
  .wiki-cover-slideshow__track {
    transition: none;
  }
}

.wiki-cover-slideshow__slide {
  flex: 0 0 50%;
  position: relative;
  height: 100%;
  min-width: 0;
  box-sizing: border-box;
  overflow: hidden;
  backface-visibility: hidden;
}

.wiki-cover-slideshow__slide .wiki-infobox-image {
  cursor: zoom-in;
}

/* Infobox photos (all page types): always show hand cursor on hover. */
.wiki-page aside.wiki-infobox img.wiki-infobox-image {
  cursor: pointer !important;
}

/*
 * Single-slide production cover: frame height follows the image (no portrait letterbox).
 * (Arrow gutters on the slideshow wrapper are unused when there is only one slide.)
 */
.wiki-infobox-cover-slideshow.wiki-cover-slideshow--single:has(.wiki-infobox-media--production) {
  padding-inline: 0;
}

.wiki-infobox-cover-slideshow.wiki-cover-slideshow--single .wiki-infobox-media.wiki-infobox-media--production {
  aspect-ratio: auto !important;
  height: auto;
  min-height: 0;
}

.wiki-infobox-cover-slideshow.wiki-cover-slideshow--single .wiki-cover-slideshow__viewport {
  position: relative !important;
  inset: auto !important;
  width: 100%;
  height: auto;
  min-height: 0;
}

.wiki-infobox-cover-slideshow.wiki-cover-slideshow--single .wiki-cover-slideshow__track {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0;
  transition: none;
  will-change: auto;
}

.wiki-infobox-cover-slideshow.wiki-cover-slideshow--single .wiki-cover-slideshow__slide {
  display: block !important;
  width: 100% !important;
  flex: none !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible;
}

.wiki-infobox-cover-slideshow.wiki-cover-slideshow--single .wiki-infobox-media--production .wiki-cover-slideshow__slide .wiki-infobox-image {
  position: static !important;
  display: block;
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
  object-position: center center;
}

/* Prev/next on left & right of the image; dots along bottom edge */
.wiki-cover-slideshow__btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.25rem;
  min-height: 2.75rem;
  padding: 0 0.4rem;
  border: 1px solid rgb(34, 211, 238);
  border-radius: 6px;
  background: rgb(15, 23, 42);
  color: var(--accent, #22d3ee);
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
  opacity: 1;
  pointer-events: auto;
  transition: opacity 0.22s ease, background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

/* Desktop: arrows fade unless the slideshow is hovered/focused */
@media (hover: hover) {
  .wiki-infobox-cover-slideshow .wiki-cover-slideshow__btn {
    opacity: 0.15;
  }

  .wiki-infobox-cover-slideshow:hover .wiki-cover-slideshow__btn,
  /* Avoid pinning arrows at full opacity after mouse clicks (focus-within). */
  .wiki-infobox-cover-slideshow .wiki-cover-slideshow__btn:focus-visible {
    opacity: 1;
  }
}

.wiki-cover-slideshow__btn--prev {
  left: 0.35rem;
}

.wiki-cover-slideshow__btn--next {
  right: 0.35rem;
}

.wiki-cover-slideshow__btn:hover {
  background: rgb(30, 41, 59);
  border-color: rgb(103, 232, 249);
  color: var(--accent-hover, #67e8f9);
}

.wiki-cover-slideshow__btn:focus-visible {
  outline: 2px solid rgba(34, 211, 238, 0.75);
  outline-offset: 2px;
  opacity: 1;
  pointer-events: auto;
}

.wiki-cover-slideshow__dots {
  position: absolute;
  bottom: 0.5rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.2rem 0.45rem;
  border-radius: 999px;
  background: rgb(15, 23, 42);
}

.wiki-cover-slideshow__dot {
  width: 0.55rem;
  height: 0.55rem;
  padding: 0;
  border: none;
  border-radius: 50%;
  background: rgb(100, 116, 139);
  cursor: pointer;
  transition: transform 0.15s ease, background 0.15s ease;
}

.wiki-cover-slideshow__dot[aria-selected="true"] {
  background: rgb(120, 232, 248);
  transform: scale(1.2);
}

.wiki-cover-slideshow__dot:focus-visible {
  outline: 2px solid rgba(46, 163, 184, 0.85);
  outline-offset: 2px;
}

/* Character wiki only: turn dots into renamable "tabs" and move them to the top. */
aside.wiki-infobox[aria-label="Character facts"] .wiki-infobox-cover-slideshow {
  /* Make room for the tab strip above the photo frame. */
  --wiki-character-tabstrip-h: 2.85rem;
  --wiki-character-tab-overlap: 0.55rem;
  padding-inline: 0; /* override the default arrow gutters */
  padding-top: 0;
  /* Gap between header and tabs (renders under the tabs). */
  --wiki-character-tab-gap: 0.35rem;
  position: relative;
  isolation: isolate;
  padding-top: var(--wiki-character-tab-gap);
  margin-top: 0;
}

aside.wiki-infobox[aria-label="Character facts"] .wiki-infobox-cover-slideshow::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: var(--wiki-character-tab-gap);
  /* Underlay strip so the gap isn't on the same layer as the tabs. */
  background: rgba(12, 14, 18, 0.92);
  z-index: -2;
  pointer-events: none;
}

/* Character wiki only: reserve space above the image inside the media frame. */
aside.wiki-infobox[aria-label="Character facts"] .wiki-infobox-cover-slideshow .wiki-infobox-media {
  box-sizing: border-box;
  padding-top: var(--wiki-character-tabstrip-h);
  /* Allow tabs to extend "behind" the photo without being hard-clipped by the media frame. */
  overflow: visible;
  z-index: 1;
  border-radius: 0 !important;
}

/* Character wiki default: always crop to fill the portrait frame (no letterboxing). */
aside.wiki-infobox[aria-label="Character facts"] .wiki-infobox-media .wiki-infobox-image,
aside.wiki-infobox[aria-label="Character facts"] .wiki-infobox-cover-slideshow .wiki-infobox-image {
  object-fit: cover !important;
  object-position: center center;
}

/* The viewport (image area) starts below the tabs. */
aside.wiki-infobox[aria-label="Character facts"] .wiki-infobox-cover-slideshow .wiki-cover-slideshow__viewport {
  /* Let the image overlap upward a bit to hide tab bottoms (no floating gap). */
  top: calc(var(--wiki-character-tabstrip-h) - var(--wiki-character-tab-overlap));
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 3;
  border-radius: 0 !important;
  /* Thin grey frame - character infoboxes only (production pages use a clean edge). */
  box-shadow: inset 0 0 0 1px rgba(115, 125, 140, 0.72);
}

aside.wiki-infobox[aria-label="Character facts"] .wiki-infobox-cover-slideshow .wiki-cover-slideshow__viewport:focus-visible {
  box-shadow:
    inset 0 0 0 1px rgba(115, 125, 140, 0.72),
    inset 0 0 0 3px rgba(46, 163, 184, 0.65);
  outline: none;
}

/* Bars at top/bottom of slideshow - same surface as .wiki-infobox-row--section */
aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__viewport::before,
aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__viewport::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  background: var(--wiki-infobox-section-surface);
  z-index: 6;
  pointer-events: none;
}

aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__viewport::before {
  top: 0;
  height: 2px;
}

aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__viewport::after {
  bottom: 0;
  height: 3px;
}

aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__dots {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: auto;
  transform: none;
  z-index: 2;
  gap: 0.25rem;
  height: var(--wiki-character-tabstrip-h);
  /* Subtle depth under the tab strip (sits above the photo). */
  filter: drop-shadow(0 10px 10px rgba(0, 0, 0, 0.55));
  /* Slightly bigger gap below header, but keep tabs close to image. */
  /* Keep the first tab away from the infobox’s rounded corner so it doesn’t look “cut”. */
  padding: 0.42rem 0.65rem 0;
  /* Keep tabs visually tight to the left edge without colliding with the infobox corner curve. */
  padding-left: 0.35rem;
  background: transparent;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-end;
  max-width: none;
  overflow-x: auto;
  overflow-y: visible;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
}

/* Character wiki (single infobox photo): match slideshow-style crop window.
   Slideshows effectively crop inside a shorter viewport (below the tab strip),
   which reduces side-cropping. Apply the same "shorter viewport" to single-photo
   infoboxes so they fill the frame the same way. */
aside.wiki-infobox[aria-label="Character facts"] > .wiki-infobox-media {
  --wiki-character-tabstrip-h: 2.85rem;
  box-sizing: border-box;
  padding-top: var(--wiki-character-tabstrip-h);
  overflow: hidden;
}

aside.wiki-infobox[aria-label="Character facts"] > .wiki-infobox-media::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: var(--wiki-character-tabstrip-h);
  background: rgba(12, 14, 18, 0.92);
  z-index: 2;
  pointer-events: none;
}

aside.wiki-infobox[aria-label="Character facts"] > .wiki-infobox-media > .wiki-infobox-image {
  top: var(--wiki-character-tabstrip-h);
  bottom: 0;
  left: 0;
  right: 0;
  height: auto;
  z-index: 1;
}

/* Character pages: only show tabs when 2+ photos exist. */
aside.wiki-infobox[aria-label="Character facts"] .wiki-infobox-cover-slideshow.wiki-cover-slideshow--single .wiki-cover-slideshow__dots {
  display: none !important;
}

/* Character pages: optional "hide tabstrip behind header" mode (per-page). */
aside.wiki-infobox[aria-label="Character facts"][data-wiki-hide-tabstrip="1"] .wiki-infobox-cover-slideshow {
  --wiki-character-tabstrip-h: 0px;
  --wiki-character-tab-overlap: 0px;
  --wiki-character-tab-gap: 0px;
  padding-top: 0 !important;
}

aside.wiki-infobox[aria-label="Character facts"][data-wiki-hide-tabstrip="1"] .wiki-infobox-cover-slideshow::before {
  content: none !important;
}

aside.wiki-infobox[aria-label="Character facts"][data-wiki-hide-tabstrip="1"] .wiki-infobox-cover-slideshow .wiki-infobox-media {
  padding-top: 0 !important;
}

aside.wiki-infobox[aria-label="Character facts"][data-wiki-hide-tabstrip="1"] .wiki-infobox-cover-slideshow .wiki-cover-slideshow__viewport {
  top: 0 !important;
}

aside.wiki-infobox[aria-label="Character facts"][data-wiki-hide-tabstrip="1"] .wiki-infobox-cover-slideshow .wiki-cover-slideshow__dots {
  display: none !important;
}

/* Character slideshow with a single photo: don't reserve tab-strip space (fill full frame). */
aside.wiki-infobox[aria-label="Character facts"] .wiki-infobox-cover-slideshow.wiki-cover-slideshow--single {
  --wiki-character-tabstrip-h: 0px;
  --wiki-character-tab-overlap: 0px;
  --wiki-character-tab-gap: 0px;
  padding-top: 0 !important;
}

aside.wiki-infobox[aria-label="Character facts"] .wiki-infobox-cover-slideshow.wiki-cover-slideshow--single::before {
  content: none !important;
}

aside.wiki-infobox[aria-label="Character facts"] .wiki-infobox-cover-slideshow.wiki-cover-slideshow--single .wiki-infobox-media {
  padding-top: 0 !important;
}

aside.wiki-infobox[aria-label="Character facts"] .wiki-infobox-cover-slideshow.wiki-cover-slideshow--single .wiki-cover-slideshow__viewport {
  top: 0 !important;
}

aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__dots::-webkit-scrollbar {
  display: none;
}

/* Inner scroller so tab labels scroll horizontally; edge fades use .dots--with-arrows (script.js). */
aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__dots.wiki-cover-slideshow__dots--with-arrows {
  display: block;
  width: 100%;
  max-width: 100%;
}

aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__dots-scroller {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-end;
  gap: 0.25rem;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  overflow-x: auto;
  overflow-y: visible;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  padding: 0;
}

/* Motion blur while the tab strip is actively scrolling (toggled in script.js). */
aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__dots.wiki-cover-slideshow__dots--scrolling .wiki-cover-slideshow__dots-scroller {
  filter: blur(0.7px);
}

@media (prefers-reduced-motion: reduce) {
  aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__dots.wiki-cover-slideshow__dots--scrolling .wiki-cover-slideshow__dots-scroller {
    filter: none;
  }
}

aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__dots-scroller::-webkit-scrollbar {
  display: none;
}

/* Soft left/right edges when the tab row scrolls (classes toggled in script.js). */
aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__dots.wiki-cover-slideshow__dots--with-arrows::before,
aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__dots.wiki-cover-slideshow__dots--with-arrows::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  /* Wider edge zone: chevron + dark gradient fade (no backdrop blur). */
  width: clamp(3.1rem, 12vw, 4.55rem);
  pointer-events: none;
  z-index: 4;
  opacity: 0;
  transition: opacity 0.32s ease;
  mask-mode: alpha;
}

/* Chevrons + dark gradient; feathering is the mask alpha ramp. */
aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__dots.wiki-cover-slideshow__dots--with-arrows::before {
  left: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-opacity='0.96' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 6l-6 6 6 6'/%3E%3C/svg%3E"),
    linear-gradient(
      to right,
      rgb(12, 14, 18) 0%,
      rgb(12, 14, 18) 28%,
      rgba(12, 14, 18, 0.98) 40%,
      rgba(12, 14, 18, 0.86) 56%,
      rgba(12, 14, 18, 0.58) 78%,
      rgba(12, 14, 18, 0) 100%
    );
  background-size: 1.2rem auto, 100% 100%;
  background-position: left 0.38rem center, 0 0;
  background-repeat: no-repeat, no-repeat;
  mask-image: linear-gradient(
    to right,
    #000 0%,
    #000 14%,
    rgba(0, 0, 0, 0.97) 28%,
    rgba(0, 0, 0, 0.78) 46%,
    rgba(0, 0, 0, 0.42) 68%,
    rgba(0, 0, 0, 0.16) 86%,
    transparent 100%
  );
  -webkit-mask-image: linear-gradient(
    to right,
    #000 0%,
    #000 14%,
    rgba(0, 0, 0, 0.97) 28%,
    rgba(0, 0, 0, 0.78) 46%,
    rgba(0, 0, 0, 0.42) 68%,
    rgba(0, 0, 0, 0.16) 86%,
    transparent 100%
  );
}

aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__dots.wiki-cover-slideshow__dots--with-arrows::after {
  right: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-opacity='0.96' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 6l6 6-6 6'/%3E%3C/svg%3E"),
    linear-gradient(
      to left,
      rgb(12, 14, 18) 0%,
      rgb(12, 14, 18) 28%,
      rgba(12, 14, 18, 0.98) 40%,
      rgba(12, 14, 18, 0.86) 56%,
      rgba(12, 14, 18, 0.58) 78%,
      rgba(12, 14, 18, 0) 100%
    );
  background-size: 1.2rem auto, 100% 100%;
  background-position: right 0.38rem center, 0 0;
  background-repeat: no-repeat, no-repeat;
  mask-image: linear-gradient(
    to left,
    #000 0%,
    #000 14%,
    rgba(0, 0, 0, 0.97) 28%,
    rgba(0, 0, 0, 0.78) 46%,
    rgba(0, 0, 0, 0.42) 68%,
    rgba(0, 0, 0, 0.16) 86%,
    transparent 100%
  );
  -webkit-mask-image: linear-gradient(
    to left,
    #000 0%,
    #000 14%,
    rgba(0, 0, 0, 0.97) 28%,
    rgba(0, 0, 0, 0.78) 46%,
    rgba(0, 0, 0, 0.42) 68%,
    rgba(0, 0, 0, 0.16) 86%,
    transparent 100%
  );
}

aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__dots.wiki-cover-slideshow__dots--with-arrows.wiki-cover-slideshow__dots--fade-left::before {
  opacity: 1;
}

aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__dots.wiki-cover-slideshow__dots--with-arrows.wiki-cover-slideshow__dots--fade-right::after {
  opacity: 1;
}

/* Legacy / saved HTML: tab-strip scroll arrows removed (tabs auto-scroll). */
aside.wiki-infobox[aria-label="Character facts"] .wiki-infobox-cover-slideshow > .wiki-cover-slideshow__tabstrip-btn {
  display: none !important;
}

/* Character wiki only: no slideshow arrows (tabs are the navigation). */
aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__btn {
  display: none !important;
}

aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__btn--prev,
aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__btn--next {
  pointer-events: none !important;
}

aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__dot {
  /* Grow with label text; flex row otherwise shrinks tabs and clips long names. */
  flex: 0 0 auto;
  width: max-content;
  max-width: none;
  height: auto;
  min-height: 2.85rem;
  min-width: 7.5rem;
  /* Shift label upward a bit more without changing overall height much. */
  padding: 0.48rem 1.55rem 0.84rem;
  /* Render the tab shape via ::before so the button itself stays perfectly square. */
  position: relative;
  isolation: isolate;
  border: 0;
  border-radius: 0 !important;
  background: transparent;
  color: #fff !important;
  z-index: 1; /* keep the tab above the underlay strip */
  font-family: "MADE TOMMY Regular_PERSONAL USE", var(--font-wiki-heading);
  font-weight: 500;
  font-size: 0.9rem;
  letter-spacing: 0.03em;
  line-height: 1;
  white-space: nowrap;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45), 0 0 1px rgba(0, 0, 0, 0.35);
  box-shadow: none;
  transition: transform 0.15s ease, background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.2s ease;
  /* Keep the button in the strip; the visible tab shape is clipped via ::before. */
  margin-bottom: 0;
}

aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__dot::before {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid rgba(255, 255, 255, 0.12);
  /* No visible bottom edge (it should look hidden behind the photo). */
  border-bottom-color: transparent;
  border-radius: 14px 14px 0 0;
  background: rgba(26, 31, 40, 0.88);
  /* Clip off only the bottom portion so it never "hard cuts" against the photo.
     (No rounded clip-path corners; border-radius already defines the top corners.) */
  clip-path: inset(0 0 var(--wiki-character-tab-overlap) 0 round 14px 14px 0 0);
  /* Top/side depth only - the bottom edge is intentionally hidden behind the photo. */
  box-shadow:
    0 -2px 18px rgba(0, 0, 0, 0.38),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
  z-index: -1;
  pointer-events: none;
}

aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__dot[aria-selected="true"] {
  color: #fff !important;
  transform: none;
  box-shadow: none;
}

aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__dot[aria-selected="true"]::before {
  border-color: rgba(255, 255, 255, 0.28);
  border-bottom-color: transparent;
  background: rgba(58, 68, 86, 0.94);
  box-shadow:
    0 -2px 22px rgba(0, 0, 0, 0.45),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

/* Ensure Tab 1 doesn't inherit any bottom-left rounding from elsewhere. */
aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__dot:first-child {
  border-bottom-left-radius: 0 !important;
}

aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__dot:hover,
aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__dot:focus-visible {
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__dot:hover {
  border-color: rgba(255, 255, 255, 0.26);
  color: rgba(255, 255, 255, 0.96);
  transform: none;
}

aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__dot:hover::before {
  border-color: rgba(255, 255, 255, 0.26);
  box-shadow:
    0 -2px 26px rgba(0, 0, 0, 0.58),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

@media (max-width: 420px) {
  aside.wiki-infobox[aria-label="Character facts"] .wiki-cover-slideshow__dot {
    flex: 0 0 auto;
    width: max-content;
    max-width: none;
    min-height: 1.9rem;
    min-width: 6.75rem;
    padding: 0.3rem 1.05rem;
    font-size: 0.74rem;
  }
}

/* Character wiki only: slightly larger infobox header name. */
aside.wiki-infobox[aria-label="Character facts"] .wiki-infobox-header {
  font-size: 1.16rem;
}

.wiki-infobox dd.wiki-infobox-dd-list {
  padding-top: 0.15rem;
  padding-bottom: 0.15rem;
}

.wiki-infobox dd.wiki-infobox-dd-list ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: 0.88rem;
  line-height: 1.4;
}

.wiki-infobox dd.wiki-infobox-dd-list li {
  margin-bottom: 0.25rem;
}

.wiki-infobox .wiki-note {
  color: var(--muted);
  font-weight: 400;
}

.wiki-infobox dl {
  margin: 0;
  padding: 0;
}

/* Thin rule between infobox image / slideshow and the first data row */
.wiki-infobox > .wiki-infobox-media + dl > .wiki-infobox-row:first-child,
.wiki-infobox > .wiki-infobox-cover-slideshow + dl > .wiki-infobox-row:first-child {
  border-top: 1px solid var(--border);
}

/* Character + cover slideshow: dark bar on viewport replaces this hairline (see .wiki-cover-slideshow__viewport::after). */
aside.wiki-infobox[aria-label="Character facts"] > .wiki-infobox-cover-slideshow + dl > .wiki-infobox-row:first-child {
  border-top: none;
}

.wiki-infobox-row {
  display: grid;
  grid-template-columns: 38% 62%;
  gap: 0.5rem;
  padding: 0.5rem 0.85rem;
  border-bottom: 1px solid var(--border);
}

.wiki-infobox-row.wiki-infobox-row--section {
  grid-template-columns: 1fr;
  padding: 0.5rem 0.85rem;
  background: var(--wiki-infobox-section-surface);
}

.wiki-infobox-row.wiki-infobox-row--section dt {
  font-family: var(--font-wiki-heading);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.86);
}

.wiki-infobox-row.wiki-infobox-row--section dd {
  display: none;
}

.wiki-infobox-row:last-child {
  border-bottom: none;
}

/* Bottom corners when the facts list is the last block (no footer bar after dl). */
.wiki-infobox > dl:last-child > .wiki-infobox-row:last-child {
  border-bottom-left-radius: var(--radius);
  border-bottom-right-radius: var(--radius);
  /* Extra bottom padding so the row doesn’t look vertically cramped against the rounded clip. */
  padding-bottom: calc(0.5rem + 0.22rem);
}

/* Edit mode: infobox row remove control (row up/down use toolbar only). */
body.wiki-is-editing .wiki-infobox-row:not(.wiki-infobox-row--section) {
  position: relative;
  padding-right: 2.35rem;
  /* New rows can start nearly empty; keep room for the remove control. */
  min-height: 2.55rem;
}

body.wiki-is-editing .wiki-infobox-row.wiki-infobox-row--section {
  position: relative;
  padding-right: 2.35rem;
}

.wiki-infobox-row-move {
  position: absolute;
  top: 0.55rem;
  right: 0.55rem;
  transform: none;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  pointer-events: auto;
}

.wiki-infobox-row-move__btn {
  width: 1.4rem;
  height: 1.1rem;
  padding: 0;
  border-radius: 6px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.05);
  color: rgba(255, 255, 255, 0.85);
  font-family: "Segoe UI Symbol", "Segoe UI", system-ui, -apple-system, Arial, sans-serif;
  font-size: 0.7rem;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.wiki-infobox-row-move__btn svg {
  display: block;
  flex-shrink: 0;
}

.wiki-infobox-row-move__btn:hover {
  border-color: rgba(34, 211, 238, 0.5);
  color: var(--accent);
}

.wiki-infobox-row-move__btn:disabled {
  opacity: 0.35;
  cursor: default;
}

.wiki-infobox-row-move__btn--remove {
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1;
  height: 1.1rem;
}

.wiki-infobox-row-move__btn--remove:hover:not(:disabled) {
  border-color: rgba(248, 113, 113, 0.55);
  color: rgb(248, 113, 113);
}

.wiki-infobox dt {
  margin: 0;
  font-weight: 600;
  color: var(--muted);
}

.wiki-infobox dd {
  margin: 0;
}

.wiki-infobox a {
  color: var(--accent);
}

/* Hub index */
.wiki-hub-intro {
  max-width: 62ch;
  color: var(--muted);
  margin: 0 0 2rem;
}

.wiki-categories {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
}

@media (min-width: 760px) {
  .wiki-categories {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1100px) {
  .wiki-categories {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: start;
  }
}

.wiki-cat-card {
  display: flex;
  flex-direction: column;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.35rem 1.25rem;
  text-decoration: none;
  color: var(--text);
  transition: border-color 0.2s, background 0.2s;
  min-height: 0;
}

.wiki-cat-card:hover {
  border-color: rgba(34, 211, 238, 0.35);
  background: var(--bg-elevated);
}

.wiki-cat-card__head {
  position: sticky;
  top: 0;
  background: inherit;
  z-index: 1;
  padding-bottom: 0.75rem;
  margin-bottom: 0.25rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.wiki-cat-card h2 {
  font-family: var(--font-wiki-heading);
  font-weight: 400;
  font-size: 1.35rem;
  letter-spacing: 0.06em;
  margin: 0 0 0.5rem;
  color: var(--text);
}

.wiki-cat-card p {
  margin: 0;
  font-size: 0.95rem;
  color: var(--muted);
}

.wiki-entry-list {
  list-style: none;
  padding: 0;
  margin: 1rem 0 0;
  min-height: 0;
  max-height: min(56vh, 520px);
  overflow: auto;
  padding-right: 0.25rem;
  scrollbar-width: thin; /* Firefox */
  scrollbar-color: rgba(176, 176, 176, 0.9) rgba(0, 0, 0, 0.28); /* Firefox: thumb track */
}

/* Scrollbar styling (Chromium / Safari / Edge) */
.wiki-entry-list::-webkit-scrollbar {
  width: 12px;
}

.wiki-entry-list::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.28);
  border-radius: 999px;
  box-shadow:
    inset 3px 3px 6px rgba(0, 0, 0, 0.62),
    inset -3px -3px 6px rgba(255, 255, 255, 0.06);
}

.wiki-entry-list::-webkit-scrollbar-thumb {
  background: rgba(176, 176, 176, 0.9);
  border-radius: 999px;
  border: 2px solid rgba(0, 0, 0, 0.28);
  box-shadow:
    inset 2px 2px 5px rgba(255, 255, 255, 0.08),
    inset -3px -3px 6px rgba(0, 0, 0, 0.55),
    0 2px 8px rgba(0, 0, 0, 0.35);
}

.wiki-entry-list::-webkit-scrollbar-thumb:hover {
  background: rgba(198, 198, 198, 0.95);
}

.wiki-entry-list::-webkit-scrollbar-corner {
  background: transparent;
}

@media (max-width: 759px) {
  .wiki-entry-list {
    max-height: none;
    overflow: visible;
    padding-right: 0;
  }
}

@media (min-width: 600px) {
  .wiki-cat-card:nth-child(1) .wiki-entry-list {
    column-count: 2;
    column-gap: 1.25rem;
  }

  .wiki-cat-card:nth-child(1) .wiki-entry-list li {
    break-inside: avoid;
  }

  .wiki-cat-card:nth-child(2) .wiki-entry-list {
    column-count: 2;
    column-gap: 1.25rem;
  }

  .wiki-cat-card:nth-child(2) .wiki-entry-list li {
    break-inside: avoid;
  }
}

.wiki-entry-list li {
  border-bottom: 1px solid var(--border);
}

.wiki-entry-list a {
  display: block;
  padding: 0.65rem 0;
  color: var(--accent);
  text-decoration: none;
  font-weight: 600;
}

.wiki-entry-list li.is-unreleased a {
  color: rgba(255, 255, 255, 0.52);
  font-weight: 500;
}

.wiki-entry-list li.is-unreleased a:hover {
  color: var(--accent-hover);
}

body:not(.site-admin-session) .wiki-entry-list li.is-wiki-private {
  display: none;
}

body:not(.site-admin-session) .wiki-categories a.is-wiki-private {
  display: none !important;
}

body.site-admin-session .wiki-entry-list li.is-unreleased a {
  color: var(--accent);
  font-weight: 600;
}

body.site-admin-session .wiki-entry-list li.is-unreleased a:hover {
  color: var(--accent-hover);
}

.wiki-entry-list a:hover {
  color: var(--accent-hover);
}

/* Article footer meta */
.wiki-meta {
  margin-top: 2.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--border);
  font-size: 0.9rem;
  color: var(--muted);
}

.wiki-meta-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.5rem;
}

.wiki-tag {
  display: inline-block;
  padding: 0.25rem 0.65rem;
  background: rgba(34, 211, 238, 0.06);
  border: 1px solid rgba(34, 211, 238, 0.28);
  border-radius: 4px;
  color: var(--muted);
  font-size: 0.85rem;
}

.wiki-meta-tags a.wiki-tag {
  text-decoration: none;
  color: var(--muted);
}

.wiki-meta-tags a.wiki-tag:hover {
  color: var(--accent);
  border-color: rgba(34, 211, 238, 0.55);
}

.wiki-infobox dd a {
  color: var(--accent);
  text-decoration: none;
}

.wiki-infobox dd a:hover {
  text-decoration: underline;
}

.wiki-lead a {
  color: var(--accent);
  text-decoration: none;
}

.wiki-lead a:hover {
  text-decoration: underline;
}

.wiki-main a {
  color: var(--accent);
  text-decoration: none;
}

.wiki-main a:hover {
  text-decoration: underline;
}

.wiki-main .wiki-toc a {
  color: var(--text);
  text-decoration: none;
}

.wiki-main .wiki-toc a:hover {
  color: var(--accent);
  text-decoration: none;
}

li.is-unreleased a {
  color: rgba(255, 255, 255, 0.52);
}

li.is-unreleased a:hover {
  color: var(--accent);
}

/* Non-admins: unreleased pages should still be visible, but disabled (grey + no clicks) */
body:not(.site-admin-session) li.is-unreleased a {
  pointer-events: none;
  cursor: default;
  opacity: 0.7;
}

body:not(.site-admin-session) li.is-unreleased a:hover {
  color: rgba(255, 255, 255, 0.52);
}

body.site-admin-session li.is-unreleased a {
  color: var(--accent);
}

body.site-admin-session li.is-unreleased a:hover {
  color: var(--accent-hover);
}

/* Privated wiki pages: hidden from non-admin nav/search; admins see a muted tab */
body:not(.site-admin-session) li.is-wiki-private {
  display: none;
}

body:not(.site-admin-session) #wiki-dropdown a.is-wiki-private,
body:not(.site-admin-session) [data-site-search] a.is-wiki-private {
  display: none !important;
}

body.site-admin-session li.is-wiki-private a {
  opacity: 0.72;
  font-style: italic;
}

body.site-admin-session li.is-wiki-private a::after {
  content: " · private";
  font-size: 0.78em;
  font-style: normal;
  color: rgba(255, 255, 255, 0.45);
}

/* Match main site: slightly wider article column on large / 4K screens */
@media (min-width: 1920px) {
  .wiki-layout {
    grid-template-columns: 1fr minmax(320px, 492px);
    gap: 2.5rem 3rem;
  }
}

/* Infobox image lightbox (script.js) */
.wiki-infobox-lightbox[hidden] {
  display: none !important;
}

.wiki-infobox-lightbox {
  position: fixed;
  inset: 0;
  z-index: 4000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: min(4vw, 2rem);
  box-sizing: border-box;
  overflow: auto;
  overscroll-behavior: contain;
}

.wiki-infobox-lightbox__backdrop {
  position: fixed;
  inset: 0;
  margin: 0;
  padding: 0;
  border: none;
  background: rgba(5, 8, 12, 0.92);
  cursor: zoom-out;
}

.wiki-infobox-lightbox__figure {
  position: relative;
  z-index: 1;
  margin: 0;
  max-width: none;
  max-height: none;
  line-height: 0;
  box-shadow: 0 12px 48px rgba(0, 0, 0, 0.55);
  border-radius: var(--radius);
  overflow: hidden;
}

.wiki-infobox-lightbox.is-loading .wiki-infobox-lightbox__figure {
  /* Prevent an intrinsic-size "flash" before JS computes fitted base size. */
  max-width: min(96vw, 1400px);
  max-height: min(92vh, 1200px);
}

.wiki-infobox-lightbox.is-loading .wiki-infobox-lightbox__img {
  max-width: min(96vw, 1400px);
  max-height: min(92vh, 1200px);
  width: auto;
  height: auto;
}

.wiki-infobox-lightbox__img {
  display: block;
  max-width: none;
  max-height: none;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.wiki-infobox-lightbox__close {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 2;
  width: 2.75rem;
  height: 2.75rem;
  margin: 0;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--bg-elevated);
  color: var(--text);
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.wiki-infobox-lightbox__close:hover {
  color: var(--accent);
  border-color: var(--accent);
}

/* - Local wiki editor (wiki-edit.js) - */
.wiki-draft-banner {
  margin: 0 0 1rem;
  padding: 0.75rem 1rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--bg-elevated);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem 1rem;
  z-index: 30;
}

.wiki-draft-banner[hidden] {
  display: none !important;
}

.wiki-draft-banner__text {
  margin: 0;
  flex: 1 1 12rem;
  font-size: 0.95rem;
  color: var(--muted);
}

.wiki-draft-banner__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.wiki-draft-banner__btn {
  font-family: var(--font-nav);
  font-size: 0.85rem;
  padding: 0.35rem 0.75rem;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: transparent;
  color: var(--text);
  cursor: pointer;
}

.wiki-draft-banner__btn:hover {
  border-color: var(--accent);
  color: var(--accent);
}

.wiki-draft-banner__btn--primary {
  background: rgba(34, 211, 238, 0.12);
  border-color: var(--accent-dim);
  color: var(--accent);
}

.wiki-edit-fab {
  position: fixed;
  bottom: 1.25rem;
  right: 1.25rem;
  z-index: 40;
  width: 3.25rem;
  height: 3.25rem;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 50%;
  background: var(--bg-elevated);
  color: var(--accent);
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.45);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.wiki-edit-fab[hidden] {
  display: none !important;
}

.wiki-edit-fab:hover {
  transform: scale(1.06);
  border-color: var(--accent);
  color: var(--accent-hover);
}

.wiki-edit-fab:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}

.wiki-edit-fab[aria-pressed="true"] {
  color: var(--text);
  border-color: rgba(34, 211, 238, 0.45);
}

body.wiki-is-editing .wiki-edit-fab {
  bottom: 5.5rem;
}

.wiki-toolbox-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.1rem;
  height: 2.1rem;
  margin-right: 0.55rem;
  border-radius: 999px;
  border: 1px solid rgba(34, 211, 238, 0.28);
  background: rgba(34, 211, 238, 0.08);
  color: var(--accent);
  cursor: pointer;
}

.wiki-toolbox-btn:hover {
  border-color: rgba(34, 211, 238, 0.55);
  background: rgba(34, 211, 238, 0.12);
  color: var(--accent-hover);
}

.wiki-toolbox-btn:focus-visible {
  outline: 2px solid rgba(34, 211, 238, 0.75);
  outline-offset: 2px;
}

.wiki-edit-dock {
  position: fixed;
  top: var(--wiki-header-h, 72px);
  left: 0;
  bottom: 0;
  right: auto;
  z-index: 41;
  display: block;
  transform: translateX(-104%);
  transition: transform 0.18s ease;
}

.wiki-edit-dock[hidden] {
  display: none !important;
}

.wiki-tools-open .wiki-edit-dock {
  transform: translateX(0);
}

.wiki-edit-toolbar {
  position: relative;
  left: auto;
  width: min(268px, 90vw);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.5rem;
  padding: 0.75rem;
  border-right: none;
  background: rgba(10, 10, 11, 0.96);
  backdrop-filter: blur(8px);
  overflow: auto;
  min-height: 0;
}

.wiki-edit-toolbar__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding-bottom: 0.25rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.wiki-edit-toolbar__font-row {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.35rem;
  padding-bottom: 0.5rem;
  margin-bottom: 0.15rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.wiki-edit-toolbar__font-label {
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--muted);
}

.wiki-edit-toolbar__select {
  font-family: var(--font-nav);
  font-size: 0.82rem;
  width: 100%;
  padding: 0.32rem 0.45rem;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: var(--bg-elevated);
  color: var(--text);
  cursor: pointer;
}

.wiki-edit-toolbar__select:hover {
  border-color: var(--muted);
}

.wiki-edit-toolbar__select:focus {
  outline: 2px solid rgba(34, 211, 238, 0.45);
  outline-offset: 1px;
}

.wiki-edit-toolbar__label {
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--accent);
  margin-right: 0;
}

/* Transient status/flash message (no layout shift) */
.wiki-edit-toolbar__flash {
  height: 1.7rem;
  max-width: 100%;
  padding: 0.35rem 0.6rem;
  border-radius: 999px;
  border: 1px solid rgba(34, 211, 238, 0.38);
  background: rgba(34, 211, 238, 0.14);
  color: var(--accent);
  font-size: 0.85rem;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  pointer-events: none;
  opacity: 0;
  transform: translateY(-2px);
  transition: opacity 0.16s ease, transform 0.16s ease;
}

.wiki-edit-toolbar__flash.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.wiki-edit-toolbar__btn {
  font-family: var(--font-nav);
  font-size: 0.84rem;
  padding: 0.38rem 0.75rem;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: var(--bg-elevated);
  color: var(--text);
  cursor: pointer;
  width: 100%;
  text-align: left;
}

.wiki-edit-toolbar__btn--with-leading-icon {
  display: flex;
  align-items: center;
  gap: 0.45rem;
}

.wiki-edit-toolbar__btn--with-leading-icon svg {
  flex-shrink: 0;
  display: block;
  opacity: 0.92;
}

.wiki-edit-toolbar__btn--ghost {
  width: auto;
  text-align: center;
  padding: 0.3rem 0.55rem;
  border-radius: 999px;
  border-color: rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.06);
}

.wiki-edit-toolbar__link {
  position: static;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  /* Use a digit-safe font for URLs. */
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 0.82rem;
  padding: 0.32rem 0.6rem;
  border-radius: 999px;
  border: 1px solid rgba(34, 211, 238, 0.35);
  background: rgba(34, 211, 238, 0.1);
  color: var(--accent);
  cursor: pointer;
}

.wiki-edit-toolbar__link--bottom {
  margin-top: auto;
  margin-bottom: 0.25rem;
}

.wiki-edit-toolbar__link:hover {
  border-color: rgba(34, 211, 238, 0.6);
  background: rgba(34, 211, 238, 0.14);
}

/* Login/Register is now handled by dedicated pages (login.html/register.html). */

.wiki-edit-toolbar__btn:hover {
  border-color: var(--muted);
  color: var(--accent-hover);
}

.wiki-edit-toolbar__btn-row {
  display: flex;
  gap: 0.35rem;
  width: 100%;
  align-items: stretch;
}

.wiki-edit-toolbar__btn-row .wiki-edit-toolbar__btn {
  width: auto;
  flex: 1;
  min-width: 0;
}

.wiki-edit-toolbar__btn-row .wiki-edit-toolbar__btn--icon {
  flex: 0 0 2.65rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding-left: 0;
  padding-right: 0;
}

.wiki-edit-toolbar__btn--icon svg {
  display: block;
  flex-shrink: 0;
}

.wiki-edit-toolbar__divider {
  width: 100%;
  height: 1px;
  background: rgba(255, 255, 255, 0.08);
  margin: 0.25rem 0 0.35rem;
}

.wiki-edit-toolbar__end {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  margin-left: 0;
  margin-top: auto;
}

.wiki-edit-toolbar__btn--primary {
  background: rgba(34, 211, 238, 0.15);
  border-color: var(--accent-dim);
  color: var(--accent);
}

@media (max-width: 640px) {
  .wiki-edit-toolbar__end {
    width: 100%;
    justify-content: stretch;
    gap: 0.5rem;
  }

  .wiki-edit-toolbar__end .wiki-edit-toolbar__btn {
    flex: 1;
  }
}

body.wiki-is-editing .wiki-main[contenteditable="true"],
body.wiki-is-editing aside.wiki-infobox[contenteditable="true"] {
  outline: 1px dashed rgba(34, 211, 238, 0.45);
  outline-offset: 4px;
  border-radius: var(--radius);
  min-height: 2rem;
}

/* contenteditable: browsers often leave new lines as <div> or styled <span> after an H2 - force article face */
body.wiki-is-editing .wiki-main[contenteditable="true"] > *:not(h2):not(h3):not(h4):not(h5):not(h6) {
  font-family: var(--font-wiki-prose);
  font-weight: var(--font-wiki-prose-weight);
  letter-spacing: normal;
  text-transform: none;
}

body.wiki-is-editing .wiki-main[contenteditable="true"] > :not(h2):not(h3):not(h4):not(h5):not(h6) span:not(.wiki-tag) {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
}

/* New wiki page wizard (wiki-edit.js) */
.wiki-page-wizard {
  position: fixed;
  inset: 0;
  z-index: 6200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: min(4vw, 1.25rem);
  box-sizing: border-box;
  background: rgba(5, 8, 12, 0.78);
}

.wiki-page-wizard[hidden] {
  display: none !important;
}

.wiki-page-wizard__panel {
  width: min(440px, 96vw);
  max-height: min(90vh, 36rem);
  overflow: auto;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: var(--bg-elevated);
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.55);
  padding: 1rem 1.1rem 1.15rem;
}

.wiki-page-wizard__title {
  font-family: var(--font-wiki-heading);
  font-size: 1.05rem;
  font-weight: 600;
  margin: 0 0 0.75rem;
  color: var(--text);
}

.wiki-page-wizard__field {
  display: flex;
  flex-direction: column;
  gap: 0.28rem;
  margin-bottom: 0.75rem;
}

.wiki-page-wizard__field label {
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--muted);
}

.wiki-page-wizard__field input[type="text"],
.wiki-page-wizard__field select {
  font-family: var(--font-nav);
  font-size: 0.9rem;
  padding: 0.38rem 0.5rem;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
}

.wiki-page-wizard__hint {
  font-size: 0.78rem;
  color: var(--muted);
  line-height: 1.4;
  margin: 0 0 0.75rem;
}

.wiki-page-wizard__check {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin-bottom: 1rem;
  font-size: 0.86rem;
  color: var(--text);
}

.wiki-page-wizard__actions {
  display: flex;
  flex-wrap: nowrap;
  gap: 0.5rem;
  justify-content: flex-end;
}

.wiki-page-wizard__actions .wiki-edit-toolbar__btn {
  margin: 0;
}

/* Image replace + crop modal (wiki-edit.js) */
.wiki-imgedit {
  position: fixed;
  inset: 0;
  z-index: 5000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: min(4vw, 1.5rem);
  box-sizing: border-box;
}

.wiki-imgedit[hidden] {
  display: none !important;
}

.wiki-imgedit__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(5, 8, 12, 0.86);
}

.wiki-imgedit__panel {
  position: relative;
  z-index: 1;
  width: min(920px, 96vw);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--bg-elevated);
  box-shadow: 0 14px 70px rgba(0, 0, 0, 0.6);
  overflow: hidden;
}

.wiki-imgedit__head {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 0.9rem;
  border-bottom: 1px solid var(--border);
}

.wiki-imgedit__title {
  font-family: var(--font-nav);
  font-weight: 600;
}

.wiki-imgedit__close {
  margin-left: auto;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: transparent;
  color: var(--text);
  cursor: pointer;
  font-size: 1.35rem;
  line-height: 1;
}

.wiki-imgedit__close:hover {
  border-color: var(--accent);
  color: var(--accent);
}

.wiki-imgedit__body {
  display: grid;
  grid-template-columns: 1fr minmax(220px, 260px);
  gap: 1rem;
  padding: 1rem;
}

@media (max-width: 720px) {
  .wiki-imgedit__body {
    grid-template-columns: 1fr;
  }
}

.wiki-imgedit__preview {
  position: relative;
  /* Match infobox portrait frame (1830×2158); width drives size like .wiki-infobox-media. */
  width: min(100%, calc(min(62vh, 560px) * (1830 / 2158)));
  max-width: 100%;
  margin-inline: auto;
  aspect-ratio: 1830 / 2158;
  height: auto;
  border-radius: var(--radius);
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(0, 0, 0, 0.18);
  overflow: hidden;
  touch-action: none;
  user-select: none;
  cursor: grab;
}

.wiki-imgedit__preview.is-dragging {
  cursor: grabbing;
}

.wiki-imgedit__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  object-fit: cover;
  object-position: center center;
  transform-origin: center center;
  will-change: transform;
}

.wiki-imgedit__controls {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.wiki-imgedit__row {
  display: grid;
  grid-template-columns: 5.25rem 1fr;
  align-items: center;
  gap: 0.65rem;
  font-size: 0.9rem;
  color: var(--muted);
}

.wiki-imgedit__row input[type="range"] {
  width: 100%;
}

.wiki-imgedit__hint {
  font-size: 0.85rem;
  color: var(--muted);
  line-height: 1.35;
}

.wiki-imgedit__status {
  min-height: 1.2rem;
  font-size: 0.85rem;
  color: rgba(255, 255, 255, 0.85);
}

.wiki-imgedit__foot {
  display: flex;
  gap: 0.6rem;
  padding: 0.85rem 1rem 1rem;
  border-top: 1px solid var(--border);
}

.wiki-imgedit__btn {
  font-family: var(--font-nav);
  font-size: 0.9rem;
  padding: 0.45rem 0.9rem;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: transparent;
  color: var(--text);
  cursor: pointer;
}

.wiki-imgedit__btn:hover {
  border-color: var(--accent);
  color: var(--accent);
}

.wiki-imgedit__btn--primary {
  margin-left: auto;
  background: rgba(34, 211, 238, 0.15);
  border-color: var(--accent-dim);
  color: var(--accent);
}

/* Links panel (wiki-edit.js) */
.wiki-links {
  position: fixed;
  inset: 0;
  z-index: 5100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: min(4vw, 1.5rem);
  box-sizing: border-box;
}

.wiki-links[hidden] {
  display: none !important;
}

.wiki-links__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(5, 8, 12, 0.86);
}

.wiki-links__panel {
  position: relative;
  z-index: 1;
  width: min(860px, 96vw);
  max-height: min(82vh, 720px);
  display: flex;
  flex-direction: column;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--bg-elevated);
  box-shadow: 0 14px 70px rgba(0, 0, 0, 0.6);
  overflow: hidden;
}

.wiki-links__head {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 0.9rem;
  border-bottom: 1px solid var(--border);
}

.wiki-links__title {
  font-family: var(--font-nav);
  font-weight: 600;
}

.wiki-links__close {
  margin-left: auto;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: transparent;
  color: var(--text);
  cursor: pointer;
  font-size: 1.35rem;
  line-height: 1;
}

.wiki-links__close:hover {
  border-color: var(--accent);
  color: var(--accent);
}

.wiki-links__body {
  padding: 0.9rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  min-height: 0;
}

.wiki-links__search {
  width: 100%;
  padding: 0.55rem 0.7rem;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: rgba(0, 0, 0, 0.22);
  color: var(--text);
  font-family: var(--font-nav);
}

.wiki-links__list {
  min-height: 0;
  overflow: auto;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: var(--radius);
}

.wiki-links__row {
  display: grid;
  grid-template-columns: 1fr minmax(140px, 240px) auto;
  gap: 0.75rem;
  align-items: center;
  padding: 0.6rem 0.7rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.wiki-links__row:last-child {
  border-bottom: none;
}

.wiki-links__href {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.88);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.wiki-links__label {
  font-family: var(--font-nav);
  font-size: 0.9rem;
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.wiki-links__actions {
  display: inline-flex;
  gap: 0.5rem;
  align-items: center;
}

.wiki-links__apply {
  font-family: var(--font-nav);
  font-size: 0.9rem;
  padding: 0.35rem 0.7rem;
  border-radius: var(--radius);
  border: 1px solid rgba(34, 211, 238, 0.35);
  background: rgba(34, 211, 238, 0.12);
  color: var(--accent);
  cursor: pointer;
}

.wiki-links__apply:hover {
  border-color: rgba(34, 211, 238, 0.6);
  background: rgba(34, 211, 238, 0.16);
}

.wiki-links__copy {
  font-family: var(--font-nav);
  font-size: 0.9rem;
  padding: 0.35rem 0.8rem;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: transparent;
  color: var(--text);
  cursor: pointer;
}

.wiki-links__copy:hover {
  border-color: var(--accent);
  color: var(--accent);
}

.wiki-links__empty {
  padding: 0.8rem;
  color: var(--muted);
}

/* ---- Saved inline widths must not break narrow screens ----
   The editor's block resizer stores the width it was dragged to as an inline pixel
   value (e.g. style="width: 694px"), which is a desktop measurement. Below the wiki
   layout's single-column breakpoint those fixed widths made the whole page scroll
   sideways, so cap anything inside the article to the column it sits in. */
@media (max-width: 900px) {
  .wiki-page .wiki-main [style*="width"],
  .wiki-page .wiki-infobox [style*="width"] {
    max-width: 100% !important;
  }

  /* The infobox carries the largest of them, plus a free-drag offset and a saved
     min-height. All three are measured against the desktop two-column layout; in the
     single-column layout they widen the grid track and drag the card over the title. */
  .wiki-page .wiki-infobox {
    width: auto !important;
    min-height: 0 !important;
    transform: none !important;
  }

  .wiki-page .wiki-watch-now {
    transform: none !important;
  }

  /* The title and breadcrumb sit outside .wiki-main and pick up saved widths too. */
  .wiki-page .wiki-page-title,
  .wiki-page .wiki-breadcrumb {
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
  }

  .wiki-page .wiki-main img,
  .wiki-page .wiki-main video,
  .wiki-page .wiki-main table {
    max-width: 100%;
    height: auto;
  }
}