.note-bio{font-size:17.5px;line-height:1.5;color:var(--ink-40);max-width:52ch;margin:24px 0 0}
.layout-marquee .single.note .note-bio{font-size:17.5px;line-height:1.5;color:var(--ink-40);margin:8px 0 0;max-width:34ch}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--accent);color:var(--accent-ink,#fff);padding:8px 14px;font-size:16.5px}.skip:focus{left:8px;outline:2px solid #fff}

:root{
  --sans:"Hiragino Sans","Zen Kaku Gothic New","Inter","Helvetica Neue",Helvetica,Arial,sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1); --t-fast:.25s; --t-slow:.6s;
  --serif:"Fraunces","Hiragino Mincho ProN","Shippori Mincho","Yu Mincho","Iowan Old Style",Georgia,serif;
  --bg:#F4EFE6; --ink:#1E1A15; --ink-40:rgba(30,26,21,.66); --ink-25:rgba(30,26,21,.6); --rule:rgba(30,26,21,.5); --rule-soft:rgba(30,26,21,.12);
  --ph:#E8E1D5; --bar:#4A3127; --bar-ink:#F4EFE6; --bar-60:rgba(244,239,230,.62);
  --accent:#C9623A; --accent-ink:#1E1A15; --accent-40:rgba(30,26,21,.72); --accent-rule:rgba(30,26,21,.28);
  --pill:#1E1A15; --pill-ink:#F4EFE6; --up:#C9623A;
  --ink-rgb:30,26,21; --bg-rgb:244,239,230;
  --board:#4A3127; --board-ink:#F4EFE6; --board-dim:rgba(244,239,230,.62); --board-rule:rgba(244,239,230,.2); --board-mq:#F4EFE6; --board-mq-ink:#1E1A15; --board-mq-dim:rgba(30,26,21,.45);
  --accent-text:#A84C28;
 --bar-accent:#E8A27E;

}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --bg:#161310; --ink:#F1EAE0; --ink-40:rgba(241,234,224,.5); --ink-25:rgba(241,234,224,.5); --rule:rgba(241,234,224,.22); --rule-soft:rgba(241,234,224,.1);
  --ph:#231F1A; --bar:#2B1D17; --bar-ink:#F1EAE0; --pill:#F1EAE0; --pill-ink:#161310;
  --ink-rgb:241,234,224; --bg-rgb:22,19,16;
  --board:#2B1D17; --board-ink:#F1EAE0; --board-dim:rgba(241,234,224,.6); --board-rule:rgba(241,234,224,.18); --board-mq:#161310; --board-mq-ink:#F1EAE0; --board-mq-dim:rgba(241,234,224,.5);
  --accent-text:var(--accent);
 --bar-rule:rgba(255,255,255,.12);

}}
:root[data-theme="dark"]{
  --bg:#161310; --ink:#F1EAE0; --ink-40:rgba(241,234,224,.5); --ink-25:rgba(241,234,224,.5); --rule:rgba(241,234,224,.22); --rule-soft:rgba(241,234,224,.1);
  --ph:#231F1A; --bar:#2B1D17; --bar-ink:#F1EAE0; --pill:#F1EAE0; --pill-ink:#161310;
  --ink-rgb:241,234,224; --bg-rgb:22,19,16;
  --board:#2B1D17; --board-ink:#F1EAE0; --board-dim:rgba(241,234,224,.6); --board-rule:rgba(241,234,224,.18); --board-mq:#161310; --board-mq-ink:#F1EAE0; --board-mq-dim:rgba(241,234,224,.5);
  --accent-text:var(--accent);
 --bar-rule:rgba(255,255,255,.12);

}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:19.5px;line-height:1.3;font-weight:500;letter-spacing:0;font-feature-settings:"cv05","cv11","ss03";-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
input:focus-visible,textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}   /* the search and the sign-up fields cleared their outline and never put one back */
.menu .search input:focus-visible{outline-color:var(--accent-ink)}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0;letter-spacing:inherit}
img{display:block;max-width:100%}
.grey{color:var(--ink-40);overflow-wrap:anywhere}
:is(h1,.h1){margin:0;font-size:43px;font-weight:500;line-height:1.2;letter-spacing:-.02em}
h2{margin:0;font-size:25.36px;font-weight:500;line-height:1.2;letter-spacing:-.02em}
.sub{margin:0;color:var(--ink-25)}
.pill{display:inline-block;vertical-align:middle;border-radius:9999px;background:var(--pill);color:var(--pill-ink);font-size:14.6px;padding:6px 11px;line-height:1;letter-spacing:0;margin-right:6px;position:relative;top:-2px;white-space:nowrap}
.pill.jpill{background:none;color:var(--ink);border:1px solid var(--ink)}
.jp{font-family:"Zen Kaku Gothic New","Hiragino Sans",sans-serif;letter-spacing:0}

/* ---------- black bar (Slanted) ---------- */
.bar{position:fixed;left:0;top:0;z-index:60;width:100%;height:48px;background:var(--bar);color:var(--bar-ink);box-shadow:0 1px 0 var(--bar-rule,transparent);display:flex;align-items:center;gap:24px;padding:0 16px}
.bar .logo{font-size:22px;letter-spacing:-.03em;display:flex;align-items:baseline;gap:8px}
.bar .logo .jp{font-size:16px;color:var(--bar-60);white-space:nowrap}
.bar .logo .logo-img{height:22px;width:auto;display:block;position:relative;top:2px}
@media(max-width:960px){.bar .logo .logo-img{height:18px}}
.bar .tick{margin-left:auto;font-size:16.5px;color:var(--bar-60);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.bar .tick b{font-weight:500;color:var(--bar-accent,var(--accent-text,var(--accent)))}
.bar .tick a{color:var(--bar-60)} .bar .tick a:hover{color:var(--bar-ink)}
.bar .menu-btn{font-size:16.5px;display:flex;align-items:center;gap:10px;color:var(--bar-ink);flex:none}
.bar .menu-btn i{display:inline-block;width:20px;height:14px;position:relative}
.bar .menu-btn i:before,.bar .menu-btn i:after{content:"";position:absolute;left:0;right:0;height:2px;background:currentColor;transition:transform var(--t-fast),top var(--t-fast),box-shadow var(--t-fast)}
.bar .menu-btn i:before{top:1px;box-shadow:0 5px 0 currentColor} .bar .menu-btn i:after{top:11px}
.bar.open .menu-btn i:before{top:6px;transform:rotate(45deg);box-shadow:none} .bar.open .menu-btn i:after{top:6px;transform:rotate(-45deg)}

/* ---------- dropdown menu (accent panel) ---------- */
.menu{position:fixed;left:0;right:0;top:48px;z-index:55;background:var(--accent);color:var(--accent-ink);transform:translateY(-102%);visibility:hidden;transition:transform var(--t-slow) var(--ease),visibility 0s var(--t-slow);max-height:calc(100vh - 48px);overflow:auto}
.menu.open{transform:none;visibility:visible;transition:transform var(--t-slow) var(--ease),visibility 0s}   /* closed, the menu leaves the tab order */
.menu .grid{display:grid;grid-template-columns:1fr 1fr 1fr}
.menu .grid > div{padding:0 16px 40px;border-left:1px solid var(--accent-rule)}
.menu .grid > div:first-child{border-left:0}
.menu .ch{height:48px;display:flex;align-items:center;font-size:25.36px;border-bottom:1px solid var(--accent-rule);margin:0 -16px 16px;padding:0 16px}
.menu a,.menu button{display:block;font-size:25.36px;line-height:1.35;text-align:left}
.menu a:hover,.menu button:hover{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.menu .gap{height:22px}
.menu .small{font-size:19.5px;color:var(--accent-40)}
.menu button[aria-pressed="true"]{text-decoration:underline;text-underline-offset:4px}
.scrim{position:fixed;inset:48px 0 0;z-index:50;background:rgba(0,0,0,.3);opacity:0;pointer-events:none;transition:opacity var(--t-fast)}
.scrim.open{opacity:1;pointer-events:auto}
/* A reader who asked the system for no motion was still given a pulsing "now playing" pill and
   bouncing equaliser bars: the targeted rules below cover what we remembered to name, and this
   covers what we did not. Everything lands on its final frame instead of being removed. */
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:1ms !important;animation-iteration-count:1 !important;transition-duration:1ms !important;scroll-behavior:auto !important}}
@media(prefers-reduced-motion:reduce){.menu{transition:none}.bar .menu-btn i:before,.bar .menu-btn i:after{transition:none}}

/* ---------- column heads + three independent columns ---------- */
.colhead{position:fixed;top:48px;left:0;right:0;z-index:40;height:48px;background:var(--bg);border-bottom:1px solid var(--rule);display:grid;grid-template-columns:1fr 1fr 1fr}
.colhead > div{display:flex;align-items:center;justify-content:space-between;padding:0 16px;border-left:1px solid var(--rule);font-size:25.36px}
.colhead > div:first-child{border-left:0}
.colhead > div span{font-size:16.5px;color:var(--ink-40);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-left:12px}
.colhead > div span.l{font-size:25.36px;color:var(--ink);margin-left:0;overflow:visible}
.cols{padding-top:96px;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:start}
.col{border-left:1px solid var(--rule);min-width:0;will-change:transform}
.cols.parallax .col{transform:translateY(var(--y,0px))}
.col:first-child{border-left:0}
.col > section{padding:32px 16px;border-bottom:1px solid var(--rule)}
.col > section:last-child{border-bottom:0;padding-bottom:32px}
.head{margin-bottom:24px}
.head .sub{margin-top:4px}
.head-row{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.head-row a,.head-row button{font-size:19.5px;color:var(--ink-40);white-space:nowrap}
.head-row a:hover,.head-row button:hover{color:var(--ink)}
.tabs{display:none}
.tabs[hidden]{display:none !important}   /* inner pages set hidden; the phone rule below must not override it */
@media(max-width:960px){
  .tabs{position:fixed;left:0;right:0;bottom:0;z-index:45;display:grid;grid-template-columns:1fr 1fr 1fr;background:var(--bg);color:var(--ink);border-top:1px solid var(--ink);padding-bottom:env(safe-area-inset-bottom)}
  .tabs button{height:56px;font-size:16.5px;color:inherit;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
  .tabs button small{font-size:14.6px;letter-spacing:.04em;color:var(--ink-40)}
  .tabs button[aria-pressed="true"]{color:var(--accent-text,var(--accent))}
  .tabs button[aria-pressed="true"] small{color:var(--accent-text,var(--accent))}
  .tabs button[aria-pressed="true"]:before{content:"";display:block;width:24px;height:2px;background:var(--accent);margin-bottom:4px}
  .cols.tabbed .col{display:none}
  .cols.tabbed .col.active{display:block}
  .board{padding-bottom:56px}
  .colhead{display:none}
  .cols{display:block;height:auto;padding-top:48px}
  .col{border-left:0;transform:none !important}
  .col + .col{border-top:1px solid var(--rule)}
  .col > section:last-child{padding-bottom:32px}
  .menu .grid{grid-template-columns:1fr}.menu .grid > div{border-left:0}
  .bar .tick{display:none}
  .bar .logo{margin-right:auto}   /* the counter that pushed the menu right is gone on phones; the logo pushes instead, whatever sits after it */
  :is(h1,.h1){font-size:34px}
}

/* ---------- news column ---------- */
.lead-sec .note{margin-top:8px}
.lead-thumbs{display:grid;grid-template-columns:1fr 1fr;gap:24px 16px;margin-top:24px}
.lead-thumbs .thumb h2{font-size:19.5px}
.lead-sec .more{display:inline-block;margin-top:20px;color:var(--ink-40)}
.lead-sec .more:hover{color:var(--ink)}
.post{display:block;margin-top:40px}
.post:first-of-type{margin-top:0}
.post .pic{aspect-ratio:3/2;background:var(--ph);overflow:hidden;position:relative}
.pic.noimg{display:grid;place-items:center;background:var(--ph)}
.pic.noimg span{font-size:25.36px;color:var(--ink-40);padding:16px;text-align:center}
.pic img[data-failed]{display:none}
.post .pic img{width:100%;height:100%;object-fit:cover}
.post h2{margin-top:14px}
.post .meta{margin-top:8px;font-size:14.6px;color:var(--ink-40)}
.post:hover h2{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
/* A tablet fell into the phone rules at 960px and got one column of 736x491 pictures, one story a screen. Two columns
   between 601 and 960px, on the column layouts only - the bands and the marquee carry their own grids there. */
@media(min-width:601px) and (max-width:960px){body:not(.layout-bands):not(.layout-marquee) #posts{display:grid;grid-template-columns:1fr 1fr;gap:36px 20px;align-items:start}body:not(.layout-bands):not(.layout-marquee) #posts .post,body:not(.layout-bands):not(.layout-marquee) #posts .post:first-of-type{margin-top:0}}
.load-more{display:block;margin-top:40px;padding:16px 0;border-top:1px solid var(--rule);width:100%;text-align:left;font-size:25.36px}
.load-more:hover{text-decoration:underline;text-underline-offset:4px}
.empty{padding:40px 0;color:var(--ink-25)}
.thumbs{display:grid;grid-template-columns:1fr 1fr;gap:24px 16px}
.thumb{display:block;min-width:0}
.thumb .pic{aspect-ratio:3/2;background:var(--ph);overflow:hidden}
.thumb .pic img{width:100%;height:100%;object-fit:cover}
.thumb h2{font-size:19.5px;margin-top:8px}
.thumb:hover h2{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}

/* ---------- radar column ---------- */
.accent{background:var(--accent);color:var(--accent-ink)}
.accent .sub,.accent .grey{color:var(--accent-40)}
.trend{display:grid;grid-template-columns:1fr auto auto auto;gap:8px 14px;padding:16px 0 18px;border-top:1px solid var(--accent-rule);align-items:baseline;width:100%;text-align:left;font-size:25.36px;line-height:1.2}
.trend:first-child{border-top:0;padding-top:0}
.trend .num{font-variant-numeric:tabular-nums;min-width:2ch;text-align:right}
.trend .delta{font-size:19.5px;color:var(--accent-40);min-width:4ch;text-align:right}
.trend .delta.up{color:var(--accent-ink)}
.spark{width:72px;height:22px;display:block;align-self:center}
.spark polyline{fill:none;stroke:var(--accent-40);stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round}
.spark circle{fill:var(--accent-ink)}
.trend[aria-pressed="true"] .n,.trend:hover .n{text-decoration:underline;text-underline-offset:5px}
.trend[aria-pressed="true"] .spark polyline,.trend:hover .spark polyline{stroke:var(--accent-ink)}
.trends-more{margin:18px 0 0;font-size:19.5px;color:var(--accent-40)}
.trends-more button{color:var(--accent-ink)}
.colours .bar-strip{display:flex;height:56px;width:100%;overflow:hidden;margin-top:14px}
.colours .bar-strip a{display:block;height:100%;min-width:6px;transition:flex-grow .3s}
.colours .bar-strip a:hover{flex-grow:3 !important}
.colours .names{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:12px;font-size:19.5px;color:var(--ink-40)}
.colours .names b{font-weight:500;color:var(--ink)}
/* studio sound — a vertical studio day */
.sound{padding:0 !important}
.sound .head{padding:32px 16px 0}
.sound .day{position:relative;margin-top:24px;border-top:1px solid var(--rule)}
.slat{display:grid;grid-template-columns:76px 1fr auto minmax(30px,auto);gap:0 14px;align-items:center;height:52px;padding:0 16px;color:#fff;border-top:1px solid rgba(0,0,0,.15);position:relative;outline:none}
.slat:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.slat:first-child{border-top:0}
.slat.dark{color:#141414}
.slat .t{font-size:19.5px;line-height:1.1;font-weight:500;white-space:nowrap}
.slat .t b{font-weight:500}
.slat .t small{display:none}
.slat .ti{min-width:0}
.slat h2{font-size:19.5px;line-height:1.1;display:flex;align-items:center;min-width:0}
.slat h2 span.n{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.slat p{display:none}
.slat .mood{font-size:14.6px;border:1px solid currentColor;border-radius:9999px;padding:4px 10px;display:inline-block;line-height:1;white-space:nowrap;opacity:.9}
.slat .nowpill{font-weight:500;background:var(--accent);color:var(--accent-ink);border-radius:9999px;padding:6px 10px;font-size:14.6px;line-height:1;white-space:nowrap;justify-self:end;animation:pulse 2.4s ease-in-out infinite}
.slat .play{width:30px;height:30px;border:1px solid currentColor;border-radius:50%;display:grid;place-items:center;font-size:14.6px;justify-self:end}
.slat:hover .play{background:currentColor}.slat:hover .play i{color:#fff}.slat.dark:hover .play i{color:#141414}
.slat:hover h2{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
@media(max-width:960px){.slat{grid-template-columns:64px 1fr auto 28px;gap:0 10px}.slat .mood{display:none}}
.nowline{position:absolute;left:0;right:0;height:2px;background:var(--accent);z-index:2;pointer-events:none}
.nowline b{position:absolute;right:16px;top:-13px;font-weight:500;background:var(--accent);color:var(--accent-ink);border-radius:9999px;padding:5px 10px;font-size:14.6px;line-height:1;white-space:nowrap}
.sound .foot{padding:14px 16px 32px;font-size:16.5px;color:var(--ink-40)}
.embed{padding:12px 16px 16px;background:var(--bg);border-top:1px solid var(--rule-soft)}
.embed iframe{width:100%;height:152px;border:0;border-radius:12px;display:block}
.embed .open{display:flex;justify-content:space-between;gap:12px;font-size:14.6px;color:var(--ink-40);padding-top:8px}
.embed .open span b{font-weight:500;color:var(--ink)}
.embed .open a{color:var(--ink)}.embed .open a:hover{color:var(--accent-text,var(--accent))}
.slat.open .play{background:currentColor}.slat.open .play i{color:#fff}.slat.dark.open .play i{color:#141414}
.pair{margin-top:28px}.pair:first-child{margin-top:0}
.pair .theme{font-size:19.5px;color:var(--ink-40);margin-bottom:10px}
.pair .two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.pair .two .thumb h2{font-size:19.5px}

/* ---------- japan column ---------- */
.subhead{margin:40px 0 16px;padding-top:24px;border-top:1px solid var(--rule)}
.subhead:first-of-type{margin-top:0;padding-top:0;border-top:0}
.subhead .grey{font-size:19.5px}
.events .ev{display:grid;grid-template-columns:1fr auto;gap:6px 16px;padding:14px 0;border-top:1px solid var(--rule-soft);align-items:baseline}
.events .ev:first-child{border-top:0;padding-top:0}
.events .ev .d{grid-column:1/-1;font-size:16.5px;color:var(--ink-40)}
.events .ev h2{font-size:25.36px}
.events .ev .v{grid-column:1;font-size:19.5px;color:var(--ink-40)}
.events .ev .pill.soon{background:none;color:var(--ink);border:1px solid var(--ink)}
.events .ev .pill.closing{background:var(--accent);color:var(--accent-ink)}
.events .ev:hover h2{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
/* A picture that has not arrived yet used to be a dark rectangle. The frame now carries the publication's name
   from the start; the image covers it when it loads, and it stays if the image never comes. */
.pic[data-src]:not(.noimg){position:relative}
.pic[data-src]:not(.noimg):before{content:attr(data-src);position:absolute;inset:0;display:grid;place-items:center;padding:16px;text-align:center;color:var(--ink-40);font-size:19.5px;z-index:0}
.pic[data-src] img{position:relative;background:var(--ph)}   /* no z-index: the label sits before the image in box order, so the image covers it anyway — a z-index here lifted the image above captions laid over it (Cinepuuulse's lead lost its headlines) */
[hidden]{display:none!important}   /* .more-link and friends set display:block and were beating the attribute */
.more-link{display:block;margin-top:16px;color:var(--ink-40);font-size:19.5px}
.more-link:hover{color:var(--ink);text-decoration:underline;text-underline-offset:4px}
.list a{display:block;padding:12px 0;border-top:1px solid var(--rule-soft);font-size:25.36px;line-height:1.2}
.list a:first-child{border-top:0;padding-top:0}
.list a:hover{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.list.wire a .ja{display:block;font-size:19.5px;color:var(--ink-40);margin-top:2px}
.list.trendlist a{font-size:19.5px;padding:10px 0}
.list.sources{display:flex;flex-wrap:wrap;gap:2px 14px;line-height:1.35}
.list.sources a{display:inline;font-size:14.6px;padding:0;border:0;white-space:nowrap}
.list.sources a .grey{font-size:14.6px;margin-left:3px}
.list.trendlist a .grey{white-space:nowrap}
footer{font-size:16.5px;color:var(--ink-40);line-height:1.5}
.about-text p{font-size:19.5px;line-height:1.45;margin:16px 0 0;max-width:46ch}
.about-text h2{margin-bottom:8px}

/* ---------- footer: departure board ---------- */
.board{background:var(--board,#000);color:var(--board-ink,#fff);border-top:1px solid var(--board-rule,rgba(255,255,255,.25));position:relative;z-index:5}
.board .mq{overflow:hidden;white-space:nowrap;height:120px;display:flex;align-items:center;background:var(--board-mq,#F3F1EE);color:var(--board-mq-ink,#000)}
:root[data-theme="dark"] .board .mq{background:var(--board-mq,#1A1A1D);color:var(--board-mq-ink,#fff)}
.board .track{display:inline-flex;gap:0;animation:mq var(--dur,60s) linear infinite;will-change:transform}
.board .mq:hover .track{animation-play-state:paused}
.board .track span{font-size:56px;line-height:1;letter-spacing:-.02em;color:var(--board-mq-accent,var(--accent-text,var(--accent)));padding-right:64px;font-variant-numeric:tabular-nums}
.board .track span.ja{font-family:"Zen Kaku Gothic New","Hiragino Sans",sans-serif;letter-spacing:.04em;font-weight:500}
.board .track span.dim{color:var(--board-mq-dim,rgba(0,0,0,.45))}
:root[data-theme="dark"] .board .track span.dim{color:var(--board-dim,rgba(255,255,255,.55))}
.board .track span i{font-style:normal;color:var(--board-mq-ink,#000);margin-right:28px}
:root[data-theme="dark"] .board .track span i{color:var(--board-ink,#fff)}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.board .track{animation:none}}
.board .links{display:grid;grid-template-columns:1fr 1fr 1fr;font-size:16.5px;color:var(--board-dim,rgba(255,255,255,.6))}
.board .links > div{padding:20px 16px 28px;border-left:1px solid var(--board-rule,rgba(255,255,255,.18));display:flex;flex-wrap:wrap;gap:8px 20px;align-content:start}
.board .links > div:first-child{border-left:0}
.board .links a{color:var(--board-ink,#fff)}.board .links a:hover{color:var(--accent-text,var(--accent))}
.board .links b{font-weight:500;color:var(--board-dim,rgba(255,255,255,.6));width:100%}
@media(max-width:960px){.board .mq{height:88px}.board .track span{font-size:36px;padding-right:40px}.board .links{grid-template-columns:1fr}.board .links > div{border-left:0;border-top:1px solid var(--board-rule,rgba(255,255,255,.18))}}

/* ---------- single pages (story / week / archive) ---------- */
.single{padding:96px 16px 64px;max-width:760px;margin:0 auto}
.single.left{margin:0;padding-left:24px}
.note-body p{font-size:22px;line-height:1.5;margin:0 0 22px;max-width:40ch}
:root[lang="ja"] .note-body p{font-size:20px;line-height:1.85}
.note-list a{display:block;padding:22px 0;border-top:1px solid var(--rule-soft)}
.note-list a:first-child{border-top:0;padding-top:0}
.note-list .d{font-size:16.5px;color:var(--ink-40);display:block;margin-bottom:6px}

/* ---- places map (self-written; GSI tiles) — restyled on the owner's note of 2026-09-21 ---- */
.layout-bands #places{padding-bottom:40px}
.places-sec{padding:20px 24px 8px}
.places-sec .head{margin:0 0 6px}
.places-sec .head .h1{font-size:44px;line-height:1;letter-spacing:-.02em}
.places-sec .head .sub{max-width:60ch}
@media (max-width:960px){ .places-sec{padding:62px 16px 0} .places-sec .head .h1{font-size:34px} }
.pmap-wrap{position:relative}
.pmap{position:relative;height:min(64vh,640px);min-height:380px;overflow:hidden;background:#EEF1EA;border-radius:18px;cursor:grab;touch-action:none;user-select:none;box-shadow:inset 0 0 0 1px var(--rule-soft)}
.pmap:active{cursor:grabbing}
.pmap::after{display:none}
.pmap-world{position:absolute;left:0;top:0;width:0;height:0;will-change:transform;transform-origin:0 0}
.pmap-tiles .lvl{position:absolute;left:0;top:0;transform-origin:0 0;transition:opacity .3s}
.pmap-tiles .lvl.old{pointer-events:none}
.pmap-tiles .lvl.gone{opacity:0}
.pmap-world.anim{transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.pmap-tiles img{position:absolute;width:256px !important;height:256px !important;max-width:none !important;max-height:none !important;pointer-events:none;filter:sepia(.1) saturate(.65) brightness(1.03) contrast(.94)}   /* the government's pale map, nearly as drawn: sea, parks and roads keep their colours; the grey-sepia wash read as mourning (owner, 2026-09-21) */
:root[data-theme="dark"] .pmap{background:#15130F;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),inset 0 0 90px rgba(0,0,0,.5)}
:root[data-theme="dark"] .pmap-tiles img{filter:invert(1) hue-rotate(180deg) saturate(.4) brightness(.8) contrast(.85)}
/* pins: an ink disc with the kind's kanji and a short tail; colour by kind; the visited ones get the accent ring */
.pmap-marks .pm{position:absolute;transform:translate(-50%,calc(-100% - 6px)) scale(var(--inv,1));transform-origin:50% calc(100% + 6px);width:34px;height:34px;border-radius:50%;border:2px solid var(--bg);background:var(--accent);color:#fff;cursor:pointer;padding:0;box-shadow:0 3px 10px rgba(20,10,0,.28);transition:transform .15s,box-shadow .15s}
.pmap-marks .pm::after{content:"";position:absolute;left:50%;bottom:-8px;width:8px;height:8px;background:inherit;border-right:2px solid var(--bg);border-bottom:2px solid var(--bg);transform:translateX(-50%) rotate(45deg)}
.pmap-marks .pm i{display:block;font-style:normal;font-size:15px;line-height:30px;font-family:var(--sans);font-weight:700;letter-spacing:0}
.pmap-marks .pm:hover,.pmap-marks .pm.on{transform:translate(-50%,calc(-100% - 6px)) scale(calc(1.18*var(--inv,1)));box-shadow:0 8px 20px rgba(20,10,0,.35);z-index:5}
.pmap-marks .pm u{position:absolute;inset:-6px;border-radius:50%;border:2px solid var(--accent);pointer-events:none}
/* 'unsorted' (2026-09-30): a place whose name and article say neither food, drink, a bed nor a sight: a grey pin, never '食' */
.pmap-marks .pm.k-unsorted,.plist .pl.k-unsorted .k,.place-page .pl-near .k.k-unsorted,.pmap-ui .chips button.on.k-unsorted,.route-plan .rp-stop.k-unsorted i{background:#8A8F96;color:#fff}.pmap-tip.k-unsorted,.pmap-card.k-unsorted,.map-tease .mt-card.k-unsorted{--pc:#8A8F96}.pmap-ui .chips button.k-unsorted{--kc:#8A8F96}
.pmap-marks .pm.k-coffee{background:#6F4A2A}.pmap-marks .pm.k-bar{background:#4A3C8C}.pmap-marks .pm.k-sweets{background:#C94F78}.pmap-marks .pm.k-sight{background:#7A6A4F}.pmap-marks .pm.k-noodles{background:#D4A32A;color:#1C1A17}.pmap-marks .pm.k-sushi{background:#2E7C99}.pmap-marks .pm.k-stay{background:#3E7A4D}.pmap-marks .pm.k-comfort{background:#B2432B}.pmap-marks .pm.k-restaurant{background:var(--accent)}
.pmap-marks .pm.cl{border-radius:50%;transform:translate(-50%,-50%) scale(var(--inv,1));transform-origin:50% 50%;width:40px;height:40px;background:#fff;color:#1F1915;font-family:var(--mono);font-size:15px;font-weight:700;line-height:36px;border:2px solid var(--accent);box-shadow:0 0 0 5px rgba(var(--accent-rgb,196,69,26),.2),0 3px 10px rgba(20,10,0,.18)}
:root[data-theme="dark"] .pmap-marks .pm.cl{background:#241D18;color:#F3EDE4}
.pmap-marks .pm.cl::after{display:none}
.pmap-marks .pm.cl:hover{transform:translate(-50%,-50%) scale(calc(1.1*var(--inv,1)))}
.pmap-marks .pm.cl.big{width:48px;height:48px;line-height:44px;font-size:17px}
.pmap-osm .od{position:absolute;width:9px;height:9px;border-radius:50%;background:rgba(28,26,23,.34);border:1.5px solid rgba(247,243,236,.9);transform:translate(-50%,-50%) scale(var(--inv,1));cursor:pointer;transition:transform .15s,background .15s}
.pmap-osm .od:hover{transform:translate(-50%,-50%) scale(calc(1.8*var(--inv,1)));background:rgba(28,26,23,.75)}
.pmap-osm .od.a-cafe,.pmap-osm .od.a-coffee{background:rgba(111,74,42,.5)}.pmap-osm .od.a-bar,.pmap-osm .od.a-pub,.pmap-osm .od.a-izakaya{background:rgba(74,60,140,.5)}.pmap-osm .od.a-bakery,.pmap-osm .od.a-ice_cream,.pmap-osm .od.a-confectionery,.pmap-osm .od.a-pastry{background:rgba(201,79,120,.5)}
:root[data-theme="dark"] .pmap-osm .od{background:rgba(237,233,224,.35);border-color:rgba(14,13,12,.9)}
.pmap-tip.od{--pc:rgba(28,26,23,.45)}
.pmap-attr a{color:inherit;text-decoration:none}
.pmap-marks .me{position:absolute;width:16px;height:16px;border-radius:50%;background:#2A7FFF;border:3px solid #fff;box-shadow:0 0 0 8px rgba(42,127,255,.22);transform:translate(-50%,-50%) scale(var(--inv,1));pointer-events:none}
/* ---- motion: pins drop in, hover rings, a floating label, the list lights the pin ---- */
.pmap-tiles img{opacity:0;transition:opacity .4s ease}
.pmap-tiles img.ok{opacity:1}
.pmap-marks.drop .pm{animation:pmdrop .5s cubic-bezier(.2,.9,.3,1.3) both}
@keyframes pmdrop{from{transform:translate(-50%,calc(-100% - 30px)) scale(calc(.3*var(--inv,1)));opacity:0}60%{opacity:1}to{transform:translate(-50%,calc(-100% - 6px)) scale(var(--inv,1));opacity:1}}
.pmap-marks.still .pm{animation:none !important;transition:none !important}
.pmap-marks.still .pmap-tip{display:none}
.pmap-marks.drop .pm.cl{animation:pmpop .4s cubic-bezier(.2,.9,.3,1.3) both}
@keyframes pmpop{from{transform:translate(-50%,-50%) scale(calc(.4*var(--inv,1)));opacity:0}to{transform:translate(-50%,-50%) scale(var(--inv,1));opacity:1}}
.pmap-marks .pm::before{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid currentColor;opacity:0;pointer-events:none}
.pmap-marks .pm:hover::before,.pmap-marks .pm.on::before{animation:pmring 1.1s ease-out infinite}
@keyframes pmring{0%{transform:scale(.8);opacity:.75}100%{transform:scale(2.2);opacity:0}}
.pmap-marks .pm.cl:hover::before{animation:pmring 1.1s ease-out infinite;border-color:var(--accent)}
.pmap-marks .pm u{animation:pmvisit 1.6s ease-in-out 2}
@keyframes pmvisit{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.25);opacity:.45}}
.pmap-marks .pm.lit{transform:translate(-50%,calc(-100% - 6px)) scale(calc(1.25*var(--inv,1)));z-index:6;box-shadow:0 10px 24px rgba(20,10,0,.4)}
.pmap-tip{position:absolute;z-index:8;pointer-events:none;transform:translate(-50%,calc(-100% - 46px)) scale(var(--inv,1));transform-origin:50% calc(100% + 46px);background:var(--bg);color:var(--ink);border-radius:12px;padding:9px 12px 8px;box-shadow:0 8px 24px rgba(20,10,0,.25);max-width:260px;white-space:nowrap;animation:pmtip .18s cubic-bezier(.2,.9,.3,1.2) both;border-left:5px solid var(--pc,var(--accent))}
.pmap-tip::after{content:"";position:absolute;left:50%;bottom:-6px;width:12px;height:12px;background:var(--bg);transform:translateX(-50%) rotate(45deg);box-shadow:3px 3px 6px rgba(20,10,0,.08)}
.pmap-tip b{display:block;font-family:var(--serif);font-size:17px;line-height:1.15;font-weight:600;letter-spacing:-.01em;overflow:hidden;text-overflow:ellipsis}
.pmap-tip span{display:block;font-family:var(--mono);font-size:12.5px;color:var(--ink-40);margin-top:3px;letter-spacing:.02em}
.pmap-tip.k-coffee{--pc:#6F4A2A}.pmap-tip.k-bar{--pc:#4A3C8C}.pmap-tip.k-sweets{--pc:#C94F78}.pmap-tip.k-sight{--pc:#7A6A4F}.pmap-tip.k-noodles{--pc:#D4A32A}.pmap-tip.k-sushi{--pc:#2E7C99}.pmap-tip.k-stay{--pc:#3E7A4D}.pmap-tip.k-comfort{--pc:#B2432B}.pmap-tip.cl{--pc:var(--ink)}
@keyframes pmtip{from{transform:translate(-50%,calc(-100% - 34px)) scale(calc(.85*var(--inv,1)));opacity:0}to{transform:translate(-50%,calc(-100% - 46px)) scale(var(--inv,1));opacity:1}}
.plist .pl{transition:transform .18s ease,background .18s ease;border-radius:10px;padding-left:6px;margin-left:-6px}
.plist .pl:hover{transform:translateX(6px);background:rgba(28,26,23,.04)}
:root[data-theme="dark"] .plist .pl:hover{background:rgba(255,255,255,.05)}
.plist .pl .k{transition:transform .18s ease}
.plist .pl:hover .k{transform:scale(1.15) rotate(-8deg)}
.pmap-ui .chips button{transition:transform .15s ease,background .15s ease}
.pmap-ui .chips button:hover{transform:translateY(-2px)}
.pmap-zoom button:hover{transform:scale(1.08)}
.pmap-zoom button{transition:transform .15s ease}
.map-button{transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s}
.map-button:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(20,10,0,.25)}
.map-button .mb-art b{transition:transform .3s cubic-bezier(.2,.9,.3,1.4)}
.map-button:hover .mb-art b{transform:translateY(-6px)}
.map-button:hover .mb-art b:nth-child(2){transition-delay:.04s}.map-button:hover .mb-art b:nth-child(3){transition-delay:.08s}.map-button:hover .mb-art b:nth-child(4){transition-delay:.12s}.map-button:hover .mb-art b:nth-child(5){transition-delay:.16s}.map-button:hover .mb-art b:nth-child(6){transition-delay:.2s}
@media (prefers-reduced-motion:reduce){ .pmap-marks .pm,.pmap-marks .pm.cl,.pmap-tip,.pmap-marks .pm u{animation:none !important} .pmap-marks .pm:hover::before,.pmap-marks .pm.on::before{animation:none !important} .pmap-tiles img{transition:none;opacity:1} .plist .pl,.map-button,.map-button .mb-art b{transition:none} }
/* suggest a place */
.pmap-ui .tools button.sug{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.pmap.dropping{cursor:crosshair}
.pmap-marks .drop-pin{position:absolute;width:22px;height:22px;border-radius:50% 50% 50% 0;transform:translate(-50%,-100%) rotate(-45deg) scale(var(--inv,1));transform-origin:0 100%;background:#2A7FFF;border:2px solid #fff;box-shadow:0 3px 10px rgba(0,0,0,.3);animation:pmpop .3s both}
.pmap-sheet{position:absolute;right:12px;top:12px;bottom:12px;width:min(380px,calc(100% - 24px));z-index:9;background:var(--bg);color:var(--ink);border-radius:16px;box-shadow:0 14px 40px rgba(20,10,0,.3);overflow:auto;padding:18px 20px;animation:pmsheet .25s cubic-bezier(.2,.7,.2,1) both}
@keyframes pmsheet{from{transform:translateX(24px);opacity:0}to{transform:none;opacity:1}}
.pmap-sheet .x{position:absolute;right:2px;top:2px;width:44px;height:44px;border:0;background:none;font-size:24px;color:var(--ink-40);cursor:pointer;display:grid;place-items:center}
.pmap-sheet h3{font-family:var(--serif);font-size:26px;line-height:1.05;margin:4px 0 8px;letter-spacing:-.015em}
.pmap-sheet p{font-size:15px;line-height:1.4;margin:0 0 12px}
.pmap-sheet label{display:block;font-family:var(--mono);font-size:13.5px;color:var(--ink-40);margin:10px 0 0}
.pmap-sheet input,.pmap-sheet textarea{display:block;width:100%;box-sizing:border-box;font:inherit;font-size:16px;padding:9px 12px;margin-top:4px;border:1px solid var(--rule);border-radius:10px;background:var(--bg);color:var(--ink)}
.pmap-sheet .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.pmap-sheet .pin{display:flex;gap:10px;align-items:center;margin:10px 0 0;flex-wrap:wrap}
.pmap-sheet .drop{font-family:var(--mono);font-size:14.6px;padding:8px 12px;border-radius:9999px;border:1px solid var(--ink);background:none;color:var(--ink);cursor:pointer}
.pmap-sheet .drop.on{background:#2A7FFF;color:#fff;border-color:#2A7FFF}
.pmap-sheet .dropped{font-family:var(--mono);font-size:13px;color:var(--ink-40)}
.pmap-sheet .acts{display:flex;gap:12px;align-items:center;margin-top:16px}
.pmap-sheet .go{font-family:var(--mono);font-size:15px;padding:10px 16px;border-radius:9999px;border:0;background:var(--ink);color:var(--bg);cursor:pointer}
.pmap-sheet .msg{font-family:var(--mono);font-size:13.5px;color:var(--ink-40)}
@media (max-width:960px){ .pmap-sheet{left:8px;right:8px;top:auto;bottom:8px;width:auto;max-height:78%} }
/* likes */
.like{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:14.6px;padding:8px 13px;border-radius:9999px;border:1px solid var(--ink);background:none;color:var(--ink);cursor:pointer;transition:transform .15s,background .2s,color .2s}
.like .h{font-size:16px;line-height:1;transition:transform .2s}
.like:hover .h{transform:scale(1.25)}
.like.on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.like.pop .h{animation:lkpop .5s cubic-bezier(.2,.9,.3,1.6)}
@keyframes lkpop{0%{transform:scale(1)}40%{transform:scale(1.7) rotate(-12deg)}100%{transform:scale(1)}}
.note-like{display:flex;gap:12px;align-items:center;margin:28px 0 0;font-size:15px}
/* the controls float on the map: paper glass */
.pmap-ui{position:absolute;left:12px;right:12px;top:12px;z-index:6;display:flex;flex-direction:column;gap:8px;pointer-events:none}
.pmap-ui > *{pointer-events:auto}
.pmap-ui .chips{display:flex !important;flex-wrap:nowrap !important;gap:6px;overflow-x:auto;scrollbar-width:none;padding:2px 2px;margin:0}
.pmap-ui .chips button i{font-style:normal;font-weight:700;margin-right:1px}
.pmap-ui .chips button::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--kc,var(--accent));flex:none}
.pmap-ui .chips button[data-k="all"]::before{display:none}
.pmap-ui .chips button.k-coffee{--kc:#6F4A2A}.pmap-ui .chips button.k-bar{--kc:#4A3C8C}.pmap-ui .chips button.k-sweets{--kc:#C94F78}.pmap-ui .chips button.k-sight{--kc:#7A6A4F}.pmap-ui .chips button.k-noodles{--kc:#D4A32A}.pmap-ui .chips button.k-sushi{--kc:#2E7C99}.pmap-ui .chips button.k-stay{--kc:#3E7A4D}.pmap-ui .chips button.k-comfort{--kc:#B2432B}.pmap-ui .chips button.k-restaurant{--kc:var(--accent)}
.pmap-ui .chips button.on::before{background:#fff}
.pmap-ui .chips::-webkit-scrollbar{display:none}
.pmap-ui .chips button{flex:0 0 auto;font-family:var(--mono);font-size:14.6px;padding:9px 13px 9px 11px;min-height:40px;display:inline-flex;align-items:center;gap:6px;border:1px solid rgba(var(--ink-rgb),.14);background:rgba(var(--bg-rgb),.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--ink);border-radius:9999px;cursor:pointer;box-shadow:0 2px 8px rgba(20,10,0,.12);white-space:nowrap}
.pmap-ui .chips button.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.pmap-ui .chips button.on.k-coffee{background:#6F4A2A}.pmap-ui .chips button.on.k-bar{background:#4A3C8C}.pmap-ui .chips button.on.k-sweets{background:#C94F78}.pmap-ui .chips button.on.k-sight{background:#7A6A4F}.pmap-ui .chips button.on.k-noodles{background:#D4A32A;color:#1C1A17}.pmap-ui .chips button.on.k-sushi{background:#2E7C99}.pmap-ui .chips button.on.k-stay{background:#3E7A4D}.pmap-ui .chips button.on.k-comfort{background:#B2432B}.pmap-ui .chips button.on.k-restaurant{background:var(--accent);color:#fff}
.pmap-ui .tools{display:flex;gap:6px;align-items:center;max-width:520px}
@media (max-width:960px){ .pmap-ui .tools{flex-wrap:wrap;max-width:none} .pmap-ui .tools input{flex:1 1 150px;min-width:150px;font-size:15px;padding:8px 12px} .pmap-ui .tools button{padding:8px 10px;font-size:13.5px} }
.pmap-ui .tools input{flex:1 1 auto;min-width:0;font:inherit;font-size:16px;padding:9px 14px;min-height:40px;border:1px solid rgba(var(--ink-rgb),.14);border-radius:9999px;background:rgba(var(--bg-rgb),.94);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--ink);box-shadow:0 2px 8px rgba(20,10,0,.12)}
.pmap-ui .tools button{font-family:var(--mono);font-size:14.6px;padding:9px 12px;min-height:40px;border:1px solid rgba(var(--ink-rgb),.14);background:rgba(var(--bg-rgb),.94);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--ink);border-radius:9999px;cursor:pointer;white-space:nowrap;box-shadow:0 2px 8px rgba(20,10,0,.12)}
.pmap-ui .tools button.on{background:#2A7FFF;color:#fff;border-color:#2A7FFF}

.pmap-n{position:absolute;left:12px;bottom:12px;z-index:6;font-family:var(--mono);font-size:14.6px;color:var(--ink);background:rgba(var(--bg-rgb),.92);backdrop-filter:blur(8px);padding:6px 10px;border-radius:9999px;box-shadow:0 2px 8px rgba(20,10,0,.12)}
.pmap-zoom{position:absolute;right:12px;bottom:40px;display:flex;flex-direction:column;gap:6px;z-index:6}
.pmap-zoom button{width:44px;height:44px;border-radius:50%;border:1px solid rgba(var(--ink-rgb),.14);background:rgba(var(--bg-rgb),.94);backdrop-filter:blur(8px);color:var(--ink);font-size:22px;line-height:1;cursor:pointer;box-shadow:0 2px 8px rgba(20,10,0,.12)}
.pmap-attr{position:absolute;right:12px;bottom:10px;font-family:var(--mono);font-size:11.5px;color:var(--ink-40);z-index:6;text-decoration:none}
/* the card: a coloured edge for the kind, the name in the serif, two actions */
.pmap-card{position:absolute;left:12px;bottom:12px;z-index:7;max-width:min(440px,calc(100% - 24px));background:var(--bg);color:var(--ink);border-radius:16px;padding:18px 20px 16px 24px;box-shadow:0 14px 40px rgba(20,10,0,.28);overflow:hidden;opacity:1;animation:pmup .22s cubic-bezier(.2,.7,.2,1)}
.pmap-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:8px;background:var(--pc,var(--accent))}
.pmap-card.k-coffee{--pc:#6F4A2A}.pmap-card.k-bar{--pc:#4A3C8C}.pmap-card.k-sweets{--pc:#C94F78}.pmap-card.k-sight{--pc:#7A6A4F}.pmap-card.k-noodles{--pc:#D4A32A}.pmap-card.k-sushi{--pc:#2E7C99}.pmap-card.k-stay{--pc:#3E7A4D}.pmap-card.k-comfort{--pc:#B2432B}
@keyframes pmup{from{transform:translateY(12px)}to{transform:none}}
.pmap-card .x{position:absolute;right:2px;top:2px;width:44px;height:44px;border:0;background:none;font-size:24px;color:var(--ink-40);cursor:pointer;line-height:1;display:grid;place-items:center}
.pmap-card .like{position:absolute;right:46px;top:8px}
.pmap-card .kind{font-family:var(--mono);font-size:13.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--pc,var(--accent))}
.pmap-card h3{font-family:var(--serif);font-size:28px;line-height:1.05;margin:6px 0 8px;letter-spacing:-.015em}
.pmap-card p{margin:0 0 4px;font-size:16px;line-height:1.4}
.pmap-card .addr{color:var(--ink-40)}
.pmap-card .src{font-family:var(--mono);font-size:14px;color:var(--ink-40);margin-top:6px}
.pmap-card .src a{color:inherit}
.pmap-card .was{display:inline-block;font-family:var(--mono);font-size:13.5px;background:var(--accent);color:var(--accent-ink);padding:3px 9px;border-radius:9999px;margin-left:8px;vertical-align:middle}
.pmap-card .acts{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.pmap-card .acts a{font-family:var(--mono);font-size:14.6px;padding:9px 14px;border-radius:9999px;border:1px solid var(--accent);background:var(--accent);color:var(--accent-ink);text-decoration:none}
.pmap-card .acts a.go{background:none;border-color:var(--rule-soft);color:var(--ink)}
/* the list */
.plist{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:0 32px;margin-top:22px}
.plist .pl{display:flex;gap:14px;align-items:center;padding:12px 0;border-top:1px solid var(--rule-soft);color:inherit;text-decoration:none}
.plist .pl:hover .t b{text-decoration:underline;text-underline-offset:3px}
.plist .pl .k{flex:0 0 34px;width:34px;height:34px;border-radius:50%;background:var(--accent);color:#fff;text-align:center;line-height:34px;font-weight:700;font-size:15px}
.plist .pl.k-coffee .k{background:#6F4A2A}.plist .pl.k-bar .k{background:#4A3C8C}.plist .pl.k-sweets .k{background:#C94F78}.plist .pl.k-sight .k{background:#7A6A4F}.plist .pl.k-noodles .k{background:#D4A32A;color:#1C1A17}.plist .pl.k-sushi .k{background:#2E7C99}.plist .pl.k-stay .k{background:#3E7A4D}.plist .pl.k-comfort .k{background:#B2432B}
.plist .pl .t b{display:block;font-size:18px;line-height:1.25;font-family:var(--serif);font-weight:600}
.plist .pl .t span{display:block;font-size:14px;color:var(--ink-40);font-family:var(--mono);margin-top:3px}
.plist .pl-more{grid-column:1/-1;font-family:var(--mono);font-size:14.6px}
@media (max-width:960px){ .pmap{height:66vh;min-height:360px;border-radius:0;margin:0 -16px} .plist{grid-template-columns:1fr} .pmap-card{left:8px;right:8px;max-width:none} .pmap-ui{left:8px;right:8px;top:8px} }
/* the video hero (site.video_hero): the latest video large, the next four beside it */
.layout-bands .tiles.vh{grid-template-columns:minmax(0,1.7fr) minmax(280px,1fr);border-top:0}
.vhero{position:relative;background:#000}
.vhero .vh-play{display:block;width:100%;border:0;padding:0;background:#000;cursor:pointer;text-align:left;color:#fff;position:relative}
.vhero .pic{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;opacity:.92;transition:transform .5s cubic-bezier(.2,.7,.2,1),opacity .3s}
.vhero .vh-play:hover .pic{transform:scale(1.03);opacity:1}
.vhero .vh-ov{position:absolute;left:0;right:0;bottom:0;padding:90px 28px 24px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.55) 40%,rgba(0,0,0,.86));display:flex;flex-direction:column;gap:6px}
.vhero .vh-ov .k{font-family:var(--mono);font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:rgba(0,0,0,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);padding:5px 10px;border-radius:9999px;width:max-content;max-width:100%}
.vhero .vh-ov b{font-family:var(--serif);font-size:34px;line-height:1.05;letter-spacing:-.015em;font-weight:600;max-width:22ch;text-shadow:0 2px 12px rgba(0,0,0,.5)}
.vhero .vh-go{display:inline-flex;align-items:center;gap:8px;margin-top:8px;font-family:var(--mono);font-size:15px;background:var(--accent);color:#fff;padding:9px 14px;border-radius:9999px;width:max-content;transition:transform .15s}
.vhero .vh-play:hover .vh-go{transform:scale(1.05)}
.vhero iframe{display:block;width:100%;aspect-ratio:16/9;border:0}
.vh-list{display:flex;flex-direction:column;background:var(--bar);color:var(--bar-ink);border-left:1px solid rgba(255,255,255,.1)}
.vh-row{display:flex;gap:12px;align-items:center;padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.1);color:inherit;text-decoration:none;flex:1;transition:background .15s}
.vh-row:hover{background:rgba(255,255,255,.06)}
.vh-row .pic{width:104px;aspect-ratio:16/9;object-fit:cover;border-radius:6px;flex:0 0 auto}
.vh-row > span{display:flex;flex-direction:column;gap:3px;min-width:0}
.vh-row b{font-family:var(--serif);font-size:16px;line-height:1.2;font-weight:600;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.vh-row > span > span{font-family:var(--mono);font-size:12.5px;opacity:.7}
.vh-row.more b{color:var(--accent)}
.phone-vh{display:none}
@media (max-width:960px){ .layout-bands .tiles.vh{grid-template-columns:1fr} .phone-vh{display:block;padding:48px 0 0;background:var(--bar);color:var(--bar-ink)} .phone-vh .vh-list{border-left:0} .phone-vh + .places-sec{padding-top:14px} .vhero .vh-ov{padding:50px 16px 16px} .vhero .vh-ov b{font-size:24px} .vh-list{flex-direction:row;overflow-x:auto;scrollbar-width:none} .vh-row{flex:0 0 240px;flex-direction:column;align-items:flex-start;border-bottom:0;border-right:1px solid rgba(255,255,255,.1)} .vh-row .pic{width:100%} }
.places-sec + .cols{padding-top:20px}
/* routes on the map: a line through numbered stops, a chip to pick one, a card with the day plan */
.pmap-route{position:absolute;left:0;top:0;pointer-events:none;overflow:visible}
.pmap-route path{fill:none;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.pmap-route .halo{stroke:rgba(var(--bg-rgb),.9);stroke-width:9}
.pmap-route .line{stroke:var(--accent);stroke-width:4;stroke-dasharray:2 10;animation:rtmarch 1.2s linear infinite}
@keyframes rtmarch{to{stroke-dashoffset:-12}}
.pmap-marks.has-route .pm:not(.rs):not(.cl){opacity:.28;filter:saturate(.4)}
.pmap-marks.has-route .pm.cl{opacity:.35}
.pmap-marks .pm.rs{width:36px;height:36px;background:var(--accent);color:var(--accent-ink);border:3px solid var(--bg);z-index:4;opacity:1 !important;filter:none !important}
.pmap-marks .pm.rs i{font-family:var(--mono);font-size:15px;font-weight:800;line-height:30px}
.pmap-ui .routes{display:flex;flex-wrap:nowrap;gap:6px;overflow-x:auto;scrollbar-width:none;padding:2px 2px}
.pmap-ui .routes button{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;font-family:var(--serif);font-weight:600;font-size:15.5px;padding:7px 14px 7px 10px;min-height:40px;max-width:min(100%,520px);border:1px solid var(--accent);background:rgba(var(--bg-rgb),.94);backdrop-filter:blur(8px);color:var(--ink);border-radius:9999px;cursor:pointer;white-space:nowrap;box-shadow:0 2px 8px rgba(20,10,0,.12);transition:transform .15s}
.pmap-ui .routes button i{font-style:normal;color:var(--accent);font-size:17px}
.pmap-ui .routes button > span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:960px){ .pmap-ui .routes button{max-width:78vw;font-size:14.6px} .pmap-ui .routes button small{display:none} }
.pmap-ui .routes button small{font-family:var(--mono);font-size:12px;color:var(--ink-40);font-weight:400}
.pmap-ui .routes button:hover{transform:translateY(-2px)}
.pmap-ui .routes button.on{background:var(--accent);color:var(--accent-ink)} .pmap-ui .routes button.on i,.pmap-ui .routes button.on small{color:inherit}
.pmap-card.pmap-rcard{display:block;padding:16px 44px 16px 24px;max-width:min(460px,calc(100% - 24px))}   /* the plain card is a grid with no padding (photo column); the route card is a block with its own */
.pmap-rcard .by{font-family:var(--mono);font-size:13.5px;color:var(--ink-40);margin:0 0 8px}
.pmap-rcard .stops{list-style:none;margin:0 0 6px;padding:0;max-height:34vh;overflow:auto}
.pmap-rcard .stops li{display:flex;gap:10px;align-items:baseline;padding:5px 0;border-top:1px solid var(--rule-soft);cursor:pointer;font-size:15px;line-height:1.3}
.pmap-rcard .stops li:hover{color:var(--accent-text)}
.pmap-rcard .stops li b{flex:none;width:22px;height:22px;border-radius:50%;background:var(--accent);color:var(--accent-ink);font-family:var(--mono);font-size:12px;text-align:center;line-height:22px;transform:translateY(3px)}
.pmap-rcard .stops li em{font-style:normal;font-family:var(--mono);font-size:12.5px;color:var(--ink-40);margin-right:6px}
.pmap-card .rnote{font-family:var(--serif);font-size:17px;line-height:1.35;margin:0 0 8px}
.pmap-card .blurb{font-size:14.6px;line-height:1.45;color:var(--ink-40);margin:0 0 8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.place-page .pl-quote{margin:0 0 18px;padding:0 0 0 18px;border-left:4px solid var(--accent)}
.place-page .pl-quote p{font-family:var(--serif);font-size:19.5px;line-height:1.5;margin:0 0 6px}
.place-page .pl-quote cite{font-style:normal;font-family:var(--mono);font-size:13.5px;color:var(--ink-40)}
.place-page .hero figcaption{font-family:var(--mono);font-size:12.5px;color:var(--ink-40);margin-top:6px}
.place-page figure.hero{margin:14px 0 18px}
.map-tease .mt-route a{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:14px;background:rgba(var(--ink-rgb),.04);border:1px solid var(--rule-soft);color:var(--ink);text-decoration:none;transition:transform .15s,border-color .15s}
.map-tease .mt-route a:hover{transform:translateY(-2px);border-color:var(--accent)}
.map-tease .mt-route i{font-style:normal;color:var(--accent);font-size:22px;flex:none}
.map-tease .mt-route span{display:flex;flex-direction:column;min-width:0} .map-tease .mt-route small{font-family:var(--mono);font-size:12px;color:var(--ink-40)} .map-tease .mt-route b{font-family:var(--serif);font-size:16.5px;line-height:1.2;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.map-tease .mt-route em{font-style:normal;margin-left:auto;color:var(--accent);font-size:18px}
@media (max-width:960px){ .places-page .pmap-rcard{bottom:calc(30% + 8px);left:8px;right:8px;max-width:none} .pmap-rcard .stops{max-height:22vh} }
@media (prefers-reduced-motion:reduce){ .pmap-route .line{animation:none} }
/* the plan hero (site.plan_hero): the promise at route-title size and four doors into the trip */
.plan-hero{padding:34px 24px 38px}
.plan-hero .ph-k{font-family:var(--mono);font-size:15px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-text)}
.plan-hero .ph-h{font-family:var(--serif);font-size:clamp(44px,5.6vw,80px);line-height:.98;letter-spacing:-.025em;font-weight:700;margin:8px 0 12px;max-width:16ch}
.plan-hero .ph-sub{font-size:22px;line-height:1.4;max-width:46ch;margin:0 0 26px;color:var(--ink)}
.plan-hero .ph-doors{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.plan-hero .ph-door{position:relative;display:flex;flex-direction:column;gap:6px;min-height:168px;padding:20px 20px 22px;border-radius:var(--r,18px);border:1px solid var(--rule-soft);background:var(--bg);color:var(--ink);text-decoration:none;transition:transform .2s var(--ease),box-shadow .2s,border-color .2s}
.plan-hero .ph-door:hover{transform:translateY(-3px);box-shadow:0 16px 40px rgba(20,10,0,.16);border-color:var(--accent)}
.plan-hero .ph-door .k{font-family:var(--mono);font-size:14.6px;letter-spacing:.06em;text-transform:uppercase;color:var(--accent-text)}
.plan-hero .ph-door b{font-family:var(--serif);font-size:26px;line-height:1.1;font-weight:700}
.plan-hero .ph-door .s{font-size:16.5px;line-height:1.4;color:var(--ink-40)}
.plan-hero .ph-door em{font-style:normal;position:absolute;right:18px;bottom:14px;font-size:22px;color:var(--accent-text)}
.plan-hero .ph-door{padding-bottom:44px}
.plan-hero .ph-door.hot{background:linear-gradient(135deg,#C94A1B,#8E2F10);border:0;color:#fff}
.plan-hero .ph-door.hot .k,.plan-hero .ph-door.hot .s,.plan-hero .ph-door.hot em{color:rgba(255,255,255,.92)}
@media (max-width:1180px){ .plan-hero .ph-doors{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:960px){ .plan-hero{padding:26px 16px 28px} .plan-hero .ph-h{font-size:clamp(36px,10vw,46px)} .plan-hero .ph-sub{font-size:19.5px} .plan-hero .ph-door{min-height:140px;padding:16px 16px 18px} .plan-hero .ph-door b{font-size:22px} }
/* the routes band on the home: a rounded-card row, city chips */
.routes-tease{padding:22px 24px 26px}
.routes-tease .rt-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin:0 0 12px}
.routes-tease .rt-k{font-family:var(--mono);font-size:13.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-text)}
.routes-tease .rt-h{font-family:var(--serif);font-size:40px;line-height:1;letter-spacing:-.02em;margin:4px 0 6px;font-weight:700}
.routes-tease .rt-sub{margin:0;font-size:17px;line-height:1.4;color:var(--ink-40);max-width:60ch}
.routes-tease .rt-all{font-family:var(--mono);font-size:15px;color:var(--accent-text);text-decoration:none;white-space:nowrap;padding-bottom:6px}
.routes-tease .rt-chips{display:flex;gap:6px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding:2px 0 10px}
.routes-tease .rt-chips::-webkit-scrollbar{display:none}
.routes-tease .rt-chips button{flex:none;font-family:var(--mono);font-size:14px;padding:8px 13px;border-radius:9999px;border:1px solid var(--rule-soft);background:none;color:var(--ink);min-height:38px}
.routes-tease .rt-chips button.on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.routes-tease .rt-row{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(280px,1fr);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;padding:4px 4px 12px}
.routes-tease .rc{scroll-snap-align:start;display:flex;flex-direction:column;border-radius:18px;overflow:hidden;background:var(--bg);border:1px solid var(--rule-soft);color:inherit;text-decoration:none;transition:transform .2s var(--ease),box-shadow .2s}
.routes-tease .rc:hover{transform:translateY(-3px);box-shadow:0 16px 40px rgba(20,10,0,.14)}
.routes-tease .rc img,.routes-tease .rc .noimg{width:100%;aspect-ratio:16/10;object-fit:cover;display:block;background:var(--ph)}
.routes-tease .rc-body{display:flex;flex-direction:column;gap:6px;padding:12px 14px 14px}
.routes-tease .rc-k{font-family:var(--mono);font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--accent-text)}
.routes-tease .rc b{font-family:var(--serif);font-size:20px;line-height:1.12;letter-spacing:-.015em;font-weight:600}
.routes-tease .rc-m{display:flex;flex-wrap:wrap;gap:4px}
.routes-tease .rc-m i{font-style:normal;font-family:var(--mono);font-size:12px;background:rgba(var(--ink-rgb),.06);padding:3px 8px;border-radius:9999px}
@media (max-width:960px){ .todaypage .rp-stop p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden} .routes-tease{padding:20px 16px 22px} .routes-tease .rt-h{font-size:32px} .routes-tease .rt-row{grid-auto-columns:minmax(240px,78vw);margin:0 -16px;padding:4px 16px 12px} }
/* the home block: a window into the map (owner 2026-09-21: the flat card did not make anyone want to click) */
.map-tease{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,1fr);gap:0;border-radius:20px;overflow:hidden;background:var(--bg);border:1px solid var(--rule-soft);box-shadow:0 14px 40px rgba(20,10,0,.10)}
.map-tease .mt-map{position:relative;display:block;min-height:340px;overflow:hidden;background:#EEF1EA;text-decoration:none;color:var(--ink)}
:root[data-theme="dark"] .map-tease .mt-map{background:#15130F}
.map-tease .mt-tiles{position:absolute;inset:0;transition:transform 2.5s cubic-bezier(.2,.7,.2,1)}
.map-tease .mt-map:hover .mt-tiles{transform:scale(1.04)}
.map-tease .mt-tiles img{position:absolute;width:256px !important;height:256px !important;max-width:none !important}
.map-tease .mt-pins{position:absolute;inset:0}
.map-tease .mt-pins .pm{width:30px;height:30px;transform:translate(-50%,calc(-100% - 6px));transform-origin:50% calc(100% + 6px);pointer-events:auto;cursor:pointer}
.map-tease .mt-pins .pm i{font-size:13px;line-height:26px}
.map-tease .mt-pins .pm.on{transform:translate(-50%,calc(-100% - 6px)) scale(1.25);z-index:5}
.map-tease .mt-pins .pm.on::before{animation:pmring 1.2s ease-out infinite}
.map-tease .mt-card{position:absolute;z-index:6;display:flex;gap:10px;align-items:center;transform:translate(14px,calc(-100% - 40px));background:var(--bg);color:var(--ink);border-radius:14px;padding:8px 12px 8px 8px;box-shadow:0 10px 30px rgba(20,10,0,.22);border-left:5px solid var(--pc,var(--accent));max-width:260px;animation:pmtip .22s cubic-bezier(.2,.9,.3,1.2) both;pointer-events:none}
.map-tease .mt-card.flip{transform:translate(calc(-100% - 14px),calc(-100% - 40px))}
.map-tease .mt-card img{width:52px;height:52px;border-radius:9px;object-fit:cover;flex:none;background:var(--ph)}
.map-tease .mt-card b{display:block;font-family:var(--serif);font-size:16.5px;line-height:1.15;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px}
.map-tease .mt-card small{display:block;font-family:var(--mono);font-size:12.5px;color:var(--ink-40);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px}
.map-tease .mt-card.k-coffee{--pc:#6F4A2A}.map-tease .mt-card.k-bar{--pc:#4A3C8C}.map-tease .mt-card.k-sweets{--pc:#C94F78}.map-tease .mt-card.k-sight{--pc:#7A6A4F}.map-tease .mt-card.k-noodles{--pc:#D4A32A}.map-tease .mt-card.k-sushi{--pc:#2E7C99}.map-tease .mt-card.k-stay{--pc:#3E7A4D}.map-tease .mt-card.k-comfort{--pc:#B2432B}
.map-tease .mt-go{position:absolute;left:14px;bottom:14px;z-index:6;font-family:var(--mono);font-size:14.6px;background:rgba(var(--bg-rgb),.92);backdrop-filter:blur(8px);padding:8px 12px;border-radius:9999px;box-shadow:0 2px 8px rgba(20,10,0,.12);transition:transform .2s}
.map-tease .mt-map:hover .mt-go{transform:translateX(4px)}
.map-tease .mt-text{display:flex;flex-direction:column;gap:12px;padding:28px 30px 26px;justify-content:center}
.map-tease .mt-k{font-family:var(--mono);font-size:13.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-text)}
.map-tease .mt-h{font-family:var(--serif);font-size:30px;line-height:1.08;letter-spacing:-.02em;margin:0;font-weight:600}
.map-tease .mt-h b{font-size:1.7em;line-height:.9;color:var(--accent);font-weight:700;letter-spacing:-.03em;display:block;margin-bottom:6px}
.map-tease .mt-sub{margin:0;font-size:16px;line-height:1.45;color:var(--ink-40);max-width:44ch}
.map-tease .mt-cities{display:flex;flex-wrap:wrap;gap:6px}
.map-tease .mt-cities a{display:inline-flex;align-items:baseline;gap:6px;font-family:var(--serif);font-weight:600;font-size:15.5px;padding:7px 12px;border-radius:9999px;border:1px solid var(--rule-soft);color:var(--ink);text-decoration:none;transition:transform .15s,background .15s,border-color .15s}
.map-tease .mt-cities a small{font-family:var(--mono);font-size:12px;color:var(--ink-40)}
.map-tease .mt-cities a:hover{transform:translateY(-2px);border-color:var(--accent);background:rgba(var(--bg-rgb),1)}
.map-tease .mt-btn{align-self:flex-start;font-family:var(--mono);font-size:16px;background:var(--accent);color:var(--accent-ink);padding:12px 20px;border-radius:9999px;text-decoration:none;display:inline-flex;gap:8px;align-items:center;transition:transform .15s,box-shadow .15s;margin-top:4px}
.map-tease .mt-btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(196,69,26,.3)}
.map-tease .mt-btn span{transition:transform .2s}
.map-tease .mt-btn:hover span{transform:translateX(4px)}
@media (max-width:960px){ .map-tease{grid-template-columns:minmax(0,1fr);border-radius:16px} .map-tease > *{min-width:0} .map-tease .mt-cities{flex-wrap:wrap} .map-tease .mt-map{min-height:240px} .map-tease .mt-text{padding:20px 18px 22px;gap:10px} .map-tease .mt-h{font-size:24px} .map-tease .mt-card{max-width:220px} }
@media (prefers-reduced-motion:reduce){ .map-tease .mt-tiles,.map-tease .mt-btn,.map-tease .mt-btn span{transition:none} .map-tease .mt-card{animation:none} }
/* the home button */
.map-button{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:24px;align-items:center;background:var(--ink);color:var(--bg);border-radius:18px;padding:28px 32px;text-decoration:none;min-height:200px;position:relative;overflow:hidden}
.map-button::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 50%,rgba(224,120,30,.28),transparent 45%),radial-gradient(circle at 85% 20%,rgba(46,124,153,.25),transparent 40%);pointer-events:none}
.map-button > *{position:relative}
.map-button .mb-art{display:grid;grid-template-columns:repeat(3,54px);gap:12px;justify-content:center;align-content:center}
.map-button .mb-art b{width:54px;height:54px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-size:22px;font-family:var(--sans);border:2px solid rgba(255,255,255,.25)}
.map-button .mb-art b.k-coffee{background:#6F4A2A}.map-button .mb-art b.k-bar{background:#4A3C8C}.map-button .mb-art b.k-noodles{background:#D4A32A;color:#1C1A17}.map-button .mb-art b.k-sushi{background:#2E7C99}.map-button .mb-art b.k-stay{background:#3E7A4D}
.map-button .mb-text{display:flex;flex-direction:column;gap:8px}
.map-button .mb-k{font-family:var(--mono);font-size:14.6px;letter-spacing:.08em;text-transform:uppercase;opacity:.7}
.map-button .mb-h{font-family:var(--serif);font-size:44px;line-height:1;letter-spacing:-.02em}
.map-button .mb-sub{font-size:17px;line-height:1.4;opacity:.8;max-width:52ch}
.map-button .mb-kinds{display:flex;flex-wrap:wrap;gap:6px 14px;font-family:var(--mono);font-size:14.6px;opacity:.85}
.map-button .mb-kinds i{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--accent);color:#fff;font-style:normal;font-size:11px;margin-right:5px;vertical-align:middle}
.map-button .mb-kinds i.k-coffee{background:#6F4A2A}.map-button .mb-kinds i.k-bar{background:#4A3C8C}.map-button .mb-kinds i.k-noodles{background:#D4A32A;color:#1C1A17}.map-button .mb-kinds i.k-sushi{background:#2E7C99}.map-button .mb-kinds i.k-stay{background:#3E7A4D}.map-button .mb-kinds i.k-sweets{background:#C94F78}.map-button .mb-kinds i.k-comfort{background:#B2432B}
.map-button .mb-go{font-family:var(--mono);font-size:18px;margin-top:6px;color:var(--accent)}
@media (max-width:960px){ .map-button{grid-template-columns:1fr;padding:22px 20px;border-radius:14px} .map-button .mb-art{order:2;gap:8px;grid-template-columns:repeat(6,44px);justify-content:start} .map-button .mb-art b{width:44px;height:44px;font-size:18px} .map-button .mb-h{font-size:34px} }
/* a story over the map */
.pmap-story{position:fixed;inset:0;z-index:70}
.pmap-story .ps-scrim{position:absolute;inset:0;background:rgba(var(--ink-rgb),.38);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);animation:psfade .25s both}
.pmap-story .ps-panel{position:absolute;top:0;right:0;bottom:0;width:min(760px,100%);background:var(--bg);color:var(--ink);overflow:auto;box-shadow:-20px 0 60px rgba(20,10,0,.25);animation:psin .32s cubic-bezier(.2,.7,.2,1) both;overscroll-behavior:contain}
.pmap-story .x{position:sticky;top:10px;float:right;margin:10px 10px 0 0;width:44px;height:44px;border-radius:50%;background:var(--bg);color:var(--ink);border:1px solid var(--rule-soft);font-size:26px;line-height:1;display:grid;place-items:center;box-shadow:0 4px 14px rgba(20,10,0,.18);z-index:2;cursor:pointer}
.pmap-story .ps-body.single{padding:24px 28px 64px;max-width:none;margin:0}
.pmap-story .ps-body .hero img{border-radius:14px}
.pmap-story .ps-loading{padding:40px 0}
body.ps-open{overflow:hidden}
@keyframes psin{from{transform:translateX(40px);opacity:0}to{transform:none;opacity:1}}
@keyframes psfade{from{opacity:0}to{opacity:1}}
@media (max-width:960px){ .pmap-story .ps-panel{top:auto;left:0;right:0;bottom:0;width:auto;height:92%;border-radius:20px 20px 0 0;animation-name:psup} .pmap-story .ps-body.single{padding:16px 16px 64px} @keyframes psup{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}} }
@media (prefers-reduced-motion:reduce){ .pmap-story .ps-panel,.pmap-story .ps-scrim{animation:none} }
/* the place page */
.single.placepage{max-width:960px}
.place-page .hero{margin:14px 0 18px;aspect-ratio:auto;background:none}
.place-page .hero img{width:100%;max-height:520px;object-fit:cover;border-radius:18px;display:block}
.place-page .pill.was{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.place-page .pl-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,1fr);gap:24px 32px;align-items:start;margin-top:8px}
.place-page .pl-body p{margin:0 0 12px;font-size:17px;line-height:1.45}
.place-page .pl-body p b{display:block;font-family:var(--mono);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-40);margin-bottom:2px;font-weight:600}
.place-page .pl-addr span{font-size:19.5px;line-height:1.4}
.place-page .pl-title{font-family:var(--serif);font-size:19px;line-height:1.3;color:var(--ink);font-weight:600}
.place-page .acts{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:16px 0 14px}
.place-page .acts a{font-family:var(--mono);font-size:14.6px;padding:10px 15px;border-radius:9999px;border:1px solid var(--rule-soft);color:var(--ink);text-decoration:none;min-height:40px;display:inline-flex;align-items:center}
.place-page .acts a.go{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.place-page .pl-route{font-family:var(--mono);font-size:14.6px} .place-page .pl-route a{color:var(--accent-text);text-decoration:none}
.place-page .pl-note{font-size:14.6px;line-height:1.45;margin-top:18px}
.place-page .pl-map{position:relative;display:block;aspect-ratio:1/1;max-height:420px;border-radius:18px;overflow:hidden;background:#EEF1EA;border:1px solid var(--rule-soft)}
:root[data-theme="dark"] .place-page .pl-map{background:#15130F}
.place-page .pl-map .pmap-tiles{position:absolute;inset:0;transition:transform 2.5s cubic-bezier(.2,.7,.2,1)}
.place-page .pl-map:hover .pmap-tiles{transform:scale(1.04)}
.place-page .pl-map .pmap-tiles img{position:absolute;width:256px !important;height:256px !important;max-width:none !important}
.place-page .pl-map .pmap-marks{position:absolute;inset:0;pointer-events:none}
.place-page .pl-map .mt-go{position:absolute;left:12px;bottom:12px;z-index:6;font-family:var(--mono);font-size:14px;background:rgba(var(--bg-rgb),.92);backdrop-filter:blur(8px);padding:7px 11px;border-radius:9999px;box-shadow:0 2px 8px rgba(20,10,0,.12)}
.place-page .pl-nearby{margin-top:36px;border-top:1px solid var(--rule-soft);padding-top:18px}
.place-page .pl-nearby h2.t{font-family:var(--serif);font-size:24px;margin:0 0 10px;letter-spacing:-.015em}
.place-page .pl-near-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:4px 24px}
.place-page .pl-near{display:flex;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--rule-soft);color:inherit;text-decoration:none;position:relative}
.place-page .pl-near img{width:56px;height:56px;border-radius:12px;object-fit:cover;flex:none;background:var(--ph)}
.place-page .pl-near .k{flex:none;width:34px;height:34px;border-radius:50%;background:var(--accent);color:#fff;text-align:center;line-height:34px;font-weight:700;font-size:14px}
.place-page .pl-near img + .k{position:absolute;left:38px;bottom:10px;width:22px;height:22px;line-height:22px;font-size:11px;border:2px solid var(--bg)}
.place-page .pl-near .k.k-coffee{background:#6F4A2A}.place-page .pl-near .k.k-bar{background:#4A3C8C}.place-page .pl-near .k.k-sweets{background:#C94F78}.place-page .pl-near .k.k-sight{background:#7A6A4F}.place-page .pl-near .k.k-noodles{background:#D4A32A;color:#1C1A17}.place-page .pl-near .k.k-sushi{background:#2E7C99}.place-page .pl-near .k.k-stay{background:#3E7A4D}.place-page .pl-near .k.k-comfort{background:#B2432B}
.place-page .pl-near .t b{display:block;font-family:var(--serif);font-size:17px;line-height:1.2;font-weight:600}
.place-page .pl-near .t small{display:block;font-family:var(--mono);font-size:13px;color:var(--ink-40);margin-top:3px}
.place-page .pl-near:hover .t b{text-decoration:underline;text-underline-offset:3px}
.pmap-card h3 a{color:inherit;text-decoration:none} .pmap-card h3 a:hover{text-decoration:underline;text-underline-offset:3px}
@media (max-width:960px){ .place-page .pl-grid{grid-template-columns:1fr} .place-page .pl-map{aspect-ratio:4/3;max-height:320px} .place-page .hero img{max-height:320px;border-radius:14px} }
/* ---- the sheet menu (site.menu_style:"sheet"): a paper sheet under the bar, big destinations first, then search, filters and the rest ---- */
body.menu-sheet .menu{background:var(--bg);color:var(--ink);border-bottom:1px solid var(--rule-soft);box-shadow:0 30px 60px rgba(20,10,0,.18);max-height:calc(100vh - 48px);overflow:auto;overscroll-behavior:contain}
body.menu-sheet .menu .tiles{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;max-width:1104px;margin:0 auto;padding:22px 24px 6px}
body.menu-sheet .menu .tiles .mt{display:flex;gap:12px;align-items:center;padding:14px 16px;border-radius:16px;background:rgba(var(--ink-rgb),.045);border:1px solid var(--rule-soft);color:var(--ink);text-decoration:none;min-height:72px;transition:transform .18s var(--ease),background .18s,border-color .18s}
body.menu-sheet .menu .tiles .mt:hover{transform:translateY(-2px);border-color:var(--accent);background:var(--bg)}
body.menu-sheet .menu .tiles .mt i{flex:none;width:42px;height:42px;border-radius:50%;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;font-style:normal;font-family:var(--sans);font-weight:700;font-size:18px}
body.menu-sheet .menu .tiles .mt i.k-coffee{background:#6F4A2A}body.menu-sheet .menu .tiles .mt i.k-bar{background:#4A3C8C}body.menu-sheet .menu .tiles .mt i.k-sushi{background:#2E7C99}body.menu-sheet .menu .tiles .mt i.k-stay{background:#3E7A4D}body.menu-sheet .menu .tiles .mt i.k-ink{background:var(--ink);color:var(--bg)}
body.menu-sheet .menu .tiles .mt span{display:flex;flex-direction:column;min-width:0}
body.menu-sheet .menu .tiles .mt b{font-family:var(--serif);font-size:18px;line-height:1.15;font-weight:600;letter-spacing:-.01em}
body.menu-sheet .menu .tiles .mt small{font-family:var(--mono);font-size:12.5px;color:var(--ink-40);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.menu-sheet .menu .grid{max-width:1104px;margin:0 auto;padding:12px 24px 28px;gap:0 32px;grid-template-columns:1.25fr 1fr 1fr}
body.menu-sheet .menu .grid > div{padding:10px 0 0;border-left:0}
body.menu-sheet .menu .ch{height:auto;font-family:var(--mono);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-40);border-bottom:0;margin:12px 0 8px;padding:0}
body.menu-sheet .menu .search{border:1px solid var(--rule-soft);border-radius:12px;background:rgba(var(--ink-rgb),.045);padding:4px 6px 4px 14px;margin:0 0 12px;gap:8px}
body.menu-sheet .menu .search input{font-size:17px;letter-spacing:0;color:var(--ink);min-height:36px}
body.menu-sheet .menu .search input::placeholder{color:var(--ink-40)}
body.menu-sheet .menu .search button{font-family:var(--mono);font-size:14px;background:var(--accent);color:var(--accent-ink);padding:8px 12px;border-radius:9px}
body.menu-sheet .menu a,body.menu-sheet .menu button{font-size:17px;line-height:1.3;padding:9px 10px;margin:0 -10px;border-radius:10px;min-height:40px;display:flex;align-items:center;color:var(--ink);transition:background .15s}
body.menu-sheet .menu a:hover,body.menu-sheet .menu .grid button:hover{background:rgba(var(--ink-rgb),.05)}
body.menu-sheet .menu .grid button[aria-pressed="true"]{color:var(--accent-text);font-weight:600}
body.menu-sheet .menu #menu-signals{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 0}
body.menu-sheet .menu #menu-signals button{display:inline-flex;gap:6px;align-items:center;font-family:var(--mono);font-size:14px;padding:8px 13px;margin:0;border:1px solid var(--rule-soft);border-radius:9999px;min-height:40px;background:none}
body.menu-sheet .menu #menu-signals button .small{font-size:12px;color:var(--ink-40)}
body.menu-sheet .menu #menu-signals button:hover,body.menu-sheet .menu #menu-signals button[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
body.menu-sheet .menu #menu-signals button[aria-pressed="true"] .small,body.menu-sheet .menu #menu-signals button:hover .small{color:inherit;opacity:.8}
body.menu-sheet .menu .gap{height:14px}
body.menu-sheet .menu .small{font-family:var(--mono);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-40);margin:6px 0 4px}
body.menu-sheet .menu .sub-open,body.menu-sheet .menu a.support-open{font-family:var(--mono);font-size:14px;padding:9px 14px;margin:4px 0 0;border-radius:9999px;display:inline-flex;min-height:38px;background:var(--accent);color:var(--accent-ink);width:auto}
body.menu-sheet .menu a.support-open{background:none;border:1px solid var(--rule-soft);color:var(--ink);margin-left:6px}
body.menu-sheet .menu .sub-form input{font-size:16px;border-radius:10px}
@media (max-width:960px){
  body.menu-sheet .menu .tiles{grid-template-columns:1fr 1fr;padding:14px 16px 4px;gap:8px}
  body.menu-sheet .menu .tiles .mt{padding:12px;min-height:64px;border-radius:14px} body.menu-sheet .menu .tiles .mt i{width:36px;height:36px;font-size:16px} body.menu-sheet .menu .tiles .mt b{font-size:16px}
  body.menu-sheet .menu .grid{grid-template-columns:1fr;padding:8px 16px 40px;gap:0}
  body.menu-sheet .menu .grid > div{padding:6px 0 0}
  body.menu-sheet .menu a,body.menu-sheet .menu button{font-size:17px;min-height:44px}
}
/* ---- the calm footer (site.footer_style:"calm"): paper, a hairline, the brand and three columns, the ticker gone ---- */
body.board-calm .board{background:var(--bg);color:var(--ink);border-top:1px solid var(--rule-soft)}
body.board-calm .board .mq{display:none}
body.board-calm .board .links{max-width:1104px;margin:0 auto;grid-template-columns:1.4fr 1fr 1fr;font-size:16px;color:var(--ink-40);padding:0 24px}
body.board-calm .board .links > div{padding:40px 0 32px;border-left:0;gap:8px}
body.board-calm .board .links > div + div{padding-left:32px}
body.board-calm .board .links b{font-family:var(--mono);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-40);font-weight:600;margin-bottom:8px}
body.board-calm .board .links > div:first-child b{font-family:var(--serif);font-size:30px;line-height:1.05;letter-spacing:-.02em;text-transform:none;color:var(--ink);margin-bottom:8px}
body.board-calm .board .links > div:first-child span{font-size:17px;line-height:1.4;color:var(--ink);letter-spacing:0;max-width:30ch}
body.board-calm .board .links > div:first-child span.indie{font-size:14px;color:var(--ink-40);font-family:var(--mono)}
body.board-calm .board .links > div:first-child #board-when{font-family:var(--mono);font-size:13.5px;color:var(--ink-40);padding-top:16px}
body.board-calm .board .links a{font-size:16.5px;line-height:1.3;letter-spacing:0;color:var(--ink);min-height:32px;display:inline-flex;align-items:center}
body.board-calm .board .links a:hover{color:var(--accent-text);text-decoration:underline;text-underline-offset:3px}
body.board-calm .board .links .sub-open,body.board-calm .board .links .sub-form button{background:var(--accent);color:var(--accent-ink);font-family:var(--mono);font-size:14px;padding:9px 14px;border-radius:9999px}
body.board-calm .board .links .sub-form input{border:1px solid var(--rule-soft);border-radius:10px;background:var(--bg);color:var(--ink);font-size:16px}
body.board-calm .board .tip-row{max-width:1104px;margin:0 auto;border-top:1px solid var(--rule-soft);padding:14px 24px 22px}
body.board-calm .board .tip-row .tip-k,body.board-calm .board .tip-row p{color:var(--ink-40);font-family:var(--mono)}
body.board-calm .board .tip-row .support-open{border:1px solid var(--rule-soft);color:var(--ink);border-radius:9999px;padding:6px 12px}
body.board-calm .board .festline{border-top:1px solid var(--rule-soft)}
@media (max-width:960px){ body.board-calm .board .links{grid-template-columns:1fr;padding:0 16px} body.board-calm .board .links > div{padding:24px 0 8px} body.board-calm .board .links > div + div{padding-left:0;border-top:1px solid var(--rule-soft);padding-top:18px} body.board-calm .board .tip-row{padding:12px 16px 20px} }
/* ---- routes: the plan on a route page, the index of routes ---- */
.route-plan{margin:18px 0 28px;padding:18px 20px 20px;border:1px solid var(--rule-soft);border-radius:18px;background:rgba(var(--ink-rgb),.03)}
.route-plan .rp-head{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;font-family:var(--mono);font-size:14px;color:var(--ink-40);margin:0 0 14px}
.route-plan .rp-head i{font-style:normal;background:rgba(var(--ink-rgb),.06);padding:3px 9px;border-radius:9999px;font-size:12.5px;color:var(--ink)}
.route-plan .rp-caveat{font-family:var(--mono);font-size:13px;line-height:1.4;color:var(--ink-40);margin:-6px 0 12px}
.route-plan .rp-tl{list-style:none;margin:0;padding:0;position:relative}
.route-plan .rp-tl::before{content:"";position:absolute;left:78px;top:8px;bottom:8px;width:2px;background:var(--rule-soft)}
.route-plan .rp-stop{display:grid;grid-template-columns:56px 40px minmax(0,1fr);gap:0 12px;align-items:start;padding:8px 0;position:relative}
.route-plan .rp-stop time{font-family:var(--mono);font-size:15px;font-weight:600;font-variant-numeric:tabular-nums;padding-top:6px;color:var(--ink)}
.route-plan.shifted .rp-stop time{color:var(--accent-text)}
.route-plan .rp-stop i{width:36px;height:36px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-style:normal;font-family:var(--sans);font-weight:700;font-size:15px;border:3px solid var(--bg);position:relative;z-index:1}
.route-plan .rp-stop.k-coffee i{background:#6F4A2A}.route-plan .rp-stop.k-bar i{background:#4A3C8C}.route-plan .rp-stop.k-sweets i{background:#C94F78}.route-plan .rp-stop.k-sight i{background:#7A6A4F}.route-plan .rp-stop.k-noodles i{background:#D4A32A;color:#1C1A17}.route-plan .rp-stop.k-sushi i{background:#2E7C99}.route-plan .rp-stop.k-stay i{background:#3E7A4D}.route-plan .rp-stop.k-comfort i{background:#B2432B}
.route-plan .rp-stop b{display:block;font-family:var(--serif);font-size:19.5px;line-height:1.2;font-weight:600;padding-top:4px}
.route-plan .rp-stop b a{color:inherit;text-decoration:none} .route-plan .rp-stop b a:hover{text-decoration:underline;text-underline-offset:3px}
.route-plan .rp-stop p{margin:4px 0 2px;font-size:16px;line-height:1.4}
.route-plan .rp-stop small{display:block;font-family:var(--mono);font-size:12.5px;color:var(--ink-40)}
.route-plan .rp-leg{display:grid;grid-template-columns:56px 40px minmax(0,1fr);gap:0 12px;align-items:center;padding:2px 0;font-family:var(--mono);font-size:13px;color:var(--ink-40)}
.route-plan .rp-leg .m{grid-column:2;text-align:center;font-size:11px;letter-spacing:.06em;text-transform:uppercase}
.route-plan .rp-leg .t{grid-column:3}
.route-plan .rp-day{font-family:var(--mono);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-text);padding:14px 0 4px 108px}
.route-plan .rp-tools{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:14px 0 4px;padding-left:108px}
.route-plan .rp-now{font-family:var(--mono);font-size:14.6px;padding:9px 14px;border-radius:9999px;background:var(--accent);color:var(--accent-ink);border:1px solid var(--accent);min-height:40px}
.route-plan .rp-now.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.route-plan .rp-tools a{font-family:var(--mono);font-size:14.6px;color:var(--accent-text);text-decoration:none}
.route-plan .rp-hotel,.route-plan .rp-music{margin-top:18px;padding-top:16px;border-top:1px solid var(--rule-soft)}
.route-plan .k{display:block;font-family:var(--mono);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-40);margin-bottom:6px}
.route-plan .rp-hotel b{font-family:var(--serif);font-size:20px;font-weight:600}
.route-plan .rp-hotel p{margin:6px 0 10px;font-size:15.5px;line-height:1.45}
.route-plan .rp-hotel .acts{display:flex;flex-wrap:wrap;gap:8px}
.route-plan .rp-hotel .acts a{font-family:var(--mono);font-size:14px;padding:8px 13px;border-radius:9999px;border:1px solid var(--accent);background:var(--accent);color:var(--accent-ink);text-decoration:none}
.route-plan .rp-hotel .acts a.quiet{background:none;border-color:var(--rule-soft);color:var(--ink)}
.route-plan .rp-tracks{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.route-plan .rp-track{border:1px solid var(--rule-soft);border-radius:12px;padding:12px 14px;background:var(--bg)}
.route-plan .rp-track .k{margin-bottom:8px}
.route-plan .rp-track .sp{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:14px;color:var(--ink);text-decoration:none;border:1px solid var(--rule-soft);padding:8px 12px;border-radius:9999px}
.route-plan .rp-track .sp::before{content:"";width:12px;height:12px;border-radius:50%;background:#1DB954}
.route-plan .rp-track iframe{border-radius:12px;display:block}
@media (max-width:600px){ .route-plan{padding:14px 12px 16px} .route-plan .rp-stop,.route-plan .rp-leg{grid-template-columns:48px 36px minmax(0,1fr);gap:0 8px} .route-plan .rp-tl::before{left:66px} .route-plan .rp-day,.route-plan .rp-tools{padding-left:0} .route-plan .rp-stop b{font-size:18px} }
/* ---- the route page: a day told in the home's numbered bands, full width, never a column in the middle of the screen ---- */
.single.routepage{max-width:none;padding:0 0 64px}
.routepage .crumb{padding:88px 24px 0 64px}
.routepage .rt-bands{border-top:1px solid var(--rule-soft);margin-top:18px}
.routepage .band{display:grid;grid-template-columns:64px minmax(0,1fr);border-bottom:1px solid var(--rule-soft)}
.layout-bands.cv .single.routepage .rt-bands .band{content-visibility:visible;contain-intrinsic-size:auto}   /* site.cv skips off-screen bands on the home; on a route page it would blank the day below the fold */
.routepage .band > .rail{position:sticky;top:48px;align-self:start;padding:40px 0 36px 24px;font-family:var(--mono);font-size:25.36px;line-height:1;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.routepage .band > .rail b:before{content:"";display:block;width:12px;height:12px;background:var(--accent);margin-bottom:10px}
.routepage .band > .rail span{display:block;font-size:14.6px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-40);margin-top:10px;writing-mode:vertical-rl}
.routepage .band > section{padding:40px 40px 48px 0;min-width:0;max-width:1240px}
.routepage .pill{margin-bottom:10px}
.single.routepage :is(h1,.h1).rt-title{font-size:clamp(44px,5.6vw,80px);line-height:.98;letter-spacing:-.025em;margin:6px 0 10px;max-width:20ch}
.routepage .meta{margin:0 0 22px}
.routepage .rt-hero{margin:0 0 28px;border-radius:var(--r,18px);overflow:hidden;background:var(--ph)}
.routepage .rt-hero img{display:block;width:100%;aspect-ratio:21/9;object-fit:cover}
.routepage .rt-open{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:0 56px;align-items:start}
.routepage .rt-lede{min-width:0}
.routepage .rt-lede p{max-width:56ch;font-size:21px;line-height:1.5;margin:0 0 16px}
.routepage .rt-lede p.lead{font-size:26px;line-height:1.35;color:var(--ink)}
.routepage .rt-facts{margin:0;border-top:1px solid var(--ink)}
.routepage .rt-facts div{display:flex;justify-content:space-between;gap:16px;align-items:baseline;padding:10px 0;border-bottom:1px solid var(--rule-soft)}
.routepage .rt-facts dt{font-family:var(--mono);font-size:14.6px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-40);margin:0}
.routepage .rt-facts dd{margin:0;font-size:19.5px;text-align:right;font-variant-numeric:tabular-nums}
.routepage .rt-acts{display:flex;flex-wrap:wrap;gap:10px;margin:26px 0 14px}
.routepage .rt-go{font-family:var(--mono);font-size:16.5px;padding:11px 18px;border-radius:9999px;background:var(--accent);color:var(--accent-ink);text-decoration:none;min-height:46px;display:inline-flex;align-items:center}
.routepage .rt-go.quiet{background:none;border:1px solid var(--rule-soft);color:var(--ink)}
.routepage .rp-caveat{font-family:var(--mono);font-size:15px;line-height:1.45;color:var(--ink-40);margin:0;max-width:86ch}
/* the day */
.routepage .route-plan{margin:0;padding:0;border:0;background:none;border-radius:0}
.routepage .rp-tl::before{left:calc(84px + 24px + 22px);top:6px;bottom:40px}
.routepage .rp-day{font-family:var(--serif);font-size:38px;line-height:1;letter-spacing:-.02em;color:var(--ink);text-transform:none;padding:26px 0 14px;border-top:3px solid var(--accent);margin-top:22px}
.routepage .rp-day:first-child{margin-top:0}
.routepage .rp-stop{grid-template-columns:84px 44px minmax(0,1fr) 300px;gap:0 24px;padding:16px 0;align-items:start}
.routepage .rp-stop time{font-size:19.5px;padding-top:8px}
.routepage .rp-stop i{width:44px;height:44px;font-size:17px;border-width:4px}
.routepage .rp-stop b{font-size:26px;line-height:1.15;padding-top:4px}
.routepage .rp-stop p{font-size:20px;line-height:1.5;max-width:none;margin:8px 0 6px}
.routepage .rp-stop small{font-size:14.6px}
.routepage .rp-acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.routepage .rp-acts a{font-family:var(--mono);font-size:15px;color:var(--accent-text);text-decoration:none;border:1px solid var(--rule-soft);border-radius:9999px;padding:8px 13px;min-height:40px;display:inline-flex;align-items:center}
.routepage .rp-acts a.quiet{color:var(--ink)}
.routepage .rp-shot{margin:0;border-radius:var(--r-sm,12px);overflow:hidden;background:var(--ph);aspect-ratio:3/2}
.routepage .rp-shot img{display:block;width:100%;height:100%;object-fit:cover}
.routepage .rp-shot.noimg{display:grid;place-items:center;background:rgba(var(--ink-rgb),.05)}
.routepage .rp-shot.noimg img{display:none}
.routepage .rp-shot.noimg span{font-family:var(--sans);font-size:44px;font-weight:700;color:rgba(var(--ink-rgb),.16)}
.routepage .rp-leg{grid-template-columns:84px 44px minmax(0,1fr);gap:0 24px;font-size:15px;padding:4px 0}
.routepage .rp-leg .m{font-size:14.6px;grid-column:1;text-align:right;white-space:nowrap}
.routepage .rp-tools{padding-left:calc(84px + 24px);margin:22px 0 0}
.routepage .rp-now{font-size:16.5px;min-height:46px;padding:11px 18px}
.routepage .rp-tools a{font-size:16.5px}
/* the map, the bed, the music */
.routepage .rt-mapcard{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 18px;text-decoration:none;color:inherit;border:1px solid var(--rule-soft);border-radius:var(--r,18px);padding:26px 28px;background:linear-gradient(135deg,rgba(var(--ink-rgb),.04),rgba(var(--ink-rgb),.01))}
.routepage .rt-mapcard:hover{border-color:var(--accent)}
.routepage .rt-mapk{font-family:var(--mono);font-size:14.6px;letter-spacing:.06em;text-transform:uppercase;color:var(--accent-text);flex-basis:100%}
.routepage .rt-mapcard b{font-family:var(--serif);font-size:34px;line-height:1.05;font-weight:600}
.routepage .rt-mapgo{font-family:var(--mono);font-size:16.5px;color:var(--accent-text);margin-left:auto}
.routepage .rp-hotel,.routepage .rp-music{margin:0;padding:0;border-top:0}
.routepage .rp-hotel .k,.routepage .rp-music .k{font-size:14.6px}
.routepage .rp-hotel b{font-size:32px}
.routepage .rp-hotel p{font-size:19.5px;max-width:62ch}
.routepage .rp-hotel .acts a{font-size:15.5px;min-height:44px;display:inline-flex;align-items:center}
.routepage .rp-tracks{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}
.routepage .rp-track .k{font-size:14.6px}
.routepage .note-bio{font-size:19.5px;line-height:1.5;color:var(--ink-40);max-width:62ch;margin:0}
.routepage .note-refs h2{font-size:15px}
.routepage .note-refs li{font-size:19.5px}
@media (max-width:1180px){
  .routepage .band > section{padding-right:24px}
  .routepage .rt-open{grid-template-columns:minmax(0,1fr) 300px;gap:0 40px}
  .routepage .rp-stop{grid-template-columns:76px 44px minmax(0,1fr) 250px;gap:0 20px}
  .routepage .rp-tl::before{left:calc(76px + 20px + 22px)}
  .routepage .rp-leg{grid-template-columns:76px 44px minmax(0,1fr);gap:0 20px}
  .routepage .rp-tools{padding-left:calc(76px + 20px)}
}
/* what it costs, what to do if it rains, and a card to hold up to a driver */
.routepage .rt-money{max-width:900px}
.routepage .rt-money-day,.routepage .rt-money-tot{display:grid;grid-template-columns:120px minmax(0,1fr) auto;gap:4px 18px;align-items:baseline;padding:16px 0;border-bottom:1px solid var(--rule-soft)}
.routepage .rt-money-tot{border-bottom:0;border-top:2px solid var(--ink);margin-top:6px}
.routepage .rt-money .d{font-family:var(--mono);font-size:15px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-40)}
.routepage .rt-money b{font-family:var(--serif);font-size:34px;line-height:1;font-weight:600;font-variant-numeric:tabular-nums}
.routepage .rt-money-tot b{font-size:44px;color:var(--accent-text)}
.routepage .rt-money .o{font-family:var(--mono);font-size:16.5px;color:var(--ink-40);text-align:right;font-variant-numeric:tabular-nums}
.routepage .rt-money .f{grid-column:2/-1;font-family:var(--mono);font-size:15px;color:var(--ink-40)}
.routepage .rt-money .gap{grid-column:2/-1;font-family:var(--mono);font-size:15px;color:var(--accent-text)}
.routepage .rt-money .lvl{font-family:var(--mono);font-size:15px;letter-spacing:.06em;text-transform:uppercase;background:var(--accent);color:var(--accent-ink);padding:6px 12px;border-radius:9999px;justify-self:end}
.routepage .rt-money .cov{grid-column:2/-1;font-family:var(--mono);font-size:15px;color:var(--accent-text)}
.routepage .rt-money-note{font-family:var(--mono);font-size:15px;line-height:1.5;color:var(--ink-40);margin:16px 0 0;max-width:80ch}
.routepage .rp-cost{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:baseline;margin:10px 0 0}
.routepage .rp-cost .c{font-family:var(--serif);font-size:23px;font-weight:600;font-variant-numeric:tabular-nums}
.routepage .rp-cost .u,.routepage .rp-cost .vf{font-family:var(--mono);font-size:14.6px;color:var(--ink-40)}
.routepage .rp-cost .est{font-family:var(--mono);font-size:14.6px;color:var(--accent-text);border:1px dashed var(--accent);border-radius:9999px;padding:2px 9px}
.routepage .rp-cost .bk{font-family:var(--mono);font-size:14.6px;padding:3px 10px;border-radius:9999px;background:rgba(var(--ink-rgb),.07)}
.routepage .rp-cost .bk.required{background:var(--accent);color:var(--accent-ink)}
.routepage .rp-planb{margin:10px 0 0;font-size:17.5px;line-height:1.45;color:var(--ink-40);border-left:3px solid var(--rule-soft);padding-left:14px;max-width:64ch}
.routepage .rp-hours{margin:10px 0 0;font-size:17.5px;line-height:1.45;color:var(--ink-40);max-width:64ch}
.routepage .rp-hours span{font-family:var(--mono);font-size:14.6px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);margin-right:10px}
.routepage .rp-planb span{display:block;font-family:var(--mono);font-size:14.6px;letter-spacing:.06em;text-transform:uppercase;color:var(--accent-text)}
.routepage .rt-planb{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:18px}
.routepage .rt-planb li{border:1px solid var(--rule-soft);border-radius:var(--r,18px);padding:18px 20px}
.routepage .rt-planb b{font-family:var(--serif);font-size:21px;font-weight:600;display:block}
.routepage .rt-planb p{margin:8px 0 0;font-size:17.5px;line-height:1.45;color:var(--ink-40)}
.routepage .rp-card-btn{font-family:var(--mono);font-size:15px;border:1px solid var(--rule-soft);border-radius:9999px;padding:8px 13px;min-height:40px;background:none;color:var(--ink)}
.rp-card{position:fixed;inset:0;z-index:70;display:grid;place-items:center;background:rgba(0,0,0,.55);padding:16px}
.rp-card[hidden]{display:none}
.rp-card .in{background:#fff;color:#111;border-radius:18px;padding:32px 28px;max-width:520px;width:100%;text-align:center;box-shadow:0 30px 80px rgba(0,0,0,.4)}
.rp-card .lead{font-family:var(--sans);font-size:19.5px;margin:0 0 18px;color:#555}
.rp-card .nm{font-family:var(--serif);font-size:34px;line-height:1.25;margin:0 0 10px;font-weight:700}
.rp-card .ad{font-family:var(--sans);font-size:26px;line-height:1.5;margin:0 0 20px}
.rp-card .say{font-family:var(--sans);font-size:23px;line-height:1.4;margin:0;padding-top:18px;border-top:1px solid #ddd}
.rp-card .x{margin-top:22px;font-family:var(--mono);font-size:16.5px;min-height:46px;padding:11px 20px;border-radius:9999px;border:1px solid #ccc;background:#f4f4f4;color:#111}
@media (max-width:960px){
  .routepage .rt-money-day,.routepage .rt-money-tot{grid-template-columns:minmax(0,1fr) auto}
  .routepage .rt-money .d{grid-column:1/-1}
  .routepage .rt-money b{font-size:28px} .routepage .rt-money-day b,.routepage .rt-money-tot b{grid-column:1/-1;white-space:nowrap} .routepage .rt-money .o{grid-column:1/-1;text-align:left} .routepage .rt-money .f,.routepage .rt-money .gap,.routepage .rt-money .cov{grid-column:1/-1;text-align:left} .routepage .rt-money .lvl{grid-column:1/-1;justify-self:start}
  .routepage .rt-money-tot b{font-size:34px}
  .routepage .rt-planb{grid-template-columns:minmax(0,1fr)}
  .rp-card .nm{font-size:27px} .rp-card .ad{font-size:22px} .rp-card .say{font-size:20px}
}
/* the first 24 hours: one way of doing a thing per row, with what it costs and where we got the figure */
.arrivalpage .ar-sub{font-size:26px;line-height:1.35;max-width:52ch;margin:10px 0 18px}
.arrivalpage .ar-h{font-family:var(--serif);font-size:40px;line-height:1.05;letter-spacing:-.02em;margin:0 0 10px;font-weight:700}
.arrivalpage .ar-intro{font-size:21px;line-height:1.5;color:var(--ink-40);max-width:62ch;margin:0 0 22px}
.arrivalpage .ar-list{list-style:none;margin:0;padding:0;max-width:1000px}
.arrivalpage .ar-opt{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:6px 24px;padding:20px 0;border-top:1px solid var(--rule-soft);align-items:baseline}
.arrivalpage .ar-opt .n b{font-family:var(--serif);font-size:26px;line-height:1.15;font-weight:600}
.arrivalpage .ar-opt .to{display:block;font-family:var(--mono);font-size:15px;color:var(--ink-40);margin-top:4px}
.arrivalpage .ar-opt .f{grid-column:2;grid-row:1/3;text-align:right;display:flex;flex-direction:column;gap:4px;align-items:flex-end}
.arrivalpage .ar-opt .p{font-family:var(--serif);font-size:34px;line-height:1;font-weight:600;font-variant-numeric:tabular-nums}
.arrivalpage .ar-opt .m{font-family:var(--mono);font-size:16.5px;color:var(--ink-40)}
.arrivalpage .ar-opt .d{grid-column:1;margin:8px 0 0;font-size:19.5px;line-height:1.5;max-width:60ch}
.arrivalpage .ar-opt .s{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:8px}
.arrivalpage .ar-opt .src{font-family:var(--mono);font-size:14.6px;color:var(--accent-text)}
.arrivalpage .ar-opt .ck,.arrivalpage .ar-opt .est{font-family:var(--mono);font-size:14.6px;color:var(--ink-40)}
.arrivalpage .ar-opt .est{color:var(--accent-text);border:1px dashed var(--accent);border-radius:9999px;padding:2px 9px}
.arrivalpage .ar-list:empty::after{content:"We have not filled this section yet.";display:block;font-family:var(--mono);font-size:16.5px;color:var(--ink-40);padding:18px 0;border-top:1px solid var(--rule-soft)}
@media (max-width:960px){
  .arrivalpage .ar-sub{font-size:21px}
  .arrivalpage .ar-h{font-size:30px}
  .arrivalpage .ar-intro{font-size:19.5px}
  .arrivalpage .ar-opt{grid-template-columns:minmax(0,1fr)}
  .arrivalpage .ar-opt .f{grid-column:1;grid-row:auto;text-align:left;flex-direction:row;align-items:baseline;gap:12px;margin-top:6px}
  .arrivalpage .ar-opt .p{font-size:28px}
  .arrivalpage .ar-opt .d{font-size:18px}
}
@media (max-width:960px){
  .routepage .crumb{padding:76px 16px 0}
  .routepage .band{display:block;border-bottom:1px solid var(--rule-soft)}
  .routepage .band > .rail{position:static;padding:22px 16px 0;font-size:16.5px;display:flex;align-items:baseline;gap:10px}
  .routepage .band > .rail b:before{display:none}
  .routepage .band > .rail span{writing-mode:horizontal-tb;margin:0;font-size:14.6px}
  .routepage .band > section{padding:14px 16px 32px;max-width:none}
  .single.routepage :is(h1,.h1).rt-title{font-size:clamp(34px,9vw,44px);max-width:none}
  .routepage .rt-hero{margin:0 -16px 22px;border-radius:0}
  .routepage .rt-hero img{aspect-ratio:16/10}
  .routepage .rt-open{display:block}
  .routepage .rt-lede p{font-size:19.5px;max-width:none}
  .routepage .rt-lede p.lead{font-size:22px}
  .routepage .rt-facts{margin-top:22px}
  .routepage .rt-facts dd{font-size:18px}
  .routepage .rp-day{font-size:28px}
  .routepage .rp-stop{grid-template-columns:64px 40px minmax(0,1fr);gap:0 12px}
  .routepage .rp-stop b{font-size:21px}
  .routepage .rp-stop p{font-size:18px}
  .routepage .rp-stop i{width:40px;height:40px;font-size:15px}
  .routepage .rp-shot{grid-column:1 / -1;margin-top:12px;aspect-ratio:16/9}
  .routepage .rp-shot.noimg{display:none}
  .routepage .rp-leg{grid-template-columns:64px 40px minmax(0,1fr);gap:0 12px}
  .routepage .rp-tl::before{left:calc(64px + 12px + 20px)}
  .routepage .rp-tools{padding-left:0}
  .routepage .rt-mapcard{padding:20px 18px}
  .routepage .rt-mapcard b{font-size:26px}
  .routepage .rt-mapgo{margin-left:0;flex-basis:100%}
  .routepage .rp-hotel b{font-size:24px}
}
/* the routes index */
.single.routespage{max-width:1104px}
.routespage .rfilters{display:flex;flex-direction:column;gap:8px;margin:10px 0 22px}
.routespage .rf{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.routespage .rf b{font-family:var(--mono);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-40);width:84px;flex:none}
.routespage .rf button{font-family:var(--mono);font-size:14px;padding:8px 13px;border-radius:9999px;border:1px solid var(--rule-soft);background:none;color:var(--ink);min-height:38px}
.routespage .rf button.on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.routespage .rgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}
.routespage .rc{display:flex;flex-direction:column;border-radius:18px;overflow:hidden;background:var(--bg);border:1px solid var(--rule-soft);color:inherit;text-decoration:none;transition:transform .2s var(--ease),box-shadow .2s}
.routespage .rc:hover{transform:translateY(-3px);box-shadow:0 16px 40px rgba(20,10,0,.14)}
.routespage .rc img,.routespage .rc .noimg{width:100%;aspect-ratio:16/10;object-fit:cover;display:block;background:var(--ph)}
.routespage .rc-body{display:flex;flex-direction:column;gap:6px;padding:14px 16px 16px}
.routespage .rc-k{font-family:var(--mono);font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--accent-text)}
.routespage .rc b{font-family:var(--serif);font-size:22px;line-height:1.1;letter-spacing:-.015em;font-weight:600}
.routespage .rc-x{font-size:15px;line-height:1.45;color:var(--ink-40)}
.routespage .rc-m{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.routespage .rc-m i{font-style:normal;font-family:var(--mono);font-size:12px;background:rgba(var(--ink-rgb),.06);padding:3px 8px;border-radius:9999px}
.routespage .rnone{margin-top:20px}
/* Today: the form, and the build card in the routes band */
.single.todaypage{max-width:900px}
.today-form{display:flex;flex-direction:column;gap:14px;margin:8px 0 24px;padding:18px 20px;border:1px solid var(--rule-soft);border-radius:var(--r,18px);background:rgba(var(--ink-rgb),.03)}
.today-form .tf{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.today-form .tf > b{font-family:var(--mono);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-40);width:120px;flex:none}
.today-form .chips{display:flex;flex-wrap:wrap;gap:6px}
.today-form .chips button{font-family:var(--mono);font-size:14px;padding:8px 13px;border-radius:9999px;border:1px solid var(--rule-soft);background:none;color:var(--ink);min-height:40px;display:inline-flex;gap:6px;align-items:baseline}
.today-form .chips button small{font-size:11.5px;color:var(--ink-40)}
.today-form .chips button.on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)} .today-form .chips button.on small{color:inherit;opacity:.8}
.today-form input[type=time]{font:inherit;font-size:17px;padding:8px 12px;border:1px solid var(--rule-soft);border-radius:12px;background:var(--bg);color:var(--ink);min-height:40px}
.today-form .acts{margin-top:4px} .today-form .acts > b{display:none}
.today-form .go{font-family:var(--mono);font-size:15px;padding:11px 18px;border-radius:9999px;background:var(--accent);color:var(--accent-ink);border:1px solid var(--accent);min-height:44px}
.today-form .quiet{font-family:var(--mono);font-size:14.6px;padding:10px 14px;border-radius:9999px;border:1px solid var(--rule-soft);background:none;color:var(--ink);min-height:44px}
.today-form .tf-wx{font-family:var(--mono);font-size:13.5px;color:var(--ink-40)}
.today-plan .rp-copy{font-family:var(--mono);font-size:14.6px;padding:9px 14px;border-radius:9999px;border:1px solid var(--rule-soft);background:none;color:var(--ink);min-height:40px}
.routes-tease .rc-build{background:linear-gradient(135deg,#C94A1B,#8E2F10);color:#fff;border:0}   /* white on #C94A1B is 4.69:1; #FF9A3C was 2.11:1 */
.routes-tease .rc-build .rc-k{color:rgba(255,255,255,.85)} .routes-tease .rc-build .rc-x{color:rgba(255,255,255,.9)} .routes-tease .rc-build .rc-m i{background:rgba(255,255,255,.2);color:#fff;font-size:13px}
.routes-tease .rc-build .rc-body{padding:22px 18px;justify-content:center;min-height:100%}
@media (max-width:600px){ .today-form{padding:14px} .today-form .tf > b{width:100%} }
/* the map page: one stage under the bar, the list floating on it, the title as glass in the corner */
.single.mappage{max-width:none;padding:0}
.places-page{padding:48px 0 0;display:block}
.places-page .pmap-wrap{position:relative}
.places-page .pmap{height:calc(100vh - 48px);min-height:520px;border-radius:0;box-shadow:none}
.places-page .pmap::after{display:none}
.pmap-ui .ttl{display:flex;flex-direction:column;gap:2px;background:rgba(var(--bg-rgb),.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(var(--ink-rgb),.1);border-radius:14px;padding:10px 14px 11px;width:max-content;max-width:100%;box-shadow:0 4px 16px rgba(20,10,0,.12)}
.pmap-ui .ttl .k{font-family:var(--mono);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-40)}
.pmap-ui .ttl b{font-family:var(--serif);font-size:26px;line-height:1;letter-spacing:-.02em;font-weight:600}
.pmap-ui .ttl{order:-2}
.pmap-ui .cities{display:flex;flex-wrap:nowrap;gap:6px;overflow-x:auto;scrollbar-width:none;padding:2px 2px;order:-1}
.pmap-ui .cities::-webkit-scrollbar{display:none}
.pmap-ui .cities button{flex:0 0 auto;font-family:var(--serif);font-weight:600;font-size:16px;padding:8px 14px;min-height:40px;border:1px solid rgba(var(--ink-rgb),.12);background:rgba(var(--bg-rgb),.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--ink);border-radius:9999px;cursor:pointer;white-space:nowrap;transition:transform .15s,background .15s}
.pmap-ui .cities button small{font-family:var(--mono);font-size:11.5px;color:var(--ink-40);margin-left:6px;font-weight:400}
.pmap-ui .cities button:hover{transform:translateY(-2px)}
.pmap-ui .cities button.on{background:var(--accent);color:#fff;border-color:var(--accent)}
.pmap-ui .cities button.on small{color:rgba(255,255,255,.8)}
.places-page .pmap-ui{right:auto;width:min(560px,calc(100% - 24px))}
.pmap-side{display:flex;flex-direction:column;background:var(--bg);border-left:1px solid var(--rule-soft);overflow:hidden;height:calc(100vh - 48px);min-height:520px}
@media (min-width:961px){ .places-page .pmap-wrap{display:grid;grid-template-columns:minmax(0,1fr) 360px} .places-page .pmap-wrap .pmap{grid-column:1} }
.places-page .pmap-card,.places-page .pmap-sheet{z-index:9}
.pmap-side .ps-handle{display:none}
.pmap-side .ps-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px 6px}
.pmap-side .ps-head b{font-family:var(--serif);font-size:22px;letter-spacing:-.015em;cursor:default}
.pmap-side .ps-head .sug{font-family:var(--mono);font-size:13.5px;padding:8px 12px;min-height:40px;border-radius:9999px;border:1px solid var(--accent);background:var(--accent);color:var(--accent-ink);cursor:pointer;white-space:nowrap}
.pmap-side .ps-sub{font-size:14px;line-height:1.4;color:var(--ink-40);margin:0;padding:0 16px 8px}
.pmap-side .plist{flex:1;overflow:auto;padding:0 12px 12px;margin:0;display:block;scrollbar-width:thin}
.pmap-side .plist .pl{padding:9px 6px;margin:0;border-top:1px solid var(--rule-soft)}
.pmap-side .plist .pl:first-child{border-top:0}
.plist .pl{position:relative}
.plist .pl .th{width:56px;height:56px;border-radius:12px;object-fit:cover;flex:0 0 56px;background:var(--ph)}
.plist .pl .k.s{position:absolute;left:44px;top:auto;bottom:10px;width:22px;height:22px;line-height:22px;font-size:11px;border:2px solid var(--bg);flex:none}
.pmap-side .plist .pl .t b{font-size:16.5px}
.pmap-side .plist .pl .t span{font-size:13px}
.pmap-card{display:grid;grid-template-columns:minmax(0,1fr);padding:0}
.pmap-card .body{padding:16px 20px 16px 24px}
.pmap-card.ph{grid-template-columns:132px minmax(0,1fr);max-width:min(520px,calc(100% - 24px))}
.pmap-card .pic{width:132px;height:100%;min-height:150px;object-fit:cover;display:block;margin-left:8px}
.pmap-card .x{z-index:2}
.places-page .pmap-card{left:16px;bottom:16px}
.places-page .pmap-n{left:16px;bottom:auto;top:auto;bottom:16px}
.places-page .pmap-card ~ .pmap-n,.places-page .pmap-card:not([hidden]) ~ .pmap-n{opacity:0}
.places-page .pmap-zoom{right:auto;left:16px;bottom:56px;flex-direction:row}
@media (min-width:961px){ .places-page .pmap-n{left:16px;bottom:16px} .places-page .pmap-card{bottom:16px;left:16px} .places-page .pmap-zoom{left:auto;right:16px;bottom:40px;flex-direction:column} .places-page .pmap-attr{right:16px;bottom:12px} }
@media (max-width:960px){
  .places-page{padding-top:48px} .places-page .pmap{height:calc(100vh - 48px);min-height:420px;margin:0}
  .places-page .pmap-ui{left:8px;right:8px;top:8px;width:auto;gap:6px} .pmap-ui .ttl{display:none}
  .pmap-side{position:absolute;left:0;right:0;top:auto;bottom:0;width:auto;height:30%;min-height:150px;border-radius:18px 18px 0 0;border-left:0;border-top:1px solid var(--rule-soft);box-shadow:0 -12px 40px rgba(20,10,0,.16);z-index:7;transition:height .3s cubic-bezier(.2,.7,.2,1)}
  .pmap-side.open{height:74%}
  .pmap-side .ps-handle{display:block;border:0;background:none;padding:14px 0 12px;cursor:pointer;width:100%;min-height:36px} .pmap-side .ps-handle i{display:block;width:44px;height:5px;border-radius:9999px;background:rgba(var(--ink-rgb),.25);margin:0 auto}
  .pmap-side .ps-head{padding:4px 16px 4px} .pmap-side .ps-sub{display:none}
  .places-page .pmap-card{left:8px;right:8px;bottom:calc(30% + 8px);max-width:none} .pmap-card.ph{grid-template-columns:100px minmax(0,1fr)} .pmap-card .pic{width:100px;min-height:120px}
  .places-page .pmap-n{bottom:calc(30% + 8px)} .places-page .pmap-zoom{bottom:calc(30% + 8px);left:auto;right:8px;flex-direction:column} .places-page .pmap-attr{bottom:calc(30% + 2px);right:8px;font-size:10px}
  .pmap-side.open ~ .pmap-card{display:none}
}
.note-list .pill{margin:0 0 8px;top:0}
.note-body a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.note-refs{margin:40px 0 0;max-width:40ch;padding-top:18px;border-top:1px solid var(--rule-soft)}
.note-refs h2{font-size:15px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-40);margin:0 0 12px;font-weight:600}
.note-refs ol{margin:0;padding-left:1.3em}
.note-refs li{font-size:18px;line-height:1.45;margin:0 0 9px}
.note-refs li a{color:inherit}
.note-refs li .grey{font-size:15px;white-space:nowrap}
.single.editor .summary{max-width:52ch}
.single.editor .editor-h{font-size:15px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-40);margin:40px 0 4px;font-weight:600}
.single.editor .editor-contact{font-size:17px;margin:12px 0 0}
.note-list h2{font-size:31px;line-height:1.15;margin:0}
.note-list .pic{aspect-ratio:3/2;background:var(--ph);overflow:hidden;margin:0 0 14px}
.note-list .pic img{width:100%;height:100%;object-fit:cover;display:block}
.lead-note{margin-top:18px;font-size:19.5px}
.lead-note a{color:var(--ink)}
.lead-note a:hover{text-decoration:underline;text-underline-offset:4px}
.single.legal{max-width:none;padding:96px 24px 80px}
.legal-grid{display:grid;grid-template-columns:minmax(0,600px) minmax(320px,1fr);gap:64px;align-items:start}
.legal-text .lsec{margin-top:40px;padding:0;border:0}
.legal-text .lsec h2{margin-bottom:8px}
.legal-text p{font-size:19.5px;line-height:1.45;margin:16px 0 0;max-width:46ch}
.legal-text .summary{max-width:none}
.legal-art{position:sticky;top:72px}
.legal-art img{display:block;width:100%;height:auto}
.legal-art .ph{aspect-ratio:3/4;background:var(--ph);display:grid;place-items:center;color:var(--ink-40);font-size:14.6px;letter-spacing:.08em}
@media(max-width:960px){.legal-grid{grid-template-columns:1fr;gap:32px}.legal-art{position:static}.legal-art .ph{aspect-ratio:4/3}}
.single .crumb{font-size:16.5px;color:var(--ink-40);margin-bottom:24px;display:flex;gap:16px;flex-wrap:wrap}
.single .crumb a{display:inline-block;padding:4px 0}   /* 2026-09-17: a 17px tap target */
@media(max-width:960px){   /* 2026-09-17: list, chip and card links were 19-23px tall; a finger needs 24 (phones and tablets) */
  .sig-index a,#src-list a,.pl-try,.one-open,.more-link,.bo-more,.bo-src,.note-more,.trends-more button,.load-more{display:inline-flex;align-items:center;min-height:24px}
}
.single .crumb a:hover{color:var(--ink)}
.single :is(h1,.h1).story{font-size:43px;line-height:1.1;margin:12px 0 16px}
:lang(ja) .single :is(h1,.h1).story,.single :is(h1,.h1).story:lang(ja){line-height:1.35;letter-spacing:0}   /* Japanese is set on a square body: the Latin tracking and 1.1 leading crushed it */
.single .meta{font-size:16.5px;color:var(--ink-40);margin-bottom:24px;display:flex;gap:14px;flex-wrap:wrap}
.single .hero{aspect-ratio:3/2;background:var(--ph);overflow:hidden;margin:0 -16px 24px}
.single .hero img{width:100%;height:100%;object-fit:cover}
.single .summary{font-size:25.36px;line-height:1.3;margin:0 0 24px;overflow-wrap:anywhere}   /* one unbreakable token panned 27 story pages sideways on a phone */
.single .chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 32px}
.single .chips a{font-size:14.6px;border:1px solid var(--ink);border-radius:9999px;padding:7px 12px;line-height:1}
.single .chips a:hover{background:var(--accent);border-color:var(--accent-text,var(--accent))}
.single .go{display:inline-flex;align-items:center;gap:12px;background:var(--ink);color:var(--bg);border-radius:9999px;padding:16px 24px;font-size:19.5px;transition:background .2s,color .2s}
.single .go:hover{background:var(--accent);color:var(--accent-ink)}
.single .ja-orig{margin:24px 0 0;font-size:19.5px;color:var(--ink-40)}
.single .sec{margin-top:56px;padding-top:24px;border-top:1px solid var(--rule)}
.single .sec h2.t{margin-bottom:20px}
.single .thumbs{grid-template-columns:1fr 1fr 1fr}
@media(max-width:700px){.single .thumbs{grid-template-columns:1fr 1fr}}
.single .weekhead{font-size:16.5px;color:var(--ink-40)}
.single .note{font-size:25.36px;margin:12px 0 32px}
.single .trend{grid-template-columns:1fr auto auto;border-top-color:var(--rule-soft)}
.single .trend .delta{color:var(--ink-40)} .single .trend .delta.up{color:var(--ink)}
.single .colours .bar-strip{margin-top:0}
.archive .wk{display:grid;grid-template-columns:120px 1fr auto;gap:8px 16px;padding:16px 0;border-top:1px solid var(--rule-soft);align-items:baseline}
.archive .wk:first-child{border-top:0}
.archive .wk .n{font-size:25.36px}
.archive .wk .d{font-size:16.5px;color:var(--ink-40)}
.archive .wk .s{font-size:19.5px;color:var(--ink-40);grid-column:2}
.archive .wk:hover .n{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
@media(max-width:600px){.archive .wk{grid-template-columns:1fr;gap:2px}.archive .wk .s{grid-column:1}.archive .wk .n{font-size:22px;line-height:1.2}}   /* 120px of week label left the issue title 93px wide and six lines tall on a phone */
/* search + subscribe */
.menu .search{display:flex;gap:12px;align-items:center;border-bottom:1px solid var(--accent-ink);padding:6px 0;margin:0 0 16px}
.menu .search input{flex:1;background:none;border:0;font:inherit;font-size:25.36px;letter-spacing:-.02em;color:var(--accent-ink);outline:none;min-width:0}
.menu .search input::placeholder{color:var(--accent-40)}
.menu .search button{font-size:19.5px;color:var(--accent-ink)}.board .links .indie{display:block;margin-top:10px;font-size:14.6px;line-height:1.4;color:var(--bar-60,rgba(255,255,255,.6));max-width:34ch}
.sub-open{display:inline-flex;align-items:center;gap:10px;margin-top:14px;padding:7px 12px;background:var(--accent);color:var(--accent-ink);font-family:var(--mono,inherit);font-size:14.6px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;border:0;cursor:pointer;line-height:1.2;transition:background var(--t-fast),color var(--t-fast),transform var(--t-fast)}
.sub-open:after{content:"→";font-family:inherit}
.sub-open:hover{background:var(--bar-ink,#fff);color:var(--bar,#000);transform:translateX(2px)}
.sub-open:focus-visible{outline:2px solid var(--bar-ink,#fff);outline-offset:2px}
.board .links .sub-open{margin-top:14px}
.board .links a.support-open,.menu a.support-open{font-size:14.6px;font-weight:500;line-height:1.2;width:auto;align-self:flex-start}
/* the studio credit on every magazine: "Design and development: Rekkarun", in English (owner 2026-10-08, renamed 2026-10-18) */
.board .made-by{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;padding:12px 16px 18px;border-top:1px solid var(--board-rule,rgba(255,255,255,.18));font-size:13.5px;letter-spacing:.02em;color:var(--board-dim,rgba(255,255,255,.6))}
.board .made-by b{font-weight:500;color:var(--board-ink,#fff)}.board .made-by a.rekkarun{color:inherit;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:1px;transition:color .2s,border-color .2s}.board .made-by a.rekkarun:hover,.board .made-by a.rekkarun:focus-visible{color:var(--accent);border-color:var(--accent)}.board .made-by b span{font-family:"Shippori Mincho","Hiragino Mincho ProN",serif;font-weight:500;margin-left:2px}
body.board-calm .board .made-by{max-width:1104px;margin:0 auto;padding:12px 24px 22px;border-top:1px solid var(--rule-soft);color:var(--ink-40);font-family:var(--mono)}body.board-calm .board .made-by b{color:var(--ink)}
.board .tip-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px 20px;align-items:center;padding:12px 16px;border-top:1px solid var(--board-rule,rgba(255,255,255,.18))}
.board .tip-row .tip-k{display:inline-flex;align-items:center;gap:10px;font-size:14.6px;letter-spacing:.06em;text-transform:uppercase;color:var(--board-dim,rgba(255,255,255,.55));white-space:nowrap}
.board .tip-row .tip-k:before{content:"";width:8px;height:8px;background:var(--accent);flex:none}
.board .tip-row p{margin:0;font-size:14.6px;line-height:1.4;color:var(--board-dim,rgba(255,255,255,.6));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:1200px){.board .tip-row p{white-space:normal}}
.board .tip-row .support-open{margin:0;font-size:14.6px;padding:4px 10px}
.layout-marquee .board .tip-row{padding:12px 24px;border-top-color:rgba(255,255,255,.14)}
.layout-marquee .board .tip-row p{font-family:var(--sans);font-size:14.6px}
.layout-marquee .board .tip-row .tip-k{font-family:var(--sans)}
@media(max-width:960px){.board .tip-row{grid-template-columns:1fr;gap:12px;padding:20px 16px}}
.support-open{background:transparent;color:var(--board-ink,#fff);border:1px solid var(--board-dim,rgba(255,255,255,.6));margin-left:10px;text-decoration:none}
.support-open:hover{background:var(--accent);color:var(--accent-ink);border-color:var(--accent-text,var(--accent))}
.support-page .sup-addr{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:14px 0}
.support-page .sup-addr code{font-family:var(--mono,monospace);font-size:16.5px;word-break:break-all;padding:8px 10px;border:1px solid var(--rule)}
.support-page .sup-addr .sub-open{margin-top:0}
.support-page .sup-qr{margin:18px 0}
.support-page .sup-qr img{display:block;border:1px solid var(--rule);background:#fff}
.menu .support-open{color:var(--bar-ink,#fff);border-color:var(--bar-60,rgba(255,255,255,.6))}
.menu .sub-open.menu-sub{margin-top:12px;font-size:14.6px;padding:7px 12px;background:var(--accent-ink);color:var(--accent)}   /* inside the accent-coloured menu the button inverts, so it reads on both themes */
.layout-marquee .menu .support-open{color:var(--bar-ink,#fff);border-color:var(--bar-60,rgba(255,255,255,.6))}
.menu .sub-open.menu-sub{font-family:var(--sans)}
.sub-dialog{border:0;padding:0;background:var(--bg);color:var(--ink);width:min(560px,calc(100vw - 32px));max-width:none;box-shadow:0 0 0 2px var(--ink)}
.sub-dialog::backdrop{background:rgba(0,0,0,.6)}
.sub-dialog .sub-form{display:block;margin:0;padding:32px 32px 28px;position:relative}
.sub-dialog .sub-close{position:absolute;top:10px;right:14px;font-size:28px;line-height:1;color:var(--ink-40);background:none;border:0;cursor:pointer}
.sub-dialog .sub-close:hover{color:var(--ink)}
.sub-dialog .small{font-size:14.6px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-40);margin-bottom:8px}
.sub-dialog h2{font-size:34px;line-height:1.05;margin:0 0 12px}
.sub-dialog .sub-lead{font-size:19.5px;line-height:1.35;color:var(--ink-40);margin:0 0 22px}
.sub-dialog .sub-field{display:block;margin:0 0 16px}
.sub-dialog .sub-field span{display:block;font-size:14.6px;color:var(--ink-40);margin-bottom:6px}
.sub-dialog .sub-field input{width:100%;box-sizing:border-box;background:none;border:0;border-bottom:1px solid var(--ink);color:var(--ink);font:inherit;font-size:25.36px;padding:6px 0;outline:none}
.sub-dialog .sub-field input:focus{border-bottom-color:var(--accent-text,var(--accent))}
.sub-dialog .sub-consent{display:grid;grid-template-columns:auto minmax(0,1fr);gap:0 12px;align-items:start;font-size:16.5px;line-height:1.4;margin:0 0 20px;cursor:pointer}
.sub-dialog .sub-consent input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--accent-text,var(--accent));cursor:pointer}
.sub-dialog .sub-consent a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.sub-dialog .sub-submit{font:inherit;font-size:19.5px;padding:12px 22px;background:var(--ink);color:var(--bg);border:0;cursor:pointer}
.sub-dialog .sub-submit:hover{background:var(--accent);color:var(--accent-ink)}
.sub-dialog .sub-fine{font-size:14.6px;line-height:1.4;color:var(--ink-40);margin:18px 0 0}
.embed-load{display:flex;flex-direction:column;gap:6px;width:100%;box-sizing:border-box;text-align:left;padding:14px 16px;background:var(--ph);color:var(--ink);border:1px solid var(--rule-soft);cursor:pointer;font:inherit}
.embed-load b{font-size:19.5px;font-weight:600}
.embed-load small{font-size:14.6px;line-height:1.35;color:var(--ink-40)}
.embed-load:hover{border-color:var(--ink)}
.embed-note{font-size:14.6px;color:var(--ink-40);padding:6px 16px 0}
.layout-bands .sound .mood-card.open .one-embed .embed-load{background:transparent;border:1px solid var(--rule);margin:0 0 4px}
.sub-form{display:flex;gap:8px;width:100%;margin-top:6px}
.sub-form[hidden]{display:none}
.sub-form input{flex:1;min-width:0;background:none;border:0;border-bottom:1px solid rgba(255,255,255,.35);color:#fff;font:inherit;font-size:16.5px;padding:6px 0;outline:none}
.sub-form input::placeholder{color:rgba(255,255,255,.4)}
.sub-form button{color:#000;background:var(--accent);border-radius:9999px;padding:8px 14px;font-size:14.6px}
.bar .lang{font-size:16.5px;color:var(--bar-60);flex:none;display:flex;gap:6px;align-items:center}   /* the slash sat above the baseline on phones */
.bar .lang b{font-weight:500;color:var(--bar-ink)}
.bar .lang button,.bar .menu-btn{min-height:48px;padding:0 6px;margin:0 -6px}
.bar .lang button{color:inherit}
.bar .lang button[aria-pressed="true"]{color:var(--bar-ink)}
:root[lang="ja"] body{font-family:"Hiragino Sans","Zen Kaku Gothic New","Inter",Helvetica,Arial,sans-serif;letter-spacing:0}
:root[lang="ja"] .jp{font-family:inherit}

/* ---------- hanko of the day ---------- */
.hanko{width:88px;height:88px;flex:none;display:block;border-radius:50%;transition:transform var(--t-fast) var(--ease)}
.hanko:hover{transform:rotate(-8deg)}
.hanko svg{width:100%;height:100%;display:block}
.hanko-wrap{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.hanko-cap{font-size:14.6px;line-height:1.25;color:var(--ink-40);text-align:center;margin-top:6px}
.hanko-wrap > div:first-child{flex:1;min-width:0}
.hanko-wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:20px 12px;margin-top:24px}
.hanko-wall .h{text-align:center;font-size:14.6px;color:var(--ink-40)}
.hanko-wall .hanko{width:100%;height:auto;aspect-ratio:1;margin:0 auto 6px}
/* ---------- night shift ---------- */
.bar .night{font-size:14.6px;color:var(--bar-60);flex:none;display:none;align-items:center;gap:6px}
.bar .night i{width:8px;height:8px;border-radius:50%;background:var(--accent);display:inline-block}
:root[data-theme="dark"] .bar .night{display:inline-flex}
/* ---------- poster ---------- */
.poster{display:grid;grid-template-columns:200px 1fr;gap:24px;align-items:start;margin-top:24px}
.poster img{width:100%;border:1px solid var(--rule)}
.poster .go{margin-top:8px}
@media(max-width:560px){.poster{grid-template-columns:1fr}}
/* ---------- departures board ---------- */
.dep{background:#000;color:#fff;min-height:100vh;padding:96px 0 48px;overflow-x:auto}   /* a residual wide row scrolls inside the black block, never the page */
.dep .dhead{display:flex;justify-content:space-between;align-items:baseline;padding:0 32px 24px;border-bottom:1px solid rgba(255,255,255,.25);gap:16px;flex-wrap:wrap}
.dep :is(h1,.h1){color:#fff}
.dep .clock{font-size:43px;color:var(--bar-accent,var(--accent-text,var(--accent)));font-variant-numeric:tabular-nums}
.dep table{width:100%;border-collapse:collapse;font-size:25.36px}
.dep th{font-size:14.6px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.45);text-align:left;padding:18px 16px 10px;font-weight:500;border-bottom:1px solid rgba(255,255,255,.18)}
.dep td{padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.12);vertical-align:top}
.dep td:first-child,.dep th:first-child{padding-left:32px}
.dep .t{font-variant-numeric:tabular-nums;color:var(--bar-accent,var(--accent-text,var(--accent)));white-space:nowrap}   /* 2026-09-17: Klein blue read 2.9:1 on the board's black */
.dep .dest{color:#fff}
.dep .dest small{display:none;font-size:19.5px;color:rgba(255,255,255,.5)}
.dep .plat{white-space:nowrap}
.dep .grey,.dep .dhead .grey{color:rgba(255,255,255,.55)}   /* 2026-09-17: the page ink was invisible on the board's black */
@media(max-width:1100px){   /* 2026-09-17: the board's table needs ~1125px; below that every row becomes a card, so City and Status stop falling off the screen (phones AND tablets) */
  .dep{padding:76px 0 40px}
  .dep .dhead{padding:0 16px 18px}
  .dep .clock{font-size:32px}
  .dep table{display:block;font-size:19.5px}
  .dep thead{display:none}
  .dep tbody,.dep tr,.dep td{display:block;width:auto}
  .dep tr{padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.12)}
  .dep td{padding:1px 0;border:0}
  .dep td:first-child,.dep th:first-child{padding-left:0}
  .dep td.t{font-size:14.6px}
  .dep td.dest{font-size:22px;line-height:1.2;margin:2px 0 4px}
  .dep td.dest small{display:block;font-size:16.5px}
  .dep td.plat{font-size:16.5px;color:rgba(255,255,255,.62)}
  .dep td.st{margin-top:6px}
}
.dep .st{white-space:nowrap}
.dep .st.boarding{color:#5BF07A}.dep .st.last{color:var(--accent-text,var(--accent));animation:blink 1.2s steps(2,start) infinite}.dep .st.sched{color:rgba(255,255,255,.6)}
@keyframes blink{to{visibility:hidden}}
@media(prefers-reduced-motion:reduce){.dep .st.last{animation:none}}
.flap{display:inline-block;overflow:hidden}
.flap span{display:inline-block;transition:transform .08s}
.flap.spin span{animation:flip .12s linear}
@keyframes flip{0%{transform:rotateX(0)}50%{transform:rotateX(90deg)}100%{transform:rotateX(0)}}
.dep .note{padding:24px 32px;color:rgba(255,255,255,.5);font-size:16.5px}
.dep a.row:hover td.dest{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
@media(max-width:760px){.dep table{font-size:19.5px}.dep .hide{display:none}.dep .dest small{display:block}}

/* ---------- studio sound: motion ---------- */
.slat{transition:filter .25s,transform .25s;opacity:0;transform:translateY(14px);animation:slatIn .55s var(--ease) forwards;animation-delay:calc(var(--i,0)*70ms)}
@keyframes slatIn{to{opacity:1;transform:none}}
.slat:hover{filter:brightness(.92)}
.slat .eq{display:inline-flex;align-items:flex-end;gap:2px;height:14px;width:18px;margin-left:10px;flex:none;opacity:0;transition:opacity .25s}
.slat .eq i{display:block;width:3px;height:30%;background:currentColor;border-radius:1px;transform-origin:bottom}
.slat:hover .eq,.slat.now .eq{opacity:1}
.slat:hover .eq i,.slat.now .eq i{animation:eq .9s ease-in-out infinite}
.slat .eq i:nth-child(2){animation-delay:-.3s}.slat .eq i:nth-child(3){animation-delay:-.6s}.slat .eq i:nth-child(4){animation-delay:-.15s}
@keyframes eq{0%,100%{height:30%}50%{height:100%}}
.slat .play{transition:background .2s,transform .2s}
.slat:hover .play{transform:scale(1.08)}
.slat .play i{transition:transform .2s}
.slat:hover .play i{transform:translateX(1px)}
.slat.now .t b{position:relative}
.slat.now .t b:after{content:"";position:absolute;left:-14px;top:.45em;width:6px;height:6px;border-radius:50%;background:currentColor;animation:pulse 1.6s ease-in-out infinite}
.nowline b{animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
@media(prefers-reduced-motion:reduce){.slat{animation:none;opacity:1;transform:none}.slat .eq i,.slat.now .t b:after,.nowline b{animation:none}}

/* ---------- studio sound: gradient colour change ---------- */
.slat{background-image:linear-gradient(135deg, var(--c1) 0%, var(--c1) 40%, var(--c2) 100%);background-size:250% 100%;background-position:0% 0;transition:background-position var(--t-slow) var(--ease),filter var(--t-fast)}
.slat:hover{background-position:100% 0;filter:none}
.slat.now{animation:slatIn .55s var(--ease) forwards, breathe 9s ease-in-out .6s infinite;animation-delay:calc(var(--i,0)*70ms), .6s}
.slat.now:hover{animation:slatIn .55s forwards;opacity:1;transform:none}
@keyframes breathe{0%,100%{background-position:0% 0}50%{background-position:100% 0}}
@media(prefers-reduced-motion:reduce){.slat{transition:none}.slat.now{animation:none}}

/* ---------- footer: set in the site's column language ---------- */
.board .links{grid-template-columns:1fr 1fr 1fr;font-size:19.5px;color:var(--board-dim,rgba(255,255,255,.6))}
.board .links > div{padding:40px 16px 56px;border-left:1px solid var(--board-rule,rgba(255,255,255,.25));display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.board .links > div:first-child{border-left:0}
.board .links b{display:block;width:100%;font-size:19.5px;font-weight:500;color:var(--board-dim,rgba(255,255,255,.6));margin-bottom:14px}
.board .links > div:first-child b{font-size:43px;line-height:1.1;letter-spacing:-.02em;color:var(--board-ink,#fff);margin-bottom:12px}
.board .links > div:first-child span{display:block;font-size:25.36px;line-height:1.2;color:var(--board-ink,#fff);max-width:20ch;letter-spacing:-.02em}
.board .links > div:first-child #board-when{font-size:16.5px;color:var(--board-dim,rgba(255,255,255,.6));margin-top:auto;padding-top:24px}
.board .links > div:first-child span.indie{font-size:14.6px;line-height:1.4;letter-spacing:0;color:var(--board-dim,rgba(255,255,255,.55));max-width:34ch;margin-top:10px}
.layout-marquee .board .links > div:first-child span.indie{font-family:var(--sans);font-size:14.6px;color:rgba(255,255,255,.5)}
.board .links a{font-size:25.36px;line-height:1.2;letter-spacing:-.02em;color:var(--board-ink,#fff)}
.board .links a:hover{color:var(--accent-text,var(--accent))}
.board .links .sub-form{margin-top:24px;max-width:360px}
.board .links .sub-form input{font-size:19.5px}
@media(max-width:960px){.board .links{grid-template-columns:1fr}.board .links > div{border-left:0;border-top:1px solid var(--board-rule,rgba(255,255,255,.25));padding:32px 16px 40px}.board .links > div:first-child{border-top:0}}

/* ---------- theme switch: sun / moon in the bar ---------- */
.bar .theme{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;flex:none;color:var(--bar-60);background:none;border:0;padding:0;cursor:pointer;border-radius:50%}
.bar .theme:hover{color:var(--bar-ink)}
.bar .theme svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.bar .theme .moon{fill:currentColor;stroke:none}
.bar .theme .sun{display:none}
[data-theme="dark"] .bar .theme .sun{display:block}
[data-theme="dark"] .bar .theme .moon{display:none}

/* ---------- the bar player: our frame, Spotify's strip inside it, pinned under the bar ---------- */
.barplay{position:fixed;top:48px;left:0;right:0;z-index:39;background:var(--bg);border-bottom:1px solid var(--rule);box-shadow:0 8px 24px rgba(0,0,0,.08)}
.barplay .bp-in{display:grid;grid-template-columns:minmax(150px,1fr) minmax(280px,2fr) auto;align-items:center;gap:0 20px;padding:10px 16px}
.barplay .bp-meta{min-width:0;display:flex;flex-direction:column;gap:1px}
.barplay .bp-mood{font-size:14.6px;letter-spacing:.09em;text-transform:uppercase;color:var(--accent)}
.barplay .bp-meta b{font-size:16.5px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.barplay .bp-by{font-size:14.6px;color:var(--ink-40)}
.barplay .bp-embed{min-width:0}
.barplay .bp-embed iframe{width:100%;height:80px;border:0;display:block;border-radius:10px}
.barplay .bp-embed .embed-load{width:100%;text-align:left;padding:10px 12px;border:1px solid var(--rule);background:transparent;cursor:pointer;border-radius:10px}
.barplay .bp-embed .embed-load b{display:block;font-size:14.6px;font-weight:400}
.barplay .bp-embed .embed-load small{display:block;font-size:14.6px;color:var(--ink-40);margin-top:2px;line-height:1.3}   /* 12.5px sat under the 14.6px floor */
.barplay .bp-act{display:flex;align-items:center;gap:10px;white-space:nowrap}
.barplay .bp-nav,.barplay .bp-x{background:transparent;border:0;cursor:pointer;color:var(--ink);font-size:21px;line-height:1;padding:2px 6px}
.barplay .bp-nav:hover,.barplay .bp-x:hover{color:var(--accent)}
.barplay .bp-n{font-size:14.6px;color:var(--ink-40);font-variant-numeric:tabular-nums}
.barplay .bp-open{font-size:14.6px;color:var(--ink-40)}
.barplay .bp-open:hover{color:var(--accent)}
body.bp-on .lead-wide{padding-top:180px}          /* the strip pushes the page down instead of covering the first headline */
body.bp-on .cols{padding-top:200px}
@media(max-width:860px){
  .barplay .bp-in{grid-template-columns:1fr auto;gap:8px 12px;padding:8px 12px}
  .barplay .bp-embed{grid-column:1/-1;order:3}
  body.bp-on .lead-wide{padding-top:210px}
  body.bp-on .cols{padding-top:150px}
}

/* ---------- the day's playlist at the head of the bar (site.ticker_music), where the clock used to be ---------- */
.tick .tick-music{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.tick .tick-music svg{width:11px;height:11px;flex:none;fill:var(--accent);transition:transform .18s ease}
.tick .tick-music:hover svg{transform:scale(1.22)}
.tick .tick-music .tk{color:inherit;opacity:.6;letter-spacing:.02em}   /* the bar sets its own ink; a light-mode grey disappears on it */
/* Menu before the theme switch, on this magazine only — the bar is a flex row, so it is a reorder and not a change
   to the markup the other four share. */
body.ticker-music .bar .menu-btn{order:1}
body.ticker-music .bar .theme{order:2}

/* ---------- lead-wide — the signal of the week lifted out of the news column and run across the full page, so its two features are
   read at poster size instead of at thumbnail size (site.lead_wide). The three columns carry on underneath, unchanged. ---------- */
.lead-wide{border-bottom:1px solid var(--rule);padding:60px 16px 22px}
/* ---------- the news river runs wide once the side columns end — the left column was three times their height and
   left thousands of pixels of white beside it (site.news_runs_wide) ---------- */
.latest-wide{columns:3;column-gap:34px;padding:8px 16px 0;border-top:1px solid var(--rule);margin-top:26px}
.latest-wide > *{break-inside:avoid}
.latest-wide .load-more{column-span:all;margin-top:20px}
@media(max-width:960px){.latest-wide{columns:2}}
@media(max-width:700px){.latest-wide{columns:1}}
/* ---------- sources and about leave the column and close the page: the list of publications reads as a wide
   index, the about text as a column of prose (site.foot_sections) ---------- */
.foot-wide{border-top:1px solid var(--rule);margin-top:34px;padding:30px 16px 8px;display:grid;grid-template-columns:1.15fr 1fr;gap:0 44px;align-items:start}
.foot-wide > section{margin:0}
.foot-wide #about .about-text{columns:2;column-gap:34px}
.foot-wide #about .about-text > *{break-inside:avoid}
.foot-wide #sources .list.sources{columns:2;column-gap:28px}
@media(min-width:1100px){.foot-wide #sources .list.sources{columns:3}}
.foot-wide #sources .list.sources a{break-inside:avoid}
@media(max-width:960px){.foot-wide{grid-template-columns:1fr;gap:26px 0}.foot-wide #about .about-text,.foot-wide #sources .list.sources{columns:1}}
/* The bar player was a wide grid with our own title on the left repeating what Spotify writes inside its own
   window, and the player stretched across the rest — which is why it looked like a box floating in a hole.
   One tight row now: our kicker, the player at its natural width, the controls at the far right. */
/* The window is the strip. No frame, no shadow, no padding: Spotify's own dark runs edge to edge under the bar as a
   second band, and our close and link sit in a narrow navy margin at its right. A card floating on navy read as pasted on. */
body.polish .barplay{background:var(--bar);border-bottom:0;box-shadow:none}
body.polish .barplay .bp-in{grid-template-columns:minmax(0,1fr) auto;gap:0;padding:0}
body.polish .barplay .bp-meta{display:none}   /* Spotify writes the record's name inside its own window; saying it twice is what made this look pasted on */
body.polish .barplay .bp-embed{grid-column:1;min-width:0}
body.polish .barplay .bp-embed iframe{height:80px;border-radius:0;display:block;filter:grayscale(1) sepia(.75) hue-rotate(190deg) saturate(2.6) brightness(.8) contrast(1.05)}   /* the window is Spotify's and cannot be repainted from outside; a navy duotone over the whole of it is the one thing CSS can do, and it makes the band ours — cover art included, as a blue engraving */
body.polish .barplay .bp-embed .embed-load{border:0;border-radius:0;padding:14px 16px;background:transparent;color:var(--bar-ink)}
body.polish .barplay .bp-embed .embed-load small{color:var(--bar-60)}
body.polish .barplay .bp-act{padding:0 10px 0 14px;height:80px;color:var(--bar-ink)}
body.polish .barplay .bp-nav,body.polish .barplay .bp-x{color:var(--bar-ink)}
body.polish .barplay .bp-open,body.polish .barplay .bp-n{color:var(--bar-60)}
body.polish .barplay .bp-nav:hover,body.polish .barplay .bp-x:hover,body.polish .barplay .bp-open:hover{color:var(--accent)}
body.polish .barplay .bp-act{justify-content:flex-end}
@media(max-width:820px){ body.polish .barplay .bp-in{grid-template-columns:1fr auto} body.polish .barplay .bp-meta{display:none} }
/* ---------- the record plays in a strip (site.polish) — the full Spotify player is 352px of cover art for a
   thing the reader came to hear, not to look at; the consent control is a line rather than a grey slab ---------- */
body.polish .sound .one-embed iframe{height:80px;border-radius:8px}
body.polish .embed-load{background:transparent;border:1px solid var(--rule);border-radius:8px;padding:10px 13px;gap:3px}
body.polish .embed-load b{font-weight:500}
body.polish .embed-load:hover{border-color:var(--ink);background:transparent}
body.polish .sound .one-head h2{margin-bottom:6px}
body.polish .sound .one-open{margin-top:10px}
/* ---------- polish (site.polish) — the family skeleton untouched; rank, air and quiet ---------- */
body.polish .subhead{font-size:31.68px}                         /* a shelf heading was set at story size and read as a story */
body.polish .subhead .grey{font-size:19.5px}
body.polish .post .meta{font-size:16.5px}                       /* the meta floor the rest of the page already uses */
body.polish #japan .rg button{font-size:19.5px;padding:8px 16px}   /* region chips at link size, and a hand-sized target */
body.polish .sound .one-head{border-left:0;padding-left:0}       /* the coloured bar made the playlist the loudest thing below the pictures */
body.polish .sound .one-head .mood{margin-bottom:10px}
body.polish .sound .one-head p{color:var(--ink-40)}
body.polish #sources{display:none}                               /* ninety names are a page, not a column block: /sources/ */
body.polish .pic{outline:1px solid rgba(var(--ink-rgb),.07);outline-offset:-1px}   /* a hairline keeps a dark photograph from sinking into navy */
/* ---------- the news continued in the middle column (site.fill_middle) ---------- */
.more-news{margin-top:48px;padding-top:8px;border-top:1px solid var(--rule)}
.more-news .posts-more .post:first-child{margin-top:0}
/* ---------- a tidied column head (site.polish) — the link to the whole section was sitting beside the
   heading and squeezing it onto two lines in a 480px column; it belongs underneath ---------- */
body.polish .cols .head-row{display:block}
body.polish .cols .head-row > button:not([hidden]),body.polish .cols .head-row > a:not([hidden]){display:block;margin-top:12px;white-space:normal;text-align:left}
body.polish .cols .head .h1{max-width:100%}
/* ---------- radar as a strip — the week's signals run across the page under the lead band instead of standing
   in a column, so the eye reads them as a ticker and the column below starts on the news (site.radar_strip) ---------- */
.radar-strip-sec{background:var(--accent);color:var(--accent-ink);padding:10px 16px 11px;border-bottom:1px solid var(--rule)}
/* everything on one line: the title, the signals, and the way to the rest of them. The sentence explaining the
   arithmetic and the hint about tapping live in the title attribute instead of taking a line each. */
.radar-strip-sec #radar{display:flex;align-items:baseline;gap:20px}
.radar-strip-sec .head{display:flex;align-items:baseline;gap:14px;margin:0;flex:none}
.radar-strip-sec .head .h1{margin:0;font-size:25.36px;line-height:1.15;white-space:nowrap}
.radar-strip-sec .head .sub{display:none}
.radar-strip-sec .trends-more span{display:none}
.radar-strip-sec .trends-more{flex:none;white-space:nowrap}
.radar-strip-sec #trends{display:flex;gap:0;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;flex:1 1 auto;min-width:0}
.radar-strip-sec #trends::-webkit-scrollbar{display:none}
/* six signals are wider than the page, so the last one fades out instead of being chopped: the strip scrolls sideways */
.radar-strip-sec #trends{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 72px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 72px),transparent)}
/* one line per signal: name, the week's shape, the count, the change -- a strip, not a row of cards */
.radar-strip-sec .trend{width:auto;flex:0 0 auto;display:flex;align-items:baseline;gap:9px;padding:0 14px;border-top:0;border-left:1px solid var(--accent-rule);text-align:left;line-height:1.15}
.radar-strip-sec .trend:first-child{border-left:0;padding-left:0}
.radar-strip-sec .trend .n{font-size:25.36px;white-space:nowrap}
.radar-strip-sec .trend .spark{display:none}   /* at strip height the week's shape is decoration; the number and the change carry it */
.radar-strip-sec .trend .num,.radar-strip-sec .trend .delta{text-align:left;min-width:0;white-space:nowrap}
.radar-strip-sec .trends-more{margin:0}
@media(max-width:700px){ .radar-strip-sec .trend{padding:0 14px}
  .radar-strip-sec #radar{flex-wrap:wrap}
  .radar-strip-sec .head .h1{font-size:19.5px}
  .radar-strip-sec .trends-more{flex:1 0 100%;margin-top:4px}   /* 2026-09-17: it could not shrink and slid the whole page sideways */
}
/* Nami keeps the news and drops the studio furniture: no colour swatches, no seal on the pictures. */
body.no-colours #colours{display:none}
body.no-hanko .hanko,body.no-hanko .hanko-wrap > a.hanko{display:none}
/* ---------- directory pages (brands A-Z, marinas): long lists that must stay easy to scan ---------- */
.dir-nav{display:flex;flex-wrap:wrap;gap:0 6px;margin:0 0 8px}
.dir-nav a{display:inline-flex;align-items:center;justify-content:center;min-width:28px;min-height:28px;text-decoration:none}   /* 26 bare letters made the I a 5px tap target */
.dir-nav a:hover{text-decoration:underline;text-underline-offset:4px}
.dir-grid{display:block}
.dir-page{max-width:none}
.dir-page .summary,.dir-page > .grey{max-width:62ch}
.dir-cols{columns:2;column-gap:38px}
@media(min-width:1200px){.dir-cols{columns:3}}
.dir-page .dir-e{break-inside:avoid;margin:0 0 15px}
/* Champions (Nami): a directory of winning yachts and a page each with the builder's plate and the record */
.ch-nav small{font-family:var(--mono);opacity:.6;margin-left:3px}
.ch-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 22px;margin:10px 0 14px}
@media(max-width:960px){.ch-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.ch-grid{grid-template-columns:minmax(0,1fr);gap:26px}}
.ch-card{display:flex;flex-direction:column;gap:7px;color:var(--ink);text-decoration:none;min-width:0}
.ch-pic{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;background:#0B1F33}
.ch-pic img{width:100%;height:100%;object-fit:cover;display:block;transition:transform var(--t-slow) var(--ease)}
.ch-card:hover .ch-pic img{transform:scale(1.03)}
.ch-card:hover .ch-name{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.ch-none{position:absolute;inset:0;display:grid;place-items:center;color:#B9964F;font-family:"Shippori Mincho","Hiragino Mincho ProN",serif;font-size:72px;background:#0B1F33}
.ch-year{position:absolute;left:10px;top:10px;font:700 12.5px/1 var(--mono,monospace);font-style:normal;letter-spacing:.06em;color:#D9C08A;background:#06111C;padding:6px 10px;border-radius:999px}
.ch-name{font-family:var(--serif);font-size:27px;line-height:1.08;font-weight:500;letter-spacing:-.01em;margin-top:6px}
.ch-name small{display:block;font-family:var(--sans);font-size:14px;font-weight:400;letter-spacing:0;color:var(--ink-40);margin-top:3px}
.ch-head{font-size:16.5px;line-height:1.42}
.ch-spec{font:600 12.5px/1.45 var(--mono,monospace);letter-spacing:.05em;text-transform:uppercase;color:var(--accent-text,var(--accent))}
.ch-credit{font-size:12.5px;line-height:1.4;color:var(--ink-40)}
.ch-credit a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.ch-src{font-size:14px;margin-top:22px}
.champ .ch-hero{margin:0 0 10px}
.champ .ch-big{aspect-ratio:16/9;max-height:72vh}
.champ .ch-big .ch-year{font-size:14px;padding:8px 13px;left:14px;top:14px}
.champ .ch-big .ch-none{font-size:120px}
.champ .ch-hero figcaption{margin-top:8px}
.ch-kick{font:700 12.5px/1 var(--mono,monospace);letter-spacing:.14em;text-transform:uppercase;color:var(--accent-text,var(--accent));margin:26px 0 6px}
.ch-page h1.story{margin-top:0}
.ch-aka{font-size:17px;color:var(--ink-40);margin:-6px 0 10px}
.ch-plate,.ch-won{margin:34px 0 0}
.ch-plate h2,.ch-won h2{font-family:var(--serif);font-size:30px;font-weight:500;margin:0 0 12px;padding-bottom:12px;border-bottom:1px solid var(--rule-soft);box-shadow:0 -5px 0 -1px var(--accent) inset}
.ch-plate dl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0}
@media(max-width:960px){.ch-plate dl{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ch-plate dl > div{padding:12px 16px 14px 0;border-bottom:1px solid var(--rule-soft)}
.ch-plate dt{font:600 11.5px/1.3 var(--mono,monospace);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-40);margin-bottom:5px}
.ch-plate dd{margin:0;font-family:var(--serif);font-size:19px;line-height:1.3}
.ch-won ol{list-style:none;margin:0;padding:0}
.ch-won li{display:grid;grid-template-columns:120px minmax(0,1fr) auto;gap:6px 22px;align-items:baseline;padding:15px 0;border-bottom:1px solid var(--rule-soft)}
.ch-when{font:700 13px/1.3 var(--mono,monospace);letter-spacing:.06em;color:var(--accent-text,var(--accent))}
.ch-ev{font-size:16.5px;line-height:1.45}
.ch-ev b{display:block;font-family:var(--serif);font-size:21px;font-weight:500;line-height:1.2;margin-bottom:3px}
.ch-fig{font-family:var(--serif);font-size:26px;line-height:1;white-space:nowrap}
@media(max-width:600px){.ch-won li{grid-template-columns:minmax(0,1fr)}.ch-fig{font-size:22px}}

.dir-page .dir-e a{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
#src-list .nolink{color:var(--ink-40)}   /* a source with too few stories for a page: named, not linked */
.dir-page .dir-badge{font-family:var(--mono);font-size:14.6px;color:var(--accent-text,var(--accent));white-space:nowrap}   /* marinas.json "official" is a flag, not a link */
.dir-page .dir-form{columns:1;border-left:2px solid var(--rule);padding-left:14px;margin-bottom:20px}
@media(max-width:900px){.dir-cols{columns:1}}   /* the bar is 48px; without a heading the pictures start just under it */
body.lead-wide-on .cols{padding-top:24px}
body.lead-wide-on .colhead{display:none}                 /* the column captions belong above the columns, not above the wide band */
/* The band is the two pictures and nothing else: the heading, the week's arithmetic and the note repeating it were
   furniture in front of them. The hanko keeps its place, and the link out sits under the pictures. */
.lead-wide .head,.lead-wide .note{display:none}
.lead-wide .head.hanko-wrap{display:block;position:absolute;right:16px;top:56px;z-index:2}
.lead-wide .head.hanko-wrap > div{display:none}
.lead-wide{position:relative}
.lead-wide .lead-thumbs,.lead-wide .thumbs{display:grid;grid-template-columns:1fr 1fr;gap:0;margin:0}   /* the two features meet edge to edge, one wide picture split down the middle */
.lead-wide .thumb{display:block;position:relative;overflow:hidden}
.lead-wide .thumb .pic{aspect-ratio:16/9;overflow:hidden;background:var(--rule-soft);margin:0}
.lead-wide .thumb .pic img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s cubic-bezier(.2,.6,.2,1)}
.lead-wide .thumb:hover .pic img{transform:scale(1.03)}
.lead-wide .thumb .pic:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 38%,rgba(0,0,0,.34) 62%,rgba(0,0,0,.82) 100%);pointer-events:none}
.lead-wide .thumb h2{position:absolute;left:0;right:0;bottom:0;z-index:1;margin:0;padding:0 28px 26px;font-size:31.68px;line-height:1.14;color:#fff;text-shadow:0 1px 12px rgba(0,0,0,.55)}
.lead-wide .thumb h2 .pill{background:rgba(255,255,255,.16);color:#fff;border-color:transparent;backdrop-filter:blur(4px)}
.lead-wide .thumb h2 .grey{display:block;font-size:16.5px;margin-top:8px;letter-spacing:.02em;text-transform:uppercase;color:rgba(255,255,255,.72)}
.lead-wide .more{display:none}   /* 'See all N stories carrying this signal' filtered the news list and jumped to it — read as a link that led nowhere; the band is the two pictures and stops */
.lead-wide .strip{display:none}                          /* the strip is a marquee device; the wide band shows two features and stops */
@media(max-width:1100px){ .lead-wide .head :is(h1,.h1){font-size:44px} .lead-wide .thumb h2{font-size:25.36px} }
@media(max-width:960px){
  body.lead-wide-on .cols{padding-top:0}
  .lead-wide{padding:60px 16px 28px}
  .lead-wide .lead-thumbs,.lead-wide .thumbs{grid-template-columns:1fr;gap:2px 0}
  .lead-wide .head :is(h1,.h1){font-size:36px}
  .lead-wide .note{font-size:19.5px;margin-bottom:20px}
  /* One column, so a headline runs to three or four lines and climbs well above a bottom-only scrim. The card goes taller and the
     darkening starts higher, rather than the type getting smaller. */
  .lead-wide .thumb .pic{aspect-ratio:3/4}
  .lead-wide .thumb .pic:after{background:linear-gradient(180deg,rgba(0,0,0,.1) 0%,rgba(0,0,0,.15) 34%,rgba(0,0,0,.6) 66%,rgba(0,0,0,.9) 100%)}
  .lead-wide .thumb h2{padding:0 18px 20px}
}

.layout-bands.cv .band:not(.pulse-band):not(:nth-child(2)){content-visibility:auto;contain-intrinsic-size:auto 1200px}   /* site.cv: the browser skips layout of bands off screen (the front-end audit: 400 cards laid out at once) */
.layout-bands.cv #latest .sig-group{content-visibility:auto;contain-intrinsic-size:auto 720px}
.layout-bands.pics #latest .post.row .meta .also{display:inline-block;padding:0 5px;border:1px solid var(--accent-text,var(--accent));color:var(--accent-text,var(--accent));border-radius:3px;font-size:14.6px;line-height:1.25}   /* one card per launch; the other outlets sit behind the +N */
.layout-bands.pics #latest .sig-index .lens-k{color:var(--ink-40);margin-left:12px;padding-left:12px;border-left:1px solid var(--rule)}
.layout-bands.pics #latest .sig-index a.lens{color:var(--ink-40)}
/* ---------- XLR, the art director's second round (2026-09-16, owner: "go ahead"), each behind a body class from a site flag ---------- */
.layout-bands.pics.strip-fold #latest .sig-group:not(.open) .post.row:nth-child(n+10){display:none}   /* eight cards a strip, the rest opens in place */
.layout-bands.pics #latest .sig-group h3 .unfold{grid-column:auto;font:500 14.6px var(--mono);color:var(--accent-text,var(--accent));background:none;border:0;padding:6px 8px;margin:-6px -8px;min-height:32px;cursor:pointer;white-space:nowrap}
.layout-bands.pics #latest .sig-group h3 .unfold:hover{text-decoration:underline}
.layout-bands.pics.head-name #latest .sig-group h3{grid-template-columns:auto minmax(0,1fr) 120px auto auto;padding:22px 0 10px}
.layout-bands.pics.head-name #latest .sig-group h3::before{font-size:19.5px}
.layout-bands.pics.head-name #latest .sig-group h3 a.fam,.layout-bands.pics.head-name #latest .sig-group h3 span.fam{font-size:34px;letter-spacing:-.02em}
.layout-bands.pics.head-name #latest .sig-group h3 i{height:6px}
.layout-bands.pics.head-name #latest .sig-group h3 > span:not(.fam){font-size:14.6px}
.layout-bands.pics.index-line #latest .sig-index{flex-wrap:nowrap;overflow-x:auto;height:40px;align-items:center;padding:0;scrollbar-width:none;mask-image:linear-gradient(90deg,#000 calc(100% - 72px),transparent)}
.layout-bands.pics.index-line #latest .sig-index::-webkit-scrollbar{display:none}
.layout-bands.pics.index-line #latest .sig-group{scroll-margin-top:100px}
.layout-bands.pics.no-strip-alt #latest .sig-group:nth-of-type(even){background:none;box-shadow:none}
.layout-bands.pics.no-strip-alt #latest .sig-group:nth-of-type(12){padding:40px 0 48px;margin:24px 0}
.layout-bands.pics.no-strip-alt #latest .sig-group:nth-of-type(12) h3{border-top-color:var(--accent)}
.layout-bands.pics.no-strip-alt #latest .sig-group:nth-of-type(12),.layout-bands.pics.no-strip-alt #latest .sig-group:nth-of-type(12) h3,.layout-bands.pics.no-strip-alt #latest .sig-group:nth-of-type(12) h2,.layout-bands.pics.no-strip-alt #latest .sig-group:nth-of-type(12) h3 button{color:var(--ink)}   /* 2026-09-17: without the bar background the strip must read in page ink (XLR light: paper on paper) */
.layout-bands.pics.no-strip-alt #latest .sig-group:nth-of-type(12) .meta,.layout-bands.pics.no-strip-alt #latest .sig-group:nth-of-type(12) h3::before{color:var(--ink-40)}
.layout-bands.pics.front-split #front .first{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 24px;align-items:start}
.layout-bands.pics.front-split #front .first .pic{aspect-ratio:3/2;margin:0;grid-row:1/3}
.layout-bands.pics.front-split #front .first :is(h1,h2){font-size:44px;line-height:1;max-width:none}
.layout-bands.pics.front-split #front .first .m{grid-column:2}
.layout-bands.pulse-flat .tile{min-height:170px}
.layout-bands.pulse-flat .tile.watch:not(:nth-child(2)){background:transparent;color:var(--bar-ink)}
.layout-bands.pulse-flat .tile.watch:not(:nth-child(2)) .ov,.layout-bands.pulse-flat .tile.watch:not(:nth-child(2)) .ov span:last-child{color:var(--bar-ink)}
.layout-bands.pulse-flat .tile.watch:not(:nth-child(2)) .ov .k{color:var(--accent)}
.layout-bands.pulse-flat .tile.watch:not(:nth-child(2)) .pic{border-bottom:2px solid var(--accent)}
.layout-bands.ticker-calm .board .mq{height:88px}
.layout-bands.ticker-calm .board .track span{font-size:44px;padding-right:48px;text-transform:none}
.layout-bands.ticker-calm .board .track span i{text-transform:uppercase}

/* ---------- layout: bands — "the diff view": a mono rail on the left, full-width bands as hunks (SITE.layout === "bands") ---------- */
@media(min-width:961px){
body.layout-bands:not(.bands-ready) #home > .cols{visibility:hidden}   /* the columns markup is only scaffolding for the bands; keep it invisible until buildBands has re-parented it, so a reload never flashes the old layout */
.layout-bands .colhead{display:none}
.layout-bands .bands{padding-top:48px}
/* site.side_rail: the bands on the left, a sticky column on the right (owner 2026-09-16: room for reviews, sponsors, whatever comes) */
.layout-bands .bands-grid{display:grid;grid-template-columns:minmax(0,1fr) 336px;gap:0;align-items:start}
.layout-bands .bands-grid > .bands{min-width:0}
.layout-bands .siderail{position:sticky;top:48px;max-height:calc(100vh - 48px);overflow:auto;scrollbar-width:none;padding:48px 24px 40px 24px;border-left:1px solid var(--rule-soft);background:var(--bg)}
.layout-bands .siderail .mod{border-top:3px solid var(--ink);padding:10px 0 22px}
.layout-bands .siderail .mod h4{margin:0 0 10px;font-family:var(--mono);font-size:14.6px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-40);font-weight:500}
.layout-bands .siderail .sc{display:grid;grid-template-columns:104px minmax(0,1fr);gap:2px 10px;align-items:start;padding:8px 0;border-bottom:1px solid var(--rule-soft);text-decoration:none;color:inherit}
.layout-bands .siderail .sc:last-child{border-bottom:0}
.layout-bands .siderail .sc .pic{grid-row:1/3;display:block;aspect-ratio:1;background:var(--ph);overflow:hidden}
.layout-bands .siderail .mod.watch .sc .pic{aspect-ratio:16/9;align-self:center}
.layout-bands .siderail .mod .more{display:block;padding:8px 0 0;font-family:var(--mono);font-size:14.6px;color:var(--accent-text,var(--accent));text-decoration:none}
.layout-bands .siderail .sc .pic img{width:100%;height:100%;object-fit:cover;display:block}
.layout-bands .siderail .sc b{font-family:var(--serif);font-weight:700;font-size:19.5px;line-height:1.15;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.layout-bands .siderail .sc .m,.layout-bands .siderail .note .m{font-family:var(--mono);font-size:14.6px;color:var(--ink-40);display:block}
.layout-bands .siderail .adslot{aspect-ratio:6/5;border:1px dashed var(--rule);display:grid;place-items:center;align-content:center;gap:6px;text-align:center;color:var(--ink-40);font-family:var(--mono);font-size:14.6px;background:var(--ph)}
.layout-bands .siderail .adslot small{font-size:14.6px}
.layout-bands .siderail .note{display:block;text-decoration:none;color:inherit}
.layout-bands .siderail .note b{font-family:var(--serif);font-weight:700;font-size:25.36px;line-height:1.1;display:block}
.layout-bands .siderail .note p{margin:8px 0 6px;font-size:14.6px;line-height:1.4;color:var(--ink)}
.layout-bands .siderail .fe{display:grid;grid-template-columns:52px minmax(0,1fr);gap:0 10px;padding:7px 0;border-bottom:1px solid var(--rule-soft);text-decoration:none;color:inherit}
.layout-bands .siderail .fe span{font-family:var(--mono);font-size:14.6px;color:var(--accent-text,var(--accent));padding-top:3px}   /* XLR light: the orange read 2.8:1 on paper */
.layout-bands .siderail .fe b{font-family:var(--serif);font-weight:700;font-size:16.5px;line-height:1.15}
.layout-bands .siderail .fe i{grid-column:2;font-style:normal;font-family:var(--mono);font-size:14.6px;color:var(--ink-40)}
@media(min-width:1201px){.layout-bands.siderail #front .fnext-k,.layout-bands.siderail #front .fnext{display:none}}   /* only where the page rail is shown and does say what is next */
@media(max-width:1200px){.layout-bands .bands-grid{grid-template-columns:minmax(0,1fr)}.layout-bands .siderail{display:none}}
.layout-bands .band{display:grid;grid-template-columns:64px minmax(0,1fr);border-bottom:1px solid var(--rule-soft)}
.layout-bands .band > .rail{position:sticky;top:48px;align-self:start;padding:44px 0 40px 24px;font-family:var(--mono);font-size:25.36px;line-height:1;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.layout-bands .band > .rail b{font-weight:600}
.layout-bands .band > .rail b:before{content:"";display:block;width:12px;height:12px;background:var(--accent);margin-bottom:10px}
.layout-bands .band > .rail span{display:none}
.layout-bands .band > section,.layout-bands .band > .halves{padding:40px 24px 48px 0;min-width:0}
.layout-bands .band > .halves{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 56px}
.layout-bands .band > .halves > section{padding:0;min-width:0}
.layout-bands .band > .halves > section + section{border-left:1px solid var(--rule-soft);padding-left:56px;margin-left:-56px}
.layout-bands #lead[hidden],.layout-bands #radar[hidden],.layout-bands #colours[hidden]{display:none !important}
.layout-bands #lead{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);grid-template-rows:auto auto auto 1fr;gap:16px 56px;align-items:start}
.layout-bands #lead .head{grid-column:1;margin:0}
.layout-bands #lead .head :is(h1,.h1){font-size:96px;line-height:.95;letter-spacing:-.03em}
.layout-bands #lead .note{grid-column:1;font-size:30px;line-height:1.2;max-width:none;margin-top:8px}
.layout-bands #lead .lead-note,.layout-bands #lead .more{grid-column:1}
.layout-bands #lead .lead-thumbs{grid-column:2;grid-row:1/span 4;margin:0;grid-template-columns:1fr 1fr;gap:20px 16px;align-self:start}
.layout-bands #lead .hanko{display:none}
.layout-bands #lead{padding-top:32px;padding-bottom:36px}
.layout-bands #lead .lead-thumbs .thumb .pic{border:1px solid var(--rule)}
.layout-bands #lead .lead-thumbs .thumb h2{font-size:19.5px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.layout-bands #lead .head :is(h1,.h1){font-family:var(--mono);font-size:16.5px;line-height:1.3;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-40);font-weight:500}
.layout-bands #lead .head .sub{font-family:var(--mono);font-size:16.5px;color:var(--ink-40);margin-top:2px}
.layout-bands #lead .note{font-size:56px;line-height:1.02;letter-spacing:-.025em;margin-top:14px;font-weight:600}
.layout-bands #lead .note .grey{font-size:25.36px;letter-spacing:0;font-weight:500}
.layout-bands #lead .lead-list{grid-column:1;margin-top:20px;border-top:2px solid var(--ink)}
.layout-bands #lead .lead-list a{display:block;padding:10px 0 11px;border-bottom:1px solid var(--rule-soft)}
.layout-bands #lead .lead-list h2{font-size:25.36px;line-height:1.2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.layout-bands #lead .lead-list .meta{display:block;font-family:var(--mono);font-size:14.6px;color:var(--ink-40);margin-top:4px}
.layout-bands #lead .more{margin-top:14px;font-family:var(--mono);font-size:16.5px}
.layout-bands #lead{grid-template-rows:auto auto auto auto 1fr}
.layout-bands #lead .lead-thumbs{grid-row:1/span 5}
.layout-bands #latest #posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 40px;border-top:0}
.layout-bands #latest .sig-group{min-width:0;border-top:2px solid var(--ink)}
.layout-bands #latest .sig-group h3{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:0;padding:10px 0 4px;font-family:var(--mono);font-size:16.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink)}
.layout-bands #latest .sig-group h3 button{font:inherit;color:inherit;text-align:left}
.layout-bands #latest .sig-group h3 button:hover{color:var(--accent-text,var(--accent))}
.layout-bands #latest .sig-group h3 span{color:var(--accent-text,var(--accent));font-weight:500}
.layout-bands #latest .sig-group .post.row:last-child{border-bottom:0}
.layout-bands #front{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:0 56px;padding:28px 24px 40px 0}
.layout-bands #front .first{display:block}
.layout-bands #front .first :is(h1,h2){font-size:56px;line-height:1;letter-spacing:-.03em;max-width:22ch;margin:0;overflow-wrap:anywhere}
.layout-bands #front .first:hover h2{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:2px}
.layout-bands #front .m,.layout-bands #front .k{font-family:var(--mono);font-size:14.6px;color:var(--ink-40)}
.layout-bands #front .first .m{display:block;margin-top:10px;font-size:16.5px}
.layout-bands #front .k{letter-spacing:.08em;text-transform:uppercase;margin:0 0 8px}
.layout-bands #front .ftwo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 40px;margin-top:26px;border-top:2px solid var(--ink)}
.layout-bands #front .fr{display:grid;grid-template-columns:56px minmax(0,1fr);gap:2px 12px;padding:12px 0 13px;border-bottom:1px solid var(--rule-soft);min-width:0}
.layout-bands #front .fr .t{font-family:var(--mono);font-size:14.6px;color:var(--ink-40);padding-top:6px}
.layout-bands #front .fr h3{margin:0;font-size:25.36px;line-height:1.2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.layout-bands #front .fr .m{grid-column:2}
.layout-bands #front .fr:hover h3{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.layout-bands #front .fside{border-left:1px solid var(--rule-soft);padding-left:32px;min-width:0}
.layout-bands #front .fsig{font-size:34px;line-height:1.05;font-weight:600;letter-spacing:-.02em}
.layout-bands #front .fsub{color:var(--ink-40);margin-top:4px}
.layout-bands #front #fr-radar{margin:14px 0 22px}
.layout-bands #front .fb{display:grid;grid-template-columns:minmax(0,1fr) 88px auto auto;gap:0 10px;align-items:center;width:100%;padding:7px 0;border-top:1px solid var(--rule-soft);font-size:16.5px;text-align:left;color:var(--ink);background:none;cursor:pointer}
.layout-bands #front .fb:hover span{text-decoration:underline;text-underline-offset:3px}
.layout-bands #front .fb i{display:block;height:8px;background:var(--accent)}
.layout-bands #front .fb b{font-family:var(--mono);font-weight:500}
.layout-bands #front .fb small{font-family:var(--mono);color:var(--accent-text,var(--accent));font-size:14.6px}
.layout-bands #front .fmini{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:22px}
.layout-bands.pics #front .fmini{grid-template-columns:repeat(4,minmax(0,1fr))}
.layout-bands #front #fr-makers{margin:0 0 22px}
.layout-bands #front .fmini a{display:block;aspect-ratio:3/2;background:var(--ph);overflow:hidden}
.layout-bands #front .fmini img{width:100%;height:100%;object-fit:cover;filter:grayscale(1);transition:filter var(--t-fast)}
.layout-bands #front .fmini a:hover img{filter:none}
.layout-bands #front .fe{display:grid;grid-template-columns:64px minmax(0,1fr);gap:2px 12px;padding:8px 0;border-top:1px solid var(--rule-soft);font-size:16.5px;color:var(--ink)}
.layout-bands #front .fe span{font-family:var(--mono);color:var(--ink-40)}
.layout-bands #front .fe small{grid-column:2;color:var(--ink-40);font-size:16.5px}
.layout-bands #front .fe:hover b{text-decoration:underline;text-underline-offset:3px}
.layout-bands #shipped-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px}
.layout-bands .ship{display:block;min-width:0}
.layout-bands .ship .pic{aspect-ratio:3/2;background:var(--ph);overflow:hidden;border:1px solid var(--rule-soft)}
.layout-bands .ship .pic img{width:100%;height:100%;object-fit:cover;display:block}
.layout-bands .ship h2{font-size:25.36px;line-height:1.2;margin-top:12px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.layout-bands .ship .meta{font-family:var(--mono);font-size:14.6px;color:var(--ink-40);margin-top:8px}
.layout-bands .ship:hover h2{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.layout-bands #latest #posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 40px;border-top:2px solid var(--ink)}
.layout-bands #latest .post.row{display:grid;grid-template-columns:20px minmax(0,1fr);gap:0 8px;margin:0;padding:16px 0 18px;border-bottom:1px solid var(--rule-soft)}
.layout-bands #latest .post.row .gut{font-family:var(--mono);font-size:19.5px;color:var(--accent-text,var(--accent));line-height:1.2}
.layout-bands #latest .post.row h2{margin:0;font-size:25.36px;line-height:1.2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.layout-bands #latest .post.row .meta{grid-column:2;margin-top:6px;font-family:var(--mono)}
.layout-bands #latest .load-more{margin-top:32px;border-top:0;font-family:var(--mono);font-size:19.5px}
/* site.pics, the grid (owner 2026-09-16): every signal is a full-width strip of equal cards, four across, tight gaps; picture 3:2 on top,
   a three-line headline, the source and time under it. The front leads with its picture; From Japan and the pairs are cards too. */
.layout-bands.pics #latest #posts{display:block;border-top:0}
.layout-bands.pics #latest #posts:not(:has(.sig-group)){display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 10px}
.layout-bands.pics #latest #posts:not(:has(.sig-group)) > .sig-index{grid-column:1/-1}
.layout-bands.pics.signal-page #latest .head :is(h1,.h1){font-size:56px;line-height:1;letter-spacing:-.03em}
.layout-bands.pics.signal-page #latest .head .sub{font:500 16.5px var(--mono);color:var(--ink-40)}
.layout-bands.pics #latest .sig-group{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 10px;margin:0 0 34px;border-top:0}
.layout-bands.pics #latest .sig-group h3{grid-column:1/-1;margin:0;padding:10px 0 2px;border-top:3px solid var(--ink)}
.layout-bands.pics #latest .post.row{display:flex;flex-direction:column;margin:0;padding:0;border:0;min-width:0}
.layout-bands.pics #latest .post.row .gut{display:none}
.layout-bands.pics #latest .post.row .pic{aspect-ratio:3/2;margin:0 0 8px;border:0;background:var(--ph);overflow:hidden;flex:none}
.layout-bands.pics #latest .post.row .pic img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}
.layout-bands.pics #latest .post.row:hover .pic img{transform:scale(1.03)}
.layout-bands.pics #latest .post.row .pic.noimg{display:grid;place-items:center}
.layout-bands.pics #latest .post.row .pic.noimg span{font-family:var(--mono);font-size:14.6px;color:var(--ink-40);padding:6px;text-align:center}
.layout-bands.pics #latest .post.row h2{margin:0;font-size:19.5px;line-height:1.2;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;min-height:calc(1.2em * 3)}
.layout-bands.pics #latest .post.row .meta{grid-column:auto;margin-top:6px;font-size:14.6px}
.layout-bands.pics #latest .load-more{margin-top:0}
.layout-bands.pics #front .first .pic{aspect-ratio:16/9;background:var(--ph);overflow:hidden;margin:0 0 16px}
.layout-bands.pics #front .first .pic img{width:100%;height:100%;object-fit:cover;display:block}
.layout-bands.pics #front .first h2{font-size:44px}
.layout-bands.pics #front .ftwo{gap:0 24px}
.layout-bands.pics #front .fr{grid-template-columns:56px 112px minmax(0,1fr);align-items:start}
.layout-bands.pics #front .fr .pic{grid-column:2;grid-row:1/3;aspect-ratio:4/3;background:var(--ph);overflow:hidden;margin:0}
.layout-bands.pics #front .fr .pic img{width:100%;height:100%;object-fit:cover;display:block}
.layout-bands.pics #front .fr .pic.noimg{display:grid;place-items:center}
.layout-bands.pics #front .fr .pic.noimg span{font-family:var(--mono);font-size:14.6px;color:var(--ink-40);padding:6px;text-align:center}
.layout-bands.pics #front .fr h3,.layout-bands.pics #front .fr .m{grid-column:3}
.layout-bands.pics .wv-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 10px}
/* the art director's moves (2026-09-16): numbered strip heads with the family's signal bar, alternating grounds with one dark
   strip at the halfway mark, an orange mark on stories under a day old, a one-line meta at the type floor, no dots on the wall */
.layout-bands.pics #latest #posts{counter-reset:strip}
.layout-bands.pics #latest .sig-group{counter-increment:strip;padding:0 0 26px;margin:0}
.layout-bands.pics #latest .sig-group h3{grid-column:1/-1;display:grid;grid-template-columns:auto minmax(0,1fr) 120px auto;align-items:baseline;gap:0 14px;padding:14px 0 8px;margin:0 0 4px;border-top:3px solid var(--ink);text-transform:none;letter-spacing:0}
.layout-bands.pics #latest .sig-group h3::before{content:counter(strip,decimal-leading-zero);font-family:var(--mono);font-size:44px;line-height:1;font-weight:500;letter-spacing:-.03em;color:var(--ink-40);font-variant-numeric:tabular-nums}
.layout-bands.pics #latest .sig-group h3 button{font-family:var(--serif);font-weight:700;font-size:25.36px;line-height:1;letter-spacing:-.01em;text-transform:none}
.layout-bands.pics #latest .sig-group h3 i{display:block;height:8px;background:var(--accent);width:var(--w,4%);align-self:center}
.layout-bands.pics #latest .sig-group h3 span{font-family:var(--mono);font-size:16.5px;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.layout-bands.pics #latest .sig-group h3 span::after{content:" / wk"}
:root{--strip-alt:#ECE8DF}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--strip-alt:#131211}}
:root[data-theme="dark"]{--strip-alt:#131211}
.layout-bands.pics #latest .sig-group:nth-of-type(even){background:var(--strip-alt);box-shadow:-64px 0 0 var(--strip-alt),24px 0 0 var(--strip-alt)}
.layout-bands.pics #latest .sig-group:nth-of-type(12){background:var(--bar);color:var(--bar-ink);box-shadow:-64px 0 0 var(--bar),24px 0 0 var(--bar)}
.layout-bands.pics #latest .sig-group:nth-of-type(12) h3,.layout-bands.pics #latest .sig-group:nth-of-type(12) h2,.layout-bands.pics #latest .sig-group:nth-of-type(12) h3 button{color:var(--bar-ink)}
.layout-bands.pics #latest .sig-group:nth-of-type(12) h3{border-top-color:var(--bar-ink)}
.layout-bands.pics #latest .sig-group:nth-of-type(12) .meta,.layout-bands.pics #latest .sig-group:nth-of-type(12) h3::before{color:var(--bar-60)}
.layout-bands.pics #latest .post.row.fresh .pic{box-shadow:inset 0 3px 0 var(--accent)}
.layout-bands.pics #latest .post.row.fresh .meta::before{content:"new · ";color:var(--accent);font-weight:500}
.layout-bands.pics #latest .post.row .meta{font-size:14.6px;line-height:1.25;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.layout-bands.pics #latest .post h2::before{display:none}
.layout-bands.pics #latest .post.row:hover .pic img{transform:none}
/* the usability review (2026-09-16): a sticky family index, strip heads as links, names on the rail, captions on the shipped-today thumbnails, an honest calendar */
.layout-bands.pics #latest .sig-index{position:sticky;top:48px;z-index:5;display:flex;flex-wrap:wrap;gap:6px 16px;padding:10px 0;margin:0 0 6px;background:var(--bg);border-bottom:1px solid var(--rule);font-family:var(--mono);font-size:14.6px;letter-spacing:.04em;text-transform:uppercase}
.layout-bands.pics #latest .sig-index a{color:var(--ink-40);white-space:nowrap;text-decoration:none}
.layout-bands.pics #latest .sig-index a b{color:var(--accent);font-weight:500;margin-left:4px}
.layout-bands.pics #latest .sig-index a[aria-current="true"]{color:var(--ink);box-shadow:inset 0 -2px var(--accent)}
.layout-bands.pics #latest .sig-group{scroll-margin-top:170px}
.layout-bands.pics #latest .sig-group h3 a.fam{font-family:var(--serif);font-weight:700;font-size:25.36px;line-height:1;letter-spacing:-.01em;color:inherit;text-decoration:none}
.layout-bands.pics #latest .sig-group h3 a.fam:hover{color:var(--accent)}
.layout-bands.pics #latest .sig-group h3 a.fam::after{content:" →";color:var(--ink-40);font-weight:500}
.layout-bands.pics .band > .rail span{display:block;writing-mode:vertical-rl;transform:rotate(180deg);margin-top:12px;font-size:14.6px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-40);font-weight:500}
.layout-bands.pics #front .fmini a{position:relative}
.layout-bands.pics #front .fmini a b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-family:var(--serif);font-weight:700;font-size:14.6px;line-height:1.15;margin-top:4px;color:var(--ink)}
.layout-bands.pics #front .fmini img{filter:none}
.layout-bands.pics #japan #all-rg{display:none}
.layout-bands.pics #japan #onview{display:block}
.layout-bands.pics #events{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.layout-bands.pics #pairs .pair .two .thumb .pic{display:block;aspect-ratio:3/2;background:var(--ph);overflow:hidden;margin:0 0 8px}
.layout-bands.pics #pairs .pair .two .thumb .pic img{width:100%;height:100%;object-fit:cover;display:block}
.layout-bands.pics #pairs #pairs-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 40px}
@media(max-width:1200px){.layout-bands.pics #latest .sig-group,.layout-bands.pics #latest #posts:not(:has(.sig-group)){grid-template-columns:repeat(3,minmax(0,1fr))}.layout-bands.pics .wv-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:960px){.layout-bands.pics #latest .sig-group{grid-template-columns:repeat(2,minmax(0,1fr))}.layout-bands.pics .wv-grid{grid-template-columns:1fr 1fr}}
/* site.strip_cols: 5 (Accept All, 2026-09-16): five cards across on wide screens, so the squares stay small; tablets and phones keep 3 / 2 */
@media(min-width:1201px){.layout-bands.pics.cols-5 #latest .sig-group,.layout-bands.pics.cols-5 #latest #posts:not(:has(.sig-group)),.layout-bands.pics.cols-5 .wv-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.layout-bands.pics.cols-5 #latest .post.row h2{font-size:17.5px}
.layout-bands.cols-5 #fromjapan-list,.layout-bands.cols-5 .from-list,.layout-bands.cols-5 #japan .events{grid-template-columns:repeat(5,minmax(0,1fr))}   /* bands 05 and 06 follow the same count */
.layout-bands.pics.cols-5 #pairs #pairs-list{grid-template-columns:repeat(5,minmax(0,1fr));gap:18px 10px}   /* band 04: five pairs across, the two readings stacked in one column */
.layout-bands.pics.cols-5 #pairs .pair .two{grid-template-columns:minmax(0,1fr);gap:12px 0}
.layout-bands.pics.cols-5 #pairs .pair .two:before{display:none}
.layout-bands.pics.cols-5 #pairs .pair .two .thumb h2{font-size:17.5px}}
.layout-bands.pics #fromjapan-list a,.layout-bands.pics .from-list a{padding:0 0 22px;border-bottom:0}
.layout-bands.pics #fromjapan-list .pic,.layout-bands.pics .from-list .pic{aspect-ratio:3/2;background:var(--ph);overflow:hidden;margin:0 0 10px}
.layout-bands.pics #fromjapan-list .pic img,.layout-bands.pics .from-list .pic img{width:100%;height:100%;object-fit:cover;display:block}
.layout-bands .band.accent-band{background:var(--accent);color:var(--accent-ink);border-bottom:0}
.layout-bands .band.accent-band > .rail{color:var(--accent-ink);opacity:.7}
.layout-bands .band.accent-band > .rail{padding-top:18px}
.layout-bands #radar{padding:14px 24px 16px 0}
.layout-bands #radar .head{margin:0 0 4px;display:flex;align-items:baseline;gap:18px;flex-wrap:wrap}
.layout-bands #radar .head :is(h1,.h1){font-size:25.36px;line-height:1.2}
.layout-bands #radar .head .sub{margin:0;font-family:var(--mono);font-size:16.5px}
.layout-bands #radar #trends{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 32px}
.layout-bands #radar .trend{grid-template-columns:minmax(0,1fr) auto auto;gap:4px 10px;padding:6px 0 7px;line-height:1.1;border-top-width:1px}
.layout-bands #radar .trend .spark{display:none}
.layout-bands #radar .trends-more{margin-top:4px;font-size:16.5px;font-family:var(--mono)}
.layout-bands #discover .thumbs{grid-template-columns:repeat(6,minmax(0,1fr));gap:28px 24px}
.layout-bands #discover .thumb .pic{aspect-ratio:1;filter:grayscale(1) contrast(1.08);transition:filter var(--t-fast)}
.layout-bands #discover .thumb:hover .pic{filter:none}
.layout-bands #discover .thumb h2{font-size:19.5px}
.layout-bands #fromjapan-list,.layout-bands .from-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 40px;border-top:2px solid var(--ink)}
.layout-bands #fromjapan-list a,.layout-bands .from-list a{display:block;padding:16px 0 18px;border-bottom:1px solid var(--rule-soft);min-width:0}
.layout-bands #fromjapan-list h2,.layout-bands .from-list h2{font-size:25.36px;line-height:1.2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.layout-bands #fromjapan-list .jp{display:block;font-size:19.5px;line-height:1.35;color:var(--ink-40);margin-top:6px;font-weight:500;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.layout-bands #fromjapan-list .meta,.layout-bands .from-list .meta{font-family:var(--mono);font-size:14.6px;color:var(--ink-40);margin-top:6px}
.layout-bands #japan .events{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 32px}
.layout-bands #japan .events .ev{display:block;border-top:1px solid var(--rule-soft) !important;padding:14px 0 16px !important}
.layout-bands #japan .events .ev .d{display:block;font-family:var(--mono)}
.layout-bands #japan .events .ev h2{margin-top:4px}
.layout-bands #japan .events .ev .pill{display:inline-block;margin-top:8px}
.layout-bands #japan .events .ev .v{display:block;margin-top:6px}
.layout-bands #japan #jp-web.thumbs{grid-template-columns:repeat(2,minmax(0,1fr))}
.layout-bands #japan #wire,.layout-bands #japan #jp-wire,.layout-bands #japan #jptrends,.layout-bands #japan #jp-trends{display:none}
.layout-bands #japan #jp-web .thumb:nth-child(n+5){display:none}
.layout-bands #pairs #pairs-list{display:block}
.layout-bands #pairs .pair{margin:0;padding:14px 0 16px;border-top:1px solid var(--rule-soft)}
.layout-bands #pairs .pair:first-child{border-top:0;padding-top:0}
.layout-bands #pairs .pair .two{gap:0 40px;position:relative}
.layout-bands #pairs .pair .two:before{content:"⇄";position:absolute;left:50%;top:0;transform:translateX(-50%);font-family:var(--mono);font-size:16.5px;color:var(--ink-40)}
.layout-bands #pairs .pair .two .thumb .pic{display:none}
.layout-bands .sound{padding:40px 24px 48px 0 !important}
.layout-bands .sound .head{padding:0 0 8px}
.layout-bands .sound .moods{padding:0}
.layout-bands #colours .bar-strip{height:48px}
.layout-bands #japan .rg{margin-bottom:14px}
.layout-bands #japan #jpweb,.layout-bands #japan #jp-web{display:none}
.layout-bands #japan .events{grid-template-columns:repeat(4,minmax(0,1fr));gap:0 32px}
.layout-bands #japan .head{margin-bottom:14px}
.layout-bands #pairs #pairs-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 40px}
.layout-bands #pairs .pair{border-top:1px solid var(--rule-soft) !important;padding:12px 0 14px !important}
.layout-bands .band.pulse-band{background:var(--bar);color:var(--bar-ink);border-bottom:2px solid var(--ink)}
.layout-bands .band.pulse-band > .rail{padding-top:18px;color:var(--bar-ink)}
.layout-bands.pics .band.pulse-band > .rail span{color:var(--bar-ink);opacity:.6}   /* the band is dark on both themes; ink-40 vanished on it */
.layout-bands #pulse{padding:0 24px 0 0}
.layout-bands .tiles{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border-top:1px solid rgba(var(--bg-rgb),.18)}
.layout-bands .tile{display:flex;flex-direction:column;gap:4px;min-height:200px;padding:16px 16px 14px;border-left:1px solid rgba(var(--bg-rgb),.22);min-width:0;color:var(--bar-ink);position:relative;transition:background var(--t-fast),color var(--t-fast)}
.layout-bands .tile:first-child{border-left:0}
.layout-bands .tile .k{font-family:var(--mono);font-size:14.6px;letter-spacing:.08em;text-transform:uppercase;color:var(--bar-ink);font-weight:600}
.layout-bands .tile .n{font-family:var(--mono);font-size:44px;line-height:1;font-weight:500;letter-spacing:-.03em;color:var(--bar-ink);font-variant-numeric:tabular-nums;margin-top:6px}
.layout-bands .tile .n:before{content:"";display:block;width:12px;height:12px;background:var(--accent);margin-bottom:8px}
.layout-bands .tile .n.date{font-size:34px}
.layout-bands .tile ul{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:4px}
.layout-bands .tile li{font-size:16.5px;line-height:1.25;display:flex;flex-direction:column;min-width:0}
.layout-bands .tile li b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--bar-ink)}
.layout-bands .tile li span{font-family:var(--mono);font-size:14.6px;color:var(--bar-60);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.layout-bands .tile .go{margin-top:auto;padding-top:10px;font-family:var(--mono);font-size:14.6px;color:var(--bar-accent,var(--accent-text,var(--accent)))}
.layout-bands .tile:hover{background:var(--bar-ink);color:var(--bar)}
.layout-bands .tile:hover .k,.layout-bands .tile:hover .n,.layout-bands .tile:hover li b{color:var(--bar)}
.layout-bands .tile:hover li span{color:rgba(var(--ink-rgb),.6)}
.layout-bands .tile:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.layout-bands .tile.watch{background:var(--accent);color:var(--accent-ink);padding:0;justify-content:flex-start;gap:0}
.layout-bands .tile.watch .pic{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-bottom:1px solid var(--accent-ink)}
.layout-bands .tile.watch .ov{display:flex;flex-direction:column;gap:4px;padding:12px 16px 14px;color:var(--accent-ink);min-height:0;flex:1}
.layout-bands .tile.watch .ov .k{color:var(--accent-ink)}
.layout-bands .tile.watch .ov b{font-size:19.5px;line-height:1.2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.layout-bands .tile.watch .ov span:last-child{font-family:var(--mono);font-size:14.6px;color:var(--accent-ink);opacity:.8;margin-top:auto;padding-top:6px}
.layout-bands .tile.watch:hover{background:var(--accent-ink);color:var(--accent-text,var(--accent))}
.layout-bands .tile.watch:hover .ov,.layout-bands .tile.watch:hover .ov .k,.layout-bands .tile.watch:hover .ov span:last-child{color:var(--accent-text,var(--accent))}
.layout-bands #watch .head{margin-bottom:16px}
.single.left.pulse-page{max-width:none;padding-right:24px}
.layout-bands .sound .moods{display:block}
.layout-bands .sound .mood-card{display:block;border-top:1px solid var(--rule-soft);padding:0;margin-left:-64px;margin-right:0}
.layout-bands .sound .mood-card .one-head{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto auto;gap:0 22px;align-items:center;padding:8px 32px 8px 72px;border-left:0;margin:0;cursor:pointer;min-height:48px}
.layout-bands .sound .mood-card .one-head p{grid-column:3;white-space:nowrap}
.layout-bands .sound .eq{grid-column:4}
.layout-bands .sound .mood-card .one-head:after{grid-column:5 !important;grid-row:1}
.layout-bands .sound .mood-card .one-head > *{grid-row:1}
.layout-bands .sound .mood-card .one-head .mood{margin:0}
.layout-bands .sound .mood-card .one-head h2{margin:0;font-size:25.36px;line-height:1.15}
.layout-bands .sound .mood-card .one-head p{display:block;margin:0;font-family:var(--mono);font-size:14.6px;color:var(--ink-40)}
.layout-bands .sound .one .one-head h2,.layout-bands .sound .mood-card .one-head h2,.layout-bands .sound .one .one-head .mood,.layout-bands .sound .mood-card .one-head .mood{color:var(--ink)}   /* 2026-09-17: the slat palette's light text was invisible on a light page */
.layout-bands .sound .mood-card .one-head:after{content:"▶";font-family:var(--mono);color:var(--accent-text,var(--accent));grid-column:3}
.layout-bands .sound .mood-card.open .one-head:after{content:"■"}
.layout-bands .sound .mood-card .one-embed,.layout-bands .sound .mood-card .one-open{display:none}
.layout-bands .sound .mood-card.open .one-embed{display:block;padding:0 0 16px}
.layout-bands .sound .mood-card.open .one-embed iframe{height:80px}

.layout-bands .sound .mood-card.open .one-head:after{content:"■"}
.layout-bands .sound .eq{display:inline-flex;gap:3px;align-items:flex-end;height:20px}
.layout-bands .sound .eq i{display:block;width:4px;height:6px;background:var(--ink-40)}
.layout-bands .sound .mood-card.open .eq i{background:var(--accent);animation:aa-eq .9s ease-in-out infinite alternate}
.layout-bands .sound .mood-card.open .eq i:nth-child(2){animation-delay:.15s}.layout-bands .sound .mood-card.open .eq i:nth-child(3){animation-delay:.3s}.layout-bands .sound .mood-card.open .eq i:nth-child(4){animation-delay:.45s}
@keyframes aa-eq{from{height:4px}to{height:20px}}
.layout-bands #japan .head .sub,.layout-bands #japan .rg,.layout-bands #japan #onview{display:none}
.layout-bands #japan .head{margin-bottom:8px}
.layout-bands #discover .thumbs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 40px;border-top:2px solid var(--ink)}
.layout-bands #discover .tool{display:block;padding:14px 0 15px;border-bottom:1px solid var(--rule-soft);min-width:0;color:var(--ink)}
.layout-bands #discover .tool b{display:block;font-size:25.36px;line-height:1.2;font-weight:600;overflow-wrap:anywhere}
.layout-bands #discover .tool .d{display:block;margin-top:6px;font-size:19.5px;line-height:1.35;color:var(--ink-40);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.layout-bands #discover .tool .m{display:block;margin-top:6px;font-family:var(--mono);font-size:14.6px;color:var(--ink-40)}
.layout-bands #discover .tool:hover b{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.layout-bands .board .track span.hot{color:var(--board-mq-ink,var(--ink))}   /* the strip has its own ground now; --ink vanished on it */
:root[data-theme="dark"] .layout-bands .board .track span.hot{color:var(--board-mq-ink,#fff)}
.layout-bands .sound .mood-card{position:relative;overflow:hidden}
.layout-bands .sound .mood-card:before{content:"";position:absolute;inset:0;background:var(--accent);opacity:0;transform:translateX(-6%);transition:opacity 1.4s ease,transform 1.4s ease;pointer-events:none}
.layout-bands .sound .mood-card:hover:before{opacity:1;transform:translateX(0);transition:opacity .45s ease,transform .45s ease}
.layout-bands .sound .mood-card .one-head{position:relative;z-index:1}
.layout-bands .sound .mood-card .one-head h2,.layout-bands .sound .mood-card .one-head p,.layout-bands .sound .mood-card .one-head .mood,.layout-bands .sound .mood-card .one-head:after{transition:color 1.4s ease,border-color 1.4s ease,transform 1.4s ease}
.layout-bands .sound .mood-card:hover .one-head h2,.layout-bands .sound .mood-card:hover .one-head p,.layout-bands .sound .mood-card:hover .one-head .mood,.layout-bands .sound .mood-card:hover .one-head:after{color:var(--accent-ink);border-color:var(--accent-ink);transition:color .45s ease,border-color .45s ease,transform .45s ease}
.layout-bands .sound .mood-card:hover .one-head h2{transform:translateX(8px)}
.layout-bands .sound .mood-card:hover .eq i{animation:aa-eq 1.6s ease-in-out infinite alternate;background:var(--accent-ink)}
.layout-bands .sound .mood-card:hover .eq i:nth-child(2){animation-delay:.2s}.layout-bands .sound .mood-card:hover .eq i:nth-child(3){animation-delay:.4s}.layout-bands .sound .mood-card:hover .eq i:nth-child(4){animation-delay:.6s}
.layout-bands .sound .mood-card.open{border-left:6px solid var(--accent)}
.layout-bands .sound .mood-card.open .one-head{padding-left:66px}
.layout-bands .sound .mood-card.open .one-embed{padding:0 32px 14px 66px}
.layout-bands .sound .mood-card.open .one-embed{position:relative;z-index:1;padding:0 0 18px}
.layout-bands .sound .mood-card.open .one-embed iframe{height:80px;border:0;background:transparent}
.layout-bands .sound .mood-card.open:hover:before{opacity:0}
.layout-bands .sound .mood-card.open:hover .one-head h2,.layout-bands .sound .mood-card.open:hover .one-head p,.layout-bands .sound .mood-card.open:hover .one-head .mood,.layout-bands .sound .mood-card.open:hover .one-head:after{color:var(--ink);border-color:var(--ink)}
.layout-bands .sound .mood-card.open:hover .eq i{background:var(--accent)}
@media(prefers-reduced-motion:reduce){.layout-bands .sound .mood-card:before,.layout-bands .sound .mood-card .one-head h2,.layout-bands .sound .mood-card .one-head:after{transition:none}.layout-bands .sound .mood-card:hover .eq i{animation:none}}
.layout-bands .sound .foot{display:none}
.layout-bands .sound .mood-card .one-head h2{font-size:25.36px}
.layout-bands #colophon{padding:32px 24px 40px 0}
.layout-bands #colophon > section{padding:0;border:0}
.layout-bands #colophon #about{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 56px;align-items:start}
.layout-bands #colophon #about .head{display:none}
.layout-bands #colophon #about .about-text{grid-column:1}
.layout-bands #colophon #about .about-text h2{font-size:25.36px;line-height:1.25;margin:0 0 8px}
.layout-bands #colophon #about .about-text p{font-size:19.5px}
.layout-bands #colophon #about .about-text p:nth-of-type(n+2){display:none}
.layout-bands #colophon #about .about-text .read-on,.layout-bands #colophon #about .about-text button{display:none}
.layout-bands #colophon #about footer{grid-column:2;margin:0}
.layout-bands #colophon #sources{margin-top:28px;border-top:1px solid var(--rule-soft);padding-top:14px}
.layout-bands #colophon #sources .head{display:flex;gap:14px;align-items:baseline;margin:0 0 8px}
.layout-bands #colophon #sources .head :is(h1,.h1){font-family:var(--mono);font-size:14.6px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-40);font-weight:500}
.layout-bands #colophon #sources .head .sub{display:none}
.layout-bands #colophon #sources .list{columns:auto;display:flex;flex-wrap:wrap;gap:4px 16px;font-family:var(--mono);font-size:14.6px;color:var(--ink-40)}
.layout-bands #colophon #sources .list a{color:var(--ink-40)}
.layout-bands #colophon #sources .list a:hover{color:var(--ink)}
.layout-bands #about .about-text p{max-width:none}
.layout-bands .head .sub .jp,.layout-bands .subhead .jp,.layout-bands .head .jp{font-family:var(--mono);font-size:16.5px;font-weight:500;color:var(--ink-40);letter-spacing:0}
.layout-bands h2 [lang="ja"],.layout-bands h2[lang="ja"]{font-weight:500;letter-spacing:0}
}
@media(max-width:960px){.layout-bands.pics #latest #posts:not(:has(.sig-group)){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 10px}.layout-bands.pics #latest #posts:not(:has(.sig-group)) > .sig-index{grid-column:1/-1}.layout-bands.pics.signal-page #latest .head :is(h1,.h1){font-size:36px}}   /* owner 2026-09-16 (this sat inside @media(min-width:961px) until 2026-09-17, so it never matched): a filtered list (a family button, a source, a search) and the family pages were one column of giant pictures */

/* ---------- the strips on a phone (usability review 2026-09-16): until now the card grid lived only above 960px, so a phone got
   24 unstyled headings and four hundred full-width pictures. Two cards a row, the family index as a sticky scrolling line,
   six cards a strip with the rest behind the same '+N'. ---------- */
@media(max-width:960px){
.layout-bands.pics #latest{padding:0 16px}
.layout-bands.pics #latest .sig-index{position:sticky;top:48px;z-index:5;display:flex;gap:16px;overflow-x:auto;white-space:nowrap;padding:10px 16px;margin:0 -16px 6px;background:var(--bg);font-family:var(--mono);font-size:14.6px;font-weight:500;text-transform:uppercase;letter-spacing:.04em;scrollbar-width:none;border-bottom:1px solid var(--rule)}
.layout-bands.pics #latest .sig-index::-webkit-scrollbar{display:none}
.layout-bands.pics #latest .sig-index a{color:var(--ink-40);text-decoration:none;flex:none}
.layout-bands.pics #latest .sig-index a b{color:var(--accent-text,var(--accent));font-weight:500;margin-left:4px}
.layout-bands.pics #latest .sig-index a[aria-current="true"]{color:var(--ink)}.layout-bands.pics.index-line #latest .sig-index{padding:0 16px}   /* the only block on the phone home with no side gutter */
.layout-bands.pics #latest .sig-group{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 10px;margin:0 0 28px;scroll-margin-top:100px}
.layout-bands.pics #latest .sig-group h3{grid-column:1/-1;display:flex;align-items:baseline;gap:10px;margin:0;padding:12px 0 2px;border-top:3px solid var(--ink);font-family:var(--serif);font-weight:700;font-size:25.36px;line-height:1.05;letter-spacing:-.01em}
.layout-bands.pics #latest .sig-group h3 a.fam,.layout-bands.pics #latest .sig-group h3 span.fam{color:inherit;text-decoration:none;flex:1 1 auto;min-width:0}
.layout-bands.pics #latest .sig-group h3 i{display:none}
.layout-bands.pics #latest .sig-group h3 > span:not(.fam){font-family:var(--mono);font-size:14.6px;font-weight:500;color:var(--accent-text,var(--accent))}
.layout-bands.pics #latest .sig-group h3 button{font-family:inherit;font-size:inherit;color:inherit;background:none;border:0;padding:0;text-align:left}
.layout-bands.pics #latest .sig-group h3 .unfold{font:500 14.6px var(--mono);color:var(--accent-text,var(--accent));margin-left:auto;white-space:nowrap}
.layout-bands.pics #latest .post.row{display:flex;flex-direction:column;margin:0;padding:0;border:0;min-width:0}
.layout-bands.pics #latest .post.row .gut{display:none}
.layout-bands.pics #latest .post.row .pic{aspect-ratio:3/2;margin:0 0 8px;border:0;background:var(--ph);overflow:hidden;flex:none;width:100%}
.layout-bands.pics #latest .post.row .pic img{width:100%;height:100%;object-fit:cover;display:block}
.layout-bands.pics #latest .post.row .pic.noimg{display:grid;place-items:center}
.layout-bands.pics #latest .post.row .pic.noimg span{font-family:var(--mono);font-size:14.6px;color:var(--ink-40);padding:6px;text-align:center}
.layout-bands.pics #latest .post.row h2{margin:0;font-size:17px;line-height:1.2;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;min-height:calc(1.2em * 3)}
.layout-bands.pics #latest .post.row h2::before{display:none}
.layout-bands.pics #latest .post.row .meta{margin-top:6px;font-family:var(--mono);font-size:14.6px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink-40)}
.layout-bands.pics #latest .post.row .meta::before{content:none}
.layout-bands.pics.strip-fold #latest .sig-group:not(.open) .post.row:nth-child(n+8){display:none}
.layout-bands.pics #latest #posts:has(.sig-group) ~ .load-more{display:none}   /* phones: hidden only while the strips are shown; a search or a signal filter keeps its Show more */
}
/* pulse catalogue pages, watch grid and about page: every width, not only the bands desktop */
.wv-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:24px 20px}
.wv{display:block;min-width:0;color:var(--ink)}
.wv .wv-pic{display:block;aspect-ratio:16/9;background:var(--ph);overflow:hidden;position:relative}
.wv .wv-pic img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(1);transition:filter var(--t-fast)}
.wv:hover .wv-pic img{filter:none}
.wv .wv-pic:after{content:"▶";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-family:var(--mono);font-size:19.5px;color:#fff;background:rgba(0,0,0,.6);width:44px;height:44px;line-height:44px;text-align:center}
.wv .wv-pic iframe{width:100%;height:100%;border:0;display:block}
.wv .wv-live{position:absolute;left:8px;top:8px;z-index:1;font:700 11.5px/1 var(--mono,monospace);letter-spacing:.12em;font-style:normal;color:#fff;background:#D93025;padding:5px 7px 4px;border-radius:2px}.wv .wv-pic:has(.wv-live) img{filter:none}.wv .wv-pic:has(iframe) .wv-live{display:none}
.wv .wv-pic:has(iframe):after{display:none}
.wv b{display:block;margin-top:10px;font-size:19.5px;line-height:1.2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.wv .pl-org{display:block;margin-top:4px;font-family:var(--mono);font-size:14.6px;color:var(--ink-40)}
.pulse-page .pl-filter{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.pulse-page .pl-filter button{font-family:var(--mono);font-size:14.6px;padding:6px 12px;border:1px solid var(--rule);background:none;color:var(--ink);cursor:pointer;letter-spacing:.04em;text-transform:uppercase}
.pulse-page .pl-filter button[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.pulse-page .pl-list{border-top:2px solid var(--ink)}
.pulse-page .pl-row{display:grid;grid-template-columns:96px minmax(0,1.2fr) minmax(0,2fr) auto auto auto;gap:0 18px;align-items:baseline;padding:12px 0;border-bottom:1px solid var(--rule-soft);color:var(--ink);min-width:0}
.pulse-page .pl-row[hidden]{display:none}
.pulse-page .pl-row b{font-size:25.36px;line-height:1.2;overflow-wrap:anywhere}
.pulse-page .pl-row .pl-date,.pulse-page .pl-row .pl-num,.pulse-page .pl-row .pl-task,.pulse-page .pl-row .pl-try{font-family:var(--mono);font-size:14.6px;color:var(--ink-40);white-space:nowrap}
.pulse-page .pl-row .pl-org{font-size:16.5px;color:var(--ink-40);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.pulse-page .pl-row .pl-org i,.pulse-page .pl-row .pl-for i{font-style:normal;font-family:var(--mono);font-size:14.6px;letter-spacing:.06em;text-transform:uppercase;border:1px solid var(--rule);padding:2px 6px;margin-right:4px;color:var(--ink)}
.pulse-page .pl-row .pl-try,.pulse-page .pl-row a .pl-try{color:var(--accent-text,var(--accent))}
.pulse-page .pl-row > a{color:var(--ink);min-width:0}
.pulse-page .pl-row > a:hover b{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.pulse-page .pl-row:hover b{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
@media(min-width:961px){   /* two classes beat the one-column phone rule below, so /mcp/ and /skills/ kept the desk grid on a phone and squeezed a description into 53px; /models/ had no such override and was fine */
.pulse-page.pulse-mcp .pl-row{grid-template-columns:96px minmax(0,1fr) minmax(0,2fr) auto}
.pulse-page.pulse-skills .pl-row{grid-template-columns:96px minmax(0,1fr) minmax(0,2fr) auto auto}
}
.pulse-page .summary{max-width:70ch}
.pulse-page.pulse-watch .wv-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
.pulse-page .pl-filter button small{font-weight:400;opacity:.6;margin-left:4px}
.single.left .about-page h2{font-size:40px;line-height:1.1;max-width:26ch}.single.left .about-page p{font-size:19.5px;line-height:1.45;max-width:60ch;margin-top:16px}
@media(max-width:960px){.wv-grid,.pulse-page.pulse-watch .wv-grid{grid-template-columns:1fr 1fr}.pulse-page .pl-row{grid-template-columns:1fr;gap:2px}.pulse-page .pl-row .pl-date{order:9}}

/* ---------- layout: marquee — dark screening room (SITE.layout === "marquee") ---------- */
.layout-marquee .colhead,.layout-marquee .tabs{display:none !important}
.marquee{padding-top:48px}
.marquee > section,.marquee .two > * > section{padding:32px 16px;border-bottom:1px solid var(--rule)}
.marquee .two{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);border-bottom:1px solid var(--rule)}
.marquee .two > aside{border-left:1px solid var(--rule)}
.marquee .two > * > section:last-child{border-bottom:0}
.marquee #lead{position:relative;min-height:72vh;display:grid;align-content:end;padding:0 16px 48px;overflow:hidden;border-bottom:1px solid var(--rule)}
.marquee #lead .lead-thumbs{position:absolute;inset:0;margin:0;display:block;z-index:0}
.marquee #lead .lead-thumbs .thumb{height:100%;display:block}
.marquee #lead .lead-thumbs .thumb .pic{aspect-ratio:auto;height:100%}
.marquee #lead .lead-thumbs .thumb .pic img{filter:brightness(.72) saturate(.9);transform:scale(1.02);transition:transform 12s linear}
.marquee #lead:hover .lead-thumbs .thumb .pic img{transform:scale(1.08)}
.marquee #lead .lead-thumbs .thumb h2{position:absolute;top:72px;right:16px;margin:0;font-size:14.6px;letter-spacing:.02em;color:rgba(255,255,255,.7);text-align:right;max-width:40ch;text-shadow:0 1px 8px rgba(0,0,0,.6);font-family:var(--sans)}
.marquee #lead .lead-thumbs .thumb:nth-child(2){display:none}
.marquee #lead .lead-thumbs .thumb.failed{display:none}
.marquee #lead .lead-thumbs .thumb.failed + .thumb{display:block}
.marquee #lead .lead-thumbs .thumb .pic img[alt]{color:transparent}
.marquee #lead .lead-thumbs:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.25) 0%,rgba(0,0,0,0) 35%,rgba(0,0,0,.85) 100%)}
.marquee #lead .head,.marquee #lead .note,.marquee #lead .more,.marquee #lead .lead-note{position:relative;z-index:1;color:#fff}
.marquee #lead .head{margin-bottom:12px;max-width:1100px}
.marquee #lead .head :is(h1,.h1){font-size:88px;line-height:.98;letter-spacing:-.01em}
.marquee #lead .head .sub{color:rgba(255,255,255,.65)}
.marquee #lead .note{font-size:25.36px;line-height:1.3;max-width:62ch}
.marquee #lead .note .grey{color:rgba(255,255,255,.55)}
.marquee #lead .more{color:rgba(255,255,255,.65)}.marquee #lead .more:hover{color:#fff}
.marquee #lead .hanko{box-shadow:0 0 0 6px rgba(0,0,0,.35)}
.marquee #posts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.marquee #posts .post{margin:0;position:relative;background:transparent}
/* A cinema feed sends press stills, not posters: 49 of 51 pictures measured were landscape, median 16:9,
   and the old 2:3 frame cut away three fifths of the width of every one of them - logos ended mid-word.
   The frame now follows the material and the headline sits under it at full contrast.
   site.poster_cards brings the tall poster wall back. */
.marquee #posts .post .pic img{transition:transform var(--t-slow) var(--ease)}
.marquee #posts .post:hover .pic img{transform:scale(1.05)}
.marquee #posts .post h2{margin:0;padding:12px 0 0;font-size:19.5px;line-height:1.2}
.marquee #posts .post h2 .grey,.marquee #posts .post .sum{display:none}
.marquee #posts .post h2 .pill{display:inline-block;margin:0 6px 8px 0;top:0}
.marquee #posts .post h2 .pill:last-of-type::after{content:"\A";white-space:pre}
.marquee #posts .post .meta{margin:8px 0 0;color:var(--ink-40);font-size:14.6px}
.poster-cards .marquee #posts .post{overflow:hidden;background:var(--ph)}
.poster-cards .marquee #posts .post .pic{aspect-ratio:2/3}
.poster-cards .marquee #posts .post h2{position:absolute;left:0;right:0;bottom:0;padding:72px 14px 14px;line-height:1.15;color:#fff;background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.55) 40%,rgba(0,0,0,.92) 100%)}
.poster-cards .marquee #posts .post h2 .pill.jpill{color:#fff;border-color:rgba(255,255,255,.7)}
.poster-cards .marquee #posts .post .meta{position:absolute;top:10px;left:12px;margin:0;color:rgba(255,255,255,.75);text-shadow:0 1px 6px rgba(0,0,0,.7)}
.marquee #posts .post:hover h2{text-decoration:none}
.marquee #posts .post .pic.noimg span{font-size:19.5px}
.marquee .load-more{margin-top:24px}
.marquee .thumbs{grid-template-columns:1fr 1fr}
.marquee #about .about-text{columns:2;column-gap:48px;max-width:none}
.marquee #about .about-text h2{column-span:all;max-width:32ch}
.marquee #about .about-text p{max-width:none}
.marquee .side .head :is(h1,.h1){font-size:34px}
@media(max-width:1200px){.marquee #posts{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:960px){
  .marquee .two{display:block}.marquee .two > aside{border-left:0}
  .marquee #lead{min-height:60vh}.marquee #lead .head :is(h1,.h1){font-size:44px}.marquee #lead .note{font-size:19.5px}
  .marquee #posts{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .marquee #posts .post h2{font-size:16.5px;padding:48px 10px 10px}
  .marquee #about .about-text{columns:1}
}

/* marquee v2: bar with section nav, overlay menu, hero strip, colophon, board */
.layout-marquee .bar{height:56px;gap:20px;border-bottom:1px solid rgba(255,255,255,.12)}
.layout-marquee .bar .logo .logo-img{height:26px;top:1px}
.layout-marquee .bar .logo .jp{font-size:15px}
.layout-marquee .topnav{display:flex;gap:22px;margin-left:8px;padding-left:24px;border-left:1px solid rgba(255,255,255,.16);font-size:16.5px;letter-spacing:.01em;color:var(--bar-60);white-space:nowrap}
.layout-marquee .topnav a{padding:4px 0;border-bottom:1px solid transparent;transition:color var(--t-fast),border-color var(--t-fast)}
.layout-marquee .topnav a:hover{color:var(--bar-ink);border-color:var(--accent-text,var(--accent))}
.layout-marquee .menu .topnav{display:block;margin:0;padding:0;border:0;white-space:normal;font-size:inherit;letter-spacing:0;color:inherit}
.layout-marquee .menu .topnav a{display:block;padding:0;border:0}
.layout-marquee .menu,.layout-marquee .scrim{top:56px}
.layout-marquee .scrim{inset:56px 0 0;background:rgba(0,0,0,.55)}
.layout-marquee .menu{background:rgba(11,11,12,.97);color:#fff;border-top:2px solid var(--accent);max-height:calc(100vh - 56px);backdrop-filter:blur(12px)}
.layout-marquee .menu .grid > div{padding:0 24px 48px;border-left-color:rgba(255,255,255,.14)}
.layout-marquee .menu .ch{height:auto;padding:28px 24px 14px;margin:0 -24px 20px;font-family:var(--serif);font-size:40px;line-height:1;border-bottom:1px solid rgba(255,255,255,.2);color:#fff}
.layout-marquee .menu a,.layout-marquee .menu button{font-family:var(--serif);font-size:30px;line-height:1.3;color:#fff}
.layout-marquee .menu a:hover,.layout-marquee .menu button:hover{color:var(--accent-text,var(--accent));text-decoration:none}
.layout-marquee .menu button[aria-pressed="true"]{color:var(--accent-text,var(--accent));text-decoration:none}
.layout-marquee .menu .small{font-family:var(--sans);font-size:14.6px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:6px}
.layout-marquee .menu .search{border-bottom-color:rgba(255,255,255,.3)}
.layout-marquee .menu .search input{color:#fff;font-family:var(--serif);font-size:30px}
.layout-marquee .menu .search input::placeholder{color:rgba(255,255,255,.4)}
.layout-marquee .menu .search button{color:#fff;font-family:var(--sans)}
.layout-marquee .menu #menu-signals button{font-family:var(--sans);font-size:16.5px;display:inline-block;margin:0 10px 8px 0;border:1px solid rgba(255,255,255,.3);border-radius:9999px;padding:6px 12px;line-height:1}
.layout-marquee .menu #menu-signals button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent-text,var(--accent));color:#fff}
.marquee{padding-top:56px}
.marquee #lead{min-height:0;padding:34vh 16px 28px}
.marquee #lead .head :is(h1,.h1){font-size:72px}
.marquee #lead .strip{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:22px;padding-top:18px;border-top:1px solid rgba(255,255,255,.22)}
.marquee #lead .strip .thumb .pic{aspect-ratio:16/9;border-radius:4px}
.marquee #lead .strip .thumb h2{font-size:17.5px;line-height:1.25;margin-top:8px;color:#fff;font-family:var(--sans);font-weight:500}
.marquee #lead .strip .thumb h2 .grey{color:rgba(255,255,255,.55)}
.marquee #lead .strip .thumb h2 .pill{display:none}
.marquee #lead .strip .thumb.failed{display:none}
.marquee #lead .more{margin-top:14px}
.marquee .two{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
.marquee #jp-wire > *:nth-child(n+7){display:none}
.marquee #colours{border-bottom:0}
.marquee .colophon{border-top:1px solid var(--rule);padding:48px 16px 40px}
.marquee .colophon > section{padding:0;border:0}
.marquee .colophon #about .head{display:none}
.marquee .colophon #about .about-text{columns:3;column-gap:40px;max-width:none}
.marquee .colophon #about .about-text h2{column-span:all;max-width:34ch;font-size:40px;line-height:1.05;margin:0 0 28px}
.marquee .colophon #about .about-text p{font-size:18px;line-height:1.45;color:var(--ink-40);max-width:none;margin:0 0 12px;break-inside:avoid}
.marquee .colophon #about footer{margin:20px 0 0 !important;font-size:14.6px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-40)}
.marquee .colophon #sources{margin-top:40px;padding-top:28px;border-top:1px solid var(--rule-soft)}
.marquee .colophon #sources .head :is(h1,.h1){font-size:14.6px;letter-spacing:.1em;text-transform:uppercase;font-family:var(--sans);color:var(--ink-40)}
.marquee .colophon #sources .head .sub{display:none}
.marquee .colophon .list.sources{gap:8px}
.marquee .colophon .list.sources a{display:inline-block;border:1px solid rgba(var(--ink-rgb),.22);border-radius:9999px;padding:8px 14px;line-height:1;color:var(--ink);font-size:16.5px}
.marquee .colophon .list.sources a .grey{font-size:14.6px}
.marquee .colophon .list.sources a .grey{color:var(--accent-text,var(--accent))}
.layout-marquee .board{border-top:2px solid var(--accent);background:#0B0B0C}
.layout-marquee .board .mq{background:#0B0B0C;color:#fff;height:88px;border-bottom:1px solid rgba(255,255,255,.14)}
.layout-marquee .board .track span{font-size:44px;font-family:var(--serif);letter-spacing:0}
.layout-marquee .board .track span i{color:#fff;font-family:var(--sans);font-size:15px;letter-spacing:.1em;text-transform:uppercase;vertical-align:middle;margin-right:18px}
.layout-marquee .board .track span.dim{color:rgba(255,255,255,.4);font-family:var(--sans);font-size:15px;letter-spacing:.1em}
.layout-marquee .board .links{grid-template-columns:1.4fr 1fr 1fr;font-size:19.5px}
.layout-marquee .board .links > div{padding:40px 24px 56px;border-left-color:rgba(255,255,255,.14)}
.layout-marquee .board .links > div > b{font-family:var(--sans);font-size:14.6px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:8px}
.layout-marquee .board .links > div:first-child > b{display:flex;align-items:baseline;gap:10px;text-transform:none;letter-spacing:0;margin-bottom:14px}
.layout-marquee .board .links > div:first-child > b .logo-img{height:34px}
.layout-marquee .board .links > div:first-child > b .jp{font-family:var(--serif);font-size:20px;color:rgba(255,255,255,.6)}
.layout-marquee .board .links > div:first-child > span[data-t="tagline"]{font-family:var(--serif);font-size:26px;line-height:1.2;color:#fff;max-width:22ch}
.layout-marquee .board .links a{font-family:var(--serif);font-size:24px;line-height:1.3}
.layout-marquee .board .links a:hover{color:var(--accent-text,var(--accent))}
.layout-marquee .board #board-when{font-size:14.6px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.4);margin-top:auto}
@media(max-width:960px){
  .layout-marquee .bar{height:48px}.layout-marquee .bar .logo .logo-img{height:20px}
  .layout-marquee .menu,.layout-marquee .scrim{top:48px}.layout-marquee .scrim{inset:48px 0 0}.layout-marquee .menu{max-height:calc(100vh - 48px)}
  .layout-marquee .menu .ch{font-size:30px}.layout-marquee .menu a,.layout-marquee .menu button{font-size:24px}
  .marquee{padding-top:48px}.marquee #lead{padding:26vh 16px 24px}.marquee #lead .head :is(h1,.h1){font-size:44px}
  .marquee #lead .strip{grid-template-columns:1fr 1fr;gap:10px}
  .marquee .colophon #about .about-text{columns:1}.marquee .colophon #about .about-text h2{font-size:30px}
  .layout-marquee .board .track span{font-size:30px}
  .layout-marquee .board .links a{font-size:21px}
}

/* box office boards */
.boxoffice .bo-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.boxoffice .bo-card{border:1px solid var(--rule-soft);border-top:3px solid var(--accent);padding:14px 14px 10px;background:rgba(255,255,255,.02)}
.boxoffice .bo-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:10px}
.boxoffice .bo-head h2{font-size:28px;margin:0;font-family:var(--serif)}
.boxoffice .bo-head .grey{font-size:14.6px;white-space:nowrap}
.boxoffice ol{list-style:none;margin:0;padding:0}
.boxoffice li{display:grid;grid-template-columns:24px 28px minmax(0,1fr) auto;align-items:baseline;gap:8px;padding:10px 0;border-top:1px solid var(--rule-soft);font-size:17.5px;line-height:1.25}
.boxoffice li:first-child{border-top:0}
.boxoffice .bo-rank{font-family:var(--serif);font-size:25.36px;line-height:1;color:var(--ink)}
.boxoffice li i{font-style:normal;font-size:14.6px;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.boxoffice .bo-up{color:#4CD26B}.boxoffice .bo-down{color:var(--accent-text,var(--accent))}.boxoffice .bo-same{color:var(--ink-40)}.boxoffice .bo-new{color:#F2C14E;font-weight:600;font-size:14.6px}
.boxoffice .bo-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.boxoffice .bo-gross{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:500}
.boxoffice .bo-gross small{display:block;font-size:14.6px;font-weight:400;color:var(--ink-40)}
.boxoffice .bo-gross small.pos{color:#4CD26B}.boxoffice .bo-gross small.neg{color:var(--accent-text,var(--accent))}
.boxoffice .bo-note{margin:14px 0 0;font-size:14.6px;color:var(--ink-40)}
.boxoffice .head-row .more-link{font-size:16.5px}
@media(max-width:1400px){.boxoffice .bo-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:960px){.boxoffice .bo-grid{grid-template-columns:1fr}}
/* full charts page */
.single.boxoffice .bo-board{margin-top:36px}
.single.boxoffice .bo-board h2{font-size:32px;margin:0 0 10px;font-family:var(--serif)}
.single.boxoffice .bo-board h2 .grey{font-size:16px;font-family:var(--sans)}
.single.boxoffice table.bo{width:100%;border-collapse:collapse;font-size:19.5px}
.single.boxoffice table.bo th{text-align:left;font-weight:500;font-size:14.6px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-40);padding:6px 8px;border-bottom:1px solid var(--rule)}
.single.boxoffice table.bo td{padding:9px 8px;border-bottom:1px solid var(--rule-soft);vertical-align:baseline}
.single.boxoffice table.bo td.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.single.boxoffice table.bo td.t{font-family:var(--serif);font-size:24px}
/* Seven columns of which three never wrap left the film title 139px on a phone, so 81 of 198 titles
   ran three lines or more. The row becomes a card, the way the departures board already does. */
@media(max-width:600px){
.single.boxoffice table.bo,.single.boxoffice table.bo tbody,.single.boxoffice table.bo tr,.single.boxoffice table.bo td{display:block;width:auto}
.single.boxoffice table.bo thead{display:none}
.single.boxoffice table.bo tr{padding:12px 0;border-bottom:1px solid var(--rule-soft)}
.single.boxoffice table.bo td{border:0;padding:1px 0;text-align:left}
.single.boxoffice table.bo td.t{font-size:22px;line-height:1.2;margin:2px 0 6px}
.single.boxoffice table.bo td.r,.single.boxoffice table.bo td.lw{display:inline-block;margin-right:12px;font-size:14.6px;color:var(--ink-40)}
.single.boxoffice table.bo td.n{display:inline-block;margin-right:16px;font-size:16.5px;text-align:left}
}
.single.boxoffice table.bo td.pos{color:#4CD26B}.single.boxoffice table.bo td.neg{color:var(--accent-text,var(--accent))}
.single.boxoffice .bo-up{color:#4CD26B}.single.boxoffice .bo-down{color:var(--accent-text,var(--accent))}.single.boxoffice .bo-same{color:var(--ink-40)}.single.boxoffice .bo-new{color:#F2C14E;font-size:11px;font-weight:600;letter-spacing:.06em}
.single.boxoffice .bo-src{display:inline-block;margin-top:8px;font-size:16.5px;color:var(--ink-40)}
@media(max-width:960px){.single.boxoffice table.bo{font-size:14.6px}.single.boxoffice table.bo td.t{font-size:16.5px}.single.boxoffice table.bo th:nth-child(7),.single.boxoffice table.bo td:nth-child(7),.single.boxoffice table.bo th:nth-child(2),.single.boxoffice table.bo td:nth-child(2),.single.boxoffice table.bo th:nth-child(6),.single.boxoffice table.bo td:nth-child(6){display:none}.single.boxoffice table.bo td{padding:9px 4px}}

/* festival line above the board links (marquee) */
.layout-marquee .board .festline{display:grid;grid-template-columns:1.2fr 1fr auto;gap:0;border-bottom:1px solid rgba(255,255,255,.14)}
.layout-marquee .board .festline .fl-col{padding:22px 24px 20px;border-left:1px solid rgba(255,255,255,.14)}
.layout-marquee .board .festline .fl-col:first-child{border-left:0}
.layout-marquee .board .festline .fl-h{font-family:var(--sans);font-size:14.6px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:10px}
.layout-marquee .board .festline .on .fl-h{color:#4CD26B}
.layout-marquee .board .festline .fl-item{display:block;margin:0 0 8px;color:#fff}
.layout-marquee .board .festline .fl-item b{display:block;font-family:var(--serif);font-weight:400;font-size:24px;line-height:1.1}
.layout-marquee .board .festline .fl-item span{font-size:16.5px;color:rgba(255,255,255,.55)}
.layout-marquee .board .festline .fl-item:hover b{color:var(--accent-text,var(--accent))}
.layout-marquee .board .festline .fl-none{font-family:var(--serif);font-size:22px;color:rgba(255,255,255,.55)}
.layout-marquee .board .festline .fl-all{align-self:end;padding:22px 24px;font-family:var(--serif);font-size:22px;color:#fff;border-left:1px solid rgba(255,255,255,.14);white-space:nowrap}
.layout-marquee .board .festline .fl-all:hover{color:var(--accent-text,var(--accent))}
@media(max-width:960px){.layout-marquee .board .festline{grid-template-columns:1fr}.layout-marquee .board .festline .fl-col,.layout-marquee .board .festline .fl-all{border-left:0;padding:18px 16px}.layout-marquee .board .festline .fl-item b{font-size:21px}}

/* marquee: inner pages carry the same voice */
.layout-marquee .dep{padding-top:104px}
.layout-marquee .dep .dhead{padding:0 24px 20px}
.layout-marquee .dep :is(h1,.h1){font-family:var(--serif);font-size:44px}
.layout-marquee .dep :is(h1,.h1) .grey{font-family:var(--sans);font-size:19.5px;color:rgba(255,255,255,.5)}
.layout-marquee .dep .clock{font-family:var(--serif)}
.layout-marquee .dep table{font-size:19.5px}
.layout-marquee .dep th{font-size:14.6px}
.layout-marquee .dep td.dest{font-family:var(--serif);font-size:28px;line-height:1.1}
.layout-marquee .dep td.dest small{font-family:var(--sans)}
.layout-marquee .dep .t{font-family:var(--sans);font-size:19.5px;padding-top:18px}
.layout-marquee .dep td:not(.dest){font-size:19.5px;padding-top:18px;color:rgba(255,255,255,.75)}
.layout-marquee .dep .st{font-family:var(--sans);letter-spacing:.06em;font-size:16.5px}
.layout-marquee .dep td:first-child,.layout-marquee .dep th:first-child{padding-left:24px}
.layout-marquee .dep .note{padding:24px}
.layout-marquee .single :is(h1,.h1).story{font-family:var(--serif);font-weight:400;font-size:52px;letter-spacing:-.005em}
.layout-marquee .single h2,.layout-marquee .single .sec h2.t,.layout-marquee .legal-text h2,.layout-marquee .note-body h2,.layout-marquee .subhead{font-family:var(--serif);font-weight:400}
.layout-marquee .single .summary{font-family:var(--serif);font-size:28px;line-height:1.25;color:var(--ink)}
.layout-marquee .legal-text h2{font-size:30px}
.layout-marquee .archive .wk .n{font-family:var(--serif);font-size:28px;font-weight:400}
.layout-marquee .archive .wk .d{font-family:var(--serif);font-size:19.5px;color:var(--ink-40)}
.layout-marquee .crumb a{font-family:var(--sans)}
.layout-marquee .note-body p,.layout-marquee .single .body p{font-family:var(--sans)}
.layout-marquee .single .meta,.layout-marquee .single .byline{font-family:var(--sans)}
@media(max-width:960px){.layout-marquee .dep :is(h1,.h1){font-size:32px}.layout-marquee .dep td.dest{font-size:19.5px}.layout-marquee .single :is(h1,.h1).story{font-size:36px}.layout-marquee .single .summary{font-size:22px}}

.marquee .side #japan .head.head-row{flex-wrap:wrap}
.marquee .side #japan .head.head-row > div{flex:1 1 100%}
.marquee .side #japan .head.head-row > button{margin-top:6px}
/* marquee v3: art-director pass (measured at 1400 / 390) */
.layout-marquee{--accent-text:#FF4A5E;--label:15px}
:root[data-theme="light"] .layout-marquee{--accent-text:#B8102E}   /* 2026-09-17: the pink read 2.7:1 on the light ground */
:root[data-theme="light"] .boxoffice .bo-up,:root[data-theme="light"] .boxoffice .bo-gross small.pos,:root[data-theme="light"] .single.boxoffice table.bo td.pos,:root[data-theme="light"] .single.boxoffice .bo-up{color:#1E7B3C}
:root[data-theme="light"] .boxoffice .bo-new{color:#8A5A00}
.marquee #posts .post:not(:has(img)),.marquee #posts .post:has(img[data-failed]){color:var(--ink)}
.marquee #posts .post:not(:has(img)) .meta,.marquee #posts .post:has(img[data-failed]) .meta{color:var(--ink-40)}   /* a card whose picture failed (HanCinema 403) reads in ink, not white on grey */
.layout-marquee .bar .tick b{color:var(--accent-text)}
.layout-marquee .topnav{font-size:17px;color:rgba(255,255,255,.75)}
.layout-marquee .bar .logo .jp{font-size:18px}
.layout-marquee .pill{font-size:14.6px;padding:6px 12px}
.marquee #lead .strip .thumb h2{font-family:var(--serif);font-weight:400;font-size:22px;line-height:1.12}
.marquee #lead .strip .thumb h2 .grey{font-family:var(--sans);font-size:16.5px}
.marquee #lead .note{font-family:var(--serif);font-weight:400;font-size:28px;line-height:1.2}
.marquee #lead .head .sub{color:rgba(var(--ink-rgb),.72)}
.marquee #lead .lead-thumbs .thumb.failed + .thumb.failed,.marquee #lead .lead-thumbs:empty{display:block}
.marquee #lead .lead-thumbs{background:radial-gradient(60% 60% at 30% 40%,var(--ph),var(--bg))}
.marquee #posts .post h2{font-family:var(--serif);font-weight:400;font-size:24px;line-height:1.1}
.marquee #posts .post h2 .pill{font-family:var(--sans);font-size:14.6px}
.marquee #posts .post .meta{font-size:var(--label);letter-spacing:.04em}
.marquee .side .head :is(h1,.h1){font-size:43px}
.marquee .subhead{font-size:30px}
.marquee .subhead .grey{font-size:19.5px}
.boxoffice .bo-gross small{font-size:15px}
.boxoffice .bo-gross small.neg,.boxoffice .bo-down,.single.boxoffice table.bo td.neg,.single.boxoffice .bo-down{color:var(--accent-text)}
.boxoffice li i{font-size:14.6px}.boxoffice .bo-new{font-size:14.6px;letter-spacing:.08em}
.boxoffice .bo-note{font-size:16px}
.single.boxoffice table.bo th{font-size:15px}
.single.boxoffice table.bo td.n{font-size:17.5px}
.single.boxoffice .bo-new{font-size:14.6px;letter-spacing:.08em}
.layout-marquee .board .track span.dim{color:rgba(255,255,255,.6);font-size:16.5px}
.layout-marquee .board .festline .fl-h{font-size:var(--label);color:rgba(255,255,255,.7)}
.layout-marquee .board .festline .on .fl-h{color:rgba(255,255,255,.85)}
.layout-marquee .board .festline .on .fl-h::before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--accent);margin-right:9px;vertical-align:1px}
.layout-marquee .board .links > div > b,.layout-marquee .board #board-when,.marquee .colophon #sources .head :is(h1,.h1),.marquee .colophon #about footer,.layout-marquee .menu .small{font-size:var(--label)}
.marquee .colophon #about .about-text p{font-size:19.5px;line-height:1.5;color:rgba(var(--ink-rgb),.72)}
.marquee .colophon #sources{border-top:0}
.marquee .colophon .list.sources{gap:4px 0;line-height:1.5}
.marquee .colophon .list.sources a{border:0;padding:0;font-family:var(--serif);font-size:21px;color:var(--ink)}
.marquee .colophon .list.sources a + a::before{content:"·";color:rgba(var(--ink-rgb),.4);margin:0 10px}
.marquee .colophon .list.sources a .grey{font-family:var(--sans);font-size:14.6px;color:rgba(var(--ink-rgb),.55)}
.sound .mood-card .one-head .mood{font-size:15px;padding:6px 12px}
.sound .mood-card .one-head p{color:rgba(var(--ink-rgb),.72)}
.layout-marquee .single,.layout-marquee .single.left{max-width:1100px}
.layout-marquee .single.boxoffice,.layout-marquee .single.legal{margin-left:0}
.layout-marquee .single.boxoffice .bo-board{max-width:1100px}
.layout-marquee .single :is(h1,.h1).story{font-size:64px}
.layout-marquee .single .hero img,.layout-marquee .single > img,.layout-marquee .single .pic img{width:100%}
@media(min-width:701px){.layout-marquee .single .thumbs{grid-template-columns:repeat(3,minmax(0,1fr))}}   /* it came after the phone rule and beat it: three 108px columns on a phone */
.layout-marquee .single .thumbs .thumb h2{font-size:24px}
.layout-marquee .legal-art .ph{display:none}
.layout-marquee .dep td{border-bottom:0}
.layout-marquee .dep tbody tr:nth-child(even){background:rgba(var(--ink-rgb),.035)}
.layout-marquee .dep thead th{border-bottom:1px solid rgba(var(--ink-rgb),.25)}
html[lang=ja] .layout-marquee .head :is(h1,.h1),html[lang=ja] .marquee #lead .head :is(h1,.h1){letter-spacing:.02em;line-height:1.15}
@media(max-width:600px){
  .marquee #posts{grid-template-columns:1fr;gap:14px}
  .marquee #posts .post h2{font-size:24px;padding:12px 0 0}
  .poster-cards .marquee #posts .post .pic{aspect-ratio:4/5}
  .poster-cards .marquee #posts .post h2{padding:80px 14px 16px}
  .marquee .thumbs,.marquee #lead .strip{grid-template-columns:1fr}
  .marquee #lead .lead-thumbs .thumb h2{display:none}
  .marquee #lead .lead-thumbs:after{background:linear-gradient(180deg,rgba(0,0,0,.15) 0%,rgba(0,0,0,.2) 30%,rgba(11,11,12,.92) 80%)}
  .boxoffice li{grid-template-columns:24px 28px minmax(0,1fr) auto}
  .boxoffice .bo-title{white-space:normal;line-height:1.15}
  .layout-marquee .board .links{grid-template-columns:1fr}
  .layout-marquee .board .links > div{border-left:0;padding:28px 16px}
  .layout-marquee .single :is(h1,.h1).story{font-size:38px}
}

/* phone bar: never wider than the screen (JA "メニュー" + "発見" overflowed at 375px) */
@media(max-width:600px){
  .bar{gap:12px;padding:0 12px}
  .bar .logo{font-size:20px;gap:6px;min-width:0;overflow:hidden;white-space:nowrap}
  .bar .logo .jp{font-size:14.6px}
  .bar .lang{font-size:15px;gap:4px}
  .bar .menu-btn{font-size:15px;gap:6px}
}
@media(max-width:480px){
  .bar .theme{width:26px;height:26px}   /* the light / dark switch stays on phones (owner, 2026-09-17) */
}
@media(max-width:380px){
  .bar .logo .jp{display:none}
}
@media(max-width:340px){
  .bar .menu-btn span{display:none}
}

/* marquee v4: cinema-screen hero — the still is shown whole (letterboxed), a blurred copy fills the edges; no hanko */
.marquee #lead .hanko,.marquee #lead .hanko-wrap > a.hanko{display:none !important}
.marquee #lead{min-height:0;padding:0 16px 28px}
.marquee #lead .lead-thumbs{position:relative;inset:auto;margin:0 -16px 26px;height:min(62vh,640px);display:block;z-index:0;overflow:hidden;background:var(--bg)}
.marquee #lead .lead-thumbs:after{background:linear-gradient(180deg,rgba(11,11,12,0) 60%,rgba(11,11,12,.9) 100%)}
.marquee #lead .lead-thumbs .thumb{height:100%;display:block}
.marquee #lead .lead-thumbs .thumb .pic{position:relative;height:100%;aspect-ratio:auto;overflow:hidden}
.marquee #lead .lead-thumbs .thumb .pic::before{content:"";position:absolute;inset:-48px;background:var(--bg) center/cover no-repeat;filter:blur(30px) brightness(.45) saturate(.9)}
.marquee #lead .lead-thumbs .thumb .pic img{position:relative;width:100%;height:100%;object-fit:contain;object-position:center;filter:none;transform:none;transition:none;display:block}
.marquee #lead:hover .lead-thumbs .thumb .pic img{transform:none}
.marquee #lead .lead-thumbs .thumb h2{position:absolute;right:16px;bottom:16px;top:auto;margin:0;max-width:44ch;font-family:var(--serif);font-size:19.5px;line-height:1.15;color:#fff;text-align:right;text-shadow:0 1px 8px rgba(0,0,0,.7);letter-spacing:0}
.marquee #lead .lead-thumbs .thumb h2 .grey{font-family:var(--sans);font-size:14.6px;color:rgba(255,255,255,.65)}
.marquee #lead .lead-thumbs .thumb.failed{display:none}
.marquee #lead .lead-thumbs .thumb.failed + .thumb{display:block}
.marquee #lead .head{margin-bottom:12px;max-width:1100px;padding-top:28px}
.marquee #lead .head :is(h1,.h1){font-size:80px}
.marquee #lead .note{margin-bottom:22px}
.marquee #lead .head,.marquee #lead .note,.marquee #lead .more,.marquee #lead .lead-note{color:var(--ink);position:static}
.marquee #lead .head .sub,.marquee #lead .note .grey,.marquee #lead .more{color:var(--ink-40)}
.marquee #lead .more:hover{color:var(--ink)}
.marquee #lead .strip{margin-top:24px;padding-top:20px;border-top:1px solid var(--rule-soft)}
.marquee #lead .strip .thumb h2{color:var(--ink)}.marquee #lead .strip .thumb h2 .grey{color:var(--ink-40)}
@media(max-width:960px){
  .marquee #lead{padding:0 16px 24px}
  .marquee #lead .lead-thumbs{height:min(46vh,380px);margin-bottom:18px}
  .marquee #lead .lead-thumbs .thumb h2{display:none}
  .marquee #lead .head :is(h1,.h1){font-size:44px}
}


/* box office v2: ten rows per board, boards as columns without boxes; the full page is a centred 1400px column with the tables in pairs */
.boxoffice .bo-grid{gap:0 32px}
.boxoffice .bo-card{border:0;border-top:2px solid var(--accent);padding:14px 0 0;background:none}
.boxoffice .bo-head{display:block;min-height:64px}
.boxoffice .bo-head .grey{display:block;margin-top:4px;font-size:15px;letter-spacing:.06em;text-transform:uppercase;white-space:normal}
.boxoffice li{grid-template-columns:36px 30px minmax(0,1fr) auto;gap:10px;padding:9px 0;min-height:44px}
.boxoffice .bo-rank{text-align:right;font-variant-numeric:tabular-nums}
.boxoffice .bo-gross{min-width:72px}
.boxoffice .bo-gross small{font-size:15px}
.boxoffice ol:empty::after{content:attr(data-empty);display:block;padding:12px 0;font-size:17.5px;color:var(--ink-40)}
.boxoffice{padding-bottom:48px}
@media(max-width:1499px){.boxoffice .bo-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 32px}}
@media(max-width:1099px){.boxoffice .bo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.boxoffice .bo-grid{grid-template-columns:1fr;gap:40px 0}.boxoffice .bo-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:normal}}
.layout-marquee .single.boxoffice{max-width:none;margin:0;padding:80px 32px 64px}
.single.boxoffice .bo-head-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:16px 48px;align-items:end;margin:12px 0 0}
.single.boxoffice .bo-head-row :is(h1,.h1).story{margin:0}
.layout-marquee .single.boxoffice .bo-head-row .summary{margin:0 0 6px;max-width:52ch}
.layout-marquee .single.boxoffice .bo-board{max-width:none}
.layout-marquee .single.boxoffice .summary{max-width:60ch}
.single.boxoffice .bo-nav{position:sticky;top:56px;z-index:30;background:var(--bg);border-bottom:1px solid var(--rule);display:flex;gap:28px;padding:14px 0;margin:20px 0 0;font-size:17px;letter-spacing:.02em;overflow-x:auto;white-space:nowrap}
.single.boxoffice .bo-nav a{color:var(--ink-40)}.single.boxoffice .bo-nav a:hover,.single.boxoffice .bo-nav a.on{color:var(--ink);text-decoration:underline;text-underline-offset:6px;text-decoration-color:var(--accent-text,var(--accent))}
.menu .bo-nav{position:static;display:block;background:none;border:0;padding:0;margin:0;white-space:normal;overflow:visible}
.menu .bo-nav a{display:block}
.menu .bo-nav a.on{color:var(--accent-text,var(--accent))}
.single.boxoffice .bo-region{margin-top:48px}.single.boxoffice .bo-nav + .bo-region{margin-top:28px}
.single.boxoffice .bo-region-h{display:flex;align-items:baseline;justify-content:space-between;font-family:var(--serif);font-weight:400;font-size:43px;line-height:1;margin:0 0 8px;padding-bottom:12px;border-bottom:2px solid var(--accent)}
.single.boxoffice .bo-region-h .grey{font-family:var(--sans);font-size:var(--label);letter-spacing:.08em;text-transform:uppercase}
.single.boxoffice .bo-boards{display:grid;grid-template-columns:repeat(auto-fill,minmax(480px,1fr));gap:40px 48px}
.single.boxoffice .bo-board.featured{grid-column:1/-1}
.single.boxoffice .bo-board{margin-top:24px}
.single.boxoffice .bo-board h2{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.single.boxoffice .bo-board h2 .grey{white-space:nowrap}
.single.boxoffice .bo-board.stale table.bo{opacity:.72}
.single.boxoffice .bo-board.stale h2 .grey::before{content:"● ";color:var(--ink-40)}
.single.boxoffice table.bo td.r{font-family:var(--serif);font-size:25.36px;width:44px;line-height:1}
.single.boxoffice table.bo td.lw{white-space:nowrap;width:64px;font-size:16.5px;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.single.boxoffice .bo-up,.single.boxoffice .bo-down{font-weight:600}
.single.boxoffice .bo-board{min-width:0}
.single.boxoffice table.bo{table-layout:fixed}
.single.boxoffice table.bo th:nth-child(n+4){text-align:right}
.single.boxoffice table.bo th:nth-child(1){width:44px}.single.boxoffice table.bo th:nth-child(2){width:56px}.single.boxoffice table.bo th:nth-child(4){width:92px}.single.boxoffice table.bo th:nth-child(5){width:76px}.single.boxoffice table.bo th:nth-child(6){width:92px}.single.boxoffice table.bo th:nth-child(7){width:48px}
.single.boxoffice table.bo td.t{overflow-wrap:anywhere}
.single.boxoffice table.bo td.empty{color:var(--ink-40);padding:18px 8px}
.single.boxoffice .bo-board:not(.featured) table.bo th:nth-child(6),.single.boxoffice .bo-board:not(.featured) table.bo td:nth-child(6){display:none}
.single.boxoffice .bo-foot{margin-top:56px;font-size:16.5px;color:var(--ink-40);max-width:70ch}
.single.boxoffice .bo-board.featured{grid-column:span 2}
@media(min-width:1920px){.layout-marquee .single.boxoffice{padding:96px 48px 80px}.single.boxoffice .bo-boards{gap:48px 64px}}
@media(max-width:1099px){.single.boxoffice .bo-head-row{grid-template-columns:1fr;gap:12px}.single.boxoffice .bo-boards{grid-template-columns:1fr}.single.boxoffice .bo-board.featured{grid-column:auto}.layout-marquee .single.boxoffice{padding:96px 16px 64px}}
@media(max-width:960px){.single.boxoffice table.bo{font-size:17.5px}.single.boxoffice table.bo td.t{font-size:24px}.single.boxoffice .bo-region-h{font-size:32px}.single.boxoffice .bo-nav{top:48px;gap:20px}.single.boxoffice table.bo th:nth-child(1){color:transparent;width:36px}}


/* marquee v6: masthead colophon (statement left, running text right), balanced two-column block, wide-screen gutters and rhythm */
.marquee .colophon{padding:72px 32px 56px}
.marquee .colophon #about .about-text{columns:auto;column-gap:0;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:48px;align-items:start}
.marquee .colophon #about .about-text h2{column-span:none;grid-column:1;grid-row:1/span 12;font-size:48px;line-height:1.04;letter-spacing:-.01em;max-width:18ch;margin:0}
.marquee .colophon #about .about-text p{grid-column:2;max-width:62ch;margin:0 0 1em;line-height:1.55;break-inside:auto}
.marquee .colophon #about .about-text p:last-of-type{margin-bottom:0;color:var(--ink)}
.marquee .colophon #about footer{margin:40px 0 0 !important;padding-top:14px;border-top:2px solid var(--accent);display:inline-block;font-size:15px;letter-spacing:.08em;text-transform:uppercase;line-height:1.6}
.marquee .colophon #sources{margin-top:56px;padding-top:28px;border-top:1px solid var(--rule-soft)}
.layout-marquee{--ink-25:rgba(var(--ink-rgb),.62)}
.marquee .two{align-items:start}
.marquee .two > main,.marquee .two > aside{position:sticky;top:calc(56px + min(0px,100vh - 56px - var(--col-h,0px)))}
.marquee .two .thumb h2,.marquee .pair .two .thumb h2{font-family:var(--serif);font-weight:400;font-size:24px;line-height:1.15}
.marquee .events .ev h2,.marquee .list.wire a{font-family:var(--serif);font-weight:400;font-size:28px;line-height:1.15}
.marquee #japan .head .sub{max-width:44ch}
@media(min-width:1440px){
  .marquee > section,.marquee .two > * > section{padding:56px 32px}
  .marquee #lead{padding-left:32px;padding-right:32px}
  .marquee .two > main #thumbs{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 20px}
}
@media(min-width:1920px){
  .marquee > section,.marquee .two > * > section{padding:72px 48px}
  .marquee #lead{padding-left:48px;padding-right:48px}
  .marquee .colophon{padding:96px 48px 72px}
}
@media(min-width:1800px){.marquee #posts{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:960px){
  .marquee .two > main,.marquee .two > aside{position:static}
  .marquee .colophon{padding:48px 16px 40px}
  .marquee .colophon #about .about-text{display:block}
  .marquee .colophon #about .about-text h2{font-size:30px;max-width:none;margin-bottom:20px}
  .marquee .colophon #about .about-text p{max-width:none}
}

/* marquee v7: editor's note as a feature page — masthead column left, wide serif text right; fluid like every other page */
.layout-marquee .single.note{max-width:none;margin:0;padding:80px 32px 64px}
.layout-marquee .single.note .note-page{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:24px 48px;align-items:start;margin-top:8px}
.layout-marquee .single.note .note-side{position:sticky;top:80px;display:grid;gap:14px;justify-items:start;padding-top:18px;border-top:2px solid var(--accent)}
.layout-marquee .single.note .note-author{font-family:var(--serif);font-size:32px;line-height:1.1}
.layout-marquee .single.note .note-date{font-size:16.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-40)}
.layout-marquee .single.note .note-more{margin-top:24px;font-size:17.5px;color:var(--ink-40)}.layout-marquee .single.note .note-more:hover{color:var(--ink)}
.layout-marquee .single.note .note-main :is(h1,.h1).story{font-size:80px;line-height:.98;letter-spacing:-.01em;max-width:20ch;margin:0 0 36px}
.layout-marquee .single.note .hero{margin:0 0 36px}
.layout-marquee .single.note .note-body p{font-family:var(--serif);font-size:24px;line-height:1.5;max-width:62ch;margin:0 0 26px;color:var(--ink)}
.layout-marquee .single.note .note-body p.lead{font-size:30px;line-height:1.35;max-width:52ch;margin-bottom:34px}
html[lang=ja] .layout-marquee .single.note .note-body p{font-size:22px;line-height:1.9;max-width:44em}
html[lang=ja] .layout-marquee .single.note .note-body p.lead{font-size:26px;line-height:1.7}
html[lang=ja] .layout-marquee .single.note .note-main :is(h1,.h1).story{line-height:1.15;letter-spacing:.02em}
@media(min-width:1920px){.layout-marquee .single.note{padding:96px 48px 80px}.layout-marquee .single.note .note-page{gap:24px 64px}}
@media(max-width:960px){
  .layout-marquee .single.note{padding:72px 16px 56px}
  .layout-marquee .single.note .note-page{grid-template-columns:1fr;gap:20px}
  .layout-marquee .single.note .note-side{position:static;border-top:0;padding-top:0;gap:8px}
  .layout-marquee .single.note .note-author{font-size:24px}
  .layout-marquee .single.note .note-main :is(h1,.h1).story{font-size:40px;max-width:none;margin-bottom:24px}
  .layout-marquee .single.note .note-body p{font-size:22px}
  .layout-marquee .single.note .note-body p.lead{font-size:25.36px}
}

/* box office v3 (home): a leaders' bill — the #1 film big, places 2–5 compact, the full chart one click away */
.boxoffice .bo-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:0 32px}
.boxoffice .bo-head{min-height:0;margin-bottom:14px}
.boxoffice .bo-top{display:grid;gap:6px;padding:0 0 14px;border-bottom:1px solid var(--rule-soft);color:var(--ink)}
.boxoffice .bo-top-rank{font-size:14.6px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-text,var(--accent));font-weight:600}
.boxoffice .bo-top-title{font-family:var(--serif);font-size:28px;line-height:1.1;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.boxoffice .bo-top:hover .bo-top-title{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.boxoffice .bo-top-gross{margin-top:2px;font-size:19.5px;font-variant-numeric:tabular-nums;white-space:nowrap}
.boxoffice .bo-top-gross small{font-size:15px;margin-left:4px}.boxoffice .bo-top-gross small.pos{color:#4CD26B}.boxoffice .bo-top-gross small.neg{color:var(--accent-text,var(--accent))}
.boxoffice .bo-top-gross i{font-style:normal;font-size:14.6px;margin-left:6px;letter-spacing:.02em}
.boxoffice .bo-rest li{grid-template-columns:22px minmax(0,1fr) auto auto;gap:8px;padding:7px 0;min-height:0;font-size:17.5px;border-top:1px solid var(--rule-soft)}
.boxoffice .bo-rest li:first-child{border-top:0}
.boxoffice .bo-rest .bo-rank{font-size:19.5px;text-align:right}
.boxoffice .bo-rest .bo-gross{font-weight:400}
.boxoffice .bo-empty{margin:0 0 14px;font-size:17.5px;color:var(--ink-40)}
.boxoffice .bo-more{display:inline-block;margin-top:14px;font-size:16.5px;color:var(--ink-40)}.boxoffice .bo-more:hover{color:var(--ink)}
@media(max-width:1299px){.boxoffice .bo-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 32px}}
@media(max-width:899px){.boxoffice .bo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.boxoffice .bo-grid{grid-template-columns:1fr;gap:32px 0}.boxoffice .bo-rest .bo-title{white-space:nowrap;-webkit-line-clamp:unset;display:block}}

/* marquee v8: the colophon as a colophon — statement left, the text in two balanced columns right; half the height */
.marquee .colophon{padding:56px 32px 48px}
.marquee .colophon #about .about-text{grid-template-columns:minmax(0,4fr) minmax(0,8fr);column-gap:48px}
.marquee .colophon #about .about-text h2{grid-row:auto;max-width:22ch}
.marquee .colophon #about .about-text .about-cols{grid-column:2;columns:2;column-gap:48px;column-fill:balance}
.marquee .colophon #about .about-text .about-cols p{max-width:none;break-inside:auto;margin:0 0 1em}
.marquee .colophon #about .about-text .about-cols p:last-of-type{margin-bottom:0}
.marquee .colophon #about footer{margin-top:28px !important}
.marquee .colophon #sources{margin-top:40px;padding-top:24px}
@media(max-width:960px){.marquee .colophon #about .about-text .about-cols{columns:1}.marquee .colophon{padding:48px 16px 40px}}

/* marquee v9: colophon, smallest — statement across the top, two lead paragraphs in two columns, the rest behind "Read on" */
.marquee .colophon{padding:48px 32px 40px}
.marquee .colophon #about .about-text{display:block}
.marquee .colophon #about .about-text h2{max-width:62ch;font-size:40px;margin:0 0 20px}
.marquee .colophon #about .about-text .about-cols{columns:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 48px}
.marquee .colophon #about .about-text .about-cols[hidden]{display:none}
.marquee .colophon #about .about-text .about-cols p{grid-column:auto;margin:0 0 1em;max-width:62ch}
.marquee .colophon #about .about-text .about-lead{display:block;columns:2;column-gap:48px;column-fill:balance}
.marquee .colophon #about .about-text .about-lead p{margin-bottom:0;max-width:none;break-inside:auto}
.marquee .colophon #about .about-text .about-more{margin-top:1em}
.marquee .colophon #about .about-text .about-toggle{margin-top:14px;padding:0;border:0;background:none;font:inherit;font-size:16.5px;color:var(--ink-40);cursor:pointer}
.marquee .colophon #about .about-text .about-toggle:hover{color:var(--ink)}
.marquee .colophon #about footer{margin-top:22px !important}
.marquee .colophon #sources{margin-top:32px;padding-top:20px}
@media(max-width:960px){.marquee .colophon #about .about-text .about-cols{grid-template-columns:1fr}.marquee .colophon #about .about-text .about-lead{columns:1}.marquee .colophon #about .about-text h2{font-size:30px}}

/* marquee v5: double feature — two big stills side by side, the headline set over each; only wide stills are allowed up here (checked at load, weak ones drop to the strip) */
.marquee #lead .lead-thumbs{position:relative;inset:auto;margin:0 0 26px;height:auto;display:grid;grid-template-columns:1fr 1fr;gap:16px;overflow:visible;background:none}
.marquee #lead .lead-thumbs:after{display:none}
.marquee #lead .lead-thumbs .thumb{position:relative;display:block;height:min(58vh,560px);overflow:hidden;background:var(--ph);border-radius:3px}
.marquee #lead .lead-thumbs .thumb:nth-child(2){display:block}
.marquee #lead .lead-thumbs .thumb .pic{position:absolute;inset:0;height:100%;aspect-ratio:auto;overflow:hidden;background:var(--ph)}
.marquee #lead .lead-thumbs .thumb .pic::before{display:none}
.marquee #lead .lead-thumbs .thumb .pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%;filter:brightness(.84) saturate(.95);transform:scale(1.02);transition:transform 9s linear;display:block}
.marquee #lead .lead-thumbs .thumb:hover .pic img{transform:scale(1.07)}
.marquee #lead .lead-thumbs .thumb .pic:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,11,12,0) 38%,rgba(11,11,12,.5) 68%,rgba(11,11,12,.94) 100%)}
.marquee #lead .lead-thumbs .thumb h2{position:absolute;left:26px;right:26px;bottom:24px;top:auto;margin:0;max-width:none;font-family:var(--serif);font-weight:400;font-size:38px;line-height:1.06;letter-spacing:-.005em;color:#fff;text-align:left;text-shadow:0 1px 12px rgba(0,0,0,.55)}
.marquee #lead .lead-thumbs .thumb h2 .grey{display:block;margin-top:12px;font-family:var(--sans);font-size:14.6px;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.72)}
.marquee #lead .lead-thumbs .thumb h2 .pill{display:table;margin:0 0 12px;vertical-align:baseline;color:#fff;border-color:rgba(255,255,255,.7);background:rgba(0,0,0,.35)}
.marquee .thumb h2 .pill,.marquee .pair .two .thumb h2 .pill{display:table;margin:0 0 8px}
.thumb h2 .pill{margin-right:8px}
.marquee #lead .lead-thumbs .thumb:hover h2{text-decoration:none}
.marquee #lead .lead-thumbs .thumb.failed{display:block}
.marquee #lead .lead-thumbs .thumb.failed .pic img{visibility:hidden}
.marquee #lead .lead-thumbs .thumb.failed .pic{background:radial-gradient(70% 70% at 30% 30%,var(--ph),var(--bg))}
.marquee #lead .lead-thumbs .thumb.weak .pic img{opacity:0}
.marquee #lead .strip{margin-top:0;padding-top:0;border-top:0}
@media(max-width:960px){
  .marquee #lead .lead-thumbs{grid-template-columns:1fr;gap:12px;height:auto;margin-bottom:18px}
  .marquee #lead .lead-thumbs .thumb{height:min(54vh,440px)}
  .marquee #lead .lead-thumbs .thumb h2{display:block;left:18px;right:18px;bottom:18px;font-size:30px}
}
@media(max-width:600px){
  .marquee #lead .lead-thumbs .thumb{height:min(58vh,380px)}
  .marquee #lead .lead-thumbs .thumb h2{display:block;font-size:28px}
  .marquee #lead .lead-thumbs .thumb h2 .grey{margin-top:8px}
}

.head h1,.colhead > div span.l,.menu .ch,.tabs button span,.about-text h2,.post h2,.thumb h2,h1.story,.lead h2,.lead .note,.ev h2,.logo,.single h1,.dhead h1,.wire a,.subhead{font-family:var(--serif);font-weight:500;letter-spacing:-.01em;font-variation-settings:"opsz" 72}
.pill,.head .sub,.meta,.subhead .grey,.tabs,.bar,.menu,button{font-family:var(--sans)}
.logo .jp{font-family:var(--serif)}
/* Uchi «house» theme (appended to Uchi's site.css only, through site.theme_css; approved design 2026-10-02).
   Fonts are the locked pair (Fraunces + Shippori Mincho for type, the existing --sans stack for UI). Colours reuse
   the site's own variables, so the night theme keeps working. */
.layout-house{--u-hinoki:#E4CC9F;--u-clay:var(--accent,#C9623A);--u-ease:cubic-bezier(.2,.7,.1,1);--u-rule:color-mix(in srgb,var(--ink) 18%,transparent)}

/* ---------------------------------------------------------------- masthead */
.layout-house .bar{display:block;position:relative;padding:0;background:var(--bg);color:var(--ink);border:0;height:auto}
.layout-house .bar>.tick{display:none}
.layout-house .u-mast{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px;padding:22px clamp(16px,4vw,56px) 18px}
.layout-house .u-mast .logo{font-family:var(--serif);font-size:clamp(34px,4vw,52px);font-weight:600;letter-spacing:-.02em;line-height:1;color:var(--ink);text-decoration:none;font-variation-settings:"opsz" 144}
.layout-house .u-mast .logo .jp{font-family:"Shippori Mincho",serif;color:var(--u-clay);font-size:.86em;margin-left:.12em}
.layout-house .u-rec{display:inline-flex;align-items:center;gap:12px;color:var(--ink);text-decoration:none;justify-self:start}
.layout-house .u-disc{width:34px;height:34px;border-radius:50%;background:#1B1A18;border:5px solid #3A3834;display:grid;place-items:center;flex:none}
.layout-house .u-disc i{width:13px;height:13px;border-radius:50%;background:var(--u-clay);box-shadow:inset 0 0 0 4.5px var(--u-clay),inset 0 0 0 5.5px #F6F5F1}
.layout-house .u-rec:hover .u-disc,.layout-house.u-playing .u-disc{animation:u-spin 2.4s linear infinite}
@keyframes u-spin{to{transform:rotate(360deg)}}
.layout-house .u-rec-t{display:flex;flex-direction:column;gap:2px}
.layout-house .u-rec-t small{font:700 12px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;opacity:.6}
.layout-house .u-rec-t em{font-family:var(--serif);font-style:italic;font-size:18px}
.layout-house .u-side{display:flex;align-items:center;gap:18px;justify-self:end}
.layout-house .u-date{display:flex;flex-direction:column;align-items:flex-end;gap:3px}
.layout-house .u-date b{font:700 11.5px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase}
.layout-house .u-date small{font:500 11.5px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;opacity:.6}
.layout-house .u-tools{display:flex;align-items:center;gap:10px}
.layout-house .u-tools .lang{display:none}
/* the light / dark switch stays: a round outline button beside Menu (moon in the light theme, sun in the dark one) */
.layout-house .u-tools #night{display:inline-grid!important;place-items:center;width:36px;height:36px;padding:0;margin:0;border:1px solid var(--u-rule);border-radius:50%;background:transparent;color:var(--ink);cursor:pointer;transition:border-color .2s,color .2s}
.layout-house .u-tools #night:hover{border-color:var(--ink);color:var(--u-clay)}
.layout-house .u-tools #night svg{width:17px;height:17px}

/* ---------------------------------------------------------------- section bar */
.layout-house .u-nav{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 clamp(16px,4vw,56px);padding:16px 0 15px;border-top:1px solid var(--ink);border-bottom:2px solid var(--ink);box-shadow:0 3px 0 var(--bg),0 4px 0 var(--ink);margin-bottom:4px;background:var(--bg);position:relative;z-index:2}
.layout-house .u-nav a{display:inline-flex;align-items:flex-start;gap:7px;color:var(--ink);text-decoration:none;font-family:var(--serif);font-size:clamp(20px,1.7vw,26px);letter-spacing:-.01em;line-height:1}
.layout-house .u-nav a small{font-family:"Shippori Mincho",serif;font-size:12.5px;opacity:.55;margin-top:-2px}
.layout-house .u-nav a[aria-current],.layout-house .u-nav a:hover{color:var(--u-clay)}
.layout-house .u-nav a[aria-current]{font-style:italic}
.layout-house .u-nav a[aria-current] small{opacity:1}
.layout-house .u-letter{font:600 14.5px/1 var(--sans);background:var(--ink);color:var(--bg);border:0;border-radius:99px;padding:11px 18px;cursor:pointer;white-space:nowrap;transition:background .2s,transform .2s var(--u-ease)}
.layout-house .u-letter:hover{background:var(--u-clay);transform:translateY(-1px)}

/* ---------------------------------------------------------------- front page: covers without gaps */
.layout-house #u-front~.colhead,.layout-house #u-front~.cols #lead{display:none}
.layout-house .u-grid{display:grid;grid-template-columns:minmax(0,57fr) minmax(0,43fr);height:clamp(520px,40.3vw,640px);background:#1B1A18}
.layout-house .u-mirror{grid-template-columns:minmax(0,43fr) minmax(0,57fr)}
.layout-house .u-four{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;min-height:0}
.layout-house .u-card{position:relative;display:flex;align-items:flex-end;overflow:hidden;color:#F6F5F1;text-decoration:none;min-height:0;isolation:isolate}
.layout-house .u-card .u-img{position:absolute;inset:0;z-index:-2}
.layout-house .u-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 18%,rgba(0,0,0,.45) 42%,rgba(0,0,0,.82));transition:opacity .5s var(--u-ease)}
.layout-house .u-cap{display:flex;flex-direction:column;gap:10px;padding:clamp(16px,2vw,22px) clamp(16px,1.6vw,22px) clamp(16px,1.5vw,20px)}
.layout-house .u-cap small{font:700 11.5px/1.3 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--u-hinoki);text-shadow:0 1px 2px rgba(0,0,0,.55)}
.layout-house .u-cap .u-hed{text-shadow:0 1px 3px rgba(0,0,0,.35)}
/* the four side covers: three lines of headline at most, as drawn, so the picture stays */
.layout-house .u-four .u-hed{-webkit-line-clamp:3}
.layout-house .u-hed{font-family:var(--serif);font-weight:500;font-size:clamp(19px,1.5vw,22.5px);line-height:1.16;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .5s var(--u-ease)}
.layout-house .u-hed.cjk{font-family:"Shippori Mincho",var(--serif);line-height:1.45;font-size:clamp(17px,1.3vw,20px)}
.layout-house .u-card:hover .u-hed{background-size:100% 1px}
.layout-house .u-lead .u-cap{gap:12px;padding:clamp(22px,4vw,48px) clamp(20px,3.4vw,48px) clamp(22px,3vw,44px) clamp(20px,4vw,56px);max-width:700px}
.layout-house .u-lead .u-hed{font-size:clamp(26px,2.65vw,38px);line-height:1.08;letter-spacing:-.012em;-webkit-line-clamp:3;text-wrap:balance}
.layout-house .u-lead .u-shade{background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.5) 70%,rgba(0,0,0,.82))}
.layout-house .u-lead .u-hed.cjk{font-size:clamp(23px,2.3vw,34px);line-height:1.32;letter-spacing:0}
.layout-house .u-lead .u-cap small{font-size:12.5px}
.layout-house .u-dek{font-size:16px;line-height:1.45;opacity:.85;max-width:560px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.layout-house .u-dek.cjk{font-family:"Shippori Mincho",serif}
.layout-house .u-card.noimg{background:#2A2825}

/* ---------------------------------------------------------------- «Also today» */
.layout-house .u-also{padding:22px clamp(16px,4vw,56px) 26px;border-bottom:1px solid var(--u-rule)}
.layout-house .u-also-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.layout-house .u-also-h span{font:700 11.5px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--u-clay)}
.layout-house .u-also-h a{font:600 13.5px/1 var(--sans);color:var(--ink);text-decoration:none}
.layout-house .u-also-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:28px}
.layout-house .u-mini{display:flex;gap:12px;align-items:flex-start;color:var(--ink);text-decoration:none}
.layout-house .u-mini .u-img{position:relative;width:72px;height:72px;flex:none;overflow:hidden;background:var(--ph,#E8E1D5)}
.layout-house .u-mini small{display:block;font:700 12px/1.2 var(--sans);letter-spacing:.15em;text-transform:uppercase;color:#5E6B2E;margin-bottom:5px}
[data-theme=dark] .layout-house .u-mini small{color:#A9B072}
.layout-house .u-mini b{font-family:var(--serif);font-weight:400;font-size:17px;line-height:1.25;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.layout-house .u-mini b.cjk{font-family:"Shippori Mincho",var(--serif);font-size:15px;line-height:1.5}
.layout-house .u-mini:hover b{color:var(--u-clay)}

/* ---------------------------------------------------------------- posters */
.layout-house .u-posters{margin-top:8px}
.layout-house .u-sec-h{display:flex;justify-content:space-between;align-items:flex-end;padding:48px clamp(16px,4vw,56px) 22px}
.layout-house .u-sec-h small{display:block;font:700 12.5px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--u-clay);margin-bottom:10px}
.layout-house .u-sec-h h2{font-family:var(--serif);font-weight:400;font-size:clamp(32.5px,3.4vw,46px);letter-spacing:-.02em;margin:0;line-height:1}
.layout-house .u-sec-h a{font:600 14.5px/1 var(--sans);color:var(--ink);text-decoration:none}
.layout-house .u-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));height:clamp(420px,38vw,560px);background:#1B1A18}
.layout-house .u-poster .u-hed{font-size:clamp(21.5px,1.8vw,28px)}
.layout-house .u-mirror{margin:0}

/* ---------------------------------------------------------------- pictures: the door, the settle, the drift */
.layout-house .u-img{overflow:hidden;background:#2A2825}
.layout-house .u-img img{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;display:block;opacity:0;transition:opacity .7s var(--u-ease)}
.layout-house .u-img.loaded img{opacity:1}
.layout-house .u-card .u-img img,.layout-house .u-mini .u-img img{clip-path:inset(0 0 0 100%);transform:scale(1.08);transition:clip-path 1.1s var(--u-ease) var(--d,0ms),transform 1.6s var(--u-ease) var(--d,0ms),opacity .7s var(--u-ease)}
.layout-house .u-img.in img{clip-path:inset(0 0 0 0);transform:scale(1)}
.layout-house .u-card:hover .u-img.in img{transform:scale(1.04);transition:transform 1.2s var(--u-ease)}
.layout-house .u-card:hover .u-shade{opacity:.85}
/* the big pictures drift slower than the page */
.layout-house .u-par .u-img img{top:-7%;height:114%;translate:0 var(--py,0)}
@supports (animation-timeline: view()){
  .layout-house .u-par .u-img img{animation:u-drift linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
  @keyframes u-drift{from{translate:0 6%}to{translate:0 -6%}}
}
@media (prefers-reduced-motion: reduce){
  .layout-house .u-img img,.layout-house .u-card .u-img img{clip-path:none!important;transform:none!important;transition:opacity .2s!important;animation:none!important;translate:none!important}
  .layout-house .u-disc{animation:none!important}
}

/* a clicked cover carries its picture into the story page */
@view-transition{navigation:auto}
::view-transition-group(u-hero){animation-duration:.55s;animation-timing-function:cubic-bezier(.2,.7,.1,1)}
::view-transition-old(root),::view-transition-new(root){animation-duration:.3s}
@media (prefers-reduced-motion: reduce){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}}

/* ---------------------------------------------------------------- phones and narrow windows */
@media (max-width:1100px){
  .layout-house .u-nav a{font-size:20px;white-space:nowrap}   /* seven sections since Releases joined (2026-10-12): «On view» must not break */
  .layout-house .u-nav a small{display:none}
  .layout-house .u-also-row{grid-template-columns:repeat(3,minmax(0,1fr))}
  .layout-house .u-also-row .u-mini:nth-child(n+4){display:none}
}
@media (min-width:761px) and (max-width:900px){
  .layout-house .u-nav a{font-size:18px}
}
@media (max-width:760px){
  .layout-house .u-mast{grid-template-columns:auto 1fr auto;gap:12px;padding:12px 16px 8px}
  .layout-house .u-mast .logo{font-size:32.5px}
  .layout-house .u-logo-slot{justify-self:center}
  .layout-house .u-rec-t,.layout-house .u-date{display:none}
  .layout-house .u-nav{overflow-x:auto;scrollbar-width:none;gap:22px;margin:0;padding:9px 16px 10px;box-shadow:none;border-bottom:1px solid var(--ink)}
  .layout-house .u-nav::-webkit-scrollbar{display:none}
  .layout-house .u-nav a{font-size:19px;flex:none}
  .layout-house .u-letter{display:none}
  .layout-house .u-grid,.layout-house .u-mirror{display:block;height:auto}
  .layout-house .u-lead{height:min(118vw,520px)}
  .layout-house .u-four{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:2px;scrollbar-width:none}
  .layout-house .u-four::-webkit-scrollbar{display:none}
  .layout-house .u-four .u-card{flex:0 0 78%;height:340px;scroll-snap-align:start}
  .layout-house .u-also-row{display:flex;flex-direction:column;gap:0}
  .layout-house .u-also-row .u-mini{padding:12px 0;border-bottom:1px solid var(--u-rule)}
  .layout-house .u-also-row .u-mini:nth-child(n+4){display:flex}
  .layout-house .u-row{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;height:440px;scrollbar-width:none}
  .layout-house .u-row .u-card{flex:0 0 82%;scroll-snap-align:start}
  .layout-house .u-sec-h{padding:32px 16px 16px}
  .layout-house .u-nav{-webkit-mask-image:linear-gradient(90deg,#000 86%,transparent);mask-image:linear-gradient(90deg,#000 86%,transparent);padding-top:0;padding-bottom:0}
  .layout-house .u-nav a{padding:10px 0}
  .layout-house .u-lead .u-dek{display:none}
  .layout-house .u-letterband{grid-template-columns:minmax(0,1fr)}
  .layout-house .u-bottom nav a{padding:10px 0}
}
/* the engine's own bar styles were made for a dark bar: the moved logo and menu button follow the masthead */
.layout-house .u-mast .logo .jp{display:inline!important}
.layout-house .u-tools .menu-btn{color:var(--ink);background:transparent;border:1px solid var(--u-rule);border-radius:99px;padding:8px 14px;font:600 13.5px/1 var(--sans);min-height:0}

/* ---------------------------------------------------------------- the columns: a dense magazine page */
@media (min-width:961px){
  .layout-house .cols{padding:44px clamp(16px,4vw,56px) 56px;grid-template-columns:minmax(0,1.9fr) minmax(0,1fr) minmax(0,1fr);gap:0 36px}
  .layout-house .col{border-left:0;will-change:auto}
  .layout-house .col > section{padding:0 0 36px;border-bottom:0}
  .layout-house .col > section + section{padding-top:8px}
}
.layout-house .col .head{padding-bottom:10px;margin-bottom:16px;border-bottom:2px solid var(--ink)}
.layout-house .col .head .h1,.layout-house .u-band2 .head .h1{font-family:var(--serif);font-weight:500;font-size:clamp(26px,2.1vw,32.5px);letter-spacing:-.01em;line-height:1.05}
.layout-house .col .head .sub{font-size:14px;opacity:.65;margin-top:6px}
.layout-house .col .subhead{font-family:var(--serif);font-weight:500;font-size:22.5px;margin:28px 0 12px;padding-bottom:8px;border-bottom:1px solid var(--u-rule)}

/* the latest stories: one big, then pairs */
@media (min-width:961px){
  .layout-house #posts{display:grid;grid-template-columns:1fr 1fr;gap:28px 24px}
  .layout-house #posts > .post:first-child{grid-column:1/-1}
  .layout-house #posts > .post:first-child .pic{aspect-ratio:16/9}
  .layout-house #posts > .post:first-child h2{font-size:clamp(26px,2vw,32.5px);line-height:1.12}
}
.layout-house .post{margin-top:0;color:var(--ink)}
.layout-house .post .pic{aspect-ratio:4/3}
.layout-house .post .pic img{transition:transform 1.2s var(--u-ease)}
.layout-house .post:hover .pic img{transform:scale(1.04)}
.layout-house .post h2{font-family:var(--serif);font-weight:500;font-size:20.5px;line-height:1.22;margin-top:12px}
.layout-house .post h2[lang=ja],.layout-house .post h2:lang(ja){font-family:"Shippori Mincho",var(--serif)}
.layout-house .post h2 .pill{display:block;width:max-content;background:none;padding:0;margin:0 0 6px;font:700 11px/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:#5E6B2E;border:0}
.layout-house .post h2 .pill.jpill{display:none}
[data-theme=dark] .layout-house .post h2 .pill{color:#A9B072}
.layout-house .post h2 .grey{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin-top:8px;font-family:var(--sans);font-weight:400;font-size:15.5px;line-height:1.5;opacity:.72}
.layout-house .post .meta{font-size:13px;opacity:.6;margin-top:6px}
.layout-house .load-more{margin-top:28px;border:1px solid var(--ink);background:transparent;color:var(--ink);font:600 14.5px/1 var(--sans);padding:13px 22px;border-radius:0}

/* the second band of columns, under «Homes this week» */
.layout-house .u-band2{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 36px;padding:48px clamp(16px,4vw,56px) 40px}
.layout-house .u-band2 .u-col > section{padding:0 0 36px}
.layout-house .u-band2 .head{padding-bottom:10px;margin-bottom:16px;border-bottom:2px solid var(--ink)}
.layout-house .u-band2 .subhead{font-family:var(--serif);font-weight:500;font-size:clamp(26px,2.1vw,32.5px);margin:0 0 16px;padding-bottom:10px;border-bottom:2px solid var(--ink)}

/* ---------------------------------------------------------------- sidebar blocks in the magazine's calm voice */
.layout-house #radar.accent{background:none;color:var(--ink);padding-left:0;padding-right:0}
.layout-house #radar .head{border-color:var(--ink)}
.layout-house #trends .trend{display:grid;grid-template-columns:minmax(0,1fr) 64px 30px 34px;align-items:center;gap:8px;width:100%;padding:9px 0;border:0;border-bottom:1px solid var(--u-rule);background:none;color:var(--ink);text-align:left;cursor:pointer;font:inherit}
.layout-house #trends .trend .n{font-family:var(--serif);font-size:18.5px;line-height:1.2;white-space:normal}
.layout-house #trends .trend .spark{width:64px;height:20px}
.layout-house #trends .trend .spark polyline{stroke:currentColor;opacity:.45;fill:none;stroke-width:1.4}
.layout-house #trends .trend .spark circle{fill:var(--u-clay)}
.layout-house #trends .trend .num{font:600 14.5px/1 var(--sans);text-align:right}
.layout-house #trends .trend .delta{font:700 12.5px/1 var(--sans);text-align:right;color:#5E6B2E}
.layout-house #trends .trend .delta.down{color:var(--u-clay)}
.layout-house #trends .trend:hover .n,.layout-house #trends .trend[aria-pressed=true] .n{color:var(--u-clay)}
.layout-house .trends-more{font-size:13.5px;opacity:.75;margin-top:10px}
.layout-house .trends-more button{font:600 13.5px/1 var(--sans);background:none;border:0;color:var(--ink);text-decoration:underline;padding:0;cursor:pointer}
.layout-house #colours .bar-strip{height:34px;border-radius:2px;overflow:hidden}
.layout-house #events .ev{display:block;padding:12px 0;border-bottom:1px solid var(--u-rule);color:var(--ink);text-decoration:none}
.layout-house #events .ev .d{font:700 11.5px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;opacity:.6}
.layout-house #events .ev h2{font-family:var(--serif);font-weight:500;font-size:19px;line-height:1.25;margin:6px 0 6px;text-transform:none;letter-spacing:0}
.layout-house #events .ev .pill{font:700 11px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;padding:4px 8px;border-radius:10px}
.layout-house #events .ev .v{display:block;font-size:14px;opacity:.65;margin-top:6px}
.layout-house #events .ev:hover h2{color:var(--u-clay)}
.layout-house #japan .rg button{font:600 13.5px/1 var(--sans)}
.layout-house #sound .one{background:#1B1A18;color:#F6F5F1;padding:18px;border-radius:4px}
.layout-house #sound .one-head .mood{font:700 10.5px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--u-hinoki)}
.layout-house #sound .one-head h2{font-family:var(--serif);font-style:italic;font-weight:400;font-size:24px;margin:6px 0}
.layout-house #sound .one-head p{font-size:14.5px;line-height:1.5;opacity:.75}
.layout-house .thumbs .thumb h2{font-family:var(--serif);font-weight:500;font-size:17.5px;line-height:1.25}
.layout-house .thumbs .thumb .pic img{transition:transform 1.2s var(--u-ease)}
.layout-house .thumbs .thumb:hover .pic img{transform:scale(1.04)}
.layout-house .list.wire a,.layout-house .list.trendlist a,.layout-house .list.trendlist > *{display:block;padding:11px 0;border-bottom:1px solid var(--u-rule);font-family:"Shippori Mincho",var(--serif);font-size:17px;line-height:1.55;color:var(--ink);text-decoration:none}
.layout-house .list.wire a .pill{display:block;width:max-content;background:none;border:0;padding:0;margin-bottom:4px;font:700 11px/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:#5E6B2E}
[data-theme=dark] .layout-house .list.wire a .pill{color:#A9B072}
.layout-house .list.wire a:hover{color:var(--u-clay)}

/* ---------------------------------------------------------------- footer */
.layout-house .board{background:#1B1A18;color:#F6F5F1;padding:0}
.layout-house .board > .links,.layout-house .board > .tip-row,.layout-house .board > .festline{display:none}
/* the house footer's bottom line already carries the Rekkarun credit: the engine's own line would say it twice (audit 2026-10-16) */
.layout-house .board:has(.u-foot) > .made-by{display:none}
/* the running ticker as drawn (frame 00-home): a clay band, paper type set in the serif, one colour; sizes kept (never smaller).
   The band is the clay one step deeper (#AF5430, same hue): paper on the drawn #C9623A reads 3.6:1, on this 4.7:1 (owner rule 4.5:1) */
.layout-house.u-built .board > .mq{--board-mq:#AF5430;--board-mq-ink:#F6F5F1;--board-mq-accent:#F6F5F1;--board-mq-dim:#F6F5F1;--board-ink:#F6F5F1;--board-dim:#F6F5F1;background:#AF5430;color:#F6F5F1;border:0}
.layout-house.u-built .board > .mq .track span,.layout-house.u-built .board > .mq .track span i,.layout-house.u-built .board > .mq .track span.dim{font-family:var(--serif);font-weight:500;color:#F6F5F1}
.layout-house .u-foot small{display:block;font:700 11.5px/1.3 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--u-hinoki);margin-bottom:10px}
.layout-house .u-foot h2{font-family:var(--serif);font-weight:400;letter-spacing:-.01em;margin:0}
.layout-house .u-letterband{display:grid;grid-template-columns:minmax(0,44fr) minmax(0,56fr);min-height:440px}
.layout-house .u-lb-mark{background:#26221E url("house/letter-window.jpg") center/cover no-repeat;display:grid;place-items:center;overflow:hidden}
.layout-house .u-lb-mark span{visibility:hidden}
.layout-house .u-lb-mark span{writing-mode:vertical-rl;font-family:"Shippori Mincho",serif;font-size:clamp(64px,8vw,120px);letter-spacing:.12em;color:#F6F5F1;opacity:.9}
.layout-house .u-lb-paper{background:var(--u-hinoki);color:#1B1A18;display:flex;flex-direction:column;justify-content:center;gap:18px;padding:48px clamp(24px,5vw,72px) 48px clamp(24px,4vw,64px)}
.layout-house .u-lb-paper small{color:#7A5A2E}
.layout-house .u-lb-paper h2{font-size:clamp(36px,3.8vw,54px);line-height:1}
.layout-house .u-lb-paper p{font-family:var(--serif);font-style:italic;font-size:20px;opacity:.8;margin:0}
.layout-house .u-lb-form{display:flex;gap:16px;align-items:flex-end;margin-top:6px}
.layout-house .u-lb-form input{flex:1;min-width:0;background:transparent;border:0;border-bottom:1.5px solid #1B1A18;padding:8px 0 10px;font:18px var(--sans);color:#1B1A18;outline:none;border-radius:0}
.layout-house .u-lb-form input::placeholder{color:rgba(27,26,24,.5)}
.layout-house .u-lb-form button{background:#1B1A18;color:#F6F5F1;border:0;border-radius:99px;padding:13px 22px;font:600 15.5px/1 var(--sans);cursor:pointer;transition:transform .2s var(--u-ease)}
.layout-house .u-lb-form button:hover{transform:translateY(-1px)}
.layout-house .u-lb-ok{display:block;font-size:13px;line-height:1.5;opacity:.75}
.layout-house .u-lb-ok input{width:18px;height:18px;margin:0 8px 0 0;vertical-align:-4px}
.layout-house .u-lb-ok a{color:inherit}
.layout-house .u-lb-say{font:600 14.5px/1.4 var(--sans)}
.layout-house .u-mags,.layout-house .u-issues{padding:48px clamp(16px,4vw,56px);border-top:1px solid rgba(246,245,241,.15)}
.layout-house .u-mags-h{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:22px}
.layout-house .u-mags-h h2{font-size:clamp(24px,2.2vw,32.5px);line-height:1.2;max-width:960px}
.layout-house .u-mags-h a{color:#F6F5F1;font:600 14.5px/1 var(--sans);text-decoration:none;white-space:nowrap}
.layout-house .u-pill{background:transparent;color:#F6F5F1;border:1px solid rgba(246,245,241,.4);border-radius:99px;padding:11px 18px;font:600 14.5px/1 var(--sans);cursor:pointer;white-space:nowrap}
.layout-house .u-pill:hover{border-color:#F6F5F1}
.layout-house .u-regions{display:flex;flex-wrap:wrap;gap:26px;margin:0 0 22px;font-size:15px;opacity:.85}
.layout-house .u-regions b{color:var(--u-clay);margin-left:4px}
.layout-house .u-top{font-size:15px;line-height:1.75;opacity:.72;margin:0}
.layout-house .u-top small{color:rgba(246,245,241,.7);margin-bottom:6px}
.layout-house .u-top span{white-space:nowrap}
.layout-house .u-covers{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px}
.layout-house .u-issue{height:330px;flex-direction:column;justify-content:space-between;align-items:stretch;background:#2A2825}
.layout-house .u-issue.now{outline:2px solid var(--u-hinoki);outline-offset:-2px}
.layout-house .u-iss-top{display:flex;align-items:center;gap:4px;padding:16px 16px 0}
.layout-house .u-iss-top b{font-family:var(--serif);font-weight:500;font-size:28px}
.layout-house .u-iss-top i{font-style:normal;font-family:"Shippori Mincho",serif;font-size:22.5px;color:var(--u-hinoki)}
.layout-house .u-iss-top em{margin-left:auto;font:700 10.5px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;font-style:normal;background:var(--u-hinoki);color:#1B1A18;padding:4px 9px;border-radius:10px}
.layout-house .u-issue .u-shade{background:linear-gradient(180deg,rgba(0,0,0,.35),transparent 28%,transparent 40%,rgba(0,0,0,.85) 68%)}
.layout-house .u-issue .u-cap small{text-shadow:0 1px 2px rgba(0,0,0,.55)}
.layout-house .u-issue .u-hed{font-size:24px}
.layout-house .u-issue .u-dek{font-size:13px}
.u-nw{white-space:nowrap}   /* a week's date range breaks after the week name, never inside the range */
.layout-house .u-bottom{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:18px clamp(16px,4vw,56px) 22px;border-top:1px solid rgba(246,245,241,.15);font-size:13px;color:rgba(246,245,241,.55)}
.layout-house .u-bottom nav{display:flex;gap:22px;flex-wrap:wrap}
.layout-house .u-bottom nav a{color:rgba(246,245,241,.85);text-decoration:none;font-size:14px}
.layout-house .u-bottom > span a{color:rgba(246,245,241,.85);text-decoration:none;border-bottom:1px solid rgba(246,245,241,.4)}
.layout-house .u-bottom > span a:hover{color:#fff;border-color:#fff}
.layout-house .u-bottom nav a:hover{color:#F6F5F1}
.layout-house .u-bottom .lang{display:inline-flex!important;gap:6px;align-items:center;color:#F6F5F1}
.layout-house .u-bottom .lang button{background:none;border:0;color:inherit;font:600 13.5px/1 var(--sans);cursor:pointer;opacity:.6}
.layout-house .u-bottom .lang button[aria-pressed=true]{opacity:1}
/* the drawer */
.u-drawer{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,0);pointer-events:none;transition:background .35s}
.u-drawer.open{background:rgba(0,0,0,.45);pointer-events:auto}
.u-drawer .u-dr-in{position:absolute;left:0;right:0;bottom:0;max-height:82vh;overflow:auto;background:#1B1A18;color:#F6F5F1;transform:translateY(100%);transition:transform .45s cubic-bezier(.2,.7,.1,1);border-radius:14px 14px 0 0}
.u-drawer.open .u-dr-in{transform:none}
.u-dr-h{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:26px clamp(16px,4vw,56px) 20px;border-bottom:1px solid rgba(246,245,241,.15);position:sticky;top:0;background:#1B1A18}
.u-dr-h small{display:block;font:700 11.5px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:#E4CC9F;margin-bottom:8px}
.u-dr-h h2{font-family:var(--serif);font-weight:400;font-size:clamp(28px,3vw,36px);margin:0}
.u-dr-tools{display:flex;gap:10px}
.u-dr-tools input{background:transparent;border:1px solid rgba(246,245,241,.4);border-radius:99px;color:#F6F5F1;padding:10px 16px;font:15.5px var(--sans);width:min(320px,48vw)}
.u-dr-tools button{background:transparent;border:1px solid rgba(246,245,241,.4);border-radius:99px;color:#F6F5F1;padding:10px 16px;font:600 14.5px var(--sans);cursor:pointer}
.u-dr-body{padding:22px clamp(16px,4vw,56px) 36px;display:flex;flex-direction:column;gap:20px}
.u-dr-g{display:grid;grid-template-columns:220px 1fr;gap:24px}
.u-dr-g small{display:block;font:700 11.5px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:#C9623A;margin-bottom:5px}
.u-dr-g span{font-size:13px;color:rgba(246,245,241,.5)}
.u-dr-g p{margin:0;font-size:15.5px;line-height:1.8;color:rgba(246,245,241,.85)}
.u-dr-g a{color:inherit;text-decoration:none;white-space:nowrap}
.u-dr-g a:hover{color:#E4CC9F}
@media (max-width:760px){
  .layout-house .u-letterband{grid-template-columns:minmax(0,1fr)}
  .layout-house .u-lb-paper{min-width:0}
  .layout-house .u-lb-mark{display:none}
  .layout-house .u-mags-h{flex-direction:column;align-items:flex-start}
  .layout-house .u-covers{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
  .layout-house .u-covers .u-issue{flex:0 0 62%;scroll-snap-align:start}
  .layout-house .u-bottom{flex-direction:column;align-items:flex-start}
  .u-dr-h{flex-direction:column;align-items:flex-start}
  .u-dr-g{grid-template-columns:1fr;gap:6px}
}

/* ================================================================ the built front page (the approved design) */
.layout-house.u-built #home > :not(#u-front){display:none!important}
.layout-house.u-built .tabs{display:none!important}
#u-front .jp{font-family:"Shippori Mincho",serif;font-weight:400;font-size:.5em;opacity:.6;margin-left:.3em;letter-spacing:0}
#u-front .cjk{font-family:"Shippori Mincho",var(--serif)}
.u-h{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;padding-bottom:10px;margin-bottom:14px;border-bottom:2px solid var(--ink)}
.u-h small{display:block;font:700 11.5px/1.3 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--u-clay,#C9623A);margin-bottom:5px}
.u-h h2{font-family:var(--serif);font-weight:500;font-size:clamp(28px,2.4vw,34px);letter-spacing:-.02em;line-height:1.1;margin:0}
.u-h h2 .jp{display:inline-block;white-space:nowrap}   /* a Japanese room name moves to the next line whole, never split mid-word */
/* the full-width sections carry the big drawn titles */
.u-rooms > .u-h,.u-mat > .u-h,.u-notes > .u-h{padding-bottom:16px;margin-bottom:32px}
.u-notes > .u-h{margin-bottom:0}
.u-rooms > .u-h small,.u-mat > .u-h small,.u-notes > .u-h small{font-size:12px;letter-spacing:.18em;margin-bottom:10px}
.u-rooms > .u-h h2,.u-mat > .u-h h2{font-size:clamp(40px,3.9vw,56px);letter-spacing:-.025em}
.u-notes > .u-h h2{font-size:clamp(36px,3.4vw,48px);letter-spacing:-.02em}
.u-rooms > .u-h .jp,.u-notes > .u-h .jp{font-size:.42em;opacity:.7}
.u-note{font-size:13.5px;opacity:.6;text-align:right}
.u-link{display:inline-block;margin-top:12px;font:600 14px/1 var(--sans);color:var(--ink);text-decoration:none;background:none;border:0;padding:0;cursor:pointer}
.u-link:hover{color:var(--u-clay)}
.u-ck{font:700 11.5px/1.3 var(--sans);letter-spacing:.06em;margin:4px 0 10px;opacity:.7}
.u-band{display:grid;grid-template-columns:minmax(0,640fr) minmax(0,312fr) minmax(0,312fr);gap:0 32px;padding:48px clamp(16px,4vw,56px) 56px}
.u-band-b{padding-top:56px}
.u-band > section > div + div{margin-top:30px}
/* chips */
.u-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 22px;align-items:center}
.u-chips button{font:600 13.5px/1 var(--sans);padding:6px 12px;border-radius:99px;border:1px solid var(--u-rule);background:transparent;color:var(--ink);cursor:pointer}
.u-chips button[aria-pressed=true]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.u-chips [data-rg][aria-pressed=true]{background:#26365A;border-color:#26365A;color:#F6F5F1}
.u-sep{width:10px}
#u-latest .u-sep{flex-basis:100%;height:0;width:auto}   /* rooms on the first line, regions on the second */
/* stories */
.u-story{display:block;color:var(--ink);text-decoration:none}
.u-story .u-img{position:relative;display:block;aspect-ratio:4/3;margin-bottom:10px;border-radius:3px}
.u-sz-big .u-img{aspect-ratio:32/21}
#u-latest-b .u-sz-big .u-img{aspect-ratio:16/10}
.u-n2 .u-img{aspect-ratio:31/22}
#u-latest-b .u-n2 .u-img{aspect-ratio:31/24}
.u-n3 .u-img{aspect-ratio:20/17}
.u-story small{display:block;font:700 12px/1.3 var(--sans);letter-spacing:.11em;text-transform:uppercase;opacity:.6;margin-bottom:8px}
.u-story b{display:block;font-family:var(--serif);font-weight:500;font-size:22px;line-height:1.12;letter-spacing:-.01em}
.u-sz-big b{font-size:clamp(28px,2.5vw,38px);line-height:1.12;letter-spacing:-.02em}
.u-sz-trio b{font-size:19px}
.u-story b.cjk{font-family:"Shippori Mincho",var(--serif);line-height:1.5}
.u-sz-big b.cjk{font-size:clamp(21.5px,1.7vw,28px)}
.u-sum{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin-top:8px;font-size:15.5px;line-height:1.5;opacity:.72}
.u-story:hover b{color:var(--u-clay)}
.u-n2,.u-n3{display:grid;gap:20px;margin:0}
.u-n2{grid-template-columns:1fr 1fr}
.u-n3{grid-template-columns:repeat(3,1fr)}
#u-latest-a > * + *,#u-latest-b > * + *{margin-top:22px}
.u-more{display:block;width:100%;margin-top:22px;padding:15px;border:1px solid var(--ink);background:transparent;color:var(--ink);font:600 14.5px/1 var(--sans);cursor:pointer}
.u-more:hover{background:var(--ink);color:var(--bg)}
.u-none{opacity:.6;font-style:italic}
/* signal of the week */
.u-sig-n{display:flex;align-items:flex-end;gap:12px;margin:6px 0 8px}
.u-sig-n b{font-family:var(--serif);font-weight:500;font-size:110px;line-height:.8;letter-spacing:-5px}
.u-sig-n span{font:700 13.5px/1.3 var(--sans);color:#5E6B2E;padding-bottom:8px}
.u-sig-p{font-family:var(--serif);font-size:20px;line-height:1.25;opacity:.75;margin:12px 0 14px}
.u-bars{display:flex;align-items:flex-end;gap:3px;height:46px;margin-bottom:4px}
.u-bars i,.u-sp i{flex:1;background:color-mix(in srgb,var(--ink) 22%,transparent);min-height:2px}
.u-bars i.hot{background:var(--u-clay)}
.u-sig-list .u-mini{padding:10px 0;border-top:1px solid var(--u-rule)}
.u-sig-list .u-mini .u-img{width:84px;height:84px}
/* radar */
.u-room{display:grid;grid-template-columns:22px minmax(0,1fr) 46px 26px 34px;align-items:center;gap:8px;width:100%;padding:9px 0;border:0;border-bottom:1px solid var(--u-rule);background:none;color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.u-rk{font:700 11.5px/1 var(--sans);opacity:.5}
.u-rn{font-family:var(--serif);font-size:18px;line-height:1.2}
.u-sp{display:flex;align-items:flex-end;gap:1px;height:22px}
.u-sp i.hot{background:color-mix(in srgb,var(--ink) 60%,transparent)}
.u-rc{font:500 17px/1 var(--serif);text-align:right}
.u-rd{font:700 12.5px/1 var(--sans);text-align:right}
.u-rd.up{color:#5E6B2E}.u-rd.down{color:var(--u-clay)}
[data-theme=dark] .u-rd.up,[data-theme=dark] .u-sig-n span{color:#A9B072}
.u-room:hover .u-rn{color:var(--u-clay)}
/* colours */
.u-cbars{display:flex;align-items:flex-end;gap:6px;height:150px;margin-bottom:6px}
.u-cbars span{flex:1;display:flex;flex-direction:column;justify-content:flex-end;height:100%;gap:4px}
.u-cbars i{display:block;border-radius:2px;border:1px solid var(--u-rule)}
.u-cbars small{font-size:11.5px;opacity:.65}
.u-cbars b{font:600 14.5px/1 var(--sans)}
.u-cstrip{display:flex;height:34px;border-radius:2px;overflow:hidden;margin-top:4px}
.u-cpct{font-size:12.5px;line-height:1.6;opacity:.65;margin:6px 0 0}
/* Asia now */
.u-ev{display:block;padding:10px 0;border-bottom:1px solid var(--u-rule);color:var(--ink);text-decoration:none}
.u-ev-d{display:flex;align-items:center;gap:8px;font:700 12px/1 var(--sans);letter-spacing:.04em;opacity:.85}
.u-ev-d em{font-style:normal;font:700 11px/1 var(--sans);letter-spacing:.06em;padding:4px 8px;border-radius:10px}
.u-ev-d em.on{background:#5E6B2E;color:#F6F5F1}.u-ev-d em.soon{background:var(--u-hinoki);color:#1B1A18}.u-ev-d em.closing{background:var(--u-clay);color:#F6F5F1}
.u-ev b{display:block;font-family:var(--serif);font-weight:400;font-size:19px;line-height:1.15;margin:6px 0 4px}
.u-ev-v{font-size:13.5px;opacity:.6}
.u-ev:hover b{color:var(--u-clay)}
.u-wr{display:block;padding:10px 0;border-bottom:1px solid var(--u-rule);color:var(--ink);text-decoration:none}
.u-wr > span{display:flex;gap:8px;align-items:center;margin-bottom:6px}
.u-wr em{font-style:normal;font:700 11px/1 var(--sans);background:#26365A;color:#F6F5F1;padding:4px 8px;border-radius:10px}
.u-wr small{font:700 11px/1 var(--sans);letter-spacing:.06em;opacity:.7}
.u-wr b{display:block;font-family:var(--serif);font-weight:400;font-size:18px;line-height:1.2}
.u-wr b.cjk{font-size:17px;line-height:1.6}
.u-orig{display:block;font-size:12.5px;opacity:.55;margin-top:4px}
.u-wr:hover b{color:var(--u-clay)}
/* the house sound */
.u-sound{background:#1B1A18;color:#F6F5F1;padding:28px;border-radius:6px}
.u-chips-asia{margin:0 0 12px}
.u-chips-asia button{padding:6px 11px}
.u-sound .u-link{color:#F6F5F1}
.u-sd-h{display:flex;gap:14px;align-items:center;margin-bottom:10px}
.u-disc-big{width:56px;height:56px;border-radius:50%;border:9px solid #3A3834;background:#0E0D0C;display:grid;place-items:center;cursor:pointer;flex:none;padding:0}
.u-disc-big i{width:20px;height:20px;border-radius:50%;background:#C9623A}
.u-playing .u-disc-big{animation:u-spin 2.4s linear infinite}
.u-sound small{display:block;font:700 11px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:#E4CC9F;margin-bottom:6px}
.u-sound h3{font-family:var(--serif);font-weight:500;font-size:26px;margin:0}
.u-sound p{font-size:15px;line-height:1.5;opacity:.75;margin:0 0 14px}
.u-sd-load{display:block;width:100%;text-align:left;background:#2A2825;color:#F6F5F1;border:0;border-radius:6px;padding:14px;font:600 15.5px/1.3 var(--sans);cursor:pointer}
.u-sd-load small{display:block;font:400 12.5px/1.4 var(--sans);letter-spacing:0;text-transform:none;color:rgba(246,245,241,.6);margin:6px 0 0}
.u-sd-embed iframe{border:0;border-radius:8px;display:block}
/* Asia ⇄ World */
.u-pair{padding:4px 0 16px;border-bottom:1px solid var(--u-rule);margin-bottom:14px}
.u-pt{display:block;font:700 11.5px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--u-clay);margin-bottom:10px}
.u-pair > div{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.u-pair a{color:var(--ink);text-decoration:none}
.u-pair .u-img{position:relative;display:block;aspect-ratio:4/3;margin-bottom:8px}
.u-pair small{display:block;font:700 12px/1.3 var(--sans);color:#26365A;margin-bottom:4px}
[data-theme=dark] .u-pair small{color:#8FA3D1}
.u-pair b{font-family:var(--serif);font-weight:500;font-size:15.5px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
/* discover */
.u-thumbs{display:grid;grid-template-columns:1fr 1fr;gap:16px 12px}
.u-thumbs a{color:var(--ink);text-decoration:none}
.u-thumbs .u-img{position:relative;display:block;aspect-ratio:4/3;margin-bottom:6px}
.u-thumbs b{display:block;font-family:var(--serif);font-weight:500;font-size:15.5px;line-height:1.25}
.u-thumbs small{font-size:12.5px;opacity:.6}
/* how Asia lives, sources, about */
.u-lives{background:var(--ph,#ECEAE3);padding:16px 16px 6px;border-radius:2px}
.u-lives small{display:block;font:700 11px/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--u-clay);margin-bottom:8px}
.u-lives h3{font-family:var(--serif);font-weight:500;font-size:28px;margin:0 0 10px;padding-bottom:10px;border-bottom:2px solid var(--ink)}
.u-lives p{font-family:var(--serif);font-size:17px;line-height:1.3;margin:0;padding:12px 0;border-bottom:1px solid var(--u-rule)}
.u-lives p:last-child{border-bottom:0}
.u-lives p a{display:block;font:700 12.5px/1.3 var(--sans);color:var(--u-clay);text-decoration:none;margin-top:4px}
.u-srcs p{font-size:14px;line-height:1.75;margin:0}
.u-srcs a{color:var(--ink);text-decoration:none;opacity:.8;white-space:nowrap}
.u-srcs a:hover{color:var(--u-clay);opacity:1}
.u-srcs .jp{font-family:var(--sans)!important;font-size:.5em!important}
.u-about blockquote{font-family:var(--serif);font-size:26px;line-height:1.2;margin:0 0 12px;quotes:none}
.u-about p{font-size:15.5px;line-height:1.6;opacity:.75;margin:0}
.u-about .u-link{color:var(--u-clay)}
/* rooms of the week */
.u-rooms,.u-mat,.u-notes{padding:56px clamp(16px,4vw,56px)}
.u-rooms{background:var(--ph,#ECEAE3)}
.u-mosaic{position:relative;height:clamp(520px,47.2vw,680px)}
.u-room-t{position:absolute!important}
.u-room-t .u-cap{padding:18px}
.u-rt-n{display:flex;align-items:baseline;gap:8px}
.u-rt-n b{font-family:var(--serif);font-weight:500;font-size:clamp(30px,4.4vw,64px);line-height:.9;letter-spacing:-.03em}
.u-rt-n em{font-style:normal;font:700 13.5px/1 var(--sans)}
.u-rt-n em.up{color:#C9E08A}.u-rt-n em.down{color:#F2A27F}
.u-room-t .u-hed{font-size:clamp(17px,1.4vw,21.5px)}
.u-room-t .u-cap small{margin:0;font-family:"Shippori Mincho",serif;letter-spacing:0;text-transform:none;font-size:13.5px;color:rgba(246,245,241,.7)}
.u-room-t.small .u-cap{padding:10px}
.u-room-t.small .u-rt-n b{font-size:24px}
.u-room-t.small .u-hed{font-size:14.5px}
.u-room-t.small .u-cap small{display:none}
/* touch the week */
.u-mat-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px;align-items:end}
.u-sw{display:block;color:var(--ink);text-decoration:none}
.u-sw-p{position:relative;display:block;border-radius:4px;overflow:hidden}
.u-sw-p .u-img{position:relative;display:block;height:100%}
.u-sw0 .u-sw-p{height:520px}.u-sw1 .u-sw-p{height:440px}.u-sw2 .u-sw-p{height:560px}.u-sw3 .u-sw-p{height:480px}.u-sw4 .u-sw-p{height:400px}
.u-mat > .u-h{margin-bottom:40px}
.u-sw-p em{position:absolute;top:14px;left:14px;font-style:normal;font:600 13.5px/1 var(--sans);background:rgba(246,245,241,.9);color:#1B1A18;padding:8px 12px;border-radius:99px}
.u-sw-p em i{font-style:normal;font-family:"Shippori Mincho",serif;color:#C9623A;margin-right:4px}
.u-sw b{display:block;font-family:var(--serif);font-weight:500;font-size:20px;line-height:1.2;margin:12px 0 8px}
.u-sw small{font:700 11px/1 var(--sans);letter-spacing:.15em;text-transform:uppercase;opacity:.6}
/* notes */
.u-notes{background:var(--ph,#ECEAE3)}
.u-notes-l a{display:grid;grid-template-columns:64px 1fr;gap:24px;padding:22px 0;border-bottom:1px solid var(--u-rule);color:var(--ink);text-decoration:none}
.u-nd{font:700 13.5px/1.6 var(--sans);color:var(--u-clay)}
.u-notes-l b{display:block;font-family:var(--serif);font-weight:500;font-size:clamp(21.5px,1.9vw,28px);line-height:1.08;letter-spacing:-.015em}
.u-notes-l small{display:block;font-family:"Shippori Mincho",serif;font-size:16px;opacity:.6;margin-top:6px}
.u-notes-l a:hover b{color:var(--u-clay)}
/* the built page on narrower screens */
@media (max-width:1100px){
  .u-band{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
  .u-band > .u-c3{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:0 36px}
  .u-band > .u-c3 > div + div{margin-top:0}
  .u-mat-row{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:760px){
  .u-band{display:block;padding:28px 16px 32px}
  .u-band > section + section{margin-top:40px}
  .u-band > .u-c3{display:block}
  .u-band > .u-c3 > div + div{margin-top:40px}
  .u-n2,.u-n3{grid-template-columns:1fr;gap:22px}
  .u-n3 .u-story{display:grid;grid-template-columns:96px 1fr;gap:4px 12px}
  .u-n3 .u-story .u-img{grid-row:1/4;width:96px;margin:0}
  .u-sig-n b{font-size:72px}
  .u-mosaic{height:1100px}
  .u-room-t.small .u-rt-n em{display:none}
  .u-chips button{min-height:40px}
  .u-link{padding:12px 0;margin-top:0}
  .u-mat-row{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;align-items:flex-end;scrollbar-width:none}
  .u-mat-row .u-sw{flex:0 0 70%;scroll-snap-align:start}
  .u-rooms,.u-mat,.u-notes{padding:36px 16px}
  .u-notes-l a{grid-template-columns:64px 1fr;gap:12px}
  .u-h{flex-wrap:wrap}
}

/* the running ticker belongs to the front page only (the inner-page designs end with the footer) */
.layout-house:not(.u-built) .board > .mq{display:none}

/* ---------------------------------------------------------------- the menu: a dark curtain that drops from the top edge */
.layout-house .menu{top:0;left:0;right:0;bottom:auto;width:auto;height:auto;max-height:86vh;overflow:auto;background:#1B1A18;color:#F6F5F1;z-index:120;transform:none;clip-path:inset(0 0 100% 0);visibility:hidden;transition:clip-path .55s cubic-bezier(.2,.7,.1,1),visibility 0s .55s;box-shadow:0 24px 50px rgba(0,0,0,.28)}
.layout-house .menu.open{clip-path:inset(0 0 0 0);visibility:visible;transition:clip-path .55s cubic-bezier(.2,.7,.1,1),visibility 0s}
.layout-house .menu > .grid{display:none}
.layout-house .scrim.open{z-index:110;background:rgba(27,26,24,.38)}
.u-menu{padding:0 clamp(16px,4vw,56px) 26px}
.u-menu > *{opacity:0;transform:translateY(-8px);transition:opacity .35s .12s,transform .45s .12s cubic-bezier(.2,.7,.1,1)}
.menu.open .u-menu > *{opacity:1;transform:none}
.u-menu-top{display:flex;align-items:center;gap:20px;padding:18px 0 16px;border-bottom:1px solid rgba(246,245,241,.16)}
.layout-house .menu .u-menu-logo{font:500 30px/1 var(--serif);color:#F6F5F1;text-decoration:none;padding:0;margin:0}
.u-menu-logo span{font-family:"Shippori Mincho",serif;color:#C9623A}
.u-menu-date{font:700 11px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:rgba(246,245,241,.5);margin-right:auto}
.layout-house .menu .u-menu-x{display:inline-flex;gap:8px;align-items:center;width:auto;background:none;border:1px solid rgba(246,245,241,.35);border-radius:99px;color:#F6F5F1;font:600 13.5px/1 var(--sans);padding:9px 14px;margin:0;cursor:pointer;text-transform:none;letter-spacing:0}
.layout-house .menu .u-menu-x:hover{border-color:#F6F5F1}
.u-menu-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr) minmax(0,.9fr);gap:40px;padding-top:24px;align-items:start}
.u-menu-q small,.u-menu-play small{display:block;font:700 11px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:#E4CC9F;margin-bottom:10px}
.layout-house .menu .u-menu-q .search{display:flex!important;gap:0;margin:0;padding:0;border:0;border-bottom:1.5px solid rgba(246,245,241,.6);background:none}
.layout-house .menu .u-menu-q input{display:block!important;flex:1;min-width:0;background:transparent;border:0;color:#F6F5F1;padding:8px 0 10px;font:italic 24px/1.2 var(--serif);margin:0;width:auto;outline:none;border-radius:0}
.layout-house .menu .u-menu-q input::placeholder{color:rgba(246,245,241,.4)}
.layout-house .menu .u-menu-q button{display:block;width:auto;flex:none;background:none;color:#E4CC9F;border:0;padding:0 0 0 12px;margin:0;font:600 14.5px/1 var(--sans);text-transform:none;letter-spacing:0;cursor:pointer}
.u-menu-nav{display:grid;grid-template-columns:1fr 1fr;gap:0 28px}
.layout-house .menu .u-menu-nav a{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:10px 0;margin:0;border-bottom:1px solid rgba(246,245,241,.12);color:#F6F5F1;text-decoration:none;font:inherit}
.u-menu-nav a span{font:400 clamp(20px,1.7vw,24px)/1.1 var(--serif);transition:color .2s,transform .3s cubic-bezier(.2,.7,.1,1)}
.u-menu-nav a small{font:14.5px/1 "Shippori Mincho",serif;color:rgba(246,245,241,.45)}
.u-menu-nav a:hover span{color:#C9623A;font-style:italic;transform:translateX(4px)}
.u-menu-side{display:flex;flex-direction:column;gap:12px}
.layout-house .menu .u-menu-play{display:flex!important;align-items:center;gap:12px;padding:12px 14px;margin:0;background:#2A2825;border-radius:10px;color:#F6F5F1;text-decoration:none;font:inherit;border:0}
.u-menu-play small{margin-bottom:4px}
.u-menu-play em{font:italic 18px/1 var(--serif)}
.u-menu-play b{margin-left:auto;font-size:15.5px}
.u-menu-play:hover .u-disc{animation:u-spin 2.4s linear infinite}
.layout-house .menu .u-menu-letter{display:flex;justify-content:space-between;align-items:center;width:100%;margin:0;background:#E4CC9F;color:#1B1A18;border:0;border-radius:99px;padding:14px 18px;font:600 15px/1 var(--sans);text-transform:none;letter-spacing:0;cursor:pointer}
.layout-house .menu .u-menu-letter:hover{background:#F6F5F1}
@media (max-width:860px){
  .u-menu-date{display:none}
  .u-menu-body{grid-template-columns:1fr;gap:20px;padding-top:18px}
  .u-menu-nav{gap:0 18px}
  .u-menu-nav a span{font-size:21.5px}
  .layout-house .menu .u-menu-logo{margin-right:auto}
  .layout-house .menu .u-menu-nav a{white-space:nowrap;padding:9px 0}
  .u-menu-nav a span{font-size:20.5px}
  .u-menu-nav a small{font-size:12.5px}
  .u-menu-side{flex-direction:column;gap:10px}
  .layout-house .menu .u-menu-letter{justify-content:space-between;padding:13px 18px}
}
@media (prefers-reduced-motion: reduce){.layout-house .menu,.u-menu > *{transition:none!important}}

/* ---------------------------------------------------------------- the slim bar (appears once the masthead scrolls away) */
.u-slim{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;gap:28px;height:56px;padding:0 clamp(16px,4vw,56px);background:color-mix(in srgb,var(--bg) 88%,transparent);-webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--u-rule,rgba(0,0,0,.12));transform:translateY(-102%);transition:transform .45s cubic-bezier(.2,.7,.1,1),box-shadow .45s;color:var(--ink)}
.u-slim.on{transform:none;box-shadow:0 8px 24px rgba(0,0,0,.06)}
.u-slim-logo{font:500 26px/1 var(--serif);letter-spacing:-.01em;color:var(--ink);text-decoration:none;white-space:nowrap;flex:none}
.u-slim-logo span{font-family:"Shippori Mincho",serif;color:var(--u-clay,#C9623A)}
.u-slim-nav{display:flex;align-items:center;gap:clamp(14px,2vw,30px);flex:1;min-width:0;overflow:hidden}
.u-slim-nav a{font:400 18px/1 var(--serif);color:var(--ink);text-decoration:none;white-space:nowrap;padding:6px 0;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .35s cubic-bezier(.2,.7,.1,1),color .2s}
.u-slim-nav a:hover{background-size:100% 1px}
.u-slim-nav a[aria-current]{color:var(--u-clay,#C9623A);font-style:italic}
.u-slim-tools{display:flex;align-items:center;gap:10px;flex:none}
.u-slim-tools button{font:600 13.5px/1 var(--sans);cursor:pointer;color:var(--ink);background:transparent;border:1px solid var(--u-rule,rgba(0,0,0,.15));border-radius:99px;padding:8px 13px;display:inline-flex;align-items:center;gap:8px}
.u-slim-tools button:hover{border-color:var(--ink)}
.u-slim-letter{background:var(--ink)!important;color:var(--bg)!important;border-color:var(--ink)!important}
.u-slim-theme{width:32px;height:32px;padding:0!important;justify-content:center}
.u-slim-theme svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.u-slim-theme .moon{fill:currentColor;stroke:none}
.u-slim-theme .sun{display:none}
[data-theme=dark] .u-slim-theme .sun{display:block}
[data-theme=dark] .u-slim-theme .moon{display:none}
.u-slim-menu i{width:13px;height:9px;border-top:1.5px solid currentColor;border-bottom:1.5px solid currentColor;position:relative}
.u-slim-menu i::after{content:"";position:absolute;left:0;right:0;top:2.5px;border-top:1.5px solid currentColor}
@media (max-width:1100px){.u-slim-letter{display:none!important}}
@media (max-width:760px){.u-slim{height:50px;gap:12px}.u-slim-nav{display:none}.u-slim-logo{font-size:24px;margin-right:auto}}
@media (prefers-reduced-motion: reduce){.u-slim{transition:none}}

/* ================================================================ the phone home, menu and footer as drawn (Pencil «Mobile · Home», «Mobile · Menu») */
.u-dots,.u-m-rooms{display:none}
@media (max-width:760px){
  /* the home is the short drawn page: lead, covers to swipe, also today, the rooms as bars, homes, notes, one Asia poster */
  #u-front{display:flex;flex-direction:column}
  #u-front > .u-grid:not(.u-mirror){order:1}#u-front > .u-dots{order:2}#u-front > .u-also{order:3}#u-front > .u-m-rooms{order:4}
  #u-front > .u-mirror{order:5}#u-front > .u-notes{order:6}#u-front > .u-posters{order:7}
  #u-front > .u-band,#u-front > .u-rooms,#u-front > .u-mat{display:none}
  .layout-house .u-lead{height:min(128vw,520px)}
  .layout-house .u-grid:not(.u-mirror) .u-four{gap:2px;padding:0}
  .layout-house .u-grid:not(.u-mirror) .u-four .u-card{flex:0 0 280px;height:330px}
  .u-dots{display:flex;gap:6px;padding:10px 0;justify-content:center}
  .u-dots i{width:6px;height:6px;border-radius:3px;background:var(--u-rule);transition:width .3s var(--u-ease),background .3s}
  .u-dots i.on{width:16px;background:var(--ink)}
  .layout-house .u-also{padding:8px 18px 18px}
  .layout-house .u-also-row .u-mini:nth-child(n+4){display:none}
  .layout-house .u-also-row .u-mini{padding:12px 0}
  .u-m-rooms{display:block;background:var(--ph,#ECEAE3);padding:18px 18px 22px}
  .u-m-rooms h2{font:500 26px/1.1 var(--serif);letter-spacing:-.01em;margin:0 0 8px}
  .layout-house .board > .mq{display:none}
  .u-mr{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(0,1fr) 40px;align-items:center;gap:10px;min-height:40px;color:var(--ink);text-decoration:none;font:400 15px/1.2 var(--sans)}
  .u-mr span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .u-mr i{display:block;height:6px;width:var(--w);background:color-mix(in srgb,var(--ink) 22%,transparent)}
  .u-mr i.up{background:var(--u-clay)}
  .u-mr b{font:700 14px/1 var(--sans);text-align:right}
  .u-mr b.up{color:#5E6B2E}.u-mr b.down{color:var(--u-clay)}
  [data-theme=dark] .u-mr b.up{color:#A9B072}
  .u-mr-more{display:none}
  .u-m-rooms.open .u-mr-more{display:grid}
  .u-mr-all{display:block;margin-top:6px;padding:10px 0;background:none;border:0;color:var(--ink);font:700 14px/1 var(--sans);cursor:pointer}
  .layout-house .u-mirror .u-four{display:none}
  .layout-house .u-mirror .u-lead{height:min(113vw,460px)}
  .u-notes{padding:22px 18px 18px}
  .u-notes > .u-h{margin:0;padding:0 0 4px;border:0}
  .u-notes > .u-h h2,.u-notes > .u-h .u-note{display:none}
  .u-notes-l a{padding:12px 0}
  .u-notes-l a:nth-child(n+4){display:none}
  .layout-house .u-posters{margin:0}
  .layout-house .u-posters .u-sec-h{display:none}
  .layout-house .u-row{display:block;height:auto}
  .layout-house .u-row .u-card{height:min(113vw,460px)}
  .layout-house .u-row .u-card:not(:first-child){display:none}

  /* the footer, compact: letter, one line of magazines, links in a line */
  .layout-house .u-lb-paper{padding:26px 18px;gap:12px}
  .layout-house .u-lb-paper p{display:none}
  .layout-house .u-lb-paper h2{font-size:34px}
  .layout-house .u-mags{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:22px 18px}
  .layout-house .u-mags-h,.layout-house .u-mags-h > div{display:contents}
  .layout-house .u-mags-h h2,.layout-house .u-top{display:none}
  .layout-house .u-mags-h small{order:1;margin:0}
  .layout-house .u-regions{order:2;display:block;margin:0;font-size:15.5px;line-height:1.55;opacity:.85}
  .layout-house .u-regions[data-n]::before{content:"From " attr(data-n) " magazines: "}
  .layout-house .u-regions span::after{content:" · "}
  .layout-house .u-regions span:last-child::after{content:""}
  .layout-house .u-regions b{color:inherit;font-weight:400;margin-left:0}
  .layout-house .u-mags-h [data-drawer]{order:3}
  .layout-house .u-issues{display:none}
  .layout-house .u-bottom{flex-direction:column-reverse;align-items:flex-start;gap:8px;padding:16px 18px 22px}
  .layout-house .u-bottom nav{display:block;line-height:1.6}
  .layout-house .u-bottom nav a{display:inline;padding:10px 0;font-size:15px}
  .layout-house .u-bottom nav a + a::before{content:" · ";color:rgba(246,245,241,.5)}

  /* the menu fills the screen: search as a pill, sections in one column, large */
  .layout-house .menu{max-height:none;height:100dvh}
  .u-menu{padding:0 18px 24px;min-height:100%;box-sizing:border-box}
  .u-menu-top{border-bottom:0;padding:14px 0 10px}
  .layout-house .menu .u-menu-x{border:0;padding:8px 0 8px 8px;font-size:0;gap:0}
  .layout-house .menu .u-menu-x span{font-size:22px}
  .u-menu-q small{display:none}
  .layout-house .menu .u-menu-q .search{border:1px solid rgba(246,245,241,.4);border-radius:99px;padding:0 16px}
  .layout-house .menu .u-menu-q input{font:400 15px/1 var(--sans);padding:12px 0}
  .layout-house .menu .u-menu-q button{display:none}
  .u-menu-nav{grid-template-columns:1fr;gap:0}
  .layout-house .menu .u-menu-nav a{padding:12px 0}
  .u-menu-nav a span{font-size:34px}
  .u-menu-nav a small{font-size:13px}
  .layout-house .menu .u-menu-nav a[aria-current] span{color:#C9623A;font-style:italic}
  .u-menu-body{gap:14px;padding-top:8px}
}

/* the magazines drawer: region chips (dark) */
.u-dr-chips{padding:16px clamp(16px,4vw,56px) 0;margin:0}
.u-dr-chips button{color:#F6F5F1;border-color:rgba(246,245,241,.35)}
.u-dr-chips button[aria-pressed=true]{background:#F6F5F1;color:#1B1A18;border-color:#F6F5F1}
@media (max-width:760px){
  .u-dr-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding:12px 16px 0}
  .u-dr-chips::-webkit-scrollbar{display:none}
  .u-dr-chips button{flex:none}
  .u-dr-g > div{display:flex;gap:8px;align-items:baseline}
  .u-dr-g > div small{margin:0}
  .u-drawer .u-dr-in::before{content:"";display:block;width:40px;height:4px;border-radius:2px;background:rgba(246,245,241,.3);margin:10px auto 0}
}

/* the independence line (owner 2026-10-24) takes the free width of the bottom bar; 14.6 px floor */
.layout-house .u-bottom .u-indie{flex:1 1 360px;font-size:14.6px;line-height:1.45}
@media(max-width:700px){.layout-house .u-bottom{flex-wrap:wrap}}

/* Uchi story pages (theme module): the house layout built by pages/story.js next to the engine's #single, which stays
   in the page, hidden. Desktop: the picture edge to edge with the headline on it, then tools | excerpt | the stories
   around it. Phones: one column, the stories as a swipe row, the reader tools as a bar at the bottom. */
.u-story-built #single{display:none!important}
/* only one element may carry the hero's transition name: ours */
body.layout-house.u-story-built .single .hero img{view-transition-name:none}
#u-story .us-pic img{view-transition-name:u-hero}

/* ---------------------------------------------------------------- the picture with the headline on it */
#u-story .us-hero{position:relative;display:flex;align-items:flex-end;height:clamp(420px,44vw,680px);overflow:hidden;background:#1B1A18;color:#F6F5F1;isolation:isolate}
#u-story .us-hero.us-noimg{height:auto;min-height:280px}
#u-story .us-pic{position:absolute;inset:0;z-index:-2}
#u-story .us-pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
#u-story .us-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,.08) 0%,transparent 30%,rgba(0,0,0,.5) 62%,rgba(0,0,0,.84))}
#u-story .us-cap{display:flex;flex-direction:column;gap:14px;padding:0 clamp(16px,4vw,56px) clamp(22px,3.4vw,48px);max-width:1080px}
#u-story .us-kick{font:700 12px/1.3 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--u-hinoki)}
#u-story .us-h{font-family:var(--serif);font-weight:400;font-size:clamp(32.5px,3.4vw,52px);line-height:1.08;letter-spacing:-.015em;margin:0;text-wrap:balance}
#u-story .us-h.cjk{font-family:"Shippori Mincho",var(--serif);font-weight:500;font-size:clamp(30px,3.2vw,46px);line-height:1.3;letter-spacing:.01em}
#u-story .us-h.us-long{font-size:clamp(26px,2.4vw,36px)}
#u-story .us-h.cjk.us-long{font-size:clamp(21.5px,1.9vw,32.5px)}
#u-story .us-src{margin:0;font:500 13.5px/1.3 var(--sans);opacity:.75}
#u-story .us-src .us-m{display:none}
#u-story .us-credit{margin:0;padding:9px clamp(16px,4vw,56px);font:500 12.5px/1.3 var(--sans);opacity:.6;border-bottom:1px solid var(--u-rule)}

/* ---------------------------------------------------------------- three columns */
#u-story .us-grid{display:grid;grid-template-columns:200px minmax(0,1fr) 320px;gap:clamp(32px,4vw,64px);padding:40px clamp(16px,4vw,56px) 56px;align-items:start}

/* reader tools */
#u-story .us-tools{display:flex;flex-direction:column;position:sticky;top:20px}
#u-story .us-t{display:flex;align-items:center;gap:12px;width:100%;padding:12px 0;border:0;border-bottom:1px solid var(--u-rule);background:none;color:var(--ink);font:500 14.5px/1 var(--sans);text-align:left;cursor:pointer}
#u-story .us-t .us-i{width:18px;color:var(--u-clay);font-size:17px;text-align:center}
#u-story .us-aa{font-family:var(--serif);font-size:17px;letter-spacing:-.02em}
#u-story .us-t:hover,#u-story .us-t[aria-pressed=true]{color:var(--u-clay)}
#u-story .us-say{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:30;max-width:min(90vw,560px);padding:10px 16px;border-radius:99px;background:var(--ink);color:var(--bg);font:500 14px/1.4 var(--sans);overflow-wrap:anywhere;text-align:center;box-shadow:0 8px 28px rgba(0,0,0,.28),0 0 0 1px rgba(246,245,241,.18)}
#u-story .us-say:empty{display:none}
#u-story .us-listen{display:flex;gap:12px;align-items:flex-start;margin-top:10px;padding:14px;border-radius:4px;background:#1B1A18;color:#F6F5F1;text-decoration:none}
#u-story .us-listen .u-disc{width:28px;height:28px;border-width:4px}
#u-story .us-listen:hover .u-disc{animation:u-spin 2.4s linear infinite}
#u-story .us-listen small{display:block;font:700 10.5px/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--u-hinoki)}
#u-story .us-listen em{display:block;font-family:var(--serif);font-size:17px;margin-top:4px}
#u-story .us-note{display:block;font:400 13px/1.45 var(--sans);opacity:.7;margin-top:6px}

/* the excerpt and the way to the original */
#u-story .us-body{max-width:720px;min-width:0}
#u-story .us-ex{font-family:var(--serif);font-size:24px;line-height:1.6;margin:0 0 30px;transition:font-size .25s var(--u-ease)}
#u-story .us-ex.cjk{font-family:"Shippori Mincho",var(--serif);font-size:24px;line-height:1.75}
#u-story.us-bigtext .us-ex{font-size:29px}
#u-story.us-bigtext .us-ex.cjk{font-size:27px}
#u-story.us-bigtext .us-r b{font-size:19px}
#u-story .us-go{display:inline-flex;align-items:center;gap:12px;padding:16px 26px;border-radius:99px;background:var(--ink);color:var(--bg);font:600 15.5px/1.2 var(--sans);text-decoration:none;transition:background .2s,transform .2s var(--u-ease)}
#u-story .us-go:hover{background:var(--u-clay);color:#F6F5F1;transform:translateY(-1px)}
#u-story .us-fine{margin:18px 0 0;font:400 13.5px/1.5 var(--sans);opacity:.6}
#u-story .us-also{margin:8px 0 0;font:400 13.5px/1.5 var(--sans);opacity:.75}
#u-story .us-also a{color:inherit}

/* why it is here */
#u-story .us-why{margin-top:28px;padding-top:16px;border-top:2px solid var(--ink)}
#u-story .us-why small{display:block;font:700 11.5px/1.3 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--u-clay);margin-bottom:12px}
#u-story .us-pills{display:flex;flex-wrap:wrap;gap:8px}
#u-story .us-pill{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:99px;background:var(--ink);color:var(--bg);font:600 14px/1 var(--sans);text-decoration:none}
#u-story a.us-pill:hover{background:var(--u-clay);color:#F6F5F1}
#u-story .us-pill b{font-weight:700}
#u-story .us-pill em{font-style:normal;font-weight:600;opacity:.75}
#u-story .us-pill-l{background:transparent;color:var(--ink);border:1px solid var(--u-rule)}
#u-story .us-why p{margin:12px 0 0;font:400 15px/1.5 var(--sans);opacity:.75}

/* the stories around it */
#u-story .us-rel h2{font-family:var(--serif);font-weight:500;font-size:22.5px;letter-spacing:-.01em;margin:0;padding-bottom:9px;border-bottom:2px solid var(--ink)}
#u-story .us-r{display:grid;grid-template-columns:76px minmax(0,1fr);gap:14px;padding:13px 0;border-bottom:1px solid var(--u-rule);color:var(--ink);text-decoration:none}
#u-story .us-r .u-img{position:relative;display:block;width:76px;height:76px}
#u-story .us-rt small{display:block;font:700 12px/1.35 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#5E6B2E;margin-bottom:5px}
[data-theme=dark] #u-story .us-rt small{color:#A9B072}
#u-story .us-rt b{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;font-family:var(--serif);font-weight:500;font-size:16px;line-height:1.3}
#u-story .us-rt b.cjk{font-family:"Shippori Mincho",var(--serif);line-height:1.55}
#u-story .us-r:hover b{color:var(--u-clay)}

/* the reader bar exists only on phones */
#u-story .us-bar{display:none}

/* ---------------------------------------------------------------- narrower windows: tools become a row */
@media (max-width:1100px){
  #u-story .us-grid{grid-template-columns:minmax(0,1fr) 280px;gap:32px 40px}
  #u-story .us-tools{grid-column:1/-1;position:static;flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px 24px;border-bottom:1px solid var(--u-rule);padding-bottom:12px}
  #u-story .us-t{width:auto;border:0;padding:6px 0}
  #u-story .us-listen{margin:0 0 0 auto;padding:10px 14px;align-items:center}
  #u-story .us-note{display:none}
}

/* ---------------------------------------------------------------- phones: one column, a swipe row, the bar */
@media (max-width:760px){
  #u-story .us-hero{display:block;height:auto;background:none;color:var(--ink)}
  #u-story .us-pic{position:relative;display:block;height:min(108vw,560px);background:#1B1A18}
  #u-story .us-shade{display:none}
  #u-story .us-cap{padding:20px 16px 0;gap:12px}
  #u-story .us-kick{color:var(--u-clay);font-size:12px}
  #u-story .us-h{font-size:32.5px;line-height:1.12}
  #u-story .us-h.cjk{font-size:28px;line-height:1.55}
  #u-story .us-h.us-long{font-size:26px}
  #u-story .us-h.cjk.us-long{font-size:22.5px}
  #u-story .us-src{opacity:.65}
  #u-story .us-src .us-d{display:none}
  #u-story .us-src .us-m{display:inline}
  #u-story .us-credit{display:none}
  #u-story .us-grid{display:block;padding:24px 0 0}
  #u-story .us-tools{display:none}
  #u-story .us-body{padding:0 16px 32px}
  #u-story .us-ex{font-size:21.5px}
  #u-story .us-ex.cjk{font-size:20.5px}
  #u-story.us-bigtext .us-ex{font-size:26px}
  #u-story.us-bigtext .us-ex.cjk{font-size:25px}
  #u-story .us-go{display:flex;justify-content:center;width:100%;box-sizing:border-box;font-size:15.5px;padding:15px 18px}
  #u-story .us-rel{background:color-mix(in srgb,var(--ink) 5%,var(--bg));padding:28px 0 32px}
  #u-story .us-rel h2{font-size:28px;border:0;padding:0 16px 14px}
  #u-story .us-rel-l{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:16px;padding:0 16px;scrollbar-width:none}
  #u-story .us-rel-l::-webkit-scrollbar{display:none}
  #u-story .us-r{flex:0 0 62%;display:block;border:0;padding:0;scroll-snap-align:start}
  #u-story .us-r .u-img{width:100%;height:auto;aspect-ratio:4/3;margin-bottom:12px}
  #u-story .us-rt b{font-size:19px}
  #u-story .us-bar{display:grid;grid-template-columns:repeat(3,1fr);position:fixed;left:0;right:0;bottom:0;z-index:20;background:var(--bg);border-top:1px solid var(--ink);padding:8px 8px calc(8px + env(safe-area-inset-bottom))}
  #u-story .us-bar button,#u-story .us-bar a{display:flex;flex-direction:column;align-items:center;gap:5px;padding:4px 0;border:0;background:none;color:var(--ink);font:600 13px/1 var(--sans);text-decoration:none;cursor:pointer}
  #u-story .us-bar span{color:var(--u-clay);font-size:20.5px;line-height:1}
  #u-story .us-bar .us-aa{font-size:20.5px}
  #u-story .us-bar [aria-pressed=true]{color:var(--u-clay)}
  #u-story .us-say{bottom:calc(84px + env(safe-area-inset-bottom));border-radius:14px}
  #u-story .us-bar .u-disc{width:20px;height:20px;border-width:3px;margin-top:-1px}
  #u-story .us-bar .u-disc i{width:9px;height:9px;box-shadow:none}
  body.u-story-built .board{padding-bottom:calc(64px + env(safe-area-inset-bottom))}
}

@media (prefers-reduced-motion: reduce){
  #u-story .us-ex,#u-story .us-go{transition:none}
  #u-story .us-listen:hover .u-disc{animation:none}
}

/* Uchi topic pages (theme module): a room (signal/<room>/) and a magazine (source/<magazine>/). Colours reuse the
   site's variables so the night theme keeps working; type is the locked pair. */
.layout-house.u-topic-built #home > :not(#u-topic){display:none!important}
.layout-house.u-topic-built .tabs{display:none!important}
#u-topic{--u-tp-pad:clamp(16px,4vw,56px);color:var(--ink)}
#u-topic .cjk{font-family:"Shippori Mincho",var(--serif)}
.u-tp-k{display:block;font:700 11.5px/1.3 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--accent-text,var(--u-clay))}
.u-tp-k span{letter-spacing:.08em}

/* ---------------------------------------------------------------- room: the hero, edge to edge */
.u-tp-hero{display:grid;grid-template-columns:minmax(0,57fr) minmax(0,43fr);height:clamp(500px,40vw,620px);background:#1B1A18}
.u-tp-hero.solo{grid-template-columns:1fr;height:auto;background:var(--ph)}
.u-tp-card{display:flex;flex-direction:column;background:var(--ph);padding:clamp(24px,3vw,40px) var(--u-tp-pad) clamp(20px,2vw,28px);min-width:0}
.u-tp-t{font-family:var(--serif);font-weight:400;font-size:clamp(48px,6.4vw,96px);line-height:.95;letter-spacing:-.033em;margin:14px 0 0;font-variation-settings:"opsz" 144}
.u-tp-jp{font-family:"Shippori Mincho",serif;font-size:clamp(17px,1.53vw,24px);letter-spacing:0;opacity:.6;margin:12px 0 0}
.u-tp-nums{display:flex;gap:clamp(28px,4vw,60px);margin-top:clamp(24px,3vw,44px)}
.u-tp-nums span{display:flex;flex-direction:column;gap:6px}
.u-tp-nums b{font-family:var(--serif);font-weight:300;font-size:clamp(40px,3.9vw,58px);line-height:.9;letter-spacing:-.03em;display:flex;align-items:flex-end}
.u-tp-nums small{font:500 12.5px/1.2 var(--sans);opacity:.6}
.u-tp-d i{font-style:normal;font-size:.8em;margin-right:.04em;line-height:1}
.u-tp-d.up b{color:#5E6B2E}.u-tp-d.down b{color:var(--u-clay)}
[data-theme=dark] .u-tp-d.up b{color:#A9B072}
.u-tp-chart{margin-top:auto;padding-top:24px}
.u-tp-chart .u-bars{height:clamp(64px,7.6vw,110px);gap:5px;margin-bottom:0}
.u-tp-chart .u-bars i{transform-origin:bottom;animation:u-tp-grow .9s var(--u-ease) both}
.u-tp-chart .u-bars i:nth-child(n+8){animation-delay:.05s}.u-tp-chart .u-bars i:nth-child(n+15){animation-delay:.1s}.u-tp-chart .u-bars i:nth-child(n+22){animation-delay:.15s}
@keyframes u-tp-grow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.u-tp-axis{display:flex;justify-content:space-between;gap:12px;padding-top:7px;border-top:1px solid color-mix(in srgb,var(--ink) 40%,transparent);font:500 12px/1.3 var(--sans);opacity:.65}
.u-tp-axis span:first-child,.u-tp-axis span:last-child{flex:none;white-space:nowrap}
.u-tp-cap{text-align:center}
.u-tp-four{height:100%}
.u-tp-four.n1{grid-template-columns:1fr;grid-template-rows:1fr}
.u-tp-four.n2{grid-template-rows:1fr}
.u-tp-four.n3 > :first-child{grid-row:1/3}

/* ---------------------------------------------------------------- every story: three a row */
.u-tp-all{padding:clamp(36px,4vw,56px) var(--u-tp-pad) clamp(40px,4vw,64px)}
.u-tp-all .u-h{align-items:center;margin-bottom:24px}
.u-tp-all .u-h h2{font-weight:500;font-size:clamp(28px,2.4vw,34px)}
.u-tp-chips{margin:0;justify-content:flex-end}
.u-tp-chips button{padding:7px 12px}
.u-tp-chips [data-rg][aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.u-tp-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px clamp(18px,2.2vw,32px)}
.u-tp-c{display:flex;flex-direction:column;color:var(--ink);text-decoration:none;min-width:0}
.u-tp-c .u-img{position:relative;display:block;aspect-ratio:16/10;margin-bottom:12px;background:var(--ph)}
.u-tp-c .u-img img{transition:opacity .7s var(--u-ease),transform 1.2s var(--u-ease)}
.u-tp-c:hover .u-img img{transform:scale(1.04)}
.u-tp-noimg{aspect-ratio:16/10}
.u-tp-c.noimg .u-img{display:grid;place-items:center}
.u-tp-c.noimg .u-img::after{content:attr(data-name);font-family:var(--serif);font-style:italic;font-size:20px;opacity:.72;padding:0 16px;text-align:center}   /* .72: the name reads at 4.5:1 on the placeholder in both themes */
.u-tp-m{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:8px}
.u-tp-m small{font:700 12px/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#5E6B2E;min-width:0}
[data-theme=dark] .u-tp-m small{color:#A9B072}
.u-tp-m time{font:500 12.5px/1 var(--sans);opacity:.6;white-space:nowrap}
.u-tp-h{display:block;font-family:var(--serif);font-weight:500;font-size:clamp(19px,1.53vw,24px);line-height:1.18}
.u-tp-h.cjk{font-family:"Shippori Mincho",var(--serif);font-weight:500;font-size:clamp(18px,1.25vw,20px);line-height:1.35}
.u-tp-c:hover .u-tp-h{color:var(--u-clay)}
.u-tp-x{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin-top:8px;font-size:15px;line-height:1.5;opacity:.7}
.u-tp-o{display:block;margin-top:6px;font-size:13px;opacity:.55}
.u-tp-mo{text-align:center}
.u-tp-more{margin-top:36px;padding:13px 22px;border:1px solid var(--ink);background:transparent;color:var(--ink);font:600 14.5px/1 var(--sans);cursor:pointer;transition:background .2s,color .2s}
.u-tp-more:hover{background:var(--ink);color:var(--bg)}

/* ---------------------------------------------------------------- the other rooms */
.u-tp-rooms{background:var(--ph);padding:clamp(28px,3vw,40px) var(--u-tp-pad) clamp(32px,3vw,44px)}
.u-tp-rooms .u-tp-k{margin-bottom:16px}
.u-tp-rl{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0 clamp(18px,2vw,28px)}
.u-tp-rl a{display:grid;grid-template-columns:minmax(0,1fr) auto 34px;align-items:baseline;gap:8px;padding:12px 0;border-bottom:1px solid var(--u-rule);color:var(--ink);text-decoration:none}
.u-tp-rn{font-family:var(--serif);font-size:17.5px;line-height:1.25;min-width:0;overflow-wrap:anywhere}   /* the full room name, on two lines if it must (it was cut with an ellipsis) */
.u-tp-rc{font:600 14px/1 var(--sans)}
.u-tp-rl .u-rd{font-size:12px}
.u-tp-rl a:hover .u-tp-rn{color:var(--u-clay)}

/* ---------------------------------------------------------------- magazine: the head band */
.u-mg-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;background:var(--ph);padding:clamp(32px,4vw,56px) var(--u-tp-pad) clamp(28px,3vw,44px)}
.u-mg-id{min-width:0}
.u-mg-t{font-family:var(--serif);font-weight:400;font-size:clamp(56px,7.4vw,118px);line-height:.95;letter-spacing:-.03em;margin:14px 0 0;font-variation-settings:"opsz" 144;overflow-wrap:anywhere}
.u-mg-t.cjk{font-family:"Shippori Mincho",var(--serif);letter-spacing:0}
.u-mg-meta{display:flex;flex-wrap:wrap;gap:4px 10px;margin:16px 0 0;font:500 14.5px/1.4 var(--sans);opacity:.75}
.u-mg-meta i{font-style:normal;opacity:.5}
.u-mg-meta a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--u-rule)}
.u-mg-meta a:hover{color:var(--u-clay)}
.u-mg-fig{display:flex;align-items:flex-end;gap:clamp(24px,3vw,44px);flex:none}
.u-mg-n{display:flex;flex-direction:column;gap:6px}
.u-mg-n b{font-family:var(--serif);font-weight:300;font-size:clamp(44px,4.4vw,64px);line-height:.85;letter-spacing:-.03em}
.u-mg-n small{font:500 12.5px/1.2 var(--sans);opacity:.6}
.u-mg-rooms{display:flex;flex-direction:column;gap:7px;min-width:200px}
.u-mg-rooms > small{font:700 12px/1.2 var(--sans);letter-spacing:.18em;text-transform:uppercase;opacity:.6;margin-bottom:2px}
.u-mg-rooms a{display:flex;align-items:center;gap:8px;color:var(--ink);text-decoration:none;font-size:14px;line-height:1.2}
.u-mg-tk{display:block;width:84px;flex:none}
.u-mg-rooms i{display:block;height:8px;background:var(--u-clay);flex:none;transform-origin:left;animation:u-tp-grow-x .9s var(--u-ease) both}
.u-mg-rooms b{font-weight:600}
.u-mg-rooms a:hover span{color:var(--u-clay)}
@keyframes u-tp-grow-x{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.u-tp-pill{display:inline-flex;align-items:center;gap:6px;flex:none;background:var(--ink);color:var(--bg);border-radius:99px;padding:10px 16px;font:600 14px/1 var(--sans);text-decoration:none;white-space:nowrap;transition:background .2s,transform .2s var(--u-ease)}
.u-tp-pill:hover{background:var(--u-clay);color:#F6F5F1;transform:translateY(-1px)}
.u-mg-all .u-tp-h.cjk{font-size:clamp(17px,1.25vw,20px)}
.u-mg-along{display:flex;align-items:center;gap:clamp(20px,3vw,40px);background:var(--ph);padding:28px var(--u-tp-pad)}
.u-mg-along[hidden]{display:none}
.u-mg-along nav{display:flex;flex-wrap:wrap;gap:8px clamp(20px,2.8vw,40px)}
.u-mg-along nav a{font-family:var(--serif);font-size:clamp(20px,1.53vw,24px);color:var(--ink);text-decoration:none}
.u-mg-along nav a:hover{color:var(--u-clay)}

/* ---------------------------------------------------------------- narrower windows and phones */
@media (max-width:1100px){
  .u-tp-hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .u-tp-rl{grid-template-columns:repeat(3,minmax(0,1fr))}
  .u-tp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .u-mg-head{flex-direction:column;align-items:flex-start}
}
@media (max-width:760px){
  .u-tp-hero{display:block;height:auto}
  .u-tp-four{display:none!important}
  .u-tp-card{padding:22px 16px 20px}
  .u-tp-t{font-size:clamp(40px,12vw,56px)}
  .u-tp-nums{gap:28px;margin-top:22px}
  .u-tp-nums b{font-size:40px}
  .u-tp-chart{padding-top:26px}
  .u-tp-chart .u-bars{height:68px}
  .u-tp-cap{display:none}
  .u-tp-all{padding:22px 16px 36px}
  .u-tp-room .u-tp-all .u-h{border:0;padding:0;margin-bottom:16px}
  .u-tp-room .u-tp-all .u-h > div:first-child{display:none}
  .u-tp-chips{justify-content:flex-start}
  .u-tp-chips button{padding:9px 15px;font-size:14.5px}
  .u-tp-grid{grid-template-columns:1fr;gap:28px}
  .u-tp-h{font-size:22.5px}
  .u-tp-h.cjk{font-size:19px}
  .u-tp-more{width:auto;min-width:60%}
  .u-tp-rooms{padding:28px 16px}
  .u-tp-rl{grid-template-columns:1fr}
  .u-mg-head{padding:28px 16px 26px;gap:24px}
  .u-mg-t{font-size:clamp(44px,13vw,64px)}
  .u-mg-fig{flex-wrap:wrap;gap:20px 28px}
  .u-mg-rooms{min-width:0;flex-basis:100%}
  .u-mg-all .u-h{flex-direction:column;align-items:flex-start}
  .u-mg-along{flex-direction:column;align-items:flex-start;gap:12px;padding:22px 16px}
}
@media (prefers-reduced-motion: reduce){
  .u-tp-chart .u-bars i,.u-mg-rooms i{animation:none!important}
  .u-tp-c .u-img img,.u-tp-pill,.u-tp-more{transition:none!important}
  .u-tp-c:hover .u-img img{transform:none}
}

/* Uchi notes pages (theme module): notes index, one note, About, the editor. Approved design 2026-10-02.
   Fonts are the locked pair (var(--serif) = Fraunces, Shippori Mincho for Japanese); colours are the site's variables. */
.u-notes-on #single{max-width:none;margin:0;padding:0}
.u-notes-on #single > :not(#u-notes-page){display:none!important}
#u-notes-page{--un-ph:var(--ph,#ECEAE3);--un-dark:#1B1A18;--un-paper:#F6F5F1;color:var(--ink)}
#u-notes-page a{color:inherit;text-decoration:none}
#u-notes-page [lang=ja],#u-notes-page .cjk{font-family:"Shippori Mincho",var(--serif)}
#u-notes-page .un-k,#u-notes-page .un-sk{display:block;font:700 12px/1.4 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--u-clay)}
#u-notes-page .u-h small:empty{display:none}
#u-notes-page [hidden]{display:none!important}
/* a quiet arrival: the head rises a few pixels; nothing moves under reduced motion */
#u-notes-page .un-head > *,#u-notes-page .un-ihead > *,#u-notes-page .un-paper > *{animation:un-rise .9s var(--u-ease) both}
#u-notes-page :is(.un-head,.un-ihead,.un-paper) > :nth-child(2){animation-delay:.08s}
#u-notes-page :is(.un-head,.un-ihead,.un-paper) > :nth-child(n+3){animation-delay:.16s}
@keyframes un-rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){#u-notes-page .un-head > *,#u-notes-page .un-ihead > *,#u-notes-page .un-paper > *{animation:none!important}}

/* ---------------------------------------------------------------- monogram */
.un-mono{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--un-dark);color:var(--un-paper);font:400 18px/1 "Shippori Mincho",serif;flex:none}
.un-mono.big{width:clamp(120px,13.9vw,200px);height:clamp(120px,13.9vw,200px);background:var(--u-clay);color:var(--un-paper);font-size:clamp(60px,6.7vw,96px)}

/* ---------------------------------------------------------------- one note: the head band */
.un-narrow{display:none}
.un-head{background:var(--un-ph);text-align:center;padding:clamp(40px,5vw,64px) clamp(16px,4vw,56px) clamp(36px,4vw,52px);margin-top:-7px}
.un-head h1{font-family:var(--serif);font-weight:400;font-size:clamp(40px,5.1vw,76px);line-height:1.02;letter-spacing:-.02em;max-width:900px;margin:18px auto 14px;text-wrap:balance}
.un-ja1{font-size:clamp(19px,1.5vw,22.5px);letter-spacing:.06em;opacity:.6;margin:0 0 24px}
.un-by{display:inline-flex;align-items:center;gap:12px;text-align:left}
.un-by a{display:block;font:400 16.5px/1.3 var(--serif)}
.un-by a:hover{color:var(--u-clay)}
.un-by small{display:block;font:400 13.5px/1.4 var(--sans);opacity:.6}

/* body + margin */
.un-wrap{display:grid;grid-template-columns:minmax(0,680px) minmax(0,300px);justify-content:center;gap:0 clamp(32px,4.4vw,64px);padding:clamp(36px,4vw,56px) clamp(16px,4vw,56px) clamp(48px,5vw,72px)}
.un-body p{font-family:var(--serif);font-weight:400;font-size:20px;line-height:1.7;margin:0 0 22px;max-width:none}
.un-body p.un-lead{font-size:clamp(21.5px,1.7vw,25px);line-height:1.55}
#u-notes-page .un-body p a{color:inherit;text-decoration:underline;text-decoration-color:var(--u-clay);text-underline-offset:3px;text-decoration-thickness:1px}
#u-notes-page .un-body p a:hover{color:var(--u-clay)}
.un-pq{margin:34px 0;padding:22px 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(26px,2.2vw,32.5px);line-height:1.3;color:var(--u-clay);quotes:none}
.un-body p.un-persona{font:400 14px/1.6 var(--sans);opacity:.7;margin-top:34px;padding-top:16px;border-top:1px solid var(--u-rule)}
.un-body p.un-persona a{text-decoration:none;font-weight:600;white-space:nowrap}
.un-side{position:sticky;top:24px;align-self:start;display:flex;flex-direction:column;gap:28px;padding-top:6px}
/* a long list of mentions would hang below the screen if it stuck */
.un-side.long{position:static}
.un-sk{color:var(--ink)!important;opacity:.7;margin-bottom:6px}
.un-men a{display:block;padding:12px 0;border-bottom:1px solid var(--u-rule)}
.un-men a small{display:block;font:700 11px/1.3 var(--sans);letter-spacing:.15em;text-transform:uppercase;color:#5E6B2E;margin-bottom:4px}
[data-theme=dark] .un-men a small{color:#A9B072}
.un-men a b{display:block;font-family:var(--serif);font-weight:500;font-size:17.5px;line-height:1.3}
.un-men a:hover b{color:var(--u-clay)}
.un-listen{display:flex;gap:12px;align-items:flex-start;background:var(--un-dark);color:var(--un-paper)!important;padding:16px;border-radius:4px}
.un-listen small{display:block;font:700 10.5px/1.2 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--u-hinoki);margin-bottom:4px}
.un-listen em{display:block;font-family:var(--serif);font-style:italic;font-size:19px}
.un-pln{display:block;font:400 13px/1.5 var(--sans);opacity:.65;margin-top:6px}
.un-listen:hover .u-disc{animation:u-spin 2.4s linear infinite}
@media (prefers-reduced-motion: reduce){.un-listen:hover .u-disc{animation:none}}

/* more notes */
.un-morenotes{background:var(--un-ph);padding:clamp(40px,4vw,56px) clamp(16px,4vw,56px)}
.un-morenotes .u-h h2,.un-every .u-h h2{font-weight:400}
.un-all{font:600 14px/1 var(--sans);white-space:nowrap}
.un-all:hover{color:var(--u-clay)}
.un-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 clamp(20px,2.8vw,40px)}
.un-grid a{display:block;padding:22px 0;border-bottom:1px solid var(--u-rule)}
.un-grid .un-gpic{display:block;aspect-ratio:16/9;margin-bottom:14px;background:var(--un-ph) center/cover no-repeat;border-radius:2px}
/* the note's own picture, under the head band */
.un-pic{margin:0;height:clamp(260px,38vw,560px);background:#26221E center/cover no-repeat}
.un-grid small{display:block;font:700 11.5px/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--u-clay);margin-bottom:8px}
.un-grid b{display:block;font-family:var(--serif);font-weight:400;font-size:clamp(20px,1.5vw,22.5px);line-height:1.22}
.un-grid .un-ja{display:block;font-family:"Shippori Mincho",serif;font-size:14px;opacity:.6;margin-top:6px}
.un-grid a:hover b{color:var(--u-clay)}

/* ---------------------------------------------------------------- the notes index and the editor's lists */
.un-ihead{padding:clamp(40px,5vw,72px) clamp(16px,4vw,56px) clamp(28px,3vw,40px)}
.un-ihead h1{font-family:var(--serif);font-weight:400;font-size:clamp(44px,5.4vw,80px);line-height:1;letter-spacing:-.025em;margin:16px 0 14px}
.un-dek{font-family:var(--serif);font-style:italic;font-size:clamp(20px,1.6vw,24px);opacity:.75;margin:0 0 22px}
.un-by2{display:flex;align-items:center;gap:12px;margin:0;font:500 15px/1.3 var(--sans)}
.un-by2 a:hover{color:var(--u-clay)}
.un-by2 span:last-child{opacity:.55}
.un-feat{padding:0 clamp(16px,4vw,56px) clamp(32px,3vw,44px)}
.un-feat a{display:block;background:var(--un-ph);padding:clamp(24px,3vw,40px) clamp(20px,3vw,44px);border-left:3px solid var(--u-clay)}
.un-feat b{display:block;font-family:var(--serif);font-weight:500;font-size:clamp(30px,3vw,44px);line-height:1.08;letter-spacing:-.015em;margin:12px 0 8px;max-width:24ch;text-wrap:balance}
.un-fja{display:block;font-size:17px;opacity:.6;margin-bottom:14px}
.un-feat p{font-family:var(--serif);font-size:20px;line-height:1.6;max-width:62ch;margin:0 0 16px;opacity:.85}
.un-go{font:600 14px/1 var(--sans)}
.un-feat a:hover b,.un-feat a:hover .un-go{color:var(--u-clay)}
.un-every{background:var(--un-ph);padding:clamp(40px,4vw,56px) clamp(16px,4vw,56px)}
.un-every + .un-every{padding-top:0}
.un-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(24px,3vw,48px)}
.un-row{display:grid;grid-template-columns:62px minmax(0,1fr) auto;align-items:baseline;gap:4px 14px;padding:13px 0;border-bottom:1px solid var(--u-rule)}
.un-rd{font:700 13px/1.4 var(--sans);color:var(--u-clay)}
.un-rt b{display:block;font-family:var(--serif);font-weight:400;font-size:clamp(19px,1.4vw,21px);line-height:1.25}
.un-rt .un-ja{display:block;font-family:"Shippori Mincho",serif;font-size:14px;opacity:.6;margin-top:4px}
.un-tag{font:700 12px/1 var(--sans);font-style:normal;letter-spacing:.12em;text-transform:uppercase;border:1px solid var(--u-rule);border-radius:99px;padding:4px 8px;opacity:.75}
.un-row:hover b{color:var(--u-clay)}
.un-index .un-every,.un-editor .un-every:first-of-type{margin-top:0}
.un-editor .un-ed + .un-every{padding-top:clamp(40px,4vw,56px)}

/* ---------------------------------------------------------------- About: hero */
.un-hero{display:grid;grid-template-columns:minmax(0,44fr) minmax(0,56fr);min-height:clamp(420px,39vw,560px);margin-top:-7px}
.un-mark{background:#26221E url("house/about-flat.jpg") center/cover no-repeat;display:grid;place-items:center;overflow:hidden}
.un-mark span{visibility:hidden}
.un-mark span{writing-mode:vertical-rl;font-family:"Shippori Mincho",serif;font-size:clamp(140px,16vw,240px);line-height:1;color:var(--un-paper);opacity:.9}
.un-paper{background:var(--un-ph);display:flex;flex-direction:column;justify-content:center;padding:48px clamp(24px,4vw,72px) 48px clamp(24px,4vw,56px)}
.un-line{font-family:var(--serif);font-weight:400;font-size:clamp(32.5px,3.2vw,46px);line-height:1.12;letter-spacing:-.015em;margin:16px 0 18px;max-width:22ch}
.un-first p{font-family:var(--serif);font-size:clamp(18.5px,1.3vw,20px);line-height:1.6;margin:0;max-width:56ch}
.un-text{display:grid;grid-template-columns:minmax(0,680px) minmax(0,300px);justify-content:center;gap:0 clamp(32px,4vw,64px);padding:clamp(40px,4vw,56px) clamp(16px,4vw,56px) 8px}
.un-rest p{font-family:var(--serif);font-size:20px;line-height:1.7;margin:0 0 20px}
.un-rest p.grey{font-style:italic;opacity:.7}
.un-contact{border-top:2px solid var(--ink);padding-top:12px;align-self:start}
.un-contact h2{font-family:var(--serif);font-weight:500;font-size:24px;margin:0 0 10px}
.un-contact p{font-size:15.5px;line-height:1.6;opacity:.8;margin:0}
.un-contact a{text-decoration:underline!important;text-decoration-color:var(--u-clay)!important;text-underline-offset:3px}
/* "Sending us news?" (engine/build.py, magazines with a partner kit): a paper card under the address, the link in clay */
.un-contact .about-partners{margin-top:24px;padding:18px 20px 20px;background:var(--un-ph);border-left:2px solid var(--u-clay)}
.un-contact .about-partners h2{font-size:20.5px;margin:0 0 8px}
.un-contact .about-partners p{font-size:15px}
.un-contact .about-partners .about-partners-go{margin-top:12px;opacity:1}
#u-notes-page .un-contact .about-partners-go a{display:inline-flex;align-items:center;gap:8px;font:600 14.5px/1.2 var(--sans);color:var(--u-clay);text-decoration:none!important}
#u-notes-page .un-contact .about-partners-go a:hover{color:var(--ink)}
.un-contact .about-partners-go a:focus-visible{outline:2px solid var(--u-clay);outline-offset:3px}
.un-made{padding:clamp(40px,4vw,56px) clamp(16px,4vw,56px) clamp(44px,4vw,64px)}
.un-made > h2{font-family:var(--serif);font-weight:400;font-size:clamp(30px,2.6vw,38px);letter-spacing:-.015em;margin:0 0 26px}
.un-four{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,2.4vw,36px)}
.un-four > div{border-top:2px solid var(--ink);padding-top:16px}
.un-four h3{font-family:var(--serif);font-weight:400;font-size:clamp(21.5px,1.7vw,26px);margin:0 0 10px}
.un-stat{display:block;font:700 12.5px/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--u-clay);margin-bottom:8px}
.un-four p{font-size:15px;line-height:1.6;opacity:.75;margin:0}
.un-src{font-size:13px;opacity:.55;margin:22px 0 0}
.un-src a{text-decoration:underline!important}

/* ---------------------------------------------------------------- the editor band */
.un-ed{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(24px,3.9vw,56px);align-items:center;background:var(--un-dark);color:var(--un-paper);padding:clamp(40px,4vw,60px) clamp(16px,4vw,56px)}
.un-ed small{display:block;font:700 11.5px/1.3 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--u-hinoki);margin-bottom:12px}
.un-ed h1,.un-ed h2{font-family:var(--serif);font-weight:400;font-size:clamp(32px,3.2vw,46px);line-height:1.05;letter-spacing:-.01em;margin:0 0 14px;color:var(--un-paper)}
.un-edj{font-family:"Shippori Mincho",serif;letter-spacing:.04em}
.un-bio{font-family:var(--serif);font-size:clamp(18.5px,1.35vw,20px);line-height:1.6;margin:0 0 12px;max-width:78ch;color:rgba(246,245,241,.92)}
.un-mail{margin:0 0 10px;font:600 15px/1.4 var(--sans)}
.un-mail a{color:var(--u-hinoki)!important}
.un-ed .un-persona{font:400 13.5px/1.6 var(--sans);color:rgba(246,245,241,.6);margin:0;max-width:96ch}
.un-more{display:inline-block;margin-top:14px;font:600 14px/1 var(--sans);color:var(--u-hinoki)!important}
.un-more:hover{color:var(--un-paper)!important}
.un-editor .un-ed{margin-top:-7px}

/* ---------------------------------------------------------------- narrower windows and phones */
@media (max-width:1100px){
  .un-wrap{grid-template-columns:minmax(0,1fr) 240px}
  .un-four{grid-template-columns:repeat(2,minmax(0,1fr))}
  .un-text{grid-template-columns:minmax(0,1fr)}
  .un-contact{margin-top:12px;max-width:680px}
}
@media (max-width:760px){
  .un-head{text-align:left;padding:28px 16px 30px}
  .un-wide{display:none}
  .un-narrow{display:inline}
  .un-head h1{font-size:clamp(36px,10.5vw,46px);line-height:1.05;margin:14px 0 12px;max-width:none}
  .un-ja1{font-size:17px;margin-bottom:16px}
  .un-wrap{display:block;padding:28px 16px 40px}
  .un-body p,.un-rest p{font-size:20px;line-height:1.75}
  .un-body p.un-lead{font-size:21.5px}
  .un-side{position:static;margin-top:34px}
  .un-grid,.un-list{grid-template-columns:1fr}
  .un-morenotes,.un-every{padding:32px 16px}
  .un-ihead{padding:30px 16px 24px}
  .un-feat{padding:0 16px 28px}
  .un-row{grid-template-columns:54px minmax(0,1fr)}
  .un-tag{grid-column:2;justify-self:start}
  .un-hero{grid-template-columns:1fr;min-height:0}
  .un-mark{height:180px}
  .un-mark span{writing-mode:horizontal-tb;font-size:120px}
  .un-paper{padding:30px 16px 34px}
  .un-text{padding:30px 16px 0}
  .un-made{padding:32px 16px 40px}
  .un-four{grid-template-columns:1fr}
  .un-ed{grid-template-columns:1fr;padding:36px 16px;gap:20px}
  .un-mono.big{width:84px;height:84px;font-size:42px}
}
/* the engine's own like button, moved into the note */
#u-notes-page .note-like{display:flex;gap:12px;align-items:center;margin:30px 0 0;font:400 14.5px/1.4 var(--sans)}
#u-notes-page .note-like .like{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--u-rule);background:transparent;color:var(--ink);border-radius:99px;padding:8px 14px;cursor:pointer;font:600 14.5px/1 var(--sans)}
#u-notes-page .note-like .like[aria-pressed=true],#u-notes-page .note-like .like:hover{border-color:var(--u-clay);color:var(--u-clay)}
#u-notes-page .note-like .grey{opacity:.6}

/* the reader tools at the foot of a phone screen (a note, as on a story) */
.un-bar{display:none}
.un-bigtext .un-body p{font-size:23px}
@media (max-width:760px){
  .un-bar{display:grid;grid-template-columns:repeat(3,1fr);position:fixed;left:0;right:0;bottom:0;z-index:20;background:var(--bg);border-top:1px solid var(--ink);padding:8px 8px calc(8px + env(safe-area-inset-bottom))}
  .un-bar button,.un-bar a{display:flex;flex-direction:column;align-items:center;gap:5px;padding:4px 0;border:0;background:none;color:var(--ink);font:600 13px/1 var(--sans);text-decoration:none;cursor:pointer;min-height:44px;justify-content:center}
  .un-bar span{color:var(--u-clay);font-size:20.5px;line-height:1}
  .un-bar [aria-pressed=true]{color:var(--u-clay)}
  .un-bar .u-disc{width:20px;height:20px;border-width:3px}
  #u-notes-page{padding-bottom:72px}
}

/* Uchi issue pages (theme module): the weekly issue and the archive, approved design 2026-10-02.
   The engine's own page stays in #single, hidden; this page lives in #u-issue right before it. */
.layout-house.u-issue-on #single{padding:0;margin:0;min-height:0}
.layout-house.u-issue-on #single > *{display:none!important}
#u-issue{color:var(--ink)}
#u-issue .u-is-k{display:block;font:700 11.5px/1.3 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--u-clay,#C9623A)}
#u-issue .cjk{font-family:"Shippori Mincho",var(--serif)}

/* ---------------------------------------------------------------- the issue: cover + contents */
.u-is-top{display:grid;grid-template-columns:600px minmax(0,1fr);min-height:760px;margin-top:-7px}
.layout-house #u-issue .u-is-cover{flex-direction:column;justify-content:space-between;align-items:stretch;background:#1B1A18}
.layout-house #u-issue .u-is-cover .u-shade{background:linear-gradient(180deg,rgba(0,0,0,.62) 0%,rgba(0,0,0,.2) 24%,transparent 40%,rgba(0,0,0,.4) 66%,rgba(0,0,0,.9) 100%)}
.u-is-cv-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:28px 32px 0}
.u-is-mark{font-family:var(--serif);font-weight:500;font-size:96px;line-height:.9;letter-spacing:-.03em;color:#F6F5F1;font-variation-settings:"opsz" 144}
.u-is-mark i{font-style:normal;font-family:"Shippori Mincho",serif;font-weight:500;font-size:.67em;color:var(--u-hinoki,#E4CC9F);margin-left:.08em;vertical-align:.12em}
.u-is-wk{display:flex;flex-direction:column;align-items:flex-end;gap:6px;padding-top:6px;text-align:right}
.u-is-wk b{font:700 13.5px/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:#F6F5F1}
.u-is-wk small{font:500 12.5px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:rgba(246,245,241,.75)}
.u-is-cv-cap{padding:0 40px 40px;color:#F6F5F1}
.u-is-cv-cap small{display:block;font:700 11.5px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--u-hinoki,#E4CC9F);margin-bottom:16px}
.u-is-room{font-family:var(--serif);font-weight:500;font-size:clamp(44px,4.4vw,64px);line-height:1;letter-spacing:-.02em;margin:0;color:#F6F5F1}
.u-is-room a{color:inherit;text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0 2px no-repeat;transition:background-size .5s var(--u-ease)}
.u-is-room a:hover{background-size:100% 2px}
.u-is-cv-cap p{font-family:var(--serif);font-style:italic;font-size:20.5px;line-height:1.35;margin:14px 0 0;color:rgba(246,245,241,.88)}
.u-is-toc{padding:40px clamp(24px,4vw,56px) 32px;display:flex;flex-direction:column;gap:34px;min-width:0}
.u-is-toc > .u-is-k{margin-bottom:-14px}
.u-is-blk h2{font-family:var(--serif);font-weight:500;font-size:26px;letter-spacing:-.01em;line-height:1.1;margin:0 0 12px}
.u-is-rm{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,2.6fr) 34px 44px;align-items:center;gap:14px;padding:9px 0;border-bottom:1px solid var(--u-rule);color:var(--ink);text-decoration:none}
.u-is-rn{font-family:var(--serif);font-size:18.5px;line-height:1.2}
.u-is-bar{display:block;height:6px}
.u-is-bar i{display:block;height:100%;background:color-mix(in srgb,var(--ink) 22%,transparent);transform-origin:left;transition:transform .9s var(--u-ease)}
.u-is-rm.up .u-is-bar i{background:var(--u-clay,#C9623A)}
.u-is-rc{font:600 14.5px/1 var(--sans);text-align:right}
.u-is-rd{font:700 13.5px/1 var(--sans);text-align:right;opacity:.6}
.u-is-rd.up{color:#5E6B2E;opacity:1}.u-is-rd.down{color:var(--u-clay,#C9623A);opacity:1}
[data-theme=dark] .u-is-rd.up{color:#A9B072}
.u-is-rm:hover .u-is-rn{color:var(--u-clay,#C9623A)}
.u-is-strip{display:flex;width:100%;height:40px;overflow:hidden;border-radius:2px}
.u-is-strip i{min-width:3px}
.u-is-pct{font-size:13px;line-height:1.6;opacity:.62;margin:8px 0 0}
.u-is-study p{margin:0;font-size:15.5px;line-height:1.6}
.u-is-study a{color:var(--ink);opacity:.8;text-decoration:none}
.u-is-study a:hover{color:var(--u-clay,#C9623A);opacity:1}
.u-is-ed{font-family:var(--serif);font-size:19px;line-height:1.45;margin:0}
.u-is-ed span{font-family:var(--sans);font-size:14px;opacity:.6}
#u-issue .u-is-poster{margin-top:auto;opacity:.75}

/* ---------------------------------------------------------------- the stories kept */
.u-is-kept{padding:56px clamp(16px,4vw,56px) 48px}
.u-is-kh{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;padding-bottom:10px;margin-bottom:22px;border-bottom:2px solid var(--ink)}
.u-is-kh h2{font-family:var(--serif);font-weight:500;font-size:clamp(28px,2.4vw,34px);letter-spacing:-.015em;line-height:1;margin:0}
.u-is-kh span{font-size:13.5px;opacity:.6}
.u-is-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:36px 24px}
.u-is-rest{margin-top:36px}
.u-is-st{display:block;color:var(--ink);text-decoration:none}
.u-is-st .u-img{position:relative;display:block;aspect-ratio:10/7;margin-bottom:12px}
.u-is-st .u-img img{clip-path:inset(0 0 0 100%);transform:scale(1.08);transition:clip-path 1.1s var(--u-ease) var(--d,0ms),transform 1.6s var(--u-ease) var(--d,0ms),opacity .7s var(--u-ease)}
.u-is-st .u-img.in img{clip-path:inset(0 0 0 0);transform:scale(1)}
.u-is-st:hover .u-img.in img{transform:scale(1.04);transition:transform 1.2s var(--u-ease)}
.u-is-noimg{display:grid!important;place-items:center;background:var(--ph,#E8E1D5)!important}
.u-is-noimg b{font:700 11.5px/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase;opacity:.55}
.u-is-st small{display:block;font:700 12px/1.3 var(--sans);letter-spacing:.15em;text-transform:uppercase;color:#5E6B2E;margin-bottom:7px}
[data-theme=dark] .u-is-st small{color:#A9B072}
.u-is-sh{display:block;font-family:var(--serif);font-weight:500;font-size:19px;line-height:1.28}
.u-is-sh.cjk{font-size:17px;line-height:1.6}
.u-is-st:hover .u-is-sh{color:var(--u-clay,#C9623A)}
.u-is-more{margin-top:16px;background:none;border:0;padding:12px 0;font:600 14px/1 var(--sans);color:var(--ink);cursor:pointer}
.u-is-more:hover{color:var(--u-clay,#C9623A)}

/* ---------------------------------------------------------------- previous / next */
.u-is-nav{display:flex;justify-content:space-between;gap:24px;padding:26px clamp(16px,4vw,56px) 28px;background:var(--ph,#ECEAE3)}
.u-is-nav > span{min-width:0}
.u-is-next{text-align:right}
.u-is-nav a,.u-is-off{display:block;color:var(--ink);text-decoration:none}
.u-is-nav small{display:block;font:700 11px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;opacity:.6;margin-bottom:9px}
.u-is-nav b{font-family:var(--serif);font-weight:400;font-size:clamp(20.5px,1.7vw,26px);line-height:1.15}
.u-is-off{opacity:.5}
.u-is-ph{display:none}
.u-is-nav a:hover b{color:var(--u-clay,#C9623A)}

/* ---------------------------------------------------------------- the archive */
.u-ar-head{padding:56px clamp(16px,4vw,56px) 20px}
.u-ar-head h1{font-family:var(--serif);font-weight:400;font-size:clamp(44px,5.4vw,84px);letter-spacing:-.025em;line-height:1;margin:22px 0 28px}
.u-ar-search{display:flex;align-items:center;max-width:720px;border:1.5px solid var(--ink);border-radius:99px;padding:4px 6px 4px 22px}
.u-ar-search input{flex:1;min-width:0;border:0;background:transparent;color:var(--ink);font:17px/1.4 var(--sans);padding:10px 0;outline:none}
.u-ar-search input::placeholder{color:var(--ink);opacity:.55}
.u-ar-search button{flex:none;background:var(--ink);color:var(--bg);border:0;border-radius:99px;padding:10px 16px;font:600 14px/1 var(--sans);cursor:pointer}
.u-ar-search:focus-within{outline:2px solid var(--u-clay,#C9623A);outline-offset:2px}
.u-ar-chips{display:flex;gap:8px;margin-top:18px}
.u-ar-chips button{font:600 13.5px/1 var(--sans);padding:9px 14px;border-radius:99px;border:1px solid var(--u-rule);background:transparent;color:var(--ink);cursor:pointer}
.u-ar-chips button[aria-pressed=true]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.u-ar-shelf{padding:36px clamp(16px,4vw,56px) 56px;scroll-margin-top:16px}
.u-ar-span{display:block;font:700 11.5px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;opacity:.75;margin-bottom:16px}
.u-ar-covers{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px}
.layout-house #u-issue .u-issue{height:auto;aspect-ratio:3/4;min-height:300px}
.layout-house #u-issue .u-issue.now{outline-color:var(--u-hinoki,#E4CC9F)}
.layout-house #u-issue .u-issue .u-iss-top em{color:#1B1A18}
.layout-house #u-issue .u-issue .u-shade{background:linear-gradient(180deg,rgba(0,0,0,.5),rgba(0,0,0,.12) 26%,transparent 40%,rgba(0,0,0,.45) 62%,rgba(0,0,0,.88) 100%)}
.u-ar-notes{background:var(--ph,#ECEAE3);padding:48px clamp(16px,4vw,56px) 56px;scroll-margin-top:16px}
.u-ar-notes h2{font-family:var(--serif);font-weight:400;font-size:clamp(30px,2.6vw,38px);letter-spacing:-.015em;line-height:1;margin:0;padding-bottom:12px;border-bottom:2px solid var(--ink)}
.u-ar-nk{display:none!important}
.u-ar-nl{display:grid;grid-template-columns:1fr 1fr;gap:0 40px}
.u-ar-nl a{display:grid;grid-template-columns:72px 1fr;gap:16px;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--u-rule);color:var(--ink);text-decoration:none}
.u-ar-nl b{font-family:var(--serif);font-weight:400;font-size:clamp(19px,1.4vw,21.5px);line-height:1.3}
.u-ar-nl a:hover b{color:var(--u-clay,#C9623A)}

@media (prefers-reduced-motion: reduce){
  .u-is-st .u-img img{clip-path:none!important;transform:none!important;transition:opacity .2s!important}
  .u-is-room a,.u-is-bar i{transition:none!important}
}

/* ---------------------------------------------------------------- narrower windows */
@media (max-width:1100px){
  .u-is-top{grid-template-columns:minmax(0,46fr) minmax(0,54fr);min-height:680px}
  .u-is-mark{font-size:72px}
  .u-is-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .u-ar-covers{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:760px){
  .u-is-top{display:block;margin-top:0;min-height:0}
  .layout-house #u-issue .u-is-cover{height:min(138vw,640px)}
  .u-is-cv-top{padding:22px 20px 0}
  .u-is-mark{font-size:58px}
  .u-is-wk b{font-size:12.5px}
  .u-is-wk small{font-size:11.5px}
  .u-is-cv-cap{padding:0 20px 26px}
  .u-is-room{font-size:42px}
  .u-is-cv-cap p{font-size:18px}
  .u-is-toc{padding:26px 16px 30px;gap:28px}
  .u-is-toc > .u-is-k{margin-bottom:-10px}
  .u-is-rm{grid-template-columns:minmax(0,1.9fr) minmax(0,1fr) 40px;gap:12px}
  .u-is-rn{font-size:17.5px}
  .u-is-rc{display:none}
  .u-is-kept{padding:36px 16px 32px}
  .u-is-kh{flex-direction:column;align-items:flex-start;gap:6px}
  .u-is-grid{grid-template-columns:1fr 1fr;gap:26px 14px}
  .u-is-rest{margin-top:26px}
  .u-is-sh{font-size:17px}
  .u-is-nav{padding:22px 16px 24px}
  .u-is-nav small,.u-is-nl{display:none}
  .u-is-ph{display:inline}
  .u-is-off b{font-size:20.5px}
  .u-ar-head{padding:28px 16px 10px}
  .u-ar-head h1{font-size:clamp(34px,10vw,44px);margin:12px 0 18px}
  .u-ar-search{padding:2px 4px 2px 18px}
  .u-ar-chips{display:none}
  .u-ar-shelf{padding:22px 0 32px}
  .u-ar-span{padding:0 16px}
  .u-ar-covers{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;padding:0 16px;scroll-padding:0 16px;scrollbar-width:none}
  .u-ar-covers::-webkit-scrollbar{display:none}
  .layout-house #u-issue .u-ar-covers .u-issue{flex:0 0 150px;height:220px;scroll-snap-align:start;min-height:0}   /* drawn: 150×220, about two and a half in view */
  .u-ar-notes{padding:30px 16px 36px}
  .u-ar-notes h2{display:none}
  .u-ar-nk{display:block!important;margin-bottom:6px}
  .u-ar-nl{grid-template-columns:1fr}
  .u-ar-nl a{grid-template-columns:60px 1fr;gap:12px}
}

/* phone archive covers, as drawn: the logo, the week and the room — nothing else on a 150px cover */
@media (max-width:760px){
  .layout-house #u-issue .u-ar-covers .u-iss-top b{font-size:19px}
  .layout-house #u-issue .u-ar-covers .u-iss-top i{font-size:16px}
  .layout-house #u-issue .u-ar-covers .u-iss-top em,.layout-house #u-issue .u-ar-covers .u-dek{display:none}
  .layout-house #u-issue .u-ar-covers .u-hed{font-size:18px;line-height:1.15}
  .layout-house #u-issue .u-ar-covers .u-cap{padding:12px 14px 14px;gap:6px}
  .layout-house #u-issue .u-ar-covers .u-iss-top{padding:14px 14px 0}
}

/* Uchi places pages (theme module): «On view» (departures/), Legal (legal/), Support (support/). Approved design 2026-10-02.
   Colours come from the site's variables and the house palette in uchi.css, so the night theme keeps working. */

/* ================================================================ On view */
.u-pl-onview #dep,.u-pl-onview #single{display:none!important}
.u-pl{--u-pl-pad:clamp(16px,4vw,56px)}
.u-pl-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;padding:44px var(--u-pl-pad) 18px}
.u-pl-head small{display:block;font:700 12.5px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--u-clay);margin-bottom:14px}
.u-pl-head h1{font-family:var(--serif);font-weight:400;font-size:clamp(34px,3.9vw,56px);line-height:1.04;letter-spacing:-.02em;margin:0;max-width:30ch}
.u-pl-count{font-family:var(--serif);font-style:italic;font-size:19px;opacity:.7;margin:0 0 6px;white-space:nowrap}
.u-pl-chips{padding:0 var(--u-pl-pad);margin:0 0 22px}
.u-pl-nowbar{margin:0;padding:12px var(--u-pl-pad);background:var(--ph,#ECEAE3);font:600 12px/1.3 var(--sans);letter-spacing:.08em}
.u-pl-nowbar b{font-weight:700;letter-spacing:.2em;text-transform:uppercase}
.u-pl-none{padding:28px var(--u-pl-pad);margin:0;font-family:var(--serif);font-style:italic;opacity:.7}
.u-pl-sec .u-pl-none{padding:12px 0}

/* the posters: typographic, no borrowed pictures */
.u-pl-posters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));height:clamp(420px,38vw,560px)}
.u-pl-posters.n1{grid-template-columns:minmax(0,1fr)}.u-pl-posters.n2{grid-template-columns:repeat(2,minmax(0,1fr))}.u-pl-posters.n3{grid-template-columns:repeat(3,minmax(0,1fr))}
.u-pl-poster{position:relative;display:flex;align-items:flex-end;overflow:hidden;isolation:isolate;text-decoration:none;background:#1B1A18;color:#F6F5F1;--k:var(--u-hinoki)}
.u-pl-c1{background:var(--u-clay);--k:#F6E3CF}
.u-pl-c2{background:#26365A;--k:var(--u-hinoki)}
.u-pl-c3{background:var(--u-hinoki);color:#1B1A18;--k:#7A4A22}
.u-pl-mark{position:absolute;top:clamp(18px,2vw,26px);right:clamp(14px,1.6vw,22px);z-index:-1;writing-mode:vertical-rl;font-family:"Shippori Mincho",serif;font-size:min(clamp(84px,8.4vw,132px),calc(min(36vw,330px) / var(--n,1)));line-height:1;letter-spacing:.04em;color:currentColor;opacity:.16;transition:transform 1.2s var(--u-ease),opacity .6s var(--u-ease)}
.u-pl-poster:hover .u-pl-mark{transform:translateY(3%);opacity:.24}
.u-pl-pcap{display:flex;flex-direction:column;gap:10px;padding:clamp(18px,2vw,26px)}
.u-pl-pcap small{font:700 11.5px/1.3 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--k)}
.u-pl-pname{font-family:var(--serif);font-weight:500;font-size:clamp(24px,2.05vw,31px);line-height:1.08;letter-spacing:-.01em;display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .5s var(--u-ease)}
.u-pl-pname.cjk{font-family:"Shippori Mincho",var(--serif);line-height:1.35;font-size:clamp(21.5px,1.8vw,29px)}
.u-pl-poster:hover .u-pl-pname{background-size:100% 1px}
.u-pl-pv{font-size:14px;line-height:1.4;opacity:.8}
.u-pl-pu{font:600 13.5px/1.3 var(--sans);opacity:.92}
.u-pl-pu em{font-style:normal;color:var(--k)}
.u-pl-poster:focus-visible{outline:2px solid var(--u-clay);outline-offset:-4px}
@media (prefers-reduced-motion:no-preference){
  .u-pl-poster{animation:u-pl-rise .9s var(--u-ease) both}
  .u-pl-poster:nth-child(2){animation-delay:90ms}.u-pl-poster:nth-child(3){animation-delay:180ms}.u-pl-poster:nth-child(4){animation-delay:270ms}
  @keyframes u-pl-rise{from{opacity:0;clip-path:inset(0 0 0 100%)}to{opacity:1;clip-path:inset(0 0 0 0)}}
}

/* the calendar */
.u-pl-sec{padding:48px var(--u-pl-pad) 8px}
.u-pl-also{padding-top:36px}
.u-pl-sh{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;padding-bottom:12px;margin-bottom:6px;border-bottom:2px solid var(--ink)}
.u-pl-sh h2{font-family:var(--serif);font-weight:400;font-size:clamp(30px,2.6vw,38px);letter-spacing:-.015em;line-height:1;margin:0}
.u-pl-month{display:grid;grid-template-columns:180px minmax(0,1fr);gap:0 40px;margin-top:22px}
.u-pl-mh small{display:block;font:700 11.5px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--u-clay);margin:16px 0 6px}
.u-pl-mh span{font-family:"Shippori Mincho",serif;font-size:15.5px;opacity:.6}
.u-pl-rows{list-style:none;margin:0;padding:0}
.u-pl-row{display:grid;grid-template-columns:64px minmax(0,1fr) auto auto;align-items:center;gap:6px 24px;padding:16px 0;border-bottom:1px solid var(--u-rule)}
.u-pl-day{display:flex;flex-direction:column;align-items:center;gap:4px}
.u-pl-day b{font-family:var(--serif);font-weight:300;font-size:26px;line-height:.9;font-variant-numeric:lining-nums}   /* «10.18»: numeric now (owner 2026-10-18) */
.u-pl-day small{font:700 12px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;opacity:.6}
.u-pl-on{grid-template-columns:150px minmax(0,1fr) auto auto}
.u-pl-on .u-pl-day{align-items:flex-start}
.u-pl-what{display:block;color:var(--ink);text-decoration:none;min-width:0}
.u-pl-what b{font-family:var(--serif);font-weight:400;font-size:22px;line-height:1.25;margin-right:8px}
.u-pl-what b.cjk{font-family:"Shippori Mincho",var(--serif)}
.u-pl-what > span{display:block;font-size:14px;line-height:1.45;opacity:.65;margin-top:4px}
.u-pl-what:hover b{color:var(--u-clay)}
.u-pl-badge{display:inline-block;vertical-align:3px;font:700 12px/1 var(--sans);font-style:normal;letter-spacing:.08em;text-transform:uppercase;padding:4px 8px;border-radius:10px;margin-right:6px;white-space:nowrap}
.u-pl-badge.today,.u-pl-badge.on{background:#5E6B2E;color:#F6F5F1}
.u-pl-badge.closing{background:var(--u-clay);color:#F6F5F1}
.u-pl-badge.tbc{background:transparent;color:var(--u-clay);border:1px solid currentColor;padding:3px 7px}
.u-pl-until{font-size:14px;opacity:.7;white-space:nowrap}
.u-pl-cal{font:600 13.5px/1 var(--sans);color:var(--ink);background:transparent;border:1px solid var(--ink);border-radius:99px;padding:9px 14px;cursor:pointer;white-space:nowrap;transition:background .2s,color .2s,transform .2s var(--u-ease)}
.u-pl-cal:hover{background:var(--ink);color:var(--bg);transform:translateY(-1px)}
.u-pl-cal:focus-visible,.u-pl-copy:focus-visible,.u-pl-toc a:focus-visible{outline:2px solid var(--u-clay);outline-offset:2px}
.u-pl-fine{font-size:13.5px;line-height:1.55;opacity:.65;margin:18px 0 0;max-width:760px}
.u-pl-soon{padding-bottom:64px}

/* ================================================================ Legal and Support: the shared frame */
.u-pl-legal #single,.u-pl-support #single{max-width:none;margin:0;padding:0}
.u-pl-legal #single > .crumb,.u-pl-support #single > .crumb,.u-pl-legal .legal-art,.u-pl-support .legal-art{display:none}
.u-pl-kick{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 .6em;margin-bottom:18px}
.u-pl-kick h1,.u-pl-kick h1.story,.single .u-pl-kick :is(h1,.h1).story{font:700 12.5px/1.3 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--u-clay);margin:0}
.u-pl-kick > span{font:500 12.5px/1.3 "Shippori Mincho",serif;letter-spacing:.12em;color:var(--u-clay)}
.u-pl-kick > span::before{content:"·";margin-right:.6em;font-family:var(--sans)}

/* Legal */
.u-pl-lhead{background:var(--ph,#ECEAE3)}
.u-pl-lhead-in{padding:56px clamp(16px,4vw,56px) 52px;max-width:1100px}
.u-pl-legal .u-pl-lhead .summary{margin:0;font-family:var(--serif);font-weight:400;font-size:clamp(30px,3.1vw,44px);line-height:1.12;letter-spacing:-.015em;max-width:28ch;overflow-wrap:break-word}
.u-pl-lhead .u-pl-s{display:block}
.u-pl-lhead .u-pl-s + .u-pl-s{margin-top:.12em}
.u-pl-lhead .u-pl-last{margin-top:.6em!important;font-style:italic;font-size:max(17px,.42em);line-height:1.4;letter-spacing:0;opacity:.7}
.u-pl-legal .legal-grid{grid-template-columns:220px minmax(0,720px);gap:0 clamp(32px,5vw,72px);padding:44px clamp(16px,4vw,56px) 72px;align-items:start}
.u-pl-toc{position:sticky;top:20px;align-self:start}
.u-pl-toc small{display:block;font:700 11.5px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;opacity:.55;margin:6px 0 12px}
.u-pl-toc ol{list-style:none;margin:0;padding:0}
.u-pl-toc a{display:grid;grid-template-columns:24px 1fr;gap:6px;padding:9px 0;border-bottom:1px solid var(--u-rule);color:var(--ink);text-decoration:none;font:500 14.5px/1.35 var(--sans);transition:color .2s}
.u-pl-toc a span{font:700 11.5px/1.6 var(--sans);color:var(--u-clay)}
.u-pl-toc a:hover{color:var(--u-clay)}
.u-pl-toc a[aria-current]{font-weight:700}
.u-pl-legal .legal-text .lsec{margin:0 0 40px;scroll-margin-top:20px}
.u-pl-legal .legal-text .lsec h2{font-family:var(--serif);font-weight:400;font-size:clamp(26px,2vw,30px);line-height:1.15;letter-spacing:-.01em;margin:0 0 10px}
.u-pl-legal .legal-text p{font-family:var(--serif);font-size:19px;line-height:1.7;margin:0 0 14px;max-width:none}
.u-pl-legal .legal-text p b{font-weight:600}
.u-pl-legal .legal-text a,.u-pl-support .legal-text a{color:inherit;text-decoration:underline;text-decoration-color:var(--u-clay);text-underline-offset:3px}
@media (prefers-reduced-motion:no-preference){html:has(body.u-pl-legal){scroll-behavior:smooth}}

/* Support */
.u-pl-hero{display:grid;grid-template-columns:minmax(0,39fr) minmax(0,61fr);min-height:clamp(360px,30vw,440px)}
.u-pl-hmark{background:#26221E url("house/support-bowl.jpg") center/cover no-repeat;display:grid;place-items:center;overflow:hidden}
.u-pl-hmark span{visibility:hidden}
.u-pl-hmark span{writing-mode:vertical-rl;font-family:"Shippori Mincho",serif;font-size:clamp(84px,10vw,150px);letter-spacing:.14em;color:#F6F5F1;opacity:.92}
.u-pl-hpaper{background:var(--ph,#ECEAE3);display:flex;flex-direction:column;justify-content:center;padding:48px clamp(24px,5vw,72px) 48px clamp(24px,4vw,56px)}
.u-pl-support .u-pl-hpaper .summary{margin:0;font-family:var(--serif);font-weight:400;font-size:clamp(24px,2.1vw,32.5px);line-height:1.35;letter-spacing:-.005em;max-width:34ch}
.u-pl-support .legal-grid{display:block;padding:48px clamp(16px,4vw,56px) 64px}
.u-pl-support .legal-text{max-width:none}
.u-pl-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,400px);gap:0 clamp(32px,4vw,64px);align-items:start}
.u-pl-support .legal-text .lsec{margin:0;padding:0;border:0}
.u-pl-support .legal-text .lsec h2{font-family:var(--serif);font-weight:400;font-size:clamp(28px,2.2vw,32px);line-height:1.1;letter-spacing:-.01em;margin:0 0 14px}
.u-pl-support .legal-text p{font-size:17px;line-height:1.6;margin:0 0 12px;max-width:74ch}
.u-pl-support #how > p.grey{color:var(--u-clay);opacity:1;font-size:14.5px;margin-top:14px}
.u-pl-nets{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:16px 0 18px;padding:0}
.u-pl-nets li{font:600 13.5px/1 var(--sans);padding:8px 13px;border-radius:99px;border:1px solid var(--u-rule)}
.u-pl-support .sup-addr{display:none!important}
.u-pl-addr{display:flex;gap:22px;align-items:center;background:#1B1A18;color:#F6F5F1;border-radius:6px;padding:18px;margin:6px 0 0}
[data-theme=dark] .u-pl-addr{box-shadow:inset 0 0 0 1px rgba(246,245,241,.16)}
.u-pl-support .u-pl-addr .sup-qr{margin:0;flex:none;text-align:center}
.u-pl-support .u-pl-addr .sup-qr img{width:120px;height:120px;border:0;border-radius:3px;background:#fff;padding:6px;box-sizing:border-box}
.u-pl-support .u-pl-addr .sup-qr p.grey{font-size:12px;line-height:1.3;margin:6px 0 0;color:rgba(246,245,241,.6);opacity:1}
.u-pl-acol{display:flex;flex-direction:column;align-items:flex-start;gap:12px;min-width:0}
.u-pl-acol small{font:700 11px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--u-hinoki)}
.u-pl-support .u-pl-acol code{font:500 clamp(13px,1.15vw,16px)/1.4 var(--mono,ui-monospace,monospace);letter-spacing:.02em;color:#F6F5F1;background:none;border:0;padding:0;word-break:break-all}
.u-pl-copy{font:600 14px/1 var(--sans);background:var(--u-hinoki);color:#1B1A18;border:0;border-radius:99px;padding:10px 16px;cursor:pointer;transition:transform .2s var(--u-ease),background .2s}
.u-pl-copy:hover{transform:translateY(-1px);background:#F0DDB8}
.u-pl-side > .lsec{border-top:2px solid var(--ink)!important;padding-top:18px!important}
.u-pl-side > .lsec + .lsec{margin-top:36px!important}
.u-pl-side .lsec h2{font-size:clamp(24px,1.8vw,28px)!important}
.u-pl-side p{font-size:15.5px!important}
.u-pl-side p.grey{font-family:var(--serif);font-style:italic;font-size:14.5px!important;opacity:.65;margin-top:18px}

/* ================================================================ narrower windows and phones */
@media (max-width:1100px){
  .u-pl-posters{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(300px,1fr);height:auto}
  .u-pl-posters.n1{grid-template-columns:minmax(0,1fr)}
  .u-pl-posters.n3 .u-pl-poster:first-child{grid-column:1/-1}
  .u-pl-month{grid-template-columns:120px minmax(0,1fr)}
  .u-pl-two{grid-template-columns:1fr}
  .u-pl-side{margin-top:44px}
}
@media (max-width:760px){
  .u-pl-head{display:block;padding:28px 16px 14px}
  .u-pl-head h1{font-size:clamp(32.5px,8.6vw,40px)}
  .u-pl-count{margin-top:10px;font-size:17px}
  .u-pl-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding:0 16px 2px;margin-bottom:18px}
  .u-pl-chips::-webkit-scrollbar{display:none}
  .u-pl-chips button{flex:none;font-size:15.5px;padding:10px 16px}
  .u-pl-nowbar{padding:10px 16px}
  .u-pl-posters,.u-pl-posters.n2,.u-pl-posters.n3,.u-pl-posters.n4{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;height:min(112vw,460px)}
  .u-pl-posters::-webkit-scrollbar{display:none}
  .u-pl-poster{flex:0 0 86%;scroll-snap-align:start}
  .u-pl-posters.n1 .u-pl-poster{flex-basis:100%}
  .u-pl-pname{font-size:clamp(28px,7.6vw,34px)}
  .u-pl-sec{padding:32px 16px 4px}
  .u-pl-month{display:block;margin-top:14px}
  .u-pl-mh{display:flex;align-items:baseline;gap:10px;padding:10px 0 4px}
  .u-pl-mh small{margin:0}
  .u-pl-row,.u-pl-on{grid-template-columns:52px minmax(0,1fr) auto;grid-template-areas:"d w c" "d u c";gap:2px 14px;padding:14px 0}
  .u-pl-day{grid-area:d;align-self:start}
  .u-pl-what{grid-area:w}.u-pl-until{grid-area:u;font-size:13.5px}.u-pl-cal{grid-area:c}
  .u-pl-on{grid-template-areas:"d d c" "w w c" "u u c"}
  .u-pl-on .u-pl-day{margin-bottom:6px}
  .u-pl-day b{font-size:24px}
  .u-pl-what b{font-size:20px}
  .u-pl-cal{width:44px;height:44px;padding:0;border-color:transparent;color:var(--u-clay);font-size:28px;font-weight:400;display:grid;place-items:center}
  .u-pl-cal .u-pl-cal-t{display:none}
  .u-pl-cal:hover{background:transparent;color:var(--u-clay)}
  .u-pl-lhead-in{padding:32px 16px 30px}
  .u-pl-legal .legal-grid{display:block;padding:0 16px 48px}
  .u-pl-toc{position:sticky;top:0;z-index:3;background:var(--bg);margin:0 -16px 24px;padding:10px 16px;border-bottom:1px solid var(--u-rule)}
  .u-pl-toc small{display:none}
  .u-pl-toc ol{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none}
  .u-pl-toc ol::-webkit-scrollbar{display:none}
  .u-pl-toc li{flex:none}
  .u-pl-toc a{display:inline-flex;gap:6px;border:1px solid var(--u-rule);border-radius:99px;padding:8px 12px;white-space:nowrap}
  .u-pl-toc a[aria-current]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
  .u-pl-toc a[aria-current] span{color:inherit}
  .u-pl-legal .legal-text .lsec{scroll-margin-top:70px}
  .u-pl-legal .legal-text p{font-size:18.5px}
  .u-pl-hero{grid-template-columns:1fr;min-height:0}
  .u-pl-hmark{height:200px}
  .u-pl-hmark span{writing-mode:horizontal-tb;font-size:96px}
  .u-pl-hpaper{padding:30px 16px 32px}
  .u-pl-support .legal-grid{padding:32px 16px 48px}
  .u-pl-addr{flex-direction:column;align-items:flex-start}
}

/* phone, as drawn: «Opening soon» follows the poster; the rest of what is on now comes after it */
@media (max-width:760px){
  .u-pl-body{display:flex;flex-direction:column}
  .u-pl-body > .u-pl-also{order:1}
}

/* Uchi Releases (releases.pen, frames "Uchi · Releases · index" AeD7l, "· page" K9b6CL, phone Y5lXQT and HCqrY; approved by
   the owner 2026-10-12; values read from ops/review/releases-2026-10-12/design/uchi-releases-*.png and DESIGN.md, because
   releases.pen was not the active Pencil file). The markup is the engine's releases step (engine/releases.py); every rule
   sits under .xr. Fonts are the magazine's locked pair: Fraunces (--serif) for heads, the site sans for text and spaced caps.
   The 1440 px frame's values are used as written; the phone frames apply at 600 px and under. */
main.xpage-releases{display:block;max-width:none;width:auto;margin:0;padding:0!important}
.xr{--rl-acc:var(--accent);--rl-on:#F1EAE0;--rl-dim:var(--ink-40);--rl-rule:var(--rule-soft);--rl-tile:color-mix(in srgb,var(--ink) 7%,var(--bg));
  --rl-line:var(--rule);--rl-head:var(--serif);--rl-hw:500;--rl-hls:-.015em;--rl-cap:var(--sans);--rl-capw:500;--rl-ls:.16em;--rl-r:0px;--rl-gut:32px;--rl-h1:170px;--rl-chip:13px;
  max-width:1440px;margin:0 auto;padding:0 var(--rl-gut) 72px;color:var(--ink);overflow-x:clip;font-family:var(--sans)}
.xr *{box-sizing:border-box}
:where(.xr) :where(h1,h2,p,ol,dl,dd,figure){margin:0}
:where(.xr) ol{padding:0;list-style:none}
:where(.xr) a{color:inherit;text-decoration:none}
.xr i{font-style:normal}
.xr svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;display:block}
.xr .xr-k,.xr .xr-cap{font:var(--rl-capw) 13px/1.3 var(--rl-cap);letter-spacing:var(--rl-ls);text-transform:uppercase}
.xr .xr-n-p{display:none}

/* ---------------------------------------------------------------- the crumb bar (both pages) */
.xr-crumb{display:flex;align-items:center;gap:12px;margin:0 calc(-1 * var(--rl-gut));padding:12px var(--rl-gut);border-top:1px solid var(--rl-rule);border-bottom:1px solid var(--rl-rule);font:var(--rl-capw) 13px/1.3 var(--rl-cap);letter-spacing:.2em;text-transform:uppercase}
.xr-crumb .xr-back{display:none}
.xr-cr-d{display:inline-flex;gap:12px;color:var(--rl-dim)}
.xr-cr-d a:first-child{color:var(--rl-acc)}
.xr-cr-d i{color:var(--rl-dim)}
.xr-cr-b{color:var(--ink)}

/* ---------------------------------------------------------------- the type tile: our colour block, the maker in the head face */
.xr-tile{position:relative;display:flex;flex-direction:column;justify-content:flex-end;flex:none;width:160px;height:106px;padding:10px 10px 12px;background:var(--rl-tile);color:var(--ink);border-radius:var(--rl-r);overflow:hidden}
.xr-tile::before{content:"";position:absolute;left:10px;top:10px;width:6px;height:6px;border-radius:50%;background:var(--rl-acc)}
.xr-tile small{display:none}
.xr-tile b{font:var(--rl-hw) 20px/1.05 var(--rl-head);letter-spacing:var(--rl-hls);overflow-wrap:anywhere}

/* ---------------------------------------------------------------- index: hero */
.xr-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:48px;padding:44px 0 36px}
.xr-hero-l{flex:1 1 auto;min-width:0;padding-top:46px}
.xr .xr-h1{font:var(--rl-hw) min(var(--rl-h1),11.8vw)/.9 var(--rl-head);letter-spacing:calc(var(--rl-hls) * 1.6)}
.xr-intro{display:flex;flex-direction:column;gap:22px;margin-top:30px;max-width:640px}
.xr .xr-kick{display:none}
.xr-lede{font:400 20px/1.4 var(--sans);color:var(--rl-dim)}
.xr .xr-count{color:var(--rl-acc);order:2}
.xr-latest{position:relative;flex:0 0 516px;height:300px;display:flex;flex-direction:column;justify-content:space-between;padding:24px;background:var(--rl-acc);color:var(--rl-on);border-radius:var(--rl-r)}
.xr-latest-top{display:block}
.xr-latest-top small{font:var(--rl-capw) 13px/1.3 var(--rl-cap);letter-spacing:var(--rl-ls);text-transform:uppercase}
.xr-latest .xr-pill,.xr-latest-b>small,.xr-latest-d{display:none}
.xr-latest-b{display:flex;flex-direction:column;gap:14px}
.xr-latest-b>b{font:var(--rl-hw) 32px/1.12 var(--rl-head);letter-spacing:var(--rl-hls);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.xr-latest-b>small.xr-latest-w{display:block;font:var(--rl-capw) 13px/1.3 var(--rl-cap);letter-spacing:var(--rl-ls);text-transform:uppercase}
.xr-latest .xr-btn{position:absolute;inset:0;min-height:0;padding:0;border-radius:var(--rl-r);background:transparent}
.xr-latest .xr-btn span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.xr-latest .xr-btn svg{display:none}
.xr-latest:has(.xr-btn:hover) .xr-latest-b>b{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}

/* ---------------------------------------------------------------- index: filters and the makers strip */
.xr-filters{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 calc(-1 * var(--rl-gut));padding:15px var(--rl-gut);border-top:1px solid var(--rl-rule);border-bottom:1px solid var(--rl-rule)}
.xr-filters>.xr-k{display:none}
.xr-chips{display:flex;flex-wrap:wrap;gap:10px}
.xr-chip{appearance:none;background:transparent;color:var(--ink);border:1px solid var(--rl-line);border-radius:30px;padding:8px 14px;font:var(--rl-capw) 13px/1.3 var(--rl-cap);letter-spacing:var(--rl-ls);text-transform:uppercase;cursor:pointer;white-space:nowrap;font-size:var(--rl-chip)}
.xr-chip .xr-c{color:var(--rl-acc);margin-left:4px}
.xr-chip[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.xr-chip[aria-pressed="true"] .xr-c{color:var(--bg)}
.xr-chip:not([aria-pressed="true"]):hover{border-color:var(--ink)}
.xr-sp{flex:1 1 0}
.xr-selects{display:flex;gap:10px}
.xr-sel{position:relative;display:flex;align-items:center;gap:10px;border:1px solid var(--rl-line);border-radius:30px;padding:0 14px}
.xr-sel .xr-k{color:var(--rl-dim)}
.xr-sel select{appearance:none;-webkit-appearance:none;background:transparent;border:0;color:var(--ink);font:var(--rl-capw) 13px/1.3 var(--rl-cap);letter-spacing:var(--rl-ls);text-transform:uppercase;padding:8px 26px 8px 0;margin:0;cursor:pointer;max-width:220px;field-sizing:content;font-size:var(--rl-chip)}
.xr-sel select option{text-transform:none;color:#1E1A15;background:#F4EFE6}
.xr-sel svg{position:absolute;right:12px;top:50%;width:14px;height:14px;margin-top:-7px;pointer-events:none}
.xr-makers{display:flex;align-items:center;flex-wrap:wrap;gap:8px 22px;margin:0 calc(-1 * var(--rl-gut));padding:12px var(--rl-gut);border-bottom:1px solid var(--rl-rule)}
.xr-makers .xr-k{color:var(--rl-dim);margin-right:2px}
.xr-makers a,.xr-makers .xr-more-n{font:400 16px/1.3 var(--sans);color:var(--ink)}
.xr-makers a:hover,.xr-makers a.on{color:var(--rl-acc)}

/* ---------------------------------------------------------------- index: the list and the rail */
.xr-body{display:grid;grid-template-columns:minmax(0,1fr) 336px;gap:48px;padding-top:34px}
.xr-month{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;padding:0 0 8px;border-bottom:2px solid var(--ink)}
.xr-month:not(:first-child){margin-top:30px}
.xr-month h2{font:var(--rl-hw) 42px/1.1 var(--rl-head);letter-spacing:var(--rl-hls)}
.xr-month small{font:var(--rl-capw) 13px/1.3 var(--rl-cap);letter-spacing:var(--rl-ls);text-transform:uppercase;color:var(--rl-dim);padding-bottom:6px}
.xr-month.xr-dim{opacity:.4}
.xr-row{border-bottom:1px solid var(--rl-rule)}
.xr-row-a{display:grid;grid-template-columns:70px 160px minmax(0,1fr);gap:24px;align-items:start;padding:18px 0 20px}
.xr-date{display:flex;gap:6px;padding-top:3px;font:var(--rl-capw) 13px/1.3 var(--rl-cap);letter-spacing:var(--rl-ls);text-transform:uppercase;color:var(--rl-dim)}
.xr-date b{font:inherit}
.xr-text{display:flex;flex-direction:column;gap:6px;min-width:0}
.xr-meta{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.xr-meta .xr-pill,.xr-pm{font:var(--rl-capw) 13px/1.3 var(--rl-cap);letter-spacing:var(--rl-ls);text-transform:uppercase;color:var(--rl-acc)}
.xr-feat{font:var(--rl-capw) 13px/1.3 var(--rl-cap);letter-spacing:var(--rl-ls);text-transform:uppercase;color:var(--ink)}
.xr-meta .xr-src{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.xr-pm{display:none}
.xr-t{font:var(--rl-hw) 26px/1.18 var(--rl-head);letter-spacing:var(--rl-hls);margin-top:2px}
.xr-t:lang(ja){font-family:"Shippori Mincho",var(--rl-head);font-size:23px;line-height:1.45}
.xr-line{font:400 16px/1.4 var(--sans);color:var(--rl-dim)}
.xr-src-p{font:var(--rl-capw) 12px/1.3 var(--rl-cap);letter-spacing:.2em;text-transform:uppercase;color:var(--rl-dim);margin-top:2px}
.xr-go{display:none}
.xr-row-a:hover .xr-t{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.xr-empty{padding:28px 0;color:var(--rl-dim)}
.xr-next{appearance:none;display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:52px;margin-top:16px;background:transparent;color:var(--ink);border:1.5px solid var(--ink);border-radius:26px;font:var(--rl-capw) 13px/1 var(--rl-cap);letter-spacing:var(--rl-ls);text-transform:uppercase;cursor:pointer}
.xr-next svg{width:14px;height:14px}
.xr-next:hover{background:var(--ink);color:var(--bg)}
.xr-rail{display:flex;flex-direction:column;gap:30px}
.xr-rb{border-top:2px solid var(--ink);padding-top:16px}
.xr-rb h2.xr-k{color:var(--rl-dim);margin-bottom:8px}
.xr-rb li{border-bottom:1px solid var(--rl-rule)}
.xr-rb li>a,.xr-rb li>span{display:flex;align-items:center;gap:12px;padding:9px 0}
.xr-rb li b{flex:0 0 150px;font:400 15px/1.25 var(--sans)}
.xr-rb li small{font:500 13px/1 var(--sans);color:var(--ink)}
.xr-yb{display:block;height:4px;border-radius:2px;background:var(--rl-acc)}
.xr-bytype li>span{justify-content:space-between}
.xr-bytype li b{flex:1 1 auto}
.xr-bytype li small{color:var(--rl-acc)}
.xr-bar{display:none}
.xr-rb p{font:400 15px/1.4 var(--sans);color:var(--rl-dim)}
.xr-rb a:hover b{color:var(--rl-acc)}

/* ---------------------------------------------------------------- the release page */
.xr-main-p{display:grid;grid-template-columns:600px minmax(0,1fr);gap:48px;align-items:start;padding:40px 0 56px}
.xr-sleeve{position:relative;display:flex;flex-direction:column;justify-content:space-between;height:560px;padding:24px;background:var(--rl-tile);border-radius:var(--rl-r);overflow:hidden}
.xr-sleeve::before{content:"";width:14px;height:14px;border-radius:50%;background:var(--rl-acc);flex:none}
.xr-sl-top{display:none}
.xr-big{display:flex;flex-direction:column;font:var(--rl-hw) 120px/1 var(--rl-head);letter-spacing:var(--rl-hls);margin-top:-14px;overflow-wrap:anywhere}
.xr-sl-bot{display:block;font:var(--rl-capw) 14px/1.3 var(--rl-cap);letter-spacing:var(--rl-ls);text-transform:uppercase}
.xr-sl-sep,.xr-sl-bot small:last-child{display:none}
.xr-sleeve-img{padding:0;justify-content:flex-start}
.xr-sleeve-img::before{display:none}
.xr-sleeve-img img{width:100%;height:100%;object-fit:cover}
.xr-sleeve-img figcaption{position:absolute;left:12px;bottom:10px;color:#fff;text-shadow:0 1px 2px #000}
.xr-copy{display:flex;flex-direction:column;min-width:0}
.xr-tags{display:flex;flex-wrap:wrap;gap:10px;font:var(--rl-capw) 14px/1.3 var(--rl-cap);letter-spacing:var(--rl-ls);text-transform:uppercase;color:var(--rl-acc)}
.xr-tags .xr-pill:not(.xr-pill-hi):not(.xr-pill-b){display:none}
.xr-tags a:hover{text-decoration:underline}
.xr-h1p{font:var(--rl-hw) 52px/1.06 var(--rl-head);letter-spacing:var(--rl-hls);margin-top:18px}
.xr-brief{font:400 20px/1.42 var(--sans);margin-top:26px}
.xr-facts{margin-top:22px;border-top:2px solid var(--ink);padding-top:14px}
.xr-facts>h2.xr-k{color:var(--rl-dim)}
.xr-fact{display:grid;grid-template-columns:158px minmax(0,1fr);gap:0;padding:11px 0 12px;border-bottom:1px solid var(--rl-rule)}
.xr-fact:first-child{padding-top:6px}
.xr-fact dt{font:var(--rl-capw) 13px/1.6 var(--rl-cap);letter-spacing:var(--rl-ls);text-transform:uppercase;color:var(--rl-dim)}
.xr-fact dd{font:400 17px/1.4 var(--sans)}
.xr-links{display:flex;flex-direction:column;gap:12px;margin-top:22px}
.xr-btn{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:14px 22px;border-radius:28px;font:600 19px/1.2 var(--sans);transition:filter .2s}
.xr-btn svg{flex:none;width:18px;height:18px}
.xr-off{background:var(--rl-acc);color:var(--rl-on)}
.xr-kit{border:1.5px solid var(--ink)}
.xr-btn:hover{filter:brightness(1.08)}
.xr-note{font:400 13px/1.4 var(--sans);color:var(--rl-dim);margin-top:30px}
.xr-video{padding:0 0 48px}
.xr-sec-h{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding-bottom:10px;border-bottom:2px solid var(--ink);margin-bottom:18px}
.xr-sec-h h2{font:var(--rl-hw) 42px/1.1 var(--rl-head)}
.xr-sec-h small{color:var(--rl-dim)}
.xr-player{position:relative;aspect-ratio:16/9;background:var(--rl-tile);border-radius:var(--rl-r);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:20px;text-align:center;overflow:hidden}
.xr-player.on{padding:0}.xr-player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.xr-play{appearance:none;width:72px;height:72px;border-radius:50%;border:0;background:var(--rl-acc);color:var(--rl-on);padding:22px;cursor:pointer}
.xr-play svg{fill:currentColor;stroke:none}
.xr-play-l{font:var(--rl-hw) 22px/1.2 var(--rl-head)}
.xr-legal{font:400 13px/1.4 var(--sans);color:var(--rl-dim);max-width:520px}.xr-legal a{text-decoration:underline}
.xr-morefrom{margin:0 calc(-1 * var(--rl-gut)) -72px;padding:44px var(--rl-gut) 56px;background:color-mix(in srgb,var(--bg) 82%,#000)}
.xr-mf-h{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;padding-bottom:8px;border-bottom:2px solid var(--ink)}
.xr-mf-h br{display:none}
.xr-mf-h h2{font:var(--rl-hw) 46px/1.1 var(--rl-head);letter-spacing:var(--rl-hls)}
.xr-mf-h .xr-k{color:var(--rl-acc);padding-bottom:8px;white-space:nowrap}
.xr-more-note{font:400 16px/1.4 var(--sans);color:var(--rl-dim);margin-top:24px}
.xr-cards{display:grid;grid-template-columns:repeat(3,minmax(0,442px));gap:24px;margin-top:24px}
.xr-card{display:flex;flex-direction:column;gap:12px}
.xr-tile-c{width:100%;height:200px}
.xr-card small.xr-k{color:var(--rl-acc);margin-top:6px}
.xr-card-t{font:var(--rl-hw) 24px/1.15 var(--rl-head);letter-spacing:var(--rl-hls)}
.xr-card-t:lang(ja){font-family:"Shippori Mincho",var(--rl-head);font-size:21px;line-height:1.45}
.xr-card:hover .xr-card-t{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}

/* ---------------------------------------------------------------- between the frames */
@media (max-width:1240px){
  .xr-latest{flex-basis:420px}
  .xr-body{grid-template-columns:minmax(0,1fr) 280px;gap:36px}
  .xr-main-p{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .xr-big{font-size:clamp(64px,8.4vw,120px)}
}
@media (max-width:900px){
  .xr-hero{flex-direction:column;gap:28px}
  .xr-hero-l{padding-top:10px}
  .xr-latest{flex:none;width:100%;height:auto;min-height:220px;gap:40px}
  .xr-body{grid-template-columns:minmax(0,1fr)}
  .xr-rail{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:28px}
  .xr-main-p{grid-template-columns:minmax(0,1fr)}
  .xr-sleeve{height:420px}
  .xr-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ---------------------------------------------------------------- the phone frames */
@media (max-width:600px){
  .xr{--rl-gut:16px;padding-bottom:40px}
  .xr .xr-n-d{display:none}.xr .xr-n-p{display:inline}
  .xr .xr-month .xr-n-d,.xr .xr-more-note .xr-n-d,.xr .xr-mf-h .xr-n-d{display:inline}.xr .xr-month .xr-n-p,.xr .xr-more-note .xr-n-p,.xr .xr-mf-h .xr-n-p{display:none}
  .xr-crumb{padding:12px var(--rl-gut)}
  .xr-hero{padding:24px 0 28px;gap:16px}
  .xr-hero-l{padding-top:0}
  .xr .xr-h1{font-size:76px}
  .xr-intro{gap:16px;margin-top:14px}
  .xr-lede{font-size:17px}
  .xr .xr-count{line-height:1.5}
  .xr-latest{min-height:0;padding:16px;gap:14px}
  .xr-latest-b{gap:8px}
  .xr-latest-b>b{font-size:22px}
  .xr-filters{padding:14px var(--rl-gut);gap:12px}
  .xr-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 calc(-1 * var(--rl-gut));padding:0 var(--rl-gut);width:calc(100% + 2 * var(--rl-gut))}
  .xr-chips::-webkit-scrollbar{display:none}
  .xr-sp{display:none}
  .xr-selects{width:100%}
  .xr-sel{flex:1 1 0;min-width:0}
  .xr-sel select{width:100%;max-width:none}
  .xr-makers{display:none}
  .xr-body{padding-top:28px;display:block}
  .xr-rail{display:none}
  .xr-month h2{font-size:30px}
  .xr-month:not(:first-child){margin-top:24px}
  .xr-row-a{grid-template-columns:96px minmax(0,1fr);gap:12px;padding:14px 0}
  .xr-date{display:none}
  .xr-tile{width:96px;height:64px;padding:6px 8px 8px}
  .xr-tile::before{left:9px;top:10px}
  .xr-tile b{font-size:12px;line-height:1.15}
  .xr-meta{display:none}
  .xr-pm{display:block}
  .xr-t{font-size:19px;margin-top:0}
  .xr-t:lang(ja){font-size:17px}
  .xr-line{display:none}
  .xr-next{border:0;height:44px;margin-top:8px;color:var(--rl-acc)}
  .xr-next:hover{background:transparent;color:var(--rl-acc)}
  .xr-main-p{display:flex;flex-direction:column;align-items:stretch;gap:0;padding:20px 0 32px}
  .xr-copy{display:contents}
  .xr-tags{order:1;font-size:12px;letter-spacing:.14em;gap:8px}
  .xr-h1p{order:2;font-size:28px;margin:12px 0 18px}
  .xr-sleeve{order:3;height:240px;padding:24px}
  .xr-big{font-size:min(76px,calc(600px / var(--n, 6)));margin-top:0}
  .xr-brief{order:4;font-size:17px;margin-top:22px}
  .xr-facts{order:5}
  .xr-fact{grid-template-columns:108px minmax(0,1fr);padding:9px 0}
  .xr-fact dt{font-size:12px}
  .xr-fact dd{font-size:15px}
  .xr-links{order:6}
  .xr-btn{min-height:50px;font-size:16px;padding:12px 18px}
  .xr-note{order:7;margin-top:16px}
  .xr-page .xr-cr-d a:first-child,.xr-page .xr-cr-d a:first-child+i{display:none}
  .xr-page .xr-cr-d a:nth-child(3){color:var(--rl-acc)}
  .xr-morefrom{margin-bottom:-40px;padding:28px var(--rl-gut) 32px}
  .xr-mf-h h2{font-size:24px}
  .xr-mf-h .xr-k{display:none}
  .xr-more-note{font-size:14px;margin-top:12px}
  .xr-cards{display:block;margin-top:8px}
  .xr-card{display:grid;grid-template-columns:96px minmax(0,1fr);grid-template-rows:auto 1fr;column-gap:12px;row-gap:4px;padding:14px 0;border-bottom:1px solid var(--rl-rule)}
  .xr-tile-c{grid-row:1/3;width:96px;height:64px}
  .xr-card small.xr-k{margin-top:0}
  .xr-card-t{font-size:19px}
  .xr-sec-h h2{font-size:28px}
}

/* ---------------------------------------------------------------- Uchi only (left out of the sheets made from this one) */
/* the frames set Fraunces at its text optical size, which is wider and sturdier than the browser's automatic display size */
.xr :is(.xr-h1,.xr-month h2,.xr-t,.xr-tile b,.xr-latest-b>b,.xr-big,.xr-h1p,.xr-mf-h h2,.xr-card-t,.xr-sec-h h2,.xr-play-l){font-variation-settings:"opsz" 9}

/* Uchi Partner kit, /partners/ (reference brand/uchi/_page C1nE4, parts P553g hero and GqLPa body, 2026-10-23).
   Laid out like the story page: the picture edge to edge with the headline on it, then kit | text | in the kit.
   The picture is ours and drawn here: the dark room, shoji lines, a hinoki glow and the door plate (the kit's hyosatsu
   SVG, inline in the page). Every rule sits under .upk; fonts are the locked pair (Fraunces --serif, the site sans). */
main.xpage-partners{display:block;max-width:none;width:auto;margin:0;padding:0!important}
.upk{--upk-dark:#1B1A18;--upk-washi:#F6F5F1;--upk-box:color-mix(in srgb,var(--ink) 6%,var(--bg));--upk-gut:clamp(16px,3.9vw,56px);color:var(--ink);overflow-x:clip}
.upk *{box-sizing:border-box}
:where(.upk) :where(h1,h2,h3,p,ol,ul,figure,blockquote){margin:0}
.upk-defs{position:absolute;width:0;height:0;overflow:hidden}
.upk-vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.upk .upk-k{font:700 11.5px/1.3 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--u-clay)}

/* ---------------------------------------------------------------- the picture with the headline on it */
.upk-hero{position:relative;display:flex;align-items:flex-end;height:640px;overflow:hidden;isolation:isolate;color:var(--upk-washi);
  background:linear-gradient(180deg,#2A2826 0%,#1B1A18 100%)}
.upk-grid{position:absolute;top:0;bottom:0;left:43%;right:0;z-index:-3;
  background-image:linear-gradient(90deg,rgba(246,245,241,.085) 1px,transparent 1px),linear-gradient(180deg,rgba(246,245,241,.085) 1px,transparent 1px);
  background-size:95px 120px;background-position:0 0;border-left:1px solid rgba(246,245,241,.085)}
.upk-glow{position:absolute;z-index:-2;left:calc(77.8% - 270px);top:40px;width:540px;height:540px;border-radius:50%;
  background:radial-gradient(closest-side,rgba(228,204,159,.3),rgba(228,204,159,.12) 55%,transparent)}
.upk-plate{position:absolute;z-index:-1;left:calc(77.8% - 75px);top:100px;width:150px;height:420px;filter:drop-shadow(0 18px 40px rgba(0,0,0,.45))}
.upk-plate-svg{display:block;width:100%;height:100%}
.upk-plate-shade{position:absolute;inset:0;border-radius:4px;background:linear-gradient(180deg,transparent 48%,rgba(27,26,24,.14) 72%,rgba(27,26,24,.42));pointer-events:none}
.upk-shade{position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,transparent 52%,rgba(17,16,15,.55) 100%),linear-gradient(90deg,rgba(17,16,15,.35),transparent 45%)}
.upk-cap{display:flex;flex-direction:column;gap:14px;padding:0 var(--upk-gut) 54px;max-width:1040px}
.upk .upk-kick{font:700 12px/1.3 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--u-hinoki)}
.upk .upk-kick span{margin:0 .55em}
.upk .upk-h1{font-family:var(--serif);font-weight:400;font-size:clamp(34px,4vw,57.5px);line-height:1.08;letter-spacing:-.015em;color:var(--upk-washi)}
.upk-h1 span{display:block;text-wrap:balance}

/* ---------------------------------------------------------------- three columns, as on a story */
.upk-body{display:grid;grid-template-columns:220px minmax(0,696px) 300px;justify-content:space-between;gap:56px;max-width:1440px;margin:0 auto;padding:56px var(--upk-gut) 64px;align-items:start}

/* the kit: two buttons */
.upk-kit{display:flex;flex-direction:column;gap:10px}
.upk-kit .upk-k{margin-bottom:2px}
.upk .upk-btn{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:16px 15px 17px;text-decoration:none;transition:background-color .2s,color .2s,border-color .2s}
.upk .upk-btn b{font:600 14.5px/1.25 var(--sans)}
.upk .upk-btn small{font:400 13px/1.35 var(--sans);opacity:.82}
.upk .upk-i{width:22px;height:22px;margin-bottom:6px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.upk .upk-btn-clay{background:var(--u-clay);color:#F6F5F1;border:1.5px solid var(--u-clay)}
.upk .upk-btn-clay:hover{background:#B4532E;border-color:#B4532E;color:#F6F5F1}
.upk .upk-btn-line{background:transparent;color:var(--ink);border:1.5px solid color-mix(in srgb,var(--ink) 75%,transparent)}
.upk .upk-btn-line:hover{border-color:var(--u-clay);color:var(--u-clay)}

/* the text */
.upk-text{min-width:0;font-family:var(--serif)}
.upk-text > p{font-size:19px;line-height:1.63;margin:0 0 22px}
.upk-text > .upk-k{margin:0 0 16px}
.upk .upk-lede{font-size:26.5px;line-height:1.36;font-weight:500;margin-bottom:30px}
.upk .upk-tags{font:700 12.5px/1.95 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--u-clay);margin-bottom:26px}
.upk-text a{color:inherit;text-decoration:underline;text-decoration-color:var(--u-clay);text-decoration-thickness:1px;text-underline-offset:3px}
.upk-text a:hover{color:var(--u-clay)}
.upk-steps{list-style:none;padding:0;margin:0 0 6px!important}
.upk-steps li{display:grid;grid-template-columns:46px minmax(0,1fr);align-items:baseline;padding:14px 0 24px}
.upk-steps b{font:500 26px/1 var(--serif);color:var(--u-clay)}
.upk-steps p{font-size:19px;line-height:1.6}
.upk-steps .upk-step5 p{font-weight:600}
.upk-pq{margin:34px 0 40px!important;text-align:center}
.upk-pq p{display:inline-block;font:italic 500 clamp(32px,3.2vw,46px)/1.25 var(--serif);letter-spacing:-.01em;position:relative;padding:22px 0}
.upk-pq p::before,.upk-pq p::after{content:"";position:absolute;left:50%;width:80px;height:1px;margin-left:-40px;background:var(--u-clay)}
.upk-pq p::before{top:0}
.upk-pq p::after{bottom:0}
.upk-box{background:var(--upk-box);padding:24px 26px 22px;margin:20px 0 20px}
.upk .upk-tpl{font:italic 400 18px/1.68 var(--serif);margin:0 0 16px}
.upk .upk-cbtn{display:inline-flex;align-items:center;min-height:38px;padding:9px 22px;border:0;border-radius:99px;background:var(--ink);color:var(--bg);font:600 14px/1.2 var(--sans);cursor:pointer;transition:background-color .2s}
.upk .upk-cbtn:hover{background:var(--u-clay);color:#F6F5F1}
.upk .upk-cbtn.is-done{background:var(--u-clay);color:#F6F5F1}
.upk-note{border:2px solid var(--u-clay);padding:24px 24px 26px}
.upk-note .upk-k{margin-bottom:8px}
.upk-note p{font:500 21px/1.42 var(--serif)}

/* in the kit */
.upk-in{min-width:0}
.upk .upk-in-h{font:400 26.5px/1.2 var(--serif);letter-spacing:-.01em;margin-bottom:26px}
.upk-list{list-style:none;padding:0;display:flex;flex-direction:column;gap:28px}
.upk-list li{display:grid;grid-template-columns:76px minmax(0,1fr);gap:14px;align-items:start}
.upk-tile{display:grid;place-items:center;width:76px;height:76px;border:1px solid color-mix(in srgb,var(--ink) 14%,transparent)}
.upk-tile svg{width:34px;height:40px;fill:currentColor}
.upk-t-washi{background:#F6F5F1;color:#1B1A18}
.upk-t-hinoki{background:#E4CC9F;color:#1B1A18}
.upk-t-clay{background:#C9623A;color:#F6F5F1}
.upk-t-indigo{background:#24365C;color:#F6F5F1}
.upk-t-paper{background:#ECEAE3;color:#1B1A18}
.upk-list h3{font:500 18px/1.25 var(--serif);margin:3px 0 4px}
.upk-list p{font:400 13.5px/1.45 var(--sans);opacity:.72}

/* focus */
.upk a:focus-visible,.upk button:focus-visible{outline:2px solid var(--u-clay);outline-offset:3px}
.upk .upk-btn-clay:focus-visible{outline-color:var(--ink)}

/* ---------------------------------------------------------------- narrower windows: the kit goes on top */
@media (max-width:1180px){
  .upk-body{grid-template-columns:minmax(0,1fr) 280px;gap:40px 48px}
  .upk-kit{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;align-items:stretch}
  .upk-kit .upk-k{flex:1 0 100%}
  .upk .upk-btn{flex:0 1 300px}
}
@media (max-width:860px){
  .upk-hero{height:560px}
  .upk-grid{left:30%}
  .upk-glow{left:calc(72% - 220px);width:440px;height:440px;top:30px}
  .upk-plate{left:calc(72% - 60px);top:70px;width:120px;height:336px}
  .upk-body{grid-template-columns:minmax(0,1fr);gap:40px}
  .upk-in{border-top:2px solid var(--ink);padding-top:14px}
}
/* phones: the plate stands above the headline, one column */
@media (max-width:600px){
  .upk-hero{height:auto;min-height:600px;align-items:flex-end}
  .upk-grid{left:0;background-size:78px 100px}
  .upk-glow{left:50%;top:10px;width:360px;height:360px;margin-left:-180px}
  .upk-plate{left:50%;top:44px;width:100px;height:280px;margin-left:-50px}
  .upk-shade{background:linear-gradient(180deg,transparent 40%,rgba(17,16,15,.82) 72%,rgba(17,16,15,.9))}
  .upk-cap{padding:0 16px 30px;gap:12px}
  .upk .upk-kick{font-size:11.5px;letter-spacing:.14em;line-height:1.6}
  .upk .upk-kick span{margin:0 .35em}
  .upk .upk-h1{font-size:33px;line-height:1.1}
  .upk-body{padding:32px 16px 48px;gap:36px}
  .upk-kit{flex-direction:column}
  .upk .upk-btn{flex:none}
  .upk .upk-lede{font-size:22.5px;line-height:1.4}
  .upk-text > p,.upk-steps p{font-size:18px}
  .upk-steps li{grid-template-columns:36px minmax(0,1fr);padding:10px 0 16px}
  .upk-steps b{font-size:23px}
  .upk-box{padding:20px 18px}
  .upk .upk-tpl{font-size:17px}
  .upk .upk-cbtn{width:100%;justify-content:center}
  .upk-note{padding:20px 18px 22px}
  .upk-note p{font-size:19px}
}

@media (prefers-reduced-motion:reduce){.upk .upk-btn,.upk .upk-cbtn{transition:none}}

/* Uchi features (theme module): our own hand-made features under sites/uchi/pages/feature/, first one İlker Ortaç's
   LIMIT (uchi.pen "Uchi · Artist feature · LIMIT, İlker Ortaç", desktop + phone, approved 2026-10-26). A full-bleed picture
   with nothing written on it, the title under it, questions marked 一二三四, pictures that run to the page edge beside the
   answers, a pull quote with no band behind it, the artist's note on a hairline. Colours and fonts are the site's own, so
   the page follows the reader's light or dark theme. */
main.xpage-feature{max-width:none;margin:0;padding:0}
.uf{--uf-pad:clamp(20px,3.9vw,56px);--uf-dim:color-mix(in srgb,var(--ink) 62%,transparent);--uf-body:color-mix(in srgb,var(--ink) 84%,transparent);
  color:var(--ink);font-family:var(--serif)}
.uf a{color:inherit}
.uf [lang=ja]{font-family:"Shippori Mincho",var(--serif)}
.uf img{display:block;width:100%;height:100%;object-fit:cover}
.uf p{margin:0}

/* the picture at the top, edge to edge, nothing on it */
.uf-hero{margin:0;height:clamp(420px,57vw,820px);background:#1B1A18}
.uf-credit{display:flex;justify-content:space-between;gap:6px 24px;flex-wrap:wrap;padding:12px var(--uf-pad);font:400 12.5px/1.4 var(--sans);color:var(--uf-dim)}

/* the title under it */
.uf-title{padding:clamp(28px,3.9vw,56px) var(--uf-pad) 0}
.uf-k{font:700 12.5px/1.4 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--u-clay)}
.uf-k [lang=ja]{letter-spacing:.05em;text-transform:none;font-weight:400}
.uf-k-dim{color:var(--uf-dim)}
.uf-h1{margin:14px 0 18px;font:600 clamp(96px,15.3vw,220px)/.88 var(--serif);letter-spacing:-.035em}
.uf-dek{max-width:900px;font-size:clamp(21px,2.2vw,32px);line-height:1.3;color:var(--uf-body)}

/* questions and answers */
.uf-qn{display:flex;align-items:center;gap:12px;font:700 12px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--u-clay)}
.uf-qn [lang=ja]{font-size:clamp(24px,2.1vw,30px);font-weight:600;letter-spacing:0}
.uf-q h2{margin:16px 0 24px;font:italic 600 clamp(26px,2.65vw,38px)/1.18 var(--serif);letter-spacing:-.01em;text-wrap:balance}
.uf-q p:not(.uf-qn):not(.uf-cap):not(.uf-end){font-size:clamp(17px,1.4vw,20px);line-height:1.7;color:var(--uf-body)}
.uf-q p + p{margin-top:1.1em}
.uf-col{max-width:760px;margin:0 auto;padding:clamp(56px,7.6vw,110px) var(--uf-pad)}
.uf-cap{margin-top:22px!important;font:400 12.5px/1.45 var(--sans);color:var(--uf-dim)}

/* a picture that runs to the page edge, the answer beside it */
.uf-split{display:grid;grid-template-columns:minmax(0,740fr) minmax(0,700fr);min-height:clamp(560px,61vw,880px)}
.uf-split-r{grid-template-columns:minmax(0,700fr) minmax(0,740fr)}
.uf-split .uf-bleed{margin:0;background:#1B1A18}
.uf-split .uf-q{align-self:center;padding:56px clamp(40px,6.7vw,96px) 56px clamp(32px,5.6vw,80px)}
.uf-split-r .uf-q{padding:56px clamp(32px,5.6vw,80px) 56px clamp(40px,6.7vw,96px)}

/* the pull quote: no band behind it */
.uf-quote{margin:0;padding:clamp(72px,9vw,130px) clamp(24px,11.8vw,170px);text-align:center}
.uf-quote::before{content:"“";display:block;height:.5em;font:600 clamp(72px,8.3vw,120px)/1 var(--serif);color:var(--u-clay)}
.uf-quote p{font:italic 500 clamp(28px,3.75vw,54px)/1.18 var(--serif);letter-spacing:-.015em;text-wrap:balance}
.uf-quote .uf-quote-more{margin:26px auto 0;max-width:620px;font:400 clamp(17px,1.4vw,20px)/1.6 var(--serif);letter-spacing:0;color:var(--uf-body)}
.uf-quote footer{margin-top:28px;font:700 12px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--u-clay)}

.uf-end{margin-top:40px!important;font:400 13px/1.55 var(--sans);color:var(--uf-dim)}
.uf-mark{display:block;width:12px;height:12px;margin-bottom:14px;background:var(--u-clay)}

/* the artist, on a hairline */
.uf-about{display:grid;grid-template-columns:360px minmax(0,1fr);gap:56px;margin:0 var(--uf-pad);padding:40px 0 72px;border-top:1px solid var(--u-rule)}
.uf-about h2{margin:10px 0 0;font:600 clamp(30px,2.65vw,38px)/1.1 var(--serif)}
.uf-about p:not(.uf-k){font-size:clamp(17px,1.4vw,20px);line-height:1.6;color:var(--uf-body)}
.uf-links{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 0;padding:0;list-style:none}
.uf-links a{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:10px 16px;border:1px solid var(--u-rule);border-radius:30px;font:400 13px/1 var(--sans);text-decoration:none}
.uf-links b{font:700 12px/1 var(--sans);text-transform:uppercase;color:var(--u-clay)}
.uf-links a:hover,.uf-links a:focus-visible{border-color:var(--u-clay)}

/* phone: one column, pictures full width, in the order of the phone frame */
@media (max-width:820px){
  .uf-hero{height:clamp(380px,113vw,520px)}
  .uf-credit{flex-direction:column;padding:8px 20px}
  .uf-split,.uf-split-r{grid-template-columns:minmax(0,1fr);min-height:0}
  .uf-split .uf-bleed{aspect-ratio:1/1;order:0}
  .uf-split-r .uf-bleed{order:-1;aspect-ratio:1400/1316}
  .uf-split .uf-q,.uf-split-r .uf-q{padding:44px 20px 40px}
  .uf-col{padding:44px 20px 40px}
  .uf-quote{padding:24px 28px 48px}
  .uf-about{grid-template-columns:minmax(0,1fr);gap:14px;margin:0 20px}
  .uf-links{flex-direction:column}
  .uf-links a{justify-content:space-between}
}

.rg{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.rg button{font-size:16.5px;padding:5px 12px;border:1px solid var(--rule);border-radius:999px;background:none;color:var(--ink);cursor:pointer}
.rg button[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.sound .one{padding:0 16px}
.sound.single .day{margin-top:0;border-top:0}
.sound.single .foot{display:none}
.sound.single{padding:24px 0 26px !important}
.sound .one-head{padding:6px 0 16px;border-left:6px solid var(--c1,var(--accent));padding-left:14px;margin:0 0 4px}
.sound .one-head .mood{font-size:14.6px;border:1px solid var(--ink);border-radius:9999px;padding:4px 10px;display:inline-block;line-height:1;margin-bottom:12px}
.sound .one-head h2{font-size:32px;line-height:1.05;margin:0 0 8px;font-family:var(--serif,inherit)}
.sound .one-head p{margin:0;font-size:19.5px;line-height:1.35;color:var(--ink-40)}
.sound .one-embed iframe{width:100%;height:352px;border:0;border-radius:12px;display:block}
.sound .one-open{display:inline-block;margin-top:12px;font-size:16.5px;color:var(--ink)}
.sound .moods{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:20px 16px;padding:0 16px}
.sound .mood-card{min-width:0;display:flex;flex-direction:column}
.sound .mood-card .one-head{border-left-width:4px;padding-left:12px}
.sound .mood-card .one-head h2{font-size:24px}
.sound .mood-card .one-head p{font-size:18px;flex:1}
.sound .mood-card .one-embed{margin-top:auto}
.sound .mood-card .one-embed iframe{height:352px}
.sound.moods-mode .one-head{margin-bottom:10px}
.sound.moods-mode{max-width:none !important;margin:0 !important}
.sound.moods-mode .head{padding:8px 16px 0}
@media(max-width:1400px){.sound .moods{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:960px){.sound .moods{grid-template-columns:1fr;gap:28px}.sound .mood-card .one-embed iframe{height:352px}}