:root{--paper:#faf7ef;--ink:#173c32;--coral:#f45340;--yellow:#f5db48;--purple:#cec0ef;--foot-label-color:#b1bbb3;--foot-accent:var(--coral)}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #9b38a7;outline-offset:5px}img{display:block;width:100%;height:auto}button{cursor:pointer}em{font-family:Georgia,serif;font-weight:400}p{line-height:1.6}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}[hidden]{display:none!important}.skip{position:absolute;left:16px;top:-100px;padding:15px;background:var(--yellow);z-index:10}.skip:focus{top:16px}.masthead{padding:0 5vw}.topline{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #173c3240;padding:15px 0;font-size:11px;letter-spacing:1px}.topline strong{font-size:19px;letter-spacing:-1px}.topline a{display:inline-block;min-height:44px}.brandrow{display:flex;justify-content:space-between;align-items:center;padding:24px 0}.wordmark{font-weight:900;font-size:clamp(36px,7vw,106px);letter-spacing:-.075em;line-height:1;display:inline-block;min-height:44px}.wordmark span{color:var(--coral);font-size:.45em;vertical-align:middle;margin-left:10px}.edition-badge{font-size:14px;line-height:1.5;border-left:1px solid;padding-left:25px;display:inline-block;min-height:44px}.masthead nav{display:flex;gap:32px;border-top:1px solid;border-bottom:1px solid;padding:2px 0;font-size:14px}.masthead nav a{padding:16px 11px;margin:0 -11px;display:inline-block}.masthead nav a:hover{text-decoration:underline;text-underline-offset:5px}.intro{padding:64px 5vw 56px;background:var(--coral);margin-top:0;position:relative;color:#0b1f1a}.eyebrow{font-size:11px;font-weight:700;letter-spacing:1.8px}.intro h1{font-size:clamp(45px,6.4vw,95px);line-height:1.03;letter-spacing:-4px;margin:22px 0}.intro-copy{font-size:17px;max-width:470px;margin:24px 0 0}.featured{display:grid;grid-template-columns:1.2fr 1fr;margin:0 5vw 80px}.featured-image{overflow:hidden;min-height:560px}.featured-image img{height:100%;object-fit:cover;transition:transform .7s}.featured-image:hover img{transform:scale(1.035)}.featured-copy{background:var(--yellow);padding:55px 12%;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.location{font-size:13px;margin:24px 0 10px}.featured h2{font-size:clamp(48px,6vw,86px);line-height:.99;letter-spacing:-3px;margin:5px 0 20px}.featured-copy>p:not(.location){font-size:17px;max-width:370px}.read-link{display:inline-flex;gap:30px;align-items:center;border-bottom:1px solid;padding:13px 0;font-weight:700;font-size:15px}.read-link span{font-size:24px}.fine{font-size:11px;line-height:1.5;margin-top:24px}.stories,.related{padding:0 5vw 85px}.section-title{display:flex;align-items:baseline;justify-content:space-between;gap:24px;border-bottom:1px solid;padding-bottom:22px;margin-bottom:28px}.section-title h2{font-size:clamp(30px,3.5vw,48px);letter-spacing:-1.7px;margin:0}.section-title>span{font-size:10px;letter-spacing:1px}.section-title>a{font-size:14px;white-space:nowrap;display:inline-block;min-height:44px}.browse-tools{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:36px}.filters{display:flex;gap:8px;flex-wrap:wrap}.filters button{border:1px solid #173c3250;padding:14px 20px;border-radius:30px;color:var(--ink);background:transparent;font-size:13px}.filters button[aria-pressed=true]{background:var(--ink);color:var(--paper)}.search-label{flex:0 1 310px}.search-label input{width:100%;border:0;border-bottom:1px solid #173c3270;background:transparent;padding:15px 2px;color:var(--ink);border-radius:0;font-size:16px}.story-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px 30px}.card-image{aspect-ratio:1.18;display:block;position:relative;overflow:hidden;background:#d8d9c5}.card-image img{height:100%;object-fit:contain;object-position:center}.card-image:hover img{transform:none}.round-arrow{position:absolute;bottom:14px;right:14px;border-radius:50%;display:grid;place-items:center;width:43px;height:43px;background:var(--paper);font-size:25px;transition:transform .3s}.card-image:hover .round-arrow{transform:rotate(45deg)}.card-meta{display:flex;justify-content:space-between;text-transform:uppercase;font-size:10px;letter-spacing:1px;margin:20px 0 12px}.card-meta span:first-child{font-weight:bold}.story-card h3{font-size:27px;line-height:1.14;letter-spacing:-.8px;margin:0 0 12px}.story-card h3 a{display:inline-block;padding:7px 0}.story-card h3 a:hover{text-decoration:underline;text-underline-offset:4px}.story-card p{font-size:15px;margin:0 0 18px}.place{font-size:11px;text-transform:uppercase;letter-spacing:1px}.archive-banner{background:var(--purple);padding:64px 5vw;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:40px;overflow:hidden}.archive-banner h2{font-size:clamp(35px,4vw,57px);letter-spacing:-2px;line-height:1.06;margin:25px 0}.archive-banner p{font-size:16px}.archive-covers{display:flex;align-items:center;padding:30px 0}.archive-covers img{width:34%;box-shadow:6px 12px 22px #173c3230;transform:rotate(-9deg)}.archive-covers img:nth-child(2){transform:rotate(1deg) translateY(-15px);position:relative;z-index:1}.archive-covers img:nth-child(3){transform:rotate(9deg)}footer{padding-left:5vw;padding-right:5vw;background:var(--ink);color:var(--paper)}footer>div:last-child a{padding:10px 0;display:inline-block;min-height:44px}.article-heading{max-width:1080px;padding:55px 24px 35px;margin:auto;text-align:center}.back{display:inline-block;min-height:44px;margin-bottom:45px}.article-category{font-size:13px;text-transform:uppercase;letter-spacing:1px}.article-category span{margin:0 10px;color:var(--coral)}.article h1{font-size:clamp(38px,5.4vw,76px);line-height:1.06;letter-spacing:-2.5px;margin:25px auto;max-width:1000px}.standfirst{font-family:Georgia,serif;font-size:clamp(20px,2vw,27px);max-width:780px;margin:0 auto 28px;line-height:1.45}.byline{display:flex;gap:12px 32px;justify-content:center;flex-wrap:wrap;font-size:13px;line-height:1.5}.article-image{margin:0 auto 50px;max-width:1100px;padding:0 24px}.article-image img{max-height:620px;object-fit:contain;background:#e8e8dc}.article-image figcaption{font-size:13px;line-height:1.5;margin-top:10px}.article-reading{max-width:1080px;margin:0 auto 85px;padding:0 24px;display:grid;grid-template-columns:200px minmax(0,700px);gap:55px}.article-aside{font-size:13px;padding-top:7px}.article-aside>a:first-of-type{display:flex;gap:14px;align-items:center;margin:22px 0;min-height:44px}.article-aside strong{font-size:35px;letter-spacing:-2px}.article-aside span{line-height:1.5}.original-link{display:block;border-bottom:1px solid #173c3230;padding-bottom:20px;min-height:44px}.share-story{color:var(--ink);background:transparent;border:0;padding:20px 0;font-size:12px;text-align:left}.share-status{display:block;overflow-wrap:anywhere}.article-body>p{font:21px/1.75 Georgia,serif;margin:0 0 25px;overflow-wrap:anywhere}.article-body>p:first-child:first-letter{float:left;font-size:72px;line-height:.9;padding:8px 9px 0 0;color:var(--coral)}.article-source{border-top:1px solid #173c3240;margin-top:40px;padding-top:20px}.article-source p{font-size:13px;line-height:1.7}.article-source a{text-decoration:underline}.related{padding-top:35px}.intro h1,.featured{animation:arrive .8s both}@keyframes arrive{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@media(min-width:1500px){body{max-width:1800px;margin:auto}.intro-copy{position:absolute;right:7vw;bottom:65px;max-width:320px}}@media(max-width:900px){.featured{grid-template-columns:1fr 1fr}.featured-image{min-height:450px}.featured-copy{padding:35px 25px}.featured h2{font-size:54px}.story-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.section-title>span{display:none}.article-reading{grid-template-columns:150px minmax(0,1fr);gap:28px}.browse-tools{align-items:flex-start;flex-direction:column}.search-label{flex:auto;width:100%}.archive-banner{gap:20px}.topline>span{font-size:13px}.intro h1{letter-spacing:-2.5px}}@media(max-width:600px){.topline>span{display:none}.brandrow{padding:25px 0}.wordmark{font-size:42px}.edition-badge{display:none}.masthead nav{gap:0;justify-content:space-between;font-size:13px}.intro{padding:40px 5vw}.intro h1{font-size:46px;letter-spacing:-2.5px}.intro-copy{font-size:16px}.featured{grid-template-columns:1fr;margin-bottom:50px}.featured-image{min-height:0;height:360px}.featured-copy{padding:32px 28px}.featured h2{font-size:62px}.featured-copy .location{margin-top:18px}.story-grid{grid-template-columns:1fr;gap:38px}.card-image{aspect-ratio:1.2}.stories,.related{padding-bottom:50px}.filters button{padding:15px 15px}.archive-banner{grid-template-columns:1fr;padding-top:40px}.archive-covers{max-width:360px;margin:auto;padding:20px 10px}.archive-banner h2{font-size:42px}.article-heading{padding:35px 5vw}.back{margin-bottom:30px}.article h1{font-size:41px;letter-spacing:-1.5px}.article-category{line-height:1.8}.byline{font-size:13px}.article-image{padding:0 5vw;margin-bottom:28px}.article-image img{max-height:500px}.article-reading{display:flex;flex-direction:column-reverse;padding:0 6vw;gap:20px;margin-bottom:40px}.article-body>p{font-size:20px;line-height:1.7}.article-aside{border-top:1px solid #173c3240;padding-top:20px}.article-aside>a:first-of-type{margin:12px 0}.section-title{align-items:flex-start}.section-title h2{font-size:32px}.section-title>a{font-size:12px;margin-top:8px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
.browse-tools{flex-wrap:wrap}.filters{width:100%}.edition-filter,.category-filter{display:flex;gap:12px;align-items:center;font-size:14px;min-height:44px}.edition-filter select,.category-filter select{font:inherit;font-size:16px;background:transparent;color:var(--ink);border:1px solid #173c3250;border-radius:0;padding:14px 10px;max-width:220px;min-height:44px}.search-label{margin-left:auto}.results-status{font-size:13px;margin:0 0 20px}.pagination{display:flex;align-items:center;justify-content:center;gap:25px;margin:40px 0 0}.pagination button{padding:14px 20px;border:1px solid;background:transparent;color:var(--ink);border-radius:30px;font-size:14px;min-height:44px}.pagination button:disabled{opacity:.35;cursor:default}.pagination span{font-size:14px}.printed-page{margin:20px 0 32px}.printed-page img{width:100%;height:auto;object-fit:contain}.printed-page figcaption{font-size:13px;line-height:1.5;padding-top:8px}.printed-page figcaption a{text-decoration:underline}.original-artwork{border-top:1px solid #173c3240;margin-top:35px;padding-top:20px}.original-artwork summary{font:15px/1.6 Arial,sans-serif;cursor:pointer;display:block;padding:10px 0;min-height:44px}.article-body h2{font-size:27px;line-height:1.3;margin:32px 0 18px}.article-body{min-width:0}.article-image:has(+.article-reading .printed-page){max-width:900px}.eyebrow,.card-meta,.place,.topline,.fine,.section-title>span{font-size:13px}.story-card p{font-size:16px}.filters button,.masthead nav{font-size:14px}@media(max-width:600px){.masthead nav{font-size:12px}.search-label{margin-left:0;width:100%}.edition-filter,.category-filter{width:100%;justify-content:space-between}.edition-filter select,.category-filter select{width:70%;max-width:none}.pagination{gap:14px}.pagination button{padding:12px}.printed-page{margin-left:-3vw;margin-right:-3vw}}

.cultre-mark{height:20px;width:auto;vertical-align:-5px;display:inline-block}
@media(min-width:701px){.cultre-mark{height:30px;vertical-align:-8px}}

/* Tap target: the "Enlarge page" control under printed pages (29 Sep 2026) */
.printed-page figcaption a{display:inline-flex;align-items:center;min-height:44px}

/* Footer standard (29 Sep 2026, FOOTER-STANDARD.md, R1): content role is
   14px everywhere; the tagline is now .foot-name (footer-standard.css),
   which already sets that, so the old .footer-brand+p 16px override above
   is retired rather than changed. */

/* Safe-area padding (R2-07, Bob 86 watch): these pages declare
   viewport-fit=cover in <head> but had no env(safe-area-inset-*), so on an
   iPhone in landscape the masthead, hero, article column and footer could
   sit under the notch/home-indicator curve. Left/right insets only, added on
   top of the existing horizontal padding (never smaller than it). */
.masthead{padding-left:max(5vw,env(safe-area-inset-left));padding-right:max(5vw,env(safe-area-inset-right))}
.intro{padding-left:max(5vw,env(safe-area-inset-left));padding-right:max(5vw,env(safe-area-inset-right))}
.article-reading{padding-left:max(24px,env(safe-area-inset-left));padding-right:max(24px,env(safe-area-inset-right))}
footer{padding-left:max(5vw,env(safe-area-inset-left));padding-right:max(5vw,env(safe-area-inset-right))}
@media(max-width:600px){.article-reading{padding-left:max(6vw,env(safe-area-inset-left));padding-right:max(6vw,env(safe-area-inset-right))}}

/* No accidental blue selection (Vivek 30 Sep 18:4x): masthead nav, filter buttons,
   story-card thumbnails, the featured image and archive covers no longer start a
   text selection or an image-drag ghost on press or drag. Article and story text
   (headline, standfirst, byline, article body, captions, credits, the original-source
   link) and every input stay untouched and selectable. */
button,.masthead nav,.card-image,.round-arrow,.archive-covers img,.featured-image img,
.article-image img{
  user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;
  -webkit-tap-highlight-color:transparent;-webkit-user-drag:none
}

/* Bob 59 QA 30 Sep 21:4x: the story-grid teaser cards (.story-card: the home grid and
   the "related stories" strip at the foot of every article) were never covered here,
   so pressing a card title or standfirst still started a text selection even though
   the whole card is a navigation link, not reading text. The .cultre-mark wordmark
   image (footer credit and the "BY Cultre" hero-note chip) was missed for the same
   reason: it is a small logo image, not a card-image, featured-image or archive-cover.
   (The shared header's own nav links are handled once, site-wide, in site-nav.css.)
   Neither change alters layout (user-select does not affect box size); the article's
   own headline/standfirst/body on the STORY PAGE itself are untouched because that
   markup lives outside .story-card there. */
.story-card,.cultre-mark{
  user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;
  -webkit-tap-highlight-color:transparent;-webkit-user-drag:none
}

/* Bob 66 (mobile/LCP pass 2, 30 Sep): only the first 24 story cards ship in the
   document now; #show-more is the real, always-there link to the rest (feed
   progressive-load target for JS, real crawl/no-JS path to /magazine/page/2/
   otherwise -- see magazine.js and scripts/build_magazine.py). It is a grid
   item like a card (grid-column spans the full row) so appending more cards
   just pushes it down within the existing grid -- no layout recalculation of
   anything above it, and IntersectionObserver fires while it is still below
   the fold, so the push itself is never visible. Same 44px control height as
   the rest of the site (FOOTER-STANDARD.md / R1). */
.show-more{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:14px 20px;margin-top:6px;border:1px solid #173c3250;border-radius:30px;color:var(--ink);background:transparent;font-size:14px;text-decoration:none}
.show-more:hover{text-decoration:underline;text-underline-offset:4px}
/* The no-JS pagination chain (/magazine/page/N/): a plain prev/status/next row,
   same type scale and 44px link targets as the rest of the site. */
.story-pagination{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin:30px 0;font-size:14px}
.story-pagination a{display:inline-flex;align-items:center;min-height:44px}
.story-pagination .pagination-status{font-size:13px}
@media(max-width:600px){.story-pagination{gap:10px}}

/* Tap targets (Bob 59 QA, 1 Oct): at phone widths the covers link collapses to
   20x40; give the link itself a 44px box without changing what is drawn. The
   home footer mark keeps its 24/28px artwork and gains a 44px box by padding
   (the home page only; the other footers use the ::after hit area). */
.archive-covers{min-width:44px;min-height:44px}
@media(max-width:600px){.archive-covers{width:100%;box-sizing:border-box}}
.foot-row .foot-mark-brand{box-sizing:content-box;padding:calc((44px - var(--foot-mark)) / 2) 0;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}

/* V1-STABLE audit: story pages scrolled sideways at 360/390 px because one long unbreakable
   token in a heading (an @handle, a Pali word, an all-caps headline) was wider than the column.
   Let such words wrap, at the source, in the article column. */
.article :is(h1,h2,h3,h4,p,li,blockquote,figcaption){overflow-wrap:anywhere;min-width:0}
/* 44 px tap targets for in-text links (V1-STABLE night-2 audit, 03 Oct): grow the hit area, not the text */
.article-source a{display:inline-block;padding:15px 0;margin:-15px 0}

.catalogue-error{margin:0 0 20px;padding:16px;border:1px solid currentColor;}
.catalogue-error[hidden]{display:none;}
.catalogue-error p{margin:0 0 12px;}
.catalogue-error button{min-height:44px;min-width:44px;padding:12px 20px;border:1px solid currentColor;border-radius:24px;background:transparent;color:var(--ink);font:inherit;cursor:pointer;}

/* Pop bands derived from .intro / .archive-banner; the reading column stays on paper. */
.story-band{background:var(--coral);color:var(--ink)}
.story-band.pop-yellow{background:var(--yellow)}
.story-band.pop-purple{background:var(--purple)}
.story-band .article-category span{color:inherit}
.story-details .article-category span{color:inherit}
.story-details .back{margin-bottom:20px}
.story-details .article-category{margin-bottom:24px}
.stories>.page-band{background:var(--yellow);margin-inline:-5vw;padding:40px 5vw;border:0;color:var(--ink)}
.page-band>a{padding:12px}