/* ZT Formom is bundled locally so the archive remains portable and offline-safe. */
@font-face{
  font-family:"ZT Formom";
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("assets/fonts/zt-formom-400.woff") format("woff");
}

/* Modern editorial sans-serif system: display, reading, and archive metadata. */
:root{
  --font-display:"Barlow Condensed","Arial Narrow","Segoe UI",Arial,sans-serif;
  --font-editorial-title:"ZT Formom","Cormorant Garamond",Georgia,serif;
  --font-body:"IBM Plex Sans","Segoe UI",Arial,sans-serif;
  --font-meta:"IBM Plex Mono","Cascadia Mono",Consolas,monospace;
  --ledger-display:var(--font-display);
  --ledger-mono:var(--font-meta);
}

html,body{font-family:var(--font-body);font-kerning:normal;text-rendering:optimizeLegibility}
body{font-size:17px;line-height:1.72;letter-spacing:-.008em}
p,li,blockquote,small,footer{font-family:var(--font-body)}

h1,h2,h3,.brand,.home-rail>a span,.home-rail__mark span{
  font-family:var(--font-display)!important;
  font-feature-settings:"ss01" 1,"ss02" 1;
}
h1,h2,h3{font-weight:400;letter-spacing:.0225em}
h1{line-height:.98}
h2,h3{line-height:1.06}

/* Every component that renders through the Barlow Condensed display token uses Regular with 1.5x tracking. */
.brand,
.home-rail>a span,
.home-rail__mark span,
.ledger-hero h1,
.recent-archive__head>span,
.recent-file h2,
.world-atlas h3,
.people-ledger__number,
.people-ledger h3,
.people-ledger p,
.character-portrait span,
.chronicle-ledger>p strong,
.chronicle-ledger h3,
.chronicle-rail__viewport h3,
.profile-card h2,
.timeline-entry h2,
.world-list h2,
.archive-grid h3,
.story-header h1,
.detail-page h1,
.detail-page blockquote{
  font-weight:400!important;
  letter-spacing:.0225em!important;
}

.brand{
  font-size:18px;
  font-weight:400;
  letter-spacing:.0225em;
}
.home-rail>a span,.home-rail__mark span{font-weight:400;letter-spacing:.0225em}

nav a,.eyebrow,.scroll-prompt,.ledger-button,.back,.world-list__arrow,
.recent-file>p,.recent-file>span,.world-atlas span,.chronicle-ledger span,
.timeline-entry>span,.timeline-date,.world-list>article>span,.archive-grid>article>span,
.character-card__role,.people-ledger article>span,.profile-card>span,.tag-links a,
.story-image small{
  font-family:var(--font-meta)!important;
  font-variant-numeric:tabular-nums;
}

nav a{font-size:10px;letter-spacing:.095em;font-weight:500}
.eyebrow{font-size:10px!important;letter-spacing:.18em!important;font-weight:600!important}
.ledger-button,.back,.world-list__arrow,.tag-links a{font-weight:500}
.character-card__role,.people-ledger article>span,.profile-card>span{
  font-size:clamp(11px,.86vw,13px)!important;
  line-height:1.35!important;
  letter-spacing:.045em!important;
}

/* One consistent archival voice for every IBM Plex Mono label. */
nav a,.home-rail>a,.eyebrow,.scroll-prompt,.ledger-button,.back,.world-list__arrow,
.recent-file>p,.recent-file>span,.world-atlas span,.world-atlas__tile small,
.chronicle-ledger span,.chronicle-ledger>p,.timeline-entry>span,.timeline-date,
.world-list>article>span,.archive-grid>article>span,.character-card__role,
.people-ledger article>span,.profile-card>span,.tag-links a,.story-image small{
  font-weight:500!important;
  letter-spacing:1px!important;
}

.ledger-hero h1{
  font-size:clamp(58px,7.3vw,106px);
  line-height:.84;
  letter-spacing:-.065em;
}
.ledger-hero .hero-archive-title{
  width:max-content;
  max-width:calc(100vw - 12vw);
  margin:0;
  color:var(--ledger-cream);
  font-family:var(--font-editorial-title)!important;
  font-size:clamp(78px,8.64vw,136px);
  font-weight:400;
  line-height:.8;
  letter-spacing:-.035em!important;
  text-transform:uppercase;
  white-space:nowrap;
}
.ledger-hero__copy--archive{
  position:absolute;
  inset:0;
  width:100%;
  max-width:none;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}
.ledger-hero__copy--archive .hero-credit{
  position:absolute;
  top:calc(50% + clamp(78px,7vw,106px));
  left:50%;
  margin:0;
  color:#d7d0c3;
  font-family:var(--font-body);
  font-size:clamp(11px,1vw,14px);
  font-weight:400;
  line-height:1.4;
  letter-spacing:.04em;
  white-space:nowrap;
  transform:translateX(-50%);
}
.ledger-hero__copy>p:not(.eyebrow){font-family:var(--font-body);font-size:18px;line-height:1.62;letter-spacing:-.015em}
.ledger-floor__copy h2{font-size:clamp(42px,4.4vw,64px);line-height:.92;letter-spacing:-.025em;font-weight:500}
.ledger-floor__copy h2,
.floor-watermark,
.page-head h1{
  font-family:var(--font-editorial-title)!important;
  font-optical-sizing:auto;
  font-weight:500;
  letter-spacing:.018em!important;
}
.ledger-floor__copy h2{line-height:.9}
.floor-watermark{
  position:absolute!important;
  z-index:0!important;
  top:clamp(102px,12vh,142px);
  left:max(5.6vw,62px);
  margin:0;
  max-width:calc(100vw - 150px);
  color:rgba(255,255,255,.2);
  font-family:var(--font-editorial-title)!important;
  font-size:clamp(98px,10.8vw,170px);
  font-weight:500;
  line-height:.8;
  letter-spacing:-.035em;
  text-transform:uppercase;
  white-space:nowrap;
  pointer-events:none;
  user-select:none;
  opacity:0;
  transform:translate3d(0,14px,0);
  transition:opacity 1.05s ease,transform 1.25s cubic-bezier(.2,.78,.24,1);
  will-change:opacity,transform;
}
.floor-watermark span{font-weight:500;color:rgba(255,255,255,.3)}
.ledger-floor--people .floor-watermark{color:rgba(255,255,255,.2)}
.ledger-floor--people .floor-watermark span{color:rgba(255,255,255,.3)}
.ledger-floor--people .floor-watermark,.ledger-floor--timeline .floor-watermark{top:clamp(72px,8.5vh,104px)}
body.home-mode .ledger-floor[data-ui-stage="entered"] .floor-watermark{opacity:.82;transform:translate3d(0,0,0)}
body.home-mode .ledger-floor[data-ui-stage="leaving"] .floor-watermark{opacity:.1;transform:translate3d(0,-10px,0)}
.ledger-floor__copy,.world-atlas,.people-ledger,.chronicle-ledger,.ledger-floor__directory-link{position:relative;z-index:2!important}
.ledger-floor__copy p:not(.eyebrow){font-family:var(--font-body);font-size:16px;line-height:1.65}

.recent-file h2{font-size:clamp(20px,1.75vw,25px);line-height:1.04;letter-spacing:-.045em}
.recent-file small{font-family:var(--font-body);font-size:13px;line-height:1.48;letter-spacing:-.01em}
.world-atlas h3,.chronicle-rail__viewport h3{letter-spacing:-.045em}
.world-atlas p{font-family:var(--font-body);font-size:14px;line-height:1.48}

.page-head h1{font-size:clamp(54px,6.5vw,82px);line-height:.92;font-weight:500}
.page-head>p:last-child{font-family:var(--font-body);font-size:clamp(15px,1.35vw,18px);line-height:1.68}
.story-header h1,.detail-page h1{font-size:clamp(42px,4.8vw,60px);line-height:.98;letter-spacing:-.055em}
.story-header>p:last-child,.story-body,.detail-page>p:not(.back):not(.eyebrow){font-family:var(--font-body);letter-spacing:-.012em}
.detail-page blockquote{font-family:var(--font-display);font-weight:400;letter-spacing:.0225em;line-height:1.46}

.timeline-entry h2,.world-list h2,.profile-card h2,.archive-grid h3{
  letter-spacing:-.045em;
}
.timeline-entry p,.world-list p,.archive-grid p,.note-placeholder{font-family:var(--font-body)}
.people-ledger h3,.profile-card h2{line-height:1.02}

@media(max-width:900px){
  .ledger-hero .hero-archive-title{font-size:clamp(56px,10.56vw,78px)}
  .floor-watermark{top:92px;left:22px;max-width:calc(100vw - 96px);font-size:clamp(70px,13.2vw,98px);line-height:.82;white-space:normal}
  .ledger-floor--people .floor-watermark,.ledger-floor--timeline .floor-watermark{top:66px}
}

@media(max-width:700px){
  body{font-size:16px;line-height:1.68}
  .brand{font-size:15px}
  nav a{font-size:9px;letter-spacing:1px}
  .ledger-hero .hero-archive-title{max-width:calc(100vw - 36px);font-size:clamp(46px,14.4vw,66px);line-height:.82;white-space:normal}
  .ledger-hero__copy--archive .hero-credit{top:calc(50% + 64px);max-width:calc(100vw - 44px);white-space:normal;text-align:center}
  .floor-watermark{top:82px;left:18px;max-width:calc(100vw - 72px);font-size:clamp(58px,18vw,82px);line-height:.82;white-space:normal}
  .ledger-floor--people .floor-watermark,.ledger-floor--timeline .floor-watermark{top:58px}
  .page-head h1{font-size:clamp(43px,12vw,60px)}
  .story-header h1,.detail-page h1{font-size:clamp(37px,10.5vw,50px)}
}
