/* Release notes pages (shared/release-notes.mjs), in the GBG Go colours and the site's own parts:
   the home page's square cards, plain headings, a timeline, filled change labels, the caution box.
   Light first; dark follows the site's own switch (both flavours set data-theme="dark" on the page). */
.rn {
  --rn-bg: #FFFFFF; --rn-ink: #0C0C0E; --rn-text: #3B3B44; --rn-muted: #6B6B7A; --rn-line: #E3E3E8; --rn-line-strong: #ADADB8;
  --rn-accent: #4D4DFF; --rn-accent-ink: #2424B8; --rn-accent-soft: #E5E5FF;
  --rn-new: #2424B8; --rn-new-bg: #E5E5FF;
  --rn-improved: #1B6E43; --rn-improved-bg: #E3F5EA;
  --rn-fixed: #3B3B44; --rn-fixed-bg: #ECEDF1;
  --rn-security: #9C4520; --rn-security-bg: #FFEDE5;
  --rn-breaking: #A93535; --rn-breaking-bg: #FFEBEB;
  --rn-changed: #3B3B44; --rn-changed-bg: #F6F7F9;
  --rn-quiet: #9A4F0A;
  --rn-caution: #CC6133; --rn-caution-bg: #FFEDE5;
  --rn-radius: 0; /* Starlight's cards are square; Docusaurus rounds its own (below) */
  color: var(--rn-text); display: grid; gap: 1.25rem; min-width: 0; overflow-wrap: anywhere;
}
[data-theme="dark"] .rn {
  --rn-bg: #17171C; --rn-ink: #F6F7F9; --rn-text: #CFCFD8; --rn-muted: #A0A0B0; --rn-line: #2E2E3A; --rn-line-strong: #4A4A58;
  --rn-accent: #9C9CFF; --rn-accent-ink: #B2B2FF; --rn-accent-soft: #26265A;
  --rn-new: #C7C7FF; --rn-new-bg: #26265A;
  --rn-improved: #8FE0AE; --rn-improved-bg: #15301F;
  --rn-fixed: #D7D7E0; --rn-fixed-bg: #2A2A33;
  --rn-security: #FFBE9E; --rn-security-bg: #3A2218;
  --rn-breaking: #FFA3A3; --rn-breaking-bg: #3A1A1A;
  --rn-changed: #D7D7E0; --rn-changed-bg: #22222A;
  --rn-quiet: #FFB566;
  --rn-caution: #FFAD8A; --rn-caution-bg: #3A2218;
}
.plugin-gbg-release-notes .rn { --rn-radius: 12px; }
.rn [hidden] { display: none !important; }
.rn * { box-sizing: border-box; }
.rn a { color: var(--rn-accent-ink); }
.rn p, .rn ul, .rn ol, .rn h2, .rn h3 { margin: 0; }
.rn-h1 { font-size: 2.25rem; font-weight: 800; color: var(--rn-ink); line-height: 1.15; }
.rn-h2 { font-size: 1.375rem; font-weight: 800; color: var(--rn-ink); margin-top: 0.75rem; }
.rn-lede { font-size: 1.0625rem; max-width: 70ch; }
.rn-lede b { color: var(--rn-ink); }
.rn-muted { color: var(--rn-muted); font-size: 0.875rem; }
.rn-crumbs { font-size: 0.8125rem; color: var(--rn-muted); }

/* change labels: small filled labels with a matching outline */
.rn-pill { display: inline-block; font-size: 0.71875rem; font-weight: 700; line-height: 1.5; padding: 0 0.45rem; border-radius: 999px; border: 1px solid currentColor; white-space: nowrap; vertical-align: 0.0625rem; }
.rn-pill--new { color: var(--rn-new); background: var(--rn-new-bg); }
.rn-pill--improved { color: var(--rn-improved); background: var(--rn-improved-bg); }
.rn-pill--fixed { color: var(--rn-fixed); background: var(--rn-fixed-bg); }
.rn-pill--security { color: var(--rn-security); background: var(--rn-security-bg); }
.rn-pill--breaking { color: var(--rn-breaking); background: var(--rn-breaking-bg); }
.rn-pill--changed { color: var(--rn-changed); background: var(--rn-changed-bg); }

/* current versions: the home page's product cards, with the version */
.rn-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 14rem), 1fr)); gap: 0.875rem; }
.rn-card { display: grid; gap: 0.25rem; align-content: start; padding: 1rem 1.125rem; border: 1px solid var(--rn-line); border-radius: var(--rn-radius); background: var(--rn-bg); color: var(--rn-text); text-decoration: none; }
.rn a.rn-card { color: var(--rn-text); text-decoration: none; }
.rn a.rn-card:hover { border-color: var(--rn-accent); }
.rn-card-name { display: flex; justify-content: space-between; gap: 0.5rem; font-weight: 700; color: var(--rn-ink); }
.rn-card-name span { color: var(--rn-accent); }
.rn-card-kind { font-size: 0.8125rem; color: var(--rn-muted); line-height: 1.4; }
.rn-card-ver { font-size: 1.75rem; font-weight: 800; color: var(--rn-ink); line-height: 1.15; letter-spacing: -0.01em; margin-top: 0.25rem !important; }
.rn-card--none .rn-card-ver { color: var(--rn-muted); }
.rn-card-date { font-size: 0.8125rem; color: var(--rn-muted); }
.rn-card-date--quiet { color: var(--rn-quiet); }
.rn-card-line { font-size: 0.875rem; margin-top: 0.25rem !important; }

/* recently released and all releases: a timeline, a dot per release, red for a breaking change */
.rn-tl { list-style: none; margin: 0; padding: 0 0 0 1.375rem; position: relative; display: grid; gap: 1rem; }
.rn-tl::before { content: ""; position: absolute; left: 0.3125rem; top: 0.375rem; bottom: 0.375rem; width: 2px; background: var(--rn-line); }
.rn-tl-item { position: relative; display: grid; gap: 0.125rem; margin: 0; }
.rn-tl-item::before { content: ""; position: absolute; left: -1.375rem; top: 0.25rem; width: 0.75rem; height: 0.75rem; border-radius: 50%; background: var(--rn-bg); border: 2px solid var(--rn-accent); }
.rn-tl-item--breaking::before { border-color: var(--rn-breaking); background: var(--rn-breaking-bg); }
.rn-tl-date { font-size: 0.8125rem; color: var(--rn-muted); }
.rn-tl-title { font-weight: 700; color: var(--rn-ink); }
.rn-tl-title a { color: var(--rn-ink); text-decoration: none; }
.rn-tl-title a:hover { color: var(--rn-accent-ink); text-decoration: underline; }
.rn-tl-text { font-size: 0.9375rem; }
.rn-changes { list-style: none; padding: 0; margin: 0.25rem 0 0; display: grid; gap: 0.3125rem; font-size: 0.9375rem; }
.rn-changes li { margin: 0; }
.rn-filters { display: flex; flex-wrap: wrap; gap: 0.75rem 1.25rem; margin-bottom: 1.25rem; }
.rn-filters label { display: grid; gap: 0.25rem; font-size: 0.8125rem; font-weight: 600; color: var(--rn-ink); }
.rn-filters select { font: inherit; font-weight: 400; font-size: 0.9375rem; padding: 0.375rem 0.625rem; border: 1px solid var(--rn-line-strong); border-radius: 6px; background: var(--rn-bg); color: var(--rn-ink); min-width: 12rem; }
.rn-none { padding: 1.5rem; text-align: center; color: var(--rn-muted); border: 1px dashed var(--rn-line); }

/* product pages: dated entries */
.rn-date { font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--rn-muted); padding-top: 0.75rem; border-top: 1px solid var(--rn-line); }
.rn-entry { display: grid; gap: 0.5rem; padding-left: 1rem; border-left: 3px solid var(--rn-accent-soft); scroll-margin-top: 5rem; }
.rn-entry--breaking { border-left-color: var(--rn-breaking); }
.rn-entry-h { font-size: 1.1875rem; font-weight: 800; color: var(--rn-ink); }
.rn-entry b { color: var(--rn-ink); }
.rn-open { font-size: 0.875rem; }

/* a release's changes: one label per type, its changes listed under it */
.rn-groups { display: grid; gap: 0.75rem; }
.rn-group-h { display: flex; align-items: center; gap: 0.5rem; }
.rn-group ul { margin: 0.3125rem 0 0; padding-left: 1.25rem; display: grid; gap: 0.25rem; font-size: 0.9375rem; }
.rn-group li { margin: 0; }

/* pull-out drawers: a library release's documents, and each older release */
.rn-drawer { border: 1px solid var(--rn-line); border-radius: var(--rn-radius); }
.rn-drawer > summary, .rn-fold > summary { cursor: pointer; list-style: none; padding: 0.625rem 0.875rem; }
.rn-drawer > summary::-webkit-details-marker, .rn-fold > summary::-webkit-details-marker { display: none; }
.rn-drawer > summary { font-weight: 700; color: var(--rn-accent-ink); }
.rn-drawer > summary::before, .rn-fold > summary::before { content: "\25B8"; display: inline-block; width: 1em; color: var(--rn-muted); transition: transform 0.15s; }
.rn-drawer[open] > summary::before, .rn-fold[open] > summary::before { transform: rotate(90deg); }
.rn-drawer > .rn-groups { padding: 0 0.875rem 0.875rem; }
.rn-doclist { list-style: none; padding: 0 !important; max-height: 24rem; overflow-y: auto; }
.rn-doclist li { display: grid; grid-template-columns: 1.5rem minmax(0, 1fr); gap: 0.625rem; align-items: start; padding: 0.25rem 0; border-bottom: 1px solid var(--rn-line); font-size: 0.875rem; }
.rn-doclist b { color: var(--rn-ink); font-weight: 600; }
/* product pages: the same timeline, the latest releases open and older ones folded on the line */
.rn-tl-body { display: grid; gap: 0.5rem; scroll-margin-top: 5rem; }
h2.rn-tl-title { font-size: 1.1875rem; font-weight: 800; }
.rn-tl-body b, .rn-fold-body b { color: var(--rn-ink); }
.rn-fold { scroll-margin-top: 5rem; }
.rn-fold > summary { padding: 0; display: grid; gap: 0.125rem; }
.rn-fold > summary::before { position: absolute; right: 0; top: 0.125rem; }
.rn-fold > summary .rn-tl-title { padding-right: 1.5rem; }
.rn-fold > summary:hover .rn-tl-title { color: var(--rn-accent-ink); }
.rn-fold-line { font-size: 0.9375rem; color: var(--rn-text); }
.rn-fold[open] .rn-fold-line { display: none; }
.rn-fold-body { padding: 0.5rem 0 0.25rem; display: grid; gap: 0.625rem; }
@media (prefers-reduced-motion: reduce) { .rn-drawer > summary::before, .rn-fold > summary::before { transition: none; } }

/* Documentation updates pages (documentation-updates.md, plain markdown; wrapped in .rn.rn-updates by
   trials/starlight/src/components/MarkdownContent.astro): the same vertical timeline as the release
   notes. Starlight wraps each heading in div.sl-heading-wrapper, so that is the point on the line:
   each "## <date>" is a dot, the list under it is what changed, and anything before the first date
   (the introduction) sits above the line. Spacing comes from padding so the line is unbroken.
   Selectors start with .sl-markdown-content to outrank Starlight's own heading and spacing rules. */
.sl-markdown-content .rn.rn-updates { display: block; }
.sl-markdown-content .rn-updates > * { margin: 0 !important; }
.sl-markdown-content .rn-updates > p:not(.sl-heading-wrapper ~ *) { margin-bottom: 1.5rem !important; }
.sl-markdown-content .rn-updates > .sl-heading-wrapper,
.sl-markdown-content .rn-updates > .sl-heading-wrapper ~ * { margin-left: 0.375rem !important; padding-left: 1.375rem; border-left: 2px solid var(--rn-line); }
.sl-markdown-content .rn-updates > .sl-heading-wrapper { position: relative; padding-bottom: 0.5rem; }
.sl-markdown-content .rn-updates > .sl-heading-wrapper::before { content: ""; position: absolute; left: calc(-0.375rem - 1px); top: 0.125rem; width: 0.75rem; height: 0.75rem; border-radius: 50%; background: var(--rn-bg); border: 2px solid var(--rn-accent); box-sizing: border-box; }
.sl-markdown-content .rn-updates > .sl-heading-wrapper h2 { margin: 0 !important; font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--rn-muted); line-height: 1.3; }
.sl-markdown-content .rn-updates > .sl-heading-wrapper ~ ul { list-style: none; display: grid; gap: 0.375rem; padding-bottom: 1.75rem; font-size: 0.9375rem; color: var(--rn-text); }
.sl-markdown-content .rn-updates > .sl-heading-wrapper ~ ul > li { margin: 0 !important; padding-left: 1rem; position: relative; }
.sl-markdown-content .rn-updates > .sl-heading-wrapper ~ ul > li::before { content: ""; position: absolute; left: 0; top: 0.6em; width: 0.375rem; height: 0.375rem; border-radius: 50%; background: var(--rn-line-strong); }
.sl-markdown-content .rn-updates > .sl-heading-wrapper ~ p { padding-bottom: 1.75rem; }
.sl-markdown-content .rn-updates > .sl-heading-wrapper ~ *:last-child { border-left-color: transparent; }
.sl-markdown-content .rn-updates b, .sl-markdown-content .rn-updates strong { color: var(--rn-ink); }

/* breaking change: the site's caution box */
.rn-caution { display: grid; gap: 0.25rem; padding: 0.875rem 1rem; background: var(--rn-caution-bg); border-left: 4px solid var(--rn-caution); border-radius: var(--rn-radius); }
.rn-caution-h { display: flex; align-items: center; gap: 0.375rem; font-weight: 800; color: var(--rn-caution); }
.rn-caution-icon { width: 1.125rem; height: 1.125rem; }
.rn-caution b { color: var(--rn-ink); }

/* is my document supported? result cards with a flag and a document-type icon */
.rn-finder { display: grid; gap: 0.5rem; }
.rn-finder input { font: inherit; font-size: 1rem; padding: 0.625rem 0.875rem; border: 1px solid var(--rn-line-strong); border-radius: 8px; background: var(--rn-bg); color: var(--rn-ink); width: 100%; max-width: 34rem; }
.rn-finder input:focus { outline: 2px solid var(--rn-accent); outline-offset: 1px; }
.rn-docs { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); gap: 0.625rem; max-height: 34rem; overflow-y: auto; padding: 0.125rem; margin-top: 0.25rem; }
.rn-doc { display: grid; grid-template-columns: 1.5rem minmax(0, 1fr); gap: 0.75rem; align-items: start; padding: 0.75rem 0.875rem; border: 1px solid var(--rn-line); border-radius: var(--rn-radius); background: var(--rn-bg); }
.rn-flag { width: 1.5rem; height: 1.125rem; object-fit: cover; margin-top: 0.1875rem; box-shadow: 0 0 0 1px var(--rn-line); border-radius: 2px; }
.rn-flag--none { display: block; background: var(--rn-line); }
.rn-doc-body { display: grid; gap: 0.125rem; min-width: 0; }
.rn-doc-name { font-weight: 700; color: var(--rn-ink); line-height: 1.35; }
.rn-doc-facts { display: flex; align-items: center; gap: 0.375rem; flex-wrap: wrap; font-size: 0.8125rem; color: var(--rn-muted); }
.rn-doc-code { font-size: 0.75rem; font-weight: 600; color: var(--rn-accent-ink); letter-spacing: 0.02em; }
.rn-ico { display: inline-block; width: 1rem; height: 1rem; flex: none; background: var(--rn-ink);
  -webkit-mask: var(--rn-ico) center / contain no-repeat; mask: var(--rn-ico) center / contain no-repeat; }
.rn-ico--passport { --rn-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='2' width='14' height='20' rx='2'/%3E%3Ccircle cx='12' cy='10' r='3.5'/%3E%3Cpath d='M9 17h6'/%3E%3C/svg%3E"); }
.rn-ico--licence { --rn-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 11l2-5h10l2 5'/%3E%3Crect x='3' y='11' width='18' height='6' rx='2'/%3E%3Cpath d='M6 17v2M18 17v2'/%3E%3Ccircle cx='7.5' cy='14' r='.8'/%3E%3Ccircle cx='16.5' cy='14' r='.8'/%3E%3C/svg%3E"); }
.rn-ico--card { --rn-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='5' width='20' height='14' rx='2'/%3E%3Ccircle cx='8' cy='11' r='2'/%3E%3Cpath d='M5 16c.6-1.6 1.7-2.4 3-2.4s2.4.8 3 2.4M14 10h5M14 14h4'/%3E%3C/svg%3E"); }
.rn-ico--permit { --rn-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11l9-7 9 7'/%3E%3Cpath d='M5 10v10h14V10'/%3E%3Cpath d='M10 20v-5h4v5'/%3E%3C/svg%3E"); }
.rn-ico--visa { --rn-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='3'/%3E%3Cpath d='M8 12l3 3 5-6'/%3E%3C/svg%3E"); }
.rn-ico--travel { --rn-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 16l20-8-3 9-6-2-3 4v-5'/%3E%3C/svg%3E"); }
.rn-ico--other { --rn-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2h9l4 4v16H6z'/%3E%3Cpath d='M14 2v5h5M9 13h7M9 17h5'/%3E%3C/svg%3E"); }

@media (max-width: 50rem) { .rn-h1 { font-size: 1.75rem; } }

/* "Subscribe (RSS)" link above each Release notes page (release-feeds.mjs) */
.rn-rss { margin: 0 0 0.75rem; font-size: 0.875rem; }
/* quiet and grey, as GBG Go's RSS link; the icon is Lucide's (Starlight: .gbg-icon) */
.rn-rss a { display: inline-flex; align-items: center; gap: 0.4rem; font-weight: 500; color: var(--sl-color-gray-3, #6b6b7b); text-decoration: none; }
.rn-rss a:hover { color: var(--sl-color-white, #1a1a2e); }
.rn-rss svg, .rn-rss .gbg-icon { flex: none; }