/* Life is Ohsem. A house you walk through. Plaster, garden green and lamp amber, one terracotta accent. */
@font-face{font-family:'Instrument Serif';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/instrument-serif-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Instrument Serif';font-style:italic;font-weight:400;font-display:swap;src:url(/assets/fonts/instrument-serif-latin-400-italic.woff2) format('woff2')}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/hanken-grotesk-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/hanken-grotesk-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/hanken-grotesk-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/jetbrains-mono-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/jetbrains-mono-latin-500-normal.woff2) format('woff2')}
:root{
  --bg:#ECE7DE; --bg2:#E2DBCE; --ink:#1E1B17; --ink2:#4B453C; --line:#CFC6B6;
  --oak:#9A4A27; --glow:#E0A458; --glass:#AFC0C6; --night:#14201B; --onnight:#ECE7DE; --night2:#2A3D33;
  --f-display:'Instrument Serif',Georgia,serif;
  --f-body:'Hanken Grotesk','Helvetica Neue',Arial,sans-serif;
  --f-mono:'JetBrains Mono',ui-monospace,Menlo,monospace;
  --f-accent:'Instrument Serif',Georgia,serif;
  --gut:max(16px,env(safe-area-inset-left,0px));
}
:root[data-theme="dark"]{
  --bg:#0E1512; --bg2:#16211C; --ink:#ECE7DE; --ink2:#B4BBAE; --line:#26352E; --oak:#E0A458; --glass:#3A4A52; --night:#08100D; --night2:#1D2D25; color-scheme:dark}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer}
img,svg{max-width:100%}
:focus-visible{outline:2px solid var(--oak);outline-offset:3px;border-radius:2px}
.wrap{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.in{max-width:1360px;margin:0 auto}
.mono{font-family:var(--f-mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase}
.muted{color:var(--ink2)}
h1,h2,h3,h4{font-family:var(--f-display);font-weight:400;letter-spacing:-.02em;line-height:1;margin:0;text-wrap:balance}
.sr{position:absolute;left:-9999px}

/* header */
.hdr{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--bg)}
.hdr .in{display:flex;align-items:center;gap:20px;padding-block:14px}
.pill{font-size:13px;font-weight:600;border:1.5px solid var(--ink);border-radius:999px;padding:10px 20px;white-space:nowrap}
.pill:hover{background:var(--ink);color:var(--bg)}
@media(max-width:980px){.pill{display:none}}
.logo{font-family:var(--f-display);font-weight:400;font-size:32px;letter-spacing:-.01em;white-space:nowrap;line-height:1}
.logo i{font-family:var(--f-display);font-style:italic}
.nav a{padding:6px 0;border-bottom:2px solid transparent}
.nav a:hover,.nav a[aria-current="page"]{border-color:var(--oak)}
.ibtn{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:transparent}
.ibtn:hover{border-color:var(--ink)}
.menu-btn{display:none}
.progress{position:absolute;left:0;bottom:-1px;height:3px;width:0;background:var(--oak)}
@media(max-width:980px){.nav{display:none}.menu-btn{display:grid}.hdr .in{gap:10px}.logo{margin-right:auto}}

/* search */

/* ribbon */
.rib{display:flex;flex-wrap:wrap;gap:6px 28px;justify-content:space-between;padding-block:12px;color:var(--ink2);border-bottom:1px solid var(--line)}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--glow);box-shadow:0 0 12px var(--glow);margin-right:8px}

/* facade */
.facade{position:relative;padding-top:clamp(20px,4vw,56px);overflow:hidden}
.mark{font-family:var(--f-display);font-weight:800;text-transform:uppercase;font-size:clamp(76px,16vw,250px);line-height:.82;letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1.5px var(--ink);user-select:none}
.mark span{display:block}
.mark span+span{text-align:right}
.wins{position:relative;z-index:2;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;align-items:end;margin-top:calc(-1 * clamp(16px,3.6vw,56px));padding-bottom:8px}
.win{display:block;position:relative}
.win .pane{position:relative;overflow:hidden;background:var(--night);transition:transform .35s,box-shadow .35s,opacity .3s}
.win:nth-child(1) .pane{aspect-ratio:3/5.4;border-radius:999px 999px 0 0}
.win:nth-child(2) .pane{aspect-ratio:3/6.4}
.win:nth-child(3) .pane{aspect-ratio:3/5.6;border-radius:999px 999px 0 0}
.win:nth-child(4) .pane{aspect-ratio:3/6.8}
.win:nth-child(5) .pane{aspect-ratio:3/5.8;border-radius:999px 999px 0 0}
.win:nth-child(6) .pane{aspect-ratio:3/6.1}
.pane svg{position:absolute;inset:0;width:100%;height:100%}
.pane::before,.pane::after{content:"";position:absolute;background:rgba(15,18,20,.38);z-index:2}
.pane::before{left:50%;top:0;bottom:0;width:3px;transform:translateX(-50%)}
.pane::after{top:38%;left:0;right:0;height:3px}
.pane .shine{position:absolute;inset:0;background:linear-gradient(155deg,rgba(255,255,255,.28),rgba(255,255,255,0) 42%);z-index:3;pointer-events:none}
.pane .lab{position:absolute;left:14px;right:14px;bottom:14px;z-index:4;color:#fff;display:flex;flex-direction:column;gap:2px}
.pane .lab b{font-family:var(--f-display);font-size:32px;letter-spacing:-.02em;line-height:1}
.pane .scrim{position:absolute;inset:auto 0 0 0;height:45%;background:linear-gradient(0deg,rgba(10,12,14,.78),rgba(10,12,14,0));z-index:3}
.wins:hover .win:not(:hover) .pane{opacity:.5}
.win:hover .pane,.win:focus-visible .pane{transform:translateY(-10px);box-shadow:0 0 0 1px var(--glow),0 0 70px -6px rgba(255,196,107,.55)}
.win .cap{margin-top:12px;font-size:13.5px;line-height:1.35;color:var(--ink2);min-height:4.3em}
.win .cap b{display:block;color:var(--ink);font-weight:500}
@media(max-width:980px){
  .wins{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin-inline:calc(-1 * max(16px,env(safe-area-inset-left,0px)));padding-inline:max(16px,env(safe-area-inset-left,0px));scrollbar-width:none}
  .win{flex:0 0 min(58vw,260px);scroll-snap-align:start}
}
.ground{height:10px;background:var(--ink);margin-top:0}

/* section heads */
.sec{padding-block:clamp(56px,8vw,112px)}
.sech{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 32px;margin-bottom:32px;padding-bottom:18px;border-bottom:1.5px solid var(--ink)}
.sech h2{font-size:clamp(48px,7vw,104px)}
.sech .no{display:block;color:var(--oak);margin-bottom:10px}
.more{font-weight:600;font-size:14px;border-bottom:1.5px solid var(--oak);padding-bottom:2px}
.more:hover{color:var(--oak)}

/* cards */
.thumb{position:relative;overflow:hidden;background:var(--night);aspect-ratio:4/3}
.thumb svg{position:absolute;inset:0;width:100%;height:100%;transition:transform .6s}
a:hover>.thumb svg,a:hover .thumb svg{transform:scale(1.05)}
.meta{display:flex;flex-wrap:wrap;gap:4px 14px;color:var(--ink2);margin:14px 0 8px}
.meta .r{color:var(--oak);font-weight:500}
.ct{font-size:clamp(25px,2.4vw,34px);font-weight:400;line-height:1.08}
.cd{margin:8px 0 0;color:var(--ink2);font-size:15.5px;line-height:1.5}
a.card:hover .ct{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px;text-decoration-color:var(--oak)}
.grid3{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:40px 28px}

/* table */
.table{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:28px}
.big{grid-column:1 / span 8;position:relative}
.big .thumb{aspect-ratio:16/10}
.big .over{position:relative;margin:-64px 0 0 clamp(16px,6vw,96px);background:var(--bg);padding:28px 32px 4px 28px;max-width:660px}
.big .over h3{font-size:clamp(34px,4.6vw,66px)}
.side{grid-column:9 / span 4;display:flex;flex-direction:column;gap:22px;border-left:1px solid var(--line);padding-left:28px}
.row{display:grid;grid-template-columns:104px minmax(0,1fr);gap:16px;align-items:start}
.row .thumb{aspect-ratio:1}
.row .ct{font-size:19px}
@media(max-width:980px){.big,.side{grid-column:1/-1}.side{border:0;padding:0}.big .over{margin-left:0;margin-top:-40px;padding-right:16px}}

/* kitchen */
.kit{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:32px}
.kit .lead{grid-column:1 / span 7}
.kit .lead .thumb{aspect-ratio:5/4}
.kit .lead .ct{font-size:clamp(30px,3.6vw,52px)}
.kit .rest{grid-column:8 / span 5;display:flex;flex-direction:column;gap:26px}
@media(max-width:980px){.kit .lead,.kit .rest{grid-column:1/-1}}
/* terrace */
.car{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;scrollbar-width:thin}
.car .card{flex:0 0 min(78vw,340px);scroll-snap-align:start}
.car .thumb{aspect-ratio:3/4}
.arrows{display:flex;gap:8px}
/* gallery */
.tl{display:flex;flex-direction:column}
.ev{display:grid;grid-template-columns:96px minmax(0,1fr) 180px;gap:24px;align-items:center;padding:22px 0;border-bottom:1px solid var(--line)}
.ev .day{font-family:var(--f-display);font-size:72px;font-weight:400;letter-spacing:-.02em;line-height:.9}
.ev .day small{display:block;font-family:var(--f-mono);font-size:11px;font-weight:400;letter-spacing:.1em;text-transform:uppercase;color:var(--oak);margin-top:6px}
.ev .thumb{aspect-ratio:3/2}
.ev:hover .ct{color:var(--oak)}
@media(max-width:700px){.ev{grid-template-columns:72px minmax(0,1fr)}.ev .thumb{display:none}.ev .day{font-size:44px}}
/* living */
.mos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;grid-auto-flow:dense}
.mos .card:nth-child(1){grid-column:span 2;grid-row:span 2}
.mos .card:nth-child(1) .thumb{aspect-ratio:1}
.mos .card:nth-child(4){grid-column:span 2}
.mos .card:nth-child(4) .thumb{aspect-ratio:2/1}
@media(max-width:900px){.mos{grid-template-columns:repeat(2,minmax(0,1fr))}.mos .card:nth-child(4){grid-column:span 2}}
@media(max-width:520px){.mos{grid-template-columns:1fr}.mos .card:nth-child(n){grid-column:auto;grid-row:auto}.mos .card .thumb{aspect-ratio:4/3!important}}
/* study */
.rv{display:grid;grid-template-columns:84px minmax(0,1fr) 150px;gap:24px;align-items:center;padding:22px 0;border-bottom:1px solid var(--line)}
.score{width:76px;height:76px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--oak) calc(var(--p)*1%),var(--line) 0);position:relative}
.score::before{content:"";position:absolute;inset:7px;border-radius:50%;background:var(--bg)}
.score b{position:relative;font-family:var(--f-display);font-size:30px;font-weight:400}
.rv .thumb{aspect-ratio:1}
.rv:hover .ct{color:var(--oak)}
@media(max-width:700px){.rv{grid-template-columns:64px minmax(0,1fr)}.rv .thumb{display:none}.score{width:60px;height:60px}.score b{font-size:19px}}
/* playroom */
.soft{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr));gap:20px}
.soft .card{background:var(--bg2);border-radius:30px;padding:14px 14px 24px;display:block}
.soft .thumb{border-radius:20px}
.soft .meta,.soft .ct,.soft .cd{margin-inline:10px}

/* letter */
.letter{background:var(--night);color:var(--onnight)}
.letter .in{display:flex;flex-wrap:wrap;gap:40px 72px;align-items:center;justify-content:space-between}
.letter h2{font-size:clamp(52px,8vw,124px);flex:1 1 440px}
.letter h2 i{color:var(--glow)}
.letter form{flex:1 1 360px;max-width:520px}
.letter label{display:block;color:#A9ADAD;font-size:15px;margin-bottom:14px}
.letter .f{display:flex;flex-wrap:wrap;gap:12px}
.letter input{flex:1 1 220px;min-width:0;background:transparent;color:var(--onnight);border:1.5px solid #4A5055;padding:16px 20px;font:inherit;border-radius:0}
.letter input:focus{border-color:var(--glow);outline:none}
.btn{background:var(--glow);color:#16181A;border:0;padding:16px 28px;font-weight:600;border-radius:0}
.btn:hover{filter:brightness(1.08)}
.ok{margin-top:14px;color:var(--glow);font-size:15px}

/* footer */
.foot{padding-block:48px 56px}
.foot .in{display:flex;flex-wrap:wrap;gap:24px 56px;justify-content:space-between;align-items:flex-end}
.foot .logo{font-size:clamp(48px,7vw,88px)}
.foot .logo i{font-size:1.1em}
.foot nav{display:flex;flex-wrap:wrap;gap:8px 24px;font-weight:500;font-size:15px}
.foot p{flex:1 1 100%;margin:0;color:var(--ink2)}

/* room page */
.rhead{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:28px;align-items:end;padding-block:clamp(32px,5vw,64px)}
.rhead .t{grid-column:1 / span 7}
.rhead .t h1{font-size:clamp(72px,13vw,200px);margin:14px 0 18px}
.rhead .t p{max-width:520px;color:var(--ink2);margin:0;font-size:18px}
.rhead .a{grid-column:8 / span 5}
.rhead .a .thumb{aspect-ratio:4/3;border-radius:999px 999px 0 0}
@media(max-width:900px){.rhead .t,.rhead .a{grid-column:1/-1}.rhead .a .thumb{aspect-ratio:16/10;border-radius:999px 999px 0 0}}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:32px}
.chip{border:1.5px solid var(--ink);background:transparent;padding:8px 18px;font-weight:500;font-size:14px;border-radius:999px}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--bg)}

/* article */
.ahead{padding-block:clamp(32px,5vw,72px) 36px;max-width:1100px}
.ahead h1{font-size:clamp(52px,8vw,128px);margin:18px 0 28px}
.ahead .by{display:flex;flex-wrap:wrap;gap:8px 36px;padding-top:18px;border-top:1.5px solid var(--ink);color:var(--ink2)}
.hero{aspect-ratio:21/9;min-height:240px;position:relative;overflow:hidden;background:var(--night)}
.hero svg{position:absolute;inset:0;width:100%;height:100%}
.abody{display:grid;grid-template-columns:200px minmax(0,680px);gap:40px 80px;padding-block:72px;justify-content:center}
.toc{position:sticky;top:calc(84px + env(safe-area-inset-top,0px));align-self:start;display:flex;flex-direction:column;gap:10px;font-size:14px}
.toc a{color:var(--ink2)}
.toc a:hover{color:var(--oak)}
.toc .mono{color:var(--ink);margin-bottom:6px}
@media(max-width:900px){.abody{grid-template-columns:minmax(0,1fr)}.toc{display:none}}
.prose{font-size:19px;line-height:1.75}
.prose p{margin:0 0 26px}
.prose .lede{font-family:var(--f-display);font-size:clamp(28px,3vw,38px);line-height:1.2;font-weight:400;letter-spacing:-.01em}
.prose h2{font-size:clamp(30px,3.6vw,44px);margin:56px 0 18px;scroll-margin-top:100px}
.prose .dc::first-letter{font-family:var(--f-display);font-weight:400;float:left;font-size:104px;line-height:.78;padding:8px 14px 0 0;color:var(--oak)}
.prose blockquote{margin:48px 0;padding:0 0 0 28px;border-left:3px solid var(--oak);font-family:var(--f-display);font-style:italic;font-size:clamp(34px,4vw,54px);line-height:1.12;color:var(--ink)}
.prose figure{margin:48px 0}
.prose figure .thumb{aspect-ratio:3/2}
.prose figcaption{margin-top:10px;color:var(--ink2)}
.know{margin:44px 0;padding:24px 28px;background:var(--bg2);display:grid;grid-template-columns:auto 1fr;gap:8px 28px;font-size:16px}
.know dt{font-family:var(--f-mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--oak);padding-top:3px}
.know dd{margin:0}
.tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:40px}
.tags span{border:1.5px solid var(--ink);padding:6px 16px;font-size:14px;font-weight:500;border-radius:999px}
.author{background:var(--bg2);padding-block:56px}
.author .in{display:flex;flex-wrap:wrap;gap:24px 40px;align-items:center}
.ava{width:112px;height:112px;border-radius:50%;overflow:hidden;position:relative;flex:0 0 auto}
.ava svg{position:absolute;inset:0;width:100%;height:100%}
.author h3{font-size:46px;margin:6px 0}
.author p{margin:0;max-width:560px;color:var(--ink2)}
.pn{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line)}
.pn a{padding:36px var(--gut);display:block}
.pn a+a{border-left:1px solid var(--line);text-align:right}
.pn a:hover{background:var(--bg2)}
.pn .ct{font-size:clamp(28px,3vw,44px);margin-top:8px}

/* about */
.about{padding-block:clamp(40px,6vw,88px);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:36px}
.about h1{grid-column:1/-1;font-size:clamp(64px,11vw,170px)}
.about .l{grid-column:1 / span 6;font-size:19px;line-height:1.7}
.about .r{grid-column:8 / span 5}
.about .r .thumb{aspect-ratio:3/4;border-radius:999px 999px 0 0}
@media(max-width:900px){.about .l,.about .r{grid-column:1/-1}}

@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}html{scroll-behavior:auto}}

/* strip + hero */
.strip{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 24px;padding-block:13px;color:var(--ink2);border-bottom:1px solid var(--line)}
.hero2{padding-block:clamp(24px,4vw,56px) clamp(64px,8vw,112px)}
.hero2 .in{display:flex;flex-wrap:wrap;gap:40px;align-items:flex-end}
.hero2 .l{flex:1 1 520px;min-width:0}
.hero2 h1{font-size:clamp(76px,12.5vw,196px);line-height:.9;letter-spacing:-.035em}
.hero2 h1 em{color:var(--oak)}
.hero2 .now{display:block;margin-top:44px;max-width:520px;padding-top:16px;border-top:1.5px solid var(--ink)}
.hero2 .now:hover{color:var(--oak)}
.hero2 .now b{display:block;font-family:var(--f-display);font-weight:400;font-size:clamp(26px,2.8vw,36px);line-height:1.1;margin-top:8px;color:var(--ink)}
.hero2 .r{flex:1 1 440px;min-width:0;position:relative;height:clamp(460px,48vw,660px);max-width:660px}
.arch{position:absolute;right:0;top:0;width:72%;height:100%;border-radius:999px 999px 0 0;overflow:hidden;background:var(--night)}
.arch svg,.plate svg{position:absolute;inset:0;width:100%;height:100%}
.arch::after{content:"";position:absolute;left:0;right:0;bottom:0;height:34%;background:linear-gradient(180deg,rgba(20,14,8,0),rgba(20,14,8,.55))}
.arch span,.plate span{position:absolute;left:22px;bottom:18px;z-index:2;color:#F6F1E7}
.plate{position:absolute;left:0;bottom:48px;width:46%;height:38%;overflow:hidden;background:var(--night);box-shadow:0 30px 60px -24px rgba(30,27,23,.5)}
.plate span{left:14px;bottom:12px;font-size:10px}
.badge{position:absolute;right:-4px;top:-12px;z-index:3;width:96px;height:96px;border-radius:50%;background:var(--oak);color:#F6F1E7;display:grid;place-items:center;text-align:center;line-height:1.4;transform:rotate(8deg)}
html[data-theme="dark"] .badge{background:var(--glow);color:#1E1B17}

/* floor plan */
.plan{background:var(--night);color:var(--onnight);padding-block:clamp(64px,8vw,112px)}
.plan h2{font-size:clamp(52px,7.5vw,112px)}
.plan h2 em{color:var(--glow)}
.phead{display:flex;flex-wrap:wrap;gap:24px 64px;justify-content:space-between;align-items:flex-end;margin-bottom:56px}
.phead p{margin:0;max-width:380px;color:#B4BBAE}
.pbody{display:flex;flex-wrap:wrap;gap:40px}
.pl{flex:1 1 560px;min-width:0}
.pgrid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:repeat(3,minmax(120px,1fr));border:2px solid var(--onnight);min-height:480px}
.cell{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;gap:8px;text-align:left;padding:20px;border:1px solid var(--onnight);border-width:0 1px 1px 0;margin:0 -1px -1px 0;background:transparent;color:var(--onnight)}
.cell:hover{background:#1E2F27}
.cell[aria-pressed="true"]{background:var(--night2);box-shadow:inset 0 0 0 2px var(--glow)}
.cell .nm{font-family:var(--f-display);font-size:clamp(28px,3.4vw,46px);line-height:1}
.cell .tp{font-size:12px;color:#B4BBAE}
.cell .no{color:var(--glow)}
.cell:nth-child(3),.cell:nth-child(6){padding:14px}.cell:nth-child(3) .nm,.cell:nth-child(6) .nm{font-size:clamp(20px,2.1vw,28px)}
.cell:nth-child(1){grid-area:1/1/3/4}.cell:nth-child(2){grid-area:1/4/2/7}.cell:nth-child(3){grid-area:2/4/3/6}
.cell:nth-child(4){grid-area:3/1/4/4}.cell:nth-child(5){grid-area:3/4/4/7}.cell:nth-child(6){grid-area:2/6/3/7}
.pnote{display:flex;justify-content:space-between;margin-top:14px;color:#8E9A92}
.pv{flex:1 1 380px;min-width:0;max-width:520px}
.pv .thumb{aspect-ratio:4/3;border-radius:999px 999px 0 0}
.pv .k{margin:24px 0 8px;color:var(--glow)}
.pv h3{font-size:clamp(34px,3.6vw,50px);color:var(--onnight)}
.pv a.go{display:inline-block;margin-top:20px;font-weight:600;font-size:14px;border-bottom:1.5px solid var(--glow);padding-bottom:3px}
.pv a.go:hover{color:var(--glow)}
.pv .alt{display:block;margin-top:14px;color:#B4BBAE;font-size:15px}
.pv .alt:hover{color:var(--glow)}

/* feature band */
.band{display:flex;flex-wrap:wrap;background:#E0A458;color:#1E1B17}
.band .l{flex:1 1 480px;min-width:0;padding:clamp(64px,8vw,112px) var(--gut);display:flex;flex-direction:column;justify-content:center}
.band h2{font-size:clamp(48px,6.4vw,100px);line-height:.95;letter-spacing:-.025em}
.band p{margin:28px 0 0;max-width:460px;font-size:17px;color:#2E2410}
.band .btn2{margin-top:36px;align-self:flex-start;background:#1E1B17;color:#F6F1E7;font-size:14px;font-weight:600;padding:16px 28px;border-radius:999px}
.band .btn2:hover{background:#000;color:#fff}
.band .r{flex:1 1 480px;min-width:0;min-height:520px;position:relative;background:var(--night);overflow:hidden}
.band .r svg{position:absolute;inset:0;width:100%;height:100%}

/* most read + topics */
.two{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:56px}
@media(max-width:900px){.two{grid-template-columns:1fr}}
.mr{list-style:none;margin:0;padding:0;counter-reset:m}
.mr li{border-bottom:1px solid var(--line)}
.mr a{display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:16px;align-items:baseline;padding:20px 4px}
.mr a:hover{background:var(--bg2)}
.mr .n{font-family:var(--f-display);font-size:44px;line-height:1;color:var(--oak)}
.mr .t{font-family:var(--f-display);font-size:clamp(26px,2.6vw,34px);line-height:1.08}
.topics{display:flex;flex-wrap:wrap;gap:10px}
.topics button{border:1.5px solid var(--ink);background:transparent;border-radius:999px;padding:9px 18px;font-weight:500;font-size:14px}
.topics button:hover{background:var(--ink);color:var(--bg)}
.crd{border:1.5px solid var(--ink);padding:28px}
.crd h3{font-size:34px;margin-bottom:10px}
.crd p{margin:0 0 18px;color:var(--ink2);font-size:15.5px}
.idx a.card{display:flex;flex-wrap:wrap;gap:8px 32px;align-items:baseline;padding:28px 8px;border-bottom:1px solid var(--line)}
.idx a.card:hover{background:var(--bg2)}
.idx .n{flex:0 0 56px;color:var(--ink2)}
.idx .tt{flex:1 1 380px;min-width:0;font-family:var(--f-display);font-size:clamp(28px,3.2vw,44px);line-height:1.08}
.idx .rm{flex:0 0 140px;font-size:13px;font-weight:600;color:var(--oak)}
.idx .mt{flex:0 0 130px;color:var(--ink2)}

/* ---- real-site parts ---- */
.skip{position:absolute;left:-9999px;top:0;z-index:99;background:var(--ink);color:var(--bg);padding:10px 16px}
.skip:focus{left:8px;top:8px}
.nav{display:flex;gap:4px 22px;margin-left:auto;font-size:14px;font-weight:500;flex-wrap:wrap}
.thumb{display:block;position:relative;overflow:hidden;background:var(--night);aspect-ratio:var(--ar,4/3)}
.thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s}
a:hover>.thumb img,a:hover .thumb img{transform:scale(1.04)}
.thumb.fill{position:absolute;inset:0;aspect-ratio:auto}
.arcbox{border-radius:999px 999px 0 0}
.hero .im,.hero .thumb{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto}
.hero .im img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero figure,figure.hero{margin:0}
.im{display:block;position:relative;overflow:hidden;aspect-ratio:var(--ar,16/10)}
.sr{position:absolute;left:-9999px}
.ibtn .i-sun{display:none}
html[data-theme="dark"] .ibtn .i-sun{display:block}html[data-theme="dark"] .ibtn .i-moon{display:none}
.sechr{display:flex;gap:24px;align-items:center}
.stackc{display:flex;flex-direction:column;gap:40px}
.mnav[hidden],.srch[hidden]{display:none}
.mnav{position:fixed;inset:0;z-index:40;background:var(--night);color:var(--onnight);padding:calc(24px + env(safe-area-inset-top,0px)) max(24px,env(safe-area-inset-right,0px)) 24px max(24px,env(safe-area-inset-left,0px));display:flex;flex-direction:column;gap:6px;overflow:auto}
.mnav a{font-family:var(--f-display);font-size:48px;padding:6px 0;border-bottom:1px solid #2A3034;line-height:1.1}
.mnav .x{align-self:flex-end;color:var(--onnight);border-color:#3A4044}
.srch{position:fixed;inset:0;z-index:50;background:color-mix(in srgb,var(--bg) 97%,transparent);padding:calc(24px + env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) 24px max(16px,env(safe-area-inset-left,0px));overflow:auto}
.srch .box{max-width:860px;margin:0 auto}
.srow{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}
.srch input{width:100%;font:400 clamp(32px,5vw,64px)/1.1 var(--f-display);letter-spacing:-.02em;background:transparent;color:var(--ink);border:0;border-bottom:2px solid var(--ink);padding:14px 0;outline:none;border-radius:0}
.topics{margin-top:12px}
.chip{display:inline-block;border:1.5px solid var(--ink);padding:8px 18px;font-weight:500;font-size:14px;border-radius:999px}
.chip:hover{background:var(--ink);color:var(--bg)}
.top{position:fixed;right:max(16px,env(safe-area-inset-right,0px));bottom:max(16px,env(safe-area-inset-bottom,0px));z-index:15;width:48px;height:48px;border:1.5px solid var(--ink);background:var(--bg);display:grid;place-items:center;opacity:0;pointer-events:none;transition:opacity .25s;color:var(--ink)}
.top.on{opacity:1;pointer-events:auto}.top:hover{background:var(--ink);color:var(--bg)}
.pager{display:flex;justify-content:center;align-items:center;gap:20px;flex-wrap:wrap;margin-top:56px}
.pager .btn{background:transparent;color:var(--ink);border:1.5px solid var(--ink);padding:14px 28px;font-weight:600}
.pager .btn:hover{background:var(--ink);color:var(--bg)}
.pager .small{font-family:var(--f-mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink2)}
.empty{padding:48px 0;color:var(--ink2);font-size:18px}
.note{background:var(--bg2);border-left:3px solid var(--oak);padding:12px 18px;margin:18px 0;font-size:15px}
.sfield{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 40px;max-width:640px}
.sfield input{flex:1 1 260px;min-width:0;background:transparent;color:var(--ink);border:1.5px solid var(--ink);padding:14px 18px;font:inherit;border-radius:0}
.btn{background:var(--glow);color:#16181A;border:0;padding:16px 28px;font-weight:600;border-radius:0}
.hdr .in{flex-wrap:nowrap}
.hdr .logo{margin-right:0}
/* floor plan for 1 to 5 rooms: simple even grid */
.pgrid:not(.n6){grid-template-columns:repeat(auto-fit,minmax(200px,1fr));grid-template-rows:none;min-height:0}
.pgrid:not(.n6) .cell{min-height:160px;grid-area:auto!important;padding:20px!important}
.pgrid:not(.n6) .cell .nm{font-size:clamp(28px,3.4vw,46px)!important}
.pvi[hidden]{display:none}
.pvi .thumb{aspect-ratio:4/3;border-radius:999px 999px 0 0}
.pvi h3{font-size:clamp(34px,3.6vw,50px);color:var(--onnight)}
.pvi .k{margin:24px 0 8px;color:var(--glow)}
.pvi a.go{display:inline-block;margin-top:20px;font-weight:600;font-size:14px;border-bottom:1.5px solid var(--glow);padding-bottom:3px}
.pvi a.go:hover{color:var(--glow)}
.pvi .alt{display:block;margin-top:14px;color:#B4BBAE;font-size:15px}.pvi .alt:hover{color:var(--glow)}
.score b{font-size:26px}
.rv .score{background:conic-gradient(var(--oak) 100%,var(--line) 0)}
.rv .score b{font-size:30px}
/* story body */
.prose img,.prose video,.prose iframe{max-width:100%;height:auto;display:block}
.prose figure{margin:48px 0}
.prose figure img{width:100%}
.prose .wp-block-image,.prose .alignnone{margin:40px 0}
.prose a{color:var(--oak);text-decoration:underline;text-underline-offset:3px}
.prose a:hover{text-decoration-thickness:2px}
.prose ul,.prose ol{padding-left:1.3em;margin:0 0 26px}
.prose li{margin-bottom:8px}
.prose h3{font-size:clamp(26px,2.6vw,34px);margin:40px 0 14px}
.prose table{border-collapse:collapse;width:100%;font-size:16px;margin:0 0 26px;display:block;overflow-x:auto}
.prose th,.prose td{border:1px solid var(--line);padding:8px 12px;text-align:left}
.prose.dcap>p:first-of-type::first-letter{font-family:var(--f-display);font-weight:400;float:left;font-size:104px;line-height:.78;padding:8px 14px 0 0;color:var(--oak)}
.prose.pgbody{font-size:19px}
.prose .alignleft{float:left;margin:6px 24px 12px 0}.prose .alignright{float:right;margin:6px 0 12px 24px}
.prose::after{content:"";display:block;clear:both}
.tags a{border:1.5px solid var(--ink);padding:6px 16px;font-size:14px;font-weight:500;border-radius:999px}
.tags a:hover{background:var(--ink);color:var(--bg)}
.toc .share{margin-top:28px}
.share .label{font-family:var(--f-mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);display:block;margin-bottom:10px}
.share .sgrid{display:flex;flex-wrap:wrap;gap:8px 14px}
.share .sgrid a{color:var(--ink2);font-size:14px}.share .sgrid a:hover{color:var(--oak)}
.share-in{display:none}
@media(max-width:900px){.toc{display:flex;position:static;order:2}.abody{grid-template-columns:minmax(0,1fr)}.toc>.mono,.toc>a[href^="#"]{display:none}}
/* comments */
.cmts{margin-top:64px;padding-top:32px;border-top:1.5px solid var(--ink)}
.ch{font-size:clamp(30px,3.4vw,44px);margin-bottom:24px}
.cm-l{list-style:none;margin:0;padding:0}
.cm-l .cm-l{margin-left:28px;padding-left:20px;border-left:1px solid var(--line)}
.cm-l.flat{margin-left:0;padding-left:0;border:0}
.cm{padding:18px 0;border-bottom:1px solid var(--line)}
.cm-h{display:flex;gap:14px;align-items:baseline;flex-wrap:wrap;margin-bottom:6px}
.cm-h .meta{margin:0;font-family:var(--f-mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase}
.cm-b{font-size:17px;line-height:1.6}
.cform{display:flex;flex-direction:column;gap:18px}
.frow{display:flex;flex-wrap:wrap;gap:18px}.frow .fld{flex:1 1 240px}
.fld label{display:block;font-family:var(--f-mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink2);margin-bottom:8px}
.fin{width:100%;background:transparent;color:var(--ink);border:1.5px solid var(--ink);padding:14px 16px;font:inherit;font-size:17px;border-radius:0}
.fin:focus{outline:2px solid var(--oak);outline-offset:2px}
.cform .btn{background:var(--ink);color:var(--bg);padding:16px 32px}
.cform .btn:hover{background:var(--oak)}
.muted.small,.small.muted{font-size:11.5px}
.author .ava{background:var(--night)}
.ahead a.mono:hover{text-decoration:underline}
.foot .logo{margin-bottom:8px}
.about .l.prose h2{font-size:clamp(30px,3.4vw,42px)}
@media(max-width:980px){.nav{display:none}.menu-btn{display:grid}}
@media(min-width:981px){.menu-btn{display:none}}
.hero{width:100%;max-width:100%}
@media(max-width:700px){.hero{aspect-ratio:4/3;min-height:0}.cell .nm{overflow-wrap:anywhere;font-size:26px!important}.cell:nth-child(1) .nm{font-size:34px!important}}
@media(max-width:700px){
.pgrid,.pgrid.n6{grid-template-columns:1fr 1fr;grid-template-rows:none;min-height:0}
.pgrid .cell:nth-child(n){grid-area:auto!important;min-height:130px;padding:20px!important}
.pgrid .cell:nth-child(n) .nm{font-size:28px!important}
.pgrid .cell:nth-child(1){grid-column:1/-1!important}
}

/* ---- calmer heading sizes ---- */
.hero2 h1{font-size:clamp(50px,7.2vw,108px);line-height:.94}
.hero2 .now b{font-size:clamp(22px,2.2vw,28px)}
.sech h2{font-size:clamp(34px,4.2vw,58px)}
.plan h2{font-size:clamp(36px,4.6vw,66px)}
.band h2{font-size:clamp(34px,4.4vw,62px)}
.ahead h1{font-size:clamp(34px,4.6vw,66px);line-height:1.02;margin:16px 0 24px}
.rhead .t h1{font-size:clamp(44px,6vw,88px)}
.about h1{font-size:clamp(42px,6vw,88px)}
.foot .logo{font-size:clamp(34px,4.2vw,54px)}
.ct{font-size:clamp(22px,2vw,28px)}
.big .over h3{font-size:clamp(28px,3.2vw,44px)}
.kit .lead .ct{font-size:clamp(26px,2.8vw,38px)}
.row .ct{font-size:18px}
.ev .day{font-size:52px}
.mr .n{font-size:32px}.mr .t,.idx .tt{font-size:clamp(22px,2.2vw,30px)}
.pn .ct{font-family:var(--f-display);font-weight:400;letter-spacing:-.01em;line-height:1.1;font-size:clamp(22px,2.2vw,30px)}
.pv h3,.pvi h3{font-size:clamp(28px,2.8vw,38px)}
.cell .nm{font-size:clamp(24px,2.6vw,36px)}
.prose h2{font-size:clamp(26px,2.8vw,34px)}
.prose .lede{font-size:clamp(22px,2.3vw,28px)}
.prose blockquote{font-size:clamp(26px,3vw,38px)}
.mnav a{font-size:38px}
.hero2 .in{align-items:center}

/* v0.18.5 front door: the window */
.hero2 .in{align-items:center}
.hero2 .now b{font-size:clamp(30px,3.7vw,52px);line-height:1.06;letter-spacing:-.015em;text-wrap:balance}
.hero2 .now{max-width:600px}
.hero2 .hdek{display:block;margin-top:14px;font-size:16px;line-height:1.55;color:var(--ink2);max-width:46ch}
.hero2 .more{display:inline-block;margin-top:16px;font-size:13px;font-weight:600;border-bottom:1.5px solid var(--oak);padding-bottom:2px;color:var(--ink)}
.hero2 .r{height:auto;max-width:560px;margin-left:auto;padding:0 28px 40px 0}
.hero2 .sun{position:absolute;right:-8px;top:-18px;width:150px;height:150px;border-radius:50%;background:var(--glow);opacity:.9}
.hero2 .frame{position:relative;display:block;border:1.5px solid var(--ink);border-radius:999px 999px 0 0;padding:14px 14px 0;background:var(--bg)}
.hero2 .win{position:relative;display:block;aspect-ratio:4/5;border-radius:999px 999px 0 0;overflow:hidden;background:var(--night)}
.hero2 .win .thumb{position:absolute;inset:0}
.hero2 .ground{height:10px;background:var(--ink);margin:0 -28px 0 -10px}
.hero2 .label{position:absolute;left:-44px;bottom:14px;background:var(--bg);border:1.5px solid var(--ink);padding:14px 18px;max-width:230px;box-shadow:10px 10px 0 var(--glow)}
.hero2 .label .mono{display:block;color:var(--oak);font-size:11px}
.hero2 .label b{display:block;font:400 20px/1.1 var(--f-display);margin-top:6px}
@media(max-width:900px){.hero2 .r{margin:0 auto;width:100%}.hero2 .label{left:-8px}}
@media(max-width:700px){.hero2 .sun{width:100px;height:100px}.hero2 .r{padding-right:16px}.hero2 .ground{margin-right:-16px}}
/* v0.18.6 lead-and-list rooms: bigger side titles, five rows */
.kit .rest{gap:22px}
.kit .rest .row{grid-template-columns:120px minmax(0,1fr);gap:18px;align-items:center}
.kit .rest .row .ct{font-size:clamp(20px,1.9vw,25px);line-height:1.12;margin-top:6px}
@media(max-width:700px){.kit .rest .row{grid-template-columns:92px minmax(0,1fr)}.kit .rest .row .ct{font-size:20px}}
/* v0.18.7 on the table: five side stories, bigger titles */
.table .side .row{grid-template-columns:120px minmax(0,1fr);gap:18px;align-items:center}
.table .side .row .ct{font-size:clamp(20px,1.9vw,25px);line-height:1.12;margin-top:6px}
@media(max-width:700px){.table .side .row{grid-template-columns:92px minmax(0,1fr)}.table .side .row .ct{font-size:20px}}
/* v0.18.8 mosaic: one lead on the left, a clean 2x2 on the right, all edges aligned */
.mos{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-flow:row;gap:32px 24px;align-items:stretch}
.mos .card{display:flex;flex-direction:column}
.mos .card:nth-child(1){grid-column:1 / span 2;grid-row:1 / span 2}
.mos .card:nth-child(n+2){grid-column:auto;grid-row:auto}
.mos .card:nth-child(1) .thumb{aspect-ratio:auto;flex:1 1 auto;min-height:340px}
.mos .card:nth-child(n+2) .thumb{aspect-ratio:4/3}
.mos .card:nth-child(1) .ct{font-size:clamp(26px,2.6vw,36px)}
.mos .card:nth-child(n+2) .ct{font-size:clamp(19px,1.7vw,23px);line-height:1.14}
@media(max-width:900px){.mos{grid-template-columns:repeat(2,minmax(0,1fr))}.mos .card:nth-child(1){grid-column:1 / -1;grid-row:auto}.mos .card:nth-child(1) .thumb{flex:none;aspect-ratio:16/10;min-height:0}}
@media(max-width:520px){.mos{grid-template-columns:1fr}.mos .card:nth-child(n){grid-column:auto;grid-row:auto}.mos .card .thumb{aspect-ratio:4/3!important}}
/* v0.18.9 one soft corner for every picture */
:root{--rad:12px}
.thumb,.hero figure,figure.hero,.hero .thumb,.arcbox,.prose img,.prose video,.prose figure .thumb{border-radius:var(--rad);overflow:hidden}
.hero figure img,figure.hero img{border-radius:var(--rad)}
.soft .card{border-radius:20px}
.soft .thumb{border-radius:var(--rad)}
.win .thumb,.plan .thumb,.band .thumb,.pvi .thumb{border-radius:0}
/* v0.18.11 wall: fine plaster grain in light mode, thin panelling in dark mode */
:root{--wall:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='300'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .3  0 0 0 0 .25  0 0 0 0 .2  0 0 0 .22 0'/></filter><rect width='300' height='300' filter='url(%23n)'/></svg>")}
:root[data-theme="dark"]{--wall:repeating-linear-gradient(90deg,transparent 0 119px,rgba(0,0,0,.35) 119px 120px,rgba(255,255,255,.04) 120px 121px)}
body{background-image:var(--wall);background-position:center top}
.sec[style*="--bg2"]{background-image:var(--wall)!important;background-color:var(--bg2)!important;background-position:center top!important}
@media(max-width:700px){:root[data-theme="dark"]{--wall:repeating-linear-gradient(90deg,transparent 0 79px,rgba(0,0,0,.35) 79px 80px,rgba(255,255,255,.04) 80px 81px)}}
/* v0.18.14 logo mark beside the wordmark */
.logo{display:inline-flex;align-items:center;gap:12px}
.logo .mark{width:40px;height:40px;flex:none;display:block}
.foot .logo .mark{width:clamp(44px,5vw,64px);height:clamp(44px,5vw,64px)}
.foot .logo{gap:16px}
@media(max-width:520px){.logo .mark{width:34px;height:34px}.logo{gap:10px;font-size:28px}}
/* v0.18.15 LiO mark: light and dark versions, no tile */
.logo .mark{width:auto;height:34px;display:block}
.logo .mk-d{display:none}
html[data-theme="dark"] .logo .mk-l{display:none}
html[data-theme="dark"] .logo .mk-d{display:block}
.foot .logo .mark{width:auto;height:clamp(36px,4vw,50px)}
@media(max-width:520px){.logo .mark{width:auto;height:28px}}
/* v0.18.16 wordmark: Ohsem in terracotta (amber in dark mode) */
.logo i{color:#9A4A27}
html[data-theme="dark"] .logo i{color:#E0A458}
/* v0.18.21 ads: boxes, side slot, cookie bar */
.adx{display:flex;flex-direction:column;gap:6px;margin:8px 0;min-width:0;clear:both}
.adx .label{font:11px var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink2)}
.adx[data-n]:not(.on){display:none}
.adin{display:flex;justify-content:center;width:100%;margin:0 auto;overflow:hidden}
.adx .adin>ins.adsbygoogle{width:100%}
.adx.inart{margin:28px 0}
.adph{border:1.5px dashed var(--line);border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-align:center;padding:8px;color:var(--ink2);font-size:12px;margin:0 auto;max-width:100%}
.adph b{color:var(--oak);font-weight:600}
.abody.withad{grid-template-columns:var(--side,300px) minmax(0,680px);gap:40px 56px}
.abody.withad .toc{max-height:calc(100vh - 110px);overflow:auto;scrollbar-width:none}
.abody.withad .toc::-webkit-scrollbar{display:none}
.toc>.adx{margin-top:28px;width:100%}
@media(max-width:900px){.abody.withad{grid-template-columns:minmax(0,1fr)}.abody.withad .toc{max-height:none;overflow:visible}.toc>.adx{align-self:center}.toc.ph-hide>.adx{display:none}}
.cc{position:fixed;left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:80;max-width:560px;margin:0 auto;background:var(--bg);color:var(--ink);border:1.5px solid var(--ink);border-radius:12px;padding:14px 16px;display:flex;gap:12px 18px;align-items:center;flex-wrap:wrap;box-shadow:8px 8px 0 var(--glow)}
.cc[hidden]{display:none}
.cc p{margin:0;flex:1 1 240px;font-size:13px;color:var(--ink)}
.ccb{display:flex;gap:8px}
.ccb .btn{padding:10px 18px;font-size:14px}
.ccb .btn.ghost{background:transparent;color:var(--ink);border:1.5px solid var(--ink)}
.linkbtn{background:none;border:0;padding:0;margin-left:14px;color:inherit;font:inherit;text-decoration:underline;cursor:pointer}
/* v0.18.22 tables in articles: full width, tidy cells, scroll sideways with a visible edge */
.prose .tw{margin:0 0 28px;overflow-x:auto;-webkit-overflow-scrolling:touch;background:linear-gradient(90deg,var(--bg) 30%,transparent) left center/32px 100% no-repeat local,linear-gradient(270deg,var(--bg) 30%,transparent) right center/32px 100% no-repeat local,linear-gradient(90deg,rgba(0,0,0,.14),transparent) left center/12px 100% no-repeat scroll,linear-gradient(270deg,rgba(0,0,0,.14),transparent) right center/12px 100% no-repeat scroll}
.prose .tw:focus-visible{outline:2px solid var(--oak);outline-offset:2px}
.prose .tw>table{display:table;width:100%;margin:0;font-size:15px;line-height:1.45}
.prose table caption{caption-side:top;text-align:left;font:11.5px var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink2);padding:0 0 10px}
.prose th{background:var(--bg2);font-weight:600;white-space:nowrap}
.prose th,.prose td{vertical-align:top;min-width:84px}
.prose td>p,.prose th>p{margin:0}.prose td>p+p{margin-top:8px}
.prose td ul,.prose td ol{margin:4px 0;padding-left:18px}.prose td li{margin:0 0 2px}
.prose tfoot td{font-weight:600}

/* v0.18.23 depth: warm light, glass where a photo sits behind, card lift, varied rhythm */
:root{--glassbg:color-mix(in srgb,var(--bg) 60%,transparent);--glassln:color-mix(in srgb,#fff 45%,transparent);--shadow-w:rgba(90,45,15,.5);--lit:color-mix(in srgb,var(--glow) 34%,transparent)}
:root[data-theme="dark"]{--glassbg:color-mix(in srgb,var(--bg2) 58%,transparent);--glassln:rgba(255,255,255,.13);--shadow-w:rgba(0,0,0,.65);--lit:color-mix(in srgb,var(--glow) 16%,transparent)}
body{position:relative}
body::after{content:"";position:absolute;inset:0 0 auto 0;height:1100px;z-index:-1;pointer-events:none;background:radial-gradient(760px 480px at 90% -40px,var(--lit),transparent 72%),radial-gradient(620px 420px at 2% 560px,color-mix(in srgb,var(--oak) 10%,transparent),transparent 72%)}
.glass,.hdr,.hero2 .label,.big .over,.gchip{-webkit-backdrop-filter:blur(16px) saturate(1.45);backdrop-filter:blur(16px) saturate(1.45)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){:root{--glassbg:color-mix(in srgb,var(--bg) 92%,transparent)}}
.hdr{background:var(--glassbg);border-bottom:1px solid var(--glassln);box-shadow:0 10px 30px -22px var(--shadow-w)}
.hero2 .label{background:var(--glassbg);border:1px solid var(--glassln);border-radius:16px;box-shadow:0 22px 44px -22px var(--shadow-w),inset 0 1px 0 var(--glassln)}
.hero2 .sun{box-shadow:0 0 90px 34px var(--lit);opacity:1}
.hero2 .frame{box-shadow:0 30px 60px -30px var(--shadow-w)}
.big .over{background:var(--glassbg);border:1px solid var(--glassln);border-radius:18px;box-shadow:0 24px 50px -26px var(--shadow-w),inset 0 1px 0 var(--glassln);padding:26px 30px 24px}
.gchip{position:absolute;left:16px;bottom:16px;z-index:2;padding:8px 14px;border-radius:99px;background:var(--glassbg);border:1px solid var(--glassln);color:var(--ink);box-shadow:0 10px 24px -14px var(--shadow-w)}
figure.hero{position:relative}
.thumb{box-shadow:0 18px 30px -22px var(--shadow-w),0 2px 5px rgba(90,45,15,.08)}
a.card .thumb,a.card .thumb svg,a.card .thumb img{transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .4s}
a.card:not(.row):not(.ev):not(.rv):hover .thumb{transform:translateY(-5px);box-shadow:0 32px 46px -24px var(--shadow-w),0 4px 10px rgba(90,45,15,.1)}
a.card.row:hover .thumb{transform:translateY(-3px)}
.soft .card{box-shadow:0 20px 34px -26px var(--shadow-w);transition:transform .4s cubic-bezier(.2,.7,.2,1),box-shadow .4s}
.soft .card:hover{transform:translateY(-5px);box-shadow:0 34px 50px -28px var(--shadow-w)}
.band .r{box-shadow:inset 0 0 120px rgba(60,30,10,.18)}
/* archive rhythm: one large lead and a stacked pair on the first page */
@media(min-width:900px){
  .grid3.feat{grid-template-columns:repeat(3,minmax(0,1fr))}
  .grid3.feat>.card:first-child{grid-column:span 2;grid-row:span 2;display:flex;flex-direction:column}
  .grid3.feat>.card:first-child .thumb{flex:1 1 auto;aspect-ratio:auto;min-height:360px}
  .grid3.feat>.card:first-child .ct{font-size:clamp(30px,3.2vw,46px)}
}
@media(min-width:600px) and (max-width:899px){.grid3.feat>.card:first-child{grid-column:span 2}}
/* scroll-in, only where the browser supports it, and always visible at rest */
@supports (animation-timeline:view()){
  @media(prefers-reduced-motion:no-preference){
    .grid3>.card,.mos>.card,.soft>.card,.kit .lead{animation:om-rise linear both;animation-timeline:view();animation-range:entry 0% entry 38%}
    @keyframes om-rise{from{opacity:.001;transform:translateY(22px)}to{opacity:1;transform:none}}
  }
}
@media(prefers-reduced-motion:reduce){a.card .thumb,.soft .card{transition:none}a.card:hover .thumb,.soft .card:hover{transform:none}}
.hero{border-radius:var(--rad)}
