@font-face{font-family:'Instrument Serif';src:url('assets/fonts/InstrumentSerif-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'Instrument Serif';src:url('assets/fonts/InstrumentSerif-Italic.ttf') format('truetype');font-style:italic;font-weight:400;font-display:swap}
@font-face{font-family:Barlow;src:url('assets/fonts/Barlow-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Barlow;src:url('assets/fonts/Barlow-Medium.ttf') format('truetype');font-style:normal;font-weight:500;font-display:swap}
@font-face{font-family:'Book Pronunciation';src:url('assets/fonts/NotoSerif-Pronunciation.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
:root{
  --ink:#1A1F35;--paper:#FAF7F0;--stone:#D8CFC1;--bayou:#2C7A7B;--rust:#9B4829;--live-blue:#285FF4;
  --background:var(--paper);--text:var(--ink);--secondary:color-mix(in srgb,var(--ink) 78%,var(--paper));--muted:color-mix(in srgb,var(--ink) 72%,var(--paper));--accent:var(--bayou);--accent-bg:color-mix(in srgb,var(--bayou) 9%,var(--paper));--border:var(--stone);--shadow:color-mix(in srgb,var(--ink) 20%,transparent);
  --serif:'Instrument Serif',Georgia,serif;--sans:Barlow,Arial,sans-serif;--mono:var(--sans);
  --phonetic:'Book Pronunciation',Georgia,serif;
  --book-title-size:clamp(2.625rem,4.8vw,4.25rem);--book-lead-size:clamp(1.875rem,3.1vw,2.625rem);
  --book-body-size:1.125rem;--book-passage-size:1.1875rem;--book-metadata-size:.9375rem;--book-reading-measure:55ch;
  --space-close:.75rem;--space-related:1.25rem;--space-group:2rem;--space-section:3.5rem;
  --ease:cubic-bezier(.16,1,.3,1);--preview-height:99px;--release-height:56px;
  --photo-filter:saturate(.88) contrast(1.04) brightness(1);
  --tone-top:color-mix(in srgb,var(--ink) 76%,transparent);--tone-top-end:37%;
  --tone-mid:transparent;--tone-mid-start:70%;--tone-bottom:color-mix(in srgb,var(--ink) 47%,transparent);
  --tone-left:color-mix(in srgb,var(--ink) 78%,transparent);--tone-left-middle:color-mix(in srgb,var(--ink) 32%,transparent);--tone-left-middle-at:31%;--tone-left-end:68%;
  --tone-wash:color-mix(in srgb,var(--ink) 4%,transparent);
}
[data-overlay=ink]{--photo-filter:saturate(.74) contrast(1.07) brightness(.95);--tone-top:color-mix(in srgb,var(--ink) 74%,transparent);--tone-bottom:color-mix(in srgb,var(--ink) 43%,transparent);--tone-left:color-mix(in srgb,var(--ink) 69%,transparent);--tone-left-middle:color-mix(in srgb,var(--ink) 30%,transparent);--tone-wash:color-mix(in srgb,var(--ink) 17%,transparent)}
[data-overlay=bayou]{--photo-filter:saturate(.72) contrast(1.05) brightness(1);--tone-wash:color-mix(in srgb,var(--bayou) 12%,transparent)}
[data-overlay=rust]{--photo-filter:saturate(.8) contrast(1.04) brightness(1);--tone-wash:color-mix(in srgb,var(--rust) 14%,transparent)}
[data-overlay=blue]{--photo-filter:saturate(.8) contrast(1.04) brightness(1);--tone-wash:linear-gradient(115deg,transparent 45%,color-mix(in srgb,var(--live-blue) 20%,transparent))}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scrollbar-color:var(--bayou) var(--paper);scrollbar-width:thin}
body{background:var(--background);color:var(--text);font-family:var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
::selection{background:var(--bayou);color:var(--paper)}
button,a{-webkit-tap-highlight-color:transparent;transition:color 320ms ease,background-color 320ms ease,border-color 320ms ease;text-decoration-thickness:1px;text-underline-offset:5px}
button{font:inherit;cursor:pointer}
a{color:inherit}button:focus-visible,a:focus-visible{outline:2px solid var(--live-blue);outline-offset:5px}
svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.comparison{min-height:62px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:8px 28px;background:var(--paper);border-bottom:1px solid var(--border)}
.comparison-name{font-size:16px;font-weight:500}
.comparison-name a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none}.comparison-name a:hover{text-decoration:underline}
.choices{display:flex;gap:6px}
.playback{display:flex;gap:8px}
.choices button,.pause{min-height:44px;padding:0 18px;background:transparent;color:var(--ink);border:1px solid transparent;border-radius:4px;font-size:15px}
.choices button[aria-pressed=true]{background:var(--ink);color:var(--paper)}
.choices button:hover{background:var(--accent-bg)}.choices button[aria-pressed=true]:hover{background:var(--bayou)}
.pause{border-color:var(--border)}.pause:hover{background:var(--accent-bg)}.pause[aria-pressed=true]{color:var(--bayou)}
.pause:disabled{cursor:default;color:var(--muted);background:transparent}
.instruction{display:flex;align-items:center;justify-content:center;min-height:37px;padding:7px 20px;font-size:14px;text-align:center;color:var(--secondary);background:var(--paper)}
.signature-intro{position:fixed;inset:var(--preview-height) 0 0;z-index:20;display:grid;place-items:center;pointer-events:auto;isolation:isolate;color:var(--paper)}
.signature-curtain{position:absolute;inset:0;background:var(--ink);z-index:-1}
.signature-intro[hidden]{display:none}
.signature-lettering{display:block;width:clamp(290px,32vw,460px);height:auto;max-width:calc(100vw - 56px);fill:none;stroke:none;overflow:hidden;transform-origin:0 0}
.signature-intro[data-phase=complete] .signature-ink,.signature-intro[data-phase=revealing] .signature-ink{mask:none}
.release{min-height:40px;display:flex;align-items:center;justify-content:center;gap:48px;padding:6px 30px;background:var(--ink);color:var(--paper);font-size:14px}
.release a{display:inline-flex;align-items:center;gap:12px;min-height:44px;text-decoration:none}
.release a:hover{text-decoration:underline}.release svg{width:17px}
.opening{position:relative;height:calc(100svh - var(--preview-height) - var(--release-height));min-height:520px;isolation:isolate;overflow:hidden;background:var(--ink);color:var(--paper)}
.photographic-field{position:absolute;inset:-30px -40px;z-index:-2;overflow:hidden;transform:translate3d(0,var(--scroll-shift,0px),0);will-change:transform}
.photo{width:100%;height:100%;object-fit:cover;object-position:53% 45%;display:block;filter:var(--photo-filter);transform:scale(1);transform-origin:53% 40%}
.photo.entering{will-change:transform}
.tone{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,var(--tone-top),transparent var(--tone-top-end),var(--tone-mid) var(--tone-mid-start),var(--tone-bottom)),linear-gradient(90deg,var(--tone-left),var(--tone-left-middle) var(--tone-left-middle-at),transparent var(--tone-left-end)),var(--tone-wash)}
.site-header{display:flex;justify-content:space-between;align-items:baseline;gap:26px;padding:26px clamp(28px,5vw,80px);position:relative}
.wordmark{position:relative;width:220px;flex-shrink:0;font-family:var(--serif);font-weight:400;font-size:34px;line-height:1.1;white-space:nowrap;letter-spacing:-.025em}
.header-signature{position:absolute;left:0;top:50%;transform:translateY(-50%);display:block;width:220px;height:auto;fill:none;stroke:none;overflow:hidden;opacity:0}
body.signature-ready .wordmark-text{opacity:0}
body.signature-ready .header-signature{opacity:1}
body.signature-active .header-signature{visibility:hidden}
nav{display:flex;align-items:center;gap:clamp(20px,2.6vw,40px);font-size:16px;line-height:1.5}
nav a{display:flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;text-decoration:none}nav a:hover{text-decoration:underline}nav span{cursor:default}
.thought{position:absolute;left:clamp(28px,7.5vw,115px);top:49%;transform:translateY(-5%)}
h1{font-family:var(--serif);font-size:clamp(44px,4.9vw,72px);font-weight:400;line-height:.98;letter-spacing:-.022em;text-wrap:balance}
em{font-family:var(--serif);font-weight:400}
.continue{position:absolute;bottom:28px;left:clamp(28px,5vw,80px);display:inline-flex;align-items:center;gap:22px;min-height:44px;text-decoration:none;font-size:16px}
.continue:hover{text-decoration:underline}.continue svg{color:var(--paper)}
.book{max-width:1200px;padding:72px 48px 28px;margin:auto;scroll-margin-top:24px;overflow-wrap:anywhere}
.book-passage{max-width:800px;margin:0 0 var(--space-section);padding:0 0 40px;border-bottom:1px solid var(--border)}
.book-passage .passage-lead{font-family:var(--serif);font-size:var(--book-lead-size);line-height:1.2;letter-spacing:-.02em;text-wrap:balance;margin-bottom:var(--space-related)}
.passage-lead em{color:var(--rust)}
.book-passage>p:not(.passage-lead){max-width:var(--book-reading-measure);font-size:var(--book-passage-size);line-height:1.6;color:var(--secondary)}
.book-passage footer{margin-top:var(--space-related);font-size:var(--book-metadata-size);line-height:1.5;color:var(--muted)}
.book-passage cite{font-family:var(--serif);font-size:1.2em;font-style:italic}
.book-intro{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(2rem,5vw,4rem);align-items:start}
h2{font-family:var(--serif);font-size:clamp(46px,5.5vw,78px);font-weight:400;line-height:.96;letter-spacing:-.025em}h2 em{color:var(--bayou)}
.dictionary-entry h2{font-size:var(--book-title-size);line-height:1}
.pronunciation{margin-top:var(--space-close);font-family:var(--phonetic);font-size:1rem;line-height:1.6;color:var(--secondary)}
.definition{margin-top:var(--space-related);max-width:var(--book-reading-measure);font-size:var(--book-body-size);line-height:1.6;color:var(--text)}
.part-of-speech{margin-right:.2em;font-family:var(--serif);font-size:1.2em;font-style:italic;color:var(--rust)}
.book-detail{display:flex;flex-direction:column;gap:var(--space-related);padding-top:.25rem;font-size:var(--book-body-size);line-height:1.5}.subtitle{font-size:1.375rem;text-wrap:balance}
.publisher{display:inline-flex;align-items:center;gap:18px;min-height:44px;color:var(--bayou);font-weight:500;width:fit-content;text-decoration:none;border-bottom:1px solid var(--bayou)}
.publisher:hover{color:var(--ink);border-color:var(--ink)}
.preview-note{display:flex;align-items:flex-end;justify-content:space-between;gap:48px;margin-top:68px;padding-top:22px;border-top:1px solid var(--border);font-size:14px;line-height:1.5;color:var(--muted)}
.preview-note p{max-width:63ch}.preview-note a{display:inline-flex;align-items:center;gap:10px;min-height:44px;white-space:nowrap;text-decoration:none;color:var(--ink)}.preview-note a:hover{text-decoration:underline}
body.paused .photographic-field,body.reduced .photographic-field{will-change:auto}
.no-script{padding:20px;text-align:center}
@media(max-width:760px){
  :root{--preview-height:157px;--release-height:58px;--tone-top-end:45%;--tone-mid:color-mix(in srgb,var(--ink) 24%,transparent);--tone-mid-start:61%;--tone-bottom:color-mix(in srgb,var(--ink) 67%,transparent);--tone-left:color-mix(in srgb,var(--ink) 52%,transparent);--tone-left-middle:var(--tone-left);--tone-left-middle-at:0%;--tone-left-end:90%}
  [data-overlay=ink]{--tone-top:color-mix(in srgb,var(--ink) 76%,transparent);--tone-mid:color-mix(in srgb,var(--ink) 30%,transparent);--tone-bottom:color-mix(in srgb,var(--ink) 67%,transparent);--tone-left:color-mix(in srgb,var(--ink) 49%,transparent);--tone-left-middle:var(--tone-left);--tone-wash:color-mix(in srgb,var(--ink) 14%,transparent)}
  .comparison{flex-wrap:wrap;gap:2px 8px;padding:7px 16px;min-height:88px}
  .comparison-name{flex:1;font-size:14px}.choices{order:3;width:100%}.choices button{flex:1}.pause{font-size:13px;min-height:44px;padding:0 12px}.instruction{font-size:13px;min-height:52px}
  .release{font-size:12px;gap:12px;padding:7px 17px;min-height:58px}.release-date{display:block}.release a{white-space:nowrap;gap:7px;min-height:44px}
  .opening{min-height:500px}
  .photographic-field{inset:-25px -28px}.photo{object-position:53% 42%}
  .site-header{display:block;padding:24px 24px}.wordmark{font-size:31px;width:210px}.header-signature{width:210px}
  nav{font-size:14px;gap:0;justify-content:space-between;margin-top:17px;flex-wrap:wrap}nav span{min-height:44px;display:flex;align-items:center}
  .thought{left:28px;top:auto;bottom:124px;transform:none}h1{font-size:53px}
  .continue{left:28px;bottom:23px}.book{padding:48px 28px 26px}.book-intro{grid-template-columns:1fr;gap:var(--space-group)}.book-detail{padding-top:0;gap:1rem}.subtitle{font-size:1.25rem}
  .book-passage{margin-bottom:40px;padding-bottom:var(--space-group)}.book-passage>p:not(.passage-lead){font-size:var(--book-body-size)}
  .preview-note{display:block;margin-top:45px}.preview-note a{margin-top:20px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.photo{transform:scale(1)}.photographic-field{transform:none!important;will-change:auto}}
@media(prefers-reduced-motion:reduce){.signature-intro{display:none}}
body.reduced .photo{animation:none!important;will-change:auto}

:root{--preview-height:0px}
@media(max-width:760px){:root{--preview-height:0px}}

.opening-scene{position:relative;isolation:isolate;overflow:hidden;background:var(--paper)}
body#top{--paper-texture-wash:color-mix(in srgb,var(--paper) 20%,transparent);--paper-link-ink:color-mix(in srgb,var(--bayou) 50%,var(--ink));--paper-editorial-ink:color-mix(in srgb,var(--rust) 60%,var(--ink));--paper-display-ink:color-mix(in srgb,var(--bayou) 80%,var(--ink));background-image:linear-gradient(var(--paper-texture-wash),var(--paper-texture-wash)),url('assets/crumpled-paper-20261001.webp');background-size:auto,1024px 1024px;background-repeat:repeat}
body#top .book,body#top .site-footer{--secondary:color-mix(in srgb,var(--ink) 85%,var(--paper));--muted:var(--secondary)}
body#top .dictionary-entry h2 em{color:var(--paper-display-ink)}
body#top .publisher{color:var(--paper-link-ink);border-color:var(--paper-link-ink)}
body#top .publisher:hover{color:var(--ink);border-color:var(--ink)}
body#top .part-of-speech{color:var(--paper-editorial-ink)}
.opening-scene::before{content:"";position:absolute;inset:-24px;z-index:-1;background:url('assets/greeting.jpg') 53% 45% / cover no-repeat;filter:blur(8px) saturate(.6);opacity:.12;pointer-events:none}
.opening{width:100%;max-width:1120px;height:clamp(560px,76svh,660px);margin-inline:auto}
.photographic-field{inset:-12px 0}
@media(min-width:1025px){.opening-scene{padding-block:clamp(24px,3vw,40px)}.opening{box-shadow:0 16px 40px var(--shadow)}}
@media(max-width:1024px){.opening-scene::before{display:none}}
@media(max-width:760px){.opening{height:clamp(500px,72svh,620px)}.photographic-field{inset:-12px 0}}


.book-detail .book-cover{display:block;width:min(200px,55%);height:auto;margin-bottom:.5rem;box-shadow:0 18px 40px -18px var(--shadow)}@media(max-width:760px){.book-detail .book-cover{width:min(170px,50%)}}