/* confirmed.css: the "What's confirmed?" list (.cf).

   Philippe asked for this on 3 September: one central component, on About, the
   Scientific Committee page and Abstracts, so a reader can see in one place what is
   settled and what is not. Built 7 September, taken off the site with the rest of his
   short-term list later the same day, and restored here on its own.

   It also carries the Summit quick links, but not the old .ql: that component was
   taken off the site and Edgar asked for a fresh one, so .qn below is newly written
   and none of b6e1fef's .ql rules are here. The key dates (.kd), the profile grid
   (.pg) and the phone drawer's Close button remain off the site; their rules are in
   git at b6e1fef if any of them comes back.

   Values are literal and namespaced --irsicf-*, because the six study pages define
   --ink, --gold and --line with meanings of their own. */

/* confirmed.css: the factual layer of 7 September 2026.

   Four blocks and one fix, on every page grammar the site has: the "What's
   confirmed?" list (.cf), the key dates (.kd), the Summit quick links (.ql),
   the profile grid (.pg) the committee and speakers pages fill in later, and
   the phone drawer's Close button and scroll cue.

   Same conventions as bar.css, foot.css and summit-menu.css, for the same
   reason: the six study pages define --ink, --gold and --line with meanings
   of their own, so every value here is LITERAL, in its own namespace
   (--irsicf-*), and the theme flip is repeated in the three-part shape
   theme.css uses. Every selector is prefixed with its block, because the
   studies style bare h2, p, dl and a, and a bare class would lose to them.

   House rule: no em dashes anywhere. */

:root {
  --irsicf-paper:     #faf6ee;
  --irsicf-paper-2:   #f2ebde;
  --irsicf-ink:       #1b1712;
  --irsicf-ink-soft:  #574f42;
  --irsicf-line:      #ded3c1;
  --irsicf-gold:      #cba64e;
  --irsicf-gold-deep: #7d5f1f;
  --irsicf-gold-line: rgba(138,106,36,.42);
  --irsicf-serif:     Georgia, "Noto Serif", "Droid Serif", "Times New Roman", serif;
  --irsicf-sans:      "Public Sans", ui-sans-serif, system-ui, -apple-system, Segoe UI, sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --irsicf-paper:     #0d0b08;
    --irsicf-paper-2:   #17130e;
    --irsicf-ink:       #f6eee1;
    --irsicf-ink-soft:  #d6cbb8;
    --irsicf-line:      #3a3226;
    --irsicf-gold-deep: #dcbc71;
    --irsicf-gold-line: rgba(220,188,113,.45);
  }
}
:root[data-theme="dark"] {
  --irsicf-paper:     #0d0b08;
  --irsicf-paper-2:   #17130e;
  --irsicf-ink:       #f6eee1;
  --irsicf-ink-soft:  #d6cbb8;
  --irsicf-line:      #3a3226;
  --irsicf-gold-deep: #dcbc71;
  --irsicf-gold-line: rgba(220,188,113,.45);
}
/* ------------------------------------------------------ what's confirmed */

.cf {
  container-type: inline-size;
  margin: clamp(1.4rem, 3vh, 2rem) 0; padding: clamp(1.1rem, 2.4vw, 1.7rem);
  border: 1px solid var(--irsicf-line); border-radius: .55rem; background: var(--irsicf-paper-2);
  font-family: var(--irsicf-sans); font-size: 1rem; line-height: 1.5; color: var(--irsicf-ink);
  letter-spacing: normal; text-transform: none; font-style: normal; font-weight: 400;
}
.cf .cf__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .3rem 1rem; margin: 0 0 1rem; }
.cf .cf__h {
  margin: 0; font-family: var(--irsicf-serif); font-weight: 400; line-height: 1.15;
  font-size: clamp(1.45rem, 1.2rem + .9vw, 1.9rem); color: var(--irsicf-ink); letter-spacing: normal; text-transform: none;
}
.cf .cf__updated { margin: 0; font-family: var(--irsicf-sans); font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 600; color: var(--irsicf-ink-soft); }
.cf .cf__cols { display: grid; gap: 1.2rem; }
@container (min-width: 44rem) { .cf .cf__cols { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.4rem 2.2rem; } }
.cf .cf__k {
  display: flex; align-items: center; gap: .5rem; margin: 0 0 .45rem;
  font-family: var(--irsicf-sans); font-size: .68rem; letter-spacing: .17em; text-transform: uppercase; font-weight: 600;
  color: var(--irsicf-gold-deep); line-height: 1.3;
}
.cf .cf__k::before { content: ""; flex: none; width: .6rem; height: .6rem; border-radius: 50%; background: var(--irsicf-gold-deep); }
.cf .cf__col--no .cf__k::before { background: none; border: 1px solid var(--irsicf-gold-deep); }
.cf .cf__list { margin: 0; padding: 0; display: grid; gap: 0; }
.cf .cf__list > div { display: grid; grid-template-columns: minmax(7rem, 10.5rem) minmax(0, 1fr); gap: .2rem 1rem; padding: .5rem 0; border-top: 1px solid var(--irsicf-line); margin: 0; }
.cf .cf__list > div:first-child { border-top: 0; padding-top: 0; }
.cf .cf__list dt { margin: 0; font-family: var(--irsicf-sans); font-size: .84rem; font-weight: 600; letter-spacing: normal; text-transform: none; color: var(--irsicf-ink); line-height: 1.45; }
.cf .cf__list dd { margin: 0; font-family: var(--irsicf-sans); font-size: .95rem; line-height: 1.45; color: var(--irsicf-ink-soft); letter-spacing: normal; }
.cf .cf__list dd a {
  color: var(--irsicf-ink); font-weight: 400; text-decoration: underline; text-underline-offset: .18em;
  text-decoration-thickness: 1px; text-decoration-color: var(--irsicf-gold-line); border: 0;
}
.cf .cf__list dd a:hover, .cf .cf__list dd a:focus-visible { color: var(--irsicf-gold-deep); text-decoration-color: currentColor; }
.cf .cf__foot { margin: 1rem 0 0; font-family: var(--irsicf-sans); font-size: .86rem; line-height: 1.5; color: var(--irsicf-ink-soft); max-width: 60ch; }
.cf .cf__foot a { color: var(--irsicf-gold-deep); font-weight: 600; text-decoration: none; border: 0; border-bottom: 1px solid var(--irsicf-gold-line); }
.cf .cf__foot a:hover { border-bottom-color: currentColor; }
.cf :focus-visible { outline: 2px solid var(--irsicf-gold-deep); outline-offset: 2px; }
@container (max-width: 30rem) { .cf .cf__list > div { grid-template-columns: minmax(0, 1fr); gap: .1rem; } }
.glance__wrap .cf { margin-top: clamp(.6rem, 1.6vw, 1rem); }

/* ── Summit quick links (.qn) ─────────────────────────────────────────────────

   Philippe, 3 September: "Add quick-links navigation." One rail, in the same
   place on every Summit page: directly under the page's opening block.

   Eleven links, which is a lot to scan as one undifferentiated row, so they
   carry the grouping the Summit menu already uses. A hairline divider opens each
   group: the five programme pages, then the five visit pages, then the co-chairs.
   No eyebrow label above it; the nav's accessible name does that job without
   spending a line.

   Literal values in the --irsicf-* namespace, like the rest of this file, because
   the study pages define --ink, --gold and --line with meanings of their own. */

/* The rail sits at the top of the page, above the breadcrumb and the title, so it
   reads as this section's own navigation and lands in the same place whatever
   length the heading below it runs to. Its rule goes underneath for the same
   reason: the line belongs between the rail and the page, not above it. */
/* --irsiqn-air is the band's breathing room, spent once above the row and once below
   it. Above is bought with the offset that clears the fixed bar, below with padding,
   so the two have to be written together or the row sits high in its own band: it was
   28px above and 14px below on the document pages. */
:root { --irsiqn-air: .85rem; }
.doc > .qn:first-child { margin-top: var(--irsiqn-top, calc(var(--bar-h, 4.125rem) + var(--irsiqn-air))); }
.qn { margin-bottom: clamp(1.3rem, 3vh, 2rem); padding-bottom: var(--irsiqn-air);
  border-bottom: 1px solid var(--irsicf-line); }
/* .doc pads clamp(7rem, 16vh, 10rem) off the top, which is air for a page title
   sitting under the fixed bar. The rail is not a title and does not want that much:
   it left a 69px band of nothing between the bar and the first link. When the rail
   leads the page, the padding comes down to clear the bar and little else.
   Without :has() the page keeps the original spacing, which is loose but not broken. */
/* Measured off the bar rather than clamped against the viewport: the bar's height is
   what the row has to clear, and adding the band's air to it gives the same gap above
   the row as the padding gives below. A vh clamp could also fall short of the bar on a
   low window and slide the rail underneath it. */

/* The cinematic pages hold the rail directly in <main>, outside the padded wrapper
   their acts use, so it takes the page's own gutter. Scoped away from .doc, which
   already carries that gutter and would otherwise be indented twice. */
main:not(.doc) > .qn { padding-inline: var(--gut);
  margin-top: var(--irsiqn-top, calc(var(--bar-h, 4.75rem) + var(--irsiqn-air)));
  /* These pages open on a full-bleed act, and on /summit/ that act is a two-column
     split whose vertical rules and rotated labels begin immediately. At the shared
     spacing the rail's rule and those rules met, and the two read as one confused
     band. The rail needs to finish before the act starts. */
  margin-bottom: 0; }
/* /summit/ hangs a fixed decorative seam down the middle of the viewport, top 0,
   z-index 6, so it crossed the rail and the line fell between two links. The site bar
   already solves this for itself: it is transparent, and paints an opaque panel behind
   its own content with a ::before at inset 0. The rail does the same and sits one step
   above the seam, so it reads as the bar continuing rather than a band laid over the
   page. Same colour the bar uses. */
main:not(.doc) > .qn { position: relative; z-index: 7; }
main:not(.doc) > .qn::before { content: ""; position: absolute; inset: -8rem 0 0;
  background: var(--canvas, #0d0b08); z-index: -1; }
/* The panel reaches up past the top of the rail, not just around it. The space
   between the bar and the first link is part of the band, and left transparent it
   showed the grounds layer through: dark on the left half, the body ground on the
   right, so the band looked half-finished. The overhang ends up behind the bar,
   which paints its own opaque panel over it. */

.qn ul { list-style: none; margin: 0; padding: 0;
  display: flex; flex-wrap: wrap; justify-content: center; gap: .25rem 1rem; }
/* flex, so the item is the height of the link and nothing else. As a normal list
   item it inherited the page body line-height, taller than the link own, and the
   extra leading all landed above the text: the row sat low in its own band. */
.qn li { position: relative; display: flex; }
/* Wrapped, the two groups are already on separate lines, so the rule between
   them has nothing to separate and the extra margin it hangs from opens a gap
   in the middle of a row. Both go. quicklinks.js sets the attribute, so this
   follows the actual wrap rather than a breakpoint guessed against the font. */
.qn[data-qn-wrapped] li.qn__open { margin-left: 0; }
.qn[data-qn-wrapped] li.qn__open::before { display: none; }
.qn li.qn__open { margin-left: .95rem; }
.qn li.qn__open::before { content: ""; position: absolute; left: -.95rem;
  top: .3em; bottom: .3em; width: 1px; background: var(--irsicf-line); }
.qn a { display: inline-block; padding: .1rem 0;
  font-family: var(--irsicf-sans); font-size: .85rem; letter-spacing: .035em;
  color: var(--irsicf-ink-soft); text-decoration: none;
  border-bottom: 1px solid transparent; }
.qn a:hover { color: var(--irsicf-ink); border-bottom-color: var(--irsicf-gold-line); }
.qn a[aria-current] { color: var(--irsicf-ink); border-bottom-color: var(--irsicf-gold-deep); }
.qn a:focus-visible { outline: 2px solid var(--irsicf-gold-deep); outline-offset: 3px;
  border-radius: 1px; }

/* Taller targets wherever the pointer is a finger, not only where the screen
   is narrow. Gated on the width alone, this never reached a tablet: an iPad is
   820 to 1180 CSS px wide and every one of these rows stayed at the desktop's
   25px, which is a mouse's target given to a thumb. The width query below
   keeps its own copy for a narrow window on a desktop. Found in a WebKit touch
   sweep, 10 September 2026. */
@media (pointer: coarse) {
  .qn ul { gap: .3rem .85rem; }
  .qn a { padding: .38rem 0; }
}

@media (max-width: 34rem) {
  .qn ul { gap: .15rem .85rem; }
  /* Taller targets on touch: the desktop rail leaves 25px, and a thumb wants more.
     Padding grows the hit area without moving the text off its own line. */
  .qn a { font-size: .8rem; padding: .38rem 0; }
  .qn li.qn__open { margin-left: .75rem; }
  .qn li.qn__open::before { left: -.75rem; }
}