/* Digest pages (news.html, papers.html).  Layers on styles.css: every colour,
   radius, shadow and typeface here resolves to one of that file's custom
   properties, directly or through a color-mix of one, so light/dark and any
   future recolour of --accent carry through with no edit made here.  There is
   no hardcoded hex in this file and no :root block, which is why there is no
   dark-theme override block either -- there is nothing local to override.

   Layout is deliberately plain: one column of cards, flex rows that wrap.
   Nothing on these pages is positioned, so there is nothing to overlap. */

.skip{position:absolute;left:-9999px;top:0;background:var(--accent);color:#fff;
  padding:.6rem 1rem;border-radius:0 0 var(--r-sm) 0;z-index:100}
.skip:focus{left:0}

/* ---------------------------------------------------------------- hero ---- */
.dg-hero{padding:calc(var(--nav-h,64px) + 3.2rem) 0 2rem;background:var(--bg-alt);
  border-bottom:1px solid var(--line)}
.dg-hero h1{font-family:var(--serif);font-size:clamp(1.9rem,4.4vw,3rem);
  line-height:1.08;margin:.35rem 0 .7rem;letter-spacing:-.02em}
.dg-lede{max-width:66ch;color:var(--ink-2);font-size:1.03rem;line-height:1.65}
.dg-lede strong{color:var(--ink)}
.dg-lede em{font-style:normal;font-weight:600;color:var(--ink-2)}

/* Freshness is stated, never implied, so it gets its own line rather than
   being folded into the lede.  The three states differ in weight, not only in
   wording, because a stale digest must not read like a current one. */
.dg-fresh{margin-top:1rem;font-family:var(--mono);font-size:.8rem;
  color:var(--ink-3);letter-spacing:.01em;line-height:1.6}
.dg-fresh-aging{color:var(--ink-2)}
.dg-fresh-stale{color:var(--ink);font-weight:500}

/* Same recipe as air.css's expired-forecast note, for the same reason: a
   payload that is not what it looks like has to say so before anything else. */
.dg-banner{margin:.8rem 0 0;padding:.7rem .9rem;font-size:.88rem;line-height:1.55;
  max-width:78ch;background:var(--accent-soft);border-left:3px solid var(--accent-2);
  border-radius:0 var(--r-sm) var(--r-sm) 0;color:var(--ink-2)}
.dg-banner strong{color:var(--ink)}

/* ------------------------------------------------------------ overview ---- */
/* The machine synthesis of the batch.  Visually apart from the item list,
   because it is a different kind of text: nothing in it was published by
   anyone. */
.dg-overview{margin:0 0 2rem;padding:1.2rem 1.4rem;background:var(--surface);
  border:1px solid var(--line);border-left:3px solid var(--accent);
  border-radius:var(--r);box-shadow:var(--shadow);max-width:78ch}
.dg-overview-txt{margin:0;font-family:var(--serif);font-size:1.12rem;
  line-height:1.55;color:var(--ink);letter-spacing:-.008em}

/* ------------------------------------------------------------ controls ---- */
.dg-controls{display:grid;gap:1.3rem;margin-bottom:1.4rem}
.dg-search{max-width:34rem}
.dg-search label{display:block;font-size:.78rem;font-weight:600;
  text-transform:uppercase;letter-spacing:.08em;color:var(--ink-3);
  margin-bottom:.4rem}
.dg-search input{width:100%;padding:.8rem 1rem;font:inherit;font-size:1rem;
  color:var(--ink);background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-sm);box-shadow:var(--shadow)}
.dg-search input:focus{outline:2px solid var(--accent);outline-offset:1px;
  border-color:var(--accent)}

.dg-facets{display:grid;gap:.9rem}
.dg-facet-lab{margin:0 0 .4rem;font-size:.78rem;font-weight:600;
  text-transform:uppercase;letter-spacing:.08em;color:var(--ink-3)}
.dg-chips{display:flex;flex-wrap:wrap;gap:.45rem}

/* meta.selection, verbatim.  Sits between the controls and the list because
   it has to be read, not found: it is the page's only statement about why
   these items and not others. */
.dg-selection{margin:0 0 1rem;padding:.7rem .9rem;max-width:78ch;
  font-size:.86rem;line-height:1.6;color:var(--ink-2);background:var(--bg-alt);
  border:1px solid var(--line);border-radius:var(--r-sm)}
.dg-sel-lab{display:block;font-family:var(--mono);font-size:.68rem;
  text-transform:uppercase;letter-spacing:.09em;color:var(--ink-3);
  margin-bottom:.25rem}

.dg-count{margin:0 0 1rem;font-family:var(--mono);font-size:.78rem;
  color:var(--ink-3);letter-spacing:.02em}

/* Loading, empty, no-match and load-failure all land here. */
.dg-state{padding:1.6rem 0;color:var(--ink-2);max-width:72ch}
.dg-state p{margin:0 0 .6rem;font-size:.95rem;line-height:1.6}
.dg-state-h{font-size:1.05rem !important;color:var(--ink);font-weight:500}

/* ---------------------------------------------------------------- list ---- */
.dg-list{list-style:none;margin:0;padding:0;display:grid;gap:1rem;
  max-width:var(--wrap)}
.dg-item{background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r);padding:1.2rem 1.3rem;box-shadow:var(--shadow)}
.dg-item-top{display:flex;flex-wrap:wrap;align-items:baseline;gap:.4rem .9rem;
  margin-bottom:.45rem}
.dg-src{font-size:.76rem;font-weight:600;text-transform:uppercase;
  letter-spacing:.07em;color:var(--accent)}
.dg-when{font-family:var(--mono);font-size:.74rem;color:var(--ink-3);
  cursor:help}
.dg-title{font-family:var(--serif);font-size:1.22rem;line-height:1.3;
  letter-spacing:-.012em;margin:0 0 .35rem}
.dg-title a{color:var(--ink);text-decoration:none;
  border-bottom:1px solid color-mix(in srgb,var(--accent) 34%,transparent);
  transition:color .18s,border-color .18s}
.dg-title a:hover{color:var(--accent);border-bottom-color:var(--accent)}
.dg-authors{margin:0 0 .45rem;font-size:.85rem;color:var(--ink-3);line-height:1.5}
.dg-summary{margin:0 0 .7rem;font-size:.95rem;line-height:1.65;color:var(--ink-2);
  max-width:74ch}

.dg-item-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem}
/* summary_by has to be legible at a glance, so the two provenances differ in
   hue as well as in wording: accent for a machine summary, neutral for the
   publisher's own words. */
.dg-by{font-size:11px;font-weight:600;letter-spacing:.04em;padding:4px 9px;
  border-radius:5px;white-space:nowrap;border:1px solid var(--line)}
.dg-by-ai{background:color-mix(in srgb,var(--accent-2) 14%,transparent);
  color:var(--accent-2);
  border-color:color-mix(in srgb,var(--accent-2) 34%,transparent)}
/* A summary written from a title alone is a weaker object than one written
   from an abstract, so it reads differently as well as saying so: a dashed
   edge and an unfilled ground, which survives being printed in grey. */
.dg-by-weak{background:transparent;color:var(--accent-2);
  border-style:dashed;
  border-color:color-mix(in srgb,var(--accent-2) 48%,transparent)}
.dg-by-src{background:var(--bg-alt);color:var(--ink-2)}
.dg-oa{font-size:11px;font-weight:600;letter-spacing:.04em;padding:4px 9px;
  border-radius:5px;white-space:nowrap;
  background:color-mix(in srgb,var(--accent) 13%,transparent);color:var(--accent);
  border:1px solid color-mix(in srgb,var(--accent) 34%,transparent)}
.dg-doi{font-family:var(--mono);font-size:11px;color:var(--ink-3);
  text-decoration:none;padding:4px 0;word-break:break-all}
.dg-doi:hover{color:var(--accent)}

/* --------------------------------------------------------------- about ---- */
.dg-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(22rem,1fr));
  gap:1.6rem 2.6rem}
.dg-cols h3{font-family:var(--serif);font-size:1.15rem;margin:0 0 .5rem}
.dg-cols h3 + p{margin-top:0}
.dg-cols p{font-size:.95rem;line-height:1.7;color:var(--ink-2);max-width:60ch}
.dg-cols strong{color:var(--ink)}
.dg-cols em{font-style:normal;font-weight:600;color:var(--ink-2)}

/* Every feed polled, with its yield, so the reader can check the list against
   what they expected to see. */
.dg-sources{margin:1.8rem 0 0;padding-top:1.2rem;border-top:1px solid var(--line);
  font-size:.8rem;line-height:1.9;color:var(--ink-3)}
.dg-sources a{color:var(--ink-2);text-decoration:none;
  border-bottom:1px solid var(--line)}
.dg-sources a:hover{color:var(--accent);border-bottom-color:var(--accent)}
.dg-src-lab{font-family:var(--mono);font-size:.72rem;text-transform:uppercase;
  letter-spacing:.09em;color:var(--ink-3)}
.dg-src-n{font-family:var(--mono);font-size:.7rem;color:var(--ink-3)}

@media (max-width:620px){
  .dg-item{padding:1rem}
  .dg-title{font-size:1.1rem}
  .dg-overview{padding:1rem 1.1rem}
  .dg-overview-txt{font-size:1.03rem}
}