/* RAPHAVEN PRIMARY RED — founder-canonical #E32219.
   Loaded LAST on RapHaven surfaces so the approved primary resolves to the canonical value
   without touching approved geometry, shadows, or derived dark shades.
   Brand-purity purge 2026-08-26. */
:root,.mh-skin-default{
--mh-gold:#E32219;--mh-gold-bright:#F65045;
--sk-accent:#E32219;--sk-chip-bg:#E32219;
--sk-grad:linear-gradient(135deg,#F65045,#E32219);
--mh-grad-gold:linear-gradient(135deg,#F65045,#E32219);
--hh-red:#E32219;--rh-red:#E32219;
}
.ff{--ff-accent:#E32219}
.hv--royalty{--hva:#E32219}
.ff--rh{--ffa:#E32219}
.rel-em{border-color:#E32219}
.rel-em--flip{border-color:#E32219}
:focus-visible{outline-color:#E32219}

/* ── CANONICAL PHYSICAL FLIPCARD ROTATION (restored 2026-08-28) ──────────────────────────────
   Loaded last on every RapHaven surface so no earlier stylesheet can cancel the turn. Earlier
   passes had added transform:none overrides that made the card FLASH between faces instead of
   rotating; those are gone and this is the single authority.
   Physics: one fixed stage, both faces mounted the whole time, back pre-rotated 180deg,
   backface-visibility hiding whichever face is turned away. No crossfade, no opacity swap,
   no remount, no collapse, no mirrored text. */
.hh-flipcard{perspective:1400px}
.hh-flipcard .hh-flipinner{transform-style:preserve-3d;transition:transform .34s cubic-bezier(.2,.8,.2,1)}
.hh-flipcard.flipped .hh-flipinner{transform:rotateY(180deg)!important}
.hh-flipcard .hh-face{backface-visibility:hidden;-webkit-backface-visibility:hidden}
.hh-flipcard .hh-back{transform:rotateY(180deg)!important;visibility:visible!important}
@media (prefers-reduced-motion:reduce){.hh-flipcard .hh-flipinner{transition:none}}

/* ── §3 PRODUCTION ACTION PILLS ──────────────────────────────────────────────────────
   Hard floor for every article and listen action: 52px tall, 16px label, weight 800, 22px side
   padding. No scale(), no zoom, no miniature specimen variants — these are the real controls. */
.rh-heroactions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;width:100%}
.rh-pill{display:inline-flex;align-items:center;justify-content:center;gap:9px;
 min-height:52px;min-width:44px;padding:0 22px;border-radius:999px;
 font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:16px;font-weight:800;line-height:1;
 letter-spacing:.01em;white-space:nowrap;text-decoration:none;cursor:pointer;border:2px solid transparent}
.rh-pill:hover,.rh-pill:focus{text-decoration:none}
.rh-pill:focus-visible{outline:3px solid #0E1216;outline-offset:3px}
.rh-pill--primary{background:#E32219;color:#fff;border-color:#E32219;
 box-shadow:0 3px 0 #9A1C13,inset 0 1px 0 rgba(255,255,255,.28)}
.rh-pill--primary:hover{filter:brightness(1.07);color:#fff}
.rh-pill--secondary{background:#0E1216;color:#fff;border-color:#0E1216;
 box-shadow:0 3px 0 rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.18)}
.rh-pill--secondary:hover{background:#E32219;border-color:#E32219;color:#fff}
.rh-pill--secondary:focus-visible{outline-color:#E32219}
.rh-dsp{flex:1 1 100%;margin:4px 0 0;padding:14px;border:2px solid #E32219;border-radius:12px;background:#fff}
.rh-dsp__id{margin:0 0 10px;font:900 11px/1.3 'Helvetica Neue',Arial;letter-spacing:.14em;text-transform:uppercase;color:#9A1C13}
.rh-dsp__host{margin:0 0 10px}
@media (max-width:520px){
 .rh-heroactions{flex-direction:column;align-items:stretch}
 .rh-pill{width:100%}
}

/* §5 COMPACT BOOKMARK — replaces the invented oversized "Save Story" button. Fixed 44x44 so it
   cannot expand the card; the words live in the accessible name only. */
.hh-bookmark{width:44px!important;min-width:44px!important;height:44px!important;min-height:44px!important;
 padding:0!important;border-radius:999px!important;display:inline-flex!important;align-items:center;justify-content:center;
 font-size:20px!important;line-height:1!important;letter-spacing:0!important;text-transform:none!important;
 border:1.5px solid rgba(227,34,25,.55)!important;background:transparent!important;color:#E32219!important;
 cursor:pointer;flex:0 0 auto!important;align-self:flex-start!important;box-shadow:none!important}
.hh-bookmark:hover{background:rgba(227,34,25,.08)!important}
.hh-bookmark.is-on{background:#E32219!important;border-color:#E32219!important;color:#fff!important}
.hh-bookmark:focus-visible{outline:3px solid #E32219;outline-offset:2px}
.hh-back .hh-bookmark{border-color:rgba(255,255,255,.5)!important;color:#fff!important}
.hh-back .hh-bookmark.is-on{background:#E32219!important;border-color:#E32219!important}