/* One reference space: 2160 x 1215. Art keeps its own aspect ratio. */
:root {
  --view-unit: min(.0462963vw, .0823045svh);
  --ui-small: max(11px, calc(13 * var(--view-unit)));
  --ui-body: max(13px, calc(17 * var(--view-unit)));
  --ui-title: max(28px, calc(60 * var(--view-unit)));
}
/* The book is sized by its height, not by a desktop pixel ceiling. */
#gravityBook { --book-height: min(67svh, 54.216867vw); --book-px: calc(var(--book-height) / 848); }
#gravityBook .grimoire-room { min-height:100svh; height:100svh; grid-template-rows:4svh 1fr 2svh; }
#gravityBook .grimoire-desk { position:absolute; inset:0; min-height:0; padding:4svh 0 0; }
#gravityBook .grimoire-header { grid-row:1; position:relative; inset:auto; height:auto; }
#gravityBook .grimoire-footer { grid-row:3; position:relative; bottom:auto; }
.grimoire-label { display:block; }
#gravityBook .grimoire-stage { width:calc(var(--book-height) * 1.66); min-width:0; aspect-ratio:1.66; perspective:calc(2100 * var(--book-px)); }
.grimoire-actions { position:relative; left:auto; bottom:auto; width:auto; height:6svh; gap:.5svh; flex-shrink:0; }
.grimoire-header,#gravityBook .grimoire-footer { padding-inline:1.65vw; }
.grimoire-label { font-size:max(11px,calc(15 * var(--view-unit))); }
#gravityBook .grimoire-exit { font-size:max(11px,calc(12 * var(--view-unit))); }
.grimoire-index { font-size:max(8px,calc(10 * var(--view-unit))); }
.grimoire-contents,.grimoire-leaf-front { padding:11% 12% 9%; }
.grimoire-contents-head h2 { font-size:calc(42 * var(--book-px)); margin:1% 0 .7%; }
.grimoire-contents-head>span { font-size:max(7px,calc(8 * var(--book-px))); }
.grimoire-chapter-title { font-size:calc(31 * var(--book-px)); }
.grimoire-chapters { margin-top:5%; }
.grimoire-chapters p { font-size:max(9px,calc(11 * var(--book-px))); padding-left:calc(44.95 * var(--book-px)); margin-top:calc(7 * var(--book-px)); }
#gravityBook .grimoire-chapter-enter { font-size:max(11px,calc(15 * var(--book-px))); min-width:calc(78 * var(--book-px)); padding-inline:calc(14 * var(--book-px)); }
.grimoire-cover-title { font-size:calc(72 * var(--book-px)); }
.grimoire-cover-subtitle { font-size:calc(21 * var(--book-px)); }
.grimoire-cover-english,.grimoire-folio { font-size:max(7px,calc(10 * var(--book-px))); }
.grimoire-frontispiece-title { font-size:calc(46 * var(--book-px)); }
.grimoire-frontispiece-subtitle { font-size:calc(14 * var(--book-px)); }
.grimoire-frontispiece-top,.grimoire-frontispiece-english { font-size:max(7px,calc(9 * var(--book-px))); }
.grimoire-chapter-page-title { font-size:calc(39 * var(--book-px)); }
.grimoire-chapter-page-english { font-size:max(9px,calc(11 * var(--book-px))); }
#gravityBook .grimoire-turn { font-size:max(12px,calc(15 * var(--view-unit))); padding:.8svh 1vw; }
.grimoire-instruction { font-size:max(8px,calc(10 * var(--view-unit))); }
.grimoire-space-titlegroup { width:80%; }
.grimoire-space-titlegroup h2 { font-size:max(28px,calc(68 * var(--view-unit))); }
#gravityBook .grimoire-space-rune .grimoire-rune { width:max(40px,calc(58 * var(--view-unit))); height:auto; margin:3.1svh auto 2.3svh; }
.grimoire-space-english { font-size:var(--ui-small); }
.grimoire-space-number { font-size:max(9px,calc(10 * var(--view-unit))); }
.echo-choice h1 { font-size:max(54px,calc(125 * var(--view-unit))); }
.echo-choice h1 span { font-size:max(22px,calc(34 * var(--view-unit))); margin-top:1.8svh; }
.echo-choice p { font-size:var(--ui-body); }
.echo-actions { gap:1.15svh; }
.echo-actions button { font-size:var(--ui-body); padding:1.25svh 2svh; min-height:44px; }
.echo-top { font-size:var(--ui-small); }
/* Full-screen images and their annotations use the same undistorted board. */
.realm-artframe { width:max(100vw,177.684svh); height:auto; aspect-ratio:1672/941; top:50%; }
.realm-callout strong { font-size:1.58cqw; }
.realm-callout em { font-size:.79cqw; }
.realm-artframe,.olympus-artboard { container-type:inline-size; }
.olympus-callout strong { font-size:1.1cqw; }
.olympus-callout small,.olympus-callout em { font-size:.65cqw; }
.olympus-callout.is-principal strong { font-size:1.8cqw; }
.olympus-callout.is-principal small,.olympus-callout.is-principal em { font-size:.85cqw; }
.asgard-tour-copy { width:36.2svh; bottom:8.2svh; }
.asgard-tour-copy h2 { font-size:var(--ui-title); margin:1.3svh 0 .8svh; }
.asgard-tour-copy>p { font-size:max(15px,calc(22 * var(--view-unit))); margin:1.5svh 0 .65svh; }
.asgard-tour-copy>em,.tour-kicker,.tour-count,.tour-source { font-size:var(--ui-small); }
.asgard-tour-top { top:2svh; }
#gravityBook .asgard-tour button,#gravityBook .throne-controls button,#gravityBook .olympus-prologue .throne-controls button { font-size:var(--ui-body); min-height:44px; }
.asgard-tour-nav { bottom:2.15svh; gap:1.8svh; padding-top:1svh; }
#gravityBook .asgard-tour-nav>.tour-prev,#gravityBook .asgard-tour-nav>.tour-next { font-size:max(20px,calc(24 * var(--view-unit))); width:max(44px,calc(46 * var(--view-unit))); padding:.82svh 0; }
#gravityBook .tour-dots button { width:max(20px,calc(26 * var(--view-unit))); }
.tour-dots { gap:max(4px,calc(12 * var(--view-unit))); }
.family-caption h2,.asgard-caption strong,.olympus-inheritance-caption strong { font-size:max(28px,calc(48 * var(--view-unit))); }
.family-caption p,.olympus-inheritance-caption p { font-size:max(16px,calc(24 * var(--view-unit))); }
.prologue-loading>span { font-size:max(23px,calc(44 * var(--view-unit))); }
.prologue-loading small { font-size:var(--ui-small); }
@media(orientation:landscape) {
  /* Keep the complete court and its labels visible, including on ultrawide screens. */
  .throne-tableau { inset:auto; left:50%; top:50%; width:min(100vw,177.7778svh); aspect-ratio:16/9; transform:translate(-50%,-50%); container-type:inline-size; }
  .throne-hall,.throne-sovereign { background-size:100% 100%; background-position:center; }
  .throne-subject { width:var(--figure); left:var(--x); top:var(--y); }
  .throne-principal span { font-size:1.85cqw; }
  .throne-principal small { font-size:.7cqw; }
  .throne-judo span { font-size:3.3cqw; }.throne-judo small { font-size:1.02cqw; }
  .throne-sport { font-size:1.07cqw; }
  .throne-subject[data-tier='1'] .throne-sport { font-size:1.39cqw; }
  .throne-subject[data-tier='2'] .throne-sport { font-size:1.3cqw; }
  .throne-subject[data-tier='6'] .throne-sport { font-size:.88cqw; }
  .header { height:8.23svh; }
  body>main { min-height:calc(100svh - 13.33svh); }
  body>footer { height:5.1svh; }
  .brand>span { font-size:calc(23 * var(--view-unit)); }.brand svg { width:3.05svh; height:3.05svh; }
  .brand small,.nav-link,.eyebrow,.intro,.map-help,.chapter-caption,.destination-number,.destination small,.hint,body>footer,.text-action { font-size:var(--ui-small); }
  .hero { padding:5.76svh 0 2.88svh; }.hero h1 { font-size:calc(65 * var(--view-unit)); margin:2svh 0 1.65svh; }
  .hero .intro { font-size:max(12px,calc(16 * var(--view-unit))); }
  .hero-actions { margin-top:2.8svh; gap:1.65svh; }.primary { padding:1.4svh 1.65svh; font-size:var(--ui-small); }
  .chapter-caption { margin-top:2.47svh; }.map-help { padding-bottom:1.65svh; }
  .destination { min-height:8.06svh; padding:1.65svh 2.05svh; gap:1.48svh; }.destination strong { font-size:max(14px,calc(18 * var(--view-unit))); }
  .destination svg { width:3.13svh; height:3.13svh; }
  .header nav { gap:3.13svh; }.utilities { gap:1.73svh; }
  .planet-label strong { font-size:max(11px,calc(13 * var(--view-unit))); }.planet-label small,.moon-label { font-size:var(--ui-small); }
  .satellite-launch { top:10.4svh; font-size:var(--ui-small); }
  .satellite-panel { top:10.7svh; width:20.6svh; padding:1.9svh 1.8svh; }
  .satellite-panel h2 { font-size:calc(19 * var(--view-unit)); }.satellite-panel nav button,#satelliteList strong { font-size:var(--ui-small); }
  .planet-detail,.moon-detail,.sun-detail { bottom:9svh; max-width:25svh; }
  .planet-detail h2,.moon-detail h2,.sun-detail h2 { font-size:var(--ui-title); }
  .planet-detail p,.moon-detail p,.sun-detail p { font-size:var(--ui-small); }
  .education-heading h2,.journey-title h2,.chapter-copy h1 { font-size:var(--ui-title); }
  .education-heading p,.journey-title p,.chapter-intro,.chapter-line { font-size:var(--ui-body); }
  .education-node { min-width:17.7svh; padding:1.4svh 1.8svh; }.education-node>strong { font-size:max(16px,calc(21 * var(--view-unit))); }
  .education-node>small,.education-node>span,.education-bottom p,.chapter-place,.chapter-top,.rank-note { font-size:var(--ui-small); }
  .chapter-copy { padding-top:8.23svh; min-height:calc(100svh - 16.46svh); }
  .chapter-english { font-size:max(15px,calc(23 * var(--view-unit))); }
  .degree-block { max-width:42svh; margin:3.45svh 0 2.47svh; }.degree-block h2 { max-width:none; font-size:max(19px,calc(28 * var(--view-unit))); }
  .chapter-intro { max-width:33svh; }.chapter-navigation { padding:1.8svh 0; }.chapter-navigation>a { font-size:var(--ui-body); }
  .campus-collage { height:100%; min-height:100%; }
  .arrival-card { width:28svh; }.arrival-card h3 { font-size:max(22px,calc(29 * var(--view-unit))); }.arrival-card p { font-size:var(--ui-small); }
}
@media(orientation:portrait) {
  :root { --view-unit:.2564103vw; }
  #gravityBook { --book-height:min(67svh,116.4557vw); --book-px:calc(var(--book-height) / 650); }
  #gravityBook .grimoire-stage { width:calc(var(--book-height) * .79); aspect-ratio:.79; }
  .grimoire-volume { left:0; width:100%; transform:rotateY(-10deg) rotateZ(-2deg); }
  #gravityBook.is-open .grimoire-volume { transform:none; }
  #gravityBook.is-open .grimoire-cover { transform:rotateY(-170deg); }
  #gravityBook[data-page='contents'] .grimoire-cover { visibility:hidden; }
  .grimoire-header { padding-inline:5%; }.grimoire-index { display:none; }
  .grimoire-label { position:static; transform:none; font-size:3vw; }
  #gravityBook .grimoire-room { grid-template-rows:8svh 1fr 3svh; }
  .grimoire-chapter-title { font-size:calc(var(--book-height) * .05135); }
  .grimoire-contents { padding:12% 9% 8%; }
  .grimoire-chapters p { font-size:calc(var(--book-height) * .02212); padding-left:calc(var(--book-height) * .06932); }
  .grimoire-contents-head h2 { font-size:calc(var(--book-height) * .07308); }
  #gravityBook .grimoire-chapter-enter { font-size:calc(var(--book-height) * .02607); }
  .grimoire-space-titlegroup h2 { font-size:8vw; }.grimoire-space-english { font-size:3vw; }
  .realm-artframe,.asgard-tour .realm-artframe { width:100vw; height:auto; top:34%; }
  .realm-callout strong { font-size:2.8cqw; }.realm-callout em { font-size:1.7cqw; }
  .asgard-tour-copy { width:86%; left:7%; bottom:13svh; }.asgard-tour-copy h2 { font-size:8vw; }.asgard-tour-copy>p { font-size:4vw; }
  .asgard-tour-copy>em,.tour-kicker,.tour-count,.tour-source { font-size:2.6vw; }
  .asgard-tour-nav { bottom:3svh; }.asgard-tour-top>span { display:none; }
  .olympus-prologue .olympus-artboard,.olympus-prologue .olympus-inheritance .olympus-artboard { width:100vw; top:42%; transform:translate(-50%,-50%); }
  .olympus-callout strong { font-size:2.6cqw; }.olympus-callout small,.olympus-callout em { font-size:1.7cqw; }
  .olympus-callout.is-principal strong { font-size:3.6cqw; }.olympus-callout.is-principal small,.olympus-callout.is-principal em { font-size:1.8cqw; }
  .olympus-callout:not(.is-principal),.olympus-connector:not(.is-principal) { display:block; }.olympus-mobile-cast { display:none; }
  .throne-subject { width:5.9vw; }.throne-subject[data-tier='1'] { width:14.35vw; }.throne-subject[data-tier='2'] { width:11vw; }.throne-subject[data-tier='3'] { width:9vw; }.throne-subject[data-tier='4'] { width:7.7vw; }.throne-subject[data-tier='5'] { width:6.7vw; }
  .echo-choice h1 { font-size:18vw; }.echo-choice h1 span { font-size:6.2vw; }.echo-choice p { font-size:3.4vw; }
  .echo-actions { flex-direction:column; width:74%; max-width:none; }.echo-actions button { font-size:3.6vw; width:100%; }
  .education-node { min-width:38vw; max-width:42vw; padding:3vw; }.education-node>strong { font-size:3.85vw; }
  .education-node>small,.education-node>span { font-size:2.6vw; }
  .hero h1 { font-size:9.2vw; }.hero .intro { font-size:3.6vw; }.destination strong { font-size:3.85vw; }.destination small { font-size:2.8vw; }
  .header { height:10.5svh; }.hero { padding-bottom:2.8svh; }.hero-actions { margin-top:2.4svh; }.destination { min-height:10.7svh; }
  body>main { min-height:calc(100svh - 17svh); padding-top:34svh; }body>footer { height:6.5svh; }
  .chart-mode main { padding-top:calc(100svh - 36svh); }
  .campus-collage { height:71svh; min-height:0; }.chapter-copy { padding-top:36svh; padding-bottom:17svh; }.chapter-copy h1 { font-size:9vw; }.degree-block h2 { font-size:5.1vw; }
  .chapter-english,.chapter-line { font-size:4.1vw; }.chapter-intro { font-size:3.2vw; }.chapter-place { font-size:2.3vw; }
}
@media(orientation:landscape) and (max-height:550px) {
  #gravityBook { --book-height:min(80svh,54.216867vw); }
  .grimoire-chapter-title { font-size:max(14px,calc(31 * var(--book-px))); }
  .grimoire-contents-head h2 { font-size:max(20px,calc(42 * var(--book-px))); }
  .grimoire-contents { padding:7% 10% 4%; }.grimoire-chapters { margin-top:2%; }
  .grimoire-chapter-bottom { min-height:24px; }#gravityBook .grimoire-chapter-enter { min-height:24px; }
  .grimoire-instruction { display:none; }.grimoire-actions { height:6svh; }
  .asgard-tour-copy { bottom:15svh; width:40%; }.asgard-tour-copy h2 { font-size:6svh; }.asgard-tour-copy>p { font-size:3svh; line-height:1.4; }
  .asgard-tour-copy>em,.tour-kicker,.tour-source { font-size:2svh; }
}
