/* The landmark page (spec ny-theme/specs/landmark-pages-2026-09-24.md). Loads after site.css, guide.css and home.css; tokens from site.css.
   Look A, the feature (default): full-bleed room, three large pull-quotes, the gallery as season spreads, the map as a chapter.
   Look B, the album (body.lookb): split room on paper, the rules on panel, one horizontal strip per season at true proportions, the map in a rail. */
.lm{--big:560px}
.lmroom{min-height:640px;height:calc(100vh - var(--bar));max-height:900px}
.lmroom .lmtitle{position:relative;z-index:2}
.lmroom .eyebrow{margin-bottom:20px}
.lmroom h1{font-size:clamp(48px,7vw,112px);letter-spacing:-.03em;max-width:12em}
.lmroom .dek{font-size:var(--t4);max-width:40em}
.lm .lmroom .dek .vmark,.lm .lmroom .dek b.vmark{font:600 var(--t0)/1 var(--caps);letter-spacing:.1em;text-transform:uppercase;background:var(--taxi);color:var(--ink);padding:7px 9px 6px;margin-right:10px;vertical-align:2px;white-space:nowrap}
.lm .lmroom .dek .vmark.o{background:#fff}.lm .lmroom .dek .vmark.s{background:var(--ink);color:#fff;outline:1px solid var(--taxi)}
.lmdown{display:inline-flex;align-items:center;gap:12px;margin-top:34px;font:600 var(--t0)/1 var(--caps);letter-spacing:.12em;text-transform:uppercase;color:#fff;text-decoration:none;opacity:.92}
.lmdown i{width:34px;height:2px;background:var(--taxi-dark);position:relative}.lmdown i:after{content:"";position:absolute;right:-1px;top:-4px;width:8px;height:8px;border-right:2px solid var(--taxi-dark);border-bottom:2px solid var(--taxi-dark);transform:rotate(-45deg)}
.lmdown:hover{opacity:1}
/* her rules: three columns under one rule, the sentence large, the post under it */
.rules .bh{margin-bottom:0}
.rulegrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 56px}
.rulegrid.n2{grid-template-columns:repeat(2,minmax(0,1fr))}.rulegrid.n1{grid-template-columns:minmax(0,1fr);max-width:44em}
.rule{padding:30px 0 26px;border-bottom:1px solid var(--line)}
.rule .eyebrow{color:var(--ink);display:block}
.rule blockquote{margin:14px 0 0;padding:0}
.rule blockquote p{margin:0;font:400 clamp(19px,1.5vw,23px)/1.5 var(--body);color:var(--ink);hanging-punctuation:first}
.rule blockquote p:before{content:"\201C"}.rule blockquote p:after{content:"\201D"}
.rule .src{display:inline-block;margin-top:14px;font:500 var(--t0)/1.5 var(--caps);letter-spacing:.1em;text-transform:uppercase;color:var(--mute);text-decoration:none;border-bottom:2px solid var(--taxi);padding-bottom:3px}
.rule .src:hover{color:var(--ink)}
.rules .rv{margin-top:26px}
/* the gallery: one spread per season. The first frame big, the next four a two-by-two, the rest a row of four */
.photographs .sg{margin-top:44px}.photographs .sg:first-of-type{margin-top:34px}
.sgh{display:flex;align-items:baseline;gap:16px;margin-bottom:14px}
.sgh a{text-decoration:none}.sgh h3{font-size:var(--t6);letter-spacing:-.02em}.sgh a:hover h3{text-decoration:underline;text-decoration-color:var(--taxi);text-decoration-thickness:3px}
.sgh span{font:500 var(--t0)/1 var(--caps);letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.spread{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.spread li{margin:0;min-width:0}.spread figure{margin:0;position:relative}
.spread img{width:100%;height:100%;object-fit:cover;display:block;background:var(--panel);cursor:zoom-in}
.spread .big{grid-column:1/5;grid-row:1/3}.spread .big img{aspect-ratio:3/2}
.spread .sq{grid-column:span 1}.spread .sq img{aspect-ratio:1}
.spread .row{grid-column:span 2}.spread .row img{aspect-ratio:4/3}
.spread .big.port img{aspect-ratio:3/2;object-position:50% 30%}
.spread.n1 .big{grid-column:1/-1}.spread.n1 .big img{aspect-ratio:21/9}
.spread.n2 .big,.spread.n3 .big{grid-column:1/5}.spread.n2 .sq,.spread.n3 .sq{grid-column:5/7;grid-row:auto}.spread.n2 .sq img,.spread.n3 .sq img{aspect-ratio:4/3}
.spread.n2 .sq{grid-row:1/3}.spread.n2 .sq img{aspect-ratio:auto;height:100%}
.spread figcaption{display:flex;justify-content:space-between;gap:12px;padding-top:8px}
.spread .gl{font:600 var(--t0)/1.4 var(--caps);letter-spacing:.1em;text-transform:uppercase;color:var(--mute);white-space:nowrap}
.spread .gg{font:500 var(--t1)/1.4 var(--body);color:var(--ink2);text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.spread .gg:hover{color:var(--ink);text-decoration:underline;text-decoration-color:var(--taxi);text-decoration-thickness:2px}
.spread .sq figcaption .gg,.spread .row figcaption .gl{display:none}
.spread .big figcaption{position:absolute;left:12px;bottom:12px;padding:0;pointer-events:none}.spread .big .gl{background:rgba(255,255,255,.94);padding:6px 9px 5px;color:var(--ink)}.spread .big .gg{display:none}
.spread .galink{display:block}.spread .galink:hover img{filter:brightness(1.04)}
/* with me in them */
.herstrip .her{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.herstrip .her img{width:100%;aspect-ratio:2/3;object-fit:cover;display:block;cursor:zoom-in;max-height:520px}
.herstrip figure{margin:0}.herstrip figcaption{padding-top:8px}.herstrip .gg{font:500 var(--t1)/1.4 var(--body);color:var(--ink2);text-decoration:none}
/* every guide it is in: a ledger of doors */
.lrows{list-style:none;margin:0;padding:0}
.lrows li{border-bottom:1px solid var(--line)}
.lrows a{display:grid;grid-template-columns:128px minmax(0,1fr) auto;gap:0 22px;align-items:center;padding:14px 0;text-decoration:none}
.lrows .lph{display:block;aspect-ratio:4/3;background:var(--panel) center/cover no-repeat}
.lrows b{display:block;font:700 var(--t4)/1.3 var(--body)}
.lrows .ll{display:block;margin-top:6px;font:400 var(--t2)/1.5 var(--body);color:var(--ink2)}
.lrows .lg{font:600 var(--t0)/1 var(--caps);letter-spacing:.1em;text-transform:uppercase;padding:8px 9px 7px;white-space:nowrap;align-self:start;margin-top:4px}
.lrows .lg.w{background:var(--taxi)}.lrows .lg.o{border:1px solid var(--ink)}.lrows .lg.s{background:var(--ink);color:#fff}.lrows .lg.x{background:var(--ink);color:#fff}
.lrows li.noph a{grid-template-columns:minmax(0,1fr) auto}
.lrows a:hover b{text-decoration:underline;text-decoration-color:var(--taxi);text-decoration-thickness:2px}
.lmore{margin-top:18px}
/* where it is: the map as a chapter, the roster beside it */
.mapgrid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:0 48px;margin-top:22px;align-items:start}
.lm .stage.lmmap{position:relative;top:auto;height:auto;background:none}
.lm .lmmap #map{position:relative;inset:auto;width:100%;aspect-ratio:3/2;min-height:360px}
.lm .lmmap .whgo{display:inline-block;margin-top:12px;font:600 var(--t0)/1 var(--caps);letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border-bottom:2px solid var(--taxi);padding-bottom:5px;color:var(--ink)}
.mapgrid .nearl{grid-template-columns:1fr;gap:0;margin:0}
/* the pin hover card (guide.js writes e.clientX/e.clientY, viewport coordinates, into #hov's
   inline left/top): this page also loads home.css for the "every guide it's in" thumbnails'
   dependency chain, and home.css's later .hov{position:absolute} rule was winning the cascade
   over guide.css's .hov{position:fixed}, so the card rendered thousands of pixels above the
   map instead of beside the cursor. #hov (an id) outranks both class rules regardless of load
   order, so this holds even if the enqueue chain changes again. */
#hov{position:fixed}
.eatdoor{display:block;margin-top:22px;padding:18px 0 0;border-top:2px solid var(--ink);text-decoration:none}
.eatdoor b{display:block;font:600 var(--t5)/1.15 var(--disp);letter-spacing:-.01em;margin:6px 0}
.eatdoor span:last-child{font:400 var(--t1)/1.4 var(--body);color:var(--mute)}
.eatdoor:hover b{text-decoration:underline;text-decoration-color:var(--taxi);text-decoration-thickness:3px}
/* the year: a season ledger, only the rows that exist */
.yrows{list-style:none;margin:0;padding:0}
.yrows li{display:grid;grid-template-columns:240px minmax(0,1fr);gap:0 32px;padding:22px 0;border-bottom:1px solid var(--line);align-items:start}
.yph{display:block;aspect-ratio:3/2;background:var(--line) center/cover no-repeat}
.yrows li.noph{grid-template-columns:minmax(0,1fr)}
.yrows .yn{display:inline-block;font:600 var(--t6)/1 var(--disp);letter-spacing:-.02em;text-decoration:none}
a.yn:hover{text-decoration:underline;text-decoration-color:var(--taxi);text-decoration-thickness:3px}
.yrows .yg,.yrows .ye{list-style:none;margin:12px 0 0;padding:0}
.yrows .yg li{font:400 var(--t2)/1.6 var(--body)}.yrows .yg a{color:var(--ink);text-decoration:none;border-bottom:2px solid var(--taxi)}.yrows .yg a:hover{background:var(--taxi)}
.yrows .ye{margin-top:14px;border-top:1px solid var(--line);padding-top:10px}
.yrows .ye li{display:flex;gap:10px;align-items:baseline;font:400 var(--t2)/1.6 var(--body)}
.yrows .ye b{font:800 var(--t2)/1 var(--disp);min-width:52px}.yrows .ye a{color:var(--ink);text-decoration:none}.yrows .ye a:hover{text-decoration:underline;text-decoration-color:var(--taxi);text-decoration-thickness:2px}
.yrows .ye span{font:500 var(--t0)/1 var(--caps);letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
/* the seal */
.sealrow{display:grid;grid-template-columns:150px minmax(0,1fr);gap:40px;align-items:center}
.sealrow>svg{width:150px;height:150px}
.sealrow h2{font-size:var(--t6);margin-top:8px;max-width:18em}
.seallists{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 22px}
.seallists a{font:700 var(--t2)/1.5 var(--body);color:var(--ink);text-decoration:none;border-bottom:2px solid var(--taxi)}.seallists a:hover{background:var(--taxi)}
/* the lightbox carries the guide door */
.lbx .lbgo{color:#fff;font-weight:700;border-bottom:2px solid var(--taxi);text-decoration:none}
.lm .practical{border-bottom:2px solid var(--ink);background:#fff}
.lm .practical dl{display:flex;flex-wrap:wrap;gap:14px 40px;margin:0;padding:18px 0}
.lm .practical dt{font:600 var(--t0)/1 var(--caps);letter-spacing:.1em;text-transform:uppercase;color:var(--mute);margin-bottom:6px}
.lm .practical dd{margin:0;font:400 var(--t2)/1.35 var(--body)}
.lm .practical dd a{color:var(--ink);font-weight:700;text-decoration:none;border-bottom:2px solid var(--taxi);margin-left:4px}.lm .practical dd a:first-child{margin-left:0}
.lm .tabs,.lm .sheet{display:none!important}

/* ---------- Look B, the album ---------- */
body.lookb .lmroom{background:var(--paper);color:var(--ink);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:0;padding:0;height:auto;min-height:0;max-height:none;border-bottom:2px solid var(--ink)}
body.lookb .lmroom:before{display:none}
body.lookb .lmroom .lmtitle{padding:64px var(--gut) 56px;align-self:end;order:1}
body.lookb .lmroom .lmframe{order:2;min-height:560px;max-height:calc(100vh - var(--bar))}
body.lookb .lmroom .lmframe img{width:100%;height:100%;object-fit:cover;display:block}
body.lookb .lmroom .eyebrow{color:var(--mute)}body.lookb .lmroom .eyebrow span{color:var(--ink);opacity:1}
body.lookb .lmroom h1{font-size:clamp(44px,5.6vw,88px)}body.lookb .lmroom h1 em{color:var(--ink)}
body.lookb .lmroom .dek{opacity:1;color:var(--ink2)}body.lookb .lmroom .vmark{background:var(--taxi);color:var(--ink)}
body.lookb .lmroom .by span{opacity:1;color:var(--mute)}body.lookb .lmroom .by a{color:var(--ink);border-bottom-color:var(--taxi)}
body.lookb .lmdown{color:var(--ink)}body.lookb .lmdown i,body.lookb .lmdown i:after{background-color:var(--ink);border-color:var(--ink)}
body.lookb .rules{background:var(--panel)}
body.lookb .rulegrid{gap:0 40px}body.lookb .rule{border-bottom:0;border-top:2px solid var(--ink);padding-top:18px}
body.lookb .rule blockquote p{font-size:var(--t3);line-height:1.65}
/* B: one strip per season at true proportions, scroll-snapped */
body.lookb .spread{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;margin:0 calc(-1 * var(--gut));padding-left:var(--gut);padding-right:var(--gut);scrollbar-width:thin}
body.lookb .spread li{flex:0 0 auto;scroll-snap-align:start;grid-column:auto!important;grid-row:auto!important}
body.lookb .spread img,body.lookb .spread.n1 .big img,body.lookb .spread.n2 .sq img,body.lookb .spread.n3 .sq img{height:440px;width:auto;max-width:80vw;aspect-ratio:auto!important;object-fit:contain}
body.lookb .spread .big figcaption{position:static;pointer-events:auto;padding-top:8px}body.lookb .spread .big .gl{background:none;padding:0;color:var(--mute)}
body.lookb .spread .big .gg,body.lookb .spread .sq figcaption .gg,body.lookb .spread .row figcaption .gl{display:block}
body.lookb .spread figcaption{flex-direction:column;gap:2px}
body.lookb .sgh{border-bottom:2px solid var(--ink);padding-bottom:8px}
/* B: the map rides in a rail beside the ledger */
@media (min-width:981px){
 body.lookb .lower.withrail{display:grid;grid-template-columns:minmax(0,1fr) 42%;gap:0;align-items:start}
 body.lookb .lower.withrail .lcol .wrap{padding-right:0}
 body.lookb .lmrail{position:sticky;top:var(--bar);padding:0}
 body.lookb .lmrail .mapchap{border-top:0;padding:64px 0 64px 40px}
 body.lookb .lmrail .mapgrid{grid-template-columns:1fr;gap:20px}
 body.lookb .lmrail .lmmap #map{aspect-ratio:4/3;min-height:300px}
 body.lookb .lmrail .wrap{padding-left:0;padding-right:var(--gut)}
}
/* ---------- phones ---------- */
@media (max-width:980px){
 .rulegrid,.rulegrid.n2{grid-template-columns:1fr;gap:0}
 .mapgrid{grid-template-columns:1fr;gap:28px}
 .yrows li{grid-template-columns:150px minmax(0,1fr);gap:0 18px}
 .herstrip .her{grid-template-columns:repeat(2,minmax(0,1fr))}
 .sealrow{grid-template-columns:1fr;gap:20px}.sealrow>svg{width:120px;height:120px}
 body.lookb .lmroom{grid-template-columns:1fr}body.lookb .lmroom .lmtitle{order:2;padding:28px var(--gut) 36px}body.lookb .lmroom .lmframe{order:1;min-height:0;max-height:none}body.lookb .lmroom .lmframe img{aspect-ratio:4/5;max-height:70vh}
}
@media (max-width:820px){
 .lmroom{min-height:0;height:82vh;height:82dvh;max-height:none;padding-bottom:30px}
 .lmroom h1{font-size:clamp(40px,12vw,56px)}
 .lmroom .eyebrow span{display:inline}
 .lmdown{margin-top:22px}
 .rule blockquote p{font-size:18px}
 .spread{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .spread .big{grid-column:1/-1;grid-row:auto}.spread .big img{aspect-ratio:4/3}
 .spread .sq{grid-column:span 1}.spread .row{grid-column:span 1}.spread .row img{aspect-ratio:1}
 .spread.n2 .sq,.spread.n3 .sq{grid-column:span 1;grid-row:auto}.spread.n2 .sq img,.spread.n3 .sq img{aspect-ratio:1;height:auto}
 .spread .big figcaption{left:8px;bottom:8px}
 .lrows a{grid-template-columns:96px minmax(0,1fr);gap:0 14px}.lrows .lg{grid-column:2;justify-self:start;margin-top:8px}
 .lrows b{font-size:var(--t3)}.lrows .ll{display:none}
 .yrows li{grid-template-columns:1fr;gap:12px}.yph{max-width:100%}
 .lm .lmmap #map{aspect-ratio:4/5;min-height:0}
 body.lookb .spread img,body.lookb .spread.n1 .big img,body.lookb .spread.n2 .sq img,body.lookb .spread.n3 .sq img{height:340px;max-width:86vw}
 .sealrow h2{font-size:var(--t5)}
}
@media (max-width:360px){.lmroom h1{font-size:38px}}