
:root{
  color-scheme:light;
  --ivory:#F2EBDD;
  --ivory-2:#EDE4D3;
  --paper:#FBF8F1;
  --ink:#242724;
  --ink-2:#3A3D3A;
  --muted:#6B6A62;
  --line:rgba(36,39,36,.14);
  --verm:#EB512F;
  --verm-dark:#C93E20;
  --sage:#899578;
  --mist:#93A9B7;
  --ochre:#C29A59;
  --plum:#645063;
  --card:#FFFFFF;
  --header-bg:rgba(242,235,221,.92);
  --shadow:0 20px 50px rgba(36,39,36,.12);
  --radius-img:20px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} *{animation:none!important; transition:none!important} }
body{margin:0; background:var(--ivory); color:var(--ink); font-family:"Archivo",system-ui,-apple-system,Segoe UI,sans-serif; font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased}
img{display:block; max-width:100%}
a{color:inherit}
button{font:inherit; cursor:pointer}
:focus-visible{outline:3px solid var(--verm); outline-offset:3px; border-radius:4px}
.wrap{max-width:1240px; margin:0 auto; padding:0 28px}
@media(max-width:640px){ .wrap{padding:0 20px} }

/* Header */
.site-header{position:sticky; top:0; z-index:40; background:var(--header-bg); backdrop-filter:blur(12px); border-bottom:1px solid var(--line)}
.header-in{display:flex; align-items:center; justify-content:space-between; gap:16px; height:68px; max-width:1240px; margin:0 auto; padding:0 28px}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none; border:0; background:none; padding:0; text-align:left}
.brand img{width:38px; height:38px; object-fit:contain}
.brand-text{line-height:1.05}
.brand-text strong{display:block; font-weight:900; letter-spacing:.02em; font-size:15px; text-transform:uppercase}
.brand-text span{display:block; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin-top:2px}
.main-nav{display:flex; align-items:center; gap:28px}
.main-nav button.linklike{background:none; border:0; font-weight:600; font-size:15px; padding:6px 0; color:var(--ink)}
.main-nav button.linklike:hover{color:var(--verm-dark); text-decoration:underline; text-underline-offset:4px}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; border-radius:999px; font-weight:700; font-size:15px; line-height:1; padding:14px 22px; border:1.5px solid var(--ink); text-decoration:none; transition:transform .15s ease, background .15s ease, color .15s ease; white-space:nowrap}
.btn:active{transform:scale(.98)}
.btn-primary{background:var(--ink); color:var(--ivory)}
.btn-primary:hover{background:var(--verm); border-color:var(--verm); color:#fff}
.btn-secondary{background:transparent; color:var(--ink)}
.btn-secondary:hover{border-color:var(--verm); color:var(--verm-dark)}
.btn-sm{padding:11px 18px; font-size:14px}
.btn-verm{background:var(--verm); border-color:var(--verm); color:#fff}
.btn-verm:hover{background:var(--verm-dark); border-color:var(--verm-dark)}
.menu-btn{display:none; background:none; border:1.5px solid var(--ink); border-radius:999px; padding:9px 16px; font-weight:700; font-size:14px}
.mobile-menu{display:none; border-top:1px solid var(--line); padding:16px 28px 22px; background:var(--ivory)}
.mobile-menu.open{display:block}
.mobile-menu button,.mobile-menu a{display:block; width:100%; text-align:left; background:none; border:0; padding:12px 0; font-weight:700; font-size:17px; border-bottom:1px solid var(--line); text-decoration:none}
.mobile-menu .btn{margin-top:16px; text-align:center; border-bottom:1.5px solid var(--ink)}
@media(max-width:860px){ .main-nav{display:none} .menu-btn{display:inline-flex} .header-in{padding:0 20px} }

/* Status pill */
.status-row{display:flex; flex-wrap:wrap; gap:10px; align-items:center}
.pill{display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:700; letter-spacing:.04em; padding:7px 13px; border-radius:999px; border:1px solid var(--line); background:var(--paper)}
.pill .dot{width:8px; height:8px; border-radius:50%; background:var(--verm); flex:none}
.pill.solid{background:var(--ink); color:var(--ivory); border-color:var(--ink)}

/* Intro overlay — the naming reveal film, full viewport */
.intro-overlay{position:fixed; inset:0; z-index:100; background:var(--ivory); padding:0; opacity:1; transition:opacity .7s ease}
.intro-overlay.hidden{display:none}
.intro-overlay.leaving{opacity:0; pointer-events:none}
body.intro-exit .site-header,body.intro-exit main,body.intro-exit .site-footer{animation:introPageIn .7s ease both}
@keyframes introPageIn{from{opacity:0} to{opacity:1}}
.intro-video-frame{position:absolute; inset:0; width:100%; height:100%; height:100dvh; overflow:hidden; border:0; border-radius:0; box-shadow:none; background:#F2EBDD}
.intro-video-frame video{position:absolute; inset:0; width:100%; height:100%; display:block; object-fit:contain; object-position:center; background:#F2EBDD; transition:opacity .95s ease}
.intro-video-frame.show-endscreen video{opacity:0}
.intro-video-frame.show-fallback video{opacity:0}
/* DOM Q&A fallback — the film's dialogue as page content, shown only when
   the film itself cannot be seen playing on this machine */
.intro-fallback{position:absolute; inset:0; z-index:2; display:none; background:#F2EBDD}
.intro-video-frame.show-fallback .intro-fallback{display:block}
.fb-stage{position:absolute; left:50%; top:44%; transform:translate(-50%,-50%); width:min(880px,88vw); text-align:left; transition:opacity .5s ease}
.intro-fallback.fb-done .fb-stage{opacity:0}
.fb-who{display:flex; align-items:center; gap:10px; font-size:clamp(13px,1.5vw,19px); letter-spacing:.05em; color:#8A8474; text-transform:uppercase; margin:0 0 10px; font-weight:500}
.fb-who img{width:34px; height:34px; object-fit:contain}
.fb-ai{opacity:0; transition:opacity .3s ease; margin-top:36px}
.fb-ai.on{opacity:1}
.fb-line{font-size:clamp(25px,3.6vw,46px); line-height:1.25; color:var(--ink); margin:0; min-height:1.25em; font-weight:500}
.fb-caret{display:inline-block; width:8px; height:1.02em; background:var(--verm); margin-left:7px; vertical-align:-.1em; animation:fbBlink 1.05s step-end infinite}
.fb-caret.off{display:none}
@keyframes fbBlink{0%,100%{opacity:1} 50%{opacity:0}}
@media(max-width:640px){ .fb-stage{top:46%} .fb-who img{width:26px; height:26px} .fb-ai{margin-top:26px} }
.intro-skip{position:absolute; top:max(16px,env(safe-area-inset-top)); right:max(16px,env(safe-area-inset-right)); background:rgba(250,247,239,.92); border:1.5px solid var(--ink); border-radius:999px; padding:9px 16px; font-weight:700; font-size:13.5px; z-index:5; color:var(--ink); transition:opacity .4s ease, visibility 0s}
.intro-skip:hover{border-color:var(--verm); color:var(--verm-dark)}
.intro-sound{position:absolute; right:max(16px,env(safe-area-inset-right)); bottom:max(16px,env(safe-area-inset-bottom)); background:rgba(250,247,239,.92); border:1.5px solid var(--ink); border-radius:999px; padding:8px 15px; font-weight:700; font-size:13px; z-index:5; color:var(--ink); transition:opacity .4s ease, visibility 0s}
.intro-sound:hover{border-color:var(--verm); color:var(--verm-dark)}
.intro-video-frame.controls-gone .intro-skip,.intro-video-frame.controls-gone .intro-sound,.intro-video-frame.show-endscreen .intro-skip,.intro-video-frame.show-endscreen .intro-sound{opacity:0; visibility:hidden; pointer-events:none; transition:opacity .4s ease, visibility 0s linear .4s}
/* Brand end screen — dynamic Dreamer wall + lockup (replaces the film's final frame) */
.intro-endscreen{position:absolute; inset:0; z-index:4; opacity:0; visibility:hidden; pointer-events:none; transition:opacity .95s ease, visibility 0s linear .95s; overflow:hidden; background:var(--ivory)}
.intro-video-frame.show-endscreen .intro-endscreen{opacity:1; visibility:visible; pointer-events:auto; transition:opacity .95s ease, visibility 0s}
.endscreen-wall{position:absolute; inset:-4%; z-index:1; animation:wallDrift 28s ease-in-out infinite alternate; will-change:transform}
@keyframes wallDrift{from{transform:translate3d(-1.4%,-1%,0) scale(1.04)} to{transform:translate3d(1.4%,1.1%,0) scale(1.04)}}
.wall-tile{position:absolute; overflow:hidden; border-radius:10px; box-shadow:0 8px 24px rgba(36,39,36,.18)}
.wall-tile img{width:100%; height:100%; object-fit:cover; animation:kenBurns 16s ease-in-out infinite alternate; will-change:transform}
.wall-tile:nth-child(even) img{animation-duration:20s; animation-delay:-6s}
.wall-tile:nth-child(3n) img{animation-duration:13s; animation-delay:-3s}
@keyframes kenBurns{from{transform:scale(1) translate(0,0)} to{transform:scale(1.16) translate(-2.2%,2%)}}
.wt-1{top:-7%; left:-5%; width:27%; aspect-ratio:1/1}
.wt-2{top:-9%; left:20%; width:23%; aspect-ratio:1/1}
.wt-3{top:-5%; left:42%; width:29%; aspect-ratio:1/1}
.wt-4{top:-11%; right:-6%; width:25%; aspect-ratio:1/1}
.wt-5{top:29%; left:-9%; width:25%; aspect-ratio:1/1}
.wt-6{top:31%; left:17%; width:21%; aspect-ratio:1/1}
.wt-7{top:27%; right:19%; width:23%; aspect-ratio:1/1}
.wt-8{top:30%; right:-7%; width:27%; aspect-ratio:1/1}
.wt-9{bottom:-9%; left:-4%; width:29%; aspect-ratio:1/1}
.wt-10{bottom:-11%; left:24%; width:23%; aspect-ratio:1/1}
.wt-11{bottom:-7%; left:46%; width:25%; aspect-ratio:1/1}
.wt-12{bottom:-13%; right:20%; width:21%; aspect-ratio:1/1}
.wt-13{bottom:-5%; right:-6%; width:28%; aspect-ratio:1/1}
.endscreen-wash{position:absolute; inset:0; z-index:2; background:radial-gradient(ellipse at center, rgba(242,235,221,.60) 0%, rgba(242,235,221,.44) 52%, rgba(242,235,221,.36) 78%, rgba(242,235,221,.32) 100%); pointer-events:none}
.endscreen-content{position:relative; z-index:3; height:100%; width:100%; max-width:920px; margin:0 auto; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:32px 24px}
.endscreen-lockup{font-family:"Archivo Black","Archivo",sans-serif; text-transform:uppercase; line-height:.94; letter-spacing:.01em; color:var(--ink); font-size:clamp(42px,7.6vw,96px)}
.endscreen-lockup span{display:block}
.endscreen-lockup .verm{color:var(--verm)}
.endscreen-master{width:clamp(104px,17vh,168px); aspect-ratio:1/1; object-fit:cover; border-radius:18px; border:1px solid rgba(36,39,36,.16); box-shadow:0 16px 36px rgba(36,39,36,.22); margin-top:22px}
.endscreen-tagline{margin:18px 0 0; font-size:clamp(12px,1.7vw,16px); font-weight:800; letter-spacing:.22em; text-transform:uppercase; color:var(--ink-2)}
.endscreen-meta{margin:14px 0 0; display:inline-flex; align-items:center; gap:8px; font-size:clamp(12.5px,1.5vw,15px); font-weight:700; letter-spacing:.03em; color:var(--ink); background:rgba(251,248,241,.88); border:1px solid rgba(36,39,36,.16); border-radius:999px; padding:8px 16px; max-width:100%; flex-wrap:wrap; justify-content:center}
.endscreen-meta .dotsep{color:var(--verm); font-weight:900}
.endscreen-content .intro-enter{margin-top:26px}
.intro-enter{position:relative; display:inline-flex; align-items:center; justify-content:center; opacity:0; visibility:hidden; pointer-events:none; background:var(--verm); color:#fff; border:1.5px solid var(--verm); border-radius:999px; padding:19px 68px; min-width:min(240px,72vw); font-weight:800; font-size:20px; letter-spacing:.02em; box-shadow:0 16px 34px rgba(235,81,47,.34); transform:translateY(14px); transition:opacity .8s ease, transform .8s ease, visibility 0s linear .8s, background .15s ease; z-index:3}
.intro-enter.show{opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0); transition:opacity .8s ease, transform .8s ease, visibility 0s, background .15s ease}
.intro-enter:hover{background:var(--verm-dark); border-color:var(--verm-dark)}
.intro-enter:active{transform:translateY(0) scale(.98)}
@media(max-width:640px){
  .endscreen-content{padding:24px 18px}
  .endscreen-lockup{font-size:clamp(36px,11.4vw,54px)}
  .endscreen-master{width:clamp(92px,15vh,124px); margin-top:16px; border-radius:14px}
  .endscreen-tagline{letter-spacing:.15em; margin-top:14px}
  .endscreen-meta{margin-top:11px; padding:7px 13px; line-height:1.45}
  .endscreen-content .intro-enter{margin-top:20px}
  .intro-enter{padding:16px 44px; font-size:18.5px}
  /* Portrait: taller tiles so the wall covers the full viewport height */
  .wt-1{top:-4%; left:-14%; right:auto; width:56%}
  .wt-2{top:-6%; left:auto; right:-14%; width:58%}
  .wt-3{top:13%; left:-18%; right:auto; width:54%}
  .wt-4{top:15%; left:auto; right:-16%; width:55%}
  .wt-5{top:29%; left:24%; right:auto; width:52%}
  .wt-6{top:44%; left:-16%; right:auto; width:54%}
  .wt-7{top:46%; left:auto; right:-16%; width:54%}
  .wt-8{top:60%; left:24%; right:auto; width:52%}
  .wt-9{top:74%; bottom:auto; left:-14%; right:auto; width:56%}
  .wt-10{top:76%; bottom:auto; left:auto; right:-12%; width:54%}
  .wt-11{top:auto; bottom:-6%; left:-10%; right:auto; width:55%}
  .wt-12{top:auto; bottom:-8%; left:38%; right:auto; width:52%}
  .wt-13{top:auto; bottom:-5%; left:auto; right:-14%; width:56%}
}
@media(prefers-reduced-motion: reduce){
  .endscreen-wall,.wall-tile img{animation:none!important}
}

/* Hero */
.hero{padding:56px 0 72px; scroll-margin-top:84px}
.hero-grid{display:grid; grid-template-columns:1.08fr .92fr; gap:56px; align-items:center}
.hero h1{font-family:"Archivo Black","Archivo",sans-serif; font-size:clamp(44px,6.2vw,84px); line-height:.96; letter-spacing:.005em; margin:22px 0 0; text-transform:uppercase}
.hero h1 .verm{color:var(--verm)}
.brandline{font-size:clamp(19px,2.2vw,24px); font-weight:700; margin:20px 0 0}
.hero-intro{font-size:18px; color:var(--ink-2); max-width:34em; margin:14px 0 0}
.hero-ctas{display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; align-items:center}
.hero-helper{font-size:14px; color:var(--muted); margin-top:12px}
.hero-stats{display:flex; flex-wrap:wrap; gap:0; margin-top:36px; border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.hero-stat{padding:16px 22px 16px 0; margin-right:22px}
.hero-stat strong{display:block; font-size:20px; font-weight:900; line-height:1.1}
.hero-stat span{font-size:13px; color:var(--muted)}
.hero-figure{position:relative}
.hero-figure .frame{background:var(--paper); border:1px solid var(--line); border-radius:28px; padding:14px; box-shadow:var(--shadow)}
.hero-figure img.main{width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:20px}
.hero-figure figcaption{display:flex; justify-content:space-between; gap:12px; padding:14px 6px 4px; font-size:13.5px}
.hero-figure figcaption strong{font-weight:800}
.hero-figure figcaption span{color:var(--muted); text-align:right}
.hero-badge{position:absolute; top:-14px; left:-10px; background:var(--verm); color:#fff; font-weight:800; font-size:13px; letter-spacing:.05em; padding:9px 15px; border-radius:999px; transform:rotate(-3deg); box-shadow:0 10px 24px rgba(235,81,47,.35)}
@media(max-width:960px){ .hero-grid{grid-template-columns:1fr; gap:36px} .hero{padding:36px 0 52px} }

/* Sections */
section{scroll-margin-top:84px}
.section{padding:76px 0}
.section-head{max-width:760px; margin-bottom:40px}
.section-head h2{font-family:"Archivo Black","Archivo",sans-serif; font-size:clamp(30px,4vw,46px); line-height:1.05; margin:0 0 14px; text-transform:uppercase}
.section-head p{color:var(--ink-2); font-size:17.5px; margin:0}
.kicker{font-size:12.5px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:var(--verm-dark); margin:0 0 14px}

/* World editorial */
.world-grid{display:grid; grid-template-columns:1.15fr .85fr; gap:22px}
.world-card{border:0; background:none; padding:0; text-align:left; width:100%}
.world-card figure{margin:0}
.world-card img{width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:var(--radius-img); border:1px solid var(--line)}
.world-card figcaption{padding:14px 4px 0; font-size:15px}
.world-card figcaption strong{display:block; font-size:17px; font-weight:800}
.world-card figcaption span{color:var(--muted)}
.world-stack{display:grid; gap:22px}
.world-stack .world-card img{aspect-ratio:1/.92}
@media(max-width:860px){ .world-grid{grid-template-columns:1fr} }

/* Protocol / steps on ink */
.ink-band{background:#242724; color:#F2EBDD; border-radius:32px; padding:56px 48px; margin:0 auto}
.ink-band h2{font-family:"Archivo Black","Archivo",sans-serif; font-size:clamp(28px,3.8vw,44px); line-height:1.05; margin:0 0 12px; text-transform:uppercase}
.ink-band .lead{color:#CFC8B4; max-width:44em; margin:0 0 40px; font-size:17.5px}
.steps{display:grid; grid-template-columns:repeat(3,1fr); gap:36px}
.step{border-top:2px solid rgba(242,235,221,.22); padding-top:20px}
.step .num{font-family:"IBM Plex Mono",monospace; font-size:14px; color:var(--verm); font-weight:500}
.step img{width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:16px; margin:14px 0 18px}
.step h3{font-size:21px; font-weight:800; margin:0 0 8px; line-height:1.25}
.step p{color:#CFC8B4; margin:0; font-size:15.5px}
.rule-line{margin-top:44px; padding-top:28px; border-top:1px solid rgba(242,235,221,.18); display:flex; flex-wrap:wrap; gap:14px; align-items:center; justify-content:space-between}
.rule-line strong{font-family:"Archivo Black","Archivo",sans-serif; font-size:clamp(18px,2.4vw,26px); text-transform:uppercase; letter-spacing:.01em}
@media(max-width:900px){ .steps{grid-template-columns:1fr; gap:28px} .ink-band{padding:40px 26px; border-radius:24px} }

/* Concept studies */
.studies-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:20px}
.study{border:0; background:none; padding:0; text-align:left; width:100%}
.study figure{margin:0}
.study .thumb{position:relative; overflow:hidden; border-radius:16px; border:1px solid var(--line)}
.study img{width:100%; aspect-ratio:1/1; object-fit:cover; transition:transform .35s ease}
.study:hover img{transform:scale(1.03)}
.study .tag{position:absolute; top:10px; left:10px; background:rgba(36,39,36,.88); color:#F2EBDD; font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; padding:5px 10px; border-radius:999px}
.study figcaption{padding:11px 2px 0}
.study figcaption strong{display:block; font-weight:800; font-size:15.5px; line-height:1.3}
.study figcaption span{font-size:13.5px; color:var(--muted); line-height:1.45; display:block; margin-top:2px}
.studies-note{margin-top:26px; font-size:14.5px; color:var(--muted); max-width:52em}
@media(max-width:1024px){ .studies-grid{grid-template-columns:repeat(3,1fr)} }
@media(max-width:680px){ .studies-grid{grid-template-columns:repeat(2,1fr); gap:14px} }
@media(max-width:380px){ .studies-grid{grid-template-columns:1fr} }

/* Participation */
.participation{background:var(--paper); border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.fee-table{width:100%; border-collapse:collapse; margin-top:8px; font-size:15.5px}
.fee-table th,.fee-table td{padding:13px 10px; text-align:left; border-bottom:1px solid var(--line)}
.fee-table th{font-size:12.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted)}
.fee-table td:last-child,.fee-table th:last-child{text-align:right; font-variant-numeric:tabular-nums}
.fee-table tr.current td{font-weight:800}
.fee-table .stage-note{font-size:12px; font-weight:800; color:var(--verm-dark); letter-spacing:.06em; text-transform:uppercase; margin-left:8px}
.part-grid{display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:start}
.requirements{list-style:none; padding:0; margin:18px 0 0; display:flex; flex-wrap:wrap; gap:8px}
.requirements li{border:1px solid var(--line); background:var(--ivory); border-radius:999px; padding:8px 14px; font-size:13.5px; font-weight:700}
.fineprint{font-size:14px; color:var(--muted); margin-top:16px}
@media(max-width:900px){ .part-grid{grid-template-columns:1fr; gap:32px} .fee-table th:nth-child(1),.fee-table td:nth-child(1){max-width:150px} }

/* FAQ */
.faq-list{border-top:1px solid var(--line); max-width:860px}
.faq-item{border-bottom:1px solid var(--line)}
.faq-q{width:100%; display:flex; justify-content:space-between; align-items:center; gap:16px; background:none; border:0; padding:20px 4px; text-align:left; font-weight:700; font-size:17px; color:var(--ink)}
.faq-q .chev{flex:none; width:30px; height:30px; border:1.5px solid var(--ink); border-radius:50%; display:grid; place-items:center; font-size:16px; line-height:1; transition:transform .2s ease}
.faq-item.open .faq-q .chev{transform:rotate(45deg); background:var(--ink); color:var(--ivory)}
.faq-a{display:none; padding:0 4px 22px; color:var(--ink-2); max-width:46em}
.faq-item.open .faq-a{display:block}

/* Closing */
.closing{text-align:center; padding:84px 0 70px}
.closing img.avatar{width:104px; height:104px; border-radius:50%; object-fit:cover; margin:0 auto 22px; border:2px solid var(--ink)}
.closing h2{font-family:"Archivo Black","Archivo",sans-serif; font-size:clamp(32px,5vw,58px); line-height:1.02; margin:0 0 16px; text-transform:uppercase}
.closing p{color:var(--ink-2); max-width:36em; margin:0 auto}
.closing .hero-ctas{justify-content:center}

/* Footer */
footer.site-footer{border-top:1px solid var(--line); padding:36px 0 44px; font-size:14px; color:var(--muted)}
.footer-in{display:flex; flex-wrap:wrap; gap:18px; justify-content:space-between; align-items:flex-start; max-width:1240px; margin:0 auto; padding:0 28px}
.footer-in .links{display:flex; flex-wrap:wrap; gap:20px}
.footer-in button,.footer-in a{background:none; border:0; color:var(--muted); font-weight:600; text-decoration:none; padding:0; font-size:14px}
.footer-in button:hover,.footer-in a:hover{color:var(--verm-dark); text-decoration:underline}
@media(max-width:640px){ .footer-in{padding:0 20px} }

/* Exchange */
.exchange-banner{display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-top:22px}
.exchange-grid{display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-top:8px}
.exchange-block{background:var(--paper); border:1px solid var(--line); border-radius:24px; padding:30px 28px; display:flex; flex-direction:column}
.exchange-block .aud{font-size:12.5px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--verm-dark); margin:0 0 10px}
.exchange-block h3{font-family:"Archivo Black","Archivo",sans-serif; font-size:clamp(22px,2.6vw,28px); line-height:1.08; margin:0 0 12px; text-transform:uppercase}
.exchange-block p{color:var(--ink-2); margin:0 0 14px; font-size:15.5px}
.exchange-block .cost{font-weight:900; font-size:17px; color:var(--ink); margin:0 0 14px}
.exchange-block .cost span{display:block; font-weight:600; font-size:13.5px; color:var(--muted); margin-top:3px}
.disclosure{border-top:2px solid var(--ink); background:var(--ivory); padding:16px 18px; margin:2px 0 20px; font-size:15px; color:var(--ink)}
.disclosure strong{display:block; font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--verm-dark); margin-bottom:6px}
.disclosure p{margin:0; color:var(--ink); font-size:15px}
.exchange-block .btn{margin-top:auto; align-self:flex-start}
.exchange-note{margin-top:26px; border-top:1px solid var(--line); padding-top:22px; color:var(--ink-2); font-size:15.5px; max-width:56em}
.exchange-note strong{color:var(--ink)}
.avail-table{width:100%; border-collapse:collapse; margin-top:6px; font-size:15px}
.avail-table th,.avail-table td{padding:12px 10px; text-align:left; border-bottom:1px solid var(--line); vertical-align:top}
.avail-table th{font-size:12.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted)}
.avail-table td:first-child{font-weight:700; max-width:260px}
.status-legend{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:8px}
.status-card{border:1px solid var(--line); border-radius:18px; padding:20px; background:var(--paper); text-align:left}
.status-chip{display:inline-flex; align-items:center; gap:7px; font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; padding:6px 11px; border-radius:999px; border:1.5px solid var(--ink); background:var(--ivory); color:var(--ink)}
.status-chip::before{content:""; width:8px; height:8px; border-radius:50%; background:var(--sage); flex:none}
.status-chip.not-included::before{background:var(--ochre)}
.status-chip.retired{border-style:dashed}
.status-chip.retired::before{background:var(--verm)}
.status-card p{color:var(--ink-2); font-size:14.5px; margin:12px 0 0}
.exchange-teaser{margin-top:44px; border-top:1px solid var(--line); padding-top:28px; display:flex; flex-wrap:wrap; gap:18px; align-items:center; justify-content:space-between}
.exchange-teaser h3{font-size:20px; font-weight:900; margin:0 0 6px}
.exchange-teaser p{color:var(--ink-2); margin:0; max-width:44em; font-size:15.5px}
@media(max-width:900px){ .exchange-grid{grid-template-columns:1fr} .status-legend{grid-template-columns:1fr} .avail-table td:first-child{max-width:none} }

/* Views */
.view{display:none}
.view.active{display:block}

/* Collection empty state */
.empty-hero{padding:64px 0 30px; text-align:left}
.empty-hero h1{font-family:"Archivo Black","Archivo",sans-serif; font-size:clamp(40px,6vw,72px); margin:0 0 14px; text-transform:uppercase; line-height:.98}
.empty-hero p{color:var(--ink-2); max-width:40em; font-size:18px}
.empty-box{margin:26px 0 76px; border:1.5px dashed var(--line); border-radius:24px; padding:52px 28px; text-align:center; background:var(--paper)}
.empty-box img{width:110px; height:110px; object-fit:cover; border-radius:50%; margin:0 auto 18px}
.empty-box h2{font-size:24px; font-weight:900; margin:0 0 8px}
.empty-box p{color:var(--muted); margin:0 auto 22px; max-width:34em}

/* Detail empty */
.detail-empty{padding:64px 0 90px; text-align:center}
.detail-empty h1{font-family:"Archivo Black","Archivo",sans-serif; font-size:clamp(30px,4.5vw,48px); text-transform:uppercase; margin:0 0 12px}
.detail-empty p{color:var(--muted); margin:0 auto 26px; max-width:36em}

/* Participation dialog */
.overlay{position:fixed; inset:0; z-index:90; background:rgba(24,25,24,.55); display:none; align-items:flex-end; justify-content:center; padding:0}
.overlay.open{display:flex}
@media(min-width:760px){ .overlay{align-items:center; padding:24px} }
.panel{background:var(--ivory); color:var(--ink); width:min(620px,100%); max-height:92vh; overflow:auto; border-radius:24px 24px 0 0; padding:30px 28px 32px; box-shadow:var(--shadow)}
@media(min-width:760px){ .panel{border-radius:24px} }
.panel-head{display:flex; justify-content:space-between; gap:16px; align-items:flex-start}
.panel h2{font-family:"Archivo Black","Archivo",sans-serif; font-size:26px; line-height:1.1; margin:0; text-transform:uppercase}
.close-btn{flex:none; width:38px; height:38px; border-radius:50%; border:1.5px solid var(--ink); background:none; font-size:18px; line-height:1; display:grid; place-items:center}
.close-btn:hover{background:var(--ink); color:var(--ivory)}
.panel .sub{font-weight:700; margin:18px 0 10px}
.cmd-box{display:flex; gap:10px; align-items:stretch; flex-wrap:wrap}
.cmd{flex:1 1 260px; font-family:"IBM Plex Mono",monospace; font-size:13.5px; background:var(--paper); border:1px solid var(--line); border-radius:12px; padding:14px 16px; word-break:break-word; user-select:all; line-height:1.5}
.copy-feedback{display:none; margin-top:12px; font-weight:700; font-size:14.5px; color:var(--verm-dark)}
.copy-feedback.show{display:block}
.panel .req{list-style:none; padding:0; margin:8px 0 0; display:flex; flex-wrap:wrap; gap:8px}
.panel .req li{border:1px solid var(--line); border-radius:999px; padding:7px 12px; font-size:13px; font-weight:700}
.panel dl{margin:20px 0 0}
.panel dt{font-size:12px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin-top:16px}
.panel dd{margin:4px 0 0; font-size:15px}
.text-link{background:none; border:0; padding:0; font-weight:700; text-decoration:underline; text-underline-offset:3px; color:var(--ink)}
.text-link:hover{color:var(--verm-dark)}

/* Lightbox */
.lightbox{position:fixed; inset:0; z-index:95; background:rgba(24,25,24,.72); display:none; align-items:center; justify-content:center; padding:22px}
.lightbox.open{display:flex}
.lightbox-card{background:var(--ivory); color:var(--ink); border-radius:22px; padding:18px; max-width:560px; width:100%; max-height:92vh; overflow:auto}
.lightbox-card img{width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:14px}
.lightbox-card .cap{padding:16px 4px 4px}
.lightbox-card .cap strong{display:block; font-size:19px; font-weight:900}
.lightbox-card .cap span{color:var(--muted); font-size:14.5px}
.lightbox-top{display:flex; justify-content:space-between; align-items:center; margin-bottom:12px}
.lightbox-top span{font-size:11.5px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; background:var(--ink); color:var(--ivory); padding:6px 11px; border-radius:999px}
