/* ===== HIPHOPHAVEN ARTICLE RIBBON AMENDMENT — founder ruling, Sep 1 2026 =====
   The ONLY stylesheet added to the donor fabric. Scope: the Article Ribbon/header
   architecture and nothing else. Rail geometry is untouched (assets/ribbon-rail.css
   remains the sole geometry authority); these rules only govern MOUNTING: the rail is
   the article object's first child and top edge, fused to the media at 0px, equal in
   width to the media frame, with no competing kicker/pill header and no doubled keyline.
   Stack law everywhere: RAIL -> PHOTO/MEDIA -> HEADLINE -> DEK -> META -> BODY/CONTROLS. */

/* 1. The fused article document (Regular Article route + Article Tab): the excerpt/dek is
      its own row directly under the headline; it carries the approved lead rule. */
.hgnad__dek{position:relative;margin:14px 0 0;padding:0 14px 0 31px;font-size:18px;line-height:1.62;
 color:var(--hgn-ink);font-family:inherit;text-wrap:pretty}
.hgnad__dek::before{content:"";position:absolute;left:14px;top:2px;bottom:2px;width:3px;background:var(--hgn-accent)}
.hgnad__dek+.hgnad__crumbs{margin-top:14px}
.hgnad__body p:first-of-type{border-left:0;padding-left:0}
@container hgnad (max-width:600px){
 .hgnad__dek{padding:0 12px 0 29px;font-size:17px;line-height:1.6}
 .hgnad__dek::before{left:12px}}

/* 2. Photo-system article (.hgn-art): the rail is the masthead; the hero sits on it at 0px
      and spans the identical frame; the retired pills/kicker leave no cavity. */
.hgn-art--fused>.rr-host{margin:0}
.hgn-art--fused>.rr-host+.hgn-media{margin-top:0!important;border-radius:0 0 2px 2px}
.hgn-art--fused>h1{margin-top:18px}

/* 3. HGN King/stream cards + flip faces: the rail's keyline IS the card's top edge
      (the card's own 3px blue rule would double it); media fused directly beneath. */
.hgn-kcard--fused{border-top-width:0}
.hgn-kcard--fused>.rr-host{margin:0;flex:none}
.rr-host+.hgn-kwrap{margin-top:0}
.rr-host+.hgn-kwrap .hgn-media{border-radius:0}
.hgn-flip__back.hgn-kcard--fused{padding-top:0}
.hgn-flip__back.hgn-kcard--fused>.rr-host{margin:0 -15px 6px}

/* 4. Premium Feature: the rail's own 7px keyline is the object's top edge — the extra
      7px rule that sat above it (a doubled keyline) is retired. */
section.hhpf,.hhpf{border-top:0!important}

/* 5. Homepage lead card: rail width = media width. The lead uses its approved 16:9 media
      rule (hhh.css .hh-flipcard--lead) instead of the 640px square cap that left the
      rail wider than the plate beneath it. */
.hh-flipcard--lead .hh-front .hh-media--sq,.hh-flipcard--lead .hh-backmedia .hh-media--sq{
 max-width:none!important;width:100%!important;aspect-ratio:16/9!important;margin-inline:0!important}
