/* ───────────────────────────────────────────────────────────────────────────
   Taboo Fantasy — the second brand's palette.

   Loaded after variables.css and style.css, and it redefines tokens rather
   than restating rules. That is the whole point of the split: a second look
   costs this one file, not a second copy of the site.

   Where 6tube is Deep Zinc — cool, neutral, blue-grey black — this is warm:
   a near-black with red in it, the brand's own #ff0000 as the accent, and a
   serif for anything that reads as a title. Two sites built from one layout
   should not be told apart by the logo alone.

   The serif is a device stack, not a web font. The page already pays for Inter;
   a second family over the network to style headings is not worth the bytes.
   ─────────────────────────────────────────────────────────────────────────── */

:root {
    /* Warm near-black. Same job as Deep Zinc, different temperature — side by
       side the two sites read as different rooms, not different logos. */
    --color-bg:            #0b0708;
    --color-bg-primary:    #0b0708;
    --color-bg-secondary:  #17100f;
    --color-bg-tertiary:   #241a18;
    --color-surface:       #17100f;

    /* The logo's own red. Pure #ff0000 is right for a mark and too loud for a
       filled button the eye sits next to, so the interactive red is pulled a
       step down and the pure value is kept for accents and hovers. */
    --color-primary:       #e60000;
    --color-primary-dark:  #a30000;
    --color-brand-pure:    #ff0000;

    --color-text-primary:  #f7f2f0;
    --color-text-secondary:#b8a9a5;
    --color-text-muted:    #6b5955;

    --color-border:        #2a1c1a;

    --glass-bg:   rgba(23, 16, 15, 0.72);
    --card-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.5), 0 2px 4px -1px rgba(0, 0, 0, 0.35);

    /* A wordmark set in a script serif over a grid of sans-serif titles looks
       like a sticker on someone else's site. Headings pick the serif up. */
    --font-display: Georgia, "Iowan Old Style", "Times New Roman", serif;
}

/* Section and page headings carry the display serif; body copy, navigation and
   controls stay in Inter, where a serif would only cost legibility. */
h1,
h2,
.books-intro h1,
.book-detail__title,
.cam-intro h1 {
    font-family: var(--font-display);
    font-weight: 700;
    letter-spacing: -0.01em;
}

/* The logo is white-on-transparent artwork, so it needs the dark ground to
   exist — and a little more room than a compact wordmark would. */
.logo img {
    height: 34px !important;
}

/* The category bar's active state is where the pure brand red earns its keep:
   a thin mark, not a filled surface. */
.cat-link:hover,
.cat-link.active {
    color: var(--color-brand-pure);
}

::selection {
    background: var(--color-primary);
    color: #fff;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--color-brand-pure);
}