@layer gamedb.components {
  /* Starlight's markdown rhythm lives in @layer starlight.content and hands every node
     under .sl-markdown-content 16px of margin against its previous sibling, plus 4px
     between list items. Component subtrees are laid out with gap and with the explicit
     margins declared below, so that inherited rhythm double-spaces every grid and flex
     child, and in a flex row under the default stretch alignment it makes the single
     unmargined child taller than the rest of the row. This layer outranks
     starlight.content, and the zero specificity means any component rule that does
     declare a margin still wins, so containers keep owning their own spacing.
     Component roots now carry .not-content, Starlight's own opt-out, and every rule in
     starlight.content already excludes :where(.not-content *) while starlight.reset has
     zeroed the UA margins for all of them. Inside those subtrees this rule has nothing
     left to override, so it is held off them: what remains is the markup the wiki
     generator writes straight into the page, which carries no root to hang the opt-out
     on. Retire this rule when that markup can. */
  :where(.sl-markdown-content) :where([class^="gdb-"], [class*=" gdb-"], [class^="mf-"], [class*=" mf-"]) *:not(:where(.not-content *)) { margin-block: 0; }

  .gamedb-identity-shell {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
  }

  .gamedb-submit-guide {
    display: inline-flex;
    min-block-size: 2.25rem;
    align-items: center;
    justify-content: center;
    padding-inline: 0.8rem;
    border: 1px solid var(--gdb-color-accent, currentColor);
    border-radius: 999px;
    background: var(--gdb-color-accent, transparent);
    color: var(--gdb-color-surface, inherit) !important;
    font-size: 0.82rem;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
  }

  .gamedb-submit-guide:focus-visible {
    outline: 3px solid var(--gdb-color-focus, currentColor);
    outline-offset: 3px;
  }

  @media (max-width: 40rem) {
    .gamedb-identity-shell {
      min-inline-size: 0;
    }

    .gamedb-identity-shell > .gamedb-identity {
      display: none !important;
    }
  }

  :where([class^="gdb-"], [class*=" gdb-"]) {
    box-sizing: border-box;
    font-family: var(--gdb-font-body);
  }

  :where([class^="gdb-"], [class*=" gdb-"]) :where(a, button, input, select, textarea) {
    font: inherit;
  }

  :where([class^="gdb-"], [class*=" gdb-"]) a {
    color: var(--gdb-color-accent);
    text-underline-offset: 0.18em;
  }

  :where([class^="gdb-"], [class*=" gdb-"]) :focus-visible {
    outline: 3px solid var(--gdb-color-focus);
    outline-offset: 3px;
  }

  .gdb-visually-hidden {
    position: absolute !important;
    inline-size: 1px !important;
    block-size: 1px !important;
    overflow: hidden !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
  }

  .gdb-skip-link {
    position: fixed;
    inset: var(--gdb-space-3) auto auto var(--gdb-space-3);
    z-index: 1000;
    padding: var(--gdb-space-3) var(--gdb-space-4);
    border-radius: var(--gdb-radius-sm);
    background: var(--gdb-color-text);
    color: var(--gdb-color-surface);
    font-weight: 700;
    transform: translateY(calc(-100% - 2rem));
    transition: transform var(--gdb-motion-fast) ease;
  }

  .gdb-skip-link:focus { transform: translateY(0); }

  .gdb-header {
    position: relative;
    z-index: 40;
    display: grid;
    grid-template-columns: auto minmax(10rem, 1fr) auto;
    gap: var(--gdb-space-4);
    align-items: center;
    min-block-size: 4.25rem;
    padding: var(--gdb-space-3) max(var(--gdb-space-4), calc((100% - var(--gdb-content-width)) / 2));
    border-block-end: 1px solid var(--gdb-color-border);
    background: var(--gdb-color-surface);
    color: var(--gdb-color-text);
    box-shadow: var(--gdb-shadow-sm);
  }

  .gdb-header--compact { min-block-size: 3.5rem; padding-block: var(--gdb-space-2); }
  .gdb-header__brand a { color: var(--gdb-color-text); font-size: 1.05rem; font-weight: 800; text-decoration: none; }
  .gdb-header__navigation ul,
  .gdb-footer ul,
  .gdb-sidebar ul,
  .gdb-toc ol,
  .gdb-breadcrumbs ol,
  .gdb-tag-list,
  .gdb-search__results,
  .gdb-provenance ul,
  .gdb-relationship-section ul {
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .gdb-header__navigation ul { display: flex; gap: var(--gdb-space-4); align-items: center; }
  .gdb-header__navigation a { color: var(--gdb-color-text-muted); font-size: 0.9rem; font-weight: 650; text-decoration: none; }
  .gdb-header__navigation a:hover,
  .gdb-header__navigation a[aria-current="page"] { color: var(--gdb-color-accent); }
  .gdb-header__actions { display: flex; gap: var(--gdb-space-3); align-items: center; justify-content: end; }
  .gdb-header__search,
  .gdb-header__menu {
    min-block-size: 2.5rem;
    border: 1px solid var(--gdb-color-border);
    border-radius: var(--gdb-radius-sm);
    background: var(--gdb-color-canvas);
    color: var(--gdb-color-text);
    cursor: pointer;
  }
  .gdb-header__search { display: flex; gap: var(--gdb-space-4); align-items: center; padding-inline: var(--gdb-space-3); text-decoration: none; }
  .gdb-header__search kbd { color: var(--gdb-color-text-muted); font-family: var(--gdb-font-mono); font-size: 0.75rem; }
  .gdb-header__menu { display: none; inline-size: 2.5rem; padding: 0.65rem; }
  .gdb-header__menu span { display: block; block-size: 2px; margin-block: 0.22rem; background: currentColor; }

  .gdb-sidebar {
    inline-size: var(--gdb-sidebar-width);
    padding: var(--gdb-space-4);
    border-inline-end: 1px solid var(--gdb-color-border);
    background: var(--gdb-color-surface);
    color: var(--gdb-color-text);
  }
  .gdb-sidebar__header { display: flex; justify-content: space-between; align-items: center; gap: var(--gdb-space-3); }
  .gdb-sidebar__header h2 { margin: 0; font-size: 0.85rem; letter-spacing: 0.04em; text-transform: uppercase; }
  .gdb-sidebar__header button { display: none; }
  .gdb-sidebar__group { margin-block: var(--gdb-space-5); }
  .gdb-sidebar__group h3 { margin: 0 0 var(--gdb-space-2); color: var(--gdb-color-text-muted); font-size: 0.75rem; letter-spacing: 0.05em; text-transform: uppercase; }
  .gdb-sidebar li + li { margin-block-start: var(--gdb-space-1); }
  .gdb-sidebar a { display: flex; justify-content: space-between; gap: var(--gdb-space-2); padding: 0.55rem 0.65rem; border-radius: var(--gdb-radius-sm); color: var(--gdb-color-text); text-decoration: none; }
  .gdb-sidebar a:hover,
  .gdb-sidebar a[aria-current="page"] { background: var(--gdb-color-accent-soft); color: var(--gdb-color-accent-strong); }
  .gdb-sidebar--compact { inline-size: min(14rem, 100%); padding: var(--gdb-space-3); }
  .gdb-sidebar--compact .gdb-sidebar__group { margin-block: var(--gdb-space-4); }
  .gdb-sidebar--compact a { padding: 0.4rem 0.5rem; font-size: 0.85rem; }
  .gdb-count { color: var(--gdb-color-text-muted); font-variant-numeric: tabular-nums; }
  .gdb-sidebar-scrim { display: none; }

  .gdb-breadcrumbs { color: var(--gdb-color-text-muted); font-size: 0.85rem; }
  .gdb-breadcrumbs ol { display: flex; flex-wrap: wrap; gap: var(--gdb-space-2); align-items: center; }
  .gdb-breadcrumbs li:not(:last-child)::after { margin-inline-start: var(--gdb-space-2); color: var(--gdb-color-border-strong); content: "/"; }

  .gdb-toc { padding-inline-start: var(--gdb-space-4); border-inline-start: 1px solid var(--gdb-color-border); color: var(--gdb-color-text); }
  .gdb-toc h2 { margin: 0 0 var(--gdb-space-3); font-size: 0.85rem; }
  .gdb-toc li { margin-block: var(--gdb-space-2); }
  .gdb-toc li[data-depth="3"] { padding-inline-start: var(--gdb-space-3); }
  .gdb-toc li[data-depth="4"], .gdb-toc li[data-depth="5"], .gdb-toc li[data-depth="6"] { padding-inline-start: var(--gdb-space-5); }
  .gdb-toc a { color: var(--gdb-color-text-muted); font-size: 0.85rem; text-decoration: none; }
  .gdb-toc a[aria-current="location"] { color: var(--gdb-color-accent); font-weight: 700; }
  .gdb-toc--compact { padding-inline-start: var(--gdb-space-3); }
  .gdb-toc--compact h2 { margin-block-end: var(--gdb-space-2); font-size: 0.78rem; }
  .gdb-toc--compact li { margin-block: var(--gdb-space-1); }
  .gdb-toc--compact a { font-size: 0.78rem; }

  .gdb-footer {
    display: grid;
    grid-template-columns: minmax(12rem, 1fr) minmax(20rem, 2fr);
    gap: var(--gdb-space-6);
    padding: var(--gdb-space-7) max(var(--gdb-space-4), calc((100% - var(--gdb-content-width)) / 2));
    border-block-start: 1px solid var(--gdb-color-border);
    background: var(--gdb-color-surface);
    color: var(--gdb-color-text);
  }
  .gdb-footer--compact { padding-block: var(--gdb-space-5); }
  .gdb-footer__identity > a { color: var(--gdb-color-text); font-size: 1.05rem; font-weight: 800; text-decoration: none; }
  .gdb-footer__identity p, .gdb-footer__legal { color: var(--gdb-color-text-muted); font-size: 0.85rem; }
  .gdb-footer__navigation { display: grid; grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr)); gap: var(--gdb-space-5); }
  .gdb-footer__navigation h2 { margin: 0 0 var(--gdb-space-2); font-size: 0.8rem; }
  .gdb-footer__navigation li { margin-block: var(--gdb-space-2); }
  .gdb-footer__navigation a { color: var(--gdb-color-text-muted); font-size: 0.85rem; }
  .gdb-footer__legal { grid-column: 1 / -1; margin: 0; padding-block-start: var(--gdb-space-4); border-block-start: 1px solid var(--gdb-color-border); }

  .gdb-search {
    inline-size: min(44rem, calc(100% - 2rem));
    max-block-size: min(44rem, calc(100dvh - 2rem));
    margin: auto;
    padding: 0;
    border: 1px solid var(--gdb-color-border-strong);
    border-radius: var(--gdb-radius-lg);
    background: var(--gdb-color-surface-raised);
    color: var(--gdb-color-text);
    box-shadow: var(--gdb-shadow-md);
  }
  .gdb-search::backdrop { background: rgb(8 15 24 / 62%); }
  .gdb-search__surface { display: grid; grid-template-rows: auto auto auto minmax(0, 1fr); max-block-size: inherit; }
  .gdb-search header { display: flex; justify-content: space-between; align-items: center; padding: var(--gdb-space-4) var(--gdb-space-5); border-block-end: 1px solid var(--gdb-color-border); }
  .gdb-search h2 { margin: 0; font-size: 1rem; }
  .gdb-search header button { border: 0; background: transparent; color: var(--gdb-color-text-muted); cursor: pointer; }
  .gdb-search__field { display: block; padding: var(--gdb-space-4) var(--gdb-space-5); }
  .gdb-search__field input { inline-size: 100%; min-block-size: 3rem; padding-inline: var(--gdb-space-4); border: 1px solid var(--gdb-color-border-strong); border-radius: var(--gdb-radius-md); background: var(--gdb-color-canvas); color: var(--gdb-color-text); font-size: 1rem; }
  .gdb-search__results { overflow: auto; padding: 0 var(--gdb-space-3) var(--gdb-space-4); }
  .gdb-search__results li { border-radius: var(--gdb-radius-md); }
  .gdb-search__results li[aria-selected="true"] { background: var(--gdb-color-accent-soft); }
  .gdb-search__results a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0 var(--gdb-space-4); padding: var(--gdb-space-3) var(--gdb-space-4); color: var(--gdb-color-text); text-decoration: none; }
  .gdb-search__results a span { color: var(--gdb-color-text-muted); font-size: 0.8rem; }
  .gdb-search__results a small { grid-column: 1 / -1; overflow: hidden; color: var(--gdb-color-text-muted); text-overflow: ellipsis; white-space: nowrap; }
  .gdb-search__empty { padding: var(--gdb-space-6); color: var(--gdb-color-text-muted); text-align: center; }
  .gdb-search-trigger { display: inline-flex; align-items: center; min-block-size: 2.5rem; padding-inline: var(--gdb-space-3); border: 1px solid var(--gdb-color-border); border-radius: var(--gdb-radius-sm); background: var(--gdb-color-canvas); color: var(--gdb-color-text); font-weight: 650; text-decoration: none; }

  .gdb-catalogue-toolbar {
    display: grid;
    gap: var(--gdb-space-3);
    padding: var(--gdb-space-4);
    border: 1px solid var(--gdb-color-border);
    border-radius: var(--gdb-radius-lg);
    background: var(--gdb-color-surface);
    color: var(--gdb-color-text);
  }
  /* A flex line, not a fixed grid template. The template was sized for the widest hub in the fleet
     and every narrower one paid for the tracks it could not fill: on a single-facet hub two empty
     columns sat between the search box and the reset. Here the search box takes whatever the row
     does not need, so a hub with one control looks like a hub with one control. */
  .gdb-catalogue-toolbar__controls { display: flex; flex-wrap: wrap; gap: var(--gdb-space-3); align-items: end; }
  .gdb-catalogue-toolbar__controls label { display: grid; flex: 0 1 11rem; gap: var(--gdb-space-1); min-inline-size: 0; color: var(--gdb-color-text-muted); font-size: 0.78rem; font-weight: 700; }
  .gdb-catalogue-toolbar__controls .gdb-catalogue-toolbar__query { flex: 1 1 16rem; }
  .gdb-catalogue-toolbar__controls :where(input, select, button) { min-block-size: 2.65rem; border: 1px solid var(--gdb-color-border-strong); border-radius: var(--gdb-radius-sm); background: var(--gdb-color-canvas); color: var(--gdb-color-text); }
  .gdb-catalogue-toolbar__controls :where(input, select) { inline-size: 100%; padding-inline: var(--gdb-space-3); }
  .gdb-catalogue-toolbar__controls button { padding-inline: var(--gdb-space-3); cursor: pointer; }
  /* Clearing a filter is an undo, not a filter. Boxed like the fields it undoes it read as a peer
     of the search box and took a whole column of the row from it. It is a quiet link-weight control
     pushed to the end of the row instead, always in the same place whatever controls a hub happens
     to render, and only visible while something is set. `visibility` keeps its space measured so
     the row never reflows around it, and still takes it out of the tab order while it has no job. */
  .gdb-catalogue-toolbar .gdb-catalogue-toolbar__reset {
    flex: none;
    margin-inline-start: auto;
    min-block-size: 2.25rem;
    border: 0;
    border-radius: var(--gdb-radius-sm);
    background: transparent;
    padding-inline: var(--gdb-space-2);
    color: var(--gdb-color-text-muted);
    font-size: 0.82rem;
    font-weight: 650;
    text-decoration: underline;
    text-underline-offset: 0.2em;
  }
  .gdb-catalogue-toolbar .gdb-catalogue-toolbar__reset:hover { color: var(--gdb-color-accent-strong); }
  .gdb-catalogue-toolbar:not([data-gamedb-catalogue-filtered="true"]) .gdb-catalogue-toolbar__reset { visibility: hidden; }
  .gdb-catalogue-toolbar__view { display: flex; flex: none; margin: 0; padding: 0; border: 0; }
  .gdb-catalogue-toolbar__view legend { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); }
  .gdb-catalogue-toolbar__view button { border-radius: 0; }
  .gdb-catalogue-toolbar__view button:first-of-type { border-radius: var(--gdb-radius-sm) 0 0 var(--gdb-radius-sm); }
  .gdb-catalogue-toolbar__view button:last-of-type { border-inline-start: 0; border-radius: 0 var(--gdb-radius-sm) var(--gdb-radius-sm) 0; }
  .gdb-catalogue-toolbar__view button[aria-pressed="true"] { background: var(--gdb-color-accent); color: var(--gdb-color-surface); }
  .gdb-catalogue-toolbar__count { margin: 0; color: var(--gdb-color-text-muted); font-size: 0.85rem; }
  .gdb-catalogue-toolbar__facets { display: grid; gap: var(--gdb-space-3); padding-block-start: var(--gdb-space-3); border-block-start: 1px solid var(--gdb-color-border); }
  .gdb-catalogue-toolbar--dense { gap: var(--gdb-space-2); padding: var(--gdb-space-3); }
  .gdb-catalogue-toolbar--dense .gdb-catalogue-toolbar__controls :where(input, select, button) { min-block-size: 2.25rem; }
  .gdb-catalogue-toolbar--dense .gdb-catalogue-toolbar__facets { gap: var(--gdb-space-2); padding-block-start: var(--gdb-space-2); }

  /* A facet is a group of checkboxes, because "any of these" is what it means and a row of boxes is
     what says so. The pills it replaces looked exactly like a set of radio buttons, which is why
     picking a second value never occurred to anyone: the control was telling the truth about the
     code and the code was wrong.
     The name sits beside the values rather than above them, so three facets do not spend three
     lines of a sticky toolbar naming themselves. */
  .gdb-facet { display: grid; grid-template-columns: minmax(0, 7.5rem) minmax(0, 1fr); gap: var(--gdb-space-2) var(--gdb-space-3); align-items: start; margin: 0; }
  .gdb-facet__header { display: flex; flex-wrap: wrap; gap: var(--gdb-space-2); align-items: baseline; min-block-size: 2rem; padding-block: 0.35rem; }
  .gdb-facet__label { color: var(--gdb-color-text-muted); font-size: 0.75rem; font-weight: 800; letter-spacing: 0.02em; }
  .gdb-facet__clear { border: 0; background: transparent; padding: 0; color: var(--gdb-color-accent); font-size: 0.72rem; font-weight: 650; text-decoration: underline; text-underline-offset: 0.2em; cursor: pointer; }
  /* Both the per-facet Clear and a value filtered out of a long list are hidden with the attribute,
     and every `display` in this block is more specific than a bare `[hidden]` would be. */
  .gdb-facet [hidden] { display: none !important; }
  .gdb-facet__options { display: flex; flex-wrap: wrap; gap: var(--gdb-space-2); min-inline-size: 0; }
  /* Square-cornered and boxed, deliberately unlike the pill: a pill is a token that is either on or
     off, a box with a checkbox in it is one of several a reader may take. */
  .gdb-facet__option {
    display: inline-flex;
    gap: var(--gdb-space-2);
    align-items: center;
    min-block-size: 2.3rem;
    min-inline-size: 0;
    margin: 0;
    padding-inline: var(--gdb-space-2);
    border: 1px solid var(--gdb-color-border-strong);
    border-radius: var(--gdb-radius-sm);
    background: var(--gdb-color-canvas);
    color: var(--gdb-color-text);
    font-size: 0.85rem;
    font-weight: 600;
    line-height: 1.25;
    cursor: pointer;
  }
  .gdb-facet__option input { flex: none; inline-size: 0.95rem; block-size: 0.95rem; margin: 0; accent-color: var(--gdb-color-accent); }
  /* The outline belongs on the whole box: three pixels of it around a fifteen-pixel checkbox sits
     on top of the label beside it and reads as a rendering fault rather than as focus. */
  .gdb-facet__option input:focus-visible { outline: none; }
  .gdb-facet__option:has(input:focus-visible) { outline: 3px solid var(--gdb-color-focus); outline-offset: 2px; }
  .gdb-facet__name { min-inline-size: 0; overflow-wrap: anywhere; }
  .gdb-facet__count { color: var(--gdb-color-text-muted); font-size: 0.75rem; font-weight: 700; font-variant-numeric: tabular-nums; }
  .gdb-facet__option:has(input:checked) { border-color: var(--gdb-color-accent); background: var(--gdb-color-accent-soft); color: var(--gdb-color-accent-strong); box-shadow: inset 0 0 0 1px var(--gdb-color-accent); }
  .gdb-facet__option:has(input:checked) .gdb-facet__count { color: var(--gdb-color-accent-strong); }
  /* A value that would leave nothing is dimmed and disabled rather than clickable and silently
     empty: the dead end is visible before the click, not after it. A ticked value is never
     disabled, because whatever got the reader into a state has to get them out of it. */
  .gdb-facet__option:has(input:disabled) { border-color: var(--gdb-color-border); background: transparent; color: var(--gdb-color-text-muted); opacity: 0.55; cursor: not-allowed; text-decoration: line-through; }
  .gdb-facet__option:has(input:disabled) .gdb-facet__count { text-decoration: none; }

  /* Past eight values a rail stops being scannable and starts being the page again, so the group
     folds into a disclosure over a list that scrolls in its own box. The summary carries the
     facet's name and how much of it is set, so a closed group still says whether it is filtering. */
  .gdb-facet--long { display: block; }
  /* The UA marker is dropped rather than laid out: a `display` other than `list-item` removes it in
     some engines and keeps it in others, so a summary that is a flex row has to draw its own. */
  .gdb-facet--long > .gdb-facet__header { display: flex; gap: var(--gdb-space-2); align-items: center; padding: var(--gdb-space-2) var(--gdb-space-3); border: 1px solid var(--gdb-color-border-strong); border-radius: var(--gdb-radius-sm); background: var(--gdb-color-canvas); list-style: none; cursor: pointer; }
  .gdb-facet--long > .gdb-facet__header > .gdb-facet__state { margin-inline-start: auto; }
  .gdb-facet--long > .gdb-facet__header::-webkit-details-marker { display: none; }
  .gdb-facet--long > .gdb-facet__header::after { flex: none; color: var(--gdb-color-text-muted); content: "\25BE"; transition: transform var(--gdb-motion-fast) ease; }
  .gdb-facet--long[open] > .gdb-facet__header::after { transform: rotate(180deg); }
  .gdb-facet--long[open] > .gdb-facet__header { border-end-start-radius: 0; border-end-end-radius: 0; }
  .gdb-facet__state { color: var(--gdb-color-text-muted); font-size: 0.75rem; font-weight: 700; font-variant-numeric: tabular-nums; }
  .gdb-facet__state[data-gamedb-catalogue-facet-active="true"] { color: var(--gdb-color-accent-strong); }
  .gdb-facet__panel { display: grid; gap: var(--gdb-space-2); padding: var(--gdb-space-2); border: 1px solid var(--gdb-color-border-strong); border-block-start: 0; border-end-start-radius: var(--gdb-radius-sm); border-end-end-radius: var(--gdb-radius-sm); }
  .gdb-facet__find input { inline-size: 100%; min-block-size: 2.25rem; padding-inline: var(--gdb-space-2); border: 1px solid var(--gdb-color-border); border-radius: var(--gdb-radius-sm); background: var(--gdb-color-surface); color: var(--gdb-color-text); }
  /* Three pixels of padding so the focus outline of a box at the edge of the scroller is not
     clipped by the scroller itself. */
  .gdb-facet__options--list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 13rem), 1fr)); max-block-size: 14rem; overflow-y: auto; overscroll-behavior: contain; padding: 3px; }
  .gdb-facet__options--list .gdb-facet__option { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; inline-size: 100%; }
  .gdb-facet__panel .gdb-facet__clear { justify-self: start; }

  .gdb-catalogue-grid { margin-block: var(--gdb-space-5); }
  .gdb-catalogue-grid__items { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); gap: var(--gdb-space-4); align-items: stretch; }
  .gdb-catalogue-grid__items > * { height: 100%; margin: 0; }
  .gdb-catalogue-grid--dense .gdb-catalogue-grid__items { grid-template-columns: repeat(auto-fill, minmax(min(100%, 12rem), 1fr)); gap: var(--gdb-space-3); }
  .gdb-catalogue-grid[data-view="list"] .gdb-catalogue-grid__items { grid-template-columns: 1fr; }
  [data-gamedb-catalogue-item][hidden] { display: none !important; }

  .gdb-table-browser { display: grid; gap: var(--gdb-space-3); margin-block: var(--gdb-space-5) var(--gdb-space-3); padding: var(--gdb-space-4); border: 1px solid var(--gdb-color-border); border-radius: var(--gdb-radius-md); background: var(--gdb-color-surface); color: var(--gdb-color-text); box-shadow: var(--gdb-shadow-sm); }
  .gdb-table-browser__controls { display: grid; grid-template-columns: minmax(14rem, 2fr) repeat(auto-fit, minmax(9rem, 1fr)); gap: var(--gdb-space-3); align-items: end; margin: 0; }
  .gdb-table-browser__controls label { display: grid; gap: var(--gdb-space-1); margin: 0; color: var(--gdb-color-text-muted); font-size: 0.76rem; font-weight: 750; }
  .gdb-table-browser__controls :where(input, select, button) { inline-size: 100%; min-block-size: 2.65rem; margin: 0; padding-inline: var(--gdb-space-3); border: 1px solid var(--gdb-color-border-strong); border-radius: var(--gdb-radius-sm); background: var(--gdb-color-canvas); color: var(--gdb-color-text); }
  .gdb-table-browser__controls button { cursor: pointer; }
  .gdb-table-browser__count { grid-column: 1 / -1; margin: 0; color: var(--gdb-color-text-muted); font-size: 0.82rem; font-variant-numeric: tabular-nums; }
  /* The same facet groups the catalogue toolbar renders, from the same builder. What was here
     before was a rail of pills over the first facet's select: two controls for one piece of state,
     both single-value, and the rail scrolled sideways on a phone to hide how many values it had. */
  .gdb-table-browser__facets { display: grid; gap: var(--gdb-space-3); padding-block-start: var(--gdb-space-3); border-block-start: 1px solid var(--gdb-color-border); }
  .gdb-table-browser__empty { margin: 0; padding: var(--gdb-space-4); border: 1px dashed var(--gdb-color-border-strong); color: var(--gdb-color-text-muted); text-align: center; }
  table[data-gamedb-table-enhanced] tr[hidden] { display: none !important; }

  .gdb-family-card,
  .gdb-entity-card,
  .gdb-relationship-card {
    height: 100%;
    margin: 0;
    min-inline-size: 0;
    overflow: hidden;
    border: 1px solid var(--gdb-color-border);
    border-radius: var(--gdb-radius-md);
    background: var(--gdb-color-surface);
    color: var(--gdb-color-text);
    box-shadow: var(--gdb-shadow-sm);
  }
  .gdb-family-card > a { display: grid; grid-template-columns: 4rem minmax(0, 1fr); gap: var(--gdb-space-3); height: 100%; padding: var(--gdb-space-4); color: inherit; text-decoration: none; }
  .gdb-family-card__media,
  .gdb-entity-card__media { display: grid; overflow: hidden; place-items: center; background: var(--gdb-color-accent-soft); color: var(--gdb-color-accent-strong); font-weight: 800; }
  .gdb-family-card__media { inline-size: 4rem; block-size: 4rem; border-radius: var(--gdb-radius-sm); }
  /* The portrait links to the record now. The anchor has to fill the media cell, or the image
     inside it sizes to an inline box and collapses; centring keeps the initials fallback where
     the grid put it before the anchor existed. */
  .gdb-entity-card__media a { display: grid; inline-size: 100%; block-size: 100%; place-items: center; color: inherit; text-decoration: none; }
  .gdb-family-card__media img,
  .gdb-entity-card__media img { inline-size: 100%; block-size: 100%; object-fit: cover; }
  .gdb-family-card h2 { margin: 0; font-size: 1rem; }
  .gdb-family-card p { margin: var(--gdb-space-1) 0; color: var(--gdb-color-text-muted); font-size: 0.82rem; }
  .gdb-family-card span { color: var(--gdb-color-text-muted); font-size: 0.78rem; }
  .gdb-family-card--dense > a { grid-template-columns: 3rem minmax(0, 1fr); gap: var(--gdb-space-2); padding: var(--gdb-space-3); }
  .gdb-family-card--dense .gdb-family-card__media { inline-size: 3rem; block-size: 3rem; }
  .gdb-family-card--dense p { font-size: 0.78rem; }

  .gdb-entity-card { display: grid; grid-template-rows: 9rem minmax(0, 1fr); }
  .gdb-entity-card--dense { grid-template-rows: 6.5rem minmax(0, 1fr); }
  .gdb-entity-card__body { display: flex; flex-direction: column; padding: var(--gdb-space-4); }
  .gdb-entity-card__family,
  .gdb-entity-row__identity span,
  .gdb-relationship-card__kind,
  .gdb-entity-hero__family { color: var(--gdb-color-text-muted); font-size: 0.72rem; font-weight: 750; letter-spacing: 0.045em; text-transform: uppercase; }
  .gdb-entity-card h2, .gdb-entity-card h3, .gdb-entity-card h4 { margin: var(--gdb-space-1) 0 var(--gdb-space-2); font-size: 1.05rem; line-height: 1.25; }
  .gdb-entity-card h2 a, .gdb-entity-card h3 a, .gdb-entity-card h4 a { color: var(--gdb-color-text); text-decoration: none; }
  .gdb-entity-card p { margin: 0 0 var(--gdb-space-3); color: var(--gdb-color-text-muted); font-size: 0.88rem; line-height: 1.55; }
  .gdb-entity-card dl,
  .gdb-relationship-card dl,
  .gdb-infobox dl,
  .gdb-entity-row dl { display: grid; gap: var(--gdb-space-2); margin: 0; }
  .gdb-entity-card dl > div,
  .gdb-relationship-card dl > div,
  .gdb-infobox dl > div,
  .gdb-entity-row dl > div { display: flex; justify-content: space-between; gap: var(--gdb-space-3); }
  :where(.gdb-entity-card, .gdb-relationship-card, .gdb-infobox, .gdb-entity-row) dt { color: var(--gdb-color-text-muted); font-size: 0.78rem; }
  :where(.gdb-entity-card, .gdb-relationship-card, .gdb-infobox, .gdb-entity-row) dd { margin: 0; font-size: 0.82rem; font-weight: 650; text-align: end; }
  .gdb-entity-card footer { display: flex; gap: var(--gdb-space-2); align-items: end; justify-content: space-between; margin-block-start: auto; padding-block-start: var(--gdb-space-4); }
  .gdb-tag-list { display: flex; flex-wrap: wrap; gap: var(--gdb-space-1); }
  .gdb-tag-list li { padding: 0.15rem 0.4rem; border: 1px solid var(--gdb-color-border); border-radius: 999px; color: var(--gdb-color-text-muted); font-size: 0.7rem; }
  .gdb-relationship-count { color: var(--gdb-color-text-muted); font-size: 0.75rem; white-space: nowrap; }

  .gdb-entity-row { display: grid; grid-template-columns: minmax(12rem, 1.4fr) minmax(12rem, 2fr) minmax(12rem, 1fr) auto; gap: var(--gdb-space-4); align-items: center; padding: var(--gdb-space-3) var(--gdb-space-4); border-block-end: 1px solid var(--gdb-color-border); color: var(--gdb-color-text); }
  .gdb-entity-row__identity { display: flex; gap: var(--gdb-space-3); align-items: center; min-inline-size: 0; }
  .gdb-entity-row__identity img { inline-size: 3rem; block-size: 3rem; border-radius: var(--gdb-radius-sm); object-fit: cover; }
  .gdb-entity-row h2, .gdb-entity-row h3, .gdb-entity-row h4 { margin: 0; font-size: 0.95rem; }
  .gdb-entity-row p { margin: 0; overflow: hidden; color: var(--gdb-color-text-muted); font-size: 0.82rem; text-overflow: ellipsis; white-space: nowrap; }
  .gdb-entity-row dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gdb-entity-row dl > div { display: grid; gap: 0; }
  .gdb-entity-row dd { text-align: start; }

  .gdb-relationship-card { padding: var(--gdb-space-4); }
  .gdb-relationship-card h3, .gdb-relationship-card h4, .gdb-relationship-card h5 { margin: var(--gdb-space-1) 0; font-size: 1rem; }
  .gdb-relationship-card p { color: var(--gdb-color-text-muted); font-size: 0.85rem; line-height: 1.5; }
  .gdb-relationship-card--grouped { border-inline-start: 3px solid var(--gdb-color-accent); }

  .gdb-entity-hero { display: grid; grid-template-columns: minmax(12rem, 20rem) minmax(0, 1fr); gap: clamp(var(--gdb-space-5), 5vw, var(--gdb-space-7)); align-items: center; color: var(--gdb-color-text); }
  .gdb-entity-hero--compact { grid-template-columns: 7rem minmax(0, 1fr); gap: var(--gdb-space-4); }
  .gdb-entity-hero--no-media,
  .gdb-entity-hero--compact.gdb-entity-hero--no-media { grid-template-columns: minmax(0, 1fr); }
  .gdb-entity-hero__media { overflow: hidden; aspect-ratio: 4 / 3; border: 1px solid var(--gdb-color-border); border-radius: var(--gdb-radius-lg); background: var(--gdb-color-canvas); }
  .gdb-entity-hero__media img { inline-size: 100%; block-size: 100%; object-fit: contain; }
  .gdb-entity-hero h1 { margin: var(--gdb-space-2) 0; font-size: clamp(2rem, 5vw, 3.75rem); line-height: 1.04; }
  .gdb-entity-hero--compact h1 { font-size: clamp(1.7rem, 4vw, 2.5rem); }
  .gdb-entity-hero__body > p { max-inline-size: 48rem; color: var(--gdb-color-text-muted); font-size: 1.05rem; line-height: 1.65; }
  .gdb-entity-hero__meta, .gdb-entity-hero__actions { display: flex; flex-wrap: wrap; gap: var(--gdb-space-3); align-items: center; margin-block-start: var(--gdb-space-4); }
  .gdb-entity-state { color: var(--gdb-color-warning) !important; font-size: 0.82rem !important; font-weight: 700; }

  .gdb-infobox,
  .gdb-provenance,
  .gdb-state-panel { padding: var(--gdb-space-5); border: 1px solid var(--gdb-color-border); border-radius: var(--gdb-radius-md); background: var(--gdb-color-surface); color: var(--gdb-color-text); }
  .gdb-infobox h2, .gdb-provenance h2 { margin: 0 0 var(--gdb-space-4); font-size: 1rem; }
  .gdb-infobox--dense { padding: var(--gdb-space-4); }
  .gdb-infobox dl > div { padding-block: var(--gdb-space-2); border-block-end: 1px solid var(--gdb-color-border); }

  .gdb-relationship-section { color: var(--gdb-color-text); }
  .gdb-relationship-section > header { display: flex; justify-content: space-between; gap: var(--gdb-space-4); align-items: baseline; padding-block-end: var(--gdb-space-3); border-block-end: 1px solid var(--gdb-color-border); }
  .gdb-relationship-section > header h2 { margin: 0; }
  .gdb-relationship-section > header span { color: var(--gdb-color-text-muted); font-variant-numeric: tabular-nums; }
  .gdb-relationship-group { margin-block: var(--gdb-space-5); }
  .gdb-relationship-group h3 { font-size: 0.9rem; }
  .gdb-relationship-group li { display: grid; grid-template-columns: minmax(12rem, 1fr) minmax(0, 2fr); gap: var(--gdb-space-4); padding-block: var(--gdb-space-3); border-block-end: 1px solid var(--gdb-color-border); }
  .gdb-relationship-group li > div { display: flex; justify-content: space-between; gap: var(--gdb-space-3); }
  .gdb-relationship-group li p { margin: 0; color: var(--gdb-color-text-muted); font-size: 0.85rem; }

  .gdb-provenance { border-inline-start: 4px solid var(--gdb-color-accent); }
  .gdb-provenance--compact { padding: var(--gdb-space-4); }
  .gdb-provenance li { display: grid; grid-template-columns: minmax(10rem, 1fr) auto; gap: var(--gdb-space-1) var(--gdb-space-4); padding-block: var(--gdb-space-3); }
  .gdb-provenance li + li { border-block-start: 1px solid var(--gdb-color-border); }
  .gdb-provenance li > span, .gdb-provenance time { color: var(--gdb-color-text-muted); font-size: 0.78rem; }
  .gdb-provenance code, .gdb-provenance p { grid-column: 1 / -1; }
  .gdb-provenance code { overflow-wrap: anywhere; color: var(--gdb-color-text-muted); font-family: var(--gdb-font-mono); font-size: 0.78rem; }
  .gdb-provenance p { margin: 0; font-size: 0.85rem; }

  .gdb-data-table { max-inline-size: 100%; color: var(--gdb-color-text); }
  .gdb-data-table--scroll { overflow-x: auto; overscroll-behavior-inline: contain; }
  .gdb-data-table table { inline-size: 100%; border-collapse: collapse; background: var(--gdb-color-surface); font-variant-numeric: tabular-nums; }
  .gdb-data-table caption { padding: var(--gdb-space-3); color: var(--gdb-color-text); font-weight: 750; text-align: start; }
  .gdb-data-table :where(th, td) { padding: 0.7rem var(--gdb-space-3); border-block-end: 1px solid var(--gdb-color-border); text-align: start; vertical-align: top; }
  .gdb-data-table thead th { background: var(--gdb-color-canvas); color: var(--gdb-color-text-muted); font-size: 0.75rem; letter-spacing: 0.03em; text-transform: uppercase; }
  .gdb-data-table tbody th { font-weight: 700; }
  .gdb-data-table [data-align="center"] { text-align: center; }
  .gdb-data-table [data-align="end"] { text-align: end; }

  .gdb-state-panel { display: grid; justify-items: start; max-inline-size: 36rem; }
  .gdb-state-panel__mark { inline-size: 2.5rem; block-size: 0.3rem; margin-block-end: var(--gdb-space-4); border-radius: 999px; background: var(--gdb-color-accent); }
  .gdb-state-panel--error .gdb-state-panel__mark { background: var(--gdb-color-danger); }
  .gdb-state-panel--loading .gdb-state-panel__mark { animation: gdb-state-pulse 1.2s ease-in-out infinite alternate; }
  .gdb-state-panel h2 { margin: 0; font-size: 1.2rem; }
  .gdb-state-panel p, .gdb-state-inline { color: var(--gdb-color-text-muted); }
  .gdb-button { display: inline-flex; min-block-size: 2.5rem; align-items: center; margin-block-start: var(--gdb-space-3); padding-inline: var(--gdb-space-4); border: 1px solid var(--gdb-color-accent); border-radius: var(--gdb-radius-sm); background: var(--gdb-color-accent); color: var(--gdb-color-surface) !important; font-weight: 700; text-decoration: none; cursor: pointer; }

  .gdb-markdown-content { max-inline-size: var(--gdb-reading-width); color: var(--gdb-color-text); line-height: 1.72; }
  .gdb-markdown-content--wide { max-inline-size: var(--gdb-content-width); }
  .gdb-markdown-content > header { margin-block-end: var(--gdb-space-6); }
  .gdb-markdown-content > header h1 { margin: 0 0 var(--gdb-space-3); font-size: clamp(2rem, 5vw, 3.4rem); line-height: 1.08; }
  .gdb-markdown-content > header p { color: var(--gdb-color-text-muted); font-size: 1.05rem; }
  .gdb-markdown-content__body :where(h2, h3, h4) { scroll-margin-block-start: 5rem; line-height: 1.2; }
  .gdb-markdown-content__body h2 { margin-block: var(--gdb-space-7) var(--gdb-space-3); }
  .gdb-markdown-content__body :where(img, video) { max-inline-size: 100%; block-size: auto; border-radius: var(--gdb-radius-md); }
  .gdb-markdown-content__body code { font-family: var(--gdb-font-mono); }
  .gdb-markdown-content__aside,
  .gdb-markdown-content__actions { margin-block-start: var(--gdb-space-6); padding-block-start: var(--gdb-space-4); border-block-start: 1px solid var(--gdb-color-border); }

  .gdb-editable-region {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--gdb-space-3);
    align-items: start;
    padding: var(--gdb-space-3);
    border: 1px solid transparent;
    border-radius: var(--gdb-radius-sm);
    color: var(--gdb-color-text);
  }
  .gdb-editable-region:hover,
  .gdb-editable-region:focus-within { border-color: var(--gdb-color-border-strong); background: var(--gdb-color-accent-soft); }
  .gdb-editable-region--toolbar { align-items: center; border-color: var(--gdb-color-border); background: var(--gdb-color-surface); }
  .gdb-editable-region__action,
  .gdb-editable-region__unavailable { display: inline-flex; min-block-size: 2.5rem; align-items: center; padding-inline: var(--gdb-space-3); border: 1px solid var(--gdb-color-border-strong); border-radius: var(--gdb-radius-sm); background: var(--gdb-color-surface); font-size: 0.78rem; font-weight: 750; text-decoration: none; }
  .gdb-editable-region__unavailable { color: var(--gdb-color-text-muted); }
  .gdb-editable-region.is-disabled { opacity: 0.72; }

  .gdb-correction-workbench {
    container-type: inline-size;
    overflow: hidden;
    border: 1px solid var(--gdb-color-border);
    border-radius: var(--gdb-radius-md);
    background: var(--gdb-color-surface);
    color: var(--gdb-color-text);
    box-shadow: var(--gdb-shadow-sm);
  }
  .gdb-correction-workbench :where(h2, h3, h4, p, pre) { margin-block-start: 0; }
  .gdb-correction-workbench__heading { display: flex; justify-content: space-between; gap: var(--gdb-space-5); align-items: start; padding: var(--gdb-space-5); border-block-end: 1px solid var(--gdb-color-border); background: var(--gdb-color-canvas); }
  .gdb-correction-workbench__heading h2 { margin-block-end: var(--gdb-space-2); font-size: clamp(1.45rem, 3vw, 2.15rem); line-height: 1.08; }
  .gdb-correction-workbench__heading > div > p:last-child { max-inline-size: 56rem; margin: 0; color: var(--gdb-color-text-muted); }
  .gdb-correction-workbench__eyebrow { margin-block-end: var(--gdb-space-2); color: var(--gdb-color-accent-strong); font-size: 0.72rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
  .gdb-correction-workbench__privacy { flex: none; padding: var(--gdb-space-2) var(--gdb-space-3); border: 1px solid var(--gdb-color-success); border-radius: 999px; color: var(--gdb-color-success); font-size: 0.75rem; font-weight: 750; }
  .gdb-correction-steps { display: grid; grid-template-columns: repeat(4, 1fr); border-block-end: 1px solid var(--gdb-color-border); background: var(--gdb-color-surface); }
  .gdb-correction-steps button { display: flex; min-block-size: 3.25rem; gap: var(--gdb-space-2); align-items: center; justify-content: center; border: 0; border-inline-end: 1px solid var(--gdb-color-border); background: transparent; color: var(--gdb-color-text-muted); font-size: 0.82rem; font-weight: 750; cursor: pointer; }
  .gdb-correction-steps button:last-child { border-inline-end: 0; }
  .gdb-correction-steps button[aria-current="step"] { background: var(--gdb-color-accent-soft); color: var(--gdb-color-accent-strong); }
  .gdb-correction-steps button span { display: grid; inline-size: 1.5rem; block-size: 1.5rem; place-items: center; border: 1px solid currentColor; border-radius: 50%; font-size: 0.7rem; }
  .gdb-correction-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(15rem, 19rem); }
  .gdb-correction-form__main { min-inline-size: 0; }
  .gdb-correction-stage { padding: var(--gdb-space-5); scroll-margin-block-start: var(--gdb-space-4); }
  .gdb-correction-stage + .gdb-correction-stage { border-block-start: 1px solid var(--gdb-color-border); }
  .gdb-correction-stage__heading { display: flex; gap: var(--gdb-space-3); margin-block-end: var(--gdb-space-4); }
  .gdb-correction-stage__heading > span { display: grid; flex: none; inline-size: 2rem; block-size: 2rem; place-items: center; border: 1px solid var(--gdb-color-border-strong); border-radius: 50%; color: var(--gdb-color-text-muted); font-family: var(--gdb-font-mono); font-size: 0.7rem; }
  .gdb-correction-stage__heading h3 { margin-block-end: var(--gdb-space-1); font-size: 1rem; }
  .gdb-correction-stage__heading p { margin: 0; color: var(--gdb-color-text-muted); font-size: 0.84rem; }
  .gdb-correction-targets,
  .gdb-correction-modes,
  .gdb-correction-attribution { margin: 0; padding: 0; border: 0; }
  .gdb-correction-targets { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gdb-space-2); }
  .gdb-correction-target { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--gdb-space-3); align-items: center; min-block-size: 3.5rem; padding: var(--gdb-space-3); border: 1px solid var(--gdb-color-border); border-radius: var(--gdb-radius-sm); background: var(--gdb-color-canvas); cursor: pointer; }
  .gdb-correction-target:has(input:checked) { border-color: var(--gdb-color-accent); background: var(--gdb-color-accent-soft); }
  .gdb-correction-target input,
  .gdb-correction-modes input,
  .gdb-correction-attribution input { inline-size: 1.1rem; block-size: 1.1rem; accent-color: var(--gdb-color-accent); }
  .gdb-correction-target span { min-inline-size: 0; }
  .gdb-correction-target :where(strong, small) { display: block; }
  .gdb-correction-target small { margin-block-start: 0.1rem; color: var(--gdb-color-text-muted); font-size: 0.72rem; }
  .gdb-correction-target code { overflow: hidden; max-inline-size: 10rem; color: var(--gdb-color-text-muted); font-family: var(--gdb-font-mono); font-size: 0.68rem; text-overflow: ellipsis; white-space: nowrap; }
  .gdb-correction-selection { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: var(--gdb-space-3); align-items: center; margin-block-end: var(--gdb-space-4); padding: var(--gdb-space-3); border-inline-start: 3px solid var(--gdb-color-accent); background: var(--gdb-color-accent-soft); }
  .gdb-correction-selection span,
  .gdb-correction-selection strong { display: block; }
  .gdb-correction-selection span { color: var(--gdb-color-text-muted); font-size: 0.7rem; text-transform: uppercase; }
  .gdb-correction-selection code { color: var(--gdb-color-text-muted); font-family: var(--gdb-font-mono); font-size: 0.74rem; }
  .gdb-correction-selection button { min-block-size: 2.5rem; border: 1px solid var(--gdb-color-border-strong); border-radius: var(--gdb-radius-sm); background: var(--gdb-color-surface); color: var(--gdb-color-accent-strong); cursor: pointer; }
  .gdb-correction-modes { display: flex; flex-wrap: wrap; gap: var(--gdb-space-2); margin-block-end: var(--gdb-space-4); }
  .gdb-correction-modes legend,
  .gdb-correction-attribution legend { inline-size: 100%; margin-block-end: var(--gdb-space-2); font-size: 0.78rem; font-weight: 800; }
  .gdb-correction-modes label { display: flex; min-block-size: 2.6rem; gap: var(--gdb-space-2); align-items: center; padding-inline: var(--gdb-space-3); border: 1px solid var(--gdb-color-border); border-radius: var(--gdb-radius-sm); cursor: pointer; }
  .gdb-correction-modes label:has(input:checked) { border-color: var(--gdb-color-accent); color: var(--gdb-color-accent-strong); }
  .gdb-correction-editor-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(11rem, 1fr); gap: var(--gdb-space-4); }
  .gdb-correction-field { display: grid; align-content: start; gap: var(--gdb-space-2); font-size: 0.82rem; font-weight: 750; }
  .gdb-correction-field--wide { grid-column: 1; }
  .gdb-correction-field :where(input, select, textarea),
  .gdb-correction-source :where(input, textarea),
  .gdb-correction-contact :where(input:not([type="checkbox"])) { inline-size: 100%; min-block-size: 2.75rem; padding: 0.7rem; border: 1px solid var(--gdb-color-border-strong); border-radius: var(--gdb-radius-sm); background: var(--gdb-color-surface); color: var(--gdb-color-text); }
  .gdb-correction-field textarea,
  .gdb-correction-source textarea { resize: vertical; }
  .gdb-correction-field small { color: var(--gdb-color-text-muted); font-size: 0.72rem; font-weight: 400; }
  .gdb-correction-diff { margin-block-start: var(--gdb-space-5); border: 1px solid var(--gdb-color-border); border-radius: var(--gdb-radius-sm); }
  .gdb-correction-diff > header { display: flex; justify-content: space-between; gap: var(--gdb-space-3); padding: var(--gdb-space-3); border-block-end: 1px solid var(--gdb-color-border); }
  .gdb-correction-diff h4 { margin: 0; font-size: 0.82rem; }
  .gdb-correction-diff header span { color: var(--gdb-color-text-muted); font-family: var(--gdb-font-mono); font-size: 0.7rem; }
  .gdb-correction-diff > div { display: grid; grid-template-columns: 1fr 1fr; }
  .gdb-correction-diff article { min-inline-size: 0; padding: var(--gdb-space-3); }
  .gdb-correction-diff article + article { border-inline-start: 1px solid var(--gdb-color-border); background: color-mix(in srgb, var(--gdb-color-success) 7%, var(--gdb-color-surface)); }
  .gdb-correction-diff article > span { color: var(--gdb-color-text-muted); font-size: 0.68rem; font-weight: 800; text-transform: uppercase; }
  .gdb-correction-diff pre { overflow-wrap: anywhere; margin-block: var(--gdb-space-2) 0; white-space: pre-wrap; font-family: var(--gdb-font-mono); font-size: 0.8rem; }
  .gdb-correction-sources { display: grid; gap: var(--gdb-space-3); }
  .gdb-correction-source { display: grid; grid-template-columns: minmax(0, 1fr) minmax(10rem, 0.6fr) auto; gap: var(--gdb-space-3); align-items: end; padding: var(--gdb-space-3); border: 1px solid var(--gdb-color-border); border-radius: var(--gdb-radius-sm); background: var(--gdb-color-canvas); }
  .gdb-correction-source label,
  .gdb-correction-contact label { display: grid; gap: var(--gdb-space-2); color: var(--gdb-color-text-muted); font-size: 0.74rem; font-weight: 700; }
  .gdb-correction-source__note { grid-column: 1 / 3; }
  .gdb-correction-source button,
  .gdb-correction-add-source { min-block-size: 2.5rem; padding-inline: var(--gdb-space-3); border: 1px solid var(--gdb-color-border-strong); border-radius: var(--gdb-radius-sm); background: var(--gdb-color-surface); color: var(--gdb-color-accent-strong); cursor: pointer; }
  .gdb-correction-add-source { margin-block-start: var(--gdb-space-3); }
  .gdb-correction-attribution { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gdb-space-2); }
  .gdb-correction-attribution label { display: flex; min-block-size: 5rem; gap: var(--gdb-space-3); align-items: start; padding: var(--gdb-space-3); border: 1px solid var(--gdb-color-border); border-radius: var(--gdb-radius-sm); cursor: pointer; }
  .gdb-correction-attribution label:has(input:checked) { border-color: var(--gdb-color-accent); background: var(--gdb-color-accent-soft); }
  .gdb-correction-attribution :where(strong, small) { display: block; }
  .gdb-correction-attribution small { margin-block-start: var(--gdb-space-1); color: var(--gdb-color-text-muted); font-size: 0.7rem; font-weight: 400; }
  .gdb-correction-contact { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gdb-space-3); margin-block-start: var(--gdb-space-3); padding: var(--gdb-space-3); border: 1px solid var(--gdb-color-border); }
  .gdb-correction-contact[hidden] { display: none; }
  .gdb-correction-consent { grid-column: 1 / -1; display: flex !important; grid-template-columns: auto 1fr; align-items: center; }
  .gdb-correction-contract { margin-block-start: var(--gdb-space-4); padding: var(--gdb-space-3); border-inline-start: 3px solid var(--gdb-color-success); background: var(--gdb-color-canvas); font-size: 0.78rem; }
  .gdb-correction-contract ul { display: grid; gap: var(--gdb-space-1); margin-block: var(--gdb-space-2) 0; padding-inline-start: 1.1rem; color: var(--gdb-color-text-muted); }
  .gdb-correction-context { border-inline-start: 1px solid var(--gdb-color-border); background: var(--gdb-color-canvas); }
  .gdb-correction-context section { display: grid; gap: var(--gdb-space-1); padding: var(--gdb-space-4); border-block-end: 1px solid var(--gdb-color-border); }
  .gdb-correction-context section > span { color: var(--gdb-color-text-muted); font-size: 0.68rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
  .gdb-correction-context :where(p, code) { margin: 0; color: var(--gdb-color-text-muted); font-size: 0.74rem; overflow-wrap: anywhere; }
  .gdb-correction-context code { font-family: var(--gdb-font-mono); }
  .gdb-correction-form__footer { grid-column: 1 / -1; display: flex; justify-content: space-between; gap: var(--gdb-space-4); align-items: center; min-block-size: 4.5rem; padding: var(--gdb-space-3) var(--gdb-space-5); border-block-start: 1px solid var(--gdb-color-border); background: var(--gdb-color-surface-raised); }
  .gdb-correction-form__footer > div { display: flex; gap: var(--gdb-space-2); }
  .gdb-correction-form__footer .gdb-button { min-block-size: 2.75rem; margin: 0; }
  .gdb-button--quiet { border-color: transparent; background: transparent; color: var(--gdb-color-accent-strong) !important; }
  .gdb-button--secondary { background: var(--gdb-color-surface); color: var(--gdb-color-accent-strong) !important; }
  .gdb-button:disabled { opacity: 0.62; cursor: wait; }
  .gdb-correction-status { margin: 0; color: var(--gdb-color-text-muted); font-size: 0.8rem; }
  .gdb-correction-status.is-validation-error,
  .gdb-correction-status.is-error { color: var(--gdb-color-danger); font-weight: 700; }
  .gdb-correction-status.is-success { color: var(--gdb-color-success); font-weight: 700; }
  .gdb-correction-status.is-submitting,
  .gdb-correction-status.is-draft-recovered { color: var(--gdb-color-warning); }
  .gdb-correction-state-gallery { padding: var(--gdb-space-5); border-block-start: 1px solid var(--gdb-color-border); background: var(--gdb-color-canvas); }
  .gdb-correction-state-gallery h3 { font-size: 0.9rem; }
  .gdb-correction-state-gallery > div { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--gdb-space-2); }
  .gdb-correction-state-gallery p { min-block-size: 5.5rem; margin: 0; padding: var(--gdb-space-3); border: 1px solid var(--gdb-color-border); background: var(--gdb-color-surface); color: var(--gdb-color-text-muted); font-size: 0.72rem; }
  .gdb-correction-state-gallery p span { display: block; margin-block-end: var(--gdb-space-2); color: var(--gdb-color-text); font-weight: 800; }
  .gdb-correction-state-gallery .is-validation-error { border-color: var(--gdb-color-danger); }
  .gdb-correction-state-gallery .is-success { border-color: var(--gdb-color-success); }
  .gdb-correction-state-gallery .is-submitting,
  .gdb-correction-state-gallery .is-draft-recovered { border-color: var(--gdb-color-warning); }
  .gdb-correction-workbench--compact .gdb-correction-form { grid-template-columns: 1fr; }
  .gdb-correction-workbench--compact .gdb-correction-context { display: grid; grid-template-columns: repeat(3, 1fr); border-inline-start: 0; border-block-start: 1px solid var(--gdb-color-border); }
  .gdb-correction-workbench--compact .gdb-correction-context section:nth-child(n + 4) { display: none; }
  .gdb-correction-workbench--compact .gdb-correction-targets { grid-template-columns: 1fr; }

  @container (max-width: 58rem) {
    .gdb-correction-targets { grid-template-columns: 1fr; }
    .gdb-correction-target { grid-template-columns: auto minmax(0, 1fr); }
    .gdb-correction-target code { grid-column: 2; max-inline-size: 100%; }
    .gdb-correction-editor-grid { grid-template-columns: 1fr; }
    .gdb-correction-field--wide { grid-column: auto; }
    .gdb-correction-source { grid-template-columns: 1fr; }
    .gdb-correction-source__note { grid-column: auto; }
  }

  .gdb-guide-editor {
    container-type: inline-size;
    overflow: clip;
    border: 1px solid var(--gdb-color-border);
    border-radius: var(--gdb-radius-md);
    background: var(--gdb-color-surface);
    color: var(--gdb-color-text);
    box-shadow: var(--gdb-shadow-md);
  }
  .gdb-guide-auth { display: grid; justify-items: start; gap: var(--gdb-space-3); padding: var(--gdb-space-5); border-block-end: 1px solid var(--gdb-color-border); background: var(--gdb-color-canvas); }
  .gdb-guide-auth[hidden] { display: none; }
  .gdb-guide-auth > strong { font-size: 1.15rem; }
  .gdb-guide-auth > p { max-inline-size: 48rem; margin: 0; color: var(--gdb-color-text-muted); }
  .gdb-guide-auth .gdb-button { margin: 0; }
  .gdb-guide-auth__status { font-size: 0.78rem; }
  .gdb-guide-editor :where(h2, h3, p) { margin-block-start: 0; }
  .gdb-guide-editor__heading { display: flex; justify-content: space-between; gap: var(--gdb-space-5); align-items: start; padding: var(--gdb-space-5); border-block-end: 1px solid var(--gdb-color-border); background: var(--gdb-color-canvas); }
  .gdb-guide-editor__heading h2 { margin-block-end: var(--gdb-space-2); font-size: clamp(1.45rem, 3vw, 2.15rem); line-height: 1.08; }
  .gdb-guide-editor__heading > div > p:last-child { max-inline-size: 58rem; margin: 0; color: var(--gdb-color-text-muted); }
  .gdb-guide-editor__eyebrow { margin-block-end: var(--gdb-space-2); color: var(--gdb-color-accent-strong); font-size: 0.72rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
  .gdb-guide-editor__review { flex: none; padding: var(--gdb-space-2) var(--gdb-space-3); border: 1px solid var(--gdb-color-warning); border-radius: 999px; color: var(--gdb-color-warning); font-size: 0.75rem; font-weight: 750; }
  .gdb-guide-form[hidden] { display: none !important; }
  .gdb-guide-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(16rem, 20rem); }
  .gdb-guide-form__main { min-inline-size: 0; }
  .gdb-guide-meta, .gdb-guide-compose, .gdb-guide-review { padding: var(--gdb-space-5); border-block-end: 1px solid var(--gdb-color-border); scroll-margin-block-start: var(--gdb-space-5); }
  .gdb-guide-stage-heading { display: flex; gap: var(--gdb-space-3); align-items: start; margin-block-end: var(--gdb-space-4); }
  .gdb-guide-stage-heading > span { display: grid; flex: none; inline-size: 2.25rem; block-size: 2.25rem; place-items: center; border: 1px solid var(--gdb-color-accent); border-radius: var(--gdb-radius-sm); color: var(--gdb-color-accent-strong); font-size: 0.72rem; font-weight: 800; }
  .gdb-guide-stage-heading h3 { margin-block-end: var(--gdb-space-1); font-size: 1.12rem; }
  .gdb-guide-stage-heading p { margin: 0; color: var(--gdb-color-text-muted); font-size: 0.88rem; }
  .gdb-guide-fields, .gdb-guide-block__body, .gdb-guide-contact { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gdb-space-3); }
  .gdb-guide-field, .gdb-guide-block__body > label, .gdb-guide-contact > label { display: grid; gap: var(--gdb-space-2); color: var(--gdb-color-text); font-size: 0.82rem; font-weight: 700; }
  .gdb-guide-field--wide, .gdb-guide-block__wide { grid-column: 1 / -1; }
  .gdb-guide-field small, .gdb-guide-block__body small { color: var(--gdb-color-text-muted); font-size: 0.74rem; font-weight: 500; }
  .gdb-guide-editor :where(input:not([type="radio"]):not([type="checkbox"]), select, textarea) { inline-size: 100%; min-block-size: 2.75rem; padding: var(--gdb-space-2) var(--gdb-space-3); border: 1px solid var(--gdb-color-border-strong); border-radius: var(--gdb-radius-sm); background: var(--gdb-color-surface-raised); color: var(--gdb-color-text); }
  .gdb-guide-editor textarea { resize: vertical; }
  .gdb-guide-toolbar { display: flex; flex-wrap: wrap; gap: var(--gdb-space-2); margin-block-end: var(--gdb-space-4); padding: var(--gdb-space-3); border: 1px solid var(--gdb-color-border); background: var(--gdb-color-canvas); }
  .gdb-guide-toolbar button { display: inline-flex; min-block-size: 2.75rem; gap: var(--gdb-space-2); align-items: center; padding-inline: var(--gdb-space-3); border: 1px solid var(--gdb-color-border-strong); border-radius: var(--gdb-radius-sm); background: var(--gdb-color-surface); color: var(--gdb-color-text); font-size: 0.78rem; font-weight: 700; cursor: pointer; }
  .gdb-guide-toolbar button:hover { border-color: var(--gdb-color-accent); color: var(--gdb-color-accent-strong); }
  .gdb-guide-toolbar button span { color: var(--gdb-color-accent-strong); font-size: 1rem; }
  .gdb-guide-blocks { display: grid; gap: var(--gdb-space-3); }
  .gdb-guide-block { border: 1px solid var(--gdb-color-border); border-radius: var(--gdb-radius-sm); background: var(--gdb-color-surface-raised); }
  .gdb-guide-block > header { display: flex; justify-content: space-between; gap: var(--gdb-space-3); align-items: center; padding: var(--gdb-space-3); border-block-end: 1px solid var(--gdb-color-border); background: var(--gdb-color-canvas); }
  .gdb-guide-block > header > div:first-child { display: flex; gap: var(--gdb-space-3); align-items: center; }
  .gdb-guide-block > header > div:first-child > span { color: var(--gdb-color-accent-strong); font-family: var(--gdb-font-mono); font-size: 0.72rem; }
  .gdb-guide-block__actions { display: flex; flex-wrap: wrap; gap: var(--gdb-space-1); }
  .gdb-guide-block__actions button, .gdb-guide-tier-list > button { min-block-size: 2.25rem; padding-inline: var(--gdb-space-2); border: 1px solid transparent; background: transparent; color: var(--gdb-color-text-muted); font-size: 0.72rem; font-weight: 700; cursor: pointer; }
  .gdb-guide-block__actions button:hover, .gdb-guide-tier-list > button:hover { border-color: var(--gdb-color-border); color: var(--gdb-color-accent-strong); }
  .gdb-guide-block__body { padding: var(--gdb-space-4); }
  .gdb-guide-divider-preview { grid-column: 1 / -1; margin: 0; padding-block: var(--gdb-space-2); border-block: 1px dashed var(--gdb-color-border-strong); color: var(--gdb-color-text-muted); text-align: center; }
  .gdb-guide-tier-list { display: grid; grid-column: 1 / -1; gap: var(--gdb-space-2); }
  .gdb-guide-tier-list > div { display: grid; grid-template-columns: minmax(4rem, 6rem) minmax(0, 1fr); gap: var(--gdb-space-2); padding: var(--gdb-space-2); border: 1px solid var(--gdb-color-border); background: var(--gdb-color-surface); }
  .gdb-guide-tier-list label { display: grid; gap: var(--gdb-space-1); font-size: 0.72rem; font-weight: 700; }
  .gdb-guide-block figure { grid-column: 1 / -1; margin: 0; padding: var(--gdb-space-3); border: 1px solid var(--gdb-color-border); }
  .gdb-guide-block figure img { display: block; max-block-size: 18rem; max-inline-size: 100%; margin-inline: auto; object-fit: contain; }
  .gdb-guide-block figcaption { margin-block-start: var(--gdb-space-2); color: var(--gdb-color-text-muted); font-size: 0.74rem; text-align: center; }
  .gdb-guide-empty { padding: var(--gdb-space-5); border: 1px dashed var(--gdb-color-border-strong); color: var(--gdb-color-text-muted); text-align: center; }
  .gdb-guide-attribution { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gdb-space-2); margin: 0 0 var(--gdb-space-4); padding: 0; border: 0; }
  .gdb-guide-attribution legend { margin-block-end: var(--gdb-space-2); font-size: 0.82rem; font-weight: 800; }
  .gdb-guide-attribution label { display: flex; min-block-size: 4.5rem; gap: var(--gdb-space-2); align-items: start; padding: var(--gdb-space-3); border: 1px solid var(--gdb-color-border); border-radius: var(--gdb-radius-sm); cursor: pointer; }
  .gdb-guide-attribution input { margin-block-start: 0.2rem; accent-color: var(--gdb-color-accent); }
  .gdb-guide-attribution span { display: grid; gap: var(--gdb-space-1); }
  .gdb-guide-attribution small { color: var(--gdb-color-text-muted); font-size: 0.7rem; font-weight: 500; }
  .gdb-guide-contact { margin-block-end: var(--gdb-space-4); }
  .gdb-guide-contact[hidden] { display: none; }
  .gdb-guide-contact .gdb-guide-consent { display: flex; grid-column: 1 / -1; gap: var(--gdb-space-2); align-items: center; }
  .gdb-guide-author { display: grid; gap: var(--gdb-space-2); margin-block-end: var(--gdb-space-4); padding: var(--gdb-space-4); border: 1px solid var(--gdb-color-border); border-radius: var(--gdb-radius-sm); background: var(--gdb-color-canvas); }
  .gdb-guide-author :where(p, a) { margin: 0; font-size: 0.82rem; }
  .gdb-guide-author p { color: var(--gdb-color-text-muted); }
  .gdb-guide-page-picker { position: relative; display: grid; grid-column: 1 / -1; gap: var(--gdb-space-2); }
  .gdb-guide-page-picker > label { color: var(--gdb-color-text); font-size: 0.82rem; font-weight: 700; }
  .gdb-guide-page-picker__status { margin: 0; color: var(--gdb-color-text-muted); font-family: var(--gdb-font-mono); font-size: 0.74rem; }
  .gdb-guide-page-picker [role="listbox"] { position: absolute; inset-block-start: 100%; inset-inline: 0; z-index: 20; max-block-size: 17rem; margin: 0; padding: 0; overflow-y: auto; border: 1px solid var(--gdb-color-border-strong); border-radius: var(--gdb-radius-sm); background: var(--gdb-color-surface-raised); list-style: none; }
  .gdb-guide-page-picker [role="listbox"][hidden] { display: none; }
  .gdb-guide-page-picker [role="option"] { display: grid; gap: 0.15rem; padding: var(--gdb-space-2) var(--gdb-space-3); border-block-end: 1px solid var(--gdb-color-border); cursor: pointer; }
  .gdb-guide-page-picker [role="option"]:last-child { border-block-end: 0; }
  .gdb-guide-page-picker [role="option"].is-active, .gdb-guide-page-picker [role="option"]:hover { background: var(--gdb-color-canvas); outline: 2px solid var(--gdb-color-accent); outline-offset: -2px; }
  .gdb-guide-page-picker [role="option"] strong { font-size: 0.86rem; }
  .gdb-guide-page-picker [role="option"] small { color: var(--gdb-color-text-muted); font-family: var(--gdb-font-mono); font-size: 0.72rem; }
  .gdb-guide-prose-tools { display: grid; grid-column: 1 / -1; gap: var(--gdb-space-2); margin-block-start: var(--gdb-space-2); }
  .gdb-guide-prose-tools > button { justify-self: start; min-block-size: 2.25rem; padding-inline: var(--gdb-space-3); border: 1px solid var(--gdb-color-border-strong); border-radius: var(--gdb-radius-sm); background: var(--gdb-color-surface); color: var(--gdb-color-text); font-size: 0.74rem; font-weight: 700; cursor: pointer; }
  .gdb-guide-prose-tools > button:hover { border-color: var(--gdb-color-accent); color: var(--gdb-color-accent-strong); }
  .gdb-guide-prose-tools > .gdb-guide-page-picker[hidden] { display: none; }
  .gdb-guide-preview { inline-size: min(64rem, 92vw); max-block-size: 88vh; padding: 0; border: 1px solid var(--gdb-color-border-strong); border-radius: var(--gdb-radius-sm); background: var(--gdb-color-surface); color: var(--gdb-color-text); }
  .gdb-guide-preview::backdrop { background: rgb(0 0 0 / 55%); }
  .gdb-guide-preview__bar { display: flex; position: sticky; inset-block-start: 0; justify-content: space-between; gap: var(--gdb-space-3); align-items: center; padding: var(--gdb-space-3) var(--gdb-space-4); border-block-end: 1px solid var(--gdb-color-border); background: var(--gdb-color-surface-raised); font-size: 0.82rem; }
  .gdb-guide-preview__body { max-block-size: calc(88vh - 4rem); padding: var(--gdb-space-5); overflow-y: auto; }
  .gdb-guide-preview__body:focus-visible { outline: 2px solid var(--gdb-color-accent); outline-offset: -4px; }
  .gdb-guide-document { display: grid; gap: var(--gdb-space-3); }
  .gdb-guide-document :where(h1, h2, h3, h4) { margin: var(--gdb-space-3) 0 0; line-height: 1.15; }
  .gdb-guide-document p { margin: 0; }
  .gdb-guide-document a { color: var(--gdb-color-accent-strong); }
  .gdb-guide-document__header { display: grid; gap: var(--gdb-space-2); padding-block-end: var(--gdb-space-3); border-block-end: 1px solid var(--gdb-color-border); }
  .gdb-guide-document__summary { color: var(--gdb-color-text-muted); }
  .gdb-guide-document__meta { display: flex; flex-wrap: wrap; gap: var(--gdb-space-3); margin: 0; font-size: 0.78rem; }
  .gdb-guide-document__meta dt { color: var(--gdb-color-text-muted); font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; }
  .gdb-guide-document__meta dd { margin: 0; }
  .gdb-guide-document__tags { display: flex; flex-wrap: wrap; gap: var(--gdb-space-2); margin: 0; padding: 0; list-style: none; }
  .gdb-guide-document__tags li { padding: 0.1rem var(--gdb-space-2); border: 1px solid var(--gdb-color-border); border-radius: 999px; font-size: 0.72rem; }
  .gdb-guide-document :where(.gdb-guide-document__steps, .gdb-guide-document__checklist) { display: grid; gap: var(--gdb-space-2); margin: 0; padding-inline-start: 1.35rem; }
  .gdb-guide-document__callout { display: grid; gap: var(--gdb-space-2); padding: var(--gdb-space-3); border-inline-start: 3px solid var(--gdb-color-accent); background: var(--gdb-color-canvas); }
  .gdb-guide-document__callout--warning { border-inline-start-color: var(--gdb-color-warning); }
  .gdb-guide-document__callout--danger { border-inline-start-color: var(--gdb-color-danger); }
  .gdb-guide-document__link { display: grid; gap: var(--gdb-space-1); padding: var(--gdb-space-3); border: 1px solid var(--gdb-color-border); border-radius: var(--gdb-radius-sm); }
  .gdb-guide-document__link p:last-child:not(:only-child) { color: var(--gdb-color-text-muted); font-size: 0.82rem; }
  .gdb-guide-document__figure { margin: 0; }
  .gdb-guide-document__figure img { display: block; max-block-size: 22rem; max-inline-size: 100%; margin-inline: auto; object-fit: contain; }
  .gdb-guide-document__figure figcaption, .gdb-guide-document__quote figcaption { margin-block-start: var(--gdb-space-2); color: var(--gdb-color-text-muted); font-size: 0.78rem; }
  .gdb-guide-document__table { overflow-x: auto; }
  .gdb-guide-document__table table { inline-size: 100%; border-collapse: collapse; font-size: 0.84rem; }
  .gdb-guide-document__table :where(th, td) { padding: var(--gdb-space-2); border: 1px solid var(--gdb-color-border); text-align: start; }
  .gdb-guide-document__tiers { display: grid; gap: var(--gdb-space-2); margin: 0; }
  .gdb-guide-document__tiers > div { display: grid; grid-template-columns: minmax(3.5rem, 5rem) minmax(0, 1fr); gap: var(--gdb-space-2); padding: var(--gdb-space-2); border: 1px solid var(--gdb-color-border); }
  .gdb-guide-document__tiers dt { font-weight: 800; }
  .gdb-guide-document__tiers dd { margin: 0; }
  .gdb-guide-document__quote { margin: 0; padding-inline-start: var(--gdb-space-4); border-inline-start: 3px solid var(--gdb-color-border-strong); }
  .gdb-guide-document__quote blockquote { margin: 0; }
  .gdb-guide-document__divider { inline-size: 100%; margin: var(--gdb-space-2) 0; border: 0; border-block-start: 1px solid var(--gdb-color-border-strong); }
  .gdb-guide-document__empty { color: var(--gdb-color-text-muted); }
  .gdb-guide-context { min-inline-size: 0; border-inline-start: 1px solid var(--gdb-color-border); background: var(--gdb-color-canvas); }
  .gdb-guide-context section { padding: var(--gdb-space-4); border-block-end: 1px solid var(--gdb-color-border); }
  .gdb-guide-context section > span { display: block; margin-block-end: var(--gdb-space-2); color: var(--gdb-color-text-muted); font-size: 0.68rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
  .gdb-guide-context :where(p, ol, ul) { margin: 0; padding-inline-start: 1.15rem; color: var(--gdb-color-text-muted); font-size: 0.78rem; }
  .gdb-guide-context ol { display: grid; gap: var(--gdb-space-2); }
  .gdb-guide-context strong + p { margin-block-start: var(--gdb-space-2); padding: 0; }
  .gdb-guide-form__footer { display: flex; grid-column: 1 / -1; justify-content: space-between; gap: var(--gdb-space-4); align-items: center; min-block-size: 4.5rem; padding: var(--gdb-space-3) var(--gdb-space-5); border-block-start: 1px solid var(--gdb-color-border); background: var(--gdb-color-surface-raised); }
  .gdb-guide-form__footer > div { display: flex; flex-wrap: wrap; gap: var(--gdb-space-2); }
  .gdb-guide-form__footer .gdb-button { min-block-size: 2.75rem; margin: 0; }
  .gdb-guide-status { margin: 0; color: var(--gdb-color-text-muted); font-size: 0.8rem; }
  .gdb-guide-status.is-error, .gdb-guide-status.is-validation-error { color: var(--gdb-color-danger); }
  .gdb-guide-status.is-success, .gdb-guide-status.is-draft-recovered { color: var(--gdb-color-success); }
  .gdb-guide-state-gallery { padding: var(--gdb-space-5); border-block-start: 1px solid var(--gdb-color-border); background: var(--gdb-color-canvas); }
  .gdb-guide-state-gallery > div { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--gdb-space-2); }
  .gdb-guide-state-gallery p { margin: 0; padding: var(--gdb-space-3); border: 1px solid var(--gdb-color-border); background: var(--gdb-color-surface); color: var(--gdb-color-text-muted); font-size: 0.74rem; }
  .gdb-guide-state-gallery span { display: block; margin-block-end: var(--gdb-space-1); color: var(--gdb-color-text); font-weight: 800; }
  .gdb-guide-state-gallery .is-validation-error { border-color: var(--gdb-color-danger); }
  .gdb-guide-state-gallery .is-success { border-color: var(--gdb-color-success); }
  .gdb-guide-state-gallery .is-draft-recovered { border-color: var(--gdb-color-warning); }
  .gdb-guide-editor--compact .gdb-guide-form { grid-template-columns: 1fr; }
  .gdb-guide-editor--compact .gdb-guide-context { display: grid; grid-template-columns: repeat(3, 1fr); border-inline-start: 0; border-block-start: 1px solid var(--gdb-color-border); }
  .gdb-guide-editor--compact .gdb-guide-context section:nth-child(n + 4) { display: none; }

  @container (max-width: 58rem) {
    .gdb-guide-form { grid-template-columns: 1fr; }
    .gdb-guide-context { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-inline-start: 0; border-block-start: 1px solid var(--gdb-color-border); }
    .gdb-guide-state-gallery > div { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }

  @keyframes gdb-state-pulse { to { inline-size: 5rem; opacity: 0.45; } }

  @media (max-width: 70rem) {
    /* The control row wraps on its own now, so there is no template here to rewrite. */
    .gdb-entity-row { grid-template-columns: minmax(12rem, 1fr) minmax(12rem, 2fr) auto; }
    .gdb-entity-row dl { display: none; }
  }

  @media (max-width: 64rem) {
    .gdb-header { grid-template-columns: minmax(0, 1fr) auto; }
    .gdb-header__navigation { grid-column: 1 / -1; }
    .gdb-header__navigation ul { flex-wrap: wrap; }
    .gdb-header[data-gamedb-navigation-ready="true"] { grid-template-columns: auto minmax(0, 1fr) auto; }
    .gdb-header[data-gamedb-navigation-ready="true"] .gdb-header__menu { display: block; }
    .gdb-header[data-gamedb-navigation-ready="true"] .gdb-header__navigation { display: none; }
    .gdb-sidebar { inline-size: 100%; border-inline-end: 0; }
    .gdb-sidebar[data-gamedb-navigation-ready="true"] {
      position: fixed;
      inset: 0 auto 0 0;
      z-index: 90;
      inline-size: var(--gdb-sidebar-width);
      overflow-y: auto;
      max-inline-size: calc(100% - 3rem);
      border-inline-end: 1px solid var(--gdb-color-border);
      box-shadow: var(--gdb-shadow-md);
      transform: translateX(-105%);
      transition: transform var(--gdb-motion-standard) ease;
    }
    .gdb-sidebar--compact[data-gamedb-navigation-ready="true"] { inline-size: 14rem; }
    .gdb-sidebar[data-gamedb-navigation-ready="true"][data-open="true"] { transform: translateX(0); }
    .gdb-sidebar[data-gamedb-navigation-ready="true"] .gdb-sidebar__header button { display: inline-flex; border: 0; background: transparent; color: var(--gdb-color-accent); cursor: pointer; }
    .gdb-sidebar-scrim[data-gamedb-navigation-ready="true"] { position: fixed; inset: 0; z-index: 80; display: none; border: 0; background: rgb(8 15 24 / 55%); }
    .gdb-sidebar-scrim[data-gamedb-navigation-ready="true"][data-open="true"] { display: block; }
    html[data-gamedb-menu-open="true"] { overflow: hidden; }
  }

  @media (max-width: 48rem) {
    .gdb-header__search kbd, .gdb-header__search span { display: none; }
    .gdb-header__search::before { content: "Search"; }
    .gdb-footer { grid-template-columns: 1fr; }
    .gdb-footer__legal { grid-column: auto; }
    /* Beside its values a facet name takes a third of a row this narrow from the boxes it names. */
    .gdb-facet { grid-template-columns: minmax(0, 1fr); gap: var(--gdb-space-1); }
    .gdb-facet__header { min-block-size: 0; padding-block: 0; }
    .gdb-table-browser { margin-inline: 0; padding: var(--gdb-space-3); }
    .gdb-table-browser__controls { grid-template-columns: 1fr; }
    .gdb-entity-hero, .gdb-entity-hero--compact { grid-template-columns: 1fr; }
    .gdb-entity-hero__media { max-inline-size: 24rem; }
    .gdb-entity-row { grid-template-columns: minmax(0, 1fr) auto; }
    .gdb-entity-row > p { display: none; }
    .gdb-relationship-group li { grid-template-columns: 1fr; gap: var(--gdb-space-2); }
    .gdb-data-table--stack table,
    .gdb-data-table--stack :where(tbody, tr, th, td) { display: block; inline-size: 100%; }
    .gdb-data-table--stack thead { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); }
    .gdb-data-table--stack tr { padding: var(--gdb-space-3); border-block-end: 1px solid var(--gdb-color-border); }
    .gdb-data-table--stack :where(th, td) { display: grid; grid-template-columns: minmax(7rem, 0.7fr) minmax(0, 1fr); gap: var(--gdb-space-3); border: 0; }
    .gdb-data-table--stack :where(th, td)::before { color: var(--gdb-color-text-muted); content: attr(data-label); font-size: 0.75rem; font-weight: 650; }
    .gdb-editable-region { grid-template-columns: 1fr; }
    .gdb-editable-region__action { min-block-size: 2.75rem; }
    .gdb-correction-workbench__heading { display: grid; padding: var(--gdb-space-4); }
    .gdb-correction-workbench__privacy { justify-self: start; }
    .gdb-correction-steps button { min-block-size: 3.5rem; flex-direction: column; gap: var(--gdb-space-1); font-size: 0.68rem; }
    .gdb-correction-form,
    .gdb-correction-workbench--compact .gdb-correction-form { grid-template-columns: 1fr; }
    .gdb-correction-stage { padding: var(--gdb-space-4); }
    .gdb-correction-targets,
    .gdb-correction-editor-grid,
    .gdb-correction-attribution,
    .gdb-correction-contact { grid-template-columns: 1fr; }
    .gdb-correction-target { grid-template-columns: auto minmax(0, 1fr); min-block-size: 3.75rem; }
    .gdb-correction-target code { grid-column: 2; }
    .gdb-correction-selection { grid-template-columns: 1fr auto; }
    .gdb-correction-selection code { grid-column: 1 / -1; grid-row: 2; }
    .gdb-correction-modes label { min-block-size: 2.75rem; }
    .gdb-correction-field--wide { grid-column: auto; }
    .gdb-correction-diff > div { grid-template-columns: 1fr; }
    .gdb-correction-diff article + article { border-inline-start: 0; border-block-start: 1px solid var(--gdb-color-border); }
    .gdb-correction-source { grid-template-columns: 1fr; }
    .gdb-correction-source__note { grid-column: auto; }
    .gdb-correction-contact .gdb-correction-consent { grid-column: auto; }
    .gdb-correction-context,
    .gdb-correction-workbench--compact .gdb-correction-context { display: grid; grid-template-columns: 1fr 1fr; border-inline-start: 0; border-block-start: 1px solid var(--gdb-color-border); }
    .gdb-correction-context section:nth-child(n + 4),
    .gdb-correction-workbench--compact .gdb-correction-context section:nth-child(n + 4) { display: none; }
    .gdb-correction-form__footer { position: sticky; inset-block-end: 0; z-index: 4; display: grid; padding: var(--gdb-space-3); box-shadow: 0 -8px 24px rgb(0 0 0 / 12%); }
    .gdb-correction-form__footer > div { display: grid; grid-template-columns: 1fr 1fr; }
    .gdb-correction-form__footer [data-correction-save-draft] { grid-column: 1 / -1; }
    .gdb-correction-state-gallery > div { grid-template-columns: 1fr; }
    .gdb-guide-editor__heading { display: grid; padding: var(--gdb-space-4); }
    .gdb-guide-editor__review { justify-self: start; }
    .gdb-guide-meta, .gdb-guide-compose, .gdb-guide-review { padding: var(--gdb-space-4); }
    .gdb-guide-fields, .gdb-guide-block__body, .gdb-guide-attribution, .gdb-guide-contact { grid-template-columns: 1fr; }
    .gdb-guide-field--wide, .gdb-guide-block__wide, .gdb-guide-contact .gdb-guide-consent { grid-column: auto; }
    .gdb-guide-toolbar { max-block-size: 12rem; overflow-y: auto; }
    .gdb-guide-toolbar button { flex: 1 1 8rem; justify-content: start; }
    .gdb-guide-block > header { align-items: start; }
    .gdb-guide-block__actions { justify-content: end; }
    .gdb-guide-block__actions button { min-block-size: 2.75rem; }
    .gdb-guide-tier-list > button { min-block-size: 2.75rem; }
    .gdb-guide-tier-list > div { grid-template-columns: 4rem minmax(0, 1fr); }
    .gdb-guide-context, .gdb-guide-editor--compact .gdb-guide-context { grid-template-columns: 1fr 1fr; }
    .gdb-guide-context section:nth-child(n + 4), .gdb-guide-editor--compact .gdb-guide-context section:nth-child(n + 4) { display: none; }
    .gdb-guide-form__footer { position: sticky; inset-block-end: 0; z-index: 4; display: grid; padding: var(--gdb-space-3); box-shadow: 0 -8px 24px rgb(0 0 0 / 12%); }
    .gdb-guide-form__footer > div { display: grid; grid-template-columns: 1fr 1fr; }
    .gdb-guide-form__footer [data-guide-save-draft] { grid-column: 1 / -1; }
    .gdb-guide-state-gallery > div { grid-template-columns: 1fr; }
  }

  @media (prefers-reduced-motion: reduce) {
    .gdb-skip-link,
    .gdb-sidebar { transition: none; }
    .gdb-state-panel__mark { animation: none !important; }
  }
}