:root {
  --ng-ground:#EBEFF9;
  --ng-ink:#22252D;
  --ng-accent:#D13E33;
  --ng-support:#DDD4C5;
  --ng-surface:#FBFCFD;
  --ng-display:'Righteous','Trebuchet MS',sans-serif;
  --ng-body:'Antic','Trebuchet MS',sans-serif;
}
* { box-sizing:border-box }
html { scroll-behavior:auto }
body { margin:0; background:var(--ng-ground); color:var(--ng-ink); font-family:var(--ng-body); font-size:20px; line-height:1.6 }
a { color:inherit; text-decoration-thickness:1px; text-underline-offset:5px; text-decoration-skip-ink:auto }
a:hover { text-decoration-thickness:3px; background:var(--ng-support) }
a:focus-visible { outline:3px solid var(--ng-ink); outline-offset:6px; background:var(--ng-support) }
::selection { background:var(--ng-ink); color:var(--ng-surface) }
img { max-width:100%; display:block }
svg { display:block; fill:currentColor }
h1,h2,h3,p,figure { margin:0 }
h1,h2,h3 { font-family:var(--ng-display); font-weight:400; line-height:1.1 }
h1 { font-size:clamp(36px,4.4vw,68px); letter-spacing:-.035em }
h2 { font-size:clamp(30px,3.1vw,46px); letter-spacing:-.025em }
h3 { font-size:25px }
p+p { margin-top:20px }
.ng-skip { position:absolute; z-index:9; left:24px; top:-90px; background:var(--ng-surface); padding:12px 20px }
.ng-skip:focus { top:14px }
.ng-frame { width:calc(100% - 112px); max-width:1392px; margin-inline:auto }

/* The N holds a little stair of real links, with the name on its baseline. */
.ng-mast { height:224px; position:relative; padding-top:18px }
.ng-counter { position:relative; width:400px; height:174px }
.ng-letter { width:318px; height:174px; color:var(--ng-ink) }
.ng-directory { position:absolute; left:158px; top:3px; display:flex; flex-direction:column; gap:8px; font-size:18px; line-height:1.35 }
.ng-directory a { width:max-content; display:block; text-decoration:none; padding:0 3px }
.ng-directory a:nth-child(2) { margin-left:29px }
.ng-directory a:nth-child(3) { margin-left:58px }
.ng-directory a:hover { text-decoration:underline; text-decoration-thickness:2px }
.ng-wordmark { position:absolute; top:196px; left:0; font-family:var(--ng-display); font-size:28px; line-height:1; letter-spacing:-.025em; text-decoration:none }
.ng-mast-note { position:absolute; right:0; bottom:26px; font-size:20px; line-height:1.35; border-left:10px solid var(--ng-accent); padding-left:20px }

/* A roof-wide photograph, with a stepped sand sign on its right-hand edge. */
.ng-home-opening { position:relative; isolation:isolate; display:flex; justify-content:flex-end; align-items:center; min-height:596px; padding:26px 0; background:var(--ng-support) }
.ng-roof-ensemble { position:absolute; inset:0; z-index:-1 }
.ng-roof-wedge { position:absolute; inset:0; overflow:hidden; background:var(--ng-support) }
.ng-roof-wedge>img { width:100%; height:100%; object-fit:cover; object-position:28% 55% }
.ng-hero-panel { position:relative; width:62%; max-width:940px; padding:36px 60px 40px 64px; background:var(--ng-support); clip-path:polygon(32px 0,100% 0,100% calc(100% - 24px),calc(100% - 36px) calc(100% - 24px),calc(100% - 36px) 100%,0 100%,0 62px,32px 62px) }
.ng-hero-panel::before { content:''; position:absolute; left:32px; right:0; top:0; height:10px; background:var(--ng-accent) }
.ng-home-opening h1 { font-size:clamp(42px,3.8vw,60px); line-height:1.04; margin-bottom:18px }
.ng-name { white-space:nowrap }
.ng-lead { font-size:25px; line-height:1.38 }
.ng-owner-intro .ng-lead { font-size:23px; line-height:1.35 }
.ng-owner-intro>p+p { font-size:19px; line-height:1.4; margin-top:12px }
.ng-mention { position:relative; margin-top:24px; padding-right:48px; color:var(--ng-ink); font-size:17px; line-height:1.4; cursor:default }
.ng-mention strong { font-weight:700 }
.ng-ladder { position:absolute; right:0; top:0; width:28px; height:100%; color:var(--ng-ink) }
.ng-detached { position:absolute; width:176px; height:136px; left:56px; bottom:44px; border:10px solid var(--ng-ground); object-fit:cover; transform:rotate(-3deg); box-shadow:12px 12px 0 var(--ng-accent); animation:ng-aerial-settle .7s ease-out both }
@keyframes ng-aerial-settle { from { transform:translateY(12px) rotate(-3deg) } to { transform:translateY(0) rotate(-3deg) } }

/* Wide essays remain tickets, with unequal rectangular bites and hard offset layers. */
.ng-first-reading { margin-top:100px }
.ng-break { width:100%; height:26px; color:var(--ng-accent); margin:0 0 86px }
.ng-tickets { display:grid; gap:116px; padding-right:16px }
.ng-reading-ticket { position:relative; display:grid; grid-template-columns:minmax(0,.72fr) minmax(0,1fr); column-gap:7%; row-gap:22px; padding:68px 68px 52px; background:var(--ng-surface); box-shadow:16px 16px 0 var(--ng-support) }
.ng-reading-ticket::before,.ng-reading-ticket::after { content:''; position:absolute; background:var(--ng-ground) }
.ng-reading-ticket::before { width:31px; height:58px; left:0; top:34% }
.ng-reading-ticket::after { width:48px; height:32px; right:0; top:65% }
.ng-reading-ticket:nth-child(2) { margin-left:32px; background:var(--ng-support); box-shadow:16px 16px 0 var(--ng-accent) }
.ng-reading-ticket:nth-child(2)::before { height:34px; width:46px; top:58% }
.ng-reading-ticket:nth-child(2)::after { width:24px; height:70px; top:22% }
.ng-reading-ticket:nth-child(3) { margin-right:24px }
.ng-reading-ticket:nth-child(3)::before { height:76px; width:22px; top:25% }
.ng-reading-ticket:nth-child(3)::after { width:38px; height:42px; top:68% }
.ng-reading-number { position:absolute; top:-62px; left:52px; padding:0 16px 0 10px; background:var(--ng-ground); color:var(--ng-ink); font-family:var(--ng-display); font-size:104px; line-height:1; letter-spacing:-.06em }
.ng-ticket-title { align-self:start; position:sticky; top:32px; max-width:390px }
.ng-reading-label { display:flex; align-items:center; gap:12px; font-size:18px; line-height:1.35; margin-bottom:26px }
.ng-library-icon { display:inline-flex; width:24px; height:24px; min-width:24px; vertical-align:middle }
.ng-library-icon i { display:block; width:100%; height:100% }
.ng-library-icon svg { width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round }
.ng-ticket-prose { min-width:0 }
.ng-ticket-prose p { font-size:21px; line-height:1.65 }
.ng-deeper { grid-column:2; display:flex; gap:12px; align-items:flex-start; border-top:4px solid var(--ng-ink); padding-top:18px; font-size:18px; line-height:1.5 }
.ng-reading-ticket:nth-child(2) a:hover,.ng-reading-ticket:nth-child(2) a:focus-visible { background:var(--ng-ground) }
.ng-unbounded { padding:90px 68px 0; display:grid; grid-template-columns:minmax(0,.72fr) minmax(0,1fr); gap:7%; position:relative }
.ng-unbounded h2 { max-width:390px }
.ng-unbounded .ng-break { grid-column:1/-1; margin-bottom:12px; height:20px; width:48%; justify-self:end }
.ng-unbounded-prose { grid-column:2; font-size:22px; line-height:1.6 }

/* Inner-page photographs run to both browser edges; the essays return to the ticket. */
.ng-inner-opening { padding-top:36px }
.ng-inner-opening h1 { max-width:1040px; font-size:clamp(38px,4.7vw,72px) }
.ng-inner-opening .ng-lead { max-width:780px; margin-top:26px; margin-bottom:0; border-left:10px solid var(--ng-accent); padding-left:22px }
.ng-breadcrumb { display:flex; gap:12px; margin-bottom:30px; font-size:18px; line-height:1.5 }
.ng-inner-photo { margin-top:48px }
.ng-photo-band { height:300px; width:100%; position:relative; background:var(--ng-support); clip-path:polygon(0 0,94% 0,94% 22px,100% 22px,100% 100%,0 100%) }
.ng-photo-band img { width:100%; height:100%; object-fit:cover; object-position:center 60% }
.ng-photo-note { font-size:16px; padding-top:14px; line-height:1.5 }
.ng-inner-readings { margin-top:104px }
.ng-paper-notes { margin-top:76px; display:grid; gap:44px; padding-right:12px }
.ng-source-note { background:var(--ng-surface); padding:38px 44px 38px 60px; position:relative; display:grid; grid-template-columns:1fr 1.4fr; gap:48px; box-shadow:10px 10px 0 var(--ng-support) }
.ng-source-note::before { content:''; position:absolute; left:0; top:35%; width:20px; height:36px; background:var(--ng-ground) }
.ng-source-note h2 { font-size:28px }
.ng-source-note p { font-size:19px; line-height:1.55 }
.ng-source-note .ng-source-context { font-size:16px; margin-top:14px }
.ng-reference-intro { max-width:780px; margin-top:26px }
.ng-source-category { font-size:18px; margin-bottom:14px }
.ng-colophon { margin-top:128px; padding-bottom:40px }
.ng-colophon .ng-break { margin-bottom:36px; height:20px }
.ng-footer-links { display:flex; flex-wrap:wrap; gap:16px 30px; margin-bottom:32px; font-size:20px }
.ng-footer-words { display:grid; grid-template-columns:1fr auto; align-items:end; gap:30px; font-size:17px; line-height:1.5 }
.ng-footer-words>p:first-child { max-width:640px }
.ng-footer-words>p+p { margin:0; white-space:nowrap }
.ng-missing { min-height:350px; padding-top:44px }
.ng-missing h1 { max-width:950px }
.ng-missing p { margin-top:24px; max-width:800px }
.ng-missing-links { display:flex; gap:30px; margin-top:28px }

@media(min-width:1800px) {
  .ng-home-opening { min-height:670px }
  .ng-hero-panel { margin-right:calc((100% - 1600px)/2) }
}
@media(max-width:1100px) and (min-width:701px) {
  .ng-frame { width:calc(100% - 64px) }
  .ng-hero-panel { width:70%; padding:34px 36px 40px 48px }
  .ng-home-opening h1 { font-size:44px }
  .ng-owner-intro .ng-lead { font-size:21px }
  .ng-mention { font-size:16px; line-height:1.45; padding-right:42px }
  .ng-detached { left:32px; width:132px; height:112px }
  .ng-reading-ticket { padding:60px 48px 44px; column-gap:6%; grid-template-columns:.8fr 1fr }
  .ng-ticket-prose p { font-size:20px }
  .ng-unbounded { padding-inline:48px }
}
@media(max-width:700px) {
  body { font-size:18px }
  .ng-frame { width:calc(100% - 40px) }
  .ng-mast { height:82px; padding-top:18px; display:flex; align-items:flex-start; gap:14px }
  .ng-counter { width:100%; height:44px; display:flex; align-items:flex-start; gap:14px }
  .ng-letter { width:40px; height:40px; flex:none }
  .ng-directory { position:absolute; top:26px; left:54px; display:flex; flex-direction:row; gap:18px; font-size:16px; line-height:1.35; padding:0 }
  .ng-directory a:nth-child(n) { margin:0; padding:0 }
  .ng-wordmark { position:absolute; top:18px; left:54px; font-size:18px; line-height:1.2; white-space:nowrap }
  .ng-mast-note { display:none }
  .ng-home-opening { display:flex; flex-direction:column; padding:0 0 24px; min-height:0; align-items:stretch; background:var(--ng-support) }
  .ng-hero-panel { width:100%; max-width:none; padding:28px 20px 26px; clip-path:polygon(0 0,100% 0,100% calc(100% - 16px),calc(100% - 20px) calc(100% - 16px),calc(100% - 20px) 100%,0 100%) }
  .ng-hero-panel::before { left:20px; right:20px; height:7px }
  .ng-home-opening h1 { font-size:36px; line-height:1.08; letter-spacing:-.027em; margin-bottom:16px }
  .ng-owner-intro .ng-lead { font-size:19px; line-height:1.3 }
  .ng-owner-intro>p+p { font-size:17px; line-height:1.35; margin-top:10px }
  .ng-mention { margin-top:20px; padding-right:40px; font-size:16px; line-height:1.34 }
  .ng-ladder { width:28px }
  .ng-roof-ensemble { position:relative; inset:auto; z-index:0; margin:0 20px; height:104px }
  .ng-roof-wedge { height:104px; clip-path:polygon(0 16%,77% 0,100% 31%,100% 100%,0 100%) }
  .ng-roof-wedge>img { object-position:center 52% }
  .ng-detached { display:none; animation:none }
  .ng-first-reading { margin-top:60px }
  .ng-break { height:20px; margin-bottom:60px }
  .ng-tickets { gap:80px; padding-right:8px }
  .ng-reading-ticket { display:block; padding:42px 26px 30px; box-shadow:8px 8px 0 var(--ng-support) }
  .ng-reading-ticket:nth-child(2) { margin-left:0; box-shadow:8px 8px 0 var(--ng-accent) }
  .ng-reading-ticket:nth-child(3) { margin-right:0 }
  .ng-reading-ticket::before { width:12px; height:38px; top:40% }
  .ng-reading-ticket::after { width:15px; height:24px; top:72% }
  .ng-reading-ticket:nth-child(2)::before { height:24px; width:15px; top:60% }
  .ng-reading-ticket:nth-child(2)::after { width:12px; height:45px; top:34% }
  .ng-reading-ticket:nth-child(3)::before { height:48px; width:12px; top:35% }
  .ng-reading-ticket:nth-child(3)::after { width:16px; height:28px; top:65% }
  .ng-reading-number { font-size:68px; top:-40px; left:18px; padding-right:12px }
  .ng-ticket-title { position:static; max-width:100%; margin-bottom:24px }
  .ng-reading-label { font-size:16px; margin-bottom:18px; gap:10px }
  .ng-ticket-title h2 { font-size:32px; line-height:1.12; letter-spacing:-.025em }
  .ng-ticket-prose p { font-size:18px; line-height:1.6 }
  .ng-ticket-prose p+p { margin-top:18px }
  .ng-deeper { font-size:16px; margin-top:26px; padding-top:16px; gap:10px }
  .ng-unbounded { display:block; padding:54px 8px 0 }
  .ng-unbounded h2 { font-size:34px; max-width:100%; margin-bottom:28px }
  .ng-unbounded-prose { font-size:19px }
  .ng-unbounded .ng-break { width:70%; height:18px; margin-bottom:34px; margin-left:auto }
  .ng-inner-opening { padding-top:18px }
  .ng-breadcrumb { font-size:16px; flex-wrap:wrap; margin-bottom:24px; gap:8px }
  .ng-inner-opening h1 { font-size:36px; line-height:1.12 }
  .ng-inner-opening .ng-lead { font-size:21px; line-height:1.4; margin-top:22px; padding-left:16px; border-left-width:7px }
  .ng-inner-photo { margin-top:30px }
  .ng-photo-band { height:172px; clip-path:polygon(0 0,90% 0,90% 16px,100% 16px,100% 100%,0 100%) }
  .ng-photo-note { font-size:16px; padding-top:12px }
  .ng-inner-readings { margin-top:64px }
  .ng-paper-notes { margin-top:46px; gap:32px; padding-right:8px }
  .ng-source-note { display:block; padding:28px; box-shadow:8px 8px 0 var(--ng-support) }
  .ng-source-note h2 { font-size:25px; margin-bottom:22px }
  .ng-source-note p { font-size:18px }
  .ng-source-note::before { width:12px; height:28px }
  .ng-source-note .ng-source-context { font-size:16px }
  .ng-reference-intro { margin-top:26px }
  .ng-colophon { margin-top:76px; padding-bottom:28px }
  .ng-colophon .ng-break { margin-bottom:28px }
  .ng-footer-links { font-size:18px; gap:12px 22px }
  .ng-footer-words { display:block; font-size:16px }
  .ng-footer-words>p+p { white-space:normal; margin-top:18px }
  .ng-missing { padding-top:24px; min-height:300px }
  .ng-missing h1 { font-size:36px }
  .ng-missing-links { flex-wrap:wrap }
}
@media(max-width:359px) {
  .ng-home-opening h1 { font-size:32px }
  .ng-name { letter-spacing:-.045em }
  .ng-directory { gap:14px }
  .ng-mention { padding-right:36px }
  .ng-ladder { width:24px }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important }
}
@media print {
  .ng-skip,.ng-directory,.ng-roof-ensemble,.ng-inner-photo,.ng-mast-note,.ng-reading-number { display:none }
  body { background:white; color:black }
  .ng-frame { width:100% }
  .ng-mast { height:70px }
  .ng-wordmark { position:static }
  .ng-counter { display:none }
  .ng-home-opening { display:block; background:white; padding:0 }
  .ng-hero-panel { width:100%; max-width:none; background:white; clip-path:none; padding:0 }
  .ng-hero-panel::before { display:none }
  .ng-reading-ticket,.ng-reading-ticket:nth-child(2) { break-inside:avoid; background:white; border-top:3px solid black; box-shadow:none }
  .ng-reading-ticket::before,.ng-reading-ticket::after { display:none }
  .ng-ticket-title { position:static }
  .ng-mention { font-size:16px }
  .ng-tickets { gap:32px }
}