/* EraPin wordmark v2 (operator spec 2026-06-03) — "Era" + a gold compass-star
   pin marker + "Pin". Extracted verbatim from game.css so non-game surfaces
   (teacher SPA, etc.) can reuse the same logo without pulling in all of
   game.css. Size with ONE font-size on .eralogo; the marker scales in em.
   Background-adaptive via --word / --pin / --star; defaults suit a LIGHT
   surface, .on-dark gives the reversed treatment. Min legible size ~24px. */
.eralogo      { display:inline-flex; align-items:flex-end; line-height:.84; white-space:nowrap;
                letter-spacing:normal; --word:#1C1208; --pin:#B8901F; --star:#F5F0E8; }
.eralogo .w   { font-family:'Playfair Display',serif; font-weight:800; letter-spacing:normal }
.eralogo span.w, .eralogo span.w .lp { color:var(--word) }
.eralogo .lp  { display:inline-block; margin-right:-.1375em }        /* Gap −11 */
.eralogo .mark{ flex-shrink:0; align-self:flex-end;
                width:.5em; height:.66em; transform:translateY(-.04em) }   /* Pin · Drop −4 */
.eralogo.on-dark    { --word:#F5F0E8; --pin:#E0BE4A; --star:#1a120a; }
.eralogo.on-dark .w { text-shadow:0 1px 4px rgba(0,0,0,0.6) }
/* "Pro" suffix — only rendered for an ACTIVE Pro teacher (EraLogo `pro` prop).
   Sized in em so it tracks the one font-size on .eralogo, and baseline-aligned
   to the wordmark's cap-height rather than its foot (the parent is flex-end). */
.eralogo .pro { font-family:'Courier Prime','Courier New',monospace; font-weight:700;
                font-size:.42em; letter-spacing:.12em; text-transform:uppercase;
                color:var(--pin); align-self:flex-start; margin-left:.28em;
                transform:translateY(.12em) }
.eralogo.on-dark .pro { color:#E0BE4A }