/* Wordmark lockup: the transparent mascot + "Dream" (cream 700) "bug" (gold 800), exactly as the app
   header draws it. Mascot left, wordmark right, gap 0.2 x mascot height. Never recoloured, never one colour.
   <a class="db-wordmark" href="#top" aria-label="DreamBug home">
     <img class="db-wordmark__mark" src="assets/brand/mascot-512.png" alt="">
     <span class="db-wordmark__text">Dream<b>bug</b></span></a>
   Sizes: --sm --lg --xl (default 1.45rem type). Grounds: default (dark), --light (ink on light), --plate (navy plate). */
.db-wordmark{--wm-size:1.45rem;--wm-mark:1.9em;display:inline-flex;align-items:center;gap:calc(var(--wm-mark) * .2);
  font-family:var(--db-font);font-size:var(--wm-size);line-height:1;text-decoration:none;color:var(--db-ink);
  white-space:nowrap;-webkit-tap-highlight-color:transparent}
.db-wordmark__mark{width:auto;height:var(--wm-mark);flex:none;object-fit:contain}
.db-wordmark__text{font-weight:700;letter-spacing:-.005em;color:var(--db-ink);text-shadow:0 1px 2px rgba(0,0,0,.45);
  /* optical: Baloo 2's line box sits high; nudge the baseline to the mascot's visual centre */
  padding-top:.08em}
.db-wordmark__text b{font-weight:800;color:var(--db-gold)}
a.db-wordmark{min-height:44px;border-radius:var(--db-r-sm)}

.db-wordmark--sm{--wm-size:1.15rem}
.db-wordmark--lg{--wm-size:2.1rem}
.db-wordmark--xl{--wm-size:clamp(2.6rem,1.6rem + 4vw,4.4rem)}
.db-wordmark--text-only .db-wordmark__mark{display:none}

/* Light grounds: ink "Dream", dark gold "bug", no shadow (LOGO-RULES: the dark version's soft shadow is the only one). */
.db-wordmark--light .db-wordmark__text,.db-light .db-wordmark:not(.db-wordmark--plate) .db-wordmark__text{color:var(--db-ink-light);text-shadow:none}
.db-wordmark--light .db-wordmark__text b,.db-light .db-wordmark:not(.db-wordmark--plate) .db-wordmark__text b{color:var(--db-gold-ink)}

/* Navy plate: for busy art or unknown grounds. 14px radius at the default size, scaling with the plate. */
.db-wordmark--plate{background:var(--db-navy-plate);padding:.55em .95em .55em .7em;border-radius:.62em;
  box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 10px 30px rgba(4,6,20,.35)}
.db-wordmark--plate .db-wordmark__text{color:var(--db-ink)}
.db-wordmark--plate .db-wordmark__text b{color:var(--db-gold)}