/* Desktop story/overview organization shares the original controls with mobile.
   This file owns only panel contents; column widths, resize and rails remain
   with the existing layout. No mobile hiding or panel animation is extended. */
@media(min-width:761px){
 /* The original article is available before its timeline details. Flex wrap
    keeps long publisher names reachable in a narrowed desktop column. */
 html[data-reader-skin] body.real-mode .reporting-timeline .timeline-source{gap:8px 12px;align-items:center;min-width:0}
 html[data-reader-skin] body.real-mode .reporting-timeline .timeline-source>.source-profile-link{min-width:0;max-width:100%;overflow-wrap:anywhere}
 html[data-reader-skin] body.real-mode .reporting-timeline .timeline-source>.article-read-link{margin-inline-start:auto;min-height:44px;max-width:100%;min-width:0;justify-content:center;line-height:1.35;overflow-wrap:anywhere}
 html[data-reader-skin] body.real-mode .reporting-timeline .timeline-source>.article-read-link>svg{flex:none}
 /* The selected story owns one navigation. Global destinations retain their
    existing sidebar/menu entries and reappear in other panel contexts. */
 html[data-reader-skin] body.real-mode #right-panel[data-panel=story] .panel-tabs.has-story-navigation{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) 44px;grid-auto-rows:minmax(44px,auto);width:100%;min-width:0;height:auto;min-height:44px;gap:3px;padding:4px 6px}
 html[data-reader-skin] body.real-mode #right-panel[data-panel=story] .panel-tabs.has-story-navigation>[data-panel]{display:none}
 html[data-reader-skin] body.real-mode #right-panel .panel-tabs>.story-panel-navigation{display:contents}
 html[data-reader-skin] body.real-mode #right-panel .story-panel-navigation>[data-detail-tab]{min-width:0;min-height:44px;height:auto;padding:7px 4px;border-radius:var(--reader-control-radius);font-family:var(--reader-skin-font);font-size:calc(12px * var(--ui-text-scale,1));line-height:1.25;letter-spacing:0;white-space:normal;overflow-wrap:anywhere;grid-row:1}
 html[data-reader-skin=current] body.real-mode #right-panel .story-panel-navigation>[data-detail-tab]{box-shadow:var(--reader-skin-bevel)}
 html[data-reader-skin=current] body.real-mode #right-panel .story-panel-navigation>[data-detail-tab].active{box-shadow:var(--reader-skin-pressed)}
 html[data-reader-skin=hybrid] body.real-mode #right-panel .story-panel-navigation>[data-detail-tab].active{color:var(--text);border-bottom:0;background:linear-gradient(145deg,color-mix(in srgb,var(--bluefill) 84%,var(--text)),var(--bluefill));box-shadow:var(--reader-capsule-shadow)}
 html[data-reader-skin] body.real-mode #right-panel .story-panel-navigation>[data-detail-tab=timeline]{grid-column:1}
 html[data-reader-skin] body.real-mode #right-panel .story-panel-navigation>[data-detail-tab=sources]{grid-column:2}
 html[data-reader-skin] body.real-mode #right-panel .story-panel-navigation>[data-detail-tab=compare]{grid-column:3}
 html[data-reader-skin] body.real-mode #right-panel[data-panel=story] .panel-tabs.has-story-navigation>.panel-close{display:inline-flex;grid-column:4;grid-row:1;align-self:center;justify-content:center;width:44px;height:44px;min-width:44px;min-height:44px;margin:0;padding:8px;color:var(--blue)}
 html[data-reader-skin] body.real-mode #right-panel .story-panel-navigation>[data-detail-tab]:focus-visible{outline:2px solid var(--reader-skin-focus);outline-offset:-2px}

 /* One overview navigation uses the existing close button. */
 html[data-reader-skin] body.real-mode #right-panel[data-panel=dashboard]>.panel-controls{display:none}
 html[data-reader-skin] body.real-mode #right-panel[data-panel=dashboard] .overview-home-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) 44px;align-items:center;gap:3px;min-width:0;padding:4px 6px}
 html[data-reader-skin] body.real-mode #right-panel[data-panel=dashboard] .overview-home-nav>button{min-width:0;min-height:44px;padding:7px 4px;font-family:var(--reader-skin-font);font-size:calc(12px * var(--ui-text-scale,1));line-height:1.25;white-space:normal;overflow-wrap:anywhere}
 html[data-reader-skin] body.real-mode #right-panel[data-panel=dashboard] .overview-home-nav>.panel-close{display:inline-flex;justify-content:center;width:44px;height:44px;margin:0;padding:8px;color:var(--blue);align-self:center}

 /* Six actions remain together even in a 300px resized pane. Captions can
    wrap with enlarged text; real counts and account/retry notices stay intact. */
 html[data-reader-skin] body.real-mode #right-panel .story-reporting.story-workspace-toolbar>.detail-top{display:grid;grid-template-columns:repeat(6,minmax(44px,1fr));gap:2px;align-items:stretch;padding:5px 4px;min-width:0;min-height:44px}
 html[data-reader-skin] body.real-mode #right-panel .story-workspace-toolbar .detail-top :is(.story-reaction-section,.story-reaction-group,.story-quick-actions){display:contents}
 html[data-reader-skin] body.real-mode #right-panel .story-workspace-toolbar .detail-top :is(.story-back,.story-close,.story-more-actions){display:none}
 html[data-reader-skin] body.real-mode #right-panel .story-workspace-toolbar .detail-top :is(.story-reaction-button,.story-save,.story-comments,.story-share,.story-follow){display:inline-flex;align-items:center;justify-content:flex-start;flex-direction:column;grid-row:1;order:0;min-width:44px;min-height:64px;width:100%;height:100%;margin:0;padding:6px 2px;border:0;gap:3px;font-family:var(--reader-skin-font);line-height:1.2}
 html[data-reader-skin] body.real-mode #right-panel .story-workspace-toolbar [data-story-reaction="1"]{grid-column:1;color:var(--red)}
 html[data-reader-skin] body.real-mode #right-panel .story-workspace-toolbar [data-story-reaction="-1"]{grid-column:2;color:var(--blue)}
 html[data-reader-skin] body.real-mode #right-panel .story-workspace-toolbar .story-save{grid-column:3}
 html[data-reader-skin] body.real-mode #right-panel .story-workspace-toolbar .story-comments{grid-column:4}
 html[data-reader-skin] body.real-mode #right-panel .story-workspace-toolbar .story-share{grid-column:5}
 html[data-reader-skin] body.real-mode #right-panel .story-workspace-toolbar .story-follow{grid-column:6}
 html[data-reader-skin] body.real-mode #right-panel .story-workspace-toolbar .story-reaction-button[data-story-reaction="1"][aria-pressed=true]{background:var(--redfill);color:var(--red)}
 html[data-reader-skin] body.real-mode #right-panel .story-workspace-toolbar .story-reaction-button[data-story-reaction="-1"][aria-pressed=true]{background:var(--bluefill);color:var(--blue)}
 html[data-reader-skin] body.real-mode #right-panel .story-workspace-toolbar .detail-top :is(button,a):focus-visible{outline:2px solid var(--reader-skin-focus);outline-offset:-2px}
 html[data-reader-skin] body.real-mode #right-panel .story-workspace-toolbar .detail-top :is(.story-reaction-section>h3,.reaction-explanation){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
 html[data-reader-skin] body.real-mode #right-panel .story-workspace-toolbar .detail-top .story-action-caption{display:block;position:static;min-width:0;width:100%;height:auto;margin:0;padding:0;overflow:visible;clip-path:none;white-space:normal;overflow-wrap:anywhere;font-family:var(--reader-skin-font);font-size:calc(10px * var(--ui-text-scale,1));font-weight:400;line-height:1.2;text-align:center;letter-spacing:0}
 html[data-reader-skin] body.real-mode #right-panel .story-workspace-toolbar .story-reaction-button>span:first-child{display:block;height:20px;font-size:22px;line-height:20px}
 html[data-reader-skin] body.real-mode #right-panel .story-workspace-toolbar .story-reaction-button>b{display:block;width:100%;max-width:100%;margin:0;text-align:center;font-size:calc(10px * var(--ui-text-scale,1));line-height:1.2;overflow-wrap:anywhere}
 html[data-reader-skin] body.real-mode #right-panel .story-workspace-toolbar .detail-top svg{flex:none;width:20px;height:20px}
 html[data-reader-skin] body.real-mode #right-panel .story-workspace-toolbar .reaction-notice{display:flex;flex-wrap:wrap;align-items:center;grid-column:1/-1;grid-row:2;gap:0 10px;min-width:0;padding:0 4px 3px}
 html[data-reader-skin] body.real-mode #right-panel .story-workspace-toolbar .reaction-notice .reaction-status{flex:1 1 170px;min-width:0;min-height:0;margin:0;font-family:var(--reader-skin-font);font-size:calc(11px * var(--ui-text-scale,1));line-height:1.4;color:var(--muted);overflow-wrap:anywhere}
 html[data-reader-skin] body.real-mode #right-panel .story-workspace-toolbar .reaction-notice .reaction-error{color:var(--red)}
 html[data-reader-skin] body.real-mode #right-panel .story-workspace-toolbar .reaction-notice :is(.reaction-account-link,.reaction-retry){flex:0 1 auto;min-width:44px;min-height:44px;width:auto;height:auto;padding:4px 0;font-family:var(--reader-skin-font);font-size:calc(11px * var(--ui-text-scale,1));line-height:1.4;text-align:left;white-space:normal;overflow-wrap:anywhere}

 /* Previous/next keep the actual neighboring titles supplied by reader-flow,
    with their complete accessible names and separate reading-sequence count. */
 html[data-reader-skin] body.real-mode #right-panel .story-reporting .story-navigation{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 8px}
 html[data-reader-skin] body.real-mode #right-panel .story-reporting .story-navigation>[data-reader-step]{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;min-width:0;min-height:52px;gap:4px;padding:7px 10px;text-align:left}
 html[data-reader-skin] body.real-mode #right-panel .story-reporting .story-navigation>[data-reader-step=previous]{grid-column:1;grid-row:1}
 html[data-reader-skin] body.real-mode #right-panel .story-reporting .story-navigation>[data-reader-step=next]{grid-column:2;grid-row:1}
 html[data-reader-skin] body.real-mode #right-panel .story-reporting .story-navigation>span{grid-column:1/-1;grid-row:2;max-width:none}
 html[data-reader-skin] body.real-mode #right-panel .story-reporting .story-navigation>.story-navigation-more{grid-column:1/-1}
 html[data-reader-skin] body.real-mode #right-panel .story-reporting .story-navigation .story-step-direction{font-size:calc(11px * var(--ui-text-scale,1));line-height:1.2;color:var(--muted)}
 html[data-reader-skin] body.real-mode #right-panel .story-reporting .story-navigation .story-step-title{display:block;width:100%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:calc(12px * var(--ui-text-scale,1));line-height:1.3;color:var(--blue)}

 /* Raise only the existing PLUS CTA beside its heading. The larger PLUS
    redesign remains a separate preview, with no new content or destination. */
 html[data-reader-skin] body.real-mode #right-panel .member-hub{display:grid;grid-template-columns:minmax(0,1fr) minmax(108px,.72fr);align-items:center;gap:12px 14px;padding:16px 14px}
 html[data-reader-skin] body.real-mode #right-panel .member-hub :is(.member-hub-heading,.member-hub-actions){display:contents}
 html[data-reader-skin] body.real-mode #right-panel .member-hub .plus-kicker{grid-column:1/-1;grid-row:1;min-width:0;margin:0}
 html[data-reader-skin] body.real-mode #right-panel .member-hub .member-hub-heading h2{grid-column:1;grid-row:2;min-width:0;margin:0;font-size:calc(22px * var(--ui-text-scale,1));line-height:1.15;overflow-wrap:normal}
 html[data-reader-skin] body.real-mode #right-panel .member-hub .member-hub-heading .hub-symbol{display:none}
 html[data-reader-skin] body.real-mode #right-panel .member-hub .member-hub-actions>.plus-button{grid-column:2;grid-row:2;align-self:center;justify-self:stretch;min-width:0;min-height:44px;padding:9px 7px;font-size:calc(12px * var(--ui-text-scale,1));line-height:1.3;white-space:normal;text-align:center}
 html[data-reader-skin] body.real-mode #right-panel .member-hub>p{grid-column:1/-1;grid-row:3;min-width:0;margin:0}
 html[data-reader-skin] body.real-mode #right-panel .member-hub .local-activity-link{grid-column:1/-1;grid-row:4;justify-self:start;min-height:44px;margin:0;padding:3px 0}
}
@media(min-width:761px) and (forced-colors:active){
 /* Moved tabs no longer inherit the story-content-only fallback. Use system
    colors for both skins and for every genuinely pressed toolbar action. */
 html[data-reader-skin][data-theme] body.real-mode #right-panel .story-panel-navigation>[data-detail-tab][aria-pressed=true],
 html[data-reader-skin][data-theme] body.real-mode #right-panel .story-workspace-toolbar .detail-top :is(.story-reaction-button,.story-save,.story-follow)[aria-pressed=true]{background:Highlight;color:HighlightText;box-shadow:none;outline:1px solid Highlight;outline-offset:-1px}
}
