/* Article reader ("Reader-first Modular" reference): flat top bar, the article straight on the page,
   a club-tinted hero, a bold lead, collapsible sources and a modular sidebar. The club colour comes from
   data-club on the dialog (map in player-profile.css). */
html body dialog.bn-reader.bn-reader-fullscreen{--rd-club:rgb(var(--profile-club-rgb,110 110 110));--rd-line:#262626;background:#0b0b0b;color:#e9e9e6}

/* Top bar: full width, flat, hairline below; the active page is underlined in the club colour. */
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-bar{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:clamp(20px,4vw,64px);width:100%;max-width:none;box-sizing:border-box;height:64px;margin:0;padding:0 clamp(16px,2.4vw,36px);border:0;border-bottom:1px solid var(--rd-line);border-radius:0;background:#0b0b0bf2;box-shadow:none;backdrop-filter:blur(10px)}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-navigation{display:flex;align-items:stretch;gap:clamp(14px,2.6vw,40px);height:100%;margin:0;padding:0;border:0;background:none}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-navigation a{display:flex;align-items:center;height:100%;padding:0 2px;border-radius:0;background:none;color:#c9c9c4;font:500 14px/1 var(--font-ui,Inter,sans-serif);box-shadow:none}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-navigation a:hover{color:#fff}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-navigation a[aria-current=page]{color:#fff;font-weight:600;box-shadow:inset 0 -2px 0 var(--rd-club)}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-close-page{margin-left:auto}

/* Page grid */
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-inner{max-width:1280px;margin:0 auto;padding:22px clamp(16px,2.4vw,36px) 64px;box-sizing:border-box}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,372px);gap:clamp(24px,3.4vw,48px);align-items:start}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-utility{display:flex;align-items:center;gap:22px;margin:0 0 22px;padding:0;color:#a5a5a0;font:500 12.5px/1.2 var(--font-ui,Inter,sans-serif)}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-back{padding:0;border:0;background:none;color:#e6e6e2;font:inherit;font-weight:500;cursor:pointer}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-breadcrumb{display:inline-flex;align-items:center;gap:8px;padding-left:22px;border-left:1px solid #2e2e2e;color:#a5a5a0}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-breadcrumb svg{width:13px;height:13px}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-utility .bn-reader-talk{display:none}

/* The article sits on the page, not in a card. */
html body dialog.bn-reader.bn-reader-fullscreen .bn-article-card{padding:0;border:0;border-radius:0;background:none;box-shadow:none}
html body dialog.bn-reader.bn-reader-fullscreen .bn-article-card>header{margin:0 0 22px;padding:0;border:0}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-club{display:flex;align-items:center;gap:12px;margin:0 0 14px;font:500 14px/1.2 var(--font-ui,Inter,sans-serif);color:#e6e6e2}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-avatar{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:50%;overflow:hidden;background:#1d1d1d;border:1px solid #2e2e2e}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-avatar img{width:100%;height:100%;object-fit:cover;object-position:50% 12%}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-avatar svg{width:20px;height:20px}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-club small{margin-left:auto;padding:7px 12px;border:1px solid #333;border-radius:8px;background:#151515;color:#d4d4cf;font:500 12px/1 var(--font-ui,Inter,sans-serif);letter-spacing:0;text-transform:none}
html body dialog.bn-reader.bn-reader-fullscreen #bn-reader-title{margin:0 0 16px;font:700 clamp(30px,3.4vw,46px)/1.08 var(--font-ui,Inter,sans-serif);letter-spacing:-.025em;color:#f6f6f3;text-transform:none}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;color:#a5a5a0;font:400 13px/1.3 var(--font-ui,Inter,sans-serif)}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-meta>span:first-child{color:#e6e6e2;font-weight:600}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-meta>i{width:1px;height:14px;background:#3a3a3a}

/* Hero: club-tinted, big faded crest, player on the right, caption bottom left. */
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-visual{position:relative;isolation:isolate;display:flex;align-items:flex-end;justify-content:flex-end;height:clamp(220px,24vw,300px);margin:0 0 26px;padding:0;border:1px solid var(--rd-line);border-radius:12px;overflow:hidden;background:radial-gradient(ellipse at 72% 30%,color-mix(in srgb,var(--rd-club) 34%,transparent),transparent 62%),linear-gradient(110deg,#0d0d0d 18%,color-mix(in srgb,var(--rd-club) 26%,#0d0d0d) 100%)}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-visual::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#0b0b0bd9 0,#0b0b0b66 45%,transparent 70%)}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-visual>img:not(.bn-visual-watermark){position:relative;z-index:1;width:auto;height:100%;max-width:60%;margin-right:clamp(16px,14%,150px);object-fit:contain;object-position:bottom;filter:drop-shadow(0 12px 26px #000a)}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-visual:not(.has-player)>img:not(.bn-visual-watermark){height:62%;margin:auto clamp(24px,12%,120px) auto auto;align-self:center}
html body dialog.bn-reader.bn-reader-fullscreen .bn-visual-watermark{position:absolute;z-index:-2;right:-4%;top:50%;width:52%;height:auto;max-height:none;transform:translateY(-50%);opacity:.13;filter:grayscale(.2)}
html body dialog.bn-reader.bn-reader-fullscreen .bn-visual-copy{position:absolute;z-index:2;left:clamp(18px,3vw,30px);bottom:clamp(18px,3vw,30px);display:grid;gap:6px;max-width:55%}
html body dialog.bn-reader.bn-reader-fullscreen .bn-visual-copy span{font:600 11px/1 var(--font-ui,Inter,sans-serif);letter-spacing:.12em;color:#d0d0cb}
html body dialog.bn-reader.bn-reader-fullscreen .bn-visual-copy strong{font:700 clamp(22px,2.4vw,30px)/1.1 var(--font-ui,Inter,sans-serif);letter-spacing:-.02em;color:#fff;text-transform:none}
html body dialog.bn-reader.bn-reader-fullscreen .bn-visual-copy small{font:400 13px/1.2 var(--font-ui,Inter,sans-serif);color:#c4c4bf}

/* Text: completely uniform font, weight, size, line-height and color across all paragraphs. */
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-body{max-width:760px;padding:0;font:400 18px/1.65 var(--font-ui,Inter,sans-serif)!important;color:#ededeb!important}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-body p,
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-body p:first-child,
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-body p.bn-lead{
  margin:0 0 16px!important;
  font-family:var(--font-ui,Inter,sans-serif)!important;
  font-size:18px!important;
  font-weight:400!important;
  line-height:1.65!important;
  color:#ededeb!important;
}

/* Sources: one collapsible row. */
html body dialog.bn-reader.bn-reader-fullscreen details.bn-reader-sources{margin:22px 0 0;padding:0;border:1px solid var(--rd-line);border-radius:10px;background:#111}
html body dialog.bn-reader.bn-reader-fullscreen details.bn-reader-sources>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;cursor:pointer;list-style:none}
html body dialog.bn-reader.bn-reader-fullscreen details.bn-reader-sources>summary::-webkit-details-marker{display:none}
html body dialog.bn-reader.bn-reader-fullscreen details.bn-reader-sources>summary h3{margin:0;font:500 13px/1.2 var(--font-ui,Inter,sans-serif);color:#d9d9d4}
html body dialog.bn-reader.bn-reader-fullscreen details.bn-reader-sources>summary h3 span{margin-left:10px;color:#9b9b96}
html body dialog.bn-reader.bn-reader-fullscreen details.bn-reader-sources>summary svg{color:#9b9b96;transition:transform .15s}
html body dialog.bn-reader.bn-reader-fullscreen details.bn-reader-sources[open]>summary svg{transform:rotate(180deg)}
html body dialog.bn-reader.bn-reader-fullscreen details.bn-reader-sources>:not(summary){margin-inline:16px}
html body dialog.bn-reader.bn-reader-fullscreen details.bn-reader-sources>p{margin:4px 16px 14px;font-size:12px;color:#8f8f8a}

/* Sidebar modules */
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-sidebar{position:sticky;top:86px;display:grid;gap:18px}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-sidebar>section{margin:0;padding:0;border:1px solid var(--rd-line);border-radius:12px;background:#111;overflow:hidden}
html body dialog.bn-reader.bn-reader-fullscreen .bn-context-head{position:relative;isolation:isolate;display:flex;align-items:center;gap:16px;min-height:104px;padding:18px 20px;border-bottom:1px solid var(--rd-line);background:linear-gradient(110deg,#121212 30%,color-mix(in srgb,var(--rd-club) 30%,#121212))}
html body dialog.bn-reader.bn-reader-fullscreen .bn-context-watermark{position:absolute;z-index:-1;right:-6%;top:50%;width:46%;transform:translateY(-50%);opacity:.14}
html body dialog.bn-reader.bn-reader-fullscreen .bn-context-crest{flex:none;width:68px;height:68px;object-fit:contain;filter:drop-shadow(0 4px 10px #0009)}
html body dialog.bn-reader.bn-reader-fullscreen .bn-context-head h2{margin:0 0 6px;font:600 19px/1.15 var(--font-ui,Inter,sans-serif);color:#fff;text-transform:none}
html body dialog.bn-reader.bn-reader-fullscreen .bn-context-head span{font:500 10.5px/1 var(--font-ui,Inter,sans-serif);letter-spacing:.12em;color:#bdbdb8}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-context>a{display:flex;align-items:center;gap:14px;margin:0 18px;padding:14px 2px;border-bottom:1px solid #222;color:#e6e6e2;font:500 14px/1.2 var(--font-ui,Inter,sans-serif);text-decoration:none}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-context>a:last-child{border-bottom:0}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-context>a span{flex:1}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-context>a svg{flex:none;color:#b5b5b0}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-context>a:hover{color:#fff}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-talk-card{padding:20px!important}
html body dialog.bn-reader.bn-reader-fullscreen .bn-talk-head{display:flex;gap:14px;margin-bottom:18px}
html body dialog.bn-reader.bn-reader-fullscreen .bn-talk-head>svg{flex:none;width:28px;height:28px;color:#f0f0ec}
html body dialog.bn-reader.bn-reader-fullscreen .bn-talk-head h2{margin:2px 0 8px;font:600 18px/1.2 var(--font-ui,Inter,sans-serif);color:#fff;text-transform:none}
html body dialog.bn-reader.bn-reader-fullscreen .bn-talk-head p{margin:0;font:400 14px/1.45 var(--font-ui,Inter,sans-serif);color:#c4c4bf}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-talk-card>button{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;height:46px;border:0;border-radius:9px;background:var(--rd-club);color:#fff;font:600 14px/1 var(--font-ui,Inter,sans-serif);cursor:pointer;transition:filter .15s}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-talk-card>button:hover{filter:brightness(1.12)}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-related{padding:6px 0 4px!important}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-related h2{margin:12px 20px 8px;font:600 14px/1.2 var(--font-ui,Inter,sans-serif);color:#f0f0ec;text-transform:none}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-related button{display:flex;align-items:center;gap:14px;width:calc(100% - 40px);margin:0 20px;padding:12px 0;border:0;border-top:1px solid #222;border-radius:0;background:none;color:inherit;text-align:left;cursor:pointer}
html body dialog.bn-reader.bn-reader-fullscreen .bn-related-image{display:grid;place-items:center;flex:none;width:80px;height:52px;border-radius:7px;overflow:hidden;background:color-mix(in srgb,var(--rd-club) 22%,#161616)}
html body dialog.bn-reader.bn-reader-fullscreen .bn-related-image img{width:100%;height:100%;object-fit:cover;object-position:50% 15%}
html body dialog.bn-reader.bn-reader-fullscreen .bn-related-copy{flex:1;display:grid;gap:5px;min-width:0}
html body dialog.bn-reader.bn-reader-fullscreen .bn-related-copy strong{font:600 13.5px/1.3 var(--font-ui,Inter,sans-serif);color:#ececE8;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
html body dialog.bn-reader.bn-reader-fullscreen .bn-related-copy small{font:400 12px/1.2 var(--font-ui,Inter,sans-serif);color:#9b9b96}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-related button>svg{flex:none;color:#9b9b96}

@media(max-width:980px){
 html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-layout{grid-template-columns:minmax(0,1fr)}
 html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-sidebar{position:static}
 html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-utility .bn-reader-talk{display:inline-flex;margin-left:auto;padding:0;border:0;background:none;color:#e6e6e2;font:inherit;cursor:pointer}
}
@media(max-width:680px){
 html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-bar{height:56px}
 html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-navigation{display:none}
 html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-breadcrumb{display:none}
 html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-visual>img:not(.bn-visual-watermark){max-width:56%;margin-right:4%}
 html body dialog.bn-reader.bn-reader-fullscreen .bn-visual-copy{max-width:52%}
 html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-body p,
 html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-body p.bn-lead{font:400 17px/1.6 var(--font-ui,Inter,sans-serif);color:#ededeb}
}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-context>a>svg:first-child{width:20px;height:20px;color:#d6d6d1}
html body dialog.bn-reader.bn-reader-fullscreen :is(.bn-related-image,.bn-reader-avatar) img[src*="crests/"]{object-fit:contain;padding:6px;box-sizing:border-box}

/* The reader uses the app header (a live copy of the masthead) instead of its own bar. */
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-masthead>.masthead{z-index:20}
/* Keep the cloned masthead in layout: its actual rail height reserves exactly its space. */
html body dialog.bn-reader.bn-reader-fullscreen{padding:0}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-masthead{position:sticky;top:0;z-index:20;background:#0b0b0b;padding-top:12px}
html[data-menu] body dialog.bn-reader.bn-reader-fullscreen .bn-reader-masthead>.masthead.masthead{position:relative!important;inset:auto!important;width:calc(100% - 32px)!important;max-width:none!important;margin:0 auto!important}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-masthead:has(.is-nav-hidden){background:transparent;pointer-events:none}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-inner{padding-top:20px}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-utility{min-height:40px;margin-bottom:20px}
html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-sidebar{top:160px}
@media(max-width:899px){
 html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-inner{padding-top:12px}
 html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-utility{min-height:40px;margin-bottom:18px}
 html body dialog.bn-reader.bn-reader-fullscreen .bn-reader-sidebar{position:static}
}
