/* ==========================================================================
   Digital Boutiques — "Gem" brand layer (rebrand v1, staging only)
   Sits on top of Boutique Kit (tokens/components) + site.css.
   Palette from Brandan's sprite sheet: charcoal base, chrome-gold, sapphire.
   - Dark tokens apply to .site-header, .site-footer and body.gem (public pages).
   - Private/admin pages keep the light kit body but get the dark header/footer.
   - All motion is removed under prefers-reduced-motion.
   Contrast (on --gem-bg #121215): ink 16.6:1 · text 12.4:1 · muted 7.6:1 · gold 10.3:1
   ========================================================================== */

:root {
  --gem-bg: #121215;
  --gem-bg-2: #1a1a20;
  --gem-bg-3: #16161b;
  --gem-line: #3b3832;
  --gem-line-gold: rgba(214, 178, 110, .38);
  --gem-ink: #f3ecdc;
  --gem-text: #d9d3c5;
  --gem-muted: #aaa496;
  --gem-gold: #e3c27a;
  --gem-gold-bright: #d4a94f;
  --gem-gold-deep: #8f6828;
  --gem-sapphire: #1f2877;
  --gem-sapphire-2: #2c3aa8;
  --gem-sapphire-text: #a9b6ff;
  --gem-gold-grad: linear-gradient(180deg, #f6e2a6 0%, #dcb663 38%, #9a7230 56%, #e8c87e 82%, #b48a3e 100%);
  --gem-gold-grad-h: linear-gradient(90deg, #b48a3e, #f6e2a6 50%, #b48a3e);
  --gem-marble: url("/assets/brand/marble-sapphire.webp");
  --gem-frame: url("/assets/brand/frame-ornate.svg");
}

/* --- Dark token scope ---------------------------------------------------- */
body.gem, .site-header, .site-footer {
  --bk-navy: var(--gem-ink);
  --bk-navy-deep: #0b0b0e;
  --bk-ink-soft: var(--gem-text);
  --bk-muted: var(--gem-muted);
  --bk-gold: var(--gem-gold);
  --bk-gold-bright: var(--gem-gold-bright);
  --bk-eucalypt: #9fd3bb;
  --bk-eucalypt-soft: #9fd3bb;
  --bk-ochre: #e6ad78;
  --bk-sand: #e9dfc9;
  --bk-bg: var(--gem-bg);
  --bk-bg-elev: var(--gem-bg-2);
  --bk-bg-band: var(--gem-bg-3);
  --bk-line: var(--gem-line);
  --bk-ok: #8fdcb2;
  --bk-err: #ffaa9e;
  --bk-shadow: 0 14px 40px rgba(0, 0, 0, .45);
  --bk-icon-accent: var(--gem-gold);
  --warn-bg: rgba(227, 194, 122, .08);
  --warn-border: rgba(227, 194, 122, .42);
  --focus: var(--gem-gold);
  /* staging aliases (declared at :root in tokens.css) must be re-pointed in this scope */
  --navy: var(--gem-ink);
  --navy-deep: #0b0b0e;
  --ink: var(--gem-ink);
  --ink-soft: var(--gem-text);
  --muted: var(--gem-muted);
  --gold: var(--gem-gold);
  --accent: var(--gem-gold-bright);
  --eucalypt: #9fd3bb;
  --ochre: #e6ad78;
  --sand: #2a2722;
  --bg: var(--gem-bg);
  --bg-elev: var(--gem-bg-2);
  --bg-band: var(--gem-bg-3);
  --bg-card: var(--gem-bg-2);
  --line: var(--gem-line);
  --line-fine: var(--gem-line);
  --ok: #8fdcb2;
  --err: #ffaa9e;
  --warn: var(--gem-gold);
  --shadow: 0 14px 40px rgba(0, 0, 0, .45);
  color-scheme: dark;
}
body.gem { background: var(--gem-bg); color: var(--gem-text); }
body.gem ::selection { background: rgba(212, 169, 79, .45); color: #fff; }
body.gem a { color: var(--gem-gold); }
body.gem a:hover { color: var(--gem-ink); }
body.gem :focus-visible, .site-header :focus-visible, .site-footer :focus-visible {
  outline: 2px solid var(--gem-gold); outline-offset: 3px;
}
body.gem h1, body.gem h2, body.gem h3 { color: var(--gem-ink); }

/* --- Skip link / badges ---------------------------------------------------- */
.skip, .bk-skip { background: var(--gem-gold) !important; color: #121215 !important; }
body.gem .bk-badge, body.gem .badge, body.gem .bk-example, body.gem .example-badge {
  background: var(--gem-sapphire-2); color: #fff;
}
body.gem .bk-badge--outline { background: transparent; color: var(--gem-gold); border-color: var(--gem-gold); }

/* --- Header -------------------------------------------------------------- */
.site-header {
  background: rgba(14, 14, 17, .94);
  border-bottom: 1px solid transparent;
  border-image: var(--gem-gold-grad-h) 1;
  color: var(--gem-text);
}
.site-header .logo--gem { gap: .6rem; padding: .15rem 0; }
.site-header .logo--gem img { display: block; width: auto; height: 46px; }
@media (min-width: 900px) { .site-header .logo--gem img { height: 52px; } }
.site-header .nav-links a { color: var(--gem-text); }
.site-header .nav-links a:hover, .site-header .nav-links a[aria-current="page"] {
  color: var(--gem-ink); border-color: var(--gem-gold-bright);
}
.site-header .nav-cta {
  background: var(--gem-gold-grad) !important; color: #15151a !important;
  border-radius: 6px !important; box-shadow: inset 0 0 0 1px rgba(90, 68, 22, .55);
}
.site-header .nav-cta:hover { filter: brightness(1.08); }
@media (max-width: 880px) {
  .site-header .nav-panel { background: #15151a; border-bottom: 1px solid var(--gem-line-gold); }
}
.db-preview-ribbon { background: #0b0b0e !important; border-bottom: 1px solid var(--gem-line-gold); }

/* --- Footer -------------------------------------------------------------- */
.site-footer {
  background: #0c0c0f; color: var(--gem-text);
  border-top: 1px solid transparent; border-image: var(--gem-gold-grad-h) 1;
}
.site-footer h2 { color: var(--gem-ink); }
.site-footer a { color: var(--gem-text); }
.site-footer a:hover { color: var(--gem-gold); }
.site-footer .legal-entity, .site-footer .fineprint { color: var(--gem-muted); }
.site-footer .footer-wordmark img { width: auto; height: 64px; }

/* --- Gem buttons (sapphire marble + gold bevel). Real text, any label. --- */
.gem-btn, .bk-btn--gold, .btn-gold, .bk-btn--primary, .btn-primary {
  position: relative; isolation: isolate;
  display: inline-flex; align-items: center; justify-content: center; gap: .45rem;
  min-height: 48px; padding: .75rem 1.5rem;
  font-family: var(--bk-font-body); font-weight: 700; font-size: 1rem; letter-spacing: .01em;
  color: #fbeec8 !important; text-decoration: none; text-shadow: 0 1px 0 rgba(0, 0, 0, .55);
  background: transparent !important; border: 0 !important; border-radius: 0 !important;
  cursor: pointer;
  transition: transform .18s ease, filter .18s ease;
}
.gem-btn::before, .bk-btn--gold::before, .btn-gold::before, .bk-btn--primary::before, .btn-primary::before {
  content: ""; position: absolute; inset: 0; z-index: -2;
  background: var(--gem-gold-grad);
  clip-path: polygon(12px 0, calc(100% - 12px) 0, 100% 12px, 100% calc(100% - 12px), calc(100% - 12px) 100%, 12px 100%, 0 calc(100% - 12px), 0 12px);
  box-shadow: 0 6px 18px rgba(0, 0, 0, .35);
}
.gem-btn::after, .bk-btn--gold::after, .btn-gold::after, .bk-btn--primary::after, .btn-primary::after {
  content: ""; position: absolute; inset: 3px; z-index: -1;
  background:
    url("/assets/brand/sparkle-gold-48.webp") no-repeat right 6px top 3px / 0 0,
    linear-gradient(180deg, rgba(255, 255, 255, .12), rgba(255, 255, 255, 0) 45%, rgba(0, 0, 0, .22)),
    var(--gem-marble) center / cover,
    var(--gem-sapphire);
  clip-path: polygon(10px 0, calc(100% - 10px) 0, 100% 10px, 100% calc(100% - 10px), calc(100% - 10px) 100%, 10px 100%, 0 calc(100% - 10px), 0 10px);
  transition: background-size .2s ease;
}
.gem-btn:hover, .bk-btn--gold:hover, .btn-gold:hover, .bk-btn--primary:hover, .btn-primary:hover {
  color: #fff !important; filter: brightness(1.1); transform: translateY(-1px);
}
.gem-btn:hover::after, .bk-btn--gold:hover::after, .btn-gold:hover::after,
.bk-btn--primary:hover::after, .btn-primary:hover::after {
  background-size: 14px 14px, auto, cover, auto;
}
.gem-btn:focus-visible, .bk-btn--gold:focus-visible, .btn-gold:focus-visible,
.bk-btn--primary:focus-visible, .btn-primary:focus-visible {
  outline: 3px solid var(--gem-gold); outline-offset: 4px;
}
.gem-btn:disabled, .bk-btn--gold:disabled, .bk-btn--primary:disabled { filter: grayscale(.6) brightness(.8); cursor: not-allowed; transform: none; }
.bk-btn--sm.bk-btn--gold, .btn-sm.btn-primary { min-height: 40px; padding: .5rem 1rem; font-size: .9rem; }

/* Secondary (ghost) on dark pages */
body.gem .bk-btn--ghost, body.gem .btn-ghost, body.gem .btn-secondary {
  color: var(--gem-ink); border: 1.5px solid var(--gem-line-gold); border-radius: 6px; background: rgba(255, 255, 255, .02);
}
body.gem .bk-btn--ghost:hover, body.gem .btn-ghost:hover, body.gem .btn-secondary:hover {
  background: rgba(227, 194, 122, .12); color: #fff; border-color: var(--gem-gold);
}
body.gem .bk-link { color: var(--gem-gold); }

/* --- Forms on dark ------------------------------------------------------- */
body.gem input[type="text"], body.gem input[type="email"], body.gem input[type="search"],
body.gem input[type="url"], body.gem input[type="tel"], body.gem input[type="number"],
body.gem input[type="password"], body.gem input:not([type]), body.gem select, body.gem textarea {
  background: #0e0e12; color: var(--gem-ink); border: 1.5px solid #5b5446;
}
body.gem input::placeholder, body.gem textarea::placeholder { color: #8f897c; opacity: 1; }
body.gem input:focus, body.gem select:focus, body.gem textarea:focus {
  border-color: var(--gem-gold); box-shadow: 0 0 0 3px rgba(227, 194, 122, .25);
}
body.gem input[type="checkbox"], body.gem input[type="radio"] { accent-color: var(--gem-gold-bright); }
body.gem .bk-search__field { background: #0e0e12; border-color: #5b5446; }
body.gem .bk-search__field input { color: var(--gem-ink); }
body.gem .bk-search__field:focus-within { border-color: var(--gem-gold); box-shadow: 0 0 0 3px rgba(227, 194, 122, .25); }

/* --- Cards / panels ------------------------------------------------------ */
body.gem .bk-card, body.gem .card, body.gem .step, body.gem .audience-card,
body.gem .domain-card, body.gem .pkg-card, body.gem .form-card, body.gem .founder-card, body.gem .wiz {
  background: linear-gradient(180deg, #1c1c23, #16161b); border-color: var(--gem-line);
}
body.gem .bk-card--feature { border-top: 2px solid var(--gem-gold-bright); }
body.gem section.band, body.gem .bk-band { background: #16161b; border-color: #26252a; }
body.gem .bk-notice, body.gem .requirements, body.gem .notice-panel { background: #17171d; }
body.gem .bk-req { background: #17171d; border-color: var(--gem-line-gold); }
body.gem .bk-req__icon { background: var(--gem-sapphire-2); }
body.gem .bk-steps__num { background: #0e0e12; border-color: var(--gem-gold-bright); color: var(--gem-gold); }
body.gem .bk-poa, body.gem .poa-block { color: var(--gem-ink); background: rgba(212, 169, 79, .1); }
body.gem .wiz-progress li { background: #0e0e12; }
body.gem .wiz-progress li.is-current { background: #1f2877; color: #fff; border-color: var(--gem-gold); }
body.gem .dd-mock { background: #1a1a20; }
body.gem .dd-mock--store .sign { background: var(--gem-sapphire); color: #fbeec8; }
body.gem .bk-toast { background: #26262e; }
body.gem .bk-alert--info { border-color: var(--gem-sapphire-text); background: rgba(169, 182, 255, .08); color: var(--gem-ink); }

/* Domain swing-tags → gem cards */
body.gem .bk-tag-card {
  background: linear-gradient(165deg, #1d2050 0%, #15162a 55%, #141418 100%);
  border: 1.5px solid var(--gem-gold-bright);
  color: var(--gem-ink);
  box-shadow: 0 12px 30px rgba(0, 0, 0, .45), inset 0 1px 0 rgba(255, 255, 255, .06);
}
body.gem .bk-tag-card:hover { color: var(--gem-ink); box-shadow: 0 16px 36px rgba(0, 0, 0, .55), 0 0 0 1px rgba(246, 226, 166, .35); }
body.gem .bk-tag-card__hole { border-color: var(--gem-gold-bright); background: var(--gem-bg); box-shadow: inset 0 0 0 2px #2a2a33; }
body.gem .bk-tag-card__name { color: var(--gem-ink); }
body.gem .bk-tag-card__cat-label { color: var(--gem-muted); }
body.gem .bk-tag-card__cat { color: var(--gem-text); }
body.gem .bk-tag-card__poa { color: var(--gem-gold); }

/* Glossary tooltips: dark chip with gold edge */
body.gem .bk-term__tip, .site-footer .bk-term__tip {
  background: #23232b; color: var(--gem-ink); border: 1px solid var(--gem-line-gold);
  box-shadow: 0 12px 30px rgba(0, 0, 0, .55);
}
body.gem .bk-term__tip::after { border-top-color: #23232b; }
body.gem .bk-term__tip.bk-term__tip--below::after { border-top-color: transparent; border-bottom-color: #23232b; }
body.gem .bk-term { text-decoration-color: var(--gem-gold); }
body.gem .bk-term:hover, body.gem .bk-term:focus-visible { text-decoration-color: var(--gem-ink); }
body.gem .bk-term__more { color: var(--gem-gold); }

/* Kit line-art (navy SVGs) → readable cream on dark */
body.gem .bk-seal, body.gem .domain-seal, body.gem .bk-spot, body.gem .mag-divider, body.gem .bk-divider,
body.gem .trust-strip img, body.gem .bk-trust img, body.gem .bk-icon, body.gem .bk-req__foot img,
body.gem .hero-script img, body.gem .bk-steps__arrow, body.gem img.seal-svg, body.gem .seal-badge img {
  filter: brightness(0) invert(.9) sepia(.35) saturate(1.6) hue-rotate(-8deg);
}
body.gem .bk-grain { display: none; }

/* --- Brand helpers ------------------------------------------------------- */
.gem-diamond { display: block; width: 56px; height: auto; flex: none; }
.gem-diamond--sm { width: 36px; }
.gem-marker { display: inline-flex; align-items: center; gap: .55rem; }
.gem-marker img { width: 28px; height: auto; }
.gem-kicker {
  display: inline-flex; align-items: center; gap: .5rem;
  font-size: .78rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--gem-gold);
}
.gem-sparkle { position: absolute; pointer-events: none; user-select: none; }

/* Ornate frame (9-slice SVG). Use on a wrapper; content sits inside. */
.gem-frame {
  position: relative; display: inline-block;
  border: 22px solid transparent;
  border-image: var(--gem-frame) 60 / 22px / 0 stretch;
  background: #0d0d11; background-clip: padding-box;
}
.gem-frame > img, .gem-frame picture img { display: block; }

/* Decorative 'launching soon' bar — no percentage implied */
.gem-progress {
  position: relative; height: 18px; width: min(100%, 300px);
  border-radius: 3px; background: #0d0d11;
  box-shadow: inset 0 0 0 2px #c9a24f, inset 0 0 0 3px #5a4416;
  overflow: hidden;
}
.gem-progress::before {
  content: ""; position: absolute; inset: 4px auto 4px 4px; width: 62%;
  background:
    repeating-linear-gradient(90deg, rgba(0,0,0,0) 0 10px, rgba(0,0,0,.22) 10px 12px),
    var(--gem-gold-grad);
  border-radius: 1px;
}
.gem-progress::after {
  content: ""; position: absolute; inset: 4px auto 4px 4px; width: 62%;
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,.55) 50%, transparent 100%);
  background-size: 40% 100%; background-repeat: no-repeat;
  animation: gem-shimmer 3.2s ease-in-out infinite;
}
@keyframes gem-shimmer { 0% { background-position: -60% 0; } 60%, 100% { background-position: 160% 0; } }

/* One tasteful glitch: a brief RGB split on the hero logo, once, after load */
.gem-glitch-once { animation: gem-glitch .7s steps(2, end) .6s 1 both; }
@keyframes gem-glitch {
  0%   { filter: none; transform: none; }
  20%  { filter: drop-shadow(3px 0 0 rgba(255, 40, 120, .55)) drop-shadow(-3px 0 0 rgba(40, 200, 255, .55)); transform: translateX(-2px); }
  40%  { filter: drop-shadow(-2px 0 0 rgba(255, 40, 120, .45)) drop-shadow(2px 0 0 rgba(40, 200, 255, .45)); transform: translateX(2px) skewX(-2deg); }
  60%  { filter: none; transform: none; }
  100% { filter: none; transform: none; }
}

/* Sparkle twinkle accent */
.gem-twinkle { animation: gem-twinkle 3.6s ease-in-out infinite; transform-origin: center; }
@keyframes gem-twinkle { 0%, 100% { opacity: .55; transform: scale(.85) rotate(0deg); } 50% { opacity: 1; transform: scale(1.05) rotate(12deg); } }

/* Optional custom gold cursor: desktop pointers only; text fields keep I-beam, links keep pointer */
@media (hover: hover) and (pointer: fine) and (prefers-contrast: no-preference) {
  body.gem-cursor { cursor: url("/assets/brand/cursor-gold-32.png") 2 1, auto; }
  body.gem-cursor a, body.gem-cursor button, body.gem-cursor summary, body.gem-cursor label,
  body.gem-cursor select, body.gem-cursor [role="button"] { cursor: pointer; }
  body.gem-cursor input, body.gem-cursor textarea, body.gem-cursor p, body.gem-cursor li,
  body.gem-cursor h1, body.gem-cursor h2, body.gem-cursor h3 { cursor: auto; }
  body.gem-cursor input[type="checkbox"], body.gem-cursor input[type="radio"], body.gem-cursor input[type="submit"] { cursor: pointer; }
}
@media (forced-colors: active) {
  body.gem-cursor { cursor: auto; }
  .gem-btn::before, .gem-btn::after, .bk-btn--gold::before, .bk-btn--gold::after,
  .bk-btn--primary::before, .bk-btn--primary::after { display: none; }
  .gem-btn, .bk-btn--gold, .bk-btn--primary { border: 2px solid ButtonText !important; }
}

/* Reduced motion: no animation, no hover movement */
@media (prefers-reduced-motion: reduce) {
  .gem-glitch-once, .gem-twinkle, .gem-progress::after { animation: none !important; }
  .gem-btn, .bk-btn--gold, .bk-btn--primary, .btn-primary, .btn-gold { transition: none !important; }
  .gem-btn:hover, .bk-btn--gold:hover, .bk-btn--primary:hover, .btn-primary:hover, .btn-gold:hover { transform: none; }
  .gem-btn::after, .bk-btn--gold::after, .bk-btn--primary::after { transition: none !important; }
}

/* Storefront home hero: founder photo in the ornate frame */
body.gem .hero-editorial { background: radial-gradient(50rem 26rem at 20% 0%, rgba(44, 58, 168, .25), transparent 60%), var(--gem-bg); border-bottom-color: #26252a; }
body.gem .hero-editorial .mag-kicker { color: var(--gem-gold); }
body.gem .hero-editorial h1 .soft { color: var(--gem-gold); }
.hero-portrait-wrap--gem { position: relative; display: flex; justify-content: center; max-width: none !important; padding: 1rem 0 2rem; }
.hero-portrait-wrap--gem .gem-frame { box-shadow: 0 18px 40px rgba(0, 0, 0, .55), 0 0 60px rgba(44, 58, 168, .25); }
.hero-portrait-wrap--gem img { mix-blend-mode: normal !important; filter: none !important; }
.hero-portrait-wrap--gem picture img { width: 180px; height: 225px; object-fit: cover; object-position: center top; }
@media (min-width: 900px) { .hero-portrait-wrap--gem picture img { width: 240px; height: 300px; } .hero-portrait-wrap--gem { justify-content: flex-end; } }
.hero-portrait-wrap--gem > .gem-sparkle { position: absolute; }
@media (min-width: 900px) { .hero-portrait-wrap--gem > .gem-sparkle { right: 6px !important; } }
@media (max-width: 899.98px) { .hero-portrait-wrap--gem { width: fit-content; margin-inline: auto; } }

/* Storefront surfaces that hard-code #fff in site.css / wizard.css */
body.gem .dd-see__input input, body.gem .dd-mock, body.gem .dd-tier, body.gem .wk-card, body.gem .wiz-option {
  background: #17171d; color: var(--gem-text);
}
body.gem .dd-tier { border-color: var(--gem-line); }
body.gem .wiz-option:has(input:checked) { background: rgba(44, 58, 168, .28); border-color: var(--gem-gold); }
body.gem .wiz-progress li[aria-current="step"] { background: var(--gem-sapphire); color: #fff; border-color: var(--gem-gold); }
body.gem .wiz-noscript { color: var(--gem-ink); }
body.gem .wiz-result.is-yes { background: rgba(143, 220, 178, .08); }
body.gem .wiz-result.is-no { background: rgba(230, 173, 120, .08); }
body.gem .placeholder-slot { background: #17171d; }

/* ==========================================================================
   Rebrand v2 components (sprites-v2: Aussie set, service icons, UI decor)
   All decoration is aria-hidden; every label is real HTML text.
   ========================================================================== */
:root {
  --gem-divider: url("/assets/brand/divider-diamond.svg");
  --gem-corner: url("/assets/brand/corner-ornament.svg");
  --gem-grid: url("/assets/brand/pattern-gold-grid.svg");
  --gem-octagon: polygon(30% 0, 70% 0, 100% 30%, 100% 70%, 70% 100%, 30% 100%, 0 70%, 0 30%);
}

/* Section divider: gold rule with a sapphire diamond centre */
.gem-divider { display: block; width: min(calc(100% - 2rem), 640px); height: 48px; margin: 0 auto; background: var(--gem-divider) center / contain no-repeat; }

/* Service icons (sapphire marble + gold bevel) */
.gem-icon { display: block; width: 52px; height: auto; flex: none; filter: drop-shadow(0 6px 10px rgba(0, 0, 0, .45)); }

/* Live-text badge chips (NEW / PREMIUM / POA style) */
.gem-chip {
  display: inline-flex; align-items: center; gap: .3rem; padding: .18rem .55rem; border-radius: 4px;
  font-size: .74rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; line-height: 1.35;
  color: #fbeec8; text-shadow: 0 1px 0 rgba(0, 0, 0, .6);
  background: linear-gradient(180deg, rgba(255, 255, 255, .14), rgba(0, 0, 0, .25)), var(--gem-marble) center / cover, var(--gem-sapphire);
  border: 1px solid var(--gem-gold-bright); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .4), 0 2px 6px rgba(0, 0, 0, .35);
}
.gem-chip--gold { color: #1a1408; text-shadow: 0 1px 0 rgba(255, 255, 255, .35); background: var(--gem-gold-grad); border-color: #5a4416; }
.gem-chip .bk-term { color: inherit; text-decoration-color: currentColor; }

/* Step medallion (octagon: gold rim, sapphire marble face, live number) */
.gem-medal {
  --s: 2.1rem; position: relative; isolation: isolate; display: inline-grid; place-items: center; flex: none;
  width: var(--s); height: var(--s); font-family: var(--bk-font-display); font-weight: 700; font-size: calc(var(--s) * .48);
  color: #fbeec8; text-shadow: 0 1px 0 rgba(0, 0, 0, .65); line-height: 1;
}
.gem-medal::before, .gem-medal::after { content: ""; position: absolute; clip-path: var(--gem-octagon); }
.gem-medal::before { inset: 0; z-index: -2; background: var(--gem-gold-grad); box-shadow: 0 4px 10px rgba(0, 0, 0, .4); }
.gem-medal::after { inset: 3px; z-index: -1; background: linear-gradient(180deg, rgba(255, 255, 255, .16), rgba(0, 0, 0, .28)), var(--gem-marble) center / cover, var(--gem-sapphire); }

/* "Australian owned · Brisbane" pill with the flag pin */
.gem-au {
  display: inline-flex; align-items: center; gap: .55rem; padding: .3rem .8rem .3rem .4rem; margin: 0;
  border: 1px solid var(--gem-line-gold); border-radius: 999px; background: rgba(31, 40, 119, .28);
  color: var(--gem-ink); font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; line-height: 1.3;
}
.gem-au img { display: block; width: 34px; height: auto; flex: none; }

/* Gold corner ornaments on a framed panel (top-left + bottom-right) */
.gem-corners { position: relative; }
.gem-corners::before, .gem-corners::after {
  content: ""; position: absolute; width: 54px; height: 54px; pointer-events: none;
  background: var(--gem-corner) center / contain no-repeat;
}
.gem-corners::before { top: -9px; left: -9px; }
.gem-corners::after { right: -9px; bottom: -9px; transform: rotate(180deg); }

/* Subtle gold pixel-grid background */
.gem-grid-bg { background-image: var(--gem-grid); background-size: 48px 48px; }

/* Southern Cross accent (static, decorative) */
.gem-cross { position: absolute; pointer-events: none; user-select: none; height: auto; opacity: .34; z-index: 0; }

/* --- Storefront (shared header/footer/home) ------------------------------ */
.site-header .nav-links a { transition: color .15s ease, border-color .15s ease; }
.site-footer .footer-au { display: flex; flex-wrap: wrap; align-items: center; gap: .9rem 1.25rem; margin: 1rem 0 0; }
.site-footer .footer-map { display: block; width: 120px; height: auto; opacity: .95; }
body.gem .trust-strip .gem-au { color: var(--gem-ink); font-size: .74rem; }
body.gem .trust-strip .gem-au img { height: auto; width: 32px; }
body.gem .promise .card { display: flex; flex-direction: column; gap: .2rem; transition: border-color .18s ease, box-shadow .18s ease; }
body.gem .promise .card .gem-icon { width: 46px; margin: 0 0 .55rem; }
body.gem .promise .card:hover { border-color: var(--gem-line-gold); box-shadow: 0 10px 28px rgba(0, 0, 0, .4); }
body.gem .step { padding-top: 1.35rem; }
body.gem .step::before, body.gem .step::after { clip-path: var(--gem-octagon); position: absolute; top: .9rem; right: 1rem; width: 2.3rem; height: 2.3rem; }
body.gem .step::before { content: ""; background: var(--gem-gold-grad); }
body.gem .step::after {
  content: counter(step); display: grid; place-items: center; box-sizing: border-box; margin: 3px; width: calc(2.3rem - 6px); height: calc(2.3rem - 6px);
  font-family: var(--bk-font-display); font-weight: 700; font-size: 1.05rem; color: #fbeec8; text-shadow: 0 1px 0 rgba(0, 0, 0, .65);
  background: linear-gradient(180deg, rgba(255, 255, 255, .16), rgba(0, 0, 0, .28)), var(--gem-marble) center / cover, var(--gem-sapphire);
}
body.gem .step h3 { padding-right: 3rem; }
body.gem .domains-teaser-grid a { transition: border-color .18s ease, transform .18s ease, color .18s ease; }
body.gem .domains-teaser-grid a:hover { border-color: var(--gem-gold); transform: translateY(-2px); color: var(--gem-ink); }
.gem-divider--home { margin-block: 1.75rem; }

@media (prefers-reduced-motion: reduce) {
  body.gem .domains-teaser-grid a, body.gem .promise .card, .site-header .nav-links a { transition: none !important; }
  body.gem .domains-teaser-grid a:hover { transform: none; }
}
@media (forced-colors: active) {
  .gem-medal::before, .gem-medal::after, .gem-corners::before, .gem-corners::after, .gem-divider { display: none; }
  .gem-medal { border: 2px solid CanvasText; }
}

/* --- Acknowledgement of Country band (flags in true colours) ------------- */
.gem-aoc {
  position: relative; padding: 1.6rem 0; color: var(--gem-text);
  background: linear-gradient(180deg, rgba(14,14,18,.92), rgba(18,18,21,.96)), url("/assets/brand/pattern-gold-grid.svg") repeat, #0e0e12;
  border-top: 1px solid #26252a;
}
.gem-aoc-inner { display: flex; align-items: center; gap: 1.1rem 1.4rem; flex-wrap: wrap; }
.gem-aoc-flags { display: flex; gap: .5rem; flex: none; }
.gem-aoc-flags img { width: 68px; height: 45px; display: block; border: 1px solid rgba(243,236,220,.35); }
.gem-aoc-copy { flex: 1 1 20rem; min-width: 0; }
.gem-aoc-eyebrow { margin: 0 0 .35rem; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--gem-gold); }
.gem-aoc-text { margin: 0; font-family: var(--bk-font-display, Georgia, serif); font-size: 1rem; line-height: 1.55; color: var(--gem-ink); max-width: 52rem; }

/* ==========================================================================
   FX pass (coming-soon): periodic logo glitch, hover sprite swaps, ambient motion.
   transform/opacity only (clip-path for the brief glitch slices), all decoration
   aria-hidden, everything off under prefers-reduced-motion. JS: /assets/js/gem-fx.js
   ========================================================================== */
:root { --gem-logo-img: url("/assets/brand/logo-560.webp"); }

/* Logo: layered glitch + periodic gold sheen */
.gem-logo { position: relative; display: inline-block; line-height: 0; max-width: 100%; }
.gem-logo__fx, .gem-logo__fx > span { position: absolute; inset: 0; pointer-events: none; }
.gem-logo__fx { z-index: 1; }
.gem-logo__c, .gem-logo__sheen {
  -webkit-mask: var(--gem-logo-img) center / 100% 100% no-repeat; mask: var(--gem-logo-img) center / 100% 100% no-repeat;
}
.gem-logo__c { opacity: 0; mix-blend-mode: screen; }
.gem-logo__c--gold { background: #f3cf75; }
.gem-logo__c--blue { background: #3d6bff; }
.gem-logo__slice { opacity: 0; background: var(--gem-logo-img) center / 100% 100% no-repeat; }
.gem-logo__err {
  inset: auto 3% 2% auto !important; width: 30%; aspect-ratio: 192 / 40; opacity: 0;
  background: url("/assets/brand/glitch-error-192.webp") center / contain no-repeat;
}
.gem-logo__sheen { overflow: hidden; }
.gem-logo__sheen::before {
  content: ""; position: absolute; top: -10%; bottom: -10%; left: 0; width: 30%;
  background: linear-gradient(100deg, rgba(255, 243, 196, 0) 0%, rgba(255, 243, 196, .55) 50%, rgba(255, 243, 196, 0) 100%);
  transform: translateX(-130%) skewX(-18deg);
  animation: gem-logo-sheen 10s ease-in-out 3s infinite;
}
@keyframes gem-logo-sheen { 0% { transform: translateX(-130%) skewX(-18deg); } 14%, 100% { transform: translateX(360%) skewX(-18deg); } }
/* One burst = layers on once, slices jump, layers off once (<= 1 flash per burst; bursts >= 4 s apart) */
.gem-logo.is-glitching .gem-logo__c--gold { animation: gem-gl-gold .44s steps(1, end) 1; }
.gem-logo.is-glitching .gem-logo__c--blue { animation: gem-gl-blue .44s steps(1, end) 1; }
.gem-logo.is-glitching .gem-logo__slice { animation: gem-gl-slice .44s steps(1, end) 1; }
.gem-logo.is-glitching.is-err .gem-logo__err { animation: gem-gl-err .44s steps(1, end) 1; }
@keyframes gem-gl-gold {
  0%   { opacity: .7; transform: translate(-4px, 0);    clip-path: inset(8% 0 58% 0); }
  25%  { opacity: .7; transform: translate(3px, 1px);   clip-path: inset(46% 0 22% 0); }
  50%  { opacity: .7; transform: translate(-3px, 0);    clip-path: inset(70% 0 4% 0); }
  75%  { opacity: .7; transform: translate(4px, -1px);  clip-path: inset(0 0 74% 0); }
  100% { opacity: 0; }
}
@keyframes gem-gl-blue {
  0%   { opacity: .65; transform: translate(4px, 0);   clip-path: inset(30% 0 40% 0); }
  25%  { opacity: .65; transform: translate(-3px, 0);  clip-path: inset(0 0 66% 0); }
  50%  { opacity: .65; transform: translate(3px, 1px); clip-path: inset(56% 0 18% 0); }
  75%  { opacity: .65; transform: translate(-4px, 0);  clip-path: inset(20% 0 52% 0); }
  100% { opacity: 0; }
}
@keyframes gem-gl-slice {
  0%   { opacity: 1; transform: translateX(7px);  clip-path: inset(52% 0 34% 0); }
  25%  { opacity: 1; transform: translateX(-9px); clip-path: inset(14% 0 72% 0); }
  50%  { opacity: 1; transform: translateX(5px);  clip-path: inset(78% 0 8% 0); }
  75%  { opacity: 1; transform: translateX(-6px); clip-path: inset(36% 0 50% 0); }
  100% { opacity: 0; }
}
@keyframes gem-gl-err {
  0%   { opacity: 0; }
  25%  { opacity: .9; transform: translateX(-3px); }
  50%  { opacity: .9; transform: translateX(2px); }
  75%  { opacity: .9; transform: none; }
  100% { opacity: 0; }
}

/* Hero: drifting gold pixels */
.cs-motes { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; }
.cs-motes i {
  position: absolute; bottom: -8px; left: 10%; width: 3px; height: 3px; opacity: 0;
  background: #f0d28a; box-shadow: 0 0 6px rgba(246, 226, 166, .7);
  animation: gem-mote 28s linear infinite;
}
.cs-motes i:nth-child(1) { left: 6%;  animation-duration: 31s; animation-delay: -4s; }
.cs-motes i:nth-child(2) { left: 18%; animation-duration: 26s; animation-delay: -15s; width: 2px; height: 2px; }
.cs-motes i:nth-child(3) { left: 31%; animation-duration: 34s; animation-delay: -9s; }
.cs-motes i:nth-child(4) { left: 44%; animation-duration: 29s; animation-delay: -22s; width: 2px; height: 2px; }
.cs-motes i:nth-child(5) { left: 57%; animation-duration: 36s; animation-delay: -2s; }
.cs-motes i:nth-child(6) { left: 69%; animation-duration: 27s; animation-delay: -18s; width: 4px; height: 4px; }
.cs-motes i:nth-child(7) { left: 82%; animation-duration: 33s; animation-delay: -11s; width: 2px; height: 2px; }
.cs-motes i:nth-child(8) { left: 93%; animation-duration: 30s; animation-delay: -25s; }
@keyframes gem-mote {
  0%   { opacity: 0; transform: translate3d(0, 0, 0); }
  12%  { opacity: .55; }
  85%  { opacity: .35; }
  100% { opacity: 0; transform: translate3d(24px, -520px, 0); }
}

/* Hero: Southern Cross stars twinkle (staggered 4-8 s) */
.cs-cross-glints { position: absolute; pointer-events: none; z-index: 0; width: 74px; aspect-ratio: 240 / 301; top: .6rem; right: .6rem; }
@media (min-width: 900px) { .cs-cross-glints { width: 118px; top: 1.4rem; right: auto; left: calc(50% + 40px); } }
.cs-cross-glints i {
  position: absolute; width: 16px; height: 16px; margin: -8px 0 0 -8px; opacity: 0;
  background:
    linear-gradient(90deg, transparent 46%, rgba(255, 247, 220, .9) 50%, transparent 54%) center / 100% 2px no-repeat,
    linear-gradient(0deg, transparent 46%, rgba(255, 247, 220, .9) 50%, transparent 54%) center / 2px 100% no-repeat,
    radial-gradient(circle, rgba(255, 247, 220, .95) 0 10%, rgba(246, 226, 166, .4) 28%, transparent 60%);
  animation: gem-star 6s ease-in-out infinite;
}
.cs-cross-glints i:nth-child(1) { left: 51.6%; top: 15%;   animation-duration: 5s;   animation-delay: -1s; }
.cs-cross-glints i:nth-child(2) { left: 51.6%; top: 84.5%; animation-duration: 7s;   animation-delay: -3.5s; }
.cs-cross-glints i:nth-child(3) { left: 18.9%; top: 43.2%; animation-duration: 6s;   animation-delay: -5s; }
.cs-cross-glints i:nth-child(4) { left: 80.7%; top: 36.3%; animation-duration: 8s;   animation-delay: -2s; }
.cs-cross-glints i:nth-child(5) { left: 64.8%; top: 54.1%; animation-duration: 4.5s; animation-delay: -.5s; width: 11px; height: 11px; margin: -5.5px 0 0 -5.5px; }
@keyframes gem-star { 0%, 70%, 100% { opacity: 0; transform: scale(.4) rotate(0deg); } 82% { opacity: .85; transform: scale(1) rotate(45deg); } }

/* Hero CTA: slow gold shine sweep on hover/focus (sparkle comes from ::after) */
.gem-btn__shine {
  position: absolute; inset: 3px; z-index: 0; pointer-events: none; overflow: hidden;
  clip-path: polygon(10px 0, calc(100% - 10px) 0, 100% 10px, 100% calc(100% - 10px), calc(100% - 10px) 100%, 10px 100%, 0 calc(100% - 10px), 0 10px);
}
.gem-btn__shine::before {
  content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 38%;
  background: linear-gradient(100deg, rgba(255, 236, 170, 0), rgba(255, 236, 170, .34), rgba(255, 236, 170, 0));
  transform: translateX(-130%) skewX(-20deg);
}
.gem-btn:hover .gem-btn__shine::before, .gem-btn:focus-visible .gem-btn__shine::before { animation: gem-btn-shine 2.6s ease-in-out infinite; }
.gem-btn:focus-visible::after { background-size: 14px 14px, auto, cover, auto; }
@keyframes gem-btn-shine { 0% { transform: translateX(-130%) skewX(-20deg); } 55%, 100% { transform: translateX(330%) skewX(-20deg); } }

/* Launch bar: twinkling glint on the leading edge (shimmer is ::after above) */
.gem-progress__glint {
  position: absolute; top: 50%; left: calc(62% + 4px); width: 16px; height: 16px; margin: -8px 0 0 -8px; opacity: .3;
  background: radial-gradient(circle, rgba(255, 247, 220, .95) 0 14%, rgba(246, 226, 166, .45) 34%, transparent 66%);
  animation: gem-glint 2.8s ease-in-out infinite;
}
@keyframes gem-glint { 0%, 100% { opacity: .25; transform: scale(.6); } 50% { opacity: 1; transform: scale(1.1); } }

/* Founder frame: corner sparkles twinkle out of step */
.cs-portrait .gem-sparkle--b { animation-duration: 4.8s; animation-delay: -2.2s; }
.cs-portrait .gem-sparkle--c { width: 22px; height: 22px; top: 38%; right: -16px; animation-duration: 6.2s; animation-delay: -4s; }

/* "What we do": jewel on the card edge swaps standard -> glow with a sparkle burst */
.cs-offer li { position: relative; }
.cs-offer-gem {
  position: absolute; top: -11px; right: 14px; width: 26px; height: 22px; pointer-events: none;
  background: url("/assets/brand/diamond-standard-128.webp") center / contain no-repeat;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .5));
}
.cs-offer-gem::before, .cs-offer-gem::after { content: ""; position: absolute; pointer-events: none; }
.cs-offer-gem::after { inset: 0; opacity: 0; background: url("/assets/brand/diamond-glow-128.webp") center / contain no-repeat; transition: opacity .3s ease; }
.cs-offer-gem::before {
  width: 30px; height: 30px; top: -12px; right: -14px; opacity: 0; transform: scale(.2);
  background: url("/assets/brand/sparkle-gold-48.webp") center / contain no-repeat;
}
.cs-offer li:hover .cs-offer-gem::after, .cs-offer li:focus-within .cs-offer-gem::after { opacity: 1; }
.cs-offer li:hover .cs-offer-gem::before, .cs-offer li:focus-within .cs-offer-gem::before { animation: gem-burst .8s ease-out 1; }
@keyframes gem-burst { 0% { opacity: 0; transform: scale(.2) rotate(0deg); } 35% { opacity: 1; transform: scale(1.1) rotate(25deg); } 100% { opacity: 0; transform: scale(.6) rotate(60deg); } }

/* Collection name cards: gold edge sheen sweep + sparkle (card itself is pointer-events:none, so hover the li) */
.cs-tags .bk-tag-card { transition: border-color .3s ease; }
.cs-tags .bk-tag-card::before, .cs-tags .bk-tag-card::after { content: ""; position: absolute; pointer-events: none; }
.cs-tags .bk-tag-card::after {
  inset: 0; opacity: 0; transform: translateX(-110%);
  background: linear-gradient(115deg, rgba(246, 226, 166, 0) 35%, rgba(246, 226, 166, .28) 48%, rgba(255, 247, 220, .45) 50%, rgba(246, 226, 166, 0) 62%);
}
.cs-tags .bk-tag-card::before {
  width: 18px; height: 18px; top: 13%; right: 8%; opacity: 0; transform: scale(.3);
  background: url("/assets/brand/sparkle-gold-48.webp") center / contain no-repeat;
}
.cs-tags > li:hover .bk-tag-card, .cs-tags > li:focus-within .bk-tag-card { border-color: var(--gem-gold-bright, #e6c274); }
.cs-tags > li:hover .bk-tag-card::after, .cs-tags > li:focus-within .bk-tag-card::after { animation: gem-sweep 1.1s ease-out 1; }
.cs-tags > li:hover .bk-tag-card::before, .cs-tags > li:focus-within .bk-tag-card::before { animation: gem-burst .9s ease-out .25s 1; }
@keyframes gem-sweep { 0% { opacity: 1; transform: translateX(-110%); } 100% { opacity: 1; transform: translateX(110%); } }

/* Section dividers: centre diamond breathes */
.cs-divider .gem-divider { position: relative; }
.cs-divider .gem-divider::after {
  content: ""; position: absolute; left: 50%; top: 50%; width: 26px; height: 26px; margin: -13px 0 0 -13px; pointer-events: none;
  background: radial-gradient(circle, rgba(255, 243, 196, .6) 0 18%, rgba(212, 169, 79, .22) 45%, transparent 70%);
  opacity: .3; transform: scale(.75);
  animation: gem-div-pulse 4.5s ease-in-out infinite;
}
@keyframes gem-div-pulse { 0%, 100% { opacity: .3; transform: scale(.75); } 50% { opacity: .9; transform: scale(1.15); } }

@media (prefers-reduced-motion: reduce) {
  .gem-logo__fx, .cs-motes, .cs-cross-glints, .gem-btn__shine, .gem-progress__glint,
  .cs-offer-gem::before, .cs-tags .bk-tag-card::before, .cs-tags .bk-tag-card::after { display: none !important; }
  .cs-divider .gem-divider::after, .cs-portrait .gem-sparkle { animation: none !important; }
  .cs-offer-gem::after, .cs-tags .bk-tag-card { transition: none !important; }
}
@media (forced-colors: active) {
  .gem-logo__fx, .cs-motes, .cs-cross-glints, .gem-btn__shine, .cs-offer-gem, .cs-divider .gem-divider::after { display: none; }
}

/* Founder easter egg: 3D flip card (polaroid) — hold hover/focus ~1.2 s / long-press ~0.8 s */
.cs-portrait { perspective: none; }
.cs-portrait:focus-visible { outline: 2px solid var(--gem-gold-bright); outline-offset: 6px; border-radius: 4px; }
.cs-portrait .gem-frame { position: relative; }
.cs-flip { perspective: 1100px; display: block; }
.cs-flip__inner {
  position: relative; transform-style: preserve-3d;
  transition: transform .8s cubic-bezier(.34, 1.56, .64, 1);
  will-change: transform;
}
.cs-portrait.is-flipped .cs-flip__inner { transform: rotateY(180deg); }
.cs-flip__face {
  backface-visibility: hidden; -webkit-backface-visibility: hidden;
  transform: rotateY(0deg);
}
.cs-flip__back {
  position: absolute; inset: 0;
  transform: rotateY(180deg);
  display: flex; align-items: center; justify-content: center;
  pointer-events: none;
}
.cs-portrait.is-flipped .cs-flip__back { pointer-events: auto; }
.cs-flip__back .gem-frame { width: 100%; }
/* Caption sits in reserved padding BELOW the frame (not over the photo) */
.cs-portrait > .cs-hello {
  position: absolute; left: 2%; right: 2%; bottom: 0; z-index: 3;
  margin: 0; padding: .35rem .55rem; text-align: center;
  font-size: .72rem; line-height: 1.35; color: var(--gem-ink);
  border: 1px solid var(--gem-gold); border-radius: 999px;
  background: rgba(11, 11, 14, .92); box-shadow: 0 0 18px rgba(212, 175, 55, .28);
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity .22s ease, visibility .22s ease;
}
.cs-portrait.is-flipped > .cs-hello {
  opacity: 1; visibility: visible; pointer-events: auto;
}
.cs-portrait > .cs-hello a { color: var(--gem-gold-bright); font-weight: 700; text-underline-offset: 3px; }
@media (min-width: 900px) {
  .cs-portrait > .cs-hello { font-size: .78rem; padding: .4rem .65rem; }
}
/* Occasional physics-y attempted flip (~18deg, damped wobble ~1.2 s) */
@keyframes cs-attempt {
  0% { transform: rotateY(0deg); }
  16% { transform: rotateY(-18deg); }
  34% { transform: rotateY(8deg); }
  52% { transform: rotateY(-3.8deg); }
  70% { transform: rotateY(1.6deg); }
  86% { transform: rotateY(-0.5deg); }
  100% { transform: rotateY(0deg); }
}
.cs-portrait.is-attempting:not(.is-flipped) .cs-flip__inner {
  animation: cs-attempt 1.2s cubic-bezier(.22, .61, .36, 1) 1;
}
.cs-portrait.is-glitching .cs-flip__inner::after {
  content: ""; position: absolute; inset: -2px; z-index: 6; pointer-events: none;
  background: linear-gradient(105deg, transparent 30%, rgba(212, 175, 55, .55) 46%, rgba(80, 130, 255, .45) 54%, transparent 70%);
  mix-blend-mode: screen; animation: cs-edge-flash .35s ease-out 1;
}
@keyframes cs-edge-flash { 0% { opacity: 0; } 35% { opacity: 1; } 100% { opacity: 0; } }
.cs-burst { position: absolute; inset: 0; pointer-events: none; z-index: 4; }
.cs-burst i { position: absolute; width: 22px; height: 22px; opacity: 0; background: url("/assets/brand/sparkle-gold-48.webp") center / contain no-repeat; }
.cs-burst i:nth-child(1) { top: -10px; left: -10px; } .cs-burst i:nth-child(2) { top: -14px; right: 20%; }
.cs-burst i:nth-child(3) { top: 45%; right: -14px; } .cs-burst i:nth-child(4) { bottom: -12px; right: -8px; }
.cs-burst i:nth-child(5) { bottom: -14px; left: 30%; } .cs-burst i:nth-child(6) { top: 40%; left: -14px; background-image: url("/assets/brand/sparkle-blue-40.webp"); }
.cs-portrait.is-bursting .cs-burst i { animation: gem-burst .8s ease-out 1; }
.cs-burst i:nth-child(even) { animation-delay: .1s !important; }
@media (prefers-reduced-motion: reduce) {
  .cs-flip__inner { transition: none !important; animation: none !important; }
  .cs-portrait.is-glitching .cs-flip__inner::after, .cs-portrait.is-bursting .cs-burst i,
  .cs-portrait.is-attempting .cs-flip__inner { animation: none !important; }
  .cs-portrait.is-flipped .cs-flip__inner { transform: none; }
  .cs-portrait.is-flipped .cs-flip__front { display: none; }
  .cs-portrait.is-flipped .cs-flip__back { position: relative; transform: none; }
  .cs-portrait:not(.is-flipped) .cs-flip__back { display: none; }
  .cs-portrait > .cs-hello { transition: none !important; }
}
@media (forced-colors: active) { .cs-burst { display: none; } }

/* audit-r1: keep the sticky header below the sticky preview ribbon (was sliding under it) */
.db-preview-ribbon { line-height: 1.4; }
.db-preview-ribbon ~ .site-header { top: calc(1.9rem + 1px); }

/* r3: /help page */
.help-wrap { max-width: 44rem; }
.help-toc { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.1rem; }
.help-toc a { display: inline-flex; align-items: center; min-height: 44px; padding: .35rem .9rem; border: 1px solid var(--gem-line-gold, rgba(212,160,23,.45)); border-radius: 999px; text-decoration: none; }
.help-h { margin: 2rem 0 .75rem; scroll-margin-top: 6rem; }
.help-a { padding: 0 0 .5rem; }
.help-a ol { padding-left: 1.25rem; }
.help-a li { margin: .35rem 0; }
.help-src { display: block; font-size: .85rem; opacity: .8; }
.help-contact { margin-top: 2rem; padding: 1.25rem; }
.help-note { font-size: .88rem; opacity: .8; margin-bottom: 0; }
.help-a a, .help-src a { overflow-wrap: anywhere; }

/* r8: legal drafts */
.legal-draft { margin: 0 0 1.25rem; padding: .95rem 1.1rem; border: 2px solid var(--gem-gold-bright); background: rgba(212, 169, 79, .16); border-radius: 12px; color: var(--gem-ink); font-size: 1rem; line-height: 1.45; }
.legal-draft strong { color: var(--gem-gold); }
.legal-doc { padding: 1.5rem 1.35rem; line-height: 1.6; }
.legal-doc h2 { margin-top: 1.6rem; }
.legal-doc h3 { margin-top: 1.2rem; font-size: 1.05rem; }
.legal-doc hr { border: 0; border-top: 1px solid var(--gem-line); margin: 2rem 0 1rem; }
.legal-tbc { background: rgba(169, 182, 255, .16); color: var(--gem-sapphire-text); border-radius: 4px; padding: 0 .2em; }