.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;

  --sans:"Manrope","Hiragino Sans","Zen Kaku Gothic New","Inter","Helvetica Neue",Helvetica,Arial,sans-serif; --serif:"Fraunces","Hiragino Mincho ProN","Yu Mincho","Inter","Helvetica Neue",Helvetica,Arial,sans-serif; --mono:"Manrope","SF Mono",Menlo,Consolas,monospace;
  --bg:#FFFCF7; --ink:#1F1915; --ink-40:rgba(31,25,21,.66); --ink-25:rgba(31,25,21,.64); --rule:rgba(31,25,21,.4); --rule-soft:rgba(31,25,21,.12);
  --ph:#F3E9DC; --bar:#FFFFFF; --bar-ink:#1F1915; --bar-60:rgba(31,25,21,.62); --bar-rule:rgba(31,25,21,.1);
  --accent:#C4451A; --accent-ink:#FFFFFF; --accent-40:rgba(196,69,26,.4); --accent-rule:rgba(196,69,26,.3);
  --pill:#C4451A; --pill-ink:#FFFFFF; --up:#C4451A;
  --ink-rgb:31,25,21; --bg-rgb:255,252,247;
  --board:#2B1A12; --board-ink:#FFF3E8; --board-dim:rgba(255,243,232,.7); --board-rule:rgba(255,243,232,.25); --board-mq:#2B1A12; --board-mq-ink:#FFF3E8; --board-mq-dim:rgba(255,243,232,.55); --board-mq-accent:#FF8A57; --accent-text:#B8400F;

}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){

  --bg:#171310; --ink:#F3EDE4; --ink-40:rgba(243,237,228,.6); --ink-25:rgba(243,237,228,.5); --rule:rgba(243,237,228,.28); --rule-soft:rgba(243,237,228,.1);
  --ph:#241D18; --bar:#100D0B; --bar-ink:#F3EDE4; --bar-60:rgba(243,237,228,.62); --bar-rule:rgba(255,255,255,.12);
  --accent:#FF8A57; --accent-ink:#1A0F08; --accent-40:rgba(255,138,87,.4); --accent-rule:rgba(255,138,87,.3);
  --pill:#FF8A57; --pill-ink:#1A0F08; --up:#FF8A57;
  --ink-rgb:243,237,228; --bg-rgb:23,19,16;
  --board:#100D0B; --board-ink:#F3EDE4; --board-dim:rgba(243,237,228,.6); --board-rule:rgba(243,237,228,.2); --board-mq:#171310; --board-mq-ink:#F3EDE4; --board-mq-dim:rgba(243,237,228,.55); --board-mq-accent:#FF8A57; --accent-text:#FF9C6E;

}}
:root[data-theme="dark"]{

  --bg:#171310; --ink:#F3EDE4; --ink-40:rgba(243,237,228,.6); --ink-25:rgba(243,237,228,.5); --rule:rgba(243,237,228,.28); --rule-soft:rgba(243,237,228,.1);
  --ph:#241D18; --bar:#100D0B; --bar-ink:#F3EDE4; --bar-60:rgba(243,237,228,.62); --bar-rule:rgba(255,255,255,.12);
  --accent:#FF8A57; --accent-ink:#1A0F08; --accent-40:rgba(255,138,87,.4); --accent-rule:rgba(255,138,87,.3);
  --pill:#FF8A57; --pill-ink:#1A0F08; --up:#FF8A57;
  --ink-rgb:243,237,228; --bg-rgb:23,19,16;
  --board:#100D0B; --board-ink:#F3EDE4; --board-dim:rgba(243,237,228,.6); --board-rule:rgba(243,237,228,.2); --board-mq:#171310; --board-mq-ink:#F3EDE4; --board-mq-dim:rgba(243,237,228,.55); --board-mq-accent:#FF8A57; --accent-text:#FF9C6E;

}
*{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}
.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}
.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}
.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-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,.head .h1,.fsig,.fr-sig,.colhead > div span.l,.menu .ch,.tabs button span,.about-text h2,.post h2,.thumb h2,h1.story,.lead h2,.lead .note,.ev h2,.single h1,.dhead h1,.wire a,.subhead{font-family:var(--serif);font-weight:700;letter-spacing:-.015em;text-transform:none}
.pill,.head .sub,.meta,.subhead .grey,.tabs,.tabs button,.menu .small,.board .track span i,.board .track span.dim,.colhead > div span:not(.l),.crumb,.one-head .mood{font-family:var(--mono);letter-spacing:.02em}
.pill{border-radius:0;text-transform:none;font-size:14.6px;letter-spacing:.02em;border-radius:9999px}
.logo{font-family:var(--serif);font-weight:700;letter-spacing:-.01em;text-transform:none}
.bar,.menu,button{font-family:var(--mono)}
.head .sub,.meta{text-transform:none}
.colhead > div{border-top:3px solid var(--ink)}
.post,.thumb{border-top:1px solid var(--rule-soft)}
.lead h2::before,.post h2::before{content:'';display:inline-block;width:.5em;height:.5em;border-radius:50%;background:var(--accent);margin:0 .35em 0 0;vertical-align:baseline;transform:translateY(-.05em)}
:root[data-theme="dark"] .board{border-top:3px solid var(--accent)}
.post .pic.noimg,.thumb .pic.noimg{display:none}
.logo::after{content:'';display:inline-block;width:.5em;height:.5em;border-radius:50%;background:var(--accent);margin-left:.4em;vertical-align:.12em;box-shadow:0 0 .6em var(--accent);animation:led 2.4s steps(2,start) infinite}
@keyframes led{to{visibility:hidden}}
@media (prefers-reduced-motion:reduce){.logo::after{animation:none}}
.head-row{flex-wrap:wrap}
.head-row a,.head-row button{white-space:normal;text-align:right}
#col-japan .head.head-row > div{flex:1 1 100%}
#col-japan .head.head-row #all-rg{text-align:left;margin-top:2px} .map-button{background:linear-gradient(135deg,#FF9A3C,#C4451A);color:#fff} .map-button::before{background:radial-gradient(circle at 80% 20%,rgba(255,255,255,.22),transparent 45%)} .map-button .mb-go{color:#fff;text-decoration:underline;text-underline-offset:4px} .map-button .mb-k,.map-button .mb-sub{opacity:.9} .map-button .mb-art b{border-color:rgba(255,255,255,.55)} .colhead > div{border-top-color:var(--accent)} .wv .wv-pic img{filter:none !important} .dep{background:var(--board);color:var(--board-ink)} .dep .dhead{border-bottom-color:var(--board-rule)} .dep .grey,.dep .dhead .grey{color:var(--board-dim)} .bar .theme{width:44px;height:44px;display:inline-grid;place-items:center;border-radius:50%} .tabs,.pmap-n,.mt-cities small,.pmap-ui .cities small,.pmap-ui .routes small,.mb-kinds,.radar li,.tabs button span,.pmap-rcard .stops li b,.pmap-marks .pm.cl,.mt-h b,.dep table{font-variant-numeric:tabular-nums} @media (max-width:420px){ .single h1,h1.story,.single .h1{font-size:36px;line-height:1.08} .note-body p,.single .summary,.single p:not(.meta):not(.grey){font-size:19.5px;line-height:1.5} .note-body a{font-size:inherit} } .pmap-card h3,.pmap-rcard h3,.mt-card b,.plist .pl .t b{font-variant-ligatures:common-ligatures} :root{--r:18px;--r-sm:12px} .layout-bands.pics #latest .post.row{border:1px solid var(--rule-soft);border-radius:var(--r);overflow:hidden;background:var(--bg);padding:0 0 14px;transition:transform .2s var(--ease),box-shadow .2s} .layout-bands.pics #latest .post.row:hover{transform:translateY(-3px);box-shadow:0 16px 40px rgba(20,10,0,.14)} .layout-bands.pics #latest .post.row .pic{margin:0 0 10px;border-radius:0} .layout-bands.pics #latest .post.row h2,.layout-bands.pics #latest .post.row .meta{padding:0 14px} .layout-bands.pics #latest .post.row .pic.noimg{min-height:120px} .layout-bands.pics #front .first .pic,.layout-bands.pics #front .fmini .pic,.layout-bands.pics #front .fmini img,.layout-bands.pics #front .ftwo .pic{border-radius:var(--r-sm);overflow:hidden} .layout-bands.pics #front .fmini a{border:1px solid var(--rule-soft);border-radius:var(--r-sm);overflow:hidden;background:var(--bg);padding:0 0 10px;transition:transform .2s var(--ease),box-shadow .2s} .layout-bands.pics #front .fmini a:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(20,10,0,.12)} .layout-bands.pics #front .fmini a b,.layout-bands.pics #front .fmini a span{padding:0 10px} .layout-bands.pics #front .fmini img{border-radius:0;margin-bottom:8px} .thumb{border:1px solid var(--rule-soft);border-radius:var(--r);overflow:hidden;background:var(--bg);padding:0 0 14px;border-top:1px solid var(--rule-soft);transition:transform .2s var(--ease),box-shadow .2s} .thumb:hover{transform:translateY(-3px);box-shadow:0 16px 40px rgba(20,10,0,.14)} .thumb .pic{margin:0 0 10px} .thumb h2,.thumb .grey{padding:0 14px} .thumb h2{margin-top:0} .wv{border:1px solid var(--rule-soft);border-radius:var(--r);overflow:hidden;background:var(--bg);padding:0 0 14px;transition:transform .2s var(--ease),box-shadow .2s} .wv:hover{transform:translateY(-3px);box-shadow:0 16px 40px rgba(20,10,0,.14)} .wv .wv-pic{border-radius:0} .wv > :not(.wv-pic){padding-left:14px;padding-right:14px} .note-list a{border:1px solid var(--rule-soft);border-radius:var(--r);padding:18px 20px;margin-bottom:14px;background:var(--bg);transition:transform .2s var(--ease),box-shadow .2s} .note-list a:first-child{border-top:1px solid var(--rule-soft);padding-top:18px} .note-list a:hover{transform:translateY(-3px);box-shadow:0 16px 40px rgba(20,10,0,.14)} .note-list .pic{border-radius:var(--r-sm)} .layout-bands .tile{border-radius:var(--r-sm);margin:8px 6px;border-left:0;background:rgba(255,255,255,.05)} .layout-bands .tile:hover{background:rgba(255,255,255,.1)} .layout-bands .tiles{border-top:0;padding:6px} .vhero .pic,.vhero iframe{border-radius:var(--r-sm)} .vh-row .pic{border-radius:8px} .single .hero,.single .hero img,.place-page .hero img{border-radius:var(--r)} .single .hero{margin:0 0 24px} .pmap-card,.pmap-sheet,.pmap-story .ps-panel .hero img{border-radius:var(--r)} .strip .s,.strip a.s{border:1px solid var(--rule-soft);border-radius:var(--r-sm);background:var(--bg)} input[type=email],input[type=search],input[type=text]{border-radius:var(--r-sm)}
.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}}