/* ═══ the one Resolve mark on the server-rendered pages · 2026-10-23 ═══════
   Billy: "the same logos should apply everywhere on the site. no more
   distinction between sports and ai." The brand kit has ONE mark, the R cut
   out of a disc with a brush ring and a pearl, in place of the R/S line
   drawing these pages used to colour from their own tokens. Kit 20c
   (2026-10-25, brand/v5/) made the disc a flat sage and the R larger.

   The disc is sage on dark and plum on light, and the pearl is shaded, so
   tokens cannot colour the mark. Every place that shows it carries both of
   the kit's files (app/brand_mark.py writes the pair): sage, .rr-mark-dk, for
   dark, and plum, .rr-mark-lt, for light. The two rules below hide the wrong one. They only ever HIDE, so
   the one left showing keeps whatever display its place gives it (block in a
   draft room's first control, inline beside a name).

   The switch is html[data-theme="light"] on every one of these pages, the
   landing and the app. Dark is the default: the pages ship
   <html data-theme="dark"> or no attribute at all, so with no script the
   sage mark shows. `!important` is on purpose: bar3.css sets
   `.bar.bar-v2 .door img { display:block }` one class deeper than this, and
   the rooms' styles.css sets `.rr-back-btn img { display:block }`.

   One file for both sports: /static/ and /static_nfl/ fall back to this
   folder. Linked from every page that draws the mark, and from the landing.
   It replaced the sheet that coloured the old line drawing.
   ══════════════════════════════════════════════════════════════════════════ */
html:not([data-theme="light"]) .rr-mark.rr-mark-lt { display: none !important; }
html[data-theme="light"] .rr-mark.rr-mark-dk { display: none !important; }

.rr-mark { flex: none; }

/* draft rooms and recaps: the mark is the bar's first control, at the size
   the room's own styles.css gives its image (38px), and 28px in a league room
   on a phone, as auction-house.css sizes it there. The room's sheet rounds
   that image into a circle; the mark draws its own disc, so its ring is never
   clipped. */
.rr-back-btn .rr-mark { width: 38px; height: 38px; border-radius: 0; }
@media (max-width: 720px) {
  body:has(.room-lean) .rr-back-btn .rr-mark { width: 28px; height: 28px; }
}

/* the older league pages: the mark before the name, inside the link. Inline,
   not flex: the bar lines the name and the page's label beside it up on their
   text baseline (.brand is align-items: baseline), and a flex link would
   hand it the mark's bottom edge instead. */
.brand-link > .rr-mark,
.lbar .b > .rr-mark { display: inline-block; vertical-align: middle; margin-right: 9px; }
.brand-link > .rr-mark { width: 30px; height: 30px; }
.lbar .b > .rr-mark { width: 24px; height: 24px; }

/* the phone menu's title: the mark and the name, lowercase, in the page's
   text colour and the house sans */
.drawer-title:has(> .rr-mark),
.mobile-drawer .drawer-title:has(> .rr-mark) {
  display: inline-flex; align-items: center; gap: 9px;
  font-family: "Avenir Next", Avenir, "Mulish", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 15px; letter-spacing: .02em; text-transform: none;
  color: var(--text-primary, #C8DACE);
}
.drawer-title > .rr-mark { width: 24px; height: 24px; }

/* the signed-out landing's bar (bar3.css): the kit's 34px, smaller on a phone,
   and the name as the family sets it. The landing used to take these from
   the main site's brand sheet, across origins; they live here now so the
   landing does not depend on another site's file. */
.bar.bar-v2 .door .rr-mark { width: 34px; height: 34px; }
.bar.bar-v2 .door .nm .q { letter-spacing: .06em; color: var(--text, #C8DACE); }
.bar.bar-v2 .door .nm .s { font-style: italic; letter-spacing: .02em; padding-right: .06em; }
@media (max-width: 900px) { .bar.bar-v2 .door .rr-mark { width: 30px; height: 30px; } }
@media (max-width: 420px) { .bar.bar-v2 .door .rr-mark { width: 28px; height: 28px; } }
@media (max-width: 380px) {
  .bar.bar-v2 .door .nm { font-size: 15px; }
  .bar.bar-v2 .door .rr-mark { width: 26px; height: 26px; }
}

/* the name beside the mark, as the family writes it in every bar (Billy's
   logo check, 2026-10-22): Didot at 400, "resolve" tracked .06em in the text
   colour, the product word italic in the accent. */
.rr-name {
  font-family: Didot, "Bodoni Moda", "Bodoni 72", Georgia, serif;
  font-weight: 400; white-space: nowrap; text-transform: none;
}
.rr-name .q { color: var(--text-primary, #C8DACE); letter-spacing: .06em; }
.rr-name .s { color: var(--gold, #7AAD8E); font-style: italic; letter-spacing: .02em; padding-right: .06em; }