/* ==========================================================================
   Threads of Our Legacy — Option Two.
   The owner's locked direction (Visual Reference Book, October 21, 2026): warm ivory
   pages, near-black bands, antique gold, one oversized editorial serif over a clean sans,
   thin gold rules and a single gold thread that runs through the story.

   Layered over fd26.css and scoped to body.o2, so the shared behaviour (dialogs, toasts,
   icons, checkout buttons) keeps working and the staff tools are untouched. Two families:
   Bodoni Moda for display, Libre Franklin for everything read.
   ========================================================================== */

@font-face{font-family:"Bodoni Moda";font-style:normal;font-weight:400 900;font-display:swap;src:url("/assets/fonts/BodoniModa-latin.woff2") format("woff2")}
@font-face{font-family:"Bodoni Moda";font-style:italic;font-weight:400 900;font-display:swap;src:url("/assets/fonts/BodoniModa-italic-latin.woff2") format("woff2")}
@font-face{font-family:"Libre Franklin";font-style:normal;font-weight:100 900;font-display:swap;src:url("/assets/fonts/LibreFranklin-latin.woff2") format("woff2")}

body.o2 [class*="o2-"]{font-optical-sizing:none}
body.o2{
  /* surfaces */
  --o-ivory:#F4EEE3; --o-ivory-2:#FAF6EE; --o-paper:#FFFDF8; --o-sand:#E7DCC8;
  --o-ink:#0D0B09; --o-ink-2:#15120E; --o-ink-3:#1F1A14;
  /* gold: one hue, three jobs */
  --o-gold:#B8893B;          /* rules, icons, fills */
  --o-gold-hi:#D9B96E;       /* gold type on ink (9.6:1) */
  --o-gold-ink:#86601C;      /* gold type on ivory (5.2:1) */
  --o-gold-grad:linear-gradient(180deg,#E6C87E 0%,#C99A47 55%,#B08033 100%);
  --o-gold-type:linear-gradient(180deg,#9C7230 0%,#875E22 55%,#6E4B18 100%);
  /* type ink */
  --o-text:#14110D; --o-text-2:#4A4238; --o-text-3:#6A6052;
  --o-on-ink:#F5EFE4; --o-on-ink-2:#CFC5B5; --o-on-ink-3:#A79C8C;
  --o-rule:rgba(184,137,59,.55); --o-rule-soft:rgba(134,96,28,.22); --o-rule-ink:rgba(217,185,110,.28);
  /* type */
  --o-display:"Bodoni Moda","EB Garamond",Didot,"Bodoni 72",Georgia,serif;
  --o-sans:"Libre Franklin",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --o-wrap:1320px; --o-gut:clamp(16px,4vw,64px);
  --o-mast:64px;

  /* Re-point fd26's contextual tokens so its shared components sit right on ivory. */
  --fg:var(--o-text); --fg-2:var(--o-text-2); --fg-3:var(--o-text-3);
  --bg:var(--o-ivory); --surface:var(--o-paper); --surface-2:#fff;
  --line:var(--o-rule-soft); --line-strong:rgba(134,96,28,.4);
  --accent-text:var(--o-gold-ink); --input-bg:#fff;
  --f-serif:var(--o-display); --f-sans:var(--o-sans);
  --c-focus:#8E6420; --header-h:var(--o-mast);
  background:var(--o-ivory); color:var(--o-text); color-scheme:light;
  font:400 1.0625rem/1.6 var(--o-sans);
  -webkit-font-smoothing:antialiased;
}
html:has(body.o2){background:var(--o-ink,#0D0B09)}
body.o2 :focus-visible{outline:2px solid #8E6420;outline-offset:3px}
body.o2 .o2-ink :focus-visible,body.o2 .o2-mast :focus-visible,body.o2 .o2-foot :focus-visible{outline-color:#E6C87E}
body.o2 ::selection{background:rgba(201,154,71,.32)}
.o2-wrap{width:100%;max-width:var(--o-wrap);margin-inline:auto;padding-inline:var(--o-gut)}
.o2-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- type ---------------------------------------------------------- */
.o2-eyebrow{display:flex;align-items:center;gap:.9rem;margin:0;font:600 .72rem/1.2 var(--o-sans);letter-spacing:.32em;text-transform:uppercase;color:var(--o-gold-ink)}
.o2-eyebrow::after{content:"";flex:0 0 clamp(28px,4vw,56px);height:1px;background:var(--o-gold)}
.o2-ink .o2-eyebrow{color:var(--o-gold-hi)}
.o2-h{margin:0;font-family:var(--o-display);font-weight:700;font-optical-sizing:none;font-variation-settings:"opsz" 28;letter-spacing:-.03em;line-height:1;text-wrap:balance;color:var(--o-text)}
.o2-ink .o2-h{color:var(--o-on-ink)}
.o2-h--xl{font-size:clamp(3rem,1.6rem + 6vw,7.25rem)}
.o2-h--l{font-size:clamp(2.5rem,1.5rem + 4.2vw,5.4rem)}
.o2-h--m{font-size:clamp(2.1rem,1.4rem + 2.6vw,3.9rem)}
.o2-h--s{font-size:clamp(1.6rem,1.2rem + 1.4vw,2.4rem);letter-spacing:-.025em;line-height:1.06}
.o2-gold{color:var(--o-gold-ink);background:var(--o-gold-type);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.o2-ink .o2-gold{background:linear-gradient(180deg,#EED18A 0%,#D4AA5C 60%,#B98A3E 100%);-webkit-background-clip:text;background-clip:text}
@media (forced-colors:active){.o2-gold{-webkit-text-fill-color:currentColor;background:none}}
.o2-it{font-style:italic;font-weight:600}
.o2-caps{font:500 clamp(.95rem,.85rem + .35vw,1.18rem)/1.25 var(--o-display);letter-spacing:.24em;text-transform:uppercase;color:var(--o-text)}
.o2-caps small{display:block;margin-top:.35rem;font:600 .72rem/1.2 var(--o-sans);letter-spacing:.34em}
.o2-ink .o2-caps{color:var(--o-on-ink)}
.o2-lede{margin:0;font:400 clamp(1.25rem,1.05rem + .8vw,1.7rem)/1.32 var(--o-display);font-variation-settings:"opsz" 28;color:var(--o-text);max-width:30ch;text-wrap:pretty}
.o2-ink .o2-lede{color:var(--o-on-ink)}
.o2-body{margin:0;max-width:56ch;color:var(--o-text-2);font-size:1.0625rem;line-height:1.62;text-wrap:pretty}
.o2-ink .o2-body{color:var(--o-on-ink-2)}
.o2-small{font-size:.875rem;line-height:1.5;color:var(--o-text-3)}
.o2-ink .o2-small{color:var(--o-on-ink-3)}
.o2-rule{display:block;width:56px;height:1px;background:var(--o-gold);border:0;margin:0}
.o2-tbc{color:var(--o-text-3);font-style:italic}

/* ---------- buttons ------------------------------------------------------- */
.o2-btn{display:inline-flex;align-items:center;justify-content:center;gap:.7rem;min-height:52px;padding:0 1.75rem;border-radius:999px;border:1px solid transparent;
  font:600 1rem/1 var(--o-sans);letter-spacing:.005em;text-decoration:none;cursor:pointer;white-space:nowrap;
  transition:transform .16s ease,box-shadow .2s ease,background-color .2s ease,color .2s ease,border-color .2s ease}
.o2-btn .icon{width:18px;height:18px;flex:none;transition:transform .2s ease}
.o2-btn:hover .icon{transform:translateX(3px)}
.o2-btn:active{transform:translateY(1px)}
.o2-btn--ink{background:var(--o-ink);color:#fff;box-shadow:0 10px 24px -14px rgba(13,11,9,.7)}
.o2-btn--ink:hover{background:#26201A}
.o2-btn--gold{background:var(--o-gold-grad);color:var(--o-ink);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 10px 24px -14px rgba(120,80,20,.8)}
.o2-btn--gold:hover{filter:brightness(1.05)}
.o2-btn--line{background:transparent;color:var(--o-text);border-color:var(--o-text)}
.o2-btn--line:hover{background:var(--o-text);color:var(--o-ivory)}
.o2-ink .o2-btn--line{color:var(--o-on-ink);border-color:var(--o-gold)}
.o2-ink .o2-btn--line:hover{background:var(--o-gold);color:var(--o-ink)}
.o2-btn--sm{min-height:44px;padding:0 1.2rem;font-size:.9rem}
.o2-btn--block{width:100%}
.o2-btn[aria-busy="true"]{opacity:.7;cursor:progress}
.o2-btn[aria-disabled="true"],.o2-btn:disabled{opacity:.5;cursor:not-allowed}
.o2-link{display:inline-flex;align-items:center;gap:.5rem;min-height:44px;padding:0;background:none;border:0;cursor:pointer;
  font:600 .95rem/1.2 var(--o-sans);color:var(--o-text);text-decoration:underline;text-decoration-color:var(--o-gold);text-decoration-thickness:1.5px;text-underline-offset:.45em}
.o2-link:hover{color:var(--o-gold-ink)}
.o2-ink .o2-link{color:var(--o-on-ink)}
.o2-ink .o2-link:hover{color:var(--o-gold-hi)}
.o2-link .icon{width:16px;height:16px}
.o2-actions{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 2rem}

/* ---------- masthead ------------------------------------------------------ */
.o2-mast{position:sticky;top:0;z-index:var(--z-header,70);background:rgba(13,11,9,.97);color:var(--o-on-ink);border-bottom:1px solid rgba(217,185,110,.16)}
@supports (backdrop-filter:blur(8px)){.o2-mast{background:rgba(13,11,9,.88);backdrop-filter:saturate(140%) blur(10px)}}
.o2-mast__row{display:flex;align-items:center;gap:1rem;min-height:var(--o-mast)}
/* The brand never shrinks: it keeps its full width so the nav can never ride onto the
   wordmark, whatever the screen width or how the font renders. */
.o2-brand{display:flex;align-items:center;gap:.85rem;text-decoration:none;color:inherit;flex:0 0 auto;padding-block:.35rem}
.o2-brand img{width:30px;height:auto;flex:none}
.o2-brand__t{display:grid;gap:.28rem}
.o2-brand__l1{font:600 .95rem/1 var(--o-sans);letter-spacing:.2em;text-transform:uppercase;color:#fff;white-space:nowrap}
.o2-brand__l2{font:600 .6rem/1 var(--o-sans);letter-spacing:.18em;text-transform:uppercase;color:var(--o-gold-hi);white-space:nowrap}
.o2-brand__l2 i{font-style:normal;display:inline-block;margin:0 .55em;width:1px;height:.9em;background:currentColor;vertical-align:-.1em;opacity:.7}
.o2-nav{display:none;align-items:stretch;margin-left:auto;align-self:stretch}
.o2-nav a{position:relative;display:flex;align-items:center;white-space:nowrap;padding:0 clamp(1rem,2vw,1.9rem);font:600 .74rem/1 var(--o-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--o-on-ink);text-decoration:none;border-left:1px solid rgba(217,185,110,.32);margin-block:14px}
.o2-nav a:last-child{border-right:1px solid rgba(217,185,110,.32)}
.o2-nav a:hover{color:var(--o-gold-hi)}
.o2-nav a[aria-current="page"]::after{content:"";position:absolute;left:clamp(1rem,2vw,1.9rem);right:clamp(1rem,2vw,1.9rem);bottom:-6px;height:1.5px;background:var(--o-gold-hi)}
.o2-mast__cta{margin-left:auto;display:flex;align-items:center;gap:.6rem}
.o2-mast__cta .o2-btn{min-height:42px;padding:0 1.35rem;font-size:.95rem}
/* Donate sits beside the ticket button, quieter than it: an outline, not a second gold
   call. Below 900px the masthead has no room for two, and the menu carries the gift. */
.o2-mast__give{display:none;min-height:38px;padding:0 1rem;font-size:.85rem;border-color:rgba(217,185,110,.55);color:var(--o-gold-hi)}
.o2-mast__give:hover{background:rgba(217,185,110,.12);border-color:var(--o-gold-hi);color:#fff}
@media (min-width:900px){.o2-mast__give{display:inline-flex}}
.o2-mast__menu{display:inline-grid;place-items:center;flex:0 0 46px;width:46px;height:46px;margin-right:-8px;background:none;border:0;color:var(--o-gold-hi);border-radius:8px}
.o2-mast__menu .icon{width:28px;height:28px;stroke-width:1.6}
.o2-mast__menu:hover{background:rgba(255,255,255,.06)}
@media (max-width:719px){.o2-mast__cta{display:none}.o2-mast__menu{margin-left:auto}}
@media (min-width:1120px){
  .o2-nav{display:flex}
  .o2-mast__cta{margin-left:clamp(1rem,2vw,2rem)}
  .o2-mast__menu{display:none}
  body.o2{--o-mast:72px}
  .o2-brand img{width:34px}
  .o2-brand__l1{font-size:1.05rem}
}
@media (max-width:420px){.o2-brand__l1{font-size:.82rem;letter-spacing:.14em}.o2-brand__l2{font-size:.54rem;letter-spacing:.12em}}

/* ---------- hero: copy on ivory, art bleeding in from the right ----------- */
.o2-hero{position:relative;background:var(--o-ivory);overflow:hidden;isolation:isolate}
.o2-hero__grid{display:grid;align-items:center}
.o2-hero__copy{position:relative;z-index:2;display:grid;gap:clamp(1rem,.6rem + 1vw,1.6rem);padding-block:clamp(2rem,1rem + 3vw,4rem)}
.o2-hero__top,.o2-hero__rest{display:grid;gap:clamp(1rem,.6rem + 1vw,1.6rem);align-content:start}
.o2-hero__art{position:relative;margin:0}
.o2-hero__art img{width:100%;height:100%;object-fit:cover}
.o2-hero__crumbs{display:flex;gap:.5rem;align-items:center;font:500 .8rem/1.2 var(--o-sans);color:var(--o-text-2)}
.o2-hero__crumbs a{color:inherit;text-decoration:none;display:inline-flex;align-items:center;min-height:44px}.o2-hero__crumbs a:hover{text-decoration:underline}
.o2-hero__crumbs span[aria-hidden]{opacity:.6}
/* A phone reads title, picture, then the rest: the copy block dissolves so its two
   halves can sit either side of the art. */
@media (max-width:899px){
  .o2-hero__copy{display:contents}
  .o2-hero__top{order:1;padding-block:1.75rem 1.25rem}
  .o2-hero__art{order:2;margin-inline:calc(var(--o-gut) * -1);aspect-ratio:4/3}
  .o2-hero__art img{-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 12%,#000 88%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 12%,#000 88%,transparent 100%)}
  .o2-hero__rest{order:3;padding-block:1.25rem 2.5rem}
}
@media (min-width:900px){
  .o2-hero__grid{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);min-height:min(80vh,760px)}
  .o2-hero__art{position:absolute;inset:0 0 0 auto;width:62%}
  .o2-hero__art img{-webkit-mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.35) 12%,#000 34%);mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.35) 12%,#000 34%)}
  .o2-hero--short .o2-hero__grid{min-height:min(64vh,580px)}
}

/* ---------- dark band ---------------------------------------------------- */
.o2-ink{background:var(--o-ink);color:var(--o-on-ink);position:relative}
.o2-ink--tex{background:radial-gradient(120% 140% at 90% 0%,rgba(184,137,59,.12),transparent 55%),var(--o-ink)}
.o2-sec{padding-block:clamp(3rem,2rem + 4vw,6rem)}
.o2-sec--tight{padding-block:clamp(2rem,1.4rem + 2.5vw,3.75rem)}
.o2-head .o2-h{margin-top:1rem}
.o2-head{display:grid;gap:1.25rem 3rem;align-items:end;margin-bottom:clamp(1.75rem,1rem + 2vw,3rem)}
@media (min-width:900px){.o2-head{grid-template-columns:minmax(0,2.1fr) minmax(0,1fr)}}
.o2-head .o2-body{font:400 clamp(1rem,.95rem + .25vw,1.15rem)/1.5 var(--o-display);font-variation-settings:"opsz" 18}

/* ---------- the week as rows (home) --------------------------------------- */
.o2-rows{list-style:none;margin:0;padding:0;border-top:1px solid var(--o-rule-ink)}
.o2-row{border-bottom:1px solid var(--o-rule-ink)}
.o2-row a{display:grid;grid-template-columns:88px minmax(0,1fr) 28px;align-items:center;gap:1rem;min-height:104px;padding-block:.75rem;color:inherit;text-decoration:none;position:relative}
.o2-row__date{display:grid;gap:.25rem;font:600 .78rem/1 var(--o-sans);letter-spacing:.2em;text-transform:uppercase;color:var(--o-on-ink)}
.o2-row__date b{font-weight:600;font-size:1.05rem;letter-spacing:.14em;color:var(--o-gold-hi)}
.o2-row__title{font:500 clamp(1.35rem,1.1rem + .8vw,1.8rem)/1.08 var(--o-display);font-optical-sizing:none;font-variation-settings:"opsz" 20;letter-spacing:-.015em;color:#fff}
.o2-row__tag{display:block;margin-top:.35rem;font:400 .95rem/1.35 var(--o-display);color:var(--o-on-ink-2)}
.o2-row__img{display:none}
.o2-row__go{color:var(--o-gold-hi);justify-self:end}
.o2-row__go .icon{width:26px;height:26px;stroke-width:1.4;transition:transform .2s ease}
.o2-row a:hover .o2-row__go .icon{transform:translateX(5px)}
.o2-row a:hover .o2-row__title{color:var(--o-gold-hi)}
@media (max-width:719px){
  .o2-row a{grid-template-columns:minmax(104px,38%) minmax(0,1fr) 26px;gap:.9rem;padding-block:.65rem}
  .o2-row__img{display:block;grid-row:1;grid-column:1;aspect-ratio:16/10;border-radius:6px;overflow:hidden;border:1px solid var(--o-rule-ink)}
  .o2-row__img img{width:100%;height:100%;object-fit:cover}
  .o2-row__date{grid-column:2;grid-row:1;align-self:start;display:flex;gap:.8rem;margin-top:.15rem;font-size:.72rem}
  .o2-row__date b{font-size:.74rem}
  .o2-row__title{font-size:1.2rem}
  .o2-row__tag{font-size:.85rem}
  .o2-row__text{grid-column:2;grid-row:1;align-self:end;padding-top:1.6rem}
  .o2-row__go{grid-column:3;grid-row:1}
}
@media (min-width:720px){
  .o2-row a{grid-template-columns:112px 1px minmax(0,1.05fr) minmax(0,1fr) 40px;gap:0 2rem}
  .o2-row a::before{content:"";grid-column:2;grid-row:1;align-self:stretch;margin-block:.9rem;background:var(--o-gold);opacity:.7}
  .o2-row__date{grid-column:1;grid-row:1}
  .o2-row__text{grid-column:3;grid-row:1;display:grid;grid-template-columns:minmax(0,1fr);gap:.2rem}
  .o2-row__img{display:block;grid-column:4;grid-row:1;height:92px;border-radius:2px;overflow:hidden}
  .o2-row__img img{width:100%;height:100%;object-fit:cover;-webkit-mask-image:linear-gradient(90deg,transparent,#000 40%);mask-image:linear-gradient(90deg,transparent,#000 40%);transition:transform .6s ease}
  .o2-row a:hover .o2-row__img img{transform:scale(1.04)}
  .o2-row__go{grid-column:5;grid-row:1}
}
@media (min-width:1080px){
  .o2-row a{grid-template-columns:110px 1px minmax(0,1fr) minmax(0,.62fr) minmax(0,1fr) 48px;min-height:110px}
  .o2-row__text{display:contents}
  /* The title keeps its own column and wraps inside it. It used to be nowrap, which the
     longest night — Founders' Day Brunch & Ceremony — overflowed straight across the
     tagline beside it. */
  .o2-row__title{grid-column:3;grid-row:1;min-width:0;text-wrap:balance;align-self:center}
  .o2-row__tag{grid-column:4;grid-row:1;margin:0;font-size:.9rem;max-width:22ch;min-width:0;align-self:center}
  .o2-row__img{grid-column:5}
  .o2-row__go{grid-column:6}
}

/* ---------- facts bar ----------------------------------------------------- */
.o2-facts{background:var(--o-ink);color:var(--o-on-ink)}
.o2-facts__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:0}
.o2-fact{display:grid;justify-items:center;align-content:center;gap:.35rem;text-align:center;padding:1.6rem 1rem;position:relative}
.o2-fact + .o2-fact::before{content:"";position:absolute;left:0;top:22%;bottom:22%;width:1px;background:var(--o-gold);opacity:.55}
.o2-fact > .icon{width:30px;height:30px;color:var(--o-gold-hi);stroke-width:1.4;margin-bottom:.3rem}
.o2-fact__k{font:600 .68rem/1.2 var(--o-sans);letter-spacing:.24em;text-transform:uppercase;color:var(--o-on-ink-2)}
.o2-fact__big{font:500 clamp(1.5rem,1.2rem + 1vw,2rem)/1.05 var(--o-display);color:var(--o-gold-hi);letter-spacing:-.01em}
.o2-fact__v{font:500 1.05rem/1.3 var(--o-display);color:#fff}
.o2-fact__v--caps{font:600 1.2rem/1.1 var(--o-display);letter-spacing:.06em;text-transform:uppercase}
.o2-fact__n{font:500 .9rem/1.4 var(--o-sans);color:var(--o-on-ink)}
.o2-fact a:not(.o2-btn){color:var(--o-gold-hi);font:600 .85rem/1.2 var(--o-sans);text-decoration:underline;text-underline-offset:.3em;display:inline-flex;align-items:center;gap:.35rem;min-height:44px}
.o2-fact__price{font:500 1.6rem/1.1 var(--o-display);color:var(--o-gold-hi)}
.o2-fact__price small{font:500 .85rem/1 var(--o-sans);color:#fff;margin-left:.5rem}
.o2-fact__tools{display:flex;gap:1.75rem;justify-content:center;margin-top:.75rem}
.o2-tool{display:grid;justify-items:center;gap:.35rem;background:none;border:0;color:#fff;font:500 .72rem/1.15 var(--o-sans);text-align:center;text-decoration:none;cursor:pointer;min-width:56px}
.o2-tool span.o2-tool__ring{display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--o-gold);border-radius:50%;transition:background .2s ease}
.o2-tool:hover span.o2-tool__ring{background:rgba(217,185,110,.14)}
.o2-tool .icon{width:18px;height:18px;color:var(--o-gold-hi)}
@media (max-width:599px){.o2-fact + .o2-fact::before{left:20%;right:20%;top:0;bottom:auto;width:auto;height:1px}}

/* ---------- split band: art one side, copy the other ---------------------- */
.o2-split{display:grid;align-items:center;overflow:hidden}
.o2-split__art{margin:0;position:relative;min-height:240px;align-self:stretch}
.o2-split__art img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.o2-split__copy{display:grid;gap:1.1rem;padding:clamp(2rem,1rem + 3vw,3.5rem) var(--o-gut)}
@media (min-width:900px){
  .o2-split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:340px}
  .o2-split--wide-art{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}
  .o2-split__art img{-webkit-mask-image:linear-gradient(90deg,#000 60%,transparent);mask-image:linear-gradient(90deg,#000 60%,transparent)}
  .o2-split--flip .o2-split__art{order:2}
  .o2-split--flip .o2-split__art img{-webkit-mask-image:linear-gradient(270deg,#000 60%,transparent);mask-image:linear-gradient(270deg,#000 60%,transparent)}
  .o2-split__copy{padding-inline:clamp(1.5rem,3vw,4rem)}
}
@media (max-width:899px){.o2-split__art{aspect-ratio:16/9}.o2-split__art img{-webkit-mask-image:linear-gradient(180deg,#000 70%,transparent);mask-image:linear-gradient(180deg,#000 70%,transparent)}}

/* ---------- the quilt band (home) ---------------------------------------- */
.o2-quilt{position:relative;overflow:hidden;background:var(--o-ivory)}
.o2-quilt__grid{display:grid;align-items:center}
.o2-quilt__copy{position:relative;z-index:2;display:grid;gap:1.1rem;padding-block:clamp(2.5rem,1.5rem + 3vw,4.5rem)}
.o2-quilt__art{margin:0;position:relative}
.o2-quilt__art img{width:100%;height:100%;object-fit:cover}
.o2-quilt__words{position:absolute;right:var(--o-gut);bottom:clamp(1.5rem,3vw,3rem);z-index:2;list-style:none;margin:0;padding:0 0 1rem;display:grid;gap:.55rem;font:600 .78rem/1 var(--o-sans);letter-spacing:.26em;text-transform:uppercase;color:var(--o-text);
  background:linear-gradient(var(--o-gold),var(--o-gold)) left bottom/28px 1px no-repeat}
@media (min-width:900px){
  .o2-quilt__grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);min-height:400px}
  .o2-quilt__art{position:absolute;inset:0 0 0 auto;width:60%}
  .o2-quilt__art img{-webkit-mask-image:linear-gradient(90deg,transparent,rgba(0,0,0,.4) 16%,#000 40%);mask-image:linear-gradient(90deg,transparent,rgba(0,0,0,.4) 16%,#000 40%)}
  .o2-quilt__words{background-color:rgba(250,246,238,.86);padding:1rem 1.1rem;border-radius:2px}
}
@media (max-width:899px){
  .o2-quilt__art{aspect-ratio:16/8;margin-inline:calc(var(--o-gut) * -1)}
  .o2-quilt__art img{-webkit-mask-image:linear-gradient(180deg,transparent,#000 22%);mask-image:linear-gradient(180deg,transparent,#000 22%)}
  .o2-quilt__words{display:none}
  .o2-quilt__grid{display:flex;flex-direction:column;align-items:stretch}
  .o2-quilt__copy{display:contents}
  .o2-quilt__copy > *{order:1}
  .o2-quilt__copy > :first-child{margin-top:2.5rem}
  .o2-quilt__grid > .o2-quilt__art{order:2;margin-block:1rem .5rem}
  .o2-quilt__copy > .o2-actions{order:3;margin-bottom:2.5rem}
  .o2-quilt__copy > .o2-actions .o2-btn{width:100%}
  .o2-quilt__copy > *{margin-bottom:1rem}
}

/* ---------- cards (continue the weekend) --------------------------------- */
.o2-cards{list-style:none;margin:0;padding:0;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr))}
.o2-card a{display:grid;height:100%;border:1px solid var(--o-rule-ink);border-radius:4px;overflow:hidden;color:inherit;text-decoration:none;background:rgba(13,11,9,.55);transition:border-color .2s ease,transform .2s ease}
.o2-card a:hover{border-color:var(--o-gold);transform:translateY(-2px)}
.o2-card__img{aspect-ratio:16/7;overflow:hidden}
.o2-card__img img{width:100%;height:100%;object-fit:cover}
.o2-card__body{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:.2rem 1rem;padding:.9rem 1.1rem 1.1rem}
.o2-card__day{grid-column:1;font:600 .66rem/1 var(--o-sans);letter-spacing:.2em;text-transform:uppercase;color:var(--o-gold-hi)}
.o2-card__title{grid-column:1;font:500 1.3rem/1.15 var(--o-display);color:#fff}
.o2-card__tag{grid-column:1;font:400 .8rem/1.3 var(--o-sans);color:var(--o-on-ink-2)}
.o2-card .icon{grid-column:2;grid-row:1/4;width:22px;height:22px;color:var(--o-gold-hi)}
@media (max-width:599px){
  .o2-cards{gap:0;border-top:1px solid var(--o-rule-ink)}
  .o2-card a{grid-template-columns:120px minmax(0,1fr);border:0;border-bottom:1px solid var(--o-rule-ink);border-radius:0;background:none;padding-block:.7rem;gap:1rem}
  .o2-card__img{aspect-ratio:16/10;border-radius:4px}
  .o2-card__body{padding:0}
}

/* ---------- panorama band ------------------------------------------------- */
.o2-pano{position:relative;overflow:hidden;color:#fff;background:var(--o-ink)}
.o2-pano__img{position:absolute;inset:0;margin:0}
.o2-pano__img img{width:100%;height:100%;object-fit:cover;object-position:70% 50%}
.o2-pano::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(13,11,9,.88) 0%,rgba(13,11,9,.55) 45%,rgba(13,11,9,.1) 80%),linear-gradient(0deg,rgba(13,11,9,.85),transparent 50%)}
.o2-pano .o2-h{color:#fff}.o2-pano .o2-body{color:var(--o-on-ink)}.o2-pano .o2-eyebrow{color:var(--o-gold-hi)}
.o2-pano .o2-btn--line{color:#fff;border-color:var(--o-gold)}.o2-pano .o2-btn--line:hover{background:var(--o-gold);color:var(--o-ink)}
.o2-pano__copy{position:relative;z-index:1;display:grid;gap:.9rem;padding-block:clamp(2.5rem,1.5rem + 4vw,5rem)}

/* ---------- inline icon list (included / values) -------------------------- */
.o2-icons{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr))}
.o2-icons li{display:grid;justify-items:center;align-content:start;gap:.55rem;padding:.75rem .6rem;text-align:center;font:500 .8rem/1.3 var(--o-sans);color:var(--o-text-2);position:relative}
.o2-icons li + li::before{content:"";position:absolute;left:0;top:15%;bottom:15%;width:1px;background:var(--o-rule)}
.o2-icons .icon{width:34px;height:34px;color:var(--o-gold);stroke-width:1.25}
.o2-icons b{display:block;font:600 .74rem/1.2 var(--o-sans);letter-spacing:.18em;text-transform:uppercase;color:var(--o-text)}
@media (max-width:599px){.o2-icons li{padding-inline:.3rem;font-size:.75rem}.o2-icons b{letter-spacing:.08em;font-size:.68rem}}

/* ---------- numbered program (Saturday) ----------------------------------- */
.o2-steps{list-style:none;margin:0;padding:0;display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.o2-steps li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.2rem 1.1rem;align-items:start;position:relative}
.o2-steps li + li::before{content:"";position:absolute;left:-.65rem;top:10%;bottom:10%;width:1px;background:var(--o-rule)}
.o2-steps b{grid-row:1/3;font:700 clamp(2.6rem,2rem + 2vw,3.6rem)/.9 var(--o-display);color:var(--o-gold-ink);font-variant-numeric:lining-nums}
.o2-steps h3{font:500 1.3rem/1.15 var(--o-display);margin:0}
.o2-steps p{margin:0;color:var(--o-text-2);font:400 .98rem/1.45 var(--o-display)}
@media (max-width:599px){.o2-steps li + li::before{display:none}}
.o2-divider{display:flex;align-items:center;gap:1.2rem;margin:2rem 0 0;font:600 .7rem/1 var(--o-sans);letter-spacing:.32em;text-transform:uppercase;color:var(--o-gold-ink)}
.o2-divider::before,.o2-divider::after{content:"";flex:1;height:1px;background:var(--o-rule)}

/* ---------- the week, long form (schedule) -------------------------------- */
.o2-days{list-style:none;margin:0;padding:0;border-top:1px solid var(--o-rule)}
.o2-day{display:grid;grid-template-columns:minmax(0,1fr);border-bottom:1px solid var(--o-rule);position:relative;overflow:hidden}
.o2-day__date{display:grid;justify-items:center;align-content:center;gap:.1rem;padding:1.5rem 0 0;text-align:center}
.o2-day__date span{font:600 .8rem/1 var(--o-sans);letter-spacing:.3em;text-transform:uppercase}
.o2-day__date em{font:500 1.5rem/1 var(--o-display);font-style:normal;color:var(--o-gold-ink);letter-spacing:.04em;text-transform:uppercase}
.o2-day__date b{font:700 4rem/.9 var(--o-display);letter-spacing:-.04em}
.o2-day__date small{font:600 .75rem/1 var(--o-sans);letter-spacing:.3em}
.o2-day__body{display:grid;gap:.6rem;align-content:center;padding:1.25rem var(--o-gut) 1.75rem;position:relative;z-index:1}
.o2-day__body h2{font:700 clamp(1.8rem,1.3rem + 1.6vw,2.6rem)/1 var(--o-display);font-variation-settings:"opsz" 72;letter-spacing:-.03em;margin:0}
.o2-day__meta{font:500 .9rem/1.45 var(--o-sans);color:var(--o-text-2)}
.o2-day__meta b{font-weight:600;letter-spacing:.06em;color:var(--o-text)}
.o2-day__body p{margin:0;font:400 1.02rem/1.45 var(--o-display);color:var(--o-text-2);max-width:40ch}
.o2-day__body hr{width:44px;height:1px;border:0;background:var(--o-gold);margin:.2rem 0}
.o2-day__img{margin:0;aspect-ratio:16/8}
.o2-day__img img{width:100%;height:100%;object-fit:cover}
@media (min-width:900px){
  .o2-day{grid-template-columns:150px minmax(0,.9fr) minmax(0,1fr);min-height:200px}
  .o2-day__date{border-right:1px solid var(--o-rule);padding:1.5rem 0;position:relative}
  .o2-day__date::after{content:"";position:absolute;right:-5px;top:50%;width:9px;height:9px;border-radius:50%;background:var(--o-gold);transform:translateY(-50%)}
  .o2-day__body{padding:1.75rem clamp(1.5rem,3vw,2.75rem)}
  .o2-day__img{aspect-ratio:auto;position:relative}
  .o2-day__img img{position:absolute;inset:0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 35%);mask-image:linear-gradient(90deg,transparent,#000 35%)}
}
.o2-tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem 0;padding:1rem 0;border-bottom:1px solid var(--o-rule)}
.o2-tabs > *{display:inline-flex;align-items:center;gap:.7rem;min-height:46px;padding:0 1.6rem;border-radius:999px;font:500 .95rem/1 var(--o-sans);color:var(--o-text);text-decoration:none;position:relative}
.o2-tabs > * + *::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:1px;background:var(--o-rule)}
.o2-tabs > [aria-current]{background:var(--o-gold-grad);color:var(--o-ink);font-weight:600;margin-right:1rem}
.o2-tabs > [aria-current] + *::before{display:none}
.o2-tabs .icon{width:20px;height:20px}

/* ---------- forms ---------------------------------------------------------- */
.o2-form{display:grid;gap:1.1rem}
.o2-form__row{display:grid;gap:1.1rem}
@media (min-width:600px){.o2-form__row{grid-template-columns:repeat(2,minmax(0,1fr))}}
.o2-field{display:grid;gap:.4rem;min-width:0}
.o2-field > label,.o2-label{font:600 .875rem/1.3 var(--o-sans);color:var(--o-text)}
.o2-label small,.o2-field > label small{font-weight:400;color:var(--o-text-3)}
.o2-input{width:100%;min-height:48px;padding:.7rem .95rem;border:1px solid rgba(134,96,28,.32);border-radius:6px;background:#fffdf9;color:var(--o-text);font:400 1rem/1.35 var(--o-sans);transition:border-color .15s ease,box-shadow .15s ease}
textarea.o2-input{min-height:120px;resize:vertical}
select.o2-input{appearance:none;padding-right:2.5rem;background:#fffdf9 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2314110D' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 1rem center}
.o2-input::placeholder{color:#9A8E7E}
.o2-input:hover{border-color:rgba(134,96,28,.55)}
.o2-input:focus{outline:none;border-color:var(--o-gold);box-shadow:0 0 0 3px rgba(184,137,59,.22)}
.o2-input[aria-invalid="true"]{border-color:#A3362A}
.o2-hint{font:400 .8rem/1.4 var(--o-sans);color:var(--o-text-3)}
.o2-ink .o2-field > label,.o2-ink .o2-label{color:var(--o-on-ink)}
.o2-ink .o2-input{background:#FBF8F2;border-color:transparent}
.o2-check{display:grid;grid-template-columns:24px minmax(0,1fr);gap:.8rem;align-items:start;font:400 .92rem/1.45 var(--o-sans);color:var(--o-text-2);cursor:pointer}
.o2-check input{appearance:none;width:22px;height:22px;margin:0;border:1.5px solid var(--o-text);border-radius:4px;background:#fff;display:grid;place-items:center;cursor:pointer}
.o2-check input:checked{background:var(--o-gold-grad);border-color:var(--o-gold)}
.o2-check input:checked::after{content:"";width:6px;height:11px;border:solid var(--o-ink);border-width:0 2px 2px 0;transform:translateY(-1px) rotate(45deg)}
.o2-check b{display:block;color:var(--o-text);font-weight:600}
.o2-msg{margin:0;padding:.85rem 1rem;border-radius:6px;font:500 .92rem/1.45 var(--o-sans);border:1px solid}
.o2-msg--err{background:#FBEDEA;color:#7E2419;border-color:rgba(163,54,42,.35)}
.o2-msg--ok{background:#EEF5EC;color:#24502E;border-color:rgba(47,107,67,.3)}
.o2-msg--note{background:#FAF0D9;color:#5E440F;border-color:rgba(184,137,59,.45)}
.o2-msg[hidden]{display:none}

/* ---------- choice chips (the crown selector) ----------------------------- */
.o2-pick{display:grid;grid-template-columns:88px minmax(0,1fr);align-items:center;gap:.65rem 1rem;margin:0;padding:0;border:0;min-width:0}
.o2-pick legend{float:left;font:600 .74rem/1 var(--o-sans);letter-spacing:.18em;text-transform:uppercase;color:var(--o-text);padding:0}
.o2-pick__opts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem}
.o2-chip{position:relative;display:flex;align-items:center;justify-content:center;gap:.4rem;min-height:44px;padding:0 .6rem;border:1px solid rgba(20,17,13,.55);border-radius:8px;background:#FFFDF8;color:var(--o-text);font:500 .9rem/1.1 var(--o-sans);cursor:pointer;text-align:center;transition:background .15s ease,border-color .15s ease,box-shadow .15s ease}
.o2-chip:hover{border-color:var(--o-gold);background:#fff}
.o2-chip input{position:absolute;opacity:0;inset:0;cursor:pointer;margin:0}
.o2-chip:has(input:checked){background:var(--o-gold-grad);border-color:#B08033;color:var(--o-ink);font-weight:600;box-shadow:inset 0 1px 0 rgba(255,255,255,.4)}
.o2-chip:has(input:checked)::before{content:"";width:10px;height:6px;border:solid currentColor;border-width:0 0 2px 2px;transform:translateY(-2px) rotate(-45deg);flex:none}
.o2-chip:has(input:focus-visible){outline:2px solid #8E6420;outline-offset:2px}
@media (max-width:599px){
  .o2-pick{grid-template-columns:minmax(0,1fr);gap:.55rem}
  .o2-pick legend{float:none;margin-bottom:.55rem}
  .o2-chip{min-height:52px;font-size:1rem;border-radius:10px}
}

/* ---------- panel (light card) -------------------------------------------- */
.o2-panel{background:var(--o-ivory-2);border:1px solid var(--o-rule);border-radius:10px;padding:clamp(1.25rem,1rem + 1.5vw,2.25rem)}
.o2-panel--ink{background:var(--o-ink);color:var(--o-on-ink);border-color:rgba(217,185,110,.3)}

/* ---------- status pills ------------------------------------------------- */
.o2-pill{display:inline-flex;align-items:center;gap:.45rem;min-height:30px;padding:0 .85rem;border-radius:999px;font:600 .78rem/1 var(--o-sans);border:1px solid var(--o-rule);background:#FFF8E9;color:#5E440F;white-space:nowrap}
.o2-pill::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.o2-pill--ok{background:#EAF3E7;color:#24502E;border-color:rgba(47,107,67,.35)}
.o2-pill--gold{background:var(--o-gold-grad);color:var(--o-ink);border-color:#B08033}
.o2-pill--warn{background:#FAF0D9;color:#7A5212;border-color:rgba(184,137,59,.55)}
.o2-pill--muted{background:#F1ECE3;color:var(--o-text-3)}

/* ---------- footer --------------------------------------------------------- */
.o2-foot{background:var(--o-ink);color:var(--o-on-ink);border-top:1px solid rgba(217,185,110,.22)}
.o2-foot__row{display:grid;gap:1.5rem;align-items:center;padding-block:1.75rem}
.o2-foot__brand{display:flex;align-items:center;gap:1rem;color:inherit;text-decoration:none}
.o2-foot__brand img{width:40px;height:auto}
.o2-foot__brand b{display:block;font:600 1rem/1 var(--o-sans);letter-spacing:.2em;text-transform:uppercase;color:#fff}
.o2-foot__brand span{display:block;margin-top:.4rem;font:600 .62rem/1.5 var(--o-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--o-gold-hi)}
.o2-foot__line{margin:0;font:400 clamp(1.6rem,1.3rem + 1vw,2.1rem)/1 "Great Vibes","Snell Roundhand",cursive;color:var(--o-gold-hi)}
.o2-foot__links{display:flex;flex-wrap:wrap;gap:.25rem 1.4rem}
.o2-foot__links a{display:inline-flex;align-items:center;min-height:40px;font:500 .85rem/1.2 var(--o-sans);color:#fff;text-decoration:none;border-bottom:1px solid transparent}
.o2-foot__links a:hover{color:var(--o-gold-hi);border-bottom-color:currentColor}
.o2-foot__social{display:grid;gap:.6rem;justify-items:start}
.o2-foot__contact{white-space:nowrap;font:500 .82rem/1 var(--o-sans);color:#fff;text-decoration:underline;text-decoration-color:var(--o-gold);text-underline-offset:.35em;min-height:32px;display:inline-flex;align-items:center}
.o2-foot__contact:hover{color:var(--o-gold-hi)}
.o2-foot__social div{display:flex;gap:.6rem}
.o2-foot__social div a{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--o-gold);border-radius:50%;color:var(--o-gold-hi);transition:background .2s ease}
.o2-foot__social div a:hover{background:rgba(217,185,110,.15)}
.o2-foot__social .icon{width:18px;height:18px}
@media (min-width:1000px){
  .o2-foot__row{grid-template-columns:auto 1px auto 1px minmax(0,1fr) auto;gap:2rem}
  .o2-foot__row > hr{align-self:stretch;width:1px;height:auto;margin:.4rem 0;border:0;background:rgba(217,185,110,.4)}
}
.o2-foot__row > hr{display:none}
@media (min-width:1000px){.o2-foot__row > hr{display:block}}

/* ---------- the sticky phone CTA (home) ----------------------------------- */
.o2-dock{position:fixed;left:0;right:0;bottom:0;z-index:60;padding:.6rem var(--o-gut) calc(.6rem + env(safe-area-inset-bottom,0px));background:linear-gradient(0deg,rgba(13,11,9,.96) 70%,rgba(13,11,9,0));transform:translateY(110%);transition:transform .3s ease}
.o2-dock.is-on{transform:none}
.o2-dock .o2-btn{width:100%;min-height:54px;font-size:1.1rem}
@media (min-width:720px){.o2-dock{display:none}}
/* Where the sticky bar carries the page's action, the pinned rail does not need to carry it
   too: two gold buttons on one phone screen is one too many. */
@media (max-width:719px){body.o2:has([data-o2-dock]) .page-rail__action{display:none}}
body.o2.has-o2-dock{padding-bottom:0}

/* ---------- spacing utilities ---------- */
.o2-stack{display:grid;gap:1rem;align-content:start}
.o2-my{margin-block:.9rem 1.1rem!important}.o2-mb{margin-bottom:1rem!important}.o2-mt{margin-top:1rem!important}

/* ---------- misc ----------------------------------------------------------- */
body.o2 .reveal{opacity:1;transform:none}
/* Menu and sheets: the masthead's ink, ivory headings, readable sentence-case notes and gold
   accents. Every colour token the shared sheet reads is set here, so nothing falls back to
   the ivory page surface. */
body.o2 dialog.sheet{--bg:var(--o-ink-2);--surface:var(--o-ink-2);--surface-2:var(--o-ink-3);--fg:var(--o-on-ink);--fg-2:var(--o-on-ink-2);--fg-3:var(--o-on-ink-3);--line:rgba(217,185,110,.2);--line-strong:rgba(217,185,110,.5);--accent-text:var(--o-gold-hi);--input-bg:var(--o-ink-3);background:radial-gradient(120% 60% at 100% 0%,rgba(184,137,59,.14),transparent 60%),var(--o-ink-2);color:var(--o-on-ink);border-color:rgba(217,185,110,.3)}
body.o2 .sheet .sheet__head{padding-top:1.35rem;border-bottom:1px solid rgba(217,185,110,.2);padding-bottom:1rem}
body.o2 .sheet .eyebrow{font:600 .78rem/1.3 var(--o-sans);letter-spacing:.26em;text-transform:uppercase;color:var(--o-gold-hi)}
body.o2 .sheet .sheet__title{margin:.3rem 0 0;font:700 clamp(1.6rem,1.3rem + 1vw,2rem)/1.08 var(--o-display);letter-spacing:-.02em;color:#fff}
body.o2 .sheet .sheet__close{color:var(--o-on-ink);border:1px solid var(--o-gold);background:rgba(255,255,255,.04)}
body.o2 .sheet .sheet__close:hover{background:rgba(217,185,110,.16);color:#fff}
body.o2 .sheet .menu-list li + li{border-top-color:rgba(217,185,110,.18)}
body.o2 .sheet .menu-list > li > a{color:#fff;font:600 1.22rem/1.2 var(--o-display);letter-spacing:-.01em;padding:.85rem .1rem}
body.o2 .sheet .menu-list > li > a small{display:block;margin-top:.35rem;font:400 .9rem/1.4 var(--o-sans);letter-spacing:0;text-transform:none;color:var(--o-on-ink-2)}
body.o2 .sheet .menu-list > li > a .icon{color:var(--o-gold-hi);width:20px;height:20px}
body.o2 .sheet .menu-list > li > a:hover,body.o2 .sheet .menu-list > li > a:focus-visible{color:var(--o-gold-hi)}
body.o2 .sheet .menu-list a[aria-current="page"]{color:var(--o-gold-hi)}
body.o2 .sheet .sheet__body > p,body.o2 .sheet .sheet__aside{color:var(--o-on-ink-2)}
body.o2 .sheet .btn--ghost{color:#fff;border-color:rgba(217,185,110,.55)}
body.o2 .sheet .btn--ghost:hover{background:rgba(217,185,110,.14)}
body.o2 .sheet .venue-row > span:first-child{color:#fff}
body.o2 .sheet .venue-row small{color:var(--o-on-ink-2)}
body.o2 .sheet .venue-row__maps a{color:var(--o-gold-hi)}
.o2-thread{position:absolute;pointer-events:none;color:var(--o-gold);opacity:.75;z-index:1}
.o2-thread path{fill:none;stroke:currentColor;stroke-width:1.1;vector-effect:non-scaling-stroke}
@media (prefers-reduced-motion:reduce){body.o2 *{transition-duration:.01ms!important;animation-duration:.01ms!important}}
@media print{.o2-mast,.o2-foot,.o2-dock{display:none}}

/* ---------- the crown selector ------------------------------------------ */
.cp{display:grid;gap:clamp(1.25rem,1rem + 2vw,3rem);align-items:start}
.cp__stage{display:grid;gap:.75rem;align-content:start}
.cp__art{position:relative;aspect-ratio:400/250;max-width:560px;width:100%;margin-inline:auto}
.cp__art svg,.cp__art img{width:100%;height:100%;display:block;filter:drop-shadow(0 18px 22px rgba(60,40,15,.16))}
.cp__art.is-new svg{animation:cp-in .38s cubic-bezier(.2,.7,.2,1)}
@keyframes cp-in{from{opacity:.4;transform:translateY(6px) scale(.985)}to{opacity:1;transform:none}}
.cp__short{margin:0;text-align:center;font:500 .95rem/1.3 var(--o-sans);color:var(--o-text-2)}
.cp__form{display:grid;gap:1rem;min-width:0}
.cp__who{margin:0;font:400 .95rem/1.3 var(--o-sans);color:var(--o-text-2)}
.cp__who b{color:var(--o-text);font-weight:600}
.cp__tabs{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.5rem}
.cp__tabs button{display:grid;gap:.2rem;text-align:left;padding:.65rem .85rem;border:1px solid var(--o-rule);border-radius:8px;background:#FFFDF8;cursor:pointer;color:var(--o-text);min-height:56px}
.cp__tabs button b{font:600 .82rem/1.2 var(--o-sans)}
.cp__tabs button span{font:400 .75rem/1.3 var(--o-sans);color:var(--o-text-3)}
.cp__tabs button[aria-selected="true"]{border-color:var(--o-gold);box-shadow:inset 0 0 0 1px var(--o-gold);background:#FFF8E9}
.cp__groups{display:grid;gap:.75rem}
.cp__sum{display:grid;gap:.25rem;padding-top:.85rem;border-top:1px solid var(--o-rule)}
.cp__sum small{font:500 .78rem/1 var(--o-sans);color:var(--o-text-3)}
.cp__sum b{font:600 .98rem/1.35 var(--o-sans)}
/* The size is asked for, so it gets a row of its own: the control, the reason when it is
   still empty, and the way to measure folded away until it is wanted. */
.cp__size{display:grid;grid-template-columns:minmax(0,1fr);gap:.45rem;padding-top:.9rem;border-top:1px solid var(--o-rule)}
.cp__size .o2-label{display:flex;align-items:baseline;gap:.5rem}
.o2-req{font:600 .66rem/1 var(--o-sans);letter-spacing:.18em;text-transform:uppercase;color:var(--o-gold-ink);border:1px solid rgba(134,96,28,.4);border-radius:999px;padding:.28em .55em}
.cp__sizesel{min-height:48px;max-width:420px;appearance:none;padding-right:2.4rem;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%2386601C' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right .9rem center;background-size:12px 8px}
.cp.is-incomplete .cp__sizesel{border-color:var(--o-gold);box-shadow:0 0 0 3px rgba(184,137,59,.18)}
.cp__need{margin:0;font:500 .86rem/1.45 var(--o-sans);color:#7E2419;max-width:52ch}
.cp__howto{margin:.15rem 0 0;border:1px solid var(--o-rule-soft);border-radius:8px;background:var(--o-ivory-2)}
.cp__howto>summary{cursor:pointer;padding:.6rem .85rem;font:600 .88rem/1.3 var(--o-sans);color:var(--o-gold-ink);list-style:none}
.cp__howto>summary::-webkit-details-marker{display:none}
.cp__howto>summary::before{content:"+";margin-right:.5rem;color:var(--o-gold);font-weight:700}
.cp__howto[open]>summary::before{content:"\2013"}
.cp__howto__body{padding:0 .85rem .9rem;display:grid;gap:.7rem}
.cp__howto__body ol{margin:0;padding-left:1.15rem;display:grid;gap:.3rem;font:400 .86rem/1.5 var(--o-sans);color:var(--o-text-2)}
.cp__howto__body p{margin:0;font:400 .86rem/1.5 var(--o-sans);color:var(--o-text-2)}
.cp__chart{border-collapse:collapse;width:100%;max-width:360px;font:400 .82rem/1.3 var(--o-sans)}
.cp__chart caption{text-align:left;font:600 .72rem/1 var(--o-sans);letter-spacing:.18em;text-transform:uppercase;color:var(--o-text-3);padding-bottom:.4rem}
.cp__chart th,.cp__chart td{text-align:left;padding:.28rem .5rem;border-bottom:1px solid var(--o-rule-soft)}
.cp__chart th{font-weight:600;color:var(--o-text)}
.cp__chart td{color:var(--o-text-2)}
.o2-btn.is-waiting{opacity:.55}
.cp__more{margin:0;display:flex;flex-wrap:wrap;gap:.25rem 1.5rem}
.cp__more .o2-link{font-size:.88rem}
.cp__name{max-width:420px}
/* Two columns from the narrow side of an iPad up, so the preview and the choices are on
   screen together: on a tablet the stacked layout put the buttons a scroll away from the
   hat they change. The stage is the narrower column, and it follows the choices down. */
@media (min-width:700px){
  .cp{grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);column-gap:clamp(1.25rem,3vw,3rem)}
  .cp__stage{position:sticky;top:calc(var(--o-mast) + 1rem)}
  .cp__art{max-width:380px}
}
@media (min-width:1100px){.cp{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.cp__stage{top:calc(var(--o-mast) + 1.5rem)}.cp__art{max-width:460px}}

/* ---------- Launch audit, October 21 ----------
   The page is at least a screen tall, so the footer starts below the fold: content a script
   fills in after load no longer pushes it about on screen, and a short page has no band of
   ivory under the footer. */
body.o2 main{min-height:calc(100svh - var(--o-mast,64px))}
/* Saturday's pinned section bar runs edge to edge (the old lane offset left a strip). */
body.o2 .page-rail::before{inset:0}
/* Nothing a guest reads is under 12px; the top navigation is read at arm's length on a tablet. */
.o2-eyebrow{font-size:.78rem}
.o2-card__day{font-size:.78rem;letter-spacing:.16em}
.o2-tool{font-size:.8rem}
.o2-nav a{font-size:.82rem;letter-spacing:.14em}
@media (min-width:1120px) and (max-width:1340px){.o2-nav a{padding-inline:.85rem}}
body.o2 .menu-list a small{font-size:.78rem}
body.o2 .o2-field label small{font-size:.85em;color:inherit;opacity:.85}
/* Serif ledes breathe a little more. */
.o2-lede{line-height:1.42}
/* Hero headlines on the day and weekend pages: each phrase holds its line where the column
   allows and never leaves one word alone (Home and Thursday keep their locked masters). */
body.o2 :is(.vi-title,.sat-h,.su-title,.fr-title,.qp-title,.wk-title){font-size:clamp(3rem,.8rem + 3.6vw,4.4rem)}
body.o2 :is(.vi-title,.sat-h,.su-title,.fr-title,.qp-title,.wk-title) > span{text-wrap:balance}
/* Reading width: body text stops at about 68 characters on any screen. */
body.o2 main :is(.o2-small,.caption,.support,.sat-program-note,.pl__body p,.pl__body li){max-width:38em}
/* The small labels the first pass missed: card dates, fact keys, step labels, tabs, notes. */
body.o2 :is(.o2-fact__k,.o2-caps small,.ck-night__day,.o2-divider,.o2-row__date,.th-guide,.sat-past,.eyebrow){font-size:.78rem}
body.o2 .o2-icons li,body.o2 .o2-icons b{font-size:.78rem}
body.o2 :is(.o2-field label small,.field__label small,label small){font-size:.8rem}
body.o2 [role="tablist"] button{font-size:.8rem}
/* Add Your Thread fills its view by script: hold a screen's height until it does, so the help
   below never jumps up and down on load. */
body.o2 #ayt-view:empty{min-height:100svh}
@media (max-width:719px){body.o2 .o2-row__date b{font-size:.8rem}}
body.o2 .page-rail__mark{font-size:.78rem}
body.o2 .sheet .venue-row__go a{min-height:44px;padding:0 1rem;gap:.45rem;font:600 .9rem/1 var(--o-sans);letter-spacing:0;color:#fff;border-color:rgba(217,185,110,.55)}
body.o2 .sheet .venue-row__go a .icon{width:16px;height:16px;color:var(--o-gold-hi)}
/* The line's sign-off at the very bottom of every page, in the footer's gold and script. */
.o2-foot__sig{display:grid;justify-items:center;gap:.3rem;margin:0 auto;padding-block:.9rem calc(1.1rem + env(safe-area-inset-bottom,0px));border-top:1px solid rgba(217,185,110,.14);text-align:center}
.o2-foot__sig b{font:600 .8rem/1.2 var(--o-sans);letter-spacing:.28em;text-transform:uppercase;color:var(--o-gold-hi)}
.o2-foot__sig span{font:400 clamp(1.15rem,1rem + .5vw,1.4rem)/1.2 "Great Vibes","Snell Roundhand",cursive;color:var(--o-on-ink-2)}
/* The quilt band's sentence stops before the photograph begins. */
@media (min-width:900px){.o2-quilt__copy .o2-body{max-width:40ch}}
/* Sentences, not labels, read at 14px at least. */
body.o2 :is(.o2-hint,.ck-night__meta,.give-check small,.cp__short){font-size:.875rem}

/* Never ask an image to render wider than it actually is: the browser upscales and the
   picture goes soft. Applied per figure, with the file's own width, so only the images
   that are genuinely too small are held back -- the rest keep filling their slot. */
.o2-capped{margin-inline:auto;max-width:var(--cap)}
.o2-capped img{width:100%;height:auto}

/* Keep the full menu hit area on narrow phones without clipping the chapter name. */
@media(max-width:420px){.o2-mast__row{gap:.5rem}.o2-brand{gap:.5rem}.o2-brand img{width:24px}.o2-brand__l2{white-space:normal;line-height:1.4;max-width:180px}}

/* Keep the expanded public navigation clear of the brand and ticket actions. */
@media(min-width:1120px) and (max-width:1439px){.o2-nav{display:none}.o2-mast__menu{display:inline-grid}.o2-mast__cta{margin-left:auto}}
@media(min-width:1440px){.o2-nav a{padding-inline:1rem}}