/* 01 · Nocturne — a quiet cinematic title sequence. */
body[data-theme="nocturne"]{
  --bg:#000000;--bg-glow:#000000;--ink:#e6e2da;--muted:#a39f97;
  --accent:#cbb58a;--line:#cbb58a36;--canvas-text:#aaa59b;
  --canvas-frame:#aaa59b;--canvas-gold:#cbb58a;--canvas-ink:#e6e2da;
  background:var(--bg);color:var(--ink);font-family:"Avenir Next","Helvetica Neue",Arial,sans-serif;
}
body[data-theme="nocturne"] header{padding:25px 4.8%;background:linear-gradient(180deg,#000000f2,transparent);align-items:flex-start}
body[data-theme="nocturne"] .brand{font:20px/1.1 Baskerville,"Times New Roman",serif;letter-spacing:-.35px}
body[data-theme="nocturne"] .brand em{font-style:italic;color:var(--accent)}
body[data-theme="nocturne"] nav{font-size:10px;letter-spacing:.06em;color:var(--muted);gap:28px;align-items:center}
body[data-theme="nocturne"] nav a{padding:4px 0;border-bottom:1px solid transparent;transition:color .2s,border-color .2s}
body[data-theme="nocturne"] nav a:hover{color:var(--ink);border-color:var(--accent)}
body[data-theme="nocturne"] .stage::after{content:"";position:absolute;inset:81px 3.2% 110px;border-left:1px solid #252525;border-right:1px solid #252525;pointer-events:none;z-index:3}
body[data-theme="nocturne"] .chapter{top:15%;left:6%;right:6%;text-align:center}
body[data-theme="nocturne"] .eyebrow{font-size:8px;font-weight:500;letter-spacing:.26em;color:var(--accent);margin-bottom:18px;display:flex;justify-content:center;align-items:center;gap:17px}
body[data-theme="nocturne"] .eyebrow::before,body[data-theme="nocturne"] .eyebrow::after{content:"";width:24px;height:1px;background:var(--accent);opacity:.6}
body[data-theme="nocturne"] h1{font-family:Didot,"Bodoni 72",Baskerville,Georgia,serif;font-weight:400;font-size:clamp(36px,4.1vw,56px);line-height:1.12;letter-spacing:-.022em;max-width:1000px;margin:0 auto;text-wrap:balance}
body[data-theme="nocturne"] .description{font-size:12px;line-height:1.65;letter-spacing:.01em;color:var(--muted);margin:15px auto 0}
body[data-theme="nocturne"] .scene-caption{font-size:8px;font-weight:400;letter-spacing:.2em;color:#a39f97}
body[data-theme="nocturne"] .bottom{left:4.8%;right:4.8%;bottom:50px;gap:44px;align-items:flex-end}
body[data-theme="nocturne"] .scroll-instruction{font-size:9px;letter-spacing:.035em;color:var(--muted);padding-bottom:11px}
body[data-theme="nocturne"] .timeline{gap:16px;padding-bottom:13px;counter-reset:chapter}
body[data-theme="nocturne"] .timeline button{counter-increment:chapter;font-size:9px;letter-spacing:.015em;color:#8c8982;line-height:1.25;padding:0 0 5px;transition:color .2s;white-space:nowrap}
body[data-theme="nocturne"] .timeline button::before{content:"0" counter(chapter);display:block;margin-bottom:9px;font-size:7px;letter-spacing:.12em;color:#8c8982}
body[data-theme="nocturne"] .timeline button.active,body[data-theme="nocturne"] .timeline button:hover{color:var(--ink)}
body[data-theme="nocturne"] .timeline button.active::before{color:var(--accent)}
body[data-theme="nocturne"] .track{background:#252525}
body[data-theme="nocturne"] .track i{background:var(--accent);box-shadow:none}
body[data-theme="nocturne"] .concept-note{right:4.8%;bottom:19px;font-size:7px;letter-spacing:.04em;color:#8c8982}
body[data-theme="nocturne"] .crystal-record{top:74.5%}
body[data-theme="nocturne"] .crystal-record>span{color:var(--muted);font-size:7px;letter-spacing:.1em}
body[data-theme="nocturne"] .crystal-record>a{font:20px/1.2 Baskerville,Georgia,serif;letter-spacing:-.012em;color:var(--ink);margin-top:10px}
body[data-theme="nocturne"] .crystal-record>small{color:#a39f97;font-size:8px;letter-spacing:.045em;margin-top:8px}
body[data-theme="nocturne"] .crystal-record .scroll-guests{color:var(--accent);font-size:8px;letter-spacing:.025em}
body[data-theme="nocturne"] .diversity h1{font-size:clamp(34px,3.8vw,52px)}
body[data-theme="nocturne"] .finale .chapter{top:35%;text-shadow:0 3px 26px #000000}
body[data-theme="nocturne"] .finale .eyebrow{font:8px "Avenir Next","Helvetica Neue",sans-serif;letter-spacing:.36em;margin-bottom:25px}
body[data-theme="nocturne"] .finale h1{font-size:clamp(42px,5vw,68px);max-width:950px}
body[data-theme="nocturne"] .finale .description{font:italic clamp(17px,1.65vw,21px)/1.4 Baskerville,Georgia,serif;color:var(--accent);margin-top:20px}
body[data-theme="nocturne"] .structure-link{color:var(--ink);font-size:10px;letter-spacing:.05em;border-color:var(--accent);padding:12px 0}
body[data-theme="nocturne"] .finale .structure-link{background:#000000b8;padding:13px 22px;border:1px solid #cbb58a60;border-radius:0}
body[data-theme="nocturne"] .finale .bottom{background:linear-gradient(transparent,#000000e8)}
body[data-theme="nocturne"] .edition-link{font-family:"Avenir Next","Helvetica Neue",sans-serif;font-size:8px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
body[data-theme="nocturne"] .edition-switcher{border:1px solid #cbb58a38;background:#000000e8;color:var(--ink);border-radius:0;box-shadow:0 10px 30px #0002}
body[data-theme="nocturne"] .design-detail{color:var(--accent);opacity:.6}
@media(max-width:700px){
  body[data-theme="nocturne"] header{padding:23px 5.7%}
  body[data-theme="nocturne"] .brand{font-size:18px}
  body[data-theme="nocturne"] nav{font-size:8px;gap:16px}
  body[data-theme="nocturne"] .stage::after{inset:78px 3.2% 116px}
  body[data-theme="nocturne"] .chapter{top:14.5%;left:6%;right:6%}
  body[data-theme="nocturne"] .eyebrow{font-size:7px;letter-spacing:.21em;margin-bottom:18px;gap:12px}
  body[data-theme="nocturne"] h1{font-size:clamp(32px,6.4vw,42px)}
  body[data-theme="nocturne"] .diversity h1{font-size:clamp(30px,6vw,39px)}
  body[data-theme="nocturne"] .description{font-size:11px;margin-top:17px}
  body[data-theme="nocturne"] .bottom{left:5.7%;right:5.7%;gap:20px}
  body[data-theme="nocturne"] .timeline{gap:8px}
  body[data-theme="nocturne"] .timeline button{font-size:7px}
  body[data-theme="nocturne"] .scroll-instruction{font-size:8px}
  body[data-theme="nocturne"] .crystal-record{top:73%}
  body[data-theme="nocturne"] .crystal-record>a{font-size:18px}
  body[data-theme="nocturne"] .crystal-record>span{font-size:6px;letter-spacing:.05em}
  body[data-theme="nocturne"] .crystal-record>small,body[data-theme="nocturne"] .crystal-record .scroll-guests{font-size:7px}
  body[data-theme="nocturne"] .finale h1{font-size:clamp(40px,7.6vw,49px)}
}
@media(max-width:480px){
  body[data-theme="nocturne"] header{padding-top:23px}
  body[data-theme="nocturne"] .brand{font-size:15px}
  body[data-theme="nocturne"] nav{gap:12px;font-size:8px}
  body[data-theme="nocturne"] .chapter{top:14%;left:5%;right:5%}
  body[data-theme="nocturne"] .eyebrow{font-size:7px;letter-spacing:.16em;margin-bottom:17px}
  body[data-theme="nocturne"] .eyebrow::before,body[data-theme="nocturne"] .eyebrow::after{width:16px}
  body[data-theme="nocturne"] h1{font-size:32px;line-height:1.14;letter-spacing:-.012em}
  body[data-theme="nocturne"] .diversity h1{font-size:30px}
  body[data-theme="nocturne"] .description{font-size:10px;max-width:280px}
  body[data-theme="nocturne"] .bottom{bottom:42px;gap:14px;align-items:stretch;flex-direction:column}
  body[data-theme="nocturne"] .scroll-instruction{text-align:left;padding-bottom:0;font-size:8px}
  body[data-theme="nocturne"] .timeline{flex-wrap:nowrap;justify-content:space-between;gap:6px;padding-bottom:11px}
  body[data-theme="nocturne"] .timeline button{flex:0 1 auto;font-size:7px;padding:0}
  body[data-theme="nocturne"] .timeline button::before{font-size:6px;margin-bottom:8px}
  body[data-theme="nocturne"] .scene-caption{font-size:6px;letter-spacing:.1em}
  body[data-theme="nocturne"] .crystal-record{top:69%;left:65%;right:2%}
  body[data-theme="nocturne"] .crystal-record>a{font-size:14px}
  body[data-theme="nocturne"] .crystal-record>span{font-size:5px;letter-spacing:.025em}
  body[data-theme="nocturne"] .crystal-record>small,body[data-theme="nocturne"] .crystal-record .scroll-guests{font-size:6px}
  body[data-theme="nocturne"] .finale .chapter{top:34%}
  body[data-theme="nocturne"] .finale h1{font-size:40px}
  body[data-theme="nocturne"] .finale .description{font-size:18px}
  body[data-theme="nocturne"] .concept-note{font-size:6px;left:5.7%;right:5.7%;text-align:left;letter-spacing:0}
}