/* ── moments.css — Going Concern: the special edition (moments.js). Tokens from desk.css.
   A newspaper's front page over the whole desk: the masthead in serif capitals between
   rules, the kicker in mono, a large headline, the deck in italic, the photograph as a
   halftone on paper (art4.js's .art-photo.paper), two columns of copy with a rule between
   them, the day's figures in mono and "Return to the desk". One motion under 300 ms, a
   rise and a fade, none under prefers-reduced-motion. One column on a phone. */

.gc-ed-overlay{ position:fixed; inset:0; z-index:750; background:var(--scrim-2); display:flex; align-items:flex-start; justify-content:center; padding:var(--sp-6) var(--sp-4); overflow:auto; }
.gc-ed-overlay.gc-ed-in{ animation:gc-ed-fade 220ms ease-out; }
.gc-ed-overlay.gc-ed-in .gc-ed{ animation:gc-ed-rise 260ms ease-out; }
@keyframes gc-ed-fade{ from{ opacity:0; } to{ opacity:1; } }
@keyframes gc-ed-rise{ from{ opacity:0; transform:translateY(var(--sp-2)); } to{ opacity:1; transform:none; } }

.doc.gc-ed{ width:min(calc(860 * var(--u)), 100%); margin:auto 0; padding:var(--sp-7) var(--page-1) var(--sp-6); line-height:var(--lh-4); }

/* the masthead */
.gc-ed-mast{ text-align:center; border-bottom:3px double var(--ink); padding-bottom:var(--sp-1h); margin-bottom:var(--sp-3h); }
.gc-ed-name{ font:600 calc(var(--fs-8) * 1.6)/var(--lh-1) var(--serif); letter-spacing:.02em; color:var(--ink); }
.gc-ed-meta{ display:flex; justify-content:space-between; gap:var(--sp-3); margin-top:var(--sp-2); padding-top:var(--sp-1); border-top:1px solid var(--ink); font:var(--fs-1)/var(--lh-2) var(--mono); letter-spacing:.14em; text-transform:uppercase; color:var(--ink-2); }

/* the front page */
.gc-ed-kicker{ font:600 var(--fs-1) var(--mono); letter-spacing:.2em; text-transform:uppercase; color:var(--ink-accent); }
.doc.gc-ed .gc-ed-head{ font:600 calc(var(--fs-8) * 1.35)/var(--lh-1) var(--serif); letter-spacing:-.01em; margin:var(--sp-1h) 0 var(--sp-2h); color:var(--ink); }
.gc-ed-deck{ font:italic var(--fs-6)/var(--lh-3) var(--serif); color:var(--ink-3); margin:0 0 var(--sp-3h); }
.gc-ed-photo .art-photo{ margin:0 0 var(--sp-3h); }
.gc-ed-photo .art-photo.paper .art-photo-in img{ height:calc(300 * var(--u)); }
.gc-ed-cols{ column-count:2; column-gap:var(--sp-7); column-rule:1px solid var(--rule); font-size:var(--fs-5); }
.gc-ed-cols p{ margin:0 0 var(--sp-2h); break-inside:avoid-column; text-align:justify; hyphens:auto; }
.gc-ed-cols p:first-child::first-letter{ float:left; font:600 calc(var(--fs-8) * 1.5)/.9 var(--serif); padding:var(--sp-1) var(--sp-1h) 0 0; color:var(--ink); }
.gc-ed-facts{ display:flex; flex-wrap:wrap; gap:var(--sp-2) var(--sp-5); margin-top:var(--sp-3); padding-top:var(--sp-2); border-top:1px solid var(--rule-2); font:var(--fs-2)/var(--lh-2) var(--mono); color:var(--ink-2); }
.gc-ed-facts b{ font-weight:500; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-dim); margin-right:var(--sp-1); }
.gc-ed-foot{ display:flex; justify-content:flex-end; margin-top:var(--sp-4); }

/* the Annals on NEWS */
.gc-ed-annals{ margin-top:var(--sp-4); }
.gc-ed-annals .row{ align-items:center; gap:var(--sp-2); padding:var(--sp-0) 0; }
.gc-ed-annals .gc-ed-when{ font:var(--fs-2) var(--mono); color:var(--muted); min-width:calc(64 * var(--u)); }
.gc-ed-annals .gc-ed-what{ flex:1; font-size:var(--fs-3); }

/* the phone: one column, the masthead smaller */
@media (max-width: 900px){
  .gc-ed-overlay{ padding:var(--sp-2); }
  .doc.gc-ed{ padding:var(--sp-5) var(--sp-4); }
  .gc-ed-name{ font-size:var(--fs-8); }
  .doc.gc-ed .gc-ed-head{ font-size:var(--fs-7); }
  .gc-ed-cols{ column-count:1; }
  .gc-ed-photo .art-photo.paper .art-photo-in img{ height:calc(200 * var(--u)); }
  .gc-ed-meta{ flex-wrap:wrap; justify-content:center; }
}

/* reduced motion: none of it */
@media (prefers-reduced-motion: reduce){
  .gc-ed-overlay.gc-ed-in, .gc-ed-overlay.gc-ed-in .gc-ed{ animation:none; }
}
/* a person on the front page (story.js passes a portrait): centred, the halftone at a readable size */
.gc-ed-portrait{ display:flex; justify-content:center; margin:0 0 var(--sp-3); } .gc-ed-portrait .art-face{ width:calc(240 * var(--u)) !important; height:calc(240 * var(--u)) !important; }
