/* ============================================================
   NOVUS MUNDUS · v57 "Atlas" — window chrome + window content
   ============================================================ */

/* ============================================================
   NOVUS MUNDUS · v57 "Atlas" — WINDOW CHROME
   DARK CINEMATIC BAROQUE AEDICULA
   Obsidian→oxblood shrine · fluted column pilasters ·
   carved gold entablature with a single struck seal ·
   chiaroscuro vignette · film grain · gold as punctuation.
   ============================================================ */

/* ---- chrome-local tokens (obsidian marble + oxblood + gilt) ---- */
.win{
  --obsidian-hi: rgba(26,16,17,0.90);   /* top of the tablet */
  --obsidian-lo: rgba(11,6,8,0.86);     /* mid */
  --oxblood:     rgba(22,7,9,0.94);     /* pooled dark-red base */
  --gilt:        var(--gold);
  --gilt-hi:     var(--gold-hi);
  --gilt-lo:     var(--gold-dim);
  --inlay:       #c69a3e;               /* recessed gold inlay fillet */
  --frame-line:  rgba(216,180,92,.16);  /* thin architectural gold rule */
  --flute-shadow:rgba(0,0,0,.55);
  /* fine film grain (fractal noise, ~1.5% ink) baked as a data URI */
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
}

/* ---------------- the tablet: obsidian → oxblood aedicula ---------------- */
.win{
  position:fixed; z-index:50;
  width:min(560px, calc(100vw - 48px));
  display:flex; flex-direction:column;
  /* deep obsidian body pooling into oxblood at the base — chiaroscuro */
  background:
    radial-gradient(140% 96% at 50% 0%, var(--obsidian-hi) 0%, var(--obsidian-lo) 46%, var(--oxblood) 100%);
  backdrop-filter:blur(18px) saturate(1.12);
  -webkit-backdrop-filter:blur(18px) saturate(1.12);
  /* thin gilt inlay frame over a black keyline; unified rounding on all four corners */
  border:1px solid var(--frame-line);
  border-radius:12px;
  box-shadow:
    0 40px 90px -18px rgba(0,0,0,.72),    /* crisp cinematic cast shadow */
    0 8px 24px rgba(0,0,0,.5),
    0 0 0 1px rgba(0,0,0,.5),             /* black keyline outside the gilt */
    0 0 46px rgba(120,10,18,.14),         /* faint oxblood aura */
    inset 0 1px 0 rgba(236,206,123,.10),  /* top gilt catch-light */
    inset 0 0 78px rgba(0,0,0,.5),        /* inner vignette (chiaroscuro) */
    inset 0 -44px 96px rgba(96,8,14,.18); /* warm glow welling up from the floor */
  overflow:hidden;   /* the header is in-flow now; clip everything to the rounded frame */
  /* v56 content fonts: Fraunces display · IBM Plex Sans body · IBM Plex Mono labels */
  --f-display:'Fraunces', Georgia, serif;
  --f-body:'IBM Plex Sans', system-ui, sans-serif;
}
.win[hidden]{ display:none; } /* author display:flex would otherwise beat the UA [hidden] rule */
.win--wide{ width:min(880px, calc(100vw - 48px)); }
#win-tokenomics{ width:min(900px, calc(100vw - 48px)); }  /* landscape rectangle: ring left, allocations right */
#win-launch{ width:min(920px, calc(100vw - 48px)); }  /* landscape rectangle: text left, counter right */

.win.focused{
  border-color:rgba(216,180,92,.34);
  box-shadow:
    0 54px 120px -22px rgba(0,0,0,.82),
    0 10px 30px rgba(0,0,0,.55),
    0 0 0 1px rgba(0,0,0,.55),
    0 0 60px rgba(150,14,22,.20),
    inset 0 1px 0 rgba(236,206,123,.16),
    inset 0 0 84px rgba(0,0,0,.46),
    inset 0 -50px 104px rgba(110,10,18,.24);
}

/* KEEP EXACTLY — pop-out open/close animation (verbatim) */
.win.anim-in{ animation:winIn .34s var(--ease) both; }
.win.anim-out{ animation:winOut .2s ease-in both; }
@keyframes winIn{
  from{ opacity:0; transform:translateY(26px) scale(.955); }
  to  { opacity:1; transform:none; }
}
@keyframes winOut{
  from{ opacity:1; transform:none; }
  to  { opacity:0; transform:translateY(18px) scale(.97); }
}

/* ---------------- fluted column pilasters + film grain ----------------
   .win::before = the two chiselled Doric fluting rails (left & right edges)
   .win::after  = fine film grain + top/bottom letterbox darkening
   Both are pointer-events:none so drag/scroll are untouched.
   NOTE: this .win::after REPLACES the deleted raster-watermark ::after.   */
.win__body{ position:relative; z-index:1; }   /* keep body text above pilasters + grain */
.win::before{
  content:""; position:absolute; z-index:0; pointer-events:none;
  inset:0; border-radius:inherit; overflow:hidden;
  /* two narrow fluted bands hugging the inner vertical edges */
  background:
    /* LEFT pilaster: alternating light / shadow flutes */
    linear-gradient(90deg,
      transparent 0, transparent 9px,
      rgba(236,206,123,.05) 9px, rgba(236,206,123,.05) 10px,
      var(--flute-shadow) 10px, var(--flute-shadow) 11px,
      transparent 11px, transparent 15px,
      rgba(236,206,123,.03) 15px, rgba(236,206,123,.03) 16px,
      transparent 16px) left / 26px 100% no-repeat,
    /* RIGHT pilaster: mirrored */
    linear-gradient(270deg,
      transparent 0, transparent 9px,
      rgba(236,206,123,.05) 9px, rgba(236,206,123,.05) 10px,
      var(--flute-shadow) 10px, var(--flute-shadow) 11px,
      transparent 11px, transparent 15px,
      rgba(236,206,123,.03) 15px, rgba(236,206,123,.03) 16px,
      transparent 16px) right / 26px 100% no-repeat;
  /* gilt hairline down the inner edge of each pilaster */
  box-shadow:
    inset 26px 0 0 -25px rgba(236,206,123,.20),
    inset -26px 0 0 -25px rgba(236,206,123,.20);
  opacity:.9;
}
.win::after{
  content:""; position:absolute; z-index:0; pointer-events:none;
  inset:0; border-radius:inherit;
  background:
    /* top + bottom letterbox bands (architectural / cinematic framing) */
    linear-gradient(180deg, rgba(0,0,0,.34) 0%, transparent 7%,
                             transparent 93%, rgba(6,3,5,.42) 100%),
    /* film grain */
    var(--grain);
  background-size:100% 100%, 140px 140px;
  mix-blend-mode:overlay;
  opacity:.5;
}

/* ============================================================
   ARCHITRAVE — the title tab is now an INTEGRATED internal header
   An in-flow band across the top of the obsidian surface, parted from
   the reading column by a single fine gilt hairline (a thin architrave
   rule). No protruding cornice, no gold slab — the engraved title sits
   inside the shrine over the dark stone.
   Remains the drag handle (atlas.js binds pointerdown to .win__bar).
   ============================================================ */
.win__bar{
  position:relative; z-index:3;
  flex:none;                                   /* first in-flow flex child, full width */
  display:flex; align-items:center; gap:12px;
  min-height:48px;
  padding:14px 16px 14px 26px;                 /* align the title with the body's left gutter */
  /* a whisper-thin translucent top band welling out of the obsidian */
  background:linear-gradient(180deg,
    rgba(236,206,123,.05) 0%, rgba(24,14,15,.30) 60%, transparent 100%);
  /* the architrave: one fine gilt hairline dividing header from body */
  border-bottom:1px solid rgba(216,180,92,.22);
  box-shadow:inset 0 1px 0 rgba(236,206,123,.10),   /* faint gilt catch-light on top */
             0 1px 0 rgba(0,0,0,.4);                /* a hair of shadow under the rule */
  cursor:grab; user-select:none; touch-action:none;
  transition:border-color .25s var(--ease), background .25s var(--ease);
}
.win.focused .win__bar{
  border-bottom-color:rgba(216,180,92,.38);
  background:linear-gradient(180deg,
    rgba(236,206,123,.08) 0%, rgba(28,16,17,.34) 60%, transparent 100%);
}
.win.dragging .win__bar{ cursor:grabbing; }

/* the single struck fleuron seal — the lone gilt flourish, now over dark stone */
.win__bar::before{
  content:""; flex:none;
  width:14px; height:14px; margin-right:1px;
  background:var(--gilt);
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'><path d='M20 3 C 22.6 12.8 27.2 17.4 37 20 C 27.2 22.6 22.6 27.2 20 37 C 17.4 27.2 12.8 22.6 3 20 C 12.8 17.4 17.4 12.8 20 3 Z'/></svg>") center/contain no-repeat;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'><path d='M20 3 C 22.6 12.8 27.2 17.4 37 20 C 27.2 22.6 22.6 27.2 20 37 C 17.4 27.2 12.8 22.6 3 20 C 12.8 17.4 17.4 12.8 20 3 Z'/></svg>") center/contain no-repeat;
  opacity:.6; filter:drop-shadow(0 0 4px rgba(216,180,92,.3));
  transition:opacity .3s;
}
.win.focused .win__bar::before{ opacity:.85; }

.win__dot{ display:none; }   /* no status dot on the integrated header */

.win__title{
  flex:1 1 auto; min-width:0;
  font-family:var(--f-mono);
  font-size:12px; font-weight:500;
  letter-spacing:.2em; text-transform:uppercase;
  color:var(--cream-dim);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.win.focused .win__title{ color:var(--cream); }
/* no paired flourishes — the fleuron seal is the single ornament */
.win__title::before,
.win__title::after{ content:none; }
/* the Roman numeral — an engraved gilt initial parted by a fine rule */
.win__title b{
  display:inline-block; color:var(--gold-hi); font-weight:700;
  font-family:var(--f-display); font-size:16px; letter-spacing:.02em;
  margin-right:11px; padding:0 11px 0 0;
  border-right:1px solid rgba(216,180,92,.28);
  text-shadow:0 0 12px rgba(216,180,92,.25);
}
.win__title i{ display:none; }   /* subtitle lives in the body; keep the header clean */

.win__acts{ flex:none; display:flex; gap:8px; margin-left:8px; }
.win__min, .win__close{
  width:22px; height:22px; border-radius:5px;
  border:1px solid rgba(216,180,92,.20);
  background:rgba(236,206,123,.04);
  position:relative;
  transition:border-color .2s, background .2s, box-shadow .2s;
}
.win__min::before{
  content:""; position:absolute; left:6px; right:6px; bottom:7px;
  height:1.5px; background:var(--gold); opacity:.85;
}
.win__close::before, .win__close::after{
  content:""; position:absolute; left:5px; right:5px; top:10px;
  height:1.5px; background:var(--gold); opacity:.85;
  transition:background .2s;
}
.win__close::before{ transform:rotate(45deg); }
.win__close::after{ transform:rotate(-45deg); }
.win__min:hover{ border-color:rgba(216,180,92,.45); background:rgba(236,206,123,.10); }
.win__min:hover::before{ opacity:1; background:var(--gold-hi); }
.win__close:hover{ border-color:rgba(180,40,44,.6); background:rgba(140,20,26,.28); }
.win__close:hover::before, .win__close:hover::after{ background:#f2c8a6; opacity:1; }

/* ---------------- body (letterboxed reading column) ---------------- */
.win__body{
  flex:1 1 auto; min-height:0;                 /* share the flex column with the header */
  overflow-y:auto; overscroll-behavior:contain;
  max-height:calc(100dvh - var(--bar-h) - 150px);
  padding:30px 44px 40px;                      /* generous editorial gutters, clear of the flutes */
  border-radius:0 0 12px 12px;                 /* top corners meet the header; bottom corners round */
  font-family:var(--f-body);   /* re-apply so window text picks up v56 IBM Plex Sans */
  scrollbar-width:thin;
  scrollbar-color:var(--gilt-lo) transparent;
}
.win__body::-webkit-scrollbar{ width:9px; }
.win__body::-webkit-scrollbar-thumb{
  background:rgba(138,115,64,.5); border-radius:4px;
  border:2px solid transparent; background-clip:content-box;
}
.win__body::-webkit-scrollbar-thumb:hover{ background:rgba(216,180,92,.6); background-clip:content-box; }
.win__body:focus-visible{ outline:1px solid var(--gilt-lo); outline-offset:-3px; }

/* ============================================================
   CORNER ORNAMENTS — chiseled gilt capital returns (asymmetric)
   atlas.js injects a fixed bracket path into each .win-orn slot;
   we position + tint them with a soft gilt bloom in the shadow.
   Top capitals read stronger; bottom bases whisper — so they
   never read as a uniform AI-template frame.
   ============================================================ */
.win-orn{
  position:absolute; z-index:2;
  width:clamp(20px, 2.2vw, 27px); height:auto;
  color:var(--gilt); opacity:.44;
  pointer-events:none;
  filter:drop-shadow(0 0 5px rgba(216,180,92,.32))   /* gilt bloom in the shadow */
         drop-shadow(0 1px 1px rgba(0,0,0,.6));
  transition:opacity .4s var(--ease), color .4s;
}
.win.focused .win-orn{ color:var(--gilt-hi); }
/* top capital returns are retired — the integrated header owns the top band now */
.win-orn--tl,
.win-orn--tr{ display:none; }
.win-orn--bl{ bottom:9px;  left:9px;  transform:scaleY(-1); opacity:.28; }
.win-orn--br{ bottom:9px;  right:12px; transform:scale(-1,-1); opacity:.28; }
.win.focused .win-orn--bl,
.win.focused .win-orn--br{ opacity:.4; }

/* in-body divider ornament (used by .orn-div) */
.orn-div{
  display:flex; justify-content:center; align-items:center;
  margin:26px 0; color:var(--gilt); opacity:.72;
}
.orn-div svg{ width:min(240px, 58%); height:auto; filter:drop-shadow(0 0 4px rgba(216,180,92,.26)); }

/* ---------------- shared content ---------------- */
.eyebrow{
  font-family:var(--f-mono);
  font-size:10px; letter-spacing:.32em; text-transform:uppercase;
  color:var(--gold); margin-bottom:16px;
}
.hl{
  font-family:var(--f-display); font-weight:400;
  font-size:clamp(24px, 2.4vw, 32px); line-height:1.18;
  color:var(--cream); margin-bottom:14px;
  letter-spacing:.01em;
}
.hl--big{ font-size:clamp(34px, 3.2vw, 46px); }
.quote{
  font-size:clamp(19px, 1.8vw, 24px); font-weight:300; font-style:italic;
  line-height:1.5; color:var(--cream);
  margin-bottom:20px;
}
.quote em{ color:var(--gold-hi); }
.body{ color:var(--cream-dim); margin-bottom:14px; }
.body strong{ color:var(--cream); font-weight:500; }
.body.small{ font-size:14.5px; }
.myth{
  font-size:17.5px; font-weight:300; line-height:1.65;
  color:var(--cream-dim); margin-bottom:14px;
}
.gold{ color:var(--gold-hi); }
.rule{
  border:0; height:1px; margin:26px 0;
  background:linear-gradient(90deg, var(--line), transparent);
}
.note{
  font-size:14px; color:var(--cream-dim);
  border-left:2px solid var(--gold-dim);
  padding-left:16px; margin-top:24px;
  max-width:62ch;
}
.note b{ color:var(--cream); }

/* manifesto white-paper call to action */
.wp-cta{ margin-top:28px; }
.win__body .btn{ display:inline-flex; align-items:center; text-decoration:none; }

/* ---------------- crossing (phases) ---------------- */
.phases{
  display:grid; grid-template-columns:repeat(3, 1fr);
  gap:26px; margin-top:22px;
}
.phase{
  border-top:1px solid var(--line-soft);
  padding-top:16px;
}
.phase__num{
  font-size:10px; letter-spacing:.24em; text-transform:uppercase;
  color:var(--gold); margin-bottom:10px;
}
.phase__desc{ font-size:14px; color:var(--cream-dim); margin-bottom:14px; }
.phase__items{ list-style:none; }
.phase__items li{
  font-size:11px; letter-spacing:.04em;
  color:rgba(176,166,143,.85);
  padding:7px 0 7px 18px; position:relative;
  border-bottom:1px solid rgba(216,180,92,.07);
}
.phase__items li::before{
  content:"✦"; position:absolute; left:0; top:7px;
  color:var(--gold-dim); font-size:9px;
}

/* ---------------- charter (vows) ---------------- */
.vows{ list-style:none; margin-top:22px; }
.vows li{
  display:flex; gap:18px;
  padding:16px 0;
  border-top:1px solid var(--line-soft);
}
.vow__n{
  flex:none; width:34px;
  font-family:var(--f-display); font-size:21px;
  color:var(--gold); text-align:center;
  line-height:1.25;
}
.vows b{
  display:block; font-family:var(--f-display); font-weight:400;
  font-size:16.5px; letter-spacing:.02em;
  color:var(--cream); margin-bottom:5px;
}
.vows p{ font-size:14px; color:var(--cream-dim); }
.pull{
  margin-top:26px; padding:22px 26px;
  border:1px solid var(--line-soft); border-radius:4px;
  background:rgba(216,180,92,.04);
  font-size:17px; font-style:italic; font-weight:300;
  color:var(--cream); line-height:1.55;
}
.pull cite{
  display:block; margin-top:10px;
  font-family:var(--f-mono); font-style:normal;
  font-size:10px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--gold);
}

/* ---------------- tokenomics (v56 animated ledger ring + interactive legend) ---------------- */
.tok-inner{ position:relative; }
.tok3d-wrap{
  display:flex; flex-direction:row; align-items:center;
  gap:clamp(24px,3.5vw,48px); margin:24px 0 6px; text-align:left;
}
.tok3d-wrap.no-3d .tok3d{ display:none; }
/* left: the animated ledger ring */
.tok3d{ position:relative; flex:0 0 auto; width:clamp(260px,40%,380px); margin:0; aspect-ratio:1/1; min-height:260px; max-height:380px; }
.tok3d canvas{ display:block; width:100%; height:100%; touch-action:none; }
/* right: the three allocations stacked, 80% first */
.tok-legend3d{ display:flex; flex-direction:column; flex:1 1 auto; gap:14px; }
.tok3d-row{
  flex:0 0 auto;
  display:flex; gap:14px; padding:13px 15px;
  border:1px solid var(--line-soft); border-left:3px solid var(--line-soft); border-radius:0;
  background:rgba(8,7,11,0.5); cursor:pointer;
  transition:border-color .2s ease, background .2s ease, transform .2s ease;
}
.tok3d-row:hover, .tok3d-row.active{ transform:translateX(5px); background:rgba(15,9,11,0.72); }
.tok3d-row .t-dot{ width:12px; height:12px; border-radius:3px; flex:0 0 auto; margin-top:5px; box-shadow:0 0 0 1px rgba(255,255,255,0.12); }
.tok3d-row.lp   .t-dot{ background:#E3A329; } .tok3d-row.lp{ border-left-color:rgba(227,163,41,0.8); }  .tok3d-row.lp:hover,  .tok3d-row.lp.active{ border-color:rgba(227,163,41,0.6); }
.tok3d-row.mkt  .t-dot{ background:#cf1b2b; box-shadow:0 0 0 1px rgba(255,255,255,0.18); } .tok3d-row.mkt{ border-left-color:rgba(207,27,43,0.75); } .tok3d-row.mkt:hover, .tok3d-row.mkt.active{ border-color:rgba(207,27,43,0.6); }
.tok3d-row.team .t-dot{ background:#eef0f3; } .tok3d-row.team{ border-left-color:rgba(255,255,255,0.6); } .tok3d-row.team:hover, .tok3d-row.team.active{ border-color:rgba(255,255,255,0.5); }
.tok3d-row .t-body{ display:flex; flex-direction:column; gap:5px; }
.tok3d-row .t-top{ font-family:var(--f-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--cream); }
.tok3d-row .t-top b{ font-family:var(--f-display); font-style:normal; font-size:18px; color:#fff; margin-right:9px; letter-spacing:0; }
.tok3d-row .t-note{ font-size:13px; line-height:1.55; color:var(--cream-dim); }
@media (max-width:820px){ .tok3d-wrap{ flex-direction:column; } .tok3d{ margin:0 auto; width:100%; max-width:380px; max-height:380px; } .tok-legend3d{ flex-direction:column; } }

/* ---------------- launch (v56 countdown + notify form) ---------------- */
/* Launch: vertical stack — text top · countdown middle · signup bottom */
.win__body--launch{
  display:flex; flex-direction:column; align-items:center;
  gap:clamp(26px,3.6vw,46px);
  text-align:center;
}
.launch__head{ display:flex; flex-direction:column; align-items:center; }
.win__body--launch .launch-lead{ max-width:640px; margin:14px auto 0; text-align:center; }
.launch__time{ display:flex; flex-direction:column; align-items:center; }
.win__body--launch .countdown{
  display:flex; align-items:flex-start; justify-content:center;
  gap:clamp(8px,2vw,22px); margin-top:0;
}
.win__body--launch .cd-sep{ display:block; }        /* single-row countdown keeps its colons */
.win__body--launch .cd-num{ font-size:clamp(46px,7vw,84px); }
.win__body--launch .cd-note{ margin-top:clamp(16px,2.4vw,26px); text-align:center; }
.win__body--launch .notify{ max-width:560px; width:100%; margin:0 auto; }
.win__body--launch .notify-hl{ text-align:center; }
.win__body--launch .notify-fields{ flex-direction:row; gap:12px; }
.win__body--launch .notify-input{ flex:1; text-align:left; }
.win__body--launch .notify-btn{ width:auto; white-space:nowrap; padding:15px 30px; }
@media (max-width:600px){
  .win__body--launch .notify-fields{ flex-direction:column; }
  .win__body--launch .notify-btn{ width:100%; }
}
.launch-lead{ max-width:660px; margin:14px auto 0; color:var(--cream-dim); font-size:clamp(16px,1.5vw,19px); line-height:1.65; }
.launch-lead strong{ color:var(--cream); font-weight:500; }
.countdown{ display:flex; align-items:flex-start; justify-content:center; gap:clamp(6px,2vw,20px); margin-top:clamp(26px,4vw,44px); }
.cd-unit{ display:flex; flex-direction:column; align-items:center; min-width:clamp(58px,15vw,110px); }
.cd-num{ font-family:var(--f-display); font-variant-numeric:tabular-nums; font-size:clamp(46px,9vw,88px); line-height:1; color:var(--cream); letter-spacing:-0.01em; text-shadow:0 0 40px rgba(216,180,92,.12); }
.cd-label{ margin-top:12px; font-family:var(--f-mono); font-size:clamp(9px,1.2vw,12px); text-transform:uppercase; letter-spacing:.24em; color:var(--cream-dim); }
.cd-sep{ font-family:var(--f-display); font-size:clamp(32px,7vw,64px); line-height:1; color:var(--red); margin-top:clamp(2px,0.8vw,8px); opacity:.9; }
.cd-note{ margin-top:clamp(22px,4vw,34px); font-family:var(--f-mono); font-size:12px; letter-spacing:.1em; color:var(--cream-dim); }
.notify{ max-width:520px; margin:clamp(28px,5vw,44px) auto 0; }
.notify-hl{ font-family:var(--f-mono); font-size:11px; text-transform:uppercase; letter-spacing:.18em; color:var(--gold); margin-bottom:18px; }
.notify-fields{ display:flex; flex-direction:column; gap:14px; }
.notify-input{ width:100%; background:rgba(8,7,11,0.55); border:1px solid var(--line-soft); color:var(--cream); padding:15px 18px; font-family:var(--f-body); font-size:16px; text-align:center; outline:none; transition:border-color .2s; -webkit-appearance:none; }
.notify-input::placeholder{ color:rgba(176,166,143,.5); }
.notify-input:focus{ border-color:var(--gold); }
.notify-btn{ width:100%; background:linear-gradient(160deg,#9a3838,#842D2D); color:#f6ece0; border:none; padding:15px 18px; font-family:var(--f-mono); font-size:10px; text-transform:uppercase; letter-spacing:.15em; font-weight:500; cursor:pointer; transition:filter .2s; }
.notify-btn:hover{ filter:brightness(1.14); }
.form-msg{ min-height:20px; margin-top:12px; font-family:var(--f-mono); font-size:12px; letter-spacing:.04em; color:var(--gold-hi); }
.form-msg.err{ color:#d2454c; }
@media (max-width:560px){ .cd-sep{ display:none; } .countdown{ flex-wrap:wrap; gap:18px 14px; } .cd-unit{ min-width:64px; } }

/* ---------------- listings & visibility (pending venues) ---------------- */
/* Nothing here is live yet, so mark + name sit at reduced opacity; the "Soon"
   pill stays legible so the pending state reads at a glance. */
.listings{ width:100%; max-width:660px; margin:0 auto; text-align:left; }
.lst{ list-style:none; margin:0; padding:0; }
.lst__row{
  display:grid; grid-template-columns:auto 1fr auto;
  align-items:center; column-gap:16px;
  padding:15px 2px;
  border-bottom:1px solid var(--line-soft);
}
.lst__row:last-child{ border-bottom:0; }
.lst__logo{
  width:38px; height:38px; border-radius:50%;
  display:grid; place-items:center;
  border:1px solid var(--line); background:rgba(216,180,92,.05);
  font-size:12px; color:var(--gold);
  opacity:.45; transition:opacity .35s var(--ease);
}
.lst__logo img{
  width:22px; height:22px; object-fit:contain; border-radius:3px;
  filter:grayscale(.55); transition:filter .35s var(--ease);
}
.lst__row:hover .lst__logo img{ filter:grayscale(0); }
.lst__body{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.lst__name{
  font-family:var(--f-display); font-size:clamp(17px,1.7vw,20px);
  line-height:1.25; color:var(--cream);
  opacity:.5; transition:opacity .35s var(--ease);
}
.lst__desc{
  font-family:var(--f-body); font-size:clamp(12.5px,1.15vw,14px);
  line-height:1.5; color:var(--cream-dim); opacity:.55;
}
.lst__soon{
  justify-self:end; white-space:nowrap;
  font-size:9px; text-transform:uppercase; letter-spacing:.22em;
  color:var(--gold); opacity:.8;
  padding:5px 11px 4px;
  border:1px solid var(--line); border-radius:999px;
  background:rgba(216,180,92,.06);
}
/* pending, but still responsive to the cursor */
.lst__row:hover .lst__logo,
.lst__row:hover .lst__name{ opacity:.82; }
@media (max-width:600px){
  .lst__row{ column-gap:12px; padding:13px 0; }
  .lst__logo{ width:32px; height:32px; font-size:11px; }
  .lst__soon{ font-size:8.5px; padding:4px 9px 3px; letter-spacing:.18em; }
}

/* ---------------- v56 placement: centered manifesto + charter head ---------------- */
#win-manifesto .win__body{ text-align:center; }
#win-manifesto .quote,
#win-manifesto .body{ max-width:640px; margin-left:auto; margin-right:auto; }
#win-manifesto .orn-div{ margin-top:30px; }
#win-charter .win__body > .hl,
#win-charter .win__body > .body{ text-align:center; }
#win-charter .win__body > .body{ max-width:660px; margin-left:auto; margin-right:auto; }

/* ---------------- launch ---------------- */
.win__body--launch{ position:relative; }
.launch__loop{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; opacity:.3; pointer-events:none;
}
.launch__fore{ position:relative; z-index:1; }
.cd{
  display:flex; align-items:baseline; gap:12px;
  margin:26px 0 30px;
}
.cd__u{ display:flex; flex-direction:column; gap:5px; align-items:center; }
.cd__n{
  font-size:clamp(30px, 3vw, 40px); font-weight:400;
  color:var(--gold-hi);
  font-variant-numeric:tabular-nums;
  text-shadow:0 0 24px rgba(216,180,92,.25);
  min-width:2ch; text-align:center;
}
.cd__l{
  font-size:9px; letter-spacing:.3em; text-transform:uppercase;
  color:var(--cream-dim);
}
.cd__s{
  font-family:var(--f-mono); font-size:24px;
  color:var(--gold-dim); transform:translateY(-8px);
}

/* ---------------- forms ---------------- */
.form__hl{
  font-family:var(--f-display); font-size:17px;
  color:var(--cream); margin-bottom:14px;
}
.form__row{ display:flex; gap:10px; }
.form__row .form__in{ flex:1; }
.form__lbl{
  display:block;
  font-size:10px; letter-spacing:.26em; text-transform:uppercase;
  color:var(--gold); margin:0 0 7px 1px;
}
.form__lbl + .form__in{ margin-bottom:18px; }
.form__in{
  width:100%;
  font-family:var(--f-body); font-size:15px;
  color:var(--cream);
  background:rgba(8,7,11,.55);
  border:1px solid var(--line-soft); border-radius:3px;
  padding:13px 15px;
  transition:border-color .25s, background .25s;
}
.form__in::placeholder{ color:rgba(176,166,143,.72); }
.form__in:focus{ outline:none; border-color:var(--gold); background:rgba(8,7,11,.8); }
.form__in--ta{ min-height:96px; resize:vertical; }
.form__msg{
  min-height:20px; margin-top:12px;
  font-family:var(--f-mono); font-size:12px; letter-spacing:.04em;
  color:var(--gold-hi);
}
.form__msg.err{ color:#e0636b; }
.hp{ position:absolute; left:-9999px; width:1px; height:1px; opacity:0; }

/* ---------------- join ---------------- */
.join{ display:flex; flex-direction:column; gap:clamp(20px,2.6vw,30px); margin-top:6px; }
.join__socials{ display:flex; flex-direction:row; justify-content:center; gap:16px; }
.soc{
  display:flex; align-items:center; justify-content:center;
  width:64px; height:64px; border-radius:4px;
  border:1px solid var(--line); color:var(--gold);
  transition:border-color .25s, color .25s, background .25s, transform .25s;
}
.soc:hover{ border-color:var(--gold); color:var(--gold-hi); background:rgba(216,180,92,.07); transform:translateY(-2px); }

/* ---------------- faq ---------------- */
.faq{ border-bottom:1px solid var(--line-soft); }
.faq summary{
  list-style:none; cursor:pointer;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:17px 2px;
  font-family:var(--f-display); font-size:17px; letter-spacing:.02em;
  color:var(--cream);
  transition:color .25s;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{
  content:"+";
  font-family:var(--f-mono); font-size:17px; color:var(--gold);
  transition:transform .3s var(--ease);
  flex:none;
}
.faq[open] summary::after{ transform:rotate(45deg); }
.faq summary:hover{ color:var(--gold-hi); }
.faq p{
  padding:2px 2px 18px;
  font-size:14.5px; color:var(--cream-dim);
  max-width:62ch;
}

/* ---------------- window action buttons — maroon, matches "Read the Manifesto" ---------------- */
.notify-btn,
.win__body .btn,
.win__body button[type="submit"]{
  color:#f6ece0;
  background:linear-gradient(160deg, #9a3838, #842D2D);
  border:none; border-radius:2px;
  box-shadow:0 6px 24px rgba(132,45,45,.30);
  font-family:var(--f-mono); font-size:11px; font-weight:500;
  text-transform:uppercase; letter-spacing:.18em;
  transition:filter .2s, transform .2s, box-shadow .2s;
}
.notify-btn:hover,
.win__body .btn:hover,
.win__body button[type="submit"]:hover{
  filter:brightness(1.14); transform:translateY(-2px);
  box-shadow:0 10px 30px rgba(132,45,45,.38);
}

/* ---------------- v56 .orn divider (thin gold rule + centered label) ---------------- */
.orn{ display:flex; align-items:center; gap:16px; opacity:.55; margin:26px 0; }
.orn::before, .orn::after{ content:""; flex:1; height:1px; background:var(--tab); }
.orn span{
  font-family:var(--f-mono);
  font-size:10px; letter-spacing:.22em; text-transform:uppercase;
  white-space:nowrap; color:var(--tab);
}

/* ---------------- mobile: windows become obsidian bottom-sheets ---------------- */
@media (max-width: 820px){
  .win, .win--wide{
    left:0 !important; right:0 !important; top:auto !important;
    bottom:0 !important;
    width:100vw; max-width:none;
    max-height:84dvh;
    border-radius:0;
    border-left:0; border-right:0; border-bottom:0;
    border-top:1px solid rgba(216,180,92,.22);
    overflow:hidden;   /* sheet clips; body scrolls inside */
    box-shadow:0 -20px 60px rgba(0,0,0,.6), inset 0 1px 0 rgba(236,206,123,.12);
  }
  /* pilasters would crowd the narrow sheet; grain recedes */
  .win::before{ display:none; }
  .win::after{ opacity:.35; }
  .win-orn{ display:none; }   /* corners off on the compact sheet */
  /* the integrated header stays a full-width strip on the sheet; a touch taller for the thumb */
  .win__bar{
    min-height:54px;
    padding:14px 16px 14px 22px;
    cursor:default;   /* sheets don't drag on mobile */
  }
  .win__body{ max-height:none; flex:1 1 auto; min-height:0; padding:24px 22px 40px; }
  .win.anim-in{ animation:sheetIn .38s var(--ease) both; }
  .win.anim-out{ animation:sheetOut .24s ease-in both; }
  @keyframes sheetIn{ from{ transform:translateY(60%); opacity:.4; } to{ transform:none; opacity:1; } }
  @keyframes sheetOut{ from{ transform:none; opacity:1; } to{ transform:translateY(60%); opacity:0; } }
  .win__min{ display:none; }
  .win__close{ width:42px; height:42px; } /* primary sheet dismissal — thumb-sized */
  .win__close::before, .win__close::after{ left:13px; right:13px; top:20px; }
  .phases{ grid-template-columns:1fr; gap:18px; }
  .tok{ grid-template-columns:1fr; gap:20px; }
  .tok__ring{ max-width:220px; margin:0 auto; }
  .join{ gap:22px; }
  .cd{ gap:8px; }
}