/* Cover geometry is mapped from the original yellow separation, not invented. */
@font-face{font-family:Book;src:url('assets/GoudyBookletter1911.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
/* v0.8: one approved yellow, matching unchanged v0.7 raster artwork. */
:root{--triorigami-yellow:#f5eca3;--ink:#000000;--paper:#ffffff}
*{box-sizing:border-box}
html{scroll-padding-top:1rem}
body{overflow-wrap:anywhere;margin:0;color:var(--ink);background:var(--paper);font:22px/1.48 Book,Georgia,serif}
a{color:inherit;text-decoration:underline;text-underline-offset:.18em}
a:hover{text-decoration-thickness:2px}
a:focus-visible{outline:3px solid var(--ink);outline-offset:5px}
img{display:block;max-width:100%;height:auto}
p{margin:0 0 1em}
h1,h2{font-weight:400;line-height:1.15}
h2{font-size:clamp(34px,5vw,48px);margin:0 0 1em}

.wrap{width:min(1120px,calc(100% - 40px));margin-inline:auto}
.reading{width:min(690px,calc(100% - 48px));margin-inline:auto}
.skip{position:absolute;top:-100px;left:12px;background:white;padding:10px;z-index:5}
.skip:focus{top:12px}
.cover{width:min(640px,100%);margin:4px auto 44px}
/* Coordinates relative to the source crop [660,30,1080,450]. */
.cover-art{position:relative;aspect-ratio:1;margin:0}
.cover-art::before{content:'';position:absolute;left:0;right:30%;top:58.333333%;height:38.809524%;background:var(--triorigami-yellow);border-radius:0 16.33% 16.33% 0 / 0 29.45% 29.45% 0}
.yellow-stem{position:absolute;left:6.904762%;top:7.142857%;width:27.619048%;height:51.190476%;background:var(--triorigami-yellow);border-radius:42% 42% 0 0 / 22.7% 22.7% 0 0}
.white-return{position:absolute;left:6.904762%;top:58.333333%;width:27.619048%;height:31.666667%;background:white;border-radius:0 0 42% 42% / 0 0 36.6% 36.6%}
.cover-art img{position:relative;width:100%;z-index:1}
.byline{position:relative;background:var(--triorigami-yellow);border-radius:48px 0 0 0;width:89%;margin:34px 0 0 auto;padding:22px 28px 68px;text-align:right;font-size:clamp(28px,5vw,42px);line-height:1.1}
.byline::after{content:'';position:absolute;right:0;bottom:0;width:44%;height:44px;background:white;border-radius:48px 0 0 0}



.spread{margin:64px auto 80px}
.spread img{width:100%}


.introduction{padding:48px 0 12px}
.introduction h2{margin-bottom:32px}
.introduction p{margin-bottom:1.25em}

.ending{width:100%;margin:34px auto 70px}



.purchase p{margin-bottom:.7em}
.purchase h2{margin-bottom:24px}
footer{padding:40px 0;font-size:19px;text-align:center}
footer p{margin:0}

/* v0.6: native source units; positioning/cropping only, no scaling.
   A connected column uses the original rotated path at its foot, its original
   rounded cap at its head, and a repeated one-unit slice of its straight run.
   Overlapping joins lie inside the straight original contour. */
.composition{position:relative;isolation:isolate;overflow:clip}
.composition::before{content:'';position:absolute;z-index:-1;pointer-events:none;
  width:744.485916px;height:163.489318px;
  background:url('assets/cover-yellow-section.svg') no-repeat;
  background-size:744.485916px 163.489318px}
.values-composition{padding:68px 0 76px;margin:32px 0 64px;min-height:420px}
.values-composition::before{top:112px;left:calc(50% - 372px);transform:rotate(180deg)}
.book-values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;
  width:min(980px,calc(100% - 56px));margin:auto;padding:24px 0 38px}
.book-values h2{font-size:30px;margin:0 0 .5em}
.book-values p{font-size:21px;margin:0}
.intro-composition{margin:64px 0 72px;padding:40px 0 24px}
.intro-composition::before{display:none}
.yellow-flow{position:absolute;z-index:-1;pointer-events:none;top:16px;bottom:24px;
  left:calc(50% - 354px);width:163.489318px;min-height:744.485916px}
.yellow-flow::before{content:'';position:absolute;inset:0;
  background:url('assets/cover-yellow-top.svg') left top / 163.489318px 100px no-repeat,
  url('assets/cover-yellow-vertical.svg') left bottom / 163.489318px 744.485916px no-repeat}
.yellow-flow::after{content:'';position:absolute;top:99px;bottom:644px;left:0;width:163.489318px;
  background:url('assets/cover-yellow-run.svg') left top / 163.489318px 1px repeat-y}
.introduction{position:relative}
.details-composition{padding:76px 0 80px;margin:72px 0 48px;min-height:410px}
.details-composition::before{top:96px;left:calc(50% - 236px);transform:rotate(180deg)}
.purchase{position:relative;width:min(690px,calc(100% - 48px));margin:auto;padding:28px 0 0}
/* A single component is repeated verbatim. Four columns, never four buttons. */
.menu-shell{container-type:inline-size;width:min(900px,calc(100% - 24px));margin-inline:auto}
.navigation{display:grid;grid-template-columns:1fr 1.12fr 1fr 1.42fr;gap:0;
  margin:18px 0;border-top:1px solid #000;border-bottom:1px solid #000;
  background:#fff;font-size:clamp(12px,5cqi,21px);line-height:1.2}
.navigation a{display:flex;justify-content:center;align-items:center;text-align:center;
  padding:12px 4px;min-height:48px;min-width:0;white-space:nowrap;overflow-wrap:normal;
  text-decoration:none;position:relative}
.navigation a+a::before{content:'';position:absolute;left:0;top:25%;height:50%;border-left:1px solid #000}
.navigation a:hover{background:var(--triorigami-yellow);text-decoration:underline}
.navigation a:focus-visible{outline:3px solid #000;outline-offset:-4px;text-decoration:underline}
.interlude{margin-top:12px;margin-bottom:64px}
.closing-menu{margin-top:0}
@container(max-width:270px){
  .navigation{font-size:12px;grid-template-columns:1fr 1.08fr 1.16fr 1.3fr}
  .navigation a{white-space:normal;padding:12px 1px}
}
@media(max-width:760px){
  .book-values{grid-template-columns:1fr;gap:30px;width:min(490px,calc(100% - 48px));padding:12px 0 26px}
  .values-composition{padding:48px 0 64px;min-height:780px;margin-bottom:48px}
  .values-composition::before{width:163.489318px;height:744.485916px;top:16px;
    left:calc(50% - 156px);transform:none;
    background-image:url('assets/cover-yellow-vertical.svg');background-size:163.489318px 744.485916px}
  .intro-composition{margin-block:48px;padding-top:32px}
  .yellow-flow{left:-30px}
  .details-composition::before{left:calc(50% - 140px);top:18px}

}
@media(max-width:600px){
  body{font-size:21px}.wrap{width:calc(100% - 28px)}.reading{width:calc(100% - 40px)}
  .cover{margin-top:0;margin-bottom:32px}
  .byline{margin-top:16px;padding:18px 24px 50px;border-radius:36px 0 0 0}
  .byline::after{height:32px;border-radius:36px 0 0 0}
  .spread{margin:44px auto 56px}.introduction{padding-top:30px}
  .interlude{margin-bottom:44px}.details-composition{padding-bottom:28px}
}

@container(max-width:190px){
  .navigation{font-size:11px;grid-template-columns:.73fr .88fr 1.36fr 1.36fr}
  .navigation a{padding-inline:0}
}
/* v0.7 approved raster artwork: unchanged bytes and proportional scaling. */
.cover{position:relative;width:min(640px,100%);aspect-ratio:1440/2250;margin:4px auto 32px;background:url('assets/backgrounds/yellow-01.png') center top/100% auto no-repeat}
.cover-art{position:absolute;inset:0;aspect-ratio:auto}
.cover-art::before,.yellow-stem,.white-return,.byline::after{display:none}
.cover-art img,.byline{position:absolute;width:1px;height:1px;padding:0;margin:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.composition::before{display:none}
.values-composition{padding:0;margin:0;min-height:0}
.book-values{display:block;width:100%;padding:0}
.value-art{display:flex;align-items:center;min-height:55.555556vw;background-position:center;background-size:100% auto;background-repeat:no-repeat;padding:48px 0}
.value-text{width:min(980px,calc(100% - 48px));margin:auto}
.book-values h2{font-size:clamp(34px,5vw,48px);margin-bottom:.5em}
.book-values p{font-size:21px}
.useful-art{background-image:url('assets/backgrounds/yellow-02.png')}
.diagrams-art{background-image:url('assets/backgrounds/yellow-03.png')}
.insight-art{background-image:url('assets/backgrounds/yellow-04.png')}
#contents{margin-top:20px;margin-bottom:20px}
.intro-composition{position:relative;margin:20px 0 0;padding:48px 0 40px;min-height:calc(277.777778vw + 2px);background:url('assets/backgrounds/yellow-05-1.png') center top/100% auto no-repeat,url('assets/backgrounds/yellow-05-3.png') center bottom/100% auto no-repeat}
/* v1.1.1: vertical percentage margins resolve against the containing width,
   matching the 100%-wide end artwork even with landscape safe-area insets. */
.yellow-flow{top:0;bottom:0;margin-top:calc(138.888889% - 1px);margin-bottom:calc(138.888889% - 1px);left:0;width:100%;min-height:0;z-index:-1;background:url('assets/backgrounds/yellow-05-2.png') center top/100% 1px repeat-y}
.yellow-flow::before,.yellow-flow::after{display:none}
.introduction{padding:0}
.ending{margin:34px auto 70px}
.details-composition{display:flex;align-items:center;min-height:55.555556vw;padding:48px 0;margin:32px 0 24px;background:url('assets/backgrounds/yellow-06.png') center/100% auto no-repeat}
.purchase{padding:0}
@media(max-width:760px){
 .cover{background-image:url('assets/backgrounds/yellow-01-390.png');aspect-ratio:390/609}
 .book-values{width:100%;padding:0}
 .value-art{min-height:calc(100vw * 217 / 390);padding:24px 0}
 .useful-art{background-image:url('assets/backgrounds/yellow-02-390.png')}
 .diagrams-art{background-image:url('assets/backgrounds/yellow-03-390.png')}
 .insight-art{background-image:url('assets/backgrounds/yellow-04-390.png')}
 .intro-composition{margin-top:20px;padding:32px 0 32px;min-height:calc(100vw * 1084 / 390 + 2px);background-image:url('assets/backgrounds/yellow-05-1-390.png'),url('assets/backgrounds/yellow-05-3-390.png')}
 .yellow-flow{left:0;margin-top:calc(100% * 542 / 390 - 1px);margin-bottom:calc(100% * 542 / 390 - 1px);background-image:url('assets/backgrounds/yellow-05-2-390.png')}
 .introduction{padding:0}
 .details-composition{min-height:calc(100vw * 217 / 390);padding:24px 0;background-image:url('assets/backgrounds/yellow-06-390.png')}
}

/* v1.1: native accessible text disclosures; original spread artwork is unchanged. */
.spread-figure{margin:0}
.spread,#contents{margin-bottom:2rem}
.spread+.spread{margin-top:0}
.spread-caption{margin:.25rem 0 0;color:#4a4a4a;font-size:.875rem;line-height:1.6;text-align:left}
.spread-disclosure>summary{display:block;width:fit-content;max-width:100%;list-style:none;cursor:pointer;text-decoration:underline;text-underline-offset:.18em}
.spread-disclosure>summary::-webkit-details-marker{display:none}
.spread-disclosure>summary::marker{content:''}
.spread-disclosure>summary:hover{text-decoration-thickness:2px}
.spread-disclosure>summary:focus-visible{outline:3px solid var(--ink);outline-offset:5px}
.spread-transcription{max-width:72ch;margin:.5rem 0 0}
.spread-transcription p{margin:0 0 .8em}
.spread-transcription p:last-child{margin-bottom:0}
.spread-transcription .companion-label{font-weight:400;margin-bottom:.5em}